:root{color-scheme:light;font-family:ui-rounded,"Trebuchet MS",system-ui,sans-serif;color:#113d4b;background:#fff;font-synthesis:none}
*{box-sizing:border-box}body{margin:0}button,a,summary{-webkit-tap-highlight-color:transparent}
button{font-family:inherit;font-size:15px;font-weight:700;line-height:1.2;cursor:pointer}button:disabled{cursor:wait}button:focus-visible,a:focus-visible,summary:focus-visible,.playfield:focus-visible{outline:3px solid #103e50;outline-offset:3px}
[hidden]{display:none!important}main{width:min(100% - 24px,430px);margin:0 auto;padding-bottom:max(16px,env(safe-area-inset-bottom))}
.game-header{display:flex;align-items:center;justify-content:space-between;min-height:54px;padding:4px 0 8px;gap:12px}
h1{font-size:24px;line-height:1.1;margin:0;font-weight:850;letter-spacing:-.6px}
.utilities{display:flex;gap:7px}.utilities button{display:flex;align-items:center;justify-content:center;gap:6px;height:44px;min-width:44px;border:1px solid #d9e5e8;border-radius:24px;background:#f4f8f9;color:#113d4b;padding:8px 12px;font-family:inherit;font-size:13px;font-weight:700}
.utilities button:hover{background:#e2f2f2}.utilities svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.playfield{position:relative;isolation:isolate;aspect-ratio:2/3;width:min(100%, calc((100svh - var(--game-nav-height, 56px) - 132px) * 2 / 3), 380px);min-width:176px;margin:auto;border-radius:20px;overflow:hidden;background:#a5ece8;box-shadow:0 9px 28px #133f4b15;touch-action:none;overscroll-behavior:contain;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;cursor:pointer}
.playfield *{touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}canvas{display:block;width:100%;height:100%}
.score{position:absolute;top:4%;left:0;right:0;text-align:center;pointer-events:none;font-size:clamp(30px,7svh,48px);font-weight:900;line-height:1;color:#103e50;text-shadow:0 2px 0 #ffffffa0;font-variant-numeric:tabular-nums}
.score span{display:inline-block;min-width:54px;padding:3px 9px;background:#f4fff4e8;border-radius:16px}
.ready{position:absolute;top:25%;left:7%;right:7%;text-align:center;pointer-events:none}
.ready h2{font-size:32px;font-weight:900;letter-spacing:-1px;margin:0 0 112px;line-height:1.1}
.primary{pointer-events:auto;display:block;min-height:48px;width:100%;padding:12px 16px;border:2px solid #e5b239;border-radius:16px;background:#ffd767;box-shadow:0 3px 0 #ddad40;color:#103e50;font-family:inherit;font-size:20px;font-weight:850;transition:background .12s,transform .12s}
.primary:hover{background:#ffe28d}.primary:active{transform:translateY(2px);box-shadow:0 1px 0 #ddad40}.primary:disabled{opacity:.75}
.ready p{font-size:15px;line-height:1.5;margin:12px 0 0}.ready .best{font-size:15px;margin-top:9px}
.results{position:absolute;top:27%;left:9%;right:9%;text-align:center;background:#fcfff3ed;border:1px solid #ffffffc0;box-shadow:0 8px 25px #0e53601a;border-radius:22px;padding:18px}
.results h2,.paused h2{font-size:30px;line-height:1.1;margin:0 0 16px;font-weight:850;letter-spacing:-1px}
dl{display:flex;justify-content:center;gap:38px;margin:0 0 15px}dt{font-size:14px;font-weight:700}dd{font-size:38px;font-weight:900;line-height:1.1;margin:4px 0 0;font-variant-numeric:tabular-nums}
.record{font-size:15px;font-weight:800;margin:0 0 14px;color:#864700}.result-hint{font-size:12px;margin:12px 0 0;line-height:1.3}
.paused{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:30px;background:#e9fff3db;text-align:center}.paused .primary{max-width:250px}.paused p{font-size:15px}
.load-error{position:absolute;inset:15%;padding:20px;background:#fff;border-radius:15px;text-align:center;font-size:16px}
.help{margin:12px auto 0;width:min(100%,380px);font-size:15px;line-height:1.55}.help summary{display:flex;align-items:center;min-height:44px;cursor:pointer;font-size:15px;font-weight:750;padding:8px 12px;background:#f4f8f9;border:1px solid #dde7ea;border-radius:12px}.help summary::after{content:"+";margin-left:auto;font-size:22px;font-weight:400}.help[open] summary::after{content:"−"}.help div{padding:0 8px}.help h2{font-size:21px;line-height:1.3}.help ol{padding-left:23px}.help li+li{margin-top:6px}.help a{color:#126070}
.about-game{margin:24px auto 0;width:min(100%,380px);font-size:15px;line-height:1.65;border-top:1px solid #dde7ea;padding:8px 8px 0}.about-game h2{font-size:22px;line-height:1.25;margin:24px 0 10px;letter-spacing:-.3px}.about-game h3{font-size:17px;line-height:1.35;margin:20px 0 8px}.about-game p{margin:0 0 14px}.about-game ul{padding-left:22px}.about-game li+li{margin-top:10px}.about-game a{color:#126070}.about-game .more-games{padding-top:12px;border-top:1px solid #dde7ea}
.sr-only,.skip-link:not(:focus){position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.skip-link:focus{position:fixed;top:5px;left:5px;z-index:10001;background:#fff;padding:12px}
@media(max-height:700px){.game-header{min-height:50px}.ready{top:23%}.ready h2{margin-bottom:112px;font-size:28px}.ready p{font-size:13px;margin-top:8px}.results{top:22%;padding:14px}.results h2{font-size:26px;margin-bottom:12px}.result-hint{margin-top:8px}.primary{font-size:18px}.help{margin-top:8px}}
@media(max-height:500px) and (orientation:landscape){.playfield{width:192px}.ready h2{margin-bottom:42px;font-size:25px}.ready p{font-size:12px}.ready .best{margin-top:4px}.results{top:17%;padding:10px}.results h2{font-size:24px;margin-bottom:8px}dd{font-size:30px}.record{font-size:13px;margin-bottom:8px}.result-hint{display:none}.game-header{min-height:48px}}
@media(prefers-reduced-motion:reduce){button{transition:none}}
