*,*:before,*:after{box-sizing:border-box}html,body{margin:0;padding:0;height:100%;background:#1a1d21;overflow:hidden;touch-action:manipulation}#app{display:flex;flex-direction:column;height:100vh;height:100dvh}#board-wrapper{flex:1;min-height:0;display:flex;align-items:center;justify-content:center;background:#1a1d21;overflow:hidden}#board{display:grid;grid-template-columns:repeat(16,1fr);gap:0;width:min(calc(100vw - 8px),calc(100dvh - 60px));height:min(calc(100vw - 8px),calc(100dvh - 60px));background:#2a2d33;padding:1.5%;border-radius:4px;box-shadow:0 0 0 2px #3a3e47,0 8px 32px #0009,inset 0 1px #ffffff0f;flex-shrink:0}.cell{display:block;aspect-ratio:1;padding:0;margin:0;background:none;border:none;cursor:pointer;color:#c8a96e;transition:transform .35s cubic-bezier(.215,.61,.355,1);transform-origin:center center;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;touch-action:manipulation;outline:none;border-radius:50%;position:relative;z-index:0}.cell:hover{color:#e8c98e}.cell svg{display:block;width:100%;height:100%;overflow:visible;pointer-events:none}.cell .plate{fill:#1e2126}.cell .arc{stroke:currentColor;stroke-width:9;stroke-linecap:butt;fill:none}@keyframes chain-flash{0%{box-shadow:0 0 10px 4px #f20;color:#f42;z-index:2}28%{box-shadow:0 0 8px 3px #f80;color:#fa4}55%{box-shadow:0 0 7px 3px #2c4;color:#5d8}80%{box-shadow:0 0 5px 2px #25f;color:#58f}to{box-shadow:none;color:#c8a96e;z-index:0}}.cell.chain-active{animation:chain-flash 2.5s ease-out forwards;z-index:2}#ui{display:flex;align-items:center;gap:16px;padding:10px 16px;padding-bottom:max(10px,env(safe-area-inset-bottom));background:#13151a;border-top:1px solid #2e3138;font-family:IBM Plex Mono,ui-monospace,Cascadia Code,Source Code Pro,monospace;color:#d4b97a;flex-shrink:0;font-size:clamp(13px,2.8vw,20px)}#scores{display:flex;flex-direction:column;gap:1px}#score-line,#best-line{font-weight:600;white-space:nowrap;letter-spacing:.03em;color:#e8d4a4;text-shadow:0 0 8px rgba(200,169,110,.4)}#score-value,#best-value{display:inline-block;min-width:3ch;color:#ffd080}@keyframes score-flash{0%,to{opacity:1}50%{opacity:.15}}#score-line.score-flash,#best-line.score-flash{animation:score-flash .3s ease-in-out 3}#ui-actions{display:flex;align-items:center;gap:8px;margin-left:auto}#reset-button{font-family:inherit;font-size:inherit;padding:5px 14px;background:#2a2d33;border:1px solid #3e424c;border-radius:5px;cursor:pointer;color:#c8a96e;letter-spacing:.04em;transition:background .12s,border-color .12s,color .12s;box-shadow:inset 0 1px #ffffff0f,0 2px 4px #0006}#reset-button:hover{background:#33373f;border-color:#c8a96e;color:#ffd080}#reset-button:active{background:#1e2126;box-shadow:inset 0 2px 4px #00000080}#share-button{padding:5px 8px;background:#2a2d33;border:1px solid #3e424c;border-radius:5px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .12s,border-color .12s;box-shadow:inset 0 1px #ffffff0f,0 2px 4px #0006}#share-button:hover{background:#33373f;border-color:#c8a96e}#share-button img{filter:invert(72%) sepia(30%) saturate(600%) hue-rotate(5deg) brightness(105%)}#flash-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#fff;opacity:0;pointer-events:none;z-index:999}@keyframes cam-flash{0%{opacity:.15}to{opacity:0}}#flash-overlay.flash-active{animation:cam-flash .12s ease-out forwards}