.oh-page{--bg:#cfe4ef;--panel:#f3f9fc;--ink:#18293a;--muted:#4f6575;--accent:#d8392c;--btn:#18293a;--btnInk:#f3f9fc;--veil:#0e1a268c;--shadow:#18293a;--line:#18293a26;--pixel:Silkscreen,"Courier New",monospace;background:var(--bg);min-height:100dvh;color:var(--ink);-webkit-font-smoothing:antialiased;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px);font-family:Rubik,system-ui,-apple-system,Segoe UI,Roboto,sans-serif}@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .oh-page{--bg:#10202b;--panel:#1a2f3d;--ink:#e4eef4;--muted:#93abbb;--accent:#ff6a5c;--btn:#e4eef4;--btnInk:#10202b;--veil:#040a10b3;--shadow:#0000008c;--line:#e4eef426}}:root[data-theme=dark] .oh-page{--bg:#10202b;--panel:#1a2f3d;--ink:#e4eef4;--muted:#93abbb;--accent:#ff6a5c;--btn:#e4eef4;--btnInk:#10202b;--veil:#040a10b3;--shadow:#0000008c;--line:#e4eef426}.oh-page *,.oh-page :before,.oh-page :after{box-sizing:border-box}.oh-page main{max-width:680px;margin:0 auto;padding:16px 16px 40px}.oh-page header{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px 14px;margin-bottom:16px;display:flex}.oh-page h1{font-family:var(--pixel);white-space:nowrap;margin:0;font-size:28px;font-weight:700;line-height:1}.oh-page .chips{flex-wrap:wrap;gap:6px;display:flex}.oh-page .chip:empty{display:none}.oh-page .chip{font-family:var(--pixel);border:2px solid var(--ink);background:var(--panel);color:var(--ink);white-space:nowrap;padding:5px 8px;font-size:13px}.oh-page .chipbtn{color:var(--btnInk);background:var(--btn);cursor:pointer}.oh-page .chipbtn[hidden]{display:none}.oh-page .stage{width:fit-content;margin:0 auto;position:relative}.oh-page canvas{filter:drop-shadow(4px 6px #00000038);width:100%;max-width:100%;height:auto;image-rendering:pixelated;image-rendering:crisp-edges;touch-action:pan-y;cursor:crosshair;outline:none;display:block}.oh-page canvas:focus-visible{box-shadow:inset 0 0 0 3px #f2c84b}.oh-page .hint{text-align:center;min-height:1.4em;font-family:var(--pixel);color:var(--ink);pointer-events:none;margin-top:12px;font-size:13px;transition:opacity .35s}.oh-page .result{z-index:10;background:var(--veil);justify-content:center;align-items:center;padding:16px;display:flex;position:fixed;inset:0;overflow-y:auto}.oh-page .result[hidden]{display:none}.oh-page .card{--pixel:"Pixelify Sans","Courier New",monospace;background:var(--panel);border:3px solid var(--ink);width:100%;max-width:500px;box-shadow:8px 8px 0 var(--shadow);text-align:center;margin:auto;padding:40px 36px 30px;animation:.32s steps(4,end) both oh-pop;position:relative}@keyframes oh-pop{0%{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}.oh-page .card p{margin:0}.oh-page .close{width:36px;height:36px;color:var(--ink);background:0 0;border:2px solid #0000;place-items:center;padding:0;display:grid;position:absolute;top:14px;right:14px}.oh-page .close svg{fill:currentColor;shape-rendering:crispedges;width:14px;height:14px}.oh-page .close:hover{border-color:var(--ink)}.oh-page .close:focus-visible{outline-offset:2px;outline:3px solid #f2c84b}.oh-page .eyebrow{font-family:var(--pixel);letter-spacing:1px;text-transform:uppercase;color:var(--muted);text-wrap:balance;padding:0 34px;font-size:13px;margin-bottom:10px!important}.oh-page .score{font-family:var(--pixel);text-transform:uppercase;letter-spacing:1px;color:var(--accent);text-wrap:balance;font-size:46px;font-weight:700;line-height:1.05;margin-bottom:10px!important}.oh-page .sub{color:var(--muted);font-size:17px;margin-bottom:22px!important}.oh-page .trail{flex-wrap:wrap;justify-content:center;gap:6px;margin-bottom:10px;display:flex}.oh-page .tile{--c:#5f7891;background:var(--c);width:40px;height:40px;box-shadow:inset 3px 3px 0 #ffffff47,inset -3px -3px 0 #00000047,0 0 0 2px var(--ink);font-family:var(--pixel);color:#fff;text-shadow:2px 2px #00000059;place-items:center;font-size:18px;font-weight:700;animation:.36s steps(3,end) both oh-flip;display:grid}.oh-page .tile svg{shape-rendering:crispedges;width:22px;height:22px}.oh-page .t-far{--c:#d8392c}.oh-page .t-mid{--c:#e8833a}.oh-page .t-near{--c:#e0b23a}.oh-page .t-close{--c:#5fae4b}.oh-page .t-sunk{--c:#3c7a2e}.oh-page .t-miss{--c:#34495e}@keyframes oh-flip{0%{transform:scaleY(0)}to{transform:scaleY(1)}}.oh-page .legend{color:var(--muted);text-wrap:balance;font-size:12px;margin-bottom:28px!important}.oh-page .sect{font-family:var(--pixel);letter-spacing:1px;text-transform:uppercase;margin:0 0 12px;font-size:14px;font-weight:700}.oh-page .stats{grid-template-columns:repeat(4,1fr);gap:6px;margin-bottom:28px;display:grid}.oh-page .stats b{font-family:var(--pixel);font-size:34px;line-height:1.1;display:block}.oh-page .stats span{color:var(--muted);font-size:12px;line-height:1.25;display:block}.oh-page .dist{text-align:left;gap:5px;margin-bottom:28px;display:grid}.oh-page .drow{align-items:center;gap:8px;display:flex}.oh-page .drow>span{text-align:right;width:30px;font-family:var(--pixel);flex:none;font-size:13px}.oh-page .bar{text-align:right;min-width:26px;font-family:var(--pixel);color:#fff;background:#7a8b98;padding:2px 7px;font-size:13px;font-weight:700;box-shadow:inset 0 -2px #00000038}.oh-page .bar.on{background:#5fae4b}.oh-page .foot{border-top:2px solid var(--line);grid-template-columns:auto 1fr;align-items:center;gap:20px;padding-top:22px;display:grid}.oh-page .next{flex-direction:column;align-items:flex-start;gap:2px;display:flex;margin:0!important}.oh-page .next span{font-family:var(--pixel);text-transform:uppercase;color:var(--muted);font-size:12px}.oh-page .next b{font-family:var(--pixel);font-variant-numeric:tabular-nums;font-size:26px;line-height:1}.oh-page .actions{grid-template-columns:auto auto;justify-content:end;gap:8px;display:grid}.oh-page button{font:inherit;cursor:pointer}.oh-page .btn{font-family:var(--pixel);white-space:nowrap;border:2px solid var(--ink);background:var(--btn);color:var(--btnInk);box-shadow:3px 3px 0 var(--shadow);padding:13px 14px;font-size:14px}.oh-page .btn.ghost{color:var(--ink);background:0 0}.oh-page .btn:focus-visible{outline-offset:2px;outline:3px solid #f2c84b}.oh-page .btn:active{box-shadow:1px 1px 0 var(--shadow);transform:translate(2px,2px)}@media (max-width:480px){.oh-page .card{padding:36px 18px 22px}.oh-page .score{font-size:36px}.oh-page .tile{width:32px;height:32px;font-size:15px}.oh-page .stats b{font-size:26px}.oh-page .foot{grid-template-columns:1fr;gap:14px}.oh-page .next{align-items:center}.oh-page .actions{grid-template-columns:1fr 1fr;justify-content:stretch}}@media (prefers-reduced-motion:reduce){.oh-page .card,.oh-page .tile{animation:none}}