body.signed-out .login-shell{display:block;position:relative;min-height:100vh;padding:0;overflow:hidden;background:#070809;color:#f6f3ef}
body.signed-out .login-shell{font-family:Inter,"Noto Sans SC","Microsoft YaHei",sans-serif;color:#f6f3ef;background:#070809;color-scheme:dark}
body.signed-out .login-shell,body.signed-out .login-shell *{box-sizing:border-box}
body.signed-out .login-shell{margin:0;min-height:100vh;background:#070809}
body.signed-out .login-shell .backdrop{position:fixed;inset:0;z-index:0;background:linear-gradient(90deg,#060708b3 0%,#0506077a 50%,#05060789 100%),url('login-assets/studio-background.webp') center center/cover no-repeat}
body.signed-out .login-shell .page{position:relative;z-index:1;width:100%;max-width:2400px;margin:0 auto;min-height:100vh;padding:0 clamp(22px,2.8vw,92px) clamp(24px,2vw,55px)}
body.signed-out .login-shell .topbar{height:clamp(68px,5.5vw,96px);display:flex;align-items:center;justify-content:space-between}
body.signed-out .login-shell .brand,body.signed-out .login-shell .auth-brand{display:flex;align-items:center;gap:10px;font-style:italic;font-weight:900;letter-spacing:-.04em}
body.signed-out .login-shell .brand{font-size:clamp(23px,1.65vw,32px)}
body.signed-out .login-shell .brand img{height:clamp(39px,2.6vw,52px);width:clamp(39px,2.6vw,52px);object-fit:cover;border-radius:5px}
body.signed-out .login-shell .topnote{font-size:clamp(11px,.9vw,16px);color:#d2d0cf;display:flex;gap:16px;align-items:center}
body.signed-out .login-shell .topnote span{height:15px;width:1px;background:#8d8580}
body.signed-out .login-shell .main{display:grid;grid-template-columns:minmax(0,1fr) minmax(380px,28%);gap:clamp(22px,2.2vw,64px);align-items:start}
body.signed-out .login-shell .showcase{min-width:0}
body.signed-out .login-shell .intro{padding:clamp(16px,2vw,40px) 0 clamp(23px,2vw,38px)}
body.signed-out .login-shell .eyebrow{color:#f47740;letter-spacing:.16em;font-size:clamp(11px,.85vw,16px);font-weight:750;margin:0 0 clamp(12px,1vw,20px)}
body.signed-out .login-shell h1{font-size:clamp(56px,5vw,108px);line-height:1.08;letter-spacing:-.07em;margin:0;font-weight:900;white-space:nowrap}
body.signed-out .login-shell h1 span{color:#f36b3e}
body.signed-out .login-shell .subhead{font-size:clamp(15px,1.28vw,25px);line-height:1.55;margin:clamp(10px,.8vw,18px) 0 0;color:#ece7e3}
body.signed-out .login-shell .features{display:flex;align-items:center;gap:0;margin-top:clamp(24px,2vw,42px)}
body.signed-out .login-shell .feature{display:flex;gap:clamp(6px,.6vw,12px);align-items:center;padding-right:clamp(13px,1.3vw,26px);margin-right:clamp(12px,1.2vw,25px);border-right:1px solid #8b817aaa;white-space:nowrap;font-size:clamp(12px,1vw,20px);font-weight:600}
body.signed-out .login-shell .feature:last-child{border-right:0}
body.signed-out .login-shell .feature svg{height:clamp(22px,1.8vw,35px);width:clamp(22px,1.8vw,35px);fill:none;stroke:#f3703e;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
body.signed-out .login-shell .feature:nth-child(even) svg{stroke:#12c4c9}
body.signed-out .login-shell .gallery{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(10px,.8vw,17px)}
body.signed-out .login-shell .card{margin:0;min-width:0;overflow:hidden;background:#15181be8;border:1px solid #404347;border-radius:clamp(5px,.45vw,9px);box-shadow:0 14px 30px #0005}
body.signed-out .login-shell .card img{display:block;width:100%;aspect-ratio:1.52;object-fit:cover;object-position:center}
body.signed-out .login-shell .card figcaption{padding:clamp(8px,.7vw,14px) clamp(10px,.8vw,17px) clamp(9px,.9vw,16px);min-height:clamp(50px,4.2vw,80px);display:flex;flex-direction:column;gap:5px}
body.signed-out .login-shell .card strong{font-size:clamp(13px,1.1vw,21px)}
body.signed-out .login-shell .card small{font-size:clamp(10px,.82vw,16px);color:#b9b9b9}
body.signed-out .login-shell .visual-note{font-size:clamp(10px,.76vw,13px);color:#b2b1ae;margin:14px 0 0}
body.signed-out .login-shell .auth-wrap{padding-top:clamp(14px,1.3vw,29px)}
body.signed-out .login-shell .auth-card{padding:clamp(27px,3.1vw,65px) clamp(24px,3vw,62px) clamp(27px,3vw,58px);border:1px solid #434a50;border-radius:clamp(12px,1.1vw,20px);background:linear-gradient(165deg,#0d171bdc,#0c1115ed 70%);box-shadow:0 28px 90px #000b,0 2px 8px #0008;backdrop-filter:blur(16px);min-height:min(78vh,900px)}
body.signed-out .login-shell .auth-brand{justify-content:center;font-size:clamp(24px,2.1vw,41px)}
body.signed-out .login-shell .auth-brand img{height:clamp(46px,3.4vw,68px);width:clamp(46px,3.4vw,68px);object-fit:cover;border-radius:6px}
body.signed-out .login-shell .auth-tagline{text-align:center;color:#c1c1c1;font-size:clamp(12px,1vw,19px);margin:9px 0 clamp(40px,4.5vw,85px)}
body.signed-out .login-shell .auth-card h2{font-size:clamp(32px,3.2vw,61px);margin:0 0 7px;letter-spacing:-.045em}
body.signed-out .login-shell .auth-description{color:#b9bbbd;font-size:clamp(13px,1.1vw,21px);margin:0 0 clamp(25px,2.4vw,47px)}
body.signed-out .login-shell .auth-card label{display:block;font-size:clamp(13px,1vw,18px);color:#dadcdd;margin:0 0 9px}
body.signed-out .login-shell .input-wrap{display:flex;align-items:center;gap:12px;border:1px solid #48525b;background:#151d22bb;border-radius:clamp(6px,.5vw,10px);height:clamp(52px,4.1vw,77px);padding:0 clamp(12px,1vw,21px);margin-bottom:clamp(16px,1.4vw,29px)}
body.signed-out .login-shell .input-wrap:focus-within{border-color:#ec744a;box-shadow:0 0 0 3px #ec744a30}
body.signed-out .login-shell .input-wrap svg{width:clamp(20px,1.5vw,29px);height:clamp(20px,1.5vw,29px);flex:none;stroke:#bdc3c5;stroke-width:1.7;fill:none;stroke-linecap:round;stroke-linejoin:round}
body.signed-out .login-shell .input-wrap input{min-width:0;width:100%;height:100%;border:0;background:transparent;color:white;outline:none;font:inherit;font-size:clamp(14px,1vw,20px)}
body.signed-out .login-shell .input-wrap input::placeholder{color:#969fa2}
body.signed-out .login-shell .input-wrap button{border:0;background:none;color:#b3bfc2;cursor:pointer;font-size:clamp(12px,.9vw,17px);white-space:nowrap}
body.signed-out .login-shell .error{color:#ffab93;font-size:clamp(11px,.8vw,14px);min-height:clamp(20px,1.6vw,30px);margin:-9px 0 4px}
body.signed-out .login-shell .login-btn{width:100%;height:clamp(55px,4.3vw,82px);border:0;border-radius:clamp(6px,.5vw,10px);background:#fa683a;color:#101010;font-size:clamp(16px,1.25vw,24px);font-weight:800;cursor:pointer}
body.signed-out .login-shell .login-btn:hover{background:#ff8359}
body.signed-out .login-shell .auth-bottom{display:flex;gap:13px;align-items:center;justify-content:center;margin-top:clamp(24px,2.5vw,50px)}
body.signed-out .login-shell .auth-bottom span{height:1px;width:18%;background:#525557}
body.signed-out .login-shell .auth-bottom p{font-size:clamp(11px,.88vw,17px);color:#bcc0c1;margin:0;text-align:center;white-space:nowrap}
@media(max-width:1300px){body.signed-out .login-shell .main{grid-template-columns:minmax(0,1fr) minmax(340px,29%)}
body.signed-out .login-shell h1{font-size:clamp(48px,5vw,70px)}
body.signed-out .login-shell .subhead{font-size:15px}
body.signed-out .login-shell .feature{font-size:12px}
body.signed-out .login-shell .card img{aspect-ratio:1.48}
body.signed-out .login-shell .auth-card{min-height:0}}
@media(max-width:950px){body.signed-out .login-shell .main{display:flex;flex-direction:column}
body.signed-out .login-shell .showcase,body.signed-out .login-shell .auth-wrap{width:100%}
body.signed-out .login-shell .auth-wrap{padding-top:10px}
body.signed-out .login-shell .auth-card{max-width:580px;margin:0 auto}
body.signed-out .login-shell .page{padding:0 20px 35px}
body.signed-out .login-shell .gallery{grid-template-columns:repeat(4,minmax(0,1fr))}
body.signed-out .login-shell .features{flex-wrap:wrap;gap:12px}}
@media(max-width:630px){body.signed-out .login-shell .topnote{display:none}
body.signed-out .login-shell .topbar{height:70px}
body.signed-out .login-shell .intro{padding-top:14px}
body.signed-out .login-shell h1{font-size:clamp(38px,9.5vw,58px);white-space:normal}
body.signed-out .login-shell .subhead{font-size:13px}
body.signed-out .login-shell .features{display:grid;grid-template-columns:repeat(2,max-content);gap:13px 6px;margin:22px 0 25px}
body.signed-out .login-shell .feature{padding-right:15px;margin-right:0;font-size:12px}
body.signed-out .login-shell .feature:nth-child(2){border-right:0}
body.signed-out .login-shell .feature svg{height:23px;width:23px}
body.signed-out .login-shell .gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
body.signed-out .login-shell .card img{aspect-ratio:1.18}
body.signed-out .login-shell .card figcaption{min-height:57px;padding:8px}
body.signed-out .login-shell .card strong{font-size:13px}
body.signed-out .login-shell .card small{font-size:10px}
body.signed-out .login-shell .auth-card{padding:31px 23px 36px}
body.signed-out .login-shell .auth-tagline{margin-bottom:43px}
body.signed-out .login-shell .auth-card h2{font-size:34px}
body.signed-out .login-shell .auth-description{font-size:13px}
body.signed-out .login-shell .input-wrap{height:54px}
body.signed-out .login-shell .login-btn{height:56px}
body.signed-out .login-shell .auth-bottom p{white-space:normal}}
@media(min-width:1301px){body.signed-out .login-shell .main{grid-template-columns:minmax(0,1fr) clamp(400px,24vw,500px);gap:clamp(24px,1.8vw,46px)}
body.signed-out .login-shell .brand{font-size:clamp(38px,2.5vw,60px)}
body.signed-out .login-shell .brand img{width:clamp(60px,3.8vw,88px);height:clamp(60px,3.8vw,88px)}
body.signed-out .login-shell .auth-wrap{padding-top:16px}
body.signed-out .login-shell .auth-card{padding:32px 36px 30px;min-height:0;border-radius:16px}
body.signed-out .login-shell .auth-brand{font-size:29px}
body.signed-out .login-shell .auth-brand img{width:50px;height:50px}
body.signed-out .login-shell .auth-tagline{font-size:13px;margin:8px 0 40px}
body.signed-out .login-shell .auth-card h2{font-size:40px;margin-bottom:7px}
body.signed-out .login-shell .auth-description{font-size:14px;margin-bottom:26px}
body.signed-out .login-shell .auth-card label{font-size:13px;margin-bottom:7px}
body.signed-out .login-shell .input-wrap{height:54px;margin-bottom:15px;padding:0 15px}
body.signed-out .login-shell .input-wrap svg{width:22px;height:22px}
body.signed-out .login-shell .input-wrap input{font-size:14px}
body.signed-out .login-shell .input-wrap button{font-size:13px}
body.signed-out .login-shell .error{min-height:22px;font-size:12px;margin:-5px 0 3px}
body.signed-out .login-shell .login-btn{height:56px;font-size:18px}
body.signed-out .login-shell .auth-bottom{margin-top:25px}
body.signed-out .login-shell .auth-bottom p{font-size:12px}
body.signed-out .login-shell .card img{aspect-ratio:1.65}}
body.signed-out .login-shell .auth-visual{display:none}
@media(min-width:1301px){body.signed-out .login-shell .main{align-items:stretch}
body.signed-out .login-shell .brand{font-size:32px;gap:8px}
body.signed-out .login-shell .brand img{width:48px;height:48px}
body.signed-out .login-shell .auth-wrap{display:flex;flex-direction:column;gap:16px;padding-bottom:29px}
body.signed-out .login-shell .auth-visual{display:block;position:relative;flex:1;min-height:180px;overflow:hidden;border:1px solid #434a50;border-radius:14px;background:#15191a}
body.signed-out .login-shell .auth-visual img{display:block;width:100%;height:100%;object-fit:cover;object-position:center 57%;position:absolute;inset:0}
body.signed-out .login-shell .auth-visual::after{content:"";position:absolute;inset:28% 0 0;background:linear-gradient(transparent,#050708b8 78%)}
body.signed-out .login-shell .auth-visual-copy{position:absolute;z-index:1;left:24px;right:24px;bottom:22px;display:flex;flex-direction:column;gap:5px}
body.signed-out .login-shell .auth-visual-copy span{font-size:12px;color:#efad89;letter-spacing:.12em}
body.signed-out .login-shell .auth-visual-copy strong{font-size:19px;line-height:1.3;font-weight:700}}
/* Neutralize workspace rules that otherwise add padding to artwork cards and header. */
body.signed-out .login-shell .topbar{background:transparent;border:0;box-shadow:none;padding:0}
body.signed-out .login-shell .card{padding:0}
body.signed-out .login-shell .auth-card h2{line-height:1.2}
body.signed-out .login-shell .local-enter{display:block;width:100%;margin-top:10px;border:1px solid #48525b;border-radius:8px;background:#151d22;color:#d9d9d9;padding:10px;cursor:pointer}

/* Artwork responds to hover while captions and the login form stay still. */
@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
  body.signed-out .login-shell .gallery .card,
  body.signed-out .login-shell .auth-visual{transition:transform .45s ease,border-color .45s ease,box-shadow .45s ease}
  body.signed-out .login-shell .gallery .card img,
  body.signed-out .login-shell .auth-visual img{transform:scale(1);transform-origin:center;transition:transform .7s cubic-bezier(.2,.7,.2,1),filter .7s ease}
  body.signed-out .login-shell .gallery .card:hover,
  body.signed-out .login-shell .auth-visual:hover{transform:translateY(-3px);border-color:#746052;box-shadow:0 18px 36px #0009}
  body.signed-out .login-shell .gallery .card:hover img{transform:scale(1.085) translate3d(0,-4px,0);filter:saturate(1.07) brightness(1.04)}
  body.signed-out .login-shell .auth-visual:hover img{transform:scale(1.07) translate3d(0,-5px,0);filter:saturate(1.06) brightness(1.04)}
}
@media (prefers-reduced-motion:reduce){
  body.signed-out .login-shell .gallery .card,
  body.signed-out .login-shell .gallery .card img,
  body.signed-out .login-shell .auth-visual,
  body.signed-out .login-shell .auth-visual img{transition:none!important;animation:none!important;transform:none!important}
}