.ms{--ms-0: #e2483b;--ms-1: #2f7de1;--ms-2: #22a35a;--ms-3: #f0a722;--ms-4: #8c4de0;--ms-5: #14a5a5;--ms-6: #e0559c;--ms-7: #7a8a1f;--ms-8: #5a6b8c;max-width:520px;margin:0 auto;width:100%;display:grid;gap:12px;justify-items:center}.ms-msg{font-size:1.15rem;font-weight:700;text-align:center;min-height:1.6em}.ms-progress{display:flex;flex-wrap:wrap;gap:4px;justify-content:center;min-height:10px;max-width:100%}.ms-step{width:10px;height:10px;border-radius:50%;border:2px solid var(--accent)}.ms-step-done{background:var(--accent)}.ms-board{display:grid;gap:12px;width:min(100%,440px)}.ms-board-4{grid-template-columns:repeat(2,1fr)}.ms-board-6,.ms-board-9{grid-template-columns:repeat(3,1fr)}.ms-pad{--c: var(--ms-0);position:relative;aspect-ratio:1;border-radius:22%;border:3px solid color-mix(in srgb,var(--c) 70%,#000);background:color-mix(in srgb,var(--c) 55%,var(--surface));color:color-mix(in srgb,var(--c) 30%,#000);cursor:pointer;display:grid;place-items:center;padding:0;touch-action:manipulation;-webkit-tap-highlight-color:transparent;user-select:none;-webkit-user-select:none;transition:transform .08s,filter .08s,box-shadow .08s;filter:saturate(.75) brightness(.92)}.ms-pad:focus-visible{outline:3px solid var(--focus);outline-offset:3px}.ms-shape{font-size:clamp(1.8rem,9vw,3.2rem);line-height:1;opacity:.75}.ms-pad kbd{position:absolute;bottom:6px;right:9px;font-size:.7rem;font-family:var(--mono);opacity:.6}.ms-lit{background:var(--c);filter:saturate(1.2) brightness(1.25);transform:scale(1.05);box-shadow:0 0 0 4px color-mix(in srgb,var(--c) 45%,transparent),0 0 28px var(--c)}.ms-lit .ms-shape{opacity:1;color:#fff}.ms-wrong{outline:4px solid var(--bad);outline-offset:2px}.ms-hint{animation:ms-hint .4s ease-in-out 3}@keyframes ms-hint{50%{transform:scale(1.08);box-shadow:0 0 0 5px var(--good)}}.ms-locked .ms-pad{cursor:default}.ms-start{min-width:160px;min-height:48px;font-size:1.05rem}.ms-start[hidden]{display:none}.ms-pad-0{--c: var(--ms-0)}.ms-pad-1{--c: var(--ms-1)}.ms-pad-2{--c: var(--ms-2)}.ms-pad-3{--c: var(--ms-3)}.ms-pad-4{--c: var(--ms-4)}.ms-pad-5{--c: var(--ms-5)}.ms-pad-6{--c: var(--ms-6)}.ms-pad-7{--c: var(--ms-7)}.ms-pad-8{--c: var(--ms-8)}@media (hover: none){.ms-pad kbd{display:none}}@media (prefers-reduced-motion: reduce){.ms-pad{transition:none}.ms-lit{transform:none}.ms-hint{animation:none;box-shadow:0 0 0 5px var(--good)}}