@import"https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap";.ui-video-seek-slider{position:relative;touch-action:none}.ui-video-seek-slider:focus{outline:none}.ui-video-seek-slider .track{padding:0;cursor:pointer;outline:none}.ui-video-seek-slider .track:focus{border:0;outline:none}.ui-video-seek-slider .track .main{width:100%;outline:none;height:18px;top:0;position:absolute;display:flex;align-items:center;box-sizing:border-box}.ui-video-seek-slider .track .main:before{content:"";position:absolute;width:100%;height:3px;background-color:#fff3;overflow:hidden;transition:height .1s;outline:none}.ui-video-seek-slider .track .main .inner-seek-block{position:absolute;width:100%;height:3px;transition:height .1s,opacity .4s;transform-origin:0 0}.ui-video-seek-slider .track .main:focus{border:0;outline:none}.ui-video-seek-slider .track .main .buffered{background-color:#ffffff4d;z-index:2}.ui-video-seek-slider .track .main .seek-hover{background-color:#ffffff80;z-index:1}.ui-video-seek-slider .track .main .connect{background-color:red;z-index:3;transform-origin:0 0}.ui-video-seek-slider .track .main.with-gap .inner-seek-block,.ui-video-seek-slider .track .main.with-gap:before{width:calc(100% - 2px);margin:0 auto}@media (hover){.ui-video-seek-slider .track .main:hover:before{height:8px}.ui-video-seek-slider .track .main:hover .inner-seek-block{height:8px}}.ui-video-seek-slider .thumb{pointer-events:none;position:absolute;width:12px;height:12px;left:-6px;z-index:4;top:3px}.ui-video-seek-slider .thumb .handler{border-radius:100%;width:100%;height:100%;background-color:red;opacity:0;transform:scale(.4);transition:transform .2s,opacity .2s}.ui-video-seek-slider .thumb.active .handler{opacity:1;transform:scale(1)}.ui-video-seek-slider .hover-time{text-shadow:1px 1px 1px #000;position:absolute;line-height:18px;font-size:16px;color:#ddd;bottom:5px;left:0;padding:5px 10px;opacity:0;pointer-events:none;text-align:center}.ui-video-seek-slider .hover-time.active{opacity:1}.ui-video-seek-slider .hover-time .preview-screen{background-repeat:no-repeat;background-size:cover;background-position:center;width:160px;height:90px;border-radius:5px;background-color:#000;margin:0 auto 10px}.ui-video-seek-slider:hover .track .main .seek-hover{opacity:1}:root{--primary-color: #6366f1;--primary-dark: #4f46e5;--secondary-color: #8b5cf6;--accent-color: #06b6d4;--background: #0f172a;--surface: #1e293b;--surface-light: #334155;--text-primary: #f8fafc;--text-secondary: #cbd5e1;--text-muted: #64748b;--border: #334155;--success: #10b981;--warning: #f59e0b;--error: #ef4444;--gradient-primary: linear-gradient(135deg, var(--primary-color), var(--secondary-color));--gradient-surface: linear-gradient(135deg, var(--surface), var(--surface-light));--shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, .05);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .1), 0 2px 4px -2px rgba(0, 0, 0, .1);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -4px rgba(0, 0, 0, .1);--shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, .1), 0 8px 10px -6px rgba(0, 0, 0, .1)}*{box-sizing:border-box}body{background:#0f172a;background:var(--background);color:#f8fafc;color:var(--text-primary);font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;line-height:1.6;margin:0;padding:0;overflow-x:hidden}.dev-container{min-height:100vh;display:flex;flex-direction:column}.dev-header{background:linear-gradient(135deg,#6366f1,#8b5cf6);background:var(--gradient-primary);padding:4rem 2rem;text-align:center;position:relative;overflow:hidden}.dev-header:before{content:"";position:absolute;inset:0;background:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><defs><pattern id="grain" width="100" height="100" patternUnits="userSpaceOnUse"><circle cx="25" cy="25" r="1" fill="white" opacity="0.1"/><circle cx="75" cy="75" r="1" fill="white" opacity="0.1"/><circle cx="50" cy="10" r="0.5" fill="white" opacity="0.1"/><circle cx="10" cy="60" r="0.5" fill="white" opacity="0.1"/><circle cx="90" cy="40" r="0.5" fill="white" opacity="0.1"/></pattern></defs><rect width="100" height="100" fill="url(%23grain)"/></svg>');opacity:.3}.dev-header .header-content{position:relative;z-index:1;max-width:800px;margin:0 auto}.dev-header h1{font-size:3.5rem;font-weight:700;margin:0 0 1rem;background:linear-gradient(135deg,#fff,#e2e8f0);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;letter-spacing:-.025em}.dev-header .subtitle{font-size:1.25rem;color:#ffffffe6;margin:0 0 2rem;font-weight:400;max-width:600px;margin-left:auto;margin-right:auto}.dev-header .header-badges{display:flex;gap:.75rem;justify-content:center;flex-wrap:wrap}.dev-header .header-badges .badge{background:#fff3;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.3);color:#fff;padding:.5rem 1rem;border-radius:2rem;font-size:.875rem;font-weight:500;transition:all .2s ease}.dev-header .header-badges .badge:hover{background:#ffffff4d;transform:translateY(-1px)}.dev-main{flex:1;max-width:1200px;margin:0 auto;padding:0 2rem;width:100%}section{margin:4rem 0;padding:2rem 0}section h2{font-size:2.5rem;font-weight:600;margin:0 0 2rem;text-align:center;background:linear-gradient(135deg,#6366f1,#8b5cf6);background:var(--gradient-primary);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.demo-section .video-container{background:#1e293b;background:var(--surface);border-radius:1rem;padding:2rem;box-shadow:0 20px 25px -5px #0000001a,0 8px 10px -6px #0000001a;box-shadow:var(--shadow-xl);border:1px solid #334155;border:1px solid var(--border)}.demo-section .video-container .demo-video{width:100%;border-radius:.5rem;box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -4px #0000001a;box-shadow:var(--shadow-lg)}.examples-section .tabs{display:flex;gap:.5rem;justify-content:center;margin-bottom:2rem;flex-wrap:wrap}.examples-section .tabs .tab{background:#1e293b;background:var(--surface);border:1px solid #334155;border:1px solid var(--border);color:#cbd5e1;color:var(--text-secondary);padding:.75rem 1.5rem;border-radius:.5rem;font-weight:500;cursor:pointer;transition:all .2s ease;font-size:.875rem}.examples-section .tabs .tab:hover{background:#334155;background:var(--surface-light);color:#f8fafc;color:var(--text-primary)}.examples-section .tabs .tab.active{background:linear-gradient(135deg,#6366f1,#8b5cf6);background:var(--gradient-primary);color:#fff;border-color:#6366f1;border-color:var(--primary-color);box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -2px #0000001a;box-shadow:var(--shadow-md)}.examples-section .example-content{display:grid;grid-template-columns:1fr 1fr;grid-gap:2rem;gap:2rem;align-items:start}@media (max-width: 768px){.examples-section .example-content{grid-template-columns:1fr}}.examples-section .example-demo{background:#1e293b;background:var(--surface);border-radius:1rem;padding:2rem;border:1px solid #334155;border:1px solid var(--border);box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -4px #0000001a;box-shadow:var(--shadow-lg)}.examples-section .example-code{background:#1e293b;background:var(--surface);border-radius:1rem;border:1px solid #334155;border:1px solid var(--border);overflow:hidden;box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -4px #0000001a;box-shadow:var(--shadow-lg)}.examples-section .example-code .code-header{display:flex;justify-content:space-between;align-items:center;padding:1rem 1.5rem;background:#334155;background:var(--surface-light);border-bottom:1px solid #334155;border-bottom:1px solid var(--border);font-weight:500;color:#f8fafc;color:var(--text-primary)}.examples-section .example-code .code-header .copy-btn{background:#6366f1;background:var(--primary-color);color:#fff;border:none;padding:.5rem 1rem;border-radius:.375rem;font-size:.875rem;font-weight:500;cursor:pointer;transition:all .2s ease}.examples-section .example-code .code-header .copy-btn:hover{background:#4f46e5;background:var(--primary-dark);transform:translateY(-1px)}.examples-section .example-code .code-block{margin:0;padding:1.5rem;background:#1a1a1a;color:#e5e5e5;font-family:JetBrains Mono,Fira Code,monospace;font-size:.875rem;line-height:1.6;overflow-x:auto;border-radius:0 0 1rem 1rem}.examples-section .example-code .code-block code{color:inherit}.features-section .features-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));grid-gap:2rem;gap:2rem;margin-top:3rem}.features-section .features-grid .feature-card{background:#1e293b;background:var(--surface);border:1px solid #334155;border:1px solid var(--border);border-radius:1rem;padding:2rem;text-align:center;transition:all .3s ease;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -2px #0000001a;box-shadow:var(--shadow-md)}.features-section .features-grid .feature-card:hover{transform:translateY(-4px);box-shadow:0 20px 25px -5px #0000001a,0 8px 10px -6px #0000001a;box-shadow:var(--shadow-xl);border-color:#6366f1;border-color:var(--primary-color)}.features-section .features-grid .feature-card .feature-icon{font-size:3rem;margin-bottom:1rem;display:block}.features-section .features-grid .feature-card h3{font-size:1.25rem;font-weight:600;margin:0 0 1rem;color:#f8fafc;color:var(--text-primary)}.features-section .features-grid .feature-card p{color:#cbd5e1;color:var(--text-secondary);margin:0;line-height:1.6}.api-section .api-table{background:#1e293b;background:var(--surface);border-radius:1rem;overflow:hidden;border:1px solid #334155;border:1px solid var(--border);box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -4px #0000001a;box-shadow:var(--shadow-lg)}.api-section .api-table table{width:100%;border-collapse:collapse}.api-section .api-table table th,.api-section .api-table table td{padding:1rem 1.5rem;text-align:left;border-bottom:1px solid #334155;border-bottom:1px solid var(--border)}.api-section .api-table table th{background:#334155;background:var(--surface-light);font-weight:600;color:#f8fafc;color:var(--text-primary);font-size:.875rem;text-transform:uppercase;letter-spacing:.05em}.api-section .api-table table td{color:#cbd5e1;color:var(--text-secondary);font-size:.875rem}.api-section .api-table table td code{background:#0f172a;background:var(--background);color:#06b6d4;color:var(--accent-color);padding:.25rem .5rem;border-radius:.25rem;font-family:JetBrains Mono,Fira Code,monospace;font-size:.75rem}.api-section .api-table table tr:last-child td{border-bottom:none}.api-section .api-table table tr:hover td{background:#334155;background:var(--surface-light)}.api-section .timecode-section{margin-top:2rem;padding-left:1rem}.api-section .timecode-title{color:#6366f1;color:var(--primary-color);font-size:1.25rem;font-weight:600;margin-bottom:1rem;border-left:4px solid #6366f1;border-left:4px solid var(--primary-color);padding-left:1rem}.api-section .required-badge{font-size:.75rem;color:#6366f1;color:var(--primary-color);font-weight:500}.dev-footer{background:#1e293b;background:var(--surface);border-top:1px solid #334155;border-top:1px solid var(--border);padding:2rem;text-align:center;margin-top:4rem}.dev-footer p{color:#cbd5e1;color:var(--text-secondary);margin:0 0 1rem}.dev-footer .footer-links{display:flex;gap:1rem;justify-content:center}.dev-footer .footer-links a{color:#6366f1;color:var(--primary-color);-webkit-text-decoration:none;text-decoration:none;font-weight:500;transition:color .2s ease}.dev-footer .footer-links a:hover{color:#4f46e5;color:var(--primary-dark)}@media (max-width: 768px){.dev-header{padding:2rem 1rem}.dev-header h1{font-size:2.5rem}.dev-header .subtitle{font-size:1rem}.dev-main{padding:0 1rem}section h2{font-size:2rem}.examples-section .tabs{flex-direction:column;align-items:stretch}.examples-section .tabs .tab{text-align:center}.features-grid{grid-template-columns:1fr}.api-table{overflow-x:auto}.api-table table{min-width:600px}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.feature-card,.example-demo,.example-code,.api-table{animation:fadeInUp .6s ease-out}.container{padding-top:50px;margin:0 auto;width:100%;max-width:800px}.container h1{color:#fff;margin-bottom:100px;text-align:center}.container .caption{width:100%;display:block;padding:30px 0 50px;color:#fff}.container .video-preview{margin:0 auto;display:block;padding-top:50px;width:100%;max-width:800px}