*{box-sizing:border-box}html{min-height:100%;background:#020c25}body{margin:0;color:#fff;font-family:Arial,Helvetica,sans-serif;min-height:100svh;background:radial-gradient(ellipse at 50% 15%,#123f97 0,#061c55 45%,#020c25 85%)}button,a,input{-webkit-tap-highlight-color:transparent}button,a{touch-action:manipulation}button{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #ffd663;outline-offset:5px}a{color:inherit;text-decoration:none}svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.app{max-width:480px;margin:auto;min-height:100svh;padding:calc(24px + env(safe-area-inset-top)) 28px calc(20px + env(safe-area-inset-bottom));position:relative;overflow:hidden}header{display:flex;align-items:center;justify-content:space-between;gap:12px}.brand-small{font-size:11px;letter-spacing:1.5px;font-weight:800}.brand-small b{color:#ffc945}.install{display:flex;align-items:center;gap:6px;color:#ecf2ff;background:#ffffff0d;border:1px solid #ffffff26;border-radius:30px;padding:10px 12px;font-size:11px}.install svg{width:16px;height:16px}.station{text-align:center;padding-top:38px}.live{display:inline-flex;align-items:center;gap:7px;letter-spacing:1.8px;font-size:8px;color:#b7c9ef}.live span{width:5px;height:5px;background:#ffc840;border-radius:50%;box-shadow:0 0 12px #ffcb4180}.logo-orbit{margin:28px auto 23px;width:270px;height:270px;border:1px solid #ffffff17;border-radius:50%;padding:13px;position:relative}.logo-orbit:after{content:'';position:absolute;inset:-7px;border:2px solid transparent;border-top-color:#ffc643;border-bottom-color:#ee3438;border-radius:50%;transform:rotate(-30deg)}.logo-disc{height:100%;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle at 40% 30%,#fff 35%,#e8eef8 100%);box-shadow:0 15px 50px #0005,0 0 60px #2872da33}.logo-disc img{width:93%;height:auto}h1{font-size:29px;letter-spacing:-1px;margin:0 0 6px;font-weight:800}h1 span{font-weight:400}.frequency{margin:0;font-size:17px;font-weight:700;color:#ffd16a;letter-spacing:3px}.frequency span{font-size:10px;letter-spacing:1px}.tagline{color:#a9bde3;font-size:13px;margin:14px 0 0}.player{text-align:center;padding-top:28px}.player-line{display:flex;justify-content:center;align-items:center;gap:16px}.play{flex-shrink:0;width:92px;height:92px;display:grid;place-items:center;border:5px solid #fff;border-radius:50%;color:#e72636;background:linear-gradient(140deg,#fff,#e8edf7);box-shadow:0 0 0 7px #ffffff09,0 0 0 8px #ffffff3d,0 10px 28px #0004;transition:transform .2s}.play:hover{transform:scale(1.04)}.play svg{width:40px;height:40px;fill:currentColor;stroke:none}.wave{height:58px;display:flex;align-items:center;gap:4px}.wave i{display:block;width:3px;height:var(--h);border-radius:4px;background:#f23d4f;opacity:.85}.reverse{transform:scaleX(-1)}.playing .wave i{animation:pulse .8s ease-in-out infinite alternate;animation-delay:var(--d)}@keyframes pulse{to{transform:scaleY(.25);opacity:.4}}.player h2{font-size:15px;margin:24px 0 8px;font-weight:500}.player p{font-size:11px;color:#a9bde3;margin:0;min-height:14px}.volume{display:flex;align-items:center;gap:12px;max-width:245px;margin:22px auto 0;color:#a9bde3}.volume svg{width:18px;height:18px}.volume input{width:100%;height:4px;accent-color:#d3dff7;cursor:pointer}.volume span{font-size:10px;min-width:28px}.message-card{display:flex;align-items:center;gap:12px;margin-top:30px;padding:15px;background:#ffffff06;border:1px solid #ffffff15;border-radius:17px}.message-icon{display:grid;place-items:center;color:#ffce62;background:#ffcc5b12;border-radius:12px;width:38px;height:38px;font-size:23px}.message-card strong{display:block;font-size:12px;font-weight:500}.message-card small{display:block;color:#8fa8d3;font-size:10px;margin-top:5px}.arrow{margin-left:auto;color:#9fb5dc}nav{display:flex;justify-content:space-around;padding:25px 0 19px}nav button,nav a{border:0;background:none;color:#bdccec;display:flex;align-items:center;gap:9px;flex-direction:column;min-width:80px;padding:6px 0}nav span{font-size:10px}nav button[aria-pressed=true]{color:#ff7a89}nav button[aria-pressed=true] svg{fill:#ff7a89}footer{text-align:center;font-size:9px;letter-spacing:.4px;color:#657da9;border-top:1px solid #ffffff0c;padding-top:17px}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}#toast{position:fixed;bottom:28px;left:50%;transform:translateX(-50%);background:#fff;color:#102345;padding:14px 20px;border-radius:14px;max-width:90vw;width:max-content;box-shadow:0 8px 30px #0007;font-size:13px;z-index:3}dialog{max-width:360px;width:calc(100% - 40px);border:1px solid #ffffff26;border-radius:24px;background:#102958;color:white;padding:28px}dialog::backdrop{background:#0009}dialog h2{font-size:22px;margin-top:12px}dialog p{font-size:14px;line-height:1.6;color:#c7d6f2}.close{position:absolute;right:12px;top:9px;border:0;background:none;color:white;font-size:28px}.confirm{width:100%;border:0;background:#d5e3ff;color:#102958;padding:13px;border-radius:22px}.help-note{font-size:12px!important}@media(min-width:650px){body{padding:30px 0}.app{border:1px solid #ffffff17;border-radius:32px;box-shadow:0 30px 100px #0006;background:linear-gradient(165deg,#10377e66,#020e2be0);min-height:auto}}@media(max-width:360px){.app{padding-left:20px;padding-right:20px}.logo-orbit{width:230px;height:230px}.player-line{gap:12px}.wave{gap:3px}.brand-small{font-size:9px}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

.logo-disc{background:#fff}.app{width:100%}

/* Centraliza o conjunto e preserva rolagem em telas pequenas. */
body{
  min-height:100vh;
  min-height:100dvh;
  display:flex;
  flex-direction:column;
  padding:calc(8px + env(safe-area-inset-top)) calc(12px + env(safe-area-inset-right)) calc(32px + env(safe-area-inset-bottom)) calc(12px + env(safe-area-inset-left));
}
.app{flex:0 0 auto;min-height:0;margin:auto;padding:12px 16px;overflow:visible}
.station{padding-top:22px}
.logo-orbit{width:190px;width:clamp(150px,23dvh,200px);height:auto;aspect-ratio:1;display:grid;margin:20px auto 17px}
.logo-disc{height:auto;min-width:0}
header{flex-direction:column;gap:12px;text-align:center}
.install{width:100%;min-height:48px;justify-content:center;gap:10px;padding:13px 18px;border:1px solid #ffe29a;border-radius:15px;background:linear-gradient(135deg,#ffdb79,#ffc342);color:#061c55;font-size:15px;font-weight:700;box-shadow:0 6px 20px #0003}
.install svg{width:22px;height:22px;stroke-width:2}
.install:hover{background:#ffdf86}
.install:active{transform:translateY(1px)}
.install[hidden]{display:none}
.player{padding-top:22px}
.play{width:80px;height:80px}
.player h2{margin-top:20px}
.volume{margin-top:18px}
.message-card{margin-top:22px}
nav{padding:19px 0 14px}
footer{padding-top:13px}
.wave{flex:0 1 73px;min-width:0;justify-content:space-between;gap:2px}
.wave i{flex:0 1 3px;min-width:1px}
nav button,nav a{min-width:0;flex:1}
.message-icon{flex-shrink:0}
@media(max-height:740px){
  .station{padding-top:16px}
  .logo-orbit{width:150px;margin:15px auto 12px}
  h1{font-size:26px}
  .tagline{margin-top:10px}
  .player{padding-top:18px}
  .play{width:72px;height:72px}
  .player h2{margin:16px 0 6px}
  .volume{margin-top:14px}
  .message-card{margin-top:16px;padding:12px}
  nav{padding:14px 0 10px}
  footer{padding-top:10px}
}
@media(min-width:650px){.app{padding:24px 28px}}