.tl-board{grid-template-columns:repeat(var(--w), 1fr);grid-template-rows:repeat(var(--h), 1fr);width:min(100%, calc(var(--w) * 52px));aspect-ratio:var(--w) / var(--h);border:1px solid var(--games-rule,#cfd3c9);background:var(--games-paper,#f6f5f1);touch-action:none;border-radius:6px;margin:0 auto;display:grid;position:relative;overflow:hidden;container-type:inline-size}.tl-board:focus-visible{outline:2px solid var(--games-accent,#6f7f2e);outline-offset:3px}.tl-cell{font-weight:800;font-size:calc(40cqi / var(--w));place-items:center;display:grid}.tl-cell.is-wall{background:var(--piece-wall)}.tl-cell.is-start{background:repeating-linear-gradient(45deg, transparent 0 4px, color-mix(in srgb, var(--games-ink,#282d29) 7%, transparent) 4px 8px)}.tl-cell.is-exit{color:var(--piece-hero-ink);background:var(--piece-exit)}.tl-cell.is-plate{border:2px solid var(--piece-goal);color:var(--piece-goal);font-size:calc(26cqi / var(--w));border-radius:50%;margin:18%}.tl-cell.is-plate.is-down{background:var(--piece-goal);color:var(--piece-hero-ink)}.tl-cell.is-door{border:3px solid var(--piece-water);background:color-mix(in srgb, var(--piece-water) 26%, transparent);color:var(--games-ink,#282d29)}.tl-cell.is-door.is-inverse{border-color:var(--piece-danger);background:color-mix(in srgb, var(--piece-danger) 22%, transparent);color:var(--games-ink,#282d29)}.tl-cell.is-door.is-open{opacity:.6;background:0 0;border-style:dashed}.tl-self{width:calc(100% / var(--w));height:calc(100% / var(--h));font-weight:800;font-size:calc(32cqi / var(--w));pointer-events:none;place-items:center;transition:transform .12s ease-out;display:grid;position:absolute;top:0;left:0}.tl-board.is-still .tl-self{transition:none}.tl-self:before{content:"";z-index:-1;border-radius:50%;position:absolute;inset:16%}.tl-self.is-me{color:var(--piece-hero-ink);z-index:3}.tl-self.is-me:before{background:var(--piece-hero)}.tl-self.is-past{color:var(--piece-ghost-ink);z-index:2}.tl-self.is-past:before{background:color-mix(in srgb, var(--piece-ghost) 30%, transparent);border:2px dashed var(--piece-ghost)}.tl-self.is-stuck:before{border-color:var(--piece-danger)}.tl-timeline{gap:3px;display:flex}.tl-timeline span{background:var(--games-rule,#cfd3c9);border-radius:3px;flex:1;height:6px}.tl-timeline .is-used{background:var(--games-accent,#6f7f2e)}.kit .tl-pad .is-wait{grid-area:1/3;justify-content:center}