/* Shared control language. Diagram-specific styles remain in each lab. */
body.lab-page{--blue:#003366;--green:#1e5631;--red:#8b0000;--title:#1e2022;--body:#2b2d42;--muted:#64748b;--soft:#f8fafc;background:#fff;color:#2b2d42;font-family:Roboto,Arial,sans-serif;line-height:1.5;padding:32px 24px 48px}
.lab-page>.container,.lab-page>.wrap,.lab-page>.page{width:100%;max-width:1100px;margin-left:auto;margin-right:auto}.lab-page>.page{padding:0}.lab-page h1{font:800 clamp(27px,3vw,34px)/1.2 Montserrat,Arial,sans-serif;letter-spacing:-.02em}.lab-page h2,.lab-page h3{color:#1e2022}.lab-page header{margin-bottom:24px}.lab-page .lead,.lab-page .lead-text{font-size:16px;line-height:1.6}.lab-page button{font:600 14px/1.3 Roboto,Arial,sans-serif;min-height:44px;border:1px solid #64748b;border-radius:6px;padding:9px 13px;color:#2b2d42;background:#fff;letter-spacing:normal;text-transform:none;box-shadow:none;transition:background .15s,border-color .15s;cursor:pointer}
.lab-page button[data-ui-role="start"],.lab-page button[data-ui-role="play"]{background:#fff;color:#003366;border-color:#003366}.lab-page button[data-ui-role="step"]{background:#003366;color:#fff;border-color:#003366}.lab-page button[data-ui-role="clear"]{background:#fff;color:#8b0000;border-color:#8b0000}.lab-page button[data-ui-role="reset"],.lab-page button[data-ui-role="setup"]{background:#fff;color:#2b2d42;border-color:#64748b}.lab-page button:hover:not(:disabled){background:#f1f5f9;border-color:#003366;filter:none}.lab-page button[data-ui-role="step"]:hover:not(:disabled){background:#002244;color:#fff}.lab-page button[data-ui-role="play"][aria-pressed="true"]{background:#eff6ff;border-color:#003366;color:#003366}.lab-page button:disabled{opacity:.48;cursor:not-allowed;pointer-events:auto}.lab-page :is(button,a,input,select,textarea,summary):focus-visible{outline:3px solid #0284c7;outline-offset:3px}.lab-page :is(input,select,textarea){font:14px/1.4 Roboto,Arial,sans-serif;color:#2b2d42;border:1px solid #64748b;border-radius:6px;min-height:44px;padding:8px 11px;background:#fff;max-width:100%;outline-offset:3px}.lab-page input[type="range"]{accent-color:#003366;padding:0 4px;min-height:44px;border:0;background:transparent;cursor:pointer}.lab-page input:disabled,.lab-page select:disabled{opacity:.6;cursor:not-allowed}.lab-page :is(.control-panel,.controls){justify-content:flex-start;gap:12px;align-items:flex-end;max-width:100%;border-radius:10px}.lab-page :is(.group label,.control-group label){font:700 12px/1.4 Roboto,Arial,sans-serif;color:#475569;letter-spacing:.02em;text-transform:none}.lab-page :is(.actions,.btn-group,.button-row,.traversal-buttons){flex-wrap:wrap;gap:8px}.lab-page .lab-control-section{width:100%;display:flex;flex-wrap:wrap;align-items:flex-end;gap:12px;padding:4px 0 12px;border-bottom:1px solid #d8dee4}.lab-page .lab-control-section:last-child{border-bottom:0;padding-bottom:0}.lab-page .lab-group-title{width:100%;font-size:11px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:#64748b}.lab-page .lab-playback-state{font-size:12px;align-self:center;color:#475569;margin:0 4px;max-width:240px}.lab-page .lab-help{width:100%;font-size:13px;color:#64748b;line-height:1.5;margin:8px 0 0}.lab-page .tree-tools button{min-height:36px;min-width:36px;padding:6px 9px}.lab-page .tree-tools input{min-height:36px}.lab-page .modes,.lab-page .tab-strip{flex-wrap:wrap}.lab-page button[data-ui-role="choice"]{background:#fff;color:#003366;border:1px solid #94a3b8;border-radius:6px}.lab-page button[data-ui-role="choice"][aria-pressed="true"]{background:#eff6ff;color:#003366;border-color:#003366;box-shadow:inset 0 -3px #003366}.lab-page .ops button{font-family:'Courier Prime',monospace;background:#fff;color:#003366;border-color:#003366}.lab-page .q-opts button.ok{background:#f0fdf4;border-color:#1e5631;color:#1e5631}.lab-page .q-opts button.no{background:#fef2f2;border-color:#8b0000;color:#8b0000}.lab-page .out,.lab-page .trace,.lab-page .statusbox{background:#f8fafc}.lab-page [data-lab-status]{overflow-wrap:anywhere}.lab-page .tree-head{align-items:center}.lab-page .tree-head h2{margin-bottom:0}.lab-page .speed-hint{font-size:11px}
@media(max-width:600px){body.lab-page{padding:20px 14px 36px}.lab-page :is(.controls,.control-panel){padding:14px}.lab-page :is(.control-group,.controls>.group){max-width:100%;width:100%}.lab-page .lab-control-section>.group{max-width:100%}.lab-page .lab-control-section .button-row{width:auto}.lab-page .stage{max-width:100%;padding:14px}.lab-page .h2h{grid-template-columns:110px minmax(180px,1fr) 140px;min-width:450px}.lab-page .modes{flex-wrap:wrap}.lab-page .layout>*{min-width:0}}
@media(prefers-reduced-motion:reduce){.lab-page *, .lab-page *::before,.lab-page *::after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}
.lab-page .cols>*{min-width:0}.lab-page .viz{min-width:0;max-width:100%}.lab-page .q-opts button.ok:disabled,.lab-page .q-opts button.no:disabled{opacity:1}.lab-page .card[role="button"]:focus-visible{outline:3px solid #0284c7;outline-offset:4px}

.lab-page .tree-head{display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;margin-bottom:12px}.lab-page .tree-tools{display:flex;align-items:center;gap:5px;font-size:12px;color:#64748b}.lab-page .tree-tools input{width:90px}.lab-page .tree-wrap{height:430px;min-height:0;overflow:auto}.lab-page .tree-wrap .tree{min-width:0;min-height:0}.lab-page .bin-capacity{height:8px;min-height:8px;border:1px solid #94a3b8;border-radius:4px;overflow:hidden;background:#f1f5f9;margin-top:7px}.lab-page .bin-capacity span{display:block;height:100%;background:#003366}
