[hidden]{display:none!important}
@font-face{font-family:Gaegu;src:url(/fonts/Gaegu-400.woff2) format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:Gaegu;src:url(/fonts/Gaegu-700.woff2) format('woff2');font-weight:700;font-display:swap}
@font-face{font-family:Wet;src:url(/fonts/RubikWetPaint-400.woff2) format('woff2');font-display:swap}
:root{--or:#EE9137;--or2:#d9731d;--orl:#fde3c8;--ink:#3b220f;--paper:#fffdf9;--grey:#b9aea4}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:Gaegu,'Comic Sans MS',cursive;font-size:20px;line-height:1.3;overflow-x:hidden;
  background-image:radial-gradient(circle at 12% 18%,rgba(238,145,55,.10) 0 38px,transparent 39px),radial-gradient(circle at 88% 42%,rgba(238,145,55,.08) 0 60px,transparent 61px),radial-gradient(circle at 30% 78%,rgba(238,145,55,.07) 0 46px,transparent 47px),radial-gradient(rgba(59,34,15,.05) 1px,transparent 1.5px);
  background-size:100% 100%,100% 100%,100% 100%,18px 18px}
a{color:var(--or2)}
code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.78em}
main{max-width:1080px;margin:0 auto;padding:0 18px}
section{margin:44px 0}
.small{font-size:.82em;opacity:.8;margin:.4em 0}
.label{font-weight:700;text-transform:lowercase;color:var(--or2);font-size:.9em}

