/* Mines: a 5×5 field of glassy tiles; gems glow green, the hit mine flashes pink, the rest is revealed dimmed. */
.mines-screen { align-content: start; gap: 14px; }
.mgrid {
  display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: clamp(6px, 1vw, 10px);
  width: 100%; max-width: 470px; margin: 0 auto;
}
.tile {
  position: relative; display: block; aspect-ratio: 1; min-width: 0; padding: 0; border: 0; border-radius: clamp(10px, 1.4vw, 14px); cursor: pointer;
  background: linear-gradient(180deg, #3a3370, #2a2457); color: var(--mute);
  box-shadow: 0 5px 0 #1a1640, 0 0 0 1px rgba(190, 180, 255, 0.16) inset, 0 10px 20px -12px rgba(0, 0, 0, 0.8);
  transition: transform 120ms var(--ease), background 200ms var(--ease), box-shadow 200ms var(--ease), filter var(--fast);
}
.tile::after { content: ""; position: absolute; inset: 3px 3px 55% 3px; border-radius: inherit; background: linear-gradient(180deg, rgba(255, 255, 255, 0.16), transparent); pointer-events: none; }
.tile:not([aria-disabled="true"]):hover { transform: translateY(-2px); filter: brightness(1.15); box-shadow: 0 7px 0 #1a1640, 0 0 0 1px rgba(177, 140, 255, 0.55) inset, 0 0 22px -6px rgba(139, 92, 255, 0.8); }
.tile:not([aria-disabled="true"]):active, .tile.is-pressing { transform: translateY(4px); box-shadow: 0 1px 0 #1a1640, 0 0 0 1px rgba(177, 140, 255, 0.4) inset; }
.tile.is-idle { cursor: default; filter: saturate(0.6) brightness(0.85); }
.tile[aria-disabled="true"] { cursor: default; }
.tile-face { position: absolute; inset: 18%; display: grid; place-items: center; }
.tile-ico { position: absolute; inset: 0; width: 100%; height: 100%; }
.tile.is-gem { background: radial-gradient(circle at 50% 40%, rgba(31, 224, 138, 0.35), rgba(11, 157, 94, 0.18) 70%), #10241e;
  box-shadow: 0 2px 0 #08301f, 0 0 0 1px rgba(31, 224, 138, 0.55) inset, 0 0 24px -6px rgba(31, 224, 138, 0.8); animation: tile-pop 380ms var(--ease); }
.tile.is-gem .tile-ico { color: #4cfbae; --gi-b: #eafff4; filter: drop-shadow(0 0 8px rgba(31, 224, 138, 0.8)); }
.tile.is-hit { background: radial-gradient(circle, rgba(255, 61, 110, 0.6), rgba(194, 24, 74, 0.35)), #2a0b18;
  box-shadow: 0 2px 0 #4a0b20, 0 0 0 2px var(--lose) inset, 0 0 30px -2px rgba(255, 61, 110, 0.9); animation: tile-shake 420ms var(--ease); }
.tile.is-hit .tile-ico, .tile.is-mine .tile-ico { color: var(--lose); --gi-b: #ffd0dc; }
.tile.is-mine { background: #1a1235; box-shadow: 0 2px 0 #120d26, 0 0 0 1px rgba(255, 61, 110, 0.35) inset; animation: tile-pop 380ms var(--ease); }
.tile.is-rest { background: #15122e; box-shadow: 0 2px 0 #0d0b20, 0 0 0 1px var(--line) inset; }
.tile.is-rest .tile-ico { color: #4cfbae; opacity: 0.32; }
@keyframes tile-pop { 0% { transform: scale(0.82); } 60% { transform: scale(1.06); } 100% { transform: none; } }
@keyframes tile-shake { 0%, 100% { transform: none; } 20% { transform: translateX(-5px) rotate(-3deg); } 40% { transform: translateX(5px) rotate(3deg); } 60% { transform: translateX(-3px); } 80% { transform: translateX(3px); } }
.play-mines .field-profit .readonly { color: var(--gold); background: rgba(255, 201, 64, 0.07); box-shadow: 0 0 0 1px rgba(255, 201, 64, 0.3) inset; }
#m-random { min-height: 42px; }
