:root{--scene:#241713;--haze:#593923;--land-far:#39251c;--land-near:#493021;--stone-rim:#a27a55;--stone-lit:#8c674b;--stone-mid:#73513b;--stone-shade:#5c3c2a;--stone-dust:#c29a6b;--stone-pit:#342015;--grease:#26160f;--ground:#3a261b;--ground-edge:#8c6342;--bowl-foot:#39251c;--bowl-lit:#83573b;--bowl-shade:#4d2f22;--bowl-rim:#c39a68;--bowl-dust:#cfa873;--sand:#f0d3a1;--sand-ochre:#e8c68e;--sand-light:#f8e1b9;--mark:#e0bb8b;--text:#f0dfc4;--muted:#c8ad90;--active:#ce9566;--active-ink:#24160f;--focus:#f3c58a;--border:#a17d5b;--button:#34241c;--button-light:#423026;--panel:#30211a;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;color:var(--text);background:var(--scene);font-synthesis:none;font-family:system-ui,sans-serif}*{box-sizing:border-box}body{background:radial-gradient(ellipse at 50% 65%, #99592d17, transparent 65%), var(--scene);min-width:280px;margin:0}button{font:inherit;color:inherit;cursor:pointer;border:1px solid var(--border);background:linear-gradient(var(--button-light), var(--button));border-radius:5px;min-height:44px;padding:.6rem .8rem}button:focus-visible,canvas:focus-visible{outline:2px solid var(--focus);outline-offset:3px}button[aria-pressed=true]{color:var(--active-ink);background:var(--active);border-color:var(--mark);box-shadow:inset 0 1px #f8e1b92e}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;color:var(--sand-light);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{border:1px solid var(--border);color:var(--text);pointer-events:none;text-align:center;background:#2b1b16f2;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;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:var(--muted);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:var(--mark)}button:active:not(:disabled){transform:translateY(1px)}.notice{background:var(--panel);border:1px solid var(--border);text-align:center;z-index:2;border-radius:8px;width:90%;max-width:340px;padding:12px;font-size:.85rem;position:fixed;bottom:80px;left:50%;transform:translate(-50%)}dialog{border:1px solid var(--border);background:var(--panel);width:min(90vw,360px);color:var(--text);border-radius:10px;max-height:90svh;padding:24px;overflow:auto}dialog::backdrop{-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background:#160b07c7}dialog h2{margin:0;font:400 1.5rem Georgia,serif}.score{color:var(--sand);margin:20px 0;font:400 2.8rem Georgia,serif}.results{margin:20px 0;font-size:.9rem}.results div{border-bottom:1px solid var(--border);justify-content:space-between;padding:8px 0;display:flex}.results dd{font-variant-numeric:tabular-nums;margin:0}.muted{color:var(--muted);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{background:var(--active);color:var(--active-ink)}textarea{background:var(--scene);border:1px solid var(--border);width:100%;min-height:130px;color:var(--text);border-radius:4px;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}}