/* «Мины»: поле 5×5 в общей сине-голубой гамме. Подключается после home.css. */

#screen-mines { padding:4px 12px 12px; }
.app.mines-view .back-home { display:flex; }

.mines-stats { display:flex; gap:0; margin:0 0 8px; padding:7px 4px; border-radius:16px;
  background:linear-gradient(var(--panel-top, #163b61f2), var(--panel-bottom, #0a2442f2)); border:1px solid var(--panel-border, #7fb4e699); }
.mines-stats .stat-pill { background:none; border:0; border-right:1px solid var(--panel-inner-border, #6f9fcf55); border-radius:0; }
.mines-stats .stat-pill:last-child { border-right:0; }

/* Шкала множителей по шагам */
.mines-steps { display:flex; gap:6px; overflow-x:auto; scrollbar-width:none; padding:2px 2px 8px; }
.mines-steps::-webkit-scrollbar { display:none; }
.m-step { flex:0 0 auto; font-size:12px; font-weight:900; padding:5px 9px; border-radius:9px; color:#9fc7e6;
  background:#0d2c4f; border:1px solid #2f5b85; transition:background-color .3s ease, color .3s ease, border-color .3s ease; }
.m-step.done { color:#d9f3ff; background:#1a4f80; border-color:#4f8fc6; }
.m-step.next { color:#062a47; background:linear-gradient(var(--btn-top, #9adbff), var(--btn-mid, #3aa6f2)); border-color:var(--btn-border, #c3e8ff); }

/* Поле */
.mines-board-wrap { position:relative; }
.mines-board { display:grid; grid-template-columns:repeat(5, 1fr); gap:8px; padding:10px; border-radius:20px;
  background:linear-gradient(160deg, #123a63, #081f3b); border:1px solid #4f86bb88; box-shadow:inset 0 2px 10px #00000040; }
.tile {
  position:relative; aspect-ratio:1; border-radius:13px; display:flex; align-items:center; justify-content:center;
  background:linear-gradient(160deg, #2c6fa8, #174a7a 60%, #10365c); border:1px solid #6fa8dd88;
  box-shadow:inset 0 2px #ffffff30, 0 3px #0a2846; font-size:0; perspective:400px;
  transition:transform .2s var(--ease-out-soft, ease), background .3s ease, opacity .3s ease, box-shadow .3s ease;
}
.tile:not(:disabled):active { transform:scale(.94); }
.tile:disabled { cursor:default; }
.tile.pressing { transform:scale(.94); filter:brightness(1.05); }
.tile span { font-size:28px; line-height:1; filter:drop-shadow(0 2px 3px #00000055); }
.tile.open { box-shadow:inset 0 2px 8px #00000040; }
.tile.gem { background:radial-gradient(circle at 50% 40%, #3fd0ff55, transparent 70%), linear-gradient(160deg, #1d5a8e, #0d3256); border-color:#7fd8ff; }
.tile.boom { background:radial-gradient(circle at 50% 45%, #ff8a5c, #c2361f 60%, #7a1a10); border-color:#ffb08a; }
.tile.dim { opacity:.45; background:#0d2c4f; border-color:#2f5b85; box-shadow:none; }
.tile.dim span { font-size:22px; }

/* Итог поверх поля */
.mines-banner {
  position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); z-index:3; pointer-events:none;
  min-width:200px; padding:14px 18px; border-radius:18px; text-align:center; font-size:16px; font-weight:900; color:#fff;
  box-shadow:0 10px 30px #0008;
}
.mines-banner b { display:block; font-size:26px; margin-top:4px; }
.mines-banner small { display:block; font-size:13px; font-weight:800; opacity:.85; margin-top:2px; }
.mines-banner.win { background:linear-gradient(160deg, #2aa7e8ee, #135c9eee); border:1px solid #b9e6ff; }
.mines-banner.lose { background:linear-gradient(160deg, #e2533aee, #8e2416ee); border:1px solid #ffb08a; }

/* Панель */
.mines-panel { margin-top:10px; padding:10px; border-radius:18px; display:flex; flex-direction:column; gap:8px;
  background:var(--panel-bottom, #0a2442f2); border:1px solid var(--panel-border, #7fb4e699); }
.mines-row { display:flex; align-items:center; gap:8px; }
.m-lbl { flex:0 0 46px; font-size:11px; font-weight:800; color:#abcde8; }
.m-stepper { display:flex; align-items:center; gap:2px; background:#0a2238; border:1px solid var(--field-border, #44739f); border-radius:10px; }
.m-stepper button { width:28px; height:32px; font-size:18px; font-weight:900; color:#d9eeff; }
.m-stepper button:disabled, .m-presets .chip:disabled { opacity:.45; }
.m-stepper b { min-width:22px; text-align:center; font-size:15px; color:#fff; }
.m-presets { display:flex; gap:5px; flex:1; min-width:0; }
.m-presets .chip { flex:1; padding:7px 0; text-align:center; font-size:12px; border-radius:9px;
  background:var(--field-bg, #173b5e); border:1px solid var(--field-border, #44739f); color:var(--field-text, #d9eeff); }
.m-presets .chip.active { background:var(--chip-on, #17507a); border-color:var(--chip-on-border, #7fcaff); color:#fff; }
.m-bet { width:64px; height:32px; border-radius:9px; padding:0 8px; font-weight:900; font-size:13px; color:#eef8ff;
  background:#0a2238; border:1px solid var(--field-border, #44739f); outline:none; }
.m-action { height:46px; width:100%; font-size:16px; font-weight:900; display:flex; }
.m-action[hidden] { display:none; }
#screen-mines .btn-cashout { justify-content:center; align-items:center; }

.live-gem { font-style:normal; font-size:24px; line-height:28px; }
.game-card.mines .gc-badge { color:#7a3fd0; }

@media (max-height:700px) { .tile span { font-size:22px; } .mines-board { gap:6px; padding:8px; } }