/* wobbly hand-drawn card */
.card{position:relative;background:#fff;padding:20px;border-radius:22px 34px 18px 40px/36px 18px 30px 20px}
.card::before{content:"";position:absolute;inset:0;border:3.5px solid var(--or);border-radius:inherit;filter:url(#wob);pointer-events:none}
.card::after{content:"";position:absolute;inset:7px -7px -7px 7px;background:var(--orl);border-radius:inherit;z-index:-1;filter:url(#wob)}

.tape{overflow:hidden;background:repeating-linear-gradient(-45deg,var(--or) 0 22px,#fff 22px 44px);border-block:3px solid var(--ink);white-space:nowrap}
.tape-in{display:inline-flex;gap:28px;padding:5px 0;animation:tape 30s linear infinite}
.tape span{background:#fff;color:var(--ink);font-weight:700;padding:0 10px;border:2px solid var(--ink);border-radius:8px 3px 9px 4px;font-size:.85em}
@keyframes tape{to{transform:translateX(-50%)}}

.nav{display:flex;align-items:center;justify-content:space-between;max-width:1080px;margin:0 auto;padding:12px 18px;gap:10px}
.brand{display:flex;align-items:center;gap:8px;text-decoration:none;color:var(--ink);font-family:Wet,Gaegu,cursive;font-size:28px;color:var(--or2)}
.nav nav{display:flex;gap:14px;flex-wrap:wrap;justify-content:flex-end}
.nav nav a{color:var(--ink);text-decoration:none;font-weight:700;border-bottom:3px wavy var(--or)}

.hero{display:grid;grid-template-columns:minmax(220px,360px) 1fr;gap:34px;align-items:center;margin-top:18px}
.hero-logo img{width:100%;height:auto;display:block}
.boil{animation:boil .45s steps(1) infinite}
@keyframes boil{0%{filter:url(#wob1)}33%{filter:url(#wob2)}66%{filter:url(#wob3)}}
h1.drip{font-family:Wet,Gaegu,cursive;font-weight:400;font-size:clamp(68px,13vw,150px);line-height:.9;margin:0;color:var(--or);letter-spacing:2px;text-shadow:3px 3px 0 var(--ink)}
.tagline{font-size:clamp(26px,4.4vw,38px);font-weight:700;margin:6px 0 16px;transform:rotate(-1.5deg)}
.counter{max-width:520px}
.counter-label{font-weight:700;color:var(--or2)}
.counter-num{font-family:Wet,Gaegu,cursive;font-size:clamp(64px,12vw,110px);line-height:1;color:var(--ink);margin:4px 0}
.counter-num.pending{font-family:Gaegu;font-weight:700;font-size:52px;color:var(--grey)}
.counter-sub{font-size:.9em}
.minis{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:14px}
.minis div{background:var(--paper);border:2.5px dashed var(--or);border-radius:14px 8px 16px 9px;padding:8px;text-align:center}
.minis b{display:block;font-size:1.5em;line-height:1}
.minis span{font-size:.72em;opacity:.8}
.updated{font-size:.75em;opacity:.65;margin-top:10px}

.ca-head{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.badge{background:var(--or);color:#fff;font-weight:700;padding:2px 12px;border-radius:12px 6px 14px 5px;font-size:.85em}
.badge.warn{background:var(--grey)}
.ca-row{display:flex;gap:10px;align-items:center;margin:10px 0;flex-wrap:wrap}
.ca-row code{flex:1;min-width:0;word-break:break-all;background:var(--paper);border:2.5px solid var(--ink);border-radius:10px 4px 12px 5px;padding:10px 12px;font-size:15px}
.btn{font-family:Gaegu,cursive;font-weight:700;font-size:20px;color:#fff;background:var(--or);border:3px solid var(--ink);border-radius:16px 6px 18px 7px;padding:6px 18px;cursor:pointer;text-decoration:none;display:inline-block;box-shadow:3px 3px 0 var(--ink);transition:transform .08s}
.btn:hover{transform:translate(-1px,-1px) rotate(-1deg)}
.btn:active{transform:translate(2px,2px);box-shadow:1px 1px 0 var(--ink)}
.btn.ghost{background:#fff;color:var(--ink)}
.btn.big{font-size:28px;padding:10px 28px}
.btn[disabled]{opacity:.5;cursor:wait}
.links{display:flex;gap:10px;flex-wrap:wrap;margin:8px 0}
.facts{list-style:none;padding:0;margin:14px 0 0;display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:6px 18px;font-size:.88em}
.facts li::before{content:"✓ ";color:var(--or2);font-weight:700}
.facts li.no::before{content:"✗ ";color:#b33}
.facts a{word-break:break-all}

.sec-head h2,.rules h2{font-family:Wet,Gaegu,cursive;font-weight:400;font-size:clamp(36px,6vw,54px);color:var(--or);margin:0;text-shadow:2px 2px 0 var(--ink)}
.sec-head p{margin:4px 0 16px;max-width:760px}

.map-grid{display:grid;grid-template-columns:1.5fr 1fr;gap:26px}
.dish{padding:12px}
.dish canvas{width:100%;aspect-ratio:1/1;display:block;touch-action:manipulation;cursor:crosshair}
.legend{display:flex;gap:16px;justify-content:center;font-size:.8em;flex-wrap:wrap}
.dot{display:inline-block;width:12px;height:12px;border-radius:50%;margin-right:5px;vertical-align:-1px}
.dot.or{background:var(--or)}
.dot.gr{border:2px solid var(--grey)}
.dish-note{text-align:center;font-size:.75em;opacity:.7;margin-top:4px}
.tip{position:absolute;pointer-events:none;background:var(--ink);color:#fff;padding:4px 10px;border-radius:10px 4px 10px 4px;font-size:15px;white-space:nowrap;transform:translate(-50%,-130%);z-index:3}
.feed h3{margin:0;font-size:1.3em}
.feed ol{list-style:none;padding:0;margin:8px 0 0;max-height:520px;overflow:auto}
.feed li{display:flex;gap:8px;align-items:baseline;padding:6px 2px;border-bottom:2px dotted var(--orl);font-size:.86em}
.feed li .ic{flex:none}
.feed li .w{font-family:ui-monospace,monospace;font-size:.82em}
.feed li .t{margin-left:auto;opacity:.6;font-size:.8em;white-space:nowrap}
.feed li.cough{opacity:.55}
.feed li.new{animation:pop 1s ease}
@keyframes pop{0%{background:var(--orl)}100%{background:transparent}}
.empty{opacity:.65;font-style:italic;text-align:center}

.stages{display:grid;gap:14px}
.stage{display:grid;grid-template-columns:150px 1fr 110px;gap:14px;align-items:center;background:#fff;border:3px solid var(--or);border-radius:20px 8px 22px 9px;padding:10px 14px}
.stage .nm{font-weight:700;font-size:1.1em}
.stage .nm small{display:block;font-weight:400;font-size:.7em;opacity:.7}
.bar{height:22px;border:3px solid var(--ink);border-radius:12px 5px 14px 6px;background:var(--paper);overflow:hidden}
.bar i{display:block;height:100%;background:repeating-linear-gradient(-45deg,var(--or) 0 10px,var(--or2) 10px 20px);border-right:3px solid var(--ink);min-width:0;transition:width 1.2s ease}
.stage .ct{text-align:right;font-size:.9em}
.stage.done{background:var(--orl)}
.stage.done .nm::after{content:" ☣";color:var(--or2)}
.stage.locked{opacity:.75}

.pz{text-align:center}
.pz .ca-row{max-width:640px;margin:10px auto}
.pz .links{justify-content:center}
.exposed{background:var(--orl);border:3px dashed var(--or2);border-radius:14px 6px 16px 7px;padding:10px;margin-bottom:14px;font-weight:700}
.mystats{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin-top:10px}
.mystats div{border:2.5px dashed var(--or);border-radius:12px 6px 14px 5px;padding:6px 14px}
.mystats b{font-size:1.4em}
.err{color:#b33;font-weight:700}

.board table{width:100%;border-collapse:collapse;font-size:.95em}
.board th{text-align:left;color:var(--or2);border-bottom:3px solid var(--or);padding:6px}
.board td{padding:6px;border-bottom:2px dotted var(--orl)}
.board td:nth-child(n+3),.board th:nth-child(n+3){text-align:right}
.board tr.me td{background:var(--orl)}

.rules ul{padding-left:1.1em}
.rules li{margin:6px 0}
footer{max-width:820px;margin:40px auto 20px;text-align:center;padding:0 18px}
.toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);background:var(--ink);color:#fff;padding:8px 18px;border-radius:14px 6px 16px 7px;font-weight:700;z-index:10}

@media (max-width:760px){
  body{font-size:18px}
  .hero{grid-template-columns:1fr;gap:10px;text-align:center}
  .hero-logo{max-width:220px;margin:0 auto}
  .counter{margin:0 auto;text-align:center}
  .map-grid{grid-template-columns:1fr}
  .stage{grid-template-columns:1fr 78px;gap:6px 10px}
  .stage .bar{grid-column:1/-1;grid-row:2}
  .nav nav{gap:10px;font-size:.85em}
  .brand span{display:none}
  .board th:nth-child(4),.board td:nth-child(4){display:none}
  .ca-row code{font-size:13px}
  .btn{font-size:18px}
}
@media (prefers-reduced-motion:reduce){.boil,.tape-in{animation:none}}
