.minesweeper{--ms-surface:#f4f6fa;--ms-covered:#dce3ee;--ms-border:#8492a6;--ms-ink:#172437;--ms-open:#fff;--ms-danger:#ffe0df;--ms-focus:#593cc4;--ms-n1:#164db1;--ms-n2:#146035;--ms-n3:#b62232;--ms-n4:#6431a0;--ms-n5:#904500;--ms-n6:#00636c;--ms-n7:#7e275c;--ms-n8:#414a59;color:var(--ms-ink);background:var(--ms-surface);border:1px solid var(--ms-border);border-radius:16px;min-width:0;max-width:100%;padding:16px}.dark .minesweeper{--ms-surface:#17202f;--ms-covered:#35465e;--ms-border:#7689a4;--ms-ink:#edf2fa;--ms-open:#202c3d;--ms-danger:#612c39;--ms-focus:#c2acff;--ms-n1:#8fbaff;--ms-n2:#87df9f;--ms-n3:#ff9eaa;--ms-n4:#d3adff;--ms-n5:#ffc082;--ms-n6:#7fe4e4;--ms-n7:#f9b7e2;--ms-n8:#d3dce9}.ms-controls,.ms-stats,.ms-modes{flex-wrap:wrap;align-items:center;gap:12px;display:flex}.ms-controls{margin-block:20px}.ms-controls label{gap:6px;max-width:100%;display:grid}.ms-controls select{background:var(--ms-open);width:100%;max-width:100%;min-height:40px;color:var(--ms-ink);border:1px solid var(--ms-border);border-radius:6px;padding:6px}.ms-stats{font-variant-numeric:tabular-nums;justify-content:space-between}.ms-status{min-height:3em;margin-block:16px}.ms-scroll{overscroll-behavior-x:contain;border:1px solid var(--ms-border);border-radius:6px;max-width:100%;overflow-x:auto}.ms-board{background:var(--ms-border);gap:1px;width:max-content;display:grid}.ms-cell{width:40px;min-width:40px;height:40px;box-shadow:inset 0 2px 0 var(--ms-open);background:var(--ms-covered);color:var(--ms-ink);cursor:pointer;touch-action:manipulation;border:0;border-radius:0;padding:0;font-size:20px;font-weight:800;line-height:1}.ms-cell.ms-open{background:var(--ms-open);box-shadow:none;cursor:default}.ms-cell.ms-mine{background:var(--ms-danger);color:var(--ms-ink)}.ms-cell:focus-visible,.ms-scroll:focus-visible{outline:3px solid var(--ms-focus);outline-offset:-3px;z-index:1;position:relative}.ms-cell.ms-open[data-number="1"]{color:var(--ms-n1)}.ms-cell.ms-open[data-number="2"]{color:var(--ms-n2)}.ms-cell.ms-open[data-number="3"]{color:var(--ms-n3)}.ms-cell.ms-open[data-number="4"]{color:var(--ms-n4)}.ms-cell.ms-open[data-number="5"]{color:var(--ms-n5)}.ms-cell.ms-open[data-number="6"]{color:var(--ms-n6)}.ms-cell.ms-open[data-number="7"]{color:var(--ms-n7)}.ms-cell.ms-open[data-number="8"]{color:var(--ms-n8)}.ms-instructions{margin-top:24px}.ms-instructions h2,.ms-other h2{font-size:1.2rem;font-weight:700}.ms-instructions ul{padding-left:20px;list-style:outside}.ms-instructions li{margin-top:8px}.ms-other{flex-wrap:wrap;gap:8px 16px;margin-top:24px;display:flex}.ms-other h2{flex-basis:100%}.ms-other a,.minesweeper>a{align-items:center;min-height:40px;text-decoration:underline;display:inline-flex}@media (prefers-reduced-motion:reduce){.minesweeper *,.minesweeper :before,.minesweeper :after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}.ms-levels{margin-top:16px}.ms-board{padding:1px}.ms-cell:not(.ms-open){background:linear-gradient(160deg, color-mix(in oklab, var(--ms-covered) 75%, var(--ms-open)), var(--ms-covered));box-shadow:inset 0 2px 0 color-mix(in oklab, var(--ms-open) 80%, transparent), inset 0 -2px 0 color-mix(in oklab, var(--ms-border) 55%, transparent);transition:filter .1s}.ms-cell:not(.ms-open):hover{filter:brightness(1.06)}.ms-cell.ms-open{animation:.18s ease-out ms-open}.ms-flag{color:var(--ms-n3)}.ms-hint{outline:3px dashed var(--ms-n2);outline-offset:-5px;animation:1s ease-in-out infinite alternate ms-hint}.ms-boom{animation:.45s ease-out ms-boom;background:var(--ms-n3)!important;color:var(--ms-open)!important}.ms-banner{text-align:center;border-radius:10px;margin:8px 0;padding:10px 14px;font-weight:800;animation:.3s ease-out ms-open}.ms-banner-win{background:color-mix(in oklab, var(--ms-n2) 18%, var(--ms-open));color:var(--ms-n2);border:1px solid var(--ms-n2)}.ms-banner-lost{background:var(--ms-danger);color:var(--ms-n3);border:1px solid var(--ms-n3)}@keyframes ms-open{0%{opacity:.4;transform:scale(.85)}}@keyframes ms-hint{to{outline-color:#0000}}@keyframes ms-boom{0%{transform:scale(1.5)}to{transform:scale(1)}}@media (prefers-reduced-motion:reduce){.minesweeper *{animation:none!important}}
