:root { --navy-950:#071b2b; --navy-900:#0b2538; --ink:#173042; --ink-soft:#405a69; --muted:#71838e; --line:#dfe8ec; --paper:#f4f7f8; --mint:#20bd91; --mint-dark:#0d9270; --mint-soft:#e8f8f3; --red:#b53f4c; --red-soft:#fdecef; }
* { box-sizing: border-box; }
[hidden] { display: none !important; }
html { color-scheme: light; }
body { margin:0; min-width:320px; color:var(--ink); background:var(--paper); font:14px/1.5 Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; -webkit-font-smoothing:antialiased; }
button,input { font:inherit; }
button { cursor:pointer; }
a { color:var(--mint-dark); font-weight:750; text-decoration:none; }
a:hover { text-decoration:underline; }
.auth-shell { min-height:100vh; display:grid; grid-template-columns:minmax(410px,.92fr) minmax(470px,1.08fr); }
.auth-intro { position:relative; overflow:hidden; display:flex; flex-direction:column; padding:clamp(32px,5vw,72px); color:#fff; background:radial-gradient(circle at 20% 0,rgb(32 189 145 / 22%),transparent 31%),radial-gradient(circle at 93% 82%,rgb(32 189 145 / 18%),transparent 31%),linear-gradient(145deg,#0b2538,#071b2b 72%); }
.auth-intro::before,.auth-intro::after { content:""; position:absolute; border:1px solid rgb(255 255 255 / 7%); border-radius:50%; pointer-events:none; }
.auth-intro::before { width:360px; height:360px; right:-190px; top:18%; }
.auth-intro::after { width:520px; height:520px; left:-360px; bottom:-340px; }
.auth-brand { z-index:1; display:inline-flex; align-items:center; align-self:flex-start; gap:13px; color:#fff; text-decoration:none; }
.auth-brand:hover { text-decoration:none; }
.auth-brand span { width:48px; height:48px; display:grid; place-items:center; border-radius:15px; background:linear-gradient(145deg,#38d5a7,#12a47d); box-shadow:0 12px 30px rgb(32 189 145 / 25%); font-size:26px; font-weight:850; }
.auth-brand strong { font-size:19px; letter-spacing:-.02em; }
.intro-copy { z-index:1; max-width:640px; margin:auto 0; padding:70px 0; }
.kicker { display:flex; align-items:center; gap:8px; margin:0 0 18px; color:#90cdbd; font-size:11px; font-weight:850; letter-spacing:.13em; text-transform:uppercase; }
.kicker i { width:8px; height:8px; border-radius:50%; background:var(--mint); box-shadow:0 0 0 6px rgb(32 189 145 / 10%); }
.intro-copy h1 { max-width:670px; margin:0; font-size:clamp(37px,4.8vw,66px); line-height:1.06; letter-spacing:-.052em; }
.intro-copy > p:last-child { max-width:550px; margin:24px 0 0; color:#a8bfca; font-size:clamp(14px,1.3vw,18px); line-height:1.7; }
.security-note { z-index:1; display:flex; align-items:center; gap:13px; max-width:470px; padding-top:22px; border-top:1px solid rgb(255 255 255 / 8%); }
.security-note svg { width:28px; flex:0 0 auto; fill:var(--mint); }
.security-note strong,.security-note span { display:block; }
.security-note strong { font-size:12px; }
.security-note span { margin-top:2px; color:#7899a8; font-size:10px; }
.auth-content { display:grid; align-content:center; justify-items:center; padding:40px clamp(24px,6vw,100px); background:radial-gradient(circle at 100% 0,#e6f5f0,transparent 32%),var(--paper); }
.auth-card { width:min(470px,100%); padding:clamp(30px,4vw,46px); border:1px solid var(--line); border-radius:24px; background:rgb(255 255 255 / 96%); box-shadow:0 25px 70px rgb(18 54 75 / 11%); }
.eyebrow { margin:0 0 7px; color:var(--mint-dark); font-size:9px; font-weight:850; letter-spacing:.16em; }
.auth-card h1 { margin:0; font-size:clamp(27px,3vw,35px); line-height:1.18; letter-spacing:-.04em; }
.lead { margin:11px 0 28px; color:var(--muted); font-size:12px; line-height:1.65; }
.auth-form { display:grid; gap:18px; }
.auth-form label { display:grid; gap:7px; color:var(--ink-soft); font-size:11px; font-weight:780; }
.auth-form input { width:100%; min-height:50px; padding:12px 14px; border:1px solid #cbd9df; border-radius:12px; outline:none; color:var(--ink); background:#fff; transition:border-color .17s,box-shadow .17s; }
.auth-form input::placeholder { color:#9aa9b1; }
.auth-form input:focus { border-color:var(--mint-dark); box-shadow:0 0 0 4px rgb(13 146 112 / 10%); }
.password-field { position:relative; display:block; }
.password-field input { padding-right:77px; }
.password-field button { position:absolute; right:7px; top:50%; padding:7px 8px; border:0; border-radius:8px; color:var(--mint-dark); background:transparent; transform:translateY(-50%); font-size:9px; font-weight:800; }
.password-field button:hover { background:var(--mint-soft); }
.auth-links { display:flex; justify-content:flex-end; margin-top:-5px; font-size:10px; }
.submit-button,.auth-form > .primary { min-height:50px; display:flex; align-items:center; justify-content:center; gap:9px; border:1px solid var(--mint-dark); border-radius:12px; color:#fff; background:var(--mint-dark); box-shadow:0 10px 24px rgb(13 146 112 / 20%); font-weight:800; transition:background .17s,transform .17s,box-shadow .17s; }
.submit-button:hover,.auth-form > .primary:hover { background:#087b5e; transform:translateY(-1px); box-shadow:0 13px 28px rgb(13 146 112 / 25%); }
.auth-form button:disabled,.auth-form input:disabled { cursor:not-allowed; opacity:.65; transform:none; }
.auth-form > button:not(.primary):not(.submit-button) { min-height:44px; border:1px solid #ccd9de; border-radius:11px; color:var(--ink); background:#fff; font-weight:750; }
.auth-message { margin:-4px 0; padding:10px 12px; border-radius:10px; font-size:10px; }
.auth-message.error { color:var(--red); background:var(--red-soft); }
.auth-message.success { color:#1d6856; background:var(--mint-soft); }
.field-help { margin:-8px 0 0; color:var(--muted); font-size:9px; }
.auth-alt,.privacy-copy { color:var(--muted); text-align:center; font-size:10px; }
.auth-alt { margin:24px 0 0; }
.privacy-copy { max-width:470px; margin:18px 0 0; }
.auth-notice { display:block; margin-top:20px; padding:15px; border:1px solid #cbe9df; border-radius:13px; color:#1d6856; background:var(--mint-soft); }
.auth-notice h2 { margin:0 0 4px; font-size:13px; }
.auth-notice p { margin:3px 0; font-size:10px; }
.dev-link { display:inline-block; margin-top:7px; font-size:10px; }

@media(max-width:900px){.auth-shell{grid-template-columns:1fr}.auth-intro{min-height:300px;padding:30px}.intro-copy{padding:50px 0 35px}.intro-copy h1{max-width:680px;font-size:clamp(34px,8vw,54px)}.security-note{display:none}.auth-content{min-height:630px;padding:35px 20px}}
@media(max-width:520px){.auth-intro{min-height:245px;padding:23px}.auth-brand span{width:41px;height:41px}.intro-copy{padding:36px 0 8px}.intro-copy h1{font-size:34px}.intro-copy>p:last-child{display:none}.auth-content{align-content:start;min-height:calc(100vh - 245px);padding:22px 14px 35px}.auth-card{padding:27px 21px;border-radius:19px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}}