:root, html[data-theme="dark"] {
    --bg:oklch(0.155 0.01 250); --nav-bg:oklch(0.155 0.01 250 / 0.96);
    --surface:oklch(0.185 0.01 250); --surface-2:oklch(0.2 0.012 260); --procard:oklch(0.195 0.012 255);
    --text:oklch(0.9 0.008 250); --text-strong:oklch(0.97 0.008 250); --heading:oklch(0.96 0.008 250);
    --text-2:oklch(0.68 0.01 250); --text-3:oklch(0.56 0.01 250);
    --border:oklch(0.27 0.01 250); --border-2:oklch(0.34 0.02 265);
    --mono:oklch(0.74 0.09 270); --link:oklch(0.74 0.12 290);
    --chip-bd:oklch(0.5 0.09 230); --chip-tx:oklch(0.82 0.1 230);
    --code-bg:oklch(0.26 0.02 290); --pill-bg:oklch(0.26 0.03 290);
  }
  html[data-theme="light"] {
    --bg:#fbfbfd; --nav-bg:oklch(0.99 0.001 260 / 0.96);
    --surface:oklch(0.97 0.003 260); --surface-2:oklch(0.98 0.008 290); --procard:oklch(0.99 0.005 290);
    --text:oklch(0.42 0.01 260); --text-strong:oklch(0.22 0.01 260); --heading:oklch(0.24 0.01 260);
    --text-2:oklch(0.55 0.008 260); --text-3:oklch(0.62 0.008 260);
    --border:oklch(0.92 0.004 260); --border-2:oklch(0.88 0.01 275);
    --mono:oklch(0.58 0.1 295); --link:oklch(0.5 0.16 295);
    --chip-bd:oklch(0.7 0.1 295); --chip-tx:oklch(0.5 0.16 295);
    --code-bg:oklch(0.96 0.02 290); --pill-bg:oklch(0.96 0.025 290);
  }
  html,body{background:var(--bg);}
  body{color:var(--text); transition:background .25s ease, color .25s ease;}
  .nav{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;padding:16px 40px;background:var(--nav-bg);border-bottom:1px solid var(--border);font-family:'Space Grotesk',sans-serif;}
  .brand{font-size:20px;font-weight:700;letter-spacing:-0.01em;color:var(--text-strong);text-decoration:none;}
  .brand .dot{background:linear-gradient(95deg,oklch(0.72 0.13 300),oklch(0.76 0.13 195));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;}
  .nav-right{display:flex;align-items:center;gap:24px;font-size:14px;}
  .navlink{color:var(--text-2);text-decoration:none;transition:color .15s;}
  .navlink:hover{color:var(--link);}
  .navlink.active{color:var(--link);font-weight:600;}
  .theme-toggle{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:8px;border:1px solid var(--border-2);background:transparent;color:var(--text-2);cursor:pointer;font-size:15px;line-height:1;transition:color .15s,border-color .15s;}
  .theme-toggle:hover{color:var(--link);border-color:var(--link);}
  .cta{text-decoration:none;color:oklch(0.16 0.03 270);background:linear-gradient(95deg,oklch(0.72 0.13 300),oklch(0.76 0.13 195));padding:9px 17px;border-radius:8px;font-weight:600;white-space:nowrap;transition:transform .15s,box-shadow .15s;}
  .cta:hover{transform:translateY(-1px);box-shadow:0 10px 24px oklch(0.64 0.14 250 / 0.3);}
  .site-footer{border-top:1px solid var(--border);font-family:'Space Grotesk',sans-serif;}
  .site-footer .inner{max-width:1180px;margin:0 auto;padding:28px 40px;display:flex;align-items:center;justify-content:space-between;font-size:13px;color:var(--text-3);}
  .site-footer a{color:var(--text-2);text-decoration:none;}
  .site-footer a:hover{color:var(--link);}
  @media(max-width:680px){.nav{padding:13px 18px;}.nav-right{gap:13px;}.site-footer .inner{padding:22px 18px;}}