/*
Theme Name: WJZZ Detroit Radio
Theme URI: https://wjzzdetroitradio.com
Author: WJZZ Detroit Radio
Description: Release "Grand River" (v1.3.2) — Vintage gold radio theme for WJZZ Detroit Jazz Radio, The World's Oldest Jazz Station, Est. 1959. Features live Radio.co streaming, animated arc tuner dial, vacuum tubes, Master Registry index, and responsive mobile-first layout.
Version: 1.3.2
Requires at least: 6.0
Tested up to: 6.9
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: wjzz
Tags: dark, gold, radio, music, entertainment, custom-menu, sticky-post
*/

/* ════════ RESET & TOKENS ════════ */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box;}
:root{
  --gold:#c8a050;--gold-lt:#e8d49a;--gold-dk:#8a6a20;--gold-deep:#3a2808;--gold-brass:#6b4e16;
  --bg:#080604;--bg2:#0e0c08;--bg3:#1a1408;--bg-housing:#241a0c;
  --green:#1a8a2a;--green-lt:#4adf6a;--red:#ff3020;
}
html{overflow-x:hidden;scroll-behavior:smooth;}
body{background:var(--bg);color:var(--gold);font-family:'Cinzel',serif;-webkit-font-smoothing:antialiased;padding-bottom:env(safe-area-inset-bottom);}
button{border:none;background:none;cursor:pointer;font-family:inherit;-webkit-tap-highlight-color:transparent;touch-action:manipulation;outline:none;}
a{text-decoration:none;color:inherit;}
img{max-width:100%;display:block;height:auto;}

