:root { color-scheme: dark; --bg:#07111c; --panel:rgba(16,31,47,.82); --line:#233c55; --blue:var(--brand-accent,#fb9a44); --cyan:var(--brand-end,#e57a21); --text:#f3f7fc; --muted:#9db0c3; --link:var(--brand-dark,#fb9a44); --error:#ff8792; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif; }
:root[data-theme="light"] { color-scheme:light; --bg:#edf2f7; --panel:#ffffffeb; --line:#d4deea; --text:#1d2b3b; --muted:#556b80; --link:var(--brand-light,#974800); --error:#b52e45; }
.landing-controls { display:flex;align-items:center;gap:12px; }
#landingTheme { border:1px solid var(--line);background:var(--panel);color:var(--text);box-shadow:none;padding:6px 10px;font-size:20px; }
:root[data-theme="light"] .version,:root[data-theme="light"] .feature-row span,:root[data-theme="light"] .workflow article,:root[data-theme="light"] input { background:var(--panel);color:var(--text); }
:root[data-theme="light"] label { color:var(--muted); }
:root[data-theme="light"] .eyebrow,:root[data-theme="light"] .workflow b { color:var(--link); }
:root[data-theme="light"] .login-card { box-shadow:0 16px 50px #20446614;border-color:var(--line); }
* { box-sizing:border-box; }
body { min-height:100vh; margin:0; color:var(--text); background:radial-gradient(circle at 70% 18%,color-mix(in srgb,var(--blue) 18%,transparent),transparent 30%),radial-gradient(circle at 5% 90%,color-mix(in srgb,var(--cyan) 9%,transparent),transparent 25%),var(--bg); }
body::before { content:""; position:fixed; inset:0; pointer-events:none; opacity:.2; background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px); background-size:48px 48px; mask-image:linear-gradient(to bottom,black,transparent 80%); }
.landing-nav { position:relative; z-index:1; height:74px; display:flex; align-items:center; justify-content:space-between; max-width:1180px; margin:auto; padding:0 28px; }
.landing-brand { display:flex; align-items:center; gap:11px; color:inherit; text-decoration:none; }
.landing-brand span,.login-icon { display:grid; place-items:center; color:var(--brand-ink,#20170e); font-weight:850; background:var(--blue); box-shadow:0 14px 34px color-mix(in srgb,var(--blue) 28%,transparent); }
.landing-brand span { width:36px; height:36px; border-radius:11px; }
.landing-brand strong { font-size:.92rem; }
.version { padding:7px 11px; border:1px solid var(--line); border-radius:999px; color:var(--muted); font-size:.72rem; font-weight:700; background:rgba(7,17,28,.6); }
main { position:relative; z-index:1; max-width:1180px; margin:auto; padding:72px 28px 50px; }
.hero { display:grid; grid-template-columns:minmax(0,1.2fr) minmax(330px,.65fr); align-items:center; gap:90px; }
.eyebrow { display:block; color:var(--link); font-size:.69rem; font-weight:850; letter-spacing:.14em; text-transform:uppercase; }
.hero h1 { max-width:760px; margin:16px 0 22px; font-size:clamp(2.8rem,6vw,5.6rem); line-height:.98; letter-spacing:-.065em; }
.hero-copy>p { max-width:680px; margin:0; color:var(--muted); font-size:1.07rem; line-height:1.7; }
.feature-row { display:flex; flex-wrap:wrap; gap:9px; margin-top:30px; }
.feature-row span { padding:9px 13px; border:1px solid var(--line); border-radius:999px; color:#c4d4e4; font-size:.72rem; background:rgba(15,29,44,.6); }
.login-card { padding:30px; border:1px solid color-mix(in srgb,var(--blue) 38%,var(--line)); border-radius:28px; background:var(--panel); box-shadow:0 30px 80px rgba(0,0,0,.34); backdrop-filter:blur(18px); }
.login-icon { width:47px; height:47px; border-radius:14px; margin-bottom:25px; }
.login-card h2 { margin:8px 0 6px; font-size:1.55rem; }
.login-card>p { margin:0 0 24px; color:var(--muted); font-size:.78rem; }
form,label { display:grid; }
form { gap:15px; }
label { gap:7px; color:#b9c9d8; font-size:.73rem; font-weight:700; }
input { width:100%; padding:13px 14px; border:1px solid var(--line); border-radius:12px; outline:none; color:var(--text); background:#091725; font:inherit; }
input:focus { border-color:var(--blue); box-shadow:0 0 0 3px color-mix(in srgb,var(--blue) 18%,transparent); }
button { margin-top:2px; padding:13px 18px; border:0; border-radius:12px; color:var(--brand-ink,#20170e); background:var(--blue); font-weight:800; cursor:pointer; box-shadow:0 12px 30px color-mix(in srgb,var(--blue) 25%,transparent); }
button:disabled { opacity:.6; cursor:wait; }
.login-error { min-height:17px; color:var(--error); font-size:.72rem; }
.account-back-link { display:block; margin-top:20px; color:var(--link); }
.account-back-link:focus-visible { outline:2px solid var(--link); outline-offset:4px; border-radius:3px; }
.workflow { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-top:105px; }
.workflow article { padding:22px; border:1px solid rgba(35,60,85,.75); border-radius:20px; background:rgba(10,23,36,.56); }
.workflow b { color:var(--link); font-size:.68rem; letter-spacing:.12em; }
.workflow h2 { margin:18px 0 7px; font-size:1rem; }
.workflow p { margin:0; color:var(--muted); font-size:.76rem; line-height:1.55; }
footer { position:relative; z-index:1; max-width:1180px; margin:0 auto; padding:30px 28px 38px; color:#5f7489; font-size:.68rem; }
@media (max-width:850px) { main { padding-top:35px; }.hero { grid-template-columns:1fr; gap:48px; }.hero h1 { font-size:clamp(2.7rem,13vw,4.5rem); }.workflow { margin-top:65px; grid-template-columns:1fr; } }

[hidden]{display:none!important}.forgot-link{display:block;margin:18px 0;border:0;padding:0;background:transparent;box-shadow:none;color:var(--link);font:inherit;cursor:pointer}#forgotForm{margin-top:18px;padding-top:18px;border-top:1px solid #879bab55}#publicLanguage{border:1px solid #879bab55;border-radius:10px;padding:8px;background:transparent;color:inherit}#forgotFeedback{font-size:13px;line-height:1.5}#resetField[hidden]{display:none}
