:root{--bg:#020812;--panel:rgba(7,18,30,.78);--panel-2:rgba(9,26,42,.88);--line:rgba(114,218,255,.16);--cyan:#26d9ff;--blue:#4b7dff;--text:#e9f7ff;--muted:#8aa6b7;--danger:#ff4d70;--shadow:0 24px 80px rgba(0,0,0,.45)}html[data-theme="light"]{--bg:#f8fafc;--panel:rgba(255,255,255,.9);--panel-2:rgba(241,245,249,.96);--line:rgba(15,23,42,.14);--cyan:#0f766e;--blue:#2563eb;--text:#0f172a;--muted:#475569;--danger:#dc2626;--shadow:0 18px 55px rgba(15,23,42,.12)}*{box-sizing:border-box}html{background:var(--bg);color-scheme:dark}html[data-theme="light"]{color-scheme:light}body{margin:0;min-height:100svh;background:radial-gradient(circle at 10% 0%,color-mix(in srgb,var(--cyan) 10%,transparent),transparent 28%),radial-gradient(circle at 90% 100%,color-mix(in srgb,var(--blue) 10%,transparent),transparent 30%),linear-gradient(180deg,var(--bg),color-mix(in srgb,var(--bg) 86%,var(--blue)));color:var(--text);font-family:Outfit,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;overflow-x:hidden;transition:background .25s ease,color .25s ease}.hidden{display:none!important}button,a{font:inherit}.app-shell{min-height:100svh;padding:max(8px,env(safe-area-inset-top)) max(10px,env(safe-area-inset-right)) max(10px,env(safe-area-inset-bottom)) max(10px,env(safe-area-inset-left))}.glass{background:var(--panel);border:1px solid var(--line);box-shadow:var(--shadow);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}.topbar{position:sticky;top:max(4px,env(safe-area-inset-top));z-index:20;min-height:58px;display:flex;align-items:center;justify-content:space-between;padding:10px 12px;border-radius:18px}.brand{color:var(--text);text-decoration:none;font-family:'Space Grotesk',sans-serif;font-weight:800;letter-spacing:.08em;font-size:clamp(.82rem,2.4vw,1rem)}.brand span{color:var(--cyan)}.top-actions{display:flex;gap:7px}.icon-btn,.control-btn,.mode-btn,.mini-btn{border:1px solid var(--line);background:color-mix(in srgb,var(--panel-2) 88%,transparent);color:var(--text);border-radius:12px;min-height:42px;padding:9px 12px;cursor:pointer;transition:.18s ease}.icon-btn{width:42px;padding:0;display:grid;place-items:center;text-decoration:none;font-size:1.05rem}.icon-btn:hover,.control-btn:hover,.mode-btn:hover,.mini-btn:hover{border-color:color-mix(in srgb,var(--cyan) 46%,var(--line));transform:translateY(-1px)}.theme-toggle{font-size:1rem}.workspace{width:min(1500px,100%);margin:10px auto 0;display:grid;grid-template-columns:minmax(0,1fr) 350px;gap:14px}.stage-wrap{min-width:0}.stage{position:relative;overflow:hidden;border-radius:24px;aspect-ratio:16/10;min-height:420px;max-height:78svh;background:var(--bg)}.stage video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;background:var(--bg)}.stage.mirrored video{transform:scaleX(-1)}#overlay{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.scanline{position:absolute;inset:0;background:linear-gradient(to bottom,transparent 0%,color-mix(in srgb,var(--cyan) 4%,transparent) 47%,color-mix(in srgb,var(--cyan) 24%,transparent) 50%,color-mix(in srgb,var(--cyan) 4%,transparent) 53%,transparent 100%);mix-blend-mode:screen;animation:scan 5s linear infinite;pointer-events:none}.stage-message{position:absolute;inset:0;display:grid;place-content:center;justify-items:center;gap:10px;text-align:center;padding:24px;background:radial-gradient(circle,color-mix(in srgb,var(--bg) 55%,transparent),color-mix(in srgb,var(--bg) 92%,transparent))}.stage-message span{max-width:350px;color:var(--muted)}.pulse-dot,.live-dot{width:8px;height:8px;border-radius:50%;background:var(--cyan);box-shadow:0 0 16px var(--cyan)}.pulse-dot{width:18px;height:18px;animation:pulse 1.5s infinite}.primary-btn{border:0;border-radius:13px;padding:11px 17px;background:linear-gradient(100deg,var(--cyan),var(--blue));color:#fff;font-weight:800;cursor:pointer;box-shadow:0 10px 32px color-mix(in srgb,var(--cyan) 20%,transparent)}.hud{position:absolute;z-index:2;display:flex;gap:7px;align-items:center;padding:7px 10px;border:1px solid var(--line);border-radius:10px;background:color-mix(in srgb,var(--bg) 70%,transparent);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);font:600 .7rem 'Space Grotesk',sans-serif;letter-spacing:.08em;color:var(--text);max-width:46%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.hud-tl{left:12px;top:12px}.hud-tr{right:12px;top:12px}.hud-bl{left:12px;bottom:12px}.hud-br{right:12px;bottom:12px}.hero-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:10px}.stat{padding:14px;border-radius:18px;min-width:0}.stat span{display:block;color:var(--muted);font-size:.8rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.stat strong{display:block;margin-top:2px;font:800 clamp(1.55rem,4vw,2.25rem) 'Space Grotesk',sans-serif;color:var(--text)}.controls{margin-top:10px;padding:10px;border-radius:20px}.mode-row{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;background:color-mix(in srgb,var(--bg) 13%,transparent);padding:5px;border-radius:14px}.mode-btn{min-width:0;min-height:40px;background:transparent;border-color:transparent;color:var(--muted);font-weight:700;white-space:nowrap}.mode-btn.active{background:color-mix(in srgb,var(--cyan) 12%,transparent);border-color:color-mix(in srgb,var(--cyan) 24%,transparent);color:var(--cyan)}.control-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;margin-top:8px}.control-btn{font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.control-btn.danger{color:color-mix(in srgb,var(--danger) 78%,var(--text))}.recording-bar{display:flex;align-items:center;gap:8px;margin-top:8px;padding:9px 10px;border:1px solid color-mix(in srgb,var(--danger) 22%,var(--line));border-radius:14px;background:color-mix(in srgb,var(--danger) 7%,transparent)}.recording-bar strong{margin-left:auto;font-family:'Space Grotesk',sans-serif}.mini-btn{min-height:34px;padding:6px 9px;font-size:.78rem}.panel{padding:14px;border-radius:20px;min-width:0}.side-panel{display:grid;align-content:start;gap:10px}.panel-title{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:12px;font:800 .78rem 'Space Grotesk',sans-serif;letter-spacing:.12em}.chip{padding:5px 7px;border:1px solid color-mix(in srgb,var(--cyan) 20%,var(--line));border-radius:999px;color:var(--cyan);background:color-mix(in srgb,var(--cyan) 6%,transparent);font-size:.61rem;letter-spacing:.08em}.analytics-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.analytics-grid>div{padding:11px;border:1px solid var(--line);border-radius:13px;background:color-mix(in srgb,var(--text) 3%,transparent)}.analytics-grid small{display:block;color:var(--muted);font-size:.7rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.analytics-grid strong{display:block;margin-top:4px;font:700 1.1rem 'Space Grotesk',sans-serif}.track-list{display:grid;gap:6px;max-height:260px;overflow:auto}.track{display:grid;grid-template-columns:32px minmax(0,1fr) auto;gap:8px;align-items:center;padding:9px;border-radius:12px;border:1px solid var(--line);background:color-mix(in srgb,var(--text) 2%,transparent);min-width:0}.track-id{display:grid;place-items:center;width:28px;height:28px;border-radius:9px;background:color-mix(in srgb,var(--cyan) 9%,transparent);color:var(--cyan);font-size:.72rem;font-weight:800}.track-main{min-width:0}.track-main strong{display:block;font-size:.82rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.track-main small{color:var(--muted);font-size:.68rem}.track-score{color:var(--cyan);font:700 .7rem 'Space Grotesk',sans-serif}.empty{color:var(--muted);font-size:.78rem;padding:4px}.engine-list{display:grid;gap:7px}.engine-list div{display:flex;justify-content:space-between;gap:10px;padding:8px 0;border-bottom:1px solid color-mix(in srgb,var(--line) 55%,transparent);font-size:.78rem}.engine-list div:last-child{border-bottom:0}.engine-list span{color:var(--muted)}.engine-list b{font-size:.7rem;color:#2f9e68;text-align:right;max-width:58%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.future-tags{display:flex;flex-wrap:wrap;gap:6px}.future-tags span{padding:6px 8px;border:1px solid var(--line);border-radius:999px;color:var(--muted);font-size:.68rem}.toast{position:fixed;z-index:50;left:50%;bottom:max(18px,env(safe-area-inset-bottom));transform:translateX(-50%);max-width:min(92vw,520px);padding:9px 12px;border-radius:12px;background:var(--panel-2);border:1px solid var(--line);color:var(--text);font-size:.78rem;box-shadow:var(--shadow);opacity:0;pointer-events:none;transition:.25s}.toast.show{opacity:1}@keyframes scan{0%{transform:translateY(-100%)}100%{transform:translateY(100%)}}@keyframes pulse{0%,100%{transform:scale(.86);opacity:.55}50%{transform:scale(1.12);opacity:1}}@media(max-width:1100px){.workspace{grid-template-columns:1fr}.side-panel{grid-template-columns:repeat(2,minmax(0,1fr))}.side-panel .future-panel{grid-column:1/-1}.stage{aspect-ratio:16/10;min-height:0;max-height:none}.control-row{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:700px){.app-shell{padding-left:max(8px,env(safe-area-inset-left));padding-right:max(8px,env(safe-area-inset-right))}.topbar{top:4px;border-radius:16px}.workspace{margin-top:8px}.stage{aspect-ratio:4/5;min-height:0;height:min(72svh,760px);max-height:none;border-radius:20px}.stage video{object-position:center}.hero-stats{gap:6px}.stat{padding:10px 9px;border-radius:15px}.stat span{font-size:.68rem}.stat strong{font-size:1.45rem}.controls{border-radius:17px}.mode-row{position:static}.control-row{grid-template-columns:1fr 1fr}.side-panel{grid-template-columns:1fr}.side-panel .future-panel{grid-column:auto}.track-list{max-height:210px}.stage-message{padding:18px}.hud{font-size:.58rem;padding:6px 8px}.hud-tl,.hud-tr{top:10px}.hud-bl,.hud-br{bottom:10px}.recording-bar{flex-wrap:wrap}.recording-bar strong{margin-left:auto}}@media(max-width:390px){.top-actions{gap:4px}.icon-btn{width:39px;min-height:39px}.brand{font-size:.76rem}.stage{height:68svh}.hud{font-size:.54rem;letter-spacing:.04em}.mode-btn{font-size:.72rem;padding:7px 5px}.control-btn{font-size:.72rem}.stat span{font-size:.62rem}.stat strong{font-size:1.3rem}.panel{padding:12px}.panel-title{font-size:.7rem}.chip{font-size:.55rem}}@media(min-width:701px) and (max-height:800px){.stage{max-height:70svh}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}