/* Figures 3 and 4 (fig34-clutch): readouts, ratio tuner console, rung tooltip. */
.f34-svg{touch-action:pan-y}
.f34-svg .f34-zone,.f34-svg .f34-3-hot,.f34-svg .f34-3-bartog,#f34-4-ladder{cursor:pointer;outline:none}
.f34-svg .f34-zone{cursor:ew-resize}
.f34-svg .f34-zone:focus-visible,.f34-svg .f34-3-hot:focus-visible,.f34-svg .f34-3-bartog:focus-visible{stroke:var(--link-color,currentColor);stroke-width:1.5;stroke-dasharray:4 3}
.f34-svg .f34-dot{outline:none;transition:r .15s ease}
.f34-svg .f34-dot:focus-visible{stroke:var(--fg);stroke-width:2.4}
.f34-svg .f34-3-lab{transition:transform .45s cubic-bezier(.22,1,.36,1)}
.f34-svg .f34-3-lab.is-on{transform:translateY(14px)}

.f34-panel{max-width:800px;margin:16px auto 0;padding:0 16px;font:13px/1.5 var(--sans);color:var(--fg);box-sizing:border-box}
.f34-panel *{box-sizing:border-box}
.f34-panel svg{fill:none;display:block;overflow:visible}
.f34-panel svg text:not([fill]){fill:currentColor}
.f34-panel .katex{font-size:1.06em}
.f34-texrow{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 12px;margin-top:6px}
.f34-small{color:var(--muted)}
.f34-small .katex{color:var(--fg)}

/* Figure 3 readout. */
.f34-p3{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:16px 28px;align-items:start}
.f34-zoom,.f34-mini{min-width:0}
.f34-zoom-h{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px}
.f34-pill{display:inline-block;padding:1px 9px;border-radius:999px;border:1.5px solid var(--f34-c,var(--line));color:var(--fg);font-weight:600;font-size:12px}
.f34-zoom-f{font-size:15px}
.f34-zoom-role{color:var(--muted)}
.f34-zoom-live{font-weight:600}
.f34-bars{display:grid;grid-template-columns:86px minmax(40px,1fr) auto;align-items:center;gap:6px 10px;margin-top:8px}
.f34-bar{display:contents}
.f34-bl{white-space:nowrap}
.f34-track{position:relative;height:8px;border-radius:4px;background:color-mix(in srgb,var(--fg) 8%,transparent);overflow:hidden}
.f34-track i{position:absolute;inset:0 auto 0 0;border-radius:4px;background:var(--f34-c,var(--primary));min-width:2px;transition:width .45s cubic-bezier(.22,1,.36,1)}
.f34-fill-dec{opacity:.35}
.f34-bv{color:var(--muted);white-space:nowrap;font-variant-numeric:tabular-nums}
.f34-zoom-hint{font-size:12px}
.f34-minirow{display:flex;align-items:center;gap:12px;margin-top:6px}
.f34-liss-mini{width:72px;height:72px;flex:none}
.f34-track3{flex:1;min-width:0;height:auto;aspect-ratio:320/64;touch-action:pan-y;cursor:ew-resize;outline:none;border-radius:10px}
.f34-track3:focus-visible,.f34-kap:focus-visible{box-shadow:0 0 0 2px var(--link-color,var(--primary))}
.f34-zbg{fill:color-mix(in srgb,var(--fg) 4%,transparent)}
.f34-taxis,.f34-kaxis{stroke:currentColor;stroke-opacity:.4}

/* State line, chips. */
.f34-state{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 10px;min-height:22px}
.f34-led{width:10px;height:10px;border-radius:50%;background:var(--f34-s,var(--muted));align-self:center;flex:none}
.f34-state[data-state^="l"] .f34-led{box-shadow:0 0 0 3px color-mix(in srgb,var(--f34-s) 30%,transparent)}
.f34-state-h{font-weight:700}
.f34-state[data-state^="l"] .f34-state-h{color:var(--f34-s)}
.f34-state-t{color:var(--muted)}
.f34-state-v{margin-left:auto;font-variant-numeric:tabular-nums;font-family:"Roboto Mono",monospace;font-size:12px;color:var(--muted)}
.f34-chips{display:inline-flex;gap:6px}
.f34-chip{font:600 12px/1 var(--sans);color:var(--fg);background:transparent;border:1px solid var(--line);border-radius:999px;padding:5px 11px;cursor:pointer;min-width:40px}
.f34-chip:hover{border-color:var(--rule-strong)}
.f34-chip[aria-pressed="true"]{border-color:var(--fg);background:color-mix(in srgb,var(--fg) 8%,transparent)}
.f34-chip:focus-visible{outline:2px solid var(--link-color,var(--primary));outline-offset:2px}

