@font-face { font-family:'Hanken'; font-style:normal; font-weight:400; font-display:swap; src:url('/assets/fonts/hanken-400.woff2') format('woff2'); }
@font-face { font-family:'Hanken'; font-style:normal; font-weight:500; font-display:swap; src:url('/assets/fonts/hanken-500.woff2') format('woff2'); }
@font-face { font-family:'Hanken'; font-style:normal; font-weight:600; font-display:swap; src:url('/assets/fonts/hanken-600.woff2') format('woff2'); }
@font-face { font-family:'Hanken'; font-style:normal; font-weight:700; font-display:swap; src:url('/assets/fonts/hanken-700.woff2') format('woff2'); }
@font-face { font-family:'Hanken'; font-style:normal; font-weight:800; font-display:swap; src:url('/assets/fonts/hanken-800.woff2') format('woff2'); }

:root {
  color-scheme: light;
  --bg:#FFFFFF; --bg2:#F6F7F9; --panel:#FFFFFF; --line:#E7E9EE; --line2:#D5D8E0;
  --text:#0B0C0F; --dim:#5D6470; --faint:#9298A3;
  --accent:#1B3DF0; --accent-dark:#1230C4; --ok:#14804A; --warn:#B25E09; --bad:#D03A2B;
  --term:#0D0E12; --termline:#26282F;
  --font:'Hanken',-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  --sans:'Hanken',-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  --display:'Hanken',-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  --mono:ui-monospace,"SF Mono",Menlo,Consolas,monospace;
  --ease: cubic-bezier(.16,1,.3,1);
}
* { box-sizing:border-box; -webkit-tap-highlight-color:transparent; }
body {
  margin:0; background:var(--bg); color:var(--text);
  font:16px/1.6 var(--font); -webkit-font-smoothing:antialiased;
  padding-bottom:86px;
  overflow-x:hidden;
}
a { color:var(--accent); text-decoration:none; }
code, pre, .mono { font-family:var(--mono); }
.grad { color:var(--accent); font-style:normal; }

.topbar { position:sticky; top:0; z-index:40; display:flex; align-items:center; gap:10px;
  padding:15px 18px; background:rgba(247,245,239,.94); backdrop-filter:blur(10px); border-bottom:1px solid var(--line); }
.topbar .logo { font:800 18px var(--font); letter-spacing:-0.03em; color:var(--text); }
.topbar .logo .hex { color:var(--accent); font-size:12px; }
.topbar .right { margin-left:auto; font:500 11px var(--mono); letter-spacing:.08em; text-transform:uppercase; color:var(--faint); }

.pg { padding:0 20px; }
.hero-m { padding:36px 0 12px; }
@keyframes riseM { from { opacity:0; transform:translateY(14px); } to { opacity:1; transform:none; } }
.hero-m .kick { animation: riseM .6s var(--ease) both; }
.hero-m h1 { animation: riseM .7s var(--ease) .06s both; }
.hero-m .sub { animation: riseM .7s var(--ease) .12s both; }
.hero-m .kick { color:var(--accent); font:600 10.5px var(--mono); letter-spacing:.16em; text-transform:uppercase; margin-bottom:14px; }
h1 { font:800 31px/1.1 var(--font); letter-spacing:-.035em; margin:0 0 16px; }
h2 { font:700 21px/1.2 var(--font); letter-spacing:-.02em; margin:36px 0 10px; }
.sub { color:var(--dim); font-size:16px; }

.card-m { background:var(--panel); border:1px solid var(--line); border-radius:4px; padding:18px; margin:12px 0; box-shadow:0 1px 2px rgba(27,25,21,.04); }
.card-m h3 { margin:0 0 6px; font:600 15px var(--font); }
.card-m p { margin:0; color:var(--dim); font-size:14px; }

.btn-m { display:block; text-align:center; padding:15px; border-radius:3px; font:600 15px var(--sans);
  border:1px solid var(--line2); color:var(--text); margin:10px 0; border-radius:10px;
  transition: transform .15s var(--ease), background .2s var(--ease); }
