:root{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;line-height:1.5;font-weight:400;color:#fff;background-color:#0a0a0a;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0;min-width:320px;min-height:100vh}#root{width:100%}*{box-sizing:border-box}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:#0a0a0a;color:#fff;min-height:100vh}.app{min-height:100vh;display:flex;flex-direction:column}.main{flex:1;max-width:1200px;margin:0 auto;padding:2rem;width:100%}.nav{display:flex;justify-content:space-between;align-items:center;padding:1rem 2rem;background:#111;border-bottom:1px solid #222}.nav-logo{font-size:1.25rem;font-weight:700;color:#fff;text-decoration:none;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.nav-links{display:flex;gap:2rem}.nav-link{color:#888;text-decoration:none;font-size:.95rem;transition:color .2s ease}.nav-link:hover{color:#fff}.nav-link.active{color:#667eea}.homepage{text-align:center;padding:3rem 0}.hero{margin-bottom:3rem}.hero h1{font-size:3.5rem;margin:0;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.hero .tagline{font-size:1.25rem;color:#888;margin:1rem 0 .5rem}.hero .description{color:#666;margin:0}.home-buttons{display:flex;gap:1rem;justify-content:center;margin-bottom:4rem}.home-btn{padding:1rem 2.5rem;border-radius:8px;font-size:1rem;font-weight:500;text-decoration:none;transition:all .2s ease}.home-btn.primary{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.home-btn.primary:hover{opacity:.9;transform:translateY(-2px)}.home-btn.secondary{background:transparent;color:#fff;border:1px solid #333}.home-btn.secondary:hover{border-color:#667eea;background:#667eea1a}.home-features{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:2rem;margin-top:2rem}.feature{background:#1a1a1a;border-radius:12px;padding:2rem;text-align:center}.feature-icon{font-size:2.5rem;display:block;margin-bottom:1rem}.feature h3{margin:0 0 .5rem;font-size:1.1rem}.feature p{margin:0;color:#888;font-size:.9rem}.videos-page{max-width:900px;margin:0 auto}.videos-header{text-align:center;margin-bottom:2rem}.videos-header h1{font-size:2rem;margin:0;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.videos-header p{color:#888;margin:.5rem 0 0}.password-gate{background:#1a1a1a;border-radius:12px;padding:3rem 2rem;text-align:center}.password-gate p{color:#888;margin:0 0 1.5rem}.password-input-group{display:flex;gap:1rem;justify-content:center;max-width:400px;margin:0 auto}.password-input-group input{flex:1;padding:.75rem 1rem;border:1px solid #333;border-radius:8px;background:#0a0a0a;color:#fff;font-size:1rem}.password-input-group input:focus{outline:none;border-color:#667eea}.password-input-group button{padding:.75rem 1.5rem;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;border-radius:8px;font-size:1rem;cursor:pointer;transition:opacity .2s ease}.password-input-group button:hover{opacity:.9}.access-bar{display:flex;justify-content:space-between;align-items:center;background:#1a1a1a;padding:.75rem 1.25rem;border-radius:8px;margin-bottom:1.5rem}.access-bar span{color:#4ade80;font-size:.875rem}.logout-btn{background:transparent;color:#888;border:1px solid #333;padding:.5rem 1rem;border-radius:6px;font-size:.8rem;cursor:pointer;transition:all .2s ease}.logout-btn:hover{color:#fff;border-color:#666}.blog-page{max-width:800px;margin:0 auto}.blog-header{text-align:center;margin-bottom:3rem}.blog-header h1{font-size:2rem;margin:0;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.blog-header p{color:#888;margin:.5rem 0 0}.blog-coming-soon{text-align:center;padding:4rem 2rem;background:#1a1a1a;border-radius:12px}.blog-coming-soon p{margin:0;font-size:1.25rem;color:#666}.blog-coming-soon .blog-subtext{font-size:.9rem;margin-top:.5rem}.upload-form{background:#1a1a1a;border-radius:12px;padding:2rem;margin-bottom:2rem}.upload-form h2{margin:0 0 1.5rem;font-size:1.25rem}.form-fields{display:flex;gap:1rem;margin-bottom:1rem}.form-fields input{flex:1;padding:.75rem 1rem;border:1px solid #333;border-radius:8px;background:#0a0a0a;color:#fff;font-size:1rem}.form-fields input:focus{outline:none;border-color:#667eea}.form-fields input:disabled{opacity:.5}.drop-zone{border:2px dashed #333;border-radius:12px;padding:3rem 2rem;text-align:center;cursor:pointer;transition:all .2s ease}.drop-zone:hover{border-color:#667eea;background:#667eea0d}.drop-zone.dragging{border-color:#667eea;background:#667eea1a}.drop-zone.uploading{cursor:default;border-color:#667eea}.drop-zone p{margin:.25rem 0;color:#888}.progress-container{width:100%}.progress-bar{width:100%;height:8px;background:#333;border-radius:4px;overflow:hidden;margin-bottom:1rem}.progress-fill{height:100%;background:linear-gradient(90deg,#667eea,#764ba2);transition:width .3s ease}.error{color:#ff6b6b;margin:1rem 0 0}.video-list{background:#1a1a1a;border-radius:12px;padding:2rem}.video-list h2{margin:0 0 1.5rem;font-size:1.25rem}.video-list-loading,.video-list-error,.video-list-empty{text-align:center;padding:3rem;color:#888}.video-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1rem}.video-card{background:#0a0a0a;border:1px solid #333;border-radius:8px;padding:1.25rem;display:flex;flex-direction:column;gap:1rem}.video-icon{font-size:2rem}.video-info{flex:1}.video-name{font-size:1rem;margin:0 0 .5rem;word-break:break-word}.video-event{color:#667eea;font-size:.875rem;margin:0 0 .25rem}.video-description{color:#888;font-size:.875rem;margin:0 0 .5rem}.video-meta{display:flex;gap:1rem;font-size:.75rem;color:#666}.download-btn{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;border-radius:6px;padding:.75rem 1.5rem;font-size:.875rem;cursor:pointer;transition:opacity .2s ease}.download-btn:hover{opacity:.9}.download-btn:disabled{opacity:.5;cursor:default}.footer{text-align:center;padding:2rem;color:#666;font-size:.875rem;border-top:1px solid #222;background:#111}.footer p{margin:0}@media(max-width:600px){.main,.nav{padding:1rem}.nav-links{gap:1rem}.hero h1{font-size:2.5rem}.home-buttons{flex-direction:column;padding:0 2rem}.form-fields{flex-direction:column}.video-grid{grid-template-columns:1fr}}
