/* LABS / 004 — one light, two mirrors, no decorative visualiser effects. */
.mirror-music{--mm-black:#050505;--mm-white:#f4f1e9;--mm-paper:#f3f2ed;--mm-quiet:#8d8b84;--mm-rule:#b9b6ad;--mm-red:#ce2c20;margin-top:30px;color:#171715}.mirror-music button,.mirror-music input{border-radius:0}.mirror-stage{position:relative;height:clamp(680px,75vw,980px);margin:0 calc(-1*var(--gutter,3vw));overflow:hidden;background:var(--mm-black);color:var(--mm-white);isolation:isolate}.mirror-light{position:absolute;inset:0;width:100%;height:100%}.mirror-heading{position:absolute;z-index:4;top:28px;left:var(--gutter,3vw);pointer-events:none}.mirror-heading>span,.mirror-current,.mirror-format,.mirror-debug,.mirror-console legend,.mirror-exposure,.mirror-offsets,.mirror-capture header>span,.mirror-capture dl,.mirror-about,.mirror-machine{font:11px/1.4 var(--mono,'Courier New',monospace);letter-spacing:.08em;text-transform:uppercase}.mirror-heading>span{color:#8e8b84}.mirror-heading h1{margin:15px 0 0;font-size:clamp(48px,6.3vw,94px);font-weight:400;line-height:.83;letter-spacing:-.055em}.mirror-arrival{position:absolute;z-index:5;inset:0;display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-start;padding:0 var(--gutter,3vw) clamp(38px,6vw,84px);background:linear-gradient(180deg,rgba(5,5,5,.03) 30%,rgba(5,5,5,.86) 100%)}.mirror-arrival>p:first-child{margin:0 0 clamp(28px,4vw,54px);font-size:clamp(52px,8vw,128px);font-weight:400;line-height:.83;letter-spacing:-.07em}.mirror-source-actions{display:flex;flex-wrap:wrap;gap:8px}.mirror-source-actions button{min-height:52px;padding:0 18px;border:1px solid rgba(244,241,233,.46);background:transparent;color:inherit;font:12px var(--mono,'Courier New',monospace);letter-spacing:.08em}.mirror-source-actions button:hover,.mirror-source-actions button:focus-visible{border-color:var(--mm-white);background:var(--mm-white);color:var(--mm-black)}.mirror-format{margin:15px 0 0;color:#85827b;font-size:9px}.mirror-current{position:absolute;z-index:4;right:var(--gutter,3vw);bottom:20px;display:flex;gap:26px;color:#8b8881;pointer-events:none}.mirror-console{border-bottom:1px solid var(--mm-rule)}.mirror-transport{display:grid;grid-template-columns:auto minmax(140px,1fr) auto auto;align-items:center;gap:18px;padding:18px 0;border-bottom:1px solid var(--mm-rule)}.mirror-transport button,.mirror-controls button,.mirror-offsets button,.mirror-capture button{padding:0;border:0;background:transparent;color:inherit;font:12px/1.2 var(--mono,'Courier New',monospace);letter-spacing:.075em;text-transform:uppercase}.mirror-transport [data-mm-play]{display:flex;align-items:center;gap:11px;min-width:82px;font-size:18px}.mirror-transport [data-mm-play]::before{content:'';width:0;height:0;border-top:6px solid transparent;border-bottom:6px solid transparent;border-left:10px solid var(--mm-red)}.mirror-transport [data-mm-play][aria-pressed=true]::before{width:8px;height:12px;border:0;border-right:3px solid var(--mm-red);border-left:3px solid var(--mm-red)}.mirror-waveform{position:relative;height:42px}.mirror-waveform canvas,.mirror-waveform input{position:absolute;inset:0;width:100%;height:100%}.mirror-waveform input{margin:0;opacity:.01;cursor:ew-resize}.mirror-waveform:focus-within{outline:2px solid var(--mm-red);outline-offset:3px}.mirror-transport output{min-width:154px;color:#625f59;font:10px var(--mono,'Courier New',monospace);letter-spacing:.04em}.mirror-controls{display:grid;grid-template-columns:auto minmax(330px,1fr) minmax(210px,.55fr) auto;align-items:end;gap:clamp(20px,4vw,66px);padding:25px 0}.mirror-controls fieldset{display:flex;gap:3px;margin:0;padding:0;border:0}.mirror-controls legend{margin-bottom:10px;color:#6d6a64}.mirror-controls fieldset button{min-height:42px;padding:0 13px;border:1px solid #aaa79f}.mirror-controls button[aria-pressed=true]{background:#171715;color:var(--mm-paper)}.mirror-exposure{display:grid;grid-template-columns:1fr auto;gap:9px 15px;color:#6d6a64}.mirror-exposure input{grid-column:1/-1;width:100%;accent-color:var(--mm-red)}.mirror-exposure output{color:#171715}.mirror-capture-button{min-height:52px!important;padding:0 17px!important;border:1px solid #171715!important;font-size:14px!important}.mirror-capture-button span{color:var(--mm-red)}.mirror-offsets{padding:0 0 24px;border-top:1px solid var(--mm-rule);color:#6d6a64}.mirror-offsets summary{padding:17px 0;cursor:pointer;color:#171715}.mirror-offsets[open]{display:grid;grid-template-columns:1fr 1fr auto;gap:30px;align-items:end}.mirror-offsets[open] summary{grid-column:1/-1}.mirror-offsets label{display:grid;grid-template-columns:1fr auto;gap:8px}.mirror-offsets input{grid-column:1/-1;width:100%;accent-color:var(--mm-red)}.mirror-offsets output{color:#171715}.mirror-offsets button{min-height:38px;border-bottom:1px solid #171715}.mirror-machine{position:absolute;z-index:3;inset:18% 12% 8%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;color:#d4d1c9}.mirror-machine[hidden]{display:none}.mirror-signal{display:grid;grid-template-columns:auto auto auto;gap:16px;align-items:center}.mirror-signal strong{display:grid;place-items:center;width:48px;height:34px;border:1px solid #77736c;font-weight:400}.mirror-flow{color:#6e6b65}.mirror-pair{display:flex;gap:clamp(70px,14vw,220px)}.mirror-object{position:relative;width:145px;height:92px;padding:0;border:1px solid #706d66;background:rgba(5,5,5,.75);color:inherit;touch-action:none;cursor:grab}.mirror-object:active{cursor:grabbing}.mirror-object span{position:absolute;top:9px;left:11px;font-size:9px}.mirror-object i{position:absolute;top:55%;left:18%;width:64%;height:2px;background:var(--mm-white);box-shadow:0 0 7px rgba(244,241,233,.42);transform:rotate(var(--mirror-angle,0deg));transition:transform 45ms linear}.mirror-beam{display:flex;align-items:center;gap:12px}.mirror-beam i{width:7px;height:7px;border-radius:50%;background:#fff;box-shadow:0 0 8px rgba(255,250,234,.8);transform:translate(var(--light-x,0),var(--light-y,0))}.mirror-plane{width:min(66vw,600px);padding:15px;border:1px solid #77736c;text-align:center}.mirror-touch{margin:0;color:#77736c;font-size:9px}.mirror-stage.is-machine .mirror-light{opacity:.22}.mirror-debug{position:absolute;z-index:8;top:24px;right:var(--gutter,3vw);width:min(310px,38vw);padding:13px;border:1px solid #494740;background:rgba(0,0,0,.82);color:#bbb7ae;white-space:pre-line}.mirror-capture{margin:0 calc(-1*var(--gutter,3vw));padding:clamp(28px,5vw,70px) var(--gutter,3vw);background:var(--mm-black);color:var(--mm-white);min-height:85svh}.mirror-capture[hidden]{display:none}.mirror-capture header{display:flex;justify-content:space-between;gap:30px;align-items:flex-start}.mirror-capture header>span{color:#96928a}.mirror-capture h2{margin:0;text-align:right;font-size:clamp(28px,4vw,62px);font-weight:400;line-height:.9;letter-spacing:-.05em}.mirror-capture canvas{display:block;width:100%;height:min(58vw,650px);margin:clamp(34px,6vw,82px) 0;background:#050505}.mirror-capture dl{display:grid;grid-template-columns:repeat(5,1fr);gap:20px;margin:0;padding:16px 0;border-top:1px solid #45433e;color:#8e8b84}.mirror-capture dl div{display:grid;gap:5px}.mirror-capture dd{margin:0;color:var(--mm-white)}.mirror-capture>div{display:flex;justify-content:flex-end;gap:24px;margin-top:30px}.mirror-capture button{color:var(--mm-white);min-height:44px;border-bottom:1px solid #77736c}.mirror-about{padding:20px 0;color:#68655f}.mirror-about summary{cursor:pointer;color:#171715}.mirror-about p{max-width:780px;margin:18px 0 0;font:16px/1.55 var(--sans,Arial,sans-serif);letter-spacing:0;text-transform:none}.mirror-music button:focus-visible,.mirror-music summary:focus-visible{outline:2px solid var(--mm-red);outline-offset:4px}.mirror-music button:disabled{opacity:.35}.mirror-music [hidden]{display:none!important}
@media(max-width:900px){.mirror-stage{height:clamp(670px,145vw,850px)}.mirror-heading h1{font-size:clamp(45px,12vw,78px)}.mirror-arrival>p:first-child{font-size:clamp(50px,14vw,92px)}.mirror-transport{grid-template-columns:auto 1fr auto}.mirror-transport output{grid-row:2;grid-column:2}.mirror-transport [data-mm-source-menu]{grid-row:2;grid-column:3}.mirror-controls{grid-template-columns:1fr 1fr}.mirror-modes{grid-column:1/-1;flex-wrap:wrap}.mirror-modes button{flex:1}.mirror-capture-button{align-self:stretch}.mirror-offsets[open]{grid-template-columns:1fr}.mirror-machine{inset:20% 4% 7%}.mirror-pair{gap:12vw}.mirror-object{width:32vw;max-width:140px}.mirror-capture dl{grid-template-columns:1fr 1fr}.mirror-capture>div{justify-content:flex-start;flex-wrap:wrap}.mirror-current{left:var(--gutter,3vw);right:auto;flex-direction:column;gap:4px}.mirror-debug{top:auto;right:12px;bottom:60px;width:calc(100% - 24px)}}
@media(max-width:520px){.mirror-stage{height:690px}.mirror-heading{top:22px}.mirror-arrival{padding-bottom:38px}.mirror-source-actions{display:grid;width:100%}.mirror-transport{grid-template-columns:auto 1fr}.mirror-transport [data-mm-source-menu]{grid-column:1/-1}.mirror-transport output{grid-column:2;min-width:0}.mirror-controls{display:flex;flex-direction:column;align-items:stretch;gap:26px}.mirror-controls fieldset{width:100%}.mirror-view button,.mirror-modes button{flex:1;padding:0 7px}.mirror-exposure{width:100%}.mirror-pair{gap:18px}.mirror-object{width:128px}.mirror-capture header{display:block}.mirror-capture h2{margin-top:22px;text-align:left}.mirror-capture canvas{height:115vw}.mirror-capture dl{grid-template-columns:1fr}.mirror-capture>div{display:grid}.mirror-about p{font-size:15px}}
@media(prefers-reduced-motion:reduce){.mirror-music *{scroll-behavior:auto!important;transition-duration:1ms!important}}
/* A sound observatory: each authored system shares one quiet instrument console. */
.mirror-simulation{position:absolute;inset:0;display:block;width:100%;height:100%;background:#05070b}.mirror-study-title{position:absolute;z-index:3;bottom:56px;left:var(--gutter,3vw);pointer-events:none}.mirror-study-title>span{font:10px var(--mono,'Courier New',monospace);letter-spacing:.13em;color:#a6a49e}.mirror-study-title h2{margin:10px 0 6px;font-size:clamp(30px,4.5vw,66px);font-weight:400;letter-spacing:-.05em;line-height:.9}.mirror-study-title p{margin:0;font:12px var(--mono,'Courier New',monospace);color:#aaa9a3}.mirror-music[data-study]:not([data-study=MIRROR]) .mirror-heading h1{font-size:clamp(30px,3.3vw,49px)}.mirror-music[data-study]:not([data-study=MIRROR]) .mirror-arrival{justify-content:flex-end;padding-bottom:56px;background:linear-gradient(180deg,transparent 40%,#050505bd 100%)}.mirror-music[data-study]:not([data-study=MIRROR]) .mirror-arrival>p:first-child{font-size:clamp(30px,4vw,56px)}.mirror-music.has-source .mirror-arrival{display:none}.mirror-studies{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid #b9b6ad;border-bottom:1px solid #b9b6ad}.mirror-studies button{position:relative;text-align:left;padding:22px 16px 21px 36px;background:transparent;border:0;border-right:1px solid #d0cec6;border-bottom:1px solid #d0cec6;color:#242420;font:11px/1.4 var(--mono,'Courier New',monospace);letter-spacing:.07em;cursor:pointer}.mirror-studies button:nth-child(4n){border-right:0}.mirror-studies button:nth-child(n+5){border-bottom:0}.mirror-studies button>span{position:absolute;left:0;top:23px;font-size:9px;color:#8a887f}.mirror-studies button i{display:block;font:17px var(--sans,Arial,sans-serif);letter-spacing:-.035em;text-transform:none;font-style:normal;margin-top:7px}.mirror-studies button[aria-pressed=true]{color:#c93125;background:#e9e7df}.mirror-studies button[aria-pressed=true]::before{content:'';position:absolute;left:0;bottom:0;width:100%;height:2px;background:#c93125}.mirror-studies button:hover{background:#eeece4}.mirror-source-bar{display:flex;align-items:center;gap:24px;padding:20px 0;border-bottom:1px solid var(--mm-rule);flex-wrap:wrap}.mirror-source-bar fieldset{border:0;padding:0;margin:0;display:flex;align-items:center;gap:2px}.mirror-source-bar legend,.mirror-field-controls legend{float:left;padding:0;margin:0 18px 0 0;font:10px var(--mono,'Courier New',monospace);letter-spacing:.09em;color:#77746d}.mirror-source-bar button,.mirror-field-controls button{font:10px var(--mono,'Courier New',monospace);letter-spacing:.075em;border:1px solid #aaa79f;background:none;padding:13px 15px;color:inherit;cursor:pointer}.mirror-source-bar button[aria-pressed=true],.mirror-field-controls button[aria-pressed=true]{background:#171715;color:#f4f1e9}.mirror-source-bar>p{margin:0 0 0 auto;font:11px var(--mono,'Courier New',monospace);color:#76736c}.mirror-mic-tools{flex-basis:100%;display:grid;grid-template-columns:auto 110px 1fr auto;align-items:center;gap:20px;padding-top:12px}.mirror-mic-tools [data-mm-mic-start]{border-color:#c93125;color:#c93125}.mirror-mic-tools [data-mm-mic-start][aria-pressed=true]{background:#c93125;color:white}.mirror-mic-tools meter{width:100%;accent-color:#c93125}.mirror-mic-tools label{display:flex;align-items:center;gap:12px;font:10px var(--mono,'Courier New',monospace)}.mirror-mic-tools label input{width:120px;accent-color:#c93125}.mirror-mic-tools>span{font:10px var(--mono,'Courier New',monospace);max-width:340px}.mirror-mic-tools>p{grid-column:1/-1;margin:0;font:10px var(--mono,'Courier New',monospace);color:#76736c}.mirror-field-controls{display:grid;grid-template-columns:1.45fr repeat(4,.65fr) auto;align-items:end;gap:28px;border-bottom:1px solid #b9b6ad;padding:24px 0 20px}.mirror-field-controls fieldset{margin:0;padding:0;border:0;display:flex;flex-wrap:wrap;gap:2px}.mirror-field-controls legend{float:none;margin-bottom:12px}.mirror-field-controls fieldset button{font-size:9px;padding:11px 9px}.mirror-field-controls label{display:grid;grid-template-columns:1fr auto;gap:8px;font:10px var(--mono,'Courier New',monospace);color:#76736c;letter-spacing:.065em}.mirror-field-controls label input{width:100%;grid-column:1/-1;grid-row:2;accent-color:#c93125}.mirror-field-controls label output{grid-column:2;grid-row:1;color:#242420}.mirror-field-controls>p{grid-column:1/-1;margin:0;font:12px/1.5 var(--mono,'Courier New',monospace);color:#76736c}.mirror-status{font:11px/1.4 var(--mono,'Courier New',monospace);min-height:16px;padding:0 0 12px;margin:0;color:#6d6a64}.mirror-status[data-error=true]{color:#a7281e}.mirror-music[data-study]:not([data-study=MIRROR]) .mirror-controls{grid-template-columns:minmax(210px,1fr) auto}.mirror-music[data-study]:not([data-study=MIRROR]) .mirror-offsets{display:none}.mirror-music[data-study]:not([data-study=MIRROR]) .mirror-exposure{display:none}.mirror-music[data-study]:not([data-study=MIRROR]) .mirror-capture-button{grid-column:-2/-1;justify-self:end}.mirror-music.is-captured .mirror-studies,.mirror-music.is-captured .mirror-source-bar,.mirror-music.is-captured .mirror-field-controls{display:none!important}
@media(max-width:1000px){.mirror-field-controls{grid-template-columns:repeat(3,1fr)}.mirror-field-controls fieldset{grid-column:1/-1}.mirror-field-controls>button{grid-column:1/-1;justify-self:start}.mirror-mic-tools{grid-template-columns:auto 1fr}.mirror-mic-tools>span{grid-column:1/-1}.mirror-mic-tools label{grid-column:1/-1}.mirror-studies button{padding-left:27px}.mirror-studies button i{font-size:15px}}
@media(max-width:600px){.mirror-studies{grid-template-columns:repeat(2,minmax(0,1fr))}.mirror-studies button{padding:16px 10px 16px 26px;min-height:76px;font-size:10px}.mirror-studies button>span{top:17px}.mirror-studies button:nth-child(2n){border-right:0}.mirror-studies button:nth-child(4n+1){border-right:1px solid #d0cec6}.mirror-studies button:nth-child(n+5){border-bottom:1px solid #d0cec6}.mirror-studies button:nth-child(n+7){border-bottom:0}.mirror-source-bar{gap:14px}.mirror-source-bar>p{margin:0;flex-basis:100%;font-size:10px}.mirror-source-bar button{padding:13px 10px}.mirror-source-bar legend{margin-right:12px}.mirror-field-controls{gap:22px 13px}.mirror-field-controls fieldset button{padding:11px 8px}.mirror-study-title{bottom:68px}.mirror-study-title p{font-size:10px;max-width:270px}.mirror-study-title h2{font-size:38px}.mirror-music[data-study]:not([data-study=MIRROR]) .mirror-arrival{padding-bottom:44px}.mirror-music[data-study]:not([data-study=MIRROR]) .mirror-heading h1{font-size:35px}.mirror-field-controls>p{font-size:10px}.mirror-mic-tools{gap:16px}.mirror-mic-tools label input{width:100%}}

.mirror-stage-switch{position:absolute;z-index:6;top:26px;right:var(--gutter,3vw);display:flex;align-items:center;gap:12px;color:#a6a49e;font:10px var(--mono,'Courier New',monospace);letter-spacing:.1em}.mirror-stage-switch button{width:38px;height:38px;padding:0;border:1px solid #54534e;background:#05070b88;color:#eeebe2;font-size:18px;cursor:pointer}.mirror-stage-switch button:hover{background:#eeebe2;color:#050505}.mirror-music:not(.has-source) .mirror-study-title{display:none}.mirror-music.has-source .mirror-stage-switch{z-index:7}@media(max-width:520px){.mirror-stage-switch{gap:9px;top:20px}.mirror-stage-switch button{width:34px;height:34px}}

.mirror-music[data-study]:not([data-study=MIRROR]) .mirror-stage{height:clamp(620px,75svh,850px)}@media(max-width:520px){.mirror-music[data-study]:not([data-study=MIRROR]) .mirror-stage{height:690px}.mirror-transport [data-mm-source-menu]{grid-row:3;grid-column:1/-1;justify-self:start}.mirror-transport output{grid-row:2;grid-column:2}}

.mirror-stage-switch [data-mm-stage-play]{width:auto;min-width:62px;padding:0 12px;font:10px var(--mono,'Courier New',monospace);letter-spacing:.06em}.mirror-stage-switch [data-mm-stage-play][aria-pressed=true]{color:#eeeae1;border-color:#a5a19a}@media(max-width:520px){.mirror-stage-switch{gap:7px}.mirror-stage-switch [data-mm-stage-play]{min-width:57px;padding:0 8px}}
.mirror-music[data-study]:not([data-study=MIRROR]) [data-mm-point]{display:none}

/* Keep the first sound gesture in the arrival viewport; active instrument geometry is unchanged. */
.mirror-music:not(.has-source) .mirror-stage{height:clamp(580px,calc(100svh - 300px),760px)}.mirror-music:not(.has-source) .mirror-arrival{padding-bottom:32px}.mirror-music:not(.has-source) .mirror-arrival>p:first-child{font-size:clamp(52px,6.4vw,92px);margin-bottom:26px}@media(max-width:900px){.mirror-music:not(.has-source) .mirror-stage{height:clamp(580px,calc(100svh - 180px),720px)}.mirror-music:not(.has-source) .mirror-arrival>p:first-child{font-size:clamp(52px,10vw,78px)}}@media(max-width:520px){.mirror-music:not(.has-source) .mirror-stage{height:640px}.mirror-music:not(.has-source) .mirror-arrival>p:first-child{font-size:clamp(48px,13vw,58px)}}
.mirror-source-bar>p,.mirror-field-controls>p,.mirror-field-controls label,.mirror-source-bar legend,.mirror-field-controls legend{color:#625f59}@media(max-width:600px){.mirror-field-controls>p{font-size:11px;line-height:1.55}}
.mirror-stage-switch [data-mm-stage-play][aria-pressed=true]:hover{background:#eeebe2;color:#050505}
/* Keep complete study names and measured units together on narrow phones. */
@media(max-width:380px){.mirror-field-controls{grid-template-columns:repeat(2,minmax(0,1fr))}}
