:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;color:#e9e1cc;font-synthesis:none;background:#111210;font-family:system-ui,sans-serif}*{box-sizing:border-box}body{background:#111210;min-width:280px;margin:0}button{font:inherit;color:inherit;cursor:pointer;background:#22251f;border:1px solid #565343;border-radius:8px;min-height:44px;padding:.6rem .8rem}button:focus-visible,canvas:focus-visible{outline-offset:3px;outline:2px solid #e7c788}button[aria-pressed=true]{color:#171910;background:#d7bf83;border-color:#e8d2a0}button:disabled{opacity:.4;cursor:default}.app{width:min(100%,520px);height:100svh;min-height:460px;padding:max(12px, env(safe-area-inset-top)) 14px max(12px, env(safe-area-inset-bottom));grid-template-rows:auto auto auto minmax(0,1fr) auto;grid-template-areas:"header""modes""hud""stage""tools";gap:10px;margin:auto;display:grid}header{grid-area:header;justify-content:space-between;align-items:center;gap:8px;display:flex}h1{letter-spacing:.035em;margin:0;font:400 clamp(1.4rem,5vw,1.9rem) Georgia,serif}.modes{grid-area:modes;gap:6px;display:flex}.modes button{flex:1;font-size:.8rem}.stage{grid-area:stage;place-items:center;min-height:0;display:grid;position:relative;container-type:size}canvas{touch-action:none;-webkit-user-select:none;user-select:none;border-radius:6px;width:min(100cqw,80cqh);height:min(125cqw,100cqh);display:block}.hint{color:#ded3b9;pointer-events:none;text-align:center;background:#12140fed;border:1px solid #595440;border-radius:8px;margin:0;padding:10px;font-size:.8rem;line-height:1.5;position:absolute;top:12%;left:10%;right:10%}.tools{grid-area:tools;grid-template-columns:1fr 1fr 1.5fr 1fr;gap:6px;display:grid}.tools button{padding-inline:4px;font-size:.8rem}.sr-only{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}[hidden]{display:none!important}.hud{color:#cbbf9f;font-variant-numeric:tabular-nums;grid-area:hud;justify-content:space-between;padding:0 4px;font-size:.8rem;display:flex}#sound{background:0 0;padding:.5rem;font-size:.72rem}button:hover:not(:disabled){border-color:#d0bb86}button:active:not(:disabled){transform:translateY(1px)}.notice{text-align:center;z-index:2;background:#303126;border:1px solid #a99c77;border-radius:8px;width:90%;max-width:340px;padding:12px;font-size:.85rem;position:fixed;bottom:80px;left:50%;transform:translate(-50%)}dialog{color:#e9e1cc;background:#1b1e18;border:1px solid #8b805e;border-radius:16px;width:min(90vw,360px);max-height:90svh;padding:24px;overflow:auto}dialog::backdrop{-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background:#050806b8}dialog h2{margin:0;font:400 1.5rem Georgia,serif}.score{color:#e7cb8b;margin:20px 0;font:400 2.8rem Georgia,serif}.results{margin:20px 0;font-size:.9rem}.results div{border-bottom:1px solid #454737;justify-content:space-between;padding:8px 0;display:flex}.results dd{font-variant-numeric:tabular-nums;margin:0}.muted{color:#bcb69f;font-size:.8rem;line-height:1.5}#share{width:100%}.result-actions{gap:8px;margin-top:16px;display:flex}.result-actions button{flex:1;font-size:.8rem}#again{color:#171910;background:#d7bf83}textarea{color:#e9e1cc;background:#10150e;border:1px solid #8b805e;border-radius:4px;width:100%;min-height:130px;padding:8px;font:.85rem/1.5 system-ui}@media (height<=540px) and (width>=600px){.app{grid-template:"stage header""stage modes""stage hud"1fr"stage tools"/1fr 210px;width:min(100%,800px);min-height:300px}header{flex-wrap:wrap}h1{font-size:1.3rem}.tools{grid-template-columns:1fr 1fr}}@media (prefers-reduced-motion:reduce){button:active:not(:disabled){transform:none}dialog::backdrop{-webkit-backdrop-filter:none;backdrop-filter:none}}
