:root{--primary-color:#e62129;--primary-hover:#ff3b44;--bg-color:#0d0d12;--bg-card:#181820;--bg-card-hover:#22222d;--text-main:#f5f5f5;--text-muted:#9e9e9e;--border-color:#2a2a35;--sidebar-width:260px;--header-height:70px;--glass-bg:rgba(24,24,32,.7);--glass-border:hsla(0,0%,100%,.05)}*{box-sizing:border-box;margin:0;padding:0}body{background-color:transparent;color:var(--text-main);font-family:Inter,sans-serif;line-height:1.5;overflow-x:hidden;position:relative}body:before{background-attachment:fixed;background-image:url(../BG.jpg);background-position:50%;background-repeat:no-repeat;background-size:cover;filter:blur(20px);inset:-30px;z-index:-2}body:after,body:before{content:"";position:fixed}body:after{background-color:#0d0d12bf;inset:0;z-index:-1}a{color:inherit;text-decoration:none;transition:color .2s ease}a:hover{color:var(--primary-color)}ul{list-style:none}.app-container{display:flex;min-height:100vh}.sidebar{background-color:var(--bg-card);border-right:1px solid var(--border-color);display:flex;flex-direction:column;height:100vh;position:fixed;transition:transform .3s ease;width:var(--sidebar-width);z-index:100}.sidebar-header{border-bottom:1px solid var(--border-color);height:var(--header-height);padding:0 1.5rem}.sidebar-header,.sidebar-logo{align-items:center;display:flex}.sidebar-logo{color:var(--primary-color);font-size:1.5rem;font-weight:700;gap:.5rem}.sidebar-logo span{color:var(--text-main)}.sidebar-nav{display:flex;flex:1;flex-direction:column;gap:.5rem;padding:1.5rem 1rem}.nav-item{align-items:center;border-radius:.75rem;color:var(--text-muted);display:flex;font-weight:500;gap:1rem;padding:.875rem 1rem;transition:all .2s ease}.nav-item.active,.nav-item.router-link-exact-active,.nav-item:hover{background-color:#e621291a;color:var(--primary-color)}.nav-item.active,.nav-item.router-link-exact-active{background-color:var(--primary-color);box-shadow:0 4px 12px #e621294d;color:#fff}.nav-item.active:hover,.nav-item.router-link-exact-active:hover{background-color:var(--primary-color);color:#fff}.main-content{display:flex;flex:1;flex-direction:column;margin-left:var(--sidebar-width);min-height:100vh}.top-header{align-items:center;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);background:var(--glass-bg);border-bottom:1px solid var(--glass-border);display:none;height:var(--header-height);justify-content:space-between;padding:0 2rem;position:sticky;top:0;z-index:50}.page-container{flex:1;padding:2rem}.section-header{justify-content:space-between;margin-bottom:1.5rem}.section-header,.section-title{align-items:center;display:flex}.section-title{font-size:1.5rem;font-weight:700;gap:.75rem}.section-title:before{background-color:var(--primary-color);border-radius:4px;content:"";display:block;height:24px;width:4px}.view-all{align-items:center;color:var(--primary-color);display:flex;font-size:.875rem;font-weight:500;gap:.25rem}.view-all:hover{text-decoration:underline}.grid-cards,.grid-members{display:grid;gap:1.5rem;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));margin-bottom:2.5rem}.live-card{background-color:var(--bg-card);border:1px solid var(--border-color);border-radius:1rem;cursor:pointer;display:block;overflow:hidden;transition:transform .3s cubic-bezier(.175,.885,.32,1.275),box-shadow .3s ease}.live-card:hover{border-color:var(--primary-color);box-shadow:0 12px 24px #0006;transform:translateY(-8px)}.live-card-thumb{aspect-ratio:5/7;overflow:hidden;position:relative;width:100%}.live-card-thumb img{height:100%;-o-object-fit:cover;object-fit:cover;transition:transform .5s ease;width:100%}.live-card:hover .live-card-thumb img{transform:scale(1.05)}.live-badge{align-items:center;animation:pulse 2s infinite;background-color:var(--primary-color);border-radius:.25rem;box-shadow:0 2px 8px #e6212966;color:#fff;display:flex;font-size:.75rem;font-weight:700;gap:.25rem;left:.75rem;padding:.25rem .5rem;position:absolute;top:.75rem;z-index:5}@keyframes pulse{0%{box-shadow:0 0 #e62129b3}70%{box-shadow:0 0 0 6px #e6212900}to{box-shadow:0 0 #e6212900}}.live-card-content{padding:1.25rem}.live-card-title{font-size:1.125rem;font-weight:600;margin-bottom:.5rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.live-card-meta{color:var(--text-muted);font-size:.875rem;justify-content:space-between}.live-card-meta,.live-platform{align-items:center;display:flex}.live-platform{background-color:var(--bg-color);border-radius:1rem;font-weight:500;gap:.375rem;padding:.25rem .625rem}.member-card{background-color:var(--bg-card);border:1px solid var(--border-color);border-radius:.75rem;cursor:pointer;display:flex;flex-direction:column;overflow:hidden;padding:0;text-align:center;transition:all .3s ease}.member-card:hover{background-color:var(--bg-card-hover);border-color:#fff3;transform:translateY(-5px)}.member-avatar{aspect-ratio:3/4;background-color:#e0e0e0;border:none;margin-bottom:0;padding:0;width:100%}.member-avatar img{border-radius:0;height:100%;-o-object-fit:cover;object-fit:cover;width:100%}.member-name{font-size:1rem;font-weight:600;margin-bottom:0;padding:.75rem}.live-player-container{box-sizing:border-box;display:flex;flex-direction:column;height:calc(100vh - var(--header-height));padding:1.5rem}.live-header{margin-bottom:1.5rem}.live-header,.live-header-info{align-items:center;display:flex}.live-header-info{gap:1rem}.live-avatar{border:2px solid var(--primary-color);border-radius:50%;height:48px;-o-object-fit:cover;object-fit:cover;width:48px}.live-header-info h2{font-size:1.25rem;line-height:1.2;margin:0}.live-status{align-items:center;color:var(--primary-color);display:inline-flex;font-size:.875rem;font-weight:500;gap:.25rem}.live-content-wrapper{display:flex;flex:1;gap:1.5rem;min-height:0}.video-section{display:flex;flex:1;flex-direction:column;min-width:0}.video-player-wrapper{background-color:#000;border:1px solid var(--border-color);border-radius:1rem;flex:1;overflow:hidden;position:relative}.offline-overlay,.video-player-wrapper{align-items:center;display:flex;justify-content:center}.offline-overlay{background:#000c;color:var(--text-muted);font-size:1.25rem;font-weight:500;inset:0;position:absolute;z-index:10}.chat-section{background-color:var(--bg-card);border:1px solid var(--border-color);border-radius:1rem;display:flex;flex-direction:column;overflow:hidden;width:350px}.chat-header{border-bottom:1px solid var(--border-color);justify-content:space-between;padding:1rem}.chat-header,.chat-header h3{align-items:center;display:flex}.chat-header h3{font-size:1rem;gap:.5rem;margin:0}.status-dot{border-radius:50%;height:10px;width:10px}.status-dot.connected{background-color:#4caf50;box-shadow:0 0 8px #4caf5080}.status-dot.disconnected{background-color:#f44336}.chat-messages{display:flex;flex:1;flex-direction:column;gap:.5rem;overflow-y:auto;padding:1rem}.empty-chat{color:var(--text-muted);margin-bottom:auto;margin-top:auto;text-align:center}.chat-message{font-size:.875rem;line-height:1.4;word-wrap:break-word}.chat-sender{font-weight:600}.chat-text{color:var(--text-main)}.activity-grid{display:grid;gap:1.5rem;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));margin-top:1.5rem}.activity-card{background-color:var(--bg-card);border:1px solid var(--border-color);border-radius:1rem;box-shadow:0 4px 20px #0003;display:flex;flex-direction:column;height:220px;overflow:hidden;transition:border-color .3s ease,box-shadow .3s ease}.activity-card:hover{border-color:#ffffff26;box-shadow:0 8px 28px #0000004d}.activity-header{align-items:center;background:#181820cc;border-bottom:1px solid var(--border-color);display:flex;padding:.875rem 1.25rem}.activity-header h3{align-items:center;display:flex;font-size:1rem;font-weight:600;gap:.5rem;margin:0}.gifts-card .activity-header h3{color:#facc15}.joins-card .activity-header h3{color:#38bdf8}.activity-list{display:flex;flex:1;flex-direction:column;gap:.625rem;overflow-y:auto;padding:1rem 1.25rem}.empty-activity{color:var(--text-muted);font-size:.875rem;margin:auto;text-align:center}.activity-item{background:#ffffff08;border-left:3px solid transparent;border-radius:.5rem;display:flex;flex-direction:column;font-size:.875rem;gap:.125rem;line-height:1.4;padding:.5rem .75rem}.gift-item{background:linear-gradient(90deg,rgba(250,204,21,.08),transparent);border-left-color:#facc15}.join-item{background:linear-gradient(90deg,rgba(56,189,248,.08),transparent);border-left-color:#38bdf8}.activity-sender{font-size:.8125rem;font-weight:600}.join-item .activity-sender{color:#38bdf8}.activity-text{color:var(--text-main);font-size:.875rem}.multiview-container{box-sizing:border-box;display:flex;flex-direction:column;height:calc(100vh - var(--header-height));overflow-y:auto;padding:1.5rem}.multiview-toolbar{align-items:center;background-color:var(--bg-card);border:1px solid var(--border-color);border-radius:1rem;display:flex;flex-wrap:wrap;gap:1rem;justify-content:space-between;margin-bottom:1.5rem;padding:1rem 1.5rem}.multiview-title{align-items:center;display:flex;font-size:1.25rem;font-weight:700;gap:.5rem}.multiview-select-wrapper{align-items:center;display:flex;gap:1rem}.multiview-select{background-color:var(--bg-color);border:1px solid var(--border-color);border-radius:.75rem;color:var(--text-main);font-size:.875rem;min-width:200px;outline:none;padding:.5rem 1rem}.multiview-select:focus{border-color:var(--primary-color)}.add-btn{align-items:center;background-color:var(--primary-color);border:none;border-radius:.75rem;color:#fff;cursor:pointer;display:flex;font-weight:600;gap:.5rem;padding:.5rem 1.25rem;transition:background-color .2s}.add-btn:hover:not(:disabled){background-color:var(--primary-hover)}.add-btn:disabled{background-color:var(--border-color);color:var(--text-muted);cursor:not-allowed}.live-profiles-bar{background-color:var(--bg-card);border:1px solid var(--border-color);border-radius:1rem;display:flex;flex-direction:column;gap:.75rem;margin-bottom:1.5rem;padding:1rem 1.5rem}.live-profiles-label{align-items:center;color:var(--text-muted);display:flex;font-size:.875rem;font-weight:600;gap:.5rem}.live-profiles-list{align-items:center;display:flex;gap:1rem;overflow-x:auto;padding-bottom:.5rem}.live-profiles-list::-webkit-scrollbar{height:6px}.live-profiles-list::-webkit-scrollbar-track{background:#ffffff0d;border-radius:3px}.live-profiles-list::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:3px}.live-profiles-list::-webkit-scrollbar-thumb:hover{background:var(--primary-color)}.live-profile-badge{align-items:center;background:#ffffff08;border:1px solid var(--border-color);border-radius:2rem;cursor:pointer;display:flex;flex-shrink:0;gap:.75rem;padding:.375rem 1rem .375rem .375rem;transition:all .2s ease}.live-profile-badge:hover{background:#ffffff14;border-color:#fff3;transform:translateY(-2px)}.live-profile-badge.active{background:#e6212926;border-color:var(--primary-color);box-shadow:0 0 12px #e621294d}.profile-avatar-wrapper{border-radius:50%;height:36px;position:relative;width:36px}.profile-avatar-wrapper img{border:2px solid var(--border-color);border-radius:50%;height:100%;-o-object-fit:cover;object-fit:cover;width:100%}.live-profile-badge.active .profile-avatar-wrapper img{border-color:var(--primary-color)}.live-pulse-dot{background-color:#4caf50;border:2px solid var(--bg-card);border-radius:50%;bottom:0;box-shadow:0 0 8px #4caf50cc;height:10px;position:absolute;right:0;width:10px}.live-profile-badge.active .live-pulse-dot{background-color:var(--primary-color);box-shadow:0 0 8px #e62129cc}.profile-info{display:flex;flex-direction:column}.profile-name{color:var(--text-main);font-size:.875rem;font-weight:600}.profile-platform{color:var(--text-muted);font-size:.75rem}.multiview-grid{align-items:flex-start;display:flex;flex:1;flex-wrap:wrap;gap:.5rem;justify-content:center;min-height:0}.multiview-card{display:flex;flex-direction:column;gap:.375rem;width:100%}.multiview-card.landscape{max-width:640px;min-width:320px;width:calc(50% - .25rem)}.multiview-card.portrait{max-width:420px;min-width:200px;width:calc(33.333% - .333rem)}.multiview-grid[data-count="1"] .multiview-card.landscape{max-width:960px;width:100%}.multiview-grid[data-count="1"] .multiview-card.portrait{max-width:460px;width:100%}.multiview-video-container{align-items:center;background-color:#000;border:1px solid var(--border-color);border-radius:1rem;box-shadow:0 4px 20px #0000004d;display:flex;justify-content:center;overflow:hidden;position:relative;width:100%}.multiview-video{background-color:#000;height:100%;max-height:75vh;-o-object-fit:contain;object-fit:contain;width:100%}.multiview-volume-overlay{position:absolute;right:1rem;top:1rem;z-index:10}.multiview-volume-btn{align-items:center;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#0009;border:1px solid hsla(0,0%,100%,.2);border-radius:50%;color:#fff;cursor:pointer;display:flex;height:36px;justify-content:center;transition:all .2s ease;width:36px}.multiview-volume-btn:hover{background:var(--primary-color);border-color:var(--primary-color);transform:scale(1.05)}.multiview-footer{align-items:center;display:flex;gap:1rem;justify-content:space-between;padding:0 .5rem}.multiview-member-name{color:#fff;font-size:1.25rem;font-weight:800;line-height:1;margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.multiview-footer-actions{align-items:center;display:flex;flex-shrink:0;gap:.75rem}.multiview-viewer-badge{align-items:center;background-color:#007bff;border-radius:.375rem;box-shadow:0 2px 8px #007bff4d;color:#fff;display:flex;font-size:.875rem;font-weight:700;gap:.375rem;padding:.375rem .75rem}.multiview-refresh-btn{align-items:center;background-color:#28a745;border:none;border-radius:.375rem;box-shadow:0 2px 8px #28a7454d;color:#fff;cursor:pointer;display:flex;height:32px;justify-content:center;transition:all .2s ease;width:32px}.multiview-refresh-btn:hover{background-color:#218838;transform:scale(1.05)}.multiview-close-btn{align-items:center;background-color:#dc3545;border:none;border-radius:.375rem;box-shadow:0 2px 8px #dc35454d;color:#fff;cursor:pointer;display:flex;height:32px;justify-content:center;transition:all .2s ease;width:32px}.multiview-close-btn:hover{background-color:#c82333;transform:scale(1.05)}.collapse-toggle-btn{align-items:center;background:transparent;border:none;border-radius:.5rem;color:var(--text-muted);cursor:pointer;display:flex;justify-content:center;margin-left:auto;padding:.5rem;transition:all .2s ease}.collapse-toggle-btn:hover{background:#ffffff0d;color:var(--primary-color)}.app-container.sidebar-collapsed{--sidebar-width:80px}.app-container.sidebar-collapsed .nav-item span,.app-container.sidebar-collapsed .sidebar-logo span{display:none}.app-container.sidebar-collapsed .sidebar-logo{justify-content:center;width:100%}.app-container.sidebar-collapsed .collapse-toggle-btn{margin:0 auto}.app-container.sidebar-collapsed .sidebar-header{flex-direction:column;gap:.5rem;justify-content:center;padding:0 .5rem}.app-container.sidebar-collapsed .nav-item{justify-content:center;padding:.875rem 0}.player-controls-overlay{display:flex;gap:.5rem;position:absolute;right:1rem;top:1rem;z-index:20}.fit-toggle-btn{align-items:center;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);background:#181820b3;border:1px solid hsla(0,0%,100%,.15);border-radius:2rem;box-shadow:0 4px 12px #0000004d;color:#fff;cursor:pointer;display:flex;font-size:.75rem;font-weight:600;gap:.5rem;padding:.5rem 1rem;transition:all .2s ease}.fit-toggle-btn:hover{background:var(--primary-color);border-color:var(--primary-color);box-shadow:0 6px 16px #e6212966;transform:translateY(-2px)}.grid-news{display:grid;gap:1.25rem;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));margin-bottom:2.5rem}.news-card{align-items:flex-start;background-color:var(--bg-card);border:1px solid var(--border-color);border-radius:1rem;box-shadow:0 4px 12px #0003;cursor:pointer;display:flex;gap:1rem;justify-content:space-between;padding:1.25rem;transition:all .3s ease}.news-card:hover{background-color:var(--bg-card-hover);border-color:var(--primary-color);box-shadow:0 8px 24px #e6212940;transform:translateY(-4px)}.news-card-content{display:flex;flex:1;flex-direction:column;gap:.5rem;min-width:0}.news-meta{align-items:center;display:flex;font-size:.75rem;gap:.75rem}.news-category{background:#e6212926;border-radius:1rem;color:var(--primary-color);font-weight:600;padding:.25rem .625rem}.news-date{color:var(--text-muted);font-weight:500}.news-title{color:var(--text-main);display:-webkit-box;font-size:.9375rem;font-weight:600;-webkit-line-clamp:2;line-height:1.4;-webkit-box-orient:vertical;overflow:hidden}.news-card-arrow{color:var(--text-muted);padding-top:.25rem;transition:color .2s ease,transform .2s ease}.news-card:hover .news-card-arrow{color:var(--primary-color);transform:translate(2px) translateY(-2px)}.menu-toggle{background:transparent;border:none;color:var(--text-main);cursor:pointer;display:none;font-size:1.5rem}.schedule-section{margin-bottom:4rem}.schedule-filter-container{align-items:flex-end;background-color:var(--bg-card);border:1px solid var(--border-color);border-radius:1rem;box-shadow:0 4px 20px #0003;display:flex;flex-wrap:wrap;gap:2rem;justify-content:space-between;margin-bottom:3rem;padding:1.5rem 2rem}.schedule-select-group{align-items:center;display:flex;flex-wrap:wrap;gap:1.5rem}.schedule-select-box{display:flex;flex-direction:column;gap:.5rem}.schedule-select-box label{color:var(--text-muted);font-size:.8125rem;font-weight:600}.select-input-wrapper{align-items:center;display:flex;position:relative}.select-input-wrapper select{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:var(--bg-color);border:1px solid var(--border-color);border-radius:.5rem;box-shadow:0 2px 8px #0000001a;color:var(--text-main);cursor:pointer;font-size:.9375rem;font-weight:600;min-width:180px;padding:.75rem 2.5rem .75rem 1rem;transition:all .2s ease}.select-input-wrapper select:focus{border-color:var(--primary-color);outline:none}.select-icon{color:var(--text-muted);pointer-events:none;position:absolute;right:.875rem}.select-icon.red-icon{color:#e62129}.schedule-tabs-group{display:flex;flex-direction:column;gap:.5rem}.schedule-tabs-group label{color:var(--text-muted);font-size:.8125rem;font-weight:600}.schedule-tabs{align-items:center;background:var(--bg-color);border:1px solid var(--border-color);border-radius:.5rem;box-shadow:0 2px 8px #0000001a;display:flex;overflow:hidden}.schedule-tab-btn{align-items:center;background:transparent;border:none;color:var(--text-main);cursor:pointer;display:flex;font-size:.9375rem;font-weight:600;gap:.5rem;padding:.75rem 1.5rem;transition:all .2s ease}.schedule-tab-btn:hover{background:#ffffff0d}.schedule-tab-btn.active{background:#0ea5e9;color:#fff;font-weight:700}.schedule-list-grid{display:grid;gap:1.5rem;grid-template-columns:repeat(2,1fr)}.schedule-list-item{align-items:center;background-color:var(--bg-card);border:1px solid var(--border-color);border-radius:1rem;box-shadow:0 4px 12px #0003;display:flex;gap:1rem;justify-content:space-between;padding:1.5rem;transition:all .3s ease}.schedule-list-item:hover{background-color:var(--bg-card-hover);border-color:var(--primary-color);box-shadow:0 8px 24px #e6212940;transform:translateY(-4px)}.schedule-item-left{align-items:center;display:flex;gap:1.5rem}.schedule-date-box{align-items:center;display:flex;gap:.625rem}.schedule-day{color:#e62129;font-size:2.5rem;font-weight:800;line-height:1}.schedule-my{color:var(--text-main);font-size:.75rem;font-weight:700;line-height:1.2}.schedule-info-box,.schedule-my{display:flex;flex-direction:column}.schedule-info-box{gap:.4rem}.schedule-badges{flex-wrap:wrap;gap:.5rem}.badge-team,.schedule-badges{align-items:center;display:flex}.badge-team{border:1px solid;border-radius:50px;font-size:.6875rem;font-weight:700;gap:.25rem;padding:.15rem .625rem}.badge-team.love{border-color:#f472b6;color:#f472b6}.badge-team.dream{border-color:#38bdf8;color:#38bdf8}.badge-team.passion{border-color:#fbbf24;color:#fbbf24}.badge-team.jkt48,.badge-team.trainee{border-color:#e62129;color:#e62129}.badge-type{border-radius:50px;font-size:.6875rem;font-weight:700;padding:.15rem .625rem}.badge-type.show{background:#e0f7fa;color:#00acc1}.badge-type.exclusive{background:#e62129;color:#fff}.badge-type.event{background:#e3f2fd;color:#1e88e5}.badge-type.birthday{background:#fff3e0;color:#fb8c00}.schedule-item-title{color:var(--text-main);font-size:1.05rem;font-weight:700;line-height:1.3;margin:0}.schedule-item-time{align-items:center;color:#0284c7;display:flex;font-size:.8125rem;font-weight:600;gap:.375rem}.schedule-item-right{flex-shrink:0}.schedule-detail-btn{background:transparent;border:1px solid #e62129;border-radius:50px;color:#e62129;cursor:pointer;display:inline-block;font-size:.75rem;font-weight:700;padding:.5rem 1.25rem;text-decoration:none;transition:all .2s ease;white-space:nowrap}.schedule-detail-btn:hover{background:#e62129;box-shadow:0 4px 12px #e621294d;color:#fff}@media(max-width:1024px){:root{--sidebar-width:80px}.nav-item span,.sidebar-logo span{display:none}.nav-item{justify-content:center;padding:.875rem 0}.live-content-wrapper{flex-direction:column}.chat-section{height:400px;width:100%}}@media(max-width:768px){.app-container{flex-direction:column}.sidebar{transform:translate(-100%);width:260px}.sidebar.mobile-open{transform:translate(0)}.main-content{margin-left:0}.top-header{display:flex}.menu-toggle{display:block}.page-container{padding:.75rem}.grid-cards{gap:.5rem!important;grid-template-columns:repeat(3,1fr)!important}.live-card-content{padding:.5rem!important}.live-card-title{font-size:.75rem!important;margin-bottom:.25rem!important}.live-card-meta{font-size:.65rem!important}.live-badge{font-size:.6rem!important;left:.375rem!important;padding:.15rem .3rem!important;top:.375rem!important}.multiview-card.landscape,.multiview-card.portrait{min-width:0!important;width:calc(33.333% - .333rem)!important}.multiview-member-name{font-size:.7rem!important}.multiview-footer{align-items:flex-start;flex-direction:column;gap:.25rem;padding:0 .25rem}.multiview-footer-actions{gap:.25rem;justify-content:space-between;width:100%}.multiview-viewer-badge{font-size:.6rem!important;padding:.15rem .3rem!important}.multiview-close-btn,.multiview-refresh-btn{height:22px!important;width:22px!important}}