::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:4px}.dark ::-webkit-scrollbar-thumb{background:#475569}::-webkit-scrollbar-thumb:hover{background:#94a3b8}.dark ::-webkit-scrollbar-thumb:hover{background:#64748b}input[type=range]{-webkit-appearance:none;background:0 0}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none}input[type=range]:focus{outline:none}*{box-sizing:border-box;margin:0;padding:0}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;min-height:100vh;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;line-height:1.6}.material-symbols-outlined{font-variation-settings:"FILL" 0,"wght" 400,"GRAD" 0,"opsz" 24}.app{background-color:#f5f5f5;flex-direction:column;min-height:100vh;display:flex}.dark .app{background-color:#0f172a}.container{max-width:1280px;margin:0 auto;padding-left:1rem;padding-right:1rem}@media (min-width:640px){.container{padding-left:1.5rem;padding-right:1.5rem}}@media (min-width:1024px){.container{padding-left:2rem;padding-right:2rem}}code{font-family:Fira Code,Courier New,monospace}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.fade-in{animation:.2s ease-out fadeIn}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.spinner{border:3px solid #e5e7eb;border-top-color:#254f6e;border-radius:50%;width:40px;height:40px;animation:1s linear infinite spin}.dark .spinner{border:3px solid #334155;border-top-color:#254f6e}.scrollbar-hide{-ms-overflow-style:none;scrollbar-width:none}.scrollbar-hide::-webkit-scrollbar{display:none}@media (max-width:768px){button,a,input[type=checkbox],input[type=radio]{min-width:44px;min-height:44px}*{-webkit-tap-highlight-color:#254f6e1a}button{-webkit-user-select:none;user-select:none}}html{scroll-behavior:smooth}.app{flex-direction:column;min-height:100vh;display:flex}.video-preview{max-width:900px;margin:0 auto var(--spacing-2xl)auto}.preview-header{margin-bottom:var(--spacing-xl);justify-content:center;display:flex}.success-badge{align-items:center;gap:var(--spacing-sm);padding:var(--spacing-md)var(--spacing-xl);border:2px solid var(--success);border-radius:var(--radius-lg);color:var(--success);background:#10b9811a;font-size:1.125rem;font-weight:600;display:inline-flex}.video-container{border-radius:var(--radius-lg);margin-bottom:var(--spacing-xl);box-shadow:var(--shadow-xl);background:#000;overflow:hidden}.video-player{width:100%;height:auto;display:block}.preview-actions{gap:var(--spacing-md);margin-bottom:var(--spacing-lg);justify-content:center;display:flex}.preview-info{padding:var(--spacing-md);border:1px solid var(--info);border-radius:var(--radius-md);background:#3b82f61a}.preview-info p{align-items:start;gap:var(--spacing-sm);color:var(--info);margin:0;font-size:.875rem;line-height:1.5;display:flex}.preview-info svg{flex-shrink:0;margin-top:2px}@media (max-width:768px){.preview-actions{flex-direction:column}.preview-actions .btn{justify-content:center;width:100%}}.notification-bell-container{display:inline-block;position:relative}.notification-bell-button{color:#fff;cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;min-width:44px;min-height:44px;padding:8px;transition:opacity .2s;display:flex;position:relative}.notification-bell-button:hover{opacity:.8}.notification-bell-button .material-symbols-outlined{font-size:24px}.notification-badge{color:#fff;text-align:center;background:#ef4444;border-radius:10px;min-width:18px;padding:2px 6px;font-size:11px;font-weight:600;line-height:1.2;position:absolute;top:4px;right:4px}.notification-dropdown{z-index:1000;background:#fff;border-radius:8px;width:400px;max-width:90vw;animation:.2s ease-out slideDown;position:absolute;top:calc(100% + 8px);right:0;box-shadow:0 10px 25px #00000026}@keyframes slideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}@media (prefers-color-scheme:dark){.notification-dropdown{background:#1e293b;box-shadow:0 10px 25px #00000080}}.notification-header{border-bottom:1px solid #e5e7eb;justify-content:space-between;align-items:center;padding:16px;display:flex}@media (prefers-color-scheme:dark){.notification-header{border-bottom-color:#334155}}.notification-header h3{color:#111827;margin:0;font-size:16px;font-weight:600}@media (prefers-color-scheme:dark){.notification-header h3{color:#fff}}.notification-action-btn{color:#3b82f6;cursor:pointer;background:0 0;border:none;border-radius:4px;padding:4px 8px;font-size:13px;transition:background-color .2s}.notification-action-btn:hover{background-color:#eff6ff}.notification-action-btn:disabled{opacity:.5;cursor:not-allowed}@media (prefers-color-scheme:dark){.notification-action-btn:hover{background-color:#1e3a8a}}.notification-list{max-height:400px;overflow-y:auto}.notification-empty{color:#9ca3af;flex-direction:column;justify-content:center;align-items:center;padding:40px 20px;display:flex}.notification-empty .material-symbols-outlined{margin-bottom:8px;font-size:48px}.notification-empty p{margin:0;font-size:14px}.notification-item{border-bottom:1px solid #e5e7eb;gap:12px;padding:12px 16px;transition:background-color .2s;display:flex}@media (prefers-color-scheme:dark){.notification-item{border-bottom-color:#334155}}.notification-item:hover{background-color:#f9fafb}@media (prefers-color-scheme:dark){.notification-item:hover{background-color:#334155}}.notification-item:last-child{border-bottom:none}.notification-unread{background-color:#eff6ff}@media (prefers-color-scheme:dark){.notification-unread{background-color:#1e3a8a}}.notification-icon{border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:36px;height:36px;display:flex}.notification-icon .material-symbols-outlined{font-size:20px}.notification-critical .notification-icon{color:#dc2626;background-color:#fee2e2}@media (prefers-color-scheme:dark){.notification-critical .notification-icon{color:#fca5a5;background-color:#7f1d1d}}.notification-high .notification-icon{color:#ea580c;background-color:#fed7aa}@media (prefers-color-scheme:dark){.notification-high .notification-icon{color:#fdba74;background-color:#7c2d12}}.notification-moderate .notification-icon{color:#d97706;background-color:#fef3c7}@media (prefers-color-scheme:dark){.notification-moderate .notification-icon{color:#fcd34d;background-color:#78350f}}.notification-low .notification-icon{color:#2563eb;background-color:#dbeafe}@media (prefers-color-scheme:dark){.notification-low .notification-icon{color:#93c5fd;background-color:#1e3a8a}}.notification-info .notification-icon{color:#6b7280;background-color:#e5e7eb}@media (prefers-color-scheme:dark){.notification-info .notification-icon{color:#d1d5db;background-color:#374151}}.notification-success .notification-icon{color:#059669;background-color:#d1fae5}@media (prefers-color-scheme:dark){.notification-success .notification-icon{color:#6ee7b7;background-color:#064e3b}}.notification-content{flex:1;min-width:0}.notification-title{color:#111827;margin-bottom:4px;font-size:14px;font-weight:600}@media (prefers-color-scheme:dark){.notification-title{color:#fff}}.notification-message{color:#6b7280;margin-bottom:4px;font-size:13px;line-height:1.4}@media (prefers-color-scheme:dark){.notification-message{color:#9ca3af}}.notification-timestamp{color:#9ca3af;font-size:12px}@media (prefers-color-scheme:dark){.notification-timestamp{color:#6b7280}}.notification-actions{flex-shrink:0;gap:4px;display:flex}.notification-icon-btn{color:#9ca3af;cursor:pointer;background:0 0;border:none;border-radius:4px;justify-content:center;align-items:center;padding:4px;transition:background-color .2s,color .2s;display:flex}.notification-icon-btn:hover{color:#111827;background-color:#e5e7eb}@media (prefers-color-scheme:dark){.notification-icon-btn:hover{color:#fff;background-color:#475569}}.notification-icon-btn .material-symbols-outlined{font-size:18px}.notification-footer{border-top:1px solid #e5e7eb;padding:12px 16px}@media (prefers-color-scheme:dark){.notification-footer{border-top-color:#334155}}.notification-clear-btn{color:#6b7280;cursor:pointer;background:0 0;border:1px solid #e5e7eb;border-radius:6px;width:100%;padding:8px;font-size:13px;transition:background-color .2s,border-color .2s}.notification-clear-btn:hover{background-color:#f9fafb;border-color:#d1d5db}.notification-clear-btn:disabled{opacity:.5;cursor:not-allowed}@media (prefers-color-scheme:dark){.notification-clear-btn{color:#d1d5db;border-color:#475569}.notification-clear-btn:hover{background-color:#334155;border-color:#64748b}}@media (max-width:640px){.notification-dropdown{border-radius:0;width:100vw;max-width:100vw;right:-16px}.notification-list{max-height:60vh}}