*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:Inter,Arial,sans-serif;background:#020817;color:#fff}body{overflow-x:hidden}.bg{position:fixed;inset:0;background:center/cover no-repeat;filter:saturate(1.15);transform:scale(1.04);z-index:0}.shade{position:fixed;inset:0;background:linear-gradient(180deg,rgba(1,8,24,.22),rgba(2,8,23,.58) 48%,rgba(2,8,23,.94) 94%);z-index:1;pointer-events:none}#weather{position:fixed;inset:0;width:100%;height:100%;z-index:2;pointer-events:none;mix-blend-mode:screen}.app-shell{z-index:3;width:min(100%,460px);min-height:100dvh;margin:auto;padding:12px 18px 24px;text-align:center;position:relative}header{display:flex;align-items:center;justify-content:space-between;font-size:13px;font-weight:800}header button{border:1px solid #3d6284;background:#07172b;color:#fff;border-radius:999px;padding:8px 11px}.live{display:inline-flex;align-items:center;gap:8px;margin:2px auto 12px;background:#f11d3d;border-radius:999px;padding:8px 18px;font-weight:900;box-shadow:0 0 20px #f51a5c88}.live i{width:11px;height:11px;background:white;border-radius:50%;animation:pulse 1.1s infinite}.hero{display:flex;justify-content:center}.avatar-ring{width:min(72vw,310px);aspect-ratio:1;border-radius:50%;padding:8px;background:conic-gradient(#00f7ff,#6b3cff,#ff2bd6,#00f7ff);box-shadow:0 0 16px #00cfff,0 0 42px #5060ff88;animation:float 4s ease-in-out infinite}.avatar-ring img{width:100%;height:100%;object-fit:cover;border-radius:50%;background:white;border:5px solid #07152a}.info h1{font-size:28px;margin:14px 0 0}.info h2{font-size:16px;color:#ff42d6;margin:3px}.schedule{display:inline-block;border:1px solid #08dfff;border-radius:999px;color:#08eaff;padding:5px 14px;font-size:13px;box-shadow:0 0 12px #00d9ff55}.info small{display:block;margin-top:10px}.info p{margin:3px 0 8px;font-size:15px}.brand img{width:150px;height:150px;object-fit:contain;border-radius:50%;filter:drop-shadow(0 0 16px #00d9ff)}.brand h3{margin:3px;font-size:20px}.brand p{font-size:12px;margin:2px 0}.wave{height:54px;overflow:hidden;margin:4px 0 2px;position:relative;border-radius:18px;background:linear-gradient(180deg,rgba(0,35,10,.13),rgba(0,0,0,.18));border:1px solid rgba(255,230,0,.08);box-shadow:inset 0 0 18px rgba(0,255,80,.06)}.wave canvas{display:block;width:100%;height:100%;opacity:.28;transition:opacity .35s ease,filter .35s ease}.wave.is-active canvas{opacity:1;filter:drop-shadow(0 0 5px rgba(86,255,0,.8)) drop-shadow(0 0 8px rgba(255,225,0,.5))}.wave::after{content:"";position:absolute;left:4%;right:4%;top:50%;height:1px;background:linear-gradient(90deg,transparent,#2dff00,#ffe600,#2dff00,transparent);opacity:.25;pointer-events:none}.wave.is-active::after{opacity:.75;box-shadow:0 0 8px #73ff00}.controls{display:flex;justify-content:center;gap:22px;align-items:center;margin:8px 0 4px}.media-btn{position:relative;isolation:isolate;display:grid;place-items:center;color:#fff;background:radial-gradient(circle at 35% 28%,#173765 0,#07162f 42%,#020817 78%);border:1px solid rgba(47,193,255,.95);border-radius:50%;width:54px;height:54px;font-size:19px;cursor:pointer;box-shadow:0 0 0 3px rgba(0,119,255,.10),inset 0 0 12px rgba(0,204,255,.18),0 0 18px rgba(0,119,255,.55);transition:transform .2s ease,filter .2s ease,box-shadow .2s ease;overflow:visible}.media-btn::before{content:"";position:absolute;inset:-6px;border-radius:50%;border:2px solid transparent;background:linear-gradient(135deg,#00e5ff,#1478ff,#8c2cff) border-box;-webkit-mask:linear-gradient(#000 0 0) padding-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:.95;filter:drop-shadow(0 0 6px #008cff)}.media-btn::after{content:"";position:absolute;inset:5px;border-radius:50%;background:linear-gradient(145deg,rgba(255,255,255,.16),transparent 42%);pointer-events:none}.media-btn:hover{transform:translateY(-2px) scale(1.04);filter:brightness(1.18)}.media-btn:active{transform:scale(.92)}.media-icon{position:relative;z-index:3;line-height:1;text-shadow:0 0 8px rgba(255,255,255,.8)}.controls .play{width:76px;height:76px;font-size:30px;border-color:#ff35df;background:radial-gradient(circle at 36% 28%,#4a1459 0,#160b35 43%,#050817 78%);box-shadow:0 0 0 4px rgba(255,32,210,.10),inset 0 0 16px rgba(255,66,220,.22),0 0 26px rgba(255,31,221,.72)}.controls .play::before{inset:-7px;background:linear-gradient(135deg,#00e5ff 0%,#7a31ff 42%,#ff2bd6 72%,#00e5ff 100%) border-box;animation:ringSpin 4s linear infinite;filter:drop-shadow(0 0 8px #ff2bd6)}.heart-glow{position:absolute;left:50%;bottom:-13px;transform:translateX(-50%);font-size:15px;color:#ff43d7;text-shadow:0 0 7px #ff2bd6,0 0 14px #ff2bd6;z-index:4;animation:heartBeat 1.15s ease-in-out infinite}.heartbeat{animation:playerBeat 1.15s ease-in-out infinite}.heartbeat.is-playing{animation-duration:.82s}.heartbeat.is-playing .heart-glow{animation-duration:.82s}.previous,.next{animation:sideGlow 2.3s ease-in-out infinite}.next{animation-delay:.3s}.volume{display:flex;gap:10px;align-items:center;margin:13px 20px}.volume input{width:100%;accent-color:#ff2bd6}nav{display:grid;grid-template-columns:repeat(5,1fr);gap:7px;margin-top:12px}nav a{color:#fff;text-decoration:none;font-size:9px;text-transform:uppercase}nav b{display:grid;place-items:center;width:40px;height:40px;margin:auto auto 5px;border:1px solid #00dfff;border-radius:50%;font-size:18px;background:#07152a}@keyframes pulse{50%{opacity:.4;transform:scale(.75)}}@keyframes float{50%{transform:translateY(-7px)}}@keyframes wave{to{transform:translateX(14px)}}@media(min-width:700px){body{background:#000b1c}.app-shell{box-shadow:0 0 90px #006eff44}}

