:root{--color-bg: #1a3a5f;--color-accent: #d4a017;--card-scale: 1;--fit-gap: 8px;--mj-cols: 8;--mj-rows: 6;--mj-layers: 3;--card-base-width: min(76px, calc((100cqi - 4px) / (var(--mj-cols) + var(--mj-layers) * .1)));--card-width: calc(var(--card-base-width) * var(--card-scale));--tile-w: var(--card-width);--tile-h: calc(var(--tile-w) * 1.3);--tile-depth: calc(var(--tile-w) * .1)}@media (min-width: 601px) and (min-height: 501px){:root{--card-base-width: min( 76px, calc((100cqi - 4px) / (var(--mj-cols) + var(--mj-layers) * .1)), calc((100vh - 280px) / (var(--mj-rows) * 1.3 + var(--mj-layers) * .1)) )}}*{box-sizing:border-box}body{margin:0;font-family:system-ui,-apple-system,sans-serif;background:var(--color-bg);color:#faf7f2;line-height:1.4;min-height:100vh}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.board{max-width:1200px;margin:0 auto;padding:12px 24px}.board__header{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;margin-bottom:16px}.board__home{color:#faf7f2;text-decoration:none;font-weight:600}.board__controls,.board__actions{display:flex;flex-wrap:wrap;gap:4px}.board__zoom,.board__new,.board__undo,.board__hint,.board__sound,.board__restart,.board__shuffle,.board__layout{background:#1a2b3d;color:#faf7f2;border:1px solid #4a6280;padding:8px 14px;font-size:1rem;font-weight:600;cursor:pointer;border-radius:4px}.board__sound,.board__restart,.board__shuffle,.board__layout{display:inline-flex;align-items:center;justify-content:center;gap:.3em;min-width:44px;min-height:max(44px,calc(48px * var(--card-scale, 1)))}.board__sound-on,.board__sound[aria-pressed=true] .board__sound-off{display:none}.board__sound[aria-pressed=true] .board__sound-on{display:inline}.board__sound[aria-pressed=true],.board__layout[aria-pressed=true]{background:#d4a017;border-color:#d4a017;color:#000}.board__zoom:hover,.board__new:hover,.board__hint:hover,.board__restart:hover,.board__shuffle:hover,.board__layout[aria-pressed=false]:hover,.board__sound[aria-pressed=false]:hover,.board__undo:hover:enabled{background:#2a3d5a}:is(.board__zoom,.board__new,.board__undo,.board__hint,.board__sound,.board__restart,.board__shuffle,.board__layout,.board__home):focus-visible,.mj__status-cta:focus-visible{outline:3px solid #f3cf62;outline-offset:2px}.board__extras{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:12px;margin-top:12px}.board__layouts{display:inline-flex;flex-wrap:wrap;align-items:center;gap:4px}.board__layouts-label{font-weight:600;margin-right:4px}.board__layout-note{flex-basis:100%;max-width:40em;margin:0;text-align:center;font-size:1rem}@media (min-width: 601px){.board__layout-note{display:none}}@media (max-width: 600px){.board__actions .board__undo,.board__actions .board__hint,.board__actions .board__new{padding:6px 10px}}.mj__instructions{background:#d4a01726;border:1px solid rgba(212,160,23,.4);padding:10px 16px;border-radius:6px;margin-bottom:16px;font-size:1rem}.mj__instructions p{margin:0}.mj__layout{position:relative;width:calc(var(--mj-cols) * var(--tile-w) + var(--mj-layers) * var(--tile-depth));height:calc(var(--mj-rows) * var(--tile-h) + var(--mj-layers) * var(--tile-depth));margin:0 auto 8px}.mj__tile{position:absolute;left:calc(var(--x) * var(--tile-w) / 2 + (var(--mj-layers) - 1 - var(--z)) * var(--tile-depth));top:calc(var(--y) * var(--tile-h) / 2 + (var(--mj-layers) - 1 - var(--z)) * var(--tile-depth));width:var(--tile-w);height:var(--tile-h);border-radius:calc(var(--tile-w) * .1);box-shadow:calc(var(--tile-depth) * .7) calc(var(--tile-depth) * .7) 0 #6e5f3f,calc(var(--tile-depth) * .7 + 1px) calc(var(--tile-depth) * .7 + 2px) 4px #00000073;touch-action:manipulation;transition:transform .1s ease-out}.mj__tile .mj-face{width:100%;height:100%;display:block}.mj-face__bg{fill:#fffdf6;stroke:#3a3326;stroke-width:2}.mj__tile--free{cursor:pointer}.mj__tile--blocked .mj-face__bg{fill:#d6d0c2;stroke:#6e6553}.mj__tile--free:hover{transform:translateY(-2px)}.mj__tile--selected{outline:4px solid #f3cf62;outline-offset:1px;transform:translateY(-4px);z-index:2}.mj__tile--selected .mj-face__bg{fill:#ffe9a0;stroke:#000;stroke-width:3}.mj__tile--hint-highlight{outline:4px dashed #9fd8ff;outline-offset:1px;z-index:1}.mj__tile--hint-highlight .mj-face__bg{fill:#d8ecff}.mj__tile:focus-visible{outline:4px solid #ffffff;outline-offset:2px;z-index:3}@media (prefers-reduced-motion: reduce){.mj__tile{transition:none}.mj__tile--free:hover,.mj__tile--selected{transform:none}}.mj__info,.mj__message{margin:0;text-align:center;font-size:1rem}.mj__message{min-height:1.4em;margin-top:6px;font-weight:600;color:#f3cf62}.mj__status{margin:16px auto 0;max-width:560px;padding:20px;background:#d4a01733;border:1px solid var(--color-accent);border-radius:8px;text-align:center}.mj__status-text{display:block;font-size:1.4rem;font-weight:700;margin-bottom:12px}.mj__status-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:12px}.mj__status-cta{background:var(--color-accent);color:#000;border:2px solid var(--color-accent);padding:12px 24px;font-size:1.1rem;font-weight:700;cursor:pointer;border-radius:4px}.mj__status-cta[hidden]{display:none}.mj__status-cta--alt{background:transparent;color:#faf7f2}.board-footer[data-astro-cid-vrolo6kj]{padding:20px 16px 32px;text-align:center}.board-footer[data-astro-cid-vrolo6kj] a[data-astro-cid-vrolo6kj]{color:inherit;opacity:.75;margin:0 10px}.board-footer[data-astro-cid-vrolo6kj] a[data-astro-cid-vrolo6kj]:hover,.board-footer[data-astro-cid-vrolo6kj] a[data-astro-cid-vrolo6kj]:focus-visible{opacity:1}
