:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media(prefers-color-scheme:light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}.badge{padding:4px 8px;border-radius:6px;font-size:12px;text-transform:uppercase}.badge.receiving{background:#444;color:#fff}.badge.mp4_ready{background:#1e7e34;color:#fff}.badge.error{background:#a00;color:#fff}}:root{--pl-orange: #FF6A0E;--pl-orange-dark: #8F3400;--pl-orange-deep: #511F00;--pl-blue: #002AC1;--pl-navy: #002850;--pl-sky: #7AC8FF;--pl-white: #FDFDFD;--pl-black: #181616;--bg-0: #07090c;--bg-1: #0b0f16;--bg-2: #0f1621;--card: rgba(24, 22, 22, .72);--card-2: rgba(24, 22, 22, .58);--stroke: rgba(122, 200, 255, .12);--stroke-2: rgba(122, 200, 255, .18);--text: rgba(253, 253, 253, .92);--muted: rgba(253, 253, 253, .62);--shadow: 0 20px 60px rgba(0,0,0,.55);--radius: 18px;--radius-sm: 12px;--topbar-h: 78px;--footer-h: 56px}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;color:var(--text);background:radial-gradient(1200px 600px at 12% 18%,rgba(0,42,193,.22),transparent 55%),radial-gradient(900px 480px at 85% 10%,rgba(255,106,14,.12),transparent 55%),radial-gradient(900px 520px at 70% 80%,rgba(122,200,255,.1),transparent 60%),linear-gradient(180deg,var(--bg-0),var(--bg-1) 30%,var(--bg-0));font-family:Gotham Condensed,Roboto Condensed,Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif}.appShell{min-height:100%;display:flex;flex-direction:column}.contentWrap{flex:1;padding:18px 18px 22px;padding-bottom:calc(22px + env(safe-area-inset-bottom))}.contentGrid{display:grid;grid-template-columns:420px minmax(520px,1fr);gap:18px;align-items:start}.topbar{position:sticky;top:0;z-index:50;height:var(--topbar-h);display:flex;align-items:center;gap:18px;padding:10px 18px;background:linear-gradient(180deg,#0b0f16e0,#0b0f16b8);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid rgba(122,200,255,.12)}.brand{display:flex;align-items:center;min-width:210px}.brandLogo{height:34px;width:auto;display:block;filter:drop-shadow(0 10px 20px rgba(0,0,0,.4))}.nav{display:flex;align-items:center;gap:10px;padding:6px;background:#18161661;border:1px solid rgba(122,200,255,.1);border-radius:999px}.navLink{text-decoration:none;color:#fdfdfdc7;font-weight:700;font-size:14px;letter-spacing:.2px;padding:10px 14px;border-radius:999px;transition:.14s ease}.navLink:hover{color:var(--pl-white);background:#7ac8ff1a}.navLink.active{color:var(--pl-white);background:#ff6a0e24;border:1px solid rgba(255,106,14,.28)}.topbarRight{margin-left:auto;display:flex;align-items:end;gap:10px}.deviceBox{display:grid;gap:6px;min-width:220px}.label{font-size:12px;color:#fdfdfda6;letter-spacing:.2px}.input{height:40px;padding:0 12px;border-radius:999px;border:1px solid rgba(122,200,255,.14);background:#1816166b;color:var(--pl-white);outline:none;box-shadow:inset 0 0 0 1px #00000040}.input:focus{border-color:#7ac8ff59;box-shadow:0 0 0 3px #002ac12e}.btn{height:40px;padding:0 14px;border-radius:999px;border:1px solid rgba(122,200,255,.16);background:#18161666;color:var(--pl-white);font-weight:700;letter-spacing:.2px;cursor:pointer;transition:.14s ease}.btn:hover{transform:translateY(-1px);border-color:#7ac8ff42;background:#18161685}.btn:disabled{opacity:.55;cursor:not-allowed;transform:none}.btn.primary{border-color:#ff6a0e59;background:linear-gradient(180deg,#ff6a0e3d,#8f34001f)}.btn.primary:hover{border-color:#ff6a0e8c;background:linear-gradient(180deg,#ff6a0e4d,#8f340029)}.panel{border-radius:var(--radius);background:radial-gradient(700px 260px at 20% 0%,rgba(0,42,193,.16),transparent 55%),radial-gradient(700px 260px at 80% 10%,rgba(255,106,14,.1),transparent 58%),linear-gradient(180deg,var(--card),rgba(24,22,22,.6));border:1px solid var(--stroke);box-shadow:var(--shadow);overflow:hidden}.panelHeader{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:14px 16px;border-bottom:1px solid rgba(122,200,255,.1);background:linear-gradient(180deg,#0028502e,#0000)}.panelTitle{font-size:18px;font-weight:800;letter-spacing:.2px}.panelSub{margin-top:4px;font-size:12px;color:var(--muted)}.hint{font-size:12px;color:#7ac8ffbf;text-align:right;margin-top:6px}.list{padding:12px;display:grid;gap:12px;max-height:calc(100vh - var(--topbar-h) - var(--footer-h) - 86px);overflow:auto}.item{text-align:left;width:100%;border-radius:var(--radius-sm);padding:14px 14px 12px;border:1px solid rgba(122,200,255,.14);background:#1816166b;color:var(--pl-white);cursor:pointer;transition:.14s ease}.item:hover{border-color:#7ac8ff42;background:#18161680;transform:translateY(-1px)}.item.active{border-color:#ff6a0e73;box-shadow:0 0 0 3px #ff6a0e1a}.itemTop{display:flex;justify-content:space-between;align-items:center;gap:10px}.itemReplay{font-weight:900;letter-spacing:.3px;font-size:18px}.itemBottom{margin-top:10px;display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap}.itemMeta,.itemMetaRight{font-size:12px;color:var(--muted)}.muted{color:var(--muted)}.badge{padding:6px 10px;border-radius:999px;font-size:12px;font-weight:800;letter-spacing:.2px;border:1px solid rgba(122,200,255,.16);background:#00285038;color:#7ac8ffeb}.badge.mp4_ready{background:#002ac133;border-color:#7ac8ff38;color:#7ac8fff2}.badge.receiving{background:#ff6a0e24;border-color:#ff6a0e4d;color:#ffd2b4f2}.badge.ready{background:#002ac129;border-color:#002ac14d;color:#c8dcffeb}.badge.error{background:#8f340038;border-color:#ff6a0e59;color:#ffc8aaf2}.playerPanel{display:grid;grid-template-rows:auto 1fr;min-height:560px;max-height:calc(100vh - var(--topbar-h) - var(--footer-h) - 36px)}.playerHeader{align-items:flex-start}.playerMetaLine{margin-top:6px;font-size:13px;color:#fdfdfdbf;display:flex;align-items:center;flex-wrap:wrap;gap:8px}.mono{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,monospace;font-size:12.5px;color:#7ac8ffeb}.dot{opacity:.5}.playerBody{padding:14px;overflow:auto}.videoFrame{border-radius:var(--radius);background:#00000040;border:1px solid rgba(122,200,255,.14);padding:12px}.video{width:100%;height:auto;border-radius:calc(var(--radius) - 6px);display:block;background:#000;max-height:52vh}.playerActions{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px}.warn{margin-top:12px;padding:10px 12px;border-radius:12px;border:1px solid rgba(255,106,14,.25);background:#8f340024;color:#ffdcc8eb;font-size:12px}.empty{padding:18px 14px;border-radius:14px;border:1px dashed rgba(122,200,255,.18);background:#0028501a}.emptyTitle{font-weight:900;font-size:16px}.emptySub{margin-top:6px;color:var(--muted);font-size:13px;line-height:1.3}.toastError{position:fixed;right:18px;top:calc(var(--topbar-h) + 14px);z-index:60;max-width:460px;display:grid;gap:8px;padding:12px 14px;border-radius:14px;border:1px solid rgba(255,106,14,.3);background:#181616d6;box-shadow:0 18px 40px #0000008c}.toastTitle{font-weight:900;color:#ffd2b4f2}.toastMsg{color:#fdfdfdc7;font-size:13px}.toastBtn{justify-self:start;height:34px;padding:0 12px;border-radius:999px;border:1px solid rgba(255,106,14,.3);background:#ff6a0e1f;color:var(--pl-white);font-weight:800;cursor:pointer}.footer{height:var(--footer-h);display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 18px;border-top:1px solid rgba(122,200,255,.1);background:linear-gradient(180deg,#0b0f1699,#0b0f16cc)}.footerLeft,.footerRight{font-size:12.5px;color:#fdfdfdb3}.footerCenter{display:flex;align-items:center;gap:10px}.chipLink{text-decoration:none;color:#fdfdfdd9;font-weight:800;font-size:12px;padding:8px 10px;border-radius:999px;border:1px solid rgba(122,200,255,.14);background:#18161659}.chipLink:hover{border-color:#7ac8ff47;background:#1816167a}.sep{color:#fdfdfd59}.statusDot{width:8px;height:8px;border-radius:999px;background:#7ac8fff2;box-shadow:0 0 0 3px #002ac126;display:inline-block;margin-right:8px}@media(max-width:1024px){.contentGrid{grid-template-columns:380px 1fr}.deviceBox{min-width:200px}}@media(max-width:860px){:root{--topbar-h: auto}.topbar{position:sticky;top:0;height:auto;flex-wrap:wrap;align-items:center;padding:12px;gap:10px}.brand{min-width:auto}.brandLogo{height:30px}.nav{order:3;width:100%;justify-content:flex-start;overflow:auto}.topbarRight{order:2;margin-left:0;width:100%;flex-wrap:wrap;align-items:center}.deviceBox{min-width:0;flex:1}.contentWrap{padding:12px}.contentGrid{grid-template-columns:1fr}.list{max-height:44vh}.playerPanel{min-height:420px;max-height:none}.video{max-height:42vh}.footer{flex-wrap:wrap;height:auto;gap:8px;padding:12px}.footerCenter{width:100%;justify-content:center}}@media(max-width:420px){.btn{width:100%;justify-content:center}.playerActions .btn{width:100%}.toastError{right:12px;left:12px;max-width:none}}