.btn-m:active { transform: scale(.975); }
.btn-m.primary { background:var(--text); color:#fff; border-color:var(--text); }
.btn-m.primary:active { background:var(--accent); border-color:var(--accent); }

pre.code-m { background:var(--term); color:#EDE9DF; border-radius:4px; padding:14px; overflow-x:auto;
  font-size:11.5px; line-height:1.68; margin:12px 0; }
pre.code-m .cm{color:#7D776B} pre.code-m .kw{color:#D9A066} pre.code-m .str{color:#A8B98A} pre.code-m .fn{color:#E4C89B} pre.code-m .num{color:#C98A6B}

.term-m { background:var(--term); color:#EDE9DF; border-radius:4px; font:11.5px/1.7 var(--mono); box-shadow:0 2px 12px rgba(27,25,21,.14); }
.term-m .hd { display:flex; gap:5px; padding:10px 13px; border-bottom:1px solid var(--termline); align-items:center; }
.term-m .hd i { width:7px; height:7px; border-radius:50%; background:var(--termline); }
.term-m .hd .t { margin-left:6px; color:#8F887A; font-size:10.5px; font-style:normal; letter-spacing:.05em; }
.term-m .bd { padding:12px 14px; }
.term-m .ok{color:#A8C48F} .term-m .warn{color:#DBB56E} .term-m .bad{color:#D98873} .term-m .acc{color:#E4C89B} .term-m .dim{color:#7D776B}

.chip { display:inline-flex; align-items:center; gap:5px; padding:2px 10px; border-radius:2px; font:600 10px var(--mono); letter-spacing:.05em; border:1px solid currentColor; }
.chip::before { content:""; width:5px; height:5px; border-radius:50%; background:currentColor; }
.chip.running{color:var(--accent)} .chip.waiting{color:var(--warn)} .chip.completed{color:var(--ok)} .chip.failed,.chip.halted{color:var(--bad)}

.statgrid { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin:18px 0; }
.stat-m { border-top:2px solid var(--text); padding:12px 2px 0; }
.stat-m .n { font:800 26px/1 var(--font); letter-spacing:-.03em; }
.stat-m .n, .stat-m .n .grad { font-style:normal; }
.stat-m .l { color:var(--dim); font-size:11.5px; margin-top:5px; font-family:var(--sans); }

.bar-m { margin:11px 0; font-size:12px; }
.bar-m .lbl { display:flex; justify-content:space-between; color:var(--dim); font-family:var(--mono); margin-bottom:4px; }
.bar-m .tr { height:13px; background:var(--bg2); border:1px solid var(--line); border-radius:2px; overflow:hidden; }
.bar-m .fl { height:100%; width:0; background:var(--line2); transition:width 1s cubic-bezier(.2,.7,.2,1); }
.bar-m.win .fl { background:var(--accent); }
.bar-m.win .lbl { color:var(--text); font-weight:600; }

.honest-m { border:1px solid var(--line2); border-left:3px solid var(--warn); background:var(--panel); border-radius:2px; padding:13px 15px; color:var(--dim); font-size:13px; margin:16px 0; }
.honest-m b { color:var(--text); }

.rv { opacity:0; transform:translateY(18px); transition:opacity .7s var(--ease), transform .7s var(--ease); transition-delay: var(--rvd, 0s); }
.rv.in { opacity:1; transform:none; }
@keyframes lineIn { from { opacity:0; transform:translateY(6px); } to { opacity:1; transform:none; } }
.sim-line { animation: lineIn .4s var(--ease) both; }

details.acc-m { border:1px solid var(--line); border-radius:4px; background:var(--panel); margin:10px 0; }
details.acc-m summary { list-style:none; cursor:pointer; padding:15px 16px; font:600 15px var(--font); display:flex; gap:10px; align-items:center; }
details.acc-m summary::-webkit-details-marker { display:none; }
details.acc-m summary::after { content:"+"; margin-left:auto; color:var(--accent); font-family:var(--sans); }
details.acc-m[open] summary::after { content:"–"; }
details.acc-m summary::after { transition: transform .3s var(--ease); }
details.acc-m[open] summary::after { transform: rotate(180deg); }
details.acc-m .bd { padding:0 16px 16px; color:var(--dim); font-size:13.5px; }
@keyframes accIn { from { opacity:0; transform:translateY(-6px); } to { opacity:1; transform:none; } }
details.acc-m[open] .bd { animation: accIn .35s var(--ease) both; }
details.acc-m .bd h4 { font:600 10px var(--mono); color:var(--accent); letter-spacing:.12em; text-transform:uppercase; margin:12px 0 4px; }

.heroimg-m { width:100%; height:auto; border-radius:4px; border:1px solid var(--line); box-shadow:0 12px 32px -14px rgba(27,25,21,.28); display:block; margin:18px 0 6px; }
.figcap-m { color:var(--faint); font:400 12.5px var(--font); margin:0 0 8px; }

.tabbar { position:fixed; bottom:0; left:0; right:0; z-index:50; display:flex;
  background:rgba(251,250,246,.96); backdrop-filter:blur(14px); border-top:1px solid var(--line);
  padding:9px 4px calc(9px + env(safe-area-inset-bottom)); }
.tabbar a { flex:1; text-align:center; color:var(--faint); font:600 10px var(--sans); transition: color .2s var(--ease), transform .12s var(--ease); }
.tabbar a .i { display:block; font-size:16px; margin-bottom:3px; font-family:var(--mono); }
.tabbar a.on { color:var(--accent); }
.tabbar a:active { transform: scale(.9); }

.sheet { position:fixed; inset:0; z-index:60; background:rgba(27,25,21,.28); backdrop-filter:blur(3px); display:none; }
.sheet.on { display:block; animation: sheetFade .25s ease both; }
@keyframes sheetFade { from { opacity:0; } to { opacity:1; } }
.sheet .inner { position:absolute; bottom:0; left:0; right:0; background:var(--panel); border-top:1px solid var(--line2);
  border-radius:10px 10px 0 0; padding:20px 20px calc(26px + env(safe-area-inset-bottom)); }
.sheet.on .inner { animation: sheetUp .4s var(--ease) both; }
@keyframes sheetUp { from { transform: translateY(48px); opacity:.4; } to { transform:none; opacity:1; } }
.sheet .inner a { display:block; padding:14px 4px; font:600 16px var(--font); color:var(--text); border-bottom:1px solid var(--line); }
.sheet .inner a:last-child { border:0; }
.footer-m { padding:28px 20px 12px; color:var(--faint); font-size:12px; text-align:center; font-family:var(--sans); }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
  .rv { opacity:1; transform:none; }
}