/* Minensuche – ergänzt tetris.css (Spielstand, Knöpfe) */
.m-seite { max-width: 1000px; }
.m-leiste { display: flex; flex-wrap: wrap; gap: 18px 28px; align-items: flex-end; margin: 26px 0 16px; }
.m-stand { grid-template-columns: repeat(3, minmax(90px, 1fr)); margin: 0; }
.m-steuer { display: grid; gap: 10px; }
.m-steuer .t-knoepfe { margin: 0; }
.m-wahl { display: flex; align-items: center; gap: 10px; font-size: .7rem; letter-spacing: .14em; text-transform: uppercase; color: var(--soft); }
.m-wahl select { padding: 7px 8px; background: var(--panel); border: 1px solid var(--rule); color: #fff; font: inherit; font-size: .9rem; letter-spacing: 0; text-transform: none; }
.m-modus[aria-pressed="true"] { background: rgba(255, 194, 74, .16); border-color: #ffc24a; }
.m-rahmen { overflow-x: auto; padding-bottom: 6px; }
.m-feld { --zelle: 34px; display: grid; grid-template-columns: repeat(var(--spalten), var(--zelle)); gap: 2px; width: max-content; padding: 6px; background: var(--rule); border: 1px solid var(--rule); user-select: none; -webkit-user-select: none; -webkit-touch-callout: none; }
.m-feld.m-breit { --zelle: 28px; }
.m-zelle { width: var(--zelle); height: var(--zelle); padding: 0; border: 0; background: #2a3550; box-shadow: inset 0 2px 0 rgba(255, 255, 255, .12), inset 0 -2px 0 rgba(0, 0, 0, .35); color: #fff; font: 700 calc(var(--zelle) * .55)/1 var(--display); cursor: pointer; touch-action: manipulation; }
.m-zelle:hover { background: #34426a; }
.m-zelle:focus-visible { outline: 2px solid var(--volt); outline-offset: -2px; }
.m-zelle.offen { background: #0d1322; box-shadow: none; cursor: default; }
.m-zelle.fahne { color: #ffc24a; }
.m-zelle.mine { background: #8a97ab url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg stroke='%23000' stroke-width='2' stroke-linecap='round'%3E%3Cline x1='12' y1='2.5' x2='12' y2='21.5'/%3E%3Cline x1='2.5' y1='12' x2='21.5' y2='12'/%3E%3Cline x1='5.3' y1='5.3' x2='18.7' y2='18.7'/%3E%3Cline x1='18.7' y1='5.3' x2='5.3' y2='18.7'/%3E%3C/g%3E%3Ccircle cx='12' cy='12' r='6.6' fill='%23000'/%3E%3Ccircle cx='9.6' cy='9.6' r='1.8' fill='%23fff'/%3E%3C/svg%3E") center / 72% no-repeat; }
.m-zelle.mine.getroffen { background-color: #e74c3c; }
.m-zelle.falsch { background: #5a2a2a; }
.m-zelle.falsch::after { content: '✕'; color: #ff8f7a; }
/* Zahlen: jede Ziffer ihre Farbe, wie gewohnt; die Ziffer selbst steht immer da */
.z1 { color: #6fa8ff !important; } .z2 { color: #5fe08a !important; } .z3 { color: #ff6b57 !important; } .z4 { color: #c39bff !important; }
.z5 { color: #ffa94d !important; } .z6 { color: #2fb3c4 !important; } .z7 { color: #ffffff !important; } .z8 { color: #8a97ab !important; }
.m-meldung { min-height: 1.4em; margin: 12px 0 6px; color: #fff; font: 500 1.05rem/1.3 var(--display); }
@media (max-width: 640px) {
  .m-feld { --zelle: calc((100vw - 32px - 14px - 2px * (var(--spalten) - 1)) / var(--spalten)); }
  .m-feld.m-breit { --zelle: 26px; }
}