.tiled-lab{margin-block:2rem;padding:clamp(1rem,3vw,2rem);border:1px solid var(--line,#cad4db);border-radius:18px;background:var(--panel,#f6f8fa);color:var(--ink,#173147)}
.tiled-lab *{box-sizing:border-box}.tiled-lab .tile-kicker{font-size:.78rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted,#4c6170)}
.tiled-lab fieldset{border:0;padding:0;margin:1rem 0}.tiled-lab legend{font-weight:700;margin-bottom:.8rem}.tile-controls{display:flex;gap:1rem;flex-wrap:wrap;align-items:center}.tile-controls label{display:flex;gap:.5rem;align-items:center;min-height:44px}.tile-controls select,.tiled-lab button{min-height:44px;font:inherit;color:var(--ink,#173147);background:var(--bg,#fff);border:1px solid var(--line,#bac8d0);border-radius:8px;padding:.4rem .8rem}.tile-controls input{width:20px;height:20px}.tile-grids{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}.tile-grids figure{margin:1rem 0}.tile-grids figcaption{font-weight:700;margin-bottom:.6rem}.tile-grids canvas{display:block;width:100%;height:auto;image-rendering:pixelated;border:1px solid #a6b3bc;background:#f5f7fa}.tile-small{font-size:.88rem;color:var(--muted,#4c6170)}.tile-status{font-weight:650;line-height:1.6}.tiled-lab :focus-visible{outline:3px solid var(--accent,#206d9b);outline-offset:3px}.tile-legend{display:flex;gap:.5rem;align-items:center;flex-wrap:wrap}.tile-swatch{display:inline-block;width:1rem;height:1rem;border:1px solid #778895}.tile-status{min-height:3.2em}@media(max-width:650px){.tile-grids{grid-template-columns:1fr}.tile-controls{display:block}.tile-controls label{margin-block:.6rem}}

.tiled-lab{scroll-margin-top:90px}.tile-controls label{justify-content:flex-start}.tile-grids figcaption{color:var(--ink)}