.boardFrame{background:#dfe6e0;border-color:var(--navy);padding:8px}
#mgrid{display:grid;grid-template-columns:repeat(var(--cols),minmax(0,1fr));gap:2px;aspect-ratio:var(--cols)/var(--rows);user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;touch-action:manipulation}
.mcell{padding:0;border:0;border-radius:4px;min-width:0;aspect-ratio:1;background:linear-gradient(160deg,#c3d1c9,#a7b8ae);box-shadow:inset 0 -2px 0 #8a9d92,inset 0 1px 0 #e3ebe5;font-family:Manrope,sans-serif;font-weight:800;font-size:clamp(11px,2.2vw,20px);line-height:1;display:grid;place-items:center;color:var(--ink)}
.mcell:hover:not(:disabled):not(.open){background:linear-gradient(160deg,#d3dfd8,#b8c8bf)}
.mcell:disabled{cursor:default;opacity:1}
.mcell.open{background:#f4f6f1;box-shadow:inset 0 0 0 1px #dde4dd}
.mcell.open:hover{background:#f4f6f1}
.mcell.n1{color:#2f6f8f}.mcell.n2{color:#3f7d4c}.mcell.n3{color:#b2483b}.mcell.n4{color:#2c3f7a}
.mcell.n5{color:#8a3a2e}.mcell.n6{color:#2c7a78}.mcell.n7{color:#20353e}.mcell.n8{color:#6d747a}
.mcell.flag{color:#b2483b}
.mcell.flag.wrong{background:#f3d6d0;text-decoration:line-through}
.mcell.mine{color:#20353e;background:#dcd4c8}
.mcell.boom{background:#d5694f;color:#fff}
.mcell.hint{box-shadow:inset 0 0 0 3px #e0b04a}
#mgrid[data-level="mellem"] .mcell,#mgrid[data-level="svaer"] .mcell{font-size:clamp(10px,1.6vw,16px);border-radius:3px}
#mgrid[data-level="svaer"]{gap:1.5px}
.mineBox{background:var(--navy);color:#fff;border-radius:9px;padding:7px 14px;gap:10px!important}
.mineBox small{font-size:10px;letter-spacing:1px}
.mineBox b{font-size:21px;font-variant-numeric:tabular-nums}
#clock{font-variant-numeric:tabular-nums;font-weight:700}
.tools{grid-template-columns:repeat(3,minmax(0,1fr))}
.tools button:last-child{color:inherit}
.tools button[aria-pressed=true]{background:#f3d6d0;color:#8a3a2e}
.statGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:6px}
.statGrid div{background:#eef2ec;border-radius:10px;padding:10px;text-align:center}
.statGrid small{display:block;font-size:10px;font-weight:800;letter-spacing:1.2px;color:var(--muted)}
.statGrid b{display:block;font-family:Manrope,sans-serif;font-size:22px;font-variant-numeric:tabular-nums}
.statGrid span{font-size:11px;color:var(--muted)}
/* Svær er høj; på brede skærme begrænses højden, så hele feltet kan ses. */
@media(min-width:681px){#mgrid[data-level="svaer"]{width:min(100%,calc((100dvh - 120px)*16/30));margin:auto}}
.game-focus .boardFrame{aspect-ratio:auto;width:auto;max-width:100%;padding:5px}
.game-focus #mgrid{height:calc(100cqh - 150px);width:auto;max-width:100cqw;margin:auto}
@media(max-height:500px){.game-focus #mgrid{height:calc(100dvh - 30px)}}

/* Beskeder under brættet med fast plads, så brættet aldrig hopper. */
.boardColumn #message{min-height:42px;margin:10px 0 0;padding:10px 14px;font-size:14px}
.boardColumn #message:empty{display:block;visibility:hidden}