.auth-app { display:grid; grid-template-columns:minmax(420px,55%) 1fr; min-height:100vh; }
.auth-aside { position:relative; overflow:hidden; display:grid; grid-template-rows:auto auto auto 1fr; gap:var(--space-6); padding:36px clamp(36px,6vw,96px); background:linear-gradient(145deg,var(--surface) 0%,var(--bg) 60%,var(--accent-soft) 100%); border-right:1px solid var(--line); }
.auth-aside::after { content:""; position:absolute; width:420px; height:420px; right:-170px; bottom:-200px; border-radius:50%; background:rgb(234 162 119 / 15%); filter:blur(12px); }
.auth-aside .app-sidebar__brand { width:max-content; padding:0; background:transparent; box-shadow:none; }
.auth-aside__copy { max-width:540px; padding-top:clamp(18px,4vh,76px); }
.auth-aside__copy h1 { font:700 clamp(46px,5.2vw,76px)/.98 Syne,Inter,sans-serif; letter-spacing:-.075em; }
.auth-aside__copy > p:last-child { max-width:470px; margin-top:var(--space-4); color:var(--muted); font-size:17px; }
.auth-benefits { display:grid; gap:18px; width:min(100%,430px); position:relative; z-index:1; }
.auth-benefit { display:grid; grid-template-columns:54px 1fr; align-items:center; gap:14px; }
.auth-benefit > span { display:grid; place-items:center; width:54px; height:54px; border-radius:16px; font-size:20px; font-weight:800; }
.auth-benefit strong,.auth-benefit p { display:block; } .auth-benefit strong { font-size:15px; } .auth-benefit p { margin-top:2px; color:var(--muted); font-size:13px; }
.auth-benefit--violet > span { color:var(--accent-plum); background:color-mix(in srgb,var(--accent-plum) 15%,var(--surface)); }.auth-benefit--green > span { color:var(--success); background:color-mix(in srgb,var(--success) 15%,var(--surface)); }.auth-benefit--orange > span { color:var(--warn); background:var(--accent-soft); }
.auth-product-preview { position:absolute; z-index:0; width:530px; height:365px; right:-120px; bottom:64px; display:grid; grid-template-columns:145px 1fr; padding:18px; gap:16px; border:1px solid var(--line); border-radius:26px; background:color-mix(in srgb,var(--surface) 90%,transparent); box-shadow:0 25px 70px rgb(52 42 35 / 12%); transform:rotate(-8deg); backdrop-filter:blur(7px); }
.auth-product-preview__sidebar { display:grid; align-content:start; gap:16px; color:var(--muted); font-size:12px; }.auth-product-preview__sidebar img { width:34px; margin-bottom:12px; }.auth-product-preview__sidebar span { padding:8px 10px; border-radius:8px; }.auth-product-preview__sidebar .is-active { color:var(--ink); background:var(--surface-soft); font-weight:700; }
.auth-product-preview__content { display:grid; align-content:start; gap:13px; }.auth-product-preview__content > strong { font-size:14px; }.auth-product-preview__search { padding:10px; border:1px solid var(--line); border-radius:10px; color:var(--muted); font-size:11px; }.auth-product-preview__item { display:flex; align-items:center; gap:10px; padding:10px; border-radius:10px; background:var(--surface); box-shadow:0 4px 10px rgb(32 25 18 / 4%); }.auth-product-preview__item i { width:26px; height:26px; border-radius:7px; background:color-mix(in srgb,var(--accent-plum) 20%,var(--surface)); }.auth-product-preview__item:nth-child(4) i { background:color-mix(in srgb,var(--success) 20%,var(--surface)); }.auth-product-preview__item b,.auth-product-preview__item small { display:block; }.auth-product-preview__item b { font-size:11px; }.auth-product-preview__item small { margin-top:2px; font-size:9px; color:var(--muted); }
.auth-aside__footer { position:relative; z-index:1; display:flex; align-items:center; gap:var(--space-3); color:var(--muted); font-size:13px; align-self:end; }
.auth-main { display:grid; grid-template-rows:auto 1fr; min-width:0; padding:36px clamp(28px,5vw,80px); background:var(--surface); }
.auth-topbar { display:flex; align-items:center; justify-content:flex-end; gap:12px; color:var(--muted); font-size:13px; }.auth-topbar .theme-toggle { margin-left:12px; }.auth-topbar__link { padding:9px 16px; border:1px solid var(--line-strong); border-radius:99px; color:var(--ink); font-weight:600; }.auth-topbar__link:hover { background:var(--surface-soft); }
.auth-card { width:min(100%,530px); margin:auto; padding:clamp(28px,4vw,48px); border:1px solid var(--line); border-radius:26px; background:var(--surface); box-shadow:0 18px 52px rgb(30 24 18 / 8%); display:grid; gap:var(--space-6); }
.auth-card__brand { display:grid; justify-items:center; gap:9px; }.auth-card__brand img { width:54px; border-radius:15px; }.auth-card__brand strong { font:700 20px/1 Syne,Inter,sans-serif; letter-spacing:-.05em; }
.auth-card__heading { text-align:center; }.auth-card__heading .app-topbar__eyebrow { display:none; }.auth-card__heading h2 { font:700 clamp(32px,3vw,42px)/1.05 Syne,Inter,sans-serif; letter-spacing:-.07em; }.auth-card__heading > p:last-child { margin-top:var(--space-3); color:var(--muted); font-size:16px; }
.auth-input { display:flex; align-items:center; gap:10px; min-height:52px; padding:0 14px; border:1px solid var(--line-strong); border-radius:14px; background:var(--surface-soft); }.auth-input:focus-within { border-color:var(--accent-plum); outline:2px solid color-mix(in srgb,var(--accent-plum) 18%,transparent); }.auth-input > span { color:var(--muted); }.auth-input input { min-height:50px; padding:0; border:0; border-radius:0; background:transparent; outline:0; }.auth-label-row { display:flex; justify-content:space-between; }.auth-label-row button { padding:0; border:0; background:transparent; color:var(--ink); text-decoration:underline; text-underline-offset:3px; font-size:13px; }.password-toggle { padding:0; border:0; background:transparent; color:var(--muted); font-size:16px; }
.auth-submit { width:100%; justify-content:center; min-height:52px; border-radius:14px; font-size:15px; }.auth-submit span { font-size:19px; line-height:0; }.auth-divider { margin:2px 0; }.google-button { min-height:50px; border-radius:14px; background:var(--surface); }
.auth-card__links { display:flex; gap:7px; flex-wrap:wrap; justify-content:center; color:var(--muted); font-size:13px; }.auth-card__links a,.auth-card__links button { padding:0; border:0; background:transparent; color:inherit; text-decoration:underline; text-underline-offset:3px; }.auth-card__links button { margin-left:8px; }
#auth-message { --message-accent:var(--success); padding:16px 18px; border:1px solid color-mix(in srgb,var(--message-accent) 40%,var(--line)); border-left:4px solid var(--message-accent); border-radius:12px; background:color-mix(in srgb,var(--message-accent) 10%,var(--surface)); color:var(--ink); font-size:14px; line-height:1.6; overflow-wrap:anywhere; }
#auth-message[data-state="error"] { --message-accent:var(--danger); }
#auth-message[data-state="info"] { --message-accent:var(--accent-plum); }
#auth-message strong { display:block; margin-bottom:4px; font-size:15px; }
@media (max-width:1060px) { .auth-app { grid-template-columns:minmax(370px,48%) 1fr; }.auth-aside { padding-inline:40px; }.auth-product-preview { transform:scale(.75) rotate(-8deg); transform-origin:bottom right; } }
@media (max-width:760px) { .auth-app { grid-template-columns:1fr; } .auth-aside { display:none; } .auth-main { min-height:100vh; padding:20px; } .auth-topbar { justify-content:flex-end; } .auth-topbar .theme-toggle { margin-left:0; } .auth-card { padding:28px 22px; } .auth-topbar__link { padding:8px 12px; } }