/* Cuántica method laboratories. Scoped to avoid affecting the atlas shell. */
.demo.qlab { margin: 24px 0; padding: 0; overflow: hidden; border: 1px solid var(--line); border-radius: 4px; background: var(--panel); color: var(--ink); }
.qlab * { box-sizing: border-box; }
.qlab .qlab-top { padding: 20px 22px 0; display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.qlab .qlab-kicker { display: block; font: 600 10px/1.4 inherit; font-size: 10px; letter-spacing: .11em; text-transform: uppercase; color: var(--mut); margin-bottom: 7px; }
.qlab .qlab-title { margin: 0; font-size: 19px; line-height: 1.25; font-weight: 550; letter-spacing: -.035em; }
.qlab .qlab-badge { border: 1px solid var(--line); border-radius: 20px; padding: 5px 9px; white-space: nowrap; font-size: 10px; line-height: 1.4; color: var(--mut); }
.qlab .qlab-desc { margin: 10px 22px 0; font-size: 12px; line-height: 1.6; color: var(--mut); max-width: 74ch; }
.qlab .qlab-stage { position: relative; margin: 16px 12px 0; border: 1px solid var(--line); border-radius: 3px; background: var(--bg); overflow: hidden; }
.qlab canvas { display: block; width: 100%; height: 282px; touch-action: pan-y; outline-offset: -4px; }
.qlab canvas.qlab-orbit { cursor: grab; touch-action: pan-y; }
.qlab canvas.qlab-orbit:active { cursor: grabbing; }
.qlab .qlab-legend { display: flex; flex-wrap: wrap; gap: 7px 17px; padding: 2px 16px 12px; color: var(--mut); font-size: 10px; line-height: 1.5; }
.qlab .qlab-legend span { display: inline-flex; align-items: center; gap: 6px; }
.qlab .qlab-legend i { width: 15px; height: 2px; display: inline-block; background: var(--ink); border-radius: 2px; }
.qlab .qlab-controls { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px 24px; padding: 20px 22px; }
.qlab .qlab-control { min-width: 0; display: block; font-size: 11px; color: var(--mut); }
.qlab .qlab-control-head { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; margin-bottom: 10px; }
.qlab .qlab-control output { color: var(--ink); font-variant-numeric: tabular-nums; font-size: 12px; }
.qlab input[type=range] { display: block; width: 100%; accent-color: var(--ink); height: 20px; margin: 0; cursor: pointer; }
.qlab .qlab-actions { display: flex; flex-wrap: wrap; gap: 7px; grid-column: 1/-1; }
.qlab .qlab-actions button { background: var(--bg); color: var(--ink); border: 1px solid var(--line); border-radius: 7px; padding: 8px 11px; font-size: 11px; cursor: pointer; min-height: 34px; }
.qlab .qlab-actions button:hover { background: var(--panel); border-color: var(--mut2); }
.qlab .qlab-metrics { display: grid; grid-template-columns: repeat(auto-fit,minmax(105px,1fr)); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: 15px 22px; gap: 14px; background: color-mix(in srgb,var(--bg) 50%,transparent); }
.qlab .qlab-metric-label { display: block; font-size: 10px; color: var(--mut); line-height: 1.5; margin-bottom: 5px; }
.qlab .qlab-metric-value { display: block; font-size: 16px; line-height: 1.3; font-variant-numeric: tabular-nums; letter-spacing: -.025em; color: var(--ink); }
.qlab .qlab-note { font-size: 11px; line-height: 1.65; color: var(--mut); padding: 14px 22px; margin: 0; }
.qlab details.qlab-details { border-top: 1px solid var(--line); font-size: 11px; line-height: 1.6; margin: 0; padding: 12px 22px; color: var(--mut); }
.qlab details.qlab-details summary { cursor: pointer; color: var(--ink); font-size: 11px; }
.qlab details.qlab-details p { margin: 10px 0 0; font-size: 11px; }
.qlab .qlab-downloads { display: flex; flex-wrap: wrap; gap: 15px; margin-top: 9px; }
.qlab .qlab-downloads a { color: var(--ink); text-decoration: underline; text-underline-offset: 3px; }
.qlab .qlab-loading { padding: 32px; color: var(--mut); font-size: 12px; }
.qlab :focus-visible { outline: 2px solid var(--ink); outline-offset: 4px; }
.qlab canvas:focus-visible { outline-offset: -4px; }
@media(max-width:560px) {
 .qlab .qlab-top { padding: 16px 16px 0; gap: 8px; }
 .qlab .qlab-title { font-size: 17px; }
 .qlab .qlab-badge { font-size: 9px; padding: 4px 6px; }
 .qlab .qlab-desc { margin-left:16px; margin-right:16px; }
 .qlab .qlab-controls { padding: 16px; gap: 16px; grid-template-columns: 1fr; }
 .qlab .qlab-metrics { padding: 14px 16px; }
 .qlab .qlab-note,.qlab details.qlab-details { padding: 12px 16px; }
 .qlab canvas { height: 258px; }
}
@media(prefers-reduced-motion:reduce) { .qlab * { scroll-behavior: auto; transition: none !important; } }
/* Mathematical annotations belong to the DOM, so they stay sharp and accessible. */
.qlab .qlab-plot { position: relative; }
.qlab .qlab-axis { position: absolute; z-index: 1; color: var(--mut); font-size: 10px; line-height: 1.15; pointer-events: none; }
.qlab .qlab-axis-x { bottom: 4px; min-height: 16px; text-align: center; }
.qlab .qlab-axis-y { top: 7px; min-height: 16px; text-align: left; }
.qlab .qlab-axis:empty { display: none; }
.qlab .qlab-axis mjx-container { margin: 0 !important; }
.qlab .qlab-metric-label mjx-container { font-size: 100% !important; }
.qlab .qlab-details mjx-container { max-width: 100%; overflow-x: auto; overflow-y: hidden; padding: 2px 0; vertical-align: middle; }
.qlab .qlab-details p { font-size: 12px; line-height: 1.95; }
.qlab .qlab-details mjx-container > svg { max-width: none; }
.qlab .qlab-orbit-hint { position: absolute; top: 13px; left: 16px; right: 16px; color: var(--mut); font-size: 10px; line-height: 1.4; pointer-events: none; }
.qlab canvas.qlab-orbit.qlab-touch-rotate { touch-action: none; }
.qlab .qlab-touch-toggle { display: none; }
@media (hover: none), (pointer: coarse) {
 .qlab canvas.qlab-orbit { cursor: auto; }
 .qlab canvas.qlab-orbit.qlab-touch-rotate { cursor: grab; }
 .qlab .qlab-touch-toggle { display: inline-flex; align-items: center; }
}

/* One visual explanation, one numerical check, sharing the same simulation state. */
.method-laboratory { margin: 26px 0 38px; }
.method-laboratory>h2 { font-size: 22px; }
.demo.qlab { border-radius: 12px; box-shadow: 0 12px 36px color-mix(in srgb,var(--ink) 3%,transparent); }
.qlab .qlab-top { padding: 25px 26px 0; }
.qlab .qlab-title { font-size: 22px; }
.qlab .qlab-desc { margin: 10px 26px 0; max-width: 92ch; font-size: 13px; }
.qlab .qlab-stage { border: 0; margin: 22px 16px 0; background: transparent; overflow: visible; }
.qlab .qlab-paired { display: grid; grid-template-columns: minmax(0,1.12fr) minmax(0,1fr); gap: 14px; }
.qlab .qlab-panel { border: 1px solid var(--line); border-radius: 9px; background: var(--bg); min-width: 0; overflow: hidden; }
.qlab .qlab-panel-label { font-size: 10px; font-weight: 550; color: var(--mut); padding: 14px 16px 10px; letter-spacing: .07em; text-transform: uppercase; border-bottom: 1px solid color-mix(in srgb,var(--line) 50%,transparent); min-height: 40px; }
.qlab .qlab-visual { background: radial-gradient(ellipse at 45% 40%,color-mix(in srgb,var(--c) 7%,var(--bg)),var(--bg) 70%); }
.qlab .qlab-scene { position: relative; }
.qlab .qlab-paired canvas { height: 320px; }
.qlab .qlab-scene-caption { margin: 0; padding: 2px 16px 14px; color: var(--mut); font-size: 11px; line-height: 1.5; min-height: 45px; }
.qlab .qlab-legend { min-height: 45px; align-items: center; }
.qlab .qlab-controls { grid-template-columns: repeat(auto-fit,minmax(200px,1fr)); padding: 22px 26px; gap: 17px 28px; }
.qlab .qlab-actions { order: -1; align-items: center; gap: 8px; }
.qlab .qlab-actions button { min-height: 42px; padding: 10px 16px; border-radius: 7px; }
.qlab .qlab-actions .qlab-play { min-width: 92px; color: var(--bg); background: var(--ink); border-color: var(--ink); font-weight: 550; }
.qlab .qlab-actions .qlab-play::before { content: '▶'; display: inline-block; margin-right: 9px; font-size: 9px; }
.qlab[data-playing=true] .qlab-actions .qlab-play::before { content: 'Ⅱ'; }
.qlab .qlab-metrics { padding: 18px 26px; grid-template-columns: repeat(auto-fit,minmax(130px,1fr)); }
.qlab .qlab-note { padding: 15px 26px; max-width: 112ch; }
.qlab .qlab-plot,.qlab .qlab-scene { direction: ltr; }
@media(max-width:850px) {
 .qlab .qlab-paired { grid-template-columns: 1fr; gap: 12px; }
 .qlab .qlab-paired .qlab-scene canvas { height: 310px; }
 .qlab .qlab-paired .qlab-plot canvas { height: 240px; }
}
@media(max-width:560px) {
 .qlab .qlab-top { padding: 18px 16px 0; flex-wrap: wrap; }
 .qlab .qlab-title { font-size: 20px; }
 .qlab .qlab-desc { margin: 10px 16px 0; font-size: 12px; }
 .qlab .qlab-stage { margin: 16px 8px 0; }
 .qlab .qlab-controls { padding: 18px 16px; grid-template-columns: 1fr; }
 .qlab .qlab-actions button { min-height: 44px; padding: 10px 13px; }
 .qlab .qlab-metrics { padding: 16px; grid-template-columns: repeat(2,minmax(0,1fr)); }
 .qlab .qlab-metric-value { font-size: 15px; }
 .qlab .qlab-note { padding: 14px 16px; }
}

.qlab-sources{display:flex;flex-wrap:wrap;gap:8px 20px;margin:14px 0 0;padding:0;list-style:none;font-size:12px;line-height:1.5}.qlab-sources a{color:var(--c);text-underline-offset:3px}.qlab-sources li{max-width:72ch}

.qlab .qlab-actions .qlab-play:hover{background:var(--c);border-color:var(--c);color:var(--bg)}
.qlab-visual>.qlab-orbit-hint{position:static;display:block;padding:10px 16px 0;min-height:27px;color:var(--mut);font-size:10px;line-height:1.4}

/* A shared player keeps the active view and transport together. */
.qlab .qlab-player{min-width:0}
.qlab .qlab-tabs,.qlab .qlab-mobile-intro{display:none}
.qlab .qlab-transport{display:flex;justify-content:center;align-items:center;gap:12px;padding:18px 16px 8px;direction:ltr}
.qlab .qlab-transport button{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-width:48px;min-height:46px;padding:11px;border-radius:9px;border:1px solid var(--line);background:var(--bg);color:var(--ink)}
.qlab .qlab-transport button svg{width:20px;height:20px;flex-shrink:0}
.qlab .qlab-transport .qlab-play{min-width:122px;background:var(--ink);border-color:var(--ink);color:var(--bg);font-size:13px;font-weight:550}
.qlab .qlab-transport .qlab-play:hover{background:var(--c);border-color:var(--c)}
.qlab .qlab-transport button:disabled{opacity:.3;cursor:default}
.qlab .qlab-transport button:not(:disabled):not(.qlab-play):hover{background:var(--soft)}
.qlab details.qlab-settings{margin:0;padding:0;border:0}
.qlab .qlab-settings>summary{display:none}
.qlab .qlab-actions:empty{display:none}
@media(max-width:850px),(max-height:500px) and (pointer:coarse){
 .demo.qlab{margin:16px 0;border-radius:12px}
 .qlab .qlab-player{height:min(600px,calc(100svh - 64px));min-height:0;display:flex;flex-direction:column;overflow:hidden}
 .qlab .qlab-top{flex:none;padding:15px 14px 8px;gap:0}
 .qlab .qlab-title{font-size:17px;line-height:1.25;letter-spacing:-.025em}
 .qlab .qlab-badge,.qlab .qlab-kicker,.qlab .qlab-desc{display:none}
 .qlab .qlab-tabs{display:flex;flex:none;margin:0 12px 8px;padding:3px;border-radius:9px;background:var(--soft);gap:3px}
 .qlab .qlab-tabs button{flex:1;min-width:0;min-height:38px;padding:8px 6px;border:1px solid transparent;border-radius:7px;font-size:12px;line-height:1.2;color:var(--mut);font-weight:500}
 .qlab .qlab-tabs button[aria-selected=true]{background:var(--panel);border-color:var(--line);color:var(--ink);box-shadow:0 1px 3px #00000009}
 .qlab .qlab-stage{flex:1;min-height:0;margin:0 10px;display:flex;overflow:hidden}
 .qlab .qlab-panel{width:100%;height:100%;min-height:0;display:flex;flex-direction:column}
 .qlab[data-view=animation] .qlab-diagnostic,.qlab[data-view=check] .qlab-visual{display:none}
 .qlab .qlab-panel-label,.qlab .qlab-scene-caption,.qlab .qlab-orbit-hint{display:none}
 .qlab .qlab-scene,.qlab .qlab-plot{position:relative;flex:1;min-height:0;width:100%}
 .qlab .qlab-paired canvas{position:absolute;inset:0;width:100%;height:100%!important;min-height:0}
 .qlab .qlab-legend{flex:none;min-height:0;font-size:10px;line-height:1.3;padding:5px 10px 9px;gap:5px 10px}
 .qlab .qlab-transport{flex:none;padding:10px 14px 13px;gap:14px}
 .qlab .qlab-transport button{min-width:46px;min-height:46px}
 .qlab .qlab-transport .qlab-play{min-width:122px}
 .qlab details.qlab-settings{border-top:1px solid var(--line)}
 .qlab .qlab-settings>summary{display:list-item;padding:13px 16px;font-size:12px;color:var(--mut);cursor:pointer;min-height:44px;list-style-position:inside}
 .qlab .qlab-controls{padding:5px 16px 16px;gap:14px 22px;grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}
 .qlab .qlab-control-head{margin-bottom:5px}
 .qlab .qlab-metrics{padding:12px 16px;gap:10px;font-size:11px}
 .qlab .qlab-metric-label{margin-bottom:3px}
 .qlab .qlab-metric-value{font-size:14px}
 .qlab .qlab-note{display:none}
 .qlab .qlab-details .qlab-mobile-intro{display:block}
 .qlab details.qlab-details{padding:13px 16px}
}
@media(max-height:500px) and (max-width:950px){
 .qlab .qlab-title{font-size:15px}
 .qlab .qlab-top{padding-top:9px;padding-bottom:6px}
 .qlab .qlab-tabs{margin-bottom:6px}
 .qlab .qlab-tabs button{min-height:32px;padding:5px}
 .qlab .qlab-transport{padding:6px 12px 8px}
 .qlab .qlab-transport button{min-height:46px}
}