:root{color-scheme:dark;--bg:#08090a;--text:#ecece6;--muted:#888b8a;--line:#292c2d;--panel:#101213;--serif:Georgia,'Times New Roman',serif;--sans:Arial,Helvetica,sans-serif;--mono:'SFMono-Regular',Consolas,'Liberation Mono',monospace;font-family:var(--sans);font-size:14px;background:var(--bg);color:var(--text)}
*{box-sizing:border-box}body{margin:0}button,input{font:inherit}button{cursor:pointer}button:disabled{cursor:wait;opacity:.45}button:focus-visible,input:focus-visible{outline:2px solid #f1f1e9;outline-offset:5px}button{color:inherit}button:hover{color:#fff}button[hidden],[hidden]{display:none!important}.masthead{display:flex;align-items:center;justify-content:space-between;padding:31px 36px 27px;border-bottom:1px solid var(--line);gap:24px}.eyebrow,.edition,.field-labels,.panel-heading>span,.transport-bottom,footer,.range-ends{font:10px var(--mono);letter-spacing:.12em}.eyebrow{color:var(--muted);display:block;margin-bottom:11px}h1{font:normal 40px/1 var(--serif);letter-spacing:-1.5px;margin:0}.period{color:#777d79}.header-right{display:flex;align-items:center;gap:48px}.edition{color:var(--muted)}.quiet-button{background:transparent;border:0;padding:10px 0;font-size:12px;display:inline-flex;gap:18px;align-items:center}.quiet-button span{font-size:16px;color:var(--muted)}main{display:grid;grid-template-columns:minmax(0,1fr) 286px;min-height:calc(100vh - 185px)}.experiment{min-width:0;padding:28px 34px 24px;display:flex;flex-direction:column;justify-content:center}.field-labels{display:flex;justify-content:space-between;color:var(--muted);margin-bottom:13px;font-size:9px}.field-labels>span:first-child{display:flex;align-items:center;gap:8px}.status-dot{width:4px;height:4px;display:inline-block;background:#bfc3bb;border-radius:50%}.stage-wrap{position:relative;display:flex;align-items:center;justify-content:center;flex:1;min-height:220px}#field{display:block;width:100%;aspect-ratio:17/11;max-height:calc(100vh - 342px);min-height:220px;object-fit:contain;touch-action:none}.loading,.error{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(8,9,10,.75);color:var(--muted);font:12px var(--mono);letter-spacing:.03em}.error{padding:30px;text-align:center;color:#f5e2d6}.transport{margin-top:20px}.transport-top{display:flex;justify-content:space-between;align-items:center;gap:15px}.playback{display:flex;align-items:center;gap:25px}.play-button{border:1px solid #505454;background:#e4e6de;color:#111513;padding:11px 15px;min-width:88px;font-size:12px;display:flex;gap:20px;align-items:center;justify-content:space-between}.play-button:hover{background:#fff;color:#000}.play-button span{font-size:10px}.timecode{font:11px var(--mono);color:#daddd5;display:flex;gap:10px;white-space:nowrap}.time-separator,.timecode>span:last-child{color:var(--muted)}input[type=range]{appearance:none;-webkit-appearance:none;display:block;width:100%;height:20px;padding:0;margin:14px 0;background:transparent;cursor:ew-resize;accent-color:var(--text)}input[type=range]::-webkit-slider-runnable-track{background:#353938;height:1px}input[type=range]::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:7px;height:7px;background:#e2e7df;border:0;border-radius:50%;margin-top:-3px}input[type=range]::-moz-range-track{background:#353938;height:1px}input[type=range]::-moz-range-thumb{width:7px;height:7px;background:#e2e7df;border:0;border-radius:50%}#timeline::-webkit-slider-thumb{height:11px;width:3px;margin-top:-5px;border-radius:0}.transport-bottom{display:flex;justify-content:space-between;gap:15px;color:var(--muted);font-size:9px;letter-spacing:.04em}#state-label{color:#b3b8af;font-size:8px;letter-spacing:.13em}.settings{border-left:1px solid var(--line);padding:29px 26px 22px;background:var(--panel)}.panel-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:31px}.panel-heading h2{font:normal 24px var(--serif);margin:0;letter-spacing:-.5px}.panel-heading>span{color:#727875;font-size:9px}.source-switch{margin:0 0 29px;padding:0;border:0}.source-switch legend{font-size:11px;color:#c2c6bd;margin-bottom:11px}.segmented{display:flex;border:1px solid #303634}.segmented button{flex:1;font-size:10px;background:transparent;border:0;padding:11px 5px;color:#969d95}.segmented button[aria-pressed=true]{background:#d9ded4;color:#171c18}.control{margin:0 0 24px}.control label{display:flex;justify-content:space-between;gap:15px;align-items:center;font-size:11px;color:#c8cec3}.control output{font:10px var(--mono);color:#949d92}.control input{margin:10px 0 2px}.range-ends{display:flex;justify-content:space-between;color:#687267;font-size:8px;letter-spacing:.02em}.panel-note{color:#818c7e;font-size:10px;line-height:1.8;margin:25px 0 0}.panel-foot{margin-top:35px;color:#a6b0a2}.tiny-rule{display:block;width:23px;height:1px;background:#576153}.panel-foot p{font:normal italic 18px/1.4 var(--serif);margin:16px 0 0}footer{border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:20px;padding:16px 36px;color:#616964;font-size:8px;letter-spacing:.08em}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}body.controls-hidden main{grid-template-columns:1fr}body.controls-hidden .settings{display:none}body.manual #field{cursor:crosshair}.source-switch button{min-height:36px}
.experiment{justify-content:flex-start}.stage-wrap{flex:none;min-height:0}.save-still{margin-top:14px;font-size:10px;color:#b4b8b0;text-decoration:none;cursor:pointer}
@media(min-width:1500px){.experiment{padding-left:65px;padding-right:65px}.settings{padding-left:32px;padding-right:32px}main{grid-template-columns:minmax(0,1fr) 310px}h1{font-size:46px}}
@media(max-width:820px){.masthead{padding:23px 22px}.header-right{gap:18px}.edition{display:none}h1{font-size:33px}.eyebrow{font-size:8px}main{grid-template-columns:1fr;min-height:auto}.experiment{padding:25px 22px 28px}.settings{border-left:0;border-top:1px solid var(--line);display:grid;grid-template-columns:1fr 1fr;gap:0 30px;padding:27px 22px}.panel-heading,.source-switch,.panel-note,.panel-foot{grid-column:1/-1}.panel-heading{margin-bottom:22px}.source-switch{max-width:360px;margin-bottom:28px}.panel-foot{display:none}#field{max-height:none;min-height:220px}.stage-wrap{flex:initial}footer{padding:16px 22px}footer>span:last-child{display:none}.settings .control{min-width:0}.quiet-button{min-height:38px}input[type=range]{height:28px}}
@media(max-width:430px){h1{font-size:28px}.header-right .quiet-button{font-size:10px;gap:7px}.transport-top{gap:10px}.playback{gap:17px}.timecode{font-size:9px;gap:6px}.transport-bottom{font-size:8px}.field-labels{font-size:8px}.play-button{min-width:75px;gap:12px}.settings{gap:0 22px}.range-ends{font-size:8px}footer{font-size:7px}#field{min-height:185px}}
@media(pointer:coarse){button{min-height:44px}input[type=range]{height:36px}}

.header-right{gap:22px;flex-wrap:wrap}.comparison{min-width:0}.field-pane{min-width:0}#source-overlay{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.debug-notice{font:10px/1.7 var(--mono);color:#aaa;margin-bottom:14px}.debug-notice output{display:block;color:#ddd}.debug-caption{font:9px var(--mono);letter-spacing:.1em;color:#999;margin-bottom:10px}.video-shell{position:relative;width:100%;aspect-ratio:9/16;max-height:500px}.video-shell video,.video-shell canvas{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}.debug .comparison{display:grid;grid-template-columns:minmax(150px,.40fr) minmax(0,1fr);gap:18px;align-items:center}.debug main{grid-template-columns:1fr}.debug .settings{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 28px;border-top:1px solid var(--line);border-left:0}.debug .settings .panel-heading,.debug .settings .source-switch,.debug .settings .panel-note,.debug .settings .panel-foot{grid-column:1/-1}.debug.controls-hidden .settings{display:none}.debug #field{max-height:500px;min-height:230px}.debug #debug-panel{min-width:0}.debug .edition{display:none}@media(max-width:600px){.debug .comparison{grid-template-columns:minmax(100px,.45fr) minmax(0,1fr);gap:8px}.debug #field{min-height:180px}.debug .settings{grid-template-columns:1fr 1fr}.header-right{gap:8px}.debug-notice{font-size:9px}.masthead{align-items:flex-start}.header-right .quiet-button{font-size:10px}.debug-caption{font-size:8px}.edition{display:none}}
/* The public view is the artwork, edge to edge, with quiet floating transport. */
body{background:#000}body:not(.debug) .masthead{position:absolute;top:0;left:0;right:0;z-index:3;border:0;padding:24px 28px;pointer-events:none}body:not(.debug) .masthead button{pointer-events:auto}body:not(.debug) .eyebrow,body:not(.debug) .edition,body:not(.debug) footer,body:not(.debug) .field-labels{display:none}body:not(.debug) h1{font-size:24px;color:#ddd}body:not(.debug) main{display:block;min-height:100dvh}body:not(.debug) .experiment{padding:0}body:not(.debug) .stage-wrap{height:100dvh;overflow:hidden}body:not(.debug) #field{width:100%;height:100%;aspect-ratio:auto;max-height:none;min-height:0}body:not(.debug) .transport{position:absolute;z-index:3;bottom:23px;left:28px;right:28px;max-width:680px;margin:0;background:rgba(0,0,0,.64);padding:12px 17px;border:1px solid #222;border-radius:3px}body:not(.debug) .transport-bottom{margin-top:2px}body:not(.debug) .play-button{padding:7px 11px;min-width:76px}body:not(.debug) .transport input#timeline{margin:6px 0}body:not(.debug) .settings{position:absolute;z-index:5;right:20px;top:80px;bottom:25px;width:285px;overflow:auto;border:1px solid #333;background:rgba(10,11,12,.97);padding:20px}.header-right{pointer-events:auto}.field-pane,.stage-wrap{overflow:hidden}.stage-wrap{background:#000}#field{position:relative;z-index:1}#video-underlay{position:absolute;inset:0;overflow:hidden;opacity:0;transition:opacity 400ms ease;pointer-events:none;--video-opacity:.35}body.revealed #video-underlay{opacity:var(--video-opacity)}#dance-video{position:absolute;max-width:none;max-height:none;object-fit:fill;filter:grayscale(1)}#source-overlay{z-index:2}.loading,.error{z-index:4}.opacity-control{display:flex;align-items:center;gap:12px;font:10px var(--mono);color:#aaa}.opacity-control input{width:110px;margin:0!important}.opacity-control output{min-width:32px}.freeze-control{display:flex;gap:9px;font-size:11px;color:#aaa;margin-bottom:24px}.debug #video-underlay{display:none}.debug .stage-wrap{background:#000}.debug .video-shell canvas{position:absolute;inset:0;width:100%;height:100%}.debug #reveal,.debug .opacity-control{display:none!important}.debug .transport{max-width:none}.debug .settings{max-height:none}.debug #field{height:auto}.debug .loading{font-size:10px}@media(max-width:600px){body:not(.debug) .masthead{padding:18px}body:not(.debug) h1{font-size:20px}body:not(.debug) .transport{left:12px;right:12px;bottom:12px}body:not(.debug) .settings{right:12px;top:65px;bottom:150px;width:min(285px,calc(100vw - 24px));display:block}body:not(.debug) .header-right{gap:12px}body:not(.debug) #debug-toggle{display:none}.opacity-control{font-size:9px}}
.diagnostic-controls{padding:12px 0;border:0;border-top:1px solid #303332;margin:18px 0;display:grid;gap:10px;font-size:11px;color:#b6bbb5}.diagnostic-controls legend{font:10px var(--mono);color:#eee;padding-top:12px}.diagnostic-controls label{display:flex;align-items:center;gap:7px;flex-wrap:wrap}.diagnostic-controls input[type=range]{width:100%;margin:0}.diagnostic-controls select{width:100%;background:#161817;color:#ddd;border:1px solid #444;padding:8px;font-size:10px}.contact-readout{display:block;white-space:pre-line;font:10px/1.7 var(--mono);color:#aaa;margin:10px 0}.debug .settings #debug-layers,.debug .settings #mechanisms{grid-column:auto}.debug .settings #contact-readout{grid-column:1/-1}.source-switch .segmented button{font-size:9px;padding-left:4px;padding-right:4px}
.synthetic.debug #debug-panel,.manual.debug #debug-panel{display:none!important}.synthetic.debug .comparison,.manual.debug .comparison{grid-template-columns:1fr}

/* Rendering treatment only: registration and the Reveal dancer stack are unchanged. */
body[data-look]:not([data-look="original"]),body[data-look]:not([data-look="original"]) .stage-wrap{background:var(--material-background,#080B12)}.material-control{display:grid;gap:10px;margin-bottom:24px;color:#b3b7bf;font-size:11px}.material-control select{width:100%;padding:9px;background:#10151e;color:#ccc;border:1px solid #303747}

@media(max-width:600px){body:not(.debug) .masthead{gap:12px;align-items:flex-start}body:not(.debug) .header-right{gap:8px;flex-wrap:wrap;justify-content:flex-end;max-width:190px}body:not(.debug) .header-right .quiet-button{font-size:10px}}

/* Invisible Dancer / interface 08.1. The artwork and its layout remain in style.css.
   Glass is limited to controls; no filter, transform, or paint touches the field. */
:root{
 --sans:-apple-system,BlinkMacSystemFont,'SF Pro Display','SF Pro Text','Segoe UI',Helvetica,Arial,sans-serif;
 --serif:var(--sans);
 --mono:'SFMono-Regular',ui-monospace,'Cascadia Code',monospace;
 --ui-text:rgba(245,248,251,.92);
 --ui-muted:rgba(230,235,242,.58);
 --ui-line:rgba(239,245,255,.16);
 --ui-glass:radial-gradient(ellipse at 8% 0%,rgba(245,250,255,.035),transparent 60%),linear-gradient(165deg,rgba(238,246,255,.028),rgba(239,245,255,.008) 50%,rgba(223,235,250,.018)),rgba(17,22,30,.18);
 --ui-shadow:0 10px 28px rgba(0,0,0,.16),0 2px 6px rgba(0,0,0,.08),inset 0 1px 0 rgba(255,255,255,.12),inset 0 -1px 0 rgba(255,255,255,.025);
 font-family:var(--sans);
}
body,h1,h2,button,input,select{font-family:var(--sans)}
h1{font-style:normal;font-weight:550;letter-spacing:-.035em}
button{ -webkit-tap-highlight-color:transparent }
button:focus-visible,input:focus-visible,select:focus-visible{
 outline:2px solid rgba(193,227,255,.88);outline-offset:4px;
}
body:not(.debug) .masthead{
 position:fixed;inset:24px 28px auto;padding:0;border:0;gap:20px;
 z-index:20;align-items:center;pointer-events:none;
}
body:not(.debug) .identity{flex-shrink:0;text-shadow:0 2px 18px rgba(0,0,0,.5)}
body:not(.debug) .eyebrow{
 display:none;
}
body:not(.debug) h1{
 font:550 24px/1.15 var(--sans);
 letter-spacing:-.85px;color:var(--ui-text);
}
body:not(.debug) .period{color:rgba(233,241,249,.37)}
body:not(.debug) .header-right{
 display:flex;align-items:center;gap:2px;max-width:none;padding:5px;
 border:1px solid var(--ui-line);border-top-color:rgba(245,249,255,.24);border-bottom-color:rgba(230,239,251,.09);border-radius:14px;background:var(--ui-glass);
 box-shadow:var(--ui-shadow);-webkit-backdrop-filter:blur(10px) saturate(110%);
 backdrop-filter:blur(10px) saturate(110%);pointer-events:auto;
}
body:not(.debug) .header-right .quiet-button{
 display:inline-flex;align-items:center;justify-content:center;gap:7px;
 min-height:40px;white-space:nowrap;padding:10px 13px;border:1px solid transparent;border-radius:9px;
 font:500 11px/1.2 var(--sans);letter-spacing:-.08px;color:rgba(244,247,252,.83);
 transition:background-color 160ms ease,color 160ms ease,box-shadow 160ms ease;
}
body:not(.debug) .header-right .quiet-button:hover,
body:not(.debug) .header-right [aria-pressed=true],
body:not(.debug) .header-right [aria-expanded=true]{
 background:linear-gradient(155deg,rgba(255,255,255,.12),rgba(255,255,255,.045));color:#f7fbff;
 border-color:rgba(245,249,255,.18);box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 2px 6px rgba(0,0,0,.1);
}
.header-right .quiet-button::before{
 content:'';display:block;width:14px;height:14px;flex:0 0 14px;
 background:currentColor;opacity:.80;mask:center/contain no-repeat var(--icon);
 -webkit-mask:center/contain no-repeat var(--icon);
}
body:not(.debug) #settings-toggle>span{display:none}
/* A compact floating player. Only its own backdrop is sampled. */
body:not(.debug) .transport{
 position:fixed;left:50%;right:auto;bottom:max(22px,env(safe-area-inset-bottom));
 transform:translateX(-50%);width:min(520px,calc(100% - 48px));max-width:none;
 margin:0;padding:12px 18px 11px;z-index:20;border:1px solid var(--ui-line);
 border-top-color:rgba(245,249,255,.24);border-bottom-color:rgba(230,239,251,.09);
 border-radius:16px;background:var(--ui-glass);box-shadow:var(--ui-shadow);
 -webkit-backdrop-filter:blur(10px) saturate(110%);backdrop-filter:blur(10px) saturate(110%);
}
body:not(.debug) .transport-top{gap:16px;min-height:44px}
body:not(.debug) .playback{display:flex;align-items:center;gap:6px}
body:not(.debug) .play-button{
 display:flex;align-items:center;justify-content:center;gap:0;flex:0 0 44px;
 width:44px;height:44px;min-width:44px;padding:0;border:1px solid rgba(255,255,255,.3);
 border-radius:50%;font-size:0;background:linear-gradient(150deg,rgba(255,255,255,.23),rgba(241,247,255,.075));
 color:#f3f7fc;box-shadow:0 3px 12px rgba(0,0,0,.16),inset 0 1px 0 rgba(255,255,255,.32),inset 0 -1px 0 rgba(255,255,255,.07);
 transition:background-color 160ms ease,box-shadow 160ms ease;
}
body:not(.debug) .play-button:hover{background:rgba(255,255,255,.25);color:#fff;box-shadow:inset 0 1px 0 rgba(255,255,255,.42),0 3px 14px rgba(0,0,0,.16)}
body:not(.debug) .play-button:disabled{opacity:.38}
body:not(.debug) .play-button span{
 display:block;width:18px;height:18px;font-size:0;color:inherit;background:currentColor;
 mask:center/contain no-repeat var(--play-icon);-webkit-mask:center/contain no-repeat var(--play-icon);
}
body:not(.debug) .playback .quiet-button{
 display:flex;align-items:center;justify-content:center;width:36px;height:40px;
 min-height:40px;padding:0;border-radius:12px;font-size:0;color:rgba(230,240,249,.60);
 transition:color 150ms ease,background-color 150ms ease;
}
body:not(.debug) .playback .quiet-button:hover{color:#f3f8fc;background:rgba(232,242,255,.07)}
body:not(.debug) #restart>span{font-size:0}
body:not(.debug) #restart::before,body:not(.debug) #single-step::before{
 content:'';width:17px;height:17px;background:currentColor;
 mask:center/contain no-repeat var(--icon);-webkit-mask:center/contain no-repeat var(--icon);
}
body:not(.debug) .timecode{
 display:flex;align-items:baseline;gap:8px;font:450 11px/1 var(--sans);
 font-variant-numeric:tabular-nums;letter-spacing:0;color:var(--ui-text);
}
body:not(.debug) #current-time{font-size:14px;letter-spacing:-.25px}
body:not(.debug) .time-separator{color:rgba(220,234,248,.24);font-size:10px}
body:not(.debug) #duration-time{color:rgba(220,234,248,.43);font-size:11px}
body:not(.debug) .transport input#timeline{
 --progress:0%;appearance:none;-webkit-appearance:none;height:23px;margin:5px 0 2px;
 background:transparent;border:0;cursor:ew-resize;
}
body:not(.debug) #timeline::-webkit-slider-runnable-track{
 height:4px;border-radius:99px;box-shadow:0 1px 0 rgba(255,255,255,.055),inset 0 1px 2px rgba(0,0,0,.35);
 background:linear-gradient(to right,rgba(239,246,253,.88) 0 var(--progress),rgba(226,237,252,.12) var(--progress) 100%);
}
body:not(.debug) #timeline::-webkit-slider-thumb{
 appearance:none;-webkit-appearance:none;width:10px;height:10px;margin-top:-3px;
 border:1px solid rgba(255,255,255,.85);border-radius:50%;background:#e8f4ff;
 box-shadow:0 1px 7px rgba(0,0,0,.35);
}
body:not(.debug) #timeline::-moz-range-track{height:3px;border-radius:99px;background:rgba(220,237,255,.13)}
body:not(.debug) #timeline::-moz-range-progress{height:3px;border-radius:99px;background:rgba(225,240,253,.83)}
body:not(.debug) #timeline::-moz-range-thumb{width:8px;height:8px;border:1px solid rgba(255,255,255,.85);border-radius:50%;background:#e8f4ff}
body:not(.debug) .transport-bottom{
 margin:0;padding:0 1px;align-items:center;gap:16px;letter-spacing:0;
 font:400 10px/1.3 var(--sans);color:var(--ui-muted);
}
body:not(.debug) #hint{font:400 9px/1.4 var(--sans);letter-spacing:.015em;color:var(--ui-muted)}
body:not(.debug) #state-label{font:500 8px/1.3 var(--sans);letter-spacing:.11em;color:rgba(224,237,249,.45)}
body:not(.debug) #state-label::before{
 content:'';display:inline-block;width:3px;height:3px;border-radius:50%;margin:0 6px 2px 0;background:rgba(216,237,255,.48);
}
body:not(.debug) .opacity-control{
 gap:12px;padding:6px 0 11px;color:var(--ui-muted);font:400 10px/1.3 var(--sans);
}
body:not(.debug) .opacity-control input{flex:1;width:auto;min-width:50px;height:22px}
body:not(.debug) .opacity-control output{font:10px var(--mono);color:rgba(234,244,252,.7)}
/* Studio uses the same glass material, without changing any control behavior. */
body:not(.debug) .settings{
 position:fixed;top:93px;right:28px;bottom:24px;width:318px;padding:24px;
 border:1px solid var(--ui-line);border-radius:28px;background:linear-gradient(150deg,rgba(242,247,255,.055),transparent 45%),rgba(17,22,30,.78);
 box-shadow:var(--ui-shadow);-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);
 overflow:auto;z-index:15;scrollbar-width:thin;scrollbar-color:rgba(220,238,255,.18) transparent;
}
body.controls-hidden .settings{display:none!important}
body:not(.debug):not(.controls-hidden) .settings{display:block}
.settings .panel-heading{margin-bottom:23px;gap:12px}
.settings .panel-heading h2{font:550 22px/1.2 var(--sans);letter-spacing:-.6px;color:var(--ui-text)}
.settings .panel-heading>span{font:500 8px/1.3 var(--sans);letter-spacing:.12em;color:var(--ui-muted)}
.settings .control{margin-bottom:22px}
.settings .control label{font:400 11px/1.4 var(--sans);color:rgba(235,243,251,.80)}
.settings .control output{font:10px var(--mono);color:rgba(220,235,249,.48)}
.settings .range-ends{color:rgba(213,230,247,.32);font:400 8px/1.4 var(--sans);letter-spacing:0}
.settings .source-switch legend,.settings legend,.material-control{color:rgba(231,241,251,.54);font:500 10px/1.4 var(--sans)}
.settings .material-control{gap:8px;margin-bottom:24px}
.settings select{padding:9px 11px;border:1px solid rgba(220,237,255,.12);border-radius:10px;color:var(--ui-text);background:#17202b;font:11px var(--sans)}
.settings .segmented{border:1px solid rgba(220,237,255,.10);border-radius:11px;overflow:hidden;background:rgba(238,246,255,.035)}
.settings .segmented button{min-height:34px;padding:8px 7px;font:10px var(--sans);color:rgba(235,244,253,.52)}
.settings .segmented button[aria-pressed=true]{background:rgba(220,237,255,.13);color:#ecf5ff;box-shadow:inset 0 1px 0 rgba(255,255,255,.08)}
.settings .panel-note,.settings .freeze-control{color:rgba(222,235,247,.48)}
.settings .save-still{color:rgba(232,243,253,.74);font:11px var(--sans)}
.settings .panel-foot{color:var(--ui-muted)}
.settings .panel-foot p{font:400 12px/1.6 var(--sans);letter-spacing:0}
.settings .tiny-rule{background:rgba(219,238,255,.25)}
@media(max-width:1000px){
 body:not(.debug) .masthead{inset:20px 22px auto;gap:16px}
 body:not(.debug) h1{font-size:23px}
 body:not(.debug) .eyebrow{font-size:7px;letter-spacing:.15em}
 body:not(.debug) .header-right .quiet-button{padding:9px 10px;font-size:10px;gap:6px}
 body:not(.debug) .settings{right:22px;top:88px;bottom:164px}
}
@media(max-width:760px){
 body:not(.debug) #material-toggle,body:not(.debug) #debug-toggle{font-size:0;gap:0;width:36px;padding:9px}
 body:not(.debug) #debug-toggle:not([hidden]){display:inline-flex}
 body:not(.debug) .masthead{inset:18px 18px auto;align-items:center;gap:12px}
 body:not(.debug) .header-right{flex-wrap:nowrap;max-width:none}
 body:not(.debug) h1{font-size:21px}
 body:not(.debug) .settings{right:18px;top:86px;bottom:148px;width:min(318px,calc(100vw - 36px))}
}
@media(max-width:520px){
 body:not(.debug) .masthead{inset:17px 16px auto;display:flex;flex-wrap:wrap;gap:13px;align-items:flex-start}
 body:not(.debug) h1{font-size:23px}
 body:not(.debug) .eyebrow{font-size:7px;margin-bottom:5px}
 body:not(.debug) .header-right{width:100%;justify-content:space-between;border-radius:14px;padding:4px 7px;gap:4px}
 body:not(.debug) .header-right .quiet-button{min-height:40px;padding:8px 10px;font-size:11px}
 body:not(.debug) #material-toggle,body:not(.debug) #debug-toggle{font-size:0;width:40px;padding:8px}
 body:not(.debug) .transport{bottom:max(12px,env(safe-area-inset-bottom));width:calc(100% - 24px);padding:12px 15px 11px;border-radius:16px}
 body:not(.debug) .timecode{gap:6px}
 body:not(.debug) #current-time{font-size:12px}
 body:not(.debug) #duration-time{font-size:10px}
 body:not(.debug) .settings{top:128px;right:12px;bottom:150px;width:calc(100vw - 24px);padding:22px}
 body:not(.debug) #hint{font-size:9px}
}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
 body:not(.debug) .header-right,body:not(.debug) .transport{background:rgba(13,21,31,.94)}
}
@media(prefers-reduced-transparency:reduce){
 body:not(.debug) .header-right,body:not(.debug) .transport,body:not(.debug) .settings{
 background:rgba(13,21,31,.97);backdrop-filter:none;-webkit-backdrop-filter:none;
 }
}
@media(prefers-reduced-motion:reduce){.header-right button,.playback button{transition:none!important}}
@media(prefers-contrast:more){:root{--ui-line:rgba(231,243,255,.35);--ui-muted:rgba(235,244,255,.75)}body:not(.debug) .header-right .quiet-button{color:#f1f8ff}}

/* Small native vector icons; no external icon/font requests. */
#material-toggle{--icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.65%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%227%22%20y%3D%227%22%20width%3D%2213%22%20height%3D%2213%22%20rx%3D%223%22%2F%3E%3Cpath%20d%3D%22M16%204H7a3%203%200%200%200-3%203v9%22%2F%3E%3C%2Fsvg%3E")}
#reveal{--icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.65%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M2%2012s3.5-7%2010-7%2010%207%2010%207-3.5%207-10%207S2%2012%202%2012Z%22%2F%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%223%22%2F%3E%3C%2Fsvg%3E")}
#debug-toggle{--icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.65%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%223%22%20y%3D%224%22%20width%3D%2218%22%20height%3D%2216%22%20rx%3D%223%22%2F%3E%3Cpath%20d%3D%22M12%204v16%22%2F%3E%3C%2Fsvg%3E")}
#settings-toggle{--icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.65%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M3%207h6m4%200h8M3%2017h11m4%200h3%22%2F%3E%3Ccircle%20cx%3D%2211%22%20cy%3D%227%22%20r%3D%222%22%2F%3E%3Ccircle%20cx%3D%2216%22%20cy%3D%2217%22%20r%3D%222%22%2F%3E%3C%2Fsvg%3E")}
#restart{--icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.65%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M4%2010a8%208%200%201%201%201%208M4%204v6h6%22%2F%3E%3C%2Fsvg%3E")}
#single-step{--icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.65%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22m5%205%2010%207-10%207Z%22%2F%3E%3Cpath%20d%3D%22M19%205v14%22%2F%3E%3C%2Fsvg%3E")}
#play{--play-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.65%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M8%205.7c0-.8.8-1.2%201.4-.8l9%206.3c.6.4.6%201.2%200%201.6l-9%206.3c-.6.4-1.4%200-1.4-.8Z%22%20fill%3D%22black%22%20stroke%3D%22none%22%2F%3E%3C%2Fsvg%3E")}
#play[data-playing=true]{--play-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.65%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%226.5%22%20y%3D%225%22%20width%3D%224%22%20height%3D%2214%22%20rx%3D%221%22%20fill%3D%22black%22%20stroke%3D%22none%22%2F%3E%3Crect%20x%3D%2213.5%22%20y%3D%225%22%20width%3D%224%22%20height%3D%2214%22%20rx%3D%221%22%20fill%3D%22black%22%20stroke%3D%22none%22%2F%3E%3C%2Fsvg%3E")}

@media(max-width:360px){body:not(.debug) .transport{padding-left:12px;padding-right:12px}body:not(.debug) .transport-top{gap:8px}body:not(.debug) .playback{gap:2px}body:not(.debug) .playback .quiet-button{width:32px}body:not(.debug) .timecode{gap:4px}body:not(.debug) .header-right .quiet-button{font-size:10px}body:not(.debug) #material-toggle,body:not(.debug) #debug-toggle{font-size:0}}

/* Gallery-facing organization. The established glass and artwork stay intact. */
body:not(.debug) .header-right{
 gap:8px;padding:0;border:0;border-radius:0;background:none;box-shadow:none;
 backdrop-filter:none;-webkit-backdrop-filter:none;
}
.view-switch{
 display:flex;gap:2px;padding:4px;border:1px solid var(--ui-line);border-top-color:rgba(245,249,255,.24);
 border-radius:14px;background:var(--ui-glass);box-shadow:var(--ui-shadow);
 backdrop-filter:blur(10px) saturate(110%);-webkit-backdrop-filter:blur(10px) saturate(110%);
}
.view-option{border:1px solid transparent;border-radius:9px;background:transparent;color:rgba(244,247,252,.67);min-height:40px;padding:9px 12px;font:500 11px/1.2 var(--sans);white-space:nowrap;transition:background-color 160ms ease,color 160ms ease}
.view-option:hover{background:rgba(245,249,255,.055);color:#fff}
.view-option[aria-checked=true]{background:linear-gradient(155deg,rgba(255,255,255,.12),rgba(255,255,255,.045));border-color:rgba(245,249,255,.18);box-shadow:inset 0 1px 0 rgba(255,255,255,.14);color:#f7fbff}
body:not(.debug) .header-right .utility-button{
 min-height:50px;padding:10px 13px;border:1px solid var(--ui-line);border-top-color:rgba(245,249,255,.24);border-radius:14px;
 background:var(--ui-glass);box-shadow:var(--ui-shadow);backdrop-filter:blur(10px) saturate(110%);-webkit-backdrop-filter:blur(10px) saturate(110%);
}
#about-toggle{--icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.65' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 11v6m0-10v.1'/%3E%3C/svg%3E")}
.legacy-controls{display:none!important}
.comparison-panel{position:relative;min-width:0;height:100dvh;background:#010307;overflow:hidden;border-right:1px solid rgba(227,240,255,.10)}
#comparison-footage{display:block;width:100%;height:100%}
.comparison-caption{position:absolute;top:98px;left:20px;z-index:2;color:rgba(240,246,253,.68);font:500 10px/1.4 var(--sans);letter-spacing:.03em;text-shadow:0 1px 5px #000;pointer-events:none}
body.comparing:not(.debug) .comparison{display:grid;grid-template-columns:minmax(0,.42fr) minmax(0,1fr)}
body.comparing #video-underlay{display:none}
body.debug .comparison-panel{display:none!important}
.studio-heading{display:flex;justify-content:space-between;align-items:center;gap:16px;margin:0 0 12px}
.panel-kicker{display:block;font:500 9px/1.4 var(--sans);color:var(--ui-muted);margin-bottom:6px;letter-spacing:.03em}
.studio-heading h2{margin:0;color:var(--ui-text);font:550 24px/1.15 var(--sans);letter-spacing:-.6px}
.panel-close{display:inline-flex;justify-content:center;align-items:center;width:34px;min-width:34px;height:34px;padding:0;border:1px solid var(--ui-line);border-radius:10px;background:rgba(255,255,255,.025);color:rgba(244,249,255,.78);font:300 24px/1 var(--sans)}
.panel-close:hover{background:rgba(255,255,255,.09);color:#fff}
.studio-intro{margin:0 0 26px;font:400 12px/1.65 var(--sans);color:var(--ui-muted)}
.settings .material-control{margin-bottom:0}
.settings .setting-help{font:400 10px/1.65 var(--sans);letter-spacing:0;color:var(--ui-muted);margin:-12px 0 24px}
.settings .material-control+.setting-help{margin:8px 0 27px}
.settings .control{margin-bottom:18px}
.settings .control output{font-family:var(--sans);font-variant-numeric:tabular-nums}
.fine-tune{border-top:1px solid var(--ui-line);border-bottom:1px solid var(--ui-line);margin:5px 0 22px;padding:15px 0}
.fine-tune summary{cursor:pointer;list-style:none;color:var(--ui-text);font:500 11px/1.5 var(--sans);display:flex;justify-content:space-between;align-items:center}
.fine-tune summary::-webkit-details-marker{display:none}
.fine-tune summary::after{content:'+';font:300 18px/1 var(--sans);color:var(--ui-muted)}
.fine-tune[open] summary::after{content:'−'}
.settings .fine-tune .setting-help{margin:13px 0 23px}
.fine-tune .control:last-child{margin-bottom:0}
.settings .panel-note{margin:0 0 13px;font:400 11px/1.65 var(--sans);color:var(--ui-muted)}
.settings .reset-studio{font:500 10px/1.5 var(--sans);color:var(--ui-muted);display:block;padding:6px 0;margin:0 0 2px}
.settings .save-still{margin-top:7px}
.settings .panel-foot{margin-top:22px}
body.debug .technical-controls:not([hidden]){display:block}
/* A quiet reading surface, separate from the artwork controls. */
.about-dialog{width:min(900px,calc(100vw - 48px));max-width:none;height:min(90dvh,1000px);max-height:calc(100dvh - 36px);padding:0;border:1px solid rgba(233,243,255,.20);border-radius:18px;background:#0b1017;color:var(--ui-text);box-shadow:0 24px 100px rgba(0,0,0,.55);overflow:auto;scrollbar-width:thin;scrollbar-color:#37404b transparent}
.about-dialog::backdrop{background:rgba(0,3,8,.65);backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px)}
.journal-open{overflow:hidden}
.journal-toolbar{display:flex;justify-content:space-between;align-items:center;gap:20px;position:sticky;top:0;z-index:2;padding:16px 25px;border-bottom:1px solid rgba(229,240,255,.08);background:rgba(11,16,23,.95);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.journal-toolbar>span{font:500 10px/1.4 var(--sans);color:var(--ui-muted);letter-spacing:.015em}
.journal{max-width:760px;margin:auto;padding:52px 35px 40px}
.journal-heading{margin-bottom:32px}
.journal-kicker,.journal-step{font:500 10px/1.5 var(--sans);color:rgba(193,214,235,.57);letter-spacing:.045em;margin:0 0 15px}
.journal-heading h2{font:550 clamp(30px,4.5vw,47px)/1.12 var(--sans);letter-spacing:-.045em;margin:0 0 21px;color:#f1f5fa}
.journal .journal-deck{font-size:17px;line-height:1.6;color:rgba(235,242,250,.68);max-width:35em;margin:0}
.journal p{font:400 14px/1.85 var(--sans);letter-spacing:0;color:rgba(228,236,247,.72);margin:0 0 17px}
.journal .journal-lead{font-size:15px;color:rgba(239,245,252,.86);margin-bottom:45px}
.journal section{margin:0 0 44px}
.journal .journal-kicker,.journal .journal-step{font-size:10px;line-height:1.5;letter-spacing:.045em;color:rgba(193,214,235,.57);margin-bottom:10px}
.journal h3{font:550 23px/1.3 var(--sans);letter-spacing:-.5px;color:#e9f0f8;margin:0 0 17px}
.journal figure{margin:0;min-width:0}
.journal img{display:block;width:100%;height:auto;border-radius:10px;border:1px solid rgba(226,239,255,.08)}
.journal figcaption{font:400 10px/1.65 var(--sans);color:var(--ui-muted);margin:10px 0 0}
.journal-media-pair,.journal-image-pair{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:24px 0 0}
.journal-media-pair video{display:block;width:100%;height:360px;max-height:55dvh;object-fit:contain;background:#010307;border:1px solid rgba(226,239,255,.10);border-radius:10px}
.journal-wide{margin-top:24px!important}
.journal-tools{padding-top:30px;border-top:1px solid rgba(232,243,255,.12)}
.tool-list{display:flex;flex-wrap:wrap;gap:7px;margin-top:22px}
.tool-list span{padding:6px 10px;border:1px solid var(--ui-line);border-radius:7px;color:rgba(233,243,253,.7);font:500 10px/1.4 var(--sans)}
body:not(.debug) .journal-end,.journal-end{display:flex;justify-content:space-between;align-items:center;gap:20px;margin:5px 0 0;padding:25px 0 0;border-top:1px solid rgba(232,243,255,.12)}
.journal-end p{margin:0;font:500 14px/1.5 var(--sans);color:#dce7f2}
.journal-end button{font:500 11px/1.5 var(--sans);color:var(--ui-muted)}
@media(max-width:1000px){.view-option{font-size:10px;padding:9px 10px}body:not(.debug) .header-right .utility-button{padding:9px 10px;font-size:10px}.view-switch{gap:0}}
@media(max-width:760px){body:not(.debug) .header-right{gap:6px}.view-option{padding:9px 9px}body:not(.debug) .header-right .utility-button{font-size:0;gap:0;width:42px;min-height:50px;padding:10px}.comparison-caption{top:90px;left:12px}}
@media(max-width:600px){body:not(.debug) .masthead{flex-wrap:wrap;gap:12px}body:not(.debug) .header-right{width:100%;justify-content:flex-start;max-width:none;flex-wrap:nowrap}.view-switch{flex:1}.view-option{flex:1;font-size:10px;padding:9px 7px}body:not(.debug) .header-right .utility-button{width:40px;min-height:50px;flex:0 0 40px}.comparison-caption{top:145px;font-size:9px}.about-dialog{width:calc(100vw - 20px);height:calc(100dvh - 20px);max-height:none;border-radius:14px}.journal-toolbar{padding:12px 16px}.journal{padding:34px 22px 28px}.journal p{font-size:13px}.journal h3{font-size:21px}.journal .journal-deck{font-size:15px}.journal-media-pair video{height:270px}.journal-image-pair{grid-template-columns:1fr}.journal-end{align-items:flex-start}.journal-end p{font-size:12px}.journal-end button{font-size:10px}body:not(.debug) .settings{top:132px}}
@media(max-width:360px){.view-option{font-size:9px;padding:9px 5px}body:not(.debug) .header-right{gap:5px}body:not(.debug) .header-right .utility-button{width:34px;flex-basis:34px}.journal{padding-left:17px;padding-right:17px}.journal-media-pair{gap:10px}.journal-media-pair video{height:230px}.journal-toolbar>span{font-size:9px}}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.view-switch,body:not(.debug) .header-right .utility-button{background:rgba(13,21,31,.94)}}
@media(prefers-reduced-transparency:reduce){.view-switch,body:not(.debug) .header-right .utility-button,.journal-toolbar{background:#101721;backdrop-filter:none;-webkit-backdrop-filter:none}.about-dialog::backdrop{backdrop-filter:none;-webkit-backdrop-filter:none}}
@media(prefers-reduced-motion:reduce){.view-option{transition:none}}
@media(pointer:coarse){.view-option,.panel-close{min-height:44px}.view-switch{align-items:center}.panel-close{height:44px;width:44px;min-width:44px}}

/* Explanatory tracking is exclusive to Side by side and separate from the art. */
.tracking-overlay{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:3}
body:not(.comparing) #comparison-tracking,body:not(.comparing) #field-tracking{display:none!important}
.tracking-caption{display:none;position:absolute;top:98px;left:20px;z-index:3;font:500 10px/1.4 var(--sans);letter-spacing:.03em;color:rgba(240,246,253,.65);text-shadow:0 1px 5px #000;pointer-events:none}
body.comparing .tracking-caption{display:block}
@media(max-width:760px){.tracking-caption{top:90px;left:12px}}
@media(max-width:600px){.tracking-caption{top:145px;font-size:9px;max-width:140px}}

/* Two performances, one consistent viewing language. */
.performer-switch{display:inline-flex;gap:2px;margin-top:12px;padding:3px;border:1px solid var(--ui-line);border-radius:10px;background:var(--ui-glass);box-shadow:var(--ui-shadow);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);pointer-events:auto}
.performer-option{font:500 10px/1.2 var(--sans);color:rgba(239,246,253,.60);background:none;border:1px solid transparent;border-radius:6px;padding:7px 12px;min-height:28px;transition:background-color 160ms ease,color 160ms ease}
.performer-option[aria-checked=true]{color:#f4f9ff;border-color:rgba(239,247,255,.15);background:rgba(243,249,255,.09);box-shadow:inset 0 1px 0 rgba(255,255,255,.10)}
body:not(.debug) .comparison{position:relative;display:block;height:100dvh;overflow:hidden}
body:not(.debug) .field-pane{position:absolute;inset:0;height:100%;min-width:0;overflow:hidden}
body:not(.debug) .field-pane .stage-wrap{height:100%;width:100%}
body:not(.debug) .dancer-field{display:block;width:100%;height:100%;aspect-ratio:auto;max-height:none;min-height:0;position:relative;z-index:1;touch-action:none}
.dancer-underlay{position:absolute;inset:0;overflow:hidden;opacity:0;transition:opacity 400ms ease;pointer-events:none;--video-opacity:.35;z-index:0}
body.revealed .dancer-underlay{opacity:var(--video-opacity)}
.dancer-underlay video{position:absolute;max-width:none;max-height:none;object-fit:fill;filter:grayscale(1)}
body[data-performers=blend]:not(.comparing) .dancer-field{opacity:.72}
body.comparing:not(.debug) .comparison{display:grid;grid-template-columns:minmax(0,.42fr) minmax(0,1fr);grid-template-rows:minmax(0,1fr);gap:0}
body.comparing[data-performers=blend]:not(.debug) .comparison{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:repeat(2,minmax(0,1fr))}
body.comparing:not(.debug) .field-pane{position:relative;inset:auto;min-height:0;height:100%;grid-column:2;grid-row:1}
body.comparing:not(.debug) .comparison-panel{height:100%;min-height:0;grid-column:1;grid-row:1}
body.comparing[data-performers=blend]:not(.debug) #field-pane-nano,body.comparing[data-performers=blend]:not(.debug) #comparison-panel-nano{grid-row:2;border-top:1px solid rgba(230,241,253,.12)}
body.comparing .dancer-underlay{display:none}
.comparison-panel canvas{position:absolute;inset:0;width:100%;height:100%}
body:not(.comparing) .tracking-overlay{display:none!important}
body.comparing[data-performers=blend] [data-dancer=nano] .comparison-caption,body.comparing[data-performers=blend] [data-dancer=nano] .tracking-caption{top:18px}
body.comparing[data-performers=blend] [data-dancer=sara] .comparison-caption,body.comparing[data-performers=blend] [data-dancer=sara] .tracking-caption{top:125px}
body[data-performers=nano] .comparison-caption,body[data-performers=nano] .tracking-caption,body[data-performers=sara] .comparison-caption,body[data-performers=sara] .tracking-caption{top:125px}
.artist-note{padding:22px 24px 8px;border-left:1px solid rgba(207,225,246,.25);background:rgba(218,236,255,.025);border-radius:0 10px 10px 0}
.journal a{color:#cbdff1;text-decoration-color:rgba(203,223,241,.35);text-underline-offset:3px}
.journal .journal-small{font-size:11px;color:var(--ui-muted);margin-top:17px}
.dancer-credits{border-top:1px solid rgba(232,243,255,.12);padding-top:30px}
.dancer-credits>div{margin:23px 0 0}
.dancer-credits h4{font:550 16px/1.4 var(--sans);letter-spacing:-.2px;color:#eef5fb;margin:0 0 7px}
.dancer-credits h4 span{font-weight:400;color:var(--ui-muted)}
@media(max-width:600px){.performer-switch{margin-top:9px}.performer-option{font-size:9px;min-height:26px;padding:6px 11px}body:not(.debug) .masthead{gap:10px}body:not(.debug) .settings{top:174px}body.comparing[data-performers=blend] [data-dancer=sara] .comparison-caption,body.comparing[data-performers=blend] [data-dancer=sara] .tracking-caption,body[data-performers=nano] .comparison-caption,body[data-performers=nano] .tracking-caption,body[data-performers=sara] .comparison-caption,body[data-performers=sara] .tracking-caption{top:180px;font-size:8px}.artist-note{padding:18px 17px 4px}.journal .journal-media-pair{grid-template-columns:1fr 1fr}}
@media(prefers-reduced-transparency:reduce){.performer-switch{background:#101721;backdrop-filter:none;-webkit-backdrop-filter:none}}
@media(prefers-reduced-motion:reduce){.performer-option{transition:none}}
@media(pointer:coarse){.performer-option{min-height:36px}}

body[data-performers=blend]:not(.debug) .stage-wrap{background:transparent!important}

/* Audio controls share the existing glass; artwork composition is untouched. */
.sound-toggle{background:rgba(238,247,255,.035);border:1px solid var(--ui-line);border-radius:9px;color:var(--ui-muted);font:500 10px/1 var(--sans);padding:9px 11px;min-height:34px;white-space:nowrap}
.sound-toggle[aria-pressed=true]{color:#e4f1fa;border-color:rgba(224,241,255,.30);background:rgba(228,242,255,.08)}
.sound-toggle:focus-visible{outline:2px solid #dfedfa;outline-offset:3px}
.sound-settings{border-top:1px solid var(--ui-line);margin:24px 0;padding-top:24px}
.sound-settings h3{font:550 16px/1.3 var(--sans);letter-spacing:-.2px;margin:0 0 14px}
.settings .sound-settings .setting-help{margin:0 0 19px}
.sound-status{font:400 10px/1.6 var(--sans);color:var(--ui-muted);margin:10px 0}
.material-sound-option{display:flex;align-items:center;gap:9px;font:400 11px/1.4 var(--sans);color:var(--ui-text);margin-bottom:10px}
.sound-settings .quiet-button{font:500 11px/1.4 var(--sans);color:var(--ui-text);text-decoration:none;margin-right:14px}
@media(max-width:450px){.sound-toggle{font-size:9px;padding:8px;min-height:34px}body:not(.debug) .playback{gap:8px}body:not(.debug) .transport-top{gap:8px}body:not(.debug) .timecode{gap:5px}body:not(.debug) #current-time{font-size:12px}}

/* A readable gesture score, only in the explanatory comparison view. */
.sound-cue-overlay{position:absolute;inset:0;width:100%;height:100%;z-index:4;pointer-events:none}
.sound-map{width:100%;padding:0;border:0;border-radius:0;background:none;pointer-events:none;font:400 11px/1.5 var(--sans);color:rgba(228,240,251,.70)}
.sound-map-heading{display:flex;flex-direction:column;gap:3px;margin-bottom:8px}.sound-map-heading strong{font-weight:500;color:#e4f0f8}.sound-map-heading>span{font-size:8px;color:rgba(217,233,248,.48)}
.sound-map-row{display:grid;grid-template-columns:63px 1fr;column-gap:7px;margin-top:7px}.sound-map-detail{font-size:8px;color:rgba(223,239,255,.53)}
.sound-map-bar{grid-column:1/-1;height:2px;margin-top:3px;background:rgba(211,235,253,.08);position:relative;overflow:hidden;border-radius:2px}.sound-map-bar::after{content:'';position:absolute;inset:0;background:rgba(180,227,245,.66);transform:scaleX(var(--sound-level,0));transform-origin:left}
body:not(.comparing) .sound-map,body:not(.comparing) .sound-cue-overlay{display:none!important}
.journal-sound-mappings{border-left:1px solid rgba(209,231,251,.22);padding-left:20px;margin:25px 0}.journal-sound-mappings strong{font-weight:550;color:#e1edf7}
/* Comparison has three real grid children per dancer: video, field, score. */
body:not(.comparing) .sound-pane{display:none!important}
body.comparing:not(.debug) .comparison,body.comparing[data-performers=blend]:not(.debug) .comparison{grid-template-columns:minmax(0,1fr) minmax(0,1fr) clamp(180px,24vw,320px)}
.sound-pane{grid-column:3;grid-row:1;min-width:0;min-height:0;height:100%;overflow:auto;overscroll-behavior:contain;border-left:1px solid rgba(226,240,255,.12);background:#080e17;scrollbar-width:thin;scrollbar-color:#263747 transparent}
.sound-pane-inner{padding:124px 22px 26px}
.sound-pane-caption{font:500 10px/1.5 var(--sans);color:rgba(227,239,250,.50);letter-spacing:.025em;margin:0 0 25px}
body.comparing[data-performers=blend] #sound-pane-nano{grid-row:2;border-top:1px solid rgba(230,241,253,.12)}
body.comparing[data-performers=blend] #sound-pane-nano .sound-pane-inner{padding-top:19px}
.sound-map-heading{margin-bottom:23px;gap:5px}.sound-map-heading strong{font-size:13px}.sound-map-heading>span{font-size:9px}
.sound-map-row{display:flex;flex-direction:column;gap:4px;margin-top:20px}.sound-map-row>span:first-child{font-weight:500;color:rgba(231,242,252,.88)}
.sound-map-detail{font-size:10px;line-height:1.5}.sound-map-bar{display:block;width:100%;height:2px;margin-top:4px;min-height:2px}
@media(max-width:900px){body.comparing:not(.debug) .comparison,body.comparing[data-performers=blend]:not(.debug) .comparison{grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(160px,.7fr)}.sound-pane-inner{padding-left:15px;padding-right:15px}.sound-map-heading strong{font-size:12px}.sound-map-row{margin-top:16px}}
@media(max-width:600px){body.comparing:not(.debug) .comparison,body.comparing[data-performers=blend]:not(.debug) .comparison{grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(108px,.85fr)}.sound-pane-inner{padding:178px 10px 20px}.sound-pane-caption{font-size:8px;margin-bottom:17px}.sound-map{font-size:9px}.sound-map-heading{margin-bottom:14px}.sound-map-heading strong{font-size:10px}.sound-map-heading>span,.sound-map-detail{font-size:8px}.sound-map-row{margin-top:13px;gap:2px}body.comparing[data-performers=blend] #sound-pane-nano .sound-pane-inner{padding-top:19px}}
@media(max-height:700px){.sound-map-heading{margin-bottom:12px}.sound-map-row{margin-top:12px}.sound-pane-caption{margin-bottom:15px}}

/* Compact score rows keep the duet's two sound panels readable. */
.sound-map-heading strong{display:none}.sound-map-heading{margin-bottom:14px}.sound-map-heading>span{font-size:9px}
.sound-map-row{display:grid;grid-template-columns:minmax(0,.65fr) minmax(0,1fr);column-gap:8px;row-gap:2px;margin-top:15px;align-items:start}
.sound-map-detail{font-size:9px}.sound-map-bar{grid-column:1/-1;margin-top:3px}
@media(max-width:900px){.sound-map{font-size:10px}.sound-map-row{column-gap:6px;margin-top:12px}}
@media(max-width:600px){.sound-map-row{display:flex;gap:2px;margin-top:13px}.sound-map{font-size:9px}.sound-map-detail,.sound-map-heading>span{font-size:8px}}

/* Paper / artist's edited core page, 19 October 2026.
   Presentation only: no transforms or filters are applied to artwork canvases. */
@font-face{font-family:Inter;src:url('./assets/inter-variable.woff2') format('woff2');font-weight:100 900;font-style:normal;font-display:swap}
:root{
 --sans:Inter,-apple-system,BlinkMacSystemFont,'Segoe UI',Helvetica,Arial,sans-serif;
 --paper-line:#eff5ff29;
 --paper-glass:linear-gradient(165deg,rgba(238,246,255,.01),rgba(238,246,255,.01));
 --paper-shadow:inset 0 1px 0 #ffffff1f,0 10px 28px #00000029;
 --paper-text:#e6e9ef;
 --paper-muted:#9aa3b0;
 --paper-active:#ffffff14;
}
.nav-surface,.transport-heading{display:flex;align-items:center}
.transport-heading{justify-content:space-between}
body:not(.debug) h1{font-family:Inter,var(--sans);font-size:24px;font-weight:500;line-height:28px;letter-spacing:-.035em;color:var(--paper-text)}
body:not(.debug) .masthead{align-items:center}
body:not(.debug) .header-right{gap:0}
body:not(.debug) .nav-surface{
 border:1px solid var(--paper-line);border-top:0;border-radius:999px;
 background:var(--paper-glass);box-shadow:var(--paper-shadow);
 backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
}
body:not(.debug) .view-switch{
 min-height:50px;align-items:center;gap:2px;padding:0 12px;border:0;border-radius:999px 0 0 999px;
 background:none;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;
}
body:not(.debug) .view-option{
 min-height:30px;height:30px;padding:8px 12px;border:0;border-radius:999px;
 font:400 11px/14px Inter,var(--sans);color:#a3a9b2cc;
}
body:not(.debug) .view-option[aria-checked=true]{background:var(--paper-active);box-shadow:none;color:#f7fbff}
body:not(.debug) .header-right #settings-toggle{
 height:50px;min-height:50px;padding:0 12px;gap:4px;border:0;
 border-left:1px solid var(--paper-line);border-radius:0 999px 999px 0;
 background:none;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;
 color:#dce3ed;font:400 11px/14px Inter,var(--sans);
}
body:not(.debug) .header-right #settings-toggle::before{width:12px;height:12px;flex-basis:12px}
body:not(.debug) .header-right #settings-toggle[aria-expanded=true]{background:var(--paper-active)}
body:not(.debug) .transport{
 display:flex;flex-direction:column;gap:0;width:min(520px,calc(100% - 48px));
 padding:12px 24px;border-radius:12px;border:1px solid var(--paper-line);border-top:0;
 background:var(--paper-glass);box-shadow:var(--paper-shadow);
 backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);font-family:Inter,var(--sans);
}
body:not(.debug) .transport-heading{min-height:20px;gap:16px}
body:not(.debug) .performer-switch{
 display:flex;align-items:center;gap:4px;padding:0;margin:0;
 border:0;border-radius:0;background:none;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;
}
body:not(.debug) .performer-option{
 min-height:24px;padding:4px 11px;border:0;border-radius:999px;
 background:none;box-shadow:none;color:#a3a9b2;font:400 10px/16px Inter,var(--sans);
}
body:not(.debug) .performer-option[aria-checked=true]{background:var(--paper-active);color:#f7fbff;box-shadow:none}
body:not(.debug) #about-toggle{
 min-height:20px;padding:2px 0;border:0;background:none;box-shadow:none;color:var(--paper-muted);
 font:450 9px/13px Inter,var(--sans);
}
body:not(.debug) .transport-top{min-height:40px;gap:12px;width:100%}
body:not(.debug) .playback{gap:6px;flex:0 0 auto}
body:not(.debug) .play-button{
 width:18px;min-width:18px;flex:0 0 18px;height:40px;
 border:0;border-radius:0;background:none;box-shadow:none;color:#f3f7fc;
}
body:not(.debug) .play-button:hover{background:none;box-shadow:none;color:#fff}
body:not(.debug) .playback .quiet-button{width:36px;height:40px;min-height:40px;border-radius:6px}
body:not(.debug) .transport input#timeline{flex:1;min-width:0;width:100%;height:40px;margin:0}
body:not(.debug) #timeline::-webkit-slider-runnable-track{height:2px;box-shadow:none;border-radius:4px}
body:not(.debug) #timeline::-webkit-slider-thumb{height:8px;width:8px;margin-top:-3px;border-radius:50%;box-shadow:none}
body:not(.debug) #timeline::-moz-range-track{height:2px;border-radius:4px;background:#e2edfc1f}
body:not(.debug) #timeline::-moz-range-progress{height:2px;background:#dce5ef}
body:not(.debug) #timeline::-moz-range-thumb{height:8px;width:8px;border-radius:50%;border:0;background:#e8f3ff}
body:not(.debug) .transport-bottom{display:flex;align-items:center;min-height:19px;gap:16px;letter-spacing:0}
body:not(.debug) .sound-toggle{
 min-height:19px;padding:2px 0;border:0;border-radius:0;background:none;
 color:var(--paper-muted);font:450 9px/13px Inter,var(--sans);
}
body:not(.debug) .sound-toggle[aria-pressed=true]{color:#e5f3ff;background:none}
body:not(.debug) .timecode{font-family:Inter,var(--sans);font-weight:450;gap:8px}
body:not(.debug) #current-time{font-size:11px;line-height:18px;color:#fff;letter-spacing:0}
body:not(.debug) #duration-time{font-size:11px;line-height:18px;color:#798390}
body:not(.debug) .time-separator{font-size:10px;color:#566170}
body:not(.debug) .opacity-control{width:100%;padding:8px 0 0;margin-top:8px;border-top:1px solid var(--paper-line);font-family:Inter,var(--sans)}
body:not(.debug) .opacity-control{position:relative;border-top:0;padding-top:13px;margin-top:10px}
body:not(.debug) .opacity-control::before{content:'';position:absolute;top:0;left:-24px;right:-24px;height:1px;background:var(--paper-line)}
body:not(.debug) .opacity-control input{flex:1;min-width:50px}
body:not(.debug) #video-opacity::-webkit-slider-runnable-track{height:2px;background:#e2edfc1f;border-radius:4px}
body:not(.debug) #video-opacity::-webkit-slider-thumb{height:8px;width:8px;margin-top:-3px;background:#dce5ef;border:0;border-radius:50%}
body:not(.debug) #video-opacity::-moz-range-track{height:2px;background:#e2edfc1f;border-radius:4px}
body:not(.debug) #video-opacity::-moz-range-thumb{height:8px;width:8px;background:#dce5ef;border:0;border-radius:50%}
/* Drawers use a single quiet surface and open rows, rather than nested cards. */
body:not(.debug) .settings{
 top:94px;bottom:24px;width:318px;padding:24px;border:1px solid var(--paper-line);
 border-top:0;border-radius:12px;background:linear-gradient(rgba(9,14,22,.56),rgba(9,14,22,.56)),var(--paper-glass);
 box-shadow:var(--paper-shadow);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
}
body.revealed:not(.debug) .settings{background:var(--paper-glass)}
.studio-heading{align-items:center;margin-bottom:14px}
.settings .material-control{padding-top:8px}
.settings .control{padding-bottom:9px}
.settings .sound-settings .material-sound-option{margin:18px 0 22px}
.settings .reset-studio{border-top:1px solid var(--paper-line);width:100%;padding:18px 0 0;margin-top:22px}
.panel-kicker{font:400 9px/14px Inter,var(--sans);letter-spacing:0;color:var(--paper-muted);margin-bottom:5px}
.studio-heading h2{font:550 20px/25px Inter,var(--sans);letter-spacing:-.025em}
.panel-close{border:0;border-radius:6px;background:none;color:#a3a9b2;font-size:22px;width:30px;min-width:30px;height:30px}
.panel-close:hover{background:var(--paper-active)}
.studio-intro{font:400 12px/20px Inter,var(--sans);margin-bottom:25px}
.settings .material-control{font:500 10px/15px Inter,var(--sans);color:#c2cbd6}
.settings select{
 appearance:none;background:rgba(255,255,255,.035);border:1px solid var(--paper-line);border-radius:6px;
 padding:10px 32px 10px 11px;font:400 11px/16px Inter,var(--sans);color:#e6edf6;
 background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%239aa3b0' stroke-width='1.5'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
 background-repeat:no-repeat;background-position:right 11px center;
}
.settings select option{background:#111822;color:#e6edf6}
.settings .control{margin-bottom:15px}
.settings .control label{font:400 11px/16px Inter,var(--sans)}
.settings .control output{font:400 10px/15px Inter,var(--sans);font-variant-numeric:tabular-nums}
.settings .range-ends{font:400 9px/14px Inter,var(--sans);color:#8b97a6}
.settings .setting-help{font:400 10px/17px Inter,var(--sans);color:#9aa3b0;margin-bottom:24px}
.settings .control input[type=range]{height:24px;margin-top:8px;margin-bottom:1px}
.settings input[type=range]::-webkit-slider-runnable-track{height:2px;background:#e2edfc1f}
.settings input[type=range]::-webkit-slider-thumb{height:8px;width:8px;margin-top:-3px;background:#dce5ef}
.settings input[type=range]::-moz-range-track{height:2px;background:#e2edfc1f}
.settings input[type=range]::-moz-range-thumb{height:8px;width:8px;border:0;background:#dce5ef}
.fine-tune{border-color:var(--paper-line)}
.fine-tune summary{font:500 11px/17px Inter,var(--sans)}
.sound-settings{border-color:var(--paper-line);padding-top:20px}
.sound-settings h3{font:550 16px/22px Inter,var(--sans);letter-spacing:-.02em}
.settings .quiet-button,.material-sound-option{font-family:Inter,var(--sans)}
.settings #restart{display:inline-flex;gap:8px;color:var(--paper-muted);font:500 10px/15px Inter,var(--sans);padding:6px 0}
.settings #restart span{font:400 14px/15px Inter,var(--sans)}
.material-sound-option input{accent-color:#c9dcea}
.settings .panel-foot{padding-top:18px;border-top:1px solid var(--paper-line)}
.settings .tiny-rule{display:none}
.settings .panel-foot p{font:400 11px/18px Inter,var(--sans);color:var(--paper-muted)}
/* The journal keeps its editorial hierarchy on the same restrained surface. */
.about-dialog{
 border:1px solid var(--paper-line);border-top:0;border-radius:12px;
 background:var(--paper-glass);box-shadow:var(--paper-shadow);
 backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);font-family:Inter,var(--sans);
}
.about-dialog::backdrop{background:rgba(1,3,7,.35);backdrop-filter:none;-webkit-backdrop-filter:none}
.journal-toolbar{padding:14px 24px;background:var(--paper-glass);border-color:var(--paper-line);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.journal-toolbar>span{font:450 10px/16px Inter,var(--sans);color:var(--paper-muted)}
.journal{padding:44px 35px 36px}
.journal-heading h2{font-family:Inter,var(--sans);font-size:42px;font-weight:550;line-height:47px;letter-spacing:-.04em}
.journal .journal-deck{font-family:Inter,var(--sans);font-size:16px;line-height:26px}
.journal p{font-family:Inter,var(--sans);font-size:13px;line-height:24px;color:#b7c1ce}
.journal h3{font:550 22px/29px Inter,var(--sans);letter-spacing:-.025em}
.journal .journal-kicker,.journal .journal-step{font:450 10px/16px Inter,var(--sans);letter-spacing:.025em;color:var(--paper-muted)}
.artist-note{background:none;border-radius:0;padding:3px 0 3px 20px}
.journal img,.journal-media-pair video{border-radius:6px;border-color:var(--paper-line)}
.tool-list{gap:8px 16px}
.tool-list span{padding:0;border:0;border-radius:0;font:450 10px/16px Inter,var(--sans);color:#b8c4d2}
.journal-end,.dancer-credits,.journal-tools{border-color:var(--paper-line)}
/* About is an independent reading page, with the same resting particle field. */
body.about-page{background:#010307;color:#e6e9ef;min-height:100dvh}
.journal-field-background{
 position:fixed;inset:0;pointer-events:none;
 background:linear-gradient(90deg,rgba(1,3,7,.68),rgba(1,3,7,.95) 18%,rgba(1,3,7,.95) 82%,rgba(1,3,7,.68)),url('./assets/journal/living-light.png') center/cover no-repeat;
}
.about-page-shell{position:relative;width:min(900px,calc(100% - 48px));margin:24px auto}
.about-page .journal-toolbar{
 top:16px;border:1px solid var(--paper-line);border-top:0;border-radius:12px;
 background:var(--paper-glass);box-shadow:var(--paper-shadow);gap:20px;
}
.about-page .journal-toolbar a{font:450 10px/16px Inter,var(--sans);color:#c4cfdd;text-decoration:none}
.about-page .journal-toolbar a:hover{color:#fff}
.about-page .journal{max-width:720px;padding:64px 48px 56px}
.about-page .journal-end a{font:450 11px/17px Inter,var(--sans);text-decoration:none}
.about-page .journal p{max-width:60ch;font-size:15px;line-height:27px;color:#d5dce5;margin-bottom:20px}
.about-page .journal-heading{margin-bottom:32px}
.about-page .journal-heading h2{font-size:40px;line-height:46px;margin-bottom:24px}
.about-page .journal .journal-deck{font-size:18px;line-height:30px;color:#d0d9e5;max-width:36em;margin:0}
.about-page .journal .journal-lead{font-size:16px;line-height:29px;color:#e0e6ee;margin-bottom:48px}
.about-page .journal section{margin-bottom:56px}
.about-page .journal h3{margin-bottom:20px}
.about-page .journal .journal-kicker,.about-page .journal .journal-step{font-size:11px;line-height:17px;color:#aebdce;margin-bottom:14px}
.about-page .journal figcaption,.about-page .journal .journal-small{font-size:11px;line-height:19px;color:#abb8c9}
.about-page .artist-note{padding:0 0 0 24px;border-color:#5d7085}
.about-page .artist-note p:last-child{margin-bottom:0}
.about-page .journal a{color:#d4e8fc;text-decoration-color:#8eafcf}
.about-page .journal .journal-end p{margin:0}
.about-page .journal-end{flex-wrap:wrap;gap:14px 24px}
.about-page .journal .journal-end p{font:400 11px/18px Inter,var(--sans);color:#abb8c9}
.about-page .iteration-note{padding-top:26px}
.about-page .journal{font-synthesis:none;font-variation-settings:normal}
.about-page .journal p,.about-page .journal .journal-deck,.about-page .journal .journal-lead{font-weight:400}
.about-page .journal-heading h2,.about-page .journal h3{font-weight:400}
.about-page .journal .journal-kicker,.about-page .journal .journal-step,.about-page .journal-toolbar a{font-weight:400}
.about-page .journal strong,.about-page .dancer-credits h4{font-weight:500}
.sound-pane{background:#000}
/* Compact, repeatable drawer rhythm after the explanatory copy was removed. */
body:not(.debug) .settings{padding:22px 24px}
.settings .studio-heading{min-height:30px;margin:0 0 22px}
.settings .studio-heading h2{font-size:19px;line-height:26px;font-weight:500}
.settings .material-control{display:flex;flex-direction:column;gap:8px;padding:0;margin:0 0 24px}
.settings select{min-height:36px;padding-top:9px;padding-bottom:9px}
.settings .material-control+.setting-help{display:none}
.settings .control{margin:0 0 14px;padding:0}
.settings .control label{font-size:11px;line-height:16px}
.settings .control output{line-height:16px}
.settings .control input[type=range]{height:18px;margin:6px 0 0}
.settings .range-ends{font-size:9px;line-height:13px}
.settings .fine-tune{margin:8px 0 0;padding:15px 0}
.settings .fine-tune[open]{padding-bottom:4px}
.settings .fine-tune .setting-help{margin:12px 0 18px}
.settings .sound-settings{margin:24px 0 0;padding-top:0;border-top:0}
.settings .sound-settings h3{font-size:15px;line-height:21px;margin:0 0 20px;font-weight:500}
.settings .sound-settings .control{margin-bottom:18px}
.settings .sound-settings .material-sound-option{margin:4px 0 0;min-height:24px;font-size:11px}
.settings .reset-studio{position:relative;margin:22px 0 0;padding:16px 0 0;line-height:17px;border-top:0}
.settings .reset-studio::before{content:'';position:absolute;top:0;left:-24px;right:-24px;height:1px;background:var(--paper-line);pointer-events:none}
/* A quiet word cycle and odometer columns; numbers are never invented. */
body:not(.debug) .loading{background:rgba(1,3,7,.62);font-family:Inter,var(--sans);letter-spacing:0}
.loading-readout{display:flex;flex-direction:row;align-items:center;gap:12px;padding:24px 20px}
.loading-action{display:flex;align-items:center;gap:0;font:400 17px/24px Inter,var(--sans);color:#d5dfeb;flex-shrink:0}
[data-loading-word]{display:block}
.loading-numbers{display:flex;align-items:center;gap:10px;font:400 20px/24px Inter,var(--sans);font-variant-numeric:tabular-nums;color:#c0cddd}
[data-loading-current],[data-loading-target]{display:flex;align-items:center;gap:0}
.loading-digit{display:block;width:.65em;height:1.2em;overflow:hidden}
.loading-digit-strip{display:flex;flex-direction:column;transform:translateY(calc(var(--digit,0) * -1.2em));will-change:transform}
.loading-digit-strip>span{display:block;height:1.2em;min-height:1.2em;line-height:1.2em;text-align:center}
.loading-decimal{width:.28em;text-align:center}
.loading-slash{font-size:13px;color:#657589;padding:0 2px}
[data-loading-target]{color:#8c9aab}
.loading-unit{font-size:11px;color:#8c9aab}
@media(prefers-reduced-motion:reduce){.loading-digit-strip{transition:none}}
@media(max-width:400px){.loading-readout{gap:12px;padding:24px 16px}.loading-action{font-size:15px}.loading-numbers{font-size:17px;gap:7px}}
@media(max-width:600px){
 .about-page-shell{width:calc(100% - 24px);margin:12px auto}
 .about-page .journal-toolbar{top:12px;gap:12px}
 .about-page .journal-toolbar a{font-size:9px}
 .about-page .journal{padding:40px 16px 36px}
 .about-page .journal-heading h2{font-size:32px;line-height:37px}
 .about-page .journal .journal-deck{font-size:17px;line-height:28px}
 .about-page .journal p{font-size:15px;line-height:27px}
 .about-page .journal section{margin-bottom:44px}
 .about-page .artist-note{padding-left:18px}
}
/* The comparison remains three real columns; captions follow the shorter masthead. */
body.comparing[data-performers=blend] [data-dancer=sara] .comparison-caption,
body.comparing[data-performers=blend] [data-dancer=sara] .tracking-caption,
body[data-performers=sara] .comparison-caption,body[data-performers=sara] .tracking-caption,
body[data-performers=nano] .comparison-caption,body[data-performers=nano] .tracking-caption{top:98px}
.sound-pane-inner{padding-top:98px}
@media(max-width:1000px){
 body:not(.debug) .settings{bottom:150px;top:90px}
 body.revealed:not(.debug) .settings{bottom:194px}
}
@media(max-width:760px){
 body:not(.debug) .view-option{font-size:10px;padding:8px 10px}
 body:not(.debug) .header-right #settings-toggle{width:auto;flex:none;font-size:10px}
 body:not(.debug) .masthead{gap:12px}
 body:not(.debug) h1{font-size:21px}
}
@media(max-width:600px){
 body:not(.debug) .masthead{flex-wrap:wrap;gap:12px}
 body:not(.debug) .header-right{width:100%;justify-content:flex-start}
 body:not(.debug) .nav-surface{width:100%}
 body:not(.debug) .view-switch{flex:1;min-width:0;padding:0 8px}
 body:not(.debug) .view-option{flex:1;font-size:10px;padding:8px}
 body:not(.debug) .header-right #settings-toggle{padding:0 12px;min-width:65px}
 body:not(.debug) .transport{width:calc(100% - 24px);padding:12px 18px;bottom:max(12px,env(safe-area-inset-bottom))}
 body:not(.debug) .opacity-control::before{left:-18px;right:-18px}
 body:not(.debug) .transport-top{gap:10px}
 body:not(.debug) .settings{top:132px;bottom:150px;width:calc(100% - 24px);right:12px;padding:22px}
 .settings .reset-studio::before{left:-22px;right:-22px}
 .journal{padding:32px 22px 28px}
 .journal-heading h2{font-size:32px;line-height:36px}
 .journal .journal-deck{font-size:15px;line-height:24px}
 .journal-toolbar{padding:12px 18px}
 body.comparing[data-performers=blend] [data-dancer=sara] .comparison-caption,
 body.comparing[data-performers=blend] [data-dancer=sara] .tracking-caption,
 body[data-performers=sara] .comparison-caption,body[data-performers=sara] .tracking-caption,
 body[data-performers=nano] .comparison-caption,body[data-performers=nano] .tracking-caption{top:145px}
 .sound-pane-inner{padding-top:145px}
}
@media(pointer:coarse){
 body:not(.debug) .performer-option,body:not(.debug) #about-toggle{min-height:32px}
 body:not(.debug) .sound-toggle{min-height:28px}
 body:not(.debug) .play-button{width:28px;min-width:28px;flex-basis:28px}
 .panel-close{width:44px;min-width:44px;height:44px}
}
@media(max-width:360px){
 body:not(.debug) .view-option{font-size:9px;padding:8px 6px}
 body:not(.debug) .header-right #settings-toggle{min-width:52px;padding:0 9px;font-size:9px}
}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
 body:not(.debug) .nav-surface,body:not(.debug) .transport,body:not(.debug) .settings{background:#0c131dee}
}
@media(prefers-reduced-transparency:reduce){
 body:not(.debug) .nav-surface,body:not(.debug) .transport,body:not(.debug) .settings,.about-dialog,.journal-toolbar{
 background:#0c131d;backdrop-filter:none;-webkit-backdrop-filter:none;
 }
}
@media(prefers-contrast:more){
 :root{--paper-line:#eff5ff66;--paper-muted:#c6d0de}
 body:not(.debug) .view-option,body:not(.debug) .performer-option{color:#ced6e2}
}
