:root{--primary-gradient:linear-gradient(135deg,#667eea,#764ba2);--primary-gradient-hover:linear-gradient(135deg,#5568d3,#653d91);--primary-color:#667eea;--primary-dark:#5568d3;--secondary-color:#764ba2;--secondary-dark:#653d91;--bg-primary:#fff;--bg-secondary:#f8f9fa;--bg-tertiary:#f0f2f5;--bg-gradient:linear-gradient(135deg,#667eea,#764ba2);--bg-gradient-dark:linear-gradient(135deg,#1a1d3a,#2d1b4e);--text-primary:#1a1a1a;--text-secondary:#666;--text-tertiary:#999;--text-white:#fff;--text-light:#ffffffe6;--success:#10b981;--error:#ef4444;--warning:#f59e0b;--info:#3b82f6;--shadow-sm:0 2px 4px #0000000d;--shadow-md:0 4px 12px #0000001a;--shadow-lg:0 8px 24px #00000026;--shadow-xl:0 12px 40px #0003;--shadow-glow:0 0 20px #667eea4d;--border-radius-sm:6px;--border-radius-md:12px;--border-radius-lg:16px;--border-radius-xl:24px;--border-radius-full:9999px;--border-color:#0000001a;--border-color-light:#0000000d;--spacing-xs:4px;--spacing-sm:8px;--spacing-md:16px;--spacing-lg:24px;--spacing-xl:32px;--spacing-2xl:48px;--transition-fast:0.15s ease;--transition-base:0.3s ease;--transition-slow:0.5s ease;--font-family-base:-apple-system,BlinkMacSystemFont,"Segoe UI","Roboto","Oxygen","Ubuntu","Cantarell","Fira Sans","Droid Sans","Helvetica Neue",sans-serif;--font-weight-normal:400;--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--z-dropdown:1000;--z-sticky:1020;--z-fixed:1030;--z-modal-backdrop:1040;--z-modal:1050;--z-popover:1060;--z-tooltip:1070}:root.dark{--bg-primary:#0f1226;--bg-secondary:#181b34;--bg-tertiary:#1a1d3a;--bg-gradient:linear-gradient(135deg,#0f1226,#1a1d3a);--bg-gradient-dark:linear-gradient(135deg,#0a0d1a,#15182d);--text-primary:#eaeaea;--text-secondary:#b0b0b0;--text-tertiary:#888;--text-white:#fff;--text-light:#ffffffe6;--primary-color:#7c8ef5;--primary-dark:#6b7de4;--secondary-color:#8b5fb8;--secondary-dark:#7a4fa7;--border-color:#ffffff1a;--border-color-light:#ffffff0d;--shadow-sm:0 2px 4px #0000004d;--shadow-md:0 4px 12px #0006;--shadow-lg:0 8px 24px #00000080;--shadow-xl:0 12px 40px #0009;--shadow-glow:0 0 20px #7c8ef533}*{box-sizing:border-box;margin:0;padding:0}html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;scroll-behavior:smooth}body{background:linear-gradient(135deg,#667eea,#764ba2);background:var(--bg-gradient);background-attachment:fixed;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;font-family:var(--font-family-base);font-weight:400;font-weight:var(--font-weight-normal);line-height:1.6;min-height:100vh;overflow-x:hidden}:root.dark body,body{color:#1a1a1a;color:var(--text-primary)}:root.dark body{background:linear-gradient(135deg,#1a1d3a,#2d1b4e);background:var(--bg-gradient-dark)}h1,h2,h3,h4,h5,h6{color:#1a1a1a;color:var(--text-primary);font-weight:700;font-weight:var(--font-weight-bold);line-height:1.2}h1{font-size:2.5rem}h2{font-size:2rem}h3{font-size:1.5rem}h4{font-size:1.25rem}p{margin-bottom:16px;margin-bottom:var(--spacing-md)}a{color:#667eea;color:var(--primary-color);text-decoration:none;transition:color .3s ease;transition:color var(--transition-base)}a:hover{color:#5568d3;color:var(--primary-dark)}::-webkit-scrollbar{height:10px;width:10px}::-webkit-scrollbar-track{background:#f8f9fa;background:var(--bg-secondary)}::-webkit-scrollbar-thumb,::-webkit-scrollbar-track{border-radius:9999px;border-radius:var(--border-radius-full)}::-webkit-scrollbar-thumb{background:linear-gradient(135deg,#667eea,#764ba2);background:var(--primary-gradient);-webkit-transition:background .3s ease;transition:background .3s ease;-webkit-transition:background var(--transition-base);transition:background var(--transition-base)}::-webkit-scrollbar-thumb:hover{background:linear-gradient(135deg,#5568d3,#653d91);background:var(--primary-gradient-hover)}::selection{background:#667eea;background:var(--primary-color);color:#fff;color:var(--text-white)}::-moz-selection{background:#667eea;background:var(--primary-color);color:#fff;color:var(--text-white)}:focus-visible{outline:2px solid #667eea;outline:2px solid var(--primary-color);outline-offset:2px}code{background:#f8f9fa;background:var(--bg-secondary);border-radius:6px;border-radius:var(--border-radius-sm);font-family:Courier New,Courier,monospace;font-size:.9em;padding:2px 6px}#root{display:flex;flex-direction:column;min-height:100vh}@keyframes scaleIn{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}@keyframes shimmer{0%{background-position:-1000px 0}to{background-position:1000px 0}}.fade-in{animation:fadeIn .3s ease;animation:fadeIn var(--transition-base)}.slide-up{animation:slideUp .3s ease;animation:slideUp var(--transition-base)}.slide-down{animation:slideDown .3s ease;animation:slideDown var(--transition-base)}.scale-in{animation:scaleIn .3s ease;animation:scaleIn var(--transition-base)}.glass{backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);background:#ffffff1a;border:1px solid #fff3}.gradient-text{-webkit-text-fill-color:#0000;background:linear-gradient(135deg,#667eea,#764ba2);background:var(--primary-gradient);-webkit-background-clip:text;background-clip:text}.skeleton{animation:shimmer 1.5s infinite;background:linear-gradient(90deg,#f8f9fa,#f0f2f5 50%,#f8f9fa);background:linear-gradient(90deg,var(--bg-secondary) 0,var(--bg-tertiary) 50%,var(--bg-secondary) 100%);background-size:200% 100%;border-radius:12px;border-radius:var(--border-radius-md)}.App{flex-direction:column;min-height:100vh}.App,.main-content{display:flex;position:relative}.main-content{flex:1 1;flex-direction:column;padding-bottom:100px;z-index:1}@media (max-width:768px){.main-content{padding-bottom:90px}}@media (max-width:480px){.main-content{padding-bottom:85px}}.container{margin:0 auto;max-width:1400px;padding:0 var(--spacing-lg);width:100%}.btn{align-items:center;border-radius:var(--border-radius-md);display:inline-flex;font-family:var(--font-family-base);font-size:16px;font-weight:var(--font-weight-semibold);gap:var(--spacing-sm);justify-content:center;overflow:hidden;position:relative;transition:all var(--transition-base)}.btn:before{background:#ffffff4d;border-radius:50%;content:"";height:0;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);transition:width .6s,height .6s;width:0}.btn:hover:before{height:300px;width:300px}.btn-primary{background:var(--primary-gradient);box-shadow:var(--shadow-md);color:var(--text-white)}.btn-primary:hover{background:var(--primary-gradient-hover);box-shadow:var(--shadow-lg)}.btn-primary:active{box-shadow:var(--shadow-md);transform:translateY(0)}.btn-secondary{background:var(--bg-primary);border:2px solid var(--primary-color);box-shadow:var(--shadow-sm);color:var(--primary-color)}.btn-secondary:hover{background:var(--primary-color);box-shadow:var(--shadow-md);color:var(--text-white);transform:translateY(-2px)}.btn:disabled{transform:none!important}.card{background:var(--bg-primary);border-radius:var(--border-radius-lg);box-shadow:var(--shadow-md);overflow:hidden;padding:var(--spacing-lg);position:relative;transition:all var(--transition-base)}.card:before{background:var(--primary-gradient);content:"";height:3px;left:0;position:absolute;right:0;top:0;transform:scaleX(0);transition:transform var(--transition-base)}.card:hover{box-shadow:var(--shadow-xl);transform:translateY(-4px)}.card:hover:before{transform:scaleX(1)}:root.dark .card{background:var(--bg-secondary);box-shadow:var(--shadow-lg)}.grid{grid-gap:var(--spacing-lg);display:grid;gap:var(--spacing-lg)}.grid-2{grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}.grid-3{grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}.grid-4{grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}.form-group{margin-bottom:var(--spacing-lg)}.form-group label{font-weight:var(--font-weight-semibold);margin-bottom:var(--spacing-sm)}.form-group input,.form-group select,.form-group textarea{background:var(--bg-primary);border:2px solid var(--border-color);border-radius:var(--border-radius-md);font-family:var(--font-family-base);font-size:16px;transition:all var(--transition-base)}.form-group input:focus,.form-group select:focus,.form-group textarea:focus{box-shadow:0 0 0 3px #667eea1a}.form-group input:hover,.form-group select:hover,.form-group textarea:hover{border-color:var(--primary-color)}.form-group textarea{font-family:var(--font-family-base);min-height:120px}.form-group small{margin-top:var(--spacing-xs)}:root.dark .form-group input,:root.dark .form-group select,:root.dark .form-group textarea{background:var(--bg-secondary)}.message{align-items:center;animation:slideDown var(--transition-base);border-radius:var(--border-radius-md);box-shadow:var(--shadow-sm);display:flex;font-weight:var(--font-weight-medium);gap:var(--spacing-sm);margin-bottom:var(--spacing-lg)}.message-warning{background:#fef3c7;border:1px solid #fde68a}.message-info{background:#dbeafe;border:1px solid #93c5fd;color:#1e40af}:root.dark .message-success{background:#10b98133;border-color:#10b9814d}:root.dark .message-error{background:#ef444433;border-color:#ef44444d}:root.dark .message-warning{background:#f59e0b33;border-color:#f59e0b4d;color:#fde68a}:root.dark .message-info{background:#3b82f633;border-color:#3b82f64d;color:#93c5fd}.loading{align-items:center;color:var(--text-secondary);display:flex;font-size:16px;justify-content:center;padding:var(--spacing-xl)}.loading:after{animation:pulse 1.5s infinite;content:"..."}.spinner{animation:spin .8s linear infinite;border:4px solid var(--border-color);border-radius:50%;border-top-color:var(--primary-color);height:40px;width:40px}@media (max-width:768px){.container{padding:0 var(--spacing-md)}.btn{font-size:14px;padding:10px 20px}.card{padding:var(--spacing-md)}.grid-2,.grid-3,.grid-4{grid-template-columns:1fr}}@media (max-width:480px){.container{padding:0 var(--spacing-sm)}.btn{font-size:13px;padding:8px 16px}.card{padding:var(--spacing-sm)}}.search-bar-wrapper{flex-direction:column;z-index:1}.search-bar,.search-bar-wrapper{align-items:center;display:flex;pointer-events:auto;position:relative;width:100%}.search-bar{flex:1 1;gap:8px;margin:0 20px;max-width:500px;z-index:2}.search-input{-webkit-appearance:none;appearance:none;border:2px solid #e0e0e0;border-radius:25px;flex:1 1;font-size:14px;outline:none;padding:10px 16px;pointer-events:auto;position:relative;touch-action:manipulation;transition:border-color .3s ease;z-index:3}.search-input:focus{border-color:#667eea}.search-button{-webkit-tap-highlight-color:transparent;align-items:center;background:linear-gradient(135deg,#667eea,#764ba2);border:none;border-radius:50%;cursor:pointer;display:flex;flex-shrink:0;font-size:18px;height:40px;justify-content:center;touch-action:manipulation;transition:transform .2s ease;-webkit-user-select:none;user-select:none;width:40px}.search-button:hover{transform:scale(1.05)}.search-button:active{transform:scale(.95)}.search-button:focus{outline:2px solid #667eea;outline-offset:2px}.search-error{background:#ff44441a;border-radius:4px;color:#f44;font-size:12px;margin-top:5px;max-width:500px;padding:5px 10px;text-align:center;width:100%}@media (max-width:768px){.search-bar{align-items:center;display:flex;gap:8px;margin:10px 0;max-width:100%;order:3;width:100%}.search-input{-webkit-tap-highlight-color:rgba(102,126,234,.2);flex:1 1;font-size:16px;min-width:0;padding:12px 16px}.search-button,.search-input{pointer-events:auto;position:relative;z-index:3}.search-button{-webkit-tap-highlight-color:rgba(102,126,234,.3);flex-shrink:0;height:44px;width:44px}.search-error{margin:5px 0;max-width:100%}}@media (max-width:768px) and (orientation:landscape){.search-bar{gap:6px;margin:5px 0}.search-input{font-size:14px;padding:8px 12px}.search-button{font-size:16px;height:36px;width:36px}}@media (max-width:480px) and (orientation:landscape){.search-bar{gap:4px;margin:4px 0}.search-input{font-size:13px;padding:6px 10px}.search-button{font-size:14px;height:32px;width:32px}}:root.dark .search-input{background:var(--bg-secondary);border-color:var(--border-color);color:var(--text-primary)}:root.dark .search-input:focus{border-color:var(--primary-color);box-shadow:0 0 0 3px #7c8ef51a}:root.dark .search-input::placeholder{color:var(--text-secondary)}:root.dark .search-error{background:#ef44441a;color:var(--error)}.theme-toggle-wrapper{display:inline-block;position:relative}.theme-toggle{align-items:center;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#667eea26;border:2px solid #667eea66;border-radius:20px;color:#667eea;cursor:pointer;display:flex!important;font-size:14px;font-weight:600;gap:8px;min-height:auto;min-width:auto;opacity:1!important;padding:8px 16px;position:relative;transition:all .3s ease;visibility:visible!important;white-space:nowrap}.theme-auto-indicator{font-size:12px;margin-left:4px;opacity:.8}.theme-toggle:hover{background:#667eea33;border-color:#667eea80;box-shadow:0 4px 12px #667eea4d;transform:translateY(-2px)}.theme-toggle-icon{align-items:center;display:flex;font-size:18px;justify-content:center;transition:transform .3s ease}.theme-toggle:hover .theme-toggle-icon{transform:rotate(15deg)}.theme-toggle-text{font-size:13px}:root.dark .theme-toggle{background:#7c8ef526;border-color:#7c8ef54d;color:#7c8ef5}:root.dark .theme-toggle:hover{background:#7c8ef540;border-color:#7c8ef580;box-shadow:0 4px 12px #7c8ef54d}.theme-toggle-menu{animation:slideDown .2s ease;background:#fff;background:var(--bg-primary,#fff);border:1px solid #0000001a;border:1px solid var(--border-color,#0000001a);border-radius:12px;box-shadow:0 8px 24px #00000026;box-shadow:var(--shadow-lg,0 8px 24px #00000026);min-width:220px;overflow:hidden;position:absolute;right:0;top:calc(100% + 8px);z-index:1000;z-index:var(--z-dropdown,1000)}.theme-menu-item{align-items:center;background:#0000;border:none;color:#1a1a1a;color:var(--text-primary,#1a1a1a);cursor:pointer;display:flex;font-size:14px;gap:12px;padding:12px 16px;text-align:left;transition:background .2s ease;width:100%}.theme-menu-item:hover{background:#f8f9fa;background:var(--bg-secondary,#f8f9fa)}.theme-menu-item.active{background:#667eea1a;color:#667eea}.theme-menu-icon{font-size:18px;text-align:center;width:24px}.theme-menu-text{flex:1 1;font-weight:500}.theme-menu-check{color:#10b981;font-size:16px;font-weight:700}.theme-menu-divider{background:#0000001a;background:var(--border-color,#0000001a);height:1px;margin:4px 0}.theme-menu-info{background:#f8f9fa;background:var(--bg-secondary,#f8f9fa);border-top:1px solid #0000001a;border-top:1px solid var(--border-color,#0000001a);padding:8px 16px}.theme-menu-info-text{color:#666;color:var(--text-secondary,#666);font-size:12px;font-style:italic}:root.dark .theme-toggle-menu{background:#0f1226;background:var(--bg-primary,#0f1226);border-color:#ffffff1a}:root.dark .theme-menu-item{color:#eaeaea;color:var(--text-primary,#eaeaea)}:root.dark .theme-menu-item:hover{background:#181b34;background:var(--bg-secondary,#181b34)}:root.dark .theme-menu-item.active{background:#7c8ef526;color:#7c8ef5}:root.dark .theme-menu-divider{background:#ffffff1a}:root.dark .theme-menu-info{background:#181b34;background:var(--bg-secondary,#181b34);border-top-color:#ffffff1a}:root.dark .theme-menu-info-text{color:#b0b0b0;color:var(--text-secondary,#b0b0b0)}@media (max-width:768px){.theme-toggle{font-size:12px;justify-content:center;min-height:40px;min-width:40px;padding:6px 12px}.theme-toggle-text{display:none}.theme-toggle-icon{font-size:24px;line-height:1}.theme-auto-indicator{font-size:10px;position:absolute;right:2px;top:2px}.theme-toggle-menu{min-width:200px;right:0}}.notification-bell-container{position:relative}.notification-bell-btn{align-items:center;background:none;border:none;border-radius:50%;color:#333;cursor:pointer;display:flex;font-size:24px;justify-content:center;padding:8px;position:relative;transition:all .3s ease}.notification-bell-btn:hover{background:#0000000d;transform:scale(1.1)}.bell-icon{display:block}.notification-badge{background:#e74c3c;border:2px solid #fff;border-radius:10px;color:#fff;font-size:11px;font-weight:700;line-height:1.2;min-width:18px;padding:2px 6px;position:absolute;right:0;text-align:center;top:0}.notification-dropdown{background:#fff;border-radius:12px;box-shadow:0 8px 32px #00000026;display:flex;flex-direction:column;max-height:500px;max-width:calc(100vw - 40px);overflow:hidden;position:absolute;right:0;top:calc(100% + 10px);width:380px;z-index:10002}.notification-header{align-items:center;background:#f8f9fa;border-bottom:1px solid #eee;display:flex;justify-content:space-between;padding:16px 20px}.notification-header h3{color:#333;font-size:18px;font-weight:600;margin:0}.mark-all-read-btn{background:none;border:none;border-radius:4px;color:#667eea;cursor:pointer;font-size:12px;padding:4px 8px;transition:background .2s}.mark-all-read-btn:hover{background:#667eea1a}.notification-list{max-height:400px;overflow-y:auto}.notification-item{align-items:flex-start;border-bottom:1px solid #f0f0f0;color:inherit;gap:12px;padding:12px 20px;text-decoration:none;transition:background .2s}.notification-item:hover{background:#f8f9fa}.notification-item.unread{background:#f0f4ff}.notification-item.unread:hover{background:#e8edff}.notification-icon{margin-top:2px}.notification-content{min-width:0}.notification-title{color:#333;font-size:14px;margin-bottom:4px}.notification-message{color:#666;font-size:13px;line-height:1.4;margin-bottom:6px}.notification-time{color:#999;font-size:11px}.unread-dot{background:#667eea;border-radius:50%;flex-shrink:0;height:8px;position:absolute;right:16px;top:16px;width:8px}.notification-empty,.notification-loading{color:#999;font-size:14px;padding:40px 20px;text-align:center}.notification-footer{background:#f8f9fa;border-top:1px solid #eee;padding:12px 20px;text-align:center}.notification-footer a{color:#667eea;font-size:13px;font-weight:500;text-decoration:none}.notification-footer a:hover{text-decoration:underline}@media (max-width:768px){.notification-dropdown{box-shadow:0 8px 32px #00000040;left:10px;max-height:calc(100vh - 90px);max-width:none;position:fixed;right:10px;top:70px;width:auto;z-index:10002}.notification-item{padding:10px 16px}.notification-title{font-size:13px}.notification-message{font-size:12px}.notification-header{padding:12px 16px}.notification-header h3{font-size:16px}.mark-all-read-btn{font-size:11px;padding:4px 6px}.notification-list{max-height:calc(100vh - 180px)}.notification-footer{padding:10px 16px}}@media (max-width:480px){.notification-dropdown{border-radius:10px;left:8px;max-height:calc(100vh - 80px);right:8px;top:60px;z-index:10002}.notification-header{padding:10px 14px}.notification-header h3{font-size:15px}.notification-item{padding:10px 14px}.notification-title{font-size:12px}.notification-message{font-size:11px}.notification-time{font-size:10px}.notification-list{max-height:calc(100vh - 160px)}}:root.dark .notification-bell-btn{color:var(--text-primary)}:root.dark .notification-bell-btn:hover{background:#ffffff1a}:root.dark .notification-badge{border-color:var(--bg-secondary)}:root.dark .notification-dropdown{background:var(--bg-secondary);border:1px solid var(--border-color);box-shadow:var(--shadow-xl)}:root.dark .notification-header{background:var(--bg-tertiary);border-bottom-color:var(--border-color)}:root.dark .notification-header h3{color:var(--text-primary)}:root.dark .mark-all-read-btn{color:var(--primary-color)}:root.dark .mark-all-read-btn:hover{background:#7c8ef526}:root.dark .notification-item{border-bottom-color:var(--border-color)}:root.dark .notification-item:hover{background:var(--bg-tertiary)}:root.dark .notification-item.unread{background:#7c8ef51a}:root.dark .notification-item.unread:hover{background:#7c8ef526}:root.dark .notification-title{color:var(--text-primary)}:root.dark .notification-empty,:root.dark .notification-loading,:root.dark .notification-message,:root.dark .notification-time{color:var(--text-secondary)}:root.dark .notification-footer{background:var(--bg-tertiary);border-top-color:var(--border-color)}:root.dark .notification-footer a{color:var(--primary-color)}.navbar{backdrop-filter:blur(30px) saturate(180%);-webkit-backdrop-filter:blur(30px) saturate(180%);background:#fffffffa;border-bottom:1px solid #00000014;box-shadow:0 4px 30px #0000001a;padding:env(safe-area-inset-top) 0 0;position:-webkit-sticky;position:sticky;top:0;transition:all .4s cubic-bezier(.4,0,.2,1);z-index:1000}.navbar-scrolled{background:#fffffffc;border-bottom-color:#667eea1a;box-shadow:0 8px 40px #00000026}.navbar-container{gap:20px;height:72px;justify-content:space-between;margin:0 auto;max-width:1400px;padding:0 max(24px,calc(24px + env(safe-area-inset-right))) 0 max(24px,calc(24px + env(safe-area-inset-left)));position:relative}.navbar-container,.navbar-left{align-items:center;display:flex}.navbar-left{flex-shrink:0;gap:12px;min-width:0}.navbar-notification-mobile{align-items:center;display:none;gap:8px}.navbar-notification-desktop{align-items:center;display:flex;gap:8px}.navbar-theme-toggle-mobile{display:none}.navbar-brand,.navbar-theme-toggle-desktop{align-items:center;display:flex}.navbar-brand{flex-shrink:0;font-size:20px;font-weight:800;gap:8px;position:relative;text-decoration:none;transition:all .4s cubic-bezier(.4,0,.2,1)}.navbar-brand:after{background:linear-gradient(90deg,#667eea,#764ba2);border-radius:2px;bottom:-4px;content:"";height:3px;left:0;position:absolute;transition:width .4s cubic-bezier(.4,0,.2,1);width:0}.navbar-brand:hover{transform:scale(1.05)}.navbar-brand:hover:after{width:100%}.brand-icon{animation:pulse 2s ease-in-out infinite;filter:drop-shadow(0 2px 8px rgba(102,126,234,.3));flex-shrink:0;font-size:28px;line-height:1;transition:all .4s cubic-bezier(.4,0,.2,1)}.navbar-brand:hover .brand-icon{filter:drop-shadow(0 4px 12px rgba(102,126,234,.5));transform:rotate(15deg) scale(1.1)}.brand-text{display:flex;flex-direction:column;line-height:1.2;position:relative}.brand-title{-webkit-text-fill-color:#0000;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;background-clip:text;display:block;font-size:1em;font-weight:800}.brand-subtitle{color:#999;display:block;font-size:.5em;font-weight:500;margin-top:2px}.navbar-center{display:flex;flex:1 1;flex-shrink:1;justify-content:center;margin:0 auto;max-width:500px;min-width:200px}.navbar-right{flex-shrink:0;gap:12px;position:relative}.navbar-links,.navbar-right{align-items:center;display:flex}.navbar-links{flex-wrap:wrap;gap:6px;transition:all .3s ease}.navbar-link{align-items:center;border-radius:8px;color:#333;display:inline-flex;font-size:14px;font-weight:600;overflow:hidden;padding:8px 14px;position:relative;text-decoration:none;transition:all .4s cubic-bezier(.4,0,.2,1);white-space:nowrap}.navbar-link:after{background:linear-gradient(135deg,#667eea,#764ba2);bottom:4px;content:"";height:2px;left:50%;position:absolute;transform:translateX(-50%) scaleX(0);transition:transform .3s ease;width:60%}.navbar-link:hover{background:linear-gradient(135deg,#667eea1a,#764ba21a);color:#667eea;transform:translateY(-2px)}.navbar-link:hover:after{transform:translateX(-50%) scaleX(1)}.navbar-link-publish{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff!important;font-weight:600}.navbar-link-publish:after{display:none}.navbar-link-publish:hover{background:linear-gradient(135deg,#5568d3,#653d91);box-shadow:0 4px 12px #667eea4d;transform:translateY(-1px)}.navbar-user{align-items:flex-end;display:flex;flex-direction:column;flex-shrink:0;margin:0 4px;padding:4px 8px}.user-greeting{color:#999;font-size:11px;letter-spacing:.5px;text-transform:uppercase}.user-name-container{align-items:center;display:flex;gap:6px}.user-name{color:#667eea;font-size:14px;font-weight:600}.premium-badge-small{align-items:center;animation:premiumGlow 2s ease-in-out infinite;background:linear-gradient(135deg,#fbbf24,#f59e0b);border:1px solid #ffffff4d;border-radius:50%;box-shadow:0 2px 8px #fbbf2466;color:#fff;display:inline-flex;flex-shrink:0;font-size:12px;height:20px;justify-content:center;width:20px}.premium-badge-small:hover{box-shadow:0 3px 12px #fbbf2480;transform:scale(1.1)}.btn-small{border-radius:8px;flex-shrink:0;font-size:14px;font-weight:600;transition:all .3s ease;white-space:nowrap}.btn-logout{border:1px solid #e0e0e0}.btn-register{box-shadow:0 2px 8px #667eea33}.btn-register:hover{box-shadow:0 4px 12px #667eea4d;transform:translateY(-2px)}.navbar-dropdown-container,.navbar-publish-container{position:relative}.navbar-dropdown-toggle{align-items:center;background:none;border:none;border-radius:8px;color:#333;cursor:pointer;display:flex;font-family:inherit;font-size:14px;font-weight:600;gap:6px;overflow:hidden;padding:8px 14px;position:relative;text-decoration:none;transition:all .4s cubic-bezier(.4,0,.2,1);white-space:nowrap}.navbar-dropdown-toggle:after{background:linear-gradient(135deg,#667eea,#764ba2);bottom:4px;content:"";height:2px;left:50%;position:absolute;transform:translateX(-50%) scaleX(0);transition:transform .3s ease;width:60%}.navbar-dropdown-toggle:hover{background:linear-gradient(135deg,#667eea1a,#764ba21a);color:#667eea;transform:translateY(-2px)}.navbar-dropdown-toggle:hover:after{transform:translateX(-50%) scaleX(1)}.dropdown-arrow{font-size:10px;margin-left:4px;transition:transform .3s ease}.navbar-dropdown{background:#fff;border:1px solid #00000014;border-radius:8px;box-shadow:0 4px 20px #00000026;left:0;min-width:200px;overflow:hidden;position:absolute;top:calc(100% + 8px);z-index:1000}.dropdown-item{align-items:center;border-bottom:1px solid #f0f0f0;color:#333;display:flex;font-size:14px;gap:12px;padding:12px 16px;text-decoration:none;transition:all .2s ease}.dropdown-item:last-child{border-bottom:none}.dropdown-item:hover{background:#f8f9fa;color:#667eea}.dropdown-icon{flex-shrink:0;font-size:18px}.navbar-toggle-wrapper{align-items:center;display:flex}.navbar-toggle{background:#0000;border:none;cursor:pointer;display:none;flex-direction:column;height:28px;justify-content:space-around;padding:0;position:relative;width:28px;z-index:1001}.navbar-toggle span{background:#333;border-radius:3px;height:3px;transform-origin:center;transition:all .3s ease;width:100%}.navbar-toggle-open span:first-child{transform:rotate(45deg) translate(8px,8px)}.navbar-toggle-open span:nth-child(2){opacity:0}.navbar-toggle-open span:nth-child(3){transform:rotate(-45deg) translate(7px,-7px)}:root.dark .navbar{background:#0a0c18f2}:root.dark .navbar-scrolled{background:#0a0c18fa;box-shadow:0 4px 30px #00000080}:root.dark .navbar-link{color:#eaeaea}:root.dark .navbar-link:hover{background:#667eea26;color:#667eea}:root.dark .navbar-dropdown-toggle{color:#eaeaea}:root.dark .navbar-dropdown-toggle:hover{background:#667eea26;color:#667eea}:root.dark .navbar-dropdown{background:#0a0c18fa;border-color:#ffffff1a;box-shadow:0 4px 20px #00000080}:root.dark .dropdown-item{border-bottom-color:#ffffff1a;color:#eaeaea}:root.dark .dropdown-item:hover{background:#667eea26;color:#667eea}:root.dark .navbar-user{border-left-color:#ffffff1a}:root.dark .user-greeting{color:#888}:root.dark .brand-subtitle{color:#aaa}:root.dark .navbar-toggle span{background:#eaeaea}@media (max-width:1200px){.navbar-link{font-size:13px;padding:8px 12px}.navbar-link-publish{font-size:12px;padding:8px 12px}}@media (max-width:1024px){.navbar-center{max-width:300px}.navbar-links{gap:4px}.navbar-link{font-size:13px;padding:8px 10px}}@media (max-width:768px){.navbar-container{height:64px;padding:0 max(16px,calc(16px + env(safe-area-inset-right))) 0 max(16px,calc(16px + env(safe-area-inset-left)))}.navbar-center{display:none}.navbar-dropdown-container{width:100%}.navbar-dropdown-toggle{justify-content:space-between;width:100%}.navbar-dropdown{background:#0000;border:none;border-radius:0;border-top:1px solid #0000000d;box-shadow:none;margin-top:8px;position:static}.dropdown-item{border-bottom:1px solid #0000000d;padding:12px 16px}.navbar-brand{font-size:20px}.brand-icon{font-size:24px}.brand-title{font-size:1em}.brand-subtitle{font-size:.6em}.navbar-notification-mobile{align-items:center;display:flex;gap:8px;margin-left:8px}.navbar-notification-desktop{display:none}.navbar-theme-toggle-mobile{align-items:center;display:flex!important;flex-shrink:0;margin-left:8px;z-index:10}.navbar-theme-toggle-mobile .theme-toggle{display:flex!important;opacity:1!important;visibility:visible!important}.navbar-theme-toggle-desktop{display:none}.navbar-toggle{display:flex}.navbar-links{align-items:stretch;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);background:#fffffffa;box-shadow:0 4px 20px #0000001a;flex-direction:column;gap:12px;left:0;max-height:calc(100vh - 64px);overflow-y:auto;padding:20px;position:fixed;right:0;top:64px;transform:translateX(-100%);transition:transform .3s ease}.navbar-links-open{transform:translateX(0)}.navbar-link{border-bottom:1px solid #0000000d;border-radius:8px;padding:12px 16px;text-align:left}.navbar-link:after{display:none}.navbar-link:hover{background:#667eea1a}.navbar-user{align-items:center;border-bottom:1px solid #0000000d;border-left:none;flex-direction:row;gap:8px;margin:0;padding:12px 16px}.user-greeting,.user-name{font-size:14px}.btn-logout,.btn-register{justify-content:center;margin:8px 0;width:100%}.navbar-toggle-wrapper{border-top:1px solid #0000000d;padding:12px 16px;width:100%}}@media (max-width:480px){.navbar-container{height:60px;padding:0 max(12px,calc(12px + env(safe-area-inset-right))) 0 max(12px,calc(12px + env(safe-area-inset-left)))}.navbar-brand{font-size:20px}.brand-icon{font-size:26px}.brand-title{font-size:1em}.brand-subtitle{font-size:.55em}.navbar-notification-mobile{align-items:center;display:flex;gap:6px;margin-left:6px}.navbar-notification-desktop{display:none}.navbar-theme-toggle-mobile{align-items:center;display:flex!important;flex-shrink:0;margin-left:6px;z-index:10}.navbar-theme-toggle-mobile .theme-toggle{display:flex!important;opacity:1!important;visibility:visible!important}.navbar-theme-toggle-desktop{display:none}.navbar-links{max-height:calc(100vh - 60px);top:60px}}@media (max-width:768px) and (orientation:landscape){.navbar-container{gap:12px;height:56px;padding:0 16px}.navbar-left{flex-shrink:1;gap:8px;min-width:0}.navbar-center{display:flex!important;flex:1 1;max-width:400px;min-width:0}.navbar-right{flex-shrink:0;gap:8px}.navbar-brand{font-size:18px}.brand-icon{font-size:22px}.brand-title{font-size:.95em}.brand-subtitle{font-size:.5em}.navbar-links{gap:8px;max-height:calc(100vh - 56px);padding:12px 16px;top:56px}.navbar-link{font-size:14px}.navbar-link,.navbar-user{padding:10px 14px}.user-greeting,.user-name{font-size:13px}.navbar-toggle-wrapper{padding:10px 14px}.navbar-notification-mobile{gap:6px}}@media (max-width:480px) and (orientation:landscape){.navbar-container{gap:8px;height:52px;padding:0 10px}.navbar-left{flex-shrink:1;gap:6px;min-width:0}.navbar-center{display:flex!important;flex:1 1;max-width:300px;min-width:0}.navbar-right{flex-shrink:0;gap:6px}.navbar-brand{font-size:16px}.brand-icon{font-size:20px}.brand-title{font-size:.9em}.brand-subtitle{font-size:.45em}.navbar-notification-mobile{gap:4px;margin-left:4px}.navbar-theme-toggle-mobile{margin-left:4px}.navbar-links{gap:6px;max-height:calc(100vh - 52px);padding:10px 12px;top:52px}.navbar-link{font-size:13px;padding:8px 12px}.navbar-user{gap:6px;padding:8px 12px}.user-greeting,.user-name{font-size:12px}.btn-logout,.btn-register{font-size:13px;margin:6px 0;padding:8px 12px}.navbar-toggle-wrapper{padding:8px 12px}.navbar-toggle{height:28px;width:28px}.navbar-toggle span{height:2px}}@media (min-width:481px) and (max-width:1024px) and (orientation:landscape){.navbar-container{height:64px}.navbar-links{max-height:calc(100vh - 64px);top:64px}}:root.dark .navbar{background:#0f1226fa;border-bottom-color:#ffffff1a;box-shadow:0 4px 30px #00000080}:root.dark .navbar-scrolled{background:#0f1226fc;border-bottom-color:#7c8ef533;box-shadow:0 8px 40px #0009}:root.dark .navbar-links{background:#0a0c18fa;box-shadow:0 4px 20px #00000080}:root.dark .navbar-link{border-bottom-color:#ffffff1a;color:var(--text-primary)}:root.dark .navbar-link:hover{background:#7c8ef51a;color:var(--primary-color)}:root.dark .navbar-user{border-bottom-color:#ffffff1a}:root.dark .navbar-user,:root.dark .user-name{color:var(--text-primary)}:root.dark .navbar-toggle-wrapper{border-top-color:#ffffff1a}:root.dark .brand-title,:root.dark .navbar-brand{color:var(--text-primary)}:root.dark .brand-subtitle{color:var(--text-secondary)}:root.dark .navbar-toggle span{background:var(--text-primary)}.share-app-btn{align-items:center;background:linear-gradient(135deg,#667eea,#764ba2);border:none;border-radius:8px;box-shadow:0 2px 8px #667eea4d;color:#fff;cursor:pointer;display:flex;font-size:14px;font-weight:600;gap:8px;padding:10px 16px;transition:all .3s ease}.share-app-btn:hover{box-shadow:0 4px 12px #667eea66;transform:translateY(-2px)}.share-app-btn:active{transform:translateY(0)}.share-app-icon{font-size:18px}.share-app-text{font-size:14px}.share-app-overlay{align-items:center;animation:fadeIn .3s ease;background:#0009;bottom:0;display:flex;justify-content:center;left:0;padding:20px;position:fixed;right:0;top:0;z-index:10002}.share-app-menu{animation:slideUp .3s ease;background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:16px;box-shadow:var(--shadow-xl);max-width:400px;overflow:hidden;padding:0;width:100%}.share-app-menu-header{align-items:center;border-bottom:1px solid var(--border-color);display:flex;justify-content:space-between;padding:20px}.share-app-menu-header h3{color:var(--text-primary);font-size:20px;font-weight:600;margin:0}.share-app-close{align-items:center;background:none;border:none;border-radius:50%;color:var(--text-secondary);cursor:pointer;display:flex;font-size:28px;height:35px;justify-content:center;padding:0;transition:all .3s ease;width:35px}.share-app-close:hover{background:var(--bg-tertiary);color:var(--text-primary)}.share-app-options{grid-gap:12px;display:grid;gap:12px;grid-template-columns:repeat(2,1fr);padding:20px}.share-option{align-items:center;background:var(--bg-tertiary);border:1px solid var(--border-color);border-radius:12px;cursor:pointer;display:flex;flex-direction:column;gap:8px;padding:16px;text-align:center;transition:all .3s ease}.share-option:hover{background:var(--primary-color);border-color:var(--primary-color);box-shadow:var(--shadow-md);color:#fff;transform:translateY(-2px)}.share-option-icon{font-size:32px}.share-option-text{color:var(--text-primary);font-size:14px;font-weight:500}.share-option:hover .share-option-text{color:#fff}.share-app-url{background:var(--bg-tertiary);border-top:1px solid var(--border-color);padding:20px}.share-url-input{background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:8px;color:var(--text-primary);cursor:text;font-family:monospace;font-size:14px;padding:12px;width:100%}.share-url-input:focus{border-color:var(--primary-color);box-shadow:0 0 0 3px #667eea1a;outline:none}:root.dark .share-app-menu{background:var(--bg-secondary);border-color:var(--border-color)}:root.dark .share-app-menu-header{border-bottom-color:var(--border-color)}:root.dark .share-app-close{color:var(--text-secondary)}:root.dark .share-app-close:hover{background:var(--bg-tertiary);color:var(--text-primary)}:root.dark .share-option{background:var(--bg-tertiary);border-color:var(--border-color)}:root.dark .share-option-text{color:var(--text-primary)}:root.dark .share-app-url{background:var(--bg-tertiary);border-top-color:var(--border-color)}:root.dark .share-url-input{background:var(--bg-secondary);border-color:var(--border-color);color:var(--text-primary)}@media (max-width:480px){.share-app-menu{border-radius:16px 16px 0 0;margin-top:auto;max-width:100%}.share-app-options{gap:10px;grid-template-columns:repeat(2,1fr);padding:15px}.share-option{padding:12px}.share-option-icon{font-size:28px}.share-option-text{font-size:12px}.share-app-menu-header{padding:15px}.share-app-menu-header h3{font-size:18px}.share-app-url{padding:15px}.share-url-input{font-size:12px;padding:10px}}.footer{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#fffffff2;border-top:1px solid #0000001a;margin-top:auto;padding:3rem 0 1.5rem}.footer-container{margin:0 auto;max-width:1200px;padding:0 20px}.footer-content{grid-gap:2rem;display:grid;gap:2rem;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));margin-bottom:2rem}.footer-section{display:flex;flex-direction:column}.footer-brand{-webkit-text-fill-color:#0000;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;background-clip:text;font-size:24px;font-weight:700;margin-bottom:1rem}.footer-description{color:#666;font-size:14px;line-height:1.6;margin-top:.5rem}.footer-title{color:#333;font-size:16px;font-weight:600;margin-bottom:1rem}.footer-links{list-style:none;margin:0;padding:0}.footer-links li{margin-bottom:.75rem}.footer-links{flex-wrap:wrap;gap:1rem}.footer-links,.footer-share-app{align-items:center;display:flex}.footer-link,.footer-links a{color:#666;font-size:14px;text-decoration:none;transition:color .3s ease}.footer-link:hover,.footer-links a:hover{color:#667eea}.footer-bottom{align-items:center;border-top:1px solid #0000001a;display:flex;flex-wrap:wrap;gap:1rem;justify-content:space-between;padding-top:2rem}.footer-copyright{color:#666;font-size:14px;margin:0}.footer-social{align-items:center;display:flex;gap:1rem}.social-label{color:#666;font-size:14px}.social-link{display:inline-block;font-size:20px;text-decoration:none;transition:transform .3s ease}.social-link:hover{transform:scale(1.2)}:root.dark .footer{background:#0a0c18f2;border-top-color:#ffffff1a}:root.dark .footer-title{color:#eaeaea}:root.dark .footer-copyright,:root.dark .footer-description,:root.dark .footer-link,:root.dark .footer-links a,:root.dark .social-label{color:#bbb}:root.dark .footer-link:hover,:root.dark .footer-links a:hover{color:#667eea}:root.dark .footer-bottom{border-top-color:#ffffff1a}@media (max-width:768px){.footer-content{gap:1.5rem;grid-template-columns:1fr}.footer-bottom{flex-direction:column;text-align:center}.footer-social{justify-content:center}}@media (max-width:480px){.footer{padding:2rem 0 1rem}.footer-content{gap:1rem}.footer-section{margin-bottom:.5rem}}.audio-player{background:#0000;border-radius:0;box-shadow:none;color:#1a1a1a;margin:0;overflow:visible;padding:0;position:relative;width:100%}.audio-player:before{background:radial-gradient(circle at 30% 50%,#ffffff1a 0,#0000 50%);bottom:0;content:"";left:0;pointer-events:none;position:absolute;right:0;top:0}.audio-controls-main{display:flex;flex-direction:column;gap:12px;width:100%}.audio-nav-controls{flex-wrap:wrap;gap:8px}.audio-nav-controls,.control-btn{align-items:center;display:flex;justify-content:center}.control-btn{background:#0000;border:none;border-radius:50%;color:#666;cursor:pointer;font-size:16px;height:36px;overflow:hidden;padding:0;position:relative;transition:all .2s cubic-bezier(.4,0,.2,1);width:36px}.control-btn:before{background:#fff3;border-radius:50%;content:"";height:0;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);transition:width .4s,height .4s;width:0}.control-btn:hover{background:#0000000d;color:#1a1a1a;transform:scale(1.1)}.control-btn:hover:before{height:100%;width:100%}.control-btn.active{background:#667eea1a;color:#667eea}.play-button-main{align-items:center;background:#667eea;border:none;border-radius:50%;box-shadow:0 2px 8px #667eea4d;color:#fff;cursor:pointer;display:flex;flex-shrink:0;font-size:20px;height:48px;justify-content:center;position:relative;transition:all .3s cubic-bezier(.4,0,.2,1);width:48px;z-index:1}.play-button-main:before{background:#ffffff4d;border-radius:50%;content:"";height:0;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);transition:width .6s,height .6s;width:0;z-index:-1}.play-button-main:hover{background:#5a67d8;box-shadow:0 4px 12px #667eea66;transform:scale(1.08)}.play-button-main:hover:before{height:100px;width:100px}.play-button-main:active{transform:scale(1.05)}.audio-progress-container{align-items:center;display:flex;gap:10px;width:100%}.time-display-left,.time-display-right{color:#666;flex-shrink:0;font-size:12px;font-weight:500;min-width:40px;text-align:center}.audio-progress{flex:1 1;position:relative}.progress-slider{-webkit-appearance:none;background:#0000001a;border-radius:2px;cursor:pointer;height:4px;outline:none;width:100%}.progress-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;background:#667eea;border:2px solid #fff;border-radius:50%;box-shadow:0 2px 6px #667eea66;cursor:pointer;height:14px;-webkit-transition:all .2s;transition:all .2s;width:14px}.progress-slider::-webkit-slider-thumb:hover{box-shadow:0 3px 12px #0006;transform:scale(1.2)}.progress-slider::-moz-range-thumb{background:#667eea;border:2px solid #fff;border-radius:50%;box-shadow:0 2px 6px #667eea66;cursor:pointer;height:14px;-moz-transition:all .2s;transition:all .2s;width:14px}.progress-slider::-moz-range-thumb:hover{box-shadow:0 3px 12px #0006;transform:scale(1.2)}.powered-by-container{align-items:center;display:flex;justify-content:center;padding:8px 0}.powered-by-text{color:#999;font-size:11px;font-weight:400;letter-spacing:.5px;opacity:.7;text-transform:uppercase;transition:opacity .2s ease}.powered-by-container:hover .powered-by-text{opacity:1}.fullscreen-btn{margin-left:8px}.fullscreen-btn svg{height:20px;width:20px}@media (max-width:768px){.audio-player{border-radius:16px;box-sizing:border-box;margin:16px 0;max-width:100%;overflow:hidden;padding:20px 15px;width:100%}.audio-nav-controls{flex-wrap:wrap;gap:8px;justify-content:center}.control-btn{flex-shrink:0;font-size:16px;height:36px;width:36px}.play-button-main{flex-shrink:0;font-size:20px;height:50px;width:50px}.time-display-left,.time-display-right{flex-shrink:0;font-size:12px;min-width:40px}.audio-progress-container{flex-wrap:wrap;gap:8px;width:100%}.audio-progress{flex:1 1 100%;min-width:0;order:2;width:100%}.time-display-left{order:1}.time-display-right{order:3}.audio-controls-main{gap:15px;width:100%}.powered-by-container{flex-shrink:0}.powered-by-text{font-size:10px}.fullscreen-btn{display:flex!important}}@media (max-width:480px){.audio-player{border-radius:12px;box-sizing:border-box;margin:12px 0;max-width:100%;overflow:hidden;padding:15px 12px;width:100%}.audio-nav-controls{flex-wrap:wrap;gap:6px}.control-btn{flex-shrink:0;font-size:14px;height:32px;width:32px}.play-button-main{flex-shrink:0;font-size:18px;height:45px;width:45px}.time-display-left,.time-display-right{flex-shrink:0;font-size:11px;min-width:35px}.audio-progress-container{flex-wrap:wrap;gap:6px;width:100%}.audio-progress{flex:1 1 100%;min-width:0;order:2;width:100%}.time-display-left{order:1}.time-display-right{order:3}.progress-slider{height:5px}.progress-slider::-webkit-slider-thumb{height:14px;width:14px}.progress-slider::-moz-range-thumb{height:14px;width:14px}.audio-controls-main{gap:12px;width:100%}.powered-by-container{flex-shrink:0}.powered-by-text{font-size:9px}.fullscreen-btn{display:flex!important}}:root.dark .audio-player{background:var(--bg-secondary);color:var(--text-primary)}:root.dark .control-btn{color:var(--text-secondary)}:root.dark .control-btn:hover{background:#ffffff1a;color:var(--text-primary)}:root.dark .control-btn.active{background:#7c8ef533;color:var(--primary-color)}:root.dark .time-display-left,:root.dark .time-display-right{color:var(--text-secondary)}:root.dark .progress-slider{background:#fff3}:root.dark .powered-by-text{color:var(--text-secondary)}.karaoke-player{background:linear-gradient(135deg,#1a1a2e,#16213e 50%,#0f3460);bottom:0;color:#fff;display:flex;flex-direction:column;left:0;overflow:hidden;padding:0;position:fixed;right:0;top:0;z-index:10000}.karaoke-player.fullscreen{height:100vh;position:fixed;width:100vw}.karaoke-header{align-items:center;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:linear-gradient(180deg,#1a1a2efa,#16213ef2);border-bottom:2px solid #ffffff26;box-shadow:0 4px 20px #0000004d;display:flex;flex-shrink:0;flex-wrap:wrap;gap:15px;justify-content:space-between;padding:92px 24px 20px;z-index:10001}.karaoke-song-info h3{font-size:26px;font-weight:700;letter-spacing:.5px;margin:0 0 6px;text-shadow:0 2px 10px #0000004d}.karaoke-song-info p{font-size:15px;font-weight:500;margin:0;opacity:.85}.karaoke-controls{gap:10px}.karaoke-btn,.karaoke-controls{align-items:center;display:flex}.karaoke-btn{background:#ffffff1f;border:1px solid #ffffff40;border-radius:10px;box-shadow:0 2px 8px #0003;color:#fff;cursor:pointer;font-size:16px;font-weight:600;justify-content:center;min-width:44px;padding:10px 16px;transition:all .3s cubic-bezier(.4,0,.2,1)}.karaoke-btn:hover{background:#ffffff40;border-color:#fff6;box-shadow:0 4px 12px #0000004d;transform:translateY(-2px)}.karaoke-btn:active{box-shadow:0 2px 6px #0003;transform:translateY(0)}.karaoke-content{-webkit-overflow-scrolling:touch;align-items:center;box-sizing:border-box;display:flex;flex:1 1;flex-direction:column;line-height:1.8;margin:0 auto;max-width:1200px;min-height:0;overflow-x:hidden;overflow-y:auto;padding:40px 20px 160px;scroll-behavior:smooth;text-align:center;width:100%}.karaoke-line{word-wrap:break-word;border-radius:8px;margin:12px 0;max-width:100%;min-height:1.6em;opacity:.35;padding:12px 24px;position:relative;transition:all .4s cubic-bezier(.4,0,.2,1);width:100%}.karaoke-line.past{color:#fff9;opacity:.5;transform:scale(.95)}.karaoke-line.active{background:linear-gradient(135deg,#667eea40,#764ba240);border:2px solid #667eea66;border-radius:16px;box-shadow:0 8px 32px #667eea4d,inset 0 1px 0 #ffffff1a;color:#fff;font-weight:700;margin:20px 0;opacity:1;padding:18px 30px;position:relative;text-shadow:0 0 20px #667eeae6,0 0 40px #667eeab3,0 0 60px #667eea80,0 0 80px #667eea4d;transform:scale(1.05)}.karaoke-line.active:before{animation:pulse-glow 2s ease-in-out infinite;background:linear-gradient(135deg,#667eea80,#764ba280);border-radius:16px;bottom:-2px;content:"";left:-2px;opacity:.5;position:absolute;right:-2px;top:-2px;z-index:-1}@keyframes pulse-glow{0%,to{opacity:.5;transform:scale(1)}50%{opacity:.8;transform:scale(1.02)}}.karaoke-paused{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#000000d9;border:2px solid #fff3;border-radius:16px;box-shadow:0 8px 32px #00000080;font-size:20px;font-weight:600;left:50%;opacity:.9;padding:24px 48px;pointer-events:none;position:fixed;top:50%;transform:translate(-50%,-50%);z-index:10002}@media (max-width:768px){.karaoke-header{align-items:flex-start;flex-direction:column;gap:12px;padding:80px 20px 16px}.karaoke-song-info h3{font-size:20px}.karaoke-song-info p{font-size:14px}.karaoke-controls{gap:8px;justify-content:flex-start;width:100%}.karaoke-btn{font-size:14px;min-width:40px;padding:8px 12px}.karaoke-content{padding:24px 16px 150px}.karaoke-line{margin:10px 0;padding:10px 18px}.karaoke-line.active{margin:16px 0;padding:14px 24px;transform:scale(1.03)}.karaoke-paused{font-size:18px;padding:20px 36px}}@media (max-width:480px){.karaoke-header{padding:75px 16px 12px}.karaoke-song-info h3{font-size:18px}.karaoke-content{padding:20px 12px 150px}.karaoke-line{margin:8px 0;padding:8px 16px}.karaoke-line.active{margin:14px 0;padding:12px 20px}}.fullscreen-player{align-items:center;bottom:0!important;box-sizing:border-box;display:flex;height:100vh!important;justify-content:center;left:0!important;margin:0;max-height:100vh!important;min-height:100vh!important;overflow:hidden;padding:0;position:fixed!important;right:0!important;top:0!important;width:100vw!important;z-index:99999!important}@supports (height:100dvh){.fullscreen-player{height:100dvh;max-height:100dvh;min-height:100dvh;width:100dvw}}.fullscreen-background{bottom:0;height:100%;left:0;max-height:100vh;min-height:100vh;overflow:hidden;position:absolute;right:0;top:0;width:100%}@supports (height:100dvh){.fullscreen-background{height:100dvh;max-height:100dvh;min-height:100dvh;width:100dvw}}.fullscreen-bg-image{animation:backgroundPulse 20s ease-in-out infinite;filter:blur(40px) brightness(.4);height:100%;object-fit:cover;transform:scale(1.1);width:100%}@keyframes backgroundPulse{0%,to{transform:scale(1.1)}50%{transform:scale(1.15)}}.fullscreen-overlay{-webkit-backdrop-filter:blur(1px);backdrop-filter:blur(1px);background:linear-gradient(180deg,#0000004d,#0009 50%,#000c);height:100%;left:0;position:absolute;top:0;width:100%}.fullscreen-content{align-items:center;animation:fadeInScale .5s cubic-bezier(.4,0,.2,1);box-sizing:border-box;display:flex;flex-direction:column;gap:40px;height:100%;justify-content:center;max-height:100vh;max-width:100%;min-height:100vh;overflow:hidden;padding:40px 60px;position:relative;width:100%;z-index:1}@supports (height:100dvh){.fullscreen-content{height:100dvh;max-height:100dvh;min-height:100dvh;width:100dvw}}@keyframes fadeInScale{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}.fullscreen-close-btn{align-items:center;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#fff3;border:1px solid #ffffff4d;border-radius:50%;color:#fff;cursor:pointer;display:flex;flex-shrink:0;height:clamp(44px,5vw,56px);justify-content:center;pointer-events:auto;position:fixed;right:clamp(20px,3vw,40px);top:clamp(20px,3vw,40px);transition:all .3s cubic-bezier(.4,0,.2,1);width:clamp(44px,5vw,56px);z-index:100000}.fullscreen-close-btn svg{height:clamp(20px,2.5vw,28px);width:clamp(20px,2.5vw,28px)}.fullscreen-close-btn:hover{background:#ffffff4d;box-shadow:0 4px 20px #0000004d;transform:scale(1.1) rotate(90deg)}.fullscreen-cover-section{align-items:center;display:flex;flex:0 0 auto;justify-content:center;min-height:0;width:100%}.fullscreen-cover-wrapper{animation:coverFloat 8s ease-in-out infinite;aspect-ratio:1;border-radius:20px;box-shadow:0 30px 80px #0009,0 0 0 1px #ffffff1a;flex-shrink:0;height:min(400px,35vw,45vh);max-height:100%;max-width:100%;overflow:hidden;position:relative;transition:transform .3s ease;width:min(400px,35vw,45vh)}@keyframes coverFloat{0%,to{transform:translateY(0) scale(1)}50%{transform:translateY(-15px) scale(1.02)}}.fullscreen-cover-wrapper:hover{box-shadow:0 40px 100px #000000b3,0 0 0 1px #ffffff26;transform:scale(1.05)}.fullscreen-cover{height:100%;object-fit:cover;width:100%}.fullscreen-placeholder{align-items:center;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;display:flex;height:100%;justify-content:center;width:100%}.fullscreen-placeholder svg{height:120px;opacity:.8;width:120px}.playing-indicator{animation:pulse 2s ease-in-out infinite;background:#10b981;border:2px solid #ffffffe6;border-radius:50%;box-shadow:0 0 15px #10b981,0 0 30px #10b98180;height:14px;position:absolute;right:16px;top:16px;width:14px}.fullscreen-info-section{color:#fff;display:flex;flex-direction:column;flex-shrink:0;gap:30px;max-width:900px;overflow:visible;text-align:center;width:100%}.fullscreen-title{word-wrap:break-word;font-size:clamp(32px,5.5vw,64px);font-weight:700;letter-spacing:-.5px;line-height:1.2;margin:0;overflow-wrap:break-word;text-shadow:0 2px 10px #00000080,0 4px 20px #0000004d}.fullscreen-artist{font-size:clamp(20px,3.5vw,32px);font-weight:500;letter-spacing:.5px;margin:0;opacity:.85;text-shadow:0 2px 8px #0006}.fullscreen-progress-container{align-items:center;box-sizing:border-box;display:flex;gap:clamp(12px,2vw,24px);margin:0;padding:0 10px;width:100%}.fullscreen-time-left,.fullscreen-time-right{font-size:clamp(14px,1.5vw,18px);font-weight:600;min-width:clamp(50px,6vw,70px);text-shadow:0 2px 8px #0000004d;white-space:nowrap}.fullscreen-progress-bar{flex:1 1;position:relative}.fullscreen-progress-slider{-webkit-appearance:none;appearance:none;background:#ffffff40;border-radius:4px;cursor:pointer;height:clamp(5px,.7vw,8px);outline:none;transition:height .2s ease;width:100%}.fullscreen-progress-slider:hover{height:clamp(7px,.9vw,10px)}.fullscreen-progress-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;background:#fff;border-radius:50%;box-shadow:0 4px 12px #0006;cursor:pointer;height:clamp(16px,2vw,24px);-webkit-transition:all .2s;transition:all .2s;width:clamp(16px,2vw,24px)}.fullscreen-progress-slider::-webkit-slider-thumb:hover{box-shadow:0 6px 20px #00000080;transform:scale(1.3)}.fullscreen-progress-slider::-moz-range-thumb{background:#fff;border:none;border-radius:50%;box-shadow:0 4px 12px #0006;cursor:pointer;height:clamp(16px,2vw,24px);-moz-transition:all .2s;transition:all .2s;width:clamp(16px,2vw,24px)}.fullscreen-progress-slider::-moz-range-thumb:hover{box-shadow:0 6px 20px #00000080;transform:scale(1.3)}.fullscreen-controls{align-items:center;display:flex!important;flex-wrap:wrap;gap:clamp(16px,2.5vw,32px);justify-content:center;margin:0;opacity:1;overflow:visible;visibility:visible;width:100%}.fullscreen-control-btn{align-items:center;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);background:#ffffff26;border:1px solid #fff3;border-radius:50%;color:#fff;cursor:pointer;display:flex;flex-shrink:0;height:clamp(52px,5.5vw,68px);justify-content:center;overflow:hidden;position:relative;transition:all .3s cubic-bezier(.4,0,.2,1);width:clamp(52px,5.5vw,68px)}.fullscreen-control-btn svg{height:clamp(22px,2.8vw,30px);width:clamp(22px,2.8vw,30px)}.fullscreen-control-btn:before{background:#ffffff4d;border-radius:50%;content:"";height:0;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);transition:width .4s,height .4s;width:0}.fullscreen-control-btn:hover{background:#ffffff40;border-color:#fff6;box-shadow:0 4px 20px #0000004d;transform:scale(1.1)}.fullscreen-control-btn:hover:before{height:100%;width:100%}.fullscreen-control-btn.active{background:#ffffff4d;border-color:#ffffff80;box-shadow:0 0 20px #ffffff80,0 4px 15px #0003}.fullscreen-play-btn{align-items:center;background:#fff;border:none;border-radius:50%;box-shadow:0 10px 40px #00000080,0 0 0 0 #fff3;color:#667eea;cursor:pointer;display:flex;flex-shrink:0;height:clamp(88px,11vw,128px);justify-content:center;position:relative;transition:all .3s cubic-bezier(.4,0,.2,1);width:clamp(88px,11vw,128px);z-index:1}.fullscreen-play-btn svg{height:clamp(32px,4vw,48px);width:clamp(32px,4vw,48px)}.fullscreen-play-btn:before{background:#667eea33;border-radius:50%;content:"";height:0;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);transition:width .6s,height .6s;width:0;z-index:-1}.fullscreen-play-btn:hover{background:#f8f9fa;box-shadow:0 14px 50px #0009,0 0 0 10px #ffffff14;transform:scale(1.1)}.fullscreen-play-btn:hover:before{height:160px;width:160px}.fullscreen-play-btn:active{transform:scale(1.05)}.fullscreen-powered-by-container{align-items:center;display:flex;flex-shrink:0;justify-content:center;padding:8px 0}.fullscreen-powered-by-text{color:#fff9;font-size:12px;font-weight:400;letter-spacing:.5px;opacity:.7;text-transform:uppercase;transition:opacity .2s ease}.fullscreen-powered-by-container:hover .fullscreen-powered-by-text{color:#fffc;opacity:1}.fullscreen-shortcuts{animation:fadeIn .5s ease;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#0009;border:1px solid #ffffff1a;border-radius:12px;bottom:30px;color:#ffffffe6;display:flex;font-size:12px;gap:20px;left:50%;padding:12px 24px;position:absolute;transform:translateX(-50%)}.fullscreen-shortcut-item{align-items:center;display:flex;gap:6px}.fullscreen-shortcut-key{background:#fff3;border:1px solid #ffffff4d;border-radius:4px;font-weight:600;padding:4px 8px}@media (max-width:768px){.fullscreen-shortcuts{display:none}}@media (max-width:1024px){.fullscreen-content{gap:30px;padding:30px 40px 60px}.fullscreen-cover-wrapper{height:min(250px,35vw,35vh);width:min(250px,35vw,35vh)}}@media (max-width:768px){.fullscreen-player{bottom:0!important;height:100vh!important;left:0!important;margin:0!important;max-height:100vh!important;min-height:100vh!important;padding:0!important;position:fixed!important;right:0!important;top:0!important;inset:0!important;width:100vw!important;z-index:99999!important}.fullscreen-background{inset:0!important;position:absolute!important}.fullscreen-background,.fullscreen-content{height:100%!important;max-height:100%!important;min-height:100%!important;width:100%!important}.fullscreen-content{-webkit-overflow-scrolling:touch;box-sizing:border-box;gap:12px;justify-content:flex-start;overflow-x:hidden;overflow-y:auto;padding:env(safe-area-inset-top,0) 12px env(safe-area-inset-bottom,0)!important;position:relative!important}@supports (height:100dvh){.fullscreen-player{height:100dvh;max-height:100dvh;min-height:100dvh;width:100dvw}.fullscreen-background{position:absolute!important}.fullscreen-background,.fullscreen-content{height:100dvh!important;max-height:100dvh!important;min-height:100dvh!important;width:100dvw!important}.fullscreen-content{position:relative!important}}.fullscreen-cover-section{flex:0 0 auto;min-height:0}.fullscreen-cover-wrapper{flex-shrink:0;height:min(180px,35vw,28vh);width:min(180px,35vw,28vh)}.fullscreen-info-section{display:flex;flex:1 1;flex-direction:column;gap:12px;justify-content:flex-start;max-width:100%;min-height:0;overflow:visible}.fullscreen-title{font-size:clamp(20px,5vw,28px);line-height:1.2}.fullscreen-artist{font-size:clamp(14px,3.5vw,18px);line-height:1.3}.fullscreen-progress-container{gap:10px;padding:0 5px}.fullscreen-controls{align-items:center;display:flex!important;flex-shrink:0;flex-wrap:wrap;gap:8px;justify-content:center;margin-top:auto;padding:8px 4px;width:100%}.fullscreen-control-btn{display:flex!important;flex-shrink:0;font-size:20px;height:48px;width:48px}.fullscreen-control-btn svg{height:20px;width:20px}.fullscreen-play-btn{display:flex!important;flex-shrink:0;height:64px;width:64px}.fullscreen-play-btn svg{height:28px;width:28px}.fullscreen-close-btn{height:44px;right:max(16px,env(safe-area-inset-right,16px))!important;top:max(16px,env(safe-area-inset-top,16px))!important;width:44px;z-index:100000!important}.fullscreen-powered-by-container{display:flex!important;flex-shrink:0}.fullscreen-powered-by-text{font-size:11px}}@media (max-width:480px){.fullscreen-player{height:100vh!important;max-height:100vh!important;min-height:100vh!important;position:fixed!important;width:100vw!important;z-index:99999!important}.fullscreen-background,.fullscreen-player{bottom:0!important;left:0!important;overflow:hidden;right:0!important;top:0!important}.fullscreen-background{position:absolute!important}.fullscreen-background,.fullscreen-content{height:100%!important;max-height:100%!important;min-height:100%!important;width:100%!important}.fullscreen-content{-webkit-overflow-scrolling:touch;box-sizing:border-box;gap:10px;justify-content:flex-start;overflow-x:hidden;overflow-y:auto;padding:env(safe-area-inset-top,0) 8px env(safe-area-inset-bottom,0)!important;position:relative!important}@supports (height:100dvh){.fullscreen-player{height:100dvh;max-height:100dvh;min-height:100dvh;width:100dvw}.fullscreen-background{position:absolute!important}.fullscreen-background,.fullscreen-content{height:100dvh!important;max-height:100dvh!important;min-height:100dvh!important;width:100dvw!important}.fullscreen-content{position:relative!important}}.fullscreen-cover-section{flex:0 0 auto;min-height:0}.fullscreen-cover-wrapper{flex-shrink:0;height:min(160px,45vw,22vh);width:min(160px,45vw,22vh)}.fullscreen-info-section{box-sizing:border-box;display:flex;flex:0 1 auto;flex-direction:column;gap:10px;justify-content:flex-start;max-width:100%;min-height:0;overflow:visible;padding:0 4px;width:100%}.fullscreen-title{font-size:clamp(20px,7vw,28px);line-height:1.3}.fullscreen-artist,.fullscreen-title{word-wrap:break-word;overflow-wrap:break-word;text-align:center}.fullscreen-artist{font-size:clamp(14px,4vw,18px)}.fullscreen-progress-container{gap:8px;padding:0}.fullscreen-time-left,.fullscreen-time-right{font-size:12px;min-width:45px}.fullscreen-progress-slider{height:6px}.fullscreen-progress-slider::-webkit-slider-thumb{height:16px;width:16px}.fullscreen-progress-slider::-moz-range-thumb{height:16px;width:16px}.fullscreen-controls{align-items:center;display:flex!important;flex-shrink:0;flex-wrap:wrap;gap:6px;justify-content:center;margin-top:auto;padding:8px 4px;width:100%}.fullscreen-control-btn{display:flex!important;flex-shrink:0;font-size:18px;height:44px;width:44px}.fullscreen-control-btn svg{height:18px;width:18px}.fullscreen-play-btn{display:flex!important;flex-shrink:0;height:60px;width:60px}.fullscreen-play-btn svg{height:24px;width:24px}.fullscreen-close-btn{height:40px;right:max(12px,env(safe-area-inset-right,12px))!important;top:max(12px,env(safe-area-inset-top,12px))!important;width:40px;z-index:100000!important}.fullscreen-close-btn svg{height:20px;width:20px}.fullscreen-powered-by-container{display:flex!important;flex-shrink:0}.fullscreen-powered-by-text{font-size:10px}}@media (max-width:768px) and (orientation:landscape){.fullscreen-player{height:100vh;width:100vw}.fullscreen-background,.fullscreen-player{bottom:0;left:0;max-height:100vh;min-height:100vh;right:0;top:0}.fullscreen-background,.fullscreen-content{height:100%;width:100%}.fullscreen-content{align-items:center;flex-direction:row;gap:20px;justify-content:center;max-height:100vh;min-height:100vh;overflow:hidden;padding:20px 30px}@supports (height:100dvh){.fullscreen-player{height:100dvh;max-height:100dvh;min-height:100dvh;width:100dvw}.fullscreen-background{position:absolute!important}.fullscreen-background,.fullscreen-content{height:100dvh!important;max-height:100dvh!important;min-height:100dvh!important;width:100dvw!important}.fullscreen-content{position:relative!important}}.fullscreen-cover-section{flex:0 0 auto}.fullscreen-cover-wrapper{height:min(150px,30vh,25vw);width:min(150px,30vh,25vw)}.fullscreen-info-section{flex:1 1;gap:16px;min-width:0}.fullscreen-controls{gap:12px}}@media (min-width:1920px){.fullscreen-content{max-width:1600px;padding:60px 80px 100px}.fullscreen-cover-wrapper{height:min(350px,25vw,35vh);width:min(350px,25vw,35vh)}}@media (max-width:360px){.fullscreen-player{height:100vh;width:100vw}.fullscreen-background,.fullscreen-player{bottom:0;left:0;max-height:100vh;min-height:100vh;right:0;top:0}.fullscreen-background,.fullscreen-content{height:100%;width:100%}.fullscreen-content{gap:14px;justify-content:center;max-height:100vh;min-height:100vh;overflow:hidden;padding:10px}@supports (height:100dvh){.fullscreen-player{height:100dvh;max-height:100dvh;min-height:100dvh;width:100dvw}.fullscreen-background{position:absolute!important}.fullscreen-background,.fullscreen-content{height:100dvh!important;max-height:100dvh!important;min-height:100dvh!important;width:100dvw!important}.fullscreen-content{position:relative!important}}.fullscreen-cover-wrapper{height:min(150px,60vw,20vh);width:min(150px,60vw,20vh)}.fullscreen-control-btn{font-size:18px;height:44px;width:44px}.fullscreen-play-btn{height:60px;width:60px}.fullscreen-play-btn svg{height:24px;width:24px}}:root.dark .fullscreen-player{background:var(--bg-gradient-dark)}:root.dark .fullscreen-info h1{color:var(--text-primary)}:root.dark .fullscreen-info h2{color:var(--text-secondary)}:root.dark .fullscreen-control-btn{background:var(--bg-secondary);border-color:var(--border-color);color:var(--text-primary)}:root.dark .fullscreen-control-btn:hover{background:var(--bg-tertiary);border-color:var(--primary-color)}.mini-player-persistent{animation:slideUp .4s cubic-bezier(.4,0,.2,1);backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%);background:linear-gradient(180deg,#fffffff2,#fffffffa);border-top:1px solid #00000014;bottom:0;box-shadow:0 -4px 20px #00000014,0 -1px 0 #0000000d;display:flex;flex-direction:column;gap:6px;left:0;padding:6px 16px 8px;position:fixed;right:0;transition:opacity .3s ease,transform .3s ease;width:100%;z-index:9999}body.karaoke-open .mini-player-persistent{opacity:0;pointer-events:none;transform:translateY(100%)}.mini-player-persistent-header{align-items:center;border-radius:8px;display:flex;gap:10px;margin:-2px;padding:2px;position:relative;transition:background-color .2s ease;width:100%}.mini-player-persistent-header>:not(.mini-actions){position:relative;z-index:1}.mini-player-persistent-header:hover{background-color:#00000005}.mini-player-persistent-header:active{background-color:#0000000a;transform:scale(.98)}:root.dark .mini-player-persistent-header:hover{background-color:#ffffff0d}:root.dark .mini-player-persistent-header:active{background-color:#ffffff14}.mini-player-persistent .mini-cover{background:linear-gradient(135deg,#667eea,#764ba2);border-radius:6px;box-shadow:0 2px 8px #00000026;cursor:pointer;flex-shrink:0;height:44px;overflow:hidden;transition:all .3s cubic-bezier(.4,0,.2,1);width:44px}.mini-player-persistent:hover .mini-cover{box-shadow:0 4px 12px #0003;transform:scale(1.02)}.mini-player-persistent .mini-cover img{height:100%;object-fit:cover;width:100%}.mini-player-persistent .mini-placeholder{align-items:center;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;display:flex;height:100%;justify-content:center;width:100%}.mini-player-persistent .mini-placeholder svg{height:24px;width:24px}.mini-player-persistent .mini-info{display:flex;flex:1 1;flex-direction:column;gap:2px;justify-content:center;min-width:0;overflow:hidden}.mini-player-persistent .mini-title{color:#1a1a1a;font-size:13px;font-weight:600}.mini-player-persistent .mini-artist,.mini-player-persistent .mini-title{line-height:1.2;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mini-player-persistent .mini-artist{color:#666;font-size:11px}.mini-player-persistent .mini-actions{align-items:center;display:flex;flex-shrink:0;gap:8px;pointer-events:auto;position:relative;z-index:10000}.mini-player-persistent .mini-actions button{cursor:pointer;pointer-events:auto;position:relative;user-select:none;-webkit-user-select:none;z-index:10001}.mini-close-btn{align-items:center;background:#0000;border:none;border-radius:6px;color:#666;cursor:pointer;display:flex;justify-content:center;min-width:auto;padding:6px;pointer-events:auto;position:relative;transition:all .2s ease;z-index:10002}.mini-close-btn:hover{background:#dc35451a;color:#dc3545}.mini-close-btn svg{height:16px;width:16px}.mini-fullscreen-btn{align-items:center;background:#0000;border:none;border-radius:6px;color:#666;cursor:pointer;display:flex;justify-content:center;padding:6px;transition:all .2s ease}.mini-fullscreen-btn:hover{background:#0000000d;color:#1a1a1a}.mini-fullscreen-btn svg{height:16px;width:16px}.mini-player-persistent .mini-player{margin-top:2px;width:100%}.mini-player-persistent .mini-player .audio-player{background:#0000;border-radius:0;box-shadow:none;margin:0;padding:0}.mini-player-persistent .mini-player .audio-controls-main{gap:6px}.mini-player-persistent .mini-player .audio-nav-controls{gap:4px}.mini-player-persistent .mini-player .control-btn{font-size:14px;height:32px;width:32px}.mini-player-persistent .mini-player .play-button-main{font-size:18px;height:40px;width:40px}.mini-player-persistent .mini-player .progress-container{margin:4px 0}.mini-player-persistent .mini-player .time-display{font-size:11px;margin-top:2px}.mini-player-persistent .mini-player .audio-player:before{display:none}@media (max-width:768px){.mini-player-persistent{border-radius:0;bottom:0;gap:5px;left:0;padding:6px 12px max(8px,env(safe-area-inset-bottom,8px));right:0;transform:none;width:100%}.mini-player-persistent-header{gap:8px;min-width:0}.mini-player-persistent .mini-cover{flex-shrink:0;height:40px;width:40px}.mini-player-persistent .mini-info{min-width:0;overflow:hidden}.mini-player-persistent .mini-title{font-size:14px;max-width:100%}.mini-player-persistent .mini-artist{font-size:11px;max-width:100%}.mini-player-persistent .mini-actions{flex-shrink:0;gap:4px}.mini-fullscreen-btn{display:none!important}.mini-player-persistent .mini-player{margin-top:4px}.mini-player-persistent .mini-player .control-btn{font-size:12px;height:28px;width:28px}.mini-player-persistent .mini-player .play-button-main{font-size:16px;height:36px;width:36px}}@media (max-width:480px){.mini-player-persistent{border-radius:0;bottom:0;gap:4px;left:0;padding:5px 10px max(7px,env(safe-area-inset-bottom,7px));right:0;transform:none;width:100%}.mini-player-persistent-header{gap:8px;min-width:0}.mini-player-persistent .mini-cover{flex-shrink:0;height:38px;width:38px}.mini-player-persistent .mini-info{min-width:0;overflow:hidden}.mini-player-persistent .mini-title{font-size:13px;max-width:100%}.mini-player-persistent .mini-artist{font-size:10px;max-width:100%}.mini-player-persistent .mini-actions{flex-shrink:0;gap:4px}.mini-fullscreen-btn{display:none}.mini-player-persistent .mini-player{margin-top:3px}.mini-player-persistent .mini-player .control-btn{font-size:11px;height:26px;width:26px}.mini-player-persistent .mini-player .play-button-main{font-size:14px;height:32px;width:32px}}:root.dark .mini-player-persistent{background:linear-gradient(180deg,#0f1226f2,#0a0c18fa);border-top:1px solid #ffffff1a;box-shadow:0 -4px 20px #00000080}:root.dark .mini-player-persistent .mini-title{color:var(--text-primary)}:root.dark .mini-close-btn,:root.dark .mini-fullscreen-btn,:root.dark .mini-player-persistent .mini-artist{color:var(--text-secondary)}:root.dark .mini-fullscreen-btn:hover{background:#ffffff1a;color:var(--text-primary)}:root.dark .mini-close-btn:hover{background:#dc354533;color:#ff6b7a}.install-app-banner{animation:slideUp .3s ease-out;background:linear-gradient(135deg,#667eea,#764ba2);bottom:0;box-shadow:0 -4px 12px #00000026;color:#fff;left:0;padding:15px 20px;position:fixed;right:0;z-index:10000}.install-app-content{align-items:center;display:flex;gap:15px;margin:0 auto;max-width:1200px}.install-app-icon{flex-shrink:0;font-size:32px}.install-app-text{flex:1 1}.install-app-text h3{font-size:18px;font-weight:600;margin:0 0 5px}.install-app-text p{font-size:14px;margin:0;opacity:.9}.install-btn{background:#fff;border:none;border-radius:8px;color:#667eea;cursor:pointer;flex-shrink:0;font-weight:600;padding:10px 20px;transition:all .3s ease;white-space:nowrap}.install-btn:hover{box-shadow:0 4px 12px #ffffff4d;transform:translateY(-2px)}.install-close-btn{align-items:center;background:none;border:none;border-radius:50%;color:#fff;cursor:pointer;display:flex;flex-shrink:0;font-size:24px;height:30px;justify-content:center;padding:0;transition:background .3s ease;width:30px}.install-close-btn:hover{background:#fff3}.ios-instructions-modal{align-items:center;animation:fadeIn .3s ease;background:#000000b3;bottom:0;display:flex;justify-content:center;left:0;padding:20px;position:fixed;right:0;top:0;z-index:10001}.ios-instructions-content{animation:slideDown .3s ease;background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:16px;box-shadow:var(--shadow-xl);max-width:500px;padding:30px;position:relative;width:100%}.ios-instructions-close{align-items:center;background:none;border:none;border-radius:50%;color:var(--text-primary);cursor:pointer;display:flex;font-size:28px;height:35px;justify-content:center;position:absolute;right:15px;top:15px;transition:background .3s ease;width:35px}.ios-instructions-close:hover{background:var(--bg-tertiary)}.ios-instructions-content h2{color:var(--text-primary);font-size:24px;margin:0 0 25px;text-align:center}.ios-instructions-steps{margin-bottom:25px}.ios-step{align-items:flex-start;display:flex;gap:15px;margin-bottom:20px}.ios-step-number{align-items:center;background:linear-gradient(135deg,#667eea,#764ba2);border-radius:50%;color:#fff;display:flex;flex-shrink:0;font-size:18px;font-weight:700;height:35px;justify-content:center;width:35px}.ios-step-content{flex:1 1;padding-top:5px}.ios-step-content p{color:var(--text-primary);font-size:16px;line-height:1.6;margin:0}.ios-step-content strong{color:var(--primary-color)}.ios-icon{font-size:20px;margin-left:5px}.ios-instructions-note{background:var(--bg-tertiary);border-left:4px solid var(--primary-color);border-radius:8px;margin-bottom:20px;padding:15px}.ios-instructions-note p{color:var(--text-secondary);font-size:14px;line-height:1.6;margin:0}.ios-instructions-content .btn{width:100%}:root.dark .ios-instructions-content{background:var(--bg-secondary);border-color:var(--border-color)}:root.dark .ios-instructions-close{color:var(--text-primary)}:root.dark .ios-instructions-close:hover{background:var(--bg-tertiary)}:root.dark .ios-instructions-note{background:var(--bg-tertiary);border-left-color:var(--primary-color)}@media (max-width:768px){.install-app-content{flex-wrap:wrap;gap:10px}.install-app-text{flex-basis:100%}.install-app-text h3{font-size:16px}.install-app-text p{font-size:13px}.install-btn{flex:1 1;min-width:120px}.ios-instructions-content{padding:20px}.ios-instructions-content h2{font-size:20px;margin-bottom:20px}.ios-step{margin-bottom:15px}.ios-step-content p{font-size:14px}}@media (max-width:480px){.install-app-banner{padding:12px 15px}.install-app-icon{font-size:28px}.install-app-text h3{font-size:15px}.install-app-text p{font-size:12px}.install-btn{font-size:14px;padding:8px 16px}.ios-instructions-content{padding:15px}}.splash-screen{align-items:center;background:linear-gradient(135deg,#667eea,#764ba2);display:flex;height:100%;justify-content:center;left:0;overflow:hidden;position:fixed;top:0;transition:opacity .5s ease-out,visibility .5s ease-out;width:100%;z-index:9999}.splash-screen.visible{opacity:1;visibility:visible}.splash-screen.hidden{opacity:0;visibility:hidden}.splash-content{align-items:center;display:flex;flex-direction:column;justify-content:center;max-width:400px;padding:20px;text-align:center;width:100%}.splash-logo-container{animation:logoFloat 2s ease-in-out infinite;margin-bottom:30px}@keyframes logoFloat{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}.splash-logo{animation:logoPulse 1.5s ease-in-out infinite;height:120px;margin:0 auto;width:120px}@keyframes logoPulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.9;transform:scale(1.05)}}.logo-image,.logo-svg{filter:drop-shadow(0 4px 20px rgba(0,0,0,.3));height:100%;width:100%}.logo-image{object-fit:contain}.splash-title{animation:fadeInUp .8s ease-out;color:#fff;font-size:36px;font-weight:700;margin:0 0 10px;text-shadow:0 2px 10px #0000004d}.splash-subtitle{animation:fadeInUp .8s ease-out .2s both;color:#ffffffe6;font-size:16px;font-weight:300;margin:0 0 20px}.splash-song-info{align-items:center;animation:fadeInUp .8s ease-out .4s both;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background-color:#ffffff1a;border-radius:20px;display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin:0 0 30px;max-width:90%;padding:8px 16px}.splash-song-icon{align-items:center;color:#ffffffe6;display:flex;flex-shrink:0}.splash-song-title{color:#fffffff2;font-size:14px;font-weight:500;max-width:200px}.splash-song-artist,.splash-song-title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.splash-song-artist{color:#fffc;font-size:13px;font-weight:300;max-width:150px}.splash-song-info.playing{animation:pulseGlow 2s ease-in-out infinite}.splash-song-info.playing .playing-icon{animation:pulse 1s ease-in-out infinite}@keyframes pulseGlow{0%,to{box-shadow:0 0 0 #ffffff4d}50%{box-shadow:0 0 15px #ffffff80}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.splash-progress-container{animation:fadeInUp .8s ease-out .6s both;margin-bottom:30px;max-width:250px;width:100%}.splash-progress-bar{background-color:#ffffff4d;border-radius:2px;height:4px;overflow:hidden;position:relative;width:100%}.splash-progress-fill{background:linear-gradient(90deg,#fff,#fffc);border-radius:2px;box-shadow:0 0 10px #ffffff80;height:100%;transition:width .3s ease-out}.splash-loader{animation:fadeInUp .8s ease-out .8s both;display:flex;gap:8px}.splash-credits{align-items:center;animation:fadeInUp .8s ease-out 1s both;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background-color:#ffffff1a;border-radius:12px;display:flex;flex-direction:column;justify-content:center;margin-top:40px;max-width:90%;padding:15px 20px;text-align:center;width:100%}.splash-credits-text{color:#fffffff2;font-size:13px;font-weight:400;margin:0 0 6px;text-align:center;width:100%}.splash-credits-text strong{color:#fff;font-weight:600}.splash-credits-company{color:#ffffffe6;font-style:italic;margin:0 0 4px}.splash-credits-company,.splash-credits-phone{font-size:12px;font-weight:400;text-align:center;width:100%}.splash-credits-phone{color:#ffffffd9;margin:0}.loader-dot{animation:loaderBounce 1.4s ease-in-out infinite;background-color:#fffc;border-radius:50%;height:10px;width:10px}.loader-dot:first-child{animation-delay:0s}.loader-dot:nth-child(2){animation-delay:.2s}.loader-dot:nth-child(3){animation-delay:.4s}@keyframes loaderBounce{0%,80%,to{opacity:.5;transform:scale(.8)}40%{opacity:1;transform:scale(1.2)}}@media (prefers-color-scheme:dark){.splash-screen{background:linear-gradient(135deg,#1a1d3a,#2d1b4e)}}@media (max-width:480px){.splash-logo{height:100px;width:100px}.splash-title{font-size:28px}.splash-subtitle{font-size:14px}.splash-song-info{font-size:12px;padding:6px 12px}.splash-song-title{font-size:12px;max-width:150px}.splash-song-artist{font-size:11px;max-width:120px}.splash-credits{margin-top:30px;padding:12px 16px}.splash-credits-text{font-size:12px;margin-bottom:5px}.splash-credits-company{font-size:11px;margin-bottom:3px}.splash-credits-phone{font-size:11px}}@supports (padding:max(0px)){.splash-screen{padding:max(20px,env(safe-area-inset-top)) max(20px,env(safe-area-inset-right)) max(20px,env(safe-area-inset-bottom)) max(20px,env(safe-area-inset-left))}}.home{min-height:100vh;overflow-x:hidden;position:relative;width:100%}.hero-section{backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);background:linear-gradient(135deg,#667eea26,#764ba226);color:#fff;overflow:hidden;padding:100px 20px;position:relative;text-align:center}.hero-section:before{animation:rotate 20s linear infinite;background:radial-gradient(circle,#667eea1a 0,#0000 70%);content:"";height:200%;left:-50%;position:absolute;top:-50%;width:200%}@keyframes rotate{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.hero-search-mobile{display:none}.hero-section h1{-webkit-text-fill-color:#0000;animation:fadeIn .8s ease;background:linear-gradient(135deg,#fff,#ffffffe6);-webkit-background-clip:text;background-clip:text;font-size:56px;font-weight:800;letter-spacing:-.5px;margin-bottom:24px;position:relative;text-shadow:0 4px 20px #0000004d;z-index:1}.hero-section p{animation:fadeIn 1s ease;font-size:22px;font-weight:400;opacity:.95;position:relative;text-shadow:0 2px 10px #0003;z-index:1}.section-title{color:#fff;display:inline-block;font-size:32px;font-weight:800;letter-spacing:-.5px;margin:35px 0 25px;position:relative;text-align:center;text-shadow:0 4px 20px #0000004d;width:100%}.section-title:after{background:linear-gradient(90deg,#0000,#fff 50%,#0000);border-radius:2px;bottom:-12px;content:"";height:4px;left:50%;position:absolute;transform:translateX(-50%);width:80px}.advertisements-section{display:flex;flex-direction:column;gap:20px;margin:40px 0}.advertisement-card{backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);background:#fffffffa;border:1px solid #0000000d;border-radius:20px;box-shadow:0 6px 20px #0000001a;color:#333;display:block;overflow:hidden;padding:24px;position:relative;text-decoration:none;transition:all .4s cubic-bezier(.4,0,.2,1)}.advertisement-card:before{background:linear-gradient(90deg,#667eea,#764ba2);content:"";height:4px;left:0;position:absolute;right:0;top:0;transform:scaleX(0);transform-origin:left;transition:transform .4s ease}.advertisement-card:hover:before{transform:scaleX(1)}.advertisement-card:hover{border-color:#667eea33;box-shadow:0 12px 32px #667eea40;transform:translateY(-8px) scale(1.02)}.advertisement-card img{border-radius:12px;box-shadow:0 4px 12px #0000001a;margin-bottom:16px;max-height:300px;object-fit:cover;transition:transform .5s cubic-bezier(.4,0,.2,1);width:100%}.advertisement-card:hover img{transform:scale(1.05)}.advertisement-card h3{color:#333;font-size:20px;margin-bottom:10px}.advertisement-card p{color:#666;font-size:14px;line-height:1.6}.top-artists-container,.top-artists-slider-container{backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);background:#fffffffa;border:1px solid #ffffff4d;border-radius:24px;box-shadow:0 8px 32px #0000001f;margin-bottom:50px;overflow:hidden;padding:32px;position:relative}.top-artists-container.mobile-grid{padding:20px}.top-artists-grid{grid-gap:16px;display:grid;gap:16px;grid-template-columns:repeat(2,1fr);margin-bottom:20px}.top-artist-card.mobile-card{align-items:center;flex-direction:column;gap:12px;padding:16px;text-align:center}.top-artist-card.mobile-card .top-artist-rank{left:8px;min-width:40px;position:absolute;top:8px}.top-artist-card.mobile-card .top-artist-rank .rank-number{font-size:18px;height:40px;width:40px}.top-artist-card.mobile-card .top-artist-avatar{height:80px;margin:0 auto;width:80px}.top-artist-card.mobile-card .top-artist-info{width:100%}.top-artist-card.mobile-card .top-artist-name-row{flex-wrap:wrap;gap:6px;justify-content:center}.top-artist-card.mobile-card .top-artist-stats{gap:12px;justify-content:center}.top-artists-slider-container:before{background:linear-gradient(90deg,#667eea,#764ba2);content:"";height:4px;left:0;position:absolute;right:0;top:0}.top-artists-slider-wrapper{overflow:hidden;position:relative;width:100%}.slider-slide,.top-artists-slider{display:flex;width:100%}.slider-slide{flex-shrink:0;gap:15px}.top-artists-section{background:#fffffff2;border-radius:16px;box-shadow:0 4px 20px #0000001a;display:flex;flex-direction:column;gap:15px;margin-bottom:50px;padding:25px}.top-artist-card{align-items:center;background:#fff;border:1px solid #0000000d;border-radius:20px;box-shadow:0 4px 16px #00000014;box-sizing:border-box;display:flex;flex-basis:calc(33.333% - 10px);flex-grow:0;flex-shrink:0;gap:20px;min-width:0;overflow:hidden;padding:24px;position:relative;transition:all .4s cubic-bezier(.4,0,.2,1)}.top-artist-card:before{background:linear-gradient(90deg,#667eea,#764ba2);content:"";height:3px;left:0;position:absolute;right:0;top:0;transform:scaleX(0);transform-origin:left;transition:transform .4s ease}.top-artist-card:hover:before{transform:scaleX(1)}.top-artist-card:hover{background:linear-gradient(135deg,#667eea08,#764ba208);border-color:#667eea33;box-shadow:0 12px 32px #667eea40;transform:translateY(-6px) scale(1.02)}.top-artist-rank{min-width:50px}.rank-number,.top-artist-rank{align-items:center;display:flex;justify-content:center}.rank-number{background:linear-gradient(135deg,#667eea,#764ba2);border:3px solid #fff;border-radius:50%;box-shadow:0 4px 16px #667eea66;color:#fff;font-size:24px;font-weight:800;height:50px;transition:all .4s cubic-bezier(.4,0,.2,1);width:50px}.top-artist-card:hover .rank-number{box-shadow:0 6px 20px #667eea80;transform:scale(1.15) rotate(5deg)}.top-artist-card:first-child .rank-number{background:linear-gradient(135deg,gold,orange);color:#fff}.top-artist-card:nth-child(2) .rank-number{background:linear-gradient(135deg,silver,#a8a8a8);color:#fff}.top-artist-card:nth-child(3) .rank-number{background:linear-gradient(135deg,#cd7f32,#b87333);color:#fff}.top-artist-avatar{border:4px solid #667eea;border-radius:50%;box-shadow:0 6px 20px #667eea66;flex-shrink:0;height:90px;overflow:hidden;position:relative;transition:all .4s cubic-bezier(.4,0,.2,1);width:90px}.top-artist-avatar:after{background:linear-gradient(135deg,#667eea,#764ba2);border-radius:50%;bottom:-4px;content:"";left:-4px;opacity:0;position:absolute;right:-4px;top:-4px;transition:opacity .4s ease;z-index:-1}.top-artist-card:hover .top-artist-avatar{box-shadow:0 8px 24px #667eea80;transform:scale(1.1) rotate(5deg)}.top-artist-card:hover .top-artist-avatar:after{opacity:.2}.top-artist-avatar img{height:100%;object-fit:cover;width:100%}.placeholder-avatar-small{align-items:center;background:linear-gradient(135deg,#667eea,#764ba2);display:flex;font-size:40px;height:100%;justify-content:center;width:100%}.top-artist-info{flex:1 1}.top-artist-name-row{align-items:center;display:flex;flex-wrap:wrap;gap:6px;justify-content:center;margin-bottom:10px}.top-artist-info h3{-webkit-line-clamp:2;-webkit-box-orient:vertical;color:#2c3e50;display:-webkit-box;font-size:20px;font-weight:600;line-height:1.3;margin:0;overflow:hidden;text-overflow:ellipsis}.verified-badge-card-small{animation:verifiedGlow 2s ease-in-out infinite;background:linear-gradient(135deg,#10b981,#059669);box-shadow:0 2px 6px #10b98166}.premium-badge-card-small,.verified-badge-card-small{align-items:center;border:1px solid #ffffff4d;border-radius:50%;color:#fff;display:inline-flex;flex-shrink:0;font-size:10px;height:18px;justify-content:center;width:18px}.premium-badge-card-small{animation:premiumGlow 2s ease-in-out infinite;background:linear-gradient(135deg,#fbbf24,#f59e0b);box-shadow:0 2px 6px #fbbf2466}.premium-badge-card-small.premium-basic{animation:premiumBasicGlow 2s ease-in-out infinite;background:linear-gradient(135deg,#3b82f6,#2563eb);box-shadow:0 2px 6px #3b82f666}.premium-badge-card-small:hover{box-shadow:0 3px 10px #fbbf2480;transform:scale(1.1)}.top-artist-stats{display:flex;flex-wrap:wrap;gap:20px}.top-artist-stats .stat-item{color:#555;font-size:14px;font-weight:500}.slider-indicators{display:flex;gap:8px;justify-content:center;margin-top:20px;padding-top:15px}.slider-indicator{background:#ddd;border:none;border-radius:50%;cursor:pointer;height:12px;padding:0;transition:all .3s ease;width:12px}.slider-indicator:hover{background:#bbb;transform:scale(1.2)}.slider-indicator.active{background:#667eea;border-radius:6px;width:30px}.top-artists-header{align-items:center;display:flex;justify-content:center;margin-bottom:20px;margin-top:40px;text-align:center}.songs-grid{grid-gap:10px;gap:10px;grid-template-columns:repeat(7,1fr);margin-bottom:30px;overflow-x:auto}@media (min-width:769px){.songs-grid{grid-gap:10px!important;display:grid!important;gap:10px!important;grid-template-columns:repeat(7,1fr)!important}.song-card{max-width:100%;min-width:0}.song-cover{height:120px!important}.song-info{padding:8px!important}.song-info h3{font-size:12px!important;line-height:1.2!important;margin-bottom:3px!important}.song-artist{font-size:10px!important;margin-bottom:4px!important}.song-stats{display:flex!important;font-size:9px!important;gap:4px!important;margin-top:4px!important}.song-stats span{font-size:9px!important;padding:2px 6px!important}.song-actions-desktop{margin-top:6px!important}.song-actions-desktop .btn{font-size:10px!important;padding:6px 10px!important;width:100%!important}.placeholder-cover{font-size:48px!important}}.song-card{border:1px solid #0000000d;box-shadow:0 3px 10px #00000014;display:flex;flex-direction:column;position:relative;transition:all .4s cubic-bezier(.4,0,.2,1)}.song-card:before{background:linear-gradient(90deg,#667eea,#764ba2);content:"";height:4px;left:0;position:absolute;right:0;top:0;transform:scaleX(0);transform-origin:left;transition:transform .4s cubic-bezier(.4,0,.2,1);z-index:1}.song-card:hover:before{transform:scaleX(1)}.song-cover-mobile,.song-play-btn-mobile,.song-rank-badge,.song-stats-mobile{display:none}.song-card:hover{background:linear-gradient(135deg,#667eea08,#764ba208);border-color:#667eea33;box-shadow:0 10px 28px #667eea40;transform:translateY(-6px) scale(1.02)}.song-cover{height:120px;position:relative}.song-cover:after{background:linear-gradient(180deg,#0000 0,#0000001a);bottom:0;content:"";left:0;opacity:0;position:absolute;right:0;top:0;transition:opacity .3s ease}.song-card:hover .song-cover:after{opacity:1}.song-cover img{transition:transform .5s cubic-bezier(.4,0,.2,1)}.song-card:hover .song-cover img{transform:scale(1.1)}.song-info{padding:8px}.song-info h3{-webkit-line-clamp:2;-webkit-box-orient:vertical;display:-webkit-box;font-size:12px;font-weight:600;line-height:1.2;margin-bottom:3px;overflow:hidden;text-overflow:ellipsis}.song-artist{color:#666;font-size:10px;margin-bottom:4px}.song-stats{flex-wrap:wrap;font-size:9px;gap:4px;margin-top:4px}.song-stats span{background:#667eea14;border-radius:4px;color:#667eea;font-weight:600;line-height:1.2;padding:2px 6px;transition:all .2s ease;white-space:nowrap}.song-stats span:hover{background:#667eea26;transform:translateY(-1px)}.song-actions-desktop{margin-top:6px}.song-actions-desktop .btn{border-radius:6px;font-size:10px;padding:6px 10px;width:100%}.empty-state{background:#ffffffe6}.loading{color:#fff;font-size:20px;padding:60px}.playlists-grid{grid-gap:12px;gap:12px;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));margin-bottom:30px}.playlist-card{border:1px solid #0000000d;border-radius:16px;box-shadow:0 4px 12px #00000014;color:inherit;display:flex;flex-direction:column;text-decoration:none;transition:all .4s cubic-bezier(.4,0,.2,1)}.playlist-card:before{background:linear-gradient(90deg,#667eea,#764ba2);content:"";height:4px;left:0;position:absolute;right:0;top:0;transform:scaleX(0);transform-origin:left;transition:transform .4s cubic-bezier(.4,0,.2,1);z-index:1}.playlist-card:hover:before{transform:scaleX(1)}.playlist-card:hover{border-color:#667eea33;box-shadow:0 12px 32px #667eea40;transform:translateY(-8px) scale(1.02)}.playlist-cover{height:200px;position:relative}.playlist-cover:after{background:linear-gradient(180deg,#0000 0,#0000001a);bottom:0;content:"";left:0;opacity:0;position:absolute;right:0;top:0;transition:opacity .3s ease}.playlist-card:hover .playlist-cover:after{opacity:1}.playlist-cover img{transition:transform .5s cubic-bezier(.4,0,.2,1)}.playlist-card:hover .playlist-cover img{transform:scale(1.1)}.playlist-info{padding:12px}.playlist-info h3{font-size:16px;line-height:1.3;margin-bottom:6px}.playlist-description,.playlist-info h3{-webkit-line-clamp:2;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden;text-overflow:ellipsis}.playlist-description{line-height:1.4}.playlist-description,.playlist-stats{font-size:12px;margin-bottom:8px}.public-badge{font-size:10px;font-weight:600;padding:3px 6px}.artists-slider-container{background:#fffffff2;border-radius:16px;box-shadow:0 4px 20px #0000001a;margin-bottom:50px;overflow:hidden;padding:25px;position:relative}.artists-slider-wrapper{overflow:hidden;position:relative;width:100%}.artists-slide,.artists-slider{display:flex;width:100%}.artists-slide{flex-shrink:0;gap:15px}.artists-container{margin-bottom:30px;position:relative}.artist-card{box-sizing:border-box;flex-basis:calc(33.333% - 10px);flex-grow:0;flex-shrink:0;min-width:0}.artist-card:before{background:linear-gradient(135deg,#667eea0d,#764ba20d);border-radius:20px;bottom:0;content:"";left:0;opacity:0;position:absolute;right:0;top:0;transition:opacity .4s ease}.artist-card:hover:before{opacity:1}.artist-avatar{position:relative;z-index:1}.artist-avatar:after{background:linear-gradient(135deg,#667eea,#764ba2);border-radius:50%;bottom:-4px;content:"";left:-4px;opacity:0;position:absolute;right:-4px;top:-4px;transition:opacity .4s ease;z-index:-1}.artist-card:hover .artist-avatar:after{opacity:.2}.artist-name-row{margin-bottom:8px}.artist-stats{align-items:center;display:flex;flex-wrap:wrap;gap:8px;margin-bottom:10px}.artist-followers{background:#10b9811f;border-radius:18px;display:inline-block;font-size:12px;font-weight:600;padding:3px 10px}.artist-description{margin-top:8px}.auto-playlists-section{margin:60px 0}.auto-playlists-tabs{border-bottom:2px solid #e0e0e0;display:flex;gap:10px;margin-bottom:30px;padding-bottom:10px}.auto-playlist-tab{background:#0000;border:none;border-bottom:3px solid #0000;bottom:-2px;color:#666;cursor:pointer;font-size:16px;font-weight:600;padding:12px 24px;position:relative;transition:all .3s}.auto-playlist-tab:hover{background:#f5f7ff;border-radius:8px 8px 0 0;color:#667eea}.auto-playlist-tab.active{background:#f5f7ff;border-bottom-color:#667eea;border-radius:8px 8px 0 0;color:#667eea}.auto-playlist-content{animation:fadeIn .3s ease-in}.auto-playlist-header{align-items:center;display:flex;flex-wrap:wrap;gap:15px;justify-content:space-between;margin-bottom:20px}.play-all-top50-btn{align-items:center;background:linear-gradient(135deg,#667eea,#764ba2);border:none;border-radius:12px;box-shadow:0 4px 12px #667eea4d;color:#fff;cursor:pointer;display:flex;font-size:14px;font-weight:600;gap:8px;padding:10px 20px;transition:all .3s ease;white-space:nowrap}.play-all-top50-btn:hover{box-shadow:0 6px 16px #667eea66;transform:translateY(-2px)}.play-all-top50-btn:active{box-shadow:0 3px 8px #667eea4d;transform:translateY(0)}.pagination-btn{min-width:120px}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@media (max-width:768px){.container{max-width:100%;overflow-x:hidden;padding:0 15px}.auto-playlists-section{margin:40px 0;padding:0 10px}.auto-playlist-header{align-items:flex-start;flex-direction:column;gap:12px}.play-all-top50-btn{font-size:13px;justify-content:center;padding:12px 20px;width:100%}.pagination-controls{flex-direction:column;gap:15px;margin-top:20px;padding:15px 0}.pagination-btn{font-size:13px;min-width:auto;padding:12px 16px;width:100%}.pagination-info{font-size:14px;padding:10px;width:100%}.auto-playlists-tabs{-webkit-overflow-scrolling:touch;flex-wrap:wrap;gap:8px;overflow-x:auto}.auto-playlist-tab{flex:1 1;font-size:14px;min-width:calc(33.333% - 6px);padding:10px 16px}.advertisements-section{gap:15px;margin:30px 0}.advertisement-card{padding:15px}.advertisement-card img{max-height:200px}.advertisement-card h3{font-size:18px}.advertisement-card p{font-size:13px}.hero-section{padding:50px 15px}.top-artists-section{padding:15px}.top-artist-card{gap:15px}.top-artist-avatar{height:60px;width:60px}.top-artist-info h3{font-size:18px}.top-artist-stats{flex-direction:column;gap:10px}.top-artist-stats .stat-item{font-size:13px}.hero-section h1{font-size:32px}.hero-section p{font-size:18px}.hero-search-mobile{display:flex;justify-content:center;margin-top:30px;pointer-events:auto;position:relative;width:100%;z-index:10}.hero-search-mobile .search-bar,.hero-search-mobile .search-bar-wrapper{max-width:100%;pointer-events:auto;width:100%;z-index:10}.hero-search-mobile .search-bar{margin:0}.hero-search-mobile .search-input{-webkit-tap-highlight-color:rgba(102,126,234,.2);background:#fffffff2;border:2px solid #ffffff4d;color:#333;font-size:16px;pointer-events:auto;z-index:11}.hero-search-mobile .search-button{-webkit-tap-highlight-color:rgba(102,126,234,.3);pointer-events:auto;z-index:11}.hero-search-mobile .search-input::placeholder{color:#999}.hero-search-mobile .search-input:focus{background:#fff;border-color:#667eea}.hero-search-mobile .search-button{background:linear-gradient(135deg,#667eea,#764ba2);box-shadow:0 2px 8px #667eea4d}.section-title{word-wrap:break-word;font-size:20px;margin:25px 0 15px;overflow-wrap:break-word;padding:0 10px}div[style*="display: flex"][style*="justify-content: space-between"]{align-items:flex-start!important;flex-direction:column;gap:15px}div[style*="display: flex"][style*="justify-content: space-between"] select{max-width:100%;width:100%}.top-artists-header{margin-bottom:15px;margin-top:30px}.top-artists-container,.top-artists-slider-container{box-sizing:border-box;margin-bottom:30px;overflow:hidden;padding:15px;width:100%}.top-artists-container.mobile-grid{padding:16px}.top-artists-grid{gap:12px;grid-template-columns:repeat(2,1fr);margin-bottom:16px}.top-artist-card.mobile-card{gap:10px;padding:12px}.top-artist-card.mobile-card .top-artist-rank{left:6px;top:6px}.top-artist-card.mobile-card .top-artist-rank .rank-number{font-size:16px;height:36px;width:36px}.top-artist-card.mobile-card .top-artist-avatar{height:70px;width:70px}.top-artists-slider-wrapper{overflow:hidden;width:100%}.top-artists-slider{width:100%}.slider-slide{gap:12px}.top-artist-card{flex-basis:calc(50% - 6px);flex-direction:column;flex-grow:0;flex-shrink:0;gap:12px;padding:15px;text-align:center}.top-artist-rank{margin-bottom:8px;min-width:auto}.rank-number{font-size:20px;height:40px;width:40px}.top-artist-avatar{height:70px;margin:0 auto;width:70px}.top-artist-info{width:100%}.top-artist-name-row{gap:5px;margin-bottom:8px}.top-artist-info h3{font-size:16px;margin:0;text-align:center}.premium-badge-card-small{font-size:9px;height:16px;width:16px}.songs-grid{grid-template-columns:repeat(7,1fr)!important}.playlists-grid,.songs-grid{box-sizing:border-box;gap:10px;width:100%}.playlists-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr))}.song-cover{height:120px!important}.playlist-cover{height:140px}.playlist-info,.song-info{padding:8px}.playlist-info h3,.song-info h3{font-size:13px;margin-bottom:4px}.song-artist{font-size:10px;margin-bottom:4px}.song-stats{font-size:10px;gap:6px}.artists-container,.artists-slider-container{box-sizing:border-box;margin-bottom:30px;overflow:hidden;padding:15px;width:100%}.artists-container.mobile-grid{padding:16px}.artists-grid{gap:12px;grid-template-columns:repeat(2,1fr);margin-bottom:16px}.artist-card.mobile-card{gap:10px;padding:12px}.artists-slider-wrapper{overflow:hidden;width:100%}.artists-slider{width:100%}.artists-slide{gap:12px}.artist-card{flex-basis:calc(50% - 6px);flex-grow:0;flex-shrink:0;padding:15px 12px}.artist-avatar{height:80px;width:80px}.artist-name-row{gap:6px;margin-bottom:6px}.artist-info h3{font-size:16px}.premium-badge-card{font-size:.65rem;padding:3px 8px}.artists-slider-indicators{align-items:center;display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-top:15px;padding-top:10px}.artists-slider-indicators .slider-indicator{transition:all .3s ease}.artists-slider-indicators .slider-indicator:hover{background:#667eea;transform:scale(1.3)}.artists-slider-indicators .slider-indicator.active{background:#667eea}}@media (max-width:480px){.play-all-top50-btn{font-size:12px;padding:10px 16px}.pagination-controls{gap:12px;margin-top:15px;padding:12px 0}.pagination-btn{font-size:12px;min-width:auto;padding:10px 14px}.pagination-info{font-size:13px;padding:8px}.container{max-width:100%;overflow-x:hidden;padding:0 12px}.hero-section{box-sizing:border-box;padding:40px 12px}.hero-section h1{font-size:24px}.hero-section p{font-size:16px}.hero-search-mobile{margin-top:25px}.hero-actions{box-sizing:border-box;flex-direction:column;gap:10px;margin-top:20px!important;padding:0 10px;width:100%}.hero-actions .btn{box-sizing:border-box;max-width:100%;width:100%}.hero-search-mobile .search-input{font-size:14px;padding:12px 16px}.hero-search-mobile .search-button{font-size:16px;height:36px;width:36px}.section-title{word-wrap:break-word;font-size:18px;margin:20px 0 12px;overflow-wrap:break-word;padding:0 8px}.auto-playlists-section{margin:40px 0;padding:0 8px}.auto-playlists-tabs{-webkit-overflow-scrolling:touch;overflow-x:auto;scrollbar-width:thin}.auto-playlist-tab{flex-shrink:0;min-width:100px}.top-artists-header{margin-bottom:12px;margin-top:25px}.top-artists-slider-container{border-radius:12px;box-sizing:border-box;margin-bottom:25px;overflow:hidden;padding:12px;width:100%}.slider-slide{gap:10px}.top-artist-card{border-radius:10px;flex:0 0 100%;flex-direction:column;gap:10px;padding:15px 12px;text-align:center}.top-artist-rank{margin-bottom:6px;min-width:auto}.top-artist-avatar{border-width:2px;height:65px;margin:0 auto;width:65px}.placeholder-avatar-small{font-size:32px}.top-artist-info{min-width:0;width:100%}.top-artist-name-row{gap:4px;margin-bottom:6px}.top-artist-info h3{-webkit-line-clamp:2;-webkit-box-orient:vertical;display:-webkit-box;font-size:15px;line-height:1.3;margin:0;overflow:hidden;text-align:center;text-overflow:ellipsis}.slider-indicators{gap:6px;margin-top:15px;padding-top:10px}.slider-indicator{height:10px;width:10px}.slider-indicator.active{width:24px}.top-artists-section{padding:10px}.top-artist-stats .stat-item{font-size:11px}.songs-grid{grid-gap:8px!important;box-sizing:border-box;display:grid!important;gap:8px!important;grid-template-columns:repeat(2,1fr)!important;padding:0 4px;width:100%!important}.playlists-grid{gap:12px;grid-template-columns:1fr}.song-card{align-items:stretch!important;background:#fff;border:1px solid #0000000d;border-radius:8px;box-shadow:0 2px 8px #0000000f;box-sizing:border-box;max-width:100%;overflow:hidden;position:relative;transition:all .3s ease;width:100%!important}.song-rank-badge{background:linear-gradient(135deg,#667eea,#764ba2);border:1.5px solid #fff;border-radius:50%;box-shadow:0 2px 6px #667eea66;display:flex!important;flex-shrink:0;height:24px;left:6px;min-width:24px;position:absolute;top:6px;width:24px;z-index:2}.rank-number,.song-rank-badge{align-items:center;color:#fff;font-weight:700;justify-content:center}.rank-number{background:#667eea;border-radius:50%;display:flex;font-size:18px;height:40px;width:40px}.song-cover{background:linear-gradient(135deg,#667eea,#764ba2);display:block!important;overflow:hidden;position:relative;width:100%!important}.song-cover-mobile{display:none}.song-cover-mobile img{height:100%;object-fit:cover;transition:transform .3s ease;width:100%}.song-card:active .song-cover-mobile img{transform:scale(1.05)}.song-info{display:flex!important;flex:1 1!important;flex-direction:column!important;gap:4px;min-width:0}.song-info h3{-webkit-box-orient:vertical;color:#333;display:-webkit-box;font-weight:600;line-height:1.2}.song-artist,.song-info h3{margin:0;overflow:hidden;text-overflow:ellipsis}.song-artist{color:#666;display:block;white-space:nowrap}.song-stats{display:none!important}.song-stats-mobile{gap:6px}.song-actions-desktop{display:block;margin-top:6px}.song-actions-desktop .btn{font-size:11px;padding:6px;width:100%}.song-play-btn-mobile{display:none}.song-play-btn-mobile:before{background:#ffffff4d;border-radius:50%;content:"";height:0;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);transition:width .3s ease,height .3s ease;width:0}.song-play-btn-mobile:active:before{height:100%;width:100%}.song-play-btn-mobile:active{box-shadow:0 2px 8px #667eea66;transform:scale(.92)}.song-card:active{box-shadow:0 1px 8px #667eea26;transform:scale(.98)}.artists-slider-container{border-radius:12px;box-sizing:border-box;margin-bottom:25px;overflow:hidden;padding:12px;width:100%}.artists-slide{gap:10px}.artist-card{flex:0 0 100%}.artist-name-row{gap:5px;margin-bottom:5px}.premium-badge-card{font-size:.6rem;padding:3px 6px}.premium-badge-card-small{font-size:8px;height:14px;width:14px}.song-cover{height:100px!important}.playlist-cover{height:120px}.song-info{padding:10px!important}.playlist-info{padding:10px}.song-card{display:flex!important;flex-direction:column!important;gap:0!important;padding:0!important}.song-info h3{font-size:12px!important}.song-artist{font-size:10px!important}.song-rank-badge{font-size:11px;height:26px;left:5px;min-width:26px;top:5px;width:26px}.rank-number{font-size:16px;height:36px;width:36px}.song-cover-mobile{height:50px;min-width:50px;width:50px}.song-info h3{-webkit-line-clamp:2;font-size:13px}.song-artist{font-size:10px}.song-stats-mobile{display:flex!important;flex-wrap:wrap;font-size:9px;gap:4px;margin-top:6px}.song-stats-mobile span{background:#667eea1a;border-radius:6px;color:#667eea;font-size:9px;font-weight:600;padding:3px 6px;white-space:nowrap}.song-play-btn-mobile{font-size:13px;height:40px;min-width:40px;width:40px}.playlist-info h3{font-size:14px}.artist-card{padding:12px 10px}.artist-avatar{height:70px;width:70px}.artist-info h3{font-size:15px}}.hero-banners-section{margin-bottom:0;overflow:hidden;position:relative;width:100%}.hero-banners-container{height:500px;overflow:hidden;position:relative;width:100%}.hero-banner{align-items:center;background-position:50%;background-repeat:no-repeat;background-size:cover;display:flex;height:100%;justify-content:center;left:0;opacity:0;position:absolute;top:0;transition:opacity .8s ease-in-out;width:100%}.hero-banner.active{opacity:1;z-index:1}.hero-banner-content{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#0006;border-radius:20px;box-shadow:0 8px 32px #0000004d;color:#fff;max-width:800px;padding:40px;position:relative;text-align:center;z-index:2}.hero-banner-content h1{font-size:48px;font-weight:800;margin-bottom:16px;text-shadow:0 4px 20px #00000080}.hero-banner-content h2{font-size:32px;font-weight:600;margin-bottom:12px;text-shadow:0 2px 10px #00000080}.hero-banner-content p{font-size:20px;line-height:1.6;margin-bottom:24px;text-shadow:0 2px 8px #00000080}.hero-banner-btn{border-radius:30px;box-shadow:0 4px 15px #0000004d;display:inline-block;font-size:18px;font-weight:600;padding:14px 32px;text-decoration:none;transition:all .3s ease}.hero-banner-btn:hover{box-shadow:0 6px 20px #0006;transform:translateY(-2px)}.hero-banners-indicators{bottom:20px;display:flex;gap:10px;left:50%;position:absolute;transform:translateX(-50%);z-index:10}.hero-banner-indicator{background:#0000;border:2px solid #fff;border-radius:50%;cursor:pointer;height:12px;padding:0;transition:all .3s ease;width:12px}.hero-banner-indicator.active{background:#fff;transform:scale(1.2)}.hero-banner-indicator:hover{background:#ffffffb3}.auto-radio-section{background:#000;border-radius:16px;box-shadow:0 8px 32px #0000004d;margin-bottom:40px;padding:30px}@media (max-width:768px){.auto-radio-section{display:none!important}}.section-header{gap:15px;justify-content:space-between;margin-bottom:20px}.section-header,.section-header-controls{align-items:center;display:flex;flex-wrap:wrap}.section-header-controls{gap:12px}.featured-section-header{margin:60px 0 30px;text-align:center}.featured-songs-grid{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));margin-bottom:40px}.featured-song-card{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffff0d;border:1px solid #ffffff1a;transition:all .3s ease}.featured-song-card:hover{background:linear-gradient(135deg,#667eea0d,#764ba20d);border-color:#667eea80;box-shadow:0 8px 25px #667eea4d;transform:translateY(-5px)}.featured-artists-grid{grid-gap:25px;display:grid;gap:25px;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));margin-bottom:40px}.featured-artist-card{-webkit-backdrop-filter:none!important;backdrop-filter:none!important;border:1px solid #ffffff1a;color:#fff!important;transition:all .3s ease}.featured-artist-card,.featured-artist-card.artist-card{background:#0000!important}.featured-artist-card:hover{background:#0000!important;border-color:#667eea80;box-shadow:0 8px 25px #667eea4d;transform:translateY(-5px)}.featured-playlist-card{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffff0d;border:1px solid #ffffff1a;transition:all .3s ease}.featured-playlist-card:hover{border-color:#667eea80;box-shadow:0 8px 25px #667eea4d;transform:translateY(-5px)}@media (max-width:768px){.hero-banners-container{height:400px}.hero-banner-content{max-width:90%;padding:30px 20px}.hero-banner-content h1{font-size:32px}.hero-banner-content h2{font-size:24px}.hero-banner-content p{font-size:16px}.hero-banner-btn{font-size:16px;padding:12px 24px}.featured-songs-grid{gap:15px;grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}.featured-artists-grid{gap:20px;grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}}@media (max-width:480px){.hero-banners-container{height:300px}.hero-banner-content{padding:20px 15px}.hero-banner-content h1{font-size:24px}.hero-banner-content h2{font-size:18px}.hero-banner-content p{font-size:14px}.hero-banner-btn{font-size:14px;padding:10px 20px}.featured-artists-grid,.featured-songs-grid{grid-template-columns:1fr}}:root.dark .home{background:var(--bg-gradient-dark)}:root.dark .song-card{background:var(--bg-secondary);border-color:var(--border-color);color:var(--text-primary)}:root.dark .song-card:hover{background:var(--bg-tertiary);box-shadow:var(--shadow-xl)}:root.dark .song-info h3{color:var(--text-primary)}:root.dark .song-artist{color:var(--text-secondary)}:root.dark .song-stats span{background:#7c8ef51a;color:var(--text-secondary)}:root.dark .playlist-card{border-color:var(--border-color)}:root.dark .playlist-card:hover{background:var(--bg-tertiary)}:root.dark .container{color:var(--text-primary)}:root.dark .section-title{color:var(--text-primary);text-shadow:0 4px 20px #00000080}:root.dark .section-title:after{background:linear-gradient(90deg,#0000 0,var(--primary-color) 50%,#0000 100%)}:root.dark .hero-section h1{-webkit-text-fill-color:#0000;background:linear-gradient(135deg,#fff,#fffc);-webkit-background-clip:text;background-clip:text}:root.dark .top-artist-card{background:var(--bg-secondary);border-color:var(--border-color)}:root.dark .top-artist-card:hover{background:var(--bg-tertiary)}:root.dark .top-artist-info h3{color:var(--text-primary)}:root.dark .featured-artist-card,:root.dark .featured-playlist-card,:root.dark .featured-song-card{background:var(--bg-secondary);border-color:var(--border-color)}:root.dark .featured-artist-card:hover,:root.dark .featured-playlist-card:hover,:root.dark .featured-song-card:hover{background:var(--bg-tertiary);box-shadow:var(--shadow-xl)}:root.dark .advertisement-card{background:var(--bg-secondary);border-color:var(--border-color);color:var(--text-primary)}:root.dark .advertisement-card h3{color:var(--text-primary)}:root.dark .advertisement-card p{color:var(--text-secondary)}:root.dark .pagination-btn{border-color:var(--border-color)}.home-videos-grid{grid-gap:24px;display:grid;gap:24px;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));margin-top:20px}.home-video-card{background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:12px;color:inherit;display:flex;flex-direction:column;overflow:hidden;text-decoration:none;transition:transform .3s ease,box-shadow .3s ease}.home-video-card:hover{border-color:var(--primary-color);box-shadow:0 8px 24px #00000026;transform:translateY(-4px)}.home-video-card-thumbnail{background:var(--bg-tertiary);overflow:hidden;padding-bottom:56.25%;position:relative;width:100%}.home-video-card-thumbnail img{height:100%;left:0;object-fit:cover;position:absolute;top:0;width:100%}.home-video-card-placeholder{align-items:center;background:linear-gradient(135deg,#667eea,#764ba2);display:flex;height:100%;justify-content:center;left:0;position:absolute;top:0;width:100%}.home-video-card-placeholder span{color:#fff;font-size:48px;opacity:.7}.home-video-card-duration{background:#000c;bottom:8px;font-size:12px;font-weight:500}.home-video-card-badge,.home-video-card-duration{border-radius:4px;color:#fff;padding:4px 8px;position:absolute;right:8px}.home-video-card-badge{background:red;font-size:11px;font-weight:600;text-transform:uppercase;top:8px}.home-video-card-info{padding:16px}.home-video-card-title{-webkit-line-clamp:2;-webkit-box-orient:vertical;color:var(--text-primary);display:-webkit-box;font-size:16px;font-weight:600;margin:0 0 8px;overflow:hidden}.home-video-card-artist{color:var(--text-secondary);font-size:14px;margin:0 0 12px}.home-video-card-stats{color:var(--text-secondary);display:flex;font-size:13px;gap:16px}:root.dark .home-video-card{background:var(--bg-secondary);border-color:var(--border-color)}:root.dark .home-video-card:hover{border-color:var(--primary-color);box-shadow:0 8px 24px #0006}.home-events-grid{grid-gap:24px;display:grid;gap:24px;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));margin-top:20px}.home-event-card{background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:12px;color:inherit;display:flex;flex-direction:column;overflow:hidden;transition:transform .3s ease,box-shadow .3s ease}.home-event-card:hover{border-color:var(--primary-color);box-shadow:0 8px 24px #00000026;transform:translateY(-4px)}.home-event-card-link{color:inherit;display:flex;flex:1 1;flex-direction:column;text-decoration:none}.home-event-card-cover{background:var(--bg-tertiary);height:200px;overflow:hidden;position:relative;width:100%}.home-event-card-cover img{height:100%;object-fit:cover;width:100%}.home-event-card-placeholder{align-items:center;background:linear-gradient(135deg,#667eea,#764ba2);display:flex;height:100%;justify-content:center;width:100%}.home-event-card-placeholder span{color:#fff;font-size:64px;opacity:.7}.home-event-card-badge{border-radius:20px;color:#fff;font-size:12px;font-weight:600;padding:5px 12px;position:absolute;right:10px;top:10px;z-index:1}.home-event-card-badge.published{background:#4caf50e6}.home-event-card-badge.draft{background:#ff9800e6}.home-event-card-info{display:flex;flex:1 1;flex-direction:column;padding:16px}.home-event-card-title{-webkit-line-clamp:2;-webkit-box-orient:vertical;color:var(--text-primary);display:-webkit-box;font-size:18px;font-weight:600;margin:0 0 8px;overflow:hidden}.home-event-card-artist{color:var(--primary-color);font-size:14px;font-weight:500;margin:0 0 12px}.home-event-card-details{margin-top:auto}.home-event-card-details p{color:var(--text-secondary);font-size:13px;margin:6px 0}.home-event-card-date{color:var(--text-primary);font-weight:500}.home-event-card-venue{color:var(--text-secondary)}.home-event-card-price{color:#4caf50;font-weight:600}.home-event-card-tickets{color:#ff9800;font-weight:500}.home-event-card-actions{border-top:1px solid var(--border-color);display:flex;gap:8px;justify-content:center;padding:12px 16px}:root.dark .home-event-card{background:var(--bg-secondary);border-color:var(--border-color)}:root.dark .home-event-card:hover{border-color:var(--primary-color);box-shadow:0 8px 24px #0006}:root.dark .home-event-card-actions{border-top-color:var(--border-color)}@media (max-width:768px){.home-events-grid,.home-videos-grid{gap:16px;grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}.home-event-card-cover{height:180px}}@media (max-width:480px){.home-events-grid,.home-videos-grid{grid-gap:8px!important;box-sizing:border-box;display:grid!important;gap:8px!important;grid-template-columns:repeat(2,1fr)!important;width:100%!important}.home-event-card{align-items:stretch!important;background:var(--bg-secondary);border-radius:8px;display:flex!important;flex-direction:column!important;min-width:0;overflow:hidden;padding:0!important}.home-event-card-cover{height:140px!important}.home-event-card-info{padding:10px!important}.home-event-card-title{font-size:14px!important;margin-bottom:6px!important}.home-event-card-artist{font-size:12px!important;margin-bottom:8px!important}.home-event-card-details p{font-size:11px!important;margin:4px 0!important}.home-event-card-badge{font-size:10px!important;padding:3px 8px!important;right:6px!important;top:6px!important}.home-video-card{align-items:stretch!important;background:var(--bg-secondary);border-radius:8px;display:flex!important;flex-direction:column!important;max-width:100%;min-width:0;overflow:hidden;padding:0!important}.home-video-card-thumbnail{padding-bottom:56.25%;position:relative;width:100%}.home-video-card-thumbnail img{height:100%;left:0;object-fit:cover;position:absolute;top:0;width:100%}.home-video-card-info{display:flex!important;flex:1 1!important;flex-direction:column!important;min-height:0;padding:8px!important}.home-video-card-title{-webkit-line-clamp:2;font-size:12px!important;font-weight:600;line-height:1.3;margin:0 0 4px}.home-video-card-artist,.home-video-card-title{-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.home-video-card-artist{-webkit-line-clamp:1;color:var(--text-secondary);font-size:10px!important;margin:0 0 6px}.home-video-card-stats{display:flex;flex-wrap:wrap;font-size:10px!important;gap:8px!important;margin-top:auto}.home-video-card-duration{bottom:4px;font-size:10px!important;padding:2px 6px!important;right:4px}.home-video-card-badge{font-size:9px!important;padding:2px 6px!important;right:4px;top:4px}.home-video-card:active{box-shadow:0 1px 8px #667eea26;transform:scale(.98)}}.latest-songs-list{display:flex;flex-direction:column;gap:12px;margin-bottom:40px;padding:0}.latest-song-item{align-items:center;background:#fff;border:1px solid #0000000d;border-radius:12px;display:flex;gap:12px;padding:12px;position:relative;transition:all .3s cubic-bezier(.4,0,.2,1)}.latest-song-item:hover{background:linear-gradient(135deg,#667eea08,#764ba208);border-color:#667eea33;box-shadow:0 2px 8px #667eea1a;transform:translateX(4px)}.latest-song-cover-small{align-items:center;background:linear-gradient(135deg,#667eea,#764ba2);border-radius:8px;display:flex;flex-shrink:0;height:60px;justify-content:center;overflow:hidden;text-decoration:none;transition:transform .2s ease;width:60px}.latest-song-cover-small:hover{transform:scale(1.05)}.latest-song-cover-small img{height:100%;object-fit:cover;width:100%}.latest-song-placeholder-small{align-items:center;color:#fffc;display:flex;font-size:28px;height:100%;justify-content:center;width:100%}.latest-song-content{display:flex;flex:1 1;flex-direction:column;gap:4px;min-width:0}.latest-song-header{align-items:center;display:flex;gap:12px;justify-content:space-between}.latest-song-title-link{align-items:center;color:inherit;display:flex;flex:1 1;gap:8px;min-width:0;text-decoration:none}.latest-song-title{-webkit-line-clamp:1;-webkit-box-orient:vertical;color:#1a1a1a;display:-webkit-box;flex:1 1;font-size:16px;font-weight:700;line-height:1.3;margin:0;min-width:0;overflow:hidden;text-overflow:ellipsis}.latest-song-duration-inline{color:#888;flex-shrink:0;font-size:14px;font-weight:500;white-space:nowrap}.latest-song-actions{align-items:center;display:flex;flex-shrink:0;gap:8px}.latest-song-options-btn,.latest-song-play-btn{align-items:center;background:#0000;border:none;border-radius:50%;color:#667eea;cursor:pointer;display:flex;flex-shrink:0;height:36px;justify-content:center;transition:all .2s ease;width:36px}.latest-song-play-btn:hover{background:#667eea1a;transform:scale(1.1)}.latest-song-options-btn:hover{background:#0000000d;transform:scale(1.1)}.latest-song-options-btn:active,.latest-song-play-btn:active{transform:scale(.95)}.latest-song-meta{display:flex;flex-direction:column;gap:6px;margin-top:4px}.latest-song-artist-link{color:inherit;text-decoration:none}.latest-song-artist{-webkit-line-clamp:1;-webkit-box-orient:vertical;color:#666;display:-webkit-box;font-size:14px;margin:0;overflow:hidden;text-overflow:ellipsis}.latest-song-stats{align-items:center;display:flex;flex-wrap:wrap;gap:12px}.latest-song-stat-item{align-items:center;color:#888;cursor:default;display:flex;font-size:13px;gap:4px}.latest-song-stat-icon{font-size:14px;line-height:1}.latest-song-stat-value{color:#666;font-weight:500}.latest-song-date-inline{color:#999;font-size:12px;font-style:italic;margin-left:auto}@media (max-width:768px){.latest-songs-list{gap:10px;margin-bottom:30px}.latest-song-item{gap:10px;padding:10px}.latest-song-cover-small{height:50px;width:50px}.latest-song-placeholder-small{font-size:24px}.latest-song-title{font-size:15px}.latest-song-artist,.latest-song-duration-inline{font-size:13px}.latest-song-stats{gap:10px}.latest-song-stat-item{font-size:12px}.latest-song-stat-icon{font-size:13px}.latest-song-date-inline{font-size:11px}.latest-song-options-btn,.latest-song-play-btn{height:32px;width:32px}.latest-song-options-btn svg,.latest-song-play-btn svg{height:18px;width:18px}}@media (max-width:480px){.latest-song-item{gap:8px;padding:8px}.latest-song-cover-small{height:48px;width:48px}.latest-song-placeholder-small{font-size:20px}.latest-song-title{font-size:14px}.latest-song-artist,.latest-song-duration-inline{font-size:12px}.latest-song-stats{gap:8px}.latest-song-stat-item{font-size:11px}.latest-song-stat-icon{font-size:12px}.latest-song-date-inline{font-size:10px}.latest-song-header{gap:8px}.latest-song-actions{gap:6px}}:root.dark .latest-song-item{background:var(--bg-secondary);border-color:var(--border-color)}:root.dark .latest-song-item:hover{background:var(--bg-tertiary);border-color:#667eea4d}:root.dark .latest-song-title{color:var(--text-primary)}:root.dark .latest-song-artist,:root.dark .latest-song-duration-inline,:root.dark .latest-song-stat-item,:root.dark .latest-song-stat-value{color:var(--text-secondary)}:root.dark .latest-song-date-inline{color:var(--text-secondary);opacity:.8}:root.dark .latest-song-options-btn,:root.dark .latest-song-play-btn{color:var(--text-primary)}:root.dark .latest-song-play-btn:hover{background:#667eea33}:root.dark .latest-song-options-btn:hover{background:#ffffff1a}.top50-songs-list{display:flex;flex-direction:column;gap:12px;margin-bottom:40px;padding:0}.top50-song-item{align-items:center;background:#fff;border:1px solid #0000000d;border-radius:12px;display:flex;gap:12px;padding:12px;position:relative;transition:all .3s cubic-bezier(.4,0,.2,1)}.top50-song-item:hover{background:linear-gradient(135deg,#667eea08,#764ba208);border-color:#667eea33;box-shadow:0 2px 8px #667eea1a;transform:translateX(4px)}.top50-rank-number{color:#667eea;flex-shrink:0;font-size:32px;font-weight:900;line-height:1;min-width:50px;text-align:center;text-shadow:0 2px 4px #667eea33}.top50-song-cover{align-items:center;background:linear-gradient(135deg,#667eea,#764ba2);border-radius:8px;display:flex;flex-shrink:0;height:50px;justify-content:center;overflow:hidden;text-decoration:none;transition:transform .2s ease;width:50px}.top50-song-cover:hover{transform:scale(1.05)}.top50-song-cover img{height:100%;object-fit:cover;width:100%}.top50-placeholder{align-items:center;color:#fffc;display:flex;font-size:24px;height:100%;justify-content:center;width:100%}.top50-song-content{display:flex;flex:1 1;flex-direction:column;gap:4px;min-width:0}.top50-song-header{align-items:center;display:flex;gap:12px;justify-content:space-between}.top50-song-title-link{color:inherit;flex:1 1;min-width:0;text-decoration:none}.top50-song-title{-webkit-line-clamp:1;-webkit-box-orient:vertical;color:#1a1a1a;display:-webkit-box;font-size:16px;font-weight:700;line-height:1.3;margin:0;overflow:hidden;text-overflow:ellipsis}.top50-song-actions{align-items:center;display:flex;flex-shrink:0;gap:12px}.top50-song-stats{align-items:center;display:flex;gap:8px}.top50-stat-item{color:#666;cursor:default;font-size:14px;font-weight:600;white-space:nowrap}.top50-song-options-btn{align-items:center;background:#0000;border:none;border-radius:50%;color:#667eea;cursor:pointer;display:flex;flex-shrink:0;height:36px;justify-content:center;transition:all .2s ease;width:36px}.top50-song-options-btn:hover{background:#0000000d;transform:scale(1.1)}.top50-song-options-btn:active{transform:scale(.95)}.top50-song-artist-link{color:inherit;text-decoration:none}.top50-song-artist{-webkit-line-clamp:1;-webkit-box-orient:vertical;color:#666;display:-webkit-box;font-size:14px;margin:0;overflow:hidden;text-overflow:ellipsis}@media (max-width:768px){.top50-songs-list{gap:10px;margin-bottom:30px}.top50-song-item{gap:10px;padding:10px}.top50-rank-number{font-size:28px;min-width:45px}.top50-song-cover{height:45px;width:45px}.top50-placeholder{font-size:20px}.top50-song-title{font-size:15px}.top50-song-artist,.top50-stat-item{font-size:13px}.top50-song-options-btn{height:32px;width:32px}.top50-song-options-btn svg{height:18px;width:18px}}@media (max-width:480px){.top50-song-item{gap:8px;padding:8px}.top50-rank-number{font-size:24px;min-width:40px}.top50-song-cover{height:40px;width:40px}.top50-placeholder{font-size:18px}.top50-song-title{font-size:14px}.top50-song-artist,.top50-stat-item{font-size:12px}.top50-song-actions,.top50-song-header{gap:8px}}:root.dark .top50-song-item{background:var(--bg-secondary);border-color:var(--border-color)}:root.dark .top50-song-item:hover{background:var(--bg-tertiary);border-color:#667eea4d}:root.dark .top50-rank-number{color:#667eea}:root.dark .top50-song-title{color:var(--text-primary)}:root.dark .top50-song-artist,:root.dark .top50-stat-item{color:var(--text-secondary)}:root.dark .top50-song-options-btn{color:var(--text-primary)}:root.dark .top50-song-options-btn:hover{background:#ffffff1a}.artist-songs-modal-overlay{align-items:center;background:#000000b3;bottom:0;display:flex;justify-content:center;left:0;overflow-y:auto;padding:20px;position:fixed;right:0;top:0;z-index:10001}.artist-songs-modal-content{background:#fff;border-radius:16px;box-shadow:0 20px 60px #0000004d;max-height:90vh;overflow-y:auto;padding:30px;position:relative;width:min(90%,900px);z-index:10002}.artist-songs-modal-close{background:#dc3545;border:none;border-radius:50%;color:#fff;cursor:pointer;font-size:24px;height:36px;position:absolute;right:15px;top:15px;transition:transform .2s ease;width:36px;z-index:10001}.artist-songs-modal-close:hover{transform:scale(1.1)}.artist-songs-modal-header{border-bottom:2px solid #e0e0e0;display:flex;gap:20px;margin-bottom:30px;padding-bottom:20px}.artist-songs-avatar{background:linear-gradient(135deg,#667eea,#764ba2);border:4px solid #fff;border-radius:50%;box-shadow:0 4px 12px #00000026;flex-shrink:0;height:120px;overflow:hidden;width:120px}.artist-songs-avatar img{height:100%;object-fit:cover;width:100%}.placeholder-avatar{font-size:50px}.artist-songs-info{flex:1 1}.artist-songs-info h2{color:#333;font-size:28px;margin:0 0 10px}.artist-songs-count{font-size:16px;margin:0 0 10px}.artist-songs-description{color:#666;font-size:14px;line-height:1.6;margin:0}.artist-songs-empty,.artist-songs-loading{color:#666;font-size:18px;padding:60px 20px;text-align:center}.audio-player-mobile-info{display:none}.artist-songs-player{background:#f8f9fa;border-radius:12px;margin-bottom:30px;padding:20px}.artist-songs-current{display:flex;flex-direction:column;gap:15px}.current-song-info{text-align:center}.current-song-info h3{color:#333;font-size:22px;margin:0 0 5px}.current-song-info p{color:#666;font-size:14px;margin:0}.song-navigation{display:flex;gap:15px;justify-content:center;margin-top:15px}.btn-nav{background:linear-gradient(135deg,#667eea,#764ba2);border:none;border-radius:8px;color:#fff;cursor:pointer;font-size:14px;font-weight:600;padding:10px 20px;transition:all .3s ease}.btn-nav:hover:not(:disabled){box-shadow:0 4px 12px #667eea66;transform:translateY(-2px)}.btn-nav:disabled{cursor:not-allowed;opacity:.5}.artist-songs-list{margin-top:30px}.artist-songs-list h3{color:#333;font-size:20px;margin:0 0 20px}.songs-list{gap:10px}.song-list-item{align-items:center;background:#f8f9fa;border:2px solid #0000;border-radius:10px;cursor:pointer;display:flex;gap:15px;padding:15px;transition:all .3s ease}.song-list-item:hover{background:#e9ecef;transform:translateX(5px)}.song-list-item.active{background:linear-gradient(135deg,#667eea1a,#764ba21a);border-color:#667eea}.song-list-number{align-items:center;background:linear-gradient(135deg,#667eea,#764ba2);border-radius:50%;color:#fff;display:flex;flex-shrink:0;font-size:14px;font-weight:600;height:30px;justify-content:center;width:30px}.song-list-item.active .song-list-number{background:#667eea;box-shadow:0 2px 8px #667eea66}.song-list-cover{background:linear-gradient(135deg,#667eea,#764ba2);border-radius:8px;flex-shrink:0;height:60px;overflow:hidden;width:60px}.song-list-cover img{height:100%;object-fit:cover;width:100%}.song-list-info{flex:1 1;min-width:0;overflow:hidden}.song-list-info h4{color:#333;font-size:16px;margin:0 0 5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.song-list-stats{color:#666;display:flex;font-size:12px;gap:15px}.song-list-playing{animation:pulse 1.5s ease-in-out infinite;color:#667eea;font-size:20px;font-weight:700}:root.dark .artist-songs-modal-content{background:#181b34}:root.dark .artist-songs-info h2,:root.dark .artist-songs-list h3,:root.dark .current-song-info h3,:root.dark .song-list-info h4{color:#eaeaea}:root.dark .artist-songs-description,:root.dark .current-song-info p,:root.dark .song-list-stats{color:#bbb}:root.dark .artist-songs-player,:root.dark .song-list-item{background:#0f1226}:root.dark .song-list-item:hover{background:#1a1d3a}:root.dark .artist-songs-modal-header{border-bottom-color:#ffffff1a}@media (max-width:768px){.artist-songs-modal-overlay{align-items:flex-start;padding:80px 10px 10px;z-index:10001}.artist-songs-modal-content{-webkit-overflow-scrolling:touch;box-sizing:border-box;max-height:calc(95vh - 80px);max-width:95%;overflow-y:auto;padding:50px 15px 20px;width:95%}.artist-songs-modal-close{box-shadow:0 2px 8px #0000004d;font-size:22px;height:36px;right:10px;top:10px;width:36px;z-index:10001}.artist-songs-modal-header{align-items:center;flex-direction:column;gap:15px;margin-bottom:20px;padding-bottom:15px;text-align:center}.artist-songs-avatar{height:100px;width:100px}.artist-songs-info h2{font-size:22px}.artist-songs-count{font-size:14px}.artist-songs-description{font-size:13px}.artist-songs-player{margin-bottom:20px;padding:15px}.artist-songs-current{gap:12px}.current-song-info h3{word-wrap:break-word;font-size:18px;overflow-wrap:break-word}.song-navigation{flex-direction:column;gap:10px}.btn-nav{box-sizing:border-box;font-size:13px;padding:12px;width:100%}.audio-player-desktop-only{display:none}.audio-player-mobile-info{background:linear-gradient(135deg,#667eea1a,#764ba21a);border-radius:8px;color:#667eea;display:block;font-size:14px;font-weight:500;margin:10px 0;padding:12px;text-align:center}.song-list-item{flex-wrap:nowrap;gap:12px;overflow:hidden;padding:12px}.song-list-cover{flex-shrink:0;height:50px;width:50px}.song-list-number{flex-shrink:0;font-size:12px;height:26px;width:26px}.song-list-info{flex:1 1;min-width:0;overflow:hidden}.song-list-info h4{font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.song-list-stats{flex-wrap:wrap;font-size:11px;gap:10px}.song-list-playing{flex-shrink:0}}@media (max-width:480px){.artist-songs-modal-overlay{align-items:flex-start;padding:72px 0 0;z-index:10001}.artist-songs-modal-content{-webkit-overflow-scrolling:touch;border-radius:12px 12px 0 0;box-sizing:border-box;max-height:calc(100vh - 72px);max-width:100%;overflow-y:auto;padding:50px 12px 15px;width:100%}.artist-songs-modal-close{box-shadow:0 2px 8px #0000004d;font-size:22px;height:36px;right:10px;top:10px;width:36px;z-index:10001}.artist-songs-avatar{height:80px;width:80px}.artist-songs-info h2{font-size:20px}.artist-songs-info h2,.current-song-info h3{word-wrap:break-word;overflow-wrap:break-word}.current-song-info h3{font-size:16px}.song-list-item{flex-wrap:nowrap;gap:10px;overflow:hidden;padding:10px}.song-list-cover,.song-list-number{flex-shrink:0}.song-list-info{flex:1 1;min-width:0;overflow:hidden}.song-list-info h4{font-size:13px;margin:0 0 4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.song-list-stats{flex-wrap:wrap;font-size:10px;gap:8px}.song-list-playing{flex-shrink:0;font-size:18px}.audio-player-desktop-only{display:none}.audio-player-mobile-info{background:linear-gradient(135deg,#667eea1a,#764ba21a);border-radius:8px;color:#667eea;display:block;font-size:13px;font-weight:500;margin:8px 0;padding:10px;text-align:center}.song-list-cover{height:45px;width:45px}.song-list-number{font-size:11px;height:24px;width:24px}}.auto-radio-container{background:#0000;border-radius:12px;padding:20px;width:100%}.radio-header{align-items:flex-start;display:flex;flex-wrap:wrap;gap:20px;justify-content:space-between;margin-bottom:25px}.radio-title-section h2{color:#fff;font-size:24px;font-weight:700;margin:0 0 5px}.radio-title-section p{color:#fff;font-size:14px;margin:0;opacity:.9}.radio-controls{align-items:center;display:flex;gap:12px}.radio-play-btn{font-size:16px;font-weight:600;padding:12px 24px}.shuffle-btn{align-items:center;display:flex;font-size:14px;gap:8px;padding:12px 20px}.shuffle-btn.active{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.radio-preferences{background:#ffffff1a;border:1px solid #fff3;border-radius:8px;margin-bottom:20px;padding:15px}.preference-tags{align-items:center;display:flex;flex-wrap:wrap;gap:10px}.preference-label{color:#fff;font-size:14px;font-weight:600}.preference-tag{background:linear-gradient(135deg,#667eea,#764ba2);border-radius:20px;color:#fff;font-size:12px;font-weight:500;padding:6px 12px}.radio-info{background:#667eea33;border:1px solid #667eea4d;border-radius:8px;margin-bottom:20px;padding:12px;text-align:center}.radio-info p{color:#fff;font-size:14px;margin:0}.radio-songs-grid{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));margin-bottom:20px}.radio-song-card{background:#f8f9fa;border-radius:10px;display:flex;flex-direction:column;gap:12px;padding:15px;position:relative;transition:all .3s ease}.radio-song-card:hover{box-shadow:0 4px 15px #0000001a;transform:translateY(-5px)}.radio-song-cover{aspect-ratio:1;background:linear-gradient(135deg,#667eea,#764ba2);border-radius:8px;overflow:hidden;width:100%}.radio-song-cover img{height:100%;object-fit:cover;width:100%}.placeholder-cover{font-size:48px}.radio-song-info{flex:1 1}.radio-song-info h4{color:#333;font-size:16px;font-weight:600;margin:0 0 5px}.radio-song-info h4,.radio-song-info p{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.radio-song-info p{color:#666;font-size:13px;margin:0 0 8px}.radio-song-stats{color:#999;display:flex;font-size:12px;gap:12px}.radio-song-play-btn{align-items:center;background:#ffffffe6;border:none;border-radius:50%;box-shadow:0 2px 8px #0000001a;cursor:pointer;display:flex;font-size:16px;height:40px;justify-content:center;position:absolute;right:15px;top:15px;transition:all .3s ease;width:40px}.radio-song-play-btn:hover{background:#fff;box-shadow:0 4px 12px #667eea4d;transform:scale(1.1)}.radio-more{background:#ffffff1a;border:1px solid #fff3;border-radius:8px;color:#fff;font-size:14px;padding:15px;text-align:center}.radio-empty,.radio-loading{color:#fff;padding:40px 20px;text-align:center}.radio-empty p{margin:10px 0}.radio-error{background:#e74c3c33;border:1px solid #e74c3c80;border-radius:8px;margin-bottom:20px;padding:15px}.radio-error,.radio-error strong{color:#ff6b6b}@media (max-width:768px){.auto-radio-container{padding:15px}.radio-header{flex-direction:column}.radio-title-section h2{color:#fff}.radio-title-section p{color:#fff;opacity:.9}.radio-controls{flex-direction:column;width:100%}.radio-play-btn,.shuffle-btn{justify-content:center;width:100%}.radio-songs-grid{gap:15px;grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}.radio-song-card{padding:12px}}:root.dark .radio-title-section h2{color:var(--text-primary)}:root.dark .radio-title-section p{color:var(--text-primary);opacity:.9}.genre-filter-container{margin-bottom:20px;position:relative}.filter-toggle-btn{align-items:center;background:#fff;border:2px solid #e0e0e0;border-radius:8px;color:#333;cursor:pointer;display:flex;font-size:14px;font-weight:600;gap:8px;padding:10px 16px;position:relative;transition:all .3s ease}.filter-toggle-btn:hover{background:#f8f9fa;border-color:#667eea}.filter-badge{background:#667eea;border-radius:12px;color:#fff;font-size:11px;font-weight:700;min-width:18px;padding:2px 8px;text-align:center}.filter-arrow{color:#666;font-size:10px;margin-left:auto}.filter-panel{background:#fff;border-radius:12px;box-shadow:0 8px 32px #00000026;display:flex;flex-direction:column;left:0;max-height:500px;overflow:hidden;position:absolute;right:0;top:calc(100% + 10px);z-index:10001}.filter-tabs{background:#f8f9fa;border-bottom:1px solid #eee;display:flex}.filter-tab{background:none;border:none;border-bottom:2px solid #0000;color:#666;cursor:pointer;flex:1 1;font-size:14px;font-weight:600;padding:12px 16px;transition:all .2s ease}.filter-tab:hover{background:#f0f0f0}.filter-tab.active{border-bottom-color:#667eea;color:#667eea}.filter-options{display:flex;flex-wrap:wrap;gap:10px;max-height:400px;overflow-y:auto;padding:15px}.filter-option{align-items:center;background:#f8f9fa;border:2px solid #e0e0e0;border-radius:20px;cursor:pointer;display:flex;font-size:13px;gap:6px;padding:8px 14px;transition:all .2s ease;white-space:nowrap}.filter-option:hover{background:#f0f4ff;border-color:#667eea}.filter-option.active{background:linear-gradient(135deg,#667eea,#764ba2);border-color:#667eea;color:#fff}.filter-option-name{font-weight:500}.filter-option-count{font-size:11px;opacity:.8}.filter-actions{background:#f8f9fa;border-top:1px solid #eee;padding:12px 15px}.filter-clear-btn{background:#e74c3c;border:none;border-radius:6px;color:#fff;cursor:pointer;font-size:14px;font-weight:600;padding:10px;transition:all .2s ease;width:100%}.filter-clear-btn:hover{background:#c0392b;transform:translateY(-1px)}.filter-empty,.filter-loading{color:#999;font-size:14px;padding:40px 20px;text-align:center}@media (max-width:768px){.filter-panel{border-radius:20px 20px 0 0;bottom:0;left:0;max-height:70vh;position:fixed;right:0;top:auto;z-index:10001}.filter-options{max-height:calc(70vh - 120px)}}:root.dark .filter-toggle-btn{background:var(--bg-secondary);border-color:var(--border-color);color:var(--text-primary)}:root.dark .filter-toggle-btn:hover{background:var(--bg-tertiary);border-color:var(--primary-color)}:root.dark .filter-arrow{color:var(--text-secondary)}:root.dark .filter-panel{background:var(--bg-secondary);border:1px solid var(--border-color);box-shadow:var(--shadow-xl)}:root.dark .filter-tabs{background:var(--bg-tertiary);border-bottom-color:var(--border-color)}:root.dark .filter-tab{color:var(--text-secondary)}:root.dark .filter-tab:hover{background:var(--bg-secondary)}:root.dark .filter-tab.active{border-bottom-color:var(--primary-color);color:var(--primary-color)}:root.dark .filter-option{background:var(--bg-tertiary);border-color:var(--border-color);color:var(--text-primary)}:root.dark .filter-option:hover{background:var(--bg-secondary);border-color:var(--primary-color)}:root.dark .filter-actions{background:var(--bg-tertiary);border-top-color:var(--border-color)}:root.dark .filter-empty,:root.dark .filter-loading{color:var(--text-secondary)}.ai-recommendations-container{background:linear-gradient(135deg,#667eea26,#764ba226);border:1px solid #667eea4d;border-radius:16px;margin:40px 0;padding:25px}.ai-recommendations-header{align-items:center;display:flex;gap:15px;justify-content:space-between;margin-bottom:25px}.ai-recommendations-header h3{align-items:center;color:#fff;display:flex;font-size:22px;font-weight:700;gap:10px;margin:0}.ai-badge{background:linear-gradient(135deg,#667eea,#764ba2);border-radius:20px;box-shadow:0 2px 8px #667eea4d;color:#fff;font-size:12px;font-weight:600;letter-spacing:.5px;padding:6px 14px;text-transform:uppercase}.ai-recommendations-loading{color:#999;font-size:14px;padding:40px 20px;text-align:center}.ai-recommendations-grid{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(auto-fill,minmax(180px,1fr))}.ai-recommendation-card{background:#fff;border:1px solid #e0e0e0;border-radius:12px;box-shadow:0 2px 8px #00000014;overflow:hidden;transition:all .3s ease}.ai-recommendation-card:hover{border-color:#667eea;box-shadow:0 8px 24px #667eea33;transform:translateY(-4px)}.ai-recommendation-link{color:inherit;display:block;text-decoration:none}.ai-recommendation-cover{background:linear-gradient(135deg,#667eea,#764ba2);overflow:hidden;padding-top:100%;position:relative;width:100%}.ai-recommendation-cover img{height:100%;left:0;object-fit:cover;position:absolute;top:0;width:100%}.ai-recommendation-placeholder{background:linear-gradient(135deg,#667eea1a,#764ba21a);font-size:48px}.ai-recommendation-placeholder,.ai-recommendation-play-overlay{align-items:center;display:flex;height:100%;justify-content:center;left:0;position:absolute;top:0;width:100%}.ai-recommendation-play-overlay{background:#0006;opacity:0;transition:opacity .3s ease}.ai-recommendation-card:hover .ai-recommendation-play-overlay{opacity:1}.ai-recommendation-play-btn{align-items:center;background:#ffffffe6;border:none;border-radius:50%;box-shadow:0 4px 12px #0003;color:#667eea;cursor:pointer;display:flex;font-size:24px;height:60px;justify-content:center;transition:all .3s ease;width:60px}.ai-recommendation-play-btn:hover{background:#fff;box-shadow:0 6px 20px #0000004d;transform:scale(1.1)}.ai-recommendation-info{padding:15px}.ai-recommendation-title{-webkit-line-clamp:2;color:#333;font-size:15px;font-weight:600;margin:0 0 6px}.ai-recommendation-artist,.ai-recommendation-title{-webkit-box-orient:vertical;display:-webkit-box;line-height:1.3;overflow:hidden;text-overflow:ellipsis}.ai-recommendation-artist{-webkit-line-clamp:1;color:#666;font-size:13px;margin:0 0 10px}.ai-recommendation-stats{color:#999;display:flex;font-size:12px;gap:12px}.ai-recommendation-stats span{align-items:center;display:flex;gap:4px}@media (max-width:768px){.ai-recommendations-container{margin:30px 0;padding:20px}.ai-recommendations-header h3{font-size:18px}.ai-recommendations-grid{gap:15px;grid-template-columns:repeat(auto-fill,minmax(140px,1fr))}.ai-recommendation-info{padding:12px}.ai-recommendation-title{font-size:14px}.ai-recommendation-artist{font-size:12px}}@media (max-width:480px){.ai-recommendations-grid{gap:12px;grid-template-columns:repeat(auto-fill,minmax(120px,1fr))}.ai-recommendation-play-btn{font-size:20px;height:50px;width:50px}}:root.dark .ai-recommendations-container{background:linear-gradient(135deg,#7c8ef526,#8b5fb826);border-color:#7c8ef54d}:root.dark .ai-recommendations-header h3{color:var(--text-primary)}:root.dark .ai-recommendations-loading{color:var(--text-secondary)}:root.dark .ai-recommendation-card{background:var(--bg-secondary);border-color:var(--border-color);box-shadow:var(--shadow-md)}:root.dark .ai-recommendation-card:hover{border-color:var(--primary-color);box-shadow:var(--shadow-xl)}:root.dark .ai-recommendation-title{color:var(--text-primary)}:root.dark .ai-recommendation-artist,:root.dark .ai-recommendation-stats{color:var(--text-secondary)}.booking-modal-overlay{align-items:center;background:#000000b3;bottom:0;display:flex;justify-content:center;left:0;padding:20px;position:fixed;right:0;top:0;z-index:10001}.booking-modal-content{background:#fff;border-radius:12px;box-shadow:0 10px 40px #0000004d;max-height:90vh;max-width:600px;overflow-y:auto;position:relative;width:100%}.booking-modal-close{align-items:center;background:none;border:none;border-radius:50%;color:#666;cursor:pointer;display:flex;font-size:28px;height:35px;justify-content:center;position:absolute;right:15px;top:15px;transition:all .2s;width:35px}.booking-modal-close:hover{background:#f0f0f0;color:#333}.booking-modal-header{border-bottom:1px solid #eee;padding:30px 30px 20px;text-align:center}.booking-modal-header h2{color:#333;font-size:24px;margin:0 0 10px}.event-title{color:#666;font-size:14px;margin:0}.booking-form{padding:25px 30px 30px}.booking-summary{background:#f8f9fa;border-radius:8px;margin-bottom:25px;padding:20px}.summary-item{align-items:center;display:flex;justify-content:space-between;margin-bottom:15px}.summary-item.total{border-top:2px solid #e0e0e0;font-size:1.2em;margin-top:15px;padding-top:15px}.summary-item.total strong{color:#667eea;font-size:1.3em}.form-group input,.form-group textarea{border:2px solid #e0e0e0;border-radius:8px;font-family:inherit;font-size:14px;padding:12px;transition:border-color .3s ease;width:100%}.booking-actions{display:flex;gap:15px;justify-content:flex-end;margin-top:25px}.booking-message{border-radius:8px;font-weight:500;margin:20px 30px;padding:15px 20px}.booking-message.success{background:#d4edda;border:1px solid #c3e6cb;color:#155724}.booking-message.error{background:#f8d7da;border:1px solid #f5c6cb;color:#721c24}:root.dark .booking-modal-content{background:#0a0c18fa;border:1px solid #ffffff1a}:root.dark .booking-modal-header{border-bottom-color:#ffffff1a}:root.dark .booking-modal-header h2{color:#eaeaea}:root.dark .event-title{color:#aaa}:root.dark .booking-summary{background:#ffffff0d}:root.dark .form-group label{color:#eaeaea}:root.dark .form-group input,:root.dark .form-group textarea{background:#ffffff0d;border-color:#ffffff1a;color:#eaeaea}:root.dark .form-group small{color:#aaa}@media (max-width:768px){.booking-modal-overlay{align-items:flex-start;padding:80px 10px 20px;z-index:10001}.booking-modal-content{margin:0;max-height:calc(100vh - 100px);padding-top:50px;position:relative;width:calc(100% - 20px)}.booking-modal-close{box-shadow:0 2px 8px #0000004d;right:10px;top:10px;z-index:10002}.booking-form,.booking-modal-header{padding:20px}.booking-actions{flex-direction:column-reverse}.booking-actions .btn{width:100%}}@media (max-width:480px){.booking-modal-overlay{align-items:flex-start;padding:72px 0 0}.booking-modal-content{border-radius:12px 12px 0 0;max-height:calc(100vh - 72px);max-width:100%;padding-top:50px;width:100%}}.artists-page{min-height:100vh;padding:40px 0}.artists-grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));margin-bottom:40px}.artist-card{border-radius:12px;box-shadow:0 4px 6px #0000001a;padding:30px 20px;transition:transform .3s ease,box-shadow .3s ease}.artist-card:hover{box-shadow:0 12px 24px #00000026;transform:translateY(-8px)}.artist-avatar{box-shadow:0 4px 8px #0000001a;height:150px;margin-bottom:20px;width:150px}.placeholder-avatar{font-size:60px}.artist-name-row{align-items:center;display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-bottom:12px}.artist-info h3{font-size:24px;margin:0}.premium-badge-card{align-items:center;animation:premiumGlow 2s ease-in-out infinite;background:linear-gradient(135deg,#fbbf24,#f59e0b);border:1px solid #ffffff4d;border-radius:16px;box-shadow:0 2px 8px #fbbf2466;color:#fff;display:inline-flex;font-size:.7rem;font-weight:700;gap:4px;letter-spacing:.5px;padding:4px 10px;text-transform:uppercase;white-space:nowrap}.premium-badge-card.premium-basic{animation:premiumBasicGlow 2s ease-in-out infinite;background:linear-gradient(135deg,#3b82f6,#2563eb);box-shadow:0 2px 8px #3b82f666}.verified-badge-card{align-items:center;animation:verifiedGlow 2s ease-in-out infinite;background:linear-gradient(135deg,#10b981,#059669);border:1px solid #ffffff4d;border-radius:16px;box-shadow:0 2px 8px #10b98166;color:#fff;display:inline-flex;font-size:.7rem;font-weight:700;gap:4px;letter-spacing:.5px;padding:4px 10px;text-transform:uppercase;white-space:nowrap}.premium-badge-card:hover{box-shadow:0 3px 12px #fbbf2480;transform:scale(1.05)}.artist-meta{align-items:center;display:flex;flex-direction:column;gap:8px;margin-bottom:12px}.artist-followers,.artist-genre,.artist-location{align-items:center;background:#667eea1a;border-radius:20px;color:#667eea;display:inline-flex;font-size:13px;font-weight:500;gap:6px;padding:6px 12px;white-space:nowrap}.artist-location{background:#764ba21a;color:#764ba2}.artist-followers{background:#10b9811a;color:#10b981}.artist-description{font-size:14px;line-height:1.6}@media (max-width:768px){.artists-grid{gap:16px;grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}.artist-card{padding:20px 15px}.artist-avatar{height:120px;width:120px}.artist-info h3{font-size:20px}.premium-badge-card{font-size:.65rem;padding:3px 8px}.artist-meta{gap:6px}.artist-followers,.artist-genre,.artist-location{font-size:12px;padding:5px 10px}}@media (max-width:480px){.artists-grid{gap:12px;grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}.artist-card{padding:15px 10px}.artist-avatar{height:100px;width:100px}.artist-info h3{font-size:18px}.artist-name-row{gap:6px}.premium-badge-card{font-size:.6rem;padding:3px 6px}.artist-meta{gap:5px}.artist-followers,.artist-genre,.artist-location{font-size:11px;padding:4px 8px}}:root.dark .artists-page{background:var(--bg-gradient-dark);color:var(--text-primary)}:root.dark .artist-card{box-shadow:var(--shadow-lg)}:root.dark .artist-card:hover{background:var(--bg-tertiary)}:root.dark .hero-section{background:linear-gradient(135deg,#0f1226cc,#1a1d3acc)}:root.dark .hero-section h1{color:var(--text-primary)}.share-modal-overlay{align-items:center;background:#000000b3;bottom:0;display:flex;justify-content:center;left:0;padding:20px;position:fixed;right:0;top:0;z-index:10001}.share-modal-content{background:#fff;border-radius:12px;box-shadow:0 10px 40px #0000004d;max-height:90vh;max-width:600px;overflow-y:auto;position:relative;width:100%}.share-modal-close{align-items:center;background:none;border:none;border-radius:50%;color:#666;cursor:pointer;display:flex;font-size:28px;height:35px;justify-content:center;position:absolute;right:15px;top:15px;transition:all .2s;width:35px}.share-modal-close:hover{background:#f0f0f0;color:#333}.share-modal-header{border-bottom:1px solid #eee;padding:30px 30px 20px;text-align:center}.share-modal-header h2{color:#333;font-size:24px;margin:0 0 15px}.share-cover-image{border-radius:8px;display:block;height:120px;margin:0 auto;object-fit:cover;width:120px}.share-options{padding:25px 30px 30px}.share-options h3{align-items:center;color:#333;display:flex;font-size:16px;font-weight:600;justify-content:space-between;margin:0 0 15px}.toggle-embed{background:none;border:none;color:#667eea;cursor:pointer;font-size:14px;padding:0}.share-social{margin-bottom:25px}.share-buttons{grid-gap:10px;display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(120px,1fr))}.share-btn{align-items:center;background:#fff;border:2px solid #e0e0e0;border-radius:8px;color:#333;display:flex;flex-direction:column;font-size:14px;font-weight:500;justify-content:center;padding:15px 10px;text-decoration:none;transition:all .2s}.share-btn span{font-size:24px;margin-bottom:5px}.share-btn:hover{box-shadow:0 4px 12px #0000001a;transform:translateY(-2px)}.share-whatsapp:hover{background:#f0fff4;border-color:#25d366}.share-facebook:hover{background:#f0f4ff;border-color:#1877f2}.share-twitter:hover{background:#f0f8ff;border-color:#1da1f2}.share-telegram:hover{background:#f0f8ff;border-color:#08c}.share-email:hover{background:#f5f7ff;border-color:#667eea}.share-link{margin-bottom:25px}.link-input-group{display:flex;gap:10px}.link-input{background:#f9f9f9;border:2px solid #e0e0e0;border-radius:6px;flex:1 1;font-family:monospace;font-size:14px;padding:12px}.share-embed{border-top:1px solid #eee;padding-top:20px}.embed-section{margin-top:15px}.embed-code{background:#f9f9f9;border:2px solid #e0e0e0;border-radius:6px;font-family:monospace;font-size:12px;margin-bottom:10px;padding:12px;resize:vertical;width:100%}.embed-section small{color:#666;display:block;font-size:12px;margin-top:8px}@media (max-width:768px){.share-modal-overlay{align-items:flex-start;padding:80px 10px 20px;z-index:10001}.share-modal-content{margin:auto 0;max-height:calc(100vh - 100px);padding-top:50px;position:relative;width:calc(100% - 20px)}.share-modal-close{box-shadow:0 2px 8px #0000004d;right:10px;top:10px;z-index:10002}.share-modal-header{padding:20px 20px 15px}.share-options{padding:20px}.share-buttons{grid-template-columns:repeat(2,1fr)}.link-input-group{flex-direction:column}}@media (max-width:480px){.share-modal-overlay{align-items:flex-start;padding:72px 0 0}.share-modal-content{border-radius:12px 12px 0 0;max-height:calc(100vh - 72px);max-width:100%;padding-top:50px;width:100%}}.share-native{border-bottom:1px solid #eee;margin-bottom:25px;padding-bottom:20px}.share-native-btn{font-size:16px;padding:12px;width:100%}.share-image-generator{border-top:1px solid #eee;margin-bottom:25px;padding-top:20px}.share-image-description{color:#666;font-size:13px;margin-bottom:15px}.share-image-preview{margin-top:15px}.share-image-preview img{border:2px solid #e0e0e0;border-radius:8px;height:auto;margin-bottom:15px;max-width:600px;width:100%}.share-image-actions{display:flex;gap:10px}.share-image-actions .btn{flex:1 1}.share-linkedin:hover{background:#f0f7ff;border-color:#0077b5}.share-reddit:hover{background:#fff5f0;border-color:#ff4500}:root.dark .share-modal-content{background:#0a0c18fa;border:1px solid #ffffff1a}:root.dark .share-modal-header{border-bottom-color:#ffffff1a}:root.dark .share-modal-header h2,:root.dark .share-options h3{color:#eaeaea}:root.dark .share-btn{background:#ffffff0d;border-color:#ffffff1a;color:#eaeaea}:root.dark .share-btn:hover{background:#ffffff1a}:root.dark .embed-code,:root.dark .link-input{background:#ffffff0d;border-color:#ffffff1a;color:#eaeaea}:root.dark .share-image-generator{border-top-color:#ffffff1a}:root.dark .share-image-preview img{border-color:#ffffff1a}:root.dark .share-image-description{color:#aaa}:root.dark .share-native{border-bottom-color:#ffffff1a}.share-button-wrapper{cursor:pointer;display:inline-block}.share-button{align-items:center;background:linear-gradient(135deg,#667eea,#764ba2);border:none;border-radius:8px;color:#fff;cursor:pointer;display:inline-flex;font-size:14px;font-weight:600;gap:8px;padding:8px 16px;transition:all .3s ease;white-space:nowrap}.share-button:hover{background:linear-gradient(135deg,#5568d3,#653d91);box-shadow:0 4px 12px #667eea4d;transform:translateY(-2px)}.share-button:active{transform:translateY(0)}.share-button-icon{border-radius:50%;font-size:18px;height:40px;justify-content:center;padding:8px;width:40px}.share-button-text{background:#0000;color:#667eea;padding:4px 8px}.share-button-text:hover{background:#667eea1a;box-shadow:none;transform:none}.share-icon{font-size:16px}.share-text{font-size:14px}:root.dark .share-button{background:linear-gradient(135deg,#7c8ef5,#8b6fc7)}:root.dark .share-button:hover{background:linear-gradient(135deg,#6b7ee5,#7a5fb7)}:root.dark .share-button-text{color:#7c8ef5}:root.dark .share-button-text:hover{background:#7c8ef526}@media (max-width:768px){.share-button{font-size:13px;padding:6px 12px}.share-text{display:none}.share-button-icon{font-size:16px;height:36px;width:36px}}.artist-detail{min-height:100vh;padding:40px 0}.artist-header{background:#fffffff2;border-radius:12px;box-shadow:0 4px 6px #0000001a;margin-bottom:40px;padding:40px}.artist-profile{align-items:center;display:flex;gap:40px}.artist-avatar-large{background:linear-gradient(135deg,#667eea,#764ba2);border:6px solid #fff;border-radius:50%;box-shadow:0 8px 16px #0000001a;flex-shrink:0;height:200px;overflow:hidden;width:200px}.artist-avatar-large img{height:100%;object-fit:cover;width:100%}.placeholder-avatar-large{align-items:center;display:flex;font-size:80px;height:100%;justify-content:center;width:100%}.artist-info-large{flex:1 1}.artist-info-large h1{color:#333;font-size:36px;margin-bottom:20px}.artist-description-large{color:#666;font-size:18px;line-height:1.8}.songs-section{background:#fffffff2;border-radius:12px;box-shadow:0 4px 6px #0000001a;padding:30px}.songs-section h2{color:#333;font-size:28px;margin-bottom:30px}.songs-grid{grid-gap:24px;display:grid;gap:24px;grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}.song-card{background:#fff;border-radius:12px;box-shadow:0 4px 6px #0000001a;color:inherit;overflow:hidden;text-decoration:none;transition:transform .3s ease,box-shadow .3s ease}.song-card:hover{box-shadow:0 12px 24px #00000026;transform:translateY(-8px)}.song-cover{background:linear-gradient(135deg,#667eea,#764ba2);height:250px;overflow:hidden;width:100%}.song-cover img{height:100%;object-fit:cover;width:100%}.placeholder-cover{font-size:60px}.song-info{padding:20px}.song-info h3{color:#333;font-size:18px;margin-bottom:12px}.song-stats{color:#999;font-size:14px;gap:16px}.videos-section{margin-top:40px}.videos-section h2{margin-bottom:30px}.video-card-small{border-radius:12px;box-shadow:0 4px 6px #0000001a}.video-card-small:hover{box-shadow:0 12px 24px #00000026;transform:translateY(-8px)}.video-card-small-placeholder{font-size:48px}.video-card-small-info{padding:16px}.video-card-small-info h3{font-size:16px;margin-bottom:8px}.video-card-small-info p{color:#999;font-size:14px}@media (max-width:768px){.artist-profile{flex-direction:column;text-align:center}.artist-avatar-large{height:150px;width:150px}}:root.dark .artist-detail{background:var(--bg-gradient-dark)}:root.dark .artist-header{background:var(--bg-secondary);border:1px solid var(--border-color);box-shadow:var(--shadow-md)}:root.dark .artist-info-large h1{color:var(--text-primary)}:root.dark .artist-description-large{color:var(--text-secondary)}:root.dark .songs-section{background:var(--bg-secondary);border:1px solid var(--border-color);box-shadow:var(--shadow-md)}:root.dark .songs-section h2{color:var(--text-primary)}:root.dark .song-card{background:var(--bg-tertiary);border:1px solid var(--border-color)}:root.dark .song-card:hover{background:var(--bg-secondary);border-color:var(--primary-color);box-shadow:var(--shadow-lg)}.modal-overlay{align-items:center;background:#0009;display:flex;inset:0;justify-content:center;position:fixed;z-index:10001}.modal-content{background:#fff;border-radius:12px;box-shadow:0 10px 30px #00000040;padding:20px;position:relative;width:min(800px,92vw)}.modal-close{background:#dc3545;border:none;border-radius:50%;color:#fff;cursor:pointer;font-size:20px;height:32px;pointer-events:auto;position:absolute;right:10px;top:10px;transition:all .2s ease;width:32px;z-index:10002}.modal-close:hover{background:#c82333;transform:scale(1.1)}.modal-close:active{transform:scale(.95)}.modal-body{grid-gap:20px;display:grid;gap:20px;grid-template-columns:200px 1fr}.modal-cover{background:linear-gradient(135deg,#667eea,#764ba2);border-radius:12px;height:200px;overflow:hidden;width:200px}.modal-cover img{height:100%;object-fit:cover;width:100%}.modal-info h2{color:#333;margin:0 0 8px}.modal-artist{color:#666;margin:0 0 12px}.modal-mini{background:#fff;border-radius:12px;bottom:20px;box-shadow:0 10px 30px #00000040;left:50%;padding:12px;position:fixed;transform:translateX(-50%);width:min(90%,600px);z-index:1001}.modal-mini-header{grid-gap:10px;align-items:center;display:grid;gap:10px;grid-template-columns:56px 1fr auto}.mini-cover{background:linear-gradient(135deg,#667eea,#764ba2);border-radius:8px;height:56px;overflow:hidden;width:56px}.mini-cover img{height:100%;object-fit:cover;width:100%}.mini-placeholder{align-items:center;display:flex;height:100%;justify-content:center;width:100%}.mini-info{overflow:hidden}.mini-title{color:#333;font-weight:600}.mini-artist,.mini-title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mini-artist{color:#777;font-size:12px}.mini-actions{display:flex;gap:6px}.mini-player{margin-top:10px}@media (max-width:768px){.modal-overlay{align-items:flex-start;display:none!important;padding:80px 10px 20px;z-index:10001}.modal-content{max-height:calc(100vh - 100px);max-width:95vw;overflow-y:auto;padding:50px 15px 15px;position:relative;width:95vw}.modal-body{gap:15px;grid-template-columns:1fr;text-align:center}.modal-cover{height:250px;margin:0 auto;max-width:250px;width:100%}.modal-info h2{font-size:20px}.modal-artist{font-size:14px}.modal-close{box-shadow:0 2px 8px #0000004d;font-size:24px;height:36px;right:8px;top:8px;width:36px;z-index:10002}.modal-info button{font-size:14px;padding:12px;width:100%}}@media (max-width:480px){.modal-content{border-radius:0;max-height:100vh;max-width:100vw;padding:12px;width:100vw}.modal-cover{height:200px;max-width:200px}.modal-info h2{font-size:18px}}:root.dark .modal-content{background:var(--bg-secondary);border:1px solid var(--border-color);box-shadow:var(--shadow-xl)}:root.dark .modal-info h2{color:var(--text-primary)}:root.dark .modal-artist{color:var(--text-secondary)}:root.dark .modal-mini{background:var(--bg-secondary);border:1px solid var(--border-color);box-shadow:var(--shadow-xl)}:root.dark .mini-title{color:var(--text-primary)}:root.dark .mini-artist{color:var(--text-secondary)}.ap-overlay{align-items:center;background:#0009;display:flex;inset:0;justify-content:center;position:fixed;z-index:10001}.ap-modal{background:#fff;border-radius:12px;box-shadow:0 10px 30px #00000040;padding:20px;position:relative;width:min(560px,92vw)}.ap-close{background:#dc3545;border:none;border-radius:50%;box-shadow:0 2px 8px #0000004d;color:#fff;cursor:pointer;font-size:20px;height:32px;position:absolute;right:10px;top:10px;width:32px;z-index:10002}.ap-section{margin:10px 0 16px}.ap-empty{color:#666}.ap-list{display:flex;flex-direction:column;gap:10px;list-style:none;margin:0;padding:0}.ap-item{align-items:center;background:#f8f8f8;border-radius:8px;display:flex;justify-content:space-between;padding:10px 12px}.ap-name{color:#333;font-weight:600}.ap-meta{color:#777;font-size:12px}.ap-divider{background:#eee;height:1px;margin:16px 0}.ap-create input{border:1px solid #ddd;border-radius:8px;font-size:14px;padding:10px;width:100%}.ap-actions{display:flex;gap:8px;justify-content:flex-end;margin-top:10px}.ap-loading{color:#666}.ap-alert{border-radius:8px;font-size:14px;margin:10px 0;padding:10px 12px}.ap-error{background:#fff0f0;border:1px solid #f0caca;color:#a33}.ap-success{background:#f0fff3;border:1px solid #c8efda;color:#2a7}@media (max-width:768px){.ap-overlay{align-items:flex-start;padding:80px 10px 20px;z-index:10001}.ap-modal{max-height:calc(100vh - 100px);max-width:95vw;overflow-y:auto;padding:50px 15px 15px;position:relative;width:95vw}.ap-close{box-shadow:0 2px 8px #0000004d;font-size:24px;height:36px;right:8px;top:8px;width:36px;z-index:10002}.ap-item{align-items:flex-start;flex-direction:column;gap:10px}.ap-item button{width:100%}.ap-actions{flex-direction:column}.ap-actions button{width:100%}}@media (max-width:480px){.ap-overlay{align-items:flex-start;padding:72px 0 0;z-index:10001}.ap-modal{border-radius:12px 12px 0 0;max-height:calc(100vh - 72px);max-width:100%;padding:50px 12px 12px;width:100%}.ap-item{padding:12px 10px}.ap-name{font-size:14px}.ap-meta{font-size:11px}}:root.dark .ap-modal{background:var(--bg-secondary);border:1px solid var(--border-color);box-shadow:var(--shadow-xl)}:root.dark .ap-empty{color:var(--text-secondary)}:root.dark .ap-item{background:var(--bg-tertiary);border:1px solid var(--border-color)}:root.dark .ap-name{color:var(--text-primary)}:root.dark .ap-meta{color:var(--text-secondary)}:root.dark .ap-divider{background:var(--border-color)}:root.dark .ap-create input{background:var(--bg-primary);border-color:var(--border-color);color:var(--text-primary)}:root.dark .ap-create input:focus{border-color:var(--primary-color);box-shadow:0 0 0 3px #7c8ef51a;outline:none}:root.dark .ap-loading{color:var(--text-secondary)}:root.dark .ap-error{background:#ef44441a;border-color:var(--error);color:var(--error)}:root.dark .ap-success{background:#10b9811a;border-color:var(--success);color:var(--success)}.comment-thread{margin-bottom:20px}.comment-item{background:var(--bg-primary,#fff);border-left:4px solid var(--primary-color,#667eea);box-shadow:var(--shadow-sm,0 2px 4px #0000000d);padding:16px;transition:box-shadow .2s ease}.comment-item:hover{box-shadow:0 4px 12px #0000001a;box-shadow:var(--shadow-md,0 4px 12px #0000001a)}.comment-header{align-items:flex-start;flex-wrap:wrap;gap:8px;margin-bottom:12px}.comment-author{align-items:center;display:flex;flex:1 1;gap:10px}.comment-avatar{border:2px solid #0000001a;border:2px solid var(--border-color,#0000001a);border-radius:50%;height:36px;object-fit:cover;width:36px}.comment-author-info{align-items:center;display:flex;gap:6px}.comment-author-info strong{color:#1a1a1a;color:var(--text-primary,#1a1a1a);font-size:15px;font-weight:600}.verified-badge-small{align-items:center;background:linear-gradient(135deg,#10b981,#059669);border-radius:50%;box-shadow:0 2px 4px #10b9814d;color:#fff;display:inline-flex;font-size:10px;height:16px;justify-content:center;width:16px}.comment-meta{align-items:center;display:flex;flex-wrap:wrap;gap:8px}.comment-date{color:#666;color:var(--text-secondary,#666);font-size:13px}.comment-edited{color:#999;color:var(--text-tertiary,#999);font-size:12px;font-style:italic}.comment-content{word-wrap:break-word;color:#1a1a1a;color:var(--text-primary,#1a1a1a);margin-bottom:12px;white-space:pre-wrap}.comment-pending{background:#fbbf241a;border-left:3px solid #f59e0b;color:#92400e}.comment-pending,.comment-rejected{border-radius:4px;font-size:13px;margin-bottom:12px;padding:8px 12px}.comment-rejected{background:#ef44441a;border-left:3px solid #ef4444;color:#991b1b}.comment-spam{background:#8b5cf61a;border-left:3px solid #8b5cf6;border-radius:4px;color:#6b21a8;padding:8px 12px}.comment-message,.comment-spam{font-size:13px;margin-bottom:12px}.comment-message{animation:slideDown .3s ease;border-radius:6px;padding:10px 12px}.comment-message.message-success{background:#10b9811a;border-left:3px solid #10b981;color:#065f46}.comment-message.message-error{background:#ef44441a;border-left:3px solid #ef4444;color:#991b1b}.comment-message.message-warning{background:#fbbf241a;border-left:3px solid #f59e0b;color:#92400e}.comment-actions{border-top:1px solid #0000000d;border-top:1px solid var(--border-color-light,#0000000d);display:flex;flex-wrap:wrap;gap:12px;margin-top:12px;padding-top:12px}.comment-action-btn{align-items:center;background:#0000;border:none;border-radius:4px;color:#666;color:var(--text-secondary,#666);cursor:pointer;display:flex;font-size:13px;gap:4px;padding:4px 8px;transition:all .2s ease}.comment-action-btn:hover{background:#f8f9fa;background:var(--bg-secondary,#f8f9fa);color:#667eea;color:var(--primary-color,#667eea)}.comment-delete-btn:hover{background:#ef44441a;color:#ef4444;color:var(--error,#ef4444)}.comment-edit-form,.comment-reply-form{background:#f8f9fa;background:var(--bg-secondary,#f8f9fa);border-radius:8px;margin-top:12px;padding:12px}.comment-edit-textarea,.comment-reply-textarea{background:#fff;background:var(--bg-primary,#fff);border:1px solid #0000001a;border:1px solid var(--border-color,#0000001a);border-radius:6px;color:#1a1a1a;color:var(--text-primary,#1a1a1a);font-family:inherit;font-size:14px;min-height:60px;padding:10px;resize:vertical;width:100%}.comment-edit-textarea:focus,.comment-reply-textarea:focus{border-color:#667eea;border-color:var(--primary-color,#667eea);box-shadow:0 0 0 3px #667eea1a;outline:none}.comment-edit-actions,.comment-reply-actions{display:flex;gap:8px;margin-top:8px}.comment-replies{border-left:2px solid #0000000d;border-left:2px solid var(--border-color-light,#0000000d);margin-left:24px;margin-top:16px;padding-left:20px}.comment-replies .comment-item{background:#f8f9fa;background:var(--bg-secondary,#f8f9fa);border-left-color:#764ba2;border-left-color:var(--secondary-color,#764ba2)}.comment-replies .comment-replies{border-left-color:#0000000d;border-left-color:var(--border-color-light,#0000000d);margin-left:16px}:root.dark .comment-item{background:#181b34;background:var(--bg-secondary,#181b34);border-left-color:#7c8ef5}:root.dark .comment-pending{background:#fbbf2426;color:#fcd34d}:root.dark .comment-rejected{background:#ef444426;color:#fca5a5}:root.dark .comment-spam{background:#8b5cf626;color:#c4b5fd}:root.dark .comment-message.message-success{background:#10b98126;color:#6ee7b7}:root.dark .comment-message.message-error{background:#ef444426;color:#fca5a5}:root.dark .comment-message.message-warning{background:#fbbf2426;color:#fcd34d}:root.dark .comment-author-info strong,:root.dark .comment-content{color:#eaeaea;color:var(--text-primary,#eaeaea)}:root.dark .comment-edit-form,:root.dark .comment-reply-form{background:#1a1d3a;background:var(--bg-tertiary,#1a1d3a)}:root.dark .comment-edit-textarea,:root.dark .comment-reply-textarea{background:#0f1226;background:var(--bg-primary,#0f1226);border-color:#ffffff1a;color:#eaeaea;color:var(--text-primary,#eaeaea)}:root.dark .comment-replies .comment-item{background:#1a1d3a;background:var(--bg-tertiary,#1a1d3a)}@media (max-width:768px){.comment-replies{margin-left:12px;padding-left:12px}.comment-actions{gap:8px}.comment-action-btn{font-size:12px;padding:3px 6px}}.song-detail{min-height:100vh;padding:40px 0}.back-link{color:#fff;font-weight:500;margin-bottom:30px;transition:opacity .3s ease}.back-link:hover{opacity:.8}.song-header{grid-gap:40px;background:#fffffff2;border-radius:12px;box-shadow:0 4px 6px #0000001a;display:grid;gap:40px;grid-template-columns:300px 1fr;margin-bottom:40px;padding:30px}.song-cover-large{background:linear-gradient(135deg,#667eea,#764ba2);border-radius:8px;height:300px;overflow:hidden;width:100%}.song-cover-large img{height:100%;object-fit:cover;width:100%}.placeholder-cover-large{font-size:100px}.song-info-large h1{color:#333;font-size:36px;margin-bottom:15px}.artist-link{color:#667eea;display:inline-block;font-size:18px;font-weight:500;margin-bottom:20px;text-decoration:none}.artist-link:hover{text-decoration:underline}.song-actions{gap:15px;margin-bottom:30px}.dislike-btn,.like-btn{align-items:center;background:#fff;border:2px solid #e0e0e0;border-radius:8px;cursor:pointer;display:flex;font-size:16px;font-weight:600;gap:8px;padding:12px 24px;transition:all .3s ease}.like-btn:hover{background:#f0f4ff;border-color:#667eea}.dislike-btn:hover{background:#fff0f0;border-color:#e74c3c}.like-btn.active{background:linear-gradient(135deg,#667eea,#764ba2);border-color:#667eea;color:#fff}.dislike-btn.active{background:#e74c3c;border-color:#e74c3c;color:#fff}.song-description{margin-top:20px}.song-description h3{color:#333;font-size:20px;margin-bottom:10px}.song-description p{color:#666;line-height:1.6}.audio-section,.comments-section,.lyrics-section{background:#fffffff2;border-radius:12px;box-shadow:0 4px 6px #0000001a;margin-bottom:30px;padding:30px}.audio-section h2,.comments-section h2,.lyrics-section h2{color:#333;font-size:28px;margin-bottom:20px}.lyrics-content{background:#f8f9fa;border-left:4px solid #667eea;border-radius:8px;padding:20px}.lyrics-content pre{word-wrap:break-word;color:#333;font-family:inherit;font-size:16px;line-height:1.8;margin:0;white-space:pre-wrap}.videos-section{background:#fffffff2;border-radius:12px;box-shadow:0 4px 6px #0000001a;margin-bottom:30px;padding:30px}.videos-section h2{color:#333;font-size:28px;margin-bottom:20px}.videos-grid{grid-gap:20px;gap:20px;grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}.video-card-small{background:#fff;border-radius:8px;box-shadow:0 2px 4px #0000001a;color:inherit;display:flex;flex-direction:column;overflow:hidden;text-decoration:none;transition:transform .3s ease,box-shadow .3s ease}.video-card-small:hover{box-shadow:0 4px 12px #00000026;transform:translateY(-4px)}.video-card-small-thumbnail{background:linear-gradient(135deg,#667eea,#764ba2);overflow:hidden;padding-bottom:56.25%;position:relative;width:100%}.video-card-small-thumbnail img{height:100%;left:0;object-fit:cover;position:absolute;top:0;width:100%}.video-card-small-placeholder{align-items:center;color:#fff;display:flex;font-size:32px;height:100%;justify-content:center;left:0;opacity:.7;position:absolute;top:0;width:100%}.video-card-small-badge{background:red;border-radius:4px;color:#fff;font-size:10px;font-weight:600;padding:4px 8px;position:absolute;right:8px;text-transform:uppercase;top:8px}.video-card-small-info{padding:12px}.video-card-small-info h3{-webkit-line-clamp:2;-webkit-box-orient:vertical;color:#333;display:-webkit-box;font-size:14px;font-weight:600;margin:0 0 4px;overflow:hidden}.video-card-small-info p{color:#666;font-size:12px;margin:0}.comment-form{background:#f8f9fa;background:var(--bg-secondary,#f8f9fa);border-radius:8px;margin-bottom:30px;padding:20px}:root.dark .comment-form{background:#181b34;background:var(--bg-secondary,#181b34)}.message-success{background:#10b9811a;border-left:4px solid #10b981}.message-error{background:#ef44441a;border-left:4px solid #ef4444}.message-warning{background:#fbbf241a;border-left:4px solid #f59e0b;color:#92400e}:root.dark .message-success{background:#10b98126;color:#6ee7b7}:root.dark .message-error{background:#ef444426;color:#fca5a5}:root.dark .message-warning{background:#fbbf2426;color:#fcd34d}.comments-list{display:flex;flex-direction:column;gap:20px}.comment-item{background:#fff;border-left:4px solid #667eea;border-radius:8px;box-shadow:0 2px 4px #0000000d;padding:20px}.comment-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:10px}.comment-header strong{color:#333;font-size:16px}.comment-date{color:#999;font-size:14px}.comment-content{color:#666;line-height:1.6}.no-comments{color:#999}.error,.no-comments{font-size:18px;padding:40px;text-align:center}.error{background:#e74c3ce6;border-radius:12px;color:#fff}.audio-actions{align-items:center;display:flex;flex-wrap:wrap;gap:10px;margin-bottom:10px}.song-item-stats{color:#666}@media (max-width:768px){.song-detail{padding:20px 0}.back-link{font-size:14px;margin-bottom:20px}.song-header{gap:20px;grid-template-columns:1fr;margin-bottom:20px;padding:20px}.song-cover-large{height:250px;margin:0 auto;max-width:100%}.placeholder-cover-large{font-size:80px}.song-info-large{text-align:center}.song-info-large h1{font-size:24px;margin-bottom:10px}.artist-link{font-size:16px;margin-bottom:15px}.song-actions{flex-wrap:wrap;gap:10px;justify-content:center;margin-bottom:20px}.dislike-btn,.like-btn{flex:1 1;font-size:14px;justify-content:center;min-width:120px;padding:10px 18px}.song-description{margin-top:15px}.song-description h3{font-size:18px}.song-description p{font-size:14px}.audio-section,.comments-section,.lyrics-section{margin-bottom:20px;padding:20px 15px}.audio-section h2,.comments-section h2,.lyrics-section h2{font-size:22px;margin-bottom:15px}.audio-actions{align-items:stretch;flex-direction:column}.audio-actions .btn{font-size:14px;padding:12px;text-align:center;width:100%}.lyrics-content{padding:15px}.lyrics-content pre{font-size:14px;line-height:1.6}.comment-form{margin-bottom:20px;padding:15px}.comment-item{padding:15px}.comment-header{align-items:flex-start;flex-direction:column;gap:5px}.comment-header strong{font-size:15px}.comment-date{font-size:12px}.comment-content{font-size:14px}.no-comments{font-size:16px;padding:30px 20px}}@media (max-width:480px){.song-detail{padding:15px 0}.container{padding:0 10px}.back-link{font-size:13px;margin-bottom:15px}.song-header{gap:15px;padding:15px}.song-cover-large{height:200px}.placeholder-cover-large{font-size:60px}.song-info-large h1{font-size:20px}.artist-link{font-size:14px}.song-item-stats{font-size:12px;gap:10px;justify-content:center}.song-actions{gap:8px}.dislike-btn,.like-btn{font-size:13px;min-width:100px;padding:8px 14px}.audio-section,.comments-section,.lyrics-section{padding:15px 12px}.audio-section h2,.comments-section h2,.lyrics-section h2{font-size:20px}.audio-actions .btn{font-size:13px;padding:10px}.lyrics-content{padding:12px}.lyrics-content pre{font-size:13px}.comment-form{padding:12px}.comment-form input,.comment-form textarea{font-size:14px;padding:10px}.comment-item{padding:12px}.comment-header strong{font-size:14px}.comment-date{font-size:11px}.comment-content{font-size:13px}}:root.dark .song-detail{background:var(--bg-gradient-dark)}:root.dark .back-link{color:var(--text-primary)}:root.dark .song-header{background:var(--bg-secondary);border:1px solid var(--border-color);box-shadow:var(--shadow-md)}:root.dark .song-info-large h1{color:var(--text-primary)}:root.dark .artist-link{color:var(--primary-color)}:root.dark .dislike-btn,:root.dark .like-btn{background:var(--bg-secondary);border-color:var(--border-color);color:var(--text-primary)}:root.dark .like-btn:hover{background:var(--bg-tertiary);border-color:var(--primary-color)}:root.dark .dislike-btn:hover{background:var(--bg-tertiary);border-color:var(--error)}:root.dark .song-stats{background:var(--bg-secondary);border:1px solid var(--border-color)}:root.dark .song-stats h3{color:var(--text-primary)}:root.dark .stat-item{color:var(--text-secondary)}:root.dark .comments-section,:root.dark .lyrics-section{background:var(--bg-secondary);border:1px solid var(--border-color)}:root.dark .comments-section h2,:root.dark .lyrics-section h2{color:var(--text-primary)}:root.dark .lyrics-content{color:var(--text-secondary)}:root.dark .comment-form{background:var(--bg-tertiary);border:1px solid var(--border-color)}:root.dark .comment-form input,:root.dark .comment-form textarea{background:var(--bg-primary);border-color:var(--border-color);color:var(--text-primary)}:root.dark .comment-form input:focus,:root.dark .comment-form textarea:focus{border-color:var(--primary-color);box-shadow:0 0 0 3px #7c8ef51a;outline:none}:root.dark .comment-item{background:var(--bg-tertiary);border-color:var(--border-color)}:root.dark .comment-header strong{color:var(--text-primary)}:root.dark .comment-content,:root.dark .comment-date{color:var(--text-secondary)}.publish-song{min-height:100vh;padding:40px 0}.publish-form-container{background:#fffffff2;border-radius:12px;box-shadow:0 4px 6px #0000001a;margin:0 auto;max-width:800px;padding:40px}.publish-form-container h1{color:#333;font-size:32px;margin-bottom:30px;text-align:center}.publish-form{display:flex;flex-direction:column}.upload-status{color:#667eea;font-size:14px;font-style:italic;margin-bottom:8px;margin-top:8px}.upload-success{color:#28a745;font-size:14px;font-weight:500;margin-top:8px}.upload-progress-container{margin-top:12px;width:100%}.upload-progress-bar{background-color:#e0e0e0;border-radius:4px;height:8px;margin:8px 0;overflow:hidden;width:100%}.upload-progress-fill{animation:pulse 2s ease-in-out infinite;background:linear-gradient(90deg,#667eea,#764ba2);border-radius:4px;height:100%;transition:width .3s ease}.upload-progress-text{color:#667eea;font-size:12px;font-weight:500;margin-top:4px;text-align:center}[data-theme=dark] .upload-progress-bar{background-color:#333}[data-theme=dark] .upload-progress-text,[data-theme=dark] .upload-status{color:#8b9aff}.image-preview{border-radius:8px;box-shadow:0 2px 8px #0000001a;max-width:300px;overflow:hidden}.image-preview img{display:block;height:auto;width:100%}.btn-large{font-size:18px;margin-top:20px;padding:16px 32px}.btn:disabled{cursor:not-allowed;opacity:.6}.form-select{background:#fff;border:1px solid #ddd;border-radius:8px;color:#333;cursor:pointer;font-size:1rem;padding:12px;transition:all .3s;width:100%}.form-select:focus{box-shadow:0 0 0 3px #667eea1a;outline:none}.form-select:focus,.form-select:hover{border-color:#667eea}.limit-warning{background:#fff3cd;border:2px solid #ffc107;border-radius:8px;color:#856404;margin:30px 0;padding:30px;text-align:center}.limit-warning p:first-child{font-size:20px;margin-bottom:15px}.loading-message{color:#667eea;font-size:16px;padding:40px;text-align:center}.limit-warning p{font-size:14px;line-height:1.5;margin:8px 0}.limit-warning p:first-child{font-size:16px;margin-bottom:12px}.whatsapp-link{background:#25d366;border-radius:8px;box-shadow:0 2px 8px #25d3664d;color:#fff;display:inline-block;font-size:15px;font-weight:600;margin-top:15px;padding:12px 20px;text-decoration:none;transition:background .3s,transform .2s}.whatsapp-link:hover{background:#20ba5a;box-shadow:0 4px 12px #25d36666;transform:translateY(-2px)}.whatsapp-link:active{transform:translateY(0)}.limit-info{background:#e7f3ff;border:2px solid #3498db;border-radius:8px;color:#004085;margin:20px 0;padding:15px}.limit-info p{font-size:14px;margin:0}:root.dark .publish-song{background:var(--bg-gradient-dark)}:root.dark .publish-form-container{background:var(--bg-secondary);border:1px solid var(--border-color);box-shadow:var(--shadow-md)}:root.dark .form-select,:root.dark .publish-form-container h1{color:var(--text-primary)}:root.dark .form-select{background:var(--bg-primary);border-color:var(--border-color)}:root.dark .form-select:focus{border-color:var(--primary-color);box-shadow:0 0 0 3px #7c8ef51a}:root.dark .limit-warning{background:#ffc1071a;border-color:var(--warning);color:var(--warning)}:root.dark .limit-info{background:#3498db1a;border-color:var(--info);color:var(--info)}:root.dark .loading-message{color:var(--primary-color)}@media (max-width:768px){.publish-form-container{padding:20px}.publish-form-container h1{font-size:24px}}.publish-album-container{background:linear-gradient(135deg,#f5f7fa,#c3cfe2);min-height:calc(100vh - 200px);padding:40px 20px}.publish-album-header{margin-bottom:40px;text-align:center}.publish-album-header h1{color:#2c3e50;font-size:2.5rem;margin-bottom:10px}.publish-album-header p{color:#666;font-size:1.1rem}.publish-album-form{background:#fff;border-radius:16px;box-shadow:0 10px 40px #0000001a;margin:0 auto;max-width:800px;padding:40px}.form-section h3{border-bottom:2px solid #e0e0e0;color:#2c3e50;font-size:1.5rem}.form-group input[type=date],.form-group input[type=text],.form-group textarea{border:2px solid #e0e0e0;border-radius:8px;font-size:1rem;padding:12px;transition:border-color .3s;width:100%}.checkbox-label{gap:10px}.checkbox-label input[type=checkbox]{height:20px;width:20px}.cover-image-upload{text-align:center}.cover-preview{align-items:center;background:#f9f9f9;border:3px dashed #e0e0e0;border-radius:12px;display:flex;height:300px;justify-content:center;margin:0 auto 20px;overflow:hidden;width:300px}.cover-preview img{height:100%;object-fit:cover;width:100%}.cover-placeholder{color:#999;text-align:center}.cover-placeholder span{display:block;font-size:4rem;margin-bottom:10px}.upload-btn{background:linear-gradient(135deg,#667eea,#764ba2);border:none;border-radius:8px;color:#fff;cursor:pointer;display:inline-block;font-weight:600;padding:12px 24px;transition:transform .2s,box-shadow .2s}.upload-btn:hover{box-shadow:0 4px 12px #667eea66;transform:translateY(-2px)}.upload-btn:active{transform:translateY(0)}.form-actions{justify-content:center}:root.dark .publish-album-container{background:var(--bg-gradient-dark)}:root.dark .publish-album-header h1{color:var(--text-primary)}:root.dark .publish-album-header p{color:var(--text-secondary)}:root.dark .publish-album-form{background:var(--bg-secondary);border:1px solid var(--border-color);box-shadow:var(--shadow-md)}:root.dark .form-section h3{border-bottom-color:var(--border-color);color:var(--text-primary)}:root.dark .form-group input[type=date],:root.dark .form-group input[type=text],:root.dark .form-group textarea{background:var(--bg-primary);border-color:var(--border-color);color:var(--text-primary)}:root.dark .form-group input:focus,:root.dark .form-group textarea:focus{border-color:var(--primary-color);box-shadow:0 0 0 3px #7c8ef51a;outline:none}:root.dark .cover-preview{background:var(--bg-tertiary);border-color:var(--border-color)}:root.dark .cover-placeholder{color:var(--text-secondary)}@media (max-width:768px){.publish-album-form{padding:20px}.form-row{grid-template-columns:1fr}.cover-preview{height:250px;width:250px}}.albums-container{background:linear-gradient(135deg,#f5f7fa,#c3cfe2);min-height:calc(100vh - 200px);padding:40px 20px}.albums-header{margin-bottom:40px;text-align:center}.albums-header h1{color:#2c3e50;font-size:2.5rem;margin-bottom:10px}.albums-header p{color:#666;font-size:1.1rem}.albums-grid{grid-gap:30px;display:grid;gap:30px;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));margin-top:30px}.album-card{background:#fff;border-radius:12px;box-shadow:0 4px 12px #0000001a;color:inherit;overflow:hidden;text-decoration:none;transition:transform .3s,box-shadow .3s}.album-card:hover{box-shadow:0 8px 24px #00000026;transform:translateY(-5px)}.album-cover{align-items:center;background:linear-gradient(135deg,#667eea,#764ba2);display:flex;height:250px;justify-content:center;overflow:hidden;width:100%}.album-cover img{height:100%;object-fit:cover;width:100%}.album-placeholder{color:#fff;font-size:5rem;opacity:.8}.album-info{padding:20px}.album-info h3{color:#2c3e50;font-size:1.3rem;margin-bottom:8px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.album-artist{color:#667eea;font-size:.95rem;font-weight:600;margin-bottom:10px}.album-meta{color:#666;display:flex;font-size:.85rem;justify-content:space-between}.empty-state{color:#666}.loading{color:#667eea}.error-message,.loading{font-size:1.2rem;padding:60px 20px}:root.dark .albums-container{background:var(--bg-gradient-dark)}:root.dark .albums-header h1{color:var(--text-primary)}:root.dark .albums-header p{color:var(--text-secondary)}:root.dark .album-card{background:var(--bg-secondary);border:1px solid var(--border-color);box-shadow:var(--shadow-md)}:root.dark .album-card:hover{border-color:var(--primary-color);box-shadow:var(--shadow-xl)}:root.dark .album-info h3{color:var(--text-primary)}:root.dark .album-artist{color:var(--primary-color)}:root.dark .album-meta,:root.dark .empty-state{color:var(--text-secondary)}:root.dark .loading{color:var(--primary-color)}@media (max-width:768px){.albums-grid{gap:20px;grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}.album-cover{height:200px}}.album-detail-container{background:linear-gradient(135deg,#f5f7fa,#c3cfe2);min-height:calc(100vh - 200px);padding:40px 20px}.album-detail-header{grid-gap:40px;background:#fff;border-radius:16px;box-shadow:0 4px 12px #0000001a;display:grid;gap:40px;grid-template-columns:300px 1fr;margin-bottom:40px;padding:40px}.album-cover-large{align-items:center;background:linear-gradient(135deg,#667eea,#764ba2);border-radius:12px;display:flex;height:300px;justify-content:center;overflow:hidden;width:100%}.album-cover-large img{height:100%;object-fit:cover;width:100%}.album-placeholder-large{color:#fff;font-size:6rem;opacity:.8}.album-detail-info h1{color:#2c3e50;font-size:2.5rem;margin-bottom:10px}.album-artist-link{color:#667eea;display:inline-block;font-size:1.2rem;font-weight:600;margin-bottom:15px;text-decoration:none}.album-artist-link:hover{text-decoration:underline}.album-description{color:#666;font-size:1rem;line-height:1.6;margin-bottom:20px}.album-meta-info{display:flex;flex-wrap:wrap;gap:15px;margin-bottom:20px}.meta-tag{background:#f0f0f0;border-radius:20px;color:#666;font-size:.9rem;padding:6px 12px}.album-actions{margin-top:20px}.album-songs-section{background:#fff;border-radius:16px;box-shadow:0 4px 12px #0000001a;padding:30px}.album-songs-section h2{color:#2c3e50;font-size:1.8rem;margin-bottom:20px}.song-item{grid-gap:20px;background:#f9f9f9;display:grid;grid-template-columns:40px 80px 1fr auto;transition:background .2s}.song-item:hover{background:#f0f0f0}.song-number{color:#667eea;font-size:1.1rem}.song-cover-small{align-items:center;background:linear-gradient(135deg,#667eea,#764ba2);display:flex;height:80px;justify-content:center;width:80px}.song-placeholder-small{color:#fff;font-size:2rem;opacity:.8}.song-info h4{color:#2c3e50;margin-bottom:5px}.song-stats{color:#666}.no-audio{color:#999;font-size:.9rem;font-style:italic}.empty-songs{background:#fff;border-radius:16px;color:#666;padding:60px 20px;text-align:center}.error-message,.loading{font-size:1.2rem;padding:60px 20px;text-align:center}.error-message{color:#e74c3c}@media (max-width:768px){.album-detail-header{grid-template-columns:1fr;text-align:center}.album-cover-large{margin:0 auto;max-width:300px;width:100%}.song-item{gap:10px;grid-template-columns:30px 60px 1fr}.song-actions{grid-column:1/-1;justify-content:center;margin-top:10px}}:root.dark .album-detail-container{background:var(--bg-gradient-dark)}:root.dark .album-detail-header{background:var(--bg-secondary);border:1px solid var(--border-color);box-shadow:var(--shadow-md)}:root.dark .album-detail-info h1{color:var(--text-primary)}:root.dark .album-artist-link{color:var(--primary-color)}:root.dark .album-description,:root.dark .meta-tag{color:var(--text-secondary)}:root.dark .meta-tag{background:var(--bg-tertiary);border:1px solid var(--border-color)}:root.dark .album-songs-section{background:var(--bg-secondary);border:1px solid var(--border-color);box-shadow:var(--shadow-md)}:root.dark .album-songs-section h2{color:var(--text-primary)}.auth-page{align-items:center;background:linear-gradient(135deg,#667eea,#764ba2);display:flex;justify-content:center;min-height:100vh;overflow:hidden;padding:20px;position:relative}.auth-page:before{animation:float 20s linear infinite;background:radial-gradient(circle,#ffffff1a 1px,#0000 0);background-size:50px 50px;content:"";height:200%;left:-50%;pointer-events:none;position:absolute;top:-50%;width:200%}@keyframes float{0%{transform:translate(0) rotate(0deg)}to{transform:translate(-50px,-50px) rotate(1turn)}}.auth-container{animation:slideUp .5s ease-out;background:#fff;border-radius:20px;box-shadow:0 20px 60px #0000004d;max-width:480px;padding:40px;position:relative;width:100%;z-index:1}@keyframes slideUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.auth-header{margin-bottom:30px;text-align:center}.auth-container h1{-webkit-text-fill-color:#0000;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;background-clip:text;color:#333;font-size:2em;font-weight:700;margin:0 0 8px}.auth-subtitle{color:#666;font-size:15px;font-weight:400;margin:0}.auth-form{display:flex;flex-direction:column;gap:20px}.form-group label{align-items:center;display:flex;gap:5px}.form-group input[type=email],.form-group input[type=password],.form-group input[type=tel],.form-group input[type=text],.form-group textarea{background:#f8f9fa;border:2px solid #e0e0e0;border-radius:10px;color:#333;font-family:inherit;font-size:16px;padding:14px 16px;transition:all .3s ease}.form-group input:focus,.form-group textarea:focus{background:#fff;border-color:#667eea;box-shadow:0 0 0 4px #667eea1a;outline:none}.form-group input::placeholder,.form-group textarea::placeholder{color:#999}.form-group small{color:#666}.login-method-selector{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:4px}.method-option{-webkit-tap-highlight-color:transparent;align-items:center;background:#f8f9fa;border:2px solid #e0e0e0;border-radius:12px;cursor:pointer;display:flex;flex:1 1;font-weight:500;gap:8px;justify-content:center;min-width:120px;padding:12px 20px;position:relative;touch-action:manipulation;transition:all .3s ease}.method-option:hover{background:#f0f2ff;border-color:#667eea;transform:translateY(-1px)}.method-option input[type=radio]{accent-color:#667eea;cursor:pointer;height:18px;margin:0;opacity:0;pointer-events:none;position:absolute;width:18px}.method-option span{align-items:center;color:#333;display:flex;font-size:14px;gap:6px;transition:color .3s ease}.method-option.active{background:linear-gradient(135deg,#667eea,#764ba2);border-color:#667eea;box-shadow:0 4px 12px #667eea4d;color:#fff}.method-option.active span{color:#fff}.method-option:active{transform:scale(.98)}.message{animation:slideDown .3s ease-out;border-radius:10px;font-size:14px;padding:14px 18px}@keyframes slideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.message-success{background:#10b981;border-left:4px solid #059669;color:#fff}.message-error{background:#ef4444;border-left:4px solid #dc2626;color:#fff}.btn-primary.btn-large{background:linear-gradient(135deg,#667eea,#764ba2);border:none;border-radius:10px;box-shadow:0 4px 15px #667eea66;color:#fff;cursor:pointer;font-size:18px;font-weight:600;margin-top:10px;padding:16px 24px;transition:all .3s ease}.btn-primary.btn-large:hover:not(:disabled){box-shadow:0 6px 20px #667eea80;transform:translateY(-2px)}.btn-primary.btn-large:active:not(:disabled){transform:translateY(0)}.btn-primary.btn-large:disabled{cursor:not-allowed;opacity:.6}.auth-link{color:#666;font-size:14px;margin-top:24px;text-align:center}.auth-link a{color:#667eea;font-weight:600;text-decoration:none;transition:color .3s ease}.auth-link a:hover{color:#764ba2;text-decoration:underline}:root.dark .auth-page{background:linear-gradient(135deg,#1a1a2e,#16213e)}:root.dark .auth-container{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#141928f2;border:1px solid #ffffff1a}:root.dark .auth-container h1{-webkit-text-fill-color:#0000;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;background-clip:text;color:var(--text-primary)}:root.dark .auth-subtitle{color:var(--text-secondary)}:root.dark .form-group input[type=email],:root.dark .form-group input[type=password],:root.dark .form-group input[type=tel],:root.dark .form-group input[type=text],:root.dark .form-group textarea{background:#ffffff0d;border-color:#ffffff1a;color:var(--text-primary)}:root.dark .form-group input:focus,:root.dark .form-group textarea:focus{background:#ffffff14;border-color:#667eea;box-shadow:0 0 0 4px #667eea33}:root.dark .form-group input::placeholder,:root.dark .form-group textarea::placeholder{color:#fff6}:root.dark .form-group small{color:var(--text-secondary)}:root.dark .method-option{background:#ffffff0d;border-color:#ffffff1a}:root.dark .method-option span{color:var(--text-primary)}:root.dark .method-option:hover{background:#667eea1a;border-color:#667eea}:root.dark .method-option.active{background:linear-gradient(135deg,#667eea,#764ba2);border-color:#667eea}:root.dark .method-option.active span{color:#fff}:root.dark .message-success{background:#059669;border-left-color:#047857}:root.dark .message-error{background:#dc2626;border-left-color:#b91c1c}:root.dark .auth-link{color:var(--text-secondary)}:root.dark .auth-link a{color:#8b9aff}:root.dark .auth-link a:hover{color:#a5b4fc}@media (max-width:768px){.auth-page{min-height:calc(100vh - 140px);padding:15px}.auth-container{border-radius:16px;box-shadow:0 10px 40px #0003;max-width:100%;padding:30px 24px;width:100%}.auth-header{margin-bottom:24px}.auth-container h1{font-size:1.75em;margin-bottom:8px}.auth-subtitle{font-size:14px}.auth-form{gap:18px}.form-group{gap:8px}.form-group label{font-size:14px}.form-group input[type=email],.form-group input[type=password],.form-group input[type=tel],.form-group input[type=text],.form-group textarea{-webkit-appearance:none;appearance:none;border-radius:12px;font-size:16px;padding:14px 16px}.form-group textarea{min-height:100px;resize:vertical}.form-group small{font-size:11px;line-height:1.4;margin-top:4px}.btn-primary.btn-large{-webkit-tap-highlight-color:rgba(102,126,234,.3);border-radius:12px;font-size:16px;font-weight:600;margin-top:8px;padding:16px 24px;touch-action:manipulation;width:100%}.login-method-selector{flex-direction:row;flex-wrap:wrap;gap:10px}.method-option{-webkit-tap-highlight-color:rgba(102,126,234,.2);flex:1 1;font-size:14px;min-height:44px;min-width:calc(50% - 5px);padding:12px 16px;touch-action:manipulation}.message{border-radius:12px;font-size:13px;margin-bottom:16px;padding:12px 16px}.auth-link{font-size:14px;margin-top:20px;padding:0 4px}.auth-link a{display:inline-block;font-weight:600;padding:4px 0}}@media (max-width:480px){.auth-page{min-height:calc(100vh - 120px);padding:12px}.auth-container{border-radius:16px;padding:24px 20px}.auth-header{margin-bottom:20px}.auth-container h1{font-size:1.5em;margin-bottom:6px}.auth-subtitle{font-size:13px}.auth-form{gap:16px}.form-group{gap:6px}.form-group label{font-size:13px}.form-group input[type=email],.form-group input[type=password],.form-group input[type=tel],.form-group input[type=text],.form-group textarea{border-radius:10px;font-size:16px;padding:12px 14px}.form-group textarea{min-height:90px}.form-group small{font-size:10px}.btn-primary.btn-large{font-size:15px;padding:14px 20px}.login-method-selector{flex-direction:column;gap:8px}.method-option{font-size:13px;min-height:44px;min-width:100%;padding:12px 14px;width:100%}.message{font-size:12px;margin-bottom:14px;padding:10px 14px}.auth-link{font-size:13px;margin-top:18px}}.form-group input:focus-visible,.form-group textarea:focus-visible{outline:2px solid #667eea;outline-offset:2px}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.btn-primary.btn-large:disabled{animation:pulse 2s infinite}.search-page{padding:30px 20px}.search-title{color:var(--text-primary);margin-bottom:12px}.search-subtitle{color:var(--text-secondary)}.search-error{color:var(--error);margin-bottom:20px}.search-header{align-items:center;display:flex;flex-wrap:wrap;gap:15px;justify-content:space-between}.search-header,.search-section{margin-bottom:30px}.search-section-title{color:var(--text-primary);margin-bottom:12px}.search-empty{color:var(--text-secondary)}:root.dark .search-page{background:var(--bg-gradient-dark)}.favorites-page{padding:30px 20px}.favorites-title{color:var(--text-primary);margin-bottom:20px}.favorites-empty{color:var(--text-secondary)}:root.dark .favorites-page{background:var(--bg-gradient-dark)}.artist-stats-container{background:#fff;border-radius:12px;box-shadow:0 2px 8px #0000000d;padding:20px;width:100%}.stats-header h2{color:#333;font-size:24px;margin-bottom:20px}.stat-card{transition:transform .3s ease}.stat-card:hover{transform:translateY(-5px)}.stat-icon{flex-shrink:0;font-size:32px}.stat-content h3{font-size:28px;font-weight:800}.stat-content p{opacity:.9}.stats-charts{grid-gap:30px;display:grid;gap:30px;grid-template-columns:repeat(auto-fit,minmax(400px,1fr));margin-bottom:30px}.chart-section{background:#f8f9fa;border-radius:12px;box-shadow:0 2px 8px #0000000d;padding:20px}.chart-section h3{color:#333;font-size:18px;margin-bottom:20px;text-align:center}.chart-container{height:300px;position:relative}.top-song-section{background:#f8f9fa;border-radius:12px;margin-bottom:30px;padding:20px}.top-song-section h3{color:#333;font-size:18px;margin-bottom:15px}.top-song-card{border-radius:10px;box-shadow:0 2px 8px #0000000d;padding:20px}.top-song-info h4{color:#333;font-size:20px;margin-bottom:10px}.top-song-stats{color:#666}.top-song-stats span{align-items:center;display:flex;gap:5px}.songs-stats-table-section{margin-top:30px}.songs-stats-table-section h3{color:#333;font-size:18px;margin-bottom:15px}.songs-stats-table{border-radius:10px;box-shadow:0 2px 8px #0000000d}.songs-stats-table table{border-collapse:collapse;width:100%}.songs-stats-table thead{background:#f8f9fa}.songs-stats-table th{border-bottom:2px solid #eee;color:#333;font-size:14px;font-weight:600;padding:12px 15px;text-align:left}.songs-stats-table td{border-bottom:1px solid #f0f0f0;color:#666;font-size:14px;padding:12px 15px}.songs-stats-table tbody tr:hover{background:#f8f9fa}.songs-stats-table tbody tr:last-child td{border-bottom:none}.stats-empty,.stats-error,.stats-loading{color:#666;padding:40px;text-align:center}.stats-error{color:#e74c3c}.stats-error button{margin-top:15px}@media (max-width:768px){.artist-stats-container{padding:15px}.stats-overview{gap:15px;grid-template-columns:repeat(2,1fr)}.stat-card{padding:15px}.stat-icon{font-size:24px}.stat-content h3{font-size:22px}.stats-charts{gap:20px;grid-template-columns:1fr}.chart-container{height:250px}.songs-stats-table{font-size:12px}.songs-stats-table td,.songs-stats-table th{font-size:12px;padding:8px 10px}}@media (max-width:480px){.stats-overview{grid-template-columns:1fr}.chart-container{height:200px}.top-song-stats{flex-direction:column;gap:10px}}:root.dark .artist-stats-container{background:var(--bg-secondary);border:1px solid var(--border-color);box-shadow:var(--shadow-md)}:root.dark .stats-header h2{color:var(--text-primary)}:root.dark .chart-section{background:var(--bg-tertiary);border:1px solid var(--border-color);box-shadow:var(--shadow-md)}:root.dark .chart-section h3{color:var(--text-primary)}:root.dark .top-song-section{background:var(--bg-tertiary);border:1px solid var(--border-color)}:root.dark .top-song-section h3{color:var(--text-primary)}:root.dark .top-song-card{background:var(--bg-secondary);border:1px solid var(--border-color);box-shadow:var(--shadow-md)}:root.dark .top-song-info h4{color:var(--text-primary)}:root.dark .top-song-stats{color:var(--text-secondary)}:root.dark .songs-stats-table-section h3{color:var(--text-primary)}:root.dark .songs-stats-table{background:var(--bg-secondary);border:1px solid var(--border-color);box-shadow:var(--shadow-md)}:root.dark .songs-stats-table thead{background:var(--bg-tertiary)}:root.dark .songs-stats-table th{border-bottom-color:var(--border-color);color:var(--text-primary)}:root.dark .songs-stats-table td{border-bottom-color:var(--border-color);color:var(--text-secondary)}:root.dark .songs-stats-table tbody tr:hover{background:var(--bg-tertiary)}:root.dark .stats-empty,:root.dark .stats-loading{color:var(--text-secondary)}:root.dark .stats-error{color:var(--error)}.badge-display-container{padding:20px}.badge-check-btn{background:linear-gradient(135deg,#667eea,#764ba2);border:none;border-radius:8px;color:#fff;cursor:pointer;font-size:14px;font-weight:600;margin-bottom:20px;padding:10px 20px;transition:all .3s ease}.badge-check-btn:hover{box-shadow:0 4px 12px #667eea66;transform:translateY(-2px)}.badge-new-notification{animation:slideIn .5s ease;background:linear-gradient(135deg,#667eea,#764ba2);border-radius:12px;color:#fff;margin-bottom:20px;padding:20px}@keyframes slideIn{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}.badge-new-notification h3{font-size:18px;margin:0 0 15px}.badge-new-list{display:flex;flex-direction:column;gap:12px}.badge-new-item{align-items:center;background:#fff3;border-radius:8px;display:flex;gap:12px;padding:12px}.badge-icon{font-size:32px}.badge-grid{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}.badge-item{align-items:center;background:#fff;border:2px solid #e0e0e0;border-radius:12px;display:flex;gap:15px;padding:20px;transition:all .3s ease}.badge-item:hover{border-color:#667eea;box-shadow:0 8px 24px #0000001a;transform:translateY(-4px)}.badge-icon-large{flex-shrink:0;font-size:48px}.badge-info{flex:1 1}.badge-title{color:#333;font-size:16px;font-weight:700;margin-bottom:6px}.badge-description{color:#666;font-size:13px;margin-bottom:8px}.badge-date{color:#999;font-size:11px}.badge-display-empty,.badge-display-loading{color:#999;padding:40px 20px;text-align:center}.badge-display-empty p{margin-bottom:15px}@media (max-width:768px){.badge-grid{grid-template-columns:1fr}.badge-item{padding:15px}.badge-icon-large{font-size:40px}}:root.dark .badge-item{background:var(--bg-secondary);border-color:var(--border-color);box-shadow:var(--shadow-md)}:root.dark .badge-item:hover{border-color:var(--primary-color);box-shadow:var(--shadow-xl)}:root.dark .badge-title{color:var(--text-primary)}:root.dark .badge-date,:root.dark .badge-description,:root.dark .badge-display-empty,:root.dark .badge-display-loading{color:var(--text-secondary)}.user-geo-stats{padding:20px 0}.stats-header{margin-bottom:25px}.stats-header h3{color:var(--text-primary);font-size:1.5rem;margin:0 0 8px}.stats-subtitle{font-size:14px;margin:0}.stats-controls{align-items:center;gap:12px;margin-bottom:25px}.stats-controls label{color:var(--text-primary);font-size:14px;font-weight:500}.stats-controls select{background:var(--bg-primary);border:1px solid #ddd;border:1px solid var(--border-color,#ddd);border-radius:6px;color:var(--text-primary);cursor:pointer;font-size:14px;padding:8px 12px}.stats-summary{grid-gap:15px;gap:15px;grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}.summary-card{align-items:center;border-radius:10px;display:flex;gap:12px;padding:15px}.summary-icon{flex-shrink:0;font-size:32px}.summary-content h4{color:var(--primary-color);font-size:20px;font-weight:700;margin:0 0 4px}.summary-content p{color:var(--text-secondary);font-size:12px;letter-spacing:.5px;margin:0;text-transform:uppercase}.stats-section{margin-bottom:30px}.stats-section h4{border-bottom:2px solid #eee;border-bottom:2px solid var(--border-color,#eee);color:var(--text-primary);font-size:1.2rem;margin:0 0 15px;padding-bottom:10px}.location-list{display:flex;flex-direction:column;gap:10px}.location-item{align-items:center;background:var(--bg-secondary);border-radius:8px;display:flex;gap:15px;padding:12px 15px;transition:background-color .2s}.location-item:hover{background:var(--bg-tertiary)}.location-rank{color:var(--primary-color);font-size:18px;font-weight:700;min-width:35px;text-align:center}.location-info{display:flex;flex:1 1;flex-direction:column;gap:4px}.location-name{color:var(--text-primary);font-size:15px;font-weight:500}.location-country{font-weight:400}.location-country,.location-stats{color:var(--text-secondary);font-size:13px}.loading-container{gap:15px;padding:40px 20px}.empty-state{padding:40px 20px}.empty-state p{font-size:16px;margin:0 0 8px}.empty-state small{color:var(--text-tertiary);display:block;font-size:13px}@media (max-width:768px){.stats-summary{grid-template-columns:repeat(2,1fr)}.summary-card{flex-direction:column;padding:12px;text-align:center}.summary-icon{font-size:28px}.summary-content h4{font-size:18px}.location-item{padding:10px 12px}.location-rank{font-size:16px;min-width:30px}}@media (max-width:480px){.stats-summary{grid-template-columns:1fr}.stats-controls{align-items:flex-start;flex-direction:column}.stats-controls select{width:100%}}.image-cropper-overlay{align-items:center;background:#000000e6;bottom:0;display:flex;justify-content:center;left:0;overflow:hidden;padding:20px;position:fixed;right:0;top:0;touch-action:none;z-index:10001}.image-cropper-container{background:#1a1a1a;background:var(--bg-secondary,#1a1a1a);border-radius:12px;box-shadow:0 10px 40px #00000080;display:flex;flex-direction:column;max-height:90vh;max-width:90vw}.image-cropper-header{border-bottom:1px solid #ffffff1a;padding:20px;text-align:center}.image-cropper-header h3{color:#fff;color:var(--text-primary,#fff);font-size:1.5rem;margin:0 0 8px}.image-cropper-header p{color:#b3b3b3;color:var(--text-secondary,#b3b3b3);font-size:.9rem;margin:0}.image-cropper-content{-webkit-touch-callout:none;align-items:center;background:#000;border-radius:8px;cursor:move;display:flex;justify-content:center;margin:20px auto;max-height:600px;max-width:600px;min-height:300px;overflow:hidden;position:relative;touch-action:none;user-select:none;-webkit-user-select:none;width:100%}.cropper-image{display:block;max-height:100%;max-width:100%;object-fit:contain;position:absolute}.crop-area{border:2px solid #1db954;border:2px solid var(--accent-color,#1db954);box-shadow:0 0 0 9999px #00000080;cursor:move;position:absolute;z-index:10}.crop-overlay-bottom,.crop-overlay-left,.crop-overlay-right,.crop-overlay-top{background:#00000080;position:absolute}.crop-overlay-top{left:0;right:0;top:0}.crop-overlay-bottom{left:0;right:0}.crop-overlay-left{left:0;top:0}.crop-overlay-right{right:0;top:0}.crop-handle{-webkit-tap-highlight-color:transparent;background:#1db954;background:var(--accent-color,#1db954);border:2px solid #fff;border-radius:50%;cursor:nwse-resize;height:24px;position:absolute;touch-action:none;width:24px;z-index:20}.crop-handle-nw{cursor:nwse-resize;left:-12px;top:-12px}.crop-handle-ne{cursor:nesw-resize;right:-12px;top:-12px}.crop-handle-sw{bottom:-12px;cursor:nesw-resize;left:-12px}.crop-handle-se{bottom:-12px;cursor:nwse-resize;right:-12px}.crop-handle:hover{background:#1ed760;background:var(--accent-hover,#1ed760);transform:scale(1.2)}.image-cropper-footer{border-top:1px solid #ffffff1a;display:flex;gap:12px;justify-content:flex-end;padding:20px}[data-theme=light] .image-cropper-container{background:#fff}[data-theme=light] .image-cropper-header{border-bottom-color:#0000001a}[data-theme=light] .image-cropper-header h3{color:#1a1a1a}[data-theme=light] .image-cropper-header p{color:#666}[data-theme=light] .image-cropper-footer{border-top-color:#0000001a}@media (max-width:768px){.image-cropper-overlay{align-items:flex-start;padding:calc(72px + env(safe-area-inset-top, 0)) 0 0;z-index:10001}.image-cropper-container{border-radius:0;display:flex;flex-direction:column;height:calc(100vh - 72px);max-height:calc(100vh - 72px);max-width:100vw}.image-cropper-content{flex:1 1;margin:10px;max-height:calc(100vh - 300px);max-width:100%;min-height:250px}.image-cropper-header{flex-shrink:0;padding:15px}.image-cropper-header h3{font-size:1.2rem}.image-cropper-header p{font-size:.85rem}.image-cropper-footer{flex-direction:column;flex-shrink:0;gap:10px;padding:15px 15px calc(15px + env(safe-area-inset-bottom, 0))}.image-cropper-footer .btn{font-size:16px;padding:12px;width:100%}.crop-handle{height:32px;width:32px}.crop-handle-nw{left:-16px;top:-16px}.crop-handle-ne{right:-16px;top:-16px}.crop-handle-sw{bottom:-16px;left:-16px}.crop-handle-se{bottom:-16px;right:-16px}}.profile-container{box-sizing:border-box;margin:0 auto;max-width:1200px;overflow-x:hidden;padding:30px 20px;width:100%}.profile-header{background:#fff;background:var(--card-bg,#fff);border-radius:20px;box-shadow:0 10px 40px #0000001f;box-sizing:border-box;margin-bottom:30px;overflow:hidden;padding:0;position:relative;width:100%}.profile-header,.profile-header:before{background:linear-gradient(135deg,#667eea,#764ba2)}.profile-header:before{content:"";height:200px;left:0;position:absolute;right:0;top:0;z-index:0}.profile-header-content{background:#fff;background:var(--card-bg,#fff);border-radius:20px 20px 0 0;margin-top:120px;padding:40px 30px 30px;position:relative;z-index:1}.profile-avatar-section{align-items:flex-end;box-sizing:border-box;display:flex;flex-wrap:wrap;gap:30px;margin-bottom:30px;margin-top:-80px;position:relative;width:100%;z-index:2}.profile-avatar-wrapper{flex-shrink:0;position:relative}.profile-avatar{background:#fff;background:var(--card-bg,#fff);border:6px solid #fff;border:6px solid var(--card-bg,#fff);border-radius:50%;box-shadow:0 8px 24px #0003,0 0 0 4px #667eea1a;height:180px;object-fit:cover;transition:transform .3s ease;width:180px}.profile-avatar:hover{transform:scale(1.05)}.avatar-upload-btn{background:linear-gradient(135deg,#667eea,#764ba2);border:3px solid #fff;border-radius:25px;bottom:10px;box-shadow:0 4px 12px #667eea66;color:#fff;cursor:pointer;font-size:13px;font-weight:600;padding:10px 18px;position:absolute;right:10px;transition:all .3s ease;white-space:nowrap;z-index:10}.avatar-upload-btn:hover{box-shadow:0 6px 20px #667eea80;transform:translateY(-2px) scale(1.05)}@media (max-width:480px){.profile-avatar-wrapper{align-items:center;display:flex;flex-direction:column}.avatar-upload-btn{display:inline-block;margin-top:10px;position:static;transform:none}.avatar-upload-btn:hover{transform:scale(1.02)}}.avatar-upload-btn:hover{background:#4f46e5;background:var(--primary-hover,#4f46e5);transform:scale(1.05)}.profile-info-header{flex:1 1;min-width:200px}@media (max-width:768px){.profile-info-header{min-width:0;min-width:auto;width:100%}}.profile-name-row{align-items:center;display:flex;flex-wrap:wrap;gap:12px;margin-bottom:10px}.profile-info-header h1{color:#1f2937;color:var(--text-primary,#1f2937);font-size:2.5rem;font-weight:700;letter-spacing:-.5px;line-height:1.2;margin:0 0 12px}.premium-badge{align-items:center;animation:premiumGlow 2s ease-in-out infinite;background:linear-gradient(135deg,#fbbf24,#f59e0b);border:2px solid #ffffff4d;border-radius:20px;box-shadow:0 4px 12px #fbbf2466;color:#fff;display:inline-flex;font-size:.85rem;font-weight:700;gap:6px;letter-spacing:.5px;padding:6px 14px;text-transform:uppercase}.premium-badge.premium-basic{animation:premiumBasicGlow 2s ease-in-out infinite;background:linear-gradient(135deg,#3b82f6,#2563eb);box-shadow:0 4px 12px #3b82f666}.verified-badge{align-items:center;animation:verifiedGlow 2s ease-in-out infinite;background:linear-gradient(135deg,#10b981,#059669);border:2px solid #ffffff4d;border-radius:20px;box-shadow:0 4px 12px #10b98166;color:#fff;display:inline-flex;font-size:.85rem;font-weight:700;gap:6px;letter-spacing:.5px;padding:6px 14px;text-transform:uppercase}@keyframes verifiedGlow{0%,to{box-shadow:0 4px 12px #10b98166}50%{box-shadow:0 4px 20px #10b98199}}@keyframes premiumBasicGlow{0%,to{box-shadow:0 4px 12px #3b82f666}50%{box-shadow:0 4px 20px #3b82f699}}@keyframes premiumGlow{0%,to{box-shadow:0 4px 12px #fbbf2466}50%{box-shadow:0 4px 20px #fbbf2499}}.premium-badge:hover{box-shadow:0 6px 20px #fbbf2480;transform:scale(1.05)}.profile-email{font-size:1rem}.profile-email,.profile-genre,.profile-location{color:#6b7280;color:var(--text-secondary,#6b7280);margin:5px 0}.profile-genre,.profile-location{font-size:.95rem}.profile-stats{grid-gap:20px;border-top:2px solid #e5e7eb;border-top:2px solid var(--border-color,#e5e7eb);box-sizing:border-box;display:grid;flex-wrap:wrap;gap:20px;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));padding-top:30px;width:100%}.stat-item{background:linear-gradient(135deg,#667eea0d,#764ba20d);border:1px solid #667eea1a;border-radius:16px;min-width:100px;padding:20px;text-align:center;transition:all .3s ease}.stat-item:hover{border-color:#667eea4d;box-shadow:0 8px 20px #667eea26;transform:translateY(-4px)}.stat-value{-webkit-text-fill-color:#0000;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;background-clip:text;font-size:2.5rem;font-weight:700;line-height:1;margin-bottom:8px}.stat-label{color:#6b7280;color:var(--text-secondary,#6b7280);font-size:.85rem;font-weight:600;letter-spacing:1px;text-transform:uppercase}.profile-tabs{-webkit-overflow-scrolling:touch;background:#fff;background:var(--card-bg,#fff);border:1px solid #e5e7eb;border:1px solid var(--border-color,#e5e7eb);border-radius:16px;box-shadow:0 4px 16px #00000014;display:flex;flex-wrap:wrap;gap:8px;margin-bottom:30px;overflow-x:auto;padding:8px}.tab-btn{background:#0000;border:none;border-radius:12px;color:#6b7280;color:var(--text-secondary,#6b7280);cursor:pointer;font-size:.95rem;font-weight:500;padding:12px 20px;position:relative;transition:all .3s ease;white-space:nowrap}.tab-btn:hover{background:#667eea14;color:#667eea;color:var(--primary-color,#667eea)}.tab-btn.active{background:linear-gradient(135deg,#667eea,#764ba2);box-shadow:0 4px 12px #667eea4d;color:#fff;font-weight:600}.profile-content{background:#fff;background:var(--card-bg,#fff);border:1px solid #e5e7eb;border:1px solid var(--border-color,#e5e7eb);border-radius:20px;box-shadow:0 4px 20px #00000014;box-sizing:border-box;overflow-x:hidden;padding:40px;width:100%}[data-theme=light] .profile-content{background:#fff;border-color:#e5e7eb;box-shadow:0 4px 20px #00000014}[data-theme=light] .form-group input,[data-theme=light] .form-group select,[data-theme=light] .form-group textarea{background:#fff;border-color:#e5e7eb;color:#1f2937}[data-theme=light] .form-group input:focus,[data-theme=light] .form-group select:focus,[data-theme=light] .form-group textarea:focus{border-color:#667eea;box-shadow:0 0 0 3px #667eea1a}.profile-form{box-sizing:border-box;max-width:800px;overflow-x:hidden;width:100%}.form-section h3{border-bottom:2px solid #e5e7eb;border-bottom:2px solid var(--border-color,#e5e7eb);font-size:1.3rem;margin-bottom:20px;padding-bottom:10px}.form-group label,.form-section h3{color:#1f2937;color:var(--text-primary,#1f2937)}.form-group input,.form-group select,.form-group textarea{background:var(--input-bg,#fff);border:1px solid #e5e7eb;border:1px solid var(--border-color,#e5e7eb);color:#1f2937;color:var(--text-primary,#1f2937);font-size:1rem;transition:all .3s}.form-group input:focus,.form-group select:focus,.form-group textarea:focus{border-color:#6366f1;border-color:var(--primary-color,#6366f1);box-shadow:0 0 0 3px #6366f11a}.form-group small{color:#6b7280;color:var(--text-secondary,#6b7280);display:block;font-size:.85rem;margin-top:5px}@media (max-width:768px){.form-row{gap:15px;grid-template-columns:1fr}}.profile-songs{color:#1f2937;color:var(--text-primary,#1f2937);max-width:100%}.profile-stats-dashboard{padding:20px 0}.stats-overview{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));margin-bottom:30px}.stat-card,.stats-overview{box-sizing:border-box;width:100%}.stat-card{gap:15px;min-width:0;padding:20px;transition:transform .2s}.stat-card:hover{box-shadow:0 6px 20px #667eea66}.stat-icon{font-size:36px;opacity:.9}.stat-content{flex:1 1}.stat-content .stat-value{font-size:28px;font-weight:700;margin-bottom:5px}.stat-content .stat-label{font-size:14px;opacity:.9}.top-song-card{background:#fff;background:var(--card-bg,#fff);border:1px solid #e5e7eb;border:1px solid var(--border-color,#e5e7eb);border-radius:12px;box-shadow:0 2px 10px #0000001a;margin-bottom:30px;padding:25px}.top-song-card h4{color:#1f2937;color:var(--text-primary,#1f2937);font-size:18px;margin:0 0 15px}.top-song-info h5{color:#667eea;color:var(--primary-color,#667eea);font-size:20px;margin:0 0 10px}.top-song-stats{color:#6b7280;color:var(--text-secondary,#6b7280);display:flex;font-size:14px;gap:20px;margin-bottom:15px}.chart-container{background:#fff;background:var(--card-bg,#fff);border:1px solid #e5e7eb;border:1px solid var(--border-color,#e5e7eb);border-radius:12px;box-shadow:0 2px 10px #0000001a;margin-bottom:30px;padding:25px}.chart-container h4{color:#1f2937;color:var(--text-primary,#1f2937);font-size:18px;margin:0 0 20px}.bar-chart{align-items:flex-end;border-bottom:2px solid #e0e0e0;border-bottom:2px solid var(--border-color,#e0e0e0);display:flex;gap:10px;height:250px;justify-content:space-around;padding:20px 0}.bar-item{align-items:center;display:flex;flex:1 1;flex-direction:column;height:100%;position:relative}.bar-value{color:#667eea;font-size:12px;font-weight:600;margin-bottom:5px;min-height:20px}.bar-wrapper{align-items:flex-end;display:flex;flex:1 1;justify-content:center;position:relative;width:100%}.bar{background:linear-gradient(0deg,#667eea,#764ba2);border-radius:4px 4px 0 0;cursor:pointer;min-height:5px;transition:all .3s;width:80%}.bar:hover{opacity:.8;transform:scaleY(1.05)}.bar-label{color:#6b7280;color:var(--text-secondary,#6b7280);font-size:11px;margin-top:8px;text-align:center;transform:rotate(-45deg);white-space:nowrap}.songs-stats-table{-webkit-overflow-scrolling:touch;background:#fff;background:var(--card-bg,#fff);border:1px solid #e5e7eb;border:1px solid var(--border-color,#e5e7eb);border-radius:12px;box-shadow:0 2px 10px #0000001a;box-sizing:border-box;max-width:100%;overflow-x:auto;padding:25px;width:100%}.songs-stats-table h4{color:#1f2937;color:var(--text-primary,#1f2937);font-size:18px;margin:0 0 20px}.stats-table{box-sizing:border-box;min-width:300px;table-layout:auto;width:100%}.stats-table-header{border-bottom:2px solid #e0e0e0;border-bottom:2px solid var(--border-color,#e0e0e0);color:#1f2937;color:var(--text-primary,#1f2937);font-size:14px;font-weight:600;padding:12px 0}.stats-table-header,.stats-table-row{grid-gap:15px;box-sizing:border-box;display:grid;gap:15px;grid-template-columns:2fr 1fr 1fr 1fr;min-width:0;width:100%}.stats-table-row{align-items:center;border-bottom:1px solid #f0f0f0;border-bottom:1px solid var(--border-color,#f0f0f0);padding:15px 0;transition:background .2s}.stats-table-row:hover{background:#f9f9f9;background:var(--bg-hover,#f9f9f9)}.stats-col-title{word-wrap:break-word;color:#1f2937;color:var(--text-primary,#1f2937);font-weight:500;min-width:0;overflow:hidden;text-overflow:ellipsis}.stats-col-title a{word-wrap:break-word;color:#667eea;color:var(--primary-color,#667eea);overflow-wrap:break-word;text-decoration:none}.stats-col-title a:hover{text-decoration:underline}.stats-col-comments,.stats-col-likes,.stats-col-views{color:#6b7280;color:var(--text-secondary,#6b7280);font-size:14px;min-width:0;text-align:right;white-space:nowrap}.profile-songs h3{color:#1f2937;color:var(--text-primary,#1f2937);font-size:1.3rem;margin-bottom:20px}@media (max-width:768px){.profile-songs h3{font-size:1.1rem;margin-bottom:15px}}@media (max-width:480px){.profile-songs h3{font-size:1rem;margin-bottom:12px}}.empty-state{color:#6b7280;color:var(--text-secondary,#6b7280)}.empty-state p,.loading{color:#6b7280;color:var(--text-secondary,#6b7280);font-size:1.1rem}.loading{padding:40px 20px}.song-item{background:#f9fafb;background:var(--bg-secondary,#f9fafb);box-sizing:border-box;gap:20px;overflow:hidden;transition:all .3s;width:100%}.song-item:hover{background:#f3f4f6;background:var(--bg-hover,#f3f4f6);transform:translateX(5px)}.song-cover-small{border-radius:8px;flex-shrink:0;height:60px;overflow:hidden;width:60px}.song-cover-small img{height:100%;object-fit:cover;width:100%}.placeholder-cover-small{background:#f9fafb;background:var(--bg-secondary,#f9fafb);color:#6b7280;color:var(--text-secondary,#6b7280);font-size:1.5rem}.song-info{min-width:0}.song-info h4{color:#1f2937;color:var(--text-primary,#1f2937);font-size:1.1rem;margin:0 0 8px}.song-stats{color:#6b7280;color:var(--text-secondary,#6b7280);display:flex;font-size:.9rem;gap:15px}.song-actions{align-items:center;display:flex;flex-shrink:0;gap:10px}.message{word-wrap:break-word;color:#1f2937;color:var(--text-primary,#1f2937)}@media (max-width:768px){.message{font-size:.9rem;margin-bottom:15px;padding:12px 15px}}@media (max-width:480px){.message{font-size:.85rem;margin-bottom:12px;padding:10px 12px}}.message-success{background:#d1fae5;border:1px solid #6ee7b7;color:#065f46}.message-error{background:#fee2e2;border:1px solid #fca5a5;color:#991b1b}.btn{border:none;border-radius:8px;cursor:pointer;display:inline-block;font-size:1rem;font-weight:500;padding:12px 24px;text-decoration:none;transition:all .3s}.btn-primary{background:#6366f1;background:var(--primary-color,#6366f1);color:#fff}.btn-primary:hover{background:#4f46e5;background:var(--primary-hover,#4f46e5);box-shadow:0 4px 12px #6366f14d;transform:translateY(-2px)}.btn-secondary{background:#f9fafb;background:var(--bg-secondary,#f9fafb);border:1px solid #e5e7eb;border:1px solid var(--border-color,#e5e7eb);color:#1f2937;color:var(--text-primary,#1f2937)}.btn-secondary:hover{background:#f3f4f6;background:var(--bg-hover,#f3f4f6)}.btn-small{font-size:.9rem;padding:8px 16px}.btn-danger{background:#ef4444}.btn-danger:hover{background:#dc2626;box-shadow:0 4px 12px #ef44444d;transform:translateY(-2px)}.btn-danger:disabled{background:#9ca3af;cursor:not-allowed;opacity:.6;transform:none}@media (prefers-color-scheme:dark){.profile-content,.profile-header{background:#1f2937;color:#f9fafb}.tab-btn{color:#fff}.tab-btn:hover{background:#818cf81a;color:#fff}.tab-btn.active{background:#818cf826;border-bottom-color:#818cf8;color:#fff}.form-group input,.form-group textarea{background:#374151;border-color:#4b5563;color:#f9fafb}.song-item{background:#374151}.song-item:hover{background:#4b5563}}@media (max-width:1024px){.profile-container{overflow-x:hidden;padding:20px 15px}.profile-header{box-sizing:border-box;padding:25px 20px;width:100%}.profile-avatar-section{gap:25px;width:100%}.profile-avatar{height:130px;width:130px}.profile-info-header h1{font-size:1.8rem}.stats-overview{grid-template-columns:repeat(2,1fr);width:100%}.form-row{gap:15px}.profile-tabs{-webkit-overflow-scrolling:touch;overflow-x:auto}}@media (max-width:768px){.profile-container{max-width:100%;overflow-x:hidden;padding:15px 10px;width:100%}.profile-header{border-radius:16px;box-sizing:border-box;overflow-x:hidden;width:100%}.profile-header-content{margin-top:100px;padding:30px 20px 20px}.profile-avatar-section{align-items:center!important;flex-direction:column!important;gap:20px;margin-bottom:20px;text-align:center;width:100%!important}.profile-avatar-wrapper{position:relative}.profile-avatar{border-width:5px;height:140px;width:140px}.avatar-upload-btn{border-width:2px;font-size:12px;padding:6px 12px}.profile-info-header{min-width:0;min-width:auto;width:100%}.profile-info-header h1{font-size:1.5rem;margin-bottom:8px}.profile-email{font-size:.9rem;margin:4px 0}.profile-genre,.profile-location{font-size:.85rem;margin:3px 0}.profile-stats{gap:12px;grid-template-columns:repeat(2,1fr);padding-top:20px;width:100%!important}.stat-item{flex:1 1;min-width:80px;padding:15px}.stat-value{font-size:1.8rem}.stat-label{font-size:.8rem}.profile-tabs{-webkit-overflow-scrolling:touch;border-radius:8px;flex-wrap:wrap;gap:8px;overflow-x:auto;padding:8px}.tab-btn{border-bottom-width:2px;flex:1 1 auto;font-size:13px;min-width:calc(50% - 4px);padding:10px 12px;text-align:center;white-space:nowrap}.profile-content{border-radius:8px;box-sizing:border-box;overflow-x:hidden;padding:20px 15px;width:100%}.profile-stats-dashboard{padding:15px 0}.profile-stats-dashboard h3{font-size:1.3rem;margin-bottom:20px}.form-section{margin-bottom:30px}.form-section h3{font-size:1.1rem;margin-bottom:15px}.form-row{gap:15px;grid-template-columns:1fr}.form-group small{font-size:11px}.form-group{margin-bottom:15px;width:100%}.form-group input,.form-group textarea{font-size:.95rem;padding:10px}.song-item{align-items:flex-start!important;flex-direction:column!important;gap:12px;padding:12px;width:100%!important}.song-cover-small{height:80px;width:80px}.song-info{min-width:0;width:100%!important}.song-info h4{font-size:1rem;margin-bottom:6px}.song-stats{font-size:.85rem;gap:12px}.song-actions{flex-wrap:wrap;gap:8px;justify-content:flex-end;width:100%!important}.btn-small{font-size:.85rem;padding:8px 14px}.stats-overview{gap:12px;grid-template-columns:repeat(2,1fr);margin-bottom:20px}.stat-card{flex-direction:column;gap:12px;padding:15px;text-align:center}.stat-icon{font-size:28px}.stat-content .stat-value{font-size:22px}.stat-content .stat-label{font-size:12px}.top-song-card{margin-bottom:20px;padding:20px}.top-song-card h4{font-size:16px;margin-bottom:12px}.top-song-info h5{font-size:18px;margin-bottom:8px}.top-song-stats{flex-direction:column;font-size:13px;gap:8px;margin-bottom:12px}.top-song-info .btn{margin-top:10px;width:100%}.chart-container{margin-bottom:20px;padding:20px}.chart-container h4{font-size:16px;margin-bottom:15px}.bar-chart{gap:5px;height:200px;padding:15px 0}.bar-item{min-width:0}.bar-value{font-size:10px;margin-bottom:3px}.bar{width:90%}.bar-label{font-size:9px;margin-top:5px;max-width:40px;overflow:hidden;transform:rotate(-45deg)}.songs-stats-table{-webkit-overflow-scrolling:touch;overflow-x:auto;padding:20px}.songs-stats-table h4{font-size:16px;margin-bottom:15px}.stats-table-header,.stats-table-row{font-size:13px;gap:8px;grid-template-columns:2fr 1fr 1fr;padding:10px 0}.stats-table-header{font-size:12px}.stats-col-comments{display:none}.stats-col-title a{font-size:13px;word-break:break-word}}@media (max-width:480px){.profile-container{padding:10px 8px}.profile-header{margin-bottom:20px;padding:15px 12px}.profile-avatar-section{gap:15px;margin-bottom:15px}.profile-avatar{border-width:3px;height:100px;width:100px}.avatar-upload-btn{border-width:2px;font-size:11px;padding:5px 10px}.profile-info-header h1{font-size:1.3rem;margin-bottom:6px}.profile-email{font-size:.85rem}.profile-genre,.profile-location{font-size:.8rem}.profile-stats{gap:10px;justify-content:space-around;padding-top:15px;width:100%!important}.stat-item{min-width:70px}.stat-value{font-size:1.3rem}.stat-label{font-size:.75rem}.profile-tabs{-webkit-overflow-scrolling:touch;gap:6px;overflow-x:auto;padding:6px}.tab-btn{border-bottom-width:2px;flex:1 1 auto;font-size:12px;min-width:calc(50% - 3px);padding:8px 10px;white-space:nowrap}.profile-content{box-sizing:border-box;overflow-x:hidden;padding:15px 10px;width:100%}.profile-stats-dashboard{padding:10px 0}.profile-stats-dashboard h3{font-size:1.2rem;margin-bottom:15px}.form-section{margin-bottom:25px}.form-section h3{font-size:1rem}.form-group,.form-section h3{margin-bottom:12px}.form-group label{font-size:.9rem;margin-bottom:6px}.form-group input,.form-group select,.form-group textarea{font-size:14px;padding:10px}.btn{font-size:.9rem;padding:10px 20px;width:100%}.btn-small{font-size:.8rem;padding:6px 12px}.stats-overview{gap:10px;grid-template-columns:1fr}.stat-card{gap:10px;padding:12px}.stat-icon{font-size:24px}.stat-content .stat-value{font-size:20px}.stat-content .stat-label{font-size:11px}.top-song-card{padding:15px}.top-song-card h4{font-size:14px}.top-song-info h5{font-size:16px}.top-song-stats{font-size:12px}.chart-container{padding:15px}.chart-container h4{font-size:14px;margin-bottom:12px}.bar-chart{gap:3px;height:180px;padding:10px 0}.bar-value{font-size:9px}.bar{width:95%}.bar-label{font-size:8px;max-width:30px;overflow:hidden;text-overflow:ellipsis}.songs-stats-table{padding:15px}.songs-stats-table h4{font-size:14px;margin-bottom:12px}.stats-table-header,.stats-table-row{font-size:12px;gap:6px;grid-template-columns:2fr 1fr;min-width:0;padding:8px 0}.stats-col-views{overflow:hidden;text-align:right;text-overflow:ellipsis;white-space:nowrap}.stats-table-header{font-size:11px}.stats-col-title{overflow:hidden;text-overflow:ellipsis}.stats-col-likes{display:none}.stats-col-title{overflow-wrap:break-word;word-break:break-word}.song-item{align-items:flex-start!important;flex-direction:column!important;padding:10px;width:100%!important}.song-cover-small{height:70px;width:70px}.song-info h4{font-size:.95rem}.song-stats{font-size:.8rem}.song-actions{flex-direction:column!important;gap:8px;width:100%!important}.song-actions .btn{margin-bottom:0;width:100%!important}.empty-state{padding:30px 15px}.empty-state p{font-size:.95rem;margin-bottom:15px}.loading{font-size:.9rem;padding:20px;text-align:center}}:root.dark .profile-container,[data-theme=dark] .profile-container{background:#0a0a0a;background:var(--bg-primary,#0a0a0a);color:#fff;color:var(--text-primary,#fff)}:root.dark .profile-header,[data-theme=dark] .profile-header{background:linear-gradient(135deg,#667eea,#764ba2);box-shadow:0 10px 40px #0000004d}:root.dark .profile-header:before,[data-theme=dark] .profile-header:before{background:linear-gradient(135deg,#667eea,#764ba2)}:root.dark .profile-header-content,[data-theme=dark] .profile-header-content{background:#1a1a1a;background:var(--bg-secondary,#1a1a1a)}:root.dark .profile-avatar,[data-theme=dark] .profile-avatar{border-color:#1a1a1a;border-color:var(--bg-secondary,#1a1a1a);box-shadow:0 8px 24px #0006,0 0 0 4px #667eea33}:root.dark .profile-info-header h1,[data-theme=dark] .profile-info-header h1{color:#fff;color:var(--text-primary,#fff)}:root.dark .profile-email,:root.dark .profile-genre,:root.dark .profile-location,[data-theme=dark] .profile-email,[data-theme=dark] .profile-genre,[data-theme=dark] .profile-location{color:#b3b3b3;color:var(--text-secondary,#b3b3b3)}:root.dark .profile-stats,[data-theme=dark] .profile-stats{border-top-color:#ffffff1a;border-top-color:var(--border-color,#ffffff1a)}:root.dark .stat-item,[data-theme=dark] .stat-item{background:linear-gradient(135deg,#667eea26,#764ba226);border-color:#667eea4d}:root.dark .stat-item:hover,[data-theme=dark] .stat-item:hover{background:linear-gradient(135deg,#667eea40,#764ba240);border-color:#667eea80;box-shadow:0 8px 20px #667eea40}:root.dark .stat-value,[data-theme=dark] .stat-value{-webkit-text-fill-color:#0000;background:linear-gradient(135deg,#818cf8,#a78bfa);-webkit-background-clip:text;background-clip:text}:root.dark .stat-label,[data-theme=dark] .stat-label{color:#b3b3b3;color:var(--text-secondary,#b3b3b3)}:root.dark .profile-tabs,[data-theme=dark] .profile-tabs{background:#1a1a1a;background:var(--bg-secondary,#1a1a1a);border-color:#ffffff1a;border-color:var(--border-color,#ffffff1a);box-shadow:0 4px 16px #0003}:root.dark .tab-btn,[data-theme=dark] .tab-btn{color:#b3b3b3;color:var(--text-secondary,#b3b3b3)}:root.dark .tab-btn:hover,[data-theme=dark] .tab-btn:hover{background:#667eea26;color:#fff;color:var(--text-primary,#fff)}:root.dark .tab-btn.active,[data-theme=dark] .tab-btn.active{background:linear-gradient(135deg,#667eea,#764ba2);box-shadow:0 4px 12px #667eea66;color:#fff}:root.dark .profile-content,[data-theme=dark] .profile-content{background:#1a1a1a;background:var(--bg-secondary,#1a1a1a);border-color:#ffffff1a;border-color:var(--border-color,#ffffff1a);box-shadow:0 4px 20px #0003}:root.dark .form-section h3,[data-theme=dark] .form-section h3{border-bottom-color:#ffffff1a;border-bottom-color:var(--border-color,#ffffff1a);color:#fff;color:var(--text-primary,#fff)}:root.dark .form-group label,[data-theme=dark] .form-group label{color:#fff;color:var(--text-primary,#fff)}:root.dark .form-group input,:root.dark .form-group select,:root.dark .form-group textarea,[data-theme=dark] .form-group input,[data-theme=dark] .form-group select,[data-theme=dark] .form-group textarea{background:#2a2a2a;background:var(--bg-tertiary,#2a2a2a);border-color:#ffffff1a;border-color:var(--border-color,#ffffff1a);color:#fff;color:var(--text-primary,#fff)}:root.dark .form-group input:focus,:root.dark .form-group select:focus,:root.dark .form-group textarea:focus,[data-theme=dark] .form-group input:focus,[data-theme=dark] .form-group select:focus,[data-theme=dark] .form-group textarea:focus{border-color:#667eea;border-color:var(--primary-color,#667eea);box-shadow:0 0 0 3px #667eea33}:root.dark .song-item,[data-theme=dark] .song-item{background:#2a2a2a;background:var(--bg-tertiary,#2a2a2a);border-color:#ffffff1a;border-color:var(--border-color,#ffffff1a)}:root.dark .song-item:hover,[data-theme=dark] .song-item:hover{background:#1a1a1a;background:var(--bg-secondary,#1a1a1a)}:root.dark .song-info h4,[data-theme=dark] .song-info h4{color:#fff;color:var(--text-primary,#fff)}:root.dark .empty-state,:root.dark .song-stats,[data-theme=dark] .empty-state,[data-theme=dark] .song-stats{color:#b3b3b3;color:var(--text-secondary,#b3b3b3)}:root.dark .message-success,[data-theme=dark] .message-success{background:#10b98133;border-color:#10b9814d;color:#6ee7b7}:root.dark .message-error,[data-theme=dark] .message-error{background:#ef444433;border-color:#ef44444d;color:#fca5a5}[data-theme=light] .profile-container{background:#f5f5f5;background:var(--bg-primary,#f5f5f5);color:#1f2937;color:var(--text-primary,#1f2937)}[data-theme=light] .profile-header{background:linear-gradient(135deg,#667eea,#764ba2);box-shadow:0 10px 40px #0000001f}[data-theme=light] .profile-header-content{background:#fff}[data-theme=light] .profile-avatar{border-color:#fff;box-shadow:0 8px 24px #0003,0 0 0 4px #667eea1a}[data-theme=light] .profile-info-header h1{color:#1f2937}[data-theme=light] .profile-email,[data-theme=light] .profile-genre,[data-theme=light] .profile-location{color:#6b7280}[data-theme=light] .profile-stats{border-top-color:#e5e7eb}[data-theme=light] .stat-item{background:linear-gradient(135deg,#667eea0d,#764ba20d);border-color:#667eea1a}[data-theme=light] .stat-item:hover{background:linear-gradient(135deg,#667eea1a,#764ba21a);border-color:#667eea4d;box-shadow:0 8px 20px #667eea26}[data-theme=light] .stat-value{-webkit-text-fill-color:#0000;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;background-clip:text}[data-theme=light] .stat-label,[data-theme=light] .tab-btn{color:#6b7280}[data-theme=light] .tab-btn:hover{background:#667eea14;color:#667eea}[data-theme=light] .tab-btn.active{background:linear-gradient(135deg,#667eea,#764ba2);box-shadow:0 4px 12px #667eea4d;color:#fff}[data-theme=light] .form-section h3{border-bottom-color:#e5e7eb;color:#1f2937}[data-theme=light] .form-group label{color:#1f2937}[data-theme=light] .song-item{background:#f9fafb;border-color:#e5e7eb}[data-theme=light] .song-item:hover{background:#f3f4f6}[data-theme=light] .song-info h4{color:#1f2937}[data-theme=light] .empty-state,[data-theme=light] .song-stats{color:#6b7280}[data-theme=light] .message-success{background:#d1fae5;border-color:#6ee7b7;color:#065f46}[data-theme=light] .message-error{background:#fee2e2;border-color:#fca5a5;color:#991b1b}:root.dark .profile-songs,[data-theme=dark] .profile-songs{color:#fff;color:var(--text-primary,#fff)}:root.dark .top-song-card,[data-theme=dark] .top-song-card{background:#1a1a1a;background:var(--bg-secondary,#1a1a1a);border-color:#ffffff1a;border-color:var(--border-color,#ffffff1a);box-shadow:0 2px 10px #0000004d}:root.dark .top-song-card h4,[data-theme=dark] .top-song-card h4{color:#fff;color:var(--text-primary,#fff)}:root.dark .top-song-info h5,[data-theme=dark] .top-song-info h5{color:#818cf8;color:var(--primary-color,#818cf8)}:root.dark .top-song-stats,[data-theme=dark] .top-song-stats{color:#b3b3b3;color:var(--text-secondary,#b3b3b3)}:root.dark .chart-container,[data-theme=dark] .chart-container{background:#1a1a1a;background:var(--bg-secondary,#1a1a1a);border-color:#ffffff1a;border-color:var(--border-color,#ffffff1a)}:root.dark .chart-container h4,[data-theme=dark] .chart-container h4{color:#fff;color:var(--text-primary,#fff)}:root.dark .stats-table-header,[data-theme=dark] .stats-table-header{border-bottom-color:#ffffff1a;border-bottom-color:var(--border-color,#ffffff1a);color:#fff;color:var(--text-primary,#fff)}:root.dark .stats-table-row,[data-theme=dark] .stats-table-row{border-bottom-color:#ffffff0d;border-bottom-color:var(--border-color,#ffffff0d)}:root.dark .stats-table-row:hover,[data-theme=dark] .stats-table-row:hover{background:#2a2a2a;background:var(--bg-tertiary,#2a2a2a)}:root.dark .stats-col-title,[data-theme=dark] .stats-col-title{color:#fff;color:var(--text-primary,#fff)}:root.dark .stats-col-title a,[data-theme=dark] .stats-col-title a{color:#818cf8;color:var(--primary-color,#818cf8)}:root.dark .form-group small,:root.dark .loading,:root.dark .stats-col-comments,:root.dark .stats-col-likes,:root.dark .stats-col-views,[data-theme=dark] .form-group small,[data-theme=dark] .loading,[data-theme=dark] .stats-col-comments,[data-theme=dark] .stats-col-likes,[data-theme=dark] .stats-col-views{color:#b3b3b3;color:var(--text-secondary,#b3b3b3)}:root.dark .placeholder-cover-small,[data-theme=dark] .placeholder-cover-small{background:#2a2a2a;background:var(--bg-tertiary,#2a2a2a);color:#b3b3b3;color:var(--text-secondary,#b3b3b3)}[data-theme=light] .profile-songs{color:#1f2937}[data-theme=light] .top-song-card{background:#fff;border-color:#e5e7eb}[data-theme=light] .top-song-card h4{color:#1f2937}[data-theme=light] .top-song-info h5{color:#667eea}[data-theme=light] .top-song-stats{color:#6b7280}[data-theme=light] .chart-container{background:#fff;border-color:#e5e7eb}[data-theme=light] .chart-container h4{color:#1f2937}[data-theme=light] .stats-table-header{border-bottom-color:#e0e0e0;color:#1f2937}[data-theme=light] .stats-table-row{border-bottom-color:#f0f0f0}[data-theme=light] .stats-table-row:hover{background:#f9f9f9}[data-theme=light] .stats-col-title{color:#1f2937}[data-theme=light] .stats-col-title a{color:#667eea}[data-theme=light] .form-group small,[data-theme=light] .loading,[data-theme=light] .stats-col-comments,[data-theme=light] .stats-col-likes,[data-theme=light] .stats-col-views{color:#6b7280}[data-theme=light] .placeholder-cover-small{background:#f9fafb;color:#6b7280}[data-theme=light] .bar-label{color:#6b7280}[data-theme=light] .bar-chart{border-bottom-color:#e0e0e0}[data-theme=light] .songs-stats-table{background:#fff;border-color:#e5e7eb}[data-theme=light] .message,[data-theme=light] .songs-stats-table h4{color:#1f2937}:root.dark .bar-label,[data-theme=dark] .bar-label{color:#b3b3b3;color:var(--text-secondary,#b3b3b3)}:root.dark .bar-chart,[data-theme=dark] .bar-chart{border-bottom-color:#ffffff1a;border-bottom-color:var(--border-color,#ffffff1a)}:root.dark .songs-stats-table,[data-theme=dark] .songs-stats-table{background:#1a1a1a;background:var(--bg-secondary,#1a1a1a);border-color:#ffffff1a;border-color:var(--border-color,#ffffff1a)}:root.dark .songs-stats-table h4,[data-theme=dark] .songs-stats-table h4{color:#fff;color:var(--text-primary,#fff)}.playlists-page{min-height:100vh;padding:40px 0}.playlists-grid{grid-gap:24px;display:grid;gap:24px;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));margin-bottom:40px}.playlist-card{background:#fff;border-radius:12px;box-shadow:0 4px 6px #0000001a;overflow:hidden;position:relative;transition:transform .3s ease,box-shadow .3s ease}.playlist-card:hover{box-shadow:0 12px 24px #00000026;transform:translateY(-8px)}.playlist-link{color:inherit;display:block;text-decoration:none}.playlist-cover{background:linear-gradient(135deg,#667eea,#764ba2);height:250px;overflow:hidden;width:100%}.playlist-cover img{height:100%;object-fit:cover;width:100%}.placeholder-cover{align-items:center;display:flex;font-size:80px;height:100%;justify-content:center;width:100%}.playlist-info{padding:20px}.playlist-info h3{color:#333;font-size:20px;margin-bottom:10px}.playlist-description{color:#666;font-size:14px;line-height:1.6;margin-bottom:15px}.playlist-stats{align-items:center;color:#888;display:flex;font-size:14px;justify-content:space-between}.public-badge{background:#4caf50;border-radius:4px;color:#fff;font-size:12px;padding:4px 8px}.delete-btn{align-items:center;background:#f00c;border:none;border-radius:50%;color:#fff;cursor:pointer;display:flex;font-size:24px;height:32px;justify-content:center;position:absolute;right:10px;top:10px;transition:background .3s ease;width:32px;z-index:10}.delete-btn:hover{background:red}.create-playlist-form{background:#fff;border-radius:12px;box-shadow:0 4px 6px #0000001a;margin-bottom:30px;padding:30px}.create-playlist-form .form-group{margin-bottom:20px}.create-playlist-form label{color:#333;display:block;font-weight:600;margin-bottom:8px}.create-playlist-form input,.create-playlist-form textarea{border:1px solid #ddd;border-radius:8px;font-family:inherit;font-size:16px;padding:12px;width:100%}.create-playlist-form textarea{resize:vertical}.form-actions button{flex:1 1}.playlists-header{align-items:center;display:flex;flex-wrap:wrap;gap:15px;justify-content:space-between;margin-bottom:30px}@media (max-width:768px){.playlists-page{padding:20px 0}.hero-section{padding:50px 15px}.hero-section h1{font-size:32px}.hero-section p{font-size:16px}.playlists-header{align-items:stretch;flex-direction:column;margin-bottom:20px}.playlists-header .section-title{font-size:24px;margin-bottom:10px}.playlists-header .btn{text-align:center;width:100%}.playlists-grid{gap:16px;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));margin-bottom:30px}.playlist-cover{height:200px}.placeholder-cover{font-size:60px}.playlist-info{padding:15px}.playlist-info h3{font-size:16px}.playlist-description{font-size:13px;margin-bottom:12px}.playlist-stats{flex-wrap:wrap;font-size:12px;gap:8px}.delete-btn{font-size:20px;height:28px;right:8px;top:8px;width:28px}.create-playlist-form{margin-bottom:20px;padding:20px 15px}.create-playlist-form label{font-size:14px}.create-playlist-form input,.create-playlist-form textarea{font-size:14px;padding:10px}.form-actions{flex-direction:column}.form-actions button{width:100%}}@media (max-width:480px){.playlists-page{padding:15px 0}.hero-section{padding:40px 12px}.hero-section h1{font-size:24px}.hero-section p{font-size:14px}.playlists-header{margin-bottom:15px}.playlists-header .section-title{font-size:20px}.playlists-grid{gap:12px;grid-template-columns:1fr}.playlist-cover{height:180px}.placeholder-cover{font-size:50px}.playlist-info{padding:12px}.playlist-info h3{font-size:15px}.playlist-description{font-size:12px}.playlist-stats{font-size:11px}.delete-btn{font-size:18px;height:26px;width:26px}.create-playlist-form{padding:15px 12px}.create-playlist-form input,.create-playlist-form textarea{font-size:13px;padding:10px}}:root.dark .playlists-page{background:var(--bg-gradient-dark)}:root.dark .playlist-card{background:var(--bg-secondary);border:1px solid var(--border-color);box-shadow:var(--shadow-md)}:root.dark .playlist-card:hover{border-color:var(--primary-color);box-shadow:var(--shadow-xl)}:root.dark .playlist-info h3{color:var(--text-primary)}:root.dark .playlist-description,:root.dark .playlist-stats{color:var(--text-secondary)}:root.dark .create-playlist-form{background:var(--bg-secondary);border:1px solid var(--border-color);box-shadow:var(--shadow-md)}:root.dark .create-playlist-form label{color:var(--text-primary)}:root.dark .create-playlist-form input,:root.dark .create-playlist-form textarea{background:var(--bg-primary);border-color:var(--border-color);color:var(--text-primary)}:root.dark .create-playlist-form input:focus,:root.dark .create-playlist-form textarea:focus{border-color:var(--primary-color);box-shadow:0 0 0 3px #7c8ef51a;outline:none}.collaborative-playlist-manager{background:#fff;border-radius:12px;box-shadow:0 2px 8px #0000001a;margin-top:20px;padding:20px}.collaborative-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:20px}.collaborative-header h3{color:#333;font-size:18px;margin:0}.btn-add-collaborator{background:linear-gradient(135deg,#667eea,#764ba2);border:none;border-radius:6px;color:#fff;cursor:pointer;font-size:14px;font-weight:600;padding:8px 16px;transition:all .3s ease}.btn-add-collaborator:hover{box-shadow:0 4px 12px #667eea66;transform:translateY(-2px)}.add-collaborator-form{background:#f8f9fa;border-radius:8px;margin-bottom:20px;padding:20px}.form-group{margin-bottom:15px}.form-group label{margin-bottom:6px}.form-group input,.form-group select{border:2px solid #e0e0e0;border-radius:6px;font-size:14px;padding:10px;transition:border-color .3s ease;width:100%}.form-group input:focus,.form-group select:focus{border-color:#667eea;outline:none}.btn-submit{background:#667eea;border:none;border-radius:6px;color:#fff;cursor:pointer;font-size:14px;font-weight:600;padding:10px 20px;transition:all .3s ease}.btn-submit:hover{background:#5568d3;transform:translateY(-1px)}.error-message{background:#fee;border-radius:6px;color:#c33;font-size:14px;margin-bottom:15px;padding:10px}.loading,.no-collaborators{color:#999;padding:40px 20px;text-align:center}.no-collaborators .hint{color:#bbb;font-size:12px;margin-top:10px}.collaborators-list{display:flex;flex-direction:column;gap:12px}.collaborator-item{align-items:center;background:#f8f9fa;border:1px solid #e0e0e0;border-radius:8px;display:flex;justify-content:space-between;padding:15px}.collaborator-info{display:flex;flex-direction:column;gap:6px}.collaborator-user{color:#333;font-size:14px;font-weight:600}.collaborator-role{border-radius:12px;display:inline-block;font-size:12px;padding:4px 10px;width:-webkit-fit-content;width:fit-content}.role-owner{background:gold;color:#333}.role-editor{background:#667eea;color:#fff}.role-viewer{background:#95a5a6;color:#fff}.collaborator-actions{align-items:center;display:flex;gap:10px}.role-select{border:2px solid #e0e0e0;border-radius:6px;padding:6px 10px}.btn-remove,.role-select{cursor:pointer;font-size:13px}.btn-remove{background:#e74c3c;border:none;border-radius:6px;color:#fff;font-weight:600;padding:6px 12px;transition:all .2s ease}.btn-remove:hover{background:#c0392b}@media (max-width:768px){.collaborative-header{gap:15px}.collaborative-header,.collaborator-item{align-items:flex-start;flex-direction:column}.collaborator-item{gap:12px}.collaborator-actions{justify-content:space-between;width:100%}.role-select{flex:1 1}}:root.dark .collaborative-playlist-manager{background:var(--bg-secondary);border:1px solid var(--border-color);box-shadow:var(--shadow-md)}:root.dark .collaborative-header h3{color:var(--text-primary)}:root.dark .add-collaborator-form{background:var(--bg-tertiary);border:1px solid var(--border-color)}:root.dark .form-group input,:root.dark .form-group select{background:var(--bg-primary);border-color:var(--border-color);color:var(--text-primary)}:root.dark .form-group input:focus,:root.dark .form-group select:focus{border-color:var(--primary-color);box-shadow:0 0 0 3px #7c8ef51a}:root.dark .error-message{background:#ef44441a;border:1px solid var(--error);color:var(--error)}:root.dark .loading,:root.dark .no-collaborators{color:var(--text-secondary)}:root.dark .collaborator-item{background:var(--bg-tertiary);border-color:var(--border-color)}:root.dark .collaborator-user,:root.dark .role-select{color:var(--text-primary)}:root.dark .role-select{background:var(--bg-primary);border-color:var(--border-color)}.playlist-detail-page{min-height:100vh;padding:0}.playlist-header{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;padding:60px 20px}.playlist-header-content{align-items:flex-start;display:flex;gap:40px;margin:0 auto;max-width:1200px}.playlist-cover-large{border-radius:12px;box-shadow:0 8px 16px #0000004d;flex-shrink:0;height:300px;overflow:hidden;width:300px}.playlist-cover-large img{height:100%;object-fit:cover;width:100%}.placeholder-cover-large{align-items:center;background:#fff3;display:flex;font-size:120px;height:100%;justify-content:center;width:100%}.playlist-header-info{flex:1 1;padding-top:20px}.playlist-header-info h1{color:#fff;font-size:48px;margin-bottom:20px}.playlist-header-info .playlist-description{font-size:18px;line-height:1.6;margin-bottom:20px;opacity:.9}.playlist-meta{align-items:center;font-size:16px;margin-bottom:30px}.playlist-actions,.playlist-meta{display:flex;gap:15px}.btn-danger{background:#dc3545;border:none;border-radius:8px;color:#fff;cursor:pointer;font-size:16px;padding:12px 24px;transition:background .3s ease}.btn-danger:hover{background:#c82333}.edit-form{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffff1a;border-radius:8px;padding:20px}.edit-input{font-size:24px;font-weight:600}.edit-input,.edit-textarea{border:none;border-radius:8px;margin-bottom:15px;padding:12px;width:100%}.edit-textarea{font-family:inherit;font-size:16px;resize:vertical}.edit-actions{display:flex;gap:10px}.playlist-songs{padding:40px 20px}.playlist-songs h2{color:#333;margin-bottom:30px}.songs-list{display:flex;flex-direction:column;gap:15px}.playlist-song-item{align-items:center;background:#fff;border-radius:12px;box-shadow:0 2px 4px #0000001a;display:flex;gap:20px;padding:15px;position:relative;transition:transform .2s ease,box-shadow .2s ease}.playlist-song-item:hover{box-shadow:0 4px 8px #00000026;transform:translateX(5px)}.song-number{color:#999;font-size:20px;font-weight:600;min-width:40px;text-align:center}.song-item-link{align-items:center;color:inherit;display:flex;flex:1 1;gap:20px;text-decoration:none}.song-item-cover{background:linear-gradient(135deg,#667eea,#764ba2);border-radius:8px;height:80px;overflow:hidden;width:80px}.song-item-cover img{height:100%;object-fit:cover;width:100%}.placeholder-cover-small{font-size:30px}.song-item-info{flex:1 1}.song-item-info h3{color:#333;font-size:18px;margin-bottom:5px}.song-item-artist{color:#666;font-size:14px;margin-bottom:8px}.song-item-stats{color:#888;display:flex;font-size:14px;gap:15px}.remove-song-btn{align-items:center;background:#dc3545;border:none;border-radius:50%;color:#fff;cursor:pointer;display:flex;flex-shrink:0;font-size:24px;height:32px;justify-content:center;transition:background .3s ease;width:32px}.remove-song-btn:hover{background:#c82333}.error-message{color:#dc3545;font-size:18px}.song-item-actions{align-items:center;display:flex;flex-shrink:0;gap:8px}@media (max-width:768px){.playlist-header{padding:30px 15px}.playlist-header-content{align-items:center;flex-direction:column;gap:20px;text-align:center}.playlist-cover-large{height:200px;margin:0 auto;width:200px}.placeholder-cover-large{font-size:80px}.playlist-header-info{padding-top:0;width:100%}.playlist-header-info h1{font-size:32px;margin-bottom:15px}.playlist-header-info .playlist-description{font-size:16px;margin-bottom:15px}.playlist-meta{font-size:14px;justify-content:center;margin-bottom:20px}.playlist-actions{flex-direction:column;gap:10px;width:100%}.playlist-actions .btn{text-align:center;width:100%}.edit-form{padding:15px}.edit-input{font-size:20px;margin-bottom:12px}.edit-textarea{font-size:14px;margin-bottom:12px}.edit-actions{flex-direction:column}.edit-actions .btn{width:100%}.playlist-songs{padding:20px 15px}.playlist-songs h2{font-size:24px;margin-bottom:20px}.playlist-song-item{align-items:stretch;flex-direction:column;gap:15px;padding:15px}.song-number{display:none}.song-item-link{align-items:flex-start;flex-direction:column;gap:12px}.song-item-cover{height:200px;margin:0 auto;max-width:200px;width:100%}.placeholder-cover-small{font-size:50px}.song-item-info{text-align:center;width:100%}.song-item-info h3{font-size:16px}.song-item-artist{font-size:13px}.song-item-stats{font-size:12px;gap:12px;justify-content:center}.song-item-actions{gap:10px;justify-content:center;width:100%}.song-item-actions .btn{flex:1 1}.remove-song-btn{font-size:20px;height:36px;width:36px}}@media (max-width:480px){.playlist-header{padding:20px 12px}.playlist-cover-large{height:150px;width:150px}.placeholder-cover-large{font-size:60px}.playlist-header-info h1{font-size:24px}.playlist-header-info .playlist-description{font-size:14px}.playlist-meta{flex-wrap:wrap;font-size:12px;justify-content:center}.edit-input{font-size:18px}.edit-textarea{font-size:13px}.playlist-songs{padding:15px 10px}.playlist-songs h2{font-size:20px;margin-bottom:15px}.playlist-song-item{gap:12px;padding:12px}.song-item-cover{height:150px;max-width:150px}.placeholder-cover-small{font-size:40px}.song-item-info h3{font-size:15px}.song-item-artist{font-size:12px}.song-item-stats{font-size:11px;gap:10px}.song-item-actions{flex-direction:column;width:100%}.song-item-actions .btn{width:100%}.remove-song-btn{border-radius:8px;font-size:18px;height:40px;width:100%}}:root.dark .playlist-detail-page{background:var(--bg-gradient-dark)}:root.dark .playlist-content{background:var(--bg-secondary);border:1px solid var(--border-color)}:root.dark .playlist-content h2{color:var(--text-primary)}:root.dark .song-item{background:var(--bg-tertiary);border-color:var(--border-color)}:root.dark .song-item:hover{background:var(--bg-secondary);border-color:var(--primary-color)}:root.dark .song-item-info h3{color:var(--text-primary)}:root.dark .song-item-artist,:root.dark .song-item-stats{color:var(--text-secondary)}:root.dark .edit-form{background:#1a1d3a80}:root.dark .edit-input{background:var(--bg-primary);border-color:var(--border-color);color:var(--text-primary)}:root.dark .edit-input:focus{border-color:var(--primary-color);box-shadow:0 0 0 3px #7c8ef51a;outline:none}.listening-history-page{margin:0 auto;max-width:1200px;min-height:calc(100vh - 200px);padding:40px 20px}.history-header{margin-bottom:40px;padding:20px 0;text-align:center}.history-header h1{color:#fff;font-size:32px;font-weight:700;line-height:1.2;margin-bottom:12px}.history-header p{color:#fff;font-size:16px;font-weight:400;line-height:1.5;opacity:.9}.history-stats{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));margin-bottom:40px}.stat-card{background:linear-gradient(135deg,#667eea,#764ba2);box-shadow:0 4px 15px #667eea4d;color:#fff;padding:24px;text-align:center}.stat-number{display:block;font-size:36px;font-weight:800;margin-bottom:8px}.stat-label{display:block;font-size:14px;opacity:.9}.history-content{margin-top:30px}.history-day-group{margin-bottom:40px}.history-date{border-bottom:2px solid #fff3;color:#fff;font-size:20px;font-weight:600;margin-bottom:20px;padding-bottom:10px}.history-grid{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));margin-bottom:30px}.history-card{background:#fff;border-radius:12px;box-shadow:0 2px 8px #00000014;overflow:hidden;position:relative;transition:all .3s cubic-bezier(.4,0,.2,1)}.history-card:hover{box-shadow:0 8px 24px #0000001f;transform:translateY(-4px)}.history-card-link{color:inherit;display:block;text-decoration:none}.history-card-cover{background:linear-gradient(135deg,#667eea,#764ba2);overflow:hidden;padding-top:100%;position:relative;width:100%}.history-card-cover img{object-fit:cover}.history-card-cover img,.placeholder-cover-card{height:100%;left:0;position:absolute;top:0;width:100%}.placeholder-cover-card{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;font-size:48px}.history-card-overlay,.placeholder-cover-card{align-items:center;display:flex;justify-content:center}.history-card-overlay{background:#0006;bottom:0;left:0;opacity:0;position:absolute;right:0;top:0;transition:opacity .3s ease}.history-card:hover .history-card-overlay{opacity:1}.history-card-play-btn{align-items:center;background:#fffffff2;border:none;border-radius:50%;box-shadow:0 4px 12px #0003;color:#667eea;cursor:pointer;display:flex;height:56px;justify-content:center;transition:all .3s cubic-bezier(.4,0,.2,1);width:56px}.history-card-play-btn:hover{background:#fff;box-shadow:0 6px 20px #0000004d;transform:scale(1.1)}.history-card-play-btn svg{height:24px;width:24px}.history-card-info{padding:16px}.history-card-title{color:#1a1a1a;font-size:16px;font-weight:600;margin:0 0 6px}.history-card-artist,.history-card-title{line-height:1.3;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.history-card-artist{color:#666;font-size:14px;margin:0 0 8px}.history-card-meta{align-items:center;color:#999;display:flex;font-size:12px;gap:8px}.history-card-time{align-items:center;display:flex;gap:4px}.history-list{display:flex;flex-direction:column;gap:12px}.history-item{align-items:center;background:#fff;border-radius:10px;box-shadow:0 2px 8px #0000000d;display:flex;gap:15px;padding:15px;transition:all .3s ease}.history-item:hover{box-shadow:0 4px 15px #0000001a;transform:translateY(-2px)}.history-song-link{align-items:center;color:inherit;display:flex;flex:1 1;gap:15px;text-decoration:none}.history-song-cover{border-radius:8px;flex-shrink:0;height:60px;overflow:hidden;width:60px}.history-song-cover img{height:100%;object-fit:cover;width:100%}.placeholder-cover-small{align-items:center;background:linear-gradient(135deg,#667eea,#764ba2);display:flex;font-size:24px;height:100%;justify-content:center;width:100%}.history-song-info{flex:1 1;min-width:0}.history-song-info h3{color:#333;font-size:16px;font-weight:600;margin:0 0 5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.history-song-artist{color:#666;font-size:14px;margin:0 0 8px}.history-song-meta{color:#999;display:flex;font-size:12px;gap:15px}.history-duration,.history-time{align-items:center;display:flex}.history-completed{color:#25d366;font-weight:500}.history-play-btn{align-items:center;background:linear-gradient(135deg,#667eea,#764ba2);border:none;border-radius:50%;color:#fff;cursor:pointer;display:flex;flex-shrink:0;font-size:18px;height:45px;justify-content:center;transition:all .3s ease;width:45px}.history-play-btn:hover{box-shadow:0 4px 15px #667eea66;transform:scale(1.1)}.empty-state,.loading{color:#666;padding:60px 20px}.empty-state p{font-size:18px}.pagination-controls{margin-top:40px;padding:20px}.pagination-btn{background:#667eea;border-radius:6px}.pagination-btn:hover:not(:disabled){background:#5568d3}.pagination-info{color:#666;font-size:14px}@media (max-width:768px){.listening-history-page{padding:20px 15px}.history-header h1{font-size:24px}.history-header p{font-size:14px}.history-stats{gap:15px;grid-template-columns:1fr;margin-bottom:30px}.stat-card{padding:20px}.stat-number{font-size:28px}.history-grid{gap:15px;grid-template-columns:repeat(auto-fill,minmax(140px,1fr))}.history-card-info{padding:12px}.history-card-title{font-size:14px}.history-card-artist{font-size:12px}.history-card-meta{font-size:11px}.history-card-play-btn{height:48px;width:48px}.history-card-play-btn svg{height:20px;width:20px}.history-item{padding:12px}.history-song-cover{height:50px;width:50px}.history-song-info h3{font-size:14px}.history-song-artist{font-size:12px}.history-song-meta{flex-wrap:wrap;font-size:11px;gap:10px}.history-play-btn{font-size:16px;height:40px;width:40px}.pagination-controls{flex-wrap:wrap;gap:15px;padding:15px}.pagination-btn{font-size:13px;padding:8px 16px}}@media (max-width:480px){.history-grid{gap:12px;grid-template-columns:repeat(auto-fill,minmax(120px,1fr))}.history-card-info{padding:10px}.history-card-title{font-size:13px}.history-card-artist{font-size:11px}}@media (prefers-color-scheme:dark){.listening-history-page{color:#f5f5f5}.history-header h1{color:#fff}.history-header p{color:#fff;opacity:.9}.history-date{border-bottom-color:#fff3;color:#fff}.history-card{background:#ffffff0d;border:1px solid #ffffff1a}.history-card:hover{background:#ffffff14;border-color:#ffffff26}.history-card-title{color:#f5f5f5}.history-card-artist{color:#999}.history-card-meta{color:#666}.history-item{background:#ffffff0d;border:1px solid #ffffff1a}.history-item:hover{background:#ffffff14}.history-song-info h3{color:#f5f5f5}.history-song-artist{color:#999}.history-song-meta{color:#666}.empty-state,.loading,.pagination-info{color:#999}}:root.dark .listening-history-page{background:var(--bg-gradient-dark)}:root.dark .history-header h1{color:var(--text-primary)}:root.dark .history-header p{color:var(--text-secondary)}:root.dark .history-song-item{background:var(--bg-secondary);border-color:var(--border-color)}:root.dark .history-song-item:hover{background:var(--bg-tertiary);border-color:var(--primary-color)}:root.dark .history-song-title{color:var(--text-primary)}:root.dark .history-song-artist,:root.dark .history-song-meta{color:var(--text-secondary)}.radio-page{min-height:calc(100vh - 200px);padding:40px 0}.radio-page-header{margin-bottom:40px;text-align:center}.radio-page-header h1{color:#fff;font-size:32px;font-weight:700;margin-bottom:10px}.radio-page-header p{color:#fff;font-size:16px;opacity:.9}@media (max-width:768px){.radio-page{padding:20px 0}.radio-page-header h1{color:#fff;font-size:24px}.radio-page-header p{color:#fff;font-size:14px;opacity:.9}}:root.dark .radio-page{background:var(--bg-gradient-dark)}:root.dark .radio-page-header h1{color:var(--text-primary)}:root.dark .radio-page-header p{color:var(--text-secondary)}.geolocation-stats{margin:0 auto;max-width:1200px;padding:20px}.stats-header{margin-bottom:30px;text-align:center}.stats-header h1{color:var(--text-primary);font-size:32px;margin-bottom:10px}.stats-subtitle{color:var(--text-secondary);font-size:16px}.stats-controls{display:flex;flex-wrap:wrap;gap:20px;justify-content:center;margin-bottom:30px}.control-group{display:flex;flex-direction:column;gap:8px}.control-group label{color:var(--text-primary);font-size:14px;font-weight:500}.control-group select{background:var(--bg-primary);border:1px solid #ddd;border:1px solid var(--border-color,#ddd);border-radius:8px;color:var(--text-primary);cursor:pointer;font-size:14px;padding:10px 15px}.stats-summary{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));margin-bottom:30px}.summary-card{background:var(--bg-secondary);border-radius:12px;box-shadow:var(--shadow-sm);padding:20px;text-align:center}.summary-card h3{color:var(--primary-color);font-size:32px;font-weight:700;margin-bottom:8px}.summary-card p{color:var(--text-secondary);font-size:14px;margin:0}.stats-list{margin-top:30px}.stats-list h2{color:var(--text-primary);margin-bottom:20px}.stats-table{background:var(--bg-primary);border-radius:12px;box-shadow:var(--shadow-sm);overflow:hidden}.table-header{background:var(--bg-secondary);border-bottom:2px solid #eee;border-bottom:2px solid var(--border-color,#eee);color:var(--text-primary);font-size:14px;font-weight:600}.table-header,.table-row{grid-gap:15px;display:grid;gap:15px;grid-template-columns:2fr 1fr 1fr 1.5fr 1.5fr;padding:15px 20px}.table-row{border-bottom:1px solid #eee;border-bottom:1px solid var(--border-color,#eee);transition:background-color .2s}.table-row:hover{background:var(--bg-secondary)}.table-row.clickable{cursor:pointer}.table-row.clickable:hover{background:var(--bg-tertiary)}.col-location{align-items:center;color:var(--text-primary);display:flex;font-weight:500;gap:8px}.click-hint{color:var(--primary-color);font-size:18px;opacity:.6}.col-avg,.col-duration,.col-plays,.col-users{color:var(--text-secondary);font-size:14px}.empty-state{color:var(--text-secondary)}.country-details{background:var(--bg-primary);border-radius:12px;box-shadow:var(--shadow-sm);margin-top:30px;padding:30px}.back-button{background:var(--primary-color);border:none;border-radius:8px;color:#fff;cursor:pointer;font-size:14px;margin-bottom:20px;padding:10px 20px;transition:background-color .2s}.back-button:hover{background:var(--primary-dark)}.country-details h2{color:var(--text-primary);margin-bottom:30px}.cities-section,.top-songs-section{margin-bottom:40px}.cities-section h3,.top-songs-section h3{color:var(--text-primary);font-size:20px;margin-bottom:20px}.cities-list{display:flex;flex-direction:column;gap:12px}.city-item{align-items:center;background:var(--bg-secondary);border-radius:8px;display:flex;justify-content:space-between;padding:15px}.city-name{color:var(--text-primary);font-weight:500}.city-stats{color:var(--text-secondary);font-size:14px}.top-songs-list{display:flex;flex-direction:column;gap:12px}.song-item{align-items:center;background:var(--bg-secondary);border-radius:8px;display:flex;gap:15px;padding:15px}.song-rank{color:var(--primary-color);font-size:18px;font-weight:700;min-width:40px}.song-info{display:flex;flex:1 1;flex-direction:column;gap:4px}.song-title{color:var(--text-primary);font-weight:500}.song-artist,.song-plays{color:var(--text-secondary);font-size:14px}.loading-container{align-items:center;display:flex;flex-direction:column;gap:20px;justify-content:center;padding:60px 20px}.loader{animation:spin 1s linear infinite;border:4px solid var(--bg-secondary);border-radius:50%;border-top-color:var(--primary-color);height:40px;width:40px}@keyframes spin{to{transform:rotate(1turn)}}.loading-overlay{align-items:center;background:#00000080;bottom:0;display:flex;justify-content:center;left:0;position:fixed;right:0;top:0;z-index:1000}@media (max-width:768px){.geolocation-stats{padding:15px}.stats-header h1{font-size:24px}.table-header,.table-row{font-size:12px;grid-template-columns:1.5fr 1fr 1fr}.col-avg,.col-duration{display:none}.stats-summary{grid-template-columns:1fr}.country-details{padding:20px}}.followed-artists{min-height:100vh;padding:40px 0}.followed-artists h1{color:#fff;font-size:32px;margin-bottom:30px;text-align:center}.artists-grid{grid-gap:24px;display:grid;gap:24px;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));margin-bottom:20px}.artist-card{align-items:center;background:#fff;border:1px solid #0000000d;border-radius:20px;box-shadow:0 6px 20px #0000001a;color:inherit;display:flex;flex-direction:column;overflow:hidden;padding:24px 20px;position:relative;text-align:center;text-decoration:none;transition:all .4s cubic-bezier(.4,0,.2,1)}.artist-card:hover{border-color:#667eea33;box-shadow:0 16px 40px #667eea4d;transform:translateY(-12px) scale(1.03)}.artist-avatar{background:linear-gradient(135deg,#667eea,#764ba2);border:4px solid #fff;border-radius:50%;box-shadow:0 8px 24px #667eea4d;height:110px;margin-bottom:16px;overflow:hidden;transition:all .4s cubic-bezier(.4,0,.2,1);width:110px}.artist-card:hover .artist-avatar{box-shadow:0 12px 32px #667eea66;transform:scale(1.1) rotate(5deg)}.artist-avatar img{height:100%;object-fit:cover;width:100%}.placeholder-avatar{align-items:center;display:flex;font-size:38px;height:100%;justify-content:center;width:100%}.artist-info{width:100%}.artist-info h3{color:#333;font-size:18px;margin:0 0 8px}.artist-description{color:#666;font-size:12px;line-height:1.45;margin:8px 0}.artist-stats{margin-top:10px}.artist-songs-count{background:#667eea1f;border-radius:18px;color:#667eea;display:inline-block;font-size:12px;font-weight:600;padding:3px 10px}@media (max-width:768px){.artists-grid{gap:15px;grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}.artist-card{padding:20px 15px}.artist-avatar{height:90px;width:90px}}:root.dark .followed-artists{background:var(--bg-gradient-dark)}:root.dark .followed-artists h1{color:var(--text-primary)}:root.dark .artist-card{background:var(--bg-secondary);border-color:var(--border-color);box-shadow:var(--shadow-md)}:root.dark .artist-card:hover{border-color:var(--primary-color);box-shadow:var(--shadow-xl)}:root.dark .artist-info h3{color:var(--text-primary)}:root.dark .artist-description{color:var(--text-secondary)}:root.dark .artist-songs-count{background:#7c8ef526;color:var(--primary-color)}.events-page{min-height:calc(100vh - 200px);padding:30px 0}.events-header{align-items:center;display:flex;flex-wrap:wrap;gap:20px;justify-content:space-between;margin-bottom:30px}.events-header h1{-webkit-text-fill-color:#0000;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;background-clip:text;font-size:2.5em;margin:0}.events-filters{align-items:center;display:flex;flex-wrap:wrap;gap:20px;margin-bottom:30px}.filter-buttons{display:flex;gap:10px}.filter-btn{background:#fff;border:2px solid #e0e0e0;font-weight:600}.filter-btn:hover{border-color:#667eea;color:#667eea}.city-filter{flex:1 1;min-width:200px}.city-select{background:#fff;border:2px solid #e0e0e0;border-radius:8px;font-size:14px;padding:10px 15px;width:100%}.view-mode-toggle{display:flex;gap:10px}.view-btn{background:#fff;border:2px solid #e0e0e0;border-radius:8px;cursor:pointer;padding:10px 20px;transition:all .3s ease}.view-btn.active,.view-btn:hover{border-color:#667eea}.view-btn.active{background:#667eea;color:#fff}.events-grid{grid-gap:25px;display:grid;gap:25px;grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}.event-card{background:#fff;border-radius:12px;box-shadow:0 4px 12px #0000001a;color:inherit;display:flex;flex-direction:column;overflow:hidden;transition:all .3s ease}.event-card:hover{box-shadow:0 8px 24px #667eea33;transform:translateY(-5px)}.event-card-link{color:inherit;display:flex;flex:1 1;flex-direction:column;text-decoration:none}.event-cover{background:linear-gradient(135deg,#667eea,#764ba2);height:200px;overflow:hidden;position:relative;width:100%}.event-cover img{height:100%;object-fit:cover;width:100%}.event-placeholder{align-items:center;display:flex;font-size:64px;height:100%;justify-content:center;width:100%}.event-status-badge{border-radius:20px;color:#fff;font-size:12px;font-weight:600;padding:5px 12px;position:absolute;right:10px;top:10px;z-index:1}.event-status-badge.published{background:#4caf50e6}.event-status-badge.draft{background:#ff9800e6}.event-info{display:flex;flex:1 1;flex-direction:column;padding:20px}.event-info h3{color:#333;font-size:1.3em;margin:0 0 10px}.event-artist{color:#667eea;font-size:.9em;font-weight:600;margin:0 0 15px}.event-details{margin-top:auto}.event-details p{color:#666;font-size:.9em;margin:8px 0}.event-price{color:#4caf50;font-weight:600}.event-tickets{color:#ff9800;font-weight:600}.event-card-actions{border-top:1px solid #e0e0e0;display:flex;gap:8px;justify-content:center;padding:12px 16px}.sold-out-badge{background:#ef44441a;color:#ef4444;display:inline-block;font-size:14px;padding:8px 16px}.empty-state{background:#fff;border-radius:12px;box-shadow:0 4px 12px #0000001a;padding:60px 20px;text-align:center}.empty-state p{color:#666;font-size:1.2em;margin-bottom:20px}:root.dark .events-page{background:var(--bg-primary)}:root.dark .event-card{background:#141928cc;border:1px solid #ffffff1a}:root.dark .event-info h3{color:var(--text-primary)}:root.dark .event-details p{color:var(--text-secondary)}:root.dark .event-card-link{color:var(--text-primary)}:root.dark .event-card-actions{border-top-color:var(--border-color)}:root.dark .sold-out-badge{background:#ef444433;color:#fca5a5}:root.dark .city-select,:root.dark .filter-btn,:root.dark .view-btn{background:#141928cc;border-color:#ffffff1a;color:var(--text-primary)}:root.dark .filter-btn:hover,:root.dark .view-btn:hover{border-color:#7c8ef5}:root.dark .empty-state{background:#141928cc;border:1px solid #ffffff1a}:root.dark .empty-state p{color:var(--text-secondary)}@media (max-width:768px){.events-header{align-items:flex-start;flex-direction:column}.events-filters{align-items:stretch;flex-direction:column}.filter-buttons{justify-content:space-between;width:100%}.filter-btn{flex:1 1}.events-grid{grid-template-columns:1fr}}.create-event-page{min-height:calc(100vh - 200px);padding:30px 0}.create-event-header{align-items:center;display:flex;flex-wrap:wrap;gap:20px;justify-content:space-between;margin-bottom:30px}.create-event-header h1{-webkit-text-fill-color:#0000;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;background-clip:text;font-size:2.5em;margin:0}.event-form{background:#fff;border-radius:12px;box-shadow:0 4px 12px #0000001a;padding:30px}.form-section{border-bottom:1px solid #e0e0e0;margin-bottom:40px;padding-bottom:30px}.form-section:last-of-type{border-bottom:none}.form-section h2{color:#333;font-size:1.5em;margin:0 0 20px}.form-group{margin-bottom:20px}.form-group label{color:#333;display:block;font-weight:600;margin-bottom:8px}.form-group input,.form-group select,.form-group textarea{background:#fff;box-sizing:border-box;color:#333;cursor:pointer;padding:12px;transition:all .3s ease;width:100%}.form-group select{-webkit-appearance:none;appearance:none;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12'%3E%3Cpath fill='%23333' d='M6 9 1 4h10z'/%3E%3C/svg%3E");background-position:right 12px center;background-repeat:no-repeat;padding-right:40px}.form-group input:hover,.form-group select:hover,.form-group textarea:hover{border-color:#b0b0b0}.form-group input:focus,.form-group select:focus,.form-group textarea:focus{border-color:#667eea}.form-row{grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}.price-input-group{align-items:stretch;display:flex;gap:10px;width:100%}.price-input{flex:1 1;min-width:0;width:100%}.currency-select{background:#fff;border:2px solid #e0e0e0;border-radius:8px;color:#333;cursor:pointer;flex-shrink:0;font-family:inherit;font-size:14px;max-width:200px;min-width:180px;padding:12px;transition:border-color .3s ease;width:auto}.currency-select:focus{border-color:#667eea;outline:none}.currency-select:hover{border-color:#667eea}.image-preview{margin-top:15px}.image-preview img{border:2px solid #e0e0e0;border-radius:8px;max-height:200px;max-width:200px}.checkbox-group label{align-items:center;cursor:pointer;display:flex;gap:10px}.checkbox-group input[type=checkbox]{cursor:pointer;width:auto}.form-actions{border-top:1px solid #e0e0e0;gap:15px;margin-top:30px;padding-top:30px}.message{font-weight:500;padding:15px 20px}.message.success{background:#d4edda;border:1px solid #c3e6cb;color:#155724}.message.error{background:#f8d7da;border:1px solid #f5c6cb;color:#721c24}:root.dark .event-form{background:#141928cc;border:1px solid #ffffff1a}:root.dark .form-section{border-bottom-color:#ffffff1a}:root.dark .form-section h2{color:var(--text-primary)}:root.dark .form-group input,:root.dark .form-group select,:root.dark .form-group textarea{background:#ffffff0d;border-color:#ffffff1a}:root.dark .form-group select{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12'%3E%3Cpath fill='%23fff' d='M6 9 1 4h10z'/%3E%3C/svg%3E")}:root.dark .currency-select{background:#ffffff0d;border-color:#ffffff1a;color:var(--text-primary)}:root.dark .currency-select:focus,:root.dark .currency-select:hover{border-color:#667eea}:root.dark .price-input{background:#ffffff0d;border-color:#ffffff1a;color:var(--text-primary)}:root.dark .form-actions{border-top-color:#ffffff1a}.premium-required-notice{align-items:center;background:linear-gradient(135deg,#fbbf24,#f59e0b);border-radius:8px;color:#fff;display:flex;font-size:14px;font-weight:600;gap:10px;padding:12px 20px}.premium-icon{font-size:18px}@media (max-width:768px){.create-event-header{align-items:flex-start;flex-direction:column}.create-event-header h1{font-size:2em}.event-form{padding:20px}.form-section{margin-bottom:30px;padding-bottom:20px}.form-section h2{font-size:1.3em}.form-row{gap:15px;grid-template-columns:1fr}.price-input-group{flex-direction:column;gap:10px}.currency-select{max-width:100%;min-width:100%;width:100%}.form-actions{flex-direction:column-reverse;gap:10px}.form-actions .btn{width:100%}}@media (max-width:480px){.create-event-page{padding:15px 0}.event-form{border-radius:8px;padding:15px}.create-event-header h1{font-size:1.5em}.form-section h2{font-size:1.2em}.form-group,.form-section h2{margin-bottom:15px}.form-group label{font-size:14px;margin-bottom:6px}.form-group input,.form-group select,.form-group textarea{font-size:14px;padding:10px}.price-input-group{gap:8px}.currency-select{font-size:14px;padding:10px}.form-actions{margin-top:20px;padding-top:20px}}.event-detail-page{min-height:calc(100vh - 200px);padding:30px 0}.back-link{display:inline-block;font-weight:600;margin-bottom:20px;transition:color .3s ease}.event-detail-header{grid-gap:40px;display:grid;gap:40px;grid-template-columns:400px 1fr;margin-bottom:40px}.event-cover-large{background:linear-gradient(135deg,#667eea,#764ba2);border-radius:12px;box-shadow:0 8px 24px #0003;height:400px;overflow:hidden;width:100%}.event-cover-large img{height:100%;object-fit:cover;width:100%}.event-placeholder-large{align-items:center;display:flex;font-size:120px;height:100%;justify-content:center;width:100%}.event-detail-info{display:flex;flex-direction:column}.event-title-row{align-items:center;display:flex;gap:15px;margin-bottom:15px}.event-detail-info h1{color:#333;flex:1 1;font-size:2.5em;margin:0}.event-artist{font-size:1.1em;margin:0 0 25px}.event-artist a{color:#667eea;font-weight:600;text-decoration:none}.event-artist a:hover{text-decoration:underline}.event-meta{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));margin-bottom:30px}.meta-item{background:#f8f9fa;border-radius:8px;display:flex;gap:15px;padding:15px}.meta-icon{flex-shrink:0;font-size:24px}.meta-item strong{color:#333;display:block;font-size:.9em;margin-bottom:5px}.meta-item p{color:#666;font-size:.9em;margin:0}.meta-item .address{color:#999;font-size:.85em}.event-description{background:#f8f9fa;border-radius:8px;margin-bottom:30px;padding:20px}.event-description h3{color:#333;margin:0 0 15px}.event-description p{color:#666;line-height:1.6;margin:0}.event-actions{display:flex;flex-wrap:wrap;gap:15px;margin-bottom:30px}.btn-large,.sold-out-badge{font-size:1.1em;padding:15px 30px}.sold-out-badge{background:#f44336;border-radius:8px;color:#fff;font-weight:600}.event-contact{background:#f8f9fa;border-radius:8px;padding:20px}.event-contact h3{color:#333;margin:0 0 15px}.event-contact p{color:#666;margin:8px 0}.event-contact a{color:#667eea;text-decoration:none}.event-contact a:hover{text-decoration:underline}.bookings-section{background:#fff;border-radius:12px;box-shadow:0 4px 12px #0000001a;margin-top:40px;padding:30px}.bookings-section h2{color:#333;margin:0 0 25px}.bookings-list{grid-gap:20px;display:grid;gap:20px}.booking-card{background:#f8f9fa;border-left:4px solid #667eea;border-radius:8px;padding:20px}.booking-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:15px}.booking-status{border-radius:20px;font-size:12px;font-weight:600;padding:5px 12px}.booking-status.confirmed{background:#4caf50;color:#fff}.booking-status.pending{background:#ff9800;color:#fff}.booking-status.cancelled{background:#f44336;color:#fff}.booking-details p{color:#666;font-size:.9em;margin:8px 0}:root.dark .event-detail-info h1{color:var(--text-primary)}:root.dark .event-artist a{color:#7c8ef5}:root.dark .meta-item{background:#ffffff0d}:root.dark .meta-item strong{color:var(--text-primary)}:root.dark .meta-item p{color:var(--text-secondary)}:root.dark .event-contact,:root.dark .event-description{background:#ffffff0d}:root.dark .event-contact h3,:root.dark .event-description h3{color:var(--text-primary)}:root.dark .event-contact p,:root.dark .event-description p{color:var(--text-secondary)}:root.dark .bookings-section{background:#141928cc;border:1px solid #ffffff1a}:root.dark .bookings-section h2{color:var(--text-primary)}:root.dark .booking-card{background:#ffffff0d;border-left-color:#7c8ef5}:root.dark .booking-details p{color:var(--text-secondary)}@media (max-width:1024px){.event-detail-header{grid-template-columns:1fr}.event-cover-large{height:300px}}@media (max-width:768px){.event-detail-info h1{font-size:2em}.event-meta{grid-template-columns:1fr}.event-actions{flex-direction:column}.event-actions .btn{width:100%}}.videos-page{min-height:calc(100vh - 200px);padding:30px 0}.videos-header{align-items:center;display:flex;flex-wrap:wrap;gap:20px;justify-content:space-between;margin-bottom:30px}.videos-header h1{-webkit-text-fill-color:#0000;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;background-clip:text;font-size:2.5em;margin:0}.videos-filters{align-items:center;background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:12px;display:flex;flex-wrap:wrap;gap:20px;margin-bottom:30px;padding:20px}.filter-group{display:flex;flex:1 1;flex-direction:column;gap:8px;min-width:200px}.filter-group label{color:var(--text-primary);font-size:14px;font-weight:600}.filter-group input,.filter-group select{background:var(--bg-primary);border:2px solid var(--border-color);border-radius:8px;box-sizing:border-box;color:var(--text-primary);font-size:14px;padding:12px 15px;transition:all .3s ease}.filter-group input:hover,.filter-group select:hover{border-color:var(--primary-color)}.filter-group input:focus,.filter-group select:focus{border-color:var(--primary-color);box-shadow:0 0 0 3px #667eea1a;outline:none}.videos-stats{background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:8px;color:var(--text-primary);display:inline-block;font-size:15px;font-weight:500;margin-bottom:25px;padding:12px 20px}.videos-empty,.videos-loading{background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:12px;color:var(--text-secondary);padding:60px 20px;text-align:center}.videos-empty p{color:var(--text-primary);font-size:18px;margin-bottom:20px}.videos-grid{grid-gap:24px;display:grid;gap:24px;grid-template-columns:repeat(4,1fr);margin-top:20px}.video-card{background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:12px;box-shadow:0 2px 8px #0000000d;color:inherit;display:flex;flex-direction:column;overflow:hidden;text-decoration:none;transition:all .3s ease}.video-card:hover{border-color:var(--primary-color);box-shadow:0 8px 24px #667eea33;transform:translateY(-4px)}.video-card-thumbnail{background:var(--bg-tertiary);overflow:hidden;padding-bottom:56.25%;position:relative;width:100%}.video-card-thumbnail img{object-fit:cover}.video-card-placeholder,.video-card-thumbnail img{height:100%;left:0;position:absolute;top:0;width:100%}.video-card-placeholder{align-items:center;background:linear-gradient(135deg,#667eea,#764ba2);display:flex;justify-content:center}.video-card-placeholder span{color:#fff;font-size:48px;opacity:.7}.video-card-duration{background:#000c;bottom:8px;font-size:12px;font-weight:500}.video-card-badge,.video-card-duration{border-radius:4px;color:#fff;padding:4px 8px;position:absolute;right:8px}.video-card-badge{background:red;font-size:11px;font-weight:600;text-transform:uppercase;top:8px}.video-card-info{display:flex;flex:1 1;flex-direction:column;padding:16px}.video-card-title{-webkit-line-clamp:2;-webkit-box-orient:vertical;color:var(--text-primary);display:-webkit-box;font-size:16px;font-weight:600;line-height:1.4;margin:0 0 8px;overflow:hidden}.video-card-artist{color:var(--primary-color);font-size:14px;font-weight:500;margin:0 0 12px}.video-card-stats{color:var(--text-secondary);display:flex;flex-wrap:wrap;font-size:13px;gap:16px;margin-top:auto}:root.dark .videos-filters,:root.dark .videos-stats{background:var(--bg-secondary);border-color:var(--border-color)}:root.dark .videos-stats{color:var(--text-primary)}:root.dark .videos-empty,:root.dark .videos-loading{background:var(--bg-secondary);border-color:var(--border-color)}:root.dark .filter-group input,:root.dark .filter-group select{background:var(--bg-primary);border-color:var(--border-color);color:var(--text-primary)}:root.dark .filter-group input:hover,:root.dark .filter-group select:hover{border-color:var(--primary-color)}:root.dark .video-card{background:var(--bg-secondary);border-color:var(--border-color)}:root.dark .video-card:hover{border-color:var(--primary-color);box-shadow:0 8px 24px #0006}.pagination-controls{align-items:center;display:flex;gap:20px;justify-content:center;margin-top:30px;padding:20px 0}.pagination-btn{background:linear-gradient(135deg,#667eea,#764ba2);border:none;border-radius:10px;box-shadow:0 3px 10px #667eea4d;color:#fff;cursor:pointer;font-size:14px;font-weight:600;padding:10px 20px;transition:all .3s ease}.pagination-btn:hover:not(:disabled){box-shadow:0 5px 15px #667eea66;transform:translateY(-2px)}.pagination-btn:active:not(:disabled){box-shadow:0 2px 8px #667eea4d;transform:translateY(0)}.pagination-btn:disabled{background:#ccc;box-shadow:none;cursor:not-allowed;opacity:.5}.pagination-info{background:#667eea1a;border-radius:8px;color:#333;font-size:15px;font-weight:600;min-width:120px;padding:8px 16px;text-align:center}:root.dark .pagination-controls{color:var(--text-primary)}:root.dark .pagination-btn{background:var(--bg-secondary);border:1px solid var(--border-color);color:var(--text-primary)}:root.dark .pagination-btn:hover:not(:disabled){background:var(--bg-tertiary);border-color:var(--primary-color)}:root.dark .pagination-info{background:var(--bg-secondary);color:var(--text-secondary)}@media (max-width:768px){.pagination-controls{flex-direction:column;gap:15px;margin-top:20px;padding:15px 0}.pagination-btn{font-size:13px;min-width:auto;padding:12px 16px;width:100%}.pagination-info{font-size:14px;padding:10px;width:100%}.videos-page{padding:20px 15px}.videos-header{align-items:flex-start;flex-direction:column;gap:15px}.videos-header h1{font-size:2em}.videos-filters{align-items:stretch;flex-direction:column;padding:15px}.filter-group{min-width:100%}.videos-grid{gap:16px;grid-template-columns:repeat(3,1fr)}}@media (max-width:480px){.videos-grid{grid-gap:8px!important;box-sizing:border-box;display:grid!important;gap:8px!important;grid-template-columns:repeat(2,1fr)!important;width:100%!important}.video-card{align-items:stretch!important;background:var(--bg-secondary);border-radius:8px;display:flex!important;flex-direction:column!important;max-width:100%;min-width:0;overflow:hidden;padding:0!important}.video-card-thumbnail{padding-bottom:56.25%;position:relative;width:100%}.video-card-thumbnail img{height:100%;left:0;object-fit:cover;position:absolute;top:0;width:100%}.video-card-info{display:flex!important;flex:1 1!important;flex-direction:column!important;min-height:0;padding:8px!important}.video-card-title{-webkit-line-clamp:2;font-size:12px!important;font-weight:600;line-height:1.3;margin:0 0 4px}.video-card-artist,.video-card-title{-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.video-card-artist{-webkit-line-clamp:1;color:var(--text-secondary);font-size:10px!important;margin:0 0 6px}.video-card-stats{display:flex;flex-wrap:wrap;font-size:10px!important;gap:8px!important;margin-top:auto}.video-card-duration{bottom:4px;font-size:10px!important;padding:2px 6px!important;right:4px}.video-card-badge{font-size:9px!important;padding:2px 6px!important;right:4px;top:4px}.video-card:active{box-shadow:0 1px 8px #667eea26;transform:scale(.98)}.filter-group input,.filter-group select{min-width:100%}.pagination-controls{gap:12px;margin-top:15px;padding:12px 0}.pagination-btn{font-size:12px;min-width:auto;padding:10px 14px}.pagination-info{font-size:13px;padding:8px}}.video-player-container{aspect-ratio:16/9;background:#000;border-radius:8px;overflow:hidden;position:relative;width:100%}.video-player-youtube{height:0;overflow:hidden;padding-bottom:56.25%;position:relative;width:100%}.video-player-iframe{height:100%;left:0;position:absolute;top:0;width:100%}.video-player-element{display:block;height:100%;object-fit:contain;width:100%}.video-player-controls{background:linear-gradient(0deg,#000c,#0000);bottom:0;left:0;opacity:0;padding:20px;pointer-events:none;position:absolute;right:0;transition:opacity .3s ease}.video-player-controls.visible{opacity:1;pointer-events:all}.video-player-progress{background:#ffffff4d;border-radius:3px;cursor:pointer;height:6px;margin-bottom:15px;position:relative;width:100%}.video-player-progress-bar{background:#ff6b6b;border-radius:3px;height:100%;transition:width .1s linear}.video-player-controls-bottom{justify-content:space-between}.video-player-controls-bottom,.video-player-controls-left,.video-player-controls-right{align-items:center;display:flex;gap:15px}.video-player-btn{align-items:center;background:#0000;border:none;color:#fff;cursor:pointer;display:flex;font-size:24px;justify-content:center;padding:8px;transition:transform .2s ease,opacity .2s ease}.video-player-btn:hover{opacity:.8;transform:scale(1.1)}.video-player-time{color:#fff;font-size:14px;font-weight:500;white-space:nowrap}.video-player-volume{-webkit-appearance:none;appearance:none;background:#ffffff4d;border-radius:2px;cursor:pointer;height:4px;outline:none;width:80px}.video-player-volume::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;background:#fff;border-radius:50%;cursor:pointer;height:12px;width:12px}.video-player-volume::-moz-range-thumb{background:#fff;border:none;border-radius:50%;cursor:pointer;height:12px;width:12px}:root.dark .video-player-container{background:#1a1a1a}@media (max-width:768px){.video-player-controls{padding:15px}.video-player-btn{font-size:20px;padding:6px}.video-player-time{font-size:12px}.video-player-volume{width:60px}}@media (max-width:480px){.video-player-controls{padding:10px}.video-player-controls-bottom,.video-player-controls-left,.video-player-controls-right{gap:10px}}.video-detail-page{margin:0 auto;max-width:1400px;padding:20px}.video-detail-container{display:flex;flex-direction:column;gap:30px}.video-detail-player{background:var(--bg-secondary);border-radius:12px;box-shadow:0 4px 16px #0000001a;overflow:hidden;width:100%}.video-detail-content{display:flex;flex-direction:column;gap:24px}.video-detail-header{align-items:flex-start;display:flex;flex-wrap:wrap;gap:20px;justify-content:space-between}.video-detail-title-section{flex:1 1;min-width:300px}.video-detail-title-section h1{color:var(--text-primary);font-size:28px;font-weight:700;margin:0 0 12px}.video-detail-meta{align-items:center;color:var(--text-secondary);display:flex;flex-wrap:wrap;font-size:14px;gap:12px}.video-detail-artist-link{align-items:center;color:var(--text-primary);display:flex;font-weight:500;gap:8px;text-decoration:none;transition:opacity .2s ease}.video-detail-artist-link:hover{opacity:.8}.video-detail-artist-avatar{border-radius:50%;height:32px;object-fit:cover;width:32px}.video-detail-separator{color:var(--text-tertiary)}.video-detail-actions{display:flex;flex-wrap:wrap;gap:12px}.btn-icon{align-items:center;background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:8px;color:var(--text-primary);cursor:pointer;display:flex;gap:8px;padding:10px 16px;text-decoration:none;transition:all .2s ease}.btn-icon:hover{background:var(--bg-tertiary)}.btn-icon.liked,.btn-icon:hover{border-color:var(--primary-color)}.btn-icon.liked{background:var(--primary-color);color:#fff}.btn-danger{border-color:#f44;color:#f44}.btn-danger:hover{background:#f44;color:#fff}.video-detail-description{background:var(--bg-secondary);border-radius:12px;padding:24px}.video-detail-description h2{color:var(--text-primary);font-size:20px;font-weight:600;margin:0 0 12px}.video-detail-description p{color:var(--text-secondary);line-height:1.6;white-space:pre-wrap}.video-detail-related{background:var(--bg-secondary);border-radius:12px;padding:24px}.video-detail-related h2{color:var(--text-primary);font-size:20px;font-weight:600;margin:0 0 16px}.video-detail-related-item{border-radius:8px;color:inherit;display:flex;gap:16px;padding:16px;text-decoration:none;transition:background .2s ease}.video-detail-related-item:hover{background:var(--bg-tertiary)}.video-detail-related-item img{border-radius:8px;height:80px;object-fit:cover;width:80px}.video-detail-related-item h3{color:var(--text-primary);font-size:16px;font-weight:600;margin:0 0 4px}.video-detail-related-item p{color:var(--text-secondary);font-size:14px;margin:0}.video-detail-error,.video-detail-loading{color:var(--text-secondary);padding:60px 20px;text-align:center}.video-detail-error p{font-size:18px;margin-bottom:20px}:root.dark .video-detail-player{background:var(--bg-secondary);box-shadow:0 4px 16px #0000004d}@media (max-width:768px){.video-detail-page{padding:15px}.video-detail-title-section h1{font-size:22px}.video-detail-header{flex-direction:column}.video-detail-actions{justify-content:flex-start;width:100%}}@media (max-width:480px){.video-detail-meta{font-size:12px}.video-detail-artist-avatar{height:24px;width:24px}}.upload-video-page{margin:0 auto;max-width:800px;padding:20px}.upload-video-container h1{color:var(--text-primary);font-size:32px;font-weight:700;margin:0 0 30px}.upload-video-form{display:flex;flex-direction:column;gap:24px}.form-group label{color:var(--text-primary)}.form-group input,.form-group select,.form-group textarea{background:var(--bg-secondary);border:1px solid var(--border-color);color:var(--text-primary);padding:12px 16px;transition:border-color .2s ease}.form-group input:focus,.form-group select:focus,.form-group textarea:focus{border-color:var(--primary-color)}.form-group small{color:var(--text-secondary);font-size:12px;margin-top:4px}.form-row{grid-gap:20px;display:grid;gap:20px;grid-template-columns:1fr 1fr}.checkbox-label{align-items:center;cursor:pointer;display:flex;gap:8px}.checkbox-label input[type=checkbox]{cursor:pointer;height:18px;width:18px}.form-actions{gap:12px;justify-content:flex-end}.message{border-radius:8px;margin-bottom:20px;padding:12px 16px}.message-success{background:#d4edda;border:1px solid #c3e6cb;color:#155724}.message-error{background:#f8d7da;border:1px solid #f5c6cb;color:#721c24}:root.dark .message-success{background:#4caf5033;border-color:#4caf504d;color:#81c784}:root.dark .message-error{background:#f4433633;border-color:#f443364d;color:#e57373}@media (max-width:768px){.upload-video-page{padding:15px}.upload-video-container h1{font-size:24px}.form-row{grid-template-columns:1fr}.form-actions{flex-direction:column}.form-actions button{width:100%}}.premium-required-container{align-items:center;display:flex;justify-content:center;min-height:60vh;padding:40px 20px}.premium-required-content{background:#fff;border-radius:12px;box-shadow:0 4px 12px #0000001a;max-width:600px;padding:40px;text-align:center}.premium-icon-large{font-size:80px;margin-bottom:20px}.premium-required-content h1{color:#333;font-size:2em;margin:0 0 15px}.premium-required-content>p{color:#666;font-size:1.1em;line-height:1.6;margin-bottom:30px}.premium-benefits{background:#f8f9fa;border-radius:8px;margin-bottom:30px;padding:25px;text-align:left}.premium-benefits h3{color:#333;font-size:1.2em;margin:0 0 15px}.premium-benefits ul{list-style:none;margin:0;padding:0}.premium-benefits li{color:#666;font-size:1em;padding:10px 0}.premium-actions{display:flex;flex-wrap:wrap;gap:15px;justify-content:center}:root.dark .premium-required-content{background:#141928cc;border:1px solid #ffffff1a}:root.dark .premium-required-content h1{color:var(--text-primary)}:root.dark .premium-required-content>p{color:var(--text-secondary)}:root.dark .premium-benefits{background:#ffffff0d}:root.dark .premium-benefits h3{color:var(--text-primary)}:root.dark .premium-benefits li{color:var(--text-secondary)}.notifications-page{background:var(--bg-primary);min-height:calc(100vh - 200px);padding:20px}.notifications-container{margin:0 auto;max-width:900px}.notifications-header{align-items:center;border-bottom:2px solid var(--border-color);display:flex;justify-content:space-between;margin-bottom:30px;padding-bottom:20px}.notifications-header h1{color:var(--text-primary);font-size:32px;font-weight:700;margin:0}.notifications-actions{display:flex;gap:10px}.notifications-filters{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:30px}.filter-btn{background:var(--bg-secondary);border:2px solid var(--border-color);border-radius:8px;color:var(--text-primary);cursor:pointer;font-size:14px;font-weight:500;padding:10px 20px;transition:all .3s ease}.filter-btn:hover{background:var(--bg-tertiary);border-color:var(--primary-color)}.filter-btn.active{background:linear-gradient(135deg,#667eea,#764ba2);border-color:#0000;color:#fff}.notifications-empty,.notifications-loading{color:var(--text-secondary);padding:60px 20px;text-align:center}.empty-icon{font-size:64px;margin-bottom:20px;opacity:.5}.notifications-list{display:flex;flex-direction:column;gap:12px}.notification-item{align-items:center;background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:12px;display:flex;padding:16px;position:relative;transition:all .3s ease}.notification-item:hover{border-color:var(--primary-color);box-shadow:0 4px 12px #0000001a;transform:translateY(-2px)}.notification-item.unread{background:var(--bg-tertiary);border-left:4px solid var(--primary-color)}.notification-content{align-items:flex-start;color:inherit;cursor:pointer;display:flex;flex:1 1;gap:16px;text-decoration:none}.notification-icon{align-items:center;background:var(--bg-primary);border-radius:50%;display:flex;flex-shrink:0;font-size:24px;height:40px;justify-content:center;width:40px}.notification-body{flex:1 1;min-width:0}.notification-title{color:var(--text-primary);font-size:16px;font-weight:600;margin-bottom:6px}.notification-message{color:var(--text-secondary);font-size:14px;line-height:1.5;margin-bottom:8px}.notification-time{color:var(--text-secondary);font-size:12px;opacity:.7}.notification-actions{display:flex;flex-shrink:0;gap:8px;margin-left:12px}.notification-action-btn{align-items:center;background:var(--bg-primary);border:none;border-radius:6px;color:var(--text-secondary);cursor:pointer;display:flex;font-size:18px;height:32px;justify-content:center;opacity:.7;transition:all .2s ease;width:32px}.notification-item:hover .notification-action-btn{opacity:1}.notification-action-btn:hover{background:var(--bg-tertiary);color:var(--text-primary);transform:scale(1.1)}.notification-action-btn.delete:hover{background:#ef4444;color:#fff}:root.dark .notification-item{background:var(--bg-secondary);border-color:var(--border-color)}:root.dark .notification-item.unread{background:#667eea1a;border-left-color:var(--primary-color)}:root.dark .notification-item:hover{box-shadow:0 4px 12px #0000004d}:root.dark .filter-btn{background:var(--bg-secondary);border-color:var(--border-color);color:var(--text-primary)}:root.dark .filter-btn:hover{background:var(--bg-tertiary)}:root.dark .notification-action-btn{background:var(--bg-primary);color:var(--text-secondary)}:root.dark .notification-action-btn:hover{background:var(--bg-tertiary)}@media (max-width:768px){.notifications-page{padding:15px}.notifications-header{align-items:flex-start;flex-direction:column;gap:15px}.notifications-header h1{font-size:24px}.notifications-filters{width:100%}.filter-btn{flex:1 1;font-size:13px;min-width:0;padding:8px 12px}.notification-item{padding:12px}.notification-content{gap:12px}.notification-icon{font-size:20px;height:36px;width:36px}.notification-title{font-size:15px}.notification-message{font-size:13px}.notification-actions{gap:6px;margin-left:8px}.notification-action-btn{font-size:16px;height:28px;width:28px}}@media (max-width:480px){.notifications-page{padding:10px}.notifications-header h1{font-size:20px}.notification-item{padding:10px}.notification-icon{font-size:18px;height:32px;width:32px}.notification-title{font-size:14px}.notification-message{font-size:12px}}.install-page{background:var(--bg-gradient);min-height:calc(100vh - 200px);padding:40px 0}.install-header{margin-bottom:50px;text-align:center}.install-header h1{-webkit-text-fill-color:#0000;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;background-clip:text;font-size:2.5em;margin-bottom:15px}.install-subtitle{color:var(--text-secondary);font-size:1.2em;margin:0 auto;max-width:600px}.install-status{background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:16px;box-shadow:var(--shadow-md);padding:60px 40px;text-align:center}.install-status.installed{margin:0 auto;max-width:500px}.status-icon{font-size:64px;margin-bottom:20px}.install-status h2{color:var(--text-primary);margin-bottom:15px}.install-status p{color:var(--text-secondary);margin-bottom:25px}.install-section{background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:16px;box-shadow:var(--shadow-md);margin-bottom:30px;padding:30px}.install-platform-header{align-items:center;border-bottom:2px solid var(--border-color);display:flex;gap:15px;margin-bottom:30px;padding-bottom:20px}.platform-icon{font-size:48px}.install-platform-header h2{color:var(--text-primary);font-size:1.8em;margin:0}.install-method{margin-bottom:30px}.install-method:last-child{margin-bottom:0}.install-method-content h3{color:var(--text-primary);font-size:1.3em;margin-bottom:15px}.install-method-content p{color:var(--text-secondary);margin-bottom:20px}.install-action-btn{font-size:18px;margin-top:10px;padding:15px 30px}.install-steps{display:flex;flex-direction:column;gap:20px}.install-step{align-items:flex-start;display:flex;gap:20px}.step-number{align-items:center;background:linear-gradient(135deg,#667eea,#764ba2);border-radius:50%;color:#fff;display:flex;flex-shrink:0;font-size:20px;font-weight:700;height:40px;justify-content:center;width:40px}.step-content{flex:1 1;padding-top:8px}.step-content p{color:var(--text-primary);font-size:16px;line-height:1.6;margin:0}.step-content strong{color:var(--primary-color)}.ios-add-icon,.ios-share-icon{font-size:20px;margin-left:5px}.install-note{background:var(--bg-tertiary);border-left:4px solid var(--primary-color);border-radius:8px;margin-top:25px;padding:20px}.install-note p{color:var(--text-secondary);font-size:15px;line-height:1.6;margin:0}.install-note strong{color:var(--text-primary)}.install-benefits{background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:16px;box-shadow:var(--shadow-md);margin-bottom:30px;padding:40px 30px}.install-benefits h2{color:var(--text-primary);font-size:2em;margin-bottom:30px;text-align:center}.benefits-grid{grid-gap:25px;display:grid;gap:25px;grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}.benefit-card{background:var(--bg-tertiary);border:1px solid var(--border-color);border-radius:12px;padding:25px;text-align:center;transition:all .3s ease}.benefit-card:hover{border-color:var(--primary-color);box-shadow:var(--shadow-lg);transform:translateY(-5px)}.benefit-icon{font-size:48px;margin-bottom:15px}.benefit-card h3{color:var(--text-primary);font-size:1.2em;margin:0 0 10px}.benefit-card p{color:var(--text-secondary);font-size:14px;line-height:1.6;margin:0}.install-footer{margin-top:40px;text-align:center}.install-footer-actions{align-items:center;display:flex;flex-wrap:wrap;gap:15px;justify-content:center}:root.dark .install-page{background:var(--bg-gradient-dark)}:root.dark .install-section,:root.dark .install-status{background:var(--bg-secondary);border-color:var(--border-color)}:root.dark .install-platform-header{border-bottom-color:var(--border-color)}:root.dark .install-note{background:var(--bg-tertiary);border-left-color:var(--primary-color)}:root.dark .install-benefits{background:var(--bg-secondary);border-color:var(--border-color)}:root.dark .benefit-card{background:var(--bg-tertiary);border-color:var(--border-color)}@media (max-width:768px){.install-header h1{font-size:2em}.install-subtitle{font-size:1em}.install-section{padding:20px}.install-platform-header h2{font-size:1.5em}.platform-icon{font-size:40px}.benefits-grid{gap:20px;grid-template-columns:1fr}.install-benefits{padding:30px 20px}.install-benefits h2{font-size:1.5em}}@media (max-width:480px){.install-page{padding:20px 0}.install-header h1{font-size:1.8em}.install-section{padding:15px}.install-platform-header{flex-direction:column;gap:10px;text-align:center}.install-step{gap:15px}.step-number{font-size:18px;height:35px;width:35px}.step-content p{font-size:14px}}.terms-container{background:#0a0a0a;background:var(--bg-primary,#0a0a0a);color:#fff;color:var(--text-primary,#fff);min-height:calc(100vh - 200px);padding:40px 20px}.terms-content{line-height:1.8;margin:0 auto;max-width:900px}.terms-title{color:#1db954;color:var(--accent-color,#1db954);font-size:2.5rem;font-weight:700;margin-bottom:10px;text-align:center}.terms-last-updated{color:#b3b3b3;color:var(--text-secondary,#b3b3b3);font-size:.9rem;font-style:italic;margin-bottom:40px;text-align:center}.terms-section{background:#1a1a1a;background:var(--bg-secondary,#1a1a1a);border-left:4px solid #1db954;border-left:4px solid var(--accent-color,#1db954);border-radius:12px;margin-bottom:40px;padding:30px}.terms-section h2{color:#1db954;color:var(--accent-color,#1db954);font-size:1.8rem;font-weight:600;margin-bottom:20px}.terms-section h3{font-size:1.3rem;font-weight:600;margin-top:25px}.terms-section h3,.terms-section p{color:#fff;color:var(--text-primary,#fff);margin-bottom:15px}.terms-section p{text-align:justify}.terms-section ul{margin:15px 0;padding-left:30px}.terms-section li{color:#fff;color:var(--text-primary,#fff);line-height:1.6;margin-bottom:10px}.terms-contact{background:#0a0a0a;background:var(--bg-primary,#0a0a0a);border-radius:8px;margin-top:15px;padding:20px}.terms-contact p{color:#fff;color:var(--text-primary,#fff);margin-bottom:8px}.terms-contact a{color:#1db954;color:var(--accent-color,#1db954);text-decoration:none;transition:color .3s ease}.terms-contact a:hover{color:#1ed760;color:var(--accent-hover,#1ed760);text-decoration:underline}.terms-acknowledgment{background:#1a1a1a;background:var(--bg-secondary,#1a1a1a);border:2px solid #1db954;border:2px solid var(--accent-color,#1db954);border-radius:12px;margin-top:50px;padding:25px;text-align:center}.terms-acknowledgment p{color:#fff;color:var(--text-primary,#fff);font-size:1.1rem;margin:0}[data-theme=dark] .terms-container{background:#0a0a0a}[data-theme=dark] .terms-section{background:#1a1a1a}[data-theme=dark] .terms-contact{background:#0a0a0a}[data-theme=light] .terms-container{background:#f5f5f5}[data-theme=light] .terms-content{color:#1a1a1a}[data-theme=light] .terms-section{background:#fff;border-left-color:#1db954}[data-theme=light] .terms-section h2,[data-theme=light] .terms-section h3,[data-theme=light] .terms-section li,[data-theme=light] .terms-section p{color:#1a1a1a}[data-theme=light] .terms-contact{background:#f5f5f5}[data-theme=light] .terms-contact p{color:#1a1a1a}[data-theme=light] .terms-acknowledgment{background:#fff}[data-theme=light] .terms-acknowledgment p{color:#1a1a1a}@media (max-width:768px){.terms-container{padding:20px 15px}.terms-title{font-size:2rem}.terms-section{margin-bottom:30px;padding:20px}.terms-section h2{font-size:1.5rem}.terms-section h3{font-size:1.2rem}.terms-content{line-height:1.6}}@media (max-width:480px){.terms-title{font-size:1.75rem}.terms-section{padding:15px}.terms-section h2{font-size:1.3rem}.terms-section h3{font-size:1.1rem}.terms-last-updated{font-size:.85rem}}.privacy-container{background:#0a0a0a;background:var(--bg-primary,#0a0a0a);color:#fff;color:var(--text-primary,#fff);min-height:calc(100vh - 200px);padding:40px 20px}.privacy-content{line-height:1.8;margin:0 auto;max-width:900px}.privacy-title{color:#1db954;color:var(--accent-color,#1db954);font-size:2.5rem;font-weight:700;margin-bottom:10px;text-align:center}.privacy-last-updated{color:#b3b3b3;color:var(--text-secondary,#b3b3b3);font-size:.9rem;font-style:italic;margin-bottom:40px;text-align:center}.privacy-section{background:#1a1a1a;background:var(--bg-secondary,#1a1a1a);border-left:4px solid #1db954;border-left:4px solid var(--accent-color,#1db954);border-radius:12px;margin-bottom:40px;padding:30px}.privacy-section h2{color:#1db954;color:var(--accent-color,#1db954);font-size:1.8rem;font-weight:600;margin-bottom:20px}.privacy-section h3{font-size:1.3rem;font-weight:600;margin-top:25px}.privacy-section h3,.privacy-section p{color:#fff;color:var(--text-primary,#fff);margin-bottom:15px}.privacy-section p{text-align:justify}.privacy-section ul{margin:15px 0;padding-left:30px}.privacy-section li{color:#fff;color:var(--text-primary,#fff);line-height:1.6;margin-bottom:10px}.privacy-section strong{color:#1db954;color:var(--accent-color,#1db954);font-weight:600}.privacy-contact{background:#0a0a0a;background:var(--bg-primary,#0a0a0a);border-radius:8px;margin-top:15px;padding:20px}.privacy-contact p{color:#fff;color:var(--text-primary,#fff);margin-bottom:8px}.privacy-contact a{color:#1db954;color:var(--accent-color,#1db954);text-decoration:none;transition:color .3s ease}.privacy-contact a:hover{color:#1ed760;color:var(--accent-hover,#1ed760);text-decoration:underline}[data-theme=dark] .privacy-container{background:#0a0a0a}[data-theme=dark] .privacy-section{background:#1a1a1a}[data-theme=dark] .privacy-contact{background:#0a0a0a}[data-theme=light] .privacy-container{background:#f5f5f5}[data-theme=light] .privacy-content{color:#1a1a1a}[data-theme=light] .privacy-section{background:#fff;border-left-color:#1db954}[data-theme=light] .privacy-section h2,[data-theme=light] .privacy-section h3,[data-theme=light] .privacy-section li,[data-theme=light] .privacy-section p{color:#1a1a1a}[data-theme=light] .privacy-contact{background:#f5f5f5}[data-theme=light] .privacy-contact p{color:#1a1a1a}@media (max-width:768px){.privacy-container{padding:20px 15px}.privacy-title{font-size:2rem}.privacy-section{margin-bottom:30px;padding:20px}.privacy-section h2{font-size:1.5rem}.privacy-section h3{font-size:1.2rem}.privacy-content{line-height:1.6}}@media (max-width:480px){.privacy-title{font-size:1.75rem}.privacy-section{padding:15px}.privacy-section h2{font-size:1.3rem}.privacy-section h3{font-size:1.1rem}.privacy-last-updated{font-size:.85rem}}.admin-login-page{align-items:center;background:linear-gradient(135deg,#667eea,#764ba2);display:flex;justify-content:center;min-height:100vh;padding:20px}.admin-login-container{max-width:450px;width:100%}.admin-login-box{background:#fff;border-radius:12px;box-shadow:0 10px 40px #0003;padding:40px}.admin-login-header{margin-bottom:30px;text-align:center}.admin-login-header h1{color:#333;font-size:28px;margin-bottom:8px}.admin-login-header p{color:#666;font-size:14px}.admin-message{border-radius:8px;font-size:14px;margin-bottom:20px;padding:12px 16px}.admin-message-success{background:#d4edda;border:1px solid #c3e6cb;color:#155724}.admin-message-error{background:#f8d7da;border:1px solid #f5c6cb;color:#721c24}.admin-login-form,.admin-login-form .form-group{margin-bottom:20px}.admin-login-form label{color:#333;display:block;font-size:14px;font-weight:500;margin-bottom:8px}.admin-login-form input{border:2px solid #e0e0e0;border-radius:8px;box-sizing:border-box;font-size:16px;padding:12px 16px;transition:border-color .3s;width:100%}.admin-login-form input:focus{border-color:#667eea;outline:none}.btn-block{width:100%}.admin-login-footer{margin-top:20px;text-align:center}.back-link{color:#667eea;font-size:14px;text-decoration:none;transition:color .3s}.back-link:hover{color:#764ba2;text-decoration:underline}@media (max-width:480px){.admin-login-box{padding:30px 20px}.admin-login-header h1{font-size:24px}}:root.dark .admin-login-page{background:var(--bg-gradient-dark)}:root.dark .admin-login-box{background:var(--bg-secondary);border:1px solid var(--border-color);box-shadow:var(--shadow-xl)}:root.dark .admin-login-header h1{color:var(--text-primary)}:root.dark .admin-login-header p{color:var(--text-secondary)}:root.dark .admin-login-form label{color:var(--text-primary)}:root.dark .admin-login-form input{background:var(--bg-primary);border-color:var(--border-color);color:var(--text-primary)}:root.dark .admin-login-form input:focus{border-color:var(--primary-color);box-shadow:0 0 0 3px #7c8ef51a}:root.dark .admin-message-success{background:#10b9811a;border-color:var(--success);color:var(--success)}:root.dark .admin-message-error{background:#ef44441a;border-color:var(--error);color:var(--error)}:root.dark .back-link{color:var(--primary-color)}:root.dark .back-link:hover{color:var(--secondary-color)}.management-page{width:100%}.management-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:30px}.management-header h1{color:#2c3e50;margin:0}.search-box{display:flex;gap:10px}.search-box input{border:2px solid #e0e0e0;border-radius:8px;font-size:14px;min-width:250px;padding:10px 15px}.search-box input:focus{border-color:#3498db;outline:none}.management-content{grid-gap:30px;display:grid;gap:30px;grid-template-columns:1fr}.management-list{background:#fff;border-radius:12px;box-shadow:0 2px 8px #0000001a;padding:25px}.management-table{border-collapse:collapse;width:100%}.management-table thead{background:#f8f9fa}.management-table th{border-bottom:2px solid #e0e0e0;color:#2c3e50;font-weight:600;padding:15px;text-align:left}.management-table td{border-bottom:1px solid #e0e0e0;padding:15px}.management-table tr:hover{background:#f8f9fa}.table-thumbnail{border-radius:6px;height:50px;object-fit:cover;width:50px}.comment-text{max-width:300px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.action-buttons{align-items:center;display:flex;gap:8px}.action-buttons .btn{min-width:auto;padding:6px 12px}.badge{border-radius:4px;display:inline-block;font-size:12px;font-weight:600;padding:4px 8px;text-transform:uppercase}.badge-success{background:#d4edda;color:#155724}.badge-warning{background:#fff3cd;color:#856404}.badge-danger{background:#f8d7da;color:#721c24}.badge-info{background:#d1ecf1;color:#0c5460}.badge-youtube{background:red;color:#fff}.badge-upload{background:#6c757d;color:#fff}.table-thumbnail-placeholder{align-items:center;background:#f0f0f0;border-radius:6px;display:flex;font-size:20px;height:50px;justify-content:center;width:50px}.unread-row{background:#fff3cd!important;font-weight:500}.detail-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px}.detail-actions .btn-large{font-size:16px;padding:12px 24px}.no-audio-warning{background:#ffe6e6;border-radius:6px;color:#e74c3c;font-size:14px;margin:0;padding:10px}.pagination{align-items:center;background:#f8f9fa;border-radius:8px;display:flex;flex-wrap:nowrap;gap:15px;justify-content:center;margin-top:20px;padding:15px}.pagination button{background:#fff;border:1px solid #e0e0e0;border-radius:6px;cursor:pointer;font-size:14px;font-weight:500;min-width:100px;padding:10px 20px;transition:all .3s;white-space:nowrap}.pagination button:hover:not(:disabled){background:#3498db;border-color:#3498db;box-shadow:0 4px 8px #3498db4d;color:#fff;transform:translateY(-2px)}.pagination button:disabled{background:#f5f5f5;cursor:not-allowed;opacity:.5}.pagination span{color:#555;font-size:14px;font-weight:500;padding:0 10px;white-space:nowrap}.management-detail{background:#fff;border-radius:12px;box-shadow:0 2px 8px #0000001a;max-height:calc(100vh - 40px);overflow-y:auto;padding:25px;position:-webkit-sticky;position:sticky;top:20px}.detail-header{align-items:center;border-bottom:2px solid #e0e0e0;display:flex;justify-content:space-between;margin-bottom:20px;padding-bottom:15px}.detail-header h2{color:#2c3e50;margin:0}.detail-content p{color:#555;margin:15px 0}.detail-content strong{color:#2c3e50}.detail-image{border-radius:8px;margin-bottom:20px;max-width:300px;width:100%}.detail-edit{gap:20px}.detail-edit,.form-group{display:flex;flex-direction:column}.form-group{gap:8px}.form-group label{color:#2c3e50;font-size:14px;font-weight:500}.form-group input,.form-group select,.form-group textarea{border:2px solid #e0e0e0;border-radius:8px;font-family:inherit;font-size:14px;padding:10px 15px}.form-group input:focus,.form-group select:focus,.form-group textarea:focus{border-color:#3498db;outline:none}.form-group textarea{min-height:100px;resize:vertical}.form-actions{display:flex;gap:10px;margin-top:10px}.create-form{background:#fff;border-radius:12px;box-shadow:0 2px 8px #0000001a;margin-bottom:30px;padding:25px}.create-form h2{color:#2c3e50;margin:0 0 20px}.role-badge{border-radius:12px;font-size:12px;font-weight:600;padding:4px 12px;text-transform:uppercase}.role-super_admin{background:#e74c3c;color:#fff}.role-admin{background:#3498db;color:#fff}.role-moderator{background:#95a5a6;color:#fff}.empty-state,.loading{color:#7f8c8d;padding:40px;text-align:center}@media (max-width:1024px){.management-content{grid-template-columns:1fr}.management-detail{max-height:none;position:relative}}@media (max-width:768px){.management-header{align-items:flex-start;flex-direction:column;gap:15px}.search-box{width:100%}.search-box input{min-width:0;width:100%}.management-table{font-size:14px}.management-table td,.management-table th{padding:10px 8px}}:root.dark .management-header h1{color:var(--text-primary)}:root.dark .search-box input{background:var(--bg-primary);border-color:var(--border-color);color:var(--text-primary)}:root.dark .search-box input:focus{border-color:var(--primary-color);box-shadow:0 0 0 3px #7c8ef51a}:root.dark .management-list{background:var(--bg-secondary);border:1px solid var(--border-color);box-shadow:var(--shadow-md)}:root.dark .management-table thead{background:var(--bg-tertiary)}:root.dark .management-table td,:root.dark .management-table th{border-bottom-color:var(--border-color);color:var(--text-primary)}:root.dark .management-table tr:hover{background:var(--bg-tertiary)}:root.dark .management-detail{background:var(--bg-secondary);border:1px solid var(--border-color);box-shadow:var(--shadow-md)}:root.dark .detail-header{border-bottom-color:var(--border-color)}:root.dark .detail-header h2{color:var(--text-primary)}:root.dark .detail-content p{color:var(--text-secondary)}:root.dark .detail-content strong{color:var(--text-primary)}:root.dark .create-form{background:var(--bg-secondary);border:1px solid var(--border-color);box-shadow:var(--shadow-md)}:root.dark .create-form h2,:root.dark .form-group label{color:var(--text-primary)}:root.dark .form-group input,:root.dark .form-group select,:root.dark .form-group textarea{background:var(--bg-primary);border-color:var(--border-color);color:var(--text-primary)}:root.dark .form-group input:focus,:root.dark .form-group select:focus,:root.dark .form-group textarea:focus{border-color:var(--primary-color);box-shadow:0 0 0 3px #7c8ef51a}:root.dark .no-audio-warning{background:#ef44441a;border:1px solid var(--error);color:var(--error)}:root.dark .pagination{background:var(--bg-tertiary);border:1px solid var(--border-color)}:root.dark .pagination button{background:var(--bg-secondary);border-color:var(--border-color);color:var(--text-primary)}:root.dark .pagination button:hover:not(:disabled){background:var(--primary-color);border-color:var(--primary-color);color:#fff}:root.dark .pagination button:disabled{background:var(--bg-tertiary);opacity:.5}:root.dark .empty-state,:root.dark .loading,:root.dark .pagination span{color:var(--text-secondary)}:root.dark .badge-success{background:#10b98133;color:#10b981}:root.dark .badge-warning{background:#f59e0b33;color:#f59e0b}:root.dark .badge-danger{background:#ef444433;color:#ef4444}:root.dark .badge-info{background:#3b82f633;color:#3b82f6}:root.dark .badge-youtube{background:red;color:#fff}:root.dark .badge-upload{background:#6c757d;color:#fff}:root.dark .table-thumbnail-placeholder{background:var(--bg-tertiary);color:var(--text-secondary)}:root.dark .unread-row{background:#f59e0b1a!important}.admin-dashboard{background:#f5f5f5;display:flex;min-height:100vh}.admin-sidebar{background:#2c3e50;color:#fff;display:flex;flex-direction:column;height:100vh;overflow-y:auto;position:fixed;width:280px}.admin-sidebar-header{border-bottom:1px solid #ffffff1a;padding:30px 20px}.admin-sidebar-header h2{font-size:24px;margin:0 0 15px}.admin-info{border-top:1px solid #ffffff1a;padding-top:15px}.admin-name{font-size:16px;font-weight:600;margin:0 0 5px}.admin-role{color:#ffffffb3;font-size:12px;margin:0;text-transform:uppercase}.admin-nav{flex:1 1;padding:20px 0}.admin-nav-item{background:none;border:none;border-left:3px solid #0000;color:#fffc;cursor:pointer;font-size:15px;padding:15px 20px;text-align:left;transition:all .3s;width:100%}.admin-nav-item:hover{background:#ffffff1a;color:#fff}.admin-nav-item.active{background:#ffffff26;border-left-color:#3498db;color:#fff;font-weight:600}.admin-sidebar-footer{border-top:1px solid #ffffff1a;padding:20px}.back-to-site{color:#ffffffb3;display:block;font-size:14px;margin-top:15px;text-align:center;text-decoration:none;transition:color .3s}.back-to-site:hover{color:#fff}.admin-content{flex:1 1;margin-left:280px;overflow-y:auto;padding:30px 30px 100px}.dashboard-tab h1{color:#2c3e50;margin:0 0 30px}.stats-grid{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));margin-bottom:40px}.stat-card{align-items:center;background:#fff;border-radius:12px;box-shadow:0 2px 8px #0000001a;display:flex;padding:25px;transition:transform .3s,box-shadow .3s}.stat-card:hover{box-shadow:0 4px 12px #00000026;transform:translateY(-2px)}.stat-icon{font-size:40px;margin-right:20px}.stat-content h3{color:#2c3e50;font-size:32px;margin:0 0 5px}.stat-content p{color:#7f8c8d;font-size:14px;margin:0}.dashboard-sections{grid-gap:30px;display:grid;gap:30px;grid-template-columns:repeat(auto-fit,minmax(400px,1fr))}.dashboard-section{background:#fff;border-radius:12px;box-shadow:0 2px 8px #0000001a;padding:25px}.dashboard-section h2{color:#2c3e50;font-size:20px;margin:0 0 20px}.top-list{display:flex;flex-direction:column;gap:15px}.top-item{align-items:center;background:#f8f9fa;border-radius:8px;display:flex;padding:15px;transition:background .3s}.top-item:hover{background:#e9ecef}.top-rank{color:#3498db;font-size:18px;font-weight:700;margin-right:15px;min-width:30px}.top-info{flex:1 1}.top-info h4{color:#2c3e50;font-size:16px;margin:0 0 5px}.top-info p{margin:0}.top-info p,.top-stats{color:#7f8c8d;font-size:14px}.top-stats{display:flex;gap:15px}.loading{color:#7f8c8d}.error-message,.loading{padding:40px;text-align:center}.error-message{background:#fff;border-radius:12px;box-shadow:0 2px 8px #0000001a}.error-message p{color:#e74c3c;font-size:16px;margin-bottom:20px}.error-message button{margin-top:10px}@media (max-width:768px){.admin-sidebar{height:auto;position:relative;width:100%}.admin-content{margin-left:0;padding:20px}.dashboard-sections,.stats-grid{grid-template-columns:1fr}}:root.dark .admin-dashboard{background:var(--bg-gradient-dark)}:root.dark .admin-sidebar{background:var(--bg-secondary);border-right:1px solid var(--border-color)}:root.dark .admin-content{background:var(--bg-gradient-dark)}:root.dark .dashboard-tab h1{color:var(--text-primary)}:root.dark .stat-card{background:var(--bg-secondary);border:1px solid var(--border-color);box-shadow:var(--shadow-md)}:root.dark .stat-card:hover{border-color:var(--primary-color);box-shadow:var(--shadow-lg)}:root.dark .stat-content h3{color:var(--text-primary)}:root.dark .stat-content p{color:var(--text-secondary)}:root.dark .dashboard-section{background:var(--bg-secondary);border:1px solid var(--border-color);box-shadow:var(--shadow-md)}:root.dark .dashboard-section h2{color:var(--text-primary)}:root.dark .top-item{background:var(--bg-tertiary);border:1px solid var(--border-color)}:root.dark .top-item:hover{background:var(--bg-secondary);border-color:var(--primary-color)}:root.dark .top-info h4{color:var(--text-primary)}:root.dark .loading,:root.dark .top-info p,:root.dark .top-stats{color:var(--text-secondary)}:root.dark .error-message{background:var(--bg-secondary);border:1px solid var(--border-color);box-shadow:var(--shadow-md)}:root.dark .error-message p{color:var(--error)}