:root{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Inter,system-ui,sans-serif;line-height:1.5;font-weight:400;color-scheme:dark;color:#ffffffde;background-color:#0a0a0a;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--primary-color: #4F8CFF;--secondary-color: #FF4F8C;--tertiary-color: #8C4FFF;--bg-primary: #0a0a0a;--bg-secondary: #141414;--text-primary: rgba(255, 255, 255, .87);--text-secondary: rgba(255, 255, 255, .6);--border-color: rgba(255, 255, 255, .1)}*{box-sizing:border-box}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh;overflow-x:hidden}#root{width:100%;min-height:100vh}html{scroll-behavior:smooth}::selection{background-color:var(--primary-color);color:#fff}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:var(--bg-secondary)}::-webkit-scrollbar-thumb{background:var(--primary-color);border-radius:5px}::-webkit-scrollbar-thumb:hover{background:var(--secondary-color)}:root{--color-primary: #4F8CFF;--color-primary-rgb: 79, 140, 255;--color-primary-light: #6fa8ff;--color-bg: #f8fbff;--color-bg-alt: #eaf1ff;--color-surface: #fff;--color-success: #1a7f37;--color-success-bg: #eafbe7;--color-error: #d32f2f;--color-error-bg: #ffeaea;--color-text: #222;--color-label: var(--color-primary);--color-input-bg: #f3f7ff;--color-input-focus: #eaf1ff;--radius-lg: 1.5rem;--radius-md: .8rem;--radius-sm: .5rem;--shadow-lg: 0 8px 32px rgba(79, 140, 255, .08), 0 1.5px 6px rgba(0,0,0,.04);--shadow-md: 0 2px 12px rgba(79, 140, 255, .13);--shadow-sm: 0 1px 4px rgba(79, 140, 255, .06);--transition: .2s cubic-bezier(.23, 1, .32, 1);--font-main: "Space Grotesk", "Inter", "Segoe UI", Arial, sans-serif;--font-display: "Outfit", "Space Grotesk", "Inter", sans-serif;--font-accent: "Sora", "Space Grotesk", "Inter", sans-serif}html{background:linear-gradient(135deg,var(--color-bg) 0%,var(--color-bg-alt) 100%)}body{background:transparent;font-family:var(--font-main);color:var(--color-text);margin:0;min-height:100vh;width:100%}h1,h2,h3,h4,h5,h6{font-family:var(--font-main);color:var(--color-text);font-weight:600;margin-top:0}.fade-in-up{animation:fadeInUp .8s cubic-bezier(.23,1,.32,1)}#root{margin:0;padding:0;width:100%;height:100%;text-align:left}.app-wrapper{position:relative;width:100vw;height:100vh;overflow:hidden}.app-ui{position:absolute;top:0;left:0;right:0;z-index:100;width:100%;display:flex;flex-direction:column;height:100vh}.app-content{flex:1;overflow-y:auto;background-color:var(--color-bg)}.loading-container{display:flex;align-items:center;justify-content:center;height:100vh;background:linear-gradient(120deg,var(--color-bg-light) 0%,var(--color-bg) 100%)}.loading-spinner-container{display:flex;flex-direction:column;align-items:center;gap:1rem}.loading-spinner{width:50px;height:50px;animation:rotate 2s linear infinite}@keyframes rotate{to{transform:rotate(360deg)}}@keyframes dash{0%{stroke-dasharray:1,200;stroke-dashoffset:0}50%{stroke-dasharray:89,200;stroke-dashoffset:-35px}to{stroke-dasharray:89,200;stroke-dashoffset:-124px}}.fade-in{animation:fadeIn .5s ease-in-out}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.xr-transition{transition:all .4s ease-in-out}.modern-login-container{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:2rem;position:relative;overflow:hidden}.login-card{width:100%;max-width:420px;background:#ffffff0d;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.1);border-radius:24px;padding:3rem;box-shadow:0 8px 32px #0000004d,inset 0 1px #ffffff1a;position:relative;z-index:1;animation:cardEntry .8s ease-out}.login-header{text-align:center;margin-bottom:2.5rem}.logo-wrapper{display:inline-block;margin-bottom:1.5rem;animation:float 6s ease-in-out infinite}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}.logo-icon{filter:drop-shadow(0 4px 20px rgba(79,140,255,.4))}.brand-name{font-family:var(--font-display);font-size:2.5rem;font-weight:700;margin:0 0 .5rem;background:linear-gradient(135deg,#4f8cff,#ff4f8c);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;letter-spacing:-.02em}.tagline{font-size:.95rem;color:#fff9;margin:0;font-weight:300;letter-spacing:.02em}.login-form{display:flex;flex-direction:column;gap:1.75rem}.input-group{position:relative}.modern-input{width:100%;padding:1rem;background:#ffffff08!important;background-color:#ffffff08!important;border:1px solid rgba(255,255,255,.1);border-radius:12px;color:#ffffffe6!important;font-size:1rem;transition:all .3s ease;outline:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}input.modern-input,input.modern-input[type=email],input.modern-input[type=password],.login-form input.modern-input{background-color:#ffffff08!important;background:#ffffff08!important}.modern-input,.modern-input:not(:focus),.modern-input:not(:placeholder-shown){background-color:#ffffff08!important}.modern-input:-webkit-autofill,.modern-input:-webkit-autofill:hover,.modern-input:-webkit-autofill:focus,.modern-input:-webkit-autofill:active{-webkit-box-shadow:0 0 0 30px rgba(255,255,255,.03) inset!important;-webkit-text-fill-color:rgba(255,255,255,.9)!important;transition:background-color 5000s ease-in-out 0s}.modern-input:focus{background:#ffffff14!important;background-color:#ffffff14!important;border-color:#4f8cff99;box-shadow:0 0 0 3px #4f8cff26}.modern-input:not(:placeholder-shown){background:#ffffff0f!important;background-color:#ffffff0f!important}.modern-label{position:absolute;left:1rem;top:50%;transform:translateY(-50%);color:#ffffff4d;font-size:1rem;pointer-events:none;transition:all .3s cubic-bezier(.4,0,.2,1);transform-origin:left center;opacity:.8}.modern-input:focus~.modern-label{top:-1.5rem;left:0;transform:translateY(0);font-size:.75rem;color:#fffc;font-weight:500;letter-spacing:.05em;opacity:1}.modern-input:not(:placeholder-shown)~.modern-label{top:-1.5rem;left:0;transform:translateY(0);font-size:.75rem;color:#ffffffb3;font-weight:500;letter-spacing:.05em;opacity:1}.input-highlight{position:absolute;bottom:-1px;left:50%;width:0;height:2px;background:linear-gradient(90deg,#4f8cffcc,#ff4f8ccc);transition:all .4s cubic-bezier(.4,0,.2,1);border-radius:2px}.modern-input:focus~.input-highlight{width:100%;left:0}.error-message{color:#ff6b6b;font-size:.875rem;text-align:center;padding:.75rem;background:#ff6b6b1a;border-radius:8px;border:1px solid rgba(255,107,107,.3);animation:shake .5s ease}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-5px)}75%{transform:translate(5px)}}.submit-button{position:relative;padding:1rem 2rem;margin-top:1.5rem;background:linear-gradient(135deg,#4f8cff,#ff4f8c);border:none;border-radius:12px;color:#fff;font-size:1rem;font-weight:600;cursor:pointer;overflow:hidden;transition:all .3s ease;box-shadow:0 4px 20px #4f8cff4d;text-transform:uppercase;letter-spacing:.05em}.submit-button:hover{transform:translateY(-2px);box-shadow:0 6px 30px #4f8cff66}.submit-button:active{transform:translateY(0)}.submit-button:disabled{opacity:.7;cursor:not-allowed}.button-gradient{position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent);transition:left .5s ease}.submit-button:hover .button-gradient{left:100%}.auth-switch{text-align:center;margin-top:2rem;padding-top:2rem;border-top:1px solid rgba(255,255,255,.1);color:#fff9;font-size:.9rem}.switch-button{background:none;border:none;color:#4f8cff;font-weight:600;cursor:pointer;margin-left:.5rem;transition:all .3s ease;text-decoration:underline;text-underline-offset:3px}.switch-button:hover{color:#ff4f8c;text-decoration-color:#ff4f8c}.floating-orbs{position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:0}.orb{position:absolute;border-radius:50%;filter:blur(80px);opacity:.3;animation:orb-float 20s ease-in-out infinite}.orb-1{width:400px;height:400px;background:radial-gradient(circle,#4F8CFF,transparent);top:-200px;left:-200px;animation-duration:25s}.orb-2{width:300px;height:300px;background:radial-gradient(circle,#FF4F8C,transparent);bottom:-150px;right:-150px;animation-duration:30s;animation-delay:-10s}.orb-3{width:250px;height:250px;background:radial-gradient(circle,#8C4FFF,transparent);top:50%;left:50%;transform:translate(-50%,-50%);animation-duration:35s;animation-delay:-20s}@keyframes orb-float{0%,to{transform:translate(0) scale(1)}33%{transform:translate(30px,-50px) scale(1.1)}66%{transform:translate(-20px,30px) scale(.9)}}.modern-input::placeholder{color:transparent}.modern-input{-webkit-text-fill-color:rgba(255,255,255,.9)}.input-group:focus-within .modern-label{color:#fff9}.input-group:focus-within .modern-input:placeholder-shown~.modern-label{color:#fff9}.input-group:focus-within .input-highlight{width:100%;left:0}@media (max-width: 480px){.login-card{padding:2rem}.brand-name{font-size:2rem}.orb{filter:blur(60px)}}.ui-page-container{min-height:100vh;width:100vw;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:1rem;box-sizing:border-box;overflow-x:hidden}html,body,#root{margin:0;padding:0;width:100%;height:100%;overflow-x:hidden}@media (min-width: 768px){.ui-page-container{padding:2rem}}.ui-card{background:var(--color-surface);box-shadow:var(--shadow-lg);border-radius:var(--radius-lg);padding:2rem;width:90%;max-width:400px;display:flex;flex-direction:column;align-items:center;box-sizing:border-box}@media (max-width: 480px){.ui-card{width:95%;padding:1.5rem 1rem}}@media (min-width: 481px) and (max-width: 768px){.ui-card{width:80%;max-width:450px}}@media (min-width: 769px){.ui-card{width:100%;max-width:500px;padding:2.5rem 3rem}}.ui-btn{padding:.9rem 0;width:100%;background:linear-gradient(90deg,var(--color-primary) 60%,var(--color-primary-light) 100%);color:#fff;font-size:1.1rem;font-weight:600;border:none;border-radius:var(--radius-md);box-shadow:var(--shadow-md);cursor:pointer;transition:background var(--transition),box-shadow var(--transition),transform .1s;outline:none}.ui-btn:hover{box-shadow:var(--shadow-lg);background:linear-gradient(90deg,var(--color-primary-light) 0%,var(--color-primary) 100%)}.ui-btn:active{transform:scale(.98)}.ui-btn:disabled{background:#b3d1ff;cursor:not-allowed;box-shadow:none}.ui-btn--secondary{background:#fff;color:var(--color-primary);border:1.5px solid var(--color-primary);box-shadow:var(--shadow-sm)}.ui-btn--secondary:hover{background:rgba(var(--color-primary-rgb),.05);box-shadow:var(--shadow-md)}.ui-input-group{display:flex;flex-direction:column;gap:.4rem}.ui-input-group label{font-size:1rem;color:var(--color-label);font-weight:500;margin-bottom:.1rem}.ui-input-group input{padding:.7rem 1rem;border:none;border-radius:var(--radius-sm);background:var(--color-input-bg);box-shadow:var(--shadow-sm);font-size:1rem;transition:box-shadow var(--transition),background var(--transition);outline:none}.ui-input-group input:focus{background:var(--color-input-focus);box-shadow:0 2px 8px #4f8cff21}.logo-container{display:flex;flex-direction:column;align-items:center;margin-bottom:2.5rem;animation:fadeInUp 1s cubic-bezier(.23,1,.32,1)}.logo-svg{width:80px;height:80px;margin-bottom:.7rem}.logo-circle{stroke-dasharray:176;stroke-dashoffset:176;animation:drawCircle 1s ease-out forwards}.logo-path{opacity:0;transform:scale(.8);transform-origin:50% 50%;animation:popPath .7s .7s cubic-bezier(.23,1,.32,1) forwards}.logo-text{font-size:2.2rem;font-weight:700;letter-spacing:.1em;color:#4f8cff;opacity:0;animation:fadeInText .7s 1.2s forwards}@media (max-width: 480px){.logo-svg{width:70px;height:70px}.logo-text{font-size:2rem}}@keyframes drawCircle{to{stroke-dashoffset:0}}@keyframes popPath{to{opacity:1;transform:scale(1)}}@keyframes fadeInText{to{opacity:1}}.signup-root{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;background:linear-gradient(135deg,#f8fbff,#eaf1ff)}.signup-container{background:#fff;box-shadow:0 8px 32px #4f8cff14,0 1.5px 6px #0000000a;border-radius:1.5rem;padding:2.5rem 2rem 2rem;min-width:320px;max-width:90vw;display:flex;flex-direction:column;align-items:center;animation:fadeInUp .8s .2s cubic-bezier(.23,1,.32,1) backwards}.signup-title{font-size:2rem;font-weight:600;color:#222;margin-bottom:1.5rem;letter-spacing:.04em}.signup-form{width:100%;display:flex;flex-direction:column;gap:1.2rem;max-width:340px;margin:0 auto}@media (min-width: 900px){.signup-form{max-width:500px;gap:1.5rem}}.input-group{display:flex;flex-direction:column;gap:.4rem}.input-group label{font-size:1rem;color:#4f8cff;font-weight:500;margin-bottom:.1rem}.input-group input{padding:.7rem 1rem;border:none;border-radius:.7rem;background:#f3f7ff;box-shadow:0 1px 4px #4f8cff0f;font-size:1rem;transition:box-shadow .2s,background .2s;outline:none}.input-group input:focus{background:#eaf1ff;box-shadow:0 2px 8px #4f8cff21}.signup-btn{margin-top:.5rem;padding:.9rem 0;width:100%;background:linear-gradient(90deg,#4f8cff 60%,#6fa8ff);color:#fff;font-size:1.1rem;font-weight:600;border:none;border-radius:.8rem;box-shadow:0 2px 12px #4f8cff21;cursor:pointer;transition:background .2s,box-shadow .2s,transform .1s}.signup-btn:active{transform:scale(.98)}.signup-btn:disabled{background:#b3d1ff;cursor:not-allowed;box-shadow:none}.signup-message{margin-top:1.2rem;font-size:1rem;text-align:center;border-radius:.5rem;padding:.7rem 1rem;box-shadow:0 1px 4px #4f8cff0f;animation:fadeInUp .5s cubic-bezier(.23,1,.32,1)}.signup-message.success{background:#eafbe7;color:#1a7f37}.signup-message.error{background:#ffeaea;color:#d32f2f}@media (max-width: 480px){.signup-container{min-width:unset;padding:1.2rem .5rem 1.5rem}}.auth-form-container{width:100%;display:flex;flex-direction:column;align-items:center;box-sizing:border-box}.auth-title{font-size:1.8rem;font-weight:600;color:var(--color-text);margin-bottom:1.5rem;letter-spacing:.04em;text-align:center}.auth-form{width:100%;display:flex;flex-direction:column;gap:1.2rem;box-sizing:border-box}.auth-message{margin-top:1.2rem;font-size:.9rem;text-align:center;border-radius:var(--radius-sm);padding:.7rem 1rem;width:100%;box-shadow:var(--shadow-sm);box-sizing:border-box}.auth-message.success{background:var(--color-success-bg);color:var(--color-success)}.auth-message.error{background:var(--color-error-bg);color:var(--color-error)}.auth-nav-links{margin-top:1.5rem;display:flex;justify-content:center;gap:1rem}.auth-nav-link{color:var(--color-primary);text-decoration:none;font-weight:500;font-size:.9rem;transition:opacity .2s}@media (min-width: 768px){.auth-title{font-size:2.2rem;margin-bottom:2rem}.auth-form{gap:1.5rem}.auth-message,.auth-nav-link{font-size:1rem}}.auth-nav-links{margin-top:1.5rem;display:flex;justify-content:center;gap:2rem}.auth-nav-link{color:var(--color-primary);text-decoration:none;font-weight:500;transition:opacity .2s}.auth-nav-link:hover{opacity:.8}@media (min-width: 900px){.auth-title{font-size:2.3rem;margin-bottom:2.5rem}.auth-form{gap:2rem}}.modern-video-card{position:relative;width:100%;max-width:400px;animation:cardEntry .6s ease-out backwards;cursor:pointer}@keyframes cardEntry{0%{opacity:0;transform:translateY(30px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.card-inner{position:relative;background:#ffffff0d;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.1);border-radius:20px;overflow:hidden;transition:all .4s cubic-bezier(.175,.885,.32,1.275);box-shadow:0 8px 32px #0003,inset 0 1px #ffffff1a}.modern-video-card:hover .card-inner{transform:translateY(-8px) scale(1.02);box-shadow:0 20px 60px #4f8cff4d,0 15px 40px #0000004d,inset 0 1px #fff3;border-color:#4f8cff4d}.thumbnail-container{position:relative;width:100%;aspect-ratio:16 / 9;overflow:hidden;background:#00000080}.thumbnail-skeleton{position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(90deg,#ffffff1a,#ffffff0d,#ffffff1a)}.skeleton-pulse{width:100%;height:100%;background:linear-gradient(90deg,transparent 0%,rgba(255,255,255,.1) 50%,transparent 100%);animation:shimmer 2s infinite}@keyframes shimmer{0%{transform:translate(-100%)}to{transform:translate(100%)}}.thumbnail{width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .3s ease}.thumbnail.loaded{opacity:1}.thumbnail-overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(to bottom,transparent 0%,rgba(0,0,0,.7) 100%);opacity:0;transition:opacity .3s ease;display:flex;align-items:center;justify-content:center}.modern-video-card:hover .thumbnail-overlay{opacity:1}.play-icon{width:60px;height:60px;background:#ffffffe6;border-radius:50%;display:flex;align-items:center;justify-content:center;transform:scale(.8);transition:all .3s cubic-bezier(.175,.885,.32,1.275);box-shadow:0 8px 32px #0006}.modern-video-card:hover .play-icon{transform:scale(1);background:linear-gradient(135deg,#4f8cff,#ff4f8c)}.play-icon svg{width:24px;height:24px;color:#0a0a0a;margin-left:3px}.modern-video-card:hover .play-icon svg{color:#fff}.video-duration{position:absolute;bottom:10px;right:10px;background:#000c;color:#fff;padding:4px 8px;border-radius:6px;font-size:.75rem;font-weight:600;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.card-content{padding:1.5rem}.video-title{font-family:var(--font-accent);font-size:1.25rem;font-weight:700;margin:0 0 .5rem;color:#fff;line-height:1.3;letter-spacing:-.01em;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.video-description{font-size:.875rem;color:#fff9;margin:0 0 1rem;line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.card-footer{display:flex;justify-content:space-between;align-items:center;gap:1rem}.video-stats{display:flex;gap:1rem;font-size:.75rem;color:#ffffff80}.stat-item{display:flex;align-items:center;gap:.25rem}.stat-icon{width:16px;height:16px;opacity:.7}.watch-button{position:relative;padding:.625rem 1.25rem;background:linear-gradient(135deg,#4f8cff,#ff4f8c);border:none;border-radius:8px;color:#fff;font-size:.875rem;font-weight:600;cursor:pointer;overflow:hidden;transition:all .3s ease;text-transform:uppercase;letter-spacing:.05em}.watch-button:hover{transform:translateY(-2px);box-shadow:0 6px 20px #4f8cff66}.watch-button:active{transform:translateY(0)}.button-text{position:relative;z-index:1}.button-glow{position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent);transition:left .5s ease}.watch-button:hover .button-glow{left:100%}.card-glow{position:absolute;top:50%;left:50%;width:80%;height:80%;transform:translate(-50%,-50%);background:radial-gradient(circle,rgba(79,140,255,.3) 0%,transparent 70%);opacity:0;transition:opacity .4s ease;pointer-events:none;filter:blur(40px)}.modern-video-card:hover .card-glow{opacity:.6}@media (max-width: 768px){.modern-video-card{max-width:100%}.video-title{font-size:1.125rem}.card-content{padding:1.25rem}}.star-button{position:absolute;top:.75rem;right:3.5rem;width:36px;height:36px;background:#ffffff26;border:none;border-radius:8px;color:#ffffffb3;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s ease;z-index:3;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 2px 8px #0003}.star-button:hover:not(:disabled){background:#fbbf2433;transform:scale(1.05);box-shadow:0 4px 12px #fbbf244d;color:#fbbf24}.star-button.starred{background:#fbbf24e6;color:#fff}.star-button.starred:hover:not(:disabled){background:#f59e0bf2;box-shadow:0 4px 12px #fbbf2480}.star-button:disabled{cursor:not-allowed;opacity:.8}.star-button.starring{animation:pulse .6s ease-in-out}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.2)}}.star-button svg{width:20px;height:20px}.delete-button{position:absolute;top:.75rem;right:.75rem;width:36px;height:36px;background:#ef4444e6;border:none;border-radius:8px;color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s ease;z-index:3;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 2px 8px #0003}.delete-button:hover:not(:disabled){background:#dc2626f2;transform:scale(1.05);box-shadow:0 4px 12px #ef444466}.delete-button:disabled{cursor:not-allowed;opacity:.8}.delete-button svg{width:18px;height:18px}.delete-button .spinner{animation:spin 1s linear infinite}.thumbnail-placeholder{width:100%;height:100%;background:linear-gradient(135deg,#1e293b,#0f172a);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.75rem;color:#64748b}.thumbnail-placeholder svg{width:48px;height:48px;opacity:.5}.thumbnail-placeholder span{font-size:.875rem;font-weight:500;opacity:.7}.thumbnail-processing{position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(135deg,#1e293b,#0f172a);display:flex;flex-direction:column;align-items:center;justify-content:center}.processing-overlay{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem;flex:1}.processing-spinner{width:48px;height:48px;color:#4f8cff;animation:spin 2s linear infinite}.processing-text{text-align:center;color:#fff;font-size:.875rem;font-weight:500;display:flex;flex-direction:column;gap:.25rem}.processing-percentage{font-size:.75rem;opacity:.7}.processing-progress-bar{position:absolute;bottom:0;left:0;right:0;height:4px;background:#ffffff1a}.processing-progress-fill{height:100%;background:linear-gradient(90deg,#4f8cff,#ff4f8c);transition:width .3s ease}.modern-video-card.processing{opacity:.8}.modern-video-card.processing:hover .card-inner{transform:translateY(-4px) scale(1.01);box-shadow:0 15px 40px #4f8cff33,0 10px 30px #0003,inset 0 1px #ffffff1a}.watch-button.disabled{background:#ffffff1a;cursor:not-allowed;opacity:.7}.watch-button.disabled:hover{transform:none;box-shadow:none}.upload-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#000c;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);display:flex;align-items:center;justify-content:center;z-index:1000;animation:fadeIn .2s ease-out}.upload-modal{background:linear-gradient(135deg,#1a1a2e,#16213e);border-radius:20px;width:90%;max-width:600px;max-height:90vh;overflow-y:auto;box-shadow:0 20px 60px #00000080;animation:slideUp .3s ease-out;border:1px solid rgba(255,255,255,.1)}@keyframes slideUp{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}.modal-header{display:flex;justify-content:space-between;align-items:center;padding:2rem;border-bottom:1px solid rgba(255,255,255,.1)}.modal-header h2{font-size:1.5rem;font-weight:600;color:#fff;background:linear-gradient(135deg,#64ffda,#48cae4);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.close-button{background:#ffffff1a;border:1px solid rgba(255,255,255,.2);color:#fff;width:40px;height:40px;border-radius:12px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s ease}.close-button:hover{background:#fff3;transform:scale(1.05)}.close-button svg{width:20px;height:20px}.modal-content{padding:2rem}.error-message{background:#ef44441a;border:1px solid rgba(239,68,68,.3);color:#ef4444;padding:1rem;border-radius:12px;display:flex;align-items:center;gap:.75rem;margin-bottom:1.5rem}.error-message svg{width:20px;height:20px;flex-shrink:0}.form-group{margin-bottom:1.5rem}.form-group label{display:block;font-size:.875rem;font-weight:500;color:#94a3b8;margin-bottom:.5rem}.form-input,.form-textarea{width:100%;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);color:#fff;padding:.75rem 1rem;border-radius:10px;font-size:1rem;transition:all .2s ease}.form-input:focus,.form-textarea:focus{outline:none;border-color:#64ffda;background:#ffffff14;box-shadow:0 0 0 3px #64ffda1a}.form-textarea{resize:vertical;font-family:inherit}.file-drop-zone{background:#ffffff08;border:2px dashed rgba(255,255,255,.2);border-radius:12px;padding:2rem;text-align:center;cursor:pointer;transition:all .2s ease}.file-drop-zone:hover{border-color:#64ffda;background:#64ffda0d}.file-drop-zone.drag-over{border-color:#64ffda;background:#64ffda1a;transform:scale(1.02)}.file-input-hidden{display:none}.file-drop-prompt svg{width:48px;height:48px;margin:0 auto 1rem;color:#64ffda}.file-drop-prompt p{color:#fff;margin-bottom:.5rem}.file-hint{font-size:.875rem;color:#64748b}.file-selected{display:flex;align-items:center;gap:1rem}.file-selected svg{width:48px;height:48px;color:#64ffda;flex-shrink:0}.file-info{text-align:left}.file-name{color:#fff;font-weight:500;margin-bottom:.25rem;word-break:break-all}.file-size{font-size:.875rem;color:#64748b}.upload-progress{text-align:center;padding:3rem 0}.progress-icon{margin-bottom:1.5rem}.progress-spinner{width:64px;height:64px;color:#64ffda;animation:spin 1s linear infinite}.upload-progress h3{font-size:1.25rem;color:#fff;margin-bottom:.5rem}.upload-progress p{color:#94a3b8;margin-bottom:1.5rem}.progress-bar{width:100%;height:8px;background:#ffffff1a;border-radius:4px;overflow:hidden}.progress-fill{height:100%;background:linear-gradient(90deg,#64ffda,#48cae4);border-radius:4px;transition:width .3s ease}.upload-success{text-align:center;padding:3rem 0}.upload-success svg{width:64px;height:64px;color:#10b981;margin-bottom:1.5rem}.upload-success h3{font-size:1.25rem;color:#fff;margin-bottom:.5rem}.upload-success p{color:#94a3b8}.modal-footer{padding:1.5rem 2rem;border-top:1px solid rgba(255,255,255,.1);display:flex;justify-content:flex-end;gap:1rem}.button-primary,.button-secondary{padding:.75rem 1.5rem;border-radius:10px;font-size:1rem;font-weight:500;cursor:pointer;transition:all .2s ease;border:none}.button-primary{background:linear-gradient(135deg,#64ffda,#48cae4);color:#0f172a}.button-primary:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 8px 20px #64ffda4d}.button-primary:disabled{opacity:.5;cursor:not-allowed}.button-secondary{background:#ffffff1a;color:#fff;border:1px solid rgba(255,255,255,.2)}.button-secondary:hover{background:#ffffff26}.upload-modal::-webkit-scrollbar{width:8px}.upload-modal::-webkit-scrollbar-track{background:#ffffff0d;border-radius:4px}.upload-modal::-webkit-scrollbar-thumb{background:#fff3;border-radius:4px}.upload-modal::-webkit-scrollbar-thumb:hover{background:#ffffff4d}.video-type-label{margin-bottom:.75rem}.video-type-toggle{display:flex;gap:1rem;margin-top:.5rem}.toggle-option{flex:1;cursor:pointer}.toggle-option input[type=radio]{position:absolute;opacity:0;width:0;height:0}.toggle-label{display:flex;align-items:center;gap:.75rem;padding:1rem;border:2px solid rgba(255,255,255,.2);border-radius:12px;background:#ffffff0d;transition:all .3s ease;font-size:.95rem;color:#ffffffb3}.toggle-label svg{width:24px;height:24px;flex-shrink:0}.toggle-option input[type=radio]:checked+.toggle-label{border-color:#4f8cff;background:#4f8cff1a;color:#fff;box-shadow:0 0 20px #4f8cff4d}.toggle-label:hover{border-color:#ffffff4d;background:#ffffff1a}@media (max-width: 600px){.video-type-toggle{flex-direction:column}}.storage-usage-container{background:#ffffff0d;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.1);border-radius:16px;padding:1.5rem;margin-bottom:2rem;box-shadow:0 8px 32px #0003,inset 0 1px #ffffff1a;animation:fadeInUp .6s ease-out}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.storage-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.storage-title{display:flex;align-items:center;gap:.75rem;font-size:1.125rem;font-weight:600;color:#fff}.storage-title svg{width:24px;height:24px;color:#4f8cff}.storage-stats{display:flex;align-items:center;gap:.75rem;font-size:.875rem;color:#ffffffb3}.stat-item strong{color:#fff;font-weight:600}.stat-divider{color:#ffffff4d}.storage-bar-wrapper{margin-bottom:.75rem}.storage-bar-background{position:relative;width:100%;height:24px;background:#ffffff1a;border-radius:12px;overflow:hidden;box-shadow:inset 0 2px 4px #0003}.storage-bar-fill{position:relative;height:100%;border-radius:12px;transition:all .6s cubic-bezier(.4,0,.2,1);overflow:hidden}.storage-bar-glow{position:absolute;top:0;left:0;right:0;bottom:0;opacity:.3;filter:blur(10px);animation:pulse 2s ease-in-out infinite}@keyframes pulse{0%,to{opacity:.3}50%{opacity:.5}}.storage-percentage{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:.75rem;font-weight:700;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.3);letter-spacing:.05em}.storage-details{display:flex;justify-content:space-between;align-items:center;font-size:.875rem}.storage-used{color:#fff9}.storage-warning{font-weight:600;animation:blink 2s ease-in-out infinite}@keyframes blink{0%,to{opacity:1}50%{opacity:.7}}.storage-usage-skeleton{animation:shimmer 2s infinite}.skeleton-text{width:150px;height:20px;background:#ffffff1a;border-radius:4px;margin-bottom:1rem}.skeleton-bar{width:100%;height:24px;background:#ffffff1a;border-radius:12px;position:relative;overflow:hidden}.skeleton-bar:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent 0%,rgba(255,255,255,.1) 50%,transparent 100%);animation:shimmer 2s infinite}@keyframes shimmer{0%{transform:translate(-100%)}to{transform:translate(200%)}}@media (max-width: 768px){.storage-usage-container{padding:1.25rem;margin-bottom:1.5rem}.storage-header{flex-direction:column;align-items:flex-start;gap:.75rem}.storage-details{flex-direction:column;align-items:flex-start;gap:.5rem}}.modern-video-list{min-height:100vh;padding:6rem 2rem 2rem;max-width:1600px;margin:0 auto;position:relative}.list-header{margin-bottom:3rem;animation:fadeInUp .8s ease-out}.header-actions{display:flex;justify-content:space-between;align-items:center;gap:2rem;flex-wrap:wrap}.header-content{text-align:center;margin-bottom:3rem}.list-title{font-family:var(--font-accent);font-size:3.5rem;font-weight:800;margin:0 0 .5rem;line-height:1.2;background:linear-gradient(135deg,#fff,#fffc);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;display:flex;flex-direction:column;align-items:center;gap:.25rem;letter-spacing:-.03em}.title-accent{font-size:1.5rem;font-weight:400;background:linear-gradient(90deg,#4f8cff,#ff4f8c);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;letter-spacing:.1em}.list-subtitle{font-size:1.125rem;color:#fff9;max-width:600px;margin:0 auto}.filter-tabs{display:flex;justify-content:center;gap:1rem;flex-wrap:wrap}.filter-tab{display:flex;align-items:center;gap:.5rem;padding:.75rem 1.5rem;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:12px;color:#ffffffb3;font-weight:500;cursor:pointer;transition:all .3s ease;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.filter-tab:hover{background:#ffffff14;border-color:#fff3;color:#fff;transform:translateY(-2px)}.filter-tab.active{background:linear-gradient(135deg,#4f8cff33,#ff4f8c33);border-color:#4f8cff80;color:#fff}.tab-icon{font-size:1.125rem}.video-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(350px,1fr));gap:2rem;margin-bottom:4rem}.video-card-skeleton{animation:fadeIn .6s ease-out}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.skeleton-thumbnail{width:100%;aspect-ratio:16 / 9;background:linear-gradient(90deg,#ffffff0d,#ffffff1a,#ffffff0d);border-radius:16px 16px 0 0;position:relative;overflow:hidden}.skeleton-thumbnail:after{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent 0%,rgba(255,255,255,.1) 50%,transparent 100%);animation:shimmer 2s infinite}.skeleton-content{padding:1.5rem;background:#ffffff0d;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.1);border-radius:0 0 16px 16px;border-top:none}.skeleton-title{height:24px;background:#ffffff1a;border-radius:4px;margin-bottom:1rem}.skeleton-text{height:16px;background:#ffffff0d;border-radius:4px;margin-bottom:.5rem}.skeleton-text.short{width:60%}.error-state,.empty-state{text-align:center;padding:4rem 2rem;display:flex;flex-direction:column;align-items:center;gap:1.5rem;animation:fadeInUp .6s ease-out}.error-icon,.empty-icon{width:80px;height:80px;color:#ffffff80;background:#ffffff0d;border-radius:50%;display:flex;align-items:center;justify-content:center;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.error-icon svg,.empty-icon svg{width:40px;height:40px}.error-state h2,.empty-state h2{font-size:1.75rem;margin:0;color:#fff}.error-state p,.empty-state p{color:#fff9;margin:0}.retry-button{padding:.875rem 2rem;background:linear-gradient(135deg,#4f8cff,#ff4f8c);border:none;border-radius:12px;color:#fff;font-weight:600;cursor:pointer;transition:all .3s ease;text-transform:uppercase;letter-spacing:.05em}.retry-button:hover{transform:translateY(-2px);box-shadow:0 8px 32px #4f8cff66}.floating-gradient-orb{position:fixed;width:600px;height:600px;background:radial-gradient(circle,rgba(79,140,255,.2) 0%,rgba(255,79,140,.1) 50%,transparent 70%);border-radius:50%;filter:blur(100px);pointer-events:none;animation:floatOrb 20s ease-in-out infinite;z-index:-1}@keyframes floatOrb{0%,to{transform:translate(0) scale(1)}33%{transform:translate(100px,-100px) scale(1.1)}66%{transform:translate(-100px,50px) scale(.9)}}@media (max-width: 1200px){.video-grid{grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}}@media (max-width: 768px){.modern-video-list{padding:5rem 1rem 2rem}.list-title{font-size:2.5rem}.title-accent{font-size:1.25rem}.video-grid{grid-template-columns:1fr;gap:1.5rem}.filter-tabs{width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;padding-bottom:.5rem}}.upload-button{display:flex;align-items:center;gap:.75rem;padding:.875rem 1.5rem;background:linear-gradient(135deg,#64ffda,#48cae4);color:#0f172a;border:none;border-radius:12px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 15px #64ffda40}.upload-button:hover{transform:translateY(-2px);box-shadow:0 8px 25px #64ffda59}.upload-button svg{width:20px;height:20px}.upload-button-primary{display:inline-flex;align-items:center;gap:.75rem;margin-top:2rem;padding:1rem 2rem;background:linear-gradient(135deg,#64ffda,#48cae4);color:#0f172a;border:none;border-radius:12px;font-size:1.125rem;font-weight:600;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 20px #64ffda4d}.upload-button-primary:hover{transform:translateY(-3px);box-shadow:0 8px 30px #64ffda66}.upload-button-primary svg{width:24px;height:24px}.processing-indicator{display:flex;align-items:center;gap:.5rem;font-size:.875rem;color:#4f8cff;margin-left:1rem;font-weight:500}.processing-indicator .processing-spinner{width:20px;height:20px;animation:spin 2s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.modern-header{position:fixed;top:0;left:0;right:0;z-index:1000;background:#0a0a0a4d;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-bottom:1px solid rgba(255,255,255,.1);transition:all .3s ease;overflow:visible}.modern-header.scrolled{background:#0a0a0acc;-webkit-backdrop-filter:blur(30px);backdrop-filter:blur(30px);box-shadow:0 8px 32px #0003}.header-container{max-width:1400px;margin:0 auto;padding:1rem 2rem;display:flex;align-items:center;justify-content:space-between}.logo-section{display:flex;align-items:center;gap:.75rem;cursor:pointer;transition:transform .3s ease}.logo-section:hover{transform:translateY(-2px)}.logo-icon{position:relative;animation:float 6s ease-in-out infinite;filter:drop-shadow(0 0 10px rgba(79,140,255,.3))}@keyframes float{0%,to{transform:translateY(0) scale(1);filter:drop-shadow(0 0 10px rgba(79,140,255,.3))}50%{transform:translateY(-3px) scale(1.05);filter:drop-shadow(0 0 15px rgba(255,79,140,.4))}}.logo-circle-animated{animation:rotate 20s linear infinite;transform-origin:center}.logo-inner-animated{animation:pulse 3s ease-in-out infinite}@keyframes rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes pulse{0%,to{opacity:.2}50%{opacity:.4}}.eyeball-container{animation:eyeball-fade 4s ease-in-out infinite}.eyeball-pupil{animation:eyeball-look 12s cubic-bezier(.4,0,.2,1) infinite;transform-origin:center}@keyframes eyeball-fade{0%,to{opacity:.6;transform:scale(1)}50%{opacity:1;transform:scale(1.1)}}@keyframes eyeball-look{0%{transform:translate(0)}5%{transform:translate(8px,-8px)}15%{transform:translate(8px,-8px)}25%{transform:translate(-6px,-8px)}27%{transform:translate(-6px,6px)}35%{transform:translateY(6px)}45%{transform:translate(8px,6px)}48%{transform:translate(0)}58%{transform:translate(0)}60%{transform:translate(-8px)}70%{transform:translate(-8px,-6px)}75%{transform:translate(-6px,-8px)}78%{transform:translate(6px,6px)}90%{transform:translate(3px,3px)}to{transform:translate(0)}}.logo-text{font-family:var(--font-display);font-size:1.5rem;font-weight:700;background:linear-gradient(135deg,#4f8cff,#ff4f8c);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;letter-spacing:-.02em}.nav-menu{display:flex;gap:1rem;margin-top:10px;margin-bottom:10px}.nav-link{display:flex;align-items:center;gap:.5rem;padding:.625rem 1.25rem;color:#ffffffb3;text-decoration:none;font-weight:500;border-radius:12px;transition:all .3s ease;position:relative;overflow:visible}.nav-link:hover{color:#fff;background:#ffffff0d;transform:translateY(-2px)}.nav-link.active{color:#fff;background:#4f8cff1a}.nav-link.active:before{content:"";position:absolute;bottom:0;left:0;right:0;height:2px;background:linear-gradient(90deg,#4f8cff,#ff4f8c)}.nav-icon{font-size:1.125rem}.nav-link.disabled{cursor:not-allowed;opacity:.6;position:relative}.nav-link.disabled:hover{transform:none;background:transparent;color:#ffffffb3}.coming-soon-badge{position:absolute;top:-12px;right:-15px;background:linear-gradient(135deg,#ff1744,#ff4f8c);color:#fff;font-size:.75rem;font-weight:800;padding:5px 12px;border-radius:20px;text-transform:uppercase;letter-spacing:.08em;box-shadow:0 6px 20px #ff174499,0 0 30px #ff4f8c66,inset 0 1px #ffffff4d;animation:pulse 2s ease-in-out infinite;z-index:10;border:2px solid rgba(255,255,255,.3);transform:rotate(15deg);white-space:nowrap}@keyframes pulse{0%,to{transform:scale(1) rotate(15deg);box-shadow:0 6px 20px #ff174499,0 0 30px #ff4f8c66,inset 0 1px #ffffff4d}50%{transform:scale(1.1) rotate(15deg);box-shadow:0 8px 30px #ff1744cc,0 0 40px #ff4f8c99,inset 0 1px #fff6}}.header-actions{display:flex;align-items:center;gap:1rem}.user-menu{position:relative}.user-button{display:flex;align-items:center;gap:.75rem;padding:.5rem 1rem;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:12px;color:#fff;cursor:pointer;transition:all .3s ease}.user-button:hover{background:#ffffff14;border-color:#fff3;transform:translateY(-2px)}.user-avatar{width:32px;height:32px;background:linear-gradient(135deg,#4f8cff,#ff4f8c);border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:600;font-size:.875rem}.user-email{font-size:.875rem;max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.chevron{width:16px;height:16px;transition:transform .3s ease}.user-menu:hover .chevron{transform:rotate(180deg)}.user-dropdown{position:absolute;top:100%;right:0;margin-top:.5rem;min-width:200px;background:#141414f2;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.1);border-radius:12px;box-shadow:0 8px 32px #0006;opacity:0;visibility:hidden;transform:translateY(-10px);transition:all .3s ease}.user-menu:hover .user-dropdown{opacity:1;visibility:visible;transform:translateY(0)}.dropdown-item{display:flex;align-items:center;gap:.75rem;padding:.75rem 1rem;color:#fffc;text-decoration:none;border:none;background:none;width:100%;text-align:left;cursor:pointer;transition:all .2s ease}.dropdown-item:hover{background:#ffffff0d;color:#fff;padding-left:1.25rem}.dropdown-item.logout:hover{background:#ff4f8c1a}.dropdown-item.disabled{cursor:not-allowed;opacity:.6;position:relative;justify-content:space-between}.dropdown-item.disabled:hover{background:transparent;color:#fffc;padding-left:1rem}.coming-soon-text{font-size:.625rem;font-weight:600;color:#4f8cff;text-transform:uppercase;letter-spacing:.05em;margin-left:auto;background:#4f8cff1a;padding:2px 8px;border-radius:8px}.dropdown-divider{height:1px;background:#ffffff1a;margin:.5rem 0}.mobile-menu-toggle{display:none;background:none;border:none;cursor:pointer;padding:.5rem}.hamburger{display:block;width:24px;height:2px;background:#fff;position:relative;transition:all .3s ease}.hamburger:before,.hamburger:after{content:"";position:absolute;width:100%;height:100%;background:#fff;transition:all .3s ease}.hamburger:before{top:-8px}.hamburger:after{bottom:-8px}.hamburger.open{background:transparent}.hamburger.open:before{top:0;transform:rotate(45deg)}.hamburger.open:after{bottom:0;transform:rotate(-45deg)}@media (max-width: 768px){.header-container{padding:1rem}.nav-menu{position:fixed;top:100%;left:0;right:0;background:#0a0a0af2;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-top:1px solid rgba(255,255,255,.1);flex-direction:column;padding:1rem;transform:translateY(-100vh);transition:transform .3s ease}.nav-menu.open{transform:translateY(0)}.mobile-menu-toggle{display:block}.user-email{display:none}}.modern-layout{position:relative;min-height:100vh;overflow-x:hidden}.three-background{position:fixed;top:0;left:0;width:100%;height:100%;z-index:-1}.content-wrapper{position:relative;z-index:1;min-height:100vh}.video-player{width:100%;max-width:1200px;margin:0 auto;background:#000;border-radius:8px;overflow:hidden;box-shadow:0 4px 6px #0000001a}.video-container{position:relative;width:100%;aspect-ratio:16 / 9;background:#000}.video-loading{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center;color:#fff}.loading-spinner{width:50px;height:50px;border:3px solid rgba(255,255,255,.3);border-radius:50%;border-top-color:#fff;animation:spin 1s ease-in-out infinite;margin:0 auto 1rem}@keyframes spin{to{transform:rotate(360deg)}}.video-element{width:100%;height:100%;object-fit:contain}.video-controls{display:flex;align-items:center;gap:1rem;padding:1rem;background:#1a1a1a;border-top:1px solid #333}.play-pause-btn{background:#06c;border:none;color:#fff;padding:.5rem 1rem;border-radius:4px;font-size:1.2rem;cursor:pointer;transition:background .2s}.play-pause-btn:hover:not(:disabled){background:#0052a3}.play-pause-btn:disabled{background:#666;cursor:not-allowed;opacity:.5}.time-display{color:#fff;font-size:.875rem;min-width:100px;text-align:center}.seek-bar{flex:1;height:6px;border-radius:3px;background:#333;outline:none;cursor:pointer;-webkit-appearance:none}.seek-bar::-webkit-slider-thumb{-webkit-appearance:none;width:16px;height:16px;border-radius:50%;background:#06c;cursor:pointer}.seek-bar::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:#06c;cursor:pointer;border:none}.sync-status{display:flex;justify-content:space-between;align-items:center;padding:.75rem 1rem;background:#222;color:#fff;font-size:.875rem}.connection-indicator{display:flex;align-items:center;gap:.5rem}.connection-indicator.connected{color:#4ade80}.connection-indicator.disconnected{color:#f87171}.viewer-count{color:#9ca3af}.video-metadata{display:flex;gap:2rem;margin-top:1.5rem;padding-top:1.5rem;border-top:1px solid rgba(255,255,255,.1);flex-wrap:wrap;justify-content:center}.metadata-item{display:flex;align-items:center;gap:.5rem;color:#fffc;font-size:.875rem}.metadata-icon{width:18px;height:18px;color:var(--color-primary)}.watch-page-loading{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:2rem}.loading-spinner-container{text-align:center;display:flex;flex-direction:column;align-items:center;gap:1.5rem}.loading-spinner{width:60px;height:60px;color:var(--color-primary)}.loading-spinner-container p{color:#fffc;font-size:1.125rem;margin:0}.watch-page-error{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:2rem}.error-container{text-align:center;max-width:500px;background:#ffffff0d;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.1);border-radius:20px;padding:3rem 2rem;animation:fadeInUp .6s ease-out}.error-icon{width:80px;height:80px;margin:0 auto 1.5rem;color:#ff4f8ccc;background:#ff4f8c1a;border-radius:50%;display:flex;align-items:center;justify-content:center}.error-icon svg{width:40px;height:40px}.error-container h2{color:#fff;margin:0 0 1rem;font-size:1.75rem;font-weight:600}.error-container p{color:#ffffffb3;margin:0 0 2rem;line-height:1.6}.watch-page-choose{min-height:100vh;padding:6rem 2rem 2rem;display:flex;align-items:center;justify-content:center}.choose-container{max-width:800px;width:100%;animation:fadeInUp .8s ease-out}.choose-header{text-align:center;margin-bottom:3rem}.choose-header h1{font-size:2.5rem;font-weight:700;margin:0 0 1rem;background:linear-gradient(135deg,#fff,#fffc);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.choose-header p{font-size:1.125rem;color:#ffffffb3;max-width:600px;margin:0 auto}.review-mode-options{display:grid;grid-template-columns:repeat(auto-fit,minmax(350px,1fr));gap:2rem;margin-bottom:3rem}.mode-option{background:#ffffff0d;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.1);border-radius:20px;padding:2rem;cursor:pointer;transition:all .3s ease;text-align:left;display:flex;gap:1.5rem;align-items:flex-start;position:relative;overflow:hidden}.mode-option:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(135deg,#4f8cff1a,#ff4f8c1a);opacity:0;transition:opacity .3s ease}.mode-option:hover{transform:translateY(-4px);border-color:#4f8cff4d;box-shadow:0 12px 40px #4f8cff33}.mode-option:hover:before{opacity:1}.mode-icon{width:60px;height:60px;background:#ffffff1a;border-radius:16px;display:flex;align-items:center;justify-content:center;color:#fffc;flex-shrink:0;position:relative;z-index:1}.mode-icon svg{width:28px;height:28px}.mode-content{flex:1;position:relative;z-index:1}.mode-content h3{color:#fff;font-size:1.375rem;font-weight:600;margin:0 0 .5rem}.mode-content p{color:#ffffffb3;margin:0 0 1rem;line-height:1.5}.mode-badge{display:inline-block;background:linear-gradient(135deg,#4f8cff33,#ff4f8c33);border:1px solid rgba(79,140,255,.3);border-radius:12px;padding:.25rem .75rem;font-size:.875rem;color:#ffffffe6;font-weight:500}.watch-page-analyst{min-height:100vh;padding:6rem 2rem 2rem}.analyst-controls{margin-bottom:2rem}.back-to-options-btn{background:#ffffff0d;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.1);border-radius:12px;color:#fffc;padding:.75rem 1.5rem;cursor:pointer;transition:all .3s ease;font-weight:500}.back-to-options-btn:hover{background:#ffffff14;border-color:#fff3;color:#fff;transform:translateY(-2px)}.analyst-footer{margin-top:3rem;text-align:center}.back-link{display:inline-flex;align-items:center;gap:.5rem;color:#ffffffb3;text-decoration:none;font-weight:500;padding:.75rem 1.5rem;background:#ffffff0d;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.1);border-radius:12px;transition:all .3s ease}.back-link:hover{color:#fff;background:#ffffff14;border-color:#fff3;transform:translateY(-2px)}@keyframes fadeInUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@keyframes dash{0%{stroke-dasharray:1,200;stroke-dashoffset:0}50%{stroke-dasharray:80,200;stroke-dashoffset:-35px}to{stroke-dasharray:80,200;stroke-dashoffset:-124px}}@media (max-width: 768px){.choose-header h1{font-size:2rem}.review-mode-options{grid-template-columns:1fr;gap:1.5rem}.mode-option{padding:1.5rem;gap:1rem}.mode-icon{width:50px;height:50px}.mode-icon svg{width:24px;height:24px}.watch-page-choose,.watch-page-analyst{padding:5rem 1rem 2rem}}
