:root{--ink:#111827;--muted:#4b5563;--bg:#f8fafc;--panel:#fff;--line:#d1d5db;--accent:#1d4ed8;--accent-ink:#fff;--ok:#065f46;--err:#991b1b;--focus:#f59e0b;color:var(--ink);background:var(--bg);font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,sans-serif;line-height:1.45}*{box-sizing:border-box}body{margin:0}.app{max-width:1100px;min-height:100vh;margin:0 auto;padding:16px 20px 40px}.app--drag{outline:4px dashed var(--accent);outline-offset:-8px}.skip{position:absolute;left:-9999px}.skip:focus{background:var(--accent);color:var(--accent-ink);z-index:10;padding:8px 12px;top:8px;left:16px}.top{flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:16px;margin-bottom:20px;display:flex}.kicker{letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin:0;font-size:.8rem}h1{margin:2px 0 0;font-size:1.7rem}h2{margin:18px 0 8px;font-size:1.1rem}h3{margin:18px 0 6px;font-size:1rem}.muted{color:var(--muted);font-weight:400}.seg-control{border:2px solid var(--ink);border-radius:8px;display:inline-flex;overflow:hidden}.seg-control button{background:var(--panel);color:var(--ink);font:inherit;cursor:pointer;border:0;padding:8px 14px}.seg-control button.on{background:var(--ink);color:#fff}.grid{grid-template-columns:minmax(280px,420px) 1fr;align-items:start;gap:24px;display:grid}@media (width<=760px){.grid{grid-template-columns:1fr}}.board-wrap{position:sticky;top:12px}.board{width:100%;height:auto;display:block}.seg--live{cursor:pointer}.seg--live:hover{filter:brightness(1.15)}.seg--live:focus{stroke:var(--focus);stroke-width:6px;outline:none}.seg--live:focus-visible{stroke:var(--focus);stroke-width:6px}.seg-label{fill:#fff;paint-order:stroke;stroke:#0000008c;stroke-width:4px;pointer-events:none;font-size:20px;font-weight:700}.dart{fill:#fbbf24;stroke:#111827;stroke-width:2px}.panel{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:16px 18px}.panel label{margin:8px 0;font-size:.92rem;font-weight:600;display:block}.panel input:not([type=color]):not([type=file]),.panel textarea{width:100%;font:inherit;color:var(--ink);background:#fff;border:1px solid #6b7280;border-radius:6px;margin-top:4px;padding:8px 10px;display:block}.panel input:focus-visible,.panel textarea:focus-visible,button:focus-visible,summary:focus-visible,input[type=file]:focus-visible{outline:3px solid var(--focus);outline-offset:2px}.row{grid-template-columns:repeat(3,1fr);gap:10px;display:grid}fieldset{border:1px solid var(--line);border-radius:8px;margin:12px 0;padding:8px 12px 10px}legend{padding:0 6px;font-size:.92rem;font-weight:600}.segments{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:6px 12px;margin:0;padding:0;list-style:inside decimal;display:grid}.segments li{align-items:center;gap:6px;display:flex}.segments li input:not([type=color]){flex:1;margin:0;padding:6px 8px}.segments input[type=color]{background:#fff;border:1px solid #6b7280;border-radius:6px;width:36px;height:32px;padding:2px}.actions{flex-wrap:wrap;gap:8px;margin:10px 0;display:flex}button{font:inherit;border:2px solid var(--ink);color:var(--ink);cursor:pointer;background:#fff;border-radius:8px;padding:9px 14px;font-weight:600}button.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}.hint{color:var(--muted);margin:6px 0;font-size:.92rem}.instructions{border-left:4px solid var(--accent);background:#eff6ff;border-radius:4px;padding:8px 12px;font-size:1.1rem}.loaded{color:var(--ok);margin:4px 0;font-size:.9rem}.score{flex-wrap:wrap;gap:16px;margin:10px 0;font-size:1.3rem;font-weight:700;display:flex}.score .lbl{color:var(--muted);text-transform:uppercase;letter-spacing:.05em;margin-right:4px;font-size:.8rem}.win{color:var(--ok)}.miss{color:var(--err)}.throws{font-size:1.05rem}details{margin-top:10px}summary{cursor:pointer;font-weight:600}pre{color:#e2e8f0;background:#0f172a;border-radius:8px;max-height:320px;padding:10px 12px;font-size:.8rem;overflow:auto}.status{min-height:1.6em;margin-top:14px;font-size:.95rem;font-weight:600}.status--ok{color:var(--ok)}.status--err{color:var(--err)}footer{color:var(--muted);border-top:1px solid var(--line);margin-top:28px;padding-top:12px;font-size:.82rem}.sr-only{clip:rect(0 0 0 0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}input[type=file]{font:inherit}.cards{grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px;margin:12px 0 0;padding:0;list-style:none;display:grid}.card{background:var(--panel);border:1px solid var(--line);border-top:5px solid var(--accent);border-radius:12px;padding:14px 16px}.card--cubecity{border-top-color:#f59e0b}.card--shapes{border-top-color:#10b981}.card h3{margin:4px 0 6px;font-size:1.1rem}.card-tool{letter-spacing:.05em;text-transform:uppercase;color:var(--muted);margin:0;font-size:.78rem}.card-meta{margin:0 0 6px}.pill{color:#3730a3;background:#eef2ff;border-radius:999px;margin-right:4px;padding:2px 9px;font-size:.78rem;display:inline-block}.card-summary{color:var(--muted);margin:0 0 4px;font-size:.92rem}.card .actions{margin-bottom:0}select{width:100%;font:inherit;color:var(--ink);background:#fff;border:1px solid #6b7280;border-radius:6px;margin-top:4px;padding:8px 10px;display:block}select:focus-visible{outline:3px solid var(--focus);outline-offset:2px}.stage{max-width:420px;margin:8px 0}.dims{grid-column:span 1;grid-template-columns:repeat(3,1fr);gap:6px;display:grid}.dims label{margin:8px 0 0}fieldset.inline{margin:8px 0}label.radio,label.check{margin:4px 0;font-weight:500;display:block}label.radio input,label.check input{width:auto;margin-right:6px;display:inline}.shape-picks{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:2px 12px;display:grid}.city-canvas,.shape-canvas{border:2px solid var(--ink);touch-action:none;background:#e0f2fe;border-radius:12px;width:100%;height:clamp(300px,55vh,520px);overflow:hidden}.city-canvas:focus-visible,.shape-canvas:focus-visible{outline:3px solid var(--focus);outline-offset:3px}.city-canvas canvas,.shape-canvas canvas{display:block}.city-tools{flex-wrap:wrap;align-items:center;gap:12px;margin:10px 0 4px;display:flex}.swatches{gap:6px;display:flex}.swatch{border:2px solid #374151;border-radius:8px;width:34px;height:34px;padding:0}.swatch.on{outline:3px solid var(--ink);outline-offset:2px}.colour-list{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.colour-list input[type=color]{background:#fff;border:1px solid #6b7280;border-radius:6px;width:40px;height:34px;padding:2px}.shape-nav{justify-content:space-between;align-items:center;gap:12px;margin:10px 0 4px;font-size:1.1rem;display:flex}.shape-strip{grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:10px;margin-top:10px;display:grid}.shape-thumb .shape-canvas{height:160px}.shape-thumb span{text-align:center;margin-top:4px;font-size:.85rem;display:block}.props{grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:8px;margin:10px 0;display:grid}.props div{background:#f1f5f9;border-radius:8px;padding:8px 10px}.props dt{text-transform:uppercase;letter-spacing:.05em;color:var(--muted);font-size:.78rem}.props dd{margin:0;font-size:1.5rem;font-weight:700}.quiz label span{margin-top:4px;font-weight:600;display:block}button:disabled{opacity:.5;cursor:not-allowed}@media (width<=760px){h1 .muted{display:none}h1{font-size:1.4rem}.city-canvas,.shape-canvas{height:clamp(260px,45vh,400px)}}.lazy{text-align:center;color:var(--muted);padding:40px}