:root{
  --page:#F7F4EC; --surface:#FFFFFF; --surface-2:#EFEAE0; --surface-3:#E7E1D3;
  --ink-900:#181A1E; --ink-700:#3C3F45; --ink-600:#5B5F66; --ink-400:#8B8E93;
  --border:rgba(24,26,30,.12); --border-strong:rgba(24,26,30,.2);
  --accent:#8A5A22; --accent-fill:#9C6B2E; --accent-soft:rgba(156,107,46,.12); --accent-contrast:#FFFDF9;
  --series-1:#2a78d6; --series-2:#eb6834; --series-3:#1baf7a; --series-4:#eda100; --series-5:#e87ba4;
  --tone-1:#D9B378; --tone-2:#C99A54; --tone-3:#AC7C34; --tone-4:#8A5A22; --tone-5:#6B441A;
  --good:#0ca30c; --critical:#d03b3b;
  --shadow-card:0 1px 2px rgba(20,16,8,.05), 0 16px 32px -20px rgba(20,16,8,.28);
  --font-sans:-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI","Helvetica Neue",Arial,sans-serif;
  --font-mono:ui-monospace,"SF Mono","Cascadia Code","Roboto Mono",Consolas,monospace;
  color-scheme: light;
}
@media (prefers-color-scheme: dark){
  :root:where(:not([data-theme="light"])){
    --page:#0F1113; --surface:#17191D; --surface-2:#1D2024; --surface-3:#262A2F;
    --ink-900:#F3F0E8; --ink-700:#D8D4C9; --ink-600:#ADB1B6; --ink-400:#787C82;
    --border:rgba(243,240,232,.12); --border-strong:rgba(243,240,232,.22);
    --accent:#D9A860; --accent-fill:#D9A860; --accent-soft:rgba(217,168,96,.14); --accent-contrast:#171208;
    --series-1:#3987e5; --series-2:#d95926; --series-3:#199e70; --series-4:#c98500; --series-5:#d55181;
    color-scheme: dark;
  }
}

*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
html{overflow-x:hidden;}
body{overflow-x:hidden; width:100%;}
body{font-family:var(--font-sans); background:var(--page); color:var(--ink-900); line-height:1.6; -webkit-font-smoothing:antialiased;}
h1,h2,h3,h4{margin:0; font-weight:700; letter-spacing:-.02em; text-wrap:balance;}
p{margin:0;}
a{color:inherit; text-decoration:none;}
.mono{font-family:var(--font-mono); font-variant-numeric:tabular-nums;}
:focus-visible{outline:2px solid var(--accent-fill); outline-offset:2px; border-radius:4px;}

.container{max-width:1080px; margin:0 auto; padding:0 24px;}
.container-narrow{max-width:640px; margin:0 auto; padding:0 24px;}

.topnav{border-bottom:1px solid var(--border); background:var(--surface);}
.topnav-inner{display:flex; align-items:center; justify-content:space-between; padding-top:16px; padding-bottom:16px;}
.brand{display:flex; align-items:center; gap:8px; font-weight:700; font-size:16px; letter-spacing:-.01em;}
.brand svg{width:20px; height:20px; color:var(--accent-fill);}
.navlinks{display:flex; align-items:center; gap:22px; font-size:13.5px; color:var(--ink-600);}
.navlinks a:hover{color:var(--ink-900);}
.nav-toggle-input{position:absolute; opacity:0; pointer-events:none;}
.nav-toggle-btn{display:none; align-items:center; justify-content:center; width:36px; height:36px; border-radius:8px; color:var(--ink-900); cursor:pointer;}
.nav-toggle-btn:hover{background:var(--surface-2);}

.btn{display:inline-flex; align-items:center; justify-content:center; gap:6px; background:var(--accent-fill); color:var(--accent-contrast); border:none; border-radius:9px; padding:10px 18px; font-size:14px; font-weight:600; font-family:var(--font-sans); cursor:pointer; transition:transform .15s ease, opacity .15s ease;}
.btn:hover{opacity:.92;}
.btn:active{transform:translateY(1px);}
.btn-ghost{background:transparent; border:1px solid var(--border-strong); color:var(--ink-900);}
.btn-sm{padding:7px 13px; font-size:12.5px; border-radius:7px;}
.btn-block{width:100%;}

.card{background:var(--surface); border:1px solid var(--border); border-radius:14px; padding:22px; box-shadow:var(--shadow-card);}

.field{display:flex; flex-direction:column; gap:6px; margin-bottom:16px;}
.field label{font-size:12.5px; font-weight:600; color:var(--ink-600);}
.field input, .field select, .field textarea{border:1px solid var(--border-strong); border-radius:9px; padding:10px 13px; font-size:16px; font-family:var(--font-sans); background:var(--surface); color:var(--ink-900); width:100%;}
.field input:focus, .field select:focus, .field textarea:focus{outline:none; border-color:var(--accent-fill);}
.field textarea{resize:vertical; min-height:90px;}

