.lab-page{background:transparent}#lab{max-width:1100px;margin:auto;padding:8px 0;min-width:0}.lab-heading{display:flex;justify-content:space-between;align-items:center;gap:20px;padding-bottom:20px;border-bottom:1px solid var(--line)}.lab-heading h1{font-size:var(--xl);margin:8px 0 0;letter-spacing:-.03em}.count{font-size:var(--xl);font-weight:700;color:var(--teal);text-align:center;line-height:1.2}.count small{display:block;font-size:var(--xs);font-weight:400;margin-top:4px}.pick{margin-top:24px}.pick label,.code-panel>label{display:block;font-size:var(--sm);font-weight:700;margin-bottom:8px}.stepbar{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-top:8px}#position{font-size:var(--xs);color:var(--muted)}.catalog{margin-top:20px;border-block:1px solid var(--line)}.catalog summary{font-size:var(--sm);padding:14px 0}#catalog{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;padding-bottom:16px}#catalog button{text-align:left;font-size:var(--xs);min-width:0;padding:10px}#catalog button[aria-pressed=true]{background:var(--teal);color:white}.example-head{margin:28px 0 20px}.example-head h2{font-size:var(--lg);margin:8px 0}.example-head p{font-size:var(--sm);color:var(--muted);line-height:1.65;margin:0}.stage{position:relative;border-radius:12px;background:#062225;overflow:hidden}.stage canvas{display:block;width:100%;height:400px;touch-action:pan-y;cursor:crosshair}.stage:focus-within{outline:3px solid #b68b32;outline-offset:3px}.stage-caption{position:absolute;bottom:12px;left:16px;pointer-events:none;font:var(--xs)/1.4 Consolas,monospace;color:#b8d6cb;letter-spacing:.12em}.toolbar{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px}.toolbar button{flex:1 1 auto}.status{font-size:var(--xs);color:#385850;min-height:24px;margin:12px 0;overflow-wrap:anywhere}.help,.source-note{font-size:var(--xs);line-height:1.75;color:var(--muted)}fieldset{margin:24px 0;padding:20px;border:1px solid var(--line);border-radius:12px;min-width:0}legend{font-size:var(--sm);font-weight:700;padding:0 8px}.controls{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.param{min-width:0}.param label{display:flex;justify-content:space-between;gap:8px;font-size:var(--xs);font-weight:600;margin-bottom:8px}.param output{color:var(--teal)}.param input[type=range]{display:block;width:100%;padding:0;min-height:34px;margin:0}.param input[type=color]{width:100%;height:44px;padding:4px}.param select{font-size:var(--sm)}.checks{display:grid;gap:8px;margin-top:20px}.checks label{display:flex;align-items:center;gap:10px;font-size:var(--xs);min-height:32px}.checks input{width:18px;height:18px;flex:none;min-height:0}.exercise{font-size:var(--sm);line-height:1.75;padding:20px;background:var(--light);border-radius:10px}.code-panel{margin-top:28px;padding:24px 0;border-block:1px solid var(--line)}.code-head{display:flex;gap:16px;justify-content:space-between;align-items:center;margin-bottom:16px}.code-head h2{font-size:var(--lg);margin:0}#modified{font-size:var(--xs);color:var(--muted)}#code{display:block;width:100%;height:300px;resize:vertical;background:var(--deep);color:#e4f2e9;font:13px/1.65 Consolas,monospace;white-space:pre;overflow:auto;padding:18px;margin-top:12px;border-radius:8px;border:1px solid #306364}.source-note{margin-top:24px}button:disabled{opacity:.5;cursor:not-allowed}.lab-page button,.lab-page select{min-height:44px}a{overflow-wrap:anywhere}@media(max-width:600px){.lab-heading h1{font-size:var(--lg)}.count{font-size:var(--lg)}.controls{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}fieldset{padding:14px}.stage canvas{height:320px}#catalog{grid-template-columns:repeat(2,minmax(0,1fr))}.toolbar button{font-size:var(--xs);padding:10px 12px}.code-head{align-items:flex-start}.code-panel h2{font-size:var(--lg)}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}