/* ChatBase — Arcade pack 2 (arcade3.js). Reuses .dg-entry / .du-modal / .a2-box. */
.sn-cv { width: 100%; max-width: 300px; aspect-ratio: 1; border-radius: 12px; background: #15151f; touch-action: none; display: block; margin: 8px auto; }

.ms-grid { display: grid; grid-template-columns: repeat(9, 1fr); gap: 3px; margin: 10px 0; max-width: 340px; margin-inline: auto; }
.ms-cell { aspect-ratio: 1; border: none; border-radius: 4px; background: rgba(255,255,255,.12); cursor: pointer; font-weight: 800; font-size: clamp(11px, 3.2vw, 15px); display: flex; align-items: center; justify-content: center; padding: 0; }
.ms-cell.ms-open { background: rgba(255,255,255,.04); cursor: default; }
.ms-n1 { color: #8ab4ff; } .ms-n2 { color: #5ef0c0; } .ms-n3 { color: #ff8aa0; } .ms-n4 { color: #b69cff; } .ms-n5 { color: #ffc46b; } .ms-n6 { color: #ff8c43; } .ms-n7 { color: #ff5f6d; } .ms-n8 { color: #fff; }

.wk-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin: 12px auto; max-width: 300px; }
.wk-hole { aspect-ratio: 1; border: none; border-radius: 50%; background: radial-gradient(circle at 50% 70%, #3a2a1a, #1a1208); cursor: pointer; overflow: hidden; position: relative; }
.wk-mole { position: absolute; left: 15%; right: 15%; bottom: -60%; top: 100%; border-radius: 50% 50% 40% 40%; background: radial-gradient(circle at 50% 30%, #b07a4a, #7a4e28); transition: top .12s ease, bottom .12s ease; }
.wk-hole.wk-up .wk-mole { top: 18%; bottom: 8%; }
.wk-hole.wk-up .wk-mole::after { content: '🐹'; position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-size: clamp(22px, 7vw, 36px); }