:root { color-scheme: dark; --bg:#0c1113; --panel:#12191c; --line:#303b3f; --text:#f1eee8; --muted:#a2adb0; --copper:#d08966; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; background:var(--bg); color:var(--text); }
* { box-sizing:border-box; }
body { margin:0; min-width:280px; }
a { color:inherit; text-decoration:none; }
button,input { font:inherit; }
button,a,input { -webkit-tap-highlight-color:transparent; }
button { cursor:pointer; }
a:focus-visible,button:focus-visible,input:focus-visible { outline:2px solid #e5b295; outline-offset:4px; }
[hidden] { display:none !important; }
.auth-header { min-height:86px; padding:18px clamp(20px,5vw,80px); display:flex; align-items:center; justify-content:space-between; gap:20px; border-bottom:1px solid var(--line); }
.auth-brand { display:flex; gap:16px; align-items:center; font-size:13px; font-weight:750; letter-spacing:.045em; }
.auth-mark { display:flex; align-items:center; gap:5px; position:relative; width:25px; height:28px; flex:0 0 25px; transform:skew(-18deg); }
.auth-mark i { width:4px; height:26px; background:var(--text); }
.auth-mark::after { position:absolute; right:0; bottom:1px; width:5px; height:5px; background:var(--copper); content:""; }
.auth-brand small { margin-left:10px; border-left:1px solid var(--line); padding-left:12px; color:var(--muted); font-size:10px; }
.auth-header nav,.auth-footer nav { display:flex; gap:28px; font-size:12px; color:var(--muted); }
.auth-header nav a,.auth-footer nav a { display:inline-flex; align-items:center; min-height:40px; }
a:hover { color:#edb397; }
.auth-layout { width:min(1120px,100%); min-height:calc(100svh - 164px); margin:auto; padding:64px 28px; display:grid; grid-template-columns:1fr 440px; align-items:center; gap:clamp(40px,7vw,100px); }
.eyebrow { color:var(--copper); letter-spacing:.14em; font-size:10px; line-height:1.6; font-weight:650; }
.auth-intro h1 { margin:25px 0; font-family:Georgia,"Times New Roman",serif; font-weight:400; font-size:clamp(42px,4.4vw,66px); line-height:1.02; letter-spacing:-.045em; }
.intro-copy { color:var(--muted); max-width:380px; font-size:15px; line-height:1.8; }
.auth-models { max-width:380px; margin-top:36px; border-top:1px solid var(--line); }
.auth-models>div { display:flex; gap:18px; align-items:center; padding:18px 0; border-bottom:1px solid var(--line); }
.model-monogram { display:grid; place-items:center; width:36px; height:36px; border:1px solid #514338; border-radius:6px; color:#d2a88f; font-size:10px; font-weight:650; }
.auth-models strong { display:block; margin-bottom:5px; font-size:13px; font-weight:550; }
.auth-models small { font-size:12px; color:var(--muted); }
.intro-note { margin-top:26px; font-size:11px; color:#819093; }
.auth-card { width:100%; padding:36px; border:1px solid var(--line); border-radius:12px; background:var(--panel); box-shadow:0 24px 60px #0002; }
.auth-card-heading h2 { margin:18px 0 10px; font-size:30px; font-weight:550; letter-spacing:-.035em; }
.auth-card-heading>p { color:var(--muted); line-height:1.65; font-size:13px; margin:0 0 28px; }
form label { display:block; font-size:12px; font-weight:550; margin:18px 0 9px; }
form input { width:100%; min-height:50px; background:#0b1215; border:1px solid #415055; border-radius:5px; color:var(--text); padding:13px 14px; font-size:14px; transition:border-color .15s; }
form input::placeholder { color:#77878c; }
form input:focus { border-color:#c39174; }
.field-label { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:18px; }
.field-label label { margin:0 0 9px; }
.field-label a { margin-bottom:9px; color:#d5a88e; font-size:11px; }
.password-field { position:relative; }
.password-field input { padding-right:68px; }
.password-field button { position:absolute; right:4px; top:4px; min-height:42px; min-width:55px; padding:5px; border:0; background:none; color:#d5a88e; font-size:11px; }
.primary-button,.secondary-button { display:flex; align-items:center; justify-content:center; gap:12px; width:100%; min-height:50px; padding:12px 16px; border:1px solid #c17f5e; border-radius:5px; background:#c9825e; color:#fff; font-size:13px; font-weight:650; margin-top:24px; }
.primary-button:hover { background:#d18f6b; color:#fff; }
.primary-button:disabled { opacity:.5; cursor:not-allowed; }
.secondary-button { background:transparent; color:var(--text); border-color:var(--line); margin-top:12px; }
.auth-message { font-size:12px; line-height:1.65; overflow-wrap:anywhere; color:#c3d3ca; }
.auth-message:empty { display:none; }
.auth-message.error { color:#ffc2ad; }
.auth-switch { border-top:1px solid var(--line); padding-top:22px; margin:26px 0 0; font-size:12px; color:var(--muted); line-height:1.8; text-align:center; }
.auth-switch a,.terms-note a { color:#e3b397; }
.register-progress { display:flex; align-items:center; justify-content:space-between; margin:0 0 22px; padding:0 0 16px; border-bottom:1px solid var(--line); color:var(--muted); font-size:11px; }
.progress-dots { display:flex; gap:5px; }
.progress-dots i { display:block; width:19px; height:3px; background:#3b484d; border-radius:2px; }
.progress-dots i.active { background:var(--copper); }
.field-hint { color:#a4b0b4; font-size:11px; line-height:1.65; margin:10px 0 0; }
.terms-note { color:var(--muted); font-size:11px; line-height:1.65; margin:22px 0 0; }
.terms-note a { text-decoration:underline; text-underline-offset:3px; }
.email-summary { display:flex; gap:12px; align-items:center; justify-content:space-between; padding:10px 12px; background:#0e1518; border:1px solid var(--line); border-radius:5px; font-size:12px; }
.email-summary>span { min-width:0; overflow-wrap:anywhere; }
.text-button { border:0; padding:4px 0; min-height:36px; color:#e3b397; background:none; font-size:12px; white-space:nowrap; }
.recovery-notice { margin-top:18px; color:#cdbbaa; font-size:12px; line-height:1.65; }
.recovery-notice>div { display:flex; gap:22px; align-items:center; }
.recovery-notice a { text-decoration:underline; }
.signed-in-detail { display:flex; gap:14px; align-items:center; padding:20px 0; }
.session-check { display:grid; width:36px; height:36px; place-items:center; background:#18352c; border:1px solid #2c5b48; border-radius:50%; color:#9fcebb; }
.signed-in-detail>span:last-child { min-width:0; }
.signed-in-detail small { display:block; color:var(--muted); margin-bottom:6px; }
.signed-in-detail strong { font-size:14px; overflow-wrap:anywhere; }
.switch-account { display:block; margin:20px auto 0; }
.auth-footer { min-height:78px; display:flex; align-items:center; justify-content:space-between; gap:20px; padding:16px clamp(20px,5vw,80px); color:#819093; font-size:11px; }
@media(max-width:860px) { .auth-layout { grid-template-columns:minmax(0,440px); justify-content:center; padding:42px 24px; } .auth-intro { display:none; } }
@media(max-width:480px) { .auth-header { min-height:72px; padding:12px 20px; gap:14px; } .auth-brand { font-size:11px; gap:13px; } .auth-brand small { display:none; } .auth-header nav { gap:14px; font-size:11px; } .auth-header nav a:first-child { display:none; } .auth-layout { padding:28px 20px; min-height:calc(100svh - 150px); } .auth-card { border:0; padding:18px 0; background:transparent; box-shadow:none; } .auth-card-heading h2 { font-size:32px; } .auth-footer { padding:16px 20px; gap:12px; } .auth-footer nav { gap:16px; font-size:11px; } }
@media(prefers-reduced-motion:reduce) { * { transition:none !important; } }
