/*
Theme Name: Don Beano Radio
Theme URI: https://donbeano.com/
Author: Don Beano Radio
Description: Full-screen boombox-style Don Beano Radio player theme with five album covers, gold cinematic UI, and default mixtape loading first.
Version: 1.2.0
Requires at least: 6.0
Tested up to: 6.9
Requires PHP: 7.4
License: Proprietary
Text Domain: don-beano-radio
*/

:root{
  --gold:#ffd56a; --gold2:#ff9d00; --black:#050505; --panel:#101010;
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:#000;color:#fff;font-family:Arial,Helvetica,sans-serif;overflow-x:hidden}
body{background:radial-gradient(circle at top,#1d1204 0,#070707 38%,#000 100%)}
a{color:inherit;text-decoration:none}
.dbr-page{min-height:100vh;position:relative;display:flex;align-items:center;justify-content:center;padding:28px 14px;overflow:hidden}
.dbr-page:before{content:"";position:absolute;inset:-10%;background:radial-gradient(circle at 20% 15%,rgba(255,199,69,.22),transparent 18%),radial-gradient(circle at 80% 20%,rgba(255,153,0,.18),transparent 20%),radial-gradient(circle at 50% 90%,rgba(255,201,80,.14),transparent 25%);filter:blur(1px);animation:dbrFloat 7s ease-in-out infinite alternate;pointer-events:none}.dbr-page:after{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(255,212,106,.8) 1px, transparent 1px);background-size:26px 26px;opacity:.14;mask-image:radial-gradient(circle,#000 20%,transparent 72%);pointer-events:none}
@keyframes dbrFloat{to{transform:scale(1.04) translateY(-10px)}}
.dbr-shell{position:relative;z-index:2;width:min(1220px,100%);border:2px solid rgba(255,213,106,.8);border-radius:30px;background:linear-gradient(135deg,rgba(0,0,0,.94),rgba(22,16,8,.94));box-shadow:0 0 18px rgba(255,176,0,.65),0 0 65px rgba(255,141,0,.35),inset 0 0 35px rgba(255,213,106,.16);padding:22px;overflow:hidden}.dbr-shell:before{content:"";position:absolute;inset:10px;border:1px solid rgba(255,220,120,.55);border-radius:24px;pointer-events:none}.dbr-header{text-align:center;padding:6px 12px 14px}.dbr-kicker{letter-spacing:.28em;font-size:13px;color:var(--gold);text-transform:uppercase;text-shadow:0 0 12px rgba(255,213,106,.8)}.dbr-title{font-size:clamp(34px,6vw,76px);line-height:.94;font-weight:900;letter-spacing:.08em;margin:8px 0;text-transform:uppercase;background:linear-gradient(#fff7cf,#ffc13a,#9b5a00);-webkit-background-clip:text;color:transparent;text-shadow:0 0 24px rgba(255,188,52,.2)}.dbr-now{font-size:clamp(15px,2.4vw,22px);color:#fff}.dbr-now strong{color:var(--gold)}
.dbr-boombox{display:grid;grid-template-columns:minmax(150px,1fr) minmax(260px,520px) minmax(150px,1fr);gap:18px;align-items:center;margin-top:12px}.dbr-speaker{aspect-ratio:1;border-radius:50%;border:7px solid #343434;background:repeating-radial-gradient(circle,#191919 0 8px,#0d0d0d 9px 16px);box-shadow:inset 0 0 22px #000,0 0 25px rgba(255,175,0,.22);position:relative}.dbr-speaker:after{content:"";position:absolute;inset:27%;border-radius:50%;background:radial-gradient(circle,#2a2a2a,#050505);border:2px solid rgba(255,213,106,.55)}.dbr-shell.playing .dbr-speaker{animation:pulseSpeaker .7s ease-in-out infinite alternate}@keyframes pulseSpeaker{to{transform:scale(1.025);box-shadow:inset 0 0 25px #000,0 0 38px rgba(255,175,0,.5)}}
.dbr-cover-wrap{position:relative;margin:auto;max-width:520px}.dbr-cover{width:100%;aspect-ratio:1;object-fit:contain;border-radius:16px;border:3px solid var(--gold);box-shadow:0 0 26px rgba(255,196,62,.85),0 0 70px rgba(255,150,0,.4);display:block;background:#111;touch-action:pan-y}.dbr-shell.playing .dbr-cover{animation:pulseCover 1.4s ease-in-out infinite alternate}@keyframes pulseCover{to{filter:brightness(1.08);transform:translateY(-2px)}}.dbr-station-badge{position:absolute;top:12px;left:12px;padding:8px 10px;border-radius:999px;background:rgba(0,0,0,.75);border:1px solid rgba(255,213,106,.8);color:var(--gold);font-size:12px;letter-spacing:.18em;text-transform:uppercase}
.dbr-controls{display:flex;align-items:center;justify-content:center;gap:16px;margin:20px 0 12px}.dbr-btn{appearance:none;border:1px solid rgba(255,213,106,.9);border-radius:999px;background:linear-gradient(#3b2702,#0a0700);color:var(--gold);font-size:24px;width:62px;height:50px;box-shadow:0 0 18px rgba(255,180,0,.36),inset 0 0 12px rgba(255,213,106,.18);cursor:pointer}.dbr-btn.play{width:76px;height:60px;font-size:30px}.dbr-btn:active{transform:scale(.96)}
.dbr-progress{max-width:780px;margin:0 auto;color:#ccc}.dbr-time{display:flex;justify-content:space-between;font-size:12px;letter-spacing:.08em}.dbr-bar{height:9px;border-radius:999px;background:#1c1c1c;border:1px solid rgba(255,213,106,.35);overflow:hidden;margin-top:6px}.dbr-fill{height:100%;width:0%;background:linear-gradient(90deg,#765000,#ffd56a,#ff9d00);box-shadow:0 0 15px var(--gold)}
.dbr-carousel{display:flex;gap:12px;overflow-x:auto;padding:18px 4px 4px;scroll-snap-type:x mandatory}.dbr-card{min-width:150px;scroll-snap-align:center;background:rgba(255,255,255,.05);border:1px solid rgba(255,213,106,.25);border-radius:14px;padding:8px;color:#fff;cursor:pointer;transition:.2s}.dbr-card.active{transform:translateY(-4px);border-color:var(--gold);box-shadow:0 0 22px rgba(255,196,62,.45)}.dbr-card img{width:100%;aspect-ratio:1;border-radius:10px;object-fit:cover;display:block}.dbr-card span{display:block;font-size:12px;text-align:center;margin-top:8px;color:#f8e3a1;font-weight:700}.dbr-footer{text-align:center;color:#b9a56d;font-size:12px;letter-spacing:.16em;text-transform:uppercase;padding:16px 4px 4px}.dbr-note{max-width:840px;margin:12px auto 0;text-align:center;color:#ddd;line-height:1.45;font-size:14px}.dbr-note strong{color:var(--gold)}
@media(max-width:820px){.dbr-shell{padding:16px;border-radius:22px}.dbr-boombox{grid-template-columns:1fr}.dbr-speaker{display:none}.dbr-card{min-width:128px}.dbr-controls{gap:10px}.dbr-btn{width:56px}.dbr-page{padding:10px}.dbr-title{letter-spacing:.03em}}


/* v1.1 audio + tuning + mobile swipe polish */
.dbr-status{min-height:20px;text-align:center;color:#f8e3a1;font-size:13px;letter-spacing:.14em;text-transform:uppercase;margin-top:8px;opacity:.9}
.dbr-shell.tuning:after{content:"";position:absolute;inset:0;z-index:5;pointer-events:none;background:repeating-linear-gradient(0deg,rgba(255,255,255,.04) 0 1px,transparent 1px 4px);mix-blend-mode:screen;animation:dbrStatic .16s steps(2,end) infinite;opacity:.35}
.dbr-shell.tuning .dbr-cover-wrap{animation:dbrTune .52s steps(3,end) infinite}
.dbr-shell.tuned .dbr-station-badge{box-shadow:0 0 18px rgba(255,213,106,.45)}
@keyframes dbrStatic{0%{transform:translateY(-1px)}100%{transform:translateY(1px)}}
@keyframes dbrTune{0%{filter:contrast(1.05) brightness(.9);transform:translateX(-1px)}50%{filter:contrast(1.25) brightness(1.1);transform:translateX(1px)}100%{filter:contrast(1.05) brightness(.95);transform:translateX(0)}}
.dbr-bar{cursor:pointer}.dbr-card{appearance:none;text-align:inherit}.dbr-card:focus,.dbr-btn:focus{outline:2px solid var(--gold);outline-offset:3px}
.dbr-cover-wrap:after{content:"Swipe albums";position:absolute;right:12px;bottom:12px;padding:6px 9px;border-radius:999px;background:rgba(0,0,0,.72);border:1px solid rgba(255,213,106,.45);color:#f8e3a1;font-size:10px;letter-spacing:.14em;text-transform:uppercase;opacity:.78}
@media(min-width:821px){.dbr-cover-wrap:after{display:none}}


/* v1.2 centering patch: prevents carousel selection from shifting the whole player left on iPad/tablet */
html,body{width:100%;max-width:100%;overflow-x:hidden!important;}
.dbr-page{width:100%;max-width:100vw;overflow-x:clip;}
.dbr-shell{max-width:calc(100vw - 28px);margin-left:auto;margin-right:auto;}
.dbr-boombox{width:100%;}
.dbr-cover-wrap{justify-self:center;width:100%;}
.dbr-carousel{max-width:100%;overscroll-behavior-x:contain;}

@media(max-width:1100px){
  .dbr-shell{padding:18px;}
  .dbr-boombox{grid-template-columns:120px minmax(280px,520px) 120px;gap:12px;justify-content:center;}
  .dbr-speaker{border-width:5px;}
}
@media(max-width:960px){
  .dbr-boombox{grid-template-columns:1fr;}
  .dbr-speaker{display:none;}
  .dbr-cover-wrap{max-width:min(520px,92vw);}
}
