:root{
  --navy:#031530;--navy-2:#0a2447;--orange:#FD8127;--orange-deep:#d85b0c;
  --ink:#031530;--muted:#5a6475;--line:#e6ded2;--ground:#FBF8F3;--card:#fff;
  --text-2:#2e3c52;--faint:#9aa1ac;--input-bg:#fdfcfa;--input-line:#e0d8cc;--hairline:#efe9e0;--error:#bd361e;
  --prefs-bg:#fff;--prefs-line:var(--line);--prefs-ink:var(--ink);--prefs-muted:#6b778a;--prefs-active-bg:var(--navy);--prefs-active-ink:#fff;--prefs-hover:var(--orange-deep);
  font-family:'DM Sans',system-ui,-apple-system,'Segoe UI',sans-serif;color:var(--ink);background:var(--ground);
}
*{box-sizing:border-box}
body{margin:0;background:var(--ground);-webkit-font-smoothing:antialiased;font-synthesis:none}
button,input{font:inherit}
a{color:inherit}

.page{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);min-height:100vh}

/* Hero */
.hero{position:relative;overflow:hidden;isolation:isolate;display:flex;flex-direction:column;padding:40px clamp(28px,5vw,72px);background:#020c1d;color:#fff}
.hero-photo{position:absolute;inset:0;z-index:-1;width:100%;height:100%;object-fit:cover;object-position:65% 50%;opacity:.85}
.hero:after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,#020c1dcc,#020c1d59 40%,#020c1de6 100%),linear-gradient(90deg,#020c1db3,transparent 70%)}
.lid{position:absolute;pointer-events:none;overflow:visible}
.lid .lid-wood{fill:transparent}
.lid .lid-line{fill:none;stroke:#FD8127;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.lid .lid-fill{fill:#FD8127}
.lid .lid-accent{fill:#E0A43A}
.lid .lid-symbol{fill:none;stroke:#fff;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.lid .lid-spin{transform-origin:0 0;animation:lid-turn 120s linear infinite}
@keyframes lid-turn{to{transform:rotate(360deg)}}
.lid-login{right:-190px;bottom:-170px;width:560px;height:560px;opacity:.2}
.brand{position:relative;z-index:1;display:inline-flex;align-items:center;gap:11px;text-decoration:none;font-family:'Bricolage Grotesque','DM Sans',sans-serif;font-size:22px;font-weight:750;letter-spacing:-.6px}
.brand img{display:block}
.brand b{color:var(--orange)}
.hero-copy{position:relative;z-index:1;margin:auto 0;max-width:560px;padding:56px 0}
.eyebrow{display:inline-flex;align-items:center;gap:9px;margin:0 0 22px;padding:7px 13px;border:1px solid #ffffff1f;border-radius:99px;background:#ffffff0a;font-size:13px;color:#c9d4e5}
.pulse{width:7px;height:7px;border-radius:50%;background:var(--orange);box-shadow:0 0 0 4px #fd812733}
h1,.card h2{font-family:'Instrument Serif','Iowan Old Style',Georgia,serif;font-weight:400}
h1{margin:0;font-size:clamp(44px,5.4vw,76px);line-height:1;letter-spacing:-.02em;text-wrap:balance}
h1 em{color:#ffb27a}
.lede{margin:22px 0 38px;font-size:18px;line-height:1.55;color:#b8c4d6;max-width:470px}
.features{list-style:none;margin:0;padding:0;display:grid;gap:20px}
.features li{display:flex;gap:15px;align-items:flex-start}
.features strong{display:block;font-size:15px;font-weight:600;margin-bottom:3px}
.features span{font-size:14px;line-height:1.5;color:#9fb0c6}
.feature-icon{flex-shrink:0;width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:#ffffff0d;border:1px solid #ffffff1f;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.feature-icon svg{width:19px;height:19px;fill:none;stroke:#ffb27a;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.hero-foot{position:relative;z-index:1;margin:0;font-size:13px;color:#8597b0}
.hero-foot strong{color:#dfe7f2;font-weight:600}

/* Sign in */
.signin{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:24px 24px 28px}
.signin-top{align-self:stretch;display:flex;align-items:center;justify-content:space-between;gap:12px}
.back-home{text-decoration:none;font-size:14px;font-weight:600;color:var(--text-2)}
.back-home:hover{color:var(--orange-deep)}
.card{width:100%;max-width:420px;margin:auto 0;background:var(--card);border-radius:22px;padding:42px 38px;box-shadow:0 0 0 1px #0315300d,0 2px 4px #0315300a,0 30px 60px -24px #03153033}
.brand-mobile{display:none;color:var(--ink);margin-bottom:28px}
.card h2{margin:0;font-size:38px;line-height:1.05;letter-spacing:-.01em}
.card-sub{margin:8px 0 28px;color:var(--muted);font-size:15px;line-height:1.5}
.field{display:block;margin-bottom:16px}
.field>span{display:flex;justify-content:space-between;align-items:center;margin-bottom:7px;font-size:13px;font-weight:600;color:var(--text-2)}
.field input{width:100%;padding:13px 15px;border:1px solid var(--input-line);border-radius:12px;background:var(--input-bg);color:var(--ink);font-size:15px;transition:border-color .15s,box-shadow .15s}
.field input::placeholder{color:var(--faint)}
.field input:focus{outline:none;border-color:var(--orange);background:var(--card);box-shadow:0 0 0 4px #fd812726}
.reveal{border:0;background:none;padding:0;cursor:pointer;font-size:12px;font-weight:600;color:var(--orange-deep)}
.reveal:hover{text-decoration:underline}
.error{min-height:20px;margin:-2px 0 10px;color:var(--error);font-size:13px;line-height:1.45}
.primary{width:100%;display:flex;align-items:center;justify-content:center;gap:8px;padding:14px 16px;border:1px solid #e56a12;border-radius:999px;background:linear-gradient(180deg,#ff9142,#f67517);color:#1b0b00;font-size:15px;font-weight:600;cursor:pointer;box-shadow:inset 0 1px 0 #ffffff59,0 1px 2px #03153026,0 8px 20px -8px #fd8127aa;transition:transform .12s,box-shadow .2s}
.primary:hover{background:linear-gradient(180deg,#ff9d55,#fd8127)}
.primary:active{transform:translateY(1px)}
.primary:disabled{opacity:.7;cursor:wait}
.primary:focus-visible,.secondary:focus-visible{outline:3px solid #fd812766;outline-offset:3px}
.help{margin:18px 0 0;font-size:13px;line-height:1.5;color:var(--muted);text-align:center}
.divider{display:flex;align-items:center;gap:12px;margin:26px 0 16px;font-size:12px;color:var(--faint)}
.divider:before,.divider:after{content:"";flex:1;height:1px;background:var(--hairline)}
.secondary{display:block;text-align:center;text-decoration:none;padding:12px 16px;border:1px solid var(--input-line);border-radius:999px;font-size:14px;font-weight:600;color:var(--text-2);transition:border-color .15s,color .15s}
.secondary:hover{border-color:var(--ink);color:var(--ink)}
.legal{margin-top:24px;display:flex;gap:8px;font-size:12px;color:var(--faint)}
.legal a{text-decoration:none}
.legal a:hover{color:var(--orange-deep)}

@media (max-width:900px){
  .page{grid-template-columns:1fr}
  .hero{display:none}
  .signin{min-height:100vh;padding:16px 16px 24px;background:radial-gradient(600px 300px at 50% -10%,#fd81271f,transparent 70%),var(--ground)}
  .brand-mobile{display:inline-flex}
}
@media (max-width:440px){
  .card{padding:28px 22px;border-radius:14px}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}

/* ---------- Dark theme ---------- */
:root[data-theme="dark"]{
  --ink:#eef2f8;--muted:#98a6ba;--line:#1b2a40;--ground:#050d19;--card:#0b1628;--orange-deep:#ff9a4d;
  --text-2:#c7d2e1;--faint:#8193ab;--input-bg:#0b1728;--input-line:#2c4260;--hairline:#22344d;--error:#ff8a73;
  --prefs-bg:#0f1d31;--prefs-muted:#94a5bc;--prefs-active-bg:#FD8127;--prefs-active-ink:#031530;--prefs-hover:#ffb27a;
}
[data-theme="dark"] .hero{border-right:1px solid #16263b}
[data-theme="dark"] .card{box-shadow:0 0 0 1px #ffffff12,0 30px 60px -24px #000c}
[data-theme="dark"] .secondary:hover{border-color:var(--orange)}
@media (max-width:900px){[data-theme="dark"] .signin{background:radial-gradient(600px 300px at 50% -10%,#fd812718,transparent 70%),var(--ground)}}