:root{color-scheme:dark;font-family:"Yu Gothic",system-ui,sans-serif;color:#efe9d5;background:#101d1c}
*{box-sizing:border-box}
body{margin:0;background:#101d1c;overscroll-behavior:none}
a{color:#e0d7b6}
.game-shell{width:min(100%,510px);margin:auto;padding:12px 14px max(8px,env(safe-area-inset-bottom));min-height:100dvh}
header{display:flex;justify-content:space-between;gap:8px;font-size:11px;color:#a7b7a6}
header a{text-decoration:none}
h1{font-family:serif;font-size:clamp(17px,4.9vw,24px);text-align:center;line-height:1.45;margin:14px 0 10px;overflow-wrap:anywhere}
rt{font-family:"Yu Gothic",system-ui,sans-serif;font-size:.43em;font-weight:500}
.scoreboard{display:flex;justify-content:space-between;align-items:baseline;border-top:1px solid #46594c;padding:10px 2px;font-size:11px;color:#c5cdbb}
.scoreboard>div:last-child{text-align:right}
.scoreboard strong{font-size:25px;color:#f7eac5;margin:0 5px;font-weight:600;font-variant-numeric:tabular-nums}
.scoreboard small{font-size:11px}
.game-field{position:relative;width:min(100%,calc((100dvh - 168px)*480/700));margin:auto;overflow:hidden;border:1px solid #71806a;border-radius:10px;background:#d5e1c9;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;box-shadow:0 18px 50px #0005}
canvas{display:block;width:100%;height:auto;touch-action:none;outline:none}
.intro{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:18px;background:#132b25dd;color:#f8edcc;z-index:3}
.intro p{font:600 clamp(20px,5vw,28px)/1.7 serif;margin:0 0 20px}
button{font-family:inherit;font-size:16px;font-weight:700;min-height:52px;padding:12px 25px;color:#fff7df;background:#aa4935;border:1px solid #dc9470;border-radius:6px;cursor:pointer;touch-action:none}
button:disabled{opacity:.6;cursor:wait}
button:focus-visible,a:focus-visible,canvas:focus-visible{outline:3px solid #edce7d;outline-offset:3px}
.miss-meter{position:absolute;left:12px;right:12px;top:9px;display:flex;align-items:center;gap:8px;pointer-events:none;z-index:2;color:#304137;font-size:10px;font-weight:700;text-shadow:0 1px 0 #fff8}
.meter-track{height:8px;flex:1;border:1px solid #5f6e60;border-radius:999px;overflow:hidden;background:#e7eadfbb}
.meter-track i{display:block;height:100%;width:0;background:#a54b38;transition:width .12s linear}
.result{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px 14px;padding:12px 2px 2px;border-top:1px solid #46594c}
.result>div{grid-row:1/3}
.result p{margin:0;font-size:12px;line-height:1.7;color:#c5cdbb}
.result strong{font-size:22px;color:#f7eac5;font-variant-numeric:tabular-nums}
.result button{min-height:44px;padding:8px 16px;font-size:14px}
.result>a{justify-self:center;font-size:11px}
.instructions{text-align:center;font-size:11px;color:#b2bfa9;margin:10px 0 0}
.instructions span{font-size:10px}
#storage-note{font-size:11px;color:#f0bc98;text-align:center}
[hidden]{display:none!important}
@media(max-height:480px){.game-field{width:min(100%,240px)}.game-shell{min-height:100vh}}
@media(max-width:360px){.result{grid-template-columns:1fr}.result>div{grid-row:auto}.result button{width:100%}}