@font-face{font-family:Satoshi;src:url(/fonts/Satoshi-Variable.woff2)format("woff2-variations"),url(/fonts/Satoshi-Variable.ttf)format("truetype-variations");font-weight:300 900;font-style:normal;font-display:block}@font-face{font-family:Satoshi;src:url(/fonts/Satoshi-Light.woff)format("woff"),url(/fonts/Satoshi-Light.otf)format("opentype");font-weight:300;font-style:normal;font-display:block}@font-face{font-family:Satoshi;src:url(/fonts/Satoshi-Regular.woff2)format("woff2"),url(/fonts/Satoshi-Regular.woff)format("woff"),url(/fonts/Satoshi-Regular.otf)format("opentype");font-weight:400;font-style:normal;font-display:block}@font-face{font-family:Satoshi;src:url(/fonts/Satoshi-Medium.woff2)format("woff2"),url(/fonts/Satoshi-Medium.woff)format("woff"),url(/fonts/Satoshi-Medium.otf)format("opentype");font-weight:500;font-style:normal;font-display:block}@font-face{font-family:Satoshi;src:url(/fonts/Satoshi-Bold.woff2)format("woff2"),url(/fonts/Satoshi-Bold.woff)format("woff"),url(/fonts/Satoshi-Bold.otf)format("opentype");font-weight:700;font-style:normal;font-display:block}@font-face{font-family:Satoshi;src:url(/fonts/Satoshi-Black.woff2)format("woff2"),url(/fonts/Satoshi-Black.woff)format("woff"),url(/fonts/Satoshi-Black.otf)format("opentype");font-weight:900;font-style:normal;font-display:block}:root{--background:30 20% 97%;--foreground:20 10% 10%;--card:0 0% 100%;--card-foreground:20 10% 10%;--popover:0 0% 100%;--popover-foreground:20 10% 10%;--primary:38 90% 45%;--primary-foreground:0 0% 100%;--secondary:30 20% 95%;--secondary-foreground:20 20% 30%;--muted:30 15% 95%;--muted-foreground:20 8% 45%;--accent:30 25% 94%;--accent-foreground:20 20% 30%;--destructive:0 85% 60%;--destructive-foreground:0 0% 100%;--success:142 71% 45%;--success-foreground:0 0% 100%;--warning:38 92% 50%;--warning-foreground:0 0% 100%;--info:217 91% 60%;--info-foreground:0 0% 100%;--border:25 15% 88%;--input:25 15% 88%;--ring:38 90% 45%;--radius:.75rem;--sidebar-background:30 15% 98%;--sidebar-foreground:20 10% 10%;--sidebar-primary:38 90% 45%;--sidebar-primary-foreground:0 0% 100%;--sidebar-accent:30 20% 95%;--sidebar-accent-foreground:20 20% 30%;--sidebar-border:25 15% 88%;--chart-1:38 90% 50%;--chart-2:160 100% 45%;--chart-3:25 95% 50%;--chart-4:340 100% 55%;--chart-5:260 100% 55%;--card-shadow:0 3px 10px #1e0f000f;--stat-blue:linear-gradient(135deg, #da8e0b, #e8a530);--stat-green:linear-gradient(135deg, #1a9948, #33cc6b);--stat-orange:linear-gradient(135deg, #e06106, #f6a823);--stat-red:linear-gradient(135deg, #d41111, #e64d4d);--stat-purple:linear-gradient(135deg, #b85814, #e09429);--font-family:"Satoshi", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--space-xs:4px;--space-sm:8px;--space-md:16px;--space-lg:24px;--space-xl:32px;--space-2xl:48px;--space-3xl:64px;--radius-sm:6px;--radius-md:8px;--radius-lg:12px;--radius-xl:16px;--radius-full:9999px;--transition-fast:.15s cubic-bezier(.4, 0, .2, 1);--transition-normal:.25s cubic-bezier(.4, 0, .2, 1);--transition-slow:.4s cubic-bezier(.4, 0, .2, 1)}.dark{--background:20 10% 6%;--foreground:35 10% 92%;--card:20 8% 10%;--card-foreground:35 10% 92%;--popover:20 8% 9%;--popover-foreground:35 10% 92%;--primary:38 90% 55%;--primary-foreground:0 0% 6%;--secondary:20 8% 15%;--secondary-foreground:35 10% 85%;--muted:20 6% 14%;--muted-foreground:25 8% 50%;--accent:30 50% 16%;--accent-foreground:38 90% 70%;--destructive:0 72% 55%;--destructive-foreground:0 0% 100%;--success:155 65% 48%;--warning:38 85% 58%;--info:217 80% 60%;--border:20 6% 14%;--input:20 6% 14%;--ring:38 90% 55%;--sidebar-background:20 10% 5%;--sidebar-foreground:35 10% 92%;--sidebar-primary:38 90% 55%;--sidebar-primary-foreground:0 0% 6%;--sidebar-accent:30 30% 13%;--sidebar-accent-foreground:38 80% 70%;--sidebar-border:20 6% 12%;--card-shadow:0 4px 20px #00000080;--gradient-primary:linear-gradient(135deg, #f4a825, #ec6d13);--gradient-card:linear-gradient(145deg, #211e1c, #161413)}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:16px}body{font-family:var(--font-family);background:hsl(var(--background));color:hsl(var(--foreground));-webkit-tap-highlight-color:transparent;min-height:100vh;line-height:1.6}h1,h2,h3,h4,h5,h6{color:hsl(var(--foreground));font-weight:700;line-height:1.3}h1{font-size:1.875rem}h2{font-size:1.5rem}h3{font-size:1.25rem}h4{font-size:1.125rem}h5{font-size:1rem}h6{font-size:.875rem}p{color:hsl(var(--muted-foreground));line-height:1.7}a{color:hsl(var(--primary));transition:color var(--transition-fast);text-decoration:none}a:hover{opacity:.85}.card{background:hsl(var(--card));color:hsl(var(--card-foreground));border:1px solid hsl(var(--border));border-radius:var(--radius-lg);padding:var(--space-lg);box-shadow:var(--card-shadow);transition:box-shadow var(--transition-normal), border-color var(--transition-normal)}.card:hover{box-shadow:0 6px 20px #00000014}.dark .card:hover{box-shadow:0 6px 20px #0000004d}.card-title{margin-bottom:var(--space-xs);font-size:1.0625rem;font-weight:600}.card-description{color:hsl(var(--muted-foreground));font-size:.875rem}.stat-card{border-radius:var(--radius-lg);padding:var(--space-lg);color:#fff;position:relative;overflow:hidden}.stat-card.blue{background:var(--stat-blue)}.stat-card.green{background:var(--stat-green)}.stat-card.orange{background:var(--stat-orange)}.stat-card.red{background:var(--stat-red)}.stat-card.purple{background:var(--stat-purple)}.stat-card .stat-value{font-size:2rem;font-weight:800;line-height:1.2}.stat-card .stat-label{opacity:.9;margin-bottom:var(--space-xs);font-size:.875rem;font-weight:500}.stat-card .stat-subtitle{opacity:.75;margin-top:var(--space-xs);font-size:.75rem}.stat-card .stat-icon{top:var(--space-md);right:var(--space-md);border-radius:var(--radius-full);background:#fff3;justify-content:center;align-items:center;width:36px;height:36px;display:flex;position:absolute}.btn{justify-content:center;align-items:center;gap:var(--space-sm);font-family:var(--font-family);border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-fast);white-space:nowrap;border:1px solid #0000;padding:.5rem 1rem;font-size:.875rem;font-weight:500;line-height:1.5;text-decoration:none;display:inline-flex}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:hsl(var(--primary));color:hsl(var(--primary-foreground));border-color:hsl(var(--primary))}.btn-primary:hover:not(:disabled){opacity:.9}.btn-secondary{background:hsl(var(--secondary));color:hsl(var(--secondary-foreground));border-color:hsl(var(--border))}.btn-secondary:hover:not(:disabled){background:hsl(var(--accent))}.btn-ghost{color:hsl(var(--foreground));background:0 0}.btn-ghost:hover:not(:disabled){background:hsl(var(--accent))}.btn-destructive{background:hsl(var(--destructive));color:hsl(var(--destructive-foreground))}.btn-outline{color:hsl(var(--foreground));border-color:hsl(var(--border));background:0 0}.btn-outline:hover:not(:disabled){background:hsl(var(--accent))}.btn-sm{padding:.375rem .75rem;font-size:.8125rem}.btn-lg{padding:.75rem 1.5rem;font-size:1rem}.btn-icon{width:36px;height:36px;padding:.5rem}.input,input[type=text],input[type=email],input[type=password],input[type=tel],input[type=number],input[type=url],textarea,select{font-family:var(--font-family);border:1px solid hsl(var(--input));border-radius:var(--radius-md);background:hsl(var(--background));color:hsl(var(--foreground));width:100%;transition:border-color var(--transition-fast), box-shadow var(--transition-fast);outline:none;padding:.625rem .75rem;font-size:.875rem}.input:focus,input:focus,textarea:focus,select:focus{border-color:hsl(var(--ring));box-shadow:0 0 0 2px hsl(var(--ring) / .2)}.input::placeholder,input::placeholder,textarea::placeholder{color:hsl(var(--muted-foreground))}label{margin-bottom:var(--space-xs);color:hsl(var(--foreground));font-size:.875rem;font-weight:500;display:block}.form-group{margin-bottom:var(--space-md)}.form-error{color:hsl(var(--destructive));margin-top:var(--space-xs);font-size:.75rem}.badge{border-radius:var(--radius-full);align-items:center;padding:.125rem .5rem;font-size:.75rem;font-weight:500;line-height:1.5;display:inline-flex}.badge-primary{background:hsl(var(--primary) / .1);color:hsl(var(--primary))}.badge-success{background:hsl(var(--success) / .1);color:hsl(var(--success))}.badge-warning{background:hsl(var(--warning) / .1);color:hsl(var(--warning))}.badge-destructive{background:hsl(var(--destructive) / .1);color:hsl(var(--destructive))}.portal-layout{height:100vh;display:flex;overflow:hidden}.portal-main{flex-direction:column;flex:1;min-width:0;display:flex;overflow:hidden}.portal-content{background:hsl(var(--background));-webkit-overflow-scrolling:touch;flex:1;overflow:hidden auto}.portal-content-inner{max-width:1536px;padding:24px 30px}@media (max-width:768px){.portal-content-inner{padding:16px 12px 80px}}.sidebar{border-right:1px solid hsl(var(--sidebar-border));background:hsl(var(--sidebar-background));flex-direction:column;flex-shrink:0;height:100vh;transition:width .5s ease-in-out;display:flex;position:relative}.sidebar.expanded{width:250px}.sidebar.collapsed{width:70px}.sidebar-header{border-bottom:1px solid hsl(var(--sidebar-border));align-items:center;gap:8px;height:56px;padding:0 16px;display:flex}.sidebar-logo{color:hsl(var(--sidebar-foreground));white-space:nowrap;font-size:1.25rem;font-weight:800;transition:opacity .5s ease-in-out,width .5s ease-in-out;overflow:hidden}.sidebar-toggle{width:32px;height:32px;color:hsl(var(--sidebar-foreground));cursor:pointer;border-radius:var(--radius-md);transition:background var(--transition-fast);background:0 0;border:none;flex-shrink:0;justify-content:center;align-items:center;display:flex}.sidebar-toggle:hover{background:hsl(var(--sidebar-accent))}.sidebar-nav{flex:1;padding:8px;overflow-y:auto}.sidebar-item{border-radius:var(--radius-md);color:hsl(var(--sidebar-foreground));cursor:pointer;transition:all var(--transition-fast);white-space:nowrap;text-align:left;background:0 0;border:none;align-items:center;gap:8px;width:100%;padding:8px 12px;font-size:.875rem;font-weight:400;text-decoration:none;display:flex;overflow:hidden}.sidebar-item:hover{background:hsl(var(--sidebar-accent))}.sidebar-item.active{background:hsl(var(--sidebar-primary) / .1);color:hsl(var(--sidebar-primary));font-weight:600}.sidebar-item-icon{flex-shrink:0;justify-content:center;align-items:center;width:20px;height:20px;display:flex}.sidebar-item-label{transition:opacity .5s ease-in-out,width .5s ease-in-out;overflow:hidden}.sidebar.collapsed .sidebar-item-label,.sidebar.collapsed .sidebar-logo{opacity:0;width:0}.sidebar-item.logout{color:hsl(var(--destructive))}.sidebar-item.logout:hover{background:hsl(var(--destructive) / .1)}@media (max-width:768px){.sidebar{z-index:50;transition:transform .3s ease-in-out;position:fixed;top:0;left:0;transform:translate(-100%);box-shadow:4px 0 20px #00000026;width:280px!important}.sidebar.mobile-open{transform:translate(0)}.sidebar-overlay{z-index:40;opacity:0;pointer-events:none;background:#00000080;transition:opacity .3s ease-in-out;position:fixed;inset:0}.sidebar-overlay.visible{opacity:1;pointer-events:auto}}@media (min-width:769px){.sidebar-overlay{display:none}}.topbar{border-bottom:1px solid hsl(var(--border));background:hsl(var(--card));flex-shrink:0;justify-content:space-between;align-items:center;gap:12px;height:56px;padding:0 16px;display:flex}@media (max-width:768px){.topbar{z-index:30;padding-top:env(safe-area-inset-top,0px);min-height:calc(env(safe-area-inset-top,0px) + 56px);position:fixed;top:0;left:0;right:0}.portal-content{padding-top:calc(env(safe-area-inset-top,0px) + 56px)}}.topbar-left{flex:1;align-items:center;gap:12px;min-width:0;display:flex}.topbar-title{white-space:nowrap;text-overflow:ellipsis;font-size:1rem;font-weight:600;overflow:hidden}.topbar-right{flex-shrink:0;align-items:center;gap:4px;display:flex}.topbar-menu-btn{display:none}@media (max-width:768px){.topbar-menu-btn{display:flex}}.bottom-nav{z-index:50;background:hsl(var(--card));border-top:1px solid hsl(var(--border));padding-bottom:env(safe-area-inset-bottom,0px);position:fixed;bottom:0;left:0;right:0}@media (min-width:769px){.bottom-nav{display:none}}.bottom-nav-items{justify-content:space-around;align-items:center;padding:6px 4px;display:flex}.bottom-nav-item{cursor:pointer;color:hsl(var(--muted-foreground));transition:color var(--transition-fast);-webkit-tap-highlight-color:transparent;flex-direction:column;flex:1;align-items:center;padding:4px 0;text-decoration:none;display:flex}.bottom-nav-item.active{color:hsl(var(--primary))}.bottom-nav-item-icon{margin-bottom:2px}.bottom-nav-item-label{text-align:center;font-size:.625rem;font-weight:500;line-height:1.2}.auth-page{min-height:100vh;display:flex}.auth-sidebar{background:hsl(var(--primary));width:50%;color:hsl(var(--primary-foreground));padding:var(--space-3xl);flex-direction:column;justify-content:center;align-items:center;display:none}@media (min-width:1024px){.auth-sidebar{display:flex}}.auth-sidebar h1{color:#fff;margin-bottom:var(--space-md);font-size:2.5rem;font-weight:800}.auth-sidebar p{color:#fffc;text-align:center;max-width:400px;font-size:1.125rem}.auth-main{padding:var(--space-xl);background:hsl(var(--background));flex-direction:column;flex:1;justify-content:center;align-items:center;display:flex}.auth-card{width:100%;max-width:420px}.auth-header{text-align:center;margin-bottom:var(--space-xl)}.auth-logo{color:hsl(var(--primary));margin-bottom:var(--space-sm);font-size:1.75rem;font-weight:900}.auth-tabs{background:hsl(var(--secondary));border-radius:var(--radius-md);margin-bottom:var(--space-xl);gap:4px;padding:4px;display:flex}.auth-tab{color:hsl(var(--muted-foreground));font-family:var(--font-family);border-radius:var(--radius-sm);cursor:pointer;transition:all var(--transition-fast);background:0 0;border:none;flex:1;padding:8px 16px;font-size:.875rem;font-weight:500}.auth-tab.active{background:hsl(var(--card));color:hsl(var(--foreground));box-shadow:var(--card-shadow)}.auth-divider{align-items:center;gap:var(--space-md);margin:var(--space-lg) 0;color:hsl(var(--muted-foreground));font-size:.8125rem;display:flex}.auth-divider:before,.auth-divider:after{content:"";background:hsl(var(--border));flex:1;height:1px}.landing-nav{padding:var(--space-md) var(--space-xl);border-bottom:1px solid hsl(var(--border));background:hsl(var(--card));z-index:30;justify-content:space-between;align-items:center;display:flex;position:sticky;top:0}.landing-nav-logo{color:hsl(var(--primary));font-size:1.5rem;font-weight:900}.landing-nav-links{align-items:center;gap:var(--space-sm);display:flex}.landing-nav.landing-nav-hero{z-index:10;background:0 0;border-bottom:1px solid #ffffff1a;position:absolute;top:0;left:0;right:0}.landing-nav.landing-nav-hero .landing-nav-logo{color:#fff}.landing-nav.landing-nav-hero .btn-ghost{color:#ffffffe6}.landing-nav.landing-nav-hero .btn-ghost:hover{color:#fff;background:#ffffff1a}.landing-hero{justify-content:center;align-items:center;width:100vw;min-height:min(85vh,650px);margin-left:calc(50% - 50vw);display:flex;position:relative;overflow:hidden}.landing-hero-bg{z-index:0;position:absolute;inset:0}.landing-hero-overlay{z-index:1;mix-blend-mode:normal;background:linear-gradient(135deg,#b43200e0 0%,#d25a00cc 30%,#c87800bf 55%,#be4600d1 80%,#781400eb 100%),radial-gradient(70% 60%,#00000073 0%,#00000026 50%,#0000 100%);position:absolute;inset:0}.landing-hero-sparkles{z-index:2;pointer-events:none;position:absolute;inset:0}.landing-hero-sparkles .sparkle{width:6px;height:6px;left:var(--x,50%);top:var(--y,50%);animation:3.5s ease-in-out infinite sparkleFloat;animation-delay:var(--delay,0s);background:#ffdc64e6;border-radius:50%;position:absolute;box-shadow:0 0 10px #ffc83299,0 0 20px #ffa0004d}@keyframes sparkleFloat{0%,to{opacity:0;transform:translateY(0)scale(.5)}20%{opacity:1;transform:translateY(-20px)scale(1)}80%{opacity:.8;transform:translateY(-60px)scale(.8)}}.landing-hero-content{z-index:3;text-align:center;padding:100px var(--space-xl) var(--space-2xl);width:100%;max-width:900px;margin:0 auto;position:relative}.landing-hero-badge{border-radius:var(--radius-full);-webkit-backdrop-filter:blur(12px);color:#ffd54f;letter-spacing:.03em;margin-bottom:var(--space-lg);background:#00000059;border:1px solid #ffc83266;align-items:center;gap:8px;padding:8px 20px;font-size:.8125rem;font-weight:600;animation:.6s ease-out fadeIn;display:inline-flex}.landing-hero h1{margin-bottom:var(--space-lg);color:#fff;text-shadow:0 2px 8px #0009,0 4px 30px #0006;font-size:clamp(2.25rem,5.5vw,3.75rem);font-weight:900;line-height:1.1;animation:.8s ease-out .1s both fadeIn}.hero-gradient-text{background:linear-gradient(135deg,#fff 0%,#ffe082 35%,#ffd54f 65%,#ffc107 100%);-webkit-text-fill-color:transparent;filter:drop-shadow(0 2px 6px #00000080);-webkit-background-clip:text;background-clip:text}.landing-hero p{max-width:580px;margin:0 auto var(--space-xl);color:#fffffff2;text-shadow:0 1px 4px #00000080,0 2px 16px #0000004d;font-size:1.2rem;line-height:1.6;animation:.8s ease-out .25s both fadeIn}.landing-hero-actions{gap:var(--space-md);flex-wrap:wrap;justify-content:center;animation:.8s ease-out .4s both fadeIn;display:flex}.btn-hero-primary{border-radius:var(--radius-full);color:#1a0800;font-family:var(--font-family);cursor:pointer;transition:all var(--transition-normal);background:linear-gradient(135deg,#ffc107,#ff9800);border:none;align-items:center;gap:8px;padding:14px 32px;font-size:1rem;font-weight:700;text-decoration:none;display:inline-flex;box-shadow:0 4px 20px #ff980066,0 0 40px #ffc10726}.btn-hero-primary:hover{background:linear-gradient(135deg,#ffd54f,#ffa726);transform:translateY(-2px);box-shadow:0 6px 30px #ff98008c,0 0 60px #ffc10740}.btn-hero-outline{border-radius:var(--radius-full);color:#fff;font-family:var(--font-family);cursor:pointer;transition:all var(--transition-normal);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:0 0;border:2px solid #ffffff80;align-items:center;gap:8px;padding:14px 32px;font-size:1rem;font-weight:600;text-decoration:none;display:inline-flex}.btn-hero-outline:hover{background:#ffffff26;border-color:#fffc;transform:translateY(-2px)}@media (max-width:640px){.landing-hero{min-height:auto}.landing-hero-content{padding:80px var(--space-md) var(--space-xl)}.landing-hero h1{font-size:clamp(1.75rem,8vw,2.5rem)}.landing-hero p{font-size:1rem}.landing-hero-actions{flex-direction:column;align-items:center}.btn-hero-primary,.btn-hero-outline{justify-content:center;width:100%;max-width:300px}}.landing-section{padding:var(--space-3xl) var(--space-xl);max-width:1200px;margin:0 auto}.landing-section-title{text-align:center;margin-bottom:var(--space-sm)}.landing-section-subtitle{text-align:center;margin-bottom:var(--space-2xl);max-width:600px;margin-left:auto;margin-right:auto}.landing-grid{gap:var(--space-lg);grid-template-columns:repeat(auto-fit,minmax(250px,1fr));display:grid}.landing-feature-card{padding:var(--space-xl);border-radius:var(--radius-lg);background:hsl(var(--card));border:1px solid hsl(var(--border));transition:all var(--transition-normal)}.landing-feature-card:hover{border-color:hsl(var(--primary) / .3);box-shadow:0 8px 30px #00000014}.dark .landing-feature-card:hover{box-shadow:0 8px 30px #0000004d}.landing-feature-icon{border-radius:var(--radius-md);width:48px;height:48px;margin-bottom:var(--space-md);background:hsl(var(--primary) / .1);color:hsl(var(--primary));justify-content:center;align-items:center;display:flex}.landing-feature-title{margin-bottom:var(--space-xs);font-size:1.0625rem;font-weight:600}.landing-feature-desc{color:hsl(var(--muted-foreground));font-size:.875rem}.landing-stats{gap:var(--space-lg);padding:var(--space-2xl) var(--space-xl);grid-template-columns:repeat(auto-fit,minmax(180px,1fr));max-width:1000px;margin:0 auto;display:grid}.landing-stat{text-align:center;padding:var(--space-xl);border-radius:var(--radius-lg);background:hsl(var(--card));border:1px solid hsl(var(--border))}.landing-stat-value{color:hsl(var(--primary));font-size:2.5rem;font-weight:800}.landing-stat-label{color:hsl(var(--muted-foreground));margin-top:var(--space-xs);font-size:.8125rem}.landing-cta{text-align:center;padding:var(--space-3xl) var(--space-xl);background:hsl(var(--primary) / .05);border-radius:var(--radius-xl);margin:var(--space-2xl) var(--space-xl);max-width:800px;margin-left:auto;margin-right:auto}.landing-footer{text-align:center;padding:var(--space-xl);border-top:1px solid hsl(var(--border));color:hsl(var(--muted-foreground));font-size:.8125rem}.stats-grid{gap:var(--space-md);margin-bottom:var(--space-xl);grid-template-columns:repeat(auto-fit,minmax(200px,1fr));display:grid}.dashboard-grid{gap:var(--space-lg);grid-template-columns:repeat(auto-fit,minmax(350px,1fr));display:grid}@media (max-width:768px){.stats-grid{grid-template-columns:repeat(2,1fr)}.dashboard-grid{grid-template-columns:1fr}}.data-table{border-collapse:collapse;width:100%;font-size:.875rem}.data-table th{text-align:left;color:hsl(var(--muted-foreground));border-bottom:1px solid hsl(var(--border));white-space:nowrap;padding:12px 16px;font-size:.8125rem;font-weight:500}.data-table td{border-bottom:1px solid hsl(var(--border));color:hsl(var(--foreground));padding:12px 16px}.data-table tr:hover td{background:hsl(var(--accent) / .5)}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:hsl(var(--muted-foreground) / .3);border-radius:var(--radius-full)}::-webkit-scrollbar-thumb:hover{background:hsl(var(--muted-foreground) / .5)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideInLeft{0%{opacity:0;transform:translate(-16px)}to{opacity:1;transform:translate(0)}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.animate-fade-in{animation:.4s ease-out fadeIn}.animate-slide-in{animation:.3s ease-out slideInLeft}.animate-spin{animation:1s linear infinite spin}.text-center{text-align:center}.text-right{text-align:right}.text-muted{color:hsl(var(--muted-foreground))}.text-primary{color:hsl(var(--primary))}.text-success{color:hsl(var(--success))}.text-warning{color:hsl(var(--warning))}.text-destructive{color:hsl(var(--destructive))}.flex{display:flex}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-xs{gap:var(--space-xs)}.gap-sm{gap:var(--space-sm)}.gap-md{gap:var(--space-md)}.gap-lg{gap:var(--space-lg)}.w-full{width:100%}.hidden{display:none}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.page-header{margin-bottom:var(--space-xl);justify-content:space-between;align-items:center;gap:var(--space-md);flex-wrap:wrap;display:flex}.page-header h1{font-size:1.5rem}.page-header-subtitle{color:hsl(var(--muted-foreground));font-size:.875rem}.tabs{border-bottom:1px solid hsl(var(--border));margin-bottom:var(--space-xl);-webkit-overflow-scrolling:touch;gap:2px;display:flex;overflow-x:auto}.tab{color:hsl(var(--muted-foreground));cursor:pointer;font-size:.875rem;font-weight:500;font-family:var(--font-family);white-space:nowrap;transition:all var(--transition-fast);background:0 0;border:none;border-bottom:2px solid #0000;padding:10px 16px}.tab:hover{color:hsl(var(--foreground))}.tab.active{color:hsl(var(--primary));border-bottom-color:hsl(var(--primary))}.context-switcher{border-bottom:1px solid hsl(var(--sidebar-border));background:hsl(var(--sidebar-accent) / .5);padding:12px}.context-switcher-btn{border:1px solid hsl(var(--sidebar-border));border-radius:var(--radius-md);background:hsl(var(--sidebar-background));width:100%;color:hsl(var(--sidebar-foreground));cursor:pointer;font-family:var(--font-family);transition:all var(--transition-fast);text-align:left;align-items:center;gap:8px;padding:8px 12px;font-size:.8125rem;display:flex}.context-switcher-btn:hover{border-color:hsl(var(--sidebar-primary))}.context-switcher-name{text-overflow:ellipsis;white-space:nowrap;flex:1;font-weight:600;overflow:hidden}.context-switcher-role{color:hsl(var(--muted-foreground));font-size:.75rem}.empty-state{text-align:center;padding:var(--space-3xl) var(--space-xl);color:hsl(var(--muted-foreground))}.empty-state-icon{border-radius:var(--radius-full);background:hsl(var(--accent));width:64px;height:64px;margin-bottom:var(--space-md);justify-content:center;align-items:center;display:inline-flex}.empty-state h3{margin-bottom:var(--space-sm)}.loading-spinner{justify-content:center;align-items:center;display:inline-flex}.loading-spinner svg{animation:1s linear infinite spin}.skeleton{background:hsl(var(--muted));border-radius:var(--radius-md);animation:1.5s ease-in-out infinite skeletonPulse}@keyframes skeletonPulse{0%,to{opacity:1}50%{opacity:.5}}.club-page{--club-bg:hsl(var(--background));--club-card:hsl(var(--card));--club-text:hsl(var(--foreground));--club-muted:hsl(var(--muted-foreground));--club-border:hsl(var(--border));--club-accent:hsl(var(--primary))}.patron-dashboard-hero{border-radius:0 0 var(--radius-xl) var(--radius-xl);background:linear-gradient(135deg, hsl(var(--primary) / .15) 0%, #ec6d1314 50%, hsl(var(--primary) / .12) 100%);border-bottom:1px solid hsl(var(--primary) / .15);margin:-16px -12px 24px;padding:32px 24px 28px;position:relative;overflow:hidden}.dark .patron-dashboard-hero{background:linear-gradient(135deg, hsl(var(--primary) / .12) 0%, #161412 50%, hsl(var(--primary) / .08) 100%)}@media (min-width:769px){.patron-dashboard-hero{margin:-24px -30px 28px;padding:40px 30px 32px}}.patron-hero-sparkles{pointer-events:none;z-index:0;position:absolute;inset:0}.patron-sparkle{background:hsl(var(--primary) / .6);width:5px;height:5px;left:var(--x,50%);top:var(--y,50%);animation:3.5s ease-in-out infinite sparkleFloat;animation-delay:var(--delay,0s);box-shadow:0 0 8px hsl(var(--primary) / .4);border-radius:50%;position:absolute}.patron-hero-inner{z-index:1;text-align:center;position:relative}.patron-hero-badge{border-radius:var(--radius-full);background:hsl(var(--primary) / .1);border:1px solid hsl(var(--primary) / .2);color:hsl(var(--primary));letter-spacing:.02em;align-items:center;gap:6px;margin-bottom:12px;padding:6px 16px;font-size:.75rem;font-weight:600;display:inline-flex}.patron-hero-title{color:hsl(var(--foreground));margin-bottom:4px;font-size:clamp(1.5rem,4vw,2rem);font-weight:800;line-height:1.2}.patron-hero-subtitle{color:hsl(var(--muted-foreground));margin:0;font-size:.875rem}.patron-quick-card{text-align:center;border-radius:var(--radius-lg);background:hsl(var(--card));border:1px solid hsl(var(--border));box-shadow:var(--card-shadow);transition:all var(--transition-normal);cursor:pointer;padding:20px 16px}.patron-quick-card:hover{border-color:hsl(var(--primary) / .3);transform:translateY(-2px);box-shadow:0 8px 24px #0000001a}.dark .patron-quick-card:hover{box-shadow:0 8px 24px #0006}.patron-quick-icon{border-radius:14px;justify-content:center;align-items:center;width:48px;height:48px;margin:0 auto 10px;display:flex}.patron-quick-title{margin-bottom:2px;font-size:.875rem;font-weight:700}.patron-quick-desc{color:hsl(var(--muted-foreground));font-size:.75rem}.patron-feature-grid{gap:8px;display:grid}@media (min-width:640px){.patron-feature-grid{grid-template-columns:repeat(2,1fr)}}.patron-feature-card{border-radius:var(--radius-lg);background:hsl(var(--card));border:1px solid hsl(var(--border));box-shadow:var(--card-shadow);transition:all var(--transition-normal);cursor:pointer;align-items:center;gap:14px;padding:14px 16px;display:flex}.patron-feature-card:hover{border-color:hsl(var(--primary) / .3);transform:translateY(-1px);box-shadow:0 4px 16px #00000014}.dark .patron-feature-card:hover{box-shadow:0 4px 16px #0000004d}.patron-feature-icon{border-radius:10px;flex-shrink:0;justify-content:center;align-items:center;width:40px;height:40px;display:flex}.patron-feature-info{flex:1;min-width:0}.patron-feature-name{font-size:.875rem;font-weight:600}.patron-feature-desc{color:hsl(var(--muted-foreground));font-size:.75rem}.club-hero-banner{background:linear-gradient(135deg, hsl(var(--primary) / .15) 0%, #ec6d1314 50%, hsl(var(--primary) / .12) 100%);border-bottom:1px solid hsl(var(--primary) / .15);justify-content:center;align-items:center;padding:24px 16px;display:flex;position:relative;overflow:hidden}.dark .club-hero-banner{background:linear-gradient(135deg, hsl(var(--primary) / .12) 0%, #161412 50%, hsl(var(--primary) / .08) 100%)}.club-hero-content{z-index:2;justify-content:center;align-items:center;width:100%;max-width:1200px;margin:0 auto;padding:0;display:flex;position:relative}.tv-display{color:#f4f1eb;background:#0f0d0a;min-height:100vh}.tv-display .queue-item{border-radius:var(--radius-lg);padding:var(--space-md);transition:all var(--transition-normal);background:#fff0c80a;border:1px solid #ffdc9614}.tv-display .queue-item:hover{background:#fff0c814}.tv-display .queue-amount{color:#22c55e;font-weight:700}.tv-display .queue-amount.mega{color:#f59e0b;font-size:1.125rem}.tv-display .queue-amount.premium{background:linear-gradient(135deg,#f59e0b,#ef4444);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-size:1.25rem}.tier-badge{border-radius:var(--radius-full);text-transform:uppercase;letter-spacing:.03em;align-items:center;gap:4px;padding:2px 8px;font-size:.6875rem;font-weight:700;display:inline-flex}.tier-badge.mega{color:#f59e0b;background:#f59e0b26;border:1px solid #f59e0b4d}.tier-badge.premium{color:#e8a317;background:#e8a31726;border:1px solid #e8a3174d}.celebration-overlay{z-index:100;background:#000000d9;justify-content:center;align-items:center;animation:.5s ease-out fadeIn;display:flex;position:fixed;inset:0}.celebration-content{text-align:center;animation:.6s cubic-bezier(.34,1.56,.64,1) celebrationScale}@keyframes celebrationScale{0%{opacity:0;transform:scale(.5)}to{opacity:1;transform:scale(1)}}.select-trigger{border:1px solid hsl(var(--input));border-radius:var(--radius-md);background:hsl(var(--background));color:hsl(var(--foreground));font-family:var(--font-family);cursor:pointer;transition:border-color var(--transition-fast);justify-content:space-between;align-items:center;padding:.625rem .75rem;font-size:.875rem;display:flex}.select-trigger:hover{border-color:hsl(var(--ring))}.avatar{border-radius:var(--radius-full);background:hsl(var(--primary));color:hsl(var(--primary-foreground));flex-shrink:0;justify-content:center;align-items:center;font-size:.75rem;font-weight:600;display:inline-flex;overflow:hidden}.avatar-sm{width:32px;height:32px}.avatar-md{width:40px;height:40px}.avatar-lg{width:48px;height:48px}.avatar img{object-fit:cover;width:100%;height:100%}.dropdown{display:inline-block;position:relative}.dropdown-menu{background:hsl(var(--popover));min-width:200px;color:hsl(var(--popover-foreground));border:1px solid hsl(var(--border));border-radius:var(--radius-lg);z-index:50;padding:4px;animation:.15s ease-out fadeIn;position:absolute;top:calc(100% + 4px);right:0;box-shadow:0 8px 30px #0000001f}.dark .dropdown-menu{box-shadow:0 8px 30px #0006}.dropdown-item{border-radius:var(--radius-sm);cursor:pointer;transition:background var(--transition-fast);color:hsl(var(--popover-foreground));font-size:.875rem;font-family:var(--font-family);text-align:left;background:0 0;border:none;align-items:center;gap:8px;width:100%;padding:8px 12px;display:flex}.dropdown-item:hover{background:hsl(var(--accent))}.dropdown-separator{background:hsl(var(--border));height:1px;margin:4px 0}.role-selector{gap:var(--space-sm);margin-bottom:var(--space-lg);grid-template-columns:repeat(2,1fr);display:grid}.role-option{padding:var(--space-md);border:2px solid hsl(var(--border));border-radius:var(--radius-lg);text-align:center;cursor:pointer;transition:all var(--transition-fast);background:hsl(var(--card))}.role-option:hover{border-color:hsl(var(--primary) / .5)}.role-option.selected{border-color:hsl(var(--primary));background:hsl(var(--primary) / .05)}.role-option-icon{border-radius:var(--radius-full);background:hsl(var(--primary) / .1);width:40px;height:40px;color:hsl(var(--primary));margin:0 auto var(--space-sm);justify-content:center;align-items:center;display:flex}.role-option-title{font-size:.875rem;font-weight:600}.role-option-desc{color:hsl(var(--muted-foreground));margin-top:2px;font-size:.75rem}.pwa-banner{z-index:9999;background:hsl(var(--card));border-top:1px solid hsl(var(--border));border-radius:var(--radius-xl) var(--radius-xl) 0 0;padding:0;transition:transform .4s cubic-bezier(.34,1.56,.64,1);position:fixed;bottom:0;left:0;right:0;overflow:hidden;transform:translateY(100%);box-shadow:0 -8px 40px #0003}.pwa-banner-visible{transform:translateY(0)}.pwa-banner-glow{background:linear-gradient(90deg, transparent, hsl(var(--primary)), #f6bb55, hsl(var(--primary)), transparent);height:2px;animation:3s ease-in-out infinite pwa-glow-sweep;position:absolute;top:0;left:0;right:0}@keyframes pwa-glow-sweep{0%,to{opacity:.5}50%{opacity:1}}.pwa-banner-content{align-items:center;gap:12px;padding:14px 16px 8px;display:flex}.pwa-banner-icon{border-radius:var(--radius-lg);background:linear-gradient(135deg, hsl(var(--primary)), #ec6d13);color:#fff;flex-shrink:0;justify-content:center;align-items:center;width:44px;height:44px;animation:2s ease-in-out infinite pwa-icon-pulse;display:flex}@keyframes pwa-icon-pulse{0%,to{box-shadow:0 0 0 0 hsl(var(--primary) / .4)}50%{box-shadow:0 0 0 8px hsl(var(--primary) / 0)}}.pwa-banner-text{flex:1;min-width:0}.pwa-banner-title{color:hsl(var(--foreground));font-size:.9375rem;font-weight:700;line-height:1.3;display:block}.pwa-banner-subtitle{color:hsl(var(--muted-foreground));margin-top:1px;font-size:.75rem;line-height:1.3;display:block}.pwa-banner-actions{flex-shrink:0;align-items:center;gap:8px;display:flex}.pwa-install-btn{border-radius:var(--radius-full);background:linear-gradient(135deg, hsl(var(--primary)), #ec6d13);color:#fff;font-family:var(--font-family);cursor:pointer;transition:all var(--transition-fast);white-space:nowrap;box-shadow:0 2px 8px hsl(var(--primary) / .3);border:none;align-items:center;gap:6px;padding:8px 16px;font-size:.8125rem;font-weight:600;display:inline-flex}.pwa-install-btn:hover{box-shadow:0 4px 16px hsl(var(--primary) / .4);transform:translateY(-1px)}.pwa-install-btn:active{transform:translateY(0)}.pwa-install-btn:disabled{opacity:.7;cursor:wait}.pwa-dismiss-btn{border-radius:var(--radius-full);background:hsl(var(--muted));width:32px;height:32px;color:hsl(var(--muted-foreground));cursor:pointer;transition:all var(--transition-fast);border:none;justify-content:center;align-items:center;display:flex}.pwa-dismiss-btn:hover{background:hsl(var(--accent));color:hsl(var(--foreground))}.pwa-features{-webkit-overflow-scrolling:touch;scrollbar-width:none;gap:8px;padding:6px 16px 14px;display:flex;overflow-x:auto}.pwa-features::-webkit-scrollbar{display:none}.pwa-feature-pill{border-radius:var(--radius-full);background:hsl(var(--primary) / .08);color:hsl(var(--primary));white-space:nowrap;align-items:center;gap:4px;padding:4px 10px;font-size:.6875rem;font-weight:600;display:inline-flex}.dark .pwa-feature-pill{background:hsl(var(--primary) / .12)}@media (max-width:768px){.pwa-banner{border-radius:var(--radius-xl);border:1px solid hsl(var(--border));margin:0 8px;bottom:64px}}.pwa-spinner{border:2px solid #ffffff4d;border-top-color:#fff;border-radius:50%;width:16px;height:16px;animation:.6s linear infinite pwa-spin}@keyframes pwa-spin{to{transform:rotate(360deg)}}.pwa-modal-overlay{z-index:10000;-webkit-backdrop-filter:blur(8px);background:#0009;justify-content:center;align-items:flex-end;animation:.2s ease-out pwa-fade-in;display:flex;position:fixed;inset:0}@keyframes pwa-fade-in{0%{opacity:0}to{opacity:1}}.pwa-modal{background:hsl(var(--card));border-radius:var(--radius-xl) var(--radius-xl) 0 0;width:100%;max-width:480px;max-height:90vh;padding:var(--space-lg);animation:.35s cubic-bezier(.34,1.56,.64,1) pwa-slide-up;position:relative;overflow-y:auto}@media (min-width:768px){.pwa-modal-overlay{align-items:center}.pwa-modal{border-radius:var(--radius-xl);max-height:85vh}}@keyframes pwa-slide-up{0%{transform:translateY(100%)}to{transform:translateY(0)}}.pwa-modal-close{border-radius:var(--radius-full);background:hsl(var(--muted));width:36px;height:36px;color:hsl(var(--muted-foreground));cursor:pointer;transition:all var(--transition-fast);z-index:1;border:none;justify-content:center;align-items:center;display:flex;position:absolute;top:16px;right:16px}.pwa-modal-close:hover{background:hsl(var(--accent));color:hsl(var(--foreground))}.pwa-modal-header{text-align:center;padding:var(--space-md) 0 var(--space-lg)}.pwa-modal-icon-wrapper{width:72px;height:72px;margin:0 auto var(--space-md);position:relative}.pwa-modal-icon{background:linear-gradient(135deg, hsl(var(--primary)), #ec6d13);color:#fff;z-index:1;border-radius:20px;justify-content:center;align-items:center;width:72px;height:72px;display:flex;position:relative}.pwa-modal-icon-ring{border:2px solid hsl(var(--primary) / .2);border-radius:24px;animation:2s ease-in-out infinite pwa-ring-pulse;position:absolute;inset:-6px}@keyframes pwa-ring-pulse{0%,to{opacity:.5;transform:scale(1)}50%{opacity:1;transform:scale(1.05)}}.pwa-modal-title{margin-bottom:4px;font-size:1.375rem;font-weight:800}.pwa-modal-subtitle{color:hsl(var(--muted-foreground));font-size:.875rem;line-height:1.4}.pwa-benefits{margin-bottom:var(--space-lg);grid-template-columns:1fr 1fr;gap:10px;display:grid}.pwa-benefit-row{border-radius:var(--radius-lg);background:hsl(var(--muted) / .5);transition:background var(--transition-fast);align-items:flex-start;gap:10px;padding:12px;display:flex}.pwa-benefit-row:hover{background:hsl(var(--muted))}.pwa-benefit-icon{border-radius:var(--radius-md);background:hsl(var(--primary) / .12);width:36px;height:36px;color:hsl(var(--primary));flex-shrink:0;justify-content:center;align-items:center;display:flex}.pwa-benefit-title{color:hsl(var(--foreground));font-size:.8125rem;font-weight:600}.pwa-benefit-desc{color:hsl(var(--muted-foreground));margin-top:1px;font-size:.6875rem;line-height:1.3}@media (max-width:400px){.pwa-benefits{grid-template-columns:1fr}}.pwa-guide-section{margin-bottom:var(--space-lg)}.pwa-guide-heading{margin-bottom:var(--space-md);align-items:center;gap:8px;font-size:.9375rem;font-weight:700;display:flex}.pwa-guide-browser-badge{border-radius:var(--radius-full);background:hsl(var(--muted));color:hsl(var(--muted-foreground));align-items:center;padding:2px 10px;font-size:.75rem;font-weight:500;display:inline-flex}.pwa-steps{gap:8px;display:grid}.pwa-step{border-radius:var(--radius-lg);border:1px solid hsl(var(--border));cursor:pointer;transition:all var(--transition-fast);background:0 0;align-items:flex-start;gap:12px;padding:14px;display:flex}.pwa-step:hover{background:hsl(var(--muted) / .5)}.pwa-step-active{border-color:hsl(var(--primary) / .3);background:hsl(var(--primary) / .04)}.pwa-step-done{opacity:.6}.pwa-step-number{border-radius:var(--radius-full);background:hsl(var(--muted));width:28px;height:28px;color:hsl(var(--muted-foreground));flex-shrink:0;justify-content:center;align-items:center;font-size:.75rem;font-weight:700;display:flex}.pwa-step-active .pwa-step-number{background:hsl(var(--primary));color:#fff}.pwa-step-done .pwa-step-number{background:hsl(var(--success) / .15);color:hsl(var(--success))}.pwa-step-content{flex:1;min-width:0}.pwa-step-title{color:hsl(var(--foreground));margin-bottom:2px;font-size:.8125rem;font-weight:600}.pwa-step-desc{color:hsl(var(--muted-foreground));font-size:.75rem;line-height:1.4}.pwa-step-visual{margin-top:10px;animation:.3s ease-out pwa-fade-in}.pwa-step-icon-demo{border-radius:var(--radius-md);background:hsl(var(--muted));align-items:center;gap:8px;padding:10px 14px;font-size:.8125rem;font-weight:500;display:inline-flex}.pwa-step-arrow{color:hsl(var(--muted-foreground));transition:transform var(--transition-fast);flex-shrink:0;margin-top:4px}.pwa-step-active .pwa-step-arrow{color:hsl(var(--primary));transform:rotate(90deg)}.pwa-modal-install-btn{border-radius:var(--radius-lg);background:linear-gradient(135deg, hsl(var(--primary)), #ec6d13);color:#fff;width:100%;font-family:var(--font-family);cursor:pointer;transition:all var(--transition-fast);box-shadow:0 4px 16px hsl(var(--primary) / .3);border:none;justify-content:center;align-items:center;gap:8px;padding:14px;font-size:1rem;font-weight:700;display:flex}.pwa-modal-install-btn:hover{box-shadow:0 6px 24px hsl(var(--primary) / .4);transform:translateY(-2px)}.pwa-modal-install-btn:active{transform:translateY(0)}.pwa-modal-install-btn:disabled{opacity:.7;cursor:wait}.song-listener{padding:var(--space-lg)}.song-listener.compact{padding:var(--space-md)}.listen-btn{background:linear-gradient(135deg, hsl(var(--primary)), #ec6d13);color:#fff;cursor:pointer;width:120px;height:120px;transition:transform var(--transition-fast), box-shadow var(--transition-fast);box-shadow:0 8px 30px hsl(var(--primary) / .35);border:none;border-radius:50%;justify-content:center;align-items:center;margin:0 auto;display:flex;position:relative}.listen-btn:hover{box-shadow:0 12px 40px hsl(var(--primary) / .45);transform:scale(1.05)}.listen-btn:active{transform:scale(.95)}.listen-btn-icon{z-index:2;font-size:2.5rem;position:relative}.listen-btn-ripple{border:2px solid hsl(var(--primary) / .3);border-radius:50%;animation:2s ease-out infinite listenRipple;position:absolute;inset:-8px}@keyframes listenRipple{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(1.5)}}.listen-btn.listening{animation:1s ease-in-out infinite listenPulse}@keyframes listenPulse{0%,to{transform:scale(1)}50%{transform:scale(1.08)}}.listen-btn-pulse{border:2px solid hsl(var(--primary) / .4);border-radius:50%;animation:1.5s ease-out infinite pulseExpand;position:absolute;inset:-15px}.listen-btn-pulse.delay{animation-delay:.75s}@keyframes pulseExpand{0%{opacity:.8;transform:scale(1)}to{opacity:0;transform:scale(1.8)}}.sound-wave-container{height:40px;margin-top:var(--space-md);transition:opacity var(--transition-normal);justify-content:center;align-items:center;gap:4px;display:flex}.sound-wave-bar{background:hsl(var(--primary));border-radius:var(--radius-full);width:4px;height:20px;animation:.8s ease-in-out infinite alternate soundWave}@keyframes soundWave{0%{opacity:.5;height:8px}to{opacity:1;height:36px}}.identified-song-card{gap:var(--space-md);padding:var(--space-md);background:hsl(var(--card));border:1px solid hsl(var(--border));border-radius:var(--radius-lg);margin-bottom:var(--space-md);display:flex}.identified-album-art{border-radius:var(--radius-md);object-fit:cover;flex-shrink:0;width:80px;height:80px}.identified-song-info{flex:1;min-width:0}.identified-song-title{text-overflow:ellipsis;white-space:nowrap;font-size:1.125rem;font-weight:700;line-height:1.3;overflow:hidden}.identified-song-artist{color:hsl(var(--muted-foreground));font-size:.875rem}.identified-actions{gap:var(--space-sm);flex-direction:column;display:flex}.fab-listen{background:linear-gradient(135deg, hsl(var(--primary)), #ec6d13);color:#fff;cursor:pointer;z-index:30;width:56px;height:56px;box-shadow:0 4px 20px hsl(var(--primary) / .4);transition:transform var(--transition-fast), box-shadow var(--transition-fast);border:none;border-radius:50%;justify-content:center;align-items:center;font-size:1.5rem;display:flex;position:fixed;bottom:80px;right:20px}.fab-listen:hover{box-shadow:0 6px 28px hsl(var(--primary) / .5);transform:scale(1.1)}.fab-listen:active{transform:scale(.95)}.listen-modal-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:50;background:#0009;justify-content:center;align-items:flex-end;display:flex;position:fixed;inset:0}.listen-modal{background:hsl(var(--card));border-radius:var(--radius-xl) var(--radius-xl) 0 0;width:100%;max-width:500px;max-height:80vh;animation:.3s ease-out slideUpModal;overflow-y:auto}@keyframes slideUpModal{0%{transform:translateY(100%)}to{transform:translateY(0)}}.lyrics-viewer{padding:var(--space-lg)}.lyrics-content{max-height:50vh;padding:var(--space-md) 0;-webkit-overflow-scrolling:touch;overflow-y:auto}.lyric-plain-line{color:hsl(var(--foreground));margin:0;padding:4px 0;font-size:1rem;line-height:1.8}.lyric-spacer{height:16px}.karaoke-mode{z-index:60;background:hsl(var(--background));flex-direction:column;animation:.3s ease-out fadeIn;display:flex;position:fixed;inset:0}.karaoke-header{padding:var(--space-md) var(--space-lg);border-bottom:1px solid hsl(var(--border));flex-shrink:0;justify-content:space-between;align-items:center;display:flex}.karaoke-album-art{border-radius:var(--radius-sm);flex-shrink:0;width:40px;height:40px}.karaoke-title{text-overflow:ellipsis;white-space:nowrap;font-size:.9375rem;font-weight:700;line-height:1.3;overflow:hidden}.karaoke-artist{color:hsl(var(--muted-foreground));font-size:.75rem}.karaoke-lyrics{padding:var(--space-xl) var(--space-lg);gap:var(--space-sm);scroll-behavior:smooth;-webkit-overflow-scrolling:touch;flex-direction:column;flex:1;display:flex;overflow-y:auto}.lyric-line{padding:var(--space-sm) var(--space-md);border-radius:var(--radius-md);cursor:pointer;color:hsl(var(--muted-foreground));font-size:1.25rem;line-height:1.6;transition:all .3s}.lyric-line.past{opacity:.35;font-size:1.125rem}.lyric-line.active{color:hsl(var(--primary));background:hsl(var(--primary) / .1);text-shadow:0 0 30px hsl(var(--primary) / .3);font-size:1.5rem;font-weight:700;transform:scale(1.02)}.lyric-line.upcoming{opacity:.6}.lyric-line:hover{background:hsl(var(--accent))}.karaoke-controls{padding:var(--space-md) var(--space-lg);border-top:1px solid hsl(var(--border));align-items:center;gap:var(--space-sm);padding-bottom:calc(var(--space-lg) + env(safe-area-inset-bottom,0px));flex-direction:column;flex-shrink:0;display:flex}.karaoke-progress{align-items:center;gap:var(--space-sm);width:100%;display:flex}.karaoke-time{color:hsl(var(--muted-foreground));text-align:center;font-variant-numeric:tabular-nums;min-width:36px;font-size:.75rem;font-weight:600}.karaoke-progress-bar{background:hsl(var(--border));border-radius:var(--radius-full);cursor:pointer;flex:1;height:4px;position:relative;overflow:hidden}.karaoke-progress-fill{background:hsl(var(--primary));border-radius:var(--radius-full);height:100%;transition:width .1s linear}.beat-match-panel{padding:var(--space-md);background:hsl(var(--card));border:1px solid hsl(var(--border));border-radius:var(--radius-lg);margin-bottom:var(--space-md)}.beat-match-now-playing{align-items:center;gap:var(--space-md);padding:var(--space-sm);background:hsl(var(--primary) / .08);border-radius:var(--radius-md);margin-bottom:var(--space-md);display:flex}.beat-match-bpm{background:hsl(var(--primary) / .15);color:hsl(var(--primary));border-radius:var(--radius-full);font-variant-numeric:tabular-nums;align-items:center;gap:4px;padding:4px 12px;font-size:.875rem;font-weight:700;display:inline-flex}.beat-match-key{background:hsl(var(--info) / .15);color:hsl(var(--info));border-radius:var(--radius-full);align-items:center;gap:4px;padding:4px 12px;font-size:.875rem;font-weight:700;display:inline-flex}.beat-suggestion{align-items:center;gap:var(--space-sm);padding:var(--space-sm);border-radius:var(--radius-md);margin-bottom:var(--space-xs);transition:background var(--transition-fast);display:flex}.beat-suggestion:hover{background:hsl(var(--accent))}.beat-score{text-align:center;font-variant-numeric:tabular-nums;min-width:40px;font-size:.875rem;font-weight:800}.beat-score.perfect{color:hsl(var(--success))}.beat-score.great{color:#47d17a}.beat-score.good{color:hsl(var(--warning))}.beat-score.fair{color:#e87d30}.beat-score.poor{color:hsl(var(--destructive))}.beat-reason{color:hsl(var(--muted-foreground));margin-top:2px;font-size:.6875rem}.bg-music-btn{z-index:100;border-radius:var(--radius-full);border:1px solid hsl(var(--border) / .5);cursor:pointer;background:hsl(var(--card) / .85);-webkit-backdrop-filter:blur(16px);width:44px;height:44px;box-shadow:0 4px 24px #00000040, 0 0 0 1px hsl(var(--primary) / .1);transition:all var(--transition-normal);justify-content:center;align-items:center;display:flex;position:fixed;bottom:24px;right:24px;overflow:hidden}.bg-music-btn:hover{box-shadow:0 6px 28px #00000059, 0 0 0 2px hsl(var(--primary) / .3);transform:scale(1.08)}.bg-music-btn:active{transform:scale(.95)}.bg-music-btn.playing{box-shadow:0 4px 24px hsl(var(--primary) / .3), 0 0 0 1px hsl(var(--primary) / .2)}.bg-music-btn.playing:before{content:"";border-radius:var(--radius-full);background:conic-gradient(from 0deg, hsl(var(--primary) / .4), transparent 40%, hsl(var(--primary) / .2), transparent 80%, hsl(var(--primary) / .4));z-index:-1;animation:3s linear infinite bg-music-glow-spin;position:absolute;inset:-2px}@keyframes bg-music-glow-spin{to{transform:rotate(360deg)}}.bg-music-eq{align-items:flex-end;gap:2.5px;height:16px;display:flex}.eq-bar{background:hsl(var(--primary));border-radius:1.5px;width:3px;transition:height .1s;display:block}.bg-music-btn.playing .eq-bar{animation:.8s ease-in-out infinite alternate eq-bounce;animation-delay:var(--bar-delay)}.bg-music-btn.playing .eq-bar:first-child{height:8px}.bg-music-btn.playing .eq-bar:nth-child(2){height:14px}.bg-music-btn.playing .eq-bar:nth-child(3){height:10px}.bg-music-btn.playing .eq-bar:nth-child(4){height:6px}@keyframes eq-bounce{0%{height:4px}25%{height:14px}50%{height:8px}75%{height:16px}to{height:6px}}.bg-music-btn.paused .eq-bar{opacity:.4;animation:none;height:4px!important}.bg-music-muted-icon{color:hsl(var(--muted-foreground));justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.bg-music-btn.paused .bg-music-eq{opacity:0}@media (max-width:768px){.bg-music-btn{bottom:80px;right:16px}}