@font-face{font-family:Fringe;src:url(/assets/FringeV2-D4oZV7eT.otf)format("opentype");font-weight:400;font-style:normal;font-display:swap}: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:#49392d;--button-light:#685440;--button-edge:#937454;--button-recess:#160e0a;--housing:#30241c;--panel:#30211a;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;color:var(--text);background:var(--scene);font-synthesis:none;font-family:Fringe,sans-serif;font-size:14px;line-height:1.6}*{box-sizing:border-box}body{background:radial-gradient(ellipse at 50% 65%, #99592d17, transparent 65%), var(--scene);min-width:280px;margin:0}button{isolation:isolate;font:inherit;letter-spacing:.035em;color:inherit;cursor:pointer;border:1px solid;border-color:var(--button-edge) #3b2b20 #21160f #745a40;background:url("data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='160'%20height='64'%20viewBox='0%200%20160%2064'%3e%3cfilter%20id='grit'%3e%3cfeTurbulence%20type='fractalNoise'%20baseFrequency='0.85'%20numOctaves='3'%20stitchTiles='stitch'%20seed='17'/%3e%3cfeColorMatrix%20type='saturate'%20values='0'/%3e%3cfeComponentTransfer%3e%3cfeFuncA%20type='linear'%20slope='0.13'/%3e%3c/feComponentTransfer%3e%3c/filter%3e%3cpath%20fill='%23d7b98e'%20filter='url(%23grit)'%20d='M0%200h160v64H0z'/%3e%3cpath%20fill='none'%20stroke='%23e7c69b'%20stroke-opacity='.13'%20stroke-width='.6'%20d='m8%208%2017-1m103%2048%2020-1M48%205l6%201M80%2058l12-1'/%3e%3cpath%20fill='none'%20stroke='%23170e0a'%20stroke-opacity='.3'%20stroke-width='.7'%20d='m5%2053%2012%201m128-45%209-1M37%206l5%201'/%3e%3c/svg%3e") center / 160px 64px, linear-gradient(175deg, var(--button-light), var(--button) 65%);text-shadow:0 1px #160e0a;min-height:48px;box-shadow:inset 0 1px #e4bb8138, inset 0 -3px #21160f80, inset 1px 0 #b28c6338, 0 3px 0 var(--button-recess), 0 4px 3px #0d080680;border-radius:2px;padding:10px 14px;font-size:clamp(10px,3vw,13px);line-height:1.3;position:relative}button:before{content:"";pointer-events:none;border-top:1px solid #d1ac7b20;border-bottom:1px solid #130c095c;border-radius:1px;position:absolute;inset:4px}button:after{content:"";pointer-events:none;background:#342419;border-radius:50%;width:4px;height:4px;position:absolute;top:6px;left:6px;box-shadow:inset 0 1px #170e0a,0 1px #d2aa7430}button:focus-visible,canvas:focus-visible{outline:2px solid var(--focus);outline-offset:3px}button[aria-pressed=true],#again{color:var(--active-ink);text-shadow:0 1px #f0d3a140;background:url("data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='160'%20height='64'%20viewBox='0%200%20160%2064'%3e%3cfilter%20id='grit'%3e%3cfeTurbulence%20type='fractalNoise'%20baseFrequency='0.85'%20numOctaves='3'%20stitchTiles='stitch'%20seed='17'/%3e%3cfeColorMatrix%20type='saturate'%20values='0'/%3e%3cfeComponentTransfer%3e%3cfeFuncA%20type='linear'%20slope='0.13'/%3e%3c/feComponentTransfer%3e%3c/filter%3e%3cpath%20fill='%23d7b98e'%20filter='url(%23grit)'%20d='M0%200h160v64H0z'/%3e%3cpath%20fill='none'%20stroke='%23e7c69b'%20stroke-opacity='.13'%20stroke-width='.6'%20d='m8%208%2017-1m103%2048%2020-1M48%205l6%201M80%2058l12-1'/%3e%3cpath%20fill='none'%20stroke='%23170e0a'%20stroke-opacity='.3'%20stroke-width='.7'%20d='m5%2053%2012%201m128-45%209-1M37%206l5%201'/%3e%3c/svg%3e") 50%/160px 64px,linear-gradient(175deg,#d3aa77,#b68251 65%,#9e6e44);border-color:#e0bf8e #92613e #65412b #b88e60}button[aria-pressed=true]:after{background:#ffce82;box-shadow:inset 0 0 0 1px #754b28,0 0 0 1px #51351f,0 1px #f0d3a140}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:.02em;color:var(--sand-light);margin:0;font:400 clamp(12px,3.55vw,18px)/1.4 Fringe,sans-serif}.modes{grid-area:modes;gap:8px;display:flex}.modes,.tools{background:linear-gradient(90deg, #b68c5420, transparent 20%, #0f090540), var(--housing);border:1px solid #72563c;border-color:#72563c #261a13 #1a110d #58412e;border-radius:3px;padding:7px 7px 10px;box-shadow:inset 0 2px 4px #110b0880,0 1px #bd925029}.modes button{flex:1;min-width:0;padding-inline:10px}.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}.tools{grid-area:tools;grid-template-columns:1fr 1fr;gap:8px;display:grid}.tools button{padding-inline:8px}.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:clamp(8px,2.25vw,10px);display:flex}#sound{flex-shrink:0;min-height:44px;padding:10px 12px;font-size:clamp(9px,2.5vw,10px)}@media (hover:hover){button:hover:not(:disabled){filter:brightness(1.1);border-top-color:var(--mark)}}button:active:not(:disabled){box-shadow:inset 0 2px 4px #170e0a80, 0 1px 0 var(--button-recess);transform:translateY(2px)}button:focus-visible{border-color:var(--mark)}.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:11px;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:3px;max-height:90svh;padding:20px;overflow:auto}dialog::backdrop{-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background:#160b07c7}dialog h2{margin:0;font:400 clamp(12px,3.7vw,16px)/1.5 Fringe,sans-serif}.score{color:var(--sand);margin:20px 0;font:400 clamp(18px,5.2vw,24px)/1.5 Fringe,sans-serif}.results{margin:20px 0;font-size:11px}.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:10px;line-height:1.5}#share{width:100%}.result-actions{gap:8px;margin-top:16px;display:flex}.result-actions button{flex:1;padding-inline:8px;font-size:10px}textarea{background:var(--scene);border:1px solid var(--border);width:100%;min-height:130px;color:var(--text);border-radius:4px;padding:8px;font:11px/1.8 Fringe,sans-serif}@media (height<=540px) and (width>=600px){.app{grid-template:"stage header""stage modes""stage hud"1fr"stage tools"/1fr 280px;width:min(100%,800px);min-height:300px}header{flex-wrap:wrap}h1{font-size:13px}.tools{grid-template-columns:1fr 1fr}.modes,.tools{gap:6px;padding:5px 5px 8px}.modes button,.tools button{padding-inline:5px;font-size:10px}}@media (prefers-reduced-motion:reduce){button:active:not(:disabled){transform:none}dialog::backdrop{-webkit-backdrop-filter:none;backdrop-filter:none}}
