*{margin:0;padding:0;box-sizing:border-box}:root{--color-primary: #1a0b2e;--color-secondary: #16213e;--color-accent: #533483;--color-accent-light: #7e57c2;--color-blue-dark: #0f3460;--color-violet-dark: #2d1b4e;--gradient-primary: linear-gradient(135deg, #1a0b2e 0%, #16213e 50%, #533483 100%);--gradient-secondary: linear-gradient(135deg, #0f3460 0%, #2d1b4e 100%);--gradient-nav: linear-gradient(180deg, transparent 0%, rgba(26, 11, 46, .95) 100%);--color-text: #ffffff;--color-text-secondary: rgba(255, 255, 255, .7);--color-icon: rgba(255, 255, 255, .6);--color-icon-active: #ffffff;--nav-height: 64px;--spacing-sm: .5rem;--spacing-md: 1rem;--spacing-lg: 1.5rem;--spacing-xl: 2rem;--transition-fast: .2s ease-out;--transition-medium: .4s ease-out}html,body{width:100%;height:100%;overflow:hidden;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;background:var(--gradient-primary);color:var(--color-text);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}living-app{display:flex;flex-direction:column;width:100%;height:100vh;height:100dvh;overflow:hidden}screens-container{flex:1;position:relative;display:grid;grid-template-columns:1fr;grid-template-rows:1fr;overflow:hidden}screens-container>*{grid-column:1;grid-row:1;width:100%;height:100%;opacity:0;pointer-events:none;transition:opacity var(--transition-medium);overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;padding:var(--spacing-xl);padding-bottom:calc(var(--nav-height) + var(--spacing-xl))}screens-container>*[active=true]{opacity:1;pointer-events:all}subscriptions-screen,explore-screen,lives-screen,playlists-screen,shorts-screen{display:flex;flex-direction:column;gap:var(--spacing-lg)}explore-screen,playlists-screen{padding-left:0;padding-right:0}explore-screen h2,playlists-screen h2{padding-left:var(--spacing-xl);padding-right:var(--spacing-xl)}explore-screen tabs-nav,playlists-screen tabs-nav{padding-left:var(--spacing-xl);padding-right:var(--spacing-xl)}subscriptions-screen h2,explore-screen h2,lives-screen h2,playlists-screen h2,shorts-screen h2{font-size:2rem;font-weight:600;margin-bottom:var(--spacing-md);background:linear-gradient(135deg,#fff,#b39ddb);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}subscriptions-screen .section-header{font-size:1.25rem;font-weight:500;color:var(--color-text);margin-top:var(--spacing-xl);margin-bottom:var(--spacing-md);opacity:.9}subscriptions-screen .section-header:first-of-type{margin-top:0}subscriptions-screen p,explore-screen p,lives-screen p,playlists-screen p,shorts-screen p{font-size:1.125rem;color:var(--color-text-secondary);line-height:1.6}nav-bar{position:fixed;bottom:0;left:0;right:0;height:var(--nav-height);display:flex;justify-content:space-around;align-items:center;background:var(--gradient-nav);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-top:1px solid rgba(255,255,255,.1);padding:0 var(--spacing-md);z-index:1000}nav-bar button{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;height:100%;background:transparent;border:none;cursor:pointer;transition:all var(--transition-fast);padding:var(--spacing-sm);border-radius:12px;color:var(--color-icon);position:relative}nav-bar button:before{content:"";position:absolute;top:0;left:50%;transform:translate(-50%);width:0;height:3px;background:linear-gradient(90deg,#7e57c2,#b39ddb);border-radius:0 0 3px 3px;transition:width var(--transition-fast)}nav-bar button[active=true]:before{width:60%}nav-bar button .material-symbols-outlined{font-size:1.75rem;font-variation-settings:"FILL" 0,"wght" 300,"GRAD" 0,"opsz" 24;transition:all var(--transition-fast)}nav-bar button[active=true] .material-symbols-outlined{color:var(--color-icon-active);font-variation-settings:"FILL" 1,"wght" 400,"GRAD" 0,"opsz" 24}nav-bar button:hover{background:#ffffff0d}nav-bar button:active{transform:scale(.95)}@media(min-width:768px){:root{--nav-height: 72px}nav-bar button .material-symbols-outlined{font-size:2rem}screens-container>*{padding:var(--spacing-xl) 10vw}subscriptions-screen h2,explore-screen h2,lives-screen h2,playlists-screen h2,shorts-screen h2{font-size:2.5rem}}@media(min-width:1024px){screens-container>*{padding:var(--spacing-xl) 20vw}}@media(max-width:360px){:root{--nav-height: 56px}nav-bar button .material-symbols-outlined{font-size:1.5rem}subscriptions-screen h2,explore-screen h2,lives-screen h2,playlists-screen h2,shorts-screen h2{font-size:1.75rem}}@supports (padding-bottom: env(safe-area-inset-bottom)){nav-bar{padding-bottom:calc(env(safe-area-inset-bottom) + var(--spacing-sm));height:calc(var(--nav-height) + env(safe-area-inset-bottom))}screens-container>*{padding-bottom:calc(var(--nav-height) + env(safe-area-inset-bottom) + var(--spacing-xl))}}search-filter{display:block;width:100%;margin-bottom:var(--spacing-lg)}search-filter input{width:100%;padding:var(--spacing-md);font-size:1rem;color:var(--color-text);background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:12px;outline:none;transition:all var(--transition-fast);font-family:inherit}search-filter input::placeholder{color:var(--color-text-secondary)}search-filter input:focus{background:#ffffff14;border-color:var(--color-accent-light);box-shadow:0 0 0 3px #7e57c21a}platforms-list{display:flex;flex-direction:column;gap:var(--spacing-md)}platform-item{display:flex;flex-direction:column;background:#ffffff08;border-radius:16px;overflow:hidden;border:1px solid rgba(255,255,255,.05);transition:all var(--transition-fast)}platform-item:hover{background:#ffffff0d;border-color:#ffffff1a}platform-item .platform-header{display:flex;align-items:center;gap:var(--spacing-md);padding:var(--spacing-md) var(--spacing-lg);cursor:pointer;user-select:none;-webkit-user-select:none;transition:background var(--transition-fast)}platform-item .platform-header:active{background:#ffffff0d}platform-item .platform-icon{width:32px;height:32px;object-fit:contain;object-position:center;flex-shrink:0;display:block}platform-item .platform-name{flex:1;font-size:1.125rem;font-weight:500;color:var(--color-text)}platform-item .platform-count{font-size:.875rem;color:var(--color-text-secondary);background:#ffffff0d;padding:4px 10px;border-radius:12px;min-width:24px;text-align:center}platform-item .expand-icon{font-size:1.5rem;color:var(--color-icon);transition:transform var(--transition-fast);font-variation-settings:"FILL" 0,"wght" 300,"GRAD" 0,"opsz" 24}platform-item[expanded=true] .expand-icon{transform:rotate(180deg)}platform-item .channels-container{max-height:0;overflow:hidden;transition:max-height var(--transition-medium)}platform-item[expanded=true] .channels-container{max-height:1000px}channel-item{display:flex;align-items:center;gap:var(--spacing-md);padding:var(--spacing-md) var(--spacing-lg);border-top:1px solid rgba(255,255,255,.05);cursor:pointer;transition:background var(--transition-fast)}channel-item:hover{background:#ffffff08}channel-item:active{background:#ffffff0d}channel-item .channel-avatar{width:40px;height:40px;border-radius:50%;background:var(--gradient-secondary);display:flex;align-items:center;justify-content:center;font-size:1.125rem;font-weight:600;color:var(--color-text);flex-shrink:0}channel-item .channel-info{flex:1;display:flex;flex-direction:column;gap:4px}channel-item .channel-name{font-size:1rem;font-weight:500;color:var(--color-text)}channel-item .channel-subscribers{font-size:.875rem;color:var(--color-text-secondary)}tabs-nav{display:flex;gap:var(--spacing-md);margin-bottom:var(--spacing-lg);border-bottom:1px solid rgba(255,255,255,.1)}tabs-nav button{flex:1;padding:var(--spacing-sm) var(--spacing-md);padding-bottom:var(--spacing-md);background:transparent;border:none;border-bottom:2px solid transparent;color:var(--color-text-secondary);font-size:.9375rem;font-weight:500;cursor:pointer;transition:all var(--transition-fast);font-family:inherit;user-select:none;-webkit-user-select:none;position:relative;margin-bottom:-1px}tabs-nav button:hover{color:var(--color-text)}tabs-nav button:active{transform:translateY(1px)}tabs-nav button[active=true]{color:var(--color-text);border-bottom-color:var(--color-accent-light)}tabs-container{display:block;position:relative}tabs-container .tab-content{opacity:0;pointer-events:none;display:none;transition:opacity var(--transition-medium);padding:0 var(--spacing-xl)}tabs-container .tab-content[active=true]{opacity:1;pointer-events:all;display:block}tabs-container .tab-content p{font-size:1.125rem;color:var(--color-text-secondary);line-height:1.6}lives-list{display:flex;flex-direction:column;gap:var(--spacing-xl)}live-item{display:flex;flex-direction:column;gap:var(--spacing-md)}live-item .iframe-container{position:relative;width:100%;padding-bottom:56.25%;background:#0000004d;border-radius:16px;overflow:hidden;border:1px solid rgba(255,255,255,.1);box-shadow:0 4px 12px #0000004d;transition:all var(--transition-fast)}live-item .iframe-container:hover{border-color:#fff3;box-shadow:0 6px 16px #0006}live-item .iframe-container iframe{position:absolute;top:0;left:0;width:100%;height:100%;border:none}live-item .live-title{font-size:1rem;font-weight:500;color:var(--color-text);padding:0 var(--spacing-sm)}lives-screen{position:relative;padding-left:0;padding-right:0}lives-screen h2{padding-left:var(--spacing-xl);padding-right:var(--spacing-xl)}lives-screen lives-list{padding-left:var(--spacing-xl);padding-right:var(--spacing-xl)}screens-container>*::-webkit-scrollbar{width:6px}screens-container>*::-webkit-scrollbar-track{background:transparent}screens-container>*::-webkit-scrollbar-thumb{background:#fff3;border-radius:3px}screens-container>*::-webkit-scrollbar-thumb:hover{background:#ffffff4d}living-app .account-bar{position:fixed;top:var(--spacing-md);right:var(--spacing-md);z-index:20;display:flex;align-items:center;gap:var(--spacing-sm)}living-app .account-name{font-size:.875rem;color:var(--color-text-secondary)}living-app .account-action{padding:6px 14px;font-size:.875rem;font-family:inherit;color:var(--color-text);background:#ffffff14;border:1px solid rgba(255,255,255,.15);border-radius:999px;cursor:pointer;transition:all var(--transition-fast)}living-app .account-action:hover{background:#ffffff24;border-color:var(--color-accent-light)}.screen-status{min-height:1.25rem;margin-bottom:var(--spacing-md)}subscriptions-screen .screen-status,lives-screen .screen-status{font-size:.875rem;color:var(--color-text-secondary)}lives-screen .screen-status{padding-left:var(--spacing-xl);padding-right:var(--spacing-xl)}search-filter .search-button{margin-top:var(--spacing-sm);padding:var(--spacing-sm) var(--spacing-md);font-size:.875rem;font-family:inherit;color:var(--color-text);background:var(--gradient-secondary);border:1px solid rgba(255,255,255,.15);border-radius:12px;cursor:pointer;transition:all var(--transition-fast)}search-filter .search-button:hover{border-color:var(--color-accent-light)}subscriptions-screen .candidates-list{display:flex;flex-direction:column;flex-shrink:0;border-radius:16px;overflow:hidden;background:#ffffff08}channel-item img.channel-avatar{object-fit:cover}channel-item .channel-action{width:36px;height:36px;display:flex;align-items:center;justify-content:center;font-size:1.25rem;color:var(--color-icon);background:transparent;border:none;border-radius:50%;cursor:pointer;flex-shrink:0;transition:all var(--transition-fast)}channel-item .channel-action:hover{color:var(--color-icon-active);background:#ffffff14}lives-screen .refresh-button{position:absolute;top:calc(var(--spacing-xl) + 48px);right:var(--spacing-xl);width:40px;height:40px;font-size:1.25rem;color:var(--color-icon);background:#ffffff0f;border:none;border-radius:50%;cursor:pointer;transition:all var(--transition-fast)}lives-screen .refresh-button:hover{color:var(--color-icon-active);background:#ffffff1f}live-item .live-preview{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;cursor:pointer}live-item .live-badge{position:absolute;top:var(--spacing-sm);left:var(--spacing-sm);padding:2px 8px;font-size:.6875rem;font-weight:700;letter-spacing:.05em;color:var(--color-text);background:#c00;border-radius:4px;pointer-events:none}live-item .live-meta{font-size:.875rem;color:var(--color-text-secondary);padding:0 var(--spacing-sm)}screens-container>*>h2{padding-right:120px}lives-screen h2{padding-right:calc(var(--spacing-xl) + 120px)}@media(max-width:520px){living-app .account-name{display:none}}.screen-status:empty{display:none}