:root{
  --bg:#06090b;
  --panel:#0c1114;
  --panel2:#11181c;
  --line:#263036;
  --line-soft:#1b2429;
  --text:#f2f5f6;
  --muted:#8e9aa0;
  --orange:#ff981f;
  --orange2:#c86611;
  --orange3:#7f4d1e;
  --green:#55dc7a;
  --green2:#1f7b42;
  --red:#ff4b49;
  --red2:#8b2927;
  --blue:#59a8ff;
  --violet:#8e6cff;
  --steel:#a8afb1;
  --radius:18px;
  --shadow:0 24px 80px rgba(0,0,0,.45);
}
*{box-sizing:border-box}
html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#020405;color:var(--text);font-family:"Avenir Next","SF Pro Display",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
button,input{font:inherit}
button{color:inherit}
.shell{position:relative;width:100vw;height:100vh;min-width:1080px;min-height:690px;background:radial-gradient(circle at 50% 0%,#131b20 0,#080c0f 38%,#050709 100%);display:grid;grid-template-rows:84px 1fr 34px;overflow:hidden}
.topbar{display:grid;grid-template-columns:auto auto 1fr auto;column-gap:18px;align-items:center;padding:0 32px;border-bottom:1px solid #172026;background:rgba(4,8,10,.91);backdrop-filter:blur(18px);z-index:5}
.brand{display:flex;gap:14px;align-items:center;background:none;border:0;justify-self:start;cursor:pointer;letter-spacing:.24em;font-size:19px}
.brand img{width:42px;height:42px;object-fit:contain}

/* CORE NAVIGATION: compact version of the signed-off feature card language */
.core-back{position:relative;justify-self:start;display:flex;align-items:center;gap:9px;min-width:108px;padding:7px 12px 7px 8px;border:1px solid #303a40;border-radius:12px;background:linear-gradient(145deg,#141a1d,#0a0e10);box-shadow:inset 0 1px 0 rgba(255,255,255,.035),0 8px 24px rgba(0,0,0,.2);cursor:pointer;overflow:hidden;transition:.18s ease}
.core-back:after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:linear-gradient(90deg,transparent,var(--orange),transparent);opacity:.7}
.core-back:hover,.core-back:focus-visible{border-color:#765128;background:linear-gradient(145deg,#191812,#0b0f11);outline:none;transform:translateY(-1px)}
.core-back:active{transform:translateY(0)}
.core-arrow{width:30px;height:30px;display:grid;place-items:center;border-radius:9px;border:1px solid #5c452a;background:linear-gradient(145deg,#251b10,#100e0b);color:#ffc26f;font-size:24px;line-height:1}
.core-copy{display:flex;flex-direction:column;align-items:flex-start;line-height:1.05}
.core-copy b{font-size:11px;letter-spacing:.14em;font-weight:720}
.core-copy small{font-size:8px;color:#79858b;margin-top:4px;letter-spacing:.04em}

.top-status{display:flex;align-items:center;justify-content:center;gap:11px;font-size:14px;color:#cbd2d5}
.status-dot,.mini-led,.button-led{display:inline-block;border-radius:50%}
.status-dot{width:9px;height:9px}
.status-ready,.mini-led.live,.button-led.live{background:var(--green);box-shadow:0 0 14px rgba(85,220,122,.72)}
.status-warn,.mini-led.warn,.button-led.warn{background:var(--orange);box-shadow:0 0 14px rgba(255,152,31,.68)}
.status-danger,.mini-led.danger,.button-led.danger{background:var(--red);box-shadow:0 0 14px rgba(255,75,73,.7)}
.mini-led.standby,.button-led.standby{background:#657077;box-shadow:none}
.divider{width:1px;height:18px;background:#394349;margin:0 8px}
.stream-glyph{color:var(--green);letter-spacing:-3px;transform:scaleY(.7)}

.instrument-button{position:relative;border:1px solid #303a40;background:linear-gradient(145deg,#161d21,#0c1013);border-radius:12px;padding:11px 16px;cursor:pointer;font-size:12px;display:inline-flex;align-items:center;justify-content:center;gap:9px;box-shadow:inset 0 1px 0 rgba(255,255,255,.035),0 8px 20px rgba(0,0,0,.18);transition:.17s ease;white-space:nowrap}
.instrument-button:hover{border-color:#5b4a37;background:linear-gradient(145deg,#1b2022,#0e1214);transform:translateY(-1px)}
.instrument-button:active{transform:translateY(0)}
.instrument-button.active,.instrument-button.primary{border-color:#855820;background:linear-gradient(145deg,#261b0f,#11100d);box-shadow:inset 0 0 0 1px rgba(255,152,31,.08),0 0 18px rgba(255,152,31,.08)}
.instrument-button.primary{color:#f5d5a9}
.instrument-button.success-action{border-color:#246c3d;background:linear-gradient(145deg,#102417,#0b130e);color:#bdf1cc}
.instrument-button.danger-action{border-color:#81302f;background:linear-gradient(145deg,#2a1111,#110b0c);color:#ffc1c0}
.instrument-button.danger-action:hover{border-color:#b13f3d;box-shadow:0 0 20px rgba(255,75,73,.10)}
.button-mark{font-size:9px;font-weight:800;letter-spacing:.08em;color:#d39a52}
.button-led{width:8px;height:8px}
.engine-pill{justify-self:end;border-radius:999px;padding:10px 18px}

.view{display:none;min-height:0}.view.active{display:block}
.home-view{padding:7.5vh 7vw 5vh;overflow:auto}
.home-intro{max-width:880px;margin-bottom:4.8vh}
.eyebrow{font-size:11px;letter-spacing:.22em;color:var(--orange);font-weight:700}
.home-intro h1{font-size:clamp(38px,4vw,68px);line-height:1.02;margin:16px 0 20px;letter-spacing:-.04em;font-weight:570}
.home-intro p{color:#9eaaaf;max-width:690px;font-size:17px;line-height:1.55}
.feature-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;max-width:1400px}
.feature-card{position:relative;text-align:left;min-height:178px;height:178px;padding:26px 24px;border:1px solid #283138;border-radius:18px;background:linear-gradient(145deg,#11171b,#0a0e11);cursor:pointer;transition:.2s ease;overflow:hidden;box-shadow:inset 0 1px 0 rgba(255,255,255,.03)}
.feature-card:before{content:"";position:absolute;inset:auto 0 0;height:2px;background:linear-gradient(90deg,transparent,var(--orange),transparent);opacity:0;transition:.2s}
.feature-card:hover{transform:translateY(-3px);border-color:#725025;box-shadow:0 18px 55px rgba(0,0,0,.35)}
.feature-card:hover:before{opacity:1}
.feature-card strong{display:block;font-size:22px;margin-top:40px;font-weight:570}
.feature-card>span:last-child{display:block;color:#737f84;font-size:12px;line-height:1.35;margin-top:8px;font-weight:400}
.feature-card[data-feature="hd-film"]>span:last-child{color:#737f84;font-size:12px;line-height:1.35;letter-spacing:0;font-weight:400}
.feature-index{position:absolute;top:22px;right:22px;font-size:11px;color:#59646a;letter-spacing:.15em}


/* KINEPLEX is a playback surface, deliberately separate from encoding. */
.kineplex-view.active{display:grid;grid-template-rows:66px minmax(0,1fr) auto;gap:12px;padding:14px 24px 12px;min-height:0;background:#020303}
.kineplex-header{display:flex;align-items:center;justify-content:space-between;gap:24px;border-bottom:1px solid #20282c;padding:0 4px 10px}
.kineplex-header h2{margin:0;color:#ff9b2c;font-size:24px;font-weight:560;letter-spacing:.02em}
.kineplex-logo{width:clamp(190px,20vw,330px);height:54px;object-fit:contain;object-position:right center}
.kineplex-screen-bay{min-width:0;min-height:0;display:grid;place-items:center;overflow:hidden;background:#020303}
.kineplex-stage{position:relative;min-width:0;min-height:0;overflow:hidden;background:#000;box-shadow:inset 0 0 0 1px #1d2427,0 24px 70px rgba(0,0,0,.5)}
.kineplex-stage video{width:100%;height:100%;object-fit:contain;background:#000;transition:filter .18s ease}
.kineplex-stage:fullscreen{width:100vw!important;height:100vh!important;aspect-ratio:auto!important;background:#000}
.kineplex-stage:fullscreen video{object-fit:contain!important}
.kineplex-empty{position:absolute;inset:0;display:grid;place-content:center;justify-items:center;gap:9px;text-align:center;color:#778388;background:radial-gradient(circle at center,#111617 0,#030405 58%,#000 100%)}
.kineplex-empty b{font-size:18px;font-weight:520;color:#dce1e3}.kineplex-empty small{font-size:11px}.kineplex-aperture{display:grid;place-items:center;width:52px;height:52px;margin-bottom:7px;border:1px solid #5c4328;color:#e0a057;font-size:25px;font-weight:700;box-shadow:inset 0 0 20px #bc702112,0 0 22px #d5822310}
.kineplex-player-controls{position:absolute;z-index:4;left:14px;right:14px;bottom:12px;display:grid;grid-template-columns:34px 38px 34px auto minmax(120px,1fr) auto;align-items:center;gap:8px;padding:8px 10px;border:1px solid #343a3d;background:rgba(5,7,8,.9);box-shadow:0 12px 30px #0009;opacity:0;pointer-events:none;transform:translateY(8px);transition:opacity .28s ease,transform .28s ease}.kineplex-player-controls.controls-visible,.kineplex-player-controls:focus-within,.kineplex-player-controls.paused{opacity:1;pointer-events:auto;transform:none}.kineplex-player-controls button{height:30px;border:0;background:transparent;color:#bdc5c8;cursor:pointer;font-size:10px}.kineplex-player-controls button:hover:not(:disabled){color:#ffb45d}.kineplex-player-controls button:disabled{opacity:.3;cursor:default}.kineplex-play-button{border:1px solid #765027!important;background:#0b0e0f!important;color:#ffd097!important;font-size:13px!important;box-shadow:inset 0 0 9px #df822014}.kineplex-player-controls time{font:10px ui-monospace,SFMono-Regular,Menlo,monospace;color:#d5dbdd}.kineplex-player-controls input{appearance:none;-webkit-appearance:none;width:100%;height:16px;background:transparent;cursor:pointer}.kineplex-player-controls input::-webkit-slider-runnable-track{height:3px;background:linear-gradient(90deg,#f08e28 0 var(--progress,0%),#3b4346 var(--progress,0%) 100%)}.kineplex-player-controls input::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:9px;height:9px;margin-top:-3px;border:1px solid #f3b56e;border-radius:50%;background:#e98527}.kineplex-player-controls input::-moz-range-track{height:3px;background:#3b4346}.kineplex-player-controls input::-moz-range-progress{height:3px;background:#f08e28}.kineplex-player-controls input::-moz-range-thumb{width:8px;height:8px;border:1px solid #f3b56e;border-radius:50%;background:#e98527}
.kineplex-console{display:grid;grid-template-columns:auto minmax(250px,.65fr) auto auto minmax(520px,1.35fr) minmax(130px,auto) 38px;align-items:center;gap:10px;min-height:72px;padding:9px 11px;border-top:1px solid #2c3335;border-bottom:1px solid #151a1c;background:linear-gradient(180deg,#111516,#07090a);box-shadow:inset 0 1px 0 rgba(255,255,255,.025)}
.kineplex-command,.kineplex-stream button,.kineplex-mute,.kineplex-icon-button{height:34px;border:1px solid #343c3f;background:#090c0d;color:#c6ccce;cursor:pointer;border-radius:5px;padding:0 11px;font-size:10px}
.kineplex-command{display:flex;align-items:center}.kineplex-command:hover,.kineplex-stream button:hover,.kineplex-mute:hover,.kineplex-icon-button:hover{border-color:#805424;color:#f2c486}
.kineplex-stream{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:5px}.kineplex-stream input{height:34px;min-width:0;border:1px solid #2d3639;border-radius:5px;background:#050708;color:#dce1e3;padding:0 10px;font-size:10px}.kineplex-stream input:focus{outline:1px solid #8b5c28;border-color:#8b5c28}
.kineplex-sound{display:grid;grid-template-columns:7px auto;gap:1px 7px;align-items:center;min-width:190px}.kineplex-sound .sound-led{grid-row:1/3;width:6px;height:6px;border-radius:50%;background:#54d978;box-shadow:0 0 10px #54d97899}.kineplex-sound b{font-size:10px;font-weight:600}.kineplex-sound small{font-size:8px;color:#778388;white-space:nowrap}
.kineplex-display{display:grid;gap:3px;color:#7e898e;font-size:8px}.kineplex-display select{height:34px;min-width:145px;border:1px solid #30383b;border-radius:5px;background:#07090a;color:#bdc5c8;padding:0 8px;font-size:9px}
.kineplex-adjustments{display:flex;align-items:center;justify-content:center;gap:10px;min-width:0}.kineplex-adjustments label{display:grid;grid-template-columns:1fr auto;gap:2px;width:92px;min-width:62px;color:#869297;font-size:8px}.kineplex-adjustments output{color:#727e82}.kineplex-adjustments input{appearance:none;-webkit-appearance:none;grid-column:1/-1;width:100%;height:13px;margin:0;background:transparent;cursor:pointer}.kineplex-adjustments input::-webkit-slider-runnable-track{height:2px;border-radius:2px;background:#0b0e0f;border:1px solid #32393c;box-shadow:inset 0 -1px 0 #b66e27,0 0 4px #e1842224}.kineplex-adjustments input::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:6px;height:10px;margin-top:-5px;border:1px solid #6d777b;border-radius:2px;background:#30383b;box-shadow:0 1px 3px #000}.kineplex-adjustments input::-moz-range-track{height:2px;background:#0b0e0f;border:1px solid #32393c;box-shadow:inset 0 -1px 0 #b66e27}.kineplex-adjustments input::-moz-range-thumb{width:6px;height:10px;border:1px solid #6d777b;border-radius:2px;background:#30383b}
.kineplex-mute[aria-pressed="true"]{border-color:#6c4220;color:#e7aa61}.cinemode-button{height:34px;padding:0 12px;border:1px solid #45331f;border-radius:5px;background:#050606;color:#9f8a70;font-size:9px;letter-spacing:.04em;cursor:pointer;box-shadow:inset 0 1px 0 #ffffff08}.cinemode-button span{display:inline-block;width:5px;height:5px;margin-right:7px;border-radius:50%;background:#664520}.cinemode-button.active{border-color:#a66828;color:#ffc77f;box-shadow:inset 0 0 9px #d57a2017,0 0 12px #d57a2022}.cinemode-button.active span{background:#ff981f;box-shadow:0 0 8px #ff981f}
.kineplex-console>#kineplexMediaStatus{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#778388;font-size:9px;text-align:right}.kineplex-icon-button{width:38px;padding:0;font-size:16px}
@media(max-width:1380px){.kineplex-console{grid-template-columns:auto minmax(220px,1fr) auto 38px;grid-template-rows:auto auto}.kineplex-stream{grid-column:2}.kineplex-display{grid-column:3}.kineplex-icon-button{grid-column:4}.kineplex-console>#kineplexMediaStatus{display:none}.kineplex-sound{display:grid;grid-column:1;grid-row:2}.kineplex-adjustments{grid-column:2/5;grid-row:2;gap:12px;padding-left:12px;border-left:1px solid #1e2426}.kineplex-adjustments label{width:min(120px,14vw)}}
@media(max-height:820px){.kineplex-view.active{grid-template-rows:54px minmax(0,1fr) auto;padding:9px 16px 8px;gap:8px}.kineplex-logo{height:42px}.kineplex-console{min-height:60px;padding:6px 9px}.kineplex-adjustments label{width:70px}}
body[data-feature="hd-film"] .brand-top-right{visibility:hidden;pointer-events:none}
.kineplex-player-controls{grid-template-columns:34px 38px 34px auto minmax(120px,1fr) auto 34px}

.operational-view.active{display:grid;grid-template-columns:252px 1fr;gap:16px;padding:16px 20px 14px;min-height:0}
.left-rail{background:linear-gradient(180deg,#11171b,#090d10);border:1px solid #1d272d;border-radius:18px;padding:14px;display:flex;flex-direction:column;min-height:0;box-shadow:var(--shadow)}
.rail-card{display:flex;gap:12px;align-items:center;padding:14px 8px;border-bottom:1px solid #212b31}
.rail-card.selected{background:#12191d;border-radius:13px;border:1px solid #2b353b;margin-bottom:4px}
.rail-card b{display:block;font-size:14px;font-weight:620}.rail-card small{display:block;color:var(--muted);margin-top:5px}
.rail-icon{width:45px;height:45px;border-radius:11px;border:1px solid;display:grid;place-items:center;font-size:10px;font-weight:800}
.rail-icon.orange{color:#ffc161;border-color:#8c5e20;background:#21170d}.rail-icon.green{color:#62e58b;border-color:#24683a;background:#0d2114}.rail-icon.violet{color:#a488ff;border-color:#483d78;background:#17132a}.rail-icon.blue{color:#68b2ff;border-color:#225d8b;background:#0c1d29}
.live-monitor{margin-top:12px;border:1px solid #273138;border-radius:14px;background:linear-gradient(145deg,#0d1215,#090d0f);padding:12px}
.monitor-title{font-size:9px;letter-spacing:.16em;color:#6f7b81;margin-bottom:8px}
.live-monitor>div:not(.monitor-title){display:grid;grid-template-columns:10px 1fr auto;gap:8px;align-items:center;padding:7px 0;border-top:1px solid #1d262b;font-size:10px}
.live-monitor>div:first-of-type{border-top:0}.live-monitor b{font-size:9px;color:#aab4b8;font-weight:650}.mini-led{width:7px;height:7px}
.rail-bottom{margin-top:auto;border:1px solid #283138;border-radius:15px;padding:14px;text-align:center;color:#aab3b7;font-size:10px}.rail-bottom img{width:50px;display:block;margin:0 auto 8px}

.stage-wrap{min-width:0;min-height:0;display:grid;grid-template-rows:58px 1fr 78px;gap:10px}
.workspace-toolbar{display:flex;align-items:center;justify-content:space-between;border:1px solid #263037;border-radius:14px;background:linear-gradient(145deg,#11171b,#0a0e11);padding:8px 12px 8px 16px;min-width:0}
.workspace-toolbar>div:first-child{display:flex;flex-direction:column;gap:3px}.workspace-toolbar b{font-size:13px;font-weight:620}.toolbar-kicker{font-size:8px;letter-spacing:.16em;color:#7b868b}
.format-block{display:grid;grid-template-columns:auto auto;column-gap:9px;row-gap:2px;align-items:center}.format-block>span{font-size:8px;letter-spacing:.16em;color:#6d787d}.format-block small{grid-column:2;color:#68747a;font-size:8px;text-align:right}
.format-selector{display:flex;gap:4px}.format-btn{border:1px solid #2e383e;background:#0d1215;color:#8e999e;border-radius:8px;padding:6px 9px;font-size:9px;cursor:pointer;transition:.15s}.format-btn:hover{color:#dce2e5;border-color:#4a555b}.format-btn.active{border-color:#7a5328;color:#ffd095;background:#19130c;box-shadow:inset 0 -2px 0 #b56c1e}

.cam-stage-grid{min-width:0;min-height:0;display:grid;grid-template-columns:1fr;gap:10px;transition:grid-template-columns .28s ease}
.cam-stage-grid.share-active{grid-template-columns:minmax(460px,1fr) minmax(500px,1fr)}
.video-stage,.teacher-panel,.share-panel,.monitor-shell,.cam-share-panel{position:relative;overflow:hidden;border:1px solid #283138;border-radius:18px;background:linear-gradient(145deg,#0e1417,#070a0c);box-shadow:var(--shadow);min-height:0}
.video-stage video,.teacher-panel video,.share-panel video,.monitor-shell video,.cam-share-panel video{width:100%;height:100%;object-fit:cover;background:#050708}
[data-format="16-9"] .video-stage,[data-format="16-9"].monitor-shell{aspect-ratio:16/9;justify-self:center;width:100%;max-height:100%}
[data-format="21-9"] .video-stage,[data-format="21-9"].monitor-shell{aspect-ratio:21/9;justify-self:center;width:100%;max-height:100%}
[data-format="dci2k"] .video-stage,[data-format="dci2k"].monitor-shell{aspect-ratio:256/135;justify-self:center;width:100%;max-height:100%}
[data-format="qhd"] .video-stage,[data-format="qhd"].monitor-shell{aspect-ratio:16/9;justify-self:center;width:100%;max-height:100%}
.stage-empty,.monitor-empty,.share-empty{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#9ca7ac;gap:8px;text-align:center;padding:24px}
.stage-empty b,.monitor-empty b,.share-empty b{color:#dce2e5;font-size:18px;font-weight:500}.stage-empty small,.monitor-empty small,.share-empty small{max-width:540px;line-height:1.5}.q-watermark{font-size:76px;color:#77552b;font-weight:700;opacity:.5}.share-icon{font-size:62px;color:var(--orange)}
.local-preview{position:absolute;right:20px;top:20px;width:23%;min-width:190px;aspect-ratio:16/9;border-radius:14px;overflow:hidden;border:1px solid #5b4630;background:#090c0e}.local-preview span{position:absolute;bottom:8px;left:10px;font-size:10px;background:rgba(0,0,0,.55);padding:4px 8px;border-radius:999px}
.stage-badge{position:absolute;left:14px;bottom:14px;display:flex;align-items:center;gap:7px;background:rgba(3,6,7,.78);border:1px solid #3b4449;padding:7px 10px;border-radius:999px;font-size:9px;letter-spacing:.08em}.live-badge{border-color:#255d38;color:#c5f2d0}
.control-dock{height:100%;display:flex;justify-content:center;gap:8px;align-items:center;border:1px solid #263037;border-radius:18px;background:linear-gradient(180deg,#151c20,#0b1012);padding:9px 12px;max-width:100%;width:max-content;min-width:650px;justify-self:center;box-shadow:0 10px 32px rgba(0,0,0,.28)}

.learning-stage{min-width:0;min-height:0;display:grid;grid-template-columns:minmax(430px,1.05fr) minmax(500px,1fr);grid-template-rows:58px 1fr 78px;gap:10px}.learning-toolbar{grid-column:1/-1}.learning-controls{grid-column:1/-1}.panel-label{position:absolute;left:14px;bottom:14px;background:rgba(0,0,0,.62);border:1px solid #384249;padding:8px 11px;border-radius:999px;font-size:12px}.privacy-note{margin-top:12px;padding:14px;border-radius:13px;background:#12130f;border:1px solid #4e3a20;font-size:10px;color:#d7b27a;line-height:1.55}.privacy-note p{color:#9e9990;margin:7px 0 0}.session-chip{display:flex;align-items:center;gap:8px;border:1px solid #303a40;border-radius:999px;padding:8px 11px;font-size:9px;letter-spacing:.08em}

.encode-view.active{display:grid;grid-template-columns:300px 1fr;gap:16px;padding:16px 20px 14px;min-height:0}.encode-sidebar{background:linear-gradient(180deg,#11171b,#090d10);border:1px solid #1f292f;border-radius:18px;padding:22px;display:flex;flex-direction:column;gap:12px}.encode-mode{padding-bottom:20px;border-bottom:1px solid #273137;margin-bottom:4px}.encode-mode>span{color:var(--orange);font-size:10px;letter-spacing:.2em}.encode-mode strong{display:block;font-size:24px;margin:8px 0}.encode-mode small{color:var(--muted)}.encode-sidebar>label{font-size:10px;color:#8e999e;letter-spacing:.14em;margin-top:8px}.path-button{display:flex;justify-content:space-between;align-items:center;text-align:left;padding:13px;border-radius:12px;border:1px solid #2b353b;background:#0d1215;cursor:pointer;min-width:0}.path-button span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#a8b1b5}.path-button b{color:#e7b56e;font-size:11px;margin-left:8px}.encode-options{margin:10px 0}.switch-row,.field-row{display:flex;align-items:center;justify-content:space-between;padding:11px 0;border-top:1px solid #20292e;font-size:12px}.switch-row input{accent-color:var(--orange)}.field-row input{width:92px;background:#0b0f11;border:1px solid #303a40;color:white;padding:8px;border-radius:8px}.encode-action{margin-top:auto;border-radius:13px;padding:15px;border:1px solid #a76b2a;background:linear-gradient(145deg,#291c0e,#13100d);color:#ffd39b;cursor:pointer;font-weight:760;letter-spacing:.08em;box-shadow:inset 0 -2px 0 #a15d18}.encode-action:hover{border-color:#d08231}
.encode-main{min-width:0;min-height:0;display:grid;grid-template-rows:58px 1fr 96px 78px;gap:10px}.encode-toolbar{grid-row:1}.monitor-shell{min-height:0}.monitor-top{position:absolute;z-index:2;top:0;left:0;right:0;display:flex;justify-content:space-between;padding:14px 18px;background:linear-gradient(180deg,rgba(3,6,8,.92),transparent);font-size:10px;letter-spacing:.14em;color:#bec7ca}.performance-strip{display:grid;grid-template-columns:repeat(6,1fr);border:1px solid #263037;border-radius:16px;background:#0d1215;overflow:hidden}.performance-strip>div{padding:15px;border-right:1px solid #263037}.performance-strip>div:last-child{border-right:0}.performance-strip span{display:block;color:#6f7b81;font-size:9px;letter-spacing:.12em}.performance-strip strong{display:block;margin-top:9px;font-size:15px;font-weight:550}.activity-log{border:1px solid #263037;border-radius:14px;background:#090d0f;padding:12px 16px;color:#98a4a9;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11px;overflow:auto}

.advanced-view.active{display:block;padding:26px 34px;overflow:auto}.advanced-header{display:flex;justify-content:space-between;align-items:end;gap:24px;margin-bottom:22px}.advanced-header h2{font-size:34px;margin:7px 0 0;font-weight:550}.advanced-header p{max-width:720px;color:#89969b;font-size:13px;line-height:1.5;margin:10px 0 0}.advanced-header-actions{display:flex;align-items:center;gap:10px;flex-shrink:0}.ip-note{font-size:11px;color:#7f8b91;border:1px solid #2a343a;border-radius:999px;padding:9px 13px}.advanced-layout{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(290px,.75fr);gap:14px;align-items:start}.advanced-main,.advanced-side{display:grid;gap:14px;min-width:0}.advanced-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.telemetry-card{border:1px solid #273138;border-radius:16px;background:linear-gradient(145deg,#11171b,#0a0e11);padding:18px;min-height:130px;box-shadow:inset 0 1px 0 rgba(255,255,255,.025)}.telemetry-card>strong{display:block;font-size:24px;margin-top:18px;font-weight:530;letter-spacing:-.02em}.telemetry-label{display:flex;align-items:center;gap:8px;font-size:9px;letter-spacing:.15em;color:#79868c}.telemetry-card>small,.engine-card>small{display:block;color:#77848a;margin-top:11px;font-size:10px}.telemetry-led{width:7px;height:7px;border-radius:50%;background:#657077}.telemetry-led.live{background:var(--green);box-shadow:0 0 12px rgba(85,220,122,.65)}.telemetry-led.warn{background:var(--orange);box-shadow:0 0 12px rgba(255,152,31,.58)}.telemetry-led.danger{background:var(--red);box-shadow:0 0 12px rgba(255,75,73,.58)}.engine-card{grid-column:span 2}.telemetry-line{height:3px;background:#20292e;margin-top:16px;border-radius:99px;overflow:hidden}.telemetry-line i{display:block;height:100%;background:linear-gradient(90deg,var(--orange3),var(--orange));transition:width .25s ease}.chart-card{min-height:268px}.card-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:14px}.card-heading h3,.workflow-card h3,.safe-controls h3{font-size:17px;font-weight:560;margin:8px 0 0}.telemetry-state{font-size:9px;letter-spacing:.14em;color:#7f8b90;border:1px solid #2d383d;border-radius:999px;padding:6px 8px;white-space:nowrap}.chart-placeholder{height:155px;margin-top:21px;display:flex;align-items:end;gap:10px;border-bottom:1px solid #303a40;padding:0 4px}.chart-placeholder div{flex:1;height:0;min-height:3px;background:linear-gradient(180deg,#d8903b,#49301b);border-radius:4px 4px 0 0;transition:height .35s ease;box-shadow:0 0 14px rgba(255,152,31,.08)}.chart-placeholder div:nth-child(2n){background:linear-gradient(180deg,#9c713e,#38291c)}.chart-axis{display:flex;justify-content:space-between;color:#667278;font:9px ui-monospace,SFMono-Regular,Menlo,monospace;margin-top:8px;text-transform:uppercase}.chart-card small{display:block;margin-top:12px;color:#77848a}.workflow-card{min-height:0}.workflow-card h3{margin-bottom:18px}.workflow-steps{display:grid;gap:0;position:relative}.workflow-steps:before{content:"";position:absolute;left:16px;top:18px;bottom:18px;width:1px;background:#2b363a}.workflow-step{position:relative;display:grid;grid-template-columns:33px 1fr;column-gap:10px;align-items:center;padding:9px 0}.workflow-step b{z-index:1;width:33px;height:33px;display:grid;place-items:center;border-radius:50%;background:#11181b;border:1px solid #334047;color:#829097;font:10px ui-monospace,SFMono-Regular,Menlo,monospace}.workflow-step.active b{border-color:#9a642a;color:#f2bb73;box-shadow:0 0 15px rgba(255,152,31,.1)}.workflow-step span{font-size:12px}.workflow-step small{grid-column:2;color:#718087;font-size:10px;margin-top:3px}.wide-action{width:100%;margin-top:18px;justify-content:space-between}.advanced-controls{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:18px}.advanced-controls .instrument-button{padding:10px 9px;font-size:11px}.control-note{display:block;color:#77848a;line-height:1.45;margin-top:15px}.advanced-activity{margin-top:18px;border-top:1px solid #202a2f}.advanced-activity>div{display:grid;grid-template-columns:10px 1fr auto;gap:9px;align-items:center;padding:12px 0;border-bottom:1px solid #1d262b;color:#aab4b8;font-size:11px}.advanced-activity time{color:#68757b;font-size:10px}.activity-dot{width:6px;height:6px;border-radius:50%;background:var(--green);box-shadow:0 0 10px rgba(85,220,122,.6)}
.footer{display:flex;justify-content:space-between;align-items:center;padding:0 26px;border-top:1px solid #172026;font-size:9px;letter-spacing:.08em;color:#58636a}

/* Launch doors: fully closed and static until ENTER, then deliberate 3s engineered travel. */
.splash{position:fixed;inset:0;z-index:100;background:#020303;overflow:hidden;transition:opacity .34s ease}
.door{position:absolute;top:0;bottom:0;width:50.15%;background-image:url('assets/quantaflex-doors.png');background-repeat:no-repeat;background-size:200% 100%;transition:transform 3s cubic-bezier(.78,.02,.18,1);will-change:transform;filter:saturate(.94) contrast(1.02)}
.door-left{left:0;background-position:left top}.door-right{right:0;background-position:right top}
.splash.open .door-left{transform:translateX(-107%)}.splash.open .door-right{transform:translateX(107%)}
.splash.opening{background:transparent}.splash.open{pointer-events:none}.splash.fade{opacity:0}
.splash-enter-wrap{position:absolute;z-index:4;left:50%;bottom:34px;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:9px;transition:opacity .22s ease,transform .22s ease}
.splash-enter{min-width:138px;display:flex;align-items:center;justify-content:center;gap:10px;padding:11px 22px;border-radius:999px;border:1px solid #76502a;background:linear-gradient(180deg,rgba(31,27,22,.92),rgba(12,13,13,.94));box-shadow:inset 0 1px 0 rgba(255,211,151,.10),0 8px 28px rgba(0,0,0,.34);color:#e9d9c2;font:600 10px/1 system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;letter-spacing:.22em;cursor:pointer;transition:border-color .18s ease,box-shadow .18s ease,color .18s ease,transform .18s ease}
.splash-enter:hover,.splash-enter:focus-visible{outline:none;border-color:#b97732;color:#fff1d9;box-shadow:inset 0 1px 0 rgba(255,219,166,.14),0 0 0 1px rgba(214,130,48,.16),0 8px 30px rgba(0,0,0,.38)}
.splash-enter:active{transform:translateY(1px)}
.splash-enter-led{width:7px;height:7px;border-radius:50%;background:#e69436;box-shadow:0 0 10px rgba(230,148,54,.9)}
.splash-enter-wrap small{font-size:8px;letter-spacing:.18em;color:#74685a}
.splash.opening .splash-enter-wrap{opacity:0;transform:translate(-50%,8px);pointer-events:none}

.modal{position:fixed;inset:0;z-index:50;background:rgba(0,0,0,.66);display:none;place-items:center}.modal.show{display:grid}.modal-card{position:relative;width:min(520px,90vw);background:#0d1215;border:1px solid #344047;border-radius:18px;padding:28px;box-shadow:var(--shadow)}.modal-card h3{font-size:26px;margin:8px 0}.modal-card p{color:#9eaaaf;line-height:1.55}.modal-card code{display:block;background:#070a0c;padding:12px;border-radius:9px;color:#d8a35f}.modal-close{position:absolute;right:14px;top:12px;border:0;background:none;font-size:24px;color:#7f8b91;cursor:pointer}.hidden{display:none!important}

@media(max-width:1250px){.feature-grid{grid-template-columns:repeat(3,1fr)}.learning-stage{grid-template-columns:1fr 1fr}.performance-strip strong{font-size:13px}.topbar{padding:0 20px}.operational-view.active,.encode-view.active{padding-left:12px;padding-right:12px}.left-rail{font-size:90%}}
@media(max-width:1120px){.format-block small{display:none}.format-btn{padding:5px 7px}.control-dock{min-width:0;width:100%}.instrument-button{padding:10px 11px}.operational-view.active{grid-template-columns:226px 1fr}.encode-view.active{grid-template-columns:270px 1fr}}

@media(max-width:1250px){.advanced-view.active{padding:20px 22px}.advanced-layout{grid-template-columns:minmax(0,1.35fr) minmax(270px,.8fr)}.advanced-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.engine-card{grid-column:span 2}}
@media(max-height:820px){.advanced-view.active{padding-top:16px;padding-bottom:14px}.advanced-header{margin-bottom:14px}.advanced-header p{margin-top:6px}.advanced-kpis,.advanced-layout,.advanced-main,.advanced-side{gap:9px}.telemetry-card{padding:14px;min-height:0}.telemetry-card>strong{font-size:20px;margin-top:12px}.chart-card{min-height:220px}.chart-placeholder{height:115px;margin-top:13px}.workflow-step{padding:6px 0}.wide-action{margin-top:10px}.control-note{margin-top:10px}}

/* Integrated Advanced chassis; engine controls retain their existing IDs. */
.encode-sidebar{overflow:auto}.encode-sidebar>select{width:100%;min-height:34px;background:#090d0f;border:1px solid #344148;border-radius:6px;padding:6px 9px;color:#c4cfd3;font-size:12px}.encode-sidebar>select:disabled{opacity:.45}.delivery-status{display:block;font-size:11px;color:#8d9ba1;line-height:1.5;margin:10px 0}.native-format{font-size:11px;color:#8d9ba1}.native-format summary{cursor:pointer;padding:8px 0}.native-format .switch-row{gap:12px}.processing-metrics{font-size:11px;margin:12px 0;display:grid;grid-template-columns:1fr 1fr;gap:6px 12px}.processing-metrics dt{color:#8d9ba1}.processing-metrics dd{margin:0;overflow-wrap:anywhere}.codec-output header b{font-size:13px;min-width:0}
.advanced-view .toolkit-layout{--rca-bay-height:max(260px,calc(100dvh - 370px));grid-template-columns:calc((var(--rca-bay-height) - 12px)*.488022284 + 12px) minmax(0,1fr) minmax(190px,22%);align-items:stretch;gap:12px}
.rca-instrument{position:relative;height:var(--rca-bay-height);box-sizing:border-box;min-width:0;overflow:hidden;background:#252b2e;border:1px solid #444b4f;border-radius:8px}
.advanced-view .rca-instrument .toolkit-cover-art{position:absolute;z-index:2;inset:5px;width:calc(100% - 10px);height:calc(100% - 10px);max-height:none;aspect-ratio:876/1795;border:0;border-radius:0;transition:transform 600ms ease-in-out;will-change:transform}
.rca-instrument.open .toolkit-cover-art{transform:translateY(-102%)}
#rcaCoverHandle{position:absolute;left:38%;bottom:8.5%;width:24%;height:7%;border:0;background:transparent;cursor:pointer;border-radius:6px}
#rcaCoverHandle:hover,#rcaCoverHandle:focus-visible{box-shadow:0 0 18px #d8893433;outline:1px solid #b68142}
.advanced-view .rca-instrument .toolkit-tools{height:100%;box-sizing:border-box;overflow:auto;padding:12px;border:0;border-radius:0}
.rca-instrument .tool-grid{grid-template-columns:1fr;gap:0}
.rca-instrument .tool-card{border:0;border-bottom:1px solid #30383b;border-radius:0;min-height:66px;padding:10px 2px;grid-template-columns:24px minmax(0,1fr) auto;background:transparent}
.rca-instrument .tool-card:hover{transform:none}.rca-instrument .tool-copy p{display:none}
.rca-export{padding:14px 0;border-bottom:1px solid #30383b;font-size:12px}.rca-export small{display:block;color:#859196;margin-top:8px}
.advanced-media-bay{display:grid;grid-template-rows:auto minmax(200px,1fr);gap:12px;min-width:0;min-height:0}
.advanced-media-bay .rca-replay-window{height:clamp(380px,52dvh,680px);min-height:280px;max-height:85dvh;resize:vertical;overflow:hidden;box-sizing:border-box}
.advanced-media-bay .rca-replay-window video{max-height:none;min-height:120px;object-fit:contain}
.advanced-view .toolkit-layout.replay-expanded{grid-template-columns:minmax(0,1fr)}
.replay-expanded>.rca-instrument,.replay-expanded>.instrument-telemetry,.replay-expanded .analysis-surface{display:none}
.replay-expanded .advanced-media-bay{grid-column:1/-1;grid-template-rows:auto}
.replay-expanded .rca-replay-window{height:clamp(440px,72dvh,1000px)}
.replay-expanded .rca-replay-window .preview-adjustments{display:flex}
.instrument-media{display:flex;flex-direction:column;min-width:0;min-height:0;overflow:hidden;border:1px solid #303a3e;border-radius:6px;background:linear-gradient(145deg,#13191b,#06090a)}
.instrument-media header,.comparison-controls{display:flex;align-items:center;flex-wrap:wrap;gap:8px;padding:10px;border-bottom:1px solid #303a3e;font-size:12px;color:#bcc6ca}
.instrument-media header b{margin-right:auto}.instrument-media video{width:100%;flex:1;min-height:0;max-height:310px;object-fit:contain;background:#020404}
.instrument-media small{padding:9px;font-size:11px;color:#8b989e;overflow-wrap:anywhere}
.analysis-standby{flex:1;display:grid;align-content:center;justify-items:center;gap:12px;padding:24px;text-align:center;color:#849196;background:repeating-linear-gradient(0deg,transparent 0 29px,#ffffff04 30px)}
.analysis-standby b{font-size:14px;font-weight:500}.analysis-standby span{font-size:12px}
.instrument-telemetry{min-width:0;padding:14px;border-left:1px solid #303a3e;background:linear-gradient(110deg,#101719,#080b0c)}
.instrument-telemetry h3{font-size:16px}.instrument-telemetry dl{font-size:12px}.instrument-telemetry dt{color:#819097;margin-top:24px}.instrument-telemetry dd{margin:7px 0;color:#b9c3c7}
.advanced-view .codec-panel{display:grid;grid-template-columns:minmax(0,1fr) minmax(240px,24%);gap:14px;padding-top:0}
.codec-media-bay{min-width:0}.codec-media-pair{display:grid;grid-template-columns:1fr 1fr;gap:10px;height:clamp(460px,65dvh,660px);margin-top:12px}
.codec-media-pair .instrument-media video{max-height:none;object-fit:contain;min-height:180px}
.codec-media-pair .instrument-media>small{min-height:64px;box-sizing:border-box}
.comparison-controls select{background:#101719;border:1px solid #39464b;border-radius:6px;padding:7px;color:#c8d1d5}
.codec-media-bay[data-mode="split"] .codec-media-pair{grid-template-columns:1fr;grid-template-rows:1fr 1fr;height:auto}.codec-media-bay[data-mode="split"] .instrument-media video{flex:none;aspect-ratio:16/10;height:auto}
.codec-media-bay[data-mode="source"] .codec-output,.codec-media-bay[data-mode="output"] .codec-source{display:none}
.codec-media-bay[data-mode="source"] .codec-media-pair,.codec-media-bay[data-mode="output"] .codec-media-pair{grid-template-columns:1fr}
.codec-telemetry .codec-metrics{grid-template-columns:1fr 1fr;gap:14px;padding:16px 0}.codec-telemetry .codec-metrics strong{font-size:17px}
.codec-telemetry .toolkit-banner{flex-direction:column;align-items:start}.codec-telemetry .codec-settings{gap:10px}.codec-telemetry .toolkit-footer-actions{flex-direction:column;align-items:stretch}
.codec-panel .codec-comparison{grid-column:1/-1;max-width:none;border-top:1px solid #303a3e;padding-top:16px;margin-top:0}
.codec-output-route{display:grid;gap:6px;margin:12px 0 8px}.codec-output-route label{font-size:9px;letter-spacing:.12em;color:#7e8b90;text-transform:uppercase}.codec-output-route select{width:100%;min-height:38px;padding:8px 30px 8px 10px;border:1px solid #765024;border-radius:6px;background:#0b0d0e;color:#efc284;font-size:11px;box-shadow:inset 0 -1px 0 #c478292e,0 0 12px #d77f2010}.codec-output-route small{font-size:9px;color:#77858a}
@media(max-height:820px){.advanced-view .toolkit-layout{--rca-bay-height:max(240px,calc(100dvh - 300px))}.codec-media-pair{height:clamp(400px,65dvh,540px)}.instrument-media header{padding:7px}.advanced-media-bay{gap:8px}}
@media(max-width:1100px){.advanced-view .toolkit-layout{grid-template-columns:calc((var(--rca-bay-height) - 12px)*.488022284 + 12px) minmax(0,1fr)}.toolkit-layout>.instrument-telemetry{grid-column:1/-1}.advanced-view .codec-panel{grid-template-columns:minmax(0,1fr) 240px}}
@media(max-width:760px){.advanced-view .toolkit-layout,.advanced-view .codec-panel{grid-template-columns:1fr}.rca-instrument{height:560px;width:279.437px;max-width:100%;justify-self:center}.codec-media-pair{grid-template-columns:1fr;height:560px}.advanced-media-bay{min-height:500px}}
@media(prefers-reduced-motion:reduce){.rca-instrument .toolkit-cover-art{transition:none}}

/* RCA Toolkit advanced instrument */
.preview-adjustments{display:none;flex-wrap:wrap;align-items:center;justify-content:center;gap:14px;padding:7px 12px;border-top:1px solid #232b2e;background:#080c0e}
.rca-replay-window .preview-adjustments{display:flex}
.preview-adjustments label{display:grid;grid-template-columns:1fr auto;gap:2px;width:120px;max-width:100%;font-size:9px;color:#879499}
.preview-adjustments input{appearance:none;-webkit-appearance:none;grid-column:1/-1;grid-row:2;width:100%;height:16px;margin:0;background:transparent;cursor:pointer}
.preview-adjustments input::-webkit-slider-runnable-track{height:3px;border-radius:2px;background:#0c1113;border:1px solid #353e42;box-shadow:inset 0 -1px 0 #b16b2a,0 1px 3px #c57d241c}
.preview-adjustments input::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:7px;height:11px;margin-top:-5px;border:1px solid #667076;border-radius:2px;background:linear-gradient(#586267,#242c30);box-shadow:0 0 3px #000}
.preview-adjustments input::-moz-range-track{height:2px;border-radius:2px;background:#0c1113;border:1px solid #353e42;box-shadow:inset 0 -1px 0 #b16b2a}
.preview-adjustments input::-moz-range-thumb{width:6px;height:10px;border:1px solid #667076;border-radius:2px;background:#3b454a}
.preview-adjustments input:focus-visible{outline:1px solid #8a6945;outline-offset:2px}
.preview-adjustments output{font-size:9px;color:#8c9a9f}.preview-adjustments small{display:none}.preview-adjustments .tool-action{font-size:9px;padding:4px 7px;background:#0b1012;color:#8d9ba0;border-color:#2d373c}
.rca-tool-drawer{border-bottom:1px solid #303a3e;padding:12px 0;font-size:12px;color:#acb8bd}.rca-tool-drawer summary{cursor:pointer;color:#d6b484}.rca-tool-drawer p{font-size:11px;line-height:1.5;color:#8d9ba1}.rca-tool-drawer label{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:12px}.rca-tool-drawer input,.rca-tool-drawer select{max-width:100%;background:#101719;color:#acb8bd;border:1px solid #364248}.tool-monitor-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:12px 0}.tool-monitor-grid b{display:block;margin-top:8px;font-size:11px;color:#7a898e}.tool-monitor-empty{padding:22px 8px;margin-top:12px;border:1px solid #263237;background:repeating-linear-gradient(0deg,transparent 0 19px,#ffffff05 20px);font-size:11px;color:#7f9098;text-align:center}.rca-tool-drawer fieldset{display:flex;gap:8px;border:0;padding:0}.observer-monitor{overflow:auto;min-height:0;padding:14px}.observer-monitor h4{font-size:13px;color:#e0bb85;margin:0 0 12px}.observer-counter{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:5px;margin-bottom:12px;font-size:11px;color:#a9b8bd}.observer-counter i{grid-column:1/-1;height:4px;background:#c68b42;max-width:100%}.observer-counter span{overflow-wrap:anywhere}
.toolkit-layout{display:grid;grid-template-columns:minmax(190px,.32fr) minmax(0,1fr);gap:14px;align-items:start}.toolkit-cover-panel,.toolkit-tools,.advanced-telemetry-drawer{border:1px solid #273138;border-radius:16px;background:linear-gradient(145deg,#11171b,#080b0d);box-shadow:inset 0 1px 0 rgba(255,255,255,.025)}.toolkit-cover-panel{padding:12px}.toolkit-cover-art{position:relative;aspect-ratio:3/4;max-height:360px;border-radius:11px;overflow:hidden;background:#070809;border:1px solid #4b4d4b}.toolkit-cover-art img{width:100%;height:100%;object-fit:cover;object-position:center;filter:saturate(.72) contrast(1.08) brightness(.72)}.toolkit-cover-art:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.12),rgba(0,0,0,.6) 78%,rgba(0,0,0,.82))}.toolkit-cover-label{position:absolute;z-index:1;left:0;right:0;bottom:62px;text-align:center;letter-spacing:.28em;color:#d9dde0;font-size:12px}.toolkit-cover-lights{position:absolute;z-index:1;left:50%;bottom:25px;display:grid;gap:6px;transform:translateX(-50%)}.toolkit-cover-lights i{display:block;width:65px;height:4px;border-radius:99px;background:#dd8425;box-shadow:0 0 10px rgba(255,152,31,.75)}.toolkit-status{display:grid;grid-template-columns:8px 1fr;gap:5px 8px;align-items:center;padding:14px 3px;color:#c4cdd0}.toolkit-status .telemetry-led{grid-row:span 2}.toolkit-status b{font-size:10px;letter-spacing:.09em}.toolkit-status small{grid-column:2;color:#718087;font-size:10px}.toolkit-cover-panel .wide-action{margin-top:8px}.toolkit-tools{padding:14px}.toolkit-banner{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:2px 2px 13px;border-bottom:1px solid #202b30}.toolkit-banner h3{font-size:20px;font-weight:550;margin:7px 0 0}.toolkit-banner-state{display:grid;grid-template-columns:8px 1fr;gap:3px 8px;align-items:center;text-align:right}.toolkit-banner-state .telemetry-led{grid-row:span 2;justify-self:end}.toolkit-banner-state b{font-size:11px}.toolkit-banner-state small{grid-column:2;color:#77848a;font-size:10px}.tool-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin-top:12px}.tool-card{display:grid;grid-template-columns:30px minmax(0,1fr) auto;gap:9px;align-items:center;min-height:86px;padding:11px;border:1px solid #29343a;border-radius:11px;background:linear-gradient(145deg,#12181b,#0b0f11);transition:border-color .16s ease,transform .16s ease}.tool-card:hover{border-color:#765129;transform:translateY(-1px)}.tool-card.active{border-color:#795025;box-shadow:inset 2px 0 0 var(--orange)}.tool-number{color:var(--orange);font:600 16px ui-monospace,SFMono-Regular,Menlo,monospace}.tool-copy{min-width:0}.tool-copy h3{font-size:12px;letter-spacing:.08em;text-transform:uppercase;margin:0}.tool-copy p{color:#9ba6aa;font-size:10px;margin:4px 0}.tool-copy small{display:block;color:#69777d;font-size:9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tool-action{border:1px solid #39454a;border-radius:7px;background:#111719;color:#c4cdd0;padding:8px 9px;font-size:10px;cursor:pointer;white-space:nowrap}.tool-action:hover:not(:disabled){border-color:#a56a2a;color:#f4c17e}.tool-action:disabled{opacity:.42;cursor:not-allowed}.toolkit-footer-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr)) auto;gap:12px;align-items:center;padding-top:13px;margin-top:12px;border-top:1px solid #202b30}.toolkit-footer-row strong{display:block;font-size:15px;margin-top:7px}.toolkit-footer-row small{display:block;color:#718087;font-size:9px;margin-top:4px}.toolkit-footer-actions{display:flex;justify-content:flex-end;gap:6px;flex-wrap:wrap}.toolkit-footer-actions .instrument-button{padding:9px 10px;font-size:10px}.advanced-telemetry-drawer{display:grid;grid-template-columns:160px minmax(0,1fr) 210px;gap:14px;align-items:center;margin-top:14px;padding:12px 16px}.advanced-telemetry-drawer .chart-placeholder{height:42px;margin:0;border-bottom:0;align-items:end}.advanced-telemetry-drawer .advanced-activity{border-top:0;margin:0;max-height:44px;overflow:hidden}.advanced-telemetry-drawer .advanced-activity>div{padding:5px 0;border-bottom:0;font-size:10px}.advanced-telemetry-drawer .advanced-activity>div:not(:first-child){display:none}
@media(max-width:1120px){.toolkit-layout{grid-template-columns:170px minmax(0,1fr)}.toolkit-cover-art{max-height:290px}.tool-card{grid-template-columns:25px minmax(0,1fr);min-height:76px}.tool-card .tool-action{grid-column:2;justify-self:start;padding:6px 8px}.toolkit-footer-row{grid-template-columns:repeat(3,1fr)}.toolkit-footer-actions{grid-column:1/-1;justify-content:flex-start}.advanced-telemetry-drawer{grid-template-columns:125px minmax(0,1fr)}}
@media(max-height:820px){.toolkit-cover-art{max-height:245px}.tool-card{min-height:68px;padding:8px}.tool-card p{margin:2px 0}.toolkit-banner{padding-bottom:9px}.tool-grid{margin-top:8px;gap:7px}.toolkit-footer-row{padding-top:9px;margin-top:8px}.advanced-telemetry-drawer{margin-top:9px;padding:8px 12px}}
.toolkit-banner-state #engineBar{display:none}
.advanced-tabs{display:flex;gap:4px;border-bottom:1px solid #293339;margin-bottom:14px}.advanced-tabs button{padding:10px 17px;border:0;border-bottom:2px solid transparent;background:transparent;color:#87949a;cursor:pointer;font-size:12px}.advanced-tabs button[aria-selected="true"]{border-bottom-color:var(--orange);color:#f0c38b}.codec-panel{padding:18px 0}.codec-panel .toolkit-banner{padding-bottom:18px}.codec-metrics{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));border-bottom:1px solid #283238;padding:22px 0;gap:18px}.codec-metrics span{display:block;color:#819097;font-size:10px}.codec-metrics strong{display:block;font-size:21px;margin-top:10px;overflow-wrap:anywhere;font-weight:550}.codec-settings{display:flex;gap:20px;align-items:center;flex-wrap:wrap;padding:18px 0}.codec-settings label{display:flex;align-items:center;gap:10px;font-size:12px;color:#b9c3c7}.codec-settings input[type="number"],.codec-settings select{width:95px;min-height:34px;background:#090d0f;border:1px solid #344148;border-radius:6px;padding:6px 9px;color:#e1e6e8}.codec-settings input[type="checkbox"]{accent-color:var(--orange);width:17px;height:17px}.codec-panel .toolkit-footer-actions{justify-content:flex-start}.codec-panel button:disabled{opacity:.42;cursor:not-allowed}.codec-comparison{max-width:500px;margin-top:24px}.codec-comparison .chart-placeholder{height:150px;gap:30px}.codec-comparison small{display:block;margin-top:12px;color:#87949a;font-size:11px}.rca-settings{display:block;padding-bottom:0}.rca-settings summary{color:#b9c3c7;cursor:pointer;font-size:12px;margin-bottom:12px}.rca-settings label{display:inline-flex;margin-right:18px;margin-bottom:12px}.rca-settings select:disabled{opacity:.45}.advanced-view .tool-card{border-radius:8px}.advanced-view .toolkit-cover-art img{filter:none;object-fit:contain}.advanced-view .toolkit-cover-art:after{display:none}.advanced-view .toolkit-cover-art{background:#030404}.advanced-view .telemetry-card>strong{letter-spacing:0}.advanced-activity .activity-dot.warn{background:var(--orange)}.advanced-activity .activity-dot.danger{background:var(--red)}
@media(max-width:1120px){.codec-metrics{grid-template-columns:repeat(3,minmax(0,1fr))}.advanced-header-actions .ip-note{display:none}}
@media(max-height:820px){.advanced-tabs{margin-bottom:9px}.codec-panel{padding-top:10px}.codec-metrics{padding:15px 0}.codec-comparison .chart-placeholder{height:95px}.codec-comparison{margin-top:15px}.advanced-view .toolkit-cover-art{max-height:220px}.advanced-view .advanced-header h2{font-size:28px}}

/* ======================================================================
   Cam2Cam + Pro Online Learning completion pass — 2026-09-17
   New visual source of truth: matt black chassis, selective brushed-black
   instrument surfaces, one Quantaflex mark in the top-right header only.
   ====================================================================== */

.topbar{grid-template-columns:1fr auto 1fr;padding:0 20px 0 22px;background:linear-gradient(180deg,#070b0d 0%,#050809 100%);box-shadow:inset 0 -1px 0 #182126}
.topbar-left{display:flex;align-items:center;min-width:0}
.topbar-actions{display:flex;align-items:center;justify-content:flex-end;gap:10px;min-width:0}
.brand-top-right{position:static;justify-self:end;display:flex;align-items:center;justify-content:flex-end;padding:0;border-radius:12px}
.brand-top-right img{width:142px;height:47px;object-fit:contain;object-position:right center}
.engine-pill{position:static!important}
.top-status{position:static!important;transform:none!important;justify-self:center}

.studio-view.active{display:grid;grid-template-columns:252px minmax(0,1fr);gap:14px;padding:14px 18px 12px;min-height:0;background:
  radial-gradient(circle at 70% 8%,rgba(255,255,255,.018),transparent 28%),
  linear-gradient(135deg,#070a0c 0%,#030506 72%)}
.studio-rail{border:1px solid #20292e;border-radius:18px;padding:14px;background:
  linear-gradient(180deg,rgba(20,25,28,.94),rgba(8,11,13,.97)),
  repeating-linear-gradient(94deg,rgba(255,255,255,.012) 0 1px,transparent 1px 5px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025),0 16px 40px rgba(0,0,0,.22)}
.studio-rail .rail-card{background:#0b0f11;border-color:#202a2f}
.studio-rail .rail-card.selected{background:linear-gradient(145deg,#151615,#0c0f10);border-color:#5c4024;box-shadow:inset 3px 0 0 #c27a2d}
.studio-rail .live-monitor{margin-top:10px;background:#080c0e;border:1px solid #20292e;border-radius:14px;padding:11px}

.studio-workspace{display:grid;grid-template-rows:56px minmax(0,1fr) 86px;gap:10px;min-width:0;min-height:0}
.studio-toolbar{border:1px solid #202a2f;border-radius:15px;background:
  linear-gradient(180deg,rgba(18,23,26,.96),rgba(8,12,14,.96)),
  repeating-linear-gradient(90deg,rgba(255,255,255,.012) 0 1px,transparent 1px 4px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025)}
.session-meta{display:flex;align-items:center;gap:9px}.session-clock{font:500 11px/1 ui-monospace,SFMono-Regular,Menlo,monospace;color:#8c989d;border-left:1px solid #2c363b;padding-left:10px}

.cam-stage-grid{min-width:0;min-height:0;display:grid;gap:10px;grid-template-columns:1fr;position:relative}
.video-stage,.cam-share-panel,.teacher-panel,.share-panel{position:relative;min-width:0;min-height:0;border-radius:18px;overflow:hidden;border:1px solid #263138;background:#030506;box-shadow:inset 0 1px 0 rgba(255,255,255,.018),0 18px 45px rgba(0,0,0,.24)}
.video-stage:before,.teacher-panel:before,.share-panel:before,.cam-share-panel:before{content:"";position:absolute;z-index:2;inset:0;pointer-events:none;border-radius:inherit;box-shadow:inset 0 0 0 1px rgba(255,255,255,.012)}
.cam-stage-grid.share-active{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.cam-stage-grid.layout-side:not(.share-active){grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.cam-stage-grid.layout-side:not(.share-active) .video-stage{grid-column:1/-1}
.cam-stage-grid.layout-local .local-preview{width:min(72%,900px);height:auto;aspect-ratio:16/9;right:50%;top:50%;transform:translate(50%,-50%);border-color:#6a4b29;box-shadow:0 28px 70px rgba(0,0,0,.42)}
.cam-stage-grid.layout-local #remoteEmpty{opacity:.38}

.local-preview{background:#050809;border:1px solid #3e474c}.local-preview.camera-off:after{content:"LOCAL CAMERA OFF";position:absolute;inset:0;display:grid;place-items:center;background:#06090b;color:#6f7b80;font-size:10px;letter-spacing:.12em}
.stage-empty{background:radial-gradient(circle at center,rgba(28,35,38,.45),rgba(3,5,6,.97) 65%)}
.stage-empty b{font-size:20px}.stage-empty small{color:#77848a;max-width:520px}

.premium-dock{align-self:end;height:74px;min-width:0;width:max-content;max-width:100%;padding:8px 12px;border-radius:38px;gap:3px;background:
  linear-gradient(180deg,rgba(28,30,30,.97),rgba(10,12,13,.98)),
  repeating-linear-gradient(93deg,rgba(255,255,255,.018) 0 1px,transparent 1px 4px);
  border:1px solid #3a3d3e;box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 20px 40px rgba(0,0,0,.32)}
.dock-control{min-width:74px;height:58px;padding:5px 10px;border:0;background:transparent;color:#cbd1d4;border-radius:28px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;cursor:pointer;font-size:10px;transition:background .15s ease,color .15s ease,transform .15s ease}
.dock-control:hover{background:#1a1e20;color:#fff}.dock-control:active{transform:translateY(1px)}
.dock-icon{min-width:34px;height:30px;border-radius:17px;display:flex;align-items:center;justify-content:center;gap:4px;background:#1a1e20;border:1px solid #272d30;color:#d7dddf;font-size:10px;letter-spacing:.05em}
.dock-control.recording .dock-icon{background:#351111;border-color:#7b2727;color:#ff6d6d}.record-dot{color:#e94040;font-size:13px}
.danger-control .dock-icon{border-color:#673333;color:#f08b8b}.end-control{margin-left:7px;padding-left:15px;border-left:1px solid #2d3234;border-radius:0 28px 28px 0}.end-control .dock-icon{background:#c52e2e;border-color:#e44444;color:white;font-size:18px}
.end-control.session-ready .dock-icon{background:#12351f;border-color:#2c9d58;color:#73ef9b}
.dock-menu-wrap{position:relative}.layout-menu{position:absolute;z-index:20;bottom:70px;left:50%;transform:translateX(-50%);min-width:170px;padding:6px;border-radius:12px;background:#101416;border:1px solid #30383c;box-shadow:0 20px 45px rgba(0,0,0,.45)}
.layout-menu button{width:100%;border:0;background:transparent;color:#9da8ad;text-align:left;padding:9px 10px;border-radius:8px;cursor:pointer}.layout-menu button:hover,.layout-menu button.active{background:#1a2023;color:#f1f4f5}.layout-menu button.active:before{content:"✓";color:#58d879;margin-right:8px}

.learning-view.active{grid-template-columns:252px minmax(0,1fr)}
.learning-stage{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:56px minmax(0,1fr) 86px;gap:10px;min-width:0;min-height:0}
.learning-toolbar{grid-column:1/-1}.learning-controls{grid-column:1/-1}
.learning-pane{align-self:center;width:100%;height:auto;aspect-ratio:16/10;max-height:100%;min-height:0;transition:grid-column .2s ease,opacity .2s ease,transform .2s ease}
.learning-stage.learning-share-focus{grid-template-columns:220px minmax(0,1fr)}
.learning-stage.learning-share-focus .presenter-pane{opacity:.82}
.learning-camera-stack{display:contents}
.learning-share-focus .learning-camera-stack{display:flex;flex-direction:column;gap:10px;align-self:center;min-width:0;min-height:0;width:100%;grid-column:1;grid-row:2}
.learning-share-focus .learning-camera-stack .presenter-pane,.learning-share-focus .learning-camera-stack>.learner-preview{position:relative;inset:auto;z-index:auto;flex:none;width:100%;min-width:0;height:auto;max-height:none;aspect-ratio:16/9;opacity:1;border:1px solid #3a4448;border-radius:13px;overflow:hidden;background:#030506}
.learning-share-focus .learning-camera-stack .presenter-pane video,.learning-share-focus .learning-camera-stack>.learner-preview video{width:100%;height:100%;object-fit:cover}
.learning-share-focus .learning-camera-stack .panel-label,.learning-share-focus .learning-camera-stack>.learner-preview>span{position:absolute;left:8px;bottom:8px;padding:4px 8px;margin:0;font-size:10px;line-height:1.2;border:1px solid #384249;border-radius:999px;background:rgba(0,0,0,.7);color:#f2f5f6}
.learning-share-focus .learning-camera-stack .stage-empty b{font-size:12px}
.learning-share-focus .learning-camera-stack .stage-empty small{display:none}
.learning-stage.learning-presenter-focus{grid-template-columns:minmax(0,1fr) 250px}
.learning-stage.learning-teaching{grid-template-columns:minmax(300px,.78fr) minmax(440px,1.22fr);grid-template-rows:56px minmax(0,1fr) minmax(160px,.42fr) 86px}
.learning-teaching .learning-camera-stack{display:block;grid-column:1;grid-row:2/4;min-width:0;min-height:0;width:100%;height:100%}
.learning-teaching .learning-camera-stack .presenter-pane{width:100%;height:100%;max-height:none;aspect-ratio:auto;opacity:1}
.learning-teaching .shared-info-pane{grid-column:2;grid-row:2;height:100%;aspect-ratio:auto;opacity:1}
.learning-toolbar select{max-width:220px;min-width:0;padding:6px;border:1px solid #39464b;border-radius:6px;background:#0b1012;color:#eef3f4;font-size:12px}
.learning-teaching .document-toolbar{flex-wrap:wrap;height:auto;gap:4px;padding:4px 8px}
.learning-teaching .shared-info-pane{grid-template-rows:auto minmax(0,1fr)}
.teaching-notes{grid-column:2;grid-row:3;min-width:0;min-height:0;overflow:auto;display:flex;flex-direction:column;gap:6px;padding:9px 11px;border:1px solid #30393d;background:#0b1012}
.teaching-notes h3,.teaching-notes p{margin:0}
.teaching-notes h3{font-size:14px}.private-presenter-heading{display:flex;align-items:center;justify-content:space-between;gap:10px}.private-presenter-heading span{font-size:8px;letter-spacing:.12em;color:#e7af6c}
.teaching-notes p,.teaching-warning{font-size:10px;line-height:1.35;color:#aeb9bd;overflow-wrap:anywhere}
.private-presenter-tools{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(180px,.8fr);gap:8px;min-height:118px}.presenter-notes-tool,.next-slide-tool{min-width:0;min-height:0;padding:8px;border:1px solid #2d373b;background:#070a0b}.presenter-notes-tool{display:flex;flex-direction:column;gap:5px}.presenter-notes-tool>div,.next-slide-heading{display:flex;justify-content:space-between;gap:8px;font-size:10px}.presenter-notes-tool span,.next-slide-heading span{color:#7d898e;font-size:8px}
.teaching-notes label{font-size:9px;color:#71d899}
.teaching-notes textarea{flex:1;min-height:62px;width:100%;resize:none;box-sizing:border-box;padding:7px;font:11px/1.4 inherit;color:#eef3f4;background:#050708;border:1px solid #39464b;border-radius:4px}
.next-slide-tool{display:grid;grid-template-rows:auto minmax(62px,1fr) auto;gap:5px}.next-slide-empty{display:grid;place-content:center;justify-items:center;gap:2px;text-align:center;color:#5e696e;background:#050708}.next-slide-empty>span{color:#8c5b29}.next-slide-empty b{font-size:9px;color:#9da7ab}.next-slide-empty small{font-size:8px}.next-slide-actions{display:grid;grid-template-columns:1fr 1fr;gap:5px}.next-slide-actions button{height:24px;border:1px solid #30393d;background:#0a0e10;color:#687277;font-size:9px}.next-slide-actions button:disabled{cursor:not-allowed;opacity:.65}
.teaching-warning{color:#ffcc77}
@media(max-width:1100px){.learning-stage.learning-teaching{grid-template-columns:minmax(240px,38%) minmax(0,62%)}.learning-teaching .document-title{display:none}.learning-toolbar select{max-width:150px}}
@media(max-width:760px){.learning-stage.learning-teaching{grid-template-columns:1fr;grid-template-rows:56px minmax(180px,1fr) minmax(180px,1fr) minmax(120px,.7fr) 86px;overflow:auto}.learning-teaching .learning-camera-stack{grid-column:1;grid-row:2}.learning-teaching .shared-info-pane{grid-column:1;grid-row:3}.learning-teaching .teaching-notes{grid-column:1;grid-row:4}.learning-teaching .learning-controls{grid-row:5}.teaching-notes textarea{min-height:60px}}
.learning-stage.learning-presenter-focus .shared-info-pane{opacity:.78}
.presenter-pane video{width:100%;height:100%;object-fit:cover;object-position:center;background:#020304}
.learner-preview{position:absolute;z-index:4;right:16px;top:16px;width:29%;min-width:150px;aspect-ratio:16/9;border-radius:13px;overflow:hidden;background:#080b0d;border:1px solid #3a4448;box-shadow:0 12px 30px rgba(0,0,0,.28)}
.learner-preview video{width:100%;height:100%;object-fit:contain}.learner-preview>span{position:absolute;left:8px;bottom:7px;background:rgba(0,0,0,.6);padding:3px 7px;border-radius:999px;font-size:9px}.learner-empty{position:absolute;inset:0;display:grid;place-items:center;color:#6f7a80;font-size:10px;letter-spacing:.08em}

.shared-info-pane{display:grid;grid-template-rows:44px minmax(0,1fr);background:#06090b}.document-toolbar{position:relative;z-index:5;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 10px 0 14px;border-bottom:1px solid #252e33;background:
  linear-gradient(180deg,#14191c,#0b0f11),
  repeating-linear-gradient(92deg,rgba(255,255,255,.015) 0 1px,transparent 1px 4px)}
.document-title{min-width:0;display:flex;align-items:center;gap:8px;color:#dbe0e2}.document-title b{max-width:310px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px;font-weight:520}
.document-tools{display:flex;align-items:center;gap:4px}.document-tools button{height:28px;min-width:28px;padding:0 8px;border-radius:7px;border:1px solid #30393d;background:#0b0f11;color:#bfc7ca;cursor:pointer}.document-tools button:hover{border-color:#6a4b2b;color:#fff}.document-tools span{font-size:9px;color:#8c989d;min-width:42px;text-align:center}
.shared-info-content{position:relative;min-width:0;min-height:0;overflow:auto;background:#050708;display:grid;place-items:center}.shared-info-content video,.shared-info-content iframe{width:100%;height:100%;border:0;background:#050708}.shared-info-content img{max-width:100%;max-height:100%;transform-origin:center center;transition:transform .15s ease}
.privacy-note{background:linear-gradient(145deg,#15120d,#0a0c0d);border-color:#4d3821}

.learning-stage.document-open.learning-split{grid-template-columns:minmax(0,1fr) minmax(0,1.1fr)}
.learning-stage.document-open .shared-info-pane{height:100%;aspect-ratio:auto}
.shared-info-content.document-open{display:block;overflow:auto;overscroll-behavior:contain}
.shared-info-content.document-open img{display:block;max-width:none;max-height:none;height:auto;transform:none;transform-origin:top left}
.shared-info-content.document-open img.hidden{display:none}
.shared-info-content video{object-fit:contain}
.shared-info-pane:fullscreen{width:100%;height:100%;aspect-ratio:auto}

.session-body{display:flex;flex-direction:column;gap:12px;align-items:stretch}
.session-body label{font-size:11px;color:#9ba6ac;margin-top:8px}
.session-room-input{display:block;width:100%;min-width:0;min-height:42px;padding:10px 12px;border:1px solid #30393d;border-radius:7px;background:#080b0d;color:#e2e7e9;font:inherit;font-size:12px}
.session-room-input:focus-visible{outline:2px solid #c99553;outline-offset:2px}
.session-room-input[readonly]{color:#9eabb2}
.session-body .sheet-action{min-height:42px;border-radius:7px}
.session-body .sheet-action.secondary{border-color:#30393d;background:#111619;color:#cbd4d9}
.session-body .sheet-action:disabled{opacity:.4;cursor:not-allowed}
.session-body .sheet-action:focus-visible{outline:2px solid #c99553;outline-offset:2px}
.session-body .session-offline{border-color:#30393d;background:#0a0e10;border-radius:8px}
.session-body .session-offline small{color:#9aa6ad}

.side-sheet{position:fixed;z-index:70;right:18px;top:82px;bottom:18px;width:min(380px,calc(100vw - 36px));transform:translateX(calc(100% + 30px));opacity:0;pointer-events:none;transition:transform .22s ease,opacity .22s ease;border:1px solid #30393d;border-radius:18px;background:
  linear-gradient(180deg,#111619,#080c0e),
  repeating-linear-gradient(92deg,rgba(255,255,255,.014) 0 1px,transparent 1px 4px);
  box-shadow:0 28px 70px rgba(0,0,0,.52);display:grid;grid-template-rows:auto 1fr auto}
.side-sheet.show{transform:none;opacity:1;pointer-events:auto}.sheet-header{display:flex;align-items:flex-start;justify-content:space-between;padding:20px;border-bottom:1px solid #263036}.sheet-header h3{margin:5px 0 0;font-size:22px}.sheet-close{border:0;background:transparent;color:#879399;font-size:24px;cursor:pointer}.sheet-body{padding:18px;overflow:auto;color:#a3adb1;line-height:1.55}.sheet-body p{color:#849096}.sheet-action{width:100%;padding:12px;border-radius:10px;border:1px solid #79522b;background:#17130f;color:#efc893;cursor:pointer}.settings-body label{display:grid;gap:7px;margin-bottom:16px;font-size:10px;letter-spacing:.08em;color:#78858b}.settings-body select{width:100%;background:#080b0d;border:1px solid #30393d;color:#dbe1e3;border-radius:9px;padding:10px}.session-offline{display:flex;align-items:center;gap:10px;padding:12px;border:1px solid #44272a;background:#160c0e;border-radius:12px}.session-offline b,.session-offline small{display:block}.session-offline small{color:#8a7476;margin-top:3px}.chat-body{display:flex;flex-direction:column;gap:10px}.system-message{border:1px solid #2b3438;background:#0a0e10;border-radius:10px;padding:11px;color:#7f8b90;font-size:11px}.chat-compose{display:flex;gap:8px;padding:12px;border-top:1px solid #263036}.chat-compose input{flex:1;min-width:0;background:#080b0d;border:1px solid #30393d;border-radius:9px;padding:10px;color:#dce1e3}.chat-compose button{border:1px solid #51402c;background:#19130d;color:#d6a86b;border-radius:9px;padding:0 14px}.chat-compose :disabled{opacity:.45;cursor:not-allowed}

@media(max-width:1180px){
  .studio-view.active,.learning-view.active{grid-template-columns:210px minmax(0,1fr)}
  .learning-stage{grid-template-columns:repeat(2,minmax(0,1fr))}
  .dock-control{min-width:62px;padding:5px 7px}.premium-dock{width:100%}
  .brand-top-right img{width:124px;height:41px}
}

/* Windows laptops lose viewport height to the taskbar and browser chrome. */
@media (max-height:820px){
  .shell{min-height:0;grid-template-rows:64px minmax(0,1fr) 24px}
  .operational-view.active,.encode-view.active{padding:10px 14px 8px}
  .learning-view.active{grid-template-columns:210px minmax(0,1fr)}
  .learning-stage{grid-template-rows:46px minmax(0,1fr) 66px;gap:8px}
  .learning-pane{border-radius:14px}
  .workspace-toolbar{padding:6px 10px 6px 12px}
  .control-dock{min-width:0;width:max-content;height:58px;padding:5px 8px;gap:3px;border-radius:15px}
  .dock-control{min-width:58px;height:48px;padding:3px 6px;gap:3px;font-size:9px}
  .dock-icon{min-width:28px;height:25px}
  .end-control{padding-left:9px;margin-left:3px}
  .footer{padding:0 16px}
}

@media (max-height:700px){
  .shell{grid-template-rows:56px minmax(0,1fr) 20px}
  .learning-stage{grid-template-rows:40px minmax(0,1fr) 58px;gap:6px}
  .learning-view.active{grid-template-columns:190px minmax(0,1fr)}
  .learning-view .left-rail{padding:8px}
  .learning-view .rail-card{padding:8px 5px}
  .learning-view .rail-icon{width:36px;height:36px}
  .learning-view .privacy-note{padding:9px;margin-top:8px}
  .control-dock{height:52px}
  .dock-control{height:44px;min-width:52px}
}
