:root{--font-sans:-apple-system, BlinkMacSystemFont, "Segoe UI", Inter, Roboto, Helvetica, Arial, sans-serif;--font-mono:ui-monospace, "SF Mono", "Cascadia Code", "Segoe UI Mono", Menlo, monospace;--space-xs:4px;--space-sm:8px;--space-md:16px;--space-lg:24px;--space-xl:32px;--space-2xl:48px;--radius-sm:6px;--radius-md:10px;--radius-lg:16px;--radius-full:9999px;--shadow-sm:0 1px 2px rgba(0,0,0,.05);--shadow-md:0 4px 12px rgba(0,0,0,.08);--shadow-lg:0 8px 24px rgba(0,0,0,.12);--transition-fast:.15s ease;--transition-normal:.25s ease}:root,[data-theme=light]{--color-bg:#fff;--color-bg-secondary:#f8f9fb;--color-bg-tertiary:#f0f2f5;--color-surface:#fff;--color-surface-hover:#f5f6f8;--color-border:#e2e5ea;--color-border-strong:#c9cdd4;--color-text-primary:#0f1419;--color-text-secondary:#536471;--color-text-tertiary:#8899a6;--color-accent:#2563eb;--color-accent-hover:#1d4ed8;--color-accent-light:#eff6ff;--color-success:#16a34a;--color-warning:#ca8a04;--color-error:#dc2626;--color-sidebar-bg:#f8f9fb;--color-card-bg:#fff;--color-scrubbar-bg:#e2e5ea;--color-scrubbar-prefetched:#b4c4d9;--color-scrubbar-fill:#2563eb;--color-scrubbar-handle:#2563eb;--color-input-bg:#f0f2f5;--color-input-border:#e2e5ea;--color-input-focus:#2563eb;--color-badge-bg:#eff6ff;--color-badge-text:#2563eb;--color-nav-active:#2563eb;--color-nav-text:#536471;--color-focus-ring:#2563eb;--focus-ring:0 0 0 1px var(--color-bg), 0 0 0 2.5px var(--color-focus-ring)}[data-theme=dark]{--color-bg:#0d1117;--color-bg-secondary:#161b22;--color-bg-tertiary:#1c2128;--color-surface:#161b22;--color-surface-hover:#1c2128;--color-border:#30363d;--color-border-strong:#484f58;--color-text-primary:#e6edf3;--color-text-secondary:#8b949e;--color-text-tertiary:#6e7681;--color-accent:#58a6ff;--color-accent-hover:#79c0ff;--color-accent-light:#0d2240;--color-success:#3fb950;--color-warning:#d29922;--color-error:#f85149;--color-sidebar-bg:#0d1117;--color-card-bg:#161b22;--color-scrubbar-bg:#30363d;--color-scrubbar-prefetched:#484f58;--color-scrubbar-fill:#58a6ff;--color-scrubbar-handle:#58a6ff;--color-input-bg:#0d1117;--color-input-border:#30363d;--color-input-focus:#58a6ff;--color-badge-bg:#0d2240;--color-badge-text:#58a6ff;--color-nav-active:#58a6ff;--color-nav-text:#8b949e;--color-focus-ring:#58a6ff;--focus-ring:0 0 0 1px var(--color-bg), 0 0 0 2.5px var(--color-focus-ring)}*{box-sizing:border-box;margin:0;padding:0}:focus-visible{box-shadow:var(--focus-ring);border-radius:var(--radius-sm);outline:none}html,body{height:100%;font-family:var(--font-sans);color:var(--color-text-primary);background:var(--color-bg);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:14px;line-height:1.5}*{scrollbar-width:thin;scrollbar-color:var(--color-border-strong) transparent}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--color-border-strong);border:2px solid var(--color-bg);border-radius:var(--radius-full)}::-webkit-scrollbar-thumb:hover{background:var(--color-text-tertiary)}::-webkit-scrollbar-corner{background:0 0}#app{height:100vh;grid-template-rows:1fr auto;grid-template-columns:240px 1fr;height:100dvh;display:grid;overflow:hidden}.sidebar{background:var(--color-sidebar-bg);border-right:1px solid var(--color-border);flex-direction:column;grid-row:1/-1;display:flex;overflow-y:auto}.sidebar .logo{align-items:center;gap:var(--space-sm);margin:var(--space-sm);padding:var(--space-md) var(--space-sm);color:var(--color-text-primary);border-radius:var(--radius-sm);letter-spacing:-.02em;white-space:nowrap;font-size:18px;font-weight:600;text-decoration:none;display:flex}.sidebar .logo img{width:32px;height:32px}.sidebar .logo .logoText{flex-direction:column;line-height:1.1;display:flex}.sidebar .logo .logoText .versionTag{margin-left:0}.sidebar nav{padding:var(--space-sm) var(--space-sm);gap:var(--space-xs);flex-direction:column;flex:1;display:flex}.sidebar .navItem{align-items:center;gap:var(--space-sm);padding:var(--space-sm) var(--space-md);border-radius:var(--radius-sm);color:var(--color-nav-text);cursor:pointer;transition:background var(--transition-fast), color var(--transition-fast);font-size:13px;font-weight:500;text-decoration:none;display:flex}.sidebar .navItem:hover{background:var(--color-surface-hover);color:var(--color-text-primary)}.sidebar .navItem.active{background:var(--color-accent-light);color:var(--color-nav-active)}.sidebar .navItem:focus-visible{box-shadow:inset var(--focus-ring)}.sidebar .navItem .navIcon{opacity:.7;width:16px;height:16px}.sidebar .themeToggle{padding:var(--space-md);border-top:1px solid var(--color-border)}.stage{-webkit-overflow-scrolling:touch;min-height:0;padding-bottom:calc(var(--transport-height,0px) + env(safe-area-inset-bottom,0px));overflow-y:auto}.mainContent{padding:var(--space-xl);overflow-y:auto}.page{max-width:900px;padding:var(--space-xl);margin:0 auto}.pageHeader{margin-bottom:var(--space-xl)}.pageHeader h1{letter-spacing:-.02em;margin-bottom:var(--space-xs);font-size:24px;font-weight:700}.pageHeader .subtitle{color:var(--color-text-secondary);font-size:14px}.heroSection{align-items:center;gap:var(--space-md);margin-bottom:var(--space-xl);display:flex}.heroSection .heroLogo{flex-shrink:0;width:256px;height:256px}.heroSection .heroTitle{letter-spacing:-.03em;margin-bottom:var(--space-xs);font-size:28px;font-weight:700}.heroSection .heroSubtitle{color:var(--color-text-secondary);max-width:540px;font-size:14px;line-height:1.6}.docsLayout{gap:0;height:100%;display:flex;overflow:hidden}.docsMenu{border-right:1px solid var(--color-border);width:220px;padding:var(--space-lg) 0;flex-shrink:0;height:100%;overflow-y:auto}.docsCategoryHeader{padding:var(--space-sm) var(--space-lg);text-transform:uppercase;letter-spacing:.05em;color:var(--color-text-tertiary);margin-top:var(--space-sm);font-size:11px;font-weight:600}.docsCategoryHeader:first-child{margin-top:0}.docsMenuItem{padding:var(--space-xs) var(--space-lg);color:var(--color-text-secondary);cursor:pointer;transition:color var(--transition-fast), background var(--transition-fast);font-size:13px;text-decoration:none;display:block}.docsMenuItem:hover{color:var(--color-text-primary);background:var(--color-surface-hover)}.docsMenuItem.active{color:var(--color-accent);background:var(--color-accent-light)}.docsMenuItem:focus-visible{box-shadow:inset var(--focus-ring);border-radius:0}.docsContent{padding:var(--space-xl);flex:1;height:100%;overflow-y:auto}.docsLoading{color:var(--color-text-tertiary);font-size:13px}.markdown{font-size:14px;line-height:1.7}.markdown h1{margin:0 0 var(--space-md);padding-bottom:var(--space-sm);border-bottom:1px solid var(--color-border);font-size:24px;font-weight:700}.markdown h2{margin:var(--space-xl) 0 var(--space-md);font-size:18px;font-weight:600}.markdown h3{margin:var(--space-lg) 0 var(--space-sm);font-size:15px;font-weight:600}.markdown p{margin:var(--space-md) 0;color:var(--color-text-secondary)}.markdown code{font-family:var(--font-mono);background:var(--color-bg-tertiary);border-radius:3px;padding:2px 5px;font-size:13px}.markdown pre{background:var(--color-bg-tertiary);border:1px solid var(--color-border);border-radius:var(--radius-sm);padding:var(--space-md);margin:var(--space-md) 0;overflow-x:auto}.markdown pre code{background:0 0;padding:0}.markdown ul,.markdown ol{padding-left:var(--space-lg);margin:var(--space-md) 0;color:var(--color-text-secondary)}.markdown li{margin:var(--space-xs) 0}.markdown table{border-collapse:collapse;width:100%;margin:var(--space-md) 0;font-size:13px}.markdown table th,.markdown table td{padding:var(--space-sm);border:1px solid var(--color-border);text-align:left}.markdown table th{background:var(--color-bg-tertiary);font-weight:500}.markdown blockquote{border-left:3px solid var(--color-accent);padding-left:var(--space-md);margin:var(--space-md) 0;color:var(--color-text-tertiary)}.markdown a{color:var(--color-accent);text-decoration:none}.markdown a:hover{text-decoration:underline}.markdown hr{border:none;border-top:1px solid var(--color-border);margin:var(--space-lg) 0}.versionTag{color:var(--color-text-secondary);opacity:.6;letter-spacing:0;margin-left:var(--space-xs);font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.6em;font-weight:400}.mobileHeader{align-items:center;gap:var(--space-sm);padding:var(--space-sm) var(--space-md);background:var(--color-sidebar-bg);border-bottom:1px solid var(--color-border);display:none}.mobileHeader .menuBtn{cursor:pointer;width:36px;height:36px;color:var(--color-text-primary);border-radius:var(--radius-sm);background:0 0;border:none;justify-content:center;align-items:center;display:flex}.mobileHeader .menuBtn:hover{background:var(--color-surface-hover)}.mobileHeader .menuBtn svg{width:20px;height:20px}.mobileHeader .mobileTitle{color:var(--color-text-primary);flex:1;font-size:16px;font-weight:600}.mobileHeader img{width:28px;height:28px}.mobileHeader .mobileGithub{color:var(--color-text-secondary);padding:var(--space-xs);align-items:center;display:flex}.mobileHeader .mobileGithub:hover{color:var(--color-text-primary)}.sidebarOverlay{z-index:99;background:rgba(0,0,0,.5);display:none;position:fixed;top:0;bottom:0;left:0;right:0}@media (max-width:768px){#app{grid-template-rows:auto 1fr auto;grid-template-columns:1fr}.mobileHeader{display:flex}.sidebar{z-index:100;width:260px;transition:transform .25s;position:fixed;top:0;bottom:0;left:0;transform:translate(-100%)}.sidebar.open{transform:translate(0)}.sidebarOverlay.open{display:block}.mainContent{padding:var(--space-md)}.stage{padding:var(--space-md);padding-bottom:calc(var(--transport-height,0px) + env(safe-area-inset-bottom,0px))}.heroSection{text-align:center;flex-direction:column;align-items:center}.heroSection .heroLogo{width:160px;height:160px}.docsLayout{flex-direction:column;margin:0}.docsMenu{border-right:none;border-bottom:1px solid var(--color-border);width:100%;height:auto;max-height:200px}}.card{background:var(--color-card-bg);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-lg)}.card+.card{margin-top:var(--space-md)}.cardHeader{margin-bottom:var(--space-md);justify-content:space-between;align-items:center;display:flex}.cardHeader h2{font-size:16px;font-weight:600}.btn{justify-content:center;align-items:center;gap:var(--space-xs);padding:var(--space-sm) var(--space-md);border-radius:var(--radius-sm);cursor:pointer;transition:background var(--transition-fast), transform var(--transition-fast);border:none;font-family:inherit;font-size:13px;font-weight:500;display:inline-flex}.btn:active{transform:scale(.97)}.btnPrimary{background:var(--color-accent);color:#fff}.btnPrimary:hover{background:var(--color-accent-hover)}.btnSecondary{background:var(--color-bg-tertiary);color:var(--color-text-primary);border:1px solid var(--color-border)}.btnSecondary:hover{background:var(--color-surface-hover)}.btnIcon{border-radius:var(--radius-full);background:var(--color-bg-tertiary);border:1px solid var(--color-border);width:36px;height:36px;color:var(--color-text-primary);cursor:pointer;transition:background var(--transition-fast);justify-content:center;align-items:center;padding:0;display:inline-flex}.btnIcon:hover{background:var(--color-surface-hover)}.btnIcon svg{width:16px;height:16px}.inputGroup{gap:var(--space-xs);flex-direction:column;display:flex}.inputGroup label{color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.05em;font-size:12px;font-weight:500}.textInput{padding:var(--space-sm) var(--space-md);border-radius:var(--radius-sm);border:1px solid var(--color-input-border);background:var(--color-input-bg);color:var(--color-text-primary);transition:border-color var(--transition-fast), box-shadow var(--transition-fast);outline:none;font-family:inherit;font-size:14px}.textInput::placeholder{color:var(--color-text-tertiary)}.textInput:focus-visible{border-color:var(--color-input-focus);box-shadow:0 0 0 3px rgba(37,99,235,.1)}.badge{border-radius:var(--radius-full);background:var(--color-badge-bg);color:var(--color-badge-text);align-items:center;padding:2px 8px;font-size:11px;font-weight:600;display:inline-flex}.statsGrid{gap:var(--space-md);margin-bottom:var(--space-xl);grid-template-columns:repeat(auto-fit,minmax(120px,1fr));display:grid}@media (max-width:768px){.statsGrid{grid-template-columns:repeat(2,1fr)}}.statCard{background:var(--color-card-bg);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-lg)}.statCard .statValue{color:var(--color-text-primary);font-size:22px;font-weight:700}.statCard .statLabel{color:var(--color-text-secondary);margin-top:var(--space-xs);font-size:12px}.demoGrid{gap:var(--space-sm);flex-direction:column;display:flex}.demoCard{align-items:center;gap:var(--space-md);padding:var(--space-md);border-radius:var(--radius-sm);cursor:pointer;transition:background var(--transition-fast);display:flex}.demoCard:hover{background:var(--color-surface-hover)}.demoCard:focus-visible{background:var(--color-surface-hover)}.demoCard .demoCardIcon{border-radius:var(--radius-sm);background:var(--color-bg-tertiary);width:36px;height:36px;color:var(--color-text-secondary);flex-shrink:0;justify-content:center;align-items:center;display:flex}.demoCard .demoCardContent{flex:1;min-width:0}.demoCard .demoCardTitle{color:var(--color-text-primary);font-size:13px;font-weight:500}.demoCard .demoCardDesc{color:var(--color-text-tertiary);margin-top:2px;font-size:12px}.themeSwitch{align-items:center;gap:var(--space-sm);color:var(--color-text-secondary);cursor:pointer;border-radius:var(--radius-sm);padding:var(--space-xs);font-size:12px;display:flex}.themeSwitch .switchTrack{border-radius:var(--radius-full);background:var(--color-border-strong);width:36px;height:20px;transition:background var(--transition-fast);position:relative}.themeSwitch .switchTrack .switchThumb{width:16px;height:16px;transition:transform var(--transition-fast);background:#fff;border-radius:50%;position:absolute;top:2px;left:2px}.themeSwitch.dark .switchTrack{background:var(--color-accent)}.themeSwitch.dark .switchTrack .switchThumb{transform:translate(16px)}.featureList{gap:var(--space-sm);flex-direction:column;display:flex}.featureItem{align-items:center;gap:var(--space-sm);color:var(--color-text-secondary);font-size:13px;display:flex}.featureItem .iconContainer{flex-shrink:0;display:flex}.urlRow{gap:var(--space-sm);flex-wrap:wrap;align-items:center;display:flex}.urlRow .textInput{flex:1;min-width:0}.urlRow .btnPrimary{flex-shrink:0}.mediaContainer{border-radius:var(--radius-sm);background:#000;overflow:hidden}.compatTable{border-collapse:collapse;width:100%;font-size:13px}.compatTable th{text-align:left;padding:var(--space-sm);border-bottom:1px solid var(--color-border);color:var(--color-text-secondary);font-weight:500}.compatTable td{padding:var(--space-sm);border-bottom:1px solid var(--color-border)}.compatTable tr:last-child td{border-bottom:none}.iconContainer{justify-content:center;align-items:center;line-height:0;display:inline-flex}.iconContainer svg{display:block}.tabs{gap:var(--space-xs);border-bottom:1px solid var(--color-border);margin-bottom:var(--space-lg);display:flex}.tab{padding:var(--space-sm) var(--space-md);color:var(--color-text-secondary);cursor:pointer;transition:color var(--transition-fast), border-color var(--transition-fast);background:0 0;border:none;border-bottom:2px solid transparent;font-family:inherit;font-size:13px;font-weight:500}.tab:hover{color:var(--color-text-primary)}.tab.active{color:var(--color-accent);border-bottom-color:var(--color-accent)}.transport{z-index:50;background:var(--color-surface);border-top:1px solid var(--color-border);flex-direction:column;display:flex;position:fixed;bottom:0;left:0;right:0}.transportVideo{background:#000;justify-content:center;display:flex}.transportVideo video{object-fit:contain;cursor:pointer;width:100%;max-height:240px}.transportControlsRow{align-items:center;gap:var(--space-md);padding:var(--space-sm) var(--space-lg);height:56px;display:flex}.transportControls{align-items:center;gap:var(--space-sm);display:flex}.transportBtn{border-radius:var(--radius-full);cursor:pointer;width:32px;height:32px;color:var(--color-text-primary);transition:background var(--transition-fast);background:0 0;border:none;justify-content:center;align-items:center;display:flex}.transportBtn:hover{background:var(--color-bg-tertiary)}.transportBtn:focus-visible{border-radius:var(--radius-full)}.transportBtn svg{width:16px;height:16px}.playBtn{background:var(--color-accent);color:#fff;border-radius:var(--radius-full);width:36px;height:36px;position:relative}.playBtn:hover{background:var(--color-accent-hover)}.playBtn svg{width:18px;height:18px}.playBtn.loading:after{content:"";border:2px solid var(--color-border);border-top-color:var(--color-text-primary);pointer-events:none;border-radius:50%;animation:1s linear infinite spin;position:absolute;top:-3px;bottom:-3px;left:-3px;right:-3px}@keyframes spin{to{transform:rotate(360deg)}}.transportProgress{align-items:center;gap:var(--space-sm);flex:1;display:flex}.progressTime{font-feature-settings:"tnum";font-variant-numeric:tabular-nums;color:var(--color-text-tertiary);text-align:center;min-width:40px;font-size:11px}.progressBar{flex:1;position:relative}.progressBarHit{cursor:pointer;touch-action:none;align-items:center;width:100%;height:20px;display:flex}.progressBarFills{border-radius:var(--radius-full);width:100%;height:4px;transition:height .15s;position:relative}.progressBarTrack{background:var(--color-scrubbar-bg);border-radius:var(--radius-full);width:100%;height:100%;position:absolute;top:0;left:0}.progressBarPrefetched{background:var(--color-scrubbar-prefetched);border-radius:var(--radius-full);width:0%;height:100%;position:absolute;top:0;left:0}.progressFill{background:var(--color-scrubbar-fill);border-radius:var(--radius-full);width:0%;height:100%;position:absolute;top:0;left:0}.progressHandle{background:var(--color-scrubbar-handle);opacity:0;width:12px;height:12px;transition:opacity var(--transition-fast), transform var(--transition-fast);border-radius:50%;position:absolute;top:50%;left:0%;transform:translate(-50%,-50%)scale(0)}.progressBarHit:hover .progressBarFills{height:6px}.progressBarHit:hover .progressHandle{opacity:1;transform:translate(-50%,-50%)scale(1)}.transportTrackInfo{min-width:140px;max-width:200px}.transportTrackInfo .trackTitle{color:var(--color-text-primary);white-space:nowrap;text-overflow:ellipsis;font-size:13px;font-weight:500;overflow:hidden}.transportTrackInfo .trackType{color:var(--color-text-tertiary);font-size:11px}.transportActions{align-items:center;gap:var(--space-xs);display:flex}.volumeControl{align-items:center;display:flex;position:relative}.volumeControl .volumeSlider{border-radius:var(--radius-full);-webkit-appearance:none;appearance:none;cursor:pointer;opacity:0;width:0;height:20px;transition:width var(--transition-normal), opacity var(--transition-normal);background:0 0;overflow:visible}.volumeControl .volumeSlider::-webkit-slider-runnable-track{border-radius:var(--radius-full);background:linear-gradient(to right, var(--color-text-primary) var(--volume,100%), var(--color-scrubbar-bg) var(--volume,100%));height:4px}.volumeControl .volumeSlider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;background:var(--color-text-primary);border-radius:50%;width:12px;height:12px;margin-top:-4px}.volumeControl .volumeSlider::-moz-range-track{border-radius:var(--radius-full);background:linear-gradient(to right, var(--color-text-primary) var(--volume,100%), var(--color-scrubbar-bg) var(--volume,100%));height:4px}.volumeControl .volumeSlider::-moz-range-thumb{background:var(--color-text-primary);border:none;border-radius:50%;width:12px;height:12px}.volumeControl:hover .volumeSlider,.volumeControl .volumeSlider:focus{opacity:1;width:80px}@media (max-width:768px){.transportControlsRow{height:auto;padding:var(--space-sm) var(--space-md);gap:var(--space-sm);flex-wrap:wrap}.transportProgress{flex-basis:100%;order:-1}.transportTrackInfo{flex:1;min-width:0}.volumeControl{display:none}.transportActions{margin-left:auto}}.toastContainer{bottom:calc(var(--transport-height,0px) + var(--space-md));z-index:1000;pointer-events:none;position:fixed;left:0;right:0}.toastMessages{align-items:center;gap:var(--space-sm);padding:0 var(--space-md);flex-direction:column;display:flex}.toastMessage{background:var(--color-surface);border:1px solid var(--color-border);color:var(--color-text-primary);padding:var(--space-sm) var(--space-md);border-radius:var(--radius-sm);box-shadow:var(--shadow-md);align-items:center;gap:var(--space-sm);font-size:13px;animation:.2s ease-out toastIn;display:flex}.toastMessage.toastHide{animation:.2s ease-in forwards toastOut}.toastMessage.toastError{border-color:var(--color-error)}.toastMessage.toastError .iconContainer{color:var(--color-error)}@keyframes toastIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes toastOut{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(8px)}}:root,[data-theme=light]{--hljs-keyword:#8250df;--hljs-string:#0a3069;--hljs-attr:#0550ae;--hljs-comment:#6e7781;--hljs-number:#0550ae;--hljs-type:#953800;--hljs-function:#6639ba;--hljs-params:#24292f;--hljs-meta:#0550ae;--hljs-property:#953800;--hljs-literal:#0550ae}[data-theme=dark]{--hljs-keyword:#c678dd;--hljs-string:#98c379;--hljs-attr:#98c379;--hljs-comment:#6e7681;--hljs-number:#d19a66;--hljs-type:#e5c07b;--hljs-function:#61afef;--hljs-params:#abb2bf;--hljs-meta:#56b6c2;--hljs-property:#e06c75;--hljs-literal:#d19a66}.hljs{color:var(--color-text-primary)}.hljs-keyword,.hljs-selector-tag,.hljs-built_in{color:var(--hljs-keyword)}.hljs-string,.hljs-attr{color:var(--hljs-string)}.hljs-comment{color:var(--hljs-comment);font-style:italic}.hljs-number,.hljs-literal{color:var(--hljs-literal)}.hljs-type,.hljs-title,.hljs-class{color:var(--hljs-type)}.hljs-function,.hljs-title.function_{color:var(--hljs-function)}.hljs-params{color:var(--hljs-params)}.hljs-meta{color:var(--hljs-meta)}.hljs-property{color:var(--hljs-property)}