.g-maze{--mz-wall-color:color-mix(in srgb, var(--c-text) 46%, var(--c-surface));--mz-wall:2px;--mz-trail:color-mix(in srgb, var(--c-brand) 15%, transparent);--mz-start:color-mix(in srgb, var(--c-good) 16%, transparent);--mz-hint:color-mix(in srgb, var(--c-accent) 38%, transparent);gap:var(--sp-3)}.g-maze.is-dense{--mz-wall:1px}.g-maze .mz-meter{justify-content:center;gap:var(--sp-2);flex-wrap:wrap;display:flex}.g-maze .mz-chip{align-items:center;gap:var(--sp-1);padding-block:var(--sp-1);padding-inline:var(--sp-3);border-radius:var(--r-full);background:var(--c-surface-2);color:var(--c-text-dim);font-size:var(--fs-sm);display:inline-flex}.g-maze .mz-chip--size{background:var(--c-brand-soft);color:var(--c-brand)}.g-maze .mz-chip b{font-family:var(--font-num);font-variant-numeric:tabular-nums;color:var(--c-text)}.g-maze .mz-board{grid-template-columns:repeat(var(--mz-n,8), minmax(0, 1fr));grid-template-rows:repeat(var(--mz-n,8), minmax(0, 1fr));aspect-ratio:1;border:var(--mz-wall) solid var(--mz-wall-color);border-radius:var(--r-sm);background:var(--c-surface);touch-action:none;-webkit-user-select:none;user-select:none;direction:ltr;inline-size:min(100%,460px);display:grid;position:relative;overflow:hidden}.g-maze .mz-board:focus-visible{outline:3px solid var(--c-focus);outline-offset:3px}.g-maze .mz-cell{min-block-size:0;min-inline-size:0}.g-maze .mz-wn{border-block-start:var(--mz-wall) solid var(--mz-wall-color)}.g-maze .mz-ww{border-inline-start:var(--mz-wall) solid var(--mz-wall-color)}.g-maze .mz-cell.is-start{background:var(--mz-start)}.g-maze .mz-cell.is-trail{background:var(--mz-trail)}.g-maze .mz-cell.is-hint{background:var(--mz-hint)}.g-maze .mz-marker{inline-size:calc(100% / var(--mz-n,8));block-size:calc(100% / var(--mz-n,8));pointer-events:none;place-items:center;display:grid;position:absolute;inset-block-start:calc(var(--mz-r,0) * 100% / var(--mz-n,8));inset-inline-start:calc(var(--mz-c,0) * 100% / var(--mz-n,8))}.g-maze .mz-glyph{block-size:84%;inline-size:84%}.g-maze .mz-walker{color:var(--c-brand);z-index:2}.g-maze .mz-goal{color:var(--c-good);z-index:1}.g-maze .mz-pad{grid-template-columns:repeat(3, var(--tap));gap:var(--sp-2);direction:ltr;grid-template-areas:".up.""left.right"".down.";display:grid}.g-maze .mz-padbtn{inline-size:var(--tap);block-size:var(--tap);border:1px solid var(--c-border);border-radius:var(--r-md);background:var(--c-surface);color:var(--c-text-dim);cursor:pointer;place-items:center;padding:0;display:grid}.g-maze .mz-padbtn:hover{background:var(--c-surface-2);color:var(--c-text)}.g-maze .mz-padbtn:focus-visible{outline:3px solid var(--c-focus);outline-offset:2px}.g-maze .mz-padbtn .mz-glyph{block-size:22px;inline-size:22px}.g-maze .mz-padbtn--up{grid-area:up}.g-maze .mz-padbtn--down{grid-area:down}.g-maze .mz-padbtn--left{grid-area:left}.g-maze .mz-padbtn--right{grid-area:right}.g-maze .mz-tip{max-inline-size:34ch;color:var(--c-text-faint);font-size:var(--fs-xs);text-align:center;margin:0}.g-maze .mz-sr{white-space:nowrap;clip-path:inset(50%);border:0;block-size:1px;inline-size:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.g-maze .mz-walker,.g-maze .mz-cell,.g-maze .mz-padbtn{transition:none}.g-maze .mz-padbtn:active{transform:none}.g-maze.is-motion .mz-walker{transition:inset-block-start var(--dur-fast) var(--ease), inset-inline-start var(--dur-fast) var(--ease)}.g-maze.is-motion .mz-cell{transition:background var(--dur) var(--ease)}.g-maze.is-motion .mz-padbtn{transition:background var(--dur-fast) var(--ease), transform var(--dur-fast) var(--ease)}.g-maze.is-motion .mz-padbtn:active{transform:scale(.94)}.g-maze.is-motion.is-solved .mz-goal{animation:mz-cheer .62s var(--ease-bounce) 2}@keyframes mz-cheer{0%,to{transform:scale(1)}45%{transform:scale(1.28)}}
