*{box-sizing:border-box;margin:0;padding:0;}
body{
  font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  min-height:100vh;
  color:#e5e7eb;
  background-color:#020617;
  background-image:url("../img/bg-rtt.png");
  background-repeat:no-repeat;
  background-position:center top;
  background-size:cover;
}
.rt-bg-overlay{
  position:fixed;inset:0;
  background:radial-gradient(circle at top,rgba(15,23,42,.5),transparent 55%),radial-gradient(circle at bottom,rgba(3,7,18,.9),#020617 80%);
  pointer-events:none;z-index:0;
}
.rt-page{position:relative;z-index:1;max-width:1200px;margin:0 auto;padding:1.5rem 1.25rem 3rem;}
.rt-header{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:1.75rem;}
.rt-logo-area{display:flex;align-items:center;gap:.75rem;}
.rt-logo-circle{width:46px;height:46px;border-radius:999px;border:2px solid rgba(96,165,250,.9);display:flex;align-items:center;justify-content:center;background:radial-gradient(circle,#1d4ed8,#020617);box-shadow:0 0 18px rgba(37,99,235,.65);font-weight:700;font-size:.9rem;letter-spacing:.08em;text-transform:uppercase;}
.rt-brand{display:flex;flex-direction:column;gap:.1rem;}
.rt-brand-title{font-size:1.25rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;}
.rt-brand-sub{font-size:.8rem;color:#9ca3af;}
.rt-header-right{display:flex;gap:.5rem;align-items:center;flex-wrap:wrap;justify-content:flex-end;}
.rt-chip{border-radius:999px;border:1px solid rgba(148,163,184,.5);padding:.35rem .8rem;font-size:.75rem;text-transform:uppercase;letter-spacing:.12em;color:#c7d2fe;background:radial-gradient(circle at top,rgba(59,130,246,.25),transparent);}
.rt-main{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1.3fr);gap:1.75rem;align-items:flex-start;}
@media(max-width:900px){.rt-main{grid-template-columns:minmax(0,1fr);} .rt-header{flex-direction:column;align-items:flex-start;} .rt-header-right{justify-content:flex-start;}}
.rt-player{position:relative;display:flex;gap:2rem;padding:2rem;border-radius:24px;background:radial-gradient(circle at top left,rgba(37,99,235,.9),#020617 40%,#000 100%);border:1px solid rgba(129,140,248,.6);box-shadow:0 0 40px rgba(37,99,235,.45);color:#e5e7eb;overflow:hidden;}
.rt-player-bg-glow{position:absolute;inset:-40%;background:radial-gradient(circle at 10% 0,rgba(56,189,248,.5),transparent 55%),radial-gradient(circle at 90% 100%,rgba(236,72,153,.35),transparent 55%);opacity:.6;z-index:0;}
.rt-player-left,.rt-player-right{position:relative;z-index:1;}
.rt-player-left{flex:0 0 230px;display:flex;align-items:center;justify-content:center;}
.rt-cover-wrapper{position:relative;width:100%;max-width:230px;aspect-ratio:1/1;border-radius:20px;overflow:hidden;box-shadow:0 0 35px rgba(15,23,42,.9);}
.rt-cover{width:100%;height:100%;object-fit:cover;display:block;transition:opacity .35s ease;}
.rt-cover-overlay{position:absolute;inset:0;background:linear-gradient(to top,rgba(15,23,42,.9),transparent 45%);display:flex;align-items:flex-end;justify-content:flex-start;padding:.75rem;}
.rt-badge-ao-vivo{font-size:.75rem;letter-spacing:.06em;text-transform:uppercase;padding:.35rem .7rem;border-radius:999px;background:rgba(239,68,68,.9);color:#fee2e2;box-shadow:0 0 10px rgba(239,68,68,.8);}
.rt-player-right{flex:1;display:flex;flex-direction:column;gap:1rem;justify-content:center;}
.rt-now-title{font-size:.9rem;letter-spacing:.3em;text-transform:uppercase;color:#a5b4fc;margin:0;}
.rt-track-info{display:flex;align-items:center;gap:1rem;}
.rt-track-text{display:flex;flex-direction:column;gap:.2rem;}
.rt-track-name{font-size:1.5rem;font-weight:700;color:#f9fafb;}
.rt-track-artist{font-size:.95rem;color:#cbd5f5;opacity:.9;}
.rt-vu-wrapper{display:flex;align-items:flex-end;gap:5px;height:40px;margin-top:.75rem;padding:.25rem .4rem;border-radius:999px;background:radial-gradient(circle at 50% 120%,rgba(15,23,42,.9),transparent);}
.rt-vu-bar{flex:1;border-radius:999px;background:linear-gradient(to top,#16a34a,#eab308,#f97316,#ef4444);box-shadow:0 0 10px rgba(34,197,94,.7);animation:rt-vu .9s infinite ease-in-out;animation-play-state:running;transform-origin:bottom;opacity:.95;}
.rt-vu-bar:nth-child(1){animation-delay:0s;}
.rt-vu-bar:nth-child(2){animation-delay:.09s;}
.rt-vu-bar:nth-child(3){animation-delay:.18s;}
.rt-vu-bar:nth-child(4){animation-delay:.27s;}
.rt-vu-bar:nth-child(5){animation-delay:.36s;}
@keyframes rt-vu{0%{height:20%;}20%{height:95%;}40%{height:45%;}60%{height:80%;}80%{height:30%;}100%{height:60%;}}
.rt-vu-wrapper.rt-vu-paused .rt-vu-bar{animation-play-state:paused;height:18%;box-shadow:0 0 4px rgba(148,163,184,.4);opacity:.7;}
.rt-controls{display:flex;align-items:center;gap:1rem;margin-top:1rem;flex-wrap:wrap;}
.rt-btn-play{border:none;border-radius:999px;padding:.8rem 1.9rem;font-size:.98rem;font-weight:600;cursor:pointer;background:linear-gradient(135deg,#22c55e,#16a34a);color:#022c22;box-shadow:0 0 22px rgba(22,163,74,.9);transition:transform .15s ease,box-shadow .15s ease,filter .15s ease;}
.rt-btn-play:hover{transform:translateY(-1px);filter:brightness(1.05);box-shadow:0 0 28px rgba(22,163,74,1);}
.rt-status{font-size:.85rem;color:#e5e7eb;opacity:.9;}

.rt-volume{
  display:flex;
  align-items:center;
  gap:.5rem;
  margin-left:auto;
}
.rt-volume-icon{
  font-size:1rem;
  opacity:.85;
}
#rt-volume-slider{
  width:140px;
  cursor:pointer;
}
@media(max-width:768px){
  .rt-volume{
    width:100%;
    justify-content:flex-start;
    margin-left:0;
    margin-top:.5rem;
  }
}
@media(max-width:768px){.rt-player{flex-direction:column;padding:1.25rem;gap:1.25rem;} .rt-player-left{flex:none;max-width:220px;margin:0 auto;} .rt-now-title{text-align:center;} .rt-track-text{text-align:center;} .rt-controls{justify-content:center;}}
.rt-side-card{border-radius:20px;padding:1.25rem 1.5rem;background:radial-gradient(circle at top,rgba(15,23,42,.97),#020617);border:1px solid rgba(31,41,55,.9);box-shadow:0 0 30px rgba(15,23,42,.9);display:flex;flex-direction:column;gap:1rem;}
.rt-side-title{font-size:.9rem;letter-spacing:.24em;text-transform:uppercase;color:#9ca3af;}
.rt-side-main{font-size:.95rem;color:#e5e7eb;line-height:1.5;}
.rt-side-main strong{color:#bfdbfe;}
.rt-program-list{list-style:none;margin-top:.5rem;display:flex;flex-direction:column;gap:.4rem;font-size:.9rem;color:#d1d5db;}
.rt-program-list li span{display:inline-block;min-width:78px;font-weight:600;color:#a5b4fc;font-size:.8rem;text-transform:uppercase;letter-spacing:.08em;}
.rt-footer{position:relative;z-index:1;text-align:center;font-size:.8rem;color:#6b7280;padding:1rem 0 1.5rem;margin-top:auto;}


/* --- Clima (SJRP + São Paulo) --- */
.rt-weather{
  margin-top:1.75rem;
  padding:1.25rem 1.25rem;
  border-radius:18px;
  border:1px solid rgba(56,189,248,.25);
  background:rgba(2,6,23,.40);
  backdrop-filter:blur(10px);
  box-shadow:0 18px 40px rgba(0,0,0,.35);
}
.rt-weather-title{
  letter-spacing:.12em;
  font-size:.75rem;
  text-transform:uppercase;
  color:rgba(226,232,240,.75);
  margin-bottom:.85rem;
}
.rt-weather-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:1rem;
}
.rt-weather-card{
  border-radius:14px;
  border:1px solid rgba(148,163,184,.20);
  background:rgba(15,23,42,.35);
  padding:.95rem 1rem;
}
.rt-weather-city{
  font-weight:700;
  color:#e2e8f0;
  margin-bottom:.35rem;
}
.rt-weather-lines{
  font-size:.92rem;
  color:rgba(226,232,240,.85);
  line-height:1.45;
  margin-bottom:.55rem;
}
.rt-weather-temp{font-weight:800;font-size:1.05rem;}
.rt-weather-desc{color:rgba(226,232,240,.75);}
.rt-weather-link{
  display:inline-block;
  margin-top:8px;
  padding:6px 10px;
  border-radius:10px;
  font-weight:700;
  text-decoration:none;
  color:#ffffff;
  background:rgba(59,130,246,0.35);
  border:1px solid rgba(59,130,246,0.55);
  box-shadow:0 6px 18px rgba(0,0,0,0.25);
}
.rt-weather-link:hover{
  background:rgba(59,130,246,0.55);
  border-color:rgba(147,197,253,0.9);
  text-decoration:underline;
}


.rt-weather-link:hover{ text-decoration:underline; }

/* --- Footer com links --- */
.rt-footer{
  display:flex;
  gap:.75rem;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
}
.rt-footer-links{
  display:flex;
  gap:.75rem;
  flex-wrap:wrap;
}
.rt-footer-link{
  color:rgba(226,232,240,.8);
  text-decoration:none;
  border:1px solid rgba(148,163,184,.20);
  padding:.35rem .6rem;
  border-radius:999px;
  background:rgba(2,6,23,.25);
}
.rt-footer-link:hover{
  color:#e2e8f0;
  border-color:rgba(56,189,248,.35);
}

/* Responsive */
@media (max-width: 860px){
  .rt-weather-grid{grid-template-columns:1fr;}
}
