*,:before,:after{box-sizing:border-box}html,body,#root{color:#2a2118;background:#f4e2c4;min-height:100dvh;margin:0;font-family:Avenir Next,Trebuchet MS,Segoe UI,sans-serif}body{padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}.page{width:min(100%,72rem);margin:0 auto;padding:.75rem}.stage{width:100%}.view{touch-action:none;border-radius:1.25rem;width:100%;height:min(72dvh,640px);position:relative;overflow:hidden}.view canvas{touch-action:none;width:100%;height:100%;display:block}.hud{pointer-events:none;justify-content:space-between;gap:.5rem;font-weight:700;display:flex;position:absolute;top:.75rem;left:.75rem;right:.75rem}.hud span{background:#ffffffe0;border-radius:999px;padding:.35rem .7rem}.win{background:#fff;border-radius:1rem;margin:0;padding:.8rem 1rem;font-weight:700;position:absolute;bottom:1rem;left:50%;transform:translate(-50%);box-shadow:0 8px 24px #2a211829}.board-panel{margin-top:.75rem}.name-row{gap:.5rem;margin-top:.75rem;display:flex}.name-row input{border:2px solid #e4d3b8;border-radius:.8rem;flex:1;min-width:0;padding:.7rem .8rem;font-size:16px}.name-row button,.scores{font:inherit}.name-row button{color:#fff;background:#e23b2f;border:0;border-radius:.8rem;min-height:44px;padding:0 1rem;font-weight:700}.note{min-height:1.2rem;margin:.4rem 0 0}.scores{border-collapse:collapse;background:#fff;border-radius:1rem;width:100%;overflow:hidden}.scores th,.scores td{text-align:left;padding:.55rem .7rem}.scores tr.yours{background:#fff3c4}@media (height<=500px) and (orientation:landscape){.view{height:calc(100dvh - 1.5rem)}}@media (width>=900px){.page{grid-template-columns:minmax(0,40rem) minmax(16rem,1fr);align-items:start;gap:1rem;display:grid}.view{max-width:40rem;height:min(80dvh,720px)}.board-panel{margin-top:0}}