/* Shut the box */
.stb-board { text-align: center; }
.stb-tiles { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; margin: 4px 0 14px; }
.stb-tile { width: 46px; height: 64px; border-radius: 8px; border: 2px solid var(--c-line); background: var(--surface-2); color: var(--text); font: 700 22px/1 var(--mono, monospace); cursor: pointer; transition: transform .15s, opacity .15s; }
.stb-tile.is-shut { opacity: .18; transform: translateY(6px) scaleY(.6); cursor: default; }
.stb-tile.is-sel { border-color: var(--c-accent); color: var(--c-accent); }
.stb-tile.is-hint { box-shadow: 0 0 0 3px var(--c-accent); }
.stb-tile:disabled { cursor: default; }
.stb-dice { display: flex; justify-content: center; gap: 10px; min-height: 52px; }
.stb-die { width: 48px; height: 48px; border-radius: 10px; background: #f4f4f4; color: #111; font: 800 24px/48px var(--mono, monospace); }
.stb-msg { min-height: 1.4em; margin: 10px 0; }
.stb-act { justify-content: center; flex-wrap: wrap; }
.stb-opts { margin-top: 14px; }
@media (max-width: 480px) { .stb-tile { width: 30px; height: 50px; font-size: 17px; } }
.stb .cc-btn.is-hint { box-shadow: 0 0 0 3px var(--c-accent); }