/* ════════ HEADER — play button on top ════════ */
.hdr{
  position:sticky;top:0;z-index:200;
  background:rgba(8,6,4,.97);
  border-bottom:1.5px solid var(--gold-deep);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
}
/* TOP PLAY STRIP — the play button lives here now */
.play-strip{
  display:flex;align-items:center;justify-content:center;gap:14px;
  padding:10px 16px 8px;
  background:linear-gradient(180deg,#14100a,#0a0805);
  border-bottom:1px solid #1a1004;
}
.ps-ctl{width:34px;height:34px;border-radius:50%;border:1px solid var(--gold-brass);background:radial-gradient(circle at 38% 32%,#2a2010,#0e0c06);display:flex;align-items:center;justify-content:center;transition:all .2s;flex-shrink:0;}
.ps-ctl:hover{border-color:var(--gold);}
.ps-ctl svg{width:11px;height:11px;fill:var(--gold-dk);pointer-events:none;}
.play-top{
  width:58px;height:58px;border-radius:50%;flex-shrink:0;
  background:radial-gradient(circle at 38% 30%,var(--gold-lt),var(--gold) 50%,#7a5a18 95%);
  border:3px solid var(--gold-dk);
  display:flex;align-items:center;justify-content:center;
  transition:all .3s;
  box-shadow:0 6px 16px rgba(0,0,0,.6),0 0 22px rgba(200,160,80,.3),inset 0 2px 2px rgba(255,240,200,.5);
}
.play-top:hover{transform:scale(1.06);}
.play-top:active{transform:scale(.94);}
.play-top.playing{
  background:radial-gradient(circle at 38% 30%,#7adf8a,var(--green) 55%,#0a4a14 95%)!important;
  border-color:var(--green-lt)!important;
  box-shadow:0 0 30px rgba(74,223,106,.6),inset 0 2px 2px rgba(200,255,210,.4)!important;
  animation:gp 1.5s ease-in-out infinite;
}
@keyframes gp{0%,100%{box-shadow:0 0 18px rgba(74,223,106,.45);}50%{box-shadow:0 0 38px rgba(74,223,106,.85);}}
.play-top svg{width:22px;height:22px;pointer-events:none;}
.ps-status{display:flex;flex-direction:column;gap:2px;min-width:0;max-width:200px;}
.ps-state{font-size:7px;letter-spacing:2px;color:#5a4010;text-transform:uppercase;}
.ps-track{font-family:'IM Fell English',serif;font-style:italic;font-size:11px;color:#8a6a28;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
/* brand row below play strip */
.hdr-inner{
  max-width:1280px;margin:0 auto;
  display:flex;align-items:center;justify-content:space-between;
  padding:8px 16px;gap:10px;
}
.hdr-brand{display:flex;align-items:center;gap:10px;flex-shrink:0;}
.hdr-logo{width:36px;height:36px;border-radius:50%;border:1.5px solid var(--gold-dk);overflow:hidden;background:var(--bg3);flex-shrink:0;}
.hdr-logo img{width:100%;height:100%;object-fit:cover;}
.hdr-name{font-weight:600;font-size:12px;letter-spacing:2px;color:#d4a84a;white-space:nowrap;}
.hdr-right{display:flex;align-items:center;gap:8px;flex-shrink:0;}
.onair{
  display:flex;align-items:center;justify-content:center;
  background:linear-gradient(180deg,#1a0604,#0e0302);
  border:1.5px solid #4a1008;border-radius:14px;
  padding:4px 12px;position:relative;overflow:hidden;
}
.onair::before{content:'';position:absolute;inset:0;background:repeating-linear-gradient(90deg,transparent 0,transparent 2px,rgba(0,0,0,.35) 2px,rgba(0,0,0,.35) 3px);pointer-events:none;}
.onair-txt{font-size:8px;font-weight:900;letter-spacing:3px;color:var(--red);text-shadow:0 0 6px rgba(255,48,32,.9),0 0 16px rgba(255,48,32,.5);animation:nixie 3s ease-in-out infinite;}
@keyframes nixie{0%,100%{opacity:1;}93%{opacity:1;}94%{opacity:.5;}95%{opacity:1;}97%{opacity:.7;}98%{opacity:1;}}
.hdr-socials{display:none;gap:6px;}
.hdr-soc{width:26px;height:26px;border:1px solid var(--gold-deep);border-radius:50%;background:var(--bg);display:flex;align-items:center;justify-content:center;transition:all .2s;}
.hdr-soc:hover{border-color:var(--gold);}
.hdr-soc svg{width:11px;height:11px;fill:#5a4020;}
.mob-toggle{display:flex;flex-direction:column;gap:4px;padding:7px;border:1px solid var(--gold-deep);background:transparent;}
.mob-toggle span{display:block;width:20px;height:1.5px;background:var(--gold);pointer-events:none;}
.nav{display:none;border-top:1px solid #1a1004;}
.nav-inner{max-width:1280px;margin:0 auto;display:flex;justify-content:center;gap:2px;padding:6px 16px;flex-wrap:wrap;}
.nav-inner ul{display:flex;list-style:none;gap:2px;flex-wrap:wrap;justify-content:center;}
.nav-inner li{display:flex;align-items:center;}
.nav-inner li::before{content:'·';color:var(--gold-deep);font-size:13px;padding:0 4px;}
.nav-inner a{font-size:9px;font-weight:600;letter-spacing:3px;color:var(--gold-dk);text-transform:uppercase;padding:2px 10px;transition:color .2s;white-space:nowrap;}
.nav-inner a:hover{color:var(--gold-lt);}
.mob-nav{display:none;background:#0a0804;border-top:1px solid #1a1008;}
.mob-nav.open{display:block;}
.mob-nav ul{list-style:none;}
.mob-nav a{display:block;font-size:11px;letter-spacing:4px;color:#6a5028;padding:15px 24px;border-bottom:.5px solid #0e0a04;text-transform:uppercase;transition:all .2s;}
.mob-nav a:active,.mob-nav a:hover{color:var(--gold);background:#0e0a04;}

/* ════════ HERO ════════ */
.hero{
  position:relative;overflow:hidden;
  background:
    radial-gradient(ellipse at 50% -10%,rgba(200,160,80,.1),transparent 60%),
    linear-gradient(180deg,#0c0905,#080604);
  border-bottom:1.5px solid var(--gold-deep);
}
.hero::before{
  content:'';position:absolute;inset:0;
  background-image:linear-gradient(rgba(180,140,40,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(180,140,40,.04) 1px,transparent 1px);
  background-size:44px 44px;pointer-events:none;
}
.hero-inner{
  max-width:1280px;margin:0 auto;position:relative;
  display:flex;flex-direction:column;align-items:center;
  padding:28px 16px 24px;gap:14px;text-align:center;
}
.hero-sheet{display:flex;align-items:center;gap:10px;font-size:8px;letter-spacing:4px;color:var(--gold-dk);text-transform:uppercase;}
.hero-sheet::before,.hero-sheet::after{content:'';width:32px;height:1px;background:var(--gold-deep);}
.hero-wjzz{
  font-family:'Rye',serif;
  font-size:clamp(4.2rem,17vw,9rem);
  color:#6b4a08;line-height:.92;letter-spacing:4px;position:relative;
  text-shadow:
    -1px -1px 0 #f0d060,1px 0 0 #c8940c,0 1px 0 #b87c08,
    2px 2px 0 #8a5a06,3px 3px 0 #6a4204,4px 4px 0 #4a2c02,
    5px 5px 0 #2a1600,6px 6px 0 #180e00,7px 7px 3px rgba(0,0,0,.9),
    0 0 50px rgba(180,130,20,.2);
}
.hero-wjzz::before{content:'WJZZ';position:absolute;inset:0;color:transparent;-webkit-text-stroke:2.5px #d4a820;opacity:.55;pointer-events:none;}
.hero-tag{font-size:clamp(.65rem,2.6vw,1.05rem);font-weight:900;letter-spacing:clamp(3px,1.4vw,8px);color:var(--gold);text-transform:uppercase;}
.hero-status{display:flex;align-items:center;gap:12px;flex-wrap:wrap;justify-content:center;}
.hero-onair{display:flex;align-items:center;gap:6px;font-size:9px;font-weight:900;letter-spacing:3px;color:var(--red);}
.hero-onair::before{content:'';width:8px;height:8px;background:var(--red);border-radius:50%;animation:blink .8s infinite;box-shadow:0 0 8px rgba(255,48,32,.8);}
@keyframes blink{0%,100%{opacity:1}50%{opacity:.12}}
.hero-world{font-weight:600;font-size:11px;letter-spacing:1px;color:#d4a84a;}
.hero-cols{display:flex;flex-direction:column;align-items:center;gap:18px;width:100%;}
.hero-seal{flex-shrink:0;animation:sealGlow 4s ease-in-out infinite;}
@keyframes sealGlow{0%,100%{filter:drop-shadow(0 0 10px rgba(200,160,80,.22));}50%{filter:drop-shadow(0 0 26px rgba(200,160,80,.5));}}
.hero-np{
  width:100%;max-width:340px;
  background:linear-gradient(135deg,#1c1408,#0e0a04);
  border:1.5px solid var(--gold-brass);border-radius:10px;
  padding:12px;display:flex;gap:12px;align-items:center;text-align:left;
  box-shadow:inset 0 1px 0 rgba(232,212,154,.1),0 8px 24px rgba(0,0,0,.5);
}
.hero-np-art{width:74px;height:74px;flex-shrink:0;border-radius:6px;border:1.5px solid var(--gold-dk);background:linear-gradient(135deg,#2a2010,#0e0c06);overflow:hidden;display:flex;align-items:center;justify-content:center;font-size:26px;}
.hero-np-art img{width:100%;height:100%;object-fit:cover;}
.hero-np-info{min-width:0;flex:1;}
.hero-np-lbl{font-size:7px;letter-spacing:3px;color:var(--gold-brass);text-transform:uppercase;margin-bottom:4px;}
.hero-np-title{font-weight:900;font-size:14px;color:var(--gold-lt);line-height:1.25;text-transform:uppercase;letter-spacing:.5px;margin-bottom:3px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.hero-np-sub{font-family:'IM Fell English',serif;font-style:italic;font-size:11px;color:var(--gold-dk);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}

/* ════════ RADIO ════════ */
.radio{
  position:relative;overflow:hidden;
  background:linear-gradient(180deg,var(--bg-housing) 0%,#16100a 55%,#0c0806 100%);
  border-bottom:2px solid var(--gold-dk);
}
.radio::before{
  content:'';position:absolute;inset:0;
  background-image:
    repeating-linear-gradient(45deg,transparent 0,transparent 30px,rgba(200,160,80,.03) 30px,rgba(200,160,80,.03) 31px),
    repeating-linear-gradient(-45deg,transparent 0,transparent 30px,rgba(200,160,80,.03) 30px,rgba(200,160,80,.03) 31px);
  pointer-events:none;
}
.radio-inner{max-width:760px;margin:0 auto;position:relative;padding:18px 14px 0;}
.tube{position:absolute;width:24px;height:42px;border-radius:12px 12px 4px 4px;background:linear-gradient(180deg,rgba(255,180,80,.15),rgba(120,60,10,.25) 60%,rgba(30,15,5,.6));border:1px solid rgba(200,160,80,.25);z-index:1;}
.tube::after{content:'';position:absolute;left:50%;top:55%;transform:translateX(-50%);width:5px;height:13px;background:radial-gradient(ellipse,rgba(255,170,60,.95),rgba(255,120,20,.35) 60%,transparent);animation:tg 2.4s ease-in-out infinite;}
@keyframes tg{0%,100%{opacity:.65;}50%{opacity:1;}}
.tube-l1{left:12px;top:70px;}
.tube-l2{left:44px;top:80px;transform:scale(.85);}
.tube-r1{right:12px;top:70px;}
.tube-r2{right:44px;top:80px;transform:scale(.85);}
.arc-wrap{position:relative;z-index:2;display:flex;justify-content:center;}
#arc{display:block;max-width:100%;}
.wave-strip{position:relative;z-index:2;margin:4px auto 0;max-width:520px;border:1.5px solid var(--gold-brass);border-radius:22px;background:#0a0703;padding:6px 12px;box-shadow:inset 0 2px 8px rgba(0,0,0,.8),0 0 16px rgba(200,160,80,.1);}
#wave{display:block;width:100%;height:30px;}
.deck{position:relative;z-index:2;display:flex;align-items:flex-start;justify-content:center;gap:26px;padding:16px 0 18px;}
.knob-w{display:flex;flex-direction:column;align-items:center;gap:5px;}
.knob{
  width:52px;height:52px;border-radius:50%;
  background:radial-gradient(circle at 35% 28%,#8a6a30,#4a3414 45%,#1c1206 90%);
  border:2px solid var(--gold-brass);position:relative;cursor:ns-resize;
  box-shadow:0 6px 16px rgba(0,0,0,.7),inset 0 1px 1px rgba(232,212,154,.35);
}
.knob::before{content:'';position:absolute;inset:6px;border-radius:50%;background:radial-gradient(circle at 38% 30%,#6a5022,#2c1e0a);border:1px solid rgba(200,160,80,.2);}
.knob::after{content:'';position:absolute;top:8px;left:50%;transform:translateX(-50%);width:3px;height:10px;background:var(--gold-lt);border-radius:2px;z-index:2;}
.knob-lbl{font-size:8px;letter-spacing:3px;color:var(--gold-brass);text-transform:uppercase;}

/* ════════ RECENTLY PLAYED ════════ */
.history-section{max-width:1280px;margin:0 auto;padding:6px 16px 4px;}
.wjzz-history{list-style:none;display:grid;grid-template-columns:1fr;gap:6px;}
.wjzz-history li{
  display:flex;align-items:center;gap:12px;
  background:linear-gradient(135deg,#14100a,#0c0805);
  border:1px solid #1a1008;border-radius:7px;
  padding:10px 14px;transition:border-color .2s;
}
.wjzz-history li:hover{border-color:var(--gold-dk);}
.hist-num{
  width:22px;height:22px;flex-shrink:0;border-radius:50%;
  border:1px solid var(--gold-brass);
  display:flex;align-items:center;justify-content:center;
  font-family:'Rye',serif;font-size:9px;color:var(--gold-dk);
}
.hist-title{
  font-family:'IM Fell English',serif;font-style:italic;font-size:13px;color:#a8895a;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;
}
.wjzz-history li:first-child{border-color:var(--gold-dk);}
.wjzz-history li:first-child .hist-num{border-color:var(--gold);color:var(--gold);}
.wjzz-history li:first-child .hist-title{color:var(--gold-lt);}

/* ════════ REGISTRY ════════ */
.registry{max-width:1280px;margin:0 auto;padding:8px 16px 8px;}
.reg-hdr{display:flex;justify-content:center;padding:20px 0 18px;}
.reg-badge{
  border:1.5px solid var(--gold-dk);
  background:linear-gradient(180deg,#1a1408,#0c0804);
  padding:9px 26px;font-weight:900;font-size:13px;letter-spacing:3px;
  color:var(--gold-lt);text-transform:uppercase;position:relative;
}
.reg-badge::before,.reg-badge::after{content:'';position:absolute;top:50%;width:20px;height:1px;background:var(--gold-dk);}
.reg-badge::before{left:-26px;}
.reg-badge::after{right:-26px;}
.folders{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;}
.folder{
  position:relative;
  background:linear-gradient(180deg,#14100a,#0a0704);
  border:1.5px solid var(--gold-dk);border-radius:7px;
  padding:24px 12px 16px;
  display:flex;flex-direction:column;align-items:center;gap:8px;
  cursor:pointer;transition:all .25s;
}
.folder::before{content:'';position:absolute;inset:5px;border:1px solid rgba(200,160,80,.22);border-radius:4px;pointer-events:none;}
.folder::after{
  content:'67';position:absolute;top:-10px;left:50%;transform:translateX(-50%);
  width:22px;height:22px;border-radius:50%;
  background:radial-gradient(circle at 38% 30%,#3a2c10,#14100a);
  border:1.5px solid var(--gold-dk);
  font-family:'Rye',serif;font-size:9px;color:var(--gold);
  display:flex;align-items:center;justify-content:center;
}
.folder:hover{border-color:var(--gold);transform:translateY(-3px);box-shadow:0 10px 24px rgba(0,0,0,.5),0 0 18px rgba(200,160,80,.12);}
.folder svg{width:28px;height:28px;stroke:var(--gold);fill:none;stroke-width:1.4;opacity:.8;}
.folder-name{font-weight:900;font-size:12px;letter-spacing:2px;color:#d4a84a;text-transform:uppercase;text-align:center;}
.folder-sub{font-family:'IM Fell English',serif;font-style:italic;font-size:10px;color:rgba(200,160,80,.35);text-align:center;}

/* ════════ SHOWS ════════ */
.shows-section{max-width:1280px;margin:0 auto;padding:10px 16px;}
.sec-hdr{display:flex;align-items:center;justify-content:space-between;padding:16px 0 12px;}
.sec-title{font-family:'Rye',serif;font-size:18px;color:var(--gold);letter-spacing:2px;}
.sec-link{font-size:8px;letter-spacing:2px;color:var(--gold-dk);text-transform:uppercase;}
.shows{display:grid;grid-template-columns:1fr;gap:8px;}
.show{
  background:linear-gradient(135deg,#1a1408,#0e0c08);
  border:1px solid #1a1008;border-radius:8px;
  padding:13px 15px;display:flex;align-items:center;justify-content:space-between;
  transition:border-color .2s;
}
.show:hover{border-color:var(--gold-dk);}
.show-time{font-size:8px;letter-spacing:2px;color:var(--gold-dk);text-transform:uppercase;margin-bottom:4px;}
.show-name{font-family:'Rye',serif;font-size:14px;color:var(--gold-lt);margin-bottom:2px;}
.show-host{font-family:'IM Fell English',serif;font-style:italic;font-size:11px;color:rgba(200,160,80,.4);}
.show-arr{width:24px;height:24px;border:1px solid #1a1008;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.show-arr svg{width:9px;height:9px;stroke:var(--gold-dk);fill:none;stroke-width:2;}

/* ════════ LEGACY ════════ */
.legacy{max-width:1280px;margin:0 auto;padding:10px 16px 20px;}
.legacy-card{
  background:linear-gradient(135deg,#1a1408,#0e0c08);
  border:1.5px solid var(--gold-dk);border-radius:10px;
  padding:20px;position:relative;overflow:hidden;
}
.legacy-card::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,var(--gold),var(--gold-lt),var(--gold),transparent);}
.legacy-title{font-family:'Rye',serif;font-size:19px;color:var(--gold-lt);letter-spacing:1px;margin-bottom:6px;}
.legacy-sub{font-family:'IM Fell English',serif;font-style:italic;font-size:12px;color:#8a6a28;line-height:1.6;margin-bottom:12px;max-width:560px;}
.legacy-meta{display:flex;flex-direction:column;gap:5px;margin-bottom:14px;}
.legacy-row{display:flex;align-items:center;gap:7px;font-size:9px;color:#5a4020;letter-spacing:.5px;}
.legacy-row svg{width:10px;height:10px;stroke:var(--gold-dk);fill:none;stroke-width:1.8;flex-shrink:0;}
.legacy-cta{
  display:inline-flex;align-items:center;gap:6px;
  border:1px solid var(--gold-dk);border-radius:4px;
  padding:9px 20px;font-size:9px;letter-spacing:3px;
  color:var(--gold);text-transform:uppercase;
  background:linear-gradient(135deg,#2a2010,#1a1008);transition:all .2s;
}
.legacy-cta:hover{border-color:var(--gold);background:linear-gradient(135deg,#3a2c08,#2a1c08);}

/* ════════ POSTS (blog fallback) ════════ */
.wjzz-posts{max-width:880px;margin:0 auto;padding:24px 16px 40px;}
.wjzz-post{background:linear-gradient(135deg,#1a1408,#0e0c08);border:1px solid var(--gold-deep);border-radius:8px;padding:22px;margin-bottom:16px;}
.wjzz-post h2,.wjzz-post h1{font-family:'Rye',serif;color:var(--gold-lt);letter-spacing:1px;margin-bottom:10px;}
.wjzz-post h2 a:hover{color:var(--gold);}
.wjzz-post-meta{font-size:8px;letter-spacing:2px;color:var(--gold-dk);text-transform:uppercase;margin-bottom:12px;}
.wjzz-post-content{font-family:'IM Fell English',serif;font-size:14px;color:#a8895a;line-height:1.8;}
.wjzz-post-content p{margin-bottom:1em;}
.wjzz-post-content a{color:var(--gold);text-decoration:underline;}

/* ════════ FOOTER ════════ */
.footer{background:linear-gradient(180deg,#0e0c08,#060402);border-top:2.5px solid var(--gold-dk);position:relative;margin-bottom:64px;}
.footer::before{content:'';position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,var(--gold-deep),var(--gold),var(--gold-lt),var(--gold),var(--gold-deep));}
.footer-inner{max-width:1280px;margin:0 auto;padding:32px 16px 20px;}
.footer-grid{display:grid;grid-template-columns:1fr;gap:24px;padding-bottom:24px;border-bottom:1px solid #1a1008;}
.footer-logo{font-family:'Rye',serif;font-size:34px;color:var(--gold);letter-spacing:4px;margin-bottom:10px;text-shadow:2px 2px 0 var(--gold-deep),4px 4px 0 #1a0c02;}
.footer-tag{font-family:'IM Fell English',serif;font-style:italic;font-size:12px;color:#8a6a28;line-height:1.7;margin-bottom:12px;max-width:380px;}
.footer-meta{font-size:8px;color:#5a4010;letter-spacing:2px;text-transform:uppercase;}
.footer-col h4{font-size:10px;color:#d4a84a;letter-spacing:2px;margin-bottom:12px;text-transform:uppercase;}
.footer-links{list-style:none;}
.footer-links li{margin-bottom:8px;}
.footer-links a{font-family:'IM Fell English',serif;font-style:italic;font-size:12px;color:#6a5020;transition:color .2s;display:flex;align-items:center;gap:6px;}
.footer-links a::before{content:'›';color:var(--gold-dk);font-size:13px;}
.footer-links a:hover{color:var(--gold);}
.footer-bottom{display:flex;flex-direction:column;gap:8px;padding-top:18px;align-items:center;text-align:center;}
.footer-copy{font-size:8px;color:var(--gold-deep);letter-spacing:1px;line-height:1.6;}
.footer-quote{font-family:'Rye',serif;font-size:12px;color:#5a4020;letter-spacing:2px;}

/* ════════ STICKY PLAYER ════════ */
.pbar{
  position:fixed;bottom:0;left:0;right:0;z-index:300;
  background:rgba(8,6,4,.98);border-top:1.5px solid var(--gold-deep);
  backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
  padding-bottom:env(safe-area-inset-bottom);
}
.pbar-inner{max-width:1280px;margin:0 auto;display:flex;align-items:center;gap:10px;padding:9px 14px;}
.pbar-wm{font-family:'Rye',serif;font-size:14px;color:var(--gold);letter-spacing:1px;flex-shrink:0;}
.pbar-play{
  width:38px;height:38px;border-radius:50%;flex-shrink:0;
  background:radial-gradient(circle at 38% 30%,#e0c882,#a8843a);
  border:1.5px solid var(--gold-brass);
  display:flex;align-items:center;justify-content:center;transition:all .3s;
}
.pbar-play.playing{background:radial-gradient(circle at 38% 30%,#7adf8a,var(--green))!important;border-color:var(--green-lt)!important;box-shadow:0 0 14px rgba(74,223,106,.5);}
.pbar-play svg{width:14px;height:14px;pointer-events:none;}
.pbar-state{display:flex;flex-direction:column;gap:1px;min-width:0;flex:1;}
.pbar-stream{font-size:7px;letter-spacing:2px;color:#5a4010;text-transform:uppercase;}
.pbar-track{font-family:'IM Fell English',serif;font-style:italic;font-size:11px;color:#8a6a28;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.pbar-vol-w{display:none;align-items:center;gap:6px;flex-shrink:0;}
.pbar-vol-lbl{font-size:6px;letter-spacing:1px;color:var(--gold-deep);}
.pbar-vol{appearance:none;-webkit-appearance:none;width:84px;height:3px;background:#2a1c08;border-radius:2px;outline:none;}
.pbar-vol::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:14px;height:14px;border-radius:50%;background:radial-gradient(circle at 38% 30%,var(--gold-lt),#a8843a);border:1px solid var(--gold-brass);cursor:pointer;}
.pbar-vol::-moz-range-thumb{width:14px;height:14px;border-radius:50%;background:#c8a050;border:1px solid var(--gold-brass);cursor:pointer;}

/* ════════ RESPONSIVE ════════ */
@media(min-width:700px){
  .wjzz-history{grid-template-columns:1fr 1fr;}
  .play-strip{padding:12px 24px 10px;gap:18px;}
  .play-top{width:64px;height:64px;}
  .nav{display:block;}
  .mob-toggle{display:none;}
  .hdr-socials{display:flex;}
  .folders{grid-template-columns:repeat(3,1fr);gap:14px;}
  .shows{grid-template-columns:repeat(2,1fr);}
  .pbar-vol-w{display:flex;}
  .footer-grid{grid-template-columns:2fr 1fr 1fr 1fr;gap:32px;}
  .footer-bottom{flex-direction:row;justify-content:space-between;text-align:left;}
  .hero-cols{flex-direction:row;justify-content:center;gap:40px;}
  .hero-inner{padding:40px 24px 32px;}
}
@media(min-width:1024px){
  .folders{grid-template-columns:repeat(6,1fr);}
  .shows{grid-template-columns:repeat(3,1fr);}
}

/* ════════════════════════════════════════════
   MOBILE LEGIBILITY LAYER — v1.0.1
   Larger body text, higher contrast, looser
   spacing. Overrides sizes defined above.
   ════════════════════════════════════════════ */

/* base text contrast: brighten the muted browns */
:root{
  --txt-body:#c9ab78;       /* was #8a6a28 region — much brighter */
  --txt-muted:#a8895a;      /* readable muted */
  --txt-label:#b8965a;      /* labels */
}

/* ── Player strips ── */
.ps-state,.pbar-stream{font-size:10px;letter-spacing:2px;color:#9a7a3a;}
.ps-track,.pbar-track{font-size:14px;color:var(--txt-body);}
.ps-status{max-width:240px;}

/* ── Hero ── */
.hero-sheet{font-size:10px;letter-spacing:3px;color:var(--txt-label);}
.hero-tag{color:#d4b06a;}
.hero-onair{font-size:11px;}
.hero-world{font-size:13px;}
.hero-np-lbl{font-size:9px;color:#9a7a3a;}
.hero-np-title{font-size:16px;line-height:1.3;}
.hero-np-sub{font-size:13px;color:var(--txt-label);}
.hero-np-art{width:80px;height:80px;}
.hero-np{max-width:380px;padding:14px;}

/* ── Knob labels ── */
.knob-lbl{font-size:10px;color:#9a7a3a;}

/* ── Registry folders ── */
.reg-badge{font-size:14px;}
.folder-name{font-size:13px;}
.folder-sub{font-size:12px;color:#9a7a4a;}
.folder{padding:26px 14px 18px;gap:9px;}

/* ── Recently played ── */
.hist-title{font-size:15px;color:var(--txt-body);white-space:normal;line-height:1.45;}
.wjzz-history li{padding:12px 15px;gap:13px;}
.hist-num{width:26px;height:26px;font-size:11px;}
.wjzz-history li:first-child .hist-title{color:#ecd9a8;}

/* ── Shows ── */
.sec-title{font-size:20px;}
.sec-link{font-size:10px;color:#9a7a3a;}
.show-time{font-size:10px;color:#9a7a3a;}
.show-name{font-size:16px;}
.show-host{font-size:13px;color:var(--txt-label);}
.show{padding:15px 16px;}

/* ── Legacy ── */
.legacy-title{font-size:21px;}
.legacy-sub{font-size:15px;line-height:1.75;color:var(--txt-body);}
.legacy-row{font-size:12px;color:var(--txt-label);line-height:1.5;}
.legacy-row svg{width:13px;height:13px;}
.legacy-cta{font-size:11px;padding:11px 24px;}
.legacy-card{padding:22px;}

/* ── Blog/posts ── */
.wjzz-post-content{font-size:17px;line-height:1.85;color:var(--txt-body);}
.wjzz-post-meta{font-size:10px;color:#9a7a3a;}

/* ── Footer ── */
.footer-tag{font-size:14px;line-height:1.75;color:var(--txt-label);}
.footer-meta{font-size:10px;color:#8a6a30;}
.footer-col h4{font-size:11px;}
.footer-links a{font-size:14px;color:#9a7a4a;}
.footer-copy{font-size:10px;color:#7a5e28;line-height:1.7;}
.footer-quote{font-size:13px;color:#8a6a30;}

/* ── Mobile-only extra bumps (under 700px) ── */
@media(max-width:699px){
  /* iOS won't zoom-on-focus and text stays crisp */
  body{font-size:16px;-webkit-text-size-adjust:100%;}
  /* tap targets: min 44px */
  .ps-ctl{width:40px;height:40px;}
  .show-arr{width:30px;height:30px;}
  .hist-num{width:28px;height:28px;}
  /* roomier line lengths */
  .hero-np-title{font-size:17px;}
  .hist-title{font-size:16px;}
  .show-name{font-size:17px;}
  .legacy-sub{font-size:16px;}
  .footer-links a{font-size:15px;padding:3px 0;}
  .mob-nav a{font-size:13px;letter-spacing:3px;padding:17px 24px;color:#a8895a;}
  /* nudge tiny uppercase labels up */
  .show-time,.sec-link,.ps-state,.pbar-stream{font-size:11px;}
  .folder-name{font-size:14px;}
  .folder-sub{font-size:13px;}
  /* hero seal slightly smaller to give text room */
  .hero-seal svg{width:132px;height:132px;}
}

/* ── Seal artwork (v1.1.0 Bakers Lounge) ── */
.hero-seal-img{
  width:170px;height:auto;border-radius:50%;
  box-shadow:0 0 30px rgba(200,160,80,.25),0 8px 30px rgba(0,0,0,.6);
}
@media(max-width:699px){
  .hero-seal-img{width:140px;}
}
.hdr-logo{border:none;background:transparent;}

/* ════════════════════════════════════════════
   v1.2.0 "PARADISE VALLEY"
   Transport bar + Sanborn map hero
   ════════════════════════════════════════════ */

/* hide old play strip if cached markup lingers */
.play-strip{display:none;}

/* ── TRANSPORT BAR ── */
.tbar{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:9px 14px;
  background:linear-gradient(180deg,#14100a,#0a0805);
  border-bottom:1px solid #2a1c08;
  max-width:1400px;margin:0 auto;
}
.tbar-grp{display:flex;align-items:center;gap:8px;flex-shrink:0;}
.tbar-play{
  width:46px;height:46px;border-radius:50%;flex-shrink:0;
  background:radial-gradient(circle at 38% 30%,#e8d49a,#c8a050 50%,#7a5a18 95%);
  border:2px solid #8a6a20;
  display:flex;align-items:center;justify-content:center;
  transition:all .3s;
  box-shadow:0 4px 12px rgba(0,0,0,.5),0 0 16px rgba(200,160,80,.25),inset 0 1px 1px rgba(255,240,200,.5);
}
.tbar-play:hover{transform:scale(1.06);}
.tbar-play:active{transform:scale(.94);}
.tbar-play.playing{
  background:radial-gradient(circle at 38% 30%,#7adf8a,#1a8a2a 55%,#0a4a14 95%)!important;
  border-color:#4adf6a!important;
  box-shadow:0 0 24px rgba(74,223,106,.55)!important;
  animation:gp 1.5s ease-in-out infinite;
}
.tbar-play svg{width:17px;height:17px;pointer-events:none;}
.tbar-ctl{
  width:34px;height:34px;border-radius:50%;
  border:1px solid #6b4e16;color:#8a6a20;
  background:radial-gradient(circle at 38% 32%,#2a2010,#0e0c06);
  display:flex;align-items:center;justify-content:center;transition:all .2s;flex-shrink:0;
}
.tbar-ctl:hover{border-color:#c8a050;color:#c8a050;}
.tbar-ctl svg{width:12px;height:12px;pointer-events:none;}
.tbar-np{display:flex;align-items:center;gap:11px;flex:1;min-width:0;}
.tbar-art{
  width:44px;height:44px;flex-shrink:0;border-radius:5px;overflow:hidden;
  border:1.5px solid #6b4e16;background:#14100a;
}
.tbar-art img{width:100%;height:100%;object-fit:cover;}
.tbar-info{display:flex;flex-direction:column;gap:2px;min-width:0;max-width:300px;}
.tbar-lbl{font-size:8px;letter-spacing:3px;color:#9a7a3a;text-transform:uppercase;}
.tbar-title{font-family:'IM Fell English',serif;font-style:italic;font-size:14px;color:#e0c890;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.tbar-wave-w{flex:1;min-width:60px;max-width:340px;height:26px;overflow:hidden;}
#tbar-wave{display:block;width:100%;height:26px;}
.tbar-time{font-size:9px;letter-spacing:2px;color:#9a7a3a;flex-shrink:0;text-transform:uppercase;}
.tbar-live{display:flex;align-items:center;gap:6px;font-size:9px;font-weight:900;letter-spacing:3px;color:#c8a050;flex-shrink:0;}
.tbar-live-dot{width:7px;height:7px;border-radius:50%;background:#c8a050;animation:blink 1.4s infinite;box-shadow:0 0 8px rgba(200,160,80,.7);}

/* ── HERO SANBORN MAP LAYER ── */
.hero{position:relative;}
.hero-map{position:absolute;top:0;left:0;right:0;bottom:0;overflow:hidden;pointer-events:none;z-index:0;}
.hero-map svg{width:100%;height:100%;}
/* Media Library blueprint watermark */
.hero-map-img{
  position:absolute;top:0;left:0;width:100%;height:100%;
  object-fit:cover;object-position:center top;
  opacity:.9;filter:saturate(.92) brightness(.96);
}
.hero-map--img::after{
  background:
    radial-gradient(ellipse 130% 55% at 50% -8%, rgba(200,160,80,.06), transparent 55%),
    linear-gradient(180deg, rgba(8,6,4,.30) 0%, rgba(8,6,4,.52) 50%, rgba(8,6,4,.84) 100%);
}
.hero-map::after{
  content:'';position:absolute;inset:0;
  background:
    radial-gradient(ellipse 130% 55% at 50% -8%, rgba(200,160,80,.08), transparent 55%),
    linear-gradient(180deg, rgba(8,6,4,.18) 0%, rgba(8,6,4,.42) 50%, rgba(8,6,4,.78) 100%);
}
.hero-inner{position:relative;z-index:2;}
/* content card gets slight backdrop so map never fights text */
.hero-np{background:rgba(20,14,8,.86);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);}

/* ── WORLDWIDE DIVIDER ── */
.hero-divider{
  position:relative;z-index:2;
  display:flex;align-items:center;justify-content:center;gap:12px;
  padding:6px 24px 18px;
}
.hd-line{flex:1;max-width:240px;height:1px;background:linear-gradient(90deg,transparent,#6b4e16);}
.hd-line:last-child{background:linear-gradient(90deg,#6b4e16,transparent);}
.hd-txt{font-size:10px;font-weight:600;letter-spacing:4px;color:#9a7a3a;text-transform:uppercase;white-space:nowrap;}

/* ── responsive transport bar ── */
@media(max-width:699px){
  .tbar{flex-wrap:wrap;gap:8px;padding:8px 10px;}
  .tbar-np{order:3;width:100%;flex-basis:100%;}
  .tbar-wave-w{max-width:none;}
  .tbar-info{max-width:none;flex:1;}
  .tbar-time{display:none;}
  .tbar-play{width:50px;height:50px;}
  .hd-line{max-width:60px;}
  .hd-txt{font-size:8px;letter-spacing:2px;}
  .hero-map svg{transform:scale(1.8);transform-origin:30% 20%;}
  .hero-map-img{object-position:18% top;transform:scale(1.35);transform-origin:25% 30%;}
}

/* ════════════════════════════════════════════
   v1.2.1 "GRAND RIVER" — bolder mobile type
   IM Fell English has no true bold, so we use
   synthetic bold + slight stroke for weight.
   ════════════════════════════════════════════ */

/* track titles: heavier + brighter everywhere */
.tbar-title,.ps-track,.pbar-track{
  font-weight:700;
  -webkit-text-stroke:.3px #e0c890;
  color:#ecd9a8;
}
.hero-np-title{
  font-weight:900;
  color:#f2e2b4;
  -webkit-text-stroke:.2px #f2e2b4;
  font-size:17px;
}
.hero-np-sub{font-weight:700;color:#c9a868;-webkit-text-stroke:.2px #c9a868;}
.hero-np-lbl{font-weight:900;color:#b08a42;}

/* playlist titles */
.hist-title{
  font-weight:700;
  color:#e0c890;
  -webkit-text-stroke:.3px #d4b87e;
}
.wjzz-history li:first-child .hist-title{color:#f4e6bc;-webkit-text-stroke:.3px #f4e6bc;}
.hist-num{font-weight:900;color:#c8a050;border-color:#8a6a20;}

/* shows */
.show-name{-webkit-text-stroke:.3px #e8d49a;}
.show-host{font-weight:700;color:#b89460;}
.show-time{font-weight:900;color:#a8843a;}

/* legacy + general body */
.legacy-sub{font-weight:700;color:#d4b888;-webkit-text-stroke:.2px #c9ab78;}
.legacy-row{font-weight:700;color:#b08a4a;}
.sec-link{font-weight:900;color:#a8843a;}
.tbar-lbl{font-weight:900;color:#b08a42;}

/* footer */
.footer-tag{font-weight:700;color:#bb9866;}
.footer-links a{font-weight:700;color:#a8865a;}

/* mobile: extra weight + size */
@media(max-width:699px){
  .tbar-title{font-size:15px;}
  .hero-np-title{font-size:18px;line-height:1.3;}
  .hero-np-sub{font-size:13.5px;}
  .hist-title{font-size:16.5px;line-height:1.45;}
  .show-name{font-size:18px;}
  .show-host{font-size:13.5px;}
  .legacy-sub{font-size:16.5px;}
  .legacy-row{font-size:13px;}
  .hero-tag{font-weight:900;-webkit-text-stroke:.3px #d4b06a;}
  .footer-links a{font-size:15.5px;}
  .footer-tag{font-size:14.5px;}
  /* nav links bolder */
  .mob-nav a{font-weight:900;color:#bb9866;}
}

/* ════════════════════════════════════════════
   v1.2.2 "GRAND RIVER" PATCH 2 — MOBILE POLISH
   Touch targets ≥44px, micro-label legibility,
   dial declutter on narrow screens.
   ════════════════════════════════════════════ */

/* ── Touch targets (Apple HIG / Material: 44–48px min) ── */
.tbar-ctl{width:42px;height:42px;}
.tbar-ctl svg{width:14px;height:14px;}
.mob-toggle{padding:11px 10px;}            /* hamburger ≥44px hit area */
.mob-toggle span{width:22px;height:2px;}

/* ── Micro-label legibility floor (≈10px+, brighter golds) ── */
.tbar-lbl{font-size:10px;color:#b8965a;}
.tbar-live{font-size:10px;color:#d4b06a;}
.tbar-time{font-size:10px;}
.hero-np-lbl{font-size:10px;letter-spacing:2.5px;}
.footer-copy{font-size:11px;color:#8a6a30;}
.footer-meta{color:#9a7a3a;}
.knob-lbl{font-size:11px;letter-spacing:2.5px;}
.hero-sheet{font-size:11px;}

/* ── Mobile-specific (≤699px) ── */
@media(max-width:699px){
  /* volume knob: bigger grab surface for thumb drag */
  .knob{width:60px;height:60px;}
  /* transport controls keep 44px+ with wrap layout */
  .tbar-ctl{width:44px;height:44px;}
  .tbar-title{font-size:15.5px;}
  .tbar-lbl{font-size:10.5px;}
  /* track title gets full width row, allow 2 lines instead of clipping */
  .tbar-info{max-width:none;}
  /* legibility: hero tagline never below 11px */
  .hero-tag{font-size:clamp(.72rem,2.8vw,1.05rem);}
}

/* ── Very narrow (≤419px): declutter the dial ── */
@media(max-width:419px){
  .tube-l2,.tube-r2{display:none;}          /* inner tubes crowd the arc */
  .tube-l1{left:6px;top:84px;transform:scale(.85);}
  .tube-r1{right:6px;top:84px;transform:scale(.85);}
  .wave-strip{margin-left:10px;margin-right:10px;}
}

/* ════════════════════════════════════════════
   v1.3.0 "BAKER'S KEYBOARD" — ART DECK
   Photoreal radio face with live canvas dial,
   reactive needle and waveform glass.
   ════════════════════════════════════════════ */
.artdeck{
  position:relative;max-width:720px;margin:0 auto;
  border-radius:12px;overflow:hidden;
  box-shadow:0 18px 50px rgba(0,0,0,.65),0 0 40px rgba(200,160,80,.08);
}
.deck-art{width:100%;height:auto;display:block;}
#deck-dial{position:absolute;top:0;left:0;right:0;bottom:0;width:100%;height:100%;pointer-events:none;}
/* glass strip: 58→1198 x, 546→680 y on the 1254×1254 plate */
#deck-wave{
  position:absolute;left:6.5%;top:48.5%;width:88.5%;height:12.3%;
  pointer-events:none;
}
/* invisible volume control over the painted VOLUME knob */
.deck-volzone{
  position:absolute;left:6.0%;top:58.6%;width:17%;height:17%;
  cursor:ns-resize;border-radius:50%;
}
.deck-volzone:active{background:radial-gradient(circle,rgba(232,212,154,.07),transparent 70%);}
@media(max-width:699px){
  .radio-inner{padding:14px 8px 0;}
  .artdeck{border-radius:8px;}
}
