:root{
  color-scheme:dark;
  --bg:#02060b;--panel:#0b1118;--panel2:#111922;--panel3:#18222d;
  --line:#293746;--line2:#3d4e60;--text:#e8edf3;--muted:#8f9aa7;
  --blue:#2198ff;--blue2:#76c2ff;--green:#25e788;--yellow:#ffd629;--red:#ff455e;
  --strip:103px;--master:124px;
}
*{box-sizing:border-box}
html,body{margin:0;width:100%;height:100%;overflow:hidden;background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif}
button,input{font:inherit}button{color:inherit;cursor:pointer;touch-action:manipulation}[hidden]{display:none!important}
.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}

/* APPROVED LOGIN ARTBOARD — desktop is the exact supplied artwork, not a recreation. */
.login-view{position:fixed;inset:0;background:#01050b;overflow:auto}
.approved-login-art{position:absolute;left:0;top:0;width:100%;min-width:900px}
.approved-login-art img{display:block;width:100%;height:auto;user-select:none;pointer-events:none}
.login-hotspots{position:absolute;left:0;top:0;width:100%;aspect-ratio:3/2;min-width:900px;pointer-events:none}
.login-action,.login-field{position:absolute;border:0;background:transparent;border-radius:12px;pointer-events:auto}
.login-action:focus-visible,.login-field:focus-within{outline:2px solid #69bdff;outline-offset:2px;box-shadow:0 0 20px rgba(40,155,255,.45)}
.email-field{left:66.53%;top:22.72%;width:27.9%;height:5.92%}.password-field{left:66.53%;top:34.15%;width:27.9%;height:5.92%}
.sign-in-action{left:66.53%;top:43.6%;width:27.9%;height:5.85%}.demo-action{left:66.53%;top:56.63%;width:27.9%;height:5.85%}
.engineering-action{left:66.75%;top:71.45%;width:15.0%;height:6.2%}.admin-action{left:82.5%;top:71.45%;width:11.8%;height:6.2%}
.login-field input{position:absolute;inset:0;width:100%;height:100%;opacity:.01;border:0;background:transparent;color:transparent;caret-color:transparent}
.input-render{position:absolute;left:14.3%;right:3%;top:8%;bottom:8%;display:flex;align-items:center;background:#060b13;color:#c7d0da;font-size:clamp(11px,1.02vw,17px);white-space:nowrap;overflow:hidden;opacity:0}
.login-field.filled .input-render{opacity:1}.login-field:focus-within::after{content:"";position:absolute;inset:0;border:1px solid rgba(85,178,255,.9);border-radius:10px}
.compact-login{display:none}

/* APP SHELL */
.mixer-view{position:fixed;inset:0;display:grid;grid-template-rows:57px auto 103px 42px 1fr;background:linear-gradient(#0a1017,#03070b 42%,#000204);font-family:"Arial Narrow",Roboto,Arial,sans-serif;letter-spacing:.01em}
.app-header{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:0 12px;border-bottom:1px solid #2b3946;background:linear-gradient(#252b32,#0d1218 57%,#05080c);box-shadow:0 4px 12px rgba(0,0,0,.55);z-index:20}
.app-brand{display:flex;align-items:center;gap:8px}.app-brand img{width:34px;height:34px;object-fit:cover;border:1px solid #36495d}.app-brand strong{font-size:14px;letter-spacing:.16em;text-shadow:0 1px #000}
.show-title{text-align:center;line-height:1.1}.show-title b{display:block;font-size:15px}.show-title span{display:block;margin-top:4px;color:#8d99a8;font-size:8px;font-weight:800;letter-spacing:.13em}
.header-controls{justify-self:end;display:flex;gap:8px}.steel-button{border:1px solid #4a5967;border-radius:4px;padding:8px 12px;background:linear-gradient(#34404a,#10171e 65%,#080d12);box-shadow:inset 0 1px rgba(255,255,255,.12),0 2px 6px #000;font-size:10px;font-weight:900;letter-spacing:.08em}
.steel-button:hover{border-color:#78b9f1}

.demo-guide{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;min-height:55px;padding:9px 15px;border-bottom:1px solid #25425a;background:linear-gradient(90deg,rgba(12,72,119,.95),rgba(7,21,35,.96) 43%,rgba(6,12,19,.98));box-shadow:inset 0 0 24px rgba(20,135,229,.12);transition:.22s ease;overflow:hidden;z-index:15}
.demo-guide-icon{display:grid;place-items:center;width:34px;height:34px;border:1px solid #2aa6ff;border-radius:6px;background:#071828;color:#47b6ff;box-shadow:0 0 13px rgba(26,155,255,.26)}
.demo-guide b{display:block;font-size:12px;letter-spacing:.08em}.demo-guide span{display:block;color:#a9bdcf;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-size:11px;margin-top:3px}
.demo-guide-actions{display:flex;gap:7px}.demo-guide-actions button{border:1px solid #3a6789;border-radius:4px;padding:7px 10px;background:#0b1b29;font-size:9px;font-weight:900;letter-spacing:.07em}
.demo-guide.minimized{min-height:0;height:0;padding-top:0;padding-bottom:0;border:0;opacity:0}

.console-spill-shell{display:grid;grid-template-columns:27px 1fr;border-bottom:1px solid #34424e;background:linear-gradient(#1d252d,#0d1217 63%,#05080c);overflow:hidden;z-index:12}
.vertical-label{writing-mode:vertical-rl;transform:rotate(180deg);display:grid;place-items:center;border-right:1px solid #3c4954;color:#8895a2;font-size:8px;font-weight:900;letter-spacing:.2em}
.console-spill{display:flex;align-items:center;gap:7px;padding:10px 8px;overflow-x:auto;scrollbar-width:thin;scrollbar-color:#314354 #0a0f14}
.console-card{position:relative;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:8px;min-width:154px;height:48px;padding:5px 8px;border:1px solid #465462;border-radius:6px;background:linear-gradient(#34404c,#111820 58%,#080c11);box-shadow:inset 0 1px rgba(255,255,255,.1),0 2px 7px #000;text-align:left}
.console-card.selected{border-color:#358cff;box-shadow:inset 0 0 13px rgba(30,131,255,.32),0 0 9px rgba(42,145,255,.23)}
.console-card.superconsole-card{min-width:182px;background:linear-gradient(#336aa8,#153451 60%,#0a1520)}
.console-card.ql5{border-color:#426a8a}.console-card.x32{border-color:#8a6638}.console-card.dm7{border-color:#685194}
.status-dot{width:10px;height:10px;border-radius:50%;background:var(--green);box-shadow:0 0 8px var(--green)}
.console-card span:nth-child(2){min-width:0}.console-card b{display:block;font-size:11px;white-space:nowrap}.console-card small{display:block;margin-top:2px;color:#b0bac4;font-size:8px;white-space:nowrap}.console-card em{display:grid;place-items:center;min-width:24px;height:25px;border:1px solid #3d4d5c;border-radius:9px;background:#071018;font-size:9px;font-style:normal}
.add-console{grid-template-columns:1fr;min-width:95px;text-align:center}.add-console b{font-size:20px}.add-console small{font-size:7px}
.feed-divider{display:grid;grid-template-columns:1fr;grid-template-rows:1fr auto auto 1fr;place-items:center;min-width:54px;height:62px;color:#62717f}.feed-divider span{width:1px;height:100%;background:#354451}.feed-divider b{font-size:7px;letter-spacing:.13em}.feed-divider i{font-size:15px;font-style:normal;color:#798a99}

.bank-toolbar{position:relative;display:flex;align-items:center;gap:7px;padding:4px 7px;border-bottom:1px solid #35424e;background:linear-gradient(#222a32,#0b1015 62%,#06090c);box-shadow:0 3px 9px rgba(0,0,0,.5);z-index:30}
.bank-nav{display:flex;align-items:center;gap:4px}.square-button,.bank-range,.layer-tabs button,.channel-count-button,.tool-button,.demo-guide-pill{height:31px;border:1px solid #495865;border-radius:4px;background:linear-gradient(#303b45,#111820 63%,#080d12);box-shadow:inset 0 1px rgba(255,255,255,.1);font-weight:900;font-size:9px}
.square-button{width:29px;font-size:18px}.bank-range{display:flex;align-items:center;gap:5px;padding:0 9px}.bank-range small,.channel-count-button small{font-size:6px;color:#96a2ae}.bank-range b{font-size:10px}
.layer-tabs{display:flex;gap:3px}.layer-tabs button{min-width:58px;padding:0 11px;letter-spacing:.08em}.layer-tabs button.active{border-color:#3b9cff;background:linear-gradient(#2f7ab3,#123b5d 64%,#091a29);box-shadow:inset 0 0 10px rgba(55,164,255,.28)}
.channel-count-button{display:flex;align-items:center;gap:5px;padding:0 8px}.channel-count-button b{font-size:11px}.channel-count-button i{font-style:normal;color:#8d9aa6}
.selected-channel{display:flex;align-items:center;gap:7px;height:31px;min-width:265px;max-width:410px;margin-left:auto;margin-right:auto;padding:3px 7px;border:1px solid #364b5f;border-radius:4px;background:#071019;box-shadow:inset 0 0 9px #000}.selected-channel>i{width:4px;height:22px;background:#39a8ff;box-shadow:0 0 7px #39a8ff}.selected-channel span{min-width:0}.selected-channel b{display:block;font-size:10px;white-space:nowrap}.selected-channel small{display:block;color:#8291a0;font-size:7px;white-space:nowrap}.selected-channel em{margin-left:auto;width:10px;height:10px;border-radius:50%;background:var(--green);box-shadow:0 0 8px var(--green)}
.demo-guide-pill{display:flex;align-items:center;gap:5px;padding:0 8px;border-color:#2d7358;color:#d9fff0}.demo-guide-pill b{font-size:8px}.demo-guide-pill small{font-size:6px;color:#95d3b7}.demo-guide-pill i{font-style:normal}
.tool-button{padding:0 13px;letter-spacing:.08em}.tool-button.active{border-color:#349bf2;background:#173c5d}

.floating-menu{position:fixed;z-index:100;min-width:230px;padding:10px;border:1px solid #486176;border-radius:7px;background:rgba(8,14,20,.98);box-shadow:0 18px 50px #000}
.floating-menu>b{display:block;margin:2px 4px 9px;color:#90a5b8;font-size:8px;letter-spacing:.12em}.count-menu{top:245px;left:340px}.count-menu>div{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.count-menu button,.source-menu button{border:1px solid #354858;border-radius:4px;background:#111a22;padding:9px;font-size:10px;font-weight:800}.count-menu button.active,.source-menu button.active{border-color:#359cff;background:#173a57}.source-menu{top:245px;right:80px}.source-menu button{display:block;width:100%;text-align:left;margin-top:5px}

.mixer-workspace{min-height:0;display:grid;grid-template-columns:minmax(0,1fr) var(--master);overflow:hidden;background:#03070a}
.channel-viewport{min-width:0;overflow-x:auto;overflow-y:hidden;border-right:1px solid #4a5661;scrollbar-width:thin;scrollbar-color:#3c4b59 #0a0e12}
.channel-deck{display:flex;align-items:stretch;min-width:max-content;height:100%;padding:4px 0 5px 3px;background:linear-gradient(90deg,#080d11,#020507)}
.channel-strip{--accent:#7b8a98;position:relative;display:grid;grid-template-rows:65px 26px 48px 48px 48px 48px 1fr 28px 31px 38px;width:var(--strip);min-width:var(--strip);height:100%;margin-right:2px;border:1px solid #45515d;border-radius:3px;background:#111820;box-shadow:inset 0 0 0 1px #070a0e,2px 0 5px rgba(0,0,0,.5);overflow:hidden}
.channel-strip.selected{border-color:#65b6ff;box-shadow:inset 0 0 0 1px #0b2235,0 0 8px rgba(46,153,255,.35)}
.strip-header{position:relative;padding:6px 5px 3px;text-align:center;background:linear-gradient(color-mix(in srgb,var(--accent) 67%,#31343a),color-mix(in srgb,var(--accent) 33%,#10151b));border-bottom:1px solid #5c6570;text-shadow:0 1px 2px #000}.strip-header small{display:block;font-size:6px;color:#d4d7db;letter-spacing:.12em}.strip-header b{display:block;margin-top:5px;font-size:10px;line-height:1.05;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.strip-header span{display:block;margin-top:4px;color:#d5d9df;font-size:7px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.strip-header i{position:absolute;left:5px;bottom:4px;width:4px;height:12px;background:var(--accent);box-shadow:0 0 5px var(--accent)}
.source-row{display:flex;align-items:center;justify-content:center;gap:5px;border-bottom:1px solid #33404b;background:#0a1016;color:#a8b3be;font-size:7px;font-weight:800}.source-row span{color:#e5ecf2}.source-row i{font-style:normal;color:#6f8292}
.phat-section{position:relative;padding:4px 5px;border-bottom:1px solid #303b45;background:linear-gradient(#202a33,#10171e 58%,#0b1015)}.phat-section>header{display:flex;align-items:center;justify-content:space-between;color:#9ab5cc;font-size:6px;font-weight:900;letter-spacing:.08em}.phat-section>header i{font-style:normal;color:#697985}.phat-value{display:flex;align-items:center;gap:5px;height:28px}.mini-graph{width:29px;height:22px;border:1px solid #324251;background:#05090d;position:relative;overflow:hidden}.mini-graph::before{content:"";position:absolute;inset:0;background:linear-gradient(transparent 48%,#1a2a37 50%,transparent 52%),linear-gradient(90deg,transparent 48%,#172734 50%,transparent 52%)}.mini-graph::after{content:"";position:absolute;left:2px;right:2px;top:12px;height:1px;background:var(--accent);transform:skewY(-14deg);box-shadow:7px -3px var(--accent),14px -1px var(--accent)}.phat-value b{margin-left:auto;font-size:8px}.phat-value small{font-size:6px;color:#7f8e9c}
.fader-section{position:relative;min-height:160px;border-bottom:1px solid #37434e;background:linear-gradient(90deg,#0c1217,#141b21 36%,#171e25 72%,#0c1116)}.meter-rail{position:absolute;left:5px;top:12px;bottom:12px;width:13px;border:1px solid #283642;background:#030608;overflow:hidden}.meter-rail i{position:absolute;left:1px;right:1px;bottom:1px;height:1%;background:linear-gradient(to top,#16c95e 0 74%,#e5e220 74% 89%,#ff4558 89%);transition:height .08s linear}.meter-rail::after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(to top,transparent 0 8px,rgba(0,0,0,.38) 8px 10px)}
.fader-track{position:absolute;left:34px;right:11px;top:11px;bottom:11px;border:1px solid #3b4a58;border-radius:11px;background:linear-gradient(90deg,#11181e,#28343e 48%,#0a0f13 51%,#1e2831);box-shadow:inset 0 0 8px #000}.fader-track::before{content:"";position:absolute;left:50%;top:0;bottom:0;width:3px;transform:translateX(-50%);background:#020304;box-shadow:1px 0 #55616b}.fader-track::after{content:"";position:absolute;inset:5px;background:repeating-linear-gradient(to bottom,transparent 0 17px,rgba(158,174,187,.22) 18px 19px)}
.fader-cap{position:absolute;z-index:3;left:37px;width:52px;height:25px;bottom:54%;transform:translateY(50%);border:1px solid #5db8ff;border-radius:4px;background:linear-gradient(#4bb7ff,#1678c3 42%,#06467d 51%,#219cf3 61%,#0c65ac);box-shadow:inset 0 1px #b9e4ff,0 2px 5px #000}.fader-cap::after{content:"";position:absolute;left:5px;right:5px;top:50%;height:2px;background:#d7efff;box-shadow:0 0 3px #fff;transform:translateY(-50%)}
.db-readout{display:grid;place-items:center;border-bottom:1px solid #36424d;background:#05090c;font-size:8px;font-weight:900}
.button-row{display:grid;grid-template-columns:1fr 1fr;gap:3px;padding:3px;background:#10161c}.button-row button{border:1px solid #4b5864;border-radius:3px;background:linear-gradient(#39444e,#141b21);font-size:7px;font-weight:900}.button-row .on.active{border-color:#20cc71;background:linear-gradient(#1b7a4a,#0c3b25);box-shadow:inset 0 0 7px rgba(41,240,137,.35);color:#eafff3}.button-row .mute.active{border-color:#d84752;background:linear-gradient(#8e2a35,#48151b);color:#fff}.select-button{margin:3px;border:1px solid #4a5864;border-radius:3px;background:linear-gradient(#3a4650,#141b21);font-size:7px;font-weight:900}.select-button.active{border-color:#42a7ff;background:#1b4c75}
.strip-footer{display:grid;place-items:center;padding:3px;background:#080d11;border-top:1px solid #2f3b46;text-align:center}.strip-footer b{font-size:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:94px}.strip-footer small{font-size:6px;color:#8d9aa7;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:94px}
.channel-strip.phat-hidden{grid-template-rows:65px 26px 1fr 28px 31px 38px}.channel-strip.phat-hidden .phat-section{display:none}

.master-strip{display:grid;grid-template-rows:79px 26px 28px 200px 28px 1fr 27px 29px 31px;background:linear-gradient(90deg,#141b22,#0b1015);border-left:1px solid #0b0d10;overflow:hidden}.master-strip>header{display:grid;place-items:center;align-content:center;background:linear-gradient(#5f454c,#261b20 55%,#151014);border-bottom:1px solid #6d6064;text-align:center}.master-strip>header small{font-size:6px;letter-spacing:.12em}.master-strip>header b{font-size:11px;margin-top:3px}.master-strip>header span{font-size:6px;color:#d7c6cb;margin-top:3px}.master-source{display:flex;align-items:center;gap:5px;padding:0 7px;border-bottom:1px solid #3b454f;background:#11171c;font-size:6px}.master-source i{width:4px;height:12px;background:#ff5b80}.master-source span{margin-left:auto}.section-title{display:flex;align-items:center;justify-content:space-between;padding:0 6px;border-bottom:1px solid #36414b;background:#1b232a;font-size:7px}.section-title i{font-style:normal;color:#73808b}.master-meter-area{display:flex;justify-content:center;gap:10px;padding:8px;background:#080c10}.master-meter-column{text-align:center;font-size:8px}.master-meter{position:relative;width:17px;height:174px;margin-top:5px;border:1px solid #2d3740;background:#020404;overflow:hidden}.master-meter i{position:absolute;left:2px;right:2px;bottom:2px;height:1%;background:linear-gradient(to top,#00cc5e 0 70%,#dce727 70% 87%,#ff445a 87%);transition:height .1s linear}.master-meter em{position:absolute;inset:0;background:repeating-linear-gradient(to top,transparent 0 8px,rgba(0,0,0,.42) 8px 10px)}
.master-fader-area{position:relative;margin:7px 14px;border:1px solid #34424e;border-radius:14px;background:linear-gradient(90deg,#151d24,#2c3943 48%,#080c0f 51%,#1a2229);min-height:160px}.master-fader-track{position:absolute;left:50%;top:7px;bottom:7px;width:3px;transform:translateX(-50%);background:#030405;box-shadow:1px 0 #5c6871}.master-fader-cap{position:absolute;left:9px;right:9px;height:28px;bottom:56%;transform:translateY(50%);border:1px solid #6ac2ff;border-radius:5px;background:linear-gradient(#53c2ff,#147ec9 43%,#06487c 52%,#249ff0 64%,#0c64aa);box-shadow:inset 0 1px #d4f0ff,0 2px 5px #000}.master-fader-cap::after{content:"";position:absolute;left:6px;right:6px;top:50%;height:2px;background:#e6f7ff;transform:translateY(-50%)}
.master-strip output{display:grid;place-items:center;margin:3px 8px;border:1px solid #384550;background:#04080b;font-size:8px;font-weight:900}.master-on,.master-st{margin:2px 7px;border:1px solid #58646f;border-radius:3px;background:linear-gradient(#3b4751,#151b20);font-size:8px;font-weight:900}.master-on.active{border-color:#2bd075;background:#14452d}.master-st{border-color:#c75572;background:linear-gradient(#98435b,#4c1d2a)}
.toast{position:fixed;z-index:500;left:50%;bottom:22px;transform:translate(-50%,14px);padding:11px 15px;border:1px solid #416b8e;border-radius:6px;background:rgba(7,13,19,.97);box-shadow:0 15px 42px #000;opacity:0;pointer-events:none;transition:.18s;color:#dceaf5;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-size:12px}.toast.show{opacity:1;transform:translate(-50%,0)}

@media(max-width:900px), (max-aspect-ratio:1.05/1){
  html,body{overflow:auto}.login-view{position:relative;min-height:100dvh;padding:22px;background:radial-gradient(circle at 20% 0,rgba(31,111,185,.22),transparent 32%),#02060c}.approved-login-art,.login-hotspots{display:none}.compact-login{display:block;max-width:600px;margin:auto}.compact-logo{width:74px;height:74px;object-fit:cover;float:left;margin-right:13px}.compact-wordmark{padding-top:13px}.compact-wordmark h1{font-size:24px;margin:0;letter-spacing:.08em}.compact-wordmark p{font-size:8px;color:#4fb1ff;letter-spacing:.26em}.compact-login h2{clear:both;padding-top:28px;font-family:Impact,"Arial Narrow",sans-serif;font-size:36px;line-height:1.02}.compact-login h2 strong{color:#188aff}.compact-copy{color:#b6c0cb;line-height:1.55}.compact-copy b{color:#28a5ff}.compact-card{margin-top:25px;padding:22px;border:1px solid #2e8ae0;border-radius:17px;background:rgba(3,10,18,.86)}.compact-card h3{text-align:center;color:#49a8ff}.compact-card>p{text-align:center}.compact-card label{display:block;margin-top:16px;color:#aab4c0;font-size:11px;font-weight:700}.compact-card input{display:block;width:100%;margin-top:8px;padding:14px;border:1px solid #344352;border-radius:9px;background:#040810;color:white}.primary-button,.demo-button{width:100%;margin-top:19px;padding:14px;border-radius:9px;font-weight:900}.primary-button{border:1px solid #439fff;background:linear-gradient(#2497ff,#0751aa)}.demo-button{border:1px solid #21ce74;background:#04140d;color:#45ef8d}.or{display:flex;align-items:center;gap:12px;margin-top:18px;color:#788491;font-size:10px}.or i{height:1px;flex:1;background:#34414c}.compact-card small{display:block;margin-top:12px;text-align:center;color:#9aa5af;line-height:1.5}
  .mixer-view{position:fixed;grid-template-rows:53px auto 89px 42px 1fr;--strip:94px;--master:112px}.show-title{display:none}.app-header{grid-template-columns:1fr auto}.app-brand strong{font-size:12px}.console-card{min-width:145px}.feed-divider{min-width:44px}.channel-count-button{display:none}.selected-channel{display:none}.bank-toolbar{gap:4px}.layer-tabs button{min-width:44px;padding:0 6px}.tool-button{padding:0 8px}.demo-guide span{font-size:9px}.demo-guide-actions #resetDemo{display:none}.channel-strip{grid-template-rows:59px 24px 43px 43px 43px 43px 1fr 27px 30px 35px}.fader-cap{left:33px;width:48px}.mixer-workspace{grid-template-columns:minmax(0,1fr) var(--master)}
}