:root{--accent:#5a7d9a}
.ms{background:#e9eef2;overflow:auto;align-items:safe center;justify-content:safe center;padding:8px}
.field{display:grid;gap:2px;background:#9fb0bd;padding:4px;border-radius:12px;border:2px solid var(--ink);touch-action:manipulation}
.m{width:var(--s);height:var(--s);border:0;border-radius:5px;background:#d6dfe6;box-shadow:inset 0 -3px 0 rgba(0,0,0,.12);font-weight:900;font-size:calc(var(--s)*0.55);display:grid;place-items:center;cursor:pointer;padding:0;line-height:1}
.m:hover{background:#e3eaf0}.m.open{background:#f7f9fa;box-shadow:none;cursor:default}.m.boom{background:#e2584a}.m.wrong{background:#f6c4bd}
.m.flag::after{content:"";width:45%;height:45%;background:#e2584a;clip-path:polygon(15% 0,100% 30%,15% 60%,15% 100%,0 100%,0 0)}
.n1{color:#2f6fd1}.n2{color:#2f8f4f}.n3{color:#d9453b}.n4{color:#3a3f9e}.n5{color:#9b3a2b}.n6{color:#2a8a8a}.n7{color:#333}.n8{color:#777}
.mine::after{content:"";width:50%;height:50%;border-radius:50%;background:#243e36;box-shadow:0 0 0 3px rgba(36,62,54,.25)}