@font-face{font-family:"Big Shoulders";src:url(/fonts/big-shoulders.woff2) format("woff2");font-weight:100 900;font-display:swap}
:root{--tar:#B8361A;--ink:#111111;--paper:#FBFAF5;--volt:#DFFF3A;--white:#FFFFFF;--tone:#A32F15;--deep:#8E2811;--ease:cubic-bezier(.22,1,.36,1);color-scheme:light}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:"Big Shoulders",system-ui,sans-serif;font-optical-sizing:auto;font-size:19px;font-weight:500;line-height:1.4;color:var(--white);background:var(--tar) url(/assets/tartan.webp) repeat;background-size:256px;-webkit-font-smoothing:antialiased;font-variant-numeric:tabular-nums}
a{color:inherit}button,input{font:inherit;color:inherit}button{cursor:pointer;-webkit-tap-highlight-color:transparent}
h1,h2,h3{margin:0;line-height:1.05;font-weight:800;text-wrap:balance}p{text-wrap:pretty}
:focus{outline:none}:focus-visible{box-shadow:0 0 0 3px var(--ink),0 0 0 6px var(--volt);border-radius:12px}
[hidden]{display:none!important}
.vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.bar{display:flex;align-items:center;justify-content:space-between;padding:calc(12px + env(safe-area-inset-top)) 18px 0;max-width:1160px;margin:0 auto}
.mark{display:inline-flex;align-items:center;gap:10px;text-decoration:none;font-weight:800;font-size:24px;letter-spacing:.01em;min-height:44px}.mark svg{width:34px;height:34px;border-radius:9px}
.units{display:flex;background:rgba(17,17,17,.28);border-radius:999px;padding:4px}
.units button,.strat button,.gels button{min-height:44px;min-width:52px;padding:0 16px;border:0;border-radius:999px;background:none;font-weight:700;font-size:18px;transition:background .18s var(--ease),color .18s var(--ease),transform .16s var(--ease)}
.units button[aria-pressed=true]{background:var(--white);color:var(--ink)}
button:active,.btn:active,.chip:active{transform:scale(.97)}
.grid{max-width:1160px;margin:0 auto;padding:10px 18px 0}
.ttl{margin:22px 0 0;font-size:40px;font-weight:800;line-height:1}.races{display:flex;flex-wrap:wrap;gap:6px;margin:16px 0 22px}
.chip{display:inline-flex;align-items:center;min-height:44px;padding:0 13px;border:0;border-radius:999px;background:rgba(17,17,17,.22);font-weight:700;font-size:19px;text-decoration:none;transition:background .18s var(--ease),color .18s var(--ease),transform .16s var(--ease)}
.chip[aria-pressed=true]{background:var(--ink);color:var(--volt)}
.chip.dark{background:var(--ink);color:var(--paper)}
.custom{display:flex;align-items:center;gap:12px;margin:-8px 0 18px}.custom label{font-weight:600}.custom .in{width:110px}
.glabel{display:block;font-size:19px;font-weight:700}
.clock{display:block;width:100%;margin:0 0 0 -4px;padding:0;border:0;background:none;font-size:clamp(96px,30vw,148px);font-weight:800;line-height:.95;letter-spacing:-.01em;color:var(--white);caret-color:var(--volt);font-variant-numeric:tabular-nums}
.clock[aria-invalid=true]{color:#FFD0C2}
.nudge{display:flex;gap:8px;margin:8px 0 12px}
.nb{min-height:44px;padding:0 16px;border:0;border-radius:999px;background:rgba(17,17,17,.22);font-weight:700;font-size:18px;transition:transform .16s var(--ease)}
.pace{margin:0;font-size:24px;font-weight:700;min-height:34px}
.err{margin:6px 0 0;min-height:0;color:var(--volt);font-weight:700;font-size:18px}.err:empty{display:none}
.lane{margin:22px 0 0;padding:22px 18px 20px;background:var(--ink);border-radius:22px;color:var(--paper)}
.lane h2{font-size:28px;margin:0 0 12px}.lane .g2{margin-top:22px}
.strat,.gels{display:flex;flex-wrap:wrap;gap:6px}
.strat button,.gels button{background:#262626;color:var(--paper);padding:0 16px}
.strat button[aria-pressed=true],.gels button[aria-pressed=true]{background:var(--volt);color:var(--ink)}
.opt{margin-top:16px}.opt label{font-weight:600;font-size:19px}.opt b{color:var(--volt)}
input[type=range]{display:block;width:100%;margin:12px 0 6px;accent-color:var(--volt);height:44px}
.note{margin:6px 0 0;color:#D9D6CC;font-size:18px}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 22px;border:0;border-radius:999px;font-weight:800;font-size:20px;letter-spacing:.01em;text-decoration:none;transition:transform .16s var(--ease),background .18s var(--ease)}
.btn.volt{background:var(--volt);color:var(--ink)}.btn.quiet{background:#2A2A2A;color:var(--paper)}.btn.ghost{background:#2A2A2A;color:var(--paper)}
.file{position:relative;margin-top:12px;overflow:hidden}.file input{position:absolute;inset:0;opacity:0;cursor:pointer}
.file:focus-within{box-shadow:0 0 0 3px var(--ink),0 0 0 6px var(--volt)}
.link{display:inline-flex;align-items:center;min-height:44px;margin:8px 0 0 6px;padding:0 6px;border:0;background:none;text-decoration:underline;text-underline-offset:4px;font-weight:700;color:var(--volt)}
.in::placeholder{color:#635F57}
.in{min-height:48px;padding:0 16px;border:0;border-radius:14px;background:var(--paper);color:var(--ink);font-size:19px;font-weight:600}
.bandwrap{padding:34px 0 10px}
.band{position:relative;width:min(100%,340px);margin:0 auto;background:var(--paper);color:var(--ink);padding:30px 0 18px;box-shadow:0 22px 40px -22px rgba(40,6,0,.65)}
.band.unroll{animation:unroll .7s var(--ease) both}
@keyframes unroll{from{clip-path:inset(0 0 100% 0)}to{clip-path:inset(0 0 0 0)}}
.tape{position:absolute;left:-14px;right:-14px;top:-16px;height:40px;background:rgba(255,255,255,.55);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);transform:rotate(-1.5deg)}
.bt{margin:0 22px 12px;font-size:26px;font-weight:800;line-height:1.05;text-transform:uppercase;letter-spacing:.01em}
.rows{list-style:none;margin:0;padding:0}
.r{display:flex;align-items:baseline;gap:10px;padding:5px 22px;font-size:20px;font-weight:600}
.r .k{min-width:52px}.r .t{margin-left:auto;font-size:32px;font-weight:700;line-height:1.05}
.r .s{color:#5B574F;font-size:17px}
.r.five{background:var(--volt)}
.r.half,.r.fin{background:var(--ink);color:var(--paper);font-weight:700}.r.half .s,.r.fin .s{color:#BDB9AE}
.r .gd{font-size:14px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;background:var(--tar);color:var(--white);padding:1px 8px;border-radius:999px;align-self:center}
.t.roll{animation:roll .26s var(--ease) both}
.r{--i:0}.r .t.roll{animation-delay:calc(min(var(--i),24) * 12ms)}
@keyframes roll{from{transform:translateY(-55%);opacity:0}to{transform:none;opacity:1}}
.bf{margin:14px 22px 0;font-size:16px;color:#4E4A43}
.news{width:min(100%,520px);margin:40px auto 0;padding:24px 20px;background:var(--deep);border-radius:22px}
.news h2{font-size:30px}.news p{margin:8px 0 14px}
.sub{display:flex;flex-wrap:wrap;gap:8px}.sub .in{flex:1 1 200px}.sub .err{flex-basis:100%}.ok{margin:0;font-weight:700;font-size:21px}
.guide{max-width:640px;margin:0 auto;padding:56px 20px 30px}
.guide h1{font-size:64px;margin:12px 0 18px}.guide h2{font-size:38px;margin:40px 0 12px}.guide h3{font-size:24px;margin:24px 0 6px}
.guide p,.guide li{max-width:540px;font-size:21px}.guide p{margin:0 0 14px}
.list{padding-left:20px}.list li{margin:6px 0}
.plate{margin:30px 0}.plate img{display:block;width:100%;height:auto;border-radius:22px}.plate figcaption{margin-top:10px;font-size:16px;font-weight:600}
.others{display:flex;flex-wrap:wrap;gap:8px}
.foot{max-width:640px;margin:0 auto;padding:30px 20px calc(130px + env(safe-area-inset-bottom));font-size:16px}
.foot nav{display:flex;flex-wrap:wrap;gap:4px 18px;margin:12px 0}.foot nav a{display:inline-flex;align-items:center;min-height:44px}
.foot p{max-width:540px}.goals a{display:inline-block;padding:6px 0}
.dock{position:fixed;left:0;right:0;bottom:0;z-index:20;display:flex;gap:8px;justify-content:center;padding:18px 12px calc(12px + env(safe-area-inset-bottom));background:var(--ink)}
.dock::before{content:"";position:absolute;left:0;right:0;top:-10px;height:10px;background:conic-gradient(var(--ink) 25%,var(--paper) 0 50%,var(--ink) 0 75%,var(--paper) 0) 0 0/20px 20px}
.dock .btn{flex:1 1 0;max-width:220px;padding:0 10px;font-size:19px}
.sheetwrap{position:fixed;inset:0;z-index:40;display:flex;align-items:flex-end;justify-content:center;background:rgba(17,17,17,0);transition:background .28s var(--ease)}
.sheetwrap.on{background:rgba(17,17,17,.55)}
.drawer{width:100%;max-width:520px;max-height:92svh;overflow:auto;background:var(--ink);color:var(--paper);border-radius:28px 28px 0 0;padding:24px 20px calc(18px + env(safe-area-inset-bottom));transform:translateY(100%);transition:transform .28s var(--ease)}
.on .drawer{transform:none}.drawer h2{font-size:32px}
.drawer img{display:block;width:min(64%,260px);margin:16px auto;border-radius:22px}
.sfoot{display:flex;gap:8px;justify-content:center}
.toast{position:fixed;left:50%;bottom:calc(98px + env(safe-area-inset-bottom));transform:translate(-50%,20px);opacity:0;background:var(--volt);color:var(--ink);font-weight:800;padding:12px 20px;border-radius:999px;pointer-events:none;transition:all .22s var(--ease);z-index:50;max-width:90vw;text-align:center}
.toast.on{opacity:1;transform:translate(-50%,0)}
.solo{padding-top:20px}.bar.solo{justify-content:flex-start}
.print{display:none}
@media (min-width:900px){
  .grid{display:grid;grid-template-columns:minmax(0,1fr) 400px;gap:56px;padding-top:24px;align-items:start}
  .ctrl{position:sticky;top:20px}.clock{font-size:200px}.ttl{font-size:48px}.bandwrap{padding-top:40px}.band{width:100%}
  .dock{left:50%;right:auto;bottom:22px;transform:translateX(-50%);border-radius:999px;padding:10px;width:560px}
  .dock::before{display:none}.toast{bottom:110px}
  .drawer{border-radius:28px;margin-bottom:5vh}
}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}
@media print{
  @page{size:A4 landscape;margin:10mm}
  body{background:#fff;color:#000}
  body>*:not(.print){display:none!important}
  .print{display:block!important}
  .psheet{display:flex;flex-wrap:wrap;gap:6mm}
  .pstrip{width:38mm;background:#fff;color:#000;font-family:"Big Shoulders",sans-serif;outline:0.2mm dashed #999;outline-offset:0}
  .ph{font-weight:800;font-size:9pt;padding:2mm 2mm 1mm;text-transform:uppercase;line-height:1.05}
  .pr{display:flex;justify-content:space-between;padding:0.6mm 2mm;font-size:10pt;-webkit-print-color-adjust:exact;print-color-adjust:exact}.pr b{font-size:13pt}
  .pr.five{background:#DFFF3A}.pr.half,.pr.fin{background:#111;color:#fff}
  .ptape{height:20mm;color:#bbb;font-size:7pt;padding:2mm}
  .pscale{margin-top:6mm;font:9pt sans-serif;display:flex;align-items:center;gap:4mm}.pscale i{display:block;width:50mm;height:3mm;background:#000}
}