.auth-home{display:none!important}

.auth-close{position:absolute;z-index:10;top:18px;right:18px;display:grid;place-items:center;width:40px;height:40px;padding:0;border:1px solid rgba(255,255,255,.1);border-radius:13px;background:rgba(12,12,17,.68);color:#8d8993;box-shadow:0 10px 30px rgba(0,0,0,.22);backdrop-filter:blur(14px);cursor:pointer;transition:color .2s,border-color .2s,background .2s,transform .2s}
.auth-close .icon{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}
.auth-close:hover{color:#fff;border-color:rgba(255,255,255,.2);background:rgba(255,255,255,.08);transform:rotate(4deg)}
.auth-close:focus-visible{outline:2px solid rgba(255,116,92,.7);outline-offset:3px}
.auth-brand.auth-brand-image{display:block;width:min(230px,48%);height:auto}
.auth-brand.auth-brand-image>img{display:block;width:100%;height:auto;max-height:48px;object-fit:contain;object-position:left center}

.auth-story{justify-content:flex-start}
.auth-story-copy{position:absolute;top:100px;left:42px;right:42px;margin:0;transform:none}
.auth-story-foot{display:none!important}
.auth-story-foot>span{position:relative;display:flex;min-width:0;min-height:108px;flex-direction:column;align-items:flex-start;justify-content:flex-end;padding:16px;border:1px solid rgba(255,255,255,.085);border-radius:17px;background:linear-gradient(145deg,rgba(255,255,255,.075),rgba(255,255,255,.022));color:#fff;overflow:hidden;box-shadow:inset 0 1px rgba(255,255,255,.04);transition:transform .22s,border-color .22s,background .22s}
.auth-story-foot>span:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 15% 5%,rgba(255,117,92,.13),transparent 46%);opacity:0;transition:opacity .22s}
.auth-story-foot>span:after{content:"";position:absolute;right:-30px;top:-35px;width:82px;height:82px;border:1px solid rgba(255,255,255,.055);border-radius:50%}
.auth-story-foot>span:hover{transform:translateY(-4px);border-color:rgba(255,128,106,.25);background:linear-gradient(145deg,rgba(255,255,255,.09),rgba(255,255,255,.025))}
.auth-story-foot>span:hover:before{opacity:1}
.auth-story-foot>span>i{position:relative;z-index:1;display:grid;place-items:center;width:32px;height:32px;margin:0 0 15px;border:1px solid rgba(255,128,106,.17);border-radius:10px;background:rgba(255,116,92,.11);color:#ff8974;font-style:normal}
.auth-story-foot .icon{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round}
.auth-story-foot>span>b{position:relative;z-index:1;display:grid;min-width:0;gap:5px;font-weight:normal}
.auth-story-foot strong{color:#f0edf1;font:750 10px/1.2 Manrope;letter-spacing:-.015em}
.auth-story-foot em{color:#77717b;font:500 7px/1.45 Manrope;font-style:normal}

.auth-poster-showcase{position:absolute;z-index:3;inset:315px 36px 32px;display:flex;flex-direction:column;justify-content:flex-start}
.auth-poster-showcase>header{display:flex;align-items:center;gap:13px;margin-bottom:19px;color:#aaa5ae;font-family:var(--font-body);font-size:9px;font-weight:650;letter-spacing:.1em}
.auth-poster-showcase>header i{height:1px;flex:1;background:linear-gradient(90deg,rgba(255,255,255,.17),transparent)}
.auth-poster-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));align-items:center;gap:10px}
.auth-poster-grid>a{position:relative;aspect-ratio:2/3;overflow:hidden;border:1px solid rgba(255,255,255,.1);border-radius:16px;background:#17131a;box-shadow:0 20px 45px rgba(0,0,0,.32);transition:transform .25s,border-color .25s,box-shadow .25s}
.auth-poster-grid>a:nth-child(even){transform:translateY(17px)}
.auth-poster-grid>a:hover{z-index:2;transform:translateY(-7px) scale(1.035);border-color:rgba(255,128,106,.42);box-shadow:0 28px 60px rgba(0,0,0,.48)}
.auth-poster-grid>a:nth-child(even):hover{transform:translateY(10px) scale(1.035)}
.auth-poster-grid>a>img{width:100%;height:100%;object-fit:cover;transition:transform .4s,filter .3s}
.auth-poster-grid>a:hover>img{transform:scale(1.045)}
.auth-poster-grid>a:after{content:"";position:absolute;inset:35% 0 0;background:linear-gradient(transparent,rgba(6,6,9,.94))}
.auth-poster-grid>a>span{position:absolute;z-index:2;left:12px;right:10px;bottom:12px;display:grid;gap:5px}
.auth-poster-grid>a small{color:#ff826d;font-family:var(--font-body);font-size:8px;font-weight:700}
.auth-poster-grid>a b{display:-webkit-box;overflow:hidden;color:#f4f1f5;font-family:var(--font-display);font-size:10px;font-weight:600;line-height:1.25;-webkit-box-orient:vertical;-webkit-line-clamp:2}
.auth-poster-grid>a:only-child{grid-column:2/4}
.auth-submit>i .icon{display:block;width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.auth-submit>span{font-size:12px;font-weight:850;line-height:1;letter-spacing:.025em;text-shadow:0 1px 2px rgba(0,0,0,.65)}
.auth-switch-v2 a{display:inline-flex;align-items:center;gap:6px}.auth-switch-v2 a i{display:grid;place-items:center;margin:0}.auth-switch-v2 a .icon{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}

@media(max-width:840px){
  .auth-close{position:fixed;top:16px;right:16px}
  .auth-brand{margin-left:0}
  .auth-brand.auth-brand-image{width:min(220px,58%)}
  .auth-story{min-height:570px}
  .auth-story-copy{top:90px;left:22px;right:22px;margin:0}
  .auth-story-foot{display:none!important}
  .auth-story-foot>span{min-height:98px;padding:13px}
  .auth-story-foot>span>i{margin-bottom:11px}
  .auth-poster-showcase{inset:295px 22px 25px}
  .auth-poster-showcase>header{margin-bottom:12px}
  .auth-poster-grid{gap:8px}
  .auth-poster-grid>a{border-radius:12px}
  .auth-poster-grid>a>span{left:9px;bottom:9px}
}

@media(max-width:560px){
  .auth-story{min-height:535px}
  .auth-story-foot{gap:7px}
  .auth-story-foot>span{min-height:91px;padding:11px;border-radius:14px}
  .auth-story-foot>span>i{width:28px;height:28px;margin-bottom:9px}
  .auth-story-foot strong{font-size:8px}
  .auth-story-foot em{display:none}
}

/* Theme-aware authentication accents */
.auth-story-copy h1 em{color:var(--accent-2)}
.auth-poster-grid>a small{color:var(--accent-2)}
.auth-poster-grid>a:hover{border-color:color-mix(in srgb,var(--accent-2) 44%,transparent)}
.auth-submit{background:linear-gradient(135deg,var(--accent-2),var(--accent));box-shadow:0 16px 34px color-mix(in srgb,var(--accent) 24%,transparent)}
.auth-submit:hover{box-shadow:0 20px 42px color-mix(in srgb,var(--accent) 32%,transparent)}