/* Figure 3 console. */
.f34-console .f34-grid{display:grid;grid-template-columns:auto minmax(0,1fr);gap:14px 26px;margin-top:8px;align-items:start}
.f34-card-liss{display:flex;flex-direction:column;align-items:center;gap:6px;min-width:170px}
.f34-tex2{line-height:1.7}
.f34-card-liss .f34-tex2{text-align:center}
.f34-liss-big{width:156px;height:156px}
.f34-cap{font-size:12px;color:var(--muted);text-align:center;max-width:180px}
.f34-card-curves{display:flex;flex-direction:column;min-width:0}
.f34-int{width:100%;height:84px;margin:2px 0 6px}
.f34-kap{width:100%;height:70px;touch-action:pan-y;cursor:ew-resize;outline:none;border-radius:8px}
.f34-sig{margin-left:10px;color:var(--muted);font-size:12px}
.f34-curve-tools{display:flex;flex-direction:column;gap:6px;margin-top:8px}
.f34-foot{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;margin-top:8px}
.f34-hint{font-size:12px;color:var(--muted)}

/* Live curves. */
.f34-lbox{stroke:currentColor;stroke-opacity:.18;fill:color-mix(in srgb,var(--fg) 3%,transparent)}
.f34-laxis{stroke:currentColor;stroke-opacity:.1}
.f34-lfull{stroke-width:1;stroke-linejoin:round}
.f34-ltail{stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.f34-guide{stroke:currentColor;stroke-opacity:.12;stroke-dasharray:3 4}
.f34-g0{stroke-dasharray:none;stroke-opacity:.22}
.f34-clean{stroke:currentColor;stroke-width:1.7;stroke-linejoin:round}
.f34-leak{stroke:#EA4335;stroke-width:1.3;stroke-linejoin:round}
.f34-kcurve{stroke:#EA4335;stroke-width:1.8}
.f34-kfill{fill:#EA4335;fill-opacity:.1}
.f34-kphi{stroke:#FBBC04;stroke-width:2;stroke-dasharray:4 3}
.f34-kmark{stroke-width:1.5;stroke-opacity:.6}
.f34-kval{fill:currentColor}

/* Figure 4 barrier toggle and stage readout. */
.f34-top-toggle{margin:0 auto 12px}
.f34-bartoggle{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.f34-barbtn{display:grid;grid-template-columns:12px minmax(0,1fr);gap:2px 10px;align-items:center;text-align:left;padding:9px 13px;border-radius:10px;border:1.5px solid var(--line);background:color-mix(in srgb,var(--fg) 3%,transparent);color:var(--fg);font:12.5px/1.35 var(--sans);cursor:pointer;transition:border-color .18s ease,background .18s ease}
.f34-barbtn:hover{border-color:var(--rule-strong)}
.f34-barbtn b{font-weight:700;grid-column:2}
.f34-barbtn span:last-child{grid-column:2;color:var(--muted);font-size:11.5px}
.f34-barbtn[data-bar="on"][aria-pressed="true"]{border-color:#FBBC04;background:color-mix(in srgb,#FBBC04 10%,transparent)}
.f34-barbtn[data-bar="off"][aria-pressed="true"]{border-color:#EA4335;background:color-mix(in srgb,#EA4335 10%,transparent)}
.f34-bardot{width:10px;height:10px;border-radius:50%;grid-row:1 / span 2;align-self:center}
.f34-bardot-on{background:#FBBC04;box-shadow:0 0 0 3px color-mix(in srgb,#FBBC04 28%,transparent)}
.f34-bardot-off{background:#EA4335;box-shadow:0 0 0 3px color-mix(in srgb,#EA4335 28%,transparent)}
.f34-p4-wrap{margin-top:14px}
.f34-zoom-wide{max-width:100%}

/* Rung tooltip. */
.f34-tip{position:absolute;left:0;top:0;z-index:5;width:max-content;max-width:min(300px,calc(100% - 16px));padding:9px 12px;border-radius:10px;
  background:var(--plate-bg,var(--bg));color:var(--fg);border:1px solid var(--rule-strong,var(--line));box-shadow:0 6px 24px rgba(0,0,0,.18);
  font:13px/1.45 var(--sans);pointer-events:none}
.f34-tip[hidden]{display:none}
.f34-tip-h{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 10px;margin-bottom:3px}
.f34-tip-h span{color:var(--muted)}
.f34-tip-f{font-variant-numeric:tabular-nums}
.f34-tip-r{margin-top:4px}
.f34-tip-c{margin-top:5px;font-size:12px;color:var(--muted)}
.f34-tip .f34-st{font-weight:600}
.f34-tip .f34-st-confirmed{color:var(--c-confirmed)}
.f34-tip .f34-st-observed{color:var(--c-observed)}
.f34-tip .f34-st-proposed{color:var(--c-proposed)}

@media (max-width:700px){
  .f34-panel{padding:0 4px}
  .f34-p3{grid-template-columns:minmax(0,1fr)}
  .f34-bartoggle{grid-template-columns:minmax(0,1fr)}
  .f34-console .f34-grid{grid-template-columns:minmax(0,1fr)}
  .f34-bars{grid-template-columns:74px minmax(0,1fr);row-gap:2px}
  .f34-bv{grid-column:2;white-space:normal;font-size:12px}
  .f34-card-liss{flex-direction:row;flex-wrap:wrap;justify-content:center;gap:6px 14px}
  .f34-card-liss .f34-tex2{text-align:left}
  .f34-liss-big{width:132px;height:132px}
  .f34-state-v{margin-left:0}
}
@media (prefers-reduced-motion:reduce){
  .f34-svg .f34-3-lab,.f34-track i{transition:none}
}