:root{--bg: #ffffff;--card: #fff;--text: #111827;--muted: #6b7280;--line: #e5e7eb;--accent: #30B0C7;--chip: #f3f4f6;--shadow: 0 10px 25px rgba(0,0,0,.05);--radius: 16px;--teal: #30D5C8}*{box-sizing:border-box}body{margin:0;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,"Apple Color Emoji","Segoe UI Emoji";color:var(--text);background:var(--bg);overflow:hidden;height:100vh}.hero{background:linear-gradient(135deg,#30b0c71f,#30d5c814);border-radius:20px;padding:36px 28px;margin:18px 0 12px}.hero-content{max-width:640px}.hero h1{font-size:22px;line-height:1.2;margin:0 0 16px}.hero-lead{font-size:17px;line-height:1.6;margin-bottom:18px;color:var(--muted)}.hero-benefits{margin:0 0 22px 18px;padding:0;color:var(--text);font-size:15px;line-height:1.5}.hero-benefits li{margin-bottom:6px}.hero-cta{display:flex;flex-wrap:wrap;gap:12px}.genre-link{text-decoration:none;color:inherit;display:flex;flex-direction:column;align-items:center;gap:4px;width:100%}.cta-primary,.cta-secondary{display:inline-flex;align-items:center;justify-content:center;padding:12px 24px;border-radius:999px;font-weight:600;text-decoration:none;transition:transform .18s ease,box-shadow .18s ease}.cta-primary{background:var(--accent);color:#fff;box-shadow:0 12px 30px #30b0c759}.cta-primary:hover{transform:translateY(-1px);box-shadow:0 16px 40px #30b0c773}.cta-secondary{border:1px solid rgba(17,24,39,.12);color:var(--text);background:#fff}.cta-secondary:hover{transform:translateY(-1px);border-color:#11182733}.seo-section,.popular-genres,.country-highlight,.top-stations{margin:28px 0}.seo-section h2,.section-title{font-size:24px;margin:0 0 12px}.seo-section p,.section-lead{margin:0 0 18px;color:var(--muted);font-size:15px;line-height:1.6}.country-links{display:flex;flex-wrap:wrap;gap:10px}.country-link{flex:0 0 auto;display:inline-flex;align-items:center;gap:8px;padding:10px 14px;border:1px solid var(--line);border-radius:999px;text-decoration:none;color:var(--text);background:#fff;font-size:14px;transition:transform .16s ease,box-shadow .16s ease}.country-link:hover{transform:translateY(-1px);box-shadow:0 8px 20px #11182714}.country-flag{font-size:18px}.seo-stations{padding:0}.seo-station-card{padding:20px 22px;border-bottom:1px solid var(--line);background:#fff}.seo-station-card:last-child{border-bottom:none}.seo-station-header{display:flex;flex-direction:column;gap:6px}.seo-station-card h3{margin:0;font-size:20px}.seo-station-card h3 a{color:inherit;text-decoration:none}.seo-station-card h3 a:hover{color:var(--accent)}.seo-station-meta{font-size:13px;color:var(--muted)}.station-meta{font-size:13px;color:var(--muted);margin:6px 0}.seo-station-description{margin:12px 0;font-size:15px;line-height:1.6}.seo-station-links{display:flex;flex-wrap:wrap;gap:12px}.seo-listen-link,.seo-app-link{font-weight:600;text-decoration:none;font-size:14px}.seo-listen-link{color:var(--accent)}.seo-app-link{color:var(--text)}.seo-app-link:after{content:" ↗";font-size:12px}.empty-state-text{font-size:15px;color:var(--muted)}.device{max-width:834px;margin:0 auto;height:100vh;display:flex;flex-direction:column;background:var(--bg);position:relative}header.appbar{display:flex;align-items:center;justify-content:space-between;padding:14px 20px;border-bottom:1px solid var(--line);position:sticky;top:0;background:var(--bg);z-index:10}.appbar .left,.appbar .right{display:flex;gap:12px;align-items:center}.appbar .right{position:relative}.appbar .title{font-weight:700;font-size:18px;flex:1;text-align:center}.title-mobile{display:none;background:#f3f4f6;border:none;border-radius:14px;width:44px;height:44px;font-size:22px;cursor:pointer;transition:transform .2s;padding:0;line-height:1}.title-mobile:hover{transform:scale(1.05)}.title-mobile:active{transform:scale(.95)}.title-desktop{display:inline}.appbar button{background:#f3f4f6;border:none;border-radius:14px;width:44px;height:44px;padding:0;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:transform .2s}.appbar button:hover{transform:scale(1.05)}.appbar button:active{transform:scale(.95)}.hq-button{position:relative}.hq-icon{font-weight:800;font-size:14px;letter-spacing:-.5px;font-family:-apple-system,BlinkMacSystemFont,SF Pro Display,Segoe UI,system-ui,sans-serif;line-height:1}.hq-button.active{background:#ff9500!important;color:#fff!important}.hq-button.active .hq-icon{color:#fff}.app-banner{background:linear-gradient(135deg,#667eea,#764ba2);padding:12px 16px;display:flex;align-items:center;position:relative;animation:slideDown .3s ease}.app-banner.hidden{display:none}.app-banner-content{display:flex;align-items:center;gap:12px;width:100%}.app-icon{width:48px;height:48px;border-radius:12px;box-shadow:0 2px 8px #0003}.app-info{flex:1}.app-title{color:#fff;font-weight:600;font-size:16px}.app-subtitle{color:#ffffffe6;font-size:13px;margin-top:2px}.app-install-btn{background:#fff;color:#667eea;padding:8px 20px;border-radius:20px;font-weight:600;font-size:14px;text-decoration:none;transition:transform .2s}.app-install-btn:hover{transform:scale(1.05)}.app-banner-close{position:absolute;top:8px;right:8px;background:none;border:none;color:#fff;font-size:24px;cursor:pointer;padding:0;width:24px;height:24px;display:flex;align-items:center;justify-content:center;opacity:.8}.app-banner-close:hover{opacity:1}@keyframes slideDown{0%{transform:translateY(-100%)}to{transform:translateY(0)}}.menu-btn{padding:0;display:flex;align-items:center;justify-content:center}.dropdown-menu{display:none;position:absolute;top:calc(100% + 10px);right:0;background:var(--card);border:1px solid var(--line);border-radius:12px;box-shadow:0 10px 40px #00000026;min-width:180px;z-index:100;overflow:hidden}.dropdown-menu.active{display:block}.dropdown-item{display:block;width:100%;padding:12px 16px;text-align:left;background:none;border:none;border-bottom:1px solid var(--line);cursor:pointer;font-size:16px;color:var(--text);transition:background .2s}.dropdown-item:last-child{border-bottom:none}.dropdown-item:hover{background:var(--chip)}.dropdown-item.active{background:var(--accent);color:#fff}main{flex:1;padding:18px 18px 0;overflow-y:auto;overflow-x:hidden;position:relative;scrollbar-width:thin;scrollbar-color:var(--line) transparent}main::-webkit-scrollbar{width:6px}main::-webkit-scrollbar-track{background:transparent}main::-webkit-scrollbar-thumb{background-color:var(--line);border-radius:3px}.section-title{font-size:22px;font-weight:800;margin:6px 2px 12px}.horizontal-icon-list{display:flex;gap:8px;padding:4px 0 8px;overflow-x:auto;overflow-y:visible;-webkit-overflow-scrolling:touch;scrollbar-width:none}.horizontal-icon-list::-webkit-scrollbar{display:none}.chip{display:flex;flex-direction:column;align-items:center;justify-content:center;width:64px;height:64px;flex-shrink:0;padding:8px;border-radius:12px;color:#fff;font-weight:600;font-size:11px;box-shadow:var(--shadow);cursor:pointer;transition:transform .2s,box-shadow .2s}.chip:hover{transform:translateY(-2px);box-shadow:0 15px 30px #00000026}.chip:active{transform:translateY(0)}.chip .icon{width:28px;height:28px;display:grid;place-items:center;margin-bottom:4px;font-size:22px}.chip .icon svg{width:24px;height:24px;fill:#fff}.icon-item.pop{background:#ff2d55}.icon-item.rock{background:#7877c6}.icon-item.jazz{background:#ff9f0a}.icon-item.dance{background:#30b0c7}.icon-item.classical{background:#ff9500}.icon-item.news{background:#ff3b30}.icon-item.e80s{background:#00ba88}.icon-item.talk{background:#5856d6}.icon-item.electronic{background:#6a5acd}.icon-item.country{background:#b8860b}.icon-item.hip-hop{background:#34c759}.icon-item.latin{background:#ff2d55}.icon-item.reggae{background:#00ba88}.icon-item.chill{background:#4682b4}.icon-item.lucky{background:#30b0c7}.icon-item.genre-chip{display:flex;flex-direction:column;align-items:center;justify-content:center;color:#fff;font-size:10px;font-weight:600;text-align:center}.icon-item.genre-chip .icon{width:28px;height:28px;margin-bottom:2px;display:flex;align-items:center;justify-content:center}.icon-item.genre-chip .icon svg{width:100%;height:100%;fill:currentColor}.top50{font-size:20px;font-weight:800;margin:18px 2px 8px}.list{margin-top:10px;background:var(--card);border-radius:var(--radius);overflow:hidden;border:1px solid var(--line)}.row{display:grid;grid-template-columns:68px 1fr auto;gap:12px;align-items:center;padding:14px 16px;border-top:1px solid var(--line);cursor:pointer;transition:background .2s,transform .1s;height:88px;overflow:hidden}.row:hover{background:var(--hover);transform:translate(2px)}.row:active{transform:scale(.995)}.row:hover{background:#f9fafb}.row:first-child{border-top:none}.row.playing{background:#eff6ff}.thumb{width:56px;height:56px;border-radius:12px;display:grid;place-items:center;background:var(--chip);font-size:22px;overflow:hidden}.thumb img{width:100%;height:100%;object-fit:cover;border-radius:12px}.thumb img[src^="data:image/svg+xml"],.thumb img.station-icon-default{object-fit:contain;padding:10px}#player-icon img.station-icon-default,.recent-station img.station-icon-default{width:100%;height:100%;object-fit:contain;padding:8px;filter:opacity(.7)}.station-info{flex:1;min-width:0;overflow:hidden;padding-left:8px}.station-title{font-size:18px;font-weight:800;margin-bottom:4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.meta{font-size:13px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.badge{font-weight:800}.tags{margin-top:6px;display:flex;gap:6px;flex-wrap:nowrap;overflow:hidden;position:relative}.tag{font-size:11px;color:#374151;background:#f3f4f6;padding:4px 8px;border-radius:999px;white-space:nowrap;flex-shrink:0}.recent-stations{display:flex;gap:8px;padding:4px 0 8px;overflow-x:auto;overflow-y:visible;-webkit-overflow-scrolling:touch;scrollbar-width:none}.recent-stations::-webkit-scrollbar{display:none}.icon-item{flex:0 0 auto;width:64px;height:64px;border-radius:12px;background:var(--card);border:1px solid rgba(255,255,255,.1);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s ease;position:relative;overflow:hidden}.icon-item:hover{transform:translateY(-2px);box-shadow:0 4px 12px #00000026}.icon-item:active{transform:scale(.95)}.icon-item img{width:100%;height:100%;object-fit:cover;border-radius:12px}.icon-item img.station-icon-default,.icon-item img[src^="data:image/svg+xml"]{object-fit:contain;padding:8px;filter:opacity(.8);background:var(--chip)}.icon-item:has(img.station-icon-default){background:var(--chip)}.play-btn{width:44px;height:44px;display:grid;place-items:center;background:transparent;color:var(--teal);border:none;border-radius:50%;cursor:pointer;transition:transform .2s,opacity .2s;padding:0;position:relative}.play-btn svg{width:44px;height:44px}.play-btn:hover{transform:scale(1.1)}.loading-spinner{width:44px;height:44px}.spinner-outer{animation:spinnerRotate 2s linear infinite;transform-origin:center}.spinner-pulse{animation:spinnerPulse 1.5s ease-in-out infinite}.spinner-center{animation:spinnerPulse 1.5s ease-in-out infinite;animation-delay:.75s}@keyframes spinnerRotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes spinnerPulse{0%,to{r:10;opacity:.8}50%{r:15;opacity:1}}.play-btn:active{transform:scale(.95)}.play-btn.playing{color:var(--teal)}.heart{width:24px;height:24px;display:grid;place-items:center;cursor:pointer;background:none;border:none;padding:0;color:var(--muted);transition:color .2s,transform .2s}.heart:hover{color:#ef4444;transform:scale(1.1)}.heart.liked{color:#ef4444}.heart.liked svg{fill:#ef4444}.settings-content{padding:0 20px}.settings-group{margin-bottom:32px}.settings-group h3{font-size:14px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.5px;margin-bottom:16px}.app-promo-card{background:linear-gradient(135deg,#667eea,#764ba2);border-radius:16px;padding:20px;display:flex;gap:16px;margin-bottom:16px;box-shadow:0 4px 20px #667eea4d}.app-promo-icon{width:80px;height:80px;border-radius:18px;box-shadow:0 4px 12px #0003}.app-promo-info{flex:1}.app-promo-title{color:#fff;font-size:18px;font-weight:700;margin-bottom:8px}.app-promo-features{color:#fffffff2;font-size:14px;line-height:1.6}.download-app-btn{display:inline-flex;align-items:center;gap:8px;background:#000;color:#fff;padding:12px 24px;border-radius:8px;text-decoration:none;font-weight:500;transition:transform .2s}.download-app-btn:hover{transform:scale(1.05)}.settings-item{display:flex;justify-content:space-between;padding:12px 0;border-bottom:1px solid var(--line)}.settings-value{color:var(--muted)}.empty-state{text-align:center;padding:60px 20px;color:var(--muted)}.loading{text-align:center;padding:40px;color:var(--muted)}.search-header{padding:16px 20px;margin-bottom:20px;background:var(--bg);position:sticky;top:0;z-index:10;border-bottom:1px solid var(--line)}.search-input-wrapper{position:relative;margin-bottom:12px}.search-input{width:100%;padding:12px 40px 12px 16px;font-size:16px;border:1px solid var(--line);border-radius:12px;background:var(--bg);color:var(--text);outline:none}.search-input:focus{border-color:var(--accent)}.search-clear{position:absolute;right:8px;top:50%;transform:translateY(-50%);width:32px;height:32px;border:none;background:none;color:var(--muted);font-size:20px;cursor:pointer;display:grid;place-items:center;border-radius:50%}.search-clear:hover{background:var(--chip)}.search-filters{display:flex;gap:8px}.search-sort{flex:1;padding:8px 12px;border:1px solid var(--line);border-radius:8px;background:var(--bg);color:var(--text);font-size:14px;outline:none}.search-placeholder{text-align:center;padding:60px 20px}.search-icon{font-size:48px;margin-bottom:16px}.search-text{font-size:18px;font-weight:600;margin-bottom:8px}.search-hint{color:var(--muted);font-size:14px}.error{background:#fee;color:#ef4444;padding:20px;border-radius:var(--radius);text-align:center;margin:20px 0}.player{position:fixed;bottom:0;left:0;right:0;background:var(--bg);border-top:1px solid var(--line);padding:12px 20px;display:none;box-shadow:0 -5px 20px #0000001a}.player.active{display:block}.player-content{max-width:834px;margin:0 auto;display:flex;align-items:center;gap:16px}.player-icon{width:40px;height:40px;border-radius:8px;background:var(--card);display:flex;align-items:center;justify-content:center;overflow:hidden;flex-shrink:0}.player-icon img{width:100%;height:100%;object-fit:cover}.player-icon .icon-fallback{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--accent),#4facfe);color:#fff;font-size:18px;font-weight:700}.player-info{flex:1;min-width:0}.player-station{font-weight:700;font-size:19px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.player-meta{font-size:16px;color:var(--muted);margin-top:3px}.player-controls{display:flex;align-items:center;gap:12px}.volume-control{width:120px;height:5px}@media (max-width: 520px){header.appbar{justify-content:center;gap:12px}.row{grid-template-columns:56px 1fr 28px;gap:12px;height:80px;padding:12px 14px}.play-btn{margin-right:12px}.station-title{font-size:16px}.chip{width:72px;height:72px}.volume-control,.appbar .title{display:none}.appbar .right{gap:12px}.title-desktop{display:none}.title-mobile{display:flex;align-items:center;justify-content:center}.appbar .left{display:flex}.player{padding:8px 16px}.player-content{gap:12px}}@media (max-width: 380px){header.appbar{gap:8px}.appbar .right{gap:8px}.appbar button,.title-mobile{font-size:18px;width:38px;height:38px;padding:0}.tags{display:none}.meta{font-size:12px}}.spinner{width:36px;height:36px;position:relative;display:none}.spinner.active{display:block}.spinner-circle{width:100%;height:100%;position:absolute;left:0;top:0}.spinner-circle:before{content:"";display:block;margin:0 auto;width:15%;height:15%;background-color:#30b0c7;border-radius:100%;animation:spinner-circle 1.2s infinite ease-in-out both}.spinner-circle2{transform:rotate(30deg)}.spinner-circle3{transform:rotate(60deg)}.spinner-circle4{transform:rotate(90deg)}.spinner-circle5{transform:rotate(120deg)}.spinner-circle6{transform:rotate(150deg)}.spinner-circle7{transform:rotate(180deg)}.spinner-circle8{transform:rotate(210deg)}.spinner-circle9{transform:rotate(240deg)}.spinner-circle10{transform:rotate(270deg)}.spinner-circle11{transform:rotate(300deg)}.spinner-circle12{transform:rotate(330deg)}.spinner-circle2:before{animation-delay:-1.1s}.spinner-circle3:before{animation-delay:-1s}.spinner-circle4:before{animation-delay:-.9s}.spinner-circle5:before{animation-delay:-.8s}.spinner-circle6:before{animation-delay:-.7s}.spinner-circle7:before{animation-delay:-.6s}.spinner-circle8:before{animation-delay:-.5s}.spinner-circle9:before{animation-delay:-.4s}.spinner-circle10:before{animation-delay:-.3s}.spinner-circle11:before{animation-delay:-.2s}.spinner-circle12:before{animation-delay:-.1s}@keyframes spinner-circle{0%,80%,to{transform:scale(0)}40%{transform:scale(1)}}.modal{display:none;position:fixed;z-index:100;left:0;top:0;width:100%;height:100%;background-color:#00000080;animation:fadeIn .3s}.modal.active{display:flex;align-items:center;justify-content:center}.modal-content{background-color:var(--bg);border-radius:var(--radius);box-shadow:0 20px 60px #0000004d;max-width:500px;width:90%;max-height:80vh;display:flex;flex-direction:column;animation:slideUp .3s}.modal-header{padding:20px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center}.modal-title{font-size:20px;font-weight:700}.modal-close{background:none;border:none;font-size:24px;cursor:pointer;color:var(--muted);padding:0;width:32px;height:32px;display:grid;place-items:center;border-radius:8px;transition:background .2s}.modal-close:hover{background:var(--chip)}.modal-body{padding:20px;overflow-y:auto;flex:1}.country-search{width:100%;padding:12px;border:1px solid var(--line);border-radius:8px;font-size:16px;margin-bottom:16px;background:var(--bg);color:var(--text)}.country-search:focus{outline:none;border-color:var(--accent)}.country-list{display:flex;flex-direction:column;gap:4px}.country-item{padding:12px 16px;border-radius:8px;cursor:pointer;transition:background .2s;display:flex;justify-content:space-between;align-items:center}.country-item:hover{background:var(--chip)}.country-item.selected{background:var(--accent);color:#fff}.country-name{font-weight:500;display:flex;align-items:center;gap:8px}.country-count{font-size:14px;color:var(--muted);background:var(--chip);padding:4px 8px;border-radius:12px}.country-item.selected .country-count{background:#fff3;color:#fff}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}.faq-section{margin:28px 0}.faq-list{display:flex;flex-direction:column;gap:12px}.faq-item{background:var(--card);border:1px solid var(--line);border-radius:12px;overflow:hidden;transition:box-shadow .2s ease}.faq-item:hover{box-shadow:0 4px 12px #00000014}.faq-item[open]{box-shadow:0 4px 12px #30b0c726}.faq-question{padding:16px 20px;font-size:17px;font-weight:600;color:var(--text);cursor:pointer;list-style:none;-webkit-user-select:none;user-select:none;transition:background .2s ease;display:flex;justify-content:space-between;align-items:center}.faq-question::-webkit-details-marker{display:none}.faq-question:after{content:"+";font-size:24px;font-weight:400;color:var(--accent);transition:transform .3s ease;flex-shrink:0;margin-left:12px}.faq-item[open] .faq-question:after{transform:rotate(45deg)}.faq-question:hover{background:#f9fafb}.faq-answer{padding:0 20px 16px;animation:fadeIn .3s ease}.faq-answer p{margin:0;font-size:15px;line-height:1.6;color:var(--muted)}@media (max-width: 520px){.faq-question{padding:14px 16px;font-size:16px}.faq-answer{padding:0 16px 14px}.faq-answer p{font-size:14px}}