/* Light and dark themes. Light values are the design tokens from the mocks; dark is set on html[data-theme=dark]. */
:root{color-scheme:light;--c-on-surface:19 27 46;--c-on-secondary-container:254 252 255;--c-surface:248 250 252;--c-primary-container:20 40 75;--c-inverse-primary:168 190 230;--c-surface-container-highest:218 226 253;--c-surface-container-lowest:255 255 255;--c-secondary-fixed:224 231 255;--c-tertiary-container:115 46 228;--c-inverse-on-surface:238 240 255;--c-on-secondary:255 255 255;--c-on-primary:255 255 255;--c-primary:12 27 53;--c-error-container:254 226 226;--c-surface-tint:20 40 75;--c-secondary:37 99 235;--c-on-tertiary-fixed:37 0 90;--c-on-error-container:153 27 27;--c-on-primary-fixed-variant:12 27 53;--c-on-tertiary-container:226 209 255;--c-on-primary-container:200 214 240;--c-surface-bright:250 248 255;--c-primary-fixed:222 230 245;--c-on-surface-variant:71 85 105;--c-surface-container:234 237 255;--c-surface-variant:218 226 253;--c-on-secondary-fixed-variant:0 62 168;--c-surface-container-low:241 245 249;--c-inverse-surface:40 48 68;--c-background:248 250 252;--c-surface-dim:210 217 244;--c-surface-container-high:226 231 255;--c-on-error:255 255 255;--c-tertiary-fixed:243 232 255;--c-tertiary:90 0 197;--c-on-background:19 27 46;--c-on-secondary-fixed:0 23 75;--c-outline:111 122 115;--c-secondary-fixed-dim:180 197 255;--c-on-primary-fixed:8 18 38;--c-on-tertiary:255 255 255;--c-primary-fixed-dim:168 190 230;--c-tertiary-fixed-dim:210 187 255;--c-error:239 68 68;--c-on-tertiary-fixed-variant:90 0 198;--c-secondary-container:59 130 246;--c-outline-variant:226 232 240;}
html[data-theme=dark]{color-scheme:dark;--c-on-surface:232 237 246;--c-on-secondary-container:255 255 255;--c-surface:11 18 32;--c-primary-container:33 62 112;--c-inverse-primary:168 190 230;--c-surface-container-highest:43 58 90;--c-surface-container-lowest:17 26 43;--c-secondary-fixed:29 42 82;--c-tertiary-container:115 46 228;--c-inverse-on-surface:17 26 43;--c-on-secondary:4 22 70;--c-on-primary:11 26 51;--c-primary:143 176 242;--c-error-container:74 29 31;--c-surface-tint:143 176 242;--c-secondary:122 167 255;--c-on-tertiary-fixed:227 211 255;--c-on-error-container:254 202 202;--c-on-primary-fixed-variant:200 214 240;--c-on-tertiary-container:226 209 255;--c-on-primary-container:200 214 240;--c-surface-bright:23 34 58;--c-primary-fixed:20 34 61;--c-on-surface-variant:168 182 202;--c-surface-container:29 40 64;--c-surface-variant:36 49 77;--c-on-secondary-fixed-variant:180 197 255;--c-surface-container-low:23 34 58;--c-inverse-surface:232 237 246;--c-background:11 18 32;--c-surface-dim:11 18 32;--c-surface-container-high:36 49 77;--c-on-error:60 10 10;--c-tertiary-fixed:44 26 80;--c-tertiary:185 156 255;--c-on-background:232 237 246;--c-on-secondary-fixed:201 214 255;--c-outline:125 139 160;--c-secondary-fixed-dim:122 167 255;--c-on-primary-fixed:200 214 240;--c-on-tertiary:37 0 90;--c-primary-fixed-dim:168 190 230;--c-tertiary-fixed-dim:210 187 255;--c-error:248 113 113;--c-on-tertiary-fixed-variant:210 187 255;--c-secondary-container:59 130 246;--c-outline-variant:38 52 77;}

