.game{align-items:center;gap:var(--space-4);flex-direction:column;flex:1;display:flex}.mbar{gap:var(--space-4);color:var(--ink-muted);font-variant-numeric:tabular-nums;font-size:14px;display:flex}.mbar b{color:var(--ink)}.mboard{--w:min(600px, calc(100vw - 2 * var(--space-4)));--u:calc((var(--w) - 8px) / 16.6);width:var(--w);height:calc(var(--u) * 10.9 + 12px);position:relative}.mtile{left:calc(var(--x) * var(--u) + 8px - var(--z) * var(--u) * .3);top:calc(var(--y) * var(--u) * 1.3 + 8px - var(--z) * var(--u) * .45);width:calc(var(--u) * 2 - 2px);height:calc(var(--u) * 2.6 - 2px);border:2px solid var(--line-strong);border-radius:var(--radius-sm);background-color:var(--surface-raised);box-shadow:calc(3px + var(--z) * 2px) calc(4px + var(--z) * 3px) 0 var(--line-strong), var(--shadow-press);cursor:pointer;padding:0;transition:transform 80ms,opacity .12s;position:absolute}.mface{place-items:center;width:100%;height:100%;display:grid}.mface svg{width:70%;height:70%}.mface svg path{fill:currentColor}.mface.kobalt{color:var(--kobalt)}.mface.mango{color:var(--mango)}.mface.koralle{color:var(--koralle)}.mface.minze{color:var(--minze)}.mtile.blocked{background-color:color-mix(in srgb, var(--line) 55%, var(--surface-raised))}.mtile.blocked .mface{opacity:.45}.mtile.sel{border-color:var(--kobalt);outline:3px solid var(--kobalt);transform:translateY(-3px)}.mtile.hint{outline:3px dashed var(--mango)}.mtools{gap:var(--space-2);grid-template-columns:repeat(3,1fr);width:100%;max-width:500px;margin-top:auto;display:grid}.mtools .sg-btn{padding:0 var(--space-2)}.after{align-items:center;gap:var(--space-2);text-align:center;flex-direction:column;display:flex}.after p{margin:0}
