/* ===== V37 Mines redesign: top row + ONE container (control panel | board), Moonclutch dark palette, muted gold ===== */
#moon-mines{container-type:inline-size;width:100%}
.mn{--bg:#0D0F13;--pn:#12151B;--area:#171A20;--tile:#1F232B;--tile-h:#272B35;--sym:#2D323D;--ln:#2A2F38;--tx:#F2F3F5;--mu:#949BA6;--ac:#8591C8;--gd:#D9AE55;--gdbg:#3c3222;--gdtx:#F1DFB5;--rd:#E5534B;--or:#E8833A;--btn:#1F232B;color:var(--tx);display:grid;gap:10px;max-width:1280px;margin:0 auto;padding:0 0 30px;font-size:14px}
.mn button,.mn input{font:inherit}.mn button{cursor:pointer}.mn [hidden]{display:none!important}
.mn button:disabled,.mn input:disabled{cursor:not-allowed}
/* top row */
.mn-top{display:flex;justify-content:space-between;align-items:center;gap:10px}
.mn-title{display:flex;align-items:center;gap:10px;height:40px;padding:0 16px 0 12px;background:#221E16;border-radius:8px;font-weight:700;font-size:15px}
.mn-title-ic svg{width:18px;height:18px;fill:var(--gd);display:block}
.mn-top-r{display:flex;align-items:center;gap:8px}
.mn-fairbtn{display:flex;align-items:center;gap:8px;height:40px;padding:0 16px 0 12px;background:#1d2027;border-radius:8px;color:#aab0bb;font-weight:700;font-size:14px;text-decoration:none;transition:background .15s,color .15s}
.mn-fairbtn svg{width:18px;height:18px}.mn-fairbtn:hover{background:#252932;color:var(--tx)}
.mn-sound{display:flex;align-items:center;gap:8px}.mn-ic{width:40px;height:40px;border:0;background:#1d2027;color:var(--tx);border-radius:8px;font-size:15px}.mn-ic:hover{background:#252932}
.mn-sound input[type=range]{width:70px;accent-color:var(--gd);height:4px}
/* one container */
.mn-main{display:grid;grid-template-columns:clamp(290px,29%,440px) minmax(0,1fr);background:var(--area);border-radius:10px;overflow:hidden;min-height:560px}
.mn-panel{display:flex;flex-direction:column;gap:0;padding:clamp(16px,2.4cqw,28px) clamp(16px,2.4cqw,28px) 18px;background:var(--pn);border-right:1px solid #1d2128;min-width:0;position:relative}
.mn-lab{font-size:14px;font-weight:700;color:#9aa1ad;margin:0 0 8px}.mn-panel .mn-lab:not(:first-child){margin-top:22px}
/* bet amount */
.mn-field{display:flex;align-items:center;gap:10px;height:54px;padding:0 14px;background:var(--pn);border:2px solid #232831;border-radius:9px;transition:border-color .15s}
.mn-field:focus-within{border-color:#3a4150}
.mn-coin{display:inline-grid;width:28px;height:28px;flex:none}.mn-coin svg{width:100%;height:100%}.mn-coin.sm{width:15px;height:15px;display:inline-block;vertical-align:-2px;margin-right:4px;font-style:normal}
#app .mn-field input{flex:1;min-width:0;width:100%;height:100%;background:transparent!important;border:0!important;outline:0;box-shadow:none!important;color:var(--tx);font-weight:700;font-size:18px;padding:0!important;margin:0}
.mn-x{border:0;background:transparent;color:#9aa1ad;font-size:16px;width:28px;height:28px;border-radius:6px}.mn-x:hover:not(:disabled){color:var(--tx);background:#1d2128}
.mn-quick{display:grid;grid-template-columns:repeat(4,1fr);gap:3px;margin-top:12px}
.mn-quick button{height:50px;border:0;background:var(--btn);color:#aab0bb;font-weight:700;font-size:15px;transition:background .15s,color .15s}
.mn-quick button:first-child{border-radius:6px 0 0 6px}.mn-quick button:last-child{border-radius:0 6px 6px 0}
.mn-quick button:hover:not(:disabled){background:#2a2f39;color:var(--tx)}
/* grid buttons */
.mn-grids{display:grid;grid-template-columns:repeat(5,1fr);gap:5px}
.mn-grids button{height:50px;border:0;border-radius:6px;background:var(--btn);color:#9aa1ad;font-weight:800;font-size:15px;transition:background .15s,color .15s}
.mn-grids button:hover:not(:disabled):not(.on){background:#2a2f39;color:var(--tx)}
.mn-grids button.on{background:var(--gdbg);color:var(--gdtx)}.mn .mn-grids button.on:disabled{opacity:1}
.mn-grids button:disabled:not(.on){opacity:.55}
/* mines slider */
.mn-minerow{display:flex;align-items:center;gap:10px;height:54px;padding:0 16px 0 14px;background:var(--btn);border-radius:6px}
.mn-bomb svg{width:24px;height:24px;display:block}
#app .mn-minerow input[type=number]{width:40px!important;flex:none;height:34px;background:transparent!important;border:0!important;outline:0;box-shadow:none!important;color:var(--tx);font-weight:800;font-size:17px;text-align:center;padding:0!important;-moz-appearance:textfield;appearance:textfield}
.mn-minerow input[type=number]::-webkit-outer-spin-button,.mn-minerow input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
#app .mn-minerow input[type=range]{-webkit-appearance:none!important;appearance:none!important;flex:1;min-width:0;width:auto!important;height:24px!important;min-height:0!important;margin:0;padding:0!important;border:0!important;background:transparent!important;outline:none;touch-action:pan-y}
#app .mn-minerow input[type=range]::-webkit-slider-runnable-track{height:5px;border-radius:3px;background:#0f1115}
#app .mn-minerow input[type=range]::-moz-range-track{height:5px;border-radius:3px;background:#0f1115}
#app .mn-minerow input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:26px;height:26px;margin-top:-10.5px;border-radius:50%;border:0;cursor:pointer;background:linear-gradient(90deg,transparent 9px,#6e1f22 9px 11px,transparent 11px 15px,#6e1f22 15px 17px,transparent 17px),var(--rd)}
#app .mn-minerow input[type=range]::-moz-range-thumb{width:26px;height:26px;border-radius:50%;border:0;cursor:pointer;background:linear-gradient(90deg,transparent 9px,#6e1f22 9px 11px,transparent 11px 15px,#6e1f22 15px 17px,transparent 17px),var(--rd)}
#app .mn-minerow input[type=range]:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 3px rgba(229,83,75,.35)}
.mn-minerow input:disabled{opacity:.55}
/* play / cashout */
.mn-go{margin-top:30px;height:66px;border:0;border-radius:6px;background:var(--gd);color:#241b08;font-weight:800;font-size:18px;transition:filter .15s,transform .1s}
.mn-go:hover:not(:disabled){filter:brightness(1.06)}.mn-go:active:not(:disabled){transform:translateY(1px)}
.mn-go.cash{font-size:15px;letter-spacing:.01em}.mn-go:disabled{background:#4a4130;color:#a79a7a}
.mn-btn{margin-top:8px;height:46px;border:0;background:var(--btn);color:var(--tx);border-radius:6px;font-weight:700;font-size:14px;transition:background .15s}.mn-btn:hover:not(:disabled){background:#2a2f39}
.mn-btn.gold{background:var(--gd);color:#241b08}.mn-btn.gold:hover:not(:disabled){background:#e3b85f}
.mn-row2{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-top:8px}.mn-row2 .mn-btn{margin-top:0}
.mn-next{min-height:20px;margin-top:12px;font-size:13px;color:var(--mu)}.mn-next b{color:var(--gd);font-variant-numeric:tabular-nums}.mn-next em{font-style:normal;color:var(--tx)}
.mn-msg{min-height:18px;font-size:13px;color:var(--mu)}.mn-msg.bad{color:var(--rd)}
/* max win, pinned to the bottom of the panel */
.mn-maxwin{margin-top:auto;padding-top:18px;display:flex;justify-content:space-between;align-items:flex-end;gap:10px}
.mn-maxwin span{display:block;font-size:13px;font-weight:700;color:#9aa1ad;margin-bottom:3px}.mn-maxwin b{font-size:17px;font-weight:800;font-variant-numeric:tabular-nums}.mn-maxwin em{font-style:normal}
.mn-info{width:50px;height:50px;flex:none;border:2px solid #232831;border-radius:8px;background:transparent;color:var(--tx);font-weight:800;font-size:17px;font-family:Georgia,serif;font-style:italic}.mn-info:hover{background:#1d2128}
.mn-pop{position:absolute;left:16px;right:16px;bottom:84px;padding:12px 14px;background:#1b1f26;border:1px solid var(--ln);border-radius:8px;font-size:12.5px;line-height:1.5;color:#c3c8d1;box-shadow:0 10px 24px rgba(0,0,0,.45);z-index:5}.mn-pop b{color:var(--tx)}
/* board area: grid centred, big square tiles, sizes derived from the available width AND height */
.mn-play{display:grid;place-items:center;padding:clamp(14px,3cqw,40px);min-width:0}
.mn-bwrap{width:min(100%,max(340px,calc(100vh - 190px)),820px);container-type:inline-size}
.mn-board{--g:5;--gap:2cqw;display:grid;grid-template-columns:repeat(var(--g),minmax(0,1fr));gap:var(--gap);width:100%}
.mn-board[data-n="4"]{--gap:2.4cqw}.mn-board[data-n="5"]{--gap:2cqw}.mn-board[data-n="6"]{--gap:1.7cqw}.mn-board[data-n="7"]{--gap:1.4cqw}.mn-board[data-n="8"]{--gap:1.2cqw}
.mn-tile{position:relative;aspect-ratio:1/1;width:100%;padding:0;border:0;background:transparent;border-radius:9%;perspective:700px;transition:transform .15s ease;-webkit-tap-highlight-color:transparent;min-width:0}
.mn-in{position:absolute;inset:0;display:block;transform-style:preserve-3d;transition:transform 240ms cubic-bezier(.3,.7,.3,1);border-radius:inherit}
.mn-front,.mn-back{position:absolute;inset:0;display:grid;place-items:center;border-radius:inherit;backface-visibility:hidden;-webkit-backface-visibility:hidden;box-sizing:border-box}
.mn-front{background:var(--tile);transition:background-color .15s}
.mn-front svg{width:50%;height:50%;fill:var(--sym);transition:fill .15s}
.mn-back{transform:rotateY(180deg);background:var(--tile)}
.mn-back svg{width:60%;height:60%}
.mn[data-phase="active"] .mn-tile:not(.open):not(.pending):hover{transform:translateY(-2px)}
.mn[data-phase="active"] .mn-tile:not(.open):hover .mn-front{background-color:var(--tile-h)}
.mn[data-phase="active"] .mn-tile:not(.open):hover .mn-front svg{fill:#3a4150}
.mn[data-phase="active"] .mn-tile:not(.open){cursor:pointer}
.mn[data-phase="idle"] .mn-tile,.mn[data-phase="over"] .mn-tile{cursor:default}
.mn-tile:focus-visible .mn-front{box-shadow:inset 0 0 0 2px rgba(217,174,85,.55)}
.mn-tile.pending .mn-front{background-color:var(--tile-h)}
.mn-tile.open .mn-in{transform:rotateY(180deg)}.mn-tile.instant .mn-in{transition:none}
.mn .mn-tile:disabled{opacity:1;cursor:default}
.mn-tile.safe .mn-back{box-shadow:inset 0 0 0 2px var(--gd);background:radial-gradient(circle at 50% 42%,rgba(217,174,85,.13),var(--tile) 72%)}
.mn-tile.safe:not(.ghost) .mn-back{animation:mnGlow 650ms ease-out 1}
@keyframes mnGlow{0%{filter:none}35%{filter:drop-shadow(0 0 10px rgba(217,174,85,.45))}100%{filter:none}}
.mn-tile.mine .mn-back{box-shadow:inset 0 0 0 2px #7b2f2b;background:radial-gradient(circle at 50% 42%,rgba(229,83,75,.28),#241517 72%)}
.mn-tile.mine.hit .mn-back{box-shadow:inset 0 0 0 2px var(--rd);background:radial-gradient(circle at 50% 42%,rgba(232,131,58,.42),#3b1514 72%)}
.mn-tile.hit{animation:mnShake 320ms ease-out 1 240ms}
@keyframes mnShake{0%,100%{transform:translateX(0)}20%{transform:translateX(-3px)}45%{transform:translateX(3px)}70%{transform:translateX(-2px)}}
.mn-tile.ghost{opacity:.8}.mn-tile.ghost.safe .mn-back{box-shadow:inset 0 0 0 1px rgba(217,174,85,.35);background:var(--tile)}.mn-tile.ghost.safe .mn-back svg{width:42%;height:42%;opacity:.8}
.mn-tile.ghost.mine .mn-back svg{width:50%;height:50%}
@media (prefers-reduced-motion:reduce){.mn-in{transition-duration:1ms}.mn-tile.hit{animation:none}.mn-tile.safe:not(.ghost) .mn-back{animation:none}.mn-tile{transition:none}}
/* below the container: result, probabilities, fairness details, history */
.mn-below{display:grid;gap:10px}
.mn-cols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.mn-box{background:var(--pn);border:1px solid #1d2128;border-radius:10px;padding:14px 16px;min-width:0}.mn-box .mn-lab{margin-top:0!important;font-size:12px;letter-spacing:.06em;text-transform:uppercase}
.mn-stats{display:grid;border:1px solid var(--ln);border-radius:8px;overflow:hidden;background:var(--bg)}
.mn-stats>div{display:flex;justify-content:space-between;gap:8px;padding:7px 10px;font-size:12.5px;border-top:1px solid var(--ln)}.mn-stats>div:first-child{border-top:0}
.mn-stats span{color:var(--mu)}.mn-stats b{font-variant-numeric:tabular-nums;text-align:right}.mn-stats:empty{display:none}
.mn-formula{font-size:12px;color:var(--mu);line-height:1.5;margin-top:10px}.mn-formula summary{cursor:pointer;font-weight:700}.mn-formula summary:hover{color:var(--tx)}
.mn-formula p{margin:6px 0 0}.mn-formula code{display:block;padding:5px 8px;background:var(--bg);border:1px solid var(--ln);border-radius:6px;color:var(--tx);font-size:12px;overflow-wrap:anywhere}
.mn-fair{display:grid;gap:8px;font-size:12px;color:var(--mu)}.mn-fair .mn-lab{margin:0!important}
.mn-hash{display:grid;gap:3px}.mn-hash span{font-size:11px}.mn-hash code{display:block;padding:5px 7px;background:var(--bg);border:1px solid var(--ln);border-radius:5px;color:var(--tx);font-size:11px;overflow-wrap:anywhere;line-height:1.35}
.mn-note{font-size:12px;line-height:1.4}.mn-link{color:var(--ac);font-size:12.5px;text-decoration:none;font-weight:700}.mn-link:hover{text-decoration:underline}
.mn-result{background:var(--pn);border:1px solid var(--ln);border-radius:10px;padding:12px 16px}
.mn-result[data-outcome="bust"]{border-color:#5a2a28}.mn-result[data-outcome="cashed"]{border-color:rgba(217,174,85,.5)}
.mn-res-h{display:flex;justify-content:space-between;font-size:15px;margin-bottom:8px}.mn-res-h .w{color:var(--gd)}.mn-res-h .l{color:var(--rd)}
.mn-result dl{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px 12px;margin:0}.mn-result dt{font-size:11px;color:var(--mu)}.mn-result dd{margin:2px 0 0;font-size:13.5px;font-weight:700;font-variant-numeric:tabular-nums}
.mn-hist{display:grid;gap:4px}.mn-hist:empty{display:none}.mn-hh{font-size:12px;font-weight:700;color:var(--mu)}
.mn-hi{display:flex;justify-content:space-between;padding:7px 12px;background:var(--pn);border:1px solid #1d2128;border-radius:7px;font-size:12.5px;color:var(--mu);text-decoration:none}.mn-hi:hover{background:#171b21}.mn-hi .w{color:var(--gd)}.mn-hi .l{color:var(--rd)}
/* tablet / narrow container: panel gets slimmer */
@container (max-width:980px){.mn-main{grid-template-columns:clamp(260px,32%,330px) minmax(0,1fr)}.mn-quick button,.mn-grids button{height:44px;font-size:14px}.mn-go{height:58px;margin-top:22px}.mn-field,.mn-minerow{height:48px}}
/* mobile: panel above the board, same style */
@container (max-width:700px){.mn-main{grid-template-columns:minmax(0,1fr);min-height:0}.mn-panel{border-right:0;border-bottom:1px solid #1d2128}.mn-maxwin{margin-top:18px}.mn-pop{bottom:76px}.mn-bwrap{width:100%}.mn-play{padding:12px}.mn-cols{grid-template-columns:minmax(0,1fr)}.mn-result dl{grid-template-columns:repeat(2,minmax(0,1fr))}.mn-quick button,.mn-grids button{height:46px}.mn-sound input[type=range]{width:50px}}
@container (max-width:420px){.mn-tile{border-radius:12%}.mn-grids button{font-size:13px}}
/* Provably Fair page: Mines proof board */
.pf-mboard{display:grid;gap:3px;max-width:320px;margin:10px 0}.pf-mc{aspect-ratio:1;display:grid;place-items:center;border:1px solid #2A2F38;border-radius:4px;background:#12151B;font-size:11px;color:#949BA6}
.pf-mc.safe{border-color:#D6AE55;color:#D6AE55;background:#1d2128}.pf-mc.mine{color:#E5534B}.pf-mc.hit{background:#3b1514;border-color:#E5534B;color:#E8833A}
/* beat global button/input rules of the host app */
#app .mn button{text-transform:none;letter-spacing:normal}
#app .mn .mn-go{font-size:18px;font-weight:800}#app .mn .mn-go.cash{font-size:15px}
#app .mn-field input,#app .mn-field input:focus,#app .mn-field input:focus-visible{border:0!important;outline:0!important;box-shadow:none!important;background:transparent!important;border-radius:0!important}
#app .mn-minerow input[type=number]:focus{outline:0!important;box-shadow:none!important;border:0!important}