@font-face{font-family:'JetBrains Mono';src:url('/webfonts/JetBrainsMono-Regular.woff2') format('woff2');font-weight:400}
@font-face{font-family:'JetBrains Mono';src:url('/webfonts/JetBrainsMono-Medium.woff2') format('woff2');font-weight:500}
@font-face{font-family:'JetBrains Mono';src:url('/webfonts/JetBrainsMono-SemiBold.woff2') format('woff2');font-weight:600}
@font-face{font-family:'JetBrains Mono';src:url('/webfonts/JetBrainsMono-Bold.woff2') format('woff2');font-weight:700}
:root{
  --bg:#f2f0eb;--surface:#fff;--border:#c8c4bc;--text:#1a1917;--muted:#6b6760;
  --blue:#1a3a6e;--blue-lt:#e8eef8;--blue-dk:#122d57;
  --green:#2e7d32;--grn-lt:#e8f5e9;
  --yellow:#e8a000;--ylw-lt:#fff8e1;
  --red:#c0392b;--red-lt:#fdf0ee;
  --mono:'JetBrains Mono',monospace;--r:4px;
  --sh:0 1px 3px rgba(0,0,0,.12),0 1px 1px rgba(0,0,0,.08);
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{font-size:14px;overflow-x:hidden}
body{font-family:var(--mono);background:var(--bg);color:var(--text);min-height:100vh;overflow-x:hidden;max-width:100%}

/* TOPBAR */
.topbar{background:var(--blue);color:#fff;display:flex;align-items:center;gap:12px;padding:0 24px;height:52px;position:sticky;top:0;z-index:100;box-shadow:0 2px 8px rgba(0,0,0,.25)}
.tb-brand{font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;white-space:nowrap}
.tb-brand span{opacity:.55;font-weight:400;margin-left:8px;font-size:11px}
.tb-sp{flex:1}
.topbar a{color:rgba(255,255,255,.8);text-decoration:none;font-size:12px;font-weight:500;padding:6px 12px;border-radius:var(--r);transition:background .15s}
.topbar a:hover{background:rgba(255,255,255,.2);color:#fff}

/* NAV + ACTIVE STATE */
.tb-nav{display:flex;gap:4px;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;-ms-overflow-style:none;flex-shrink:1;min-width:0}
.tb-nav::-webkit-scrollbar{display:none}
.topbar a.active{background:rgba(255,255,255,.25);color:#fff;font-weight:700}
.tb-current{background:rgba(255,255,255,.18);color:rgba(255,255,255,.9);font-size:12px;font-weight:700;padding:6px 12px;border-radius:var(--r);cursor:default;letter-spacing:.04em;white-space:nowrap}

@media(max-width:600px){
  .topbar{
    height:calc(52px + env(safe-area-inset-top,0px));
    padding-top:env(safe-area-inset-top,0px);
    align-items:flex-end;
    padding-bottom:10px;
  }
}