:root{font-family:Inter,system-ui,-apple-system,sans-serif;color:#e2e8f0;background-color:#0f172a}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:#0f172a}#root{max-width:960px;margin:0 auto;padding:16px}header{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}h1{font-size:1.4rem;margin:0}.badge{background:#1e293b;border-radius:999px;padding:6px 12px;font-size:.85rem}.banner{background:#1e293b;border:1px solid #334155;padding:10px 12px;border-radius:10px;margin:12px 0;display:flex;justify-content:space-between;align-items:center;gap:12px}main{margin-top:16px;display:flex;flex-direction:column;gap:12px}.video_container,.canvas_container{width:100%;background:#0b1120;border:1px solid #1e293b;border-radius:12px;overflow:hidden;position:relative}video,canvas{width:100%;height:auto;display:block}.controls{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:8px}button{background:#38bdf8;color:#0f172a;border:none;border-radius:8px;padding:10px 12px;font-weight:600;cursor:pointer}button.secondary{background:#1e293b;color:#e2e8f0;border:1px solid #334155}button:disabled{opacity:.5;cursor:not-allowed}.status_row{display:flex;flex-wrap:wrap;gap:10px;font-size:.9rem}.status_row span{background:#1e293b;padding:6px 10px;border-radius:8px}.slider_row{display:flex;align-items:center;gap:12px}.modal_backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#0f172abf;display:flex;align-items:center;justify-content:center;padding:16px;z-index:20}.modal{background:#0f172a;border:1px solid #334155;border-radius:12px;padding:16px;max-width:420px;width:100%}.modal h2{margin-top:0}.modal ul{padding-left:20px}.notice{color:#fbbf24;font-size:.9rem}.progress{height:6px;background:#1e293b;border-radius:999px;overflow:hidden}.progress>div{height:100%;background:#38bdf8;width:0%}