.alert{border:1px solid var(--border-strong); border-left:3px solid var(--critical); background:var(--surface-2); border-radius:9px; padding:11px 14px; font-size:13.5px; color:var(--ink-700); margin-bottom:16px;}

.eyebrow{display:inline-flex; align-items:center; gap:7px; font-size:11.5px; text-transform:uppercase; letter-spacing:.12em; color:var(--accent); font-weight:700; margin-bottom:12px;}
.eyebrow::before{content:""; width:16px; height:1.5px; background:var(--accent-fill); display:inline-block;}

.chip{display:inline-flex; align-items:center; gap:5px; padding:4px 10px; border-radius:999px; background:var(--surface-3); font-size:11.5px; color:var(--ink-600);}
.chip.on{background:var(--accent-soft); color:var(--accent); font-weight:600;}

.progress{height:6px; border-radius:3px; background:var(--surface-3); overflow:hidden;}
.progress i{display:block; height:100%; background:var(--accent-fill); border-radius:3px; transition:width .3s ease;}

.grid-2{display:grid; grid-template-columns:1fr 1fr; gap:16px;}
.grid-3{display:grid; grid-template-columns:repeat(3,1fr); gap:16px;}
.grid-5{display:grid; grid-template-columns:repeat(5,1fr); gap:12px;}

.stat b{display:block; font-family:var(--font-mono); font-size:26px; font-weight:600;}
.stat span{font-size:11.5px; color:var(--ink-400); text-transform:uppercase; letter-spacing:.05em;}

.dash-layout{display:grid; grid-template-columns:180px 1fr; gap:32px; align-items:start;}
.dash-side{display:flex; flex-direction:column; gap:2px; position:sticky; top:24px;}
.dash-side a{padding:9px 12px; border-radius:8px; font-size:13.5px; color:var(--ink-600);}
.dash-side a.active{background:var(--surface-2); color:var(--ink-900); font-weight:600;}
.dash-side a:hover{background:var(--surface-2);}

.flame{display:inline-flex; align-items:center; gap:5px; color:#C8672B; font-weight:700; font-size:13px;}
.flame svg{width:15px; height:15px; fill:currentColor; stroke:none;}

table.data{width:100%; border-collapse:collapse; font-size:13.6px;}
table.data th{text-align:left; font-size:11px; text-transform:uppercase; letter-spacing:.06em; color:var(--ink-400); padding:0 12px 10px 0; border-bottom:1px solid var(--border-strong); font-weight:600;}
table.data td{padding:11px 12px 11px 0; border-bottom:1px solid var(--border); vertical-align:middle; color:var(--ink-700);}
.dot{width:7px; height:7px; border-radius:50%; display:inline-block; margin-right:6px;}

.legend{display:flex; gap:14px; flex-wrap:wrap; font-size:11.5px; color:var(--ink-400);}
.legend span{display:inline-flex; align-items:center; gap:5px;}

.callout{border:1px solid var(--border-strong); border-left:3px solid var(--accent-fill); border-radius:10px; padding:14px 16px; background:var(--surface-2); font-size:13.2px; color:var(--ink-700);}

.opt{display:flex; align-items:center; gap:11px; padding:13px 15px; border:1px solid var(--border-strong); border-radius:11px; cursor:pointer; transition:border-color .15s, background .15s;}
.opt:hover{background:var(--surface-2);}
.opt input{accent-color:var(--accent-fill); width:16px; height:16px;}

.article-body p{margin:0 0 16px;}
.article-body h3{margin:30px 0 10px; font-size:16.5px; letter-spacing:-.01em;}
.article-body b{color:var(--ink-900);}
.article-body ul{margin:0 0 16px; padding-left:20px;}
.article-body li{margin-bottom:6px;}

footer.site-foot{border-top:1px solid var(--border); margin-top:60px; padding:24px 0; font-size:12px; color:var(--ink-400);}
.foot-inner{display:flex; justify-content:space-between; flex-wrap:wrap; gap:8px 20px;}

.card:has(table.data){overflow-x:auto;}
table.data{min-width:460px;}

@media (max-width:760px){
  .dash-layout{grid-template-columns:1fr;}
  .dash-side{position:static; flex-direction:row; overflow-x:auto;}
  .grid-2,.grid-3,.grid-5{grid-template-columns:1fr;}

  .topnav-inner{position:relative;}
  .brand{font-size:14px;}
  .nav-toggle-btn{display:flex; flex-shrink:0;}
  .navlinks{
    display:none;
    position:absolute; top:100%; left:0; right:0; z-index:20;
    flex-direction:column; align-items:stretch; gap:4px;
    background:var(--surface); border:1px solid var(--border); border-top:none;
    border-radius:0 0 14px 14px; padding:12px 20px 18px; box-shadow:var(--shadow-card);
  }
  .navlinks a, .navlinks .btn{width:100%; padding:10px 4px; font-size:14.5px;}
  .nav-toggle-input:checked ~ .navlinks{display:flex;}
}