:root{--ink:#102d25;--forest:#173d31;--cream:#f3e9cf;--paper:#e7dfc4;--acid:#d6ff48;--red:#ef5357;--line:rgba(16,45,37,.25)}*{box-sizing:border-box}body{margin:0;min-width:320px;background:var(--paper);color:var(--ink);font-family:"Courier New",monospace}button,a{-webkit-tap-highlight-color:transparent}.shell{max-width:1120px;margin:auto;padding:18px 14px 28px}header{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line);padding-bottom:14px}.brand{display:flex;gap:9px;align-items:center;color:inherit;text-decoration:none;font-size:11px;font-weight:bold;line-height:1.05;letter-spacing:.04em}.mark{width:34px;height:34px;display:grid;place-items:center;background:var(--ink);color:var(--acid);font-size:20px}.tag,.eyebrow{font-size:10px;font-weight:bold;letter-spacing:.13em}.intro{display:flex;justify-content:space-between;align-items:center;gap:18px;padding:36px 0 28px}.intro h1{font-family:Impact,"Arial Black",sans-serif;line-height:.8;font-size:clamp(46px,10vw,92px);letter-spacing:-.04em;margin:8px 0}.intro h1 i{font-style:normal;color:var(--red)}.lede{max-width:390px;line-height:1.5;font-size:13px}.badge{background:var(--ink);color:var(--cream);padding:9px;display:flex;align-items:end;gap:10px;box-shadow:7px 7px 0 var(--red);transform:rotate(2deg);font-size:10px;line-height:1.35;min-width:196px}.badge img{width:75px;height:75px;object-fit:cover;image-rendering:pixelated}.badge b{color:var(--acid);font-size:8px}.play-area{display:grid;grid-template-columns:minmax(0,1fr) 270px;gap:20px;align-items:start}.panel{background:var(--forest);border:7px solid var(--ink);box-shadow:8px 8px 0 rgba(16,45,37,.22)}.hud{height:43px;color:var(--cream);display:flex;align-items:center;justify-content:space-between;gap:8px;padding:0 12px;font-size:10px;border-bottom:1px solid rgba(243,233,207,.2)}.hud b{color:var(--acid);font-size:13px}.hud span:last-child{color:var(--acid)}.canvas-wrap{position:relative;width:100%;aspect-ratio:360/620;background:#102d25;overflow:hidden}.canvas-wrap canvas{width:100%;height:100%;display:block;image-rendering:pixelated}.overlay{position:absolute;inset:0;background:rgba(16,45,37,.82);color:var(--cream);display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:20px}.overlay.hidden{display:none}.overlay h2{font-family:Impact,"Arial Black",sans-serif;font-size:clamp(30px,7vw,58px);line-height:.88;margin:12px 0;color:var(--acid)}.overlay p:not(.eyebrow){font-size:11px;line-height:1.5;max-width:320px}.overlay button{min-height:48px;margin-top:10px;padding:0 24px;background:var(--acid);color:var(--ink);border:2px solid var(--ink);box-shadow:4px 4px 0 var(--red);font-weight:bold;cursor:pointer}.overlay button span{margin-left:12px}.controls{display:flex;justify-content:space-between;padding:10px;gap:10px}.controls button{min-width:52px;min-height:44px;border:1px solid rgba(243,233,207,.4);background:rgba(0,0,0,.12);color:var(--cream);font:700 20px monospace;touch-action:none}.controls button:nth-child(2){font-size:14px}.leaderboard{padding:17px 15px;color:var(--cream);min-height:300px}.leader-head{display:flex;justify-content:space-between}.leaderboard h2{font-family:Impact,"Arial Black",sans-serif;font-size:36px;line-height:1;margin:8px 0 14px;color:var(--acid)}.live{font-size:9px;color:var(--acid)}ol{padding:0;margin:0;list-style:none;counter-reset:rank}li{counter-increment:rank;display:grid;grid-template-columns:25px 1fr auto;gap:7px;padding:9px 0;border-top:1px solid rgba(243,233,207,.15);font-size:10px}li::before{content:counter(rank,decimal-leading-zero);color:var(--red)}li strong{color:var(--acid)}.small{font-size:9px;line-height:1.5;color:rgba(243,233,207,.65);margin-top:18px}footer{display:flex;justify-content:space-between;gap:12px;padding-top:22px;font-size:9px;font-weight:bold}@media(max-width:720px){.intro{padding:28px 0 22px}.badge{min-width:138px;padding:7px;font-size:8px}.badge img{width:55px;height:55px}.play-area{grid-template-columns:1fr}.leaderboard{min-height:0}.leaderboard ol{display:grid;grid-template-columns:1fr 1fr;column-gap:18px}.leaderboard li{padding:7px 0}.small{margin-top:12px}}@media(max-width:470px){.shell{padding-inline:10px}.tag{font-size:8px}.intro{align-items:flex-end;gap:7px}.intro h1{font-size:47px}.lede{font-size:11px;margin-bottom:0}.badge{transform:none;min-width:112px;display:block;text-align:center}.badge img{display:block;margin:auto}.badge span{display:block;margin-top:5px}.badge b{display:none}.panel{border-width:5px}.hud{padding-inline:8px;font-size:8px}.hud b{font-size:11px}}
