:root{--tekst: #f4f6f2;--tekst-zacht: #b9c4b8;--paneel: rgb(18 24 20 / .82);--rand: rgb(255 255 255 / .14);color-scheme:dark}*{box-sizing:border-box;margin:0}html,body,#app{height:100%}body{overflow:hidden;font-family:ui-rounded,SF Pro Rounded,Segoe UI,system-ui,sans-serif;color:var(--tekst);background:#9fd8ea;overscroll-behavior:none;touch-action:none;-webkit-user-select:none;user-select:none}.scherm{position:relative;height:100%}.doek{display:block;width:100%;height:100%}.hud{position:absolute;top:max(1rem,env(safe-area-inset-top));left:50%;transform:translate(-50%);display:flex;align-items:baseline;gap:.3rem;pointer-events:none;text-shadow:0 3px 0 rgb(0 0 0 / .35)}.meters{font-size:clamp(2.5rem,8vw,4rem);font-weight:800;font-variant-numeric:tabular-nums;line-height:1}.eenheid{font-size:1.25rem;opacity:.75}.beste{margin-left:.75rem;align-self:center;font-size:.85rem;opacity:.7}.overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;padding:1.25rem;background:#00000059;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}.paneel{display:flex;flex-direction:column;align-items:center;gap:.85rem;width:min(26rem,100%);max-height:100%;overflow-y:auto;padding:1.75rem 1.5rem;border:2px solid var(--rand);border-radius:1.1rem;background:var(--paneel);text-align:center}h1{font-size:clamp(2rem,8vw,3rem);letter-spacing:-.02em;text-shadow:0 4px 0 rgb(0 0 0 / .25)}h2{font-size:1.5rem}.tagline,.note{color:var(--tekst-zacht);font-size:.9rem}.note.hint{font-size:.8rem;opacity:.65}.eindscore{font-size:3.5rem;font-weight:800;line-height:1;font-variant-numeric:tabular-nums}.eindscore span{font-size:1.25rem;font-weight:400;opacity:.7}.record{padding:.2rem .7rem;border-radius:999px;background:#f0b429;color:#23252b;font-weight:700;font-size:.85rem}button{font:inherit;color:inherit;cursor:pointer;border:2px solid transparent;border-radius:.7rem;transition:transform .08s,background .15s,border-color .15s}button:active{transform:translateY(2px)}button:focus-visible{outline:3px solid #7ec850;outline-offset:2px}.groot{width:100%;padding:.85rem;background:#4a9d5f;border-color:#3d8450;font-size:1.15rem;font-weight:700;box-shadow:0 4px #2f6a3f}.groot:hover{background:#55b06b}.klein{padding:.45rem .9rem;background:transparent;border-color:var(--rand);font-size:.9rem;color:var(--tekst-zacht)}.klein:hover{border-color:#ffffff59}.kiezer{display:grid;grid-template-columns:repeat(auto-fit,minmax(4.5rem,1fr));gap:.5rem;width:100%}.figuur{display:flex;flex-direction:column;align-items:center;gap:.15rem;padding:.6rem .35rem;background:#ffffff0f;border-color:var(--rand);font-size:.8rem}.figuur:hover:not(:disabled){background:#ffffff1f}.figuur.actief{border-color:#7ec850;background:#7ec8502e}.figuur:disabled{cursor:not-allowed;opacity:.45}.figuur .slot{font-size:.68rem;opacity:.7}