:root{color-scheme:dark;--bg:#070d19;--surface:#0c1424;--panel:#10192b;--panel-alt:#131f33;--panel-border:#22314a;--line:#25334b;--text:#f4f8ff;--muted:#8898b5;--teal:#54edce;--teal-dark:#194d53;--yellow:#f9c77b;--purple:#a7a0ff;--red:#f486a1;--mono:'SFMono-Regular',Consolas,'Liberation Mono',monospace;--sans:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}
*{box-sizing:border-box}html,body{margin:0;min-width:320px;min-height:100%;background:var(--bg);color:var(--text);font-family:var(--sans)}button,input,textarea,select{font:inherit}button{cursor:pointer}button:disabled{opacity:.33;cursor:not-allowed}button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,summary:focus-visible{outline:2px solid var(--teal);outline-offset:3px}::selection{background:#4de6d855;color:#fff}
.app-shell{min-height:100dvh;display:flex;flex-direction:column;background:radial-gradient(ellipse at 70% -10%,#10243c 0,transparent 45%),var(--bg)}
.header{height:77px;flex:none;display:flex;align-items:center;justify-content:space-between;gap:22px;padding:0 clamp(18px,2.4vw,38px);border-bottom:1px solid var(--line);background:#0b1424d9;position:relative;z-index:4}
.brand{display:flex;align-items:center;gap:14px;min-width:215px}.brand-symbol{width:39px;height:39px;display:grid;grid-template-columns:repeat(2,12px);grid-template-rows:repeat(2,12px);gap:4px;transform:rotate(-13deg);place-content:center;border:1px solid #24556b;border-radius:11px;background:linear-gradient(145deg,#182e40,#0c202c);box-shadow:0 0 28px #28debe14}.brand-symbol span{border-radius:3px;background:#5be9d3}.brand-symbol span:nth-child(2){opacity:.42}.brand-symbol span:nth-child(3){opacity:.72}.brand-symbol span:nth-child(4){opacity:.2}.brand-word strong{display:block;letter-spacing:.085em;font-size:18px;line-height:1.15;font-weight:850}.brand-word strong span{color:var(--teal)}.brand-word small{display:block;letter-spacing:.16em;font-size:8px;color:#7f93ae;margin-top:4px;font-weight:750}.header-center{display:flex;align-items:center;justify-content:center;gap:18px;color:#8f9db5;font-size:12px;white-space:nowrap}.header-rule{height:1px;width:36px;background:#2a3b52}.header-right{display:flex;align-items:center;gap:9px;color:#c4d2e2;font-family:var(--mono);font-size:10px;letter-spacing:.04em;white-space:nowrap}.status-dot,.pulse-dot{width:7px;height:7px;display:inline-block;flex:none;border-radius:50%;background:var(--teal);box-shadow:0 0 12px var(--teal)}.version-chip{color:#a8bad4;padding:6px 8px;background:#182337;border-radius:6px;margin-left:8px}
.layout{display:grid;grid-template-columns:286px minmax(370px,1fr) 313px;gap:12px;padding:12px;flex:1;min-height:0;max-width:2300px;width:100%;margin:auto;height:calc(100dvh - 112px)}.panel{background:linear-gradient(180deg,#101a2b,#0c1625);border:1px solid var(--panel-border);border-radius:14px;display:flex;flex-direction:column;min-height:0;overflow:hidden}.panel-head{padding:23px 20px 21px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;flex:none}.eyebrow{color:var(--teal);font-family:var(--mono);font-size:10px;letter-spacing:.13em;font-weight:750}.panel-head h2{font-size:18px;letter-spacing:-.025em;margin:9px 0 0;font-weight:720}.panel-head-icon{font-size:23px;color:#7295aa}.panel-scroll{overflow:auto;padding:20px;scrollbar-width:thin;scrollbar-color:#304861 transparent;min-height:0;flex:1}.control-group{margin:0 0 24px}.field-label{font-size:12px;font-weight:650;color:#d2deec;display:block;margin-bottom:10px}.label-row{display:flex;align-items:center;justify-content:space-between;gap:5px}.label-row .field-label{margin-bottom:11px}.field-value{color:#f7ffff;border:1px solid #2e5360;background:#19343e;padding:3px 7px;border-radius:5px;font-family:var(--mono);font-size:11px;font-weight:700;margin-top:-7px}.field-value.accent{color:var(--teal)}.field-note{font-size:10.8px;line-height:1.55;color:#8294ac;margin-top:10px}.range-ends{display:flex;justify-content:space-between;font-family:var(--mono);font-size:10px;color:#778ba6;margin-top:6px}.control{display:block;width:100%;border:1px solid #2c3c54;color:#ecf7ff;background:#0c1525;border-radius:7px;font-size:12px;padding:11px 12px;outline:none;min-height:40px}.control:focus{border-color:#5ae9d1;box-shadow:0 0 0 2px #5ae9d112}.control option{background:#0d1929}.control.textarea{min-height:74px;resize:vertical;line-height:1.6;font-family:var(--mono);font-size:11px;color:#aaf3e5}.field-pair{display:grid;grid-template-columns:1fr 1fr;gap:11px}.field-pair .control-group{min-width:0;margin-bottom:15px}.field-pair input{padding-left:8px;padding-right:5px;font-family:var(--mono)}
input[type=range]{appearance:none;-webkit-appearance:none;width:100%;height:5px;background:linear-gradient(to right,#43cfb9 0%,#25727e 60%,#23334b 100%);outline:none;border-radius:9px;cursor:pointer;accent-color:#52e6ce}input[type=range]::-webkit-slider-thumb{appearance:none;width:15px;height:15px;background:#ecfffd;border-radius:50%;border:3px solid #45ceba;box-shadow:0 0 0 3px #58e5cc20}input[type=range]::-moz-range-thumb{width:10px;height:10px;background:#ecfffd;border-radius:50%;border:3px solid #45ceba}
.button-pair{display:flex;gap:9px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;flex:1;border-radius:8px;border:1px solid #31425b;padding:11px 9px;font-size:11px;font-weight:750;transition:background .16s,border-color .16s,transform .15s;min-height:39px;white-space:nowrap}.btn:active,.transport-btn:active{transform:translateY(1px)}.btn-primary{background:var(--teal);color:#052326;border-color:var(--teal);box-shadow:0 5px 20px #3ae8bf18}.btn-primary:hover{background:#8ff7e6}.btn-soft{background:#18273b;color:#d1e3f4}.btn-soft:hover,.btn-outline:hover{background:#20364b;border-color:#4e7885}.btn-outline{background:transparent;color:var(--teal);border-color:#30615f;justify-content:space-between;padding:10px 13px}.btn-full{width:100%;margin-top:11px}.section-divider{height:1px;background:#28354a;margin:22px 0}.tiny-tag{color:#7d91ab;font-family:var(--mono);font-size:10px;white-space:nowrap}.speed-line{display:flex;align-items:center;gap:9px}.speed-icon{font-size:19px;color:var(--teal)}.speed-line input{flex:1}.speed-line .field-value{margin:0;white-space:nowrap}.info-note{display:flex;gap:10px;align-items:flex-start;margin:6px -4px 0;padding:13px 11px;border-radius:9px;background:#12303955;border:1px solid #1e535166}.info-note p{font-size:10.6px;line-height:1.6;color:#99b9bf;margin:0}.note-icon{font-size:17px;color:#64d9cd;line-height:1}
.workspace{display:flex;flex-direction:column;gap:12px;min-width:0;min-height:0}.viewport{position:relative;min-height:280px;flex:1;background:radial-gradient(ellipse at center 35%,#152840 0%,#091525 50%,#090f1d 85%);border:1px solid var(--panel-border);border-radius:14px;overflow:hidden}.viewport-radial{position:absolute;inset:0;pointer-events:none;z-index:0;background:radial-gradient(ellipse at center 70%,#2c7c7816,transparent 42%)}.viewport-head{position:absolute;top:0;left:0;right:0;padding:22px 24px;display:flex;justify-content:space-between;align-items:flex-start;gap:12px;z-index:2;pointer-events:none}.viewport-head h1{font-size:clamp(20px,1.7vw,29px);font-weight:770;letter-spacing:-.045em;line-height:1.25;margin:8px 0 0;white-space:nowrap}.title-cursor{color:var(--teal);margin-left:3px}.scene-actions{display:flex;align-items:center;gap:4px;background:#111e31cc;border:1px solid #2d3d56;padding:4px;border-radius:8px;pointer-events:auto}.scene-btn{font-family:var(--mono);font-size:10px;border:0;background:transparent;color:#8ca0b6;border-radius:5px;padding:8px 9px;white-space:nowrap}.scene-btn.active,.scene-btn:hover{color:#e3fff8;background:#234b53}.stats-strip{display:flex;gap:0;position:absolute;left:24px;top:104px;z-index:2;background:#101b2aca;border:1px solid #2a394d;border-radius:8px;pointer-events:none}.stat{padding:9px 13px;min-width:73px}.stat+.stat{border-left:1px solid #2a394d}.stat span{display:block;color:#8a9db2;font-family:var(--mono);font-size:9px;letter-spacing:.08em}.stat strong{display:block;color:#f2ffff;margin-top:5px;font-family:var(--mono);font-size:15px;font-weight:700;white-space:nowrap}.stat:first-child strong{color:var(--teal)}.scene-target{position:absolute;inset:0;z-index:1}.scene-target canvas{width:100%;height:100%;display:block;touch-action:none}.viewport-foot{position:absolute;bottom:0;left:0;right:0;padding:15px 21px 15px;display:flex;justify-content:space-between;align-items:center;gap:10px;background:linear-gradient(transparent,#090f1ce6 30%,#090f1cf5);pointer-events:none;z-index:3}.mouse-hint{color:#91a4b9;font-family:var(--mono);font-size:10px}.hint-glyph{color:var(--teal);font-size:17px;margin-right:6px}.sep{padding:0 5px;color:#507184}.scene-state{font-family:var(--mono);font-size:10px;white-space:nowrap;color:#adc4d1;display:flex;align-items:center;gap:7px}
.fallback-stage{position:absolute;inset:150px 15px 42px;z-index:1;overflow:auto;display:grid;place-items:center;pointer-events:none}.fallback-loading{font-family:var(--mono);font-size:12px;color:#98b4c5;display:flex;align-items:center;gap:12px}.spinner{width:16px;height:16px;border:2px solid #2b6b70;border-top-color:#72f4dd;border-radius:50%;animation:spin .9s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.fallback-stage.fallback-active{pointer-events:auto;display:block;background:#0a1728b5;border-radius:10px;padding:12px;scrollbar-width:thin}.fallback-warning{color:#f1bb86;font-size:11px;line-height:1.6;margin:4px 0 12px}.fallback-lane{margin:12px 0}.fallback-lane b{font-size:10px;color:#86a9be;font-family:var(--mono);letter-spacing:.08em}.fallback-chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}.fallback-chip{border:1px solid #33586c;background:#18384e;color:#f3ffff;font-family:var(--mono);font-size:12px;padding:7px;border-radius:6px}.fallback-chip.active{border-color:#ffd181;background:#66482e}.fallback-buckets{display:grid;grid-template-columns:repeat(auto-fit,minmax(64px,1fr));gap:7px;margin-top:8px}.fallback-bucket{min-height:50px;padding:7px;background:#131f30;border:1px solid #2c4057;border-radius:7px}.fallback-bucket.active{border-color:#ecd38b}.fallback-bucket em{display:block;font-style:normal;color:#88a7bf;font-family:var(--mono);font-size:11px;margin-bottom:5px}
.transport{background:linear-gradient(180deg,#101a2b,#0d1626);border:1px solid var(--panel-border);border-radius:14px;flex:none;padding:19px 22px 17px}.transport-top,.transport-bottom{display:flex;align-items:center;justify-content:space-between;gap:14px}.transport-caption{display:flex;align-items:center;gap:8px;font-family:var(--mono);font-size:10px;color:#8b9db4;letter-spacing:.05em}.transport-caption strong{font-family:var(--sans);font-size:11px;letter-spacing:0;margin-left:7px;font-weight:600;color:#d4e9ef}.pulse-dot{background:#63d8d0;width:6px;height:6px}.transport-hint{font-size:10px;color:#637d94}.transport-hint span{padding:0 4px}.transport>input{display:block;margin:20px 0 21px;width:100%}.transport-btn{height:37px;min-width:39px;display:inline-flex;align-items:center;justify-content:center;border-radius:7px;border:1px solid #2d4157;background:#15253a;color:#c8dded;font-size:21px;transition:background .17s,color .17s,transform .12s}.transport-btn:hover{background:#224158}.transport-buttons{display:flex;gap:7px}.play-btn{font-family:var(--mono);font-size:12px;letter-spacing:.025em;gap:8px;min-width:132px;border-color:#4bd6c4;background:#43d8c4;color:#03292e;font-weight:800}.play-btn:hover{background:#87f4e3}.play-btn.is-playing{background:#294f59;color:#c8faff}.transport-right{display:flex;align-items:center;gap:15px}.text-btn{background:none;border:0;color:#8eabc0;font-size:11px;white-space:nowrap}.text-btn:hover{color:var(--teal)}.divider-vertical{height:16px;width:1px;background:#34465c}.mono{font-family:var(--mono);font-size:11px;color:#c0d4e0}
.inspector-panel .panel-scroll{padding:19px 17px}.inspector-status{margin-bottom:17px}.inspector-headline{display:flex;align-items:center;justify-content:space-between;gap:9px}.phase-tag{background:#153d40;color:#7deddb;border:1px solid #235e5a;padding:5px 8px;border-radius:5px;font-family:var(--mono);font-size:9px;letter-spacing:.075em;font-weight:800}.muted-mono{color:#8096a9;font-family:var(--mono);font-size:10px}.inspector-status h3{font-size:18px;font-weight:750;letter-spacing:-.02em;line-height:1.3;margin:14px 0 9px}.inspector-status p{color:#91a8be;font-size:11.4px;line-height:1.7;margin:0}.formula-box{border:1px solid #30535c;background:linear-gradient(125deg,#18363e,#112535);padding:15px;border-radius:9px;margin-bottom:24px}.formula-label{font-family:var(--mono);font-size:9px;color:#71d6c6;letter-spacing:.09em}.formula{color:#e6fff7;font-family:var(--mono);font-size:12px;font-weight:700;margin:13px 0;overflow-wrap:anywhere;line-height:1.65}.formula strong{color:#f7ce79}.formula-bottom{font-size:10.4px;color:#96b6be;line-height:1.65}.inspect-section{margin-bottom:24px}.section-title{display:flex;align-items:center;justify-content:space-between;gap:7px;margin-bottom:11px}.section-title span{font-family:var(--mono);font-size:10px;color:#c3d5e3;font-weight:750;letter-spacing:.075em}.section-title small{color:#7e92ac;font-family:var(--mono);font-size:9px}.bucket-list{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px}.bucket-cell{min-height:51px;background:#121f30;border:1px solid #2c4055;border-radius:7px;padding:7px 5px;display:flex;align-items:center;flex-direction:column;justify-content:center;gap:5px;transition:.15s}.bucket-cell.active{background:#344133;border-color:#ecc379;box-shadow:inset 0 0 0 1px #f5cb6a21}.bucket-cell.has-values{border-color:#356b71}.bucket-cell.active.has-values{border-color:#edce83}.bucket-digit{color:#9ab9c9;font-size:11px;font-family:var(--mono);font-weight:750}.bucket-count{color:#627d9b;font-family:var(--mono);font-size:10px}.bucket-cell.has-values .bucket-count{color:#6debd8}.bucket-cell.active .bucket-digit{color:#ffdb92}.chip-collection{min-height:43px;display:flex;flex-wrap:wrap;gap:5px;align-items:flex-start}.data-chip{color:#bdf7ed;border:1px solid #32656d;background:#17404b;border-radius:5px;padding:6px 7px;font:11px var(--mono);white-space:nowrap}.data-chip.is-last{border-color:#f2c272;color:#ffe6a6;background:#493c2d}.empty-note{color:#71899f;font-size:10.6px;font-style:italic;line-height:1.5}.selected-card{border:1px dashed #335064;border-radius:8px;padding:12px;background:#101f30;color:#819db1;font-size:10.9px;line-height:1.7}.selected-card strong{color:var(--teal);font-family:var(--mono);font-size:14px}.selected-card code{font-family:var(--mono);color:#e7d39e;font-size:11px}.codepanel{padding:8px 0;background:#0b1422;border:1px solid #223750;border-radius:8px;overflow-x:auto}.code-line{display:flex;align-items:flex-start;gap:9px;min-width:max-content;line-height:1.8;padding:3px 9px;border-left:2px solid transparent}.code-line span{font-size:10px;font-family:var(--mono);color:#56728a;width:20px}.code-line code{color:#91abbf;font-size:10px;font-family:var(--mono);white-space:pre}.code-line.is-active{background:#1b393d;border-left-color:#59ebd1}.code-line.is-active code{color:#dcfff7}.code-line.is-active span{color:#62dbce}.study-details{border-top:1px solid #2d3d53;padding-top:17px;margin-top:18px}.study-details summary{color:#bee7df;cursor:pointer;font-size:11px;font-weight:650;display:flex;justify-content:space-between;list-style:none}.study-details summary::-webkit-details-marker{display:none}.study-details p{font-size:10.8px;line-height:1.75;color:#91a9b9}.study-details code{color:#aef1de;font-family:var(--mono)}
.footer{height:23px;flex:none;display:flex;justify-content:space-between;padding:0 24px 8px;gap:10px;color:#657c94;font-family:var(--mono);font-size:9px;letter-spacing:.065em}.footer-star{color:var(--teal);padding:0 3px}.toast{position:fixed;left:50%;bottom:25px;transform:translate(-50%,30px);z-index:30;max-width:min(90vw,480px);padding:12px 18px;border-radius:10px;background:#1f3841;color:#d4fff4;box-shadow:0 14px 40px #0007;border:1px solid #36756f;font-size:12px;line-height:1.5;opacity:0;pointer-events:none;transition:opacity .25s,transform .25s}.toast.show{opacity:1;transform:translate(-50%,0)}.toast.error{background:#49303e;border-color:#aa526e;color:#ffe1e8}
@media (min-width:1600px){.layout{grid-template-columns:305px minmax(450px,1fr) 328px;gap:15px;padding:15px}.panel-scroll{padding:22px}.viewport-head{padding:25px 30px}.stats-strip{left:30px}.bucket-list{gap:7px}}
@media (max-width:1260px){.layout{grid-template-columns:256px minmax(355px,1fr) 280px;gap:8px;padding:8px}.panel-head{padding:20px 16px}.panel-scroll{padding:15px}.inspector-panel .panel-scroll{padding:15px 12px}.header-center{display:none}.header{height:68px}.viewport-head{padding:19px 16px}.stats-strip{left:16px}.scene-actions{gap:1px}.scene-btn{padding:8px 6px}.transport{padding:16px}.transport-hint{display:none}.bucket-list{gap:4px}.bucket-cell{min-height:47px}}
@media (max-width:1020px){.layout{grid-template-columns:260px minmax(0,1fr);height:auto;min-height:calc(100dvh - 100px);align-items:start}.settings-panel{grid-row:1;grid-column:1;max-height:805px}.workspace{grid-row:1 / span 2;grid-column:2;min-height:780px}.inspector-panel{grid-row:2;grid-column:1;max-height:680px}.panel-scroll{overflow:visible}.panel{max-height:none;overflow:visible}.inspector-panel .panel-scroll{overflow:visible}.footer{padding-top:8px;height:auto;flex-wrap:wrap}.viewport{min-height:590px}.scene-btn{font-size:9px}}
@media (max-width:700px){.header{padding:0 14px;height:65px}.brand{min-width:0}.header-right{font-size:9px}.header-right .version-chip{display:none}.layout{display:flex;flex-direction:column;padding:9px;gap:9px}.panel,.workspace{width:100%}.settings-panel{order:2;max-height:none}.workspace{order:1;min-height:0}.inspector-panel{order:3;max-height:none}.panel-scroll{padding:17px}.viewport{height:590px;flex:none}.viewport-head{flex-direction:column;align-items:flex-start;gap:10px;padding:16px}.viewport-head h1{font-size:21px}.stats-strip{top:136px;left:14px}.stat{min-width:64px;padding:8px 9px}.stat strong{font-size:12px}.scene-actions{pointer-events:auto}.viewport-foot{padding:10px 12px}.mouse-hint{font-size:8.5px}.scene-state{font-size:9px}.transport{padding:14px}.transport-caption strong{margin-left:0}.transport-right{gap:8px}.transport-btn{min-width:35px}.play-btn{min-width:112px}.transport-hint{display:none}.footer{padding:8px 15px 13px}.footer span:nth-child(2){display:none}}
@media (prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation:none!important;transition:none!important}}
/* Desktop: keep the three-column workspace in the available screen height. */
@media (min-width:1021px){.app-shell{height:100dvh;min-height:620px}.layout{height:auto;min-height:0;flex:1}.panel-scroll,.inspector-panel .panel-scroll{overflow-y:auto}}
/* Prevent horizontal overflow of transport buttons on narrow phones. */
@media (max-width:700px){.transport-bottom{flex-wrap:wrap}.transport-buttons{width:100%;justify-content:space-between}.transport-right{width:100%;justify-content:flex-end}.transport{padding-bottom:11px}.fallback-stage{top:191px}.header-right{max-width:44%;font-size:8px;white-space:normal;text-align:right}}
/* SORT LAB v2: four-mode switcher + mode-aware inspector. Builds on RADIX LAB v1 styling. */
.algorithm-nav{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;padding:10px 12px 0;max-width:2300px;width:100%;margin:0 auto;flex:none}
.algorithm-tab{min-width:0;display:flex;align-items:center;gap:11px;min-height:70px;text-align:left;padding:12px 14px;background:#101b2c;border:1px solid #27364d;border-radius:11px;color:#d3e1ef;position:relative;overflow:hidden;transition:background .2s,border-color .2s,transform .16s}
.algorithm-tab:hover{background:#17273c;border-color:#3a6172}.algorithm-tab.active{background:linear-gradient(112deg,#18383e,#13263a);border-color:#4fbfba;box-shadow:0 0 0 1px #2ccfb121,inset 3px 0 0 #62e8d1}
.algorithm-tab.active:before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at 5% 15%,#42c6b918,transparent 60%)}
.tab-index{color:#59768f;font:700 9px var(--mono);align-self:flex-start;margin-top:1px}
.tab-icon{flex:none;width:33px;height:33px;border-radius:9px;display:grid;place-items:center;background:#253949;color:#9be1d6;font-size:24px;font-weight:700}
.quick-icon{background:#3d2d43;color:#ffb9c2}.merge-icon{background:#302f51;color:#afa3ff}.bubble-icon{background:#263a4c;color:#83cbee}.radix-icon{background:#214644;color:#5de4cd}
.tab-copy{min-width:0;display:flex;flex-direction:column;gap:4px}.tab-copy strong{font-size:13px;white-space:nowrap;font-weight:750;letter-spacing:-.025em}.tab-copy small{font-size:10px;color:#8fa1b6;white-space:nowrap}
.tab-pill{margin-left:auto;white-space:nowrap;font:700 9px var(--mono);color:#a2bbc7;background:#1e3040;border:1px solid #2b485b;border-radius:5px;padding:5px 6px}
.viewport-subtitle{margin:5px 0 0;font:10px var(--mono);color:#8baabf;letter-spacing:.03em}
.algorithm-setting[hidden]{display:none!important}
.toggle-control{display:flex;align-items:center;gap:11px;color:#d7e9ed;font-size:12px;cursor:pointer;user-select:none}.toggle-control input{position:absolute;opacity:0;width:1px;height:1px}
.toggle-track{position:relative;width:39px;height:21px;border-radius:15px;background:#263449;border:1px solid #3f526b;flex:none;transition:.2s}.toggle-track:before{content:"";position:absolute;top:3px;left:3px;width:13px;height:13px;background:#c7d9eb;border-radius:50%;transition:.2s}.toggle-control input:checked+.toggle-track{background:#27645d;border-color:#4ed8c0}.toggle-control input:checked+.toggle-track:before{left:20px;background:#b7fff3}.toggle-control input:focus-visible+.toggle-track{outline:2px solid var(--teal);outline-offset:3px}
.algorithm-facts{display:flex;flex-wrap:wrap;align-items:center;gap:6px;padding-bottom:16px;margin-bottom:17px;border-bottom:1px solid #2a3c51}
.fact-chip{font:700 9px var(--mono);padding:6px 8px;border:1px solid #365469;border-radius:6px;background:#16283a;color:#b7d1e3;white-space:nowrap}.fact-chip.stable{background:#16413d;border-color:#387366;color:#79edcc}.fact-chip.unstable{background:#4b3337;border-color:#7b4d5d;color:#ffb1c2}
.scene-legend{position:absolute;z-index:3;left:20px;bottom:57px;display:flex;flex-wrap:wrap;gap:11px;pointer-events:none;background:#0a1420aa;border:1px solid #30435a9c;border-radius:7px;padding:9px 11px;backdrop-filter:blur(5px)}
.legend-item{display:flex;align-items:center;gap:6px;font:9px var(--mono);color:#a6bacb;white-space:nowrap}.legend-dot{width:8px;height:8px;border-radius:3px;background:#6ce5d0}.legend-dot.pivot{background:#ff9fb7}.legend-dot.active{background:#ffd086}.legend-dot.sorted{background:#50c9a9}.legend-dot.left{background:#76d3ec}.legend-dot.right{background:#9b95f8}.legend-dot.aux{background:#9a93fc}
.mode-list{min-height:28px}.mode-list .bucket-list{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:5px}
.trace-list{display:flex;flex-direction:column;gap:7px}.trace-row{display:flex;align-items:center;justify-content:space-between;gap:10px;border:1px solid #2c4055;background:#121f30;padding:10px 10px;border-radius:7px;min-width:0}
.trace-row .trace-label{font:10px var(--mono);color:#9cbed1;white-space:nowrap}.trace-row .trace-value{font:700 10px var(--mono);color:#edfff7;text-align:right;overflow-wrap:anywhere}.trace-row.important{background:#263b40;border-color:#48877f}.trace-row.important .trace-value{color:#ffdb9c}.trace-label .trace-key{color:#58dfcd;margin-right:8px}
.trace-badges{display:flex;flex-wrap:wrap;gap:5px;margin-top:10px}.trace-badge{background:#172e3b;border:1px solid #355263;border-radius:5px;color:#98ccdc;font:10px var(--mono);padding:5px 7px}.trace-badge.active{border-color:#d6ad71;background:#493b2c;color:#ffdb9c}.trace-badge.done{border-color:#3f806c;background:#1d4540;color:#a4f2d9}
.study-complexity{display:flex;flex-wrap:wrap;gap:6px}.study-complexity span{border-radius:4px;border:1px solid #33566c;padding:5px 7px;font:9px var(--mono);color:#a6ded6}.fallback-stage{top:150px;bottom:89px}
.fallback-stage.fallback-active{overflow-y:auto}.fallback-warning{border:1px solid #726344;background:#41371b4d;border-radius:6px;padding:8px 10px}
.fallback-lane{border:1px solid #283c52;background:#1020339a;border-radius:8px;padding:10px}
.fallback-chip.pivot{background:#603648;border-color:#ffb1be}.fallback-chip.done{background:#1d4b40;border-color:#59d5b4}.fallback-chip.active{background:#6a4930;border-color:#ffd181}
.fallback-slot{min-width:40px;display:flex;flex-direction:column;align-items:center;gap:4px}.fallback-slot small{font:8px var(--mono);color:#678399}
.fallback-lane .fallback-chips{flex-wrap:wrap;gap:4px}
@media (min-width:1021px){.layout{height:auto;min-height:0;flex:1}.app-shell{min-height:680px}.algorithm-nav{padding-top:9px}.viewport-head{padding-top:20px}.stats-strip{top:121px}}
@media (max-width:1360px){.tab-pill{display:none}.algorithm-tab{gap:9px;padding:10px}.tab-copy strong{font-size:12px}.tab-copy small{font-size:9px}}
@media (max-width:1020px){.algorithm-nav{padding:9px 8px 0}.tab-index{display:none}.tab-icon{width:30px;height:30px;font-size:19px}.algorithm-tab{min-height:63px}.layout{height:auto}.stats-strip{top:122px}}
@media (max-width:700px){.algorithm-nav{display:flex;overflow-x:auto;gap:7px;padding:8px 9px 0;scrollbar-width:thin;scroll-snap-type:x proximity}.algorithm-tab{min-width:151px;flex:1;scroll-snap-align:start;min-height:64px}.tab-copy small{font-size:9px}.viewport-head{padding:15px}.viewport-head h1{font-size:20px}.viewport{height:625px}.stats-strip{top:153px;left:14px}.stat{min-width:64px}.scene-legend{left:10px;right:10px;bottom:55px;gap:8px;padding:7px}.legend-item{font-size:8px}.fallback-stage{top:195px;bottom:96px}.footer{font-size:8px}}
@media (max-width:400px){.stat{padding:7px 8px;min-width:0}.stat strong{font-size:11px}.stat span{font-size:8px}.scene-actions .scene-btn{font-size:8px}.mouse-hint{display:none}.scene-legend{flex-wrap:wrap}}
.comparison-table{overflow:auto;max-width:100%;margin-top:12px}.comparison-table table{border-collapse:collapse;min-width:100%;white-space:nowrap;font:10px var(--mono)}.comparison-table td,.comparison-table th{padding:9px 7px;text-align:left;border-bottom:1px solid #2d3f53;color:#a7bacd}.comparison-table th{font-size:9px;color:#76dbca;font-weight:700}.comparison-table tr.current td{color:#e3fff8;background:#1b383a}.compare-details summary{color:#e2c68b}
/* Explicit width is important for Chromium when switching fallback from its initial grid loader. */
.fallback-stage.fallback-active .fallback-lane{display:block;width:100%}
.fallback-stage.fallback-active .fallback-buckets{width:100%;grid-template-columns:repeat(auto-fit,minmax(65px,1fr))}
.fallback-stage.fallback-active .fallback-warning{width:100%}