/* Snake — board, overlay, score */
.snake-stage-wrap { gap: 0.75rem; align-items: center; }
.snake-stage { position: relative; width: 100%; max-width: 560px; display: flex; justify-content: center; }
.snake-canvas { display: block; border-radius: var(--radius-md); border: 1px solid var(--border); touch-action: none; user-select: none; -webkit-user-select: none; cursor: pointer; }
.snake-overlay { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0.35rem; text-align: center; padding: 1rem; border-radius: var(--radius-md); background: color-mix(in srgb, var(--surface) 72%, transparent); backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px); pointer-events: none; }
.snake-overlay[hidden] { display: none; }
.snake-overlay strong { font-size: clamp(1.4rem, 5cqw, 2.4rem); font-weight: 300; letter-spacing: -0.02em; color: var(--text-primary); }
.snake-overlay span { font-size: 0.86rem; color: var(--text-secondary); }
.snake-score { display: inline-flex; align-items: baseline; gap: 0.4rem; font-family: var(--font-mono); font-size: 1rem; font-weight: 600; color: var(--text-primary); }
.snake-score i { font-style: normal; color: var(--text-muted); }
.snake-best { font-size: 0.8rem; font-weight: 400; color: var(--text-secondary); }
.snake-best b { font-weight: 600; color: var(--text-primary); }
.snake-hint { text-align: center; }