/* Playing is the primary mobile surface. Harmonic editing is a separate drawer. */
#harmonic-lab{margin:35px auto 0;scroll-margin-top:90px;max-width:1180px}
#harmonic-lab .sl-player{grid-template-columns:125px minmax(0,1fr) 230px;grid-template-rows:auto auto auto auto auto;gap:14px}
#harmonic-lab .sl-identity{grid-column:1;grid-row:1/5}
#harmonic-lab .sl-stacked-logo{width:100%;max-width:125px;display:block}
#harmonic-lab .sl-stacked-logo>img{display:block;width:100%;height:auto;margin:0}
.sl-preset-strip{grid-column:2;grid-row:1;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 15px;min-width:0}
.sl-preset-strip>span{font:10px/1.6 'JetBrains Mono',monospace;color:#8bbdd9;letter-spacing:.04em}
.sl-preset-strip .wave-presets{display:flex;flex-wrap:wrap;gap:3px;margin:0}
.sl-preset-strip .wave-presets>button{font:12px/1.4 Inter,Arial,sans-serif;border:1px solid transparent;border-radius:3px;min-height:38px;padding:6px;background:transparent;color:#c9c2d7}
.sl-preset-strip .wave-presets>button[aria-pressed=true]{background:#343c54;border-color:#8b80a3;color:#f0e4fb}
#harmonic-lab .sl-editor{grid-column:2;grid-row:2;padding:0;min-width:0}
.sl-editor>summary{display:none}
#harmonic-lab .sl-scope{grid-column:2;grid-row:3;margin:0;height:60px}
#harmonic-lab .sl-character{grid-column:3;grid-row:1/4;width:100%;margin:0}
#harmonic-lab .sl-player-footer{grid-column:2/-1;grid-row:4}
#harmonic-lab .mini-keyboard-wrap{grid-column:1/-1;grid-row:5}
.study-disclaimer{max-width:1180px;margin:18px auto 0;font:14px/1.8 Inter,Arial,sans-serif;color:#bcb0c9}
.playground-mobile-title{display:none}
.technical-page .comparison-emblem::before{display:none}
.technical-page .comparison-emblem img{width:min(100%,420px);filter:none;image-rendering:auto}
.technical-page .comparison-emblem{padding:35px 0}
@media(max-width:1100px) and (min-width:901px){
 #harmonic-lab .sl-player{grid-template-columns:105px minmax(0,1fr) 210px;gap:12px}
}
@media(max-width:900px),(hover:none) and (max-height:600px){
 .harmonic-playground .playground-heading>.eyebrow,.playground-desktop-title{display:none}
 .playground-mobile-title{display:inline}
 .harmonic-playground .playground-heading h2{font-size:32px;line-height:1.2;margin:0}
 .harmonic-playground .playground-heading{margin-bottom:0}
 #harmonic-lab{margin-top:25px}
 #harmonic-lab .sl-player{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:none;gap:12px;padding:14px;border-color:#716582;background:linear-gradient(135deg,#252c40,#1a2130 62%,#252237);border-radius:8px}
 #harmonic-lab .sl-identity{grid-column:1;grid-row:1;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 10px;align-items:center;padding:0 0 9px;border-right:0;border-bottom:1px solid #80758b55;text-align:left}
 #harmonic-lab .sl-stacked-logo{grid-column:1;grid-row:1;width:100%;max-width:145px;min-width:0}
 #harmonic-lab .sl-identity>span{display:none}
 #harmonic-lab .sl-identity .listen-button{grid-column:2;grid-row:1;width:auto;min-height:44px;padding:8px 12px;margin:0;font:13px/1.5 Inter,Arial,sans-serif;gap:8px;white-space:nowrap}
 #harmonic-lab .sl-identity>output{grid-column:1;grid-row:2;align-self:start;margin-top:9px;font:10px/1.7 'JetBrains Mono',monospace;letter-spacing:0;color:#cbd7e6}
 #harmonic-lab .sl-identity .audio-help{grid-column:2;grid-row:2;margin:0;text-align:right;width:auto}
 #harmonic-lab .audio-help summary{margin-left:auto;min-height:32px;font-size:12px}
 #harmonic-lab .sl-identity .audio-help[open]{grid-column:1/-1}
 #harmonic-lab .sl-identity .audio-help p{font-size:14px;line-height:1.7;padding:12px;background:#11192755;border-radius:3px;text-align:left}
 #harmonic-lab .sl-preset-strip{grid-column:1;grid-row:2;display:block;margin:0;min-height:0}
 #harmonic-lab .sl-preset-strip>span{display:none}
 #harmonic-lab .wave-presets{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:3px;width:100%;margin:0}
 #harmonic-lab .wave-presets>button{font-size:12px;line-height:1.3;min-height:44px;padding:5px 2px;white-space:normal}
 #harmonic-lab .sl-scope{grid-column:1;grid-row:3;height:40px;margin:0}
 #harmonic-lab .sl-character{grid-column:1;grid-row:4;padding:0;border:0;background:none}
 #harmonic-lab .sl-panel-title{display:none}
 #harmonic-lab .sl-knobs{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:3px;align-items:start}
 #harmonic-lab .sl-knob{width:100%;max-width:60px}
 #harmonic-lab .knob-face,#harmonic-lab .sl-knob input{width:100%;height:auto;aspect-ratio:1}
 #harmonic-lab .sl-knob input{top:20px}
 #harmonic-lab .sl-knob>span:first-child{font:12px/20px Inter,Arial,sans-serif;margin:0}
 #harmonic-lab .sl-knob>output{font:10px/18px 'JetBrains Mono',monospace;min-height:18px;white-space:nowrap}
 #harmonic-lab .sl-octave{justify-content:space-between;gap:10px;margin:10px 0 0;padding:8px 0 0}
 #harmonic-lab .sl-octave>span{font-size:11px}
 #harmonic-lab .sl-octave>div{gap:4px}
 #harmonic-lab .sl-octave button{font-size:12px;min-width:40px;min-height:36px;padding:5px}
 #harmonic-lab .mini-keyboard-wrap{grid-column:1;grid-row:5;padding:0}
 #harmonic-lab .keyboard-caption{display:none}
 #harmonic-lab .mini-keyboard{height:85px;margin:0}
 #harmonic-lab .piano-key span{display:none}
 #harmonic-lab .piano-key small{font-size:9px}
 #harmonic-lab .sl-editor{grid-column:1;grid-row:6;border-top:1px solid #a191b54d}
 #harmonic-lab .sl-editor>summary{display:flex;align-items:center;justify-content:space-between;gap:15px;min-height:50px;padding:8px 0 0;cursor:pointer;list-style:none;color:#d7c1eb;font:15px/1.6 Inter,Arial,sans-serif}
 #harmonic-lab .sl-editor>summary::-webkit-details-marker{display:none}
 #harmonic-lab .sl-editor>summary>span{display:flex;align-items:baseline;flex-wrap:wrap;gap:5px 10px}
 #harmonic-lab .sl-editor>summary small{font-size:11px;color:#a9a1b9}
 #harmonic-lab .sl-editor>summary>svg{width:22px;height:22px;flex-shrink:0;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
 #harmonic-lab .sl-editor[open]>summary>svg{transform:rotate(180deg)}
 #harmonic-lab .sl-editor-body{padding-top:15px}
 #harmonic-lab .sl-harmonic-field{gap:4px;padding:0}
 #harmonic-lab .sl-harmonic-cell{grid-template-rows:30px 100px 22px 40px}
 #harmonic-lab .sl-harmonic-cell input{top:30px;height:100px}
 #harmonic-lab .sl-slot-caption{padding:0 0 4px}
 #harmonic-lab .sl-slot-caption>span{display:none}
 #harmonic-lab .sl-slot-caption select{appearance:none;-webkit-appearance:none;width:100%;height:26px;font:11px/20px Inter,Arial,sans-serif;padding:2px 9px 2px 2px;background:#242e43 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='7' height='5' viewBox='0 0 7 5'%3E%3Cpath fill='none' stroke='%23c2b4d8' d='m1 1 2.5 2.5L6 1'/%3E%3C/svg%3E") right 2px center/7px 5px no-repeat}
 #harmonic-lab .sl-harmonic-cell>output{font-size:10px;line-height:22px}
 #harmonic-lab .sl-slot-motion{font-size:8px;line-height:1.3;min-height:40px;gap:1px}
 #harmonic-lab .sl-slot-motion b{font-size:9px}
 #harmonic-lab .sl-field-caption{display:block;margin:12px 0;font-size:10px;line-height:1.7}
 #harmonic-lab #motion-state{display:none}
 #harmonic-lab .sl-tuning{margin:0;padding:0;border:0}
 #harmonic-lab .sl-tuning>summary{display:none}
 #harmonic-lab .sl-bank-shapes{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:0}
 #harmonic-lab .sl-bank-shapes label{display:flex;flex-direction:column;align-items:stretch;gap:6px;text-align:left;font-size:11px}
 #harmonic-lab .sl-bank-shapes select{width:100%;min-height:38px;font-size:14px}
 #harmonic-lab .sl-player-footer{grid-column:1;grid-row:7;display:block;padding:0}
 #harmonic-lab .sl-player-footer #wave-description{font:11px/1.7 Inter,Arial,sans-serif!important;color:#bcb0cb!important}
 #harmonic-lab .sl-player-footer #player-help{display:none}
 .study-disclaimer{font-size:13px;line-height:1.8;margin-top:16px}
}
@media(max-width:360px){
 #harmonic-lab .sl-player{padding:12px;gap:10px}
 #harmonic-lab .sl-stacked-logo{max-width:118px}
 #harmonic-lab .sl-identity .listen-button{font-size:12px;padding-inline:9px}
 #harmonic-lab .wave-presets>button{font-size:10px}
 #harmonic-lab .sl-slot-caption select{font-size:10px;letter-spacing:-.04em;padding-left:1px;padding-right:8px;background-position:right 1px center}
 #harmonic-lab .sl-knob>span:first-child{font-size:11px}
 #harmonic-lab .sl-knob>output{font-size:9px}
}
@media(forced-colors:active){#harmonic-lab .listen-button{background:ButtonFace;color:ButtonText;border:1px solid ButtonText}.sl-preset-strip button[aria-pressed=true]{border-color:Highlight}}

/* The instrument is a touch surface, not selectable page copy. */
#harmonic-lab .sound-instrument,#harmonic-lab .sound-instrument *{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
#harmonic-lab .mini-keyboard,#harmonic-lab .piano-key{touch-action:none;-webkit-user-drag:none}
#harmonic-lab .sound-instrument button:not(.piano-key),#harmonic-lab .sound-instrument select{touch-action:manipulation}
