*{margin:0;padding:0;box-sizing:border-box}body{font-family:'Segoe UI',Roboto,'Helvetica Neue',sans-serif;background:#f5f5f5;color:#1a1a1a;overflow-x:hidden;position:relative;min-height:100vh}.app-container{position:relative;z-index:1;max-width:1400px;margin:0 auto;padding:0 24px 20px 24px}.main-header{display:flex;justify-content:space-between;align-items:center;padding:20px 0 16px;border-bottom:1px solid rgba(0,0,0,.1);margin-bottom:28px;flex-wrap:wrap;background:#fff;border-radius:16px;padding:16px 24px;box-shadow:0 2px 8px rgba(0,0,0,.05)}.logo-area{display:flex;align-items:center;gap:12px}.logo-icon{font-size:32px}.logo-text{font-size:1.8rem;font-weight:700;background:linear-gradient(135deg,#e50914,#ff6b6b);-webkit-background-clip:text;background-clip:text;color:transparent;letter-spacing:-.5px}.badge-live{background-color:#e50914;font-size:.7rem;font-weight:700;padding:4px 8px;border-radius:20px;text-transform:uppercase;letter-spacing:.5px;color:#fff}.header-actions{display:flex;gap:16px}.icon-btn{background:rgba(0,0,0,.05);border:none;font-size:1.5rem;padding:8px 12px;border-radius:40px;color:#333;cursor:pointer;transition:.2s}.icon-btn:hover{background:rgba(0,0,0,.1)}.featured-section{margin-bottom:40px;border-radius:20px;overflow:hidden;background:#fff;box-shadow:0 4px 12px rgba(0,0,0,.1);transition:.2s}.featured-card{display:flex;flex-direction:column}.featured-thumbnail{position:relative;width:100%}.featured-thumbnail img{width:100%;display:block;object-fit:cover;aspect-ratio:16/9}.play-overlay{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background:rgba(0,0,0,.7);width:70px;height:70px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:34px;color:#fff;backdrop-filter:blur(4px);border:2px solid rgba(255,255,255,.5)}.featured-info{padding:16px 20px;background:#fff}.featured-info h3{font-size:1.4rem;margin-bottom:6px;color:#1a1a1a}.featured-info p{color:#666;font-size:.85rem}.video-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:24px;margin-bottom:40px}.video-card{background:#fff;border-radius:16px;overflow:hidden;transition:.2s ease;cursor:pointer;box-shadow:0 2px 8px rgba(0,0,0,.1)}.video-card:hover{transform:translateY(-4px);box-shadow:0 8px 20px rgba(0,0,0,.15)}.video-thumb{position:relative;width:100%;aspect-ratio:16/9;background:#e0e0e0}.video-thumb img{width:100%;height:100%;object-fit:cover;display:block}.duration{position:absolute;bottom:8px;right:8px;background:rgba(0,0,0,.75);padding:3px 6px;border-radius:6px;font-size:.7rem;font-weight:500;color:#fff}.video-meta{padding:12px 14px}.video-meta h4{font-size:1rem;margin-bottom:6px;font-weight:600;color:#1a1a1a;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.video-meta p{font-size:.75rem;color:#666}.section-title{font-size:1.25rem;font-weight:600;margin:20px 0 16px 0;letter-spacing:-.2px;border-left:4px solid #e50914;padding-left:12px;color:#1a1a1a}.channels-row{display:flex;flex-wrap:wrap;gap:14px;margin-bottom:40px}.channel{background:#fff;padding:8px 20px;border-radius:40px;font-size:.9rem;font-weight:500;color:#333;cursor:pointer;transition:.2s;box-shadow:0 1px 4px rgba(0,0,0,.1)}.channel:hover{background:#f0f0f0;transform:translateY(-2px)}.bottom-nav{display:flex;justify-content:space-between;background:#fff;border-radius:32px;padding:10px 20px;margin-top:20px;box-shadow:0 -2px 8px rgba(0,0,0,.05)}.nav-btn{background:0 0;border:none;color:#555;font-size:1rem;font-weight:500;padding:10px 16px;border-radius:30px;cursor:pointer;transition:.2s}.nav-btn:hover{background:rgba(0,0,0,.05);color:#e50914}.auth-modal{position:fixed;top:0;left:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center;z-index:100;background-color:rgba(0,0,0,.5);backdrop-filter:blur(2px);animation:fadeIn .25s ease-out}@keyframes fadeIn{from{opacity:0;backdrop-filter:blur(0)}to{opacity:1;backdrop-filter:blur(2px)}}.auth-card{background:#fff;border-radius:32px;width:90%;max-width:440px;padding:32px 28px 38px;box-shadow:0 25px 45px rgba(0,0,0,.2);text-align:center;transition:transform .2s}.auth-header{margin-bottom:28px}.lock-icon{font-size:48px;background:#f0f0f0;width:80px;height:80px;margin:0 auto 16px;display:flex;align-items:center;justify-content:center;border-radius:50%;box-shadow:inset 0 0 4px rgba(0,0,0,.1),0 6px 12px rgba(0,0,0,.1)}.auth-header h2{font-size:1.8rem;font-weight:600;margin-bottom:8px;color:#1a1a1a}.auth-header p{color:#666;font-size:.9rem}.auth-form{display:flex;flex-direction:column;gap:20px}.input-group{text-align:left;width:100%}.input-group label{display:block;font-size:.8rem;font-weight:500;margin-bottom:6px;color:#333;letter-spacing:.3px}.input-group input{width:100%;padding:14px 18px;background:#f8f8f8;border:1px solid #ddd;border-radius:28px;font-size:1rem;color:#1a1a1a;outline:0;transition:all .2s;font-family:inherit;box-sizing:border-box}.input-group input:focus{border-color:#e50914;background:#fff;box-shadow:0 0 0 2px rgba(229,9,20,.1)}.login-button{background:#e50914;border:none;padding:14px 18px;border-radius:40px;font-size:1rem;font-weight:700;color:#fff;cursor:pointer;transition:.2s;margin-top:8px;font-family:inherit;box-shadow:0 4px 12px rgba(229,9,20,.3);width:100%}.login-button:hover{background:#f81c2a;transform:scale(.98)}.error-message{font-size:.85rem;color:#e50914;background:rgba(229,9,20,.08);padding:10px 12px;border-radius:32px;text-align:center;min-height:50px;word-break:break-word;font-weight:500}@media (max-width:720px){.app-container{padding:0 16px 12px}.logo-text{font-size:1.4rem}.featured-info h3{font-size:1.1rem}.video-grid{gap:14px}.auth-card{padding:24px 20px}.bottom-nav .nav-btn{font-size:.75rem;padding:6px 12px}}::-webkit-scrollbar{width:8px;background:#f0f0f0}::-webkit-scrollbar-thumb{background:#ccc;border-radius:8px}