@font-face { font-family:'IBM Plex Sans'; font-style:normal; font-weight:400 700; font-stretch:100%; font-display:swap; src:url(fonts/IBMPlexSans.woff2) format('woff2'); unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family:'JetBrains Mono'; font-style:normal; font-weight:400 600; font-stretch:100%; font-display:swap; src:url(fonts/JetBrainsMono.woff2) format('woff2'); unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

:root, [data-theme="dark"] {
  --bg:#0D1117;
  --bg-inset:#0B0F14;
  --surface:#161B22;
  --border:#283039;
  --border-subtle:#1E242B;
  --border-hover:#39424C;
  --text:#F0F6FC;
  --text-dim:#8B949E;
  --text-faint:#6B7682;
  --text-body:#9aa4af;
  --accent:#00FFA3;
  --accent-hover:#2BFFB4;
  --danger:#FF5C52;
  --warning:#FFB23E;
  --on-accent:#06140E;
  --shadow:rgba(0,0,0,.35);
  --shadow-rgb:0,0,0;
  --glow-rgb:0,255,163;
  --warning-vivid:#FFB23E;
  --card-border:#3A4A3F;
  --hero-glow-1:.30;
  --hero-glow-2:.16;
}

[data-theme="light"] {
  --bg:#FFFFFF;
  --bg-inset:#F6F8FA;
  --surface:#F6F8FA;
  --border:#D0D7DE;
  --border-subtle:#E5E9ED;
  --border-hover:#AFB8C1;
  --text:#0D1117;
  --text-dim:#57606A;
  --text-faint:#6E7781;
  --text-body:#57606A;
  --accent:#00875A;
  --accent-hover:#026E45;
  --danger:#CF222E;
  --warning:#9A6700;
  --on-accent:#FFFFFF;
  --shadow:rgba(140,149,159,.2);
  --shadow-rgb:140,149,159;
  --glow-rgb:255,122,26;
  --hero-glow-1:.16;
  --hero-glow-2:.09;
  --warning-vivid:#D97706;
  --card-border:#D9C9A8;
}

*, *::before, *::after { box-sizing:border-box; }
html, body { margin:0; background:var(--bg); }
body { color:var(--text); font-family:'IBM Plex Sans',system-ui,sans-serif; -webkit-font-smoothing:antialiased; transition:background-color .18s ease, color .18s ease; }
a { color:inherit; }
.wl-wrap { max-width:1180px; width:100%; margin:0 auto; }
.wl-link { transition:color .15s; }
.wl-link:hover { color:var(--text) !important; }
.x-link:hover { border-color:var(--border-hover); }

/* -- Theme toggle -- */
.theme-toggle { display:flex; align-items:center; justify-content:center; width:34px; height:34px; flex:none; background:var(--bg); border:1px solid var(--border); border-radius:10px; cursor:pointer; padding:0; color:var(--text-dim); transition:border-color .15s, color .15s; }
.theme-toggle:hover { border-color:var(--border-hover); color:var(--text); }
.theme-toggle svg { display:none; width:16px; height:16px; pointer-events:none; }
.theme-toggle[data-mode="light"] .ti-sun { display:block; }
.theme-toggle[data-mode="dark"] .ti-moon { display:block; }
.theme-toggle[data-mode="system"] .ti-system { display:block; }

/* Sticky top-left toggle, desktop/tablet only */
.theme-toggle-fixed { position:fixed; top:26px; right:24px; z-index:250; box-shadow:0 6px 18px rgba(var(--shadow-rgb),.25); }
@media (max-width:900px) { .theme-toggle-fixed { display:none !important; } }

/* Mobile: bottom-right of the full-screen overlay */
.mnav-theme-row { position:absolute; bottom:26px; right:24px; display:flex; align-items:center; gap:10px; }
.mnav-theme-row .theme-toggle { width:44px; height:44px; }
.mnav-theme-row .theme-toggle svg { width:20px; height:20px; }
.mnav-theme-label { font-family:'JetBrains Mono',monospace; font-size:12px; color:var(--text-faint); }

/* -- Mobile hamburger + full-screen overlay menu -- */
.mnav-toggle { display:none; align-items:center; justify-content:center; width:38px; height:38px; background:transparent; border:1px solid var(--border); border-radius:10px; cursor:pointer; padding:0; flex:none; }
.mnav-toggle svg { display:block; pointer-events:none; }
.mnav-overlay { position:fixed; inset:0; background:var(--bg); z-index:200; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; opacity:0; visibility:hidden; transform:translateY(-10px); transition:opacity .22s ease, transform .22s ease, visibility 0s linear .22s; }
.mnav-overlay.is-open { opacity:1; visibility:visible; transform:translateY(0); transition:opacity .22s ease, transform .22s ease; }
.mnav-close { position:absolute; top:26px; right:24px; width:42px; height:42px; display:flex; align-items:center; justify-content:center; background:transparent; border:1px solid var(--border); border-radius:10px; cursor:pointer; }
.mnav-links { display:flex; flex-direction:column; align-items:center; gap:26px; }
.mnav-links a { font-family:'IBM Plex Sans',system-ui,sans-serif; font-size:22px; font-weight:600; color:var(--text); text-decoration:none; }
.mnav-links a.is-cta { color:var(--on-accent); background:var(--accent); padding:13px 30px; border-radius:12px; margin-top:10px; }
body.mnav-locked { overflow:hidden; }
@media (max-width:900px) { .mnav-toggle { display:flex !important; } .mnav-desktop { display:none !important; } }
