*{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, 0.95) 100%);--color-text:#ffffff;--color-text-secondary:rgba(255, 255, 255, 0.7);--color-icon:rgba(255, 255, 255, 0.6);--color-icon-active:#ffffff;--nav-height:64px;--spacing-sm:0.5rem;--spacing-md:1rem;--spacing-lg:1.5rem;--spacing-xl:2rem;--transition-fast:200ms ease-out;--transition-medium:400ms ease-out}body,html,living-app{width:100%;overflow:hidden}body,html{height:100%;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;height:100vh;height:100dvh}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}explore-screen,lives-screen,playlists-screen,shorts-screen,subscriptions-screen{display:flex;flex-direction:column;gap:var(--spacing-lg)}explore-screen,lives-screen,playlists-screen{padding-left:0;padding-right:0}explore-screen h2,explore-screen tabs-nav,playlists-screen h2,playlists-screen tabs-nav{padding-left:var(--spacing-xl);padding-right:var(--spacing-xl)}explore-screen h2,lives-screen h2,playlists-screen h2,shorts-screen h2,subscriptions-screen h2{font-size:2rem;font-weight:600;margin-bottom:var(--spacing-md);background:linear-gradient(135deg,#fff 0,#b39ddb 100%);-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}explore-screen p,lives-screen p,playlists-screen p,shorts-screen p,subscriptions-screen p,tabs-container .tab-content p{font-size:1.125rem;color:var(--color-text-secondary);line-height:1.6}nav-bar,nav-bar button{display:flex;align-items:center}nav-bar{position:fixed;bottom:0;left:0;right:0;height:var(--nav-height);justify-content:space-around;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;flex-direction:column;justify-content:center;gap:4px;height:100%;background:0 0;border:0;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:translateX(-50%);width:0;height:3px;background:linear-gradient(90deg,#7e57c2 0,#b39ddb 100%);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,platform-item .platform-header:active,search-filter input{background:rgba(255,255,255,.05)}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}explore-screen h2,lives-screen h2,playlists-screen h2,shorts-screen h2,subscriptions-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}explore-screen h2,lives-screen h2,playlists-screen h2,shorts-screen h2,subscriptions-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);border:1px solid rgba(255,255,255,.1);border-radius:12px;outline:0;transition:all var(--transition-fast);font-family:inherit}search-filter input::placeholder{color:var(--color-text-secondary)}search-filter input:focus{background:rgba(255,255,255,.08);border-color:var(--color-accent-light);box-shadow:0 0 0 3px rgba(126,87,194,.1)}live-item,platforms-list{flex-direction:column}lives-list,platform-item{display:flex;flex-direction:column}platform-item{border-radius:16px;overflow:hidden;border:1px solid rgba(255,255,255,.05);transition:all var(--transition-fast)}platform-item:hover{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.1)}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-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:rgba(255,255,255,.05);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,live-item,platforms-list,tabs-nav{display:flex;gap:var(--spacing-md)}channel-item{align-items:center;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,platform-item{background:rgba(255,255,255,.03)}channel-item:active{background:rgba(255,255,255,.05)}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{margin-bottom:var(--spacing-lg);border-bottom:1px solid rgba(255,255,255,.1)}tabs-nav button{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}lives-list{gap:var(--spacing-xl)}live-item .iframe-container{position:relative;width:100%;padding-bottom:56.25%;background:rgba(0,0,0,.3);border-radius:16px;overflow:hidden;border:1px solid rgba(255,255,255,.1);box-shadow:0 4px 12px rgba(0,0,0,.3);transition:all var(--transition-fast)}live-item .iframe-container:hover{border-color:rgba(255,255,255,.2);box-shadow:0 6px 16px rgba(0,0,0,.4)}live-item .iframe-container iframe{position:absolute;top:0;left:0;width:100%;height:100%;border:0}live-item .live-title{font-size:1rem;font-weight:500;padding:0 var(--spacing-sm)}lives-filter,lives-screen h2,lives-screen lives-list{padding-left:var(--spacing-xl);padding-right:var(--spacing-xl)}lives-filter{display:flex;gap:var(--spacing-md);margin-bottom:var(--spacing-lg)}lives-filter button,tabs-nav button{flex:1;padding:var(--spacing-sm) var(--spacing-md);padding-bottom:var(--spacing-md);background:0 0;border:0;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}live-item .live-title,lives-filter button:hover{color:var(--color-text)}lives-filter button:active{transform:translateY(1px)}lives-filter button[active=true]{color:var(--color-text);border-bottom-color:var(--color-accent-light)}screens-container>::-webkit-scrollbar{width:6px}screens-container>::-webkit-scrollbar-track{background:0 0}screens-container>::-webkit-scrollbar-thumb{background:rgba(255,255,255,.2);border-radius:3px}screens-container>::-webkit-scrollbar-thumb:hover{background:rgba(255,255,255,.3)}