/* ---- Dark overrides for rules that were written with fixed colors ---- */
html[data-theme=dark] body { background: #0b1220; color: var(--ink); }
html[data-theme=dark] .main { background: radial-gradient(900px 380px at 12% -40px, rgba(52,195,143,.07), transparent 70%), radial-gradient(800px 320px at 85% -60px, rgba(122,167,255,.06), transparent 70%), #0b1220; }
html[data-theme=dark] .topbar { background: rgba(11,18,32,.78); border-bottom-color: #223049; }
html[data-theme=dark] .rail { background: #0e1626; border-right-color: #223049; }
html[data-theme=dark] .gres { background: #111a2b; box-shadow: 0 12px 32px rgba(0,0,0,.5); }
html[data-theme=dark] .gres a:hover, html[data-theme=dark] .gres a.act { background: #1b2740; }
html[data-theme=dark] .nav a.on { background: #14223d; color: #b4cbf7; box-shadow: inset 0 0 0 1px rgba(143,176,242,.35); }
html[data-theme=dark] .nav a.on .material-symbols-outlined { color: #b4cbf7; }
html[data-theme=dark] .nav a.on .nb { background: #14403a; color: #9be8c8; }
html[data-theme=dark] .nb.hot { background: #3a2a0c !important; color: #f4c477 !important; }
html[data-theme=dark] .gatecard.locked { background: #33260c; color: #f4c477; }
html[data-theme=dark] .sopdoc h2, html[data-theme=dark] .sopdoc h3, html[data-theme=dark] .sopdoc h4, html[data-theme=dark] .sopdoc h5 { color: #e8edf6; }
html[data-theme=dark] .sopdoc code, html[data-theme=dark] .sopdoc th { background: #1b2740; }
html[data-theme=dark] .sopdoc th, html[data-theme=dark] .sopdoc td { border-bottom-color: #26344d; }
html[data-theme=dark] .tw .card { background: #111a2b; box-shadow: none; }
html[data-theme=dark] .tw table th { background: #17223a; color: #94a3b8; }
html[data-theme=dark] .tw .listrow, html[data-theme=dark] .tw .tablewrap td, html[data-theme=dark] .tw .tablewrap th { border-bottom-color: #223049; }
html[data-theme=dark] .tw .row input, html[data-theme=dark] .tw .row select { background: #17223a; }
html[data-theme=dark] :where(.tw) *, html[data-theme=dark] :where(.tw) ::before, html[data-theme=dark] :where(.tw) ::after { border-color: #26344d; }
html[data-theme=dark] .zerofee { background: #0f2b24; border-color: #1d4a3b; color: #7fe0b7; }
html[data-theme=dark] .docpage, html[data-theme=dark] .pdfframe { background: #fff; color: #111; }
html[data-theme=dark] input, html[data-theme=dark] select, html[data-theme=dark] textarea { background: #17223a; color: var(--ink); border-color: #2a3a58; }
html[data-theme=dark] input::placeholder, html[data-theme=dark] textarea::placeholder { color: #7d8ba0; }
html[data-theme=dark] input[type=checkbox], html[data-theme=dark] input[type=radio] { background: initial; }
html[data-theme=dark] dialog, html[data-theme=dark] .drawer { background: #111a2b; color: var(--ink); }
html[data-theme=dark] dialog::backdrop { background: rgba(0,0,0,.6); }
html[data-theme=dark] hr { border-color: #26344d; }
html[data-theme=dark] .tw input:not([type=checkbox]):not([type=radio]), html[data-theme=dark] .tw select, html[data-theme=dark] .tw textarea { background-color: transparent; }

/* standard palette utilities used across the pages */
html[data-theme=dark] .bg-white { background-color: #111a2b; }
html[data-theme=dark] .bg-white\/80, html[data-theme=dark] .bg-white\/50 { background-color: rgba(17,26,43,.8); }
html[data-theme=dark] .bg-slate-50 { background-color: #17223a; }
html[data-theme=dark] .bg-slate-100, html[data-theme=dark] .bg-slate-200 { background-color: #1f2c47; }
html[data-theme=dark] .hover\:bg-slate-50:hover { background-color: #1b2740; }
html[data-theme=dark] .border-slate-200 { border-color: #26344d; }
html[data-theme=dark] .text-slate-900 { color: #e8edf6; } html[data-theme=dark] .text-slate-800 { color: #dbe3f0; } html[data-theme=dark] .text-slate-700 { color: #c3cfe0; }
html[data-theme=dark] .text-slate-600 { color: #a8b6ca; } html[data-theme=dark] .text-slate-500 { color: #94a3b8; } html[data-theme=dark] .text-slate-400 { color: #8392a8; }
html[data-theme=dark] .hover\:text-slate-900:hover { color: #fff; } html[data-theme=dark] .hover\:text-slate-600:hover { color: #dbe3f0; }
html[data-theme=dark] .bg-amber-100 { background-color: #3a2a0c; } html[data-theme=dark] .text-amber-800, html[data-theme=dark] .text-amber-700 { color: #f4c477; } html[data-theme=dark] .text-amber-600 { color: #f0a83c; }
html[data-theme=dark] .bg-purple-100 { background-color: #2c1f52; } html[data-theme=dark] .text-purple-700, html[data-theme=dark] .text-purple-800 { color: #cdb8ff; }
html[data-theme=dark] .bg-emerald-50 { background-color: #0f2b24; } html[data-theme=dark] .text-emerald-800, html[data-theme=dark] .text-emerald-700 { color: #7fe0b7; }
html[data-theme=dark] .border-emerald-200, html[data-theme=dark] .border-emerald-200\/70, html[data-theme=dark] .border-emerald-200\/80 { border-color: #1d4a3b; }
html[data-theme=dark] .text-indigo-700 { color: #b3c3ff; } html[data-theme=dark] .bg-indigo-50 { background-color: #1d2a52; }
html[data-theme=dark] .text-primary { color: #4fd9a4; }
html[data-theme=dark] .text-on-surface-variant { color: #a8b6ca; }
html[data-theme=dark] .from-emerald-50 { --tw-gradient-from: #0f2b24 var(--tw-gradient-from-position); --tw-gradient-to: rgb(15 43 36 / 0) var(--tw-gradient-to-position); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); }
html[data-theme=dark] .to-teal-50 { --tw-gradient-to: #0d2a2c var(--tw-gradient-to-position); }
html[data-theme=dark] .shadow-sm, html[data-theme=dark] .shadow-2xs, html[data-theme=dark] .shadow-md { box-shadow: 0 0 0 1px rgba(148,163,184,.08); }
html[data-theme=dark] .ring-white { --tw-ring-color: #111a2b; }

/* theme toggle */
#themebtn { width: 36px; height: 36px; border-radius: 12px; display: inline-flex; align-items: center; justify-content: center; background: transparent; color: var(--body); cursor: pointer; border: 0; }
#themebtn:hover { background: var(--sub); color: var(--ink); }
html[data-theme=dark] .hover\:bg-white:hover, html[data-theme=dark] .focus\:bg-white:focus { background-color: #17223a; }
html[data-theme=dark] .next { background: linear-gradient(135deg, #1d3a6b, #14284B); color: #fff; }
html[data-theme=dark] .next button { background: #fff; color: #14284B; border-color: #fff; }
html[data-theme=dark] .to-white { --tw-gradient-to: #111a2b var(--tw-gradient-to-position); }
html[data-theme=dark] .from-white { --tw-gradient-from: #111a2b var(--tw-gradient-from-position); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgb(17 26 43 / 0)); }
html[data-theme=dark] .bg-amber-50 { background-color: #2b2008; }
html[data-theme=dark] .text-\[\#0f6b4f\] { color: #b4cbf7; }