.bench{container:bench / inline-size;text-align:start;--end: right}html[dir=rtl] .bench{--end: left}.bench:dir(rtl){--end: left}.bench [hidden]{display:none!important}.bench p{max-width:none}.bench:not([data-js]) .bench-controls,.bench:not([data-js]) .bench-rail,.bench:not([data-js]) .bench-panel{display:none}.bench-status{text-align:end}.bench-grid{display:grid;grid-template-columns:minmax(0,1fr)}.bench-rail,.bench-view,.bench-controls,.bench-panel{min-width:0}.bench-rail{padding:var(--sp-3);border-block-end:var(--hair) solid var(--rule)}.bench-rail>.label{display:block;margin:0 0 var(--sp-2)}.bench-roster{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--sp-2)}.bench-pick{appearance:none;position:relative;display:grid;align-content:start;justify-items:start;gap:var(--sp-1) var(--sp-3);width:100%;height:100%;margin:0;padding:var(--sp-2);cursor:pointer;text-align:start;background:transparent;color:var(--ink-2);font:inherit;border:var(--hair) solid var(--rule);border-radius:var(--radius-0);transition:border-color var(--dur-1) var(--ease),background var(--dur-1) var(--ease),color var(--dur-1) var(--ease)}.bench-pick:hover{border-color:var(--ink);color:var(--ink)}.bench-pick[aria-pressed=true]{border-color:var(--ink);background:var(--bg);color:var(--ink)}.bench-pick[aria-pressed=true]:before{content:"";position:absolute;inset-block:-1px;inset-inline-start:-1px;width:5px;background:var(--signal);border-inline-end:var(--hair) solid var(--on-signal)}.bench-avatar{width:44px;height:44px;object-fit:cover;border:var(--hair) solid var(--rule);background:var(--plate)}.bench-pick-txt{display:grid;gap:2px;min-width:0}.bench-code{color:inherit}.bench-pick[aria-pressed=true] .bench-code{color:var(--ink)}.bench-name{font:560 var(--step--1)/1.25 var(--font-sans);color:var(--ink);overflow-wrap:anywhere}.bench-cond{display:none;font:400 var(--step--2)/1.35 var(--font-sans);color:var(--ink-3)}.bench-viewer{position:relative;overflow:hidden;aspect-ratio:4 / 5;max-height:min(78svh,760px);user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent}.bench-viewer.crop:before,.bench-viewer.crop:after{inset:auto;border-width:0}.bench-viewer.crop:before{inset-block-start:8px;inset-inline-start:8px;border-block-start-width:1px;border-inline-start-width:1px}.bench-viewer.crop:after{inset-block-end:8px;inset-inline-end:8px;border-block-end-width:1px;border-inline-end-width:1px}.bench-viewer canvas{position:absolute;inset:0;z-index:1;width:100%;height:100%;max-width:none;cursor:grab;outline:0}.bench-viewer canvas:active{cursor:grabbing}.bench-poster{position:absolute;inset:0;z-index:0;width:100%;height:100%;max-width:none;object-fit:contain;object-position:50% 100%;transition:opacity var(--dur-2) var(--ease)}.bench[data-state=live] .bench-poster{opacity:0;pointer-events:none}.bench.is-switching .bench-poster{opacity:1;z-index:2}.bench-ring{position:absolute;inset:0;z-index:6;pointer-events:none}.bench-viewer.is-focus .bench-ring{outline:2px solid var(--ink);outline-offset:-2px;box-shadow:inset 0 0 0 5px var(--signal)}.bench-progress{position:absolute;inset-inline:0;inset-block-end:0;height:3px;z-index:5;opacity:0}.bench[data-state=loading] .bench-progress,.bench.is-switching .bench-progress{opacity:1}.bench-progress i{display:block;height:100%;width:calc(var(--p, 0) * 100%);background:var(--signal);border-inline-end:var(--hair) solid var(--on-signal);transition:width var(--dur-1) linear}.bench-load{position:absolute;z-index:4;inset-inline:0;margin-inline:auto;width:max-content;max-width:calc(100% - 2 * var(--sp-4));inset-block-end:var(--sp-5);white-space:normal;text-align:center;line-height:1.25;padding-block:10px}.bench[data-state=loading] .bench-load,.bench[data-state=live] .bench-load,.bench[data-state=nowebgl] .bench-load{display:none}.bench-tools{position:absolute;z-index:4;inset-block-start:var(--sp-3);inset-inline-end:var(--sp-3);display:flex;gap:var(--sp-2)}.bench[data-state]:not([data-state=live]) .bench-tools{visibility:hidden}.bench-tools .seg,.bench-hint{background:color-mix(in srgb,var(--surface) 90%,transparent)}.bench-tools .seg{backdrop-filter:blur(4px)}.bench-tools .seg[aria-pressed=true]{background:var(--ink);color:var(--bg)}.bench-tools .seg svg{flex:none;width:12px;height:12px}.bench-hint{position:absolute;z-index:3;inset-inline-start:var(--sp-3);inset-block-end:var(--sp-3);margin:0;padding:3px 6px;max-width:calc(100% - 2 * var(--sp-3) - 28px);color:var(--ink-2);pointer-events:none;text-wrap:balance}.bench:not([data-state=live]) .bench-hint{display:none}.bench.is-switching .bench-hint{visibility:hidden}.bench-viewer[data-light=studio]{--ink: #191b1a;--ink-2: #2b2e2b;--ink-3: #373a37;--surface: #f4f3ef;--bg: #e9e8e2;--rule: #8f8e87;--on-signal: #131514;color-scheme:light;background-color:#c4c3bb;background-size:auto;background-position:0 0;background-image:radial-gradient(120% 92% at 50% 36%,#e6e5df,#cbcac2 52%,#a9a8a0)}.bench-viewer[data-light=dark]{--ink: #e7e5dd;--ink-2: #b9bcb5;--ink-3: #9a9e97;--surface: #1b1e1c;--bg: #131514;--rule: #3a3e3b;--on-signal: #131514;color-scheme:dark;background-color:#161817;background-size:auto;background-position:0 0;background-image:radial-gradient(110% 82% at 50% 36%,#2d312e,#1a1c1b 58%,#101211)}.bench-controls{border-block-start:var(--hair) solid var(--rule)}.bench-row{display:grid;grid-template-columns:96px minmax(0,1fr);gap:var(--sp-2) var(--sp-3);align-items:center;padding:10px var(--sp-3);border-block-end:var(--hair) solid var(--rule)}.bench-row:last-child{border-block-end:0}.bench-seg{display:flex;flex-wrap:wrap;gap:6px}.bench .seg{justify-content:center}.bench .seg svg{flex:none}.bench-panel{padding:var(--sp-3);border-block-start:var(--hair) solid var(--rule)}.bench-panel>.label{display:block;padding-block-end:var(--sp-2);border-block-end:var(--hair) solid var(--rule-strong)}.bench-readout{list-style:none;margin:0;padding:0}.bench-readout li{display:grid;grid-template-columns:124px minmax(0,1fr) 36px;gap:var(--sp-3);align-items:center;min-height:36px;border-block-end:var(--hair) solid var(--rule)}.bench-shape{font:450 var(--step--2)/1.3 var(--font-mono);font-stretch:87.5%;letter-spacing:.02em;color:var(--ink-2);white-space:nowrap}.bench-readout .value{text-align:end;unicode-bidi:isolate}.bench-note{margin:var(--sp-3) 0 0;max-width:none;font-size:var(--step--1);line-height:1.45;color:var(--ink-3)}.bench input[type=range]{appearance:none;-webkit-appearance:none;width:100%;height:24px;margin:0;background:transparent;cursor:pointer;--fill: 0%}.bench input[type=range]::-webkit-slider-runnable-track{height:3px;background:linear-gradient(to var(--end),var(--ink) var(--fill),var(--rule) var(--fill))}.bench input[type=range]::-moz-range-track{height:3px;background:linear-gradient(to var(--end),var(--ink) var(--fill),var(--rule) var(--fill))}.bench input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:10px;height:18px;margin-top:-7.5px;background:var(--signal);border:var(--hair) solid var(--ink);border-radius:0}.bench input[type=range]::-moz-range-thumb{width:8px;height:16px;background:var(--signal);border:var(--hair) solid var(--ink);border-radius:0}.bench input[type=range]:disabled{cursor:not-allowed;opacity:.55}.bench input[type=range]:disabled::-webkit-slider-thumb{background:var(--plate)}.bench input[type=range]:disabled::-moz-range-thumb{background:var(--plate)}.bench-caption{color:var(--ink-2);font-size:var(--step--1);line-height:1.4;text-align:end;text-wrap:balance}@container bench (max-width: 639px){.bench-pick{padding:6px;justify-items:center;text-align:center}.bench-pick-txt{justify-items:center}.bench-name{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}.bench-row{grid-template-columns:minmax(0,1fr);gap:6px}.bench-readout li{grid-template-columns:122px minmax(0,1fr) 36px;gap:var(--sp-2)}.bench-caption{text-align:start}}@container bench (min-width: 480px) and (max-width: 639px){.bench-row{grid-template-columns:96px minmax(0,1fr)}.bench-viewer{aspect-ratio:1 / 1}}@container bench (min-width: 640px) and (max-width: 979px){.bench-grid{grid-template-columns:minmax(0,1fr) 312px;grid-template-areas:"rail rail" "view controls" "view panel"}.bench-rail{grid-area:rail}.bench-view{grid-area:view}.bench-controls{grid-area:controls;border-block-start:0;border-inline-start:var(--hair) solid var(--rule)}.bench-panel{grid-area:panel;border-block-start:var(--hair) solid var(--rule);border-inline-start:var(--hair) solid var(--rule)}.bench-viewer{aspect-ratio:auto;height:100%;min-height:480px;max-height:none}.bench-row{grid-template-columns:minmax(0,1fr);gap:6px}.bench-pick{grid-template-columns:44px minmax(0,1fr);align-items:center}}@container bench (min-width: 980px){.bench-grid{grid-template-columns:208px minmax(0,1fr) 296px;grid-template-areas:"rail view panel" "rail controls panel";grid-template-rows:auto 1fr}.bench-rail{grid-area:rail;padding:var(--sp-4);border-block-end:0;border-inline-end:var(--hair) solid var(--rule)}.bench-view{grid-area:view}.bench-controls{grid-area:controls;border-block-start:var(--hair) solid var(--rule)}.bench-panel{grid-area:panel;padding:var(--sp-4);border-block-start:0;border-inline-start:var(--hair) solid var(--rule)}.bench-roster{grid-template-columns:minmax(0,1fr);gap:var(--sp-3)}.bench-pick{grid-template-columns:44px minmax(0,1fr);align-items:center;padding:var(--sp-3)}.bench-cond{display:block}.bench-viewer{aspect-ratio:auto;height:clamp(460px,72svh,720px);max-height:none}}.bench.is-inspect{display:flex;flex-direction:column;width:100%;max-width:none;height:100dvh;margin:0;overflow:hidden;background:var(--surface)}.bench.is-overlay{position:fixed;inset:0;z-index:1000;height:100dvh}html.bench-lock{overflow:hidden}.bench.is-inspect .plate-foot{display:none}.bench.is-inspect .bench-grid{flex:1 1 auto;min-height:0;overflow:auto;overscroll-behavior:contain}.bench.is-inspect .bench-viewer{aspect-ratio:auto;max-height:none;height:62dvh}@container bench (min-width: 640px) and (max-width: 979px){.bench.is-inspect .bench-viewer{height:100%;min-height:62dvh}}@container bench (min-width: 980px){.bench.is-inspect .bench-grid{overflow:hidden;grid-template-rows:minmax(0,1fr) auto}.bench.is-inspect .bench-view{min-height:0}.bench.is-inspect .bench-viewer{height:100%}.bench.is-inspect .bench-rail,.bench.is-inspect .bench-panel{overflow:auto}.bench.is-inspect .plate-foot{display:flex}}@media(pointer:coarse){.bench .seg{min-height:40px;padding-inline:12px}.bench-readout li{min-height:44px}.bench input[type=range]{height:32px}}@media(prefers-reduced-motion:reduce){.bench *,.bench *:before,.bench *:after{transition:none!important;animation:none!important}}@media(forced-colors:active){.bench-pick[aria-pressed=true],.bench .seg[aria-pressed=true]{outline:2px solid Highlight}.bench-progress i{background:Highlight}}@media print{.bench-controls,.bench-panel,.bench-tools,.bench-load{display:none}}
