.maze{--maze-cell-size:72px;--maze-wall:#243c53;max-width:100%;color:#17394b}
.maze-scroll{max-width:100%;overflow:auto;padding:8px;box-sizing:border-box}
.maze-board{display:grid;width:max-content;max-width:none;border:2px solid var(--maze-wall);background:#fff}
.maze-cell{position:relative;min-width:var(--maze-cell-size);min-height:var(--maze-cell-size);width:var(--maze-cell-size);height:var(--maze-cell-size);padding:4px;border:3px solid var(--maze-wall);border-radius:0;background:#fff;color:#17394b;font:inherit;cursor:pointer;box-sizing:border-box}
.maze-cell-content{display:block;font-size:12px;line-height:1.25;overflow-wrap:anywhere}
.maze-cell[data-visited=true]{background:#e4f0f4}
.maze-cell[aria-current]{background:#fff0b7;box-shadow:inset 0 0 0 3px #183e5c}
.maze-cell[aria-current] .maze-cell-content{font-weight:700;text-decoration:underline}
.maze-cell[data-revealed=true]{background:#e5e1f6;box-shadow:inset 0 0 0 2px #5b3a93}
.maze-cell[data-hint=true]{outline:3px dashed #5b3a93;outline-offset:-7px}
.maze-cell:focus-visible,.maze-toolbar button:focus-visible,.maze-pad button:focus-visible{outline:3px solid #185fc3;outline-offset:3px;z-index:2}
.maze-door{position:absolute;z-index:1;background:#fff;color:#572309;border:2px double #7b3c10;font-size:11px;line-height:1.1;max-width:40px;overflow-wrap:anywhere;pointer-events:none}
.maze-door[data-unlocked=true]{border-style:dashed;text-decoration:line-through;color:#17394b}
.maze-door-top{top:-6px;left:25%}.maze-door-bottom{bottom:-6px;left:25%}
.maze-door-left{left:-6px;top:25%}.maze-door-right{right:-6px;top:25%}
.maze-toolbar,.maze-pad{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0}
.maze-toolbar button,.maze-pad button{min-height:44px;min-width:44px;padding:8px 12px;border:1px solid #59677b;border-radius:8px;background:#fff;color:#17394b;font:inherit;cursor:pointer}
.maze-toolbar button:disabled{opacity:.55;cursor:default}
.maze-statistics{display:grid;grid-template-columns:max-content 1fr;gap:4px 12px}
.maze-statistics dt,.maze-statistics dd{margin:0}.maze-feedback{min-height:1.5em}
@media(min-width:700px){.maze{--maze-cell-size:80px}.maze-cell-content{font-size:14px}}