/* Camera, text, controls. No decorative surfaces. */
html,body{height:100%;overflow:hidden}main{padding:0;max-width:none}.stage{position:fixed;inset:0;background:#101214;z-index:0}.stage video,.stage canvas{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.stage video{transform:scaleX(-1)}.stage canvas{pointer-events:none}.topbar,.intro,.transport,.metrics,.stage-top,.stage-bottom{position:fixed;z-index:4}.topbar{top:16px;left:20px;right:20px;display:flex;align-items:center;justify-content:space-between;gap:10px}.brand{text-decoration:none;color:#ddd;background:#101214d9;padding:3px 6px}.brand-icon,.brand small,.orbit-graphic,.stage-intro h2,.mode-badge,.tiny,.dock-label,.engine-status small{display:none}.floating-tools{display:flex;gap:6px}.floating-tools button span{display:none}.intro{left:26px;top:51px;font-size:10px;background:#101214d9;padding:0 4px}.engine-status i{display:inline-block;width:5px;height:5px;background:#777;margin-right:7px}.engine-status i.on{background:#b4d7e8}.transport{top:83px;left:20px;display:flex;align-items:center;gap:12px}.segmented,.transport-extra{display:flex;gap:4px}.transport button{font-size:10px}.stage-top{top:57px;right:24px;background:#101214d9;font-size:9px;padding:0 4px}.stage-bottom{bottom:8px;left:20px;right:20px;display:flex;justify-content:space-between;align-items:center;font-size:9px}.stage-bottom>span{background:#101214d9;padding:0 4px}.icon-button{padding:0 6px}.stage-intro{position:absolute;inset:130px 20px 230px;display:grid;place-content:center;text-align:center}.stage-intro p{color:#949da6;font-size:11px}.performance-dock{position:fixed;z-index:10;bottom:max(38px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);width:min(560px,calc(100% - 24px));background:#101214e8;border:1px solid #495057;padding:9px}.play-row{display:flex;align-items:center;gap:6px;margin-top:0}.primary{flex:1;color:#b4d7e8}.play-row>div{width:110px;margin-left:8px}.play-row label{display:flex;justify-content:space-between;font-size:9px}.play-row input{margin:0;height:14px}.metrics{bottom:max(111px,calc(env(safe-area-inset-bottom) + 73px));left:50%;transform:translateX(-50%);width:min(560px,calc(100% - 24px));display:grid;grid-template-columns:repeat(4,1fr);gap:8px;padding:5px 8px;background:#101214d9;pointer-events:none}.metrics span{display:block;font-size:9px;color:#9ba4ad}.metrics strong{font-size:13px;font-weight:400}.metrics strong small{font-size:9px}.metrics>div>small,.meter,.finger-dots{display:none}.floating-drawer{position:fixed;z-index:30;top:121px;right:20px;bottom:215px;width:330px;max-height:calc(100dvh - 140px);overflow:auto;background:#101214f5;border:1px solid #495057;padding:16px;scrollbar-width:thin;margin:0}.drawer-close{position:absolute;right:8px;top:8px;padding:0 6px}.section-line{display:flex;justify-content:space-between;gap:8px;align-items:center}.floating-drawer>.section-line{padding-right:23px}.section-line h2,.section-line h3{margin:0}.mix-heading,.engine-selects,.tone-controls,.settings-grid,.manual-sliders{display:grid;grid-template-columns:1fr 1fr;gap:12px}.engine-mix{margin-top:18px}.mix-heading{margin-bottom:5px;font-size:10px}.blend-label{display:flex;justify-content:space-between;margin-top:12px;font-size:10px}.wave-row{display:flex;align-items:center;gap:8px;margin-top:10px}.wave-row select{width:65%}.engine-description,.tone-control small,.advanced p,.ratio-panel p{font-size:10px;color:#9ba4ad}.tone-controls,.advanced{border-top:1px solid #343a40;margin-top:14px;padding-top:14px}.tone-control label{display:flex;justify-content:space-between;font-size:11px}.tone-control small{display:block}.advanced summary{cursor:pointer}.settings-grid{margin-top:12px}.settings-grid label{font-size:10px}.settings-grid select{margin:6px 0}.ratio-panel.floating-drawer{bottom:auto}.ratio-panel>.section-line{display:block}.ratio-panel button{margin-top:10px}.ratio-bars{height:100px;display:flex;gap:8px;align-items:end;margin-top:14px}.ratio-column{flex:1;height:100%;display:flex;flex-direction:column;justify-content:end;align-items:center;gap:5px}.ratio-column i{display:block;width:100%;background:#869aa5}.ratio-column span{font-size:9px}.guide .section-line{display:block}.guide .section-line a,.download-links{font-size:10px}.guide article{margin-top:20px}.guide article>span{font-size:9px;color:#9ba4ad}.guide p{font-size:11px}.manual-panel{position:fixed;z-index:9;bottom:max(176px,calc(env(safe-area-inset-bottom) + 138px));left:50%;transform:translateX(-50%);width:min(480px,calc(100% - 24px));background:#101214ed;border:1px solid #495057;padding:12px}.manual-panel p{display:none}.manual-sliders label{font-size:10px}.finger-buttons{display:flex;gap:4px;margin-top:8px}.finger-buttons button{flex:1;font-size:10px;padding:4px 2px}.message{position:fixed;z-index:40;top:125px;left:50%;transform:translateX(-50%);width:min(500px,calc(100% - 24px));padding:12px;background:#15181b;border:1px solid #75828c;font-size:11px}.message.error{border-color:#c59183}.calibration-overlay{position:absolute;inset:0;display:grid;place-content:center;background:#101214bb;z-index:6;font-size:18px}
@media(max-width:600px){.topbar{left:12px;right:12px;top:12px}.brand{font-size:10px;padding:2px}.floating-tools{gap:4px}.floating-tools button{font-size:10px;padding:5px 7px}.intro{left:12px;top:49px}.stage-top{top:67px;right:12px}.transport{left:12px;top:87px;gap:8px}.transport button{font-size:9px;padding:5px 7px}.floating-drawer{right:12px;top:125px;width:min(330px,calc(100% - 24px));bottom:210px;padding:14px}.play-row>div{width:80px;margin-left:2px}.play-row button{font-size:11px}.metrics{gap:4px}.metrics span{font-size:8px}.metrics strong{font-size:11px}.stage-bottom{left:12px;right:12px;font-size:8px}.stage-intro{inset:140px 20px 245px}}
@media(max-height:580px) and (min-width:700px){.performance-dock{bottom:30px}.metrics{bottom:103px}.manual-panel{bottom:162px}.floating-drawer{top:120px;bottom:16px}.stage-bottom{bottom:0}}
#camera-device{width:190px;font-size:10px;padding:5px 7px}.transport-extra{align-items:center}@media(max-width:600px){.transport{flex-wrap:wrap;right:12px;gap:6px}.transport-extra{flex-wrap:wrap}#camera-device{width:160px;font-size:9px}.stage-top{max-width:55%;text-align:right;font-size:8px}}
#gesture-readout{position:fixed;top:119px;left:20px;background:#101214d9;padding:2px 5px;z-index:4;font-size:10px;color:#b4d7e8}#right-slots>div{display:flex;align-items:center;gap:6px;margin:8px 0}#right-slots select{flex:1;width:auto}#right-slots button{font-size:9px;padding:5px}.advanced>label{display:block;margin:12px 0;font-size:10px}.advanced output{float:right}.manual-v3{border-top:1px solid #343a40;margin-top:9px}.ratio-bars{overflow-x:auto}.ratio-column{min-width:28px}.manual-panel{max-height:calc(100dvh - 355px);overflow:auto}@media(max-width:600px){#gesture-readout{top:151px;left:12px}.message{top:175px}.floating-drawer{top:177px;max-height:calc(100dvh - 200px)}}