:root{color:#f3f4f6;background:#0a0d10;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh}button,input{font:inherit}.shell{display:grid;grid-template-columns:minmax(0,1fr) 380px;min-height:100vh;background:linear-gradient(180deg,rgba(255,255,255,.035),transparent 220px),#0a0d10}.viewer{display:grid;place-items:center;min-width:0;padding:24px}video{width:100%;max-height:calc(100vh - 48px);aspect-ratio:16 / 9;background:#000;border:1px solid #232a31}.panel{display:flex;flex-direction:column;gap:18px;padding:24px;border-left:1px solid #232a31;background:#10151a}.brand{display:grid;gap:2px;padding-bottom:8px}.brand span{color:#9aa4af;font-size:.78rem;line-height:1.2;text-transform:uppercase}.brand strong{color:#fff;font-size:1.35rem;line-height:1.2;letter-spacing:0}.field{display:grid;gap:8px}.field span{color:#c4ccd5;font-size:.86rem}input{width:100%;min-height:44px;padding:10px 12px;color:#f8fafc;background:#0a0d10;border:1px solid #34404b;border-radius:6px;outline:none}input:focus{border-color:#64b5f6;box-shadow:0 0 0 3px #64b5f62e}.segmented{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;padding:4px;background:#0a0d10;border:1px solid #2a333d;border-radius:8px}button{min-height:40px;padding:9px 12px;color:#e7edf4;background:#19212a;border:1px solid #34404b;border-radius:6px;cursor:pointer}button:hover:not(:disabled){border-color:#5e6f80;background:#202a35}button:disabled{color:#697583;cursor:not-allowed}button.active{color:#071016;background:#8fd3ff;border-color:#8fd3ff}.actions{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.primary{color:#071016;background:#69c7ff;border-color:#69c7ff}.primary:hover{background:#8fd3ff}.status{display:grid;gap:10px;margin:0;padding:14px;border:1px solid #26313b;border-radius:8px;background:#0b1015}.status div{display:grid;grid-template-columns:78px minmax(0,1fr);gap:12px}dt{color:#8f9aa7;font-size:.8rem}dd{min-width:0;margin:0;color:#edf2f7;font-size:.86rem;overflow-wrap:anywhere}.url{color:#9dd8ff}.error dd{color:#ffb4ab}@media(max-width:860px){.shell{grid-template-columns:1fr}.viewer{min-height:42vh;padding:12px}video{max-height:54vh}.panel{border-left:0;border-top:1px solid #232a31}}@media(max-width:520px){.actions{grid-template-columns:1fr}.status div{grid-template-columns:1fr;gap:4px}}