/* V30 / Radio Universe
   A concert-poster entry, a working radio deck, distinct show sleeves and a culture zine.
   Original logos, photos, motion files, and the functional schedule remain untouched. */
.playground-site{--v30-night:#101015;--v30-red:#eb1d2d;--v30-paper:#f8f2e7;--v30-sun:#f4d54e}
.playground-site a:focus-visible,.playground-site button:focus-visible{outline:3px solid #2556e8;outline-offset:4px}

/* The opening fold: a live campaign cover, not a corporate blog header. */
.playground-site .culture-hero{position:relative;isolation:isolate;color:#fff;padding-top:24px;padding-bottom:34px}
.playground-site .culture-hero:before{content:"";position:absolute;z-index:-1;inset:0 calc(50% - 50vw);background:radial-gradient(ellipse 44% 65% at 82% 43%,#61152555,transparent 88%),repeating-linear-gradient(0deg,#ffffff05 0 1px,transparent 1px 38px),linear-gradient(125deg,#0b0c12,#1e121b 67%,#250e15)}
.playground-site .culture-hero:after{content:"1056";position:absolute;z-index:-1;left:27%;top:24%;color:#fff;opacity:.025;pointer-events:none;font:900 clamp(180px,35vw,500px)/1 var(--heading);letter-spacing:-.11em;transform:rotate(-13deg)}
.playground-site .culture-kicker{border-color:#ffffff6a;color:#efeeeb;font-weight:750}
.playground-site .culture-kicker .eyebrow{color:#efeeeb}
.playground-site .culture-hero-board{gap:clamp(20px,3.3vw,56px);padding:30px 0 23px}
.playground-site .pg-overline{color:var(--v30-sun);letter-spacing:.14em}
.playground-site .pg-overline>span{color:var(--v30-red)}
.playground-site .culture-hero h1{color:#fff;filter:none;text-shadow:4px 5px 0 #0006}
.playground-site .culture-hero h1 .culture-red-word{color:#ff3342}
.playground-site .culture-hero .culture-red-word:after{background:var(--v30-sun)}
.playground-site .culture-hero-intro{max-width:415px;color:#e6e3df;font-size:clamp(13px,1.1vw,16px)}
.playground-site .culture-hero-intro strong{color:#fff}
.playground-site .culture-hero-actions{margin-top:21px}
.playground-site .culture-primary{background:var(--v30-red);border:2px solid #fff;box-shadow:5px 5px 0 var(--v30-sun);font-weight:800}
.playground-site .culture-primary:hover{background:#fff;color:var(--v30-night);border-color:var(--v30-night)}
.playground-site .culture-hero-actions>a{color:#fff;border-color:#bdb4b4}
.playground-site .culture-hero-actions>a:hover{color:var(--v30-sun)}
.playground-site .pg-hero-scribble{color:var(--v30-sun);top:7px}
.playground-site .culture-photo-wrap{border:4px solid #fff;box-shadow:12px 13px 0 var(--v30-red);background:#221b1d}
.playground-site .culture-photo-wrap>img{filter:saturate(1.06) contrast(1.045)}
.playground-site .culture-hero-visual:before{background:#c7152d}
.playground-site .culture-frequency{background:var(--v30-sun);color:var(--v30-night);box-shadow:5px 5px 0 var(--v30-red)}
.playground-site .pg-photo-sticker{background:var(--v30-red);color:#fff;border-color:#fff;box-shadow:5px 5px 0 var(--v30-night)}
.playground-site .pg-photo-sticker b{color:var(--v30-sun)}
.playground-site .culture-hero-visual figcaption{color:#fff}
.playground-site .culture-hero-visual figcaption small{color:#bab9c0}
.playground-site .culture-record{border:2px solid #fff;box-shadow:6px 7px 0 var(--v30-sun)}
.playground-site .culture-record>.play-icon{background:var(--v30-red)}
.v30-live-chip{display:flex;align-items:center;gap:13px;width:min(100%,375px);margin-top:21px;padding:10px 12px;border:1px solid #aaa4a4;background:#ffffff0c;color:#fff;text-decoration:none;transition:background .18s,translate .18s}
.v30-live-chip:hover{background:#ffffff1c;translate:0 -3px}
.v30-live-led{position:relative;flex:0 0 13px;width:13px;height:13px;background:var(--v30-red);border:2px solid #fff;border-radius:50%;box-shadow:0 0 0 4px #f12c4937}
.v30-live-chip>span:nth-child(2){display:flex;flex-direction:column;gap:4px;min-width:0}
.v30-live-chip small{font:800 9px/1.2 var(--body);letter-spacing:.14em;color:var(--v30-sun)}
.v30-live-chip strong{font:900 clamp(15px,1.7vw,20px)/1 var(--heading);text-transform:uppercase;letter-spacing:-.02em;overflow-wrap:anywhere}
.v30-live-chip b{margin-left:auto;color:var(--v30-sun);font:800 24px/1 var(--body)}

/* Four touchpoints from the Company Profile. A navigable station map. */
.playground-site .v30-world-nav{position:relative;z-index:2;transform:none;margin-top:20px;padding:0;background:var(--v30-paper);color:var(--v30-night);border:2px solid #fff;box-shadow:6px 6px 0 var(--v30-red)}
.playground-site .v30-world-nav>span{padding:14px 17px;color:#3f3841;font-size:9px;line-height:1.4;letter-spacing:.1em}
.playground-site .v30-world-nav>div{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));flex:1;gap:0;border-left:1px solid #17151b}
.playground-site .v30-world-nav a{display:flex;justify-content:center;align-items:center;gap:8px;min-height:64px;padding:12px 10px;color:var(--v30-night);font:900 12px/1.3 var(--body);border-left:1px solid #211e22;white-space:nowrap}
.playground-site .v30-world-nav a:first-child{border-left:0}
.playground-site .v30-world-nav a:hover{background:var(--v30-sun)}
.playground-site .v30-world-nav a small{font:800 9px/1 var(--body);color:var(--v30-red)}
.playground-site .v30-world-nav a b{color:var(--v30-red);margin-left:auto}

/* The live panel should read like an actual listening console. */
.playground-site .on-air-hub{position:relative;z-index:2;margin-top:46px;margin-bottom:56px;border:2px solid var(--v30-night);transform:none;box-shadow:10px 10px 0 var(--v30-red)}
.playground-site .hub-top{background:#19171d}
.playground-site .hub-top #hub-schedule-label:before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:#fa3a4c;margin-right:8px;box-shadow:0 0 0 3px #fa3a4c39}
.playground-site .hub-art{background:linear-gradient(135deg,#b71226,#f33543);border-right:3px solid var(--v30-sun)}
.playground-site .hub-copy h2{font-size:clamp(42px,5.2vw,78px)}
.playground-site .hub-copy .pg-hub-micro{background:var(--v30-sun)}
.playground-site .hub-actions .ed-button{font-weight:850}
.playground-site.is-playing .hub-top #hub-schedule-label:before,.playground-site.is-playing .v30-live-led{animation:v30-heartbeat 1.6s ease-in-out infinite}
@keyframes v30-heartbeat{50%{box-shadow:0 0 0 9px #fa3a4c11}}

/* Program sleeves: real supplied logo art first, each mood has its own stage. */
.playground-site .program-section{background:#ede8dc;background-image:radial-gradient(#17161b0a 1px,transparent 1px);background-size:24px 24px;border-block:7px solid var(--v30-night)}
.playground-site .program-heading h2{max-width:900px;line-height:.88}
.playground-site .program-heading>p{max-width:345px;color:#3b3840;font-weight:550}
.v30-program-ledger{display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap;margin:28px 0 -10px;padding:13px 0;border-top:2px solid var(--v30-night);border-bottom:2px solid var(--v30-night);font:800 10px/1.4 var(--body);letter-spacing:.095em}
.v30-program-ledger strong{font-size:12px;color:#bb162a}
.v30-program-ledger>span:last-child{color:#63555e}
.playground-site .program-list{padding-top:30px;padding-bottom:35px}
.playground-site .program-item{overflow:visible;border:3px solid var(--v30-night);box-shadow:8px 9px 0 var(--v30-night);background-image:linear-gradient(125deg,#ffffff09,transparent 58%)}
.playground-site .program-item .program-summary{min-height:365px;padding:25px 22px 23px}
.playground-site .program-item .program-summary:before{font-size:9px;opacity:.2}
.playground-site .program-item .program-top{position:relative;z-index:2;border-bottom:1px solid currentColor;padding-bottom:11px}
.playground-site .program-item .program-time{font-size:14px;font-weight:900}
.playground-site .program-name{margin-top:16px;margin-bottom:8px}
.playground-site .program-name .program-art-shell{aspect-ratio:16/9;max-height:200px;border:0;padding:9px;min-height:145px}
.playground-site .program-name .program-art-shell:before{inset:6px;border-style:solid;opacity:.14}
.playground-site .program-name .program-art-shell:after{font-size:66px;bottom:0}
.playground-site .program-item .program-name-label{font-size:clamp(46px,5vw,76px)}
.v30-program-vibe{display:flex;align-items:center;gap:7px;align-self:flex-start;margin:0 0 12px;max-width:100%;padding:7px 9px;background:var(--v30-night);color:#fff;font:800 9px/1.3 var(--body);letter-spacing:.07em;word-break:normal}
.v30-program-vibe>span{color:var(--v30-sun);font-size:15px}
.playground-site .program-item[data-program="cuma-suara"]{background:#172339;color:#ffeed1}
.playground-site .program-item[data-program="pegi-pagi"]{background:#f8d85b;color:#281319}
.playground-site .program-item[data-program="keburu-siang"]{background:#c4e0f4;color:#171c28}
.playground-site .program-item[data-program="ganti-giliran"]{background:#ebd9fe;color:#3b174b}
.playground-site .program-item[data-program="baru-balique"]{background:#d2e1d8;color:#1b2d28}
.playground-site .program-item[data-program="kemaleman"]{background:#3f1535;color:#fff0e7}
.playground-site .program-item[data-program="diserang-cinta"]{background:#ffa7c2;color:#4a092d;border-color:#4a092d}
.playground-site .program-item[data-program="diserang-cinta"] .v30-program-vibe{background:#a10e51;color:#fff}
.playground-site .program-item[data-program="pegi-pagi"] .v30-program-vibe{background:#a92123}
.playground-site .program-item[data-program="kemaleman"] .v30-program-vibe{background:#ffb0ce;color:#3f1535}
.playground-site .program-item.is-current{outline:3px solid var(--v30-red);outline-offset:6px;box-shadow:10px 13px 0 var(--v30-sun)}
.playground-site .program-item:hover,.playground-site .program-item:focus-within,.playground-site .program-item.expanded{box-shadow:11px 13px 0 var(--v30-red)}
.playground-site .program-bottom{font-weight:850}

/* An editorial zine, with collage rhythm rather than uniform blog cards. */
.playground-site .culture-stories{background:#f8f2e7;background-image:repeating-linear-gradient(90deg,#c8bdb011 0 1px,transparent 1px 52px)}
.v30-zine-masthead{position:relative;display:block;border-top:6px solid var(--v30-night);border-bottom:6px solid var(--v30-night);padding:21px 25px 26px;margin:0 0 22px;background:#fff9ee;box-shadow:8px 9px 0 #251b24}
.v30-zine-label{display:inline-block;margin-bottom:14px;padding:8px 12px;background:var(--v30-red);color:#fff;font:900 10px/1.2 var(--body);letter-spacing:.12em;transform:rotate(-3deg)}
.playground-site .v30-zine-masthead .warga-heading{position:relative;z-index:1}
.playground-site .v30-zine-masthead .warga-heading h2{font-size:clamp(68px,8.3vw,122px);letter-spacing:-.048em}
.playground-site .v30-zine-masthead .warga-heading>p{max-width:350px}
.v30-zine-seal{position:absolute;right:28px;top:14px;display:grid;place-items:center;width:116px;height:116px;border:3px solid var(--v30-night);border-radius:50%;background:var(--v30-sun);box-shadow:4px 4px 0 var(--v30-red);color:var(--v30-night);font:900 14px/1 var(--heading);text-align:center;transform:rotate(14deg)}
.playground-site .pg-wall-toolbar{border-top:0;margin-top:34px}
.playground-site .rubrics{gap:22px}
.playground-site .rubric{box-shadow:8px 9px 0 #18161b}
.playground-site .rubric:hover,.playground-site .rubric:focus-visible{box-shadow:12px 13px 0 var(--v30-red)}
.playground-site .ed-grid .ed-story-card{position:relative;overflow:hidden;border:3px solid var(--v30-night);padding:0 24px 20px;background:#fffdf5;box-shadow:7px 8px 0 var(--v30-night);transform:rotate(-.8deg);gap:12px}
.playground-site .ed-grid .ed-story-card:nth-child(even){transform:translateY(10px) rotate(1deg);background:#e9eefb}
.playground-site .ed-grid .ed-story-card:nth-child(3n){background:#ffe7d1}
.playground-site .ed-grid .ed-story-card:hover,.playground-site .ed-grid .ed-story-card:focus-visible{transform:translateY(-6px) rotate(0);box-shadow:10px 11px 0 var(--v30-red)}
.playground-site .ed-story-card>img{height:205px;width:calc(100% + 48px);max-width:none;margin:0 -24px 4px;object-fit:cover;background:#ded5c8;border-bottom:2px solid var(--v30-night)}
.playground-site .ed-story-card>.eyebrow{display:inline-block;align-self:flex-start;padding:6px 8px;background:var(--v30-red);color:#fff;font-weight:900;font-size:9px}
.playground-site .ed-story-card h3{font-size:clamp(30px,3.5vw,46px);line-height:.94}
.playground-site .ed-story-card p{font-size:13px}
.playground-site .ed-card-end{border-top:2px solid var(--v30-night);padding-top:12px;font-weight:900}
.playground-site .poll-section{background:#1f1621;color:#fff;box-shadow:9px 10px 0 var(--v30-red);border:3px solid var(--v30-night);transform:none;padding:clamp(24px,4vw,45px)}
.playground-site .poll-section h3{color:var(--v30-sun)}
.playground-site .poll-option{background:#ffdd67;color:#1d1722;border-color:#fff}
.playground-site .poll-option:hover,.playground-site .poll-option.chosen{background:var(--v30-red);color:#fff}

/* On screen and out in the city belong to the same identity system. */
.playground-site .watch-section{background:#dfe5f1;border-top:6px solid var(--v30-night);border-bottom:6px solid var(--v30-night)}
.playground-site .watch-channel{box-shadow:10px 12px 0 var(--v30-red)}
.playground-site .culture-city{background:#faf4e9}
.playground-site .pg-archive-head{border-top-color:var(--v30-night)}
.playground-site .pg-archive-head .eyebrow{background:var(--v30-red)}
.playground-site .pg-archive-stamp{background:var(--v30-sun)}
.playground-site .pg-event-top{background:var(--v30-night)}
.playground-site .partners-section{background:#f2eee6;border-top:6px solid var(--v30-night)}
.playground-site .partners-showcase{background:#e5e6ef;box-shadow:10px 10px 0 var(--v30-red)}

/* Responsive hierarchy: no tiny nav items or hover-only discoveries. */
@media(max-width:1150px){
  .playground-site .v30-world-nav{display:block}
  .playground-site .v30-world-nav>span{display:block;border-bottom:1px solid #211e22}
  .playground-site .v30-world-nav>div{border-left:0}
}
@media(max-width:760px){
  .playground-site .culture-hero{padding-bottom:22px}
  .playground-site .culture-hero-board{padding-top:16px}
  .playground-site .culture-hero-intro{max-width:540px}
  .v30-live-chip{margin-top:17px;max-width:420px}
  .playground-site .culture-photo-wrap{box-shadow:7px 8px 0 var(--v30-red)}
  .playground-site .v30-world-nav>div{grid-template-columns:repeat(2,minmax(0,1fr))}
  .playground-site .v30-world-nav a{min-height:54px;border-bottom:1px solid #211e22}
  .playground-site .v30-world-nav a:nth-child(odd){border-left:0}
  .playground-site .v30-world-nav a:nth-child(n+3){border-bottom:0}
  .playground-site .on-air-hub{margin-top:35px}
  .playground-site .program-item{flex-basis:78%}
  .playground-site .program-item .program-summary{min-height:345px}
  .playground-site .program-name .program-art-shell{max-height:180px}
  .v30-program-ledger{margin-top:22px}
  .v30-zine-seal{width:80px;height:80px;right:9px;top:7px;font-size:10px}
  .playground-site .v30-zine-masthead .warga-heading h2{font-size:clamp(61px,10vw,84px)}
}
@media(max-width:480px){
  .playground-site .culture-hero:before{background:linear-gradient(150deg,#101015,#2a111d)}
  .playground-site .culture-kicker{font-size:8px;gap:9px}
  .playground-site .culture-kicker .eyebrow{font-size:8px}
  .playground-site .culture-hero h1{font-size:15.5vw}
  .playground-site .culture-hero h1 .culture-red-word{font-size:27vw}
  .v30-live-chip{padding:11px;margin-top:15px}
  .v30-live-chip strong{font-size:17px}
  .playground-site .v30-world-nav a{padding:11px 8px;font-size:10px;gap:5px}
  .playground-site .v30-world-nav a b{font-size:18px}
  .playground-site .program-item{flex-basis:89%}
  .playground-site .program-item .program-summary{padding:20px 18px;min-height:340px}
  .playground-site .program-item .program-name-label{font-size:clamp(48px,14vw,70px)}
  .playground-site .program-name .program-art-shell{min-height:135px}
  .v30-program-ledger{font-size:9px}
  .v30-program-ledger strong{font-size:11px}
  .v30-zine-masthead{padding:24px 14px 20px;box-shadow:5px 6px 0 #251b24}
  .v30-zine-seal{display:none}
  .playground-site .v30-zine-masthead .warga-heading h2{font-size:clamp(53px,13vw,67px)}
  .playground-site .ed-grid .ed-story-card{transform:none!important}
}
@media(prefers-reduced-motion:reduce){
  .playground-site.is-playing .hub-top #hub-schedule-label:before,.playground-site.is-playing .v30-live-led{animation:none}
  .v30-live-chip,.playground-site .ed-grid .ed-story-card{transition:none!important}
}
