*{box-sizing:border-box}body{margin:0;background:#e5ecee;color:#16384b;font:16px/1.5 system-ui}main{max-width:960px;margin:auto;padding:24px}header p:first-child{letter-spacing:.16em;font-size:12px}h1{font:56px Georgia;margin:8px 0}h2{font:25px Georgia}section{padding:24px;background:#fffdf7;border:1px solid #bacdd0;border-radius:22px}.bar{display:flex;flex-wrap:wrap;gap:8px;align-items:center}button,select{font:inherit;border:1px solid #789aa7;border-radius:8px;background:#fffdf7;color:#16384b;min-height:44px;padding:8px 12px;cursor:pointer}button:disabled{opacity:.45;cursor:default}button:focus-visible{outline:3px solid #d09c3d}#commit{background:#1c5364;color:white}#board{position:relative;aspect-ratio:600/450;margin:16px 0;background:#d9e9ee url(vellum.webp) center/cover;border:1px solid #abc3cb;border-radius:12px}#board svg{position:absolute;width:100%;height:100%}.point{position:absolute;transform:translate(-50%,-50%);width:38px;height:38px;min-height:38px;padding:0;border-radius:50%;background:#fffdf8;border:2px solid #1e5366;font-weight:bold;font-size:13px}.point.selected{background:#1e5366;color:white}.point.peeled{opacity:.35;pointer-events:none}#status,#feedback{font-weight:650}footer,details{margin:20px 0;font-size:14px}[hidden]{display:none!important}@media(max-width:600px){main{padding:12px}section{padding:12px}h1{font-size:42px}h2{font-size:22px}.point{width:30px;height:30px;min-height:30px;font-size:11px}.bar button{flex:1}#board{aspect-ratio:600/500}}