:root{
  --bg:#091216;--bg2:#13242b;--panel:#0c171bcc;--panel2:#122128ee;--text:#f5eee4;--muted:#cfc2b1;--accent:#c9a06a;--accent2:#8adea5;--line:#ffffff12;--ghost:#ffffff10;--ghostBorder:#ffffff18;--shadow:0 18px 55px rgba(0,0,0,.26);
  font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;min-height:100%;background:radial-gradient(circle at top left,var(--bg2),var(--bg));color:var(--text);overflow:hidden}
body.theme-bon{--bg:#071113;--bg2:#0c2427;--panel:#0d1c20e0;--panel2:#112126ef;--text:#f4eee4;--muted:#d1c4b5;--accent:#caa26c;--accent2:#8ae2a5}
body.theme-signature{--bg:#0e0a0d;--bg2:#241920;--panel:#181115e2;--panel2:#20161ce8;--text:#fbf6f0;--muted:#d9cfc5;--accent:#d7b67f;--accent2:#e7d4b0}
body.theme-fretta{--bg:#fff6ee;--bg2:#ffe1cf;--panel:#fffaf6f2;--panel2:#fff6eff6;--text:#23272a;--muted:#6d6058;--accent:#d42e12;--accent2:#f57513;--line:#00000010;--ghost:#ffffffd8;--ghostBorder:#00000014}
.page-shell{height:100vh;padding:12px;display:flex;align-items:center;justify-content:center;overflow:hidden}
.hidden{display:none!important}
.selector-card,.brand-panel{width:min(1120px,100%);max-height:calc(100vh - 24px);border:1px solid var(--line);border-radius:24px;background:linear-gradient(180deg,var(--panel),var(--panel2));box-shadow:var(--shadow);overflow:hidden}
.selector-card{padding:22px}.brand-panel{padding:18px 20px}
.eyebrow{margin:0 0 6px;font-size:12px;font-weight:900;letter-spacing:.22em;text-transform:uppercase;color:var(--accent)}
h1{margin:0;font-size:34px;line-height:1.02}.selector-text,.brand-description{margin:10px 0 0;color:var(--muted);font-size:16px;line-height:1.38;max-width:520px}
.brand-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:18px}.brand-choice{padding:18px;border-radius:20px;border:1px solid var(--line);background:rgba(255,255,255,.03);text-align:left;color:inherit;cursor:pointer;transition:.18s transform,.18s border-color,.18s box-shadow}.brand-choice:hover{transform:translateY(-2px);border-color:color-mix(in srgb,var(--accent) 55%, transparent);box-shadow:0 10px 24px rgba(0,0,0,.12)}
.brand-choice-logo{font-size:26px;font-weight:900;line-height:1.08;margin-bottom:18px}.signature .brand-choice-logo{font-size:21px}.fretta .brand-choice-logo{font-size:28px;color:#d42e12}.brand-choice-title{font-size:20px;font-weight:900;margin-bottom:5px}.brand-choice-sub{font-size:13px;color:var(--muted)}
.topbar{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;margin-bottom:12px}.hero-block{display:flex;gap:16px;align-items:flex-start;min-width:0}.hero-logo{min-width:150px;font-size:54px;font-weight:900;line-height:.86;letter-spacing:-.04em}.hero-logo.signature{font-size:34px;line-height:.96}.hero-logo.fretta{font-size:50px;letter-spacing:.02em;color:#d42e12}.hero-copy{padding-top:2px}.brand-description{font-size:16px;max-width:440px}.top-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end;max-width:260px}.live-pill{display:inline-flex;align-items:center;gap:8px;margin-top:10px;padding:7px 12px;border-radius:999px;background:rgba(125,211,155,.12);color:var(--accent2);font-size:13px;font-weight:800}.live-dot{width:9px;height:9px;border-radius:50%;background:currentColor}body.theme-fretta .live-pill{background:#fff0e8;color:#c23016}
.player-card{display:grid;grid-template-columns:minmax(0,1fr) 220px;gap:18px;align-items:center;border:1px solid var(--line);border-radius:22px;background:rgba(255,255,255,.025);padding:18px}.player-main{min-width:0}.meta{font-size:11px;font-weight:900;letter-spacing:.18em;text-transform:uppercase;color:var(--accent);margin-bottom:10px}h2{margin:0 0 12px;font-size:28px;line-height:1.06;word-break:break-word;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.time-row{display:flex;gap:7px;align-items:center;font-size:18px;font-weight:900;color:var(--accent);margin-bottom:10px}.progress{height:10px;border-radius:999px;background:rgba(255,255,255,.08);overflow:hidden}.progress-bar{height:100%;width:0;background:linear-gradient(90deg,var(--accent),color-mix(in srgb,var(--accent) 60%, white));border-radius:inherit}body.theme-fretta .progress{background:#00000010}
.info-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:14px}.info-item{min-width:0}.info-item.wide{grid-column:span 2}.label{display:block;margin-bottom:5px;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}.info-grid strong{display:block;font-size:15px;line-height:1.34;word-break:break-word}.cta-row{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px}.primary-btn,.ghost-btn{display:inline-flex;align-items:center;justify-content:center;min-height:40px;padding:0 15px;border-radius:13px;border:1px solid var(--ghostBorder);text-decoration:none;color:inherit;background:var(--ghost);font-size:14px;font-weight:800;cursor:pointer}.primary-btn{background:var(--accent);border-color:transparent;color:#18130f}.ghost-btn.compact{min-height:38px;padding:0 14px}body.theme-fretta .primary-btn{color:#fff}
.player-aside{display:flex;align-items:center;justify-content:center;border-left:1px solid var(--line);padding-left:6px;min-height:100%}.radio-visual{width:160px;height:160px;display:flex;align-items:center;justify-content:center}.radio-disc{width:136px;height:136px;border-radius:50%;position:relative;box-shadow:0 0 0 1px var(--line),0 14px 28px rgba(0,0,0,.24);animation:spin 13s linear infinite;background:repeating-radial-gradient(circle at center,#0b1518 0 5px,#112126 6px 9px,#0b1518 10px 13px)}.radio-disc::before{content:"";position:absolute;inset:20px;border-radius:50%;border:1px solid rgba(255,255,255,.07);box-shadow:inset 0 0 0 10px rgba(255,255,255,.03)}.disc-center{position:absolute;inset:50%;transform:translate(-50%,-50%);width:56px;height:56px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--accent);color:#17120e;font-size:14px;font-weight:900;letter-spacing:.08em;box-shadow:0 0 0 8px rgba(255,255,255,.03),0 0 0 10px rgba(255,255,255,.04)}
body.theme-signature .radio-disc{width:132px;height:132px;animation-duration:20s;background:repeating-radial-gradient(circle at center,#0b090a 0 4px,#1b1418 5px 8px,#0b090a 9px 12px);box-shadow:0 0 0 1px rgba(215,182,127,.20),0 14px 32px rgba(0,0,0,.32)}body.theme-signature .disc-center{width:74px;height:74px;background:radial-gradient(circle at 38% 32%,#f4dfb7 0%,#ddc08a 58%,#a77c49 100%);font-size:9px;letter-spacing:.065em;white-space:nowrap;box-shadow:0 0 0 8px rgba(215,182,127,.09),0 0 0 10px rgba(255,255,255,.035)}
body.theme-fretta .radio-disc{width:136px;height:136px;animation-duration:8.5s;background:conic-gradient(from 10deg,#d42e12 0 18%,#f57513 18% 33%,#24272a 33% 51%,#d42e12 51% 69%,#f57513 69% 84%,#24272a 84% 100%);box-shadow:0 0 0 1px rgba(212,46,18,.18),0 14px 28px rgba(212,46,18,.14)}body.theme-fretta .radio-disc::before{inset:16px;background:#fff7f0;border-color:rgba(0,0,0,.05);box-shadow:none}body.theme-fretta .disc-center{width:68px;height:68px;background:#d42e12;color:#fff;font-size:13px;box-shadow:0 0 0 7px rgba(245,117,19,.15)}
@keyframes spin{to{transform:rotate(360deg)}}
@media (max-width: 980px){html,body{overflow:auto}.page-shell{height:auto;min-height:100vh;padding:12px;overflow:visible}.selector-card,.brand-panel{max-height:none}.brand-grid{grid-template-columns:1fr}.topbar{flex-direction:column}.top-actions{max-width:none;justify-content:flex-start}.player-card{grid-template-columns:1fr 200px}.hero-logo{min-width:130px;font-size:48px}.hero-logo.signature{font-size:31px}.hero-logo.fretta{font-size:44px}.info-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.info-item.wide{grid-column:1 / -1}}
@media (max-width: 760px){.selector-card,.brand-panel{padding:16px;border-radius:20px}.hero-block{flex-direction:column;gap:10px}.hero-logo{min-width:0;font-size:46px}.hero-logo.signature{font-size:30px}.hero-logo.fretta{font-size:40px}.player-card{grid-template-columns:1fr;gap:14px}.player-aside{border-left:none;border-top:1px solid var(--line);padding-left:0;padding-top:14px}.radio-visual{width:142px;height:142px}.radio-disc,body.theme-signature .radio-disc,body.theme-fretta .radio-disc{width:120px;height:120px}.disc-center{width:50px;height:50px;font-size:13px}body.theme-fretta .disc-center{width:62px;height:62px}.cta-row,.top-actions{flex-direction:column}.primary-btn,.ghost-btn{width:100%}.info-grid{grid-template-columns:1fr}.info-item.wide{grid-column:auto}h1{font-size:30px}h2{font-size:24px}.brand-description,.selector-text{font-size:15px}.time-row{font-size:18px}.page-shell{align-items:flex-start}}

#publicAudio{display:none}.primary-btn.is-playing{background:transparent;color:var(--accent);border-color:color-mix(in srgb,var(--accent) 65%, transparent)}.primary-btn.is-loading{opacity:.75;cursor:wait}

/* V5.4.2 — Afsona only. BON / Signature / Fretta rules above are untouched. */
body.theme-afsona{
  --bg:#17080c;
  --bg2:#5b1c28;
  --panel:#3a1119e8;
  --panel2:#2b0d14f2;
  --text:#fff2e9;
  --muted:#e5c8bb;
  --accent:#e5a58c;
  --accent2:#f6d2bd;
  --line:rgba(255,226,211,.12);
  --ghost:rgba(255,255,255,.06);
  --ghostBorder:rgba(255,226,211,.16);
  background:
    radial-gradient(circle at 15% 15%,rgba(222,126,97,.18),transparent 28%),
    radial-gradient(circle at 88% 14%,rgba(244,190,162,.10),transparent 24%),
    linear-gradient(180deg,#3d1019 0%,#21080e 100%);
}
body.theme-afsona .brand-panel{
  position:relative;
  background:
    radial-gradient(circle at 82% 52%,rgba(255,220,199,.055),transparent 26%),
    linear-gradient(180deg,var(--panel),var(--panel2));
}
/* National ornamental texture, deliberately non-interactive. */
body.theme-afsona .brand-panel::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  opacity:.19;
  background-image:
    repeating-conic-gradient(from 45deg at 50% 50%,rgba(244,193,167,.16) 0 5deg,transparent 5deg 18deg),
    radial-gradient(circle at center,transparent 0 31px,rgba(244,193,167,.10) 32px 33px,transparent 34px 62px,rgba(244,193,167,.07) 63px 64px,transparent 65px);
  background-size:150px 150px,150px 150px;
  -webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 14%,#000 86%,transparent 100%);
  mask-image:linear-gradient(90deg,transparent 0%,#000 14%,#000 86%,transparent 100%);
}
body.theme-afsona .brand-panel>*{position:relative;z-index:1}
body.theme-afsona .hero-logo.afsona{min-width:180px;display:flex;align-items:center}
body.theme-afsona .hero-logo.afsona img{display:block;width:170px;height:auto;max-height:82px;object-fit:contain;border-radius:2px}
body.theme-afsona #brandTitle{font-family:Georgia,"Times New Roman",serif;font-weight:500;font-size:42px;letter-spacing:-.02em}
body.theme-afsona .brand-description{max-width:500px}
body.theme-afsona .live-pill{background:rgba(229,165,140,.12);color:#f6d2bd;border:1px solid rgba(246,210,189,.10)}
body.theme-afsona .player-card{
  background:
    linear-gradient(rgba(64,18,26,.76),rgba(48,13,20,.76)),
    repeating-linear-gradient(135deg,rgba(244,193,167,.035) 0 1px,transparent 1px 14px);
  border-color:rgba(244,193,167,.14);
}
body.theme-afsona .meta,
body.theme-afsona .time-row{color:#efb69e}
body.theme-afsona .progress{background:rgba(255,255,255,.08)}
body.theme-afsona .progress-bar{background:linear-gradient(90deg,#f3c4ad,#c66b66)}
body.theme-afsona .primary-btn{background:#e6ad91;color:#45121b}
body.theme-afsona .primary-btn.is-playing{background:transparent;color:#f3c4ad;border-color:rgba(243,196,173,.45)}
body.theme-afsona .radio-visual{width:176px;height:176px;position:relative}
body.theme-afsona .radio-visual::before,
body.theme-afsona .radio-visual::after{
  content:"";
  position:absolute;
  left:50%;top:50%;
  transform:translate(-50%,-50%);
  border-radius:50%;
  pointer-events:none;
}
body.theme-afsona .radio-visual::before{width:164px;height:164px;border:1px dashed rgba(242,193,166,.24)}
body.theme-afsona .radio-visual::after{width:150px;height:150px;border:1px solid rgba(242,193,166,.11)}
body.theme-afsona .radio-disc{
  width:136px;
  height:136px;
  animation-duration:16s;
  background:
    radial-gradient(circle at center,transparent 0 29%,rgba(255,226,211,.07) 30% 31%,transparent 32% 48%,rgba(255,226,211,.055) 49% 50%,transparent 51%),
    conic-gradient(from 0deg,#742234 0 10%,#d28a72 10% 18%,#5c1827 18% 29%,#9a3c4b 29% 38%,#e0a187 38% 47%,#692033 47% 58%,#b9595c 58% 67%,#e2a087 67% 75%,#702031 75% 87%,#be6462 87% 100%);
  box-shadow:0 0 0 1px rgba(244,193,167,.20),0 14px 32px rgba(0,0,0,.30);
}
body.theme-afsona .radio-disc::before{
  inset:14px;
  background:
    repeating-conic-gradient(from 22.5deg,rgba(255,232,218,.07) 0 8deg,transparent 8deg 22deg),
    rgba(78,18,29,.42);
  border-color:rgba(244,193,167,.14);
  box-shadow:inset 0 0 0 8px rgba(255,255,255,.025);
}
body.theme-afsona .disc-center{
  width:72px;
  height:72px;
  background:linear-gradient(180deg,#f0c4ae,#dea087);
  color:#571824;
  font-size:10px;
  letter-spacing:.13em;
  box-shadow:0 0 0 7px rgba(96,24,38,.40),0 0 0 9px rgba(244,193,167,.16);
}
.afsona-choice-logo img{display:block;width:120px;max-height:54px;object-fit:contain}
.brand-choice.afsona{background:linear-gradient(145deg,rgba(92,28,40,.40),rgba(49,13,20,.28))}

@media (min-width:981px){.brand-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (max-width:760px){body.theme-afsona .hero-logo.afsona{min-width:0}body.theme-afsona .hero-logo.afsona img{width:150px}body.theme-afsona #brandTitle{font-size:34px}body.theme-afsona .radio-visual{width:150px;height:150px}body.theme-afsona .radio-visual::before{width:142px;height:142px}body.theme-afsona .radio-visual::after{width:132px;height:132px}}
