:root{--color-bg: #F9FAFB;--color-bg-raised: #FFFFFF;--color-text: #111827;--color-text-secondary: #6B7280;--color-text-muted: #9CA3AF;--color-accent: #2563EB;--color-accent-hover: #1D4ED8;--color-accent-active: #1E40AF;--color-border: #E5E7EB;--color-card-bg: #FFFFFF;--color-card-border: #F3F4F6;--color-success: #10B981;--color-error: #EF4444;--color-warning: #F59E0B;--color-info: #3B82F6;--shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, .05);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .1), 0 2px 4px -1px rgba(0, 0, 0, .06);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -2px rgba(0, 0, 0, .05);--shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, .1), 0 10px 10px -5px rgba(0, 0, 0, .04);--space-xs: 4px;--space-sm: 8px;--space-md: 12px;--space-lg: 16px;--space-xl: 24px;--space-2xl: 32px;--space-3xl: 48px;--radius-sm: 8px;--radius-md: 12px;--radius-lg: 16px;--radius-full: 9999px;--font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji";--font-size-xs: .75rem;--font-size-sm: .875rem;--font-size-base: 1rem;--font-size-lg: 1.125rem;--font-size-xl: 1.25rem;--font-size-2xl: 1.5rem;--font-size-3xl: 1.875rem;--line-height-tight: 1.25;--line-height-normal: 1.5;--line-height-relaxed: 1.75;--transition-fast: .15s cubic-bezier(.4, 0, .2, 1);--transition-normal: .2s cubic-bezier(.4, 0, .2, 1);--transition-slow: .3s cubic-bezier(.4, 0, .2, 1);--z-sticky: 20;--z-fixed: 30;--z-overlay: 40;--z-modal: 50;--z-toast: 60}html.dark{--color-bg: #121212;--color-bg-raised: #1E1E1E;--color-text: #F3F4F6;--color-text-secondary: #9CA3AF;--color-text-muted: #6B7280;--color-accent: #3B82F6;--color-accent-hover: #60A5FA;--color-accent-active: #2563EB;--color-border: #374151;--color-card-bg: #1E1E1E;--color-card-border: #2D3748;--shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, .3);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .4), 0 2px 4px -1px rgba(0, 0, 0, .3);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .4), 0 4px 6px -2px rgba(0, 0, 0, .3);--shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, .4), 0 10px 10px -5px rgba(0, 0, 0, .3)}*{margin:0;padding:0;box-sizing:border-box}*,button,input,select,textarea{font-family:inherit}html{font-size:16px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{font-family:var(--font-family);font-size:var(--font-size-base);line-height:var(--line-height-normal);color:var(--color-text);background-color:var(--color-bg);transition:background-color var(--transition-normal),color var(--transition-normal)}html,body,#root{height:100%;width:100%}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--color-bg)}::-webkit-scrollbar-thumb{background:var(--color-border);border-radius:var(--radius-full)}::-webkit-scrollbar-thumb:hover{background:var(--color-text-muted)}h1,h2,h3,h4,h5,h6{font-weight:600;line-height:var(--line-height-tight);margin-bottom:var(--space-md)}h1{font-size:var(--font-size-3xl)}h2{font-size:var(--font-size-2xl)}h3{font-size:var(--font-size-xl)}h4{font-size:var(--font-size-lg)}h5,h6{font-size:var(--font-size-base)}p{margin-bottom:var(--space-md)}p:last-child{margin-bottom:0}a{color:var(--color-accent);text-decoration:none;transition:color var(--transition-fast)}a:hover{color:var(--color-accent-hover)}.text-primary{color:var(--color-text)}.text-secondary{color:var(--color-text-secondary)}.text-muted{color:var(--color-text-muted)}.text-accent{color:var(--color-accent)}.text-success{color:var(--color-success)}.text-error{color:var(--color-error)}.text-warning{color:var(--color-warning)}.text-xs{font-size:var(--font-size-xs)}.text-sm{font-size:var(--font-size-sm)}.text-lg{font-size:var(--font-size-lg)}.text-xl{font-size:var(--font-size-xl)}.text-2xl{font-size:var(--font-size-2xl)}.text-3xl{font-size:var(--font-size-3xl)}.font-bold{font-weight:700}.font-semibold{font-weight:600}.font-medium{font-weight:500}.font-normal{font-weight:400}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.line-clamp-2{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.line-clamp-3{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.app-layout{display:flex;height:100vh;width:100%;position:relative}.sidebar{display:none;width:256px;height:100vh;border-right:1px solid var(--color-border);background-color:var(--color-bg-raised);flex-direction:column;position:relative;z-index:var(--z-sticky);overflow-y:auto;transition:border-color var(--transition-normal)}@media (min-width: 768px){.sidebar{display:flex}}.sidebar-brand{padding:24px var(--space-lg);border-bottom:1px solid var(--color-border);display:flex;align-items:center;gap:var(--space-md);flex-shrink:0}.sidebar-brand-logo{width:36px;height:36px;flex-shrink:0}.sidebar-brand-title{font-size:1.25rem;font-weight:700;color:var(--color-text);margin:0}.sidebar-nav{list-style:none;padding:var(--space-xl) var(--space-md);flex:1;overflow-y:auto}.sidebar-nav-section{padding:var(--space-md) var(--space-md)}.sidebar-nav-section-title{font-size:var(--font-size-xs);font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--color-text-muted);padding:0 var(--space-md);margin-bottom:var(--space-md)}.sidebar-link{display:flex;align-items:center;gap:var(--space-md);padding:var(--space-md) var(--space-lg);color:var(--color-text-secondary);border-radius:8px;margin:8px;transition:all var(--transition-fast);cursor:pointer;border:none;background:transparent;width:calc(100% - 16px);font-family:inherit;font-size:var(--font-size-sm)}.sidebar-link:hover{color:var(--color-text);background-color:var(--color-bg)}.sidebar-link-active{color:var(--color-accent);background-color:var(--color-bg);font-weight:500}.sidebar-link-icon{width:20px;height:20px;flex-shrink:0}.main-content{flex:1;display:flex;flex-direction:column;overflow:hidden;position:relative}.content-container{max-width:64rem;margin:0 auto;width:100%;padding:0 var(--space-lg)}@media (max-width: 640px){.content-container{padding:0 var(--space-md)}}.content-wrapper{flex:1;overflow-y:auto;padding-bottom:160px;-webkit-overflow-scrolling:touch}@media (min-width: 768px){.content-wrapper{padding-bottom:var(--space-2xl)}}.top-nav{display:flex;align-items:center;justify-content:space-between;padding:var(--space-md) var(--space-lg);height:56px;background-color:var(--color-bg-raised);border-bottom:1px solid var(--color-border);position:sticky;top:0;z-index:var(--z-sticky);flex-shrink:0}@media (min-width: 768px){.top-nav{display:none}}.top-nav-title{font-size:var(--font-size-lg);font-weight:600;color:var(--color-text);margin:0}.top-nav-right{display:flex;gap:var(--space-md);align-items:center}.bottom-nav{display:flex;justify-content:space-around;align-items:center;height:64px;padding-bottom:max(var(--space-md),env(safe-area-inset-bottom));position:fixed;bottom:0;left:0;right:0;background-color:var(--color-bg-raised);border-top:1px solid var(--color-border);z-index:var(--z-fixed);gap:var(--space-md)}@media (min-width: 768px){.bottom-nav{display:none}}.bottom-nav-item{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:8px;color:var(--color-text-secondary);font-size:var(--font-size-xs);transition:all var(--transition-fast);flex:1;cursor:pointer;position:relative;border:none;background:transparent;font-family:inherit}.bottom-nav-item:hover{color:var(--color-text)}.bottom-nav-item-active{color:var(--color-accent);font-weight:500}.bottom-nav-icon{width:24px;height:24px}.card{background-color:var(--color-card-bg);border:1px solid var(--color-card-border);border-radius:var(--radius-lg);padding:var(--space-lg);box-shadow:var(--shadow-sm);transition:all var(--transition-normal)}.card:hover,.card-elevated{box-shadow:var(--shadow-md)}.card-elevated:hover{box-shadow:var(--shadow-lg)}.station-card{display:flex;align-items:center;gap:var(--space-lg);padding:var(--space-md);background-color:var(--color-card-bg);border:1px solid var(--color-card-border);border-radius:var(--radius-lg);transition:all var(--transition-normal);cursor:pointer}.station-card:hover{border-color:var(--color-border);box-shadow:var(--shadow-md)}.station-card-active{border-color:var(--color-accent);box-shadow:0 0 0 2px #2563eb1a}html.dark .station-card-active{box-shadow:0 0 0 2px #3b82f61a}.station-card-avatar{flex-shrink:0}.station-card-content{flex:1;min-width:0}.station-card-title{font-size:var(--font-size-base);font-weight:600;color:var(--color-text);margin:0 0 4px;word-break:break-word}.station-card-subtitle{font-size:var(--font-size-sm);color:var(--color-text-secondary);margin:0;display:flex;align-items:center;gap:var(--space-sm);flex-wrap:wrap}.station-card-actions{display:flex;gap:var(--space-sm);flex-shrink:0}.tv-card{position:relative;overflow:hidden;border-radius:var(--radius-lg);background-color:var(--color-border);aspect-ratio:16 / 9;cursor:pointer}.tv-card-image{width:100%;height:100%;object-fit:cover;transition:transform var(--transition-normal)}.tv-card:hover .tv-card-image{transform:scale(1.05)}.tv-card-overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(180deg,transparent 0%,rgba(0,0,0,.3) 100%);display:flex;flex-direction:column;justify-content:flex-end;padding:var(--space-lg);color:#fff}.tv-card-overlay-title{font-size:var(--font-size-lg);font-weight:600;margin:0}.stat-card{padding:var(--space-lg);background-color:var(--color-card-bg);border:1px solid var(--color-card-border);border-radius:var(--radius-lg);text-align:center}.stat-card-value{font-size:var(--font-size-2xl);font-weight:700;color:var(--color-accent);margin:0}.stat-card-label{font-size:var(--font-size-sm);color:var(--color-text-secondary);margin:var(--space-sm) 0 0 0}.avatar{display:inline-flex;align-items:center;justify-content:center;border-radius:var(--radius-lg);overflow:hidden;background-color:var(--color-border);flex-shrink:0;font-weight:600;color:var(--color-text)}.avatar-xs{width:32px;height:32px;font-size:var(--font-size-xs)}.avatar-sm{width:40px;height:40px;font-size:var(--font-size-sm)}.avatar-md{width:56px;height:56px;font-size:var(--font-size-base)}.avatar-lg{width:128px;height:128px;font-size:var(--font-size-2xl)}.avatar-xl{width:160px;height:160px;font-size:var(--font-size-3xl)}.avatar-img{width:100%;height:100%;object-fit:cover}.avatar-initials{text-transform:uppercase}.station-avatar{display:inline-flex;align-items:center;justify-content:center;width:48px;height:48px;border-radius:12px;overflow:hidden;background:linear-gradient(135deg,var(--color-accent),#7C3AED);flex-shrink:0;color:#fff;font-weight:600;font-size:.875rem}.station-avatar-image{width:100%;height:100%;object-fit:cover}.station-avatar-initials{text-transform:uppercase;letter-spacing:.05em}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-sm);padding:var(--space-sm) var(--space-lg);font-size:var(--font-size-sm);font-weight:500;border:none;border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-fast);font-family:var(--font-family);-webkit-user-select:none;user-select:none;white-space:nowrap;position:relative;overflow:hidden}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background-color:var(--color-accent);color:#fff}.btn-primary:hover:not(:disabled){background-color:var(--color-accent-hover)}.btn-primary:active:not(:disabled){background-color:var(--color-accent-active)}.btn-secondary{background-color:var(--color-bg);color:var(--color-text);border:1px solid var(--color-border)}.btn-secondary:hover:not(:disabled){background-color:var(--color-border)}.btn-ghost{background-color:transparent;color:var(--color-accent)}.btn-ghost:hover:not(:disabled){background-color:var(--color-bg)}.btn-danger{background-color:var(--color-error);color:#fff}.btn-danger:hover:not(:disabled){background-color:#dc2626}.btn-success{background-color:var(--color-success);color:#fff}.btn-success:hover:not(:disabled){background-color:#059669}.btn-xs{padding:2px 8px;font-size:var(--font-size-xs)}.btn-sm{padding:6px 12px;font-size:var(--font-size-xs)}.btn-lg{padding:var(--space-md) var(--space-xl);font-size:var(--font-size-base)}.btn-icon{padding:var(--space-sm);width:40px;height:40px}.btn-round{width:48px;height:48px;padding:0;border-radius:50%}.btn-round-sm{width:40px;height:40px}.btn-round-lg{width:80px;height:80px;font-size:var(--font-size-2xl)}.btn-group{display:flex;gap:var(--space-sm);flex-wrap:wrap}.btn-group-vertical{flex-direction:column}.badge{display:inline-flex;align-items:center;gap:4px;padding:2px 8px;font-size:var(--font-size-xs);font-weight:500;border-radius:var(--radius-md);white-space:nowrap;background-color:var(--color-border);color:var(--color-text)}.badge-live{background-color:var(--color-error);color:#fff}.badge-live:before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background-color:#fff;animation:pulse 2s cubic-bezier(.4,0,.6,1) infinite}.badge-offline{background-color:var(--color-text-muted);color:#fff}.badge-unknown{background-color:var(--color-border);color:var(--color-text-secondary)}.badge-ok{background-color:#10b98133;color:var(--color-success)}.badge-error{background-color:#ef444433;color:var(--color-error)}.badge-warning{background-color:#f59e0b33;color:var(--color-warning)}.chip{display:inline-flex;align-items:center;gap:var(--space-sm);padding:6px 14px;font-size:var(--font-size-sm);font-family:var(--font-family);border-radius:var(--radius-full);background-color:var(--color-bg);border:1px solid var(--color-border);color:var(--color-text);cursor:pointer;transition:all var(--transition-fast);white-space:nowrap}.chip:hover{border-color:var(--color-accent);color:var(--color-accent)}.chip-active{background-color:var(--color-accent);border-color:var(--color-accent);color:#fff}.chip-close{margin-left:var(--space-xs);cursor:pointer;opacity:.7;transition:opacity var(--transition-fast)}.chip-close:hover{opacity:1}.genre-tag{display:inline-block;padding:4px 8px;font-size:var(--font-size-xs);background-color:var(--color-bg);border-radius:var(--radius-md);color:var(--color-text-secondary)}.field-group{margin-bottom:var(--space-lg);display:flex;flex-direction:column}.field-label{font-size:var(--font-size-sm);font-weight:500;color:var(--color-text);margin-bottom:var(--space-sm);display:block}.field-input,.field-select,.field-textarea{padding:var(--space-md) var(--space-lg);font-size:var(--font-size-base);border:1px solid var(--color-border);border-radius:var(--radius-md);background-color:var(--color-bg-raised);color:var(--color-text);font-family:var(--font-family);transition:all var(--transition-fast)}.field-input:focus,.field-select:focus,.field-textarea:focus{outline:none;border-color:var(--color-accent);box-shadow:0 0 0 3px #2563eb1a}html.dark .field-input:focus,html.dark .field-select:focus,html.dark .field-textarea:focus{box-shadow:0 0 0 3px #3b82f61a}.field-input::placeholder,.field-textarea::placeholder{color:var(--color-text-muted)}.field-textarea{resize:vertical;min-height:100px}.field-help{font-size:var(--font-size-xs);color:var(--color-text-secondary);margin-top:4px}.field-error{border-color:var(--color-error)}.field-error:focus{box-shadow:0 0 0 3px #ef44441a}.field-error-message{font-size:var(--font-size-xs);color:var(--color-error);margin-top:4px}.search-input-wrapper{position:relative;display:flex;align-items:center}.search-input-icon{position:absolute;left:var(--space-lg);color:var(--color-text-muted);pointer-events:none;display:flex;width:20px;height:20px}.search-input{padding:12px 16px 12px 44px;width:100%;border-radius:16px;border:1px solid var(--color-border);background-color:var(--color-bg-raised);color:var(--color-text);font-family:var(--font-family);font-size:1rem;transition:all .15s cubic-bezier(.4,0,.2,1);outline:none}.search-input:focus{border-color:var(--color-accent);box-shadow:0 0 0 3px #2563eb1a}.search-input::placeholder{color:var(--color-text-muted)}.clean-list{list-style:none}.clean-list-item{padding:var(--space-md) 0;border-bottom:1px solid var(--color-border)}.clean-list-item:last-child{border-bottom:none}.chart-list{list-style:none;counter-reset:item}.chart-item{display:flex;align-items:center;padding:var(--space-md) 0;border-bottom:1px solid var(--color-border);counter-increment:item}.chart-item:last-child{border-bottom:none}.chart-item-number{width:32px;height:32px;border-radius:var(--radius-md);background-color:var(--color-bg);display:flex;align-items:center;justify-content:center;font-weight:600;color:var(--color-text-secondary);flex-shrink:0;margin-right:var(--space-lg)}.chart-item-content{flex:1;min-width:0}.grid{display:grid;gap:var(--space-lg)}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}@media (max-width: 640px){.grid-cols-2{grid-template-columns:repeat(1,minmax(0,1fr))}.grid-cols-3{grid-template-columns:repeat(2,minmax(0,1fr))}}.flex{display:flex}.flex-col{flex-direction:column}.flex-center{display:flex;align-items:center;justify-content:center}.flex-between{display:flex;align-items:center;justify-content:space-between}.flex-start{display:flex;align-items:flex-start}.flex-end{display:flex;align-items:flex-end}.gap-1{gap:var(--space-xs)}.gap-2{gap:var(--space-sm)}.gap-3{gap:var(--space-md)}.gap-4{gap:var(--space-lg)}.gap-6{gap:var(--space-xl)}.notice{padding:var(--space-lg);border-radius:var(--radius-lg);border:1px solid var(--color-border);background-color:var(--color-bg);color:var(--color-text)}.notice-title{font-weight:600;margin-bottom:var(--space-sm);display:block}.notice-info{background-color:#3b82f61a;border-color:var(--color-info);color:var(--color-info)}.notice-success{background-color:#10b9811a;border-color:var(--color-success);color:var(--color-success)}.notice-error{background-color:#ef44441a;border-color:var(--color-error);color:var(--color-error)}.notice-warning{background-color:#f59e0b1a;border-color:var(--color-warning);color:var(--color-warning)}.toast{position:fixed;top:var(--space-lg);left:50%;transform:translate(-50%);padding:var(--space-md) var(--space-lg);border-radius:var(--radius-full);background-color:#111827f2;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:#fff;font-size:var(--font-size-sm);z-index:var(--z-toast);max-width:calc(100% - 2 * var(--space-lg));box-shadow:var(--shadow-lg);animation:slideDown .3s ease-out;pointer-events:auto}html.dark .toast{background-color:#374151f2}@keyframes slideDown{0%{opacity:0;transform:translate(-50%) translateY(-20px)}to{opacity:1;transform:translate(-50%) translateY(0)}}.mini-player{position:fixed;bottom:64px;left:0;right:0;margin:var(--space-lg);margin-bottom:0;padding:var(--space-md);background-color:var(--color-card-bg);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid var(--color-card-border);border-radius:var(--radius-lg);z-index:var(--z-fixed);display:flex;align-items:center;gap:var(--space-md);box-shadow:var(--shadow-lg);transition:all var(--transition-normal)}@media (min-width: 768px){.mini-player{display:none}}.mini-player-hidden{opacity:0;pointer-events:none;transform:translateY(20px)}.mini-player-content{flex:1;min-width:0}.mini-player-title{font-size:var(--font-size-sm);font-weight:600;color:var(--color-text);margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mini-player-subtitle{font-size:var(--font-size-xs);color:var(--color-text-secondary);margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mini-player-controls{display:flex;gap:var(--space-sm);flex-shrink:0}.overlay-backdrop{display:none}@media (min-width: 768px){.overlay-backdrop{display:block;position:fixed;top:0;right:0;bottom:0;left:0;background-color:#0000004d;z-index:calc(var(--z-overlay) - 1);animation:fadeIn var(--transition-normal);cursor:pointer}html.dark .overlay-backdrop{background-color:#00000080}}.overlay{position:fixed;top:0;right:0;bottom:0;left:0;background-color:var(--color-bg);z-index:var(--z-overlay);display:flex;flex-direction:column;overflow:hidden;animation:slideUp .3s cubic-bezier(.32,.72,0,1)}@media (min-width: 768px){.overlay{inset:0 0 0 auto;width:min(540px,100%);border-left:1px solid var(--color-border);box-shadow:var(--shadow-xl);animation:slideInRight .25s cubic-bezier(.32,.72,0,1)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.overlay-hidden{display:none}.overlay-header{position:sticky;top:0;z-index:var(--z-sticky);display:flex;align-items:center;justify-content:space-between;padding:var(--space-lg);height:56px;background-color:var(--color-bg-raised);border-bottom:1px solid var(--color-border)}.overlay-header-title{font-size:var(--font-size-lg);font-weight:600;color:var(--color-text);margin:0}.overlay-content{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch}.overlay-hero{padding:var(--space-2xl) var(--space-lg);display:flex;flex-direction:column;align-items:center;text-align:center;gap:var(--space-xl)}.overlay-hero-title{display:flex;align-items:center;gap:8px;justify-content:center}.overlay-hero-title h1{font-size:1.5rem;font-weight:700;color:var(--color-text);margin:0}.overlay-hero-subtitle{font-size:var(--font-size-base);color:var(--color-text-secondary);margin:0}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeOutDown{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(20px)}}@keyframes slideUp{0%{transform:translateY(100%)}to{transform:translateY(0)}}@keyframes slideDownFull{0%{transform:translateY(-100%)}to{transform:translateY(0)}}@keyframes slideInRight{0%{opacity:0;transform:translate(20px)}to{opacity:1;transform:translate(0)}}@keyframes slideOutRight{0%{opacity:1;transform:translate(0)}to{opacity:0;transform:translate(20px)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-25%)}}@keyframes equalizer{0%,to{transform:scaleY(.4)}50%{transform:scaleY(1)}}.animate-fade-in{animation:fadeIn var(--transition-normal)}.animate-fade-in-up{animation:fadeInUp var(--transition-normal)}.animate-slide-up{animation:slideUp var(--transition-normal)}.animate-slide-in-right{animation:slideInRight var(--transition-normal)}.animate-pulse{animation:pulse 2s cubic-bezier(.4,0,.6,1) infinite}.animate-spin{animation:spin 1s linear infinite}.animate-bounce{animation:bounce 1s ease-in-out infinite}.equalizer{display:flex;gap:3px;align-items:flex-end;height:20px}.equalizer-bar{width:3px;background-color:var(--color-accent);border-radius:2px;animation:equalizer .6s ease-in-out infinite}.equalizer-bar:nth-child(2){animation-delay:.1s}.equalizer-bar:nth-child(3){animation-delay:.2s}.equalizer-bar:nth-child(4){animation-delay:.3s}.admin-login-form{max-width:400px;margin:var(--space-3xl) auto;padding:var(--space-2xl);background-color:var(--color-card-bg);border:1px solid var(--color-card-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-md)}.admin-form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:var(--space-lg);margin-bottom:var(--space-lg)}.admin-source-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:var(--space-lg)}.admin-form-section{background-color:var(--color-bg);padding:var(--space-lg);border-radius:var(--radius-lg);border:1px solid var(--color-border)}.admin-form-section-title{font-size:var(--font-size-lg);font-weight:600;margin-bottom:var(--space-lg);color:var(--color-text)}.pipeline-flags{display:flex;gap:var(--space-sm);flex-wrap:wrap}.pipeline-flag{padding:4px 8px;font-size:var(--font-size-xs);font-weight:500;border-radius:var(--radius-sm);background-color:var(--color-border);color:var(--color-text);cursor:pointer;transition:all var(--transition-fast);border:1px solid transparent}.pipeline-flag:hover{border-color:var(--color-text-secondary)}.flag-on{background-color:var(--color-success);color:#fff}.flag-off{background-color:var(--color-error);color:#fff}.hidden{display:none!important}.invisible{visibility:hidden}.opacity-50{opacity:.5}.opacity-75{opacity:.75}.rounded{border-radius:var(--radius-md)}.rounded-lg{border-radius:var(--radius-lg)}.rounded-full{border-radius:var(--radius-full)}.shadow{box-shadow:var(--shadow-md)}.shadow-lg{box-shadow:var(--shadow-lg)}.border{border:1px solid var(--color-border)}.border-top{border-top:1px solid var(--color-border)}.border-bottom{border-bottom:1px solid var(--color-border)}.divide-y>*+*{border-top:1px solid var(--color-border)}.m-0{margin:0}.mx-auto{margin-left:auto;margin-right:auto}.my-auto{margin-top:auto;margin-bottom:auto}.mt-auto{margin-top:auto}.mb-auto{margin-bottom:auto}.p-0{padding:0}.p-1{padding:var(--space-xs)}.p-2{padding:var(--space-sm)}.p-3{padding:var(--space-md)}.p-4{padding:var(--space-lg)}.px-0{padding-left:0;padding-right:0}.px-2{padding-left:var(--space-sm);padding-right:var(--space-sm)}.px-4{padding-left:var(--space-lg);padding-right:var(--space-lg)}.py-0{padding-top:0;padding-bottom:0}.py-2{padding-top:var(--space-sm);padding-bottom:var(--space-sm)}.py-4{padding-top:var(--space-lg);padding-bottom:var(--space-lg)}.w-full{width:100%}.h-full{height:100%}.min-h-full{min-height:100%}.aspect-square{aspect-ratio:1}.aspect-video{aspect-ratio:16 / 9}.overflow-hidden{overflow:hidden}.overflow-y-auto{overflow-y:auto}.pointer-events-none{pointer-events:none}.pointer-events-auto{pointer-events:auto}.cursor-pointer{cursor:pointer}.cursor-default{cursor:default}.select-none{-webkit-user-select:none;user-select:none}@media (max-width: 640px){:root{font-size:14px}h1{font-size:var(--font-size-2xl)}h2{font-size:var(--font-size-xl)}.content-container{padding:0 var(--space-md)}.grid-cols-3{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (min-width: 640px){:root{font-size:16px}}@media print{body{background-color:#fff;color:#000}.sidebar,.bottom-nav,.top-nav,.mini-player,.btn,.badge{display:none}.app-layout{flex-direction:column}.main-content{padding-bottom:0}}.skip-to-content{position:absolute;top:-100%;left:var(--space-lg);padding:var(--space-sm) var(--space-lg);background-color:var(--color-accent);color:#fff;border-radius:var(--radius-md);font-size:var(--font-size-sm);font-weight:500;z-index:var(--z-toast);text-decoration:none;transition:top var(--transition-fast)}.skip-to-content:focus{top:var(--space-lg)}.btn:focus-visible,.field-input:focus-visible,.field-select:focus-visible,a:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px}@media (prefers-reduced-motion: reduce){*{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}@media (prefers-contrast: more){.card{border-width:2px}.btn{border:2px solid currentColor}}.app-shell{padding:var(--space-lg) 0;display:flex;flex-direction:column;gap:var(--space-xl)}.toast-container{position:fixed;top:var(--space-lg);left:50%;transform:translate(-50%);z-index:var(--z-toast);display:flex;flex-direction:column;gap:var(--space-sm);pointer-events:none}.toast-info{background-color:#3b82f6f2;color:#fff}.toast-success{background-color:#10b981f2;color:#fff}.toast-error{background-color:#ef4444f2;color:#fff}.card-meta{color:var(--color-text-muted);font-size:var(--font-size-sm)}.filter-chips-section{padding:var(--space-md) 0}.filter-chips-container{display:flex;gap:var(--space-sm);overflow-x:auto;padding-bottom:var(--space-sm);-webkit-overflow-scrolling:touch;scrollbar-width:none}.filter-chips-container::-webkit-scrollbar{display:none}.section-header{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:var(--space-lg)}.section-title{font-size:var(--font-size-xl);font-weight:700;color:var(--color-text);margin:0}.section-meta{font-size:var(--font-size-sm);color:var(--color-text-muted)}.stations-section{display:flex;flex-direction:column;gap:var(--space-lg)}.station-grid{display:flex;flex-direction:column;gap:var(--space-md)}@keyframes shimmer{0%{background-position:-400px 0}to{background-position:400px 0}}.skeleton{background:linear-gradient(90deg,var(--color-border) 25%,var(--color-bg) 50%,var(--color-border) 75%);background-size:800px 100%;animation:shimmer 1.5s ease-in-out infinite;border-radius:var(--radius-md)}.skeleton-card{height:72px;border-radius:var(--radius-lg)}.skeleton-text{height:14px;width:60%}.skeleton-text-short{height:12px;width:40%}.loading-state{text-align:center;padding:var(--space-3xl) 0}.empty-state{text-align:center;padding:var(--space-3xl) 0;color:var(--color-text-muted)}.load-more-section{display:flex;justify-content:center;padding:var(--space-lg) 0}.charts-section{padding:var(--space-lg) 0}.charts-grid{display:grid;grid-template-columns:1fr;gap:var(--space-lg)}@media (min-width: 640px){.charts-grid{grid-template-columns:1fr 1fr}}.chart-index{width:32px;height:32px;border-radius:var(--radius-md);background-color:var(--color-bg);display:flex;align-items:center;justify-content:center;font-weight:600;color:var(--color-text-secondary);flex-shrink:0;margin-right:var(--space-lg);font-size:var(--font-size-sm)}.chart-content{flex:1;min-width:0}.chart-song{font-size:var(--font-size-sm);font-weight:600;color:var(--color-text);margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.chart-artist{font-size:var(--font-size-xs);color:var(--color-text-secondary);margin:0}.error-text{color:var(--color-error);font-size:var(--font-size-sm)}.station-card-avatar-container{position:relative;flex-shrink:0}.station-card-equalizer{position:absolute;bottom:-2px;left:50%;transform:translate(-50%);display:flex;gap:2px;align-items:flex-end;height:12px}.station-card-equalizer .equalizer-bar{width:3px;height:100%;background-color:var(--color-accent);border-radius:1px}.station-card-title-row{display:flex;align-items:center;gap:var(--space-xs);margin-bottom:2px}.station-card-meta-row{display:flex;align-items:center;gap:var(--space-sm);font-size:var(--font-size-xs);color:var(--color-text-secondary);margin-bottom:4px}.station-card-location{color:var(--color-text-secondary)}.station-card-status{color:var(--color-text-muted)}.station-card-genres{display:flex;gap:var(--space-xs);flex-wrap:wrap;margin-top:4px}.station-card-confidence-icon{color:var(--color-accent);flex-shrink:0}.station-card-action-btn{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:50%;border:none;background:transparent;cursor:pointer;color:var(--color-text-secondary);transition:all var(--transition-fast)}.station-card-action-btn:hover{background-color:var(--color-bg);color:var(--color-text)}.station-card-favorite-btn.favorite-active{color:var(--color-error)}.station-card-play-btn{color:var(--color-accent)}.station-card-play-btn:hover{background-color:#2563eb1a}html.dark .station-card-play-btn:hover{background-color:#3b82f61a}.heart-filled{color:var(--color-error)}.heart-outline{color:var(--color-text-muted)}.spin-animation{animation:spin 1s linear infinite}.station-avatar-playing{box-shadow:0 0 0 3px var(--color-accent)}.mini-player-left{display:flex;align-items:center;gap:var(--space-md);flex:1;min-width:0;background:none;border:none;padding:0;cursor:pointer;text-align:left;color:inherit;font-family:inherit}.mini-player-info{flex:1;min-width:0}.mini-player-station-name{font-size:var(--font-size-sm);font-weight:600;color:var(--color-text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mini-player-song{display:flex;align-items:center;gap:var(--space-xs);font-size:var(--font-size-xs);color:var(--color-text-secondary)}.mini-player-pulse-dot{width:6px;height:6px;border-radius:50%;background-color:var(--color-error);animation:pulse 2s cubic-bezier(.4,0,.6,1) infinite;flex-shrink:0}.mini-player-song-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mini-player-expand{display:flex;align-items:center;padding:var(--space-sm)}.mini-player-avatar{width:40px;height:40px;flex-shrink:0}.mini-player-play-button{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;border:none;background-color:var(--color-accent);color:#fff;cursor:pointer;transition:background-color var(--transition-fast);flex-shrink:0}.mini-player-play-button:hover{background-color:var(--color-accent-hover)}.mini-player-loader{animation:spin 1s linear infinite}.max-w-3xl{max-width:48rem}.text-muted-foreground{color:var(--color-text-muted)}.overlay-header-btn{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;border:none;background:transparent;cursor:pointer;color:var(--color-text);transition:background-color var(--transition-fast)}.overlay-header-btn:hover{background-color:var(--color-bg)}.overlay-header-btn.active{color:var(--color-error)}.overlay-header-actions{display:flex;gap:var(--space-sm)}.overlay-loading{display:flex;align-items:center;justify-content:center;flex:1;padding:var(--space-3xl)}.overlay-spinner{animation:spin 1s linear infinite;color:var(--color-accent)}.overlay-error{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-lg);flex:1;padding:var(--space-3xl);color:var(--color-text-secondary)}.overlay-retry-btn{padding:var(--space-sm) var(--space-lg);border-radius:var(--radius-md);border:1px solid var(--color-border);background:var(--color-bg-raised);color:var(--color-text);cursor:pointer;font-size:var(--font-size-sm);font-family:var(--font-family);transition:all var(--transition-fast)}.overlay-retry-btn:hover{background-color:var(--color-bg)}.overlay-hero-avatar{width:128px;height:128px}.overlay-hero-badge{color:var(--color-accent);margin-left:var(--space-sm);vertical-align:middle}.overlay-hero-meta{font-size:var(--font-size-base);color:var(--color-text-secondary);margin:0}.overlay-play-btn{display:inline-flex;align-items:center;justify-content:center;width:80px;height:80px;border-radius:50%;border:none;background-color:var(--color-accent);color:#fff;cursor:pointer;transition:all var(--transition-fast);box-shadow:var(--shadow-lg)}.overlay-play-btn:hover:not(:disabled){background-color:var(--color-accent-hover);transform:scale(1.05)}.overlay-play-btn:disabled{opacity:.7;cursor:not-allowed}.overlay-section{padding:var(--space-lg);border-top:1px solid var(--color-border)}.overlay-section-title{font-size:var(--font-size-lg);font-weight:600;color:var(--color-text);margin:0 0 var(--space-md) 0}.overlay-section-text{font-size:var(--font-size-base);color:var(--color-text-secondary);line-height:var(--line-height-relaxed);margin:0}.overlay-now-playing{display:flex;align-items:center;gap:var(--space-md);background-color:var(--color-bg-raised)}.overlay-now-playing-icon{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:var(--radius-md);background-color:var(--color-accent);color:#fff;flex-shrink:0}.overlay-now-playing-content{flex:1;min-width:0}.overlay-now-playing-title{font-size:var(--font-size-base);font-weight:600;color:var(--color-text);margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.overlay-now-playing-artist{font-size:var(--font-size-sm);color:var(--color-text-secondary);margin:2px 0 0}.overlay-streams{display:flex;flex-direction:column;gap:var(--space-sm)}.overlay-stream-option{display:flex;align-items:center;gap:var(--space-md);padding:var(--space-md);border-radius:var(--radius-md);border:1px solid var(--color-border);background-color:var(--color-bg-raised);cursor:pointer;transition:all var(--transition-fast)}.overlay-stream-option:hover{border-color:var(--color-accent)}.overlay-stream-radio{-moz-appearance:none;appearance:none;-webkit-appearance:none;width:18px;height:18px;border:2px solid var(--color-border);border-radius:50%;flex-shrink:0;cursor:pointer;transition:all var(--transition-fast);position:relative}.overlay-stream-radio:checked{border-color:var(--color-accent);background-color:var(--color-accent)}.overlay-stream-radio:checked:after{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:6px;height:6px;border-radius:50%;background:#fff}.overlay-stream-label{display:flex;align-items:center;gap:var(--space-sm);flex:1;font-size:var(--font-size-sm);color:var(--color-text)}.overlay-stream-badge{font-size:var(--font-size-xs);padding:2px 8px;border-radius:var(--radius-full);font-weight:500}.overlay-stream-badge.available{background-color:#10b98126;color:var(--color-success)}.overlay-stream-badge.offline{background-color:#9ca3af26;color:var(--color-text-muted)}.overlay-recent-list{list-style:none;display:flex;flex-direction:column}.overlay-recent-item{padding:var(--space-md) 0;border-bottom:1px solid var(--color-border)}.overlay-recent-item:last-child{border-bottom:none}.overlay-recent-title{font-size:var(--font-size-sm);font-weight:500;color:var(--color-text);margin:0}.overlay-recent-artist{font-size:var(--font-size-xs);color:var(--color-text-secondary);margin:2px 0 0}.search-page{padding:var(--space-lg) 0;display:flex;flex-direction:column;gap:var(--space-lg)}.search-icon{position:absolute;left:var(--space-lg);color:var(--color-text-muted);pointer-events:none}.filter-chips{display:flex;gap:var(--space-sm);overflow-x:auto;padding-bottom:var(--space-xs);scrollbar-width:none}.filter-chips::-webkit-scrollbar{display:none}.filter-chip{display:inline-flex;align-items:center;padding:6px 14px;font-size:var(--font-size-sm);font-family:var(--font-family);border-radius:var(--radius-full);background-color:var(--color-bg);border:1px solid var(--color-border);color:var(--color-text);cursor:pointer;transition:all var(--transition-fast);white-space:nowrap}.filter-chip:hover{border-color:var(--color-accent);color:var(--color-accent)}.filter-chip-active{background-color:var(--color-accent);border-color:var(--color-accent);color:#fff}.browse-section{display:flex;flex-direction:column;gap:var(--space-xl)}.browse-grid-wrapper{display:flex;flex-direction:column;gap:var(--space-md)}.browse-title{font-size:var(--font-size-lg);font-weight:600;color:var(--color-text);margin:0}.browse-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-md)}@media (min-width: 640px){.browse-grid{grid-template-columns:repeat(3,1fr)}}.browse-card{padding:var(--space-xl) var(--space-md);text-align:center;background-color:var(--color-card-bg);border:1px solid var(--color-card-border);border-radius:var(--radius-lg);cursor:pointer;font-size:var(--font-size-sm);font-family:var(--font-family);font-weight:500;color:var(--color-text);transition:all var(--transition-fast)}.browse-card:hover{border-color:var(--color-accent);color:var(--color-accent);box-shadow:var(--shadow-md)}.search-results,.stations-list{display:flex;flex-direction:column;gap:var(--space-md)}.loading{text-align:center;padding:var(--space-3xl) var(--space-lg);color:var(--color-text-muted);font-size:var(--font-size-sm);display:flex;flex-direction:column;align-items:center;gap:var(--space-md)}.error{text-align:center;padding:var(--space-xl) var(--space-lg);color:var(--color-error);font-size:var(--font-size-sm);background-color:#ef44440f;border-radius:var(--radius-lg);border:1px solid rgba(239,68,68,.15)}.no-results{text-align:center;padding:var(--space-3xl) var(--space-lg);color:var(--color-text-muted);font-size:var(--font-size-sm)}.favorites-page{padding:var(--space-lg) 0;display:flex;flex-direction:column;gap:var(--space-lg)}.favorites-heading{font-size:var(--font-size-2xl);font-weight:700;color:var(--color-text);margin:0}.favorites-empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:var(--space-3xl) var(--space-lg);gap:var(--space-md)}.empty-state-icon{color:var(--color-text-muted);margin-bottom:var(--space-md)}.empty-state-title{font-size:var(--font-size-xl);font-weight:600;color:var(--color-text);margin:0}.empty-state-message{font-size:var(--font-size-sm);color:var(--color-text-secondary);margin:0;max-width:300px}.empty-state-button{margin-top:var(--space-md);padding:var(--space-sm) var(--space-xl);font-size:var(--font-size-sm);font-family:var(--font-family);font-weight:500;border:none;border-radius:var(--radius-full);background-color:var(--color-accent);color:#fff;cursor:pointer;transition:background-color var(--transition-fast)}.empty-state-button:hover{background-color:var(--color-accent-hover)}.favorites-content{display:flex;flex-direction:column;gap:var(--space-md)}.profile-page{padding:var(--space-lg) 0;display:flex;flex-direction:column;gap:var(--space-xl)}.profile-header{display:flex;flex-direction:column;align-items:center;gap:var(--space-md);padding:var(--space-xl) 0}.user-avatar{display:flex;align-items:center;justify-content:center;width:80px;height:80px;border-radius:50%;background-color:var(--color-bg);border:2px solid var(--color-border)}.user-avatar-icon{color:var(--color-text-muted)}.user-name{font-size:var(--font-size-2xl);font-weight:700;color:var(--color-text);margin:0}.profile-section{display:flex;flex-direction:column;gap:var(--space-lg)}.profile-section-title{font-size:var(--font-size-lg);font-weight:600;color:var(--color-text);margin:0}.settings-card{display:flex;align-items:center;justify-content:space-between;padding:var(--space-lg);background-color:var(--color-card-bg);border:1px solid var(--color-card-border);border-radius:var(--radius-lg)}.settings-card-left{display:flex;align-items:center;gap:var(--space-md)}.settings-icon{color:var(--color-text-secondary)}.settings-label{font-size:var(--font-size-base);font-weight:500;color:var(--color-text)}.toggle-switch{position:relative;width:48px;height:28px;border-radius:var(--radius-full);background-color:var(--color-border);border:none;cursor:pointer;transition:background-color var(--transition-fast);padding:0}.toggle-switch-active{background-color:var(--color-accent)}.toggle-switch-dot{position:absolute;top:3px;left:3px;width:22px;height:22px;border-radius:50%;background-color:#fff;transition:transform var(--transition-fast);box-shadow:var(--shadow-sm)}.toggle-switch-active .toggle-switch-dot{transform:translate(20px)}.engagement-stats{margin-top:var(--space-lg);display:flex;flex-direction:column;gap:var(--space-lg)}.stats-title{font-size:var(--font-size-base);font-weight:600;color:var(--color-text);margin:0}.stats-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-md)}@media (min-width: 640px){.stats-grid{grid-template-columns:repeat(4,1fr)}}.stat-value{font-size:var(--font-size-2xl);font-weight:700;color:var(--color-accent);margin:0}.stat-label{font-size:var(--font-size-sm);color:var(--color-text-secondary);margin:var(--space-sm) 0 0 0}.achievements-section{margin-top:var(--space-lg)}.achievements-title{font-size:var(--font-size-base);font-weight:600;color:var(--color-text);margin:0 0 var(--space-md) 0}.achievements-list{display:flex;flex-direction:column;gap:var(--space-sm)}.achievement-item{display:flex;align-items:flex-start;gap:var(--space-md);padding:var(--space-md);background-color:var(--color-card-bg);border:1px solid var(--color-card-border);border-radius:var(--radius-md)}.achievement-icon{font-size:var(--font-size-xl);flex-shrink:0}.achievement-content{flex:1}.achievement-title{font-size:var(--font-size-sm);font-weight:600;color:var(--color-text)}.achievement-description{font-size:var(--font-size-xs);color:var(--color-text-secondary);margin-top:2px}.about-content{display:flex;flex-direction:column;gap:var(--space-sm)}.about-text{font-size:var(--font-size-base);font-weight:600;color:var(--color-text);margin:0}.about-description{font-size:var(--font-size-sm);color:var(--color-text-secondary);margin:0}.settings-sublabel{display:block;font-size:var(--font-size-xs);color:var(--color-text-muted);font-weight:400;margin-top:2px}.profile-location-label{display:flex;align-items:center;gap:var(--space-xs);font-size:var(--font-size-sm);color:var(--color-text-secondary);margin:0}.location-picker{display:flex;flex-direction:column;gap:var(--space-md);padding:var(--space-lg);background-color:var(--color-card-bg);border:1px solid var(--color-card-border);border-radius:var(--radius-lg);animation:fadeIn var(--transition-normal)}.location-divider{display:flex;align-items:center;gap:var(--space-md);color:var(--color-text-muted);font-size:var(--font-size-xs)}.location-divider:before,.location-divider:after{content:"";flex:1;height:1px;background-color:var(--color-border)}.location-form{display:flex;flex-direction:column;gap:var(--space-sm)}.location-form-actions{display:flex;gap:var(--space-sm);margin-top:var(--space-xs)}