.hls-root{--bg-primary:#0a0a0f;--bg-secondary:#14141e;--bg-card:#181825;--bg-card-hover:#1f1f34;--bg-input:#1a1a2e;--border-color:#2a2a3e;--text-primary:#e2e2f0;--text-secondary:#9a9ab0;--text-muted:#5a5a72;--purple-400:#a855f7;--purple-500:#8b5cf6;--purple-600:#7c3aed;--cyan-400:#22d3ee;--emerald-400:#34d399;--rose-400:#fb7185;--yellow-400:#fbbf24;--blue-400:#60a5fa;--radius:12px;--radius-sm:8px;--transition:.2s ease}.hls-root ::-webkit-scrollbar{width:4px;height:4px}.hls-root ::-webkit-scrollbar-track{background:0 0}.hls-root ::-webkit-scrollbar-thumb{background:#3a3a5a;border-radius:8px}.hls-root ::-webkit-scrollbar-thumb:hover{background:#4a4a6a}.hls-navbar{background:var(--bg-secondary);border-radius:var(--radius);border:1px solid var(--border-color);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;margin-bottom:24px;padding:12px 20px;display:flex}.hls-navbar-left{align-items:center;gap:8px;display:flex}.hls-brand{align-items:center;gap:8px;font-size:1rem;font-weight:600;display:flex}.hls-brand-icon{background:linear-gradient(135deg, var(--purple-400), var(--purple-600));color:#fff;border-radius:8px;justify-content:center;align-items:center;width:28px;height:28px;display:flex}.hls-brand-name{color:var(--text-primary);letter-spacing:-.3px}.hls-brand-slash{color:var(--text-muted);margin:0 4px}.hls-brand-sub{color:var(--text-secondary);font-size:.85rem;font-weight:400}.hls-brand-active{color:#c4b5fd;background:#2d2d44;border:1px solid #3d3d5a;border-radius:40px;padding:4px 14px;font-size:.75rem;font-weight:500}.hls-navbar-right{align-items:center;gap:12px;display:flex}.hls-back-btn{color:var(--text-secondary);border:1px solid var(--border-color);transition:all var(--transition);background:#1f1f30;border-radius:40px;align-items:center;gap:6px;padding:6px 14px;font-size:.8rem;text-decoration:none;display:flex}.hls-back-btn:hover{color:var(--text-primary);background:#2c2c46}.cry-version-pill{color:var(--text-secondary);background:#1a1a30;border:1px solid #2a2a44;border-radius:40px;padding:4px 10px;font-size:.7rem;font-weight:500}.hls-container{flex-direction:column;gap:20px;display:flex}.hls-card{background:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius);transition:border-color var(--transition);padding:20px}.hls-card:hover{border-color:#3a3a56}.hls-card-inspector{flex-direction:column;min-height:400px;display:flex}.hls-card-header{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;margin-bottom:16px;display:flex}.hls-card-title{color:var(--text-primary);align-items:center;gap:8px;font-size:.95rem;font-weight:600;display:flex}.cry-status-tag-op{color:var(--text-secondary);border:1px solid var(--border-color);background:#1a1a2e;border-radius:40px;align-items:center;gap:6px;padding:4px 12px;font-size:.7rem;display:flex}.cry-green-dot{background:var(--emerald-400);border-radius:50%;width:6px;height:6px;animation:2s infinite pulse-dot;display:inline-block}@keyframes pulse-dot{0%,to{opacity:1}50%{opacity:.4}}.cry-status-pill{color:var(--text-secondary);border:1px solid var(--border-color);text-transform:uppercase;letter-spacing:.5px;background:#1a1a2e;border-radius:40px;align-items:center;gap:4px;padding:4px 12px;font-size:.65rem;font-weight:600;display:flex}.cry-status-pill.is-ok{color:var(--emerald-400);background:#34d39910;border-color:#34d39940}.cry-status-pill.is-error{color:var(--rose-400);background:#fb718510;border-color:#fb718540}.cry-status-pill.is-loading{color:var(--yellow-400);background:#fbbf2410;border-color:#fbbf2440}.hls-input-group{flex-direction:column;gap:4px;margin-bottom:12px;display:flex}.hls-label{color:var(--text-secondary);text-transform:uppercase;letter-spacing:.3px;font-size:.75rem;font-weight:500}.hls-input{background:var(--bg-input);border:1px solid var(--border-color);border-radius:var(--radius-sm);color:var(--text-primary);transition:all var(--transition);outline:none;padding:8px 14px;font-family:inherit;font-size:.85rem}.hls-input:focus{border-color:var(--purple-500);box-shadow:0 0 0 3px #8b5cf630}.hls-input::placeholder{color:var(--text-muted)}.hls-input:disabled{opacity:.5;cursor:not-allowed}.hls-input select,.hls-input select option{background:var(--bg-input);color:var(--text-primary)}.hls-presets-row{flex-wrap:wrap;align-items:center;gap:8px;margin-bottom:12px;display:flex}.hls-preset-btn{border:1px solid var(--border-color);color:var(--text-secondary);cursor:pointer;transition:all var(--transition);background:0 0;border-radius:40px;padding:4px 12px;font-family:inherit;font-size:.7rem}.hls-preset-btn:hover{border-color:var(--purple-500);color:var(--text-primary)}.hls-preset-btn.is-active{border-color:var(--purple-500);color:var(--purple-400);background:#8b5cf620}.hls-grid-3{grid-template-columns:1fr 1fr 1fr;gap:12px;margin-bottom:8px;display:grid}.hls-stage-grid{grid-template-columns:1fr 1fr;gap:20px;display:grid}.hls-btn-primary{background:linear-gradient(135deg, var(--purple-500), var(--purple-600));border-radius:var(--radius-sm);color:#fff;cursor:pointer;transition:all var(--transition);border:none;align-items:center;gap:8px;padding:8px 20px;font-family:inherit;font-size:.85rem;font-weight:500;display:inline-flex}.hls-btn-primary:hover{transform:translateY(-1px);box-shadow:0 4px 20px #8b5cf640}.hls-btn-primary:active{transform:translateY(0)}.hls-btn-secondary{border:1px solid var(--border-color);border-radius:var(--radius-sm);color:var(--text-secondary);cursor:pointer;transition:all var(--transition);background:#1f1f30;align-items:center;gap:6px;padding:8px 16px;font-family:inherit;font-size:.8rem;display:inline-flex}.hls-btn-secondary:hover{color:var(--text-primary);background:#2a2a44;border-color:#3a3a5a}.hls-btn-icon{border:1px solid var(--border-color);border-radius:var(--radius-sm);width:32px;height:32px;color:var(--text-secondary);cursor:pointer;transition:all var(--transition);background:0 0;justify-content:center;align-items:center;padding:0;display:flex}.hls-btn-icon:hover{color:var(--text-primary);background:#1f1f30}.hls-btn-icon:disabled{opacity:.4;cursor:not-allowed}.hls-video-container{aspect-ratio:16/9;border-radius:var(--radius-sm);background:#000;width:100%;margin-bottom:12px;position:relative;overflow:hidden}.hls-video-element{object-fit:contain;background:#000;width:100%;height:100%}.hls-hud-grid{grid-template-columns:repeat(4,1fr);gap:10px;display:grid}.hls-hud-tile{border:1px solid var(--border-color);border-radius:var(--radius-sm);background:#11111f;flex-direction:column;gap:2px;padding:10px 14px;display:flex}.hls-hud-label{text-transform:uppercase;letter-spacing:.5px;color:var(--text-muted);align-items:center;gap:4px;font-size:.6rem;display:flex}.hls-hud-value{font-variant-numeric:tabular-nums;font-size:.9rem;font-weight:600}.hls-hud-cyan{color:var(--cyan-400)}.hls-hud-green{color:var(--emerald-400)}.hls-hud-yellow{color:var(--yellow-400)}.hls-hud-red{color:var(--rose-400)}.hls-hud-purple{color:var(--purple-400)}.hls-hud-blue{color:var(--blue-400)}.hls-tabs-header{border-bottom:1px solid var(--border-color);flex-wrap:wrap;gap:2px;margin-bottom:14px;padding-bottom:4px;display:flex}.hls-tab-btn{border-radius:var(--radius-sm);color:var(--text-muted);cursor:pointer;transition:all var(--transition);background:0 0;border:none;align-items:center;gap:6px;padding:6px 14px;font-family:inherit;font-size:.75rem;font-weight:500;display:flex}.hls-tab-btn:hover{color:var(--text-secondary);background:#1a1a2e}.hls-tab-btn.is-active{color:var(--text-primary);background:#1f1f34}.hls-logs-scroll{flex-direction:column;flex:1;gap:4px;max-height:280px;padding-right:4px;display:flex;overflow-y:auto}.hls-log-item{border-left:3px solid var(--text-muted);transition:background var(--transition);background:#11111f;border-radius:6px;padding:6px 10px}.hls-log-item:hover{background:#18182a}.hls-log-item.log-info{border-left-color:var(--blue-400)}.hls-log-item.log-success{border-left-color:var(--emerald-400)}.hls-log-item.log-warn{border-left-color:var(--yellow-400)}.hls-log-item.log-error{border-left-color:var(--rose-400)}.hls-log-meta{color:var(--text-muted);align-items:center;gap:8px;margin-bottom:2px;font-size:.6rem;display:flex}.hls-log-time{font-family:monospace}.hls-log-badge{text-transform:uppercase;letter-spacing:.3px;border-radius:4px;align-items:center;gap:3px;padding:0 6px;font-size:.55rem;font-weight:600;display:inline-flex}.hls-log-badge.badge-info{color:var(--blue-400);background:#60a5fa20}.hls-log-badge.badge-success{color:var(--emerald-400);background:#34d39920}.hls-log-badge.badge-warn{color:var(--yellow-400);background:#fbbf2420}.hls-log-badge.badge-error{color:var(--rose-400);background:#fb718520}.hls-log-msg{color:var(--text-secondary);word-break:break-word;font-size:.8rem}.hls-log-details{color:var(--text-muted);word-break:break-all;margin-top:2px;font-family:monospace;font-size:.65rem}.hls-code-block{border:1px solid var(--border-color);border-radius:var(--radius-sm);background:#0d0d1a;padding:14px 16px;font-size:.7rem;position:relative;overflow-x:auto}.hls-code-block pre{color:var(--text-secondary);white-space:pre-wrap;word-break:break-all;margin:0;font-family:JetBrains Mono,Fira Code,monospace;line-height:1.6}.hls-details{margin:8px 0 12px}.hls-details-summary{cursor:pointer;color:var(--text-secondary);-webkit-user-select:none;user-select:none;padding:4px 0;font-size:.8rem}.hls-details-summary:hover{color:var(--text-primary)}.hls-details-content{flex-direction:column;gap:8px;padding:12px 0 4px;display:flex}.hls-toast{border:1px solid var(--border-color);border-radius:var(--radius);color:var(--text-primary);z-index:999;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#1a1a30;align-items:center;gap:10px;max-width:90%;padding:12px 24px;font-size:.85rem;display:flex;position:fixed;bottom:30px;left:50%;transform:translate(-50%);box-shadow:0 8px 40px #0009}.hls-toast.toast-success{border-color:var(--emerald-400)}.hls-toast.toast-error{border-color:var(--rose-400)}.hls-toast.toast-info{border-color:var(--blue-400)}@media (max-width:1024px){.hls-stage-grid{grid-template-columns:1fr}.hls-grid-3{grid-template-columns:1fr 1fr}.hls-hud-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width:640px){.hls-navbar{padding:10px 14px}.hls-brand-sub,.hls-brand-slash{display:none}.hls-grid-3{grid-template-columns:1fr}.hls-card{padding:14px}.hls-hud-grid{grid-template-columns:1fr 1fr}.hls-toast{max-width:none;padding:10px 16px;font-size:.8rem;bottom:16px;left:16px;right:16px;transform:none}.hls-preset-btn{padding:2px 10px;font-size:.6rem}}@keyframes spin{to{transform:rotate(360deg)}}.animate-spin{animation:1s linear infinite spin}.animate-pulse{animation:1.5s ease-in-out infinite pulse}@keyframes pulse{0%,to{opacity:1}50%{opacity:.4}}