.minesweeper-viewport{--mine-size:clamp(24px,min((100cqw - 16px)/var(--mine-cols),(100cqh - 16px)/var(--mine-rows)),52px);display:flex;min-height:0;width:100%;height:100%;overflow:auto;overscroll-behavior:contain;border-radius:8px;padding:8px;scrollbar-color:#a5b4ae #132d26;touch-action:pan-x pan-y}.minesweeper-board{display:grid;flex:none;grid-template-columns:repeat(var(--mine-cols),var(--mine-size));grid-template-rows:repeat(var(--mine-rows),var(--mine-size));width:max-content;min-height:0;margin:auto;align-content:center;grid-gap:0;gap:0}@media (pointer:coarse){.minesweeper-viewport{--mine-size:clamp(18px,min((100cqw - 16px)/var(--mine-cols),(100cqh - 16px)/var(--mine-rows)),52px)}}.minesweeper-board[data-rotated]{grid-auto-flow:column}.minesweeper-cell{position:relative;display:grid;place-items:stretch;padding:2px;width:var(--mine-size);height:var(--mine-size);border:0;background:transparent;color:#f7eee3;font-family:inherit;font-size:calc(var(--mine-size)*.49);font-weight:800;cursor:pointer;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;-moz-user-select:none;user-select:none;animation:mine-arrive .46s cubic-bezier(.2,.8,.2,1) var(--mine-delay) backwards}.minesweeper-face{display:grid;place-items:center;position:relative;width:100%;height:100%;border:1px solid #f48c88;border-bottom:3px solid #87363e;border-radius:12%;background:linear-gradient(140deg,#d9656c,#b74454);box-shadow:inset 0 1px 0 #ffc1ac6b,0 2px 3px #0004;transition:filter .14s,transform .1s,box-shadow .14s}.minesweeper-cell[data-open] .minesweeper-face{background:#e8e3d5;border:1px solid #c6c7b2;box-shadow:inset 0 1px 3px #283c2720;animation:mine-reveal .29s ease-out}.minesweeper-cell[data-value="1"]{color:#23567e}.minesweeper-cell[data-value="2"]{color:#2f6436}.minesweeper-cell[data-value="3"]{color:#ad3436}.minesweeper-cell[data-value="4"]{color:#55428a}.minesweeper-cell[data-value="5"]{color:#873d21}.minesweeper-cell[data-value="6"]{color:#14696b}.minesweeper-cell[data-value="7"]{color:#282729}.minesweeper-cell[data-value="8"]{color:#665949}.minesweeper-cell[data-mine] .minesweeper-face{background:#aebbaf;border-color:#6c8276;color:#23372e}.minesweeper-cell[data-exploded] .minesweeper-face{background:#e7b785;border-color:#e1a264;animation:mine-hit .75s ease-out}.minesweeper-cell[aria-disabled=true]{cursor:default}.minesweeper-cell:focus-visible{outline:2px solid #ffdda2;outline-offset:-2px;z-index:2;border-radius:12%}@media(hover:hover){.minesweeper-cell:not([aria-disabled=true]):hover .minesweeper-face{filter:brightness(1.15);box-shadow:0 0 0 2px #ffd39c,inset 0 1px #fff8}}.minesweeper-cell:not([aria-disabled=true]):active .minesweeper-face{transform:translateY(2px) scale(.96);filter:brightness(.92)}.minesweeper-cell,.minesweeper-cell *{-webkit-user-select:none;-moz-user-select:none;user-select:none;-webkit-touch-callout:none}.minesweeper-cell[data-pressing]:after{content:"";position:absolute;inset:3px;border:3px solid #ffe4a2;border-radius:12%;pointer-events:none;animation:mine-hold .45s linear both}.minesweeper-cell[data-flagged] .minesweeper-flag{animation:mine-flag .22s ease-out}@keyframes mine-hold{0%{transform:scale(.45);opacity:.25}to{transform:scale(1);opacity:1}}@keyframes mine-flag{0%{transform:translateY(-15%) scale(.7);opacity:.3}to{transform:none;opacity:1}}.minesweeper-flag,.minesweeper-mine{width:78%;height:78%;overflow:visible}.minesweeper-mine{fill:none;stroke:currentColor;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}.minesweeper-mine .mine-body{fill:currentColor;stroke-width:1}.minesweeper-mine[data-broken] .mine-half-left{transform:translate(-2px,1px) rotate(-8deg);transform-origin:center}.minesweeper-mine[data-broken] .mine-half-right{transform:translate(3px,-2px) rotate(8deg);transform-origin:center}.minesweeper-wrong-flag{position:absolute;inset:0;color:#642b2d;text-shadow:0 1px #fff}.minesweeper-explosion{pointer-events:none;position:absolute;inset:10%;border:3px solid #ffd19a;border-radius:25%;animation:mine-explosion .8s ease-out forwards}.minesweeper-modes{width:100%;display:grid;grid-template-columns:1fr 1fr;grid-gap:10px;gap:10px;margin:12px 0}html .minesweeper-modes .solo-button{display:grid;grid-gap:6px;gap:6px;align-content:center;padding:12px;min-height:76px}.minesweeper-modes span{font-size:12px;opacity:.82;white-space:nowrap}.minesweeper-modes .solo-button[aria-pressed=true]{background:linear-gradient(145deg,#51422d,#382f24);border-color:#cba86c;color:#ffe1ad;box-shadow:inset 0 0 0 1px #cba86c}.solo-start--minesweeper{width:min(100%,460px);max-width:none}.solo-dialog[data-solo=minesweeper][data-panel=ranking]{height:min(690px,calc(100dvh - 32px));overflow:auto}html .solo-dialog[data-solo=minesweeper] .solo-ranking{min-height:100px}.solo-game[data-solo=minesweeper] .solo-layout-record small{font-size:11px;color:#b8c4d0}@keyframes mine-arrive{0%{opacity:0;transform:translate(-10px,-18px) scale(.65)}to{opacity:1;transform:none}}@keyframes mine-reveal{0%{transform:perspective(250px) rotateX(80deg) scale(.94)}to{transform:none}}@keyframes mine-hit{15%,40%{transform:translateX(-3px);filter:brightness(1.7)}25%,55%{transform:translateX(3px)}to{transform:none}}@keyframes mine-explosion{25%{opacity:1}to{opacity:0;transform:scale(2.8) rotate(35deg)}}@media (orientation:landscape) and (max-height:600px) and (pointer:coarse){.solo-start--minesweeper{gap:6px;padding:5px}.solo-start--minesweeper>.game-mark,.solo-start--minesweeper>svg{display:none}.minesweeper-modes{gap:6px;margin:5px 0}html .minesweeper-modes .solo-button{min-height:56px;padding:7px}}@media(prefers-reduced-motion:reduce){.minesweeper-cell,.minesweeper-cell .minesweeper-explosion,.minesweeper-cell .minesweeper-face,.minesweeper-cell .minesweeper-flag,.minesweeper-cell:after{animation:none;transition:none}.minesweeper-explosion{display:none}}