@font-face{font-family:'Inter';font-style:normal;font-weight:100 900;font-display:swap;src:url("../fonts/Inter/InterVariable.woff2") format("woff2");} @font-face{font-family:'Inter';font-style:italic;font-weight:100 900;font-display:swap;src:url("../fonts/Inter/InterVariable-Italic.woff2") format("woff2");} *, *::before, *::after{box-sizing:border-box;margin:0;padding:0;} html, body{font-family:'Inter';background:var(--bg);color:var(--text);min-height:100%;} body.gs-mkt :where(h1,h2,h3,h4,h5,h6), body.gs-portal :where(h1,h2,h3,h4,h5,h6){line-height:1.25;} h1,h2,h3,h4,h5,h6{font-family:inherit;} .ui-widget,.ui-widget button,.ui-widget input,.ui-widget select,.ui-widget textarea{font-family:inherit;} body.gs-portal, body.gs-mkt{padding-left:0;padding-right:0;} :root{ /* ONE global token set. --gs-* are the single source of truth (LIGHT here; DARK in html[data-theme="dark"] below). The older --bg/--line/--text/--accent names are kept as thin aliases to --gs-* so every rule and every page reads one vocabulary. This replaced two islands: the legacy :root set + a body.gs-app/portal --gs-* set. */ --gs-amber-bg:#FCF1DC; --gs-amber-tx:#92600A; --gs-bg:#FFFFFF; --gs-blue-bg:#E7EFF9; --gs-blue-tx:#1D4F91; --gs-border:#D7DBE0; --gs-border-light:#E8EAEE; --gs-card:#FFFFFF; --gs-card-bg:#F3F4F6; --gs-faint:#9AA1AC; --gs-green-bg:#E5F4E8; --gs-green-tx:#1E7B34; --gs-grey-bg:#EEF0F3; --gs-grey-tx:#4B5563; --gs-ink:#0F1117; --gs-muted:#6B7280; --gs-purple-bg:#EFEAF8; --gs-purple-tx:#5B3E96; --gs-red:#D00000; --gs-red-dark:#A80000; --gs-red-tint:#FBEAEA; --gs-redpill-bg:#FBEAEA; --gs-redpill-tx:#B42318; --gs-text:#3D434F; --gs-text-2:#3D434F; --gs-topnav-bg:#0f1117; --gs-input-bg:#FFFFFF; --accent:var(--gs-red); --accent-bg:var(--gs-red-tint); --accent-deep:var(--gs-red-dark); --text:var(--gs-ink); --text-mute:var(--gs-muted); --text-light:var(--gs-faint); --line:var(--gs-border-light); --line-strong:var(--gs-border); --bg:var(--gs-bg); --bg-card:var(--gs-card); --bg-elev:var(--gs-card); --bg-popover:var(--gs-card); --bg-soft:var(--gs-grey-bg); --bg-input:var(--gs-input-bg); --bg-input-soft:var(--gs-grey-bg); --hover-bg:var(--gs-grey-bg); --th-bg:var(--gs-grey-bg); --chart-tick:var(--gs-muted); --accent-soft:#e85a5a; --slate:#D00000; --slate-soft:#bb1f1f; --nav-bg:#0f1117; --nav-bg-darker:#0f1117; --chart-grid:rgba(0,0,0,0.05); --shadow-card:0 1px 3px rgba(0,0,0,0.04); --shadow-modal:0 20px 60px rgba(0,0,0,0.18), 0 6px 20px rgba(0,0,0,0.08); --shadow-popover:0 10px 30px rgba(0,0,0,0.12), 0 2px 6px rgba(0,0,0,0.06); } /* DARK THEME - data-theme="dark" on . Redefines --gs-* (dark); the legacy aliases in :root auto-follow, so only the non-aliased legacy darks are repeated here. */ html[data-theme="dark"]{ color-scheme: dark; --gs-ink:#F1F5F9; --gs-text:#D7DDE6; --gs-text-2:#D7DDE6; --gs-muted:#A8B1BF; --gs-faint:#8B94A3; --gs-border:#344256; --gs-border-light:#283447; --gs-bg:#0F172A; --gs-card:#1E293B; --gs-card-bg:#1E293B; --gs-input-bg:#16213A; --gs-red:#CC2222; --gs-red-dark:#E04040; --gs-red-tint:rgba(204,34,34,0.14); --gs-green-bg:rgba(34,197,94,0.16); --gs-green-tx:#7EE2A8; --gs-amber-bg:rgba(245,158,11,0.16); --gs-amber-tx:#FBD38D; --gs-redpill-bg:rgba(239,68,68,0.16); --gs-redpill-tx:#FCA5A5; --gs-blue-bg:rgba(96,165,250,0.16); --gs-blue-tx:#9CC4FB; --gs-purple-bg:rgba(167,139,250,0.16);--gs-purple-tx:#C4B5FD; --gs-grey-bg:rgba(148,163,184,0.14); --gs-grey-tx:#CBD5E1; /* #2F3A4C = --gs-grey-bg composited over the #1E293B card: same rendered colour but OPAQUE - sticky/floated table headers paint over scrolling rows, and an alpha bg would ghost the row text through them. */ --th-bg:#2F3A4C; --slate:#a31919; --slate-soft:#8a1515; --chart-grid:rgba(255,255,255,0.06); --shadow-card:0 1px 3px rgba(0,0,0,0.4); --shadow-modal:0 20px 60px rgba(0,0,0,0.6), 0 6px 20px rgba(0,0,0,0.4); --shadow-popover:0 10px 30px rgba(0,0,0,0.5), 0 2px 6px rgba(0,0,0,0.3); } html[data-theme="dark"] body{background:var(--bg);color:var(--text);} html[data-theme="dark"] .card, html[data-theme="dark"] .modal-card, html[data-theme="dark"] .lo-card{background:var(--bg-elev);border-color:var(--line);box-shadow:var(--shadow-card);} html[data-theme="dark"] .modal-card{box-shadow:var(--shadow-modal);} html[data-theme="dark"] .modal-body{color:var(--text);} /* ...but the legacy stylesheet ALSO has `p, a, li { color:#0f1117 }`, which hard-sets those elements directly (so they don't inherit the line above) and they read as near-black on the dark card - e.g. the AI "Generate document" dialog's labels. Re-theme them. color-scheme:dark also makes the dialog's native