@keyframes playerBeat{0%,28%,100%{transform:scale(1)}10%{transform:scale(1.07)}18%{transform:scale(.98)}}@keyframes heartBeat{0%,28%,100%{transform:translateX(-50%) scale(1);opacity:.8}10%{transform:translateX(-50%) scale(1.35);opacity:1}18%{transform:translateX(-50%) scale(.92);opacity:.9}}@keyframes ringSpin{to{transform:rotate(360deg)}}@keyframes sideGlow{0%,100%{box-shadow:0 0 0 3px rgba(0,119,255,.10),inset 0 0 12px rgba(0,204,255,.18),0 0 15px rgba(0,119,255,.48)}50%{box-shadow:0 0 0 4px rgba(0,224,255,.14),inset 0 0 16px rgba(0,224,255,.26),0 0 25px rgba(0,168,255,.75)}}@media (prefers-reduced-motion:reduce){.heartbeat,.heart-glow,.previous,.next,.controls .play::before{animation:none!important}}
.player-status{margin:8px auto 4px;padding:5px 12px;width:max-content;max-width:90%;border-radius:999px;font-size:11px;font-weight:800;letter-spacing:.04em;color:#c8eaff;background:rgba(0,8,28,.72);border:1px solid rgba(0,204,255,.35);box-shadow:0 0 14px rgba(0,174,255,.18)}
.player-status.live{color:#fff;background:rgba(236,0,106,.8);border-color:#ff4aaa;box-shadow:0 0 18px rgba(255,0,128,.55)}
.player-status.loading{color:#ffe483;animation:statusPulse 1s ease-in-out infinite}
.player-status.error{color:#ffd4df;border-color:rgba(255,65,120,.65)}
@keyframes statusPulse{50%{opacity:.55;transform:scale(.98)}}
/* Otimizações de carregamento e renderização */
.hero,.info,.brand,.controls,nav{content-visibility:auto;contain-intrinsic-size:1px 180px}
.bg{opacity:0;transition:opacity .25s ease;will-change:opacity;background-color:#020817}
.assets-ready .bg{opacity:1}
.avatar-ring,.brand img,.media-btn{transform:translateZ(0);backface-visibility:hidden}
#hostImage,#stationLogo{image-rendering:auto}
@media (max-width:480px){.app-shell{padding-left:12px;padding-right:12px}.avatar-ring{width:min(76vw,290px)}.brand img{width:132px;height:132px}}
:root{--text-color:#ffffff;--button-color:#137bef}
body,.app-shell{color:var(--text-color)}
header button,.media-btn,nav b{border-color:var(--button-color)}
header button,nav b{box-shadow:0 0 14px color-mix(in srgb,var(--button-color) 45%,transparent)}
.controls .play{border-color:var(--button-color)}
#songName{font-weight:700;min-height:1.3em;transition:opacity .2s ease}
#clearCacheBtn{border:1px solid rgba(255,255,255,.28);background:rgba(2,8,23,.55);color:var(--text-color,#fff);border-radius:999px;padding:7px 11px;font-size:12px;cursor:pointer;backdrop-filter:blur(8px)}
[hidden]{display:none!important}

.header-actions{display:flex;align-items:center;gap:8px}
.install-button{display:inline-flex;align-items:center;gap:7px!important;padding:8px 13px!important;font-weight:900!important;background:linear-gradient(135deg,color-mix(in srgb,var(--button-color) 86%,#00eaff),color-mix(in srgb,var(--button-color) 72%,#8d28ff))!important;border:1px solid rgba(255,255,255,.75)!important;box-shadow:0 0 18px color-mix(in srgb,var(--button-color) 62%,transparent),inset 0 1px rgba(255,255,255,.3)!important;animation:installGlow 1.8s ease-in-out infinite;white-space:nowrap}
.install-button .install-icon{display:grid;place-items:center;width:20px;height:20px;border-radius:50%;background:rgba(255,255,255,.2);font-size:13px}
.install-button.is-ready{outline:2px solid color-mix(in srgb,var(--button-color) 45%,transparent);outline-offset:2px}
@keyframes installGlow{50%{transform:translateY(-1px);filter:brightness(1.15);box-shadow:0 0 26px color-mix(in srgb,var(--button-color) 78%,transparent),inset 0 1px rgba(255,255,255,.4)}}
@media(max-width:390px){.install-button{padding:7px 9px!important;font-size:11px}.install-button .install-icon{display:none}.header-actions{gap:5px}}
/* Todas as áreas antes rosas agora obedecem à cor escolhida no painel. */
.info h2{color:var(--button-color)!important;text-shadow:0 0 10px color-mix(in srgb,var(--button-color) 58%,transparent)}
.live,.player-status.live{background:color-mix(in srgb,var(--button-color) 84%,#111)!important;border-color:var(--button-color)!important;box-shadow:0 0 20px color-mix(in srgb,var(--button-color) 58%,transparent)!important}
.controls .play{border-color:var(--button-color)!important;background:radial-gradient(circle at 36% 28%,color-mix(in srgb,var(--button-color) 35%,#111) 0,#160b35 43%,#050817 78%)!important;box-shadow:0 0 0 4px color-mix(in srgb,var(--button-color) 15%,transparent),inset 0 0 16px color-mix(in srgb,var(--button-color) 25%,transparent),0 0 26px color-mix(in srgb,var(--button-color) 72%,transparent)!important}
.controls .play::before{background:linear-gradient(135deg,#00e5ff 0%,color-mix(in srgb,var(--button-color) 65%,#7a31ff) 46%,var(--button-color) 76%,#00e5ff 100%) border-box!important;filter:drop-shadow(0 0 8px var(--button-color))!important}
.heart-glow{color:var(--button-color)!important;text-shadow:0 0 7px var(--button-color),0 0 14px var(--button-color)!important}
.volume input{accent-color:var(--button-color)!important}
.avatar-ring{background:conic-gradient(#00f7ff,#6b3cff,var(--button-color),#00f7ff)!important}

/* Texto em movimento controlado pelo painel */
.moving-text-box{width:100%;overflow:hidden;margin:12px 0 8px;padding:9px 0;border-top:1px solid color-mix(in srgb,var(--button-color,#137bef) 55%,transparent);border-bottom:1px solid color-mix(in srgb,var(--button-color,#137bef) 55%,transparent);background:rgba(2,8,23,.34);box-shadow:0 0 14px color-mix(in srgb,var(--button-color,#137bef) 22%,transparent);white-space:nowrap}
.moving-text{display:inline-block;min-width:100%;padding-left:100%;font-weight:800;font-size:15px;color:var(--text-color,#fff);text-shadow:0 1px 3px #000;animation:movingTextScroll 14s linear infinite;will-change:transform}
@keyframes movingTextScroll{from{transform:translateX(0)}to{transform:translateX(-100%)}}
@media (prefers-reduced-motion:reduce){.moving-text{animation-duration:22s}}

/* Botões sociais obedecem ao admin: link vazio não aparece */
nav{grid-template-columns:repeat(var(--social-count,5),minmax(0,1fr))}
nav a,nav .social-link{color:var(--text-color,#fff);text-decoration:none;font-size:9px;text-transform:uppercase;background:transparent;border:0;padding:0;cursor:pointer;font-family:inherit}
nav a b,nav .social-link b{display:grid;place-items:center;width:40px;height:40px;margin:auto auto 5px;border:1px solid var(--button-color);border-radius:50%;font-size:18px;background:#07152a;box-shadow:0 0 14px color-mix(in srgb,var(--button-color) 45%,transparent)}
@media(max-width:520px){nav{grid-template-columns:repeat(3,1fr);row-gap:13px}}
.tv-modal{position:fixed;inset:0;z-index:9999;display:grid;place-items:center;padding:14px;background:rgba(0,3,12,.86);backdrop-filter:blur(8px)}
.tv-panel{width:min(960px,100%);background:#020817;border:1px solid var(--button-color);border-radius:18px;overflow:hidden;box-shadow:0 0 35px color-mix(in srgb,var(--button-color) 45%,transparent)}
.tv-head{display:flex;align-items:center;justify-content:space-between;padding:12px 15px}.tv-head button{width:38px;height:38px;border-radius:50%;border:1px solid var(--button-color);background:#07152a;color:#fff;font-size:25px;cursor:pointer}
.tv-stage{aspect-ratio:16/9;background:#000;display:grid;place-items:center}.tv-stage video,.tv-stage iframe{width:100%;height:100%;border:0;background:#000}.tv-error{padding:24px;text-align:center}.tv-error a{color:#59dfff}.tv-open{overflow:hidden}