/*
Theme Name: SBL Web 4
Theme URI: https://sbl.pinrangkab.go.id/
Author: MAROA Project & LPPL Radio Suara Bumi Lasinrang
Description: SBL Digital Radio Experience — radio-first, realtime, modern editorial UI, responsive/mobile-first.
Version: 4.1.7
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: sbl-web4
*/
:root{
 --sbl4-navy:#071d35;--sbl4-navy2:#0a3157;--sbl4-blue:#0866b5;--sbl4-sky:#12a8ff;--sbl4-red:#ef3340;
 --sbl4-green:#20bf6b;--sbl4-gold:#f5a000;--sbl4-bg:#f1f6fb;--sbl4-card:#fff;--sbl4-surface:#f7fafd;
 --sbl4-text:#101828;--sbl4-muted:#667085;--sbl4-border:#e3eaf2;--sbl4-footer:#061326;
 --sbl4-r1:10px;--sbl4-r2:16px;--sbl4-r3:22px;--sbl4-r4:28px;--sbl4-pill:999px;
 --sbl4-shadow:0 12px 35px rgba(7,29,53,.075);--sbl4-container:1440px;--sbl4-player-h:84px;
}
[data-theme="dark"]{--sbl4-bg:#07101b;--sbl4-card:#101c2b;--sbl4-surface:#132237;--sbl4-text:#f7fbff;--sbl4-muted:#9cacbf;--sbl4-border:#22354d;--sbl4-footer:#030913}
*{box-sizing:border-box}html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}body{margin:0;background:var(--sbl4-bg);color:var(--sbl4-text);font-family:"Plus Jakarta Sans",system-ui,-apple-system,Segoe UI,sans-serif;line-height:1.55;padding-bottom:calc(var(--sbl4-player-h) + 16px);overflow-x:hidden}
img{max-width:100%;height:auto;display:block}a{color:inherit;text-decoration:none}button,input{font:inherit}button{cursor:pointer}.sbl4-container{width:min(calc(100% - 40px),var(--sbl4-container));margin-inline:auto}.sbl4-skip{position:fixed;left:14px;top:-80px;z-index:99999;background:#fff;color:#111;padding:10px 14px;border-radius:9px}.sbl4-skip:focus{top:14px}
.sbl4-topbar{background:#06182b;color:#e4edf7;font-size:11px}.sbl4-topbar__in{min-height:32px;display:flex;align-items:center;justify-content:space-between;gap:20px}.sbl4-topbar__group{display:flex;align-items:center;gap:10px;white-space:nowrap}.sbl4-top-sep{opacity:.38}.sbl4-pill-live{display:inline-flex;align-items:center;gap:6px;background:var(--sbl4-red);color:#fff;border-radius:var(--sbl4-pill);padding:4px 9px;font-size:10px;font-weight:900}.sbl4-live-dot{width:7px;height:7px;border-radius:50%;background:var(--sbl4-red);box-shadow:0 0 0 4px rgba(239,51,64,.15);display:inline-block}
.sbl4-header{position:sticky;top:0;z-index:900;background:rgba(255,255,255,.96);border-bottom:1px solid var(--sbl4-border);backdrop-filter:blur(16px)}[data-theme="dark"] .sbl4-header{background:rgba(16,28,43,.96)}.sbl4-header__in{height:74px;display:flex;align-items:center;gap:24px}.sbl4-brand{display:flex;align-items:center;flex:0 0 auto;max-width:280px}.sbl4-brand-logo{width:auto!important;height:48px!important;max-width:230px!important;object-fit:contain!important}.sbl4-custom-logo-wrap,.sbl4-custom-logo-wrap .custom-logo-link{display:flex!important;align-items:center!important;width:auto!important;height:auto!important}.sbl4-custom-logo-wrap .custom-logo{width:auto!important;height:48px!important;max-width:230px!important;object-fit:contain!important}.sbl4-brand__fallback strong{display:block;font-size:13px;line-height:1.15}.sbl4-brand__fallback span{display:block;font-size:9px;color:var(--sbl4-muted);margin-top:3px}
.sbl4-nav{display:flex;align-items:center;justify-content:center;gap:3px;flex:1;min-width:0}.sbl4-nav a{font-size:12px;font-weight:700;color:#3b4b60;padding:10px 9px;border-radius:10px;white-space:nowrap}.sbl4-nav a:hover,.sbl4-nav .current-menu-item>a{background:#ecf6ff;color:var(--sbl4-blue)}[data-theme="dark"] .sbl4-nav a{color:#dbe6f2}.sbl4-head-actions{display:flex;align-items:center;gap:8px}.sbl4-iconbtn{width:40px;height:40px;border-radius:50%;border:1px solid var(--sbl4-border);background:var(--sbl4-card);color:var(--sbl4-text);display:grid;place-items:center}.sbl4-listen{border:0;border-radius:var(--sbl4-pill);background:var(--sbl4-red);color:#fff;min-height:42px;padding:0 17px;font-size:11px;font-weight:900;box-shadow:0 8px 20px rgba(239,51,64,.22)}.sbl4-mobile-menu{display:none}
.sbl4-drawer{display:none}.sbl4-ticker{background:var(--sbl4-card);border-bottom:1px solid var(--sbl4-border)}.sbl4-ticker__in{height:36px;display:flex;align-items:center;gap:12px}.sbl4-ticker__label{background:var(--sbl4-red);color:#fff;border-radius:var(--sbl4-pill);padding:4px 9px;font-size:9px;font-weight:900;letter-spacing:.02em}.sbl4-ticker__items{flex:1;min-width:0;overflow:hidden}.sbl4-ticker__item{display:none;font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#34445a}.sbl4-ticker__item.is-active{display:block}[data-theme="dark"] .sbl4-ticker__item{color:#dbe6f2}
.sbl4-main{padding:18px 0 34px}.sbl4-hero{height:500px;position:relative;overflow:hidden;border-radius:var(--sbl4-r4);background-image:var(--sbl4-hero-image);background-size:cover;background-position:center center;background-color:#08284b;box-shadow:0 20px 50px rgba(8,42,76,.16);isolation:isolate}.sbl4-hero__veil{position:absolute;inset:0;background:linear-gradient(90deg,rgba(4,36,80,.97) 0%,rgba(5,47,98,.88) 31%,rgba(6,47,88,.50) 50%,rgba(2,18,38,.10) 73%,rgba(2,18,38,.18) 100%);z-index:0}.sbl4-hero:after{content:"";position:absolute;left:-60px;bottom:-100px;width:700px;height:250px;background:radial-gradient(ellipse at center,rgba(0,174,255,.23),transparent 70%);z-index:0}.sbl4-hero__copy{position:relative;z-index:2;width:51%;height:100%;padding:54px 36px 46px 52px;display:flex;flex-direction:column;justify-content:center;color:#fff}.sbl4-hero__eyebrow{display:flex;gap:8px;align-items:center;margin-bottom:16px}.sbl4-hero__badge{display:inline-flex;align-items:center;gap:7px;background:rgba(7,28,52,.42);border:1px solid rgba(255,255,255,.20);border-radius:var(--sbl4-pill);padding:6px 10px;font-size:10px;font-weight:900;backdrop-filter:blur(10px)}.sbl4-hero__badge--live{background:rgba(239,51,64,.92);border-color:rgba(255,255,255,.28)}.sbl4-hero__badge--live .sbl4-live-dot{background:#fff;box-shadow:none}.sbl4-hero h1{font-family:"Outfit","Plus Jakarta Sans",sans-serif;font-size:clamp(46px,4vw,66px);line-height:.98;letter-spacing:-.035em;margin:0;max-width:660px;text-wrap:balance}.sbl4-hero__meta{display:flex;align-items:center;gap:10px;margin-top:14px;font-size:15px;font-weight:600}.sbl4-hero__meta strong{font-weight:800}.sbl4-hero__meta-sep{opacity:.4}.sbl4-hero__desc{font-size:13px;line-height:1.65;color:#d7e9f9;max-width:540px;margin:13px 0 0}.sbl4-hero__actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:22px}.sbl4-btn-primary,.sbl4-btn-outline{height:48px;border-radius:var(--sbl4-pill);padding:0 18px;display:inline-flex;align-items:center;justify-content:center;gap:8px;font-size:12px;font-weight:900}.sbl4-btn-primary{border:1px solid rgba(255,255,255,.55);background:linear-gradient(135deg,#14b8ff,#0572db);color:#fff;box-shadow:0 10px 28px rgba(17,169,255,.32)}.sbl4-btn-outline{border:1px solid rgba(255,255,255,.55);background:rgba(2,15,31,.24);color:#fff;backdrop-filter:blur(10px)}.sbl4-nowtrack{display:flex;align-items:center;gap:11px;margin-top:20px;max-width:560px}.sbl4-nowtrack>div:last-child{min-width:0}.sbl4-nowtrack span{display:block;color:#aac9e4;font-size:9px;text-transform:uppercase;letter-spacing:.08em;font-weight:800}.sbl4-nowtrack strong{display:block;font-size:12px;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sbl4-wave{display:flex;align-items:center;gap:3px;height:24px}.sbl4-wave i{display:block;width:3px;border-radius:3px;background:#22c7ff;animation:sbl4wave 1.05s ease-in-out infinite}.sbl4-wave i:nth-child(2){animation-delay:.12s}.sbl4-wave i:nth-child(3){animation-delay:.24s}.sbl4-wave i:nth-child(4){animation-delay:.36s}.sbl4-wave i:nth-child(5){animation-delay:.48s}@keyframes sbl4wave{0%,100%{height:5px}50%{height:23px}}
.sbl4-hero__studio-label{position:absolute;right:25%;bottom:26px;z-index:3;color:#fff;display:flex;gap:9px;align-items:center;background:rgba(2,17,34,.52);border:1px solid rgba(255,255,255,.16);border-radius:14px;padding:9px 11px;backdrop-filter:blur(12px)}.sbl4-hero__studio-label strong{display:block;font-size:10px}.sbl4-hero__studio-label small{display:block;font-size:8px;color:#bfd0e0}.sbl4-studio-dots{display:flex}.sbl4-studio-dots i{width:24px;height:24px;border-radius:50%;background:#dce7ef;border:2px solid #fff;margin-left:-7px}.sbl4-studio-dots i:first-child{margin-left:0}.sbl4-next{position:absolute;right:24px;bottom:24px;z-index:4;width:260px;min-height:105px;background:rgba(4,20,39,.76);border:1px solid rgba(255,255,255,.15);border-radius:18px;padding:14px 38px 14px 16px;color:#fff;backdrop-filter:blur(14px)}.sbl4-next small{display:block;color:#b9cee1;font-size:9px}.sbl4-next strong{display:block;font-size:15px;line-height:1.25;margin:4px 0}.sbl4-next span{font-size:10px;color:#d7e3ee}.sbl4-next b{position:absolute;right:14px;top:50%;transform:translateY(-50%);font-size:24px;font-weight:400}
.sbl4-section{margin-top:18px}.sbl4-card{background:var(--sbl4-card);border:1px solid var(--sbl4-border);border-radius:var(--sbl4-r2);box-shadow:0 6px 22px rgba(7,29,53,.045)}.sbl4-card__pad{padding:17px}.sbl4-grid-main{display:grid;grid-template-columns:1.08fr 1fr .34fr;gap:14px}.sbl4-section-head{display:flex;justify-content:space-between;align-items:center;gap:14px;margin-bottom:12px}.sbl4-section-head--outside{margin-bottom:10px}.sbl4-title-wrap{display:flex;align-items:center;gap:9px;min-width:0}.sbl4-title-icon{width:34px;height:34px;border-radius:10px;background:#e8f5ff;color:var(--sbl4-blue);display:grid;place-items:center;flex:0 0 auto;font-weight:900}.sbl4-title-icon--gold{background:#fff4db;color:#d88900}.sbl4-title-icon--dark{background:rgba(255,255,255,.1);color:#fff}.sbl4-title{font-family:"Outfit","Plus Jakarta Sans",sans-serif;font-size:18px;line-height:1.2;margin:0;letter-spacing:-.012em}.sbl4-sub{font-size:9px;color:var(--sbl4-muted);margin-top:2px}.sbl4-link{font-size:9px;font-weight:900;color:var(--sbl4-blue);white-space:nowrap}.sbl4-link--light{color:#fff}
.sbl4-days{display:grid;grid-template-columns:repeat(7,1fr);gap:5px;margin-bottom:6px}.sbl4-day{border:1px solid var(--sbl4-border);background:var(--sbl4-surface);color:var(--sbl4-muted);border-radius:8px;height:31px;font-size:9px;font-weight:800}.sbl4-day.is-active{background:var(--sbl4-blue);border-color:var(--sbl4-blue);color:#fff}.sbl4-schedule-row{display:grid;grid-template-columns:120px 1fr;gap:12px;align-items:center;padding:10px 4px;border-top:1px solid var(--sbl4-border)}.sbl4-schedule-row:first-child{border-top:0}.sbl4-time{font-size:9px;color:#526178;font-weight:800}.sbl4-program{font-size:10px;font-weight:900;line-height:1.3}.sbl4-host{font-size:8px;color:var(--sbl4-muted);margin-top:2px}.sbl4-onair{display:inline-flex;align-items:center;gap:4px;background:#fff0f2;color:var(--sbl4-red);font-size:8px;font-weight:900;border-radius:999px;padding:3px 6px;margin-right:5px}
.sbl4-segment{display:grid;grid-template-columns:1fr 1fr;background:#edf2f7;padding:3px;border-radius:999px;min-width:130px}.sbl4-segment button{border:0;background:transparent;border-radius:999px;color:#64748b;padding:6px 9px;font-size:8px;font-weight:900}.sbl4-segment button.is-active{background:var(--sbl4-blue);color:#fff}.sbl4-chart-row{display:grid;grid-template-columns:32px 1fr auto;align-items:center;gap:8px;padding:8px 0;border-top:1px solid var(--sbl4-border)}.sbl4-chart-row:first-child{border-top:0}.sbl4-rank{font-family:"Outfit";font-weight:900;color:var(--sbl4-blue);font-size:15px}.sbl4-song strong{display:block;font-size:10px;line-height:1.2}.sbl4-song span{display:block;font-size:8px;color:var(--sbl4-muted);margin-top:2px}.sbl4-trend{font-size:8px;font-weight:900;min-width:30px;text-align:right}.sbl4-trend.up{color:#13a761}.sbl4-trend.down{color:#ef3340}.sbl4-trend.same{color:#8a97a8}.sbl4-chart-footer{margin-top:8px;padding-top:9px;border-top:1px solid var(--sbl4-border);display:flex;align-items:center;justify-content:space-between;gap:8px}.sbl4-chart-footer strong{display:block;font-size:9px}.sbl4-chart-footer span{display:block;font-size:8px;color:var(--sbl4-muted)}.sbl4-chart-footer a{background:var(--sbl4-green);color:#fff;border-radius:999px;padding:7px 10px;font-size:8px;font-weight:900;white-space:nowrap}
.sbl4-support{position:relative;min-height:100%;overflow:hidden;background:#0a2745;background-image:var(--sbl4-support-image);background-size:cover;background-position:center}.sbl4-support__overlay{position:absolute;inset:0;background:linear-gradient(0deg,rgba(5,22,42,.96),rgba(5,22,42,.10) 68%)}.sbl4-support__body{position:absolute;z-index:2;left:0;right:0;bottom:0;padding:16px;color:#fff}.sbl4-support__kicker{font-size:7px;font-weight:900;color:#55d6ff;letter-spacing:.07em}.sbl4-support__body strong{display:block;font-family:"Outfit";font-size:15px;line-height:1.15;margin-top:4px}.sbl4-support__body p{font-size:8px;line-height:1.5;color:#d3e0ed;margin:6px 0 10px}.sbl4-support__body a{display:inline-block;background:var(--sbl4-green);padding:7px 9px;border-radius:999px;font-size:8px;font-weight:900}
.sbl4-media-shell{background:transparent}.sbl4-media-actions{display:flex;gap:6px}.sbl4-platform{border-radius:999px;padding:7px 11px;color:#fff;font-size:8px;font-weight:900}.sbl4-platform--spotify{background:#1db954}.sbl4-platform--yt{background:#ff1f2d}.sbl4-media-feature-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.sbl4-feature-media{position:relative;border:0;padding:0;height:220px;overflow:hidden;border-radius:18px;text-align:left;color:#fff;background:#071d35;box-shadow:var(--sbl4-shadow)}.sbl4-feature-media__bg{position:absolute;inset:0;background-size:cover;background-position:center}.sbl4-feature-media__shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(3,17,34,.95) 0%,rgba(3,17,34,.55) 58%,rgba(3,17,34,.20) 100%)}.sbl4-feature-media__content{position:absolute;z-index:2;inset:0;padding:22px;display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-start}.sbl4-media-tag{display:inline-flex;border-radius:999px;padding:5px 8px;font-size:7px;font-weight:900;margin-bottom:7px}.sbl4-media-tag--spotify{background:#1db954}.sbl4-media-tag--yt{background:#ff1f2d}.sbl4-feature-media small{font-size:8px;color:#bdd0e0}.sbl4-feature-media strong{display:block;font-family:"Outfit";font-size:19px;line-height:1.18;max-width:80%;margin-top:4px}.sbl4-media-play{position:absolute;right:22px;bottom:22px;width:48px;height:48px;border-radius:50%;background:#fff;color:#0b2947;display:grid;place-items:center;font-size:16px}.sbl4-media-play--yt{background:#ff1530;color:#fff}
.sbl4-filter-row{display:flex;gap:6px;flex-wrap:wrap;margin:-2px 0 12px}.sbl4-filter-row span{border:1px solid var(--sbl4-border);background:var(--sbl4-surface);border-radius:999px;padding:5px 9px;font-size:8px;color:var(--sbl4-muted);font-weight:700}.sbl4-filter-row span.is-active{background:var(--sbl4-blue);color:#fff;border-color:var(--sbl4-blue)}.sbl4-news-layout{display:grid;grid-template-columns:1.35fr 1fr;gap:16px}.sbl4-news-lead{display:grid;grid-template-columns:1.08fr 1fr;gap:16px;min-width:0}.sbl4-news-lead__image{position:relative;border-radius:14px;overflow:hidden;min-height:240px;background:#dce7f0}.sbl4-news-lead__image img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0}.sbl4-news-lead__image span{position:absolute;left:10px;top:10px;background:var(--sbl4-red);color:#fff;border-radius:999px;padding:5px 8px;font-size:7px;font-weight:900}.sbl4-news-lead__copy{display:flex;flex-direction:column;justify-content:center}.sbl4-news-lead__copy h3{font-family:"Outfit";font-size:24px;line-height:1.08;margin:5px 0 8px;letter-spacing:-.02em}.sbl4-news-lead__copy p{font-size:10px;line-height:1.55;color:var(--sbl4-muted);margin:0}.sbl4-meta{font-size:8px;color:var(--sbl4-muted)}.sbl4-news-side{display:grid;grid-template-columns:1fr 1fr;column-gap:12px}.sbl4-news-mini{display:grid;grid-template-columns:92px 1fr;gap:9px;align-items:center;padding:7px 0;border-bottom:1px solid var(--sbl4-border);min-width:0}.sbl4-news-mini img{width:92px;height:64px;border-radius:9px;object-fit:cover}.sbl4-news-mini__tag{font-size:6px;font-weight:900;color:var(--sbl4-blue)}.sbl4-news-mini strong{display:block;font-size:9px;line-height:1.3;margin-top:2px}
.sbl4-darkband{background:linear-gradient(105deg,#06182d,#0b365f);border-radius:20px;padding:16px;color:#fff;overflow:hidden}.sbl4-scroller{display:flex;gap:9px;overflow:auto;scroll-snap-type:x proximity;scrollbar-width:none}.sbl4-scroller::-webkit-scrollbar{display:none}.sbl4-music-card{position:relative;min-width:190px;height:104px;border-radius:13px;overflow:hidden;background:#16334f;scroll-snap-align:start}.sbl4-music-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.sbl4-music-card:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.9),rgba(0,0,0,.03) 70%)}.sbl4-music-card div{position:absolute;z-index:2;left:10px;right:10px;bottom:9px}.sbl4-music-card span{display:block;font-size:6px;font-weight:900;color:#54d4ff}.sbl4-music-card strong{display:block;font-size:9px;line-height:1.25;color:#fff;margin-top:2px}
.sbl4-bottom-grid{display:grid;grid-template-columns:1.15fr 1fr;gap:14px}.sbl4-crew{display:flex;gap:14px;overflow:auto;scrollbar-width:none;padding:2px}.sbl4-crew::-webkit-scrollbar{display:none}.sbl4-crew-card{min-width:80px;text-align:center}.sbl4-avatar{position:relative;width:70px;height:70px;border-radius:50%;overflow:hidden;background:#e1e9f1;margin:auto;border:3px solid var(--sbl4-card);box-shadow:0 0 0 1px var(--sbl4-border)}.sbl4-avatar img{width:100%;height:100%;object-fit:cover;object-position:center top}.sbl4-crew-live{display:none;position:absolute;left:50%;bottom:2px;transform:translateX(-50%);background:var(--sbl4-red);color:#fff;font-size:6px;font-weight:900;border-radius:999px;padding:3px 5px}.sbl4-crew-card.is-onair .sbl4-avatar{box-shadow:0 0 0 2px var(--sbl4-red)}.sbl4-crew-card.is-onair .sbl4-crew-live{display:block}.sbl4-crew-card strong{display:block;font-size:9px;margin-top:6px}.sbl4-crew-card>span{display:block;font-size:7px;color:var(--sbl4-muted)}
.sbl4-public-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}.sbl4-public{display:grid;grid-template-columns:28px 1fr auto;gap:7px;align-items:center;border:1px solid var(--sbl4-border);border-radius:11px;padding:9px;background:var(--sbl4-surface)}.sbl4-public__icon{width:28px;height:28px;border-radius:9px;background:#e9f5ff;color:var(--sbl4-blue);display:grid;place-items:center;font-size:11px;font-weight:900}.sbl4-public b{display:block;font-size:8px;line-height:1.2}.sbl4-public span{display:block;font-size:7px;color:var(--sbl4-muted);margin-top:2px}.sbl4-public i{font-style:normal;color:#9aa8b8}
.sbl4-footer{margin-top:28px;background:var(--sbl4-footer);color:#d7e3ef;padding:32px 0 20px}.sbl4-footer-grid{display:grid;grid-template-columns:1.3fr repeat(3,1fr);gap:34px}.sbl4-footer-brand img{width:auto;height:42px;margin-bottom:10px}.sbl4-footer h4{font-size:10px;color:#fff;margin:0 0 10px}.sbl4-footer p,.sbl4-footer a,.sbl4-footer li{font-size:8px;color:#a9bbce;line-height:1.7}.sbl4-footer ul{list-style:none;margin:0;padding:0}.sbl4-footer li{margin:4px 0}.sbl4-footer-bottom{display:flex;justify-content:space-between;gap:20px;border-top:1px solid rgba(255,255,255,.08);margin-top:20px;padding-top:12px;color:#70869b;font-size:7px}
.sbl4-player{height:var(--sbl4-player-h);position:fixed;left:0;right:0;bottom:0;z-index:1100;background:rgba(4,20,38,.975);color:#fff;border-top:1px solid rgba(255,255,255,.10);backdrop-filter:blur(18px)}.sbl4-player__in{height:100%;display:grid;grid-template-columns:1.22fr .68fr .82fr .45fr;align-items:center;gap:18px}.sbl4-player__info{display:flex;align-items:center;gap:10px;min-width:0}.sbl4-player__cover{width:48px;height:48px;border-radius:10px;background:#143653;overflow:hidden;flex:0 0 auto;display:grid;place-items:center}.sbl4-player__cover img{width:100%;height:100%;object-fit:cover}.sbl4-player__copy{min-width:0}.sbl4-player__live{font-size:7px;font-weight:900;color:#ff7a83}.sbl4-player__live .sbl4-live-dot{width:5px;height:5px;box-shadow:none}.sbl4-player__title{font-size:10px;font-weight:900;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:2px}.sbl4-player__meta{font-size:8px;color:#a8bbce;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sbl4-player__center{display:flex;align-items:center;gap:12px;justify-content:center}.sbl4-player-play{width:46px;height:46px;border-radius:50%;border:0;background:#fff;color:#0b2948;font-weight:900}.sbl4-volume-wrap{display:flex;align-items:center;gap:6px}.sbl4-volume{width:95px}.sbl4-player__next{min-width:0}.sbl4-player__next small{display:block;font-size:6px;color:#7fa0bb;font-weight:900}.sbl4-player__next strong{display:block;font-size:9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sbl4-player__next span{font-size:7px;color:#a8bbce}.sbl4-player__right{display:flex;justify-content:flex-end}.sbl4-wa{border:1px solid rgba(255,255,255,.25);border-radius:999px;padding:8px 11px;font-size:8px;font-weight:900}
.sbl4-media-modal{display:none;position:fixed;inset:0;z-index:1600;align-items:center;justify-content:center;padding:20px}.sbl4-media-modal.is-open{display:flex}.sbl4-media-modal__backdrop{position:absolute;inset:0;border:0;background:rgba(2,9,18,.78);backdrop-filter:blur(8px)}.sbl4-media-modal__dialog{position:relative;z-index:2;width:min(900px,96vw);background:#07182c;border:1px solid rgba(255,255,255,.13);border-radius:20px;overflow:hidden;color:#fff;box-shadow:0 30px 80px rgba(0,0,0,.45)}.sbl4-media-modal__head{height:64px;padding:0 16px;display:flex;align-items:center;justify-content:space-between}.sbl4-media-modal__head span{display:block;color:#5bc9ff;font-size:7px;font-weight:900}.sbl4-media-modal__head strong{display:block;font-size:12px;margin-top:2px}.sbl4-media-modal__head button{width:38px;height:38px;border-radius:50%;border:1px solid rgba(255,255,255,.15);background:rgba(255,255,255,.07);color:#fff;font-size:22px}.sbl4-media-modal__body{aspect-ratio:16/9;background:#02070d}.sbl4-media-modal__body iframe{width:100%;height:100%;border:0}
.entry-content{font-size:15px;line-height:1.8}.entry-content>*{max-width:100%}.entry-content h2,.entry-content h3{font-family:"Outfit";line-height:1.2}.entry-content img{border-radius:14px}
@media (max-width:1180px){.sbl4-nav{display:none}.sbl4-mobile-menu{display:grid}.sbl4-brand{flex:1}.sbl4-grid-main{grid-template-columns:1fr 1fr}.sbl4-support{display:none}.sbl4-hero__copy{width:56%}.sbl4-hero__studio-label{right:28%}.sbl4-news-layout{grid-template-columns:1fr}.sbl4-news-side{grid-template-columns:1fr 1fr}}
@media (max-width:768px){
 :root{--sbl4-player-h:70px}.sbl4-container{width:min(calc(100% - 20px),var(--sbl4-container))}.sbl4-topbar{display:none}.sbl4-header__in{height:62px;gap:9px}.sbl4-brand-logo,.sbl4-custom-logo-wrap .custom-logo{height:36px!important;max-width:175px!important}.sbl4-head-actions .sbl4-listen,.sbl4-theme-toggle{display:none}.sbl4-iconbtn{width:38px;height:38px}.sbl4-drawer{position:fixed;top:62px;left:0;right:0;z-index:950;background:var(--sbl4-card);border-bottom:1px solid var(--sbl4-border);padding:8px 14px 14px;box-shadow:var(--sbl4-shadow)}.sbl4-drawer.is-open{display:block}.sbl4-drawer a{display:block;padding:11px 4px;border-bottom:1px solid var(--sbl4-border);font-size:12px;font-weight:750}.sbl4-ticker__in{height:34px}.sbl4-ticker__label{font-size:8px}.sbl4-ticker__item{font-size:9px}
 .sbl4-main{padding-top:9px}.sbl4-hero{height:420px;border-radius:20px;background-position:64% center}.sbl4-hero__veil{background:linear-gradient(90deg,rgba(4,36,80,.96) 0%,rgba(4,36,80,.89) 43%,rgba(4,36,80,.62) 61%,rgba(4,36,80,.20) 100%)}.sbl4-hero__copy{width:72%;padding:27px 16px 18px;justify-content:flex-start}.sbl4-hero__eyebrow{margin-top:7px;margin-bottom:12px}.sbl4-hero h1{font-size:31px;line-height:1.02;max-width:100%}.sbl4-hero__meta{font-size:11px;display:block}.sbl4-hero__meta span{display:block;margin-top:2px}.sbl4-hero__meta-sep{display:none!important}.sbl4-hero__desc{font-size:10px;line-height:1.5;margin-top:8px;max-width:95%}.sbl4-hero__actions{gap:7px;margin-top:14px}.sbl4-btn-primary,.sbl4-btn-outline{height:40px;padding:0 12px;font-size:9px}.sbl4-nowtrack{margin-top:13px;max-width:95%}.sbl4-nowtrack strong{font-size:9px}.sbl4-hero__studio-label{display:none}.sbl4-next{left:12px;right:12px;bottom:12px;width:auto;min-height:70px;padding:10px 34px 10px 12px;border-radius:14px}.sbl4-next small{font-size:7px}.sbl4-next strong{font-size:11px}.sbl4-next span{font-size:8px}
 .sbl4-section{margin-top:10px}.sbl4-grid-main{grid-template-columns:1fr;gap:10px}.sbl4-card__pad{padding:12px}.sbl4-section-head{margin-bottom:9px}.sbl4-title{font-size:15px}.sbl4-title-icon{width:30px;height:30px}.sbl4-sub{font-size:7px}.sbl4-link{font-size:8px}.sbl4-days{gap:3px}.sbl4-day{height:29px;font-size:8px}.sbl4-schedule-row{grid-template-columns:92px 1fr;padding:8px 2px}.sbl4-time{font-size:8px}.sbl4-program{font-size:9px}.sbl4-host{font-size:7px}.sbl4-segment{min-width:118px}.sbl4-chart-row{padding:7px 0}.sbl4-chart-footer{margin-top:5px}
 .sbl4-media-actions{display:none}.sbl4-media-feature-grid{grid-template-columns:1fr;gap:8px}.sbl4-feature-media{height:190px}.sbl4-feature-media__content{padding:15px}.sbl4-feature-media strong{font-size:15px;max-width:82%}.sbl4-media-play{right:15px;bottom:15px;width:42px;height:42px}
 .sbl4-filter-row{overflow:auto;flex-wrap:nowrap;scrollbar-width:none}.sbl4-filter-row::-webkit-scrollbar{display:none}.sbl4-filter-row span{white-space:nowrap}.sbl4-news-layout{grid-template-columns:1fr;gap:10px}.sbl4-news-lead{grid-template-columns:110px 1fr;gap:10px}.sbl4-news-lead__image{min-height:108px}.sbl4-news-lead__copy h3{font-size:14px;margin:3px 0}.sbl4-news-lead__copy p{display:none}.sbl4-news-side{grid-template-columns:1fr}.sbl4-news-mini{grid-template-columns:82px 1fr}.sbl4-news-mini img{width:82px;height:58px}
 .sbl4-darkband{border-radius:16px;padding:12px}.sbl4-music-card{min-width:145px;height:88px}.sbl4-bottom-grid{grid-template-columns:1fr;gap:10px}.sbl4-public-grid{grid-template-columns:1fr 1fr}.sbl4-public{grid-template-columns:26px 1fr;padding:8px}.sbl4-public i{display:none}
 .sbl4-footer{padding:24px 0 18px}.sbl4-footer-grid{grid-template-columns:1fr 1fr;gap:20px}.sbl4-footer-brand{grid-column:1/-1}.sbl4-footer-bottom{display:block}.sbl4-footer-bottom span{display:block;margin-top:3px}
 .sbl4-player__in{grid-template-columns:1fr auto;gap:8px}.sbl4-player__cover{width:42px;height:42px}.sbl4-player__live{font-size:6px}.sbl4-player__title{font-size:9px}.sbl4-player__meta{font-size:7px}.sbl4-player__center{grid-column:2;grid-row:1}.sbl4-player__center .sbl4-volume-wrap{display:none}.sbl4-player-play{width:42px;height:42px}.sbl4-player__next,.sbl4-player__right{display:none}
 .sbl4-media-modal{padding:10px}.sbl4-media-modal__dialog{border-radius:15px}.sbl4-media-modal__head{height:56px}
}
@media (max-width:380px){.sbl4-brand-logo,.sbl4-custom-logo-wrap .custom-logo{max-width:148px!important}.sbl4-hero__copy{width:78%}.sbl4-hero h1{font-size:27px}.sbl4-btn-primary,.sbl4-btn-outline{font-size:8px;padding:0 10px}.sbl4-public-grid{grid-template-columns:1fr}.sbl4-feature-media{height:175px}}
@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}.sbl4-wave i{animation:none!important;height:12px}}

/* ============================================================
   SBL WEB 4 — BETA 3 VISUAL REFINEMENT
   Based on real desktop render review, 26 Sep 2026
   ============================================================ */
:root{--sbl4-container:1460px;--sbl4-player-h:88px}
.sbl4-container{width:min(calc(100% - 28px),var(--sbl4-container))}
.sbl4-topbar{font-size:11.5px}.sbl4-topbar__in{min-height:34px}
.sbl4-header__in{height:80px;gap:18px}
.sbl4-brand{display:flex;align-items:center;gap:11px;max-width:none;min-width:255px;flex:0 0 auto}
.sbl4-brand__mark{width:44px;height:44px;display:grid;place-items:center;flex:0 0 44px}
.sbl4-brand__mark img{width:44px!important;height:44px!important;object-fit:contain!important}
.sbl4-brand__mark strong{font-family:"Outfit";font-size:18px;color:var(--sbl4-blue)}
.sbl4-brand__copy{display:block;min-width:0}.sbl4-brand__copy strong{display:block;font-size:13px;line-height:1.05;letter-spacing:-.02em;color:#0a223d}.sbl4-brand__copy small{display:block;margin-top:4px;font-size:7.6px;line-height:1.2;color:#728196;font-weight:700;letter-spacing:.015em}
[data-theme="dark"] .sbl4-brand__copy strong{color:#fff}
.sbl4-nav{gap:1px}.sbl4-nav a{font-size:11.2px;padding:10px 8px;font-weight:750}
.sbl4-head-actions{gap:7px}.sbl4-iconbtn{width:42px;height:42px}.sbl4-listen{min-height:44px;padding:0 17px;font-size:10.5px}
.sbl4-searchbar{display:none;border-top:1px solid var(--sbl4-border);background:var(--sbl4-card);padding:12px 0;box-shadow:0 14px 28px rgba(7,29,53,.06)}.sbl4-searchbar.is-open{display:block}.sbl4-searchform{display:grid;grid-template-columns:1fr auto;gap:8px;max-width:760px;margin:auto}.sbl4-searchform input{height:44px;border:1px solid var(--sbl4-border);border-radius:12px;background:var(--sbl4-surface);color:var(--sbl4-text);padding:0 14px;font-size:13px;outline:none}.sbl4-searchform input:focus{border-color:#76bdf2;box-shadow:0 0 0 3px rgba(8,102,181,.1)}.sbl4-searchform button{border:0;border-radius:12px;background:var(--sbl4-blue);color:#fff;padding:0 20px;font-size:12px;font-weight:800}
.sbl4-ticker__in{height:38px}.sbl4-ticker__item{font-size:10.7px}.sbl4-ticker__label{font-size:9.5px}

.sbl4-main{padding:20px 0 38px}.sbl4-hero{height:520px;border-radius:30px;background-position:center center}.sbl4-hero__copy{width:51%;padding:58px 40px 48px 56px}.sbl4-hero h1{font-size:clamp(50px,4.15vw,68px);max-width:650px}.sbl4-hero__meta{font-size:14.5px;margin-top:16px}.sbl4-hero__desc{font-size:13.5px;max-width:560px}.sbl4-hero__actions{margin-top:23px}.sbl4-btn-primary,.sbl4-btn-outline{height:50px;padding:0 19px;font-size:12px}.sbl4-nowtrack{margin-top:21px}.sbl4-nowtrack span{font-size:9.5px}.sbl4-nowtrack strong{font-size:12.5px}.sbl4-next{right:26px;bottom:26px;width:280px;min-height:112px;padding:16px 42px 16px 17px}.sbl4-next small{font-size:9.5px}.sbl4-next strong{font-size:16px}.sbl4-next span{font-size:10.5px}.sbl4-hero__studio-label{right:24%;bottom:27px;padding:9px 12px}.sbl4-studio-dots{display:flex;align-items:center}.sbl4-studio-dots img{width:28px;height:28px;object-fit:cover;object-position:center top;border-radius:50%;border:2px solid #fff;margin-left:-7px;background:#dce7ef}.sbl4-studio-dots img:first-child{margin-left:0}.sbl4-studio-dots i{display:none}.sbl4-hero__studio-label strong{font-size:10.5px}.sbl4-hero__studio-label small{font-size:8.2px}

.sbl4-section{margin-top:22px}.sbl4-card{border-radius:18px}.sbl4-card__pad{padding:20px}.sbl4-grid-main{grid-template-columns:minmax(0,1.08fr) minmax(0,1fr) 250px;gap:16px}.sbl4-section-head{margin-bottom:14px}.sbl4-title-icon{width:36px;height:36px}.sbl4-title{font-size:20px}.sbl4-sub{font-size:10.2px}.sbl4-link{font-size:9.8px}
.sbl4-days{gap:6px;margin-bottom:9px}.sbl4-day{height:34px;font-size:9.5px}.sbl4-schedule-row{grid-template-columns:128px 1fr;padding:11px 4px}.sbl4-time{font-size:9.7px}.sbl4-program{font-size:11.2px}.sbl4-host{font-size:8.7px}.sbl4-onair{font-size:8.2px}
.sbl4-segment{min-width:138px}.sbl4-segment button{font-size:8.5px;padding:7px 10px}.sbl4-chart-row{grid-template-columns:34px 1fr auto;padding:9px 0}.sbl4-rank{font-size:16px}.sbl4-song strong{font-size:11px}.sbl4-song span{font-size:8.6px}.sbl4-trend{font-size:8.5px}.sbl4-chart-footer{margin-top:10px;padding-top:11px}.sbl4-chart-footer strong{font-size:9.8px}.sbl4-chart-footer span{font-size:8.4px}.sbl4-chart-footer a{font-size:8.5px;padding:7px 11px}
.sbl4-support__body{padding:18px}.sbl4-support__kicker{font-size:7.5px}.sbl4-support__body strong{font-size:17px}.sbl4-support__body p{font-size:8.8px}.sbl4-support__body a{font-size:8.5px}

.sbl4-media-feature-grid{gap:16px}.sbl4-feature-media{height:252px;border-radius:20px}.sbl4-feature-media__content{padding:25px}.sbl4-feature-media small{font-size:8.8px}.sbl4-feature-media strong{font-size:21px;max-width:78%}.sbl4-media-tag{font-size:7.8px}.sbl4-media-play{width:52px;height:52px;right:24px;bottom:24px}

.sbl4-news-section{padding:22px}.sbl4-news-layout{grid-template-columns:1.45fr 1fr;gap:20px}.sbl4-news-lead{grid-template-columns:1.06fr 1fr;gap:18px}.sbl4-news-lead__image{min-height:280px;border-radius:16px}.sbl4-news-lead__copy h3{font-size:27px;line-height:1.05;margin:7px 0 10px}.sbl4-news-lead__copy p{font-size:11px;line-height:1.62}.sbl4-meta{font-size:8.7px}.sbl4-news-side{column-gap:14px}.sbl4-news-mini{grid-template-columns:104px 1fr;gap:10px;padding:9px 0}.sbl4-news-mini img{width:104px;height:72px}.sbl4-news-mini strong{font-size:9.7px}.sbl4-news-mini__tag{font-size:6.8px}

.sbl4-darkband{padding:19px;border-radius:22px}.sbl4-scroller{gap:11px}.sbl4-music-card{min-width:210px;height:118px;border-radius:15px}.sbl4-music-card div{left:12px;right:12px;bottom:11px}.sbl4-music-card span{font-size:6.8px}.sbl4-music-card strong{font-size:9.8px;line-height:1.22}
.sbl4-bottom-grid{grid-template-columns:1.14fr 1fr;gap:16px}.sbl4-crew{gap:16px;padding:4px}.sbl4-crew-card{min-width:88px}.sbl4-avatar{width:78px;height:78px}.sbl4-crew-card strong{font-size:9.8px}.sbl4-crew-card>span{font-size:7.5px}.sbl4-public-grid{gap:9px}.sbl4-public{grid-template-columns:32px 1fr auto;gap:9px;padding:10px 11px}.sbl4-public__icon{width:32px;height:32px}.sbl4-public b{font-size:8.7px}.sbl4-public span{font-size:7.6px}

.sbl4-footer{padding:38px 0 22px}.sbl4-footer-grid{gap:38px}.sbl4-footer-brand img{height:46px}.sbl4-footer h4{font-size:10.8px}.sbl4-footer p,.sbl4-footer a,.sbl4-footer li{font-size:8.8px}.sbl4-footer-bottom{font-size:7.8px;margin-top:24px;padding-top:14px}
.sbl4-player__cover{width:54px;height:54px}.sbl4-player__live{font-size:7.6px}.sbl4-player__title{font-size:11px}.sbl4-player__meta{font-size:8.6px}.sbl4-player-play{width:48px;height:48px}.sbl4-player__next small{font-size:6.8px}.sbl4-player__next strong{font-size:9.7px}.sbl4-player__next span{font-size:7.8px}.sbl4-wa{font-size:8.8px;padding:9px 12px}

/* Preserve full desktop navigation longer; Beta 2 hid it too early. */
@media (min-width:921px) and (max-width:1180px){
 .sbl4-nav{display:flex!important}.sbl4-mobile-menu{display:none!important}.sbl4-brand{flex:0 0 auto;min-width:222px}.sbl4-brand__mark{width:40px;height:40px;flex-basis:40px}.sbl4-brand__mark img{width:40px!important;height:40px!important}.sbl4-brand__copy strong{font-size:11.5px}.sbl4-brand__copy small{font-size:6.7px}.sbl4-nav a{font-size:9.5px;padding:9px 5px}.sbl4-head-actions .sbl4-theme-toggle{display:none}.sbl4-listen{padding:0 12px;font-size:9px}.sbl4-grid-main{grid-template-columns:1fr 1fr!important}.sbl4-support{display:none!important}.sbl4-hero__copy{width:54%}.sbl4-news-layout{grid-template-columns:1fr!important}.sbl4-news-side{grid-template-columns:1fr 1fr!important}
}
@media (max-width:920px){.sbl4-nav{display:none!important}.sbl4-mobile-menu{display:grid!important}.sbl4-brand{flex:1;min-width:0}.sbl4-search-toggle{display:grid}}

@media (max-width:768px){
 :root{--sbl4-player-h:72px}.sbl4-container{width:min(calc(100% - 18px),var(--sbl4-container))}.sbl4-header__in{height:64px}.sbl4-brand{gap:8px}.sbl4-brand__mark{width:38px;height:38px;flex-basis:38px}.sbl4-brand__mark img{width:38px!important;height:38px!important}.sbl4-brand__copy strong{font-size:10.5px}.sbl4-brand__copy small{font-size:6.2px}.sbl4-search-toggle{display:none}.sbl4-ticker__in{height:36px}
 .sbl4-hero{height:438px;border-radius:21px;background-position:64% center}.sbl4-hero__copy{width:74%;padding:27px 16px 18px}.sbl4-hero h1{font-size:32px}.sbl4-hero__meta{font-size:11.2px}.sbl4-hero__desc{font-size:10.3px}.sbl4-btn-primary,.sbl4-btn-outline{height:42px;font-size:9.2px}.sbl4-next{min-height:72px}.sbl4-section{margin-top:12px}.sbl4-card__pad{padding:14px}.sbl4-title{font-size:16px}.sbl4-sub{font-size:7.8px}.sbl4-link{font-size:8.2px}.sbl4-schedule-row{grid-template-columns:98px 1fr}.sbl4-time{font-size:8.2px}.sbl4-program{font-size:9.5px}.sbl4-host{font-size:7.5px}.sbl4-feature-media{height:205px}.sbl4-feature-media strong{font-size:16px}.sbl4-news-section{padding:14px}.sbl4-news-lead__copy h3{font-size:15px}.sbl4-darkband{padding:14px}.sbl4-music-card{min-width:152px;height:92px}.sbl4-avatar{width:72px;height:72px}.sbl4-crew-card{min-width:80px}.sbl4-footer h4{font-size:10px}.sbl4-footer p,.sbl4-footer a,.sbl4-footer li{font-size:8.2px}
}
@media (max-width:430px){.sbl4-brand__copy small{display:none}.sbl4-brand__copy strong{font-size:9.8px;max-width:150px}.sbl4-hero__copy{width:78%}.sbl4-hero h1{font-size:29px}.sbl4-hero__desc{display:none}.sbl4-nowtrack{max-width:92%}.sbl4-public-grid{grid-template-columns:1fr 1fr}}
@media (max-width:360px){.sbl4-brand__copy{display:none}.sbl4-hero__copy{width:82%}.sbl4-hero h1{font-size:27px}.sbl4-public-grid{grid-template-columns:1fr}}


/* ==============================================================
   SBL WEB 4 — BETA 4 visual refinement
   ============================================================== */
@media (min-width:921px){
  .sbl4-header__in{height:84px}
  .sbl4-brand{min-width:275px}
  .sbl4-brand__mark,.sbl4-brand__mark img{width:48px!important;height:48px!important}.sbl4-brand__mark{flex-basis:48px}
  .sbl4-brand__copy strong{font-size:14px}.sbl4-brand__copy small{font-size:8px}
  .sbl4-nav a{font-size:11.6px;padding:10px 8px}
  .sbl4-main{padding-top:22px}
  .sbl4-hero{height:530px}
  .sbl4-hero__copy{width:47%;padding-left:58px;padding-right:22px}
  .sbl4-hero__veil{background:linear-gradient(90deg,rgba(4,36,80,.98) 0%,rgba(5,47,98,.92) 28%,rgba(5,47,98,.66) 40%,rgba(5,47,98,.25) 49%,rgba(2,18,38,.06) 63%,rgba(2,18,38,.12) 100%)}
  .sbl4-hero h1{max-width:570px;font-size:clamp(52px,3.65vw,68px)}
  .sbl4-card__pad{padding:22px}.sbl4-section{margin-top:24px}.sbl4-title{font-size:21px}.sbl4-sub{font-size:10.6px}.sbl4-link{font-size:10.2px}
  .sbl4-grid-main{grid-template-columns:minmax(0,1.08fr) minmax(0,1fr) 260px;gap:18px}
  .sbl4-days{margin-bottom:10px}.sbl4-day{height:36px;font-size:10px}
  .sbl4-schedule-row{grid-template-columns:136px 1fr;padding:11px 6px;min-height:60px}
  .sbl4-schedule-info{display:flex;align-items:center;gap:10px;min-width:0}
  .sbl4-schedule-avatar{width:38px;height:38px;border-radius:50%;object-fit:cover;object-position:center top;background:#e5edf5;border:2px solid #fff;box-shadow:0 0 0 1px var(--sbl4-border);flex:0 0 auto}
  .sbl4-schedule-avatar--blank{display:grid;place-items:center;font-size:8px;font-weight:900;color:var(--sbl4-blue)}
  .sbl4-schedule-copy{min-width:0}.sbl4-time{font-size:10px}.sbl4-program{font-size:11.8px}.sbl4-host{font-size:9.2px}
  .sbl4-schedule-row.is-active{background:linear-gradient(90deg,rgba(239,51,64,.05),transparent);border-radius:10px}
  .sbl4-chart-row{grid-template-columns:34px 38px minmax(0,1fr) auto;gap:10px;min-height:58px;padding:9px 0}
  .sbl4-chart-cover{width:38px;height:38px;border-radius:8px;object-fit:cover;background:linear-gradient(135deg,#dfe9f4,#f8fbff);box-shadow:inset 0 0 0 1px rgba(8,42,76,.08)}
  .sbl4-rank{font-size:17px}.sbl4-song strong{font-size:11.6px}.sbl4-song span{font-size:9px}.sbl4-trend{font-size:9px}
  .sbl4-support{background-position:center 18%}.sbl4-support__overlay{background:linear-gradient(0deg,rgba(5,22,42,.97),rgba(5,22,42,.1) 64%)}.sbl4-support__body strong{font-size:18px}.sbl4-support__body p{font-size:9px}
  .sbl4-feature-media{height:270px}.sbl4-feature-media strong{font-size:22px}.sbl4-feature-media small{font-size:9.4px}
  .sbl4-news-lead__copy h3{font-size:29px}.sbl4-news-lead__copy p{font-size:11.5px}.sbl4-news-mini strong{font-size:10.2px}
  .sbl4-music-card{min-width:220px;height:124px}.sbl4-music-card strong{font-size:10.3px}
  .sbl4-avatar{width:82px;height:82px}.sbl4-crew-card{min-width:92px}.sbl4-crew-card strong{font-size:10.3px}.sbl4-public b{font-size:9.2px}.sbl4-public span{font-size:8px}
  .sbl4-footer p,.sbl4-footer a,.sbl4-footer li{font-size:9.3px}.sbl4-footer h4{font-size:11.3px}
  .sbl4-player__cover{width:58px;height:58px}.sbl4-player__title{font-size:11.6px}.sbl4-player__meta{font-size:9px}.sbl4-player__next strong{font-size:10.2px}
}
.sbl4-filter-row a{display:inline-flex;align-items:center;min-height:28px;padding:0 10px;border:1px solid var(--sbl4-border);border-radius:999px;font-size:8px;font-weight:800;color:var(--sbl4-muted);background:var(--sbl4-card)}
.sbl4-filter-row a.is-active{background:var(--sbl4-blue);border-color:var(--sbl4-blue);color:#fff}
@media (max-width:920px){
  .sbl4-schedule-info{display:flex;align-items:center;gap:8px;min-width:0}.sbl4-schedule-avatar{width:34px;height:34px;border-radius:50%;object-fit:cover;object-position:center top;background:#e5edf5;flex:0 0 auto}.sbl4-schedule-avatar--blank{display:grid;place-items:center;font-size:7px;font-weight:900;color:var(--sbl4-blue)}.sbl4-schedule-copy{min-width:0}
  .sbl4-chart-row{grid-template-columns:30px 34px minmax(0,1fr) auto;gap:8px}.sbl4-chart-cover{width:34px;height:34px;border-radius:8px;object-fit:cover;background:#e5edf5}
}
@media (max-width:768px){
  .sbl4-hero__veil{background:linear-gradient(90deg,rgba(4,31,63,.96) 0%,rgba(4,31,63,.78) 43%,rgba(4,31,63,.28) 70%,rgba(4,31,63,.08) 100%)}
  .sbl4-hero__copy{width:72%}.sbl4-schedule-row{grid-template-columns:94px 1fr;min-height:56px}.sbl4-chart-row{min-height:52px}.sbl4-filter-row{overflow-x:auto;flex-wrap:nowrap;padding-bottom:3px;scrollbar-width:none}.sbl4-filter-row::-webkit-scrollbar{display:none}.sbl4-filter-row a{white-space:nowrap;flex:0 0 auto;font-size:8px}
}


/* ==============================================================
   SBL WEB 4 — BETA 6 finishing pass
   ============================================================== */
.sbl4-hero-rail{position:absolute;z-index:5;left:16px;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:10px}
.sbl4-hero-rail a{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:rgba(4,23,45,.48);border:1px solid rgba(255,255,255,.17);color:#fff;backdrop-filter:blur(10px);font-size:14px;transition:.2s ease}
.sbl4-hero-rail a:hover{background:rgba(14,165,233,.88);transform:translateX(2px)}
.sbl4-next{display:grid;grid-template-columns:58px minmax(0,1fr) 18px;gap:10px;align-items:center;padding:11px 12px!important}
.sbl4-next__thumb{width:58px;height:58px;border-radius:11px;overflow:hidden;background:rgba(255,255,255,.08)}
.sbl4-next__thumb img{width:100%;height:100%;object-fit:cover}.sbl4-next__copy{min-width:0}.sbl4-next small{font-size:8px}.sbl4-next strong{font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sbl4-next span{font-size:9px}.sbl4-next b{position:static!important;transform:none!important;text-align:center}
.sbl4-chart-row{grid-template-columns:34px 38px minmax(0,1fr) auto 28px!important}.sbl4-chart-go{width:26px;height:26px;border:1px solid var(--sbl4-border);border-radius:50%;display:grid;place-items:center;color:var(--sbl4-blue);background:var(--sbl4-surface);font-size:9px;font-weight:900}.sbl4-chart-go:hover{background:var(--sbl4-blue);color:#fff;border-color:var(--sbl4-blue)}
.sbl4-support{background-position:center top!important}.sbl4-support:before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(5,22,42,.02),rgba(5,22,42,.18) 42%,rgba(5,22,42,.92) 100%);z-index:1}.sbl4-support__overlay{display:none}.sbl4-support__body{z-index:2}
.sbl4-player__center{gap:14px}.sbl4-player-wave{display:flex;align-items:center;gap:2px;height:26px;min-width:76px}.sbl4-player-wave i{display:block;width:2px;border-radius:2px;background:#17b8ff;animation:sbl4wave 1.05s ease-in-out infinite}.sbl4-player-wave i:nth-child(2){animation-delay:.08s}.sbl4-player-wave i:nth-child(3){animation-delay:.16s}.sbl4-player-wave i:nth-child(4){animation-delay:.24s}.sbl4-player-wave i:nth-child(5){animation-delay:.32s}.sbl4-player-wave i:nth-child(6){animation-delay:.40s}.sbl4-player-wave i:nth-child(7){animation-delay:.48s}.sbl4-player-wave i:nth-child(8){animation-delay:.56s}.sbl4-player-wave i:nth-child(9){animation-delay:.64s}.sbl4-player-wave i:nth-child(10){animation-delay:.72s}
.sbl4-player[data-state="paused"] .sbl4-player-wave i{animation-play-state:paused;height:6px!important;opacity:.55}
.sbl4-footer-social{display:flex;gap:7px;margin-top:11px}.sbl4-footer-social a{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;border:1px solid rgba(255,255,255,.14);color:#fff!important;font-size:10px!important}
.sbl4-footer-social a:hover{background:rgba(255,255,255,.1)}
@media (min-width:921px){.sbl4-hero__copy{padding-left:70px}.sbl4-support__body{padding:19px}.sbl4-support__body strong{font-size:19px}.sbl4-support__body p{font-size:9.5px}.sbl4-chart-row{min-height:58px}.sbl4-crew{gap:18px}.sbl4-avatar{width:88px;height:88px}.sbl4-crew-card{min-width:98px}}
@media (max-width:920px){.sbl4-hero-rail{display:none}.sbl4-chart-row{grid-template-columns:30px 34px minmax(0,1fr) auto 26px!important}.sbl4-player-wave{display:none}}
@media (max-width:768px){.sbl4-next{grid-template-columns:46px minmax(0,1fr) 16px}.sbl4-next__thumb{width:46px;height:46px}.sbl4-next strong{font-size:11px}.sbl4-chart-go{width:24px;height:24px}.sbl4-hero__copy{padding-left:18px}}


/* ==============================================================
   SBL WEB 4 — BETA 6 polish: clean hero + branded music support
   ============================================================== */
/* Hero kembali fokus ke konten utama; rail vertikal Beta 5 dihapus. */
@media (min-width:921px){
  .sbl4-hero__copy{padding-left:58px}
}
.sbl4-support--brand{
  position:relative;
  overflow:hidden;
  isolation:isolate;
  background:
    radial-gradient(circle at 76% 18%,rgba(56,189,248,.34),transparent 27%),
    radial-gradient(circle at 24% 28%,rgba(8,102,181,.50),transparent 34%),
    linear-gradient(155deg,#071d35 0%,#0a3761 58%,#071728 100%)!important;
}
.sbl4-support--brand:before{
  content:"";position:absolute;inset:0;z-index:-1;opacity:.34;
  background-image:linear-gradient(rgba(255,255,255,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.055) 1px,transparent 1px);
  background-size:20px 20px;
  mask-image:linear-gradient(to bottom,black,transparent 78%);
}
.sbl4-support__art{position:absolute;inset:0;overflow:hidden;pointer-events:none}
.sbl4-record{position:absolute;width:166px;height:166px;border-radius:50%;right:-36px;top:-20px;background:repeating-radial-gradient(circle,#07111d 0 5px,#111e2d 6px 8px);box-shadow:0 18px 40px rgba(0,0,0,.28);transform:rotate(-10deg)}
.sbl4-record:after{content:"";position:absolute;width:44px;height:44px;border-radius:50%;left:50%;top:50%;transform:translate(-50%,-50%);background:radial-gradient(circle,#fff 0 5px,#19b8ff 6px 18px,#0866b5 19px 22px)}
.sbl4-record i{position:absolute;inset:14px;border:1px solid rgba(255,255,255,.08);border-radius:50%}
.sbl4-support-note{position:absolute;right:32px;top:118px;color:rgba(255,255,255,.18);font-family:"Outfit";font-size:84px;font-weight:800;transform:rotate(9deg)}
.sbl4-support-wave{position:absolute;left:18px;right:18px;top:118px;height:42px;display:flex;align-items:center;gap:5px;opacity:.34}
.sbl4-support-wave i{display:block;flex:1;max-width:8px;border-radius:999px;background:linear-gradient(#38bdf8,#0866b5)}
.sbl4-support-wave i:nth-child(1){height:12px}.sbl4-support-wave i:nth-child(2){height:28px}.sbl4-support-wave i:nth-child(3){height:18px}.sbl4-support-wave i:nth-child(4){height:38px}.sbl4-support-wave i:nth-child(5){height:24px}.sbl4-support-wave i:nth-child(6){height:33px}.sbl4-support-wave i:nth-child(7){height:15px}
.sbl4-support--brand .sbl4-support__body{z-index:2;padding:20px;background:linear-gradient(0deg,rgba(3,14,27,.96) 0%,rgba(3,14,27,.86) 54%,rgba(3,14,27,0) 100%)}
.sbl4-support-tags{display:flex;gap:5px;flex-wrap:wrap;margin:0 0 10px}.sbl4-support-tags span{display:inline-flex;align-items:center;min-height:19px;padding:0 7px;border:1px solid rgba(255,255,255,.16);border-radius:999px;color:#c7eaff;background:rgba(255,255,255,.06);font-size:7px;font-weight:800}
.sbl4-support--brand .sbl4-support__body a{box-shadow:0 7px 18px rgba(32,191,107,.2)}

/* Artwork chart tidak lagi tampak sebagai kotak putih jika sumber artwork tidak tersedia. */
.sbl4-chart-cover{background-image:linear-gradient(145deg,#dbe8f4,#f8fbff);color:transparent}
.sbl4-chart-cover:not([src]),.sbl4-chart-cover[src=""]{opacity:.7}

/* Sedikit ruang bernapas pada area di bawah hero. */
@media (min-width:921px){
  .sbl4-grid-main{align-items:stretch}
  .sbl4-support--brand{min-height:100%}
  .sbl4-support--brand .sbl4-support__body strong{max-width:180px;line-height:1.08}
}
@media (max-width:1180px){.sbl4-support--brand{display:none!important}}


/* ==============================================================
   SBL WEB 4 — BETA 7
   FINAL MOBILE LAYOUT AUTHORITY
   Fixes cascade collisions from desktop refinement blocks.
   ============================================================== */
html,body{max-width:100%;overflow-x:hidden}
.sbl4-grid-main>*,.sbl4-news-layout>*,.sbl4-bottom-grid>*,.sbl4-media-feature-grid>*{min-width:0}
body.admin-bar .sbl4-header{top:32px}
@media (max-width:782px){body.admin-bar .sbl4-header{top:46px}}

@media (max-width:768px){
  .sbl4-container{width:calc(100% - 20px)!important;max-width:none!important;margin-left:10px!important;margin-right:10px!important}
  .sbl4-main{width:100%!important;max-width:100%!important;overflow:hidden!important}
  .sbl4-section,.sbl4-card,.sbl4-media-shell,.sbl4-news-section,.sbl4-darkband{width:100%!important;max-width:100%!important;min-width:0!important}
  .sbl4-grid-main{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:12px!important;width:100%!important}
  .sbl4-grid-main>.sbl4-card{width:100%!important;max-width:100%!important;min-width:0!important}
  .sbl4-support,.sbl4-support--brand{display:none!important}

  .sbl4-header__in{height:62px!important;gap:8px!important}
  .sbl4-brand{min-width:0!important;max-width:calc(100% - 52px)!important;flex:1 1 auto!important;gap:8px!important}
  .sbl4-brand__mark{width:34px!important;height:34px!important;flex:0 0 34px!important}
  .sbl4-brand__mark img{width:34px!important;height:34px!important}
  .sbl4-brand__copy{min-width:0!important;display:block!important}
  .sbl4-brand__copy strong{font-size:10px!important;line-height:1.08!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:190px!important}
  .sbl4-brand__copy small{display:none!important}
  .sbl4-head-actions{flex:0 0 auto!important}
  .sbl4-head-actions .sbl4-search-toggle,.sbl4-head-actions .sbl4-theme-toggle,.sbl4-head-actions .sbl4-listen{display:none!important}
  .sbl4-mobile-menu{display:grid!important;width:38px!important;height:38px!important;background:var(--sbl4-navy)!important;color:#fff!important;border-color:var(--sbl4-navy)!important;font-size:19px!important}
  .sbl4-mobile-menu span{line-height:1!important}
  .sbl4-drawer{top:62px!important;max-height:calc(100dvh - 62px - var(--sbl4-player-h));overflow:auto!important;-webkit-overflow-scrolling:touch}
  body.admin-bar .sbl4-drawer{top:108px!important}

  .sbl4-hero{height:430px!important;width:100%!important;border-radius:20px!important;background-position:62% center!important}
  .sbl4-hero__copy{width:76%!important;max-width:none!important;padding:24px 15px 94px!important;justify-content:flex-start!important}
  .sbl4-hero__eyebrow{margin:5px 0 10px!important}
  .sbl4-hero__badge{font-size:8px!important;padding:5px 8px!important}
  .sbl4-hero h1{font-size:30px!important;line-height:1.01!important;letter-spacing:-.03em!important;max-width:100%!important}
  .sbl4-hero__meta{font-size:10.5px!important;line-height:1.35!important;margin-top:10px!important;display:block!important}
  .sbl4-hero__meta>span{display:block!important;margin-top:2px!important}
  .sbl4-hero__meta-sep{display:none!important}
  .sbl4-hero__desc{display:none!important}
  .sbl4-hero__actions{margin-top:13px!important;gap:7px!important;flex-wrap:nowrap!important}
  .sbl4-btn-primary,.sbl4-btn-outline{height:39px!important;padding:0 11px!important;font-size:8.5px!important;white-space:nowrap!important}
  .sbl4-nowtrack{margin-top:12px!important;max-width:96%!important}
  .sbl4-nowtrack span{font-size:7px!important}.sbl4-nowtrack strong{font-size:9px!important}
  .sbl4-hero__studio-label{display:none!important}
  .sbl4-next{left:12px!important;right:12px!important;bottom:12px!important;width:auto!important;min-height:66px!important;grid-template-columns:44px minmax(0,1fr) 14px!important;gap:8px!important;padding:9px 10px!important;border-radius:14px!important}
  .sbl4-next__thumb{width:44px!important;height:44px!important}.sbl4-next small{font-size:7px!important}.sbl4-next strong{font-size:10.5px!important}.sbl4-next span{font-size:7.5px!important}

  .sbl4-card__pad{padding:13px!important}
  .sbl4-section-head{align-items:flex-start!important;gap:8px!important;margin-bottom:10px!important}
  .sbl4-title-wrap{min-width:0!important;flex:1 1 auto!important}
  .sbl4-title-icon{width:31px!important;height:31px!important;flex:0 0 31px!important}
  .sbl4-title{font-size:15.5px!important;line-height:1.15!important}
  .sbl4-sub{font-size:7.5px!important;line-height:1.35!important}
  .sbl4-link{font-size:7.5px!important;line-height:1.25!important;white-space:nowrap!important;margin-top:3px!important}

  .sbl4-days{display:grid!important;grid-template-columns:repeat(7,minmax(0,1fr))!important;gap:4px!important;width:100%!important;margin:0 0 8px!important}
  .sbl4-day{min-width:0!important;width:100%!important;height:30px!important;padding:0!important;font-size:7.7px!important}
  .sbl4-schedule-row{display:grid!important;grid-template-columns:82px minmax(0,1fr)!important;gap:8px!important;width:100%!important;min-height:52px!important;padding:7px 0!important}
  .sbl4-time{font-size:7.7px!important;white-space:nowrap!important}
  .sbl4-schedule-info{display:flex!important;align-items:center!important;gap:7px!important;min-width:0!important}
  .sbl4-schedule-avatar{width:31px!important;height:31px!important;flex:0 0 31px!important}
  .sbl4-schedule-copy{min-width:0!important}.sbl4-program{font-size:9px!important;line-height:1.25!important}.sbl4-host{font-size:7px!important;line-height:1.25!important}

  .sbl4-grid-main>.sbl4-card:nth-child(2) .sbl4-section-head{flex-wrap:wrap!important}
  .sbl4-segment{min-width:112px!important;flex:0 0 auto!important}.sbl4-segment button{font-size:7.5px!important;padding:6px 8px!important}
  .sbl4-chart-row{display:grid!important;grid-template-columns:24px 32px minmax(0,1fr) 20px!important;gap:7px!important;width:100%!important;min-height:48px!important;padding:7px 0!important}
  .sbl4-chart-cover{width:32px!important;height:32px!important;border-radius:7px!important}
  .sbl4-rank{font-size:14px!important}.sbl4-song{min-width:0!important}.sbl4-song strong{font-size:8.8px!important;line-height:1.2!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sbl4-song span{font-size:6.8px!important}
  .sbl4-trend{display:none!important}.sbl4-chart-go{width:20px!important;height:20px!important;font-size:7px!important}
  .sbl4-chart-footer{display:flex!important;align-items:center!important;gap:8px!important;justify-content:space-between!important}.sbl4-chart-footer strong{font-size:8px!important}.sbl4-chart-footer span{font-size:6.7px!important}.sbl4-chart-footer a{font-size:7px!important;padding:6px 8px!important;white-space:nowrap!important}

  .sbl4-media-feature-grid{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:9px!important;width:100%!important}
  .sbl4-feature-media{width:100%!important;height:auto!important;aspect-ratio:16/8.7!important;min-height:0!important;border-radius:16px!important}
  .sbl4-feature-media__content{padding:14px!important}.sbl4-feature-media strong{font-size:15px!important;line-height:1.08!important;max-width:80%!important}.sbl4-feature-media small{font-size:7px!important}.sbl4-media-tag{font-size:6.5px!important}.sbl4-media-play{width:40px!important;height:40px!important;right:13px!important;bottom:13px!important}

  .sbl4-news-section{padding:13px!important;overflow:hidden!important}
  .sbl4-filter-row{display:flex!important;overflow-x:auto!important;flex-wrap:nowrap!important;gap:5px!important;margin-bottom:10px!important;-webkit-overflow-scrolling:touch;scrollbar-width:none}.sbl4-filter-row::-webkit-scrollbar{display:none}.sbl4-filter-row a{flex:0 0 auto!important;font-size:7px!important;min-height:25px!important;padding:0 8px!important}
  .sbl4-news-layout{display:block!important;width:100%!important;max-width:100%!important}
  .sbl4-news-lead{display:block!important;width:100%!important;max-width:100%!important}
  .sbl4-news-lead__image{display:block!important;width:100%!important;min-height:0!important;height:auto!important;aspect-ratio:16/9!important;border-radius:13px!important;position:relative!important}
  .sbl4-news-lead__image img{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;object-fit:cover!important}
  .sbl4-news-lead__copy{display:block!important;width:100%!important;padding:10px 1px 7px!important}
  .sbl4-news-lead__copy h3{font-size:17px!important;line-height:1.08!important;margin:4px 0 5px!important}.sbl4-news-lead__copy p{display:block!important;font-size:8px!important;line-height:1.45!important;margin:0!important}.sbl4-meta{font-size:6.8px!important}
  .sbl4-news-side{display:grid!important;grid-template-columns:minmax(0,1fr)!important;width:100%!important;gap:0!important;margin-top:4px!important}
  .sbl4-news-mini{display:grid!important;grid-template-columns:78px minmax(0,1fr)!important;gap:9px!important;width:100%!important;padding:8px 0!important}
  .sbl4-news-mini img{width:78px!important;height:56px!important;border-radius:9px!important}.sbl4-news-mini strong{font-size:8.7px!important;line-height:1.27!important}.sbl4-news-mini__tag{font-size:6px!important}

  .sbl4-darkband{width:100%!important;padding:12px!important;border-radius:16px!important;overflow:hidden!important}
  .sbl4-scroller{display:flex!important;width:100%!important;overflow-x:auto!important;gap:8px!important;-webkit-overflow-scrolling:touch;scroll-snap-type:x proximity}
  .sbl4-music-card{min-width:142px!important;width:142px!important;height:88px!important;flex:0 0 142px!important;scroll-snap-align:start!important}

  .sbl4-bottom-grid{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:10px!important;width:100%!important}
  .sbl4-bottom-grid>.sbl4-card{width:100%!important;max-width:100%!important;min-width:0!important}
  .sbl4-crew{display:flex!important;overflow-x:auto!important;width:100%!important;gap:11px!important;padding:3px 1px 6px!important;-webkit-overflow-scrolling:touch;scrollbar-width:none}.sbl4-crew::-webkit-scrollbar{display:none}
  .sbl4-crew-card{min-width:64px!important;flex:0 0 64px!important}.sbl4-avatar{width:57px!important;height:57px!important}.sbl4-crew-card strong{font-size:8px!important}.sbl4-crew-card>span{font-size:6.5px!important}
  .sbl4-public-grid{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:7px!important;width:100%!important}
  .sbl4-public{grid-template-columns:28px minmax(0,1fr) 10px!important;gap:8px!important;width:100%!important;padding:9px!important}.sbl4-public__icon{width:28px!important;height:28px!important}.sbl4-public b{font-size:8.3px!important}.sbl4-public span{font-size:6.8px!important}.sbl4-public i{display:block!important}

  .sbl4-footer{margin-top:18px!important;padding:24px 0 22px!important}
  .sbl4-footer-grid{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:18px!important;width:100%!important}
  .sbl4-footer-brand{grid-column:auto!important}.sbl4-footer-brand img{height:38px!important}.sbl4-footer h4{font-size:9px!important}.sbl4-footer p,.sbl4-footer a,.sbl4-footer li{font-size:7.5px!important;line-height:1.6!important}.sbl4-footer-bottom{font-size:6.5px!important;margin-top:16px!important;padding-top:10px!important}

  :root{--sbl4-player-h:66px!important}
  body{padding-bottom:76px!important}
  .sbl4-player{height:66px!important}.sbl4-player__in{display:grid!important;grid-template-columns:minmax(0,1fr) 44px!important;gap:8px!important}.sbl4-player__cover{width:40px!important;height:40px!important}.sbl4-player__title{font-size:8.5px!important}.sbl4-player__meta{font-size:6.5px!important}.sbl4-player__center{grid-column:2!important;grid-row:1!important}.sbl4-player-play{width:40px!important;height:40px!important}.sbl4-player-wave,.sbl4-volume-wrap,.sbl4-player__next,.sbl4-player__right{display:none!important}
}

@media (max-width:430px){
  .sbl4-container{width:calc(100% - 16px)!important;margin-left:8px!important;margin-right:8px!important}
  .sbl4-hero{height:420px!important;background-position:61% center!important}
  .sbl4-hero__copy{width:80%!important;padding-left:13px!important;padding-right:10px!important}
  .sbl4-hero h1{font-size:28px!important}
  .sbl4-btn-primary,.sbl4-btn-outline{font-size:8px!important;padding:0 10px!important}
  .sbl4-section-head>.sbl4-link{max-width:92px;overflow:hidden;text-overflow:ellipsis}
}
@media (max-width:360px){
  .sbl4-brand__copy strong{max-width:135px!important;font-size:9.2px!important}
  .sbl4-hero{height:408px!important;background-position:60% center!important}
  .sbl4-hero__copy{width:82%!important}
  .sbl4-hero h1{font-size:26px!important}
  .sbl4-btn-primary,.sbl4-btn-outline{height:37px!important;padding:0 9px!important;font-size:7.5px!important}
  .sbl4-schedule-row{grid-template-columns:76px minmax(0,1fr)!important}
  .sbl4-news-lead__copy h3{font-size:16px!important}
}


/* ============================================================
   BETA 8 — CUACA PINRANG
   Menggantikan kartu promosi platform menjadi layanan publik.
============================================================ */
.sbl4-weather{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  min-height:100%;
  height:100%;
  padding:17px 16px 13px;
  color:#fff;
  border-color:rgba(255,255,255,.07);
  background:
    radial-gradient(circle at 72% 16%,rgba(75,197,255,.28),transparent 23%),
    linear-gradient(155deg,#0a3c69 0%,#082a4c 54%,#061b31 100%);
  box-shadow:0 12px 30px rgba(5,27,49,.12);
}
.sbl4-weather__glow{position:absolute;z-index:-1;width:150px;height:150px;border-radius:50%;right:-58px;top:-55px;background:rgba(64,200,255,.16);filter:blur(2px)}
.sbl4-weather__head{display:flex;align-items:flex-start;justify-content:space-between;gap:8px;position:relative;z-index:2}
.sbl4-weather__kicker{display:block;color:#5dd6ff;font-size:7px;font-weight:900;letter-spacing:.12em;margin-bottom:3px}
.sbl4-weather__head strong{display:block;font-size:9.5px;line-height:1.2;color:#fff}
.sbl4-weather__refresh{width:27px;height:27px;display:grid;place-items:center;flex:0 0 27px;border-radius:50%;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.07);color:#d9f4ff;padding:6px}
.sbl4-weather__refresh:hover{background:rgba(255,255,255,.14)}.sbl4-weather__refresh svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.sbl4-weather__refresh.is-spinning svg{animation:sbl4wxspin .65s linear infinite}@keyframes sbl4wxspin{to{transform:rotate(360deg)}}
.sbl4-weather__main{display:grid;grid-template-columns:64px minmax(0,1fr);align-items:center;gap:7px;margin:12px 0 6px;position:relative;z-index:2}
.sbl4-weather__icon{width:64px;height:64px;display:grid;place-items:center}
.sbl4-weather__reading{min-width:0}.sbl4-weather__temp{line-height:.88;white-space:nowrap}.sbl4-weather__temp strong{font-family:"Outfit",sans-serif;font-size:38px;letter-spacing:-.06em}.sbl4-weather__temp sup{font-size:10px;vertical-align:top;margin-left:2px;color:#cbefff;font-weight:800}
.sbl4-weather__condition{font-size:10px;font-weight:800;margin-top:5px}.sbl4-weather__feels{font-size:7px;color:#bcd2e6;margin-top:2px}
.sbl4-weather__range{display:flex;justify-content:space-between;align-items:center;padding:7px 0;border-top:1px solid rgba(255,255,255,.10);border-bottom:1px solid rgba(255,255,255,.10);font-size:7px;color:#bcd2e6}.sbl4-weather__range strong{color:#fff;font-size:9px}
.sbl4-weather__metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;padding:9px 0}
.sbl4-weather__metrics>div{min-width:0;text-align:center;padding:6px 3px;border-radius:10px;background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.065)}
.sbl4-weather__metric-icon{display:block;color:#5dd6ff;font-size:12px;line-height:1}.sbl4-weather__metrics small{display:block;color:#9ebbd2;font-size:6px;margin:3px 0 2px}.sbl4-weather__metrics strong{display:block;font-size:7.5px;white-space:nowrap}
.sbl4-weather__alert{display:flex;align-items:center;gap:6px;min-height:27px;border-radius:9px;padding:5px 7px;background:rgba(58,197,255,.08);border:1px solid rgba(85,214,255,.10);color:#dff7ff}
.sbl4-weather__alert>span{width:6px;height:6px;border-radius:50%;background:#4fd1ff;box-shadow:0 0 0 4px rgba(79,209,255,.10);flex:0 0 auto}.sbl4-weather__alert b{font-size:6.2px;line-height:1.3;font-weight:700}
.sbl4-weather__alert[data-level="watch"]>span{background:#fbbf24}.sbl4-weather__alert[data-level="rain"]>span{background:#38bdf8}.sbl4-weather__alert[data-level="danger"]{background:rgba(239,68,68,.10);border-color:rgba(239,68,68,.15)}.sbl4-weather__alert[data-level="danger"]>span{background:#fb7185}
.sbl4-weather__forecast{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;margin-top:8px}
.sbl4-weather-day{text-align:center;padding:6px 2px;border-radius:9px;background:rgba(1,18,34,.18)}.sbl4-weather-day span{display:block;font-size:5.8px;color:#a9c5da}.sbl4-weather-day strong{font-size:7.5px}.sbl4-weather-day small{font-size:6px;color:#8ba9c1;margin-left:2px}
.sbl4-weather__foot{display:flex;justify-content:space-between;gap:5px;margin-top:7px;color:#7897b1;font-size:5.5px}.sbl4-weather__foot small{font-size:5.5px}
.sbl4-wx-svg{width:58px;height:58px;filter:drop-shadow(0 7px 12px rgba(0,0,0,.14))}.sbl4-wx-svg--mini{width:22px;height:22px;display:block;margin:2px auto}
.sbl4-wx-svg .sun-fill{fill:#ffd45a}.sbl4-wx-svg .sun-ray{fill:none;stroke:#ffd45a;stroke-width:3;stroke-linecap:round}.sbl4-wx-svg .cloud-fill{fill:#dcecf8}.sbl4-wx-svg .moon-fill{fill:#dcecff}.sbl4-wx-svg .star-fill{fill:#fff}.sbl4-wx-svg .rain-stroke,.sbl4-wx-svg .fog-stroke{fill:none;stroke:#52c9ff;stroke-width:3;stroke-linecap:round}.sbl4-wx-svg .bolt-fill{fill:#ffd45a}
.sbl4-weather--rain,.sbl4-weather--storm{background:radial-gradient(circle at 72% 16%,rgba(93,167,221,.20),transparent 22%),linear-gradient(155deg,#173d60 0%,#0b2945 58%,#061829 100%)}
.sbl4-weather--cloudy,.sbl4-weather--fog{background:radial-gradient(circle at 72% 16%,rgba(176,205,227,.13),transparent 22%),linear-gradient(155deg,#21435e 0%,#14334e 58%,#0b2136 100%)}
.sbl4-weather--night,.sbl4-weather--night-cloud{background:radial-gradient(circle at 72% 16%,rgba(84,119,255,.18),transparent 22%),linear-gradient(155deg,#132650 0%,#0b1d3b 58%,#061329 100%)}
.sbl4-weather[data-weather-state="loading"] .sbl4-weather__main{opacity:.78}
.sbl4-weather__loader{width:38px;height:38px;border-radius:50%;border:3px solid rgba(255,255,255,.13);border-top-color:#5dd6ff;animation:sbl4wxspin .85s linear infinite}

/* tablet: cuaca tetap tampil, bukan dihilangkan */
@media (max-width:1180px){
  .sbl4-grid-main>.sbl4-weather{display:grid!important;grid-column:1/-1!important;height:auto!important;min-height:180px!important;grid-template-columns:1fr 1fr;grid-template-areas:"head main" "range metrics" "alert forecast" "foot foot";column-gap:20px;align-content:center}
  .sbl4-weather__head{grid-area:head}.sbl4-weather__main{grid-area:main;margin:0}.sbl4-weather__range{grid-area:range}.sbl4-weather__metrics{grid-area:metrics;padding:0}.sbl4-weather__alert{grid-area:alert}.sbl4-weather__forecast{grid-area:forecast;margin-top:0}.sbl4-weather__foot{grid-area:foot}
}
@media (max-width:760px){
  .sbl4-grid-main>.sbl4-weather{display:block!important;grid-column:auto!important;min-height:0!important;padding:15px!important;border-radius:16px!important}
  .sbl4-weather__head strong{font-size:10px}.sbl4-weather__kicker{font-size:6.8px}
  .sbl4-weather__main{grid-template-columns:68px minmax(0,1fr)!important;gap:9px!important;margin:10px 0 8px!important}
  .sbl4-weather__icon{width:68px;height:68px}.sbl4-wx-svg{width:62px;height:62px}
  .sbl4-weather__temp strong{font-size:41px}.sbl4-weather__condition{font-size:10.5px}.sbl4-weather__feels{font-size:7.5px}
  .sbl4-weather__metrics{gap:6px;padding:9px 0}.sbl4-weather__metrics>div{padding:7px 3px}.sbl4-weather__metrics small{font-size:6.5px}.sbl4-weather__metrics strong{font-size:8px}
  .sbl4-weather__forecast{gap:5px}.sbl4-weather-day{padding:7px 2px}.sbl4-weather-day span{font-size:6.5px}.sbl4-weather-day strong{font-size:8.5px}.sbl4-weather-day small{font-size:6.5px}
  .sbl4-weather__foot{font-size:6px}.sbl4-weather__foot small{font-size:6px}
}


/* ============================================================
   BETA 9 — MOBILE NAVIGATION, FOOTER & READABILITY
============================================================ */
.sbl4-menu-icon{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
.sbl4-menu-icon path{transition:transform .2s ease,opacity .16s ease}
.sbl4-footer-group{border:0;margin:0;padding:0}.sbl4-footer-group summary{list-style:none}.sbl4-footer-group summary::-webkit-details-marker{display:none}.sbl4-footer-group summary>span{display:none}
.sbl4-footer h4{font-size:11.5px}.sbl4-footer p,.sbl4-footer a,.sbl4-footer li{font-size:9.8px}.sbl4-footer-bottom{font-size:8px}
.sbl4-player__title{font-size:11px}.sbl4-player__meta{font-size:8px}.sbl4-player__live{font-size:7.5px}

@media (max-width:760px){
  body.sbl4-menu-open{overflow:hidden!important}
  .sbl4-mobile-menu{border-radius:12px!important}
  .sbl4-mobile-menu.is-open{background:#0b75bf!important}
  .sbl4-drawer{
    padding:12px!important;
    background:rgba(255,255,255,.99)!important;
    box-shadow:0 18px 45px rgba(7,29,53,.18)!important;
  }
  [data-theme="dark"] .sbl4-drawer{background:rgba(16,28,43,.99)!important}

  .sbl4-drawer__top{display:block}
  .sbl4-drawer-search{
    height:44px;display:flex;align-items:center;gap:8px;padding:0 12px;
    border:1px solid var(--sbl4-border);border-radius:13px;background:var(--sbl4-surface)
  }
  .sbl4-drawer-search svg{width:17px;height:17px;fill:none;stroke:#718197;stroke-width:1.8;stroke-linecap:round}
  .sbl4-drawer-search input{width:100%;min-width:0;border:0;outline:0;background:transparent;color:var(--sbl4-text);font-size:12px}
  .sbl4-drawer-live{
    width:100%;height:43px;margin-top:8px;border:0;border-radius:13px;
    background:linear-gradient(135deg,#ef3340,#ff5863);color:#fff;font-size:11px;font-weight:850;
    box-shadow:0 8px 18px rgba(239,51,64,.19)
  }
  .sbl4-drawer-live span{margin-right:6px}

  .sbl4-drawer__nav{display:grid!important;grid-template-columns:1fr 1fr;gap:6px;margin-top:10px}
  .sbl4-drawer__nav a{
    display:grid!important;grid-template-columns:26px minmax(0,1fr);align-items:center;gap:7px;
    padding:9px!important;border:1px solid var(--sbl4-border)!important;border-radius:11px!important;background:var(--sbl4-card)
  }
  .sbl4-drawer__nav a span{width:26px;height:26px;border-radius:8px;background:#eaf5ff;color:var(--sbl4-blue);display:grid;place-items:center;font-size:11px}
  .sbl4-drawer__nav a b{font-size:9px;line-height:1.2;color:var(--sbl4-text);white-space:normal}
  [data-theme="dark"] .sbl4-drawer__nav a span{background:#173653}

  .sbl4-drawer__utility{display:flex!important;gap:6px;margin-top:10px;padding-top:10px;border-top:1px solid var(--sbl4-border)}
  .sbl4-drawer__utility button,.sbl4-drawer__utility a{
    flex:1;min-height:37px;display:flex!important;align-items:center;justify-content:center;
    padding:0 8px!important;border:1px solid var(--sbl4-border);border-radius:10px;background:var(--sbl4-card);color:var(--sbl4-text);
    font-size:8.5px!important;font-weight:750
  }

  .sbl4-footer{padding:25px 0 18px!important}
  .sbl4-footer-grid{gap:14px!important}
  .sbl4-footer-brand{padding-bottom:4px}
  .sbl4-footer-brand img{height:43px!important}
  .sbl4-footer-brand h4{margin:0 0 8px!important;font-size:11px!important}
  .sbl4-footer-brand p{max-width:94%;font-size:9.3px!important;line-height:1.65!important}
  .sbl4-footer-group{border-top:1px solid rgba(255,255,255,.08)}
  .sbl4-footer-group summary{display:flex!important;align-items:center;justify-content:space-between;min-height:42px;cursor:pointer}
  .sbl4-footer-group summary h4{margin:0!important;font-size:10.5px!important}
  .sbl4-footer-group summary>span{display:block!important;color:#8ea5bb;font-size:14px;transition:transform .2s ease}
  .sbl4-footer-group[open] summary>span{transform:rotate(180deg)}
  .sbl4-footer-group ul,.sbl4-footer-group>p{padding:0 0 11px!important;margin:0!important}
  .sbl4-footer-group li{margin:5px 0!important}
  .sbl4-footer-group a,.sbl4-footer-group p{font-size:9.5px!important;line-height:1.65!important}
  .sbl4-footer-bottom{font-size:7.5px!important;line-height:1.55!important;margin-top:8px!important}

  .sbl4-player__title{font-size:10.5px!important;line-height:1.15!important}
  .sbl4-player__meta{font-size:7.8px!important;margin-top:2px!important}
  .sbl4-player__live{font-size:7px!important;margin-bottom:2px!important}
}
@media (max-width:390px){
  .sbl4-drawer__nav a{padding:8px!important}
  .sbl4-drawer__nav a b{font-size:8.5px}
}


/* ============================================================
   BETA 10 — EXPLICIT MOBILE MENU CLOSE CONTROL
============================================================ */
.sbl4-drawer__bar{display:none}
@media (max-width:760px){
  .sbl4-drawer__bar{
    display:flex!important;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    margin-bottom:10px;
    padding:1px 1px 9px;
    border-bottom:1px solid var(--sbl4-border)
  }
  .sbl4-drawer__title{display:flex;align-items:center;gap:8px;min-width:0}
  .sbl4-drawer__mark{
    width:34px;height:34px;flex:0 0 34px;
    display:grid;place-items:center;
    border-radius:10px;
    background:linear-gradient(135deg,#0866b5,#14a8ff);
    color:#fff;font-family:"Outfit",sans-serif;font-size:11px;font-weight:900
  }
  .sbl4-drawer__title>div{min-width:0}
  .sbl4-drawer__title strong{display:block;color:var(--sbl4-text);font-size:11px;line-height:1.15}
  .sbl4-drawer__title small{
    display:block;color:var(--sbl4-muted);font-size:7px;line-height:1.3;
    margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis
  }
  .sbl4-drawer-close{
    min-width:69px;height:34px;flex:0 0 auto;
    display:flex;align-items:center;justify-content:center;gap:5px;
    border:1px solid #f2c5c8;border-radius:10px;
    background:#fff4f5;color:#d92f3b;
    font-size:9px;font-weight:850
  }
  .sbl4-drawer-close svg{
    width:14px;height:14px;fill:none;stroke:currentColor;
    stroke-width:2.2;stroke-linecap:round
  }
  [data-theme="dark"] .sbl4-drawer-close{
    background:rgba(239,51,64,.12);
    border-color:rgba(239,51,64,.28);
    color:#ff7b84
  }
}


/* ============================================================
   BETA 11 — INTERNAL PAGE DESIGN SYSTEM
============================================================ */
.sbl4-inner{padding-top:16px}
.sbl4-breadcrumb{display:flex;align-items:center;gap:8px;margin:0 0 14px;font-size:10px;color:var(--sbl4-muted)}
.sbl4-breadcrumb a:hover{color:var(--sbl4-blue)}.sbl4-breadcrumb b{color:var(--sbl4-text)}
.sbl4-page-hero{min-height:170px;border-radius:24px;border:1px solid #dbe9f6;background:radial-gradient(circle at 90% 10%,rgba(20,168,255,.16),transparent 28%),linear-gradient(135deg,#fff,#eff8ff);padding:32px 34px;display:flex;align-items:center;justify-content:space-between;gap:30px;margin-bottom:18px;overflow:hidden}
[data-theme="dark"] .sbl4-page-hero{background:radial-gradient(circle at 90% 10%,rgba(20,168,255,.12),transparent 30%),linear-gradient(135deg,#101c2b,#0c263d);border-color:#1d3850}
.sbl4-page-hero__kicker,.sbl4-inner-kicker{display:block;font-size:9px;letter-spacing:.1em;font-weight:900;color:var(--sbl4-blue);margin-bottom:7px}
.sbl4-page-hero h1{font-family:"Outfit";font-size:36px;line-height:1.03;letter-spacing:-.035em;margin:0 0 9px}.sbl4-page-hero p{max-width:680px;margin:0;color:var(--sbl4-muted);font-size:12.5px}
.sbl4-page-hero__cta,.sbl4-page-hero__buttons a{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 16px;border-radius:999px;background:var(--sbl4-blue);color:#fff;font-size:10px;font-weight:850}
.sbl4-page-hero__buttons{display:flex;gap:8px;flex-wrap:wrap}.sbl4-page-hero__buttons a:last-child{background:#ef3340}
.sbl4-page-hero--dark{color:#fff;border-color:#0e3f68;background:radial-gradient(circle at 85% 15%,rgba(20,168,255,.23),transparent 25%),linear-gradient(135deg,#071d35,#0b3157)}.sbl4-page-hero--dark p{color:#b8cede}.sbl4-page-hero--dark .sbl4-page-hero__kicker{color:#52ceff}
.sbl4-inner-card{background:var(--sbl4-card);border:1px solid var(--sbl4-border);border-radius:20px;padding:20px;box-shadow:0 8px 24px rgba(7,29,53,.04);margin-bottom:18px}
.sbl4-inner-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:14px}.sbl4-inner-head h2{font-family:"Outfit";font-size:20px;margin:0}.sbl4-inner-head a{font-size:9.5px;color:var(--sbl4-blue);font-weight:800}

.sbl4-live-stage{min-height:430px;position:relative;overflow:hidden;border-radius:28px;background:#062d52;color:#fff;margin-bottom:16px;box-shadow:0 18px 42px rgba(7,29,53,.14)}
.sbl4-live-stage__bg{position:absolute;inset:0;background:radial-gradient(circle at 20% 20%,rgba(20,168,255,.24),transparent 26%),linear-gradient(90deg,#063661 0%,#063661 42%,rgba(6,54,97,.2) 70%,rgba(6,54,97,0) 100%);z-index:2}
.sbl4-live-stage__copy{position:relative;z-index:3;width:53%;padding:48px 46px}.sbl4-live-stage__visual{position:absolute;inset:0 0 0 38%;z-index:1}.sbl4-live-stage__visual img{width:100%;height:100%;object-fit:cover}
.sbl4-live-stage__eyebrow{display:flex;align-items:center;gap:8px;font-size:9px;font-weight:900;letter-spacing:.08em}.sbl4-live-stage h1{font-family:"Outfit";font-size:46px;line-height:1;letter-spacing:-.04em;margin:12px 0 10px}.sbl4-live-stage__copy>p{color:#c6ddf1;max-width:520px;font-size:12px}
.sbl4-live-now{margin-top:22px;border:1px solid rgba(255,255,255,.14);background:rgba(4,23,42,.52);backdrop-filter:blur(12px);border-radius:17px;padding:15px 16px}.sbl4-live-now>small{font-size:7px;color:#64d5ff;letter-spacing:.12em;font-weight:900}.sbl4-live-now>strong{display:block;font-family:"Outfit";font-size:21px;margin-top:3px}.sbl4-live-now>span{display:flex;gap:9px;align-items:center;margin-top:3px;font-size:9px}.sbl4-live-now>span b{color:#dff4ff}.sbl4-live-now>span em{font-style:normal;color:#9ab5cc}
.sbl4-live-track{display:flex;align-items:center;gap:9px;margin-top:11px;padding-top:10px;border-top:1px solid rgba(255,255,255,.10)}.sbl4-live-track small{display:block;font-size:6px;color:#8eb2cd}.sbl4-live-track b{font-size:9px}
.sbl4-live-stage__actions{display:flex;gap:8px;margin-top:16px}
.sbl4-inner-grid{display:grid;gap:12px;margin-bottom:16px}.sbl4-inner-grid--3{grid-template-columns:repeat(3,1fr)}
.sbl4-info-tile{background:var(--sbl4-card);border:1px solid var(--sbl4-border);border-radius:16px;padding:15px;display:flex;align-items:center;gap:12px}.sbl4-info-tile>span{width:48px;height:48px;border-radius:13px;background:#eaf5ff;color:var(--sbl4-blue);display:grid;place-items:center;font-family:"Outfit";font-size:15px;font-weight:900}.sbl4-info-tile strong{font-size:11px}.sbl4-info-tile p{font-size:8.5px;color:var(--sbl4-muted);margin:2px 0 0}
.sbl4-live-schedule__row{display:grid;grid-template-columns:90px 32px 1fr auto;align-items:center;gap:10px;padding:10px 4px;border-top:1px solid var(--sbl4-border)}.sbl4-live-schedule__row:first-child{border-top:0}.sbl4-live-schedule__row time{font-size:9px;font-weight:800;color:#516178}.sbl4-live-schedule__row img{width:28px;height:28px;border-radius:50%;object-fit:cover}.sbl4-live-schedule__row strong{display:block;font-size:10px}.sbl4-live-schedule__row span{display:block;font-size:8px;color:var(--sbl4-muted)}.sbl4-live-schedule__row>b{font-size:7px;color:#ef3340;background:#fff0f1;border-radius:999px;padding:4px 7px}

.sbl4-full-days{display:grid;grid-template-columns:repeat(7,1fr);gap:7px;margin-bottom:13px}.sbl4-full-day{height:38px;border:1px solid var(--sbl4-border);border-radius:10px;background:var(--sbl4-surface);color:var(--sbl4-muted);font-size:9px;font-weight:800}.sbl4-full-day.is-active{background:var(--sbl4-blue);border-color:var(--sbl4-blue);color:#fff}
.sbl4-schedule-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:12px}.sbl4-schedule-summary>div{background:var(--sbl4-surface);border:1px solid var(--sbl4-border);border-radius:13px;padding:11px}.sbl4-schedule-summary small{display:block;font-size:6.5px;color:var(--sbl4-muted);letter-spacing:.09em}.sbl4-schedule-summary strong{font-size:10px}
.sbl4-full-slot{display:grid;grid-template-columns:105px 100px 1fr;gap:15px;align-items:center;padding:14px;border-top:1px solid var(--sbl4-border)}.sbl4-full-slot:first-child{border-top:0}.sbl4-full-slot.is-active{background:#f0f9ff;border-radius:15px;border-top-color:transparent}.sbl4-full-slot__time strong{display:block;font-family:"Outfit";font-size:17px;color:var(--sbl4-blue)}.sbl4-full-slot__time span{display:block;font-size:8px;color:var(--sbl4-muted)}.sbl4-full-slot__time b{display:inline-block;margin-top:6px;font-size:6.5px;color:#ef3340}.sbl4-full-slot__image{width:100px;height:62px;border-radius:11px;background:#dce8f3;overflow:hidden}.sbl4-full-slot__image img{width:100%;height:100%;object-fit:cover}.sbl4-full-slot__copy small{font-size:7px;color:var(--sbl4-blue);font-weight:900}.sbl4-full-slot__copy h3{font-size:13px;margin:2px 0}.sbl4-full-slot__copy p{font-size:8.5px;color:var(--sbl4-muted);margin:0 0 4px}.sbl4-full-slot__copy span{font-size:8px;font-weight:700}

.sbl4-program-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.sbl4-program-card{background:var(--sbl4-card);border:1px solid var(--sbl4-border);border-radius:18px;overflow:hidden;box-shadow:0 7px 20px rgba(7,29,53,.04)}.sbl4-program-card__image{height:165px;position:relative;background:#17314d}.sbl4-program-card__image img{width:100%;height:100%;object-fit:cover}.sbl4-program-card__image:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.4),transparent 70%)}.sbl4-program-card__image span{position:absolute;z-index:2;left:11px;bottom:10px;background:#0a79c5;color:#fff;border-radius:999px;padding:4px 7px;font-size:6px;font-weight:900}.sbl4-program-card__body{padding:14px}.sbl4-program-card h2{font-family:"Outfit";font-size:16px;margin:0 0 5px}.sbl4-program-card p{font-size:8.5px;color:var(--sbl4-muted);min-height:28px;margin:0}.sbl4-program-card__host{font-size:8px;font-weight:700;margin-top:9px}.sbl4-program-card__slots{display:flex;gap:5px;flex-wrap:wrap;margin-top:10px}.sbl4-program-card__slots span{font-size:6.5px;border:1px solid var(--sbl4-border);background:var(--sbl4-surface);border-radius:999px;padding:4px 7px}

.sbl4-announcer-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.sbl4-announcer-card{background:var(--sbl4-card);border:1px solid var(--sbl4-border);border-radius:18px;overflow:hidden;display:grid;grid-template-columns:140px 1fr;min-height:180px}.sbl4-announcer-card__photo{position:relative;background:linear-gradient(160deg,#eaf5ff,#dbe9f5);display:flex;align-items:flex-end;justify-content:center;overflow:hidden}.sbl4-announcer-card__photo img{max-height:175px;width:auto;object-fit:contain}.sbl4-announcer-card__photo i{position:absolute;width:9px;height:9px;background:#22c55e;border:2px solid #fff;border-radius:50%;right:12px;top:12px}.sbl4-announcer-card__body{padding:17px 14px}.sbl4-announcer-card__body>span{font-size:6.5px;color:var(--sbl4-blue);font-weight:900}.sbl4-announcer-card h2{font-family:"Outfit";font-size:20px;margin:2px 0}.sbl4-announcer-card p{font-size:8px;color:var(--sbl4-muted);margin:0}.sbl4-announcer-card__programs{display:flex;gap:5px;flex-wrap:wrap;margin-top:13px}.sbl4-announcer-card__programs b{font-size:6.5px;padding:4px 7px;border-radius:999px;background:#eef7ff;color:#0b66ac}

.sbl4-on-demand-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}.sbl4-on-demand-card{background:var(--sbl4-card);border:1px solid var(--sbl4-border);border-radius:18px;overflow:hidden;display:grid;grid-template-columns:220px 1fr}.sbl4-on-demand-card__image{position:relative;min-height:145px;background:#11253d;overflow:hidden}.sbl4-on-demand-card__image img{width:100%;height:100%;object-fit:cover}.sbl4-on-demand-card__image>span{position:absolute;right:12px;bottom:12px;width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:#fff;color:#0a2745}.sbl4-on-demand-card>div{padding:15px}.sbl4-on-demand-card small{font-size:6.5px;color:var(--sbl4-blue);font-weight:900}.sbl4-on-demand-card h2{font-family:"Outfit";font-size:16px;line-height:1.15;margin:4px 0 7px}.sbl4-on-demand-card p{font-size:8.5px;color:var(--sbl4-muted);margin:0 0 8px}.sbl4-on-demand-card b{font-size:7px;color:var(--sbl4-muted)}

.sbl4-music-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.sbl4-music-profile{background:var(--sbl4-card);border:1px solid var(--sbl4-border);border-radius:16px;overflow:hidden;padding-bottom:12px}.sbl4-music-profile>div{height:150px;position:relative;background:#17314d}.sbl4-music-profile img{width:100%;height:100%;object-fit:cover}.sbl4-music-profile>div:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.55),transparent 70%)}.sbl4-music-profile>div span{position:absolute;z-index:2;left:9px;bottom:8px;color:#4cd6ff;font-size:6px;font-weight:900}.sbl4-music-profile h2{font-family:"Outfit";font-size:14px;line-height:1.2;margin:10px 11px 4px}.sbl4-music-profile p{font-size:8px;color:var(--sbl4-muted);margin:0 11px}

.sbl4-public-page-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:18px}.sbl4-public-page-card{display:grid;grid-template-columns:38px 1fr auto;align-items:center;gap:10px;background:var(--sbl4-card);border:1px solid var(--sbl4-border);border-radius:16px;padding:14px}.sbl4-public-page-card>span{width:38px;height:38px;border-radius:11px;background:#eaf5ff;color:var(--sbl4-blue);display:grid;place-items:center;font-size:13px}.sbl4-public-page-card h2{font-size:11px;margin:0 0 3px}.sbl4-public-page-card p{font-size:7.5px;color:var(--sbl4-muted);margin:0}.sbl4-public-page-card>b{color:var(--sbl4-blue)}.sbl4-public-content{font-size:11px;line-height:1.75}

.sbl4-warta-page-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.sbl4-warta-feature{grid-column:1/-1;background:var(--sbl4-card);border:1px solid var(--sbl4-border);border-radius:18px;padding:12px;display:grid;grid-template-columns:1.15fr 1fr;gap:18px}.sbl4-warta-card{background:var(--sbl4-card);border:1px solid var(--sbl4-border);border-radius:16px;overflow:hidden}.sbl4-warta-image{display:block;height:150px;background:#dce8f3;overflow:hidden}.sbl4-warta-feature .sbl4-warta-image{height:250px;border-radius:13px}.sbl4-warta-image img{width:100%;height:100%;object-fit:cover}.sbl4-warta-feature>div{align-self:center}.sbl4-warta-feature small,.sbl4-warta-card small{font-size:6.5px;color:var(--sbl4-muted)}.sbl4-warta-feature h2{font-family:"Outfit";font-size:26px;line-height:1.05;margin:5px 0 8px}.sbl4-warta-feature p{font-size:9px;color:var(--sbl4-muted)}.sbl4-warta-card>div{padding:11px}.sbl4-warta-card h2{font-size:11px;line-height:1.3;margin:4px 0}
.sbl4-empty-state{padding:30px;text-align:center;background:var(--sbl4-card);border:1px solid var(--sbl4-border);border-radius:16px;color:var(--sbl4-muted)}

@media(max-width:1100px){
 .sbl4-program-grid,.sbl4-announcer-grid{grid-template-columns:repeat(2,1fr)}.sbl4-music-grid{grid-template-columns:repeat(3,1fr)}.sbl4-public-page-grid{grid-template-columns:repeat(2,1fr)}
 .sbl4-on-demand-grid{grid-template-columns:1fr}
}
@media(max-width:760px){
 .sbl4-inner{padding-top:10px}.sbl4-breadcrumb{font-size:8px;margin-bottom:9px}
 .sbl4-page-hero{min-height:0;border-radius:17px;padding:18px 15px;display:block}.sbl4-page-hero h1{font-size:25px}.sbl4-page-hero p{font-size:9.5px}.sbl4-page-hero__kicker{font-size:7px}.sbl4-page-hero__cta,.sbl4-page-hero__buttons{margin-top:12px}.sbl4-page-hero__buttons a{min-height:38px;font-size:9px}
 .sbl4-live-stage{min-height:430px;border-radius:20px}.sbl4-live-stage__visual{inset:0}.sbl4-live-stage__visual img{object-position:64% center}.sbl4-live-stage__bg{background:linear-gradient(90deg,rgba(4,36,80,.96),rgba(4,36,80,.84) 52%,rgba(4,36,80,.22))}.sbl4-live-stage__copy{width:76%;padding:24px 15px}.sbl4-live-stage h1{font-size:30px}.sbl4-live-stage__copy>p{font-size:9px}.sbl4-live-now{padding:11px}.sbl4-live-now>strong{font-size:16px}.sbl4-live-stage__actions{flex-wrap:wrap}
 .sbl4-inner-grid--3{grid-template-columns:1fr}.sbl4-info-tile{padding:11px}.sbl4-info-tile>span{width:42px;height:42px}
 .sbl4-inner-card{border-radius:16px;padding:13px}.sbl4-inner-head h2{font-size:16px}
 .sbl4-live-schedule__row{grid-template-columns:68px 28px 1fr auto;gap:7px}.sbl4-live-schedule__row time{font-size:7px}
 .sbl4-full-days{gap:4px}.sbl4-full-day{height:34px;font-size:7px}.sbl4-schedule-summary{grid-template-columns:1fr}.sbl4-full-slot{grid-template-columns:75px 1fr;gap:9px;padding:11px 2px}.sbl4-full-slot__image{width:75px;height:54px;grid-column:1}.sbl4-full-slot__time{grid-column:1;grid-row:2}.sbl4-full-slot__copy{grid-column:2;grid-row:1/3}.sbl4-full-slot__copy h3{font-size:11px}
 .sbl4-program-grid,.sbl4-announcer-grid,.sbl4-on-demand-grid,.sbl4-music-grid,.sbl4-public-page-grid,.sbl4-warta-page-grid{grid-template-columns:1fr}
 .sbl4-program-card__image{height:165px}.sbl4-announcer-card{grid-template-columns:115px 1fr;min-height:155px}.sbl4-announcer-card__photo img{max-height:150px}.sbl4-announcer-card h2{font-size:17px}
 .sbl4-on-demand-card{grid-template-columns:1fr}.sbl4-on-demand-card__image{min-height:180px}.sbl4-music-profile>div{height:180px}
 .sbl4-public-page-card{padding:12px}
 .sbl4-warta-feature{grid-column:auto;display:block}.sbl4-warta-feature .sbl4-warta-image{height:200px}.sbl4-warta-feature>div{padding:11px 2px}.sbl4-warta-feature h2{font-size:19px}.sbl4-warta-card{display:grid;grid-template-columns:95px 1fr}.sbl4-warta-card .sbl4-warta-image{height:75px}.sbl4-warta-card>div{padding:9px}
}


/* ============================================================
   BETA 12 — INTERNAL PAGE HARDENING / EDITORIAL
============================================================ */
.sbl4-archive-head,.sbl4-search-page-head{background:var(--sbl4-card);border:1px solid var(--sbl4-border);border-radius:20px;padding:25px 28px;margin-bottom:14px}
.sbl4-archive-head h1,.sbl4-search-page-head h1{font-family:"Outfit";font-size:32px;line-height:1.05;letter-spacing:-.03em;margin:0}.sbl4-archive-head p{font-size:10px;color:var(--sbl4-muted);margin:7px 0 0}
.sbl4-archive-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px}.sbl4-archive-card{min-width:0;background:var(--sbl4-card);border:1px solid var(--sbl4-border);border-radius:17px;overflow:hidden;box-shadow:0 7px 22px rgba(7,29,53,.035)}
.sbl4-archive-card__image{height:160px;background:linear-gradient(135deg,#0a3358,#0b76c5);display:grid;place-items:center;overflow:hidden}.sbl4-archive-card__image img{width:100%;height:100%;object-fit:cover}.sbl4-archive-card__image>span{font-family:"Outfit";font-size:24px;font-weight:900;color:rgba(255,255,255,.8)}
.sbl4-archive-card__body{padding:13px}.sbl4-archive-card small{font-size:7px;color:var(--sbl4-muted)}.sbl4-archive-card h2{font-family:"Outfit";font-size:15px;line-height:1.2;margin:5px 0 6px}.sbl4-archive-card p{font-size:8px;color:var(--sbl4-muted);margin:0 0 9px}.sbl4-archive-card__more{font-size:7.5px;color:var(--sbl4-blue);font-weight:850}
.sbl4-pagination{margin:18px 0}.sbl4-pagination .nav-links{display:flex;align-items:center;justify-content:center;gap:6px;flex-wrap:wrap}.sbl4-pagination a,.sbl4-pagination span{min-width:34px;height:34px;padding:0 9px;border:1px solid var(--sbl4-border);border-radius:9px;background:var(--sbl4-card);display:inline-flex;align-items:center;justify-content:center;font-size:8px}.sbl4-pagination .current{background:var(--sbl4-blue);color:#fff;border-color:var(--sbl4-blue)}
.sbl4-search-page-head form,.sbl4-404 form{display:flex;gap:7px;margin-top:15px;max-width:540px}.sbl4-search-page-head input,.sbl4-404 input{height:42px;flex:1;min-width:0;border:1px solid var(--sbl4-border);background:var(--sbl4-surface);color:var(--sbl4-text);border-radius:11px;padding:0 12px;font-size:10px;outline:0}.sbl4-search-page-head button,.sbl4-404 button{height:42px;border:0;border-radius:11px;background:var(--sbl4-blue);color:#fff;padding:0 16px;font-size:9px;font-weight:850}
.sbl4-article{max-width:980px;margin:0 auto 20px}.sbl4-article__head{text-align:center;padding:18px 45px 24px}.sbl4-article__category{display:inline-flex;padding:5px 9px;border-radius:999px;background:#eaf5ff;color:var(--sbl4-blue);font-size:7px;font-weight:900;letter-spacing:.08em;text-transform:uppercase}
.sbl4-article__head h1{font-family:"Outfit";font-size:clamp(36px,4vw,54px);line-height:1.01;letter-spacing:-.045em;margin:10px auto 12px;max-width:900px}.sbl4-article__meta{display:flex;align-items:center;justify-content:center;gap:8px;color:var(--sbl4-muted);font-size:8px}.sbl4-article__meta i{width:3px;height:3px;background:#9cb0c1;border-radius:50%}
.sbl4-article__hero{margin:0 0 16px;border-radius:20px;overflow:hidden;background:#dce8f3}.sbl4-article__hero img{width:100%;max-height:560px;object-fit:cover}
.sbl4-article__body{background:var(--sbl4-card);border:1px solid var(--sbl4-border);border-radius:19px;padding:34px 48px;font-size:14px;line-height:1.82;color:var(--sbl4-text);box-shadow:0 8px 28px rgba(7,29,53,.035)}
.sbl4-article__body>p:first-child{font-size:15px;line-height:1.75}.sbl4-article__body h2{font-size:24px;margin:30px 0 10px}.sbl4-article__body h3{font-size:19px;margin:24px 0 8px}.sbl4-article__body p{margin:0 0 16px}.sbl4-article__body ul,.sbl4-article__body ol{padding-left:22px}.sbl4-article__body blockquote{margin:22px 0;padding:16px 19px;border-left:4px solid var(--sbl4-blue);background:var(--sbl4-surface);border-radius:0 12px 12px 0}.sbl4-article__body figure{margin:24px 0}.sbl4-article__body img{width:auto;max-width:100%;height:auto;margin-inline:auto}.sbl4-article__body iframe{max-width:100%;border-radius:14px}
.sbl4-article__footer{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-top:12px;padding:14px 17px;border:1px solid var(--sbl4-border);background:var(--sbl4-card);border-radius:15px}.sbl4-article__footer strong{display:block;font-size:10px}.sbl4-article__footer span{font-size:7.5px;color:var(--sbl4-muted)}.sbl4-article__share{display:flex;gap:6px}.sbl4-article__share a{padding:7px 10px;border:1px solid var(--sbl4-border);border-radius:999px;font-size:7.5px;font-weight:800}
.sbl4-related{max-width:980px;margin:0 auto 20px}.sbl4-related-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.sbl4-related-card{background:var(--sbl4-card);border:1px solid var(--sbl4-border);border-radius:15px;padding-bottom:11px;overflow:hidden}.sbl4-related-card>div{height:105px;background:linear-gradient(135deg,#0a3358,#0b76c5);display:grid;place-items:center}.sbl4-related-card img{width:100%;height:100%;object-fit:cover}.sbl4-related-card>div>span{color:#fff;font-family:"Outfit";font-weight:900}.sbl4-related-card small{display:block;font-size:6.5px;color:var(--sbl4-muted);margin:9px 10px 3px}.sbl4-related-card h3{font-size:10px;line-height:1.25;margin:0 10px}
.sbl4-static-content{max-width:1000px;margin:0 auto 18px;background:var(--sbl4-card);border:1px solid var(--sbl4-border);border-radius:18px;padding:26px 30px;font-size:12.5px;line-height:1.8}.sbl4-page-hero--compact{min-height:130px}
.sbl4-404{text-align:center;background:var(--sbl4-card);border:1px solid var(--sbl4-border);border-radius:24px;padding:55px 20px;margin:0 auto 20px}.sbl4-404 h1{font-family:"Outfit";font-size:82px;line-height:.9;margin:10px 0;color:var(--sbl4-navy)}[data-theme="dark"] .sbl4-404 h1{color:#fff}.sbl4-404 h2{font-size:18px;margin:0}.sbl4-404>p{font-size:10px;color:var(--sbl4-muted);max-width:560px;margin:9px auto}.sbl4-404 form{margin:18px auto}.sbl4-404__links{display:flex;justify-content:center;gap:7px;flex-wrap:wrap}.sbl4-404__links a{padding:8px 11px;border:1px solid var(--sbl4-border);border-radius:999px;font-size:8px;font-weight:800}.sbl4-404__signal{height:56px;display:flex;align-items:end;justify-content:center;gap:4px}.sbl4-404__signal span{width:5px;background:var(--sbl4-sky);border-radius:4px}.sbl4-404__signal span:nth-child(1){height:18px}.sbl4-404__signal span:nth-child(2){height:34px}.sbl4-404__signal span:nth-child(3){height:48px}.sbl4-404__signal i{width:48px;height:48px;margin-left:8px;border-radius:50%;background:#edf7ff;color:var(--sbl4-blue);display:grid;place-items:center;font-family:"Outfit";font-size:22px;font-style:normal;font-weight:900}
@media(max-width:900px){.sbl4-archive-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:760px){
 .sbl4-archive-head,.sbl4-search-page-head{border-radius:16px;padding:17px 14px}.sbl4-archive-head h1,.sbl4-search-page-head h1{font-size:24px}
 .sbl4-archive-grid{grid-template-columns:1fr;gap:8px}.sbl4-archive-card{display:grid;grid-template-columns:112px 1fr}.sbl4-archive-card__image{height:100%;min-height:106px}.sbl4-archive-card__body{padding:10px}.sbl4-archive-card h2{font-size:12px}.sbl4-archive-card p{display:none}
 .sbl4-article__head{padding:8px 2px 18px;text-align:left}.sbl4-article__head h1{font-size:30px;margin:8px 0 10px}.sbl4-article__meta{justify-content:flex-start;flex-wrap:wrap;font-size:7.5px}.sbl4-article__hero{border-radius:15px}.sbl4-article__body{border-radius:16px;padding:18px 15px;font-size:12px;line-height:1.78}.sbl4-article__body>p:first-child{font-size:13px}.sbl4-article__body h2{font-size:20px}.sbl4-article__body h3{font-size:17px}.sbl4-article__footer{display:block}.sbl4-article__share{margin-top:10px}
 .sbl4-related-grid{grid-template-columns:1fr}.sbl4-related-card{display:grid;grid-template-columns:105px 1fr;grid-template-rows:auto auto}.sbl4-related-card>div{grid-row:1/3;height:82px}.sbl4-related-card small{margin-top:12px}.sbl4-related-card h3{font-size:10px}
 .sbl4-static-content{border-radius:16px;padding:17px 14px;font-size:11.5px}.sbl4-404{padding:38px 14px;border-radius:18px}.sbl4-404 h1{font-size:62px}.sbl4-404 h2{font-size:15px}
}


/* ============================================================
   BETA 13 — PROGRAM / PENYIAR / PODCAST + ROUTE RECOVERY
============================================================ */
.sbl4-program-page-summary,.sbl4-podcast-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:-4px 0 16px}.sbl4-program-page-summary>div,.sbl4-podcast-stats>div{background:var(--sbl4-card);border:1px solid var(--sbl4-border);border-radius:14px;padding:12px 14px}.sbl4-program-page-summary small,.sbl4-podcast-stats small{display:block;font-size:6.5px;letter-spacing:.08em;color:var(--sbl4-muted);font-weight:900}.sbl4-program-page-summary strong,.sbl4-podcast-stats strong{display:block;font-size:11px;margin:2px 0}.sbl4-program-page-summary span,.sbl4-podcast-stats span{display:block;font-size:7.5px;color:var(--sbl4-muted)}
.sbl4-program-grid--rich .sbl4-program-card__image{height:180px}.sbl4-program-card--rich .sbl4-program-card__image>span{max-width:58%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sbl4-program-status{position:absolute;z-index:3;right:10px;bottom:10px;padding:4px 7px;border-radius:999px;background:#dcfce7;color:#13753b;font-size:5.8px;font-weight:900}.sbl4-program-status.is-special{background:#fff5d9;color:#9a6b00}.sbl4-program-card--rich .sbl4-program-card__body{display:flex;flex-direction:column;min-height:248px}.sbl4-program-card--rich .sbl4-program-card__body>p{min-height:52px;line-height:1.55}.sbl4-program-card__meta{font-size:7.5px;font-weight:750;color:var(--sbl4-text);margin-top:9px}.sbl4-program-variants{display:flex;gap:4px;flex-wrap:wrap;margin-top:7px}.sbl4-program-variants i{font-style:normal;font-size:6px;color:#316b98;background:#edf7ff;border-radius:999px;padding:4px 6px}.sbl4-program-card--rich .sbl4-program-card__slots{margin-top:9px}.sbl4-program-card__actions{display:flex;gap:6px;margin-top:auto;padding-top:11px}.sbl4-program-card__actions a{flex:1;min-height:34px;border:1px solid var(--sbl4-border);border-radius:9px;display:flex;align-items:center;justify-content:center;font-size:7.5px;font-weight:850}.sbl4-program-card__actions a.is-primary{background:var(--sbl4-blue);border-color:var(--sbl4-blue);color:#fff}
.sbl4-crew-toolbar,.sbl4-podcast-toolbar{display:flex;align-items:center;justify-content:space-between;gap:14px;background:var(--sbl4-card);border:1px solid var(--sbl4-border);border-radius:15px;padding:12px 14px;margin-bottom:12px}.sbl4-crew-toolbar strong{display:block;font-size:10px}.sbl4-crew-toolbar>div>span{display:block;font-size:7.5px;color:var(--sbl4-muted);margin-top:2px}.sbl4-crew-toolbar label,.sbl4-podcast-toolbar label{width:min(310px,42%);height:38px;border:1px solid var(--sbl4-border);background:var(--sbl4-surface);border-radius:10px;display:flex;align-items:center;gap:7px;padding:0 10px}.sbl4-crew-toolbar input,.sbl4-podcast-toolbar input{border:0;outline:0;background:transparent;color:var(--sbl4-text);font-size:9px;width:100%}
.sbl4-announcer-grid--rich{grid-template-columns:repeat(2,1fr)}.sbl4-announcer-card--rich{grid-template-columns:155px 1fr;min-height:250px}.sbl4-announcer-card--rich.is-selected{outline:2px solid var(--sbl4-blue);outline-offset:2px}.sbl4-announcer-card--rich .sbl4-announcer-card__photo img{max-height:240px}.sbl4-announcer-live{position:absolute;left:10px;top:10px;display:none;background:#ef3340;color:#fff;font-size:5.8px;font-weight:900;border-radius:999px;padding:4px 6px}.sbl4-announcer-card--rich.is-onair .sbl4-announcer-live{display:block}.sbl4-announcer-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;margin:12px 0 9px}.sbl4-announcer-metrics>div{text-align:center;background:var(--sbl4-surface);border:1px solid var(--sbl4-border);border-radius:9px;padding:6px 3px}.sbl4-announcer-metrics strong{display:block;font-family:"Outfit";font-size:13px}.sbl4-announcer-metrics small{font-size:5.8px;color:var(--sbl4-muted)}.sbl4-announcer-next{border-top:1px solid var(--sbl4-border);margin-top:9px;padding-top:8px}.sbl4-announcer-next>small{display:block;font-size:5.5px;color:var(--sbl4-muted);letter-spacing:.08em;font-weight:900;margin-bottom:5px}.sbl4-announcer-next span{display:flex;align-items:center;gap:7px;font-size:6.5px;color:var(--sbl4-muted);margin-top:3px}.sbl4-announcer-next span b{min-width:93px;color:var(--sbl4-text)}
.sbl4-podcast-hero{display:grid;grid-template-columns:86px 1fr;gap:18px;align-items:center;background:radial-gradient(circle at 90% 10%,rgba(29,185,84,.14),transparent 25%),linear-gradient(135deg,#071d35,#0a3157);border-radius:22px;padding:25px 28px;color:#fff;margin-bottom:12px}.sbl4-podcast-brand{width:86px;height:86px;background:#fff;border-radius:20px;padding:9px;display:grid;place-items:center;box-shadow:0 12px 25px rgba(0,0,0,.18)}.sbl4-podcast-brand img{width:100%;height:100%;object-fit:contain}.sbl4-podcast-brand>span{font-family:"Outfit";font-size:28px;font-weight:900;color:#0b6db5}.sbl4-podcast-hero__copy>span{font-size:7px;color:#5dd6ff;font-weight:900;letter-spacing:.1em}.sbl4-podcast-hero h1{font-family:"Outfit";font-size:31px;line-height:1.03;margin:4px 0 7px}.sbl4-podcast-hero h1 em{font-style:normal;color:#69e49a}.sbl4-podcast-hero p{font-size:9px;line-height:1.6;color:#bed3e4;max-width:790px;margin:0}.sbl4-podcast-hero__copy>div{display:flex;gap:7px;margin-top:12px}.sbl4-podcast-hero__copy a{padding:8px 11px;border-radius:999px;background:#ef3340;color:#fff;font-size:7.5px;font-weight:850}.sbl4-podcast-hero__copy a.is-spotify{background:#1db954;color:#07130b}
.sbl4-spotify-player-card{position:relative;display:grid;grid-template-columns:1fr auto;align-items:center;gap:18px;background:linear-gradient(135deg,#111,#14271b);border-radius:18px;padding:18px 20px;color:#fff;margin-bottom:13px;overflow:hidden}.sbl4-spotify-player-card>div:first-child>span{font-size:6.5px;color:#1db954;font-weight:900;letter-spacing:.1em}.sbl4-spotify-player-card h2{font-family:"Outfit";font-size:18px;margin:3px 0}.sbl4-spotify-player-card p{font-size:7.5px;color:#aeb9b2;margin:0}.sbl4-spotify-facade{min-width:185px;height:56px;border:1px solid rgba(255,255,255,.12);border-radius:13px;background:#1db954;color:#07130b;display:grid;grid-template-columns:36px 1fr;grid-template-rows:1fr 1fr;align-items:center;text-align:left;padding:7px 10px;cursor:pointer}.sbl4-spotify-facade i{grid-row:1/3;width:34px;height:34px;border-radius:50%;background:#0c1a11;color:#fff;display:grid;place-items:center;font-style:normal}.sbl4-spotify-facade b{font-size:8px;align-self:end}.sbl4-spotify-facade small{font-size:6px;align-self:start;opacity:.7}.sbl4-spotify-embed{grid-column:1/-1;margin-top:4px}.sbl4-spotify-embed iframe{border-radius:12px}.sbl4-podcast-toolbar h2{font-family:"Outfit";font-size:18px;margin:0}.sbl4-on-demand-grid--podcast .sbl4-on-demand-card__image>i{position:absolute;right:12px;bottom:12px;width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:#fff;color:#0a2745;font-style:normal}.sbl4-on-demand-grid--podcast .sbl4-on-demand-card__image>span:not(.sbl4-podcast-fallback){display:none}.sbl4-podcast-fallback{font-family:"Outfit";font-weight:900;color:#fff;text-align:center;font-size:22px;line-height:.95}.sbl4-archive-head{display:flex;align-items:center;justify-content:space-between;gap:16px}.sbl4-archive-head__cta{flex:0 0 auto;border-radius:999px;padding:9px 12px;background:var(--sbl4-blue);color:#fff;font-size:8px;font-weight:850}.sbl4-archive-card.is-podcast .sbl4-archive-card__image{background:linear-gradient(135deg,#0b2b4b,#1079bd)}
@media(max-width:1100px){.sbl4-announcer-grid--rich{grid-template-columns:1fr}.sbl4-program-grid--rich{grid-template-columns:repeat(2,1fr)}}
@media(max-width:760px){
 .sbl4-program-page-summary,.sbl4-podcast-stats{grid-template-columns:1fr;gap:6px}.sbl4-program-page-summary>div,.sbl4-podcast-stats>div{padding:10px 11px}.sbl4-program-grid--rich{grid-template-columns:1fr}.sbl4-program-card--rich .sbl4-program-card__body{min-height:0}.sbl4-program-card--rich .sbl4-program-card__body>p{min-height:0}
 .sbl4-crew-toolbar,.sbl4-podcast-toolbar{display:block}.sbl4-crew-toolbar label,.sbl4-podcast-toolbar label{width:100%;margin-top:9px}.sbl4-announcer-card--rich{grid-template-columns:112px 1fr;min-height:220px}.sbl4-announcer-card--rich .sbl4-announcer-card__photo img{max-height:205px}.sbl4-announcer-metrics{gap:3px}.sbl4-announcer-next span{display:block}.sbl4-announcer-next span b{display:block;margin-bottom:1px}
 .sbl4-podcast-hero{grid-template-columns:58px 1fr;padding:17px 14px;border-radius:17px;gap:11px}.sbl4-podcast-brand{width:58px;height:58px;border-radius:14px;padding:6px}.sbl4-podcast-hero h1{font-size:22px}.sbl4-podcast-hero p{font-size:8px}.sbl4-podcast-hero__copy>div{grid-column:1/-1;flex-wrap:wrap}.sbl4-spotify-player-card{grid-template-columns:1fr;padding:15px}.sbl4-spotify-facade{width:100%;min-width:0}.sbl4-archive-head{display:block}.sbl4-archive-head__cta{display:inline-flex;margin-top:10px}
}


/* ============================================================
   BETA 15 — PROFESSIONAL TYPE SCALE + REALTIME DATA UI
   Sasaran: keterbacaan media profesional tanpa merusak layout.
============================================================ */
:root{
  --sbl4-type-xs:11px;
  --sbl4-type-sm:12px;
  --sbl4-type-md:14px;
  --sbl4-type-base:15px;
  --sbl4-type-lg:17px;
  --sbl4-type-xl:20px;
  --sbl4-type-section:22px;
}
body{font-size:var(--sbl4-type-base);line-height:1.6}

/* Header */
.sbl4-topbar{font-size:12px}
.sbl4-pill-live{font-size:11px}
.sbl4-brand__fallback strong,.sbl4-brand__copy strong{font-size:14px}
.sbl4-brand__fallback span,.sbl4-brand__copy small{font-size:10px}
.sbl4-nav a{font-size:13.5px;padding:10px 10px}
.sbl4-listen{font-size:12px}
.sbl4-ticker__label{font-size:10px}
.sbl4-ticker__item{font-size:12px}

/* Homepage */
.sbl4-hero__badge{font-size:11px}
.sbl4-hero__meta{font-size:15px}
.sbl4-hero__desc{font-size:14px}
.sbl4-btn-primary,.sbl4-btn-outline{font-size:12px}
.sbl4-nowtrack span{font-size:10.5px}
.sbl4-nowtrack strong{font-size:13px}
.sbl4-next small{font-size:10.5px}
.sbl4-next strong{font-size:15px}
.sbl4-next span{font-size:11px}
.sbl4-title{font-size:var(--sbl4-type-section)}
.sbl4-sub{font-size:12px;line-height:1.45}
.sbl4-link{font-size:11.5px}
.sbl4-day{font-size:11px}
.sbl4-time{font-size:11px}
.sbl4-program{font-size:13px}
.sbl4-host{font-size:11px}
.sbl4-onair{font-size:9px}
.sbl4-segment button{font-size:11px}
.sbl4-rank{font-size:17px}
.sbl4-song strong{font-size:13px}
.sbl4-song span{font-size:11px}
.sbl4-trend{font-size:10px}
.sbl4-chart-go{font-size:10px}
.sbl4-chart-footer strong{font-size:11px}
.sbl4-chart-footer span{font-size:10.5px}
.sbl4-chart-footer a{font-size:10.5px}
.sbl4-feature-media small{font-size:11px}
.sbl4-feature-media strong{font-size:22px}
.sbl4-media-tag{font-size:10px}
.sbl4-filter-row a{font-size:10.5px;min-height:32px}
.sbl4-news-lead__copy p{font-size:13px}
.sbl4-meta{font-size:10.5px}
.sbl4-news-mini strong{font-size:12px}
.sbl4-news-mini__tag{font-size:9.5px}
.sbl4-music-card strong{font-size:12px}
.sbl4-crew-card strong{font-size:11.5px}
.sbl4-crew-card>span{font-size:10px}
.sbl4-public b{font-size:11.5px}
.sbl4-public span{font-size:10.5px}

/* Weather */
.sbl4-weather__kicker{font-size:10px}
.sbl4-weather__head strong{font-size:12px}
.sbl4-weather__condition{font-size:13px}
.sbl4-weather__feels{font-size:10.5px}
.sbl4-weather__range{font-size:10.5px}
.sbl4-weather__range strong{font-size:12px}
.sbl4-weather__metrics small{font-size:10px}
.sbl4-weather__metrics strong{font-size:11px}
.sbl4-weather__alert b{font-size:10px}
.sbl4-weather-day span{font-size:9.5px}
.sbl4-weather-day strong{font-size:11px}
.sbl4-weather-day small{font-size:9.5px}
.sbl4-weather__foot,.sbl4-weather__foot small{font-size:9.5px}

/* Internal shared */
.sbl4-breadcrumb{font-size:12px}
.sbl4-page-hero__kicker,.sbl4-inner-kicker{font-size:11px}
.sbl4-page-hero h1{font-size:40px}
.sbl4-page-hero p{font-size:14px;line-height:1.65}
.sbl4-page-hero__cta,.sbl4-page-hero__buttons a{font-size:12px}
.sbl4-inner-head h2{font-size:22px}
.sbl4-inner-head a{font-size:11.5px}
.sbl4-info-tile strong{font-size:13px}
.sbl4-info-tile p{font-size:11px}

/* Live */
.sbl4-live-stage__eyebrow{font-size:11px}
.sbl4-live-stage__copy>p{font-size:14px}
.sbl4-live-now>small{font-size:10px}
.sbl4-live-now>span{font-size:12px}
.sbl4-live-track small{font-size:9.5px}
.sbl4-live-track b{font-size:12px}
.sbl4-live-schedule__row time{font-size:11px}
.sbl4-live-schedule__row strong{font-size:13px}
.sbl4-live-schedule__row span{font-size:11px}
.sbl4-live-schedule__row>b{font-size:9.5px}

/* Schedule */
.sbl4-full-day{font-size:11.5px;min-height:42px}
.sbl4-schedule-summary small{font-size:10px}
.sbl4-schedule-summary strong{font-size:13px}
.sbl4-full-slot__time span{font-size:10.5px}
.sbl4-full-slot__time b{font-size:9.5px}
.sbl4-full-slot__copy small{font-size:10px}
.sbl4-full-slot__copy h3{font-size:16px}
.sbl4-full-slot__copy p{font-size:11.5px}
.sbl4-full-slot__copy span{font-size:11px}

/* Program */
.sbl4-program-card h2{font-size:18px}
.sbl4-program-card p{font-size:12px;line-height:1.6}
.sbl4-program-card__host,.sbl4-program-card__meta{font-size:11px}
.sbl4-program-card__slots span{font-size:10px}
.sbl4-program-page-summary small{font-size:10px}
.sbl4-program-page-summary strong{font-size:14px}
.sbl4-program-page-summary span{font-size:11px}
.sbl4-program-status{font-size:9.5px}
.sbl4-program-status.is-syncing{background:#edf3f8;color:#627589}
.sbl4-program-variants i{font-size:9.5px}
.sbl4-program-card__actions a{font-size:11px}

/* Penyiar */
.sbl4-crew-toolbar strong{font-size:13px}
.sbl4-crew-toolbar>div>span{font-size:11px}
.sbl4-crew-toolbar input{font-size:13px}
.sbl4-announcer-card__body>span{font-size:10px}
.sbl4-announcer-card h2{font-size:21px}
.sbl4-announcer-card p{font-size:11px}
.sbl4-announcer-card__programs b{font-size:10px}
.sbl4-announcer-card__programs .is-loading,.sbl4-announcer-card__programs .is-empty{font-weight:700;color:var(--sbl4-muted);background:var(--sbl4-surface)}
.sbl4-announcer-live{font-size:9px}
.sbl4-announcer-metrics strong{font-size:16px}
.sbl4-announcer-metrics small{font-size:9.5px}
.sbl4-announcer-next>small{font-size:9.5px}
.sbl4-announcer-next span{font-size:10.5px;line-height:1.45}
.sbl4-announcer-data-message{color:var(--sbl4-muted)}
.sbl4-announcer-card--rich.is-data-pending{opacity:.86}

/* Podcast */
.sbl4-podcast-hero__copy>span{font-size:10px}
.sbl4-podcast-hero p{font-size:12.5px}
.sbl4-podcast-hero__copy a{font-size:11px}
.sbl4-podcast-stats small{font-size:10px}
.sbl4-podcast-stats strong{font-size:14px}
.sbl4-podcast-stats span{font-size:11px}
.sbl4-podcast-toolbar input{font-size:13px}
.sbl4-spotify-player-card>div:first-child>span{font-size:10px}
.sbl4-spotify-player-card p{font-size:11px}
.sbl4-spotify-facade b{font-size:11px}
.sbl4-spotify-facade small{font-size:10px}
.sbl4-on-demand-card small{font-size:10px}
.sbl4-on-demand-card p{font-size:12px}
.sbl4-on-demand-card b{font-size:10.5px}

/* Musik / publik / warta / archive */
.sbl4-music-profile p{font-size:11px}
.sbl4-music-profile>div span{font-size:9.5px}
.sbl4-public-page-card h2{font-size:13px}
.sbl4-public-page-card p{font-size:11px}
.sbl4-warta-feature small,.sbl4-warta-card small{font-size:10px}
.sbl4-warta-feature p{font-size:12px}
.sbl4-warta-card h2{font-size:13px}
.sbl4-archive-card small{font-size:10.5px}
.sbl4-archive-card h2{font-size:16px}
.sbl4-archive-card p{font-size:11.5px}
.sbl4-archive-card__more{font-size:10.5px}

/* Articles */
.sbl4-article__meta{font-size:11px}
.sbl4-article__body{font-size:16px;line-height:1.82}
.sbl4-article__body>p:first-child{font-size:17px}
.sbl4-article__footer strong{font-size:12px}
.sbl4-article__footer span{font-size:10.5px}
.sbl4-article__share a{font-size:10.5px}
.sbl4-related-card small{font-size:10px}
.sbl4-related-card h3{font-size:13px}

/* Search / static / 404 */
.sbl4-search-page-head input,.sbl4-404 input{font-size:13px}
.sbl4-search-page-head button,.sbl4-404 button{font-size:11px}
.sbl4-static-content{font-size:14px}
.sbl4-404>p{font-size:13px}
.sbl4-404__links a{font-size:11px}

/* Footer */
.sbl4-footer h4{font-size:13px}
.sbl4-footer p,.sbl4-footer a,.sbl4-footer li{font-size:12px;line-height:1.7}
.sbl4-footer-bottom{font-size:10px}

/* Persistent player */
.sbl4-player__title{font-size:13px}
.sbl4-player__meta{font-size:10.5px}
.sbl4-player__live{font-size:9.5px}
.sbl4-player__next strong{font-size:11.5px}
.sbl4-player__next small,.sbl4-player__next span{font-size:9.5px}

/* Tablet: preserve readability before stacking */
@media (max-width:1100px){
  .sbl4-nav a{font-size:12.5px;padding-inline:7px}
  .sbl4-page-hero h1{font-size:36px}
  .sbl4-title{font-size:20px}
  .sbl4-grid-main{gap:12px}
}

/* Mobile: professional reading sizes and touch targets */
@media (max-width:760px){
  :root{--sbl4-player-h:72px}
  body{font-size:15px;padding-bottom:calc(var(--sbl4-player-h) + env(safe-area-inset-bottom,0px) + 12px)}
  .sbl4-container{width:min(calc(100% - 20px),var(--sbl4-container))}
  .sbl4-header__in{min-height:58px}
  .sbl4-brand__copy strong{font-size:12px!important}
  .sbl4-brand__copy small{font-size:10px!important}
  .sbl4-ticker__item{font-size:11px!important}
  .sbl4-ticker__label{font-size:9.5px!important}

  .sbl4-drawer__title strong{font-size:13px!important}
  .sbl4-drawer__title small{font-size:10.5px!important}
  .sbl4-drawer-close{font-size:12px!important;min-height:40px}
  .sbl4-drawer-live{font-size:13px!important;min-height:46px}
  .sbl4-drawer-search input,
  .sbl4-crew-toolbar input,
  .sbl4-podcast-toolbar input,
  .sbl4-search-page-head input,
  .sbl4-404 input{font-size:16px!important}
  .sbl4-drawer__nav a{min-height:48px}
  .sbl4-drawer__nav a b{font-size:12px!important}
  .sbl4-drawer__utility button,.sbl4-drawer__utility a{font-size:11.5px!important;min-height:42px}

  .sbl4-hero__badge{font-size:10.5px!important}
  .sbl4-hero__meta{font-size:12.5px!important}
  .sbl4-btn-primary,.sbl4-btn-outline{font-size:12px!important;min-height:44px!important}
  .sbl4-nowtrack span{font-size:10px!important}
  .sbl4-nowtrack strong{font-size:12px!important}
  .sbl4-next small{font-size:9.5px!important}
  .sbl4-next strong{font-size:12.5px!important}
  .sbl4-next span{font-size:10px!important}

  .sbl4-title{font-size:19px!important}
  .sbl4-sub{font-size:11.5px!important}
  .sbl4-link{font-size:11px!important}
  .sbl4-day{font-size:11px!important;min-height:40px}
  .sbl4-time{font-size:10.5px!important}
  .sbl4-program{font-size:12.5px!important}
  .sbl4-host{font-size:10.5px!important}
  .sbl4-segment button{font-size:10.5px!important;min-height:36px}
  .sbl4-song strong{font-size:12px!important}
  .sbl4-song span{font-size:10px!important}
  .sbl4-chart-go{font-size:10px!important}
  .sbl4-chart-footer strong{font-size:10.5px!important}
  .sbl4-chart-footer span{font-size:10px!important}
  .sbl4-chart-footer a{font-size:10.5px!important}
  .sbl4-feature-media small{font-size:10px!important}
  .sbl4-media-tag{font-size:9.5px!important}
  .sbl4-filter-row a{font-size:10px!important;min-height:34px}
  .sbl4-news-lead__copy p{font-size:12px!important}
  .sbl4-meta{font-size:10px!important}
  .sbl4-news-mini strong{font-size:11.5px!important}
  .sbl4-news-mini__tag{font-size:9px!important}
  .sbl4-crew-card strong{font-size:11px!important}
  .sbl4-crew-card>span{font-size:9.5px!important}
  .sbl4-public b{font-size:11px!important}
  .sbl4-public span{font-size:10px!important}

  .sbl4-weather__kicker{font-size:9.5px!important}
  .sbl4-weather__head strong{font-size:12px!important}
  .sbl4-weather__condition{font-size:13px!important}
  .sbl4-weather__feels{font-size:10.5px!important}
  .sbl4-weather__metrics small{font-size:9.5px!important}
  .sbl4-weather__metrics strong{font-size:10.5px!important}
  .sbl4-weather-day span{font-size:9px!important}
  .sbl4-weather-day strong{font-size:10.5px!important}
  .sbl4-weather-day small{font-size:9px!important}
  .sbl4-weather__foot,.sbl4-weather__foot small{font-size:9px!important}

  .sbl4-breadcrumb{font-size:10.5px!important}
  .sbl4-page-hero__kicker,.sbl4-inner-kicker{font-size:10px!important}
  .sbl4-page-hero h1{font-size:28px!important}
  .sbl4-page-hero p{font-size:13px!important}
  .sbl4-page-hero__cta,.sbl4-page-hero__buttons a{font-size:11.5px!important;min-height:42px}
  .sbl4-inner-head h2{font-size:19px!important}
  .sbl4-inner-head a{font-size:10.5px!important}

  .sbl4-full-days{display:flex!important;overflow-x:auto;gap:6px;padding-bottom:4px;scroll-snap-type:x proximity;scrollbar-width:none}
  .sbl4-full-days::-webkit-scrollbar{display:none}
  .sbl4-full-day{flex:0 0 64px!important;min-height:44px!important;font-size:11px!important;scroll-snap-align:start}
  .sbl4-schedule-summary small{font-size:9.5px!important}
  .sbl4-schedule-summary strong{font-size:12px!important}
  .sbl4-full-slot__time span{font-size:10px!important}
  .sbl4-full-slot__copy small{font-size:9.5px!important}
  .sbl4-full-slot__copy h3{font-size:13px!important}
  .sbl4-full-slot__copy p{font-size:11px!important}
  .sbl4-full-slot__copy span{font-size:10.5px!important}

  .sbl4-program-page-summary small,.sbl4-podcast-stats small{font-size:9.5px!important}
  .sbl4-program-page-summary strong,.sbl4-podcast-stats strong{font-size:13px!important}
  .sbl4-program-page-summary span,.sbl4-podcast-stats span{font-size:10.5px!important}
  .sbl4-program-card h2{font-size:17px!important}
  .sbl4-program-card p{font-size:12px!important}
  .sbl4-program-card__meta{font-size:10.5px!important}
  .sbl4-program-card__slots span{font-size:9.5px!important}
  .sbl4-program-card__actions a{font-size:11px!important;min-height:40px}

  .sbl4-crew-toolbar{gap:10px}
  .sbl4-crew-toolbar strong{font-size:12.5px!important}
  .sbl4-crew-toolbar>div>span{font-size:10.5px!important}
  .sbl4-announcer-card h2{font-size:19px!important}
  .sbl4-announcer-card p{font-size:11px!important}
  .sbl4-announcer-card__programs b{font-size:9.5px!important}
  .sbl4-announcer-metrics strong{font-size:15px!important}
  .sbl4-announcer-metrics small{font-size:9.5px!important}
  .sbl4-announcer-next>small{font-size:9px!important}
  .sbl4-announcer-next span{font-size:10px!important}

  .sbl4-podcast-hero__copy>span{font-size:9.5px!important}
  .sbl4-podcast-hero p{font-size:12px!important}
  .sbl4-podcast-hero__copy a{font-size:11px!important}
  .sbl4-spotify-player-card p{font-size:10.5px!important}
  .sbl4-spotify-facade b{font-size:11px!important}
  .sbl4-spotify-facade small{font-size:9.5px!important}
  .sbl4-on-demand-card small{font-size:9.5px!important}
  .sbl4-on-demand-card p{font-size:11.5px!important}
  .sbl4-on-demand-card b{font-size:10px!important}

  .sbl4-public-page-card h2{font-size:12.5px!important}
  .sbl4-public-page-card p{font-size:10.5px!important}
  .sbl4-warta-feature small,.sbl4-warta-card small{font-size:9.5px!important}
  .sbl4-warta-feature p{font-size:11.5px!important}
  .sbl4-warta-card h2{font-size:12.5px!important}
  .sbl4-archive-card small{font-size:9.5px!important}
  .sbl4-archive-card h2{font-size:13.5px!important}
  .sbl4-archive-card__more{font-size:10px!important}

  .sbl4-article__meta{font-size:10.5px!important}
  .sbl4-article__body{font-size:15px!important;line-height:1.8!important}
  .sbl4-article__body>p:first-child{font-size:16px!important}
  .sbl4-related-card small{font-size:9.5px!important}
  .sbl4-related-card h3{font-size:12.5px!important}
  .sbl4-static-content{font-size:13px!important}
  .sbl4-404>p{font-size:12px!important}
  .sbl4-404__links a{font-size:10.5px!important;min-height:38px}

  .sbl4-footer-brand p{font-size:11.5px!important}
  .sbl4-footer-group summary h4{font-size:12px!important}
  .sbl4-footer-group a,.sbl4-footer-group p{font-size:11.5px!important}
  .sbl4-footer-bottom{font-size:9.5px!important}
  .sbl4-player{
    min-height:var(--sbl4-player-h);
    padding-bottom:env(safe-area-inset-bottom,0px);
  }
  .sbl4-player__title{font-size:12px!important}
  .sbl4-player__meta{font-size:10px!important}
  .sbl4-player__live{font-size:9px!important}
}

/* Small phones: scale spacing, not text into unreadability */
@media (max-width:390px){
  .sbl4-container{width:min(calc(100% - 16px),var(--sbl4-container))}
  .sbl4-drawer__nav{grid-template-columns:1fr 1fr}
  .sbl4-drawer__nav a{padding:8px!important}
  .sbl4-drawer__nav a b{font-size:11.5px!important}
  .sbl4-hero h1{font-size:28px!important}
  .sbl4-page-hero h1{font-size:26px!important}
}


/* ============================================================
   BETA 16 — DATA QUALITY / SOURCE-OF-TRUTH STATES
============================================================ */
.sbl4-crew-toolbar #sbl4-crew-source-status{display:block;max-width:720px}
.sbl4-announcer-card.is-data-partial .sbl4-announcer-metrics{background:linear-gradient(180deg,#f7fafc,#f2f6f9)}
.sbl4-announcer-card.is-data-partial .sbl4-announcer-metrics strong{color:#738497}
.sbl4-announcer-card.is-data-partial .sbl4-announcer-metrics small{color:#7c8c9c}
.sbl4-data-note{display:block;margin-top:6px;color:#8b6b19;font-style:normal;font-size:10px;line-height:1.4}
.sbl4-program-status.is-syncing{background:#eef3f7!important;color:#607386!important;border-color:#dbe4eb!important}
@media(max-width:760px){
 .sbl4-data-note{font-size:10px!important}
 .sbl4-crew-toolbar #sbl4-crew-source-status{line-height:1.45}
 .sbl4-announcer-card.is-data-partial .sbl4-announcer-metrics{border-color:#e0e7ed}
}


/* ============================================================
   BETA 17 — FINAL POLISH PASS 1
   Header, hero next-card, weather, podcast, warta filters,
   infinite music carousel, crew/public cards, footer & player.
============================================================ */

/* HEADER / NAV — cleaner professional rhythm */
@media (min-width:1181px){
  .sbl4-header__in{height:78px;gap:20px}
  .sbl4-brand{min-width:292px}
  .sbl4-nav{gap:0;justify-content:center}
  .sbl4-nav a{
    position:relative;
    border-radius:0;
    padding:27px 10px 25px;
    font-size:13.5px;
    font-weight:700;
    color:#344054;
    transition:color .18s ease,background-color .18s ease;
  }
  .sbl4-nav a::after{
    content:"";position:absolute;left:50%;right:50%;bottom:15px;height:2px;border-radius:4px;
    background:linear-gradient(90deg,var(--sbl4-blue),var(--sbl4-sky));
    transition:left .18s ease,right .18s ease,opacity .18s ease;opacity:0
  }
  .sbl4-nav a:hover,.sbl4-nav a.is-current{background:transparent;color:var(--sbl4-blue)}
  .sbl4-nav a:hover::after,.sbl4-nav a.is-current::after{left:10px;right:10px;opacity:1}
  .sbl4-head-actions{gap:7px;margin-left:4px}
  .sbl4-iconbtn{width:38px;height:38px}
  .sbl4-listen{min-height:40px;padding-inline:16px}
}
[data-theme="dark"] .sbl4-nav a.is-current,[data-theme="dark"] .sbl4-nav a:hover{color:#5cc9ff}

/* HERO: next programme card is lower, wider and shorter */
.sbl4-next{
  width:320px!important;
  min-height:78px!important;
  grid-template-columns:50px minmax(0,1fr) 18px!important;
  gap:10px!important;
  padding:10px 12px!important;
  border-radius:15px!important;
  background:linear-gradient(135deg,rgba(4,20,39,.86),rgba(7,34,61,.78))!important;
  box-shadow:0 14px 32px rgba(0,0,0,.18);
}
.sbl4-next__thumb{width:50px!important;height:50px!important;border-radius:10px!important}
.sbl4-next small{font-size:10px!important;margin:0!important}
.sbl4-next strong{font-size:13px!important;margin:2px 0!important;line-height:1.25}
.sbl4-next span{font-size:10.5px!important}
.sbl4-hero__studio-label{right:24.5%;bottom:25px}

/* WEATHER: fill available card deliberately, no dead lower area */
@media (min-width:1181px){
  .sbl4-grid-main{grid-template-columns:minmax(0,1.08fr) minmax(0,1fr) 284px!important}
  .sbl4-weather{
    align-self:stretch;
    display:flex!important;
    flex-direction:column;
    justify-content:space-between;
    padding:17px 16px 14px!important;
    min-height:0!important;
  }
  .sbl4-weather__main{margin:8px 0 4px!important}
  .sbl4-weather__icon{width:58px;height:58px}
  .sbl4-wx-svg{width:54px;height:54px}
  .sbl4-weather__temp strong{font-size:35px}
  .sbl4-weather__metrics{padding:7px 0!important}
  .sbl4-weather__metrics>div{padding:6px 3px!important}
  .sbl4-weather__forecast{margin-top:7px!important}
  .sbl4-weather-day{padding:6px 2px!important}
  .sbl4-weather__foot{margin-top:6px!important}
}

/* PODCAST: real cover stays crisp while background supports it */
.sbl4-feature-media--spotify .sbl4-feature-media__bg{
  filter:blur(3px) saturate(.86) brightness(.62);
  transform:scale(1.045);
  background-position:center!important;
}
.sbl4-feature-media--spotify .sbl4-feature-media__shade{
  background:linear-gradient(90deg,rgba(3,17,34,.95) 0%,rgba(3,17,34,.88) 34%,rgba(3,17,34,.48) 72%,rgba(3,17,34,.28) 100%)
}
.sbl4-feature-media__podcast-cover{
  position:absolute;z-index:2;left:22px;bottom:22px;width:122px;height:122px;border-radius:15px;overflow:hidden;
  box-shadow:0 15px 30px rgba(0,0,0,.32);border:1px solid rgba(255,255,255,.18)
}
.sbl4-feature-media__podcast-cover img{width:100%;height:100%;object-fit:cover}
.sbl4-feature-media__content--podcast{padding-left:164px!important}
.sbl4-feature-media__content--podcast strong{max-width:76%}

/* WARTA tabs: true local filter buttons */
.sbl4-filter-row{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:12px}
.sbl4-warta-tab{
  min-height:34px;padding:0 13px;border:1px solid var(--sbl4-border);border-radius:999px;
  background:var(--sbl4-card);color:#667085;font-size:10.5px;font-weight:800;transition:.18s ease
}
.sbl4-warta-tab:hover{border-color:#a9d7f5;color:var(--sbl4-blue);background:#f4faff;transform:translateY(-1px)}
.sbl4-warta-tab.is-active{background:var(--sbl4-blue);border-color:var(--sbl4-blue);color:#fff;box-shadow:0 6px 14px rgba(8,102,181,.18)}
.sbl4-warta-empty{grid-column:1/-1;padding:28px;text-align:center;border:1px dashed var(--sbl4-border);border-radius:14px;color:var(--sbl4-muted);font-size:12px}

/* MUSIC — warm SBL red family, infinity carousel and clear controls */
.sbl4-music-band{
  position:relative;
  background:
    radial-gradient(circle at 82% 15%,rgba(255,86,99,.20),transparent 24%),
    radial-gradient(circle at 12% 95%,rgba(230,38,62,.20),transparent 28%),
    linear-gradient(115deg,#260914 0%,#4b0e1c 42%,#681426 72%,#2d0c1a 100%)!important;
  border:1px solid rgba(255,132,145,.16);
  box-shadow:0 14px 32px rgba(74,14,29,.14)
}
.sbl4-music-band::after{content:"";position:absolute;inset:0;pointer-events:none;border-radius:inherit;background:linear-gradient(100deg,rgba(255,255,255,.025),transparent 30%,rgba(255,255,255,.035))}
.sbl4-music-head-actions{position:relative;z-index:2;display:flex;align-items:center;gap:12px}
.sbl4-carousel-controls{display:flex;gap:5px}
.sbl4-carousel-btn{
  width:32px;height:32px;border-radius:50%;border:1px solid rgba(255,255,255,.20);
  background:rgba(255,255,255,.08);color:#fff;font-size:21px;line-height:1;display:grid;place-items:center;
  transition:.18s ease
}
.sbl4-carousel-btn:hover{background:#fff;color:#8f1730;transform:translateY(-1px)}
.sbl4-scroller{position:relative;z-index:2;cursor:grab;overscroll-behavior-inline:contain}
.sbl4-scroller.is-dragging{cursor:grabbing;scroll-snap-type:none;user-select:none}
.sbl4-music-card{transition:transform .2s ease,box-shadow .2s ease}
.sbl4-music-card:hover{transform:translateY(-3px);box-shadow:0 12px 25px rgba(0,0,0,.26)}
.sbl4-music-card span{color:#ff9aa6!important}

/* CREW: interactive cards + true live state supplied by realtime ON AIR event */
.sbl4-crew-shell{overflow:hidden}
.sbl4-crew{padding:5px 2px 8px}
.sbl4-crew-card{
  border-radius:16px;padding:7px 5px 8px;transition:transform .2s ease,background .2s ease,box-shadow .2s ease;
  outline:0
}
.sbl4-crew-card:hover,.sbl4-crew-card:focus-visible{transform:translateY(-5px);background:#f4faff;box-shadow:0 12px 24px rgba(7,29,53,.10)}
.sbl4-crew-card:hover .sbl4-avatar{box-shadow:0 0 0 3px #d7efff,0 8px 18px rgba(8,102,181,.12)}
.sbl4-crew-card.is-onair{background:linear-gradient(180deg,#fff6f7,#fff)}
.sbl4-crew-card.is-onair .sbl4-avatar{box-shadow:0 0 0 3px #ffb4ba,0 0 22px rgba(239,51,64,.24)}
.sbl4-crew-card.is-onair .sbl4-crew-live{display:block!important;font-size:8.5px!important;padding:3px 7px!important;bottom:1px!important}
.sbl4-crew-card.is-onair strong{color:#c61f2c}

/* PUBLIC INFO: soft green utility system */
.sbl4-public-shell{
  background:linear-gradient(145deg,#f1fbf4 0%,#e9f8ef 100%)!important;
  border-color:#cdebd7!important;
}
.sbl4-public-shell .sbl4-title-icon{background:#daf3e3;color:#14854a}
.sbl4-public-shell .sbl4-link{color:#137545}
.sbl4-public{
  background:rgba(255,255,255,.88)!important;border-color:#cfe8d8!important;
  transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease,background .18s ease
}
.sbl4-public__icon{background:#e3f7ea!important;color:#11834a!important}
.sbl4-public:hover{transform:translateY(-2px);background:#fff!important;border-color:#8fd0a7!important;box-shadow:0 10px 22px rgba(23,124,72,.10)}
.sbl4-public:hover i{transform:translateX(3px);color:#11834a}
.sbl4-public i{transition:.18s ease}
[data-theme="dark"] .sbl4-public-shell{background:linear-gradient(145deg,#10251b,#112d20)!important;border-color:#24563b!important}
[data-theme="dark"] .sbl4-public{background:#132b20!important;border-color:#24563b!important}
[data-theme="dark"] .sbl4-public__icon{background:#153b27!important;color:#73dda0!important}

/* Public page cards follow same green language */
.sbl4-public-page .sbl4-page-hero{background:radial-gradient(circle at 90% 15%,rgba(61,188,112,.17),transparent 28%),linear-gradient(135deg,#fff,#eefaf2);border-color:#d3ecdc}
.sbl4-public-page-card{border-color:#cfe8d8!important;background:linear-gradient(145deg,#fff,#f5fcf7)!important;transition:.18s ease}
.sbl4-public-page-card>span{background:#e3f7ea!important;color:#11834a!important}
.sbl4-public-page-card:hover{transform:translateY(-3px);border-color:#8fd0a7!important;box-shadow:0 12px 26px rgba(23,124,72,.10)}
[data-theme="dark"] .sbl4-public-page .sbl4-page-hero{background:linear-gradient(135deg,#10251b,#143323);border-color:#285c40}
[data-theme="dark"] .sbl4-public-page-card{background:#12281d!important;border-color:#285c40!important}

/* FOOTER — official combined logo and relevant social channels */
.sbl4-footer{background:linear-gradient(180deg,#061326,#07172a)}
.sbl4-footer-logo-combined{width:auto;max-width:245px;height:58px;object-fit:contain;object-position:left center;margin-bottom:14px}
.sbl4-footer-brand p{color:#c6d4e3}
.sbl4-footer a{transition:color .18s ease}
.sbl4-footer-group a:hover{color:#6fd0ff}
.sbl4-footer-social{gap:8px;flex-wrap:wrap}
.sbl4-footer-social a{
  width:34px!important;height:34px!important;border:1px solid rgba(255,255,255,.16)!important;
  background:rgba(255,255,255,.055);transition:transform .18s ease,background .18s ease,border-color .18s ease
}
.sbl4-footer-social a svg{width:16px;height:16px;fill:currentColor;stroke:currentColor;stroke-width:1.7}
.sbl4-footer-social a.is-instagram svg{fill:none}
.sbl4-footer-social a:hover{transform:translateY(-2px);background:#fff!important;border-color:#fff!important}
.sbl4-footer-social .is-youtube:hover{color:#ff1f2d!important}
.sbl4-footer-social .is-instagram:hover{color:#d62976!important}
.sbl4-footer-social .is-facebook:hover{color:#1877f2!important}
.sbl4-footer-social .is-spotify:hover{color:#1db954!important}
.sbl4-footer-social .is-tiktok:hover{color:#111!important}
.sbl4-footer-social .is-whatsapp:hover{color:#20bf6b!important}
.sbl4-footer-bottom a{font-weight:800;color:#7bd1ff}
.sbl4-footer-bottom b{color:#ff5863;font-size:12px}

/* PLAYER — more refined, WhatsApp primary action */
.sbl4-player{
  background:linear-gradient(90deg,rgba(4,20,38,.99),rgba(5,28,50,.99),rgba(4,20,38,.99));
  box-shadow:0 -10px 30px rgba(2,12,24,.12)
}
.sbl4-player__in{grid-template-columns:1.14fr .76fr .80fr .42fr}
.sbl4-player__cover{box-shadow:0 7px 16px rgba(0,0,0,.22)}
.sbl4-player-play{box-shadow:0 7px 18px rgba(255,255,255,.12);transition:transform .18s ease,background .18s ease}
.sbl4-player-play:hover{transform:scale(1.05);background:#eaf7ff}
.sbl4-volume{accent-color:#15a8ff}
.sbl4-wa{
  display:inline-flex!important;align-items:center;justify-content:center;gap:7px;
  min-height:38px;padding:0 14px!important;border:0!important;background:#20b85a!important;color:#fff!important;
  box-shadow:0 8px 18px rgba(32,184,90,.22);transition:transform .18s ease,background .18s ease,box-shadow .18s ease
}
.sbl4-wa svg{width:16px;height:16px;fill:currentColor}
.sbl4-wa:hover{background:#159a48!important;transform:translateY(-1px);box-shadow:0 10px 22px rgba(32,184,90,.29)}

/* CONTRAST / FOCUS */
.sbl4-nav a:focus-visible,.sbl4-public:focus-visible,.sbl4-crew-card:focus-visible,.sbl4-warta-tab:focus-visible,.sbl4-carousel-btn:focus-visible,.sbl4-wa:focus-visible{
  outline:3px solid rgba(18,168,255,.35);outline-offset:3px
}

/* RESPONSIVE */
@media (max-width:1180px){
  .sbl4-next{width:290px!important}
  .sbl4-feature-media__podcast-cover{width:108px;height:108px}
  .sbl4-feature-media__content--podcast{padding-left:145px!important}
}
@media (max-width:760px){
  .sbl4-next{
    width:calc(100% - 28px)!important;right:14px!important;bottom:14px!important;min-height:66px!important;
    grid-template-columns:44px minmax(0,1fr) 15px!important;padding:8px 10px!important
  }
  .sbl4-next__thumb{width:44px!important;height:44px!important}
  .sbl4-next small{font-size:9px!important}.sbl4-next strong{font-size:11.5px!important}.sbl4-next span{font-size:9.5px!important}
  .sbl4-hero__studio-label{display:none!important}

  .sbl4-feature-media__podcast-cover{width:82px;height:82px;left:14px;bottom:14px;border-radius:12px}
  .sbl4-feature-media__content--podcast{padding:14px 58px 14px 108px!important}
  .sbl4-feature-media__content--podcast strong{max-width:100%!important;font-size:15px!important}
  .sbl4-feature-media__content--podcast small{font-size:9.5px!important}
  .sbl4-feature-media__content--podcast .sbl4-media-tag{font-size:9px!important}
  .sbl4-feature-media__content--podcast .sbl4-media-play{right:12px;bottom:14px;width:40px;height:40px}

  .sbl4-filter-row{overflow-x:auto;flex-wrap:nowrap;padding-bottom:4px;scrollbar-width:none}
  .sbl4-filter-row::-webkit-scrollbar{display:none}
  .sbl4-warta-tab{white-space:nowrap;flex:0 0 auto;min-height:38px;font-size:10.5px}

  .sbl4-music-head-actions{gap:8px}.sbl4-carousel-controls{display:none}
  .sbl4-music-band{background:linear-gradient(145deg,#340b17,#631528 60%,#3c0d1b)!important}
  .sbl4-scroller{overflow-x:auto;-webkit-overflow-scrolling:touch}
  .sbl4-music-card{min-width:78%!important;height:122px!important}

  .sbl4-crew-card:hover{transform:none}
  .sbl4-crew-card{min-width:92px!important}

  .sbl4-public-shell{background:linear-gradient(145deg,#effaf3,#e6f7ec)!important}
  .sbl4-public-grid{grid-template-columns:1fr!important}
  .sbl4-public{min-height:56px}

  .sbl4-footer-logo-combined{height:52px;max-width:225px}
  .sbl4-footer-social a{width:36px!important;height:36px!important}

  .sbl4-player__in{grid-template-columns:minmax(0,1fr) auto auto!important;gap:8px!important}
  .sbl4-player__center{justify-self:end}
  .sbl4-player__next{display:none}
  .sbl4-player__right{display:flex!important}
  .sbl4-player__right .sbl4-wa{width:40px;height:40px;min-height:40px;padding:0!important;border-radius:50%!important}
  .sbl4-player__right .sbl4-wa span{display:none}
  .sbl4-player__right .sbl4-wa svg{width:18px;height:18px}
}


/* ============================================================
   BETA 18 — polish per evaluasi pengguna
   ========================================================== */
/* FIX TICKER: Marquee konsisten untuk desktop dan mobile tanpa class fade lama */
.sbl4-ticker__in{min-height:40px;gap:14px}
.sbl4-ticker__label{padding:5px 10px;font-size:9.5px;font-weight:900;box-shadow:0 8px 18px rgba(239,51,64,.18)}
.sbl4-ticker__items{position:relative!important;display:block!important;height:24px!important;flex:1!important;min-width:0!important;overflow:hidden!important}
.sbl4-ticker__item{position:static!important;inset:auto!important;display:inline-flex!important;align-items:center!important;opacity:1!important;transform:none!important;font-size:12px!important;font-weight:700!important;color:var(--sbl4-text,#20344d)!important;white-space:nowrap!important;text-decoration:none!important;pointer-events:auto!important}
.sbl4-ticker__item:hover{color:var(--sbl4-blue,#0866b5)!important}
[data-theme="dark"] .sbl4-ticker__item{color:#e7f0fa!important}
[data-theme="dark"] .sbl4-ticker__item:hover{color:#8ad5ff!important}

.sbl4-btn-wa,
.sbl4-wa{background:linear-gradient(135deg,#25D366,#149647)!important;color:#fff!important;border:1px solid rgba(37,211,102,.45)!important;box-shadow:0 10px 24px rgba(20,150,71,.24);transition:transform .18s ease,box-shadow .18s ease,filter .18s ease}
.sbl4-btn-wa:hover,
.sbl4-wa:hover{transform:translateY(-1px);box-shadow:0 14px 28px rgba(20,150,71,.30);filter:saturate(1.03)}
.sbl4-btn-wa svg,
.sbl4-wa svg{width:18px;height:18px;fill:currentColor;flex:0 0 18px}
.sbl4-btn-wa{backdrop-filter:none!important}
.sbl4-hero__actions .sbl4-btn-wa,
.sbl4-live-stage__actions .sbl4-btn-wa{padding-inline:18px}

.sbl4-wave i,
.sbl4-player-wave i{animation-play-state:paused}
.sbl4-body:not(.sbl4-is-playing) .sbl4-wave i{height:6px!important;opacity:.68}
.sbl4-body.sbl4-is-playing .sbl4-wave i{animation-play-state:running}
.sbl4-player[data-state="playing"] .sbl4-player-wave i{animation-play-state:running}

.sbl4-feature-media__bg{filter:blur(16px) brightness(.42) saturate(.96);transform:scale(1.06)}
.sbl4-feature-media__podcast-cover{box-shadow:0 18px 42px rgba(0,0,0,.28)}
.sbl4-feature-media__content--podcast strong{max-width:520px}

.sbl4-music-band{
  background:
    radial-gradient(circle at 82% 14%,rgba(239,51,64,.20),transparent 22%),
    linear-gradient(135deg,#360913 0%,#68101e 48%,#8c1626 100%)!important;
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 16px 38px rgba(83,12,23,.20)
}
.sbl4-music-band .sbl4-section-head{align-items:center}
.sbl4-music-head-actions{display:flex;align-items:center;gap:14px}
.sbl4-carousel-controls{display:flex;align-items:center;gap:8px}
.sbl4-carousel-btn{width:38px;height:38px;display:grid;place-items:center;border-radius:999px}
.sbl4-link--light{display:inline-flex;align-items:center;gap:6px}
.sbl4-link--light:hover{transform:translateX(1px)}

.sbl4-player__next small{display:block;font-size:6.3px;color:#7fa0bb;font-weight:900;letter-spacing:.10em}
.sbl4-player__next strong{display:block;margin-top:3px}
.sbl4-player__next span{display:block;margin-top:5px;font-size:7.4px;color:#a8bbce;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sbl4-player__next span b{color:#d6e5f3;font-weight:800}
.sbl4-player__right .sbl4-wa{display:inline-flex;align-items:center;gap:8px}

@media (max-width:920px){
  .sbl4-music-head-actions{width:100%;justify-content:space-between}
}
@media (max-width:760px){
  .sbl4-ticker__in{min-height:38px}
  .sbl4-ticker__item{font-size:10.6px}
  .sbl4-feature-media__content--podcast strong{max-width:100%}
}


/* ============================================================
   BETA 19 — ACTIVE ANNOUNCER, WEATHER, SCHEDULE & HOVER POLISH
   ========================================================== */

/* Redundant LIVE pill in the very top strip is intentionally removed. */
.sbl4-pill-live{display:none!important}

/* Hero announcer name behaves like a compact profile link. */
.sbl4-hero-host-button{
  appearance:none;border:0;background:transparent;color:#fff;padding:0;margin:0;
  font:inherit;font-weight:900;line-height:inherit;vertical-align:baseline;
  border-bottom:1px dashed rgba(255,255,255,.52);
  cursor:pointer;transition:color .18s ease,border-color .18s ease,transform .18s ease
}
.sbl4-hero-host-button.is-clickable:hover,
.sbl4-hero-host-button.is-clickable:focus-visible{
  color:#62d3ff;border-color:#62d3ff;transform:translateY(-1px);outline:0
}
.sbl4-hero-host-button:disabled{cursor:default;border-bottom-color:transparent;color:inherit}

/* ON AIR presenter state — Studio Tally Indicator (Clean & Sharp Broadcast Grade) */
@keyframes sbl4TallyPulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.45; transform: scale(0.85); }
}
.sbl4-crew-live {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
}
.sbl4-crew-card.is-onair .sbl4-crew-live {
  display: inline-flex !important;
  visibility: visible !important;
  opacity: 1 !important;
}
.sbl4-crew-card.is-onair .sbl4-avatar {
  box-shadow: 0 0 0 2px #ffffff, 0 0 0 4px #dc2626 !important;
}
.sbl4-crew-card.is-onair strong {
  color: #b91c1c !important;
}
.sbl4-announcer-card--rich.is-onair {
  border-color: rgba(220, 38, 38, 0.45) !important;
  box-shadow: 0 14px 34px rgba(15, 23, 42, 0.08) !important;
}

/* Global presenter popup & daily schedule modal */
.sbl4-announcer-modal {
  position: fixed;
  inset: 0;
  z-index: 2200;
  display: flex !important;
  align-items: center;
  justify-content: center;
  padding: 24px;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.28s ease, visibility 0.28s ease;
}
.sbl4-announcer-modal.is-open {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}
.sbl4-announcer-modal__backdrop {
  position: absolute;
  inset: 0;
  border: 0;
  background: rgba(3, 16, 30, 0.78);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  cursor: pointer;
}
.sbl4-announcer-modal__dialog {
  position: relative;
  z-index: 2;
  width: min(840px, calc(100vw - 32px));
  max-height: min(92vh, 760px);
  display: grid;
  grid-template-columns: 290px minmax(0, 1fr);
  overflow: hidden;
  border-radius: 28px;
  background: var(--sbl4-card);
  border: 1px solid var(--sbl4-border);
  box-shadow: 0 36px 90px rgba(2, 12, 25, 0.42);
  transform: scale(0.92) translateY(20px);
  opacity: 0;
  transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.25s ease;
}
.sbl4-announcer-modal.is-open .sbl4-announcer-modal__dialog {
  transform: scale(1) translateY(0);
  opacity: 1;
}
.sbl4-announcer-modal__close {
  position: absolute;
  right: 14px;
  top: 14px;
  z-index: 10;
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  border: 1px solid var(--sbl4-border);
  background: var(--sbl4-surface);
  color: var(--sbl4-text);
  font-size: 16px;
  font-weight: 700;
  cursor: pointer;
  transition: all 0.2s ease;
}
.sbl4-announcer-modal__close:hover {
  background: #ef3340;
  color: #fff;
  border-color: #ef3340;
  transform: rotate(90deg);
}

/* Kolom Kiri: Foto Studio & Status ON AIR */
.sbl4-announcer-modal__photo {
  position: relative;
  min-height: 440px;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  overflow: hidden;
  background: radial-gradient(circle at 50% 30%, #1e4b7a 0%, #062343 100%);
}
.sbl4-announcer-modal__photo img {
  width: 100%;
  height: 100%;
  max-height: 440px;
  object-fit: contain;
  object-position: center bottom;
  filter: drop-shadow(0 16px 26px rgba(0, 0, 0, 0.45));
}
.sbl4-modal-onair-badge {
  display: none;
  position: absolute;
  top: 16px;
  left: 16px;
  z-index: 5;
  align-items: center;
  gap: 7px;
  padding: 6px 13px;
  border-radius: 999px;
  background: #dc2626;
  color: #ffffff;
  font-family: 'Outfit', sans-serif;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 0.08em;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.28), 0 1px 2px rgba(0, 0, 0, 0.16);
  border: 1px solid rgba(255, 255, 255, 0.65);
}
.sbl4-modal-onair-badge.is-visible {
  display: inline-flex !important;
}
.sbl4-modal-onair-badge i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #ffffff;
  display: inline-block;
  animation: sbl4TallyPulse 1.2s infinite ease-in-out;
}
.sbl4-announcer-modal__seal {
  position: absolute;
  bottom: 14px;
  left: 14px;
  padding: 5px 11px;
  background: rgba(3, 18, 34, 0.72);
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 999px;
  color: #c4e4fc;
  font-size: 8.5px;
  font-weight: 850;
  backdrop-filter: blur(8px);
}

/* Kolom Kanan: Detail & Jadwal Lengkap */
.sbl4-announcer-modal__body {
  padding: 30px 28px 26px;
  overflow-y: auto;
  max-height: min(92vh, 760px);
  display: flex;
  flex-direction: column;
}
.sbl4-announcer-modal__header {
  margin-bottom: 16px;
}
.sbl4-announcer-modal__kicker {
  font-size: 8.5px;
  font-weight: 900;
  letter-spacing: 0.12em;
  color: var(--sbl4-blue);
  display: block;
  margin-bottom: 4px;
}
.sbl4-announcer-modal__body h2 {
  font-family: "Outfit", sans-serif;
  font-size: 32px;
  font-weight: 850;
  line-height: 1.1;
  margin: 0 0 6px;
  color: var(--sbl4-text);
  letter-spacing: -0.02em;
}
.sbl4-announcer-modal__body > p,
.sbl4-announcer-modal__header > p {
  margin: 0;
  color: var(--sbl4-muted);
  font-size: 12px;
}

/* Metrik Modal */
.sbl4-announcer-modal__metrics {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  margin: 0 0 18px;
}
.sbl4-announcer-modal__metrics > div {
  padding: 8px 6px;
  border-radius: 12px;
  background: var(--sbl4-surface);
  border: 1px solid var(--sbl4-border);
  text-align: center;
}
.sbl4-announcer-modal__metrics strong {
  display: block;
  font-size: 16px;
  font-weight: 850;
  color: var(--sbl4-text);
}
.sbl4-announcer-modal__metrics small {
  display: block;
  font-size: 8px;
  color: var(--sbl4-muted);
  margin-top: 2px;
}

/* Seksi Program & Jadwal */
.sbl4-announcer-modal__section {
  margin-bottom: 18px;
}
.sbl4-modal-sec-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 8px;
}
.sbl4-modal-sec-title {
  display: block;
  font-size: 8.5px;
  font-weight: 900;
  letter-spacing: 0.1em;
  color: var(--sbl4-muted);
  margin-bottom: 8px;
}
.sbl4-modal-timezone {
  font-size: 8.5px;
  font-weight: 700;
  color: var(--sbl4-blue);
}
.sbl4-announcer-modal__programs {
  display: flex;
  gap: 7px;
  flex-wrap: wrap;
}
.sbl4-announcer-modal__programs span {
  padding: 5px 10px;
  border-radius: 999px;
  background: #eaf4fd;
  color: #0b68af;
  font-size: 9.5px;
  font-weight: 750;
  border: 1px solid #d3e7f9;
}
[data-theme="dark"] .sbl4-announcer-modal__programs span {
  background: #112d47;
  color: #8cc8f5;
  border-color: #1a4163;
}

/* List Jadwal Harian */
.sbl4-announcer-modal__schedule {
  display: grid;
  gap: 8px;
  max-height: 230px;
  overflow-y: auto;
  padding-right: 4px;
}
.sbl4-modal-schedule-item {
  display: grid;
  grid-template-columns: 110px 120px minmax(0, 1fr);
  gap: 8px;
  align-items: center;
  padding: 9px 12px;
  border-radius: 12px;
  background: var(--sbl4-surface);
  border: 1px solid var(--sbl4-border);
  transition: all 0.2s ease;
}
.sbl4-modal-schedule-item.is-today {
  border-color: rgba(8, 102, 181, 0.4);
  background: #f4f9fe;
}
[data-theme="dark"] .sbl4-modal-schedule-item.is-today {
  background: #11283d;
  border-color: #1b4970;
}
.sbl4-modal-schedule-item.is-current {
  border-color: rgba(239, 51, 64, 0.5);
  background: #fff6f7;
  box-shadow: 0 4px 14px rgba(239, 51, 64, 0.12);
}
[data-theme="dark"] .sbl4-modal-schedule-item.is-current {
  background: #2b1317;
  border-color: #701c22;
}
.sbl4-modal-schedule-item__day {
  display: flex;
  align-items: center;
  gap: 6px;
}
.sbl4-modal-schedule-item__day strong {
  font-size: 11px;
  font-weight: 850;
  color: var(--sbl4-text);
}
.sbl4-sched-pill {
  font-size: 7.5px;
  font-weight: 900;
  padding: 2px 6px;
  border-radius: 999px;
  letter-spacing: 0.05em;
}
.sbl4-sched-pill.is-today {
  background: var(--sbl4-blue);
  color: #fff;
}
.sbl4-sched-pill.is-onair {
  background: #ef3340;
  color: #fff;
  animation: sbl4OnAirPulse 1.35s infinite;
}
.sbl4-modal-schedule-item__time {
  font-size: 10px;
  font-weight: 750;
  color: var(--sbl4-blue);
  white-space: nowrap;
}
.sbl4-modal-schedule-item__prog {
  font-size: 10.5px;
  font-weight: 600;
  color: var(--sbl4-text);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.sbl4-modal-schedule-empty {
  padding: 14px;
  text-align: center;
  border-radius: 12px;
  background: var(--sbl4-surface);
  border: 1px dashed var(--sbl4-border);
  color: var(--sbl4-muted);
  font-size: 10.5px;
}

/* Aksi Modal */
.sbl4-announcer-modal__actions {
  display: flex;
  gap: 10px;
  margin-top: auto;
  padding-top: 14px;
  border-top: 1px solid var(--sbl4-border);
}
.sbl4-modal-wa-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 42px;
  padding: 0 16px;
  border-radius: 999px;
  background: #25d366;
  color: #fff;
  font-size: 10px;
  font-weight: 850;
  text-decoration: none;
  box-shadow: 0 6px 16px rgba(37, 211, 102, 0.35);
  transition: all 0.2s ease;
}
.sbl4-modal-wa-btn:hover {
  background: #1eb855;
  transform: translateY(-2px);
  box-shadow: 0 10px 22px rgba(37, 211, 102, 0.45);
}
.sbl4-announcer-modal__link {
  display: inline-flex;
  align-items: center;
  min-height: 42px;
  padding: 0 16px;
  border-radius: 999px;
  background: var(--sbl4-surface);
  color: var(--sbl4-text);
  border: 1px solid var(--sbl4-border);
  font-size: 10px;
  font-weight: 850;
  text-decoration: none;
  margin-left: auto;
  transition: all 0.2s ease;
}
.sbl4-announcer-modal__link:hover {
  background: var(--sbl4-blue);
  color: #fff;
  border-color: var(--sbl4-blue);
  transform: translateY(-2px);
}

@media (max-width: 760px) {
  .sbl4-announcer-modal {
    padding: 12px;
  }
  .sbl4-announcer-modal__dialog {
    grid-template-columns: 1fr;
    max-height: 94vh;
  }
  .sbl4-announcer-modal__photo {
    min-height: 240px;
    max-height: 240px;
  }
  .sbl4-announcer-modal__photo img {
    max-height: 240px;
  }
  .sbl4-announcer-modal__body {
    padding: 20px 18px 18px;
  }
  .sbl4-announcer-modal__body h2 {
    font-size: 24px;
  }
  .sbl4-modal-schedule-item {
    grid-template-columns: 1fr;
    gap: 4px;
  }
  .sbl4-announcer-modal__actions {
    flex-direction: column;
  }
  .sbl4-announcer-modal__link {
    margin-left: 0;
    justify-content: center;
  }
}

/* Weather card: compact blue hourly forecast inspired by modern weather panels. */
.sbl4-weather{
  display:flex!important;flex-direction:column!important;justify-content:space-between!important;
  grid-template-columns:none!important;grid-template-areas:none!important;
  min-height:100%!important;height:100%!important;padding:14px 13px 11px!important;
  border-radius:20px!important;color:#fff!important;
  background:
    radial-gradient(circle at 88% 10%,rgba(255,255,255,.22),transparent 21%),
    linear-gradient(155deg,#3769bd 0%,#285aaf 40%,#183f88 100%)!important;
  border:1px solid rgba(255,255,255,.22)!important;
  box-shadow:0 14px 30px rgba(24,63,136,.22)!important
}
.sbl4-weather__glow{right:-45px!important;top:-70px!important;width:180px!important;height:180px!important;background:rgba(132,190,255,.18)!important}
.sbl4-weather__head{display:flex!important;align-items:center!important;justify-content:space-between!important;grid-area:auto!important}
.sbl4-weather__place{display:flex;align-items:center;gap:6px;min-width:0}
.sbl4-weather__home{width:18px;height:18px;display:grid;place-items:center;color:#fff}
.sbl4-weather__home svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.sbl4-weather__head strong{font-size:11px!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sbl4-weather__chev{font-size:12px;color:#dce9ff}
.sbl4-weather__refresh{width:26px!important;height:26px!important;flex-basis:26px!important;padding:6px!important}
.sbl4-weather__summary{display:grid;grid-template-columns:105px minmax(0,1fr);gap:8px;align-items:center;margin:9px 0 8px}
.sbl4-weather__temperature{display:flex;align-items:center;min-width:0}
.sbl4-weather__icon{width:47px!important;height:47px!important;flex:0 0 47px}
.sbl4-weather__icon .sbl4-wx-svg{width:44px!important;height:44px!important}
.sbl4-weather__temp{display:flex;align-items:flex-start;line-height:.86}
.sbl4-weather__temp strong{font-family:"Outfit";font-size:37px!important;letter-spacing:-.055em}
.sbl4-weather__temp sup{font-size:10px!important;margin:2px 0 0 2px!important;color:#fff!important}
.sbl4-weather__advice{min-width:0}
.sbl4-weather__advice>div{display:flex;align-items:center;gap:5px}
.sbl4-weather__uv-badge{
  display:inline-flex;align-items:center;justify-content:center;min-width:28px;height:20px;padding:0 5px;
  border-radius:999px;background:#f6a313;color:#fff;font-size:7px;font-weight:900
}
.sbl4-weather__uv-badge[data-level="danger"]{background:#e94252}
.sbl4-weather__uv-badge[data-level="high"]{background:#ef8d13}
.sbl4-weather__uv-badge[data-level="watch"]{background:#eab308}
.sbl4-weather__uv-badge[data-level="rain"]{background:#20a8e8}
.sbl4-weather__advice strong{font-size:8.4px;line-height:1.2}
.sbl4-weather__advice p{font-size:7.5px;line-height:1.35;color:#e5efff;margin:4px 0 0}
.sbl4-weather__switch{display:flex;gap:5px;margin-bottom:6px}
.sbl4-weather__switch button{
  min-height:27px;padding:0 10px;border:1px solid rgba(255,255,255,.14);border-radius:5px;
  background:rgba(255,255,255,.12);color:#edf5ff;font-size:7.5px;font-weight:800
}
.sbl4-weather__switch button.is-active{background:rgba(255,255,255,.25);border-color:rgba(255,255,255,.30);color:#fff}
.sbl4-weather__forecast--timeline{
  display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:3px!important;
  margin:0!important;min-height:116px
}
.sbl4-weather-slot{
  min-width:0;text-align:center;padding:7px 2px 6px;border-radius:6px;
  background:rgba(19,55,122,.38);border:1px solid rgba(255,255,255,.08)
}
.sbl4-weather-slot b,.sbl4-weather-slot strong,.sbl4-weather-slot small,.sbl4-weather-slot em{display:block;white-space:nowrap}
.sbl4-weather-slot b{font-size:7px;color:#eef5ff}
.sbl4-weather-slot .sbl4-wx-svg--mini{width:26px!important;height:26px!important;margin:5px auto!important}
.sbl4-weather-slot strong{font-size:10px}
.sbl4-weather-slot small{font-size:7px;color:#d1e0fa;margin-top:1px}
.sbl4-weather-slot em{font-style:normal;font-size:6px;color:#d5e4fb;margin-top:4px}
.sbl4-weather__nav{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:7px}
.sbl4-weather__dots{display:flex;gap:5px}
.sbl4-weather__dots i{width:5px;height:5px;border-radius:50%;background:rgba(255,255,255,.28)}
.sbl4-weather__dots i.is-active{background:#fff}
.sbl4-weather__nav button{
  border:0;border-radius:999px;background:rgba(255,255,255,.16);color:#fff;
  padding:5px 9px;font-size:6.6px;font-weight:800
}
.sbl4-weather__nav button:hover{background:rgba(255,255,255,.24)}
.sbl4-weather__foot{
  display:flex!important;justify-content:space-between!important;gap:6px!important;margin-top:6px!important;
  color:#c9dcf8!important;font-size:6px!important;grid-area:auto!important
}
.sbl4-weather__foot small{font-size:6px!important;color:#c9dcf8!important}
.sbl4-weather[data-weather-state="loading"] .sbl4-weather__summary{opacity:.78}
.sbl4-weather--rain,.sbl4-weather--storm,.sbl4-weather--cloudy,.sbl4-weather--fog,.sbl4-weather--night,.sbl4-weather--night-cloud{
  background:
    radial-gradient(circle at 88% 10%,rgba(255,255,255,.18),transparent 21%),
    linear-gradient(155deg,#355fa7 0%,#234d93 48%,#173a78 100%)!important
}

/* Fill schedule card vertically and improve readability without overlap. */
.sbl4-schedule-card,.sbl4-chart-card{height:100%;display:flex;flex-direction:column}
.sbl4-schedule-card #sbl4-schedule{display:flex;flex-direction:column;flex:1;min-height:0}
.sbl4-schedule-card .sbl4-schedule-row{flex:1;min-height:61px;padding:9px 5px!important}
.sbl4-schedule-card .sbl4-time{font-size:10.5px!important}
.sbl4-schedule-card .sbl4-program{font-size:12.2px!important;line-height:1.25}
.sbl4-schedule-card .sbl4-host{font-size:9.4px!important;line-height:1.3}
.sbl4-schedule-card .sbl4-schedule-avatar{width:39px!important;height:39px!important;flex-basis:39px!important}
.sbl4-schedule-card .sbl4-onair{font-size:8px!important;padding:4px 7px}

/* Podcast and chart inner content: clear interaction feedback. */
.sbl4-feature-media{
  transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease
}
.sbl4-feature-media__bg{transition:transform .32s ease,filter .32s ease}
.sbl4-feature-media__podcast-cover{transition:transform .25s ease,box-shadow .25s ease}
.sbl4-feature-media:hover,.sbl4-feature-media:focus-visible{
  transform:translateY(-4px);box-shadow:0 20px 42px rgba(5,28,54,.18);outline:0
}
.sbl4-feature-media:hover .sbl4-feature-media__bg{transform:scale(1.095)}
.sbl4-feature-media:hover .sbl4-feature-media__podcast-cover{transform:translateY(-2px) scale(1.025);box-shadow:0 22px 45px rgba(0,0,0,.34)}
.sbl4-feature-media:hover .sbl4-media-play{transform:scale(1.06)}
.sbl4-media-play{transition:transform .2s ease,box-shadow .2s ease}
.sbl4-on-demand-card{transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
.sbl4-on-demand-card:hover{transform:translateY(-3px);box-shadow:0 14px 28px rgba(5,28,54,.10);border-color:#b9dff7}

.sbl4-chart-card #sbl4-chart{flex:1}
.sbl4-chart-row{
  border-radius:11px;padding-left:6px!important;padding-right:5px!important;
  transition:transform .17s ease,background .17s ease,box-shadow .17s ease
}
.sbl4-chart-row:hover{
  transform:translateX(3px);background:#f3f9ff;
  box-shadow:0 7px 18px rgba(8,102,181,.07)
}
[data-theme="dark"] .sbl4-chart-row:hover{background:#142842}
.sbl4-chart-cover{transition:transform .18s ease,box-shadow .18s ease}
.sbl4-chart-row:hover .sbl4-chart-cover{transform:scale(1.06);box-shadow:0 5px 12px rgba(0,0,0,.12)}
.sbl4-trend{
  min-width:72px!important;display:inline-flex!important;align-items:center;justify-content:flex-end;gap:4px;
  text-align:right!important
}
.sbl4-trend i{
  width:19px;height:19px;border-radius:50%;display:grid;place-items:center;font-style:normal;
  font-size:10px;font-weight:900;background:#eef2f6;color:#778493
}
.sbl4-trend span{font-size:7.4px;font-weight:900;white-space:nowrap}
.sbl4-trend.up{color:#0a9d56}.sbl4-trend.up i{background:#e6f8ee;color:#0a9d56}
.sbl4-trend.down{color:#db2634}.sbl4-trend.down i{background:#fff0f1;color:#db2634}
.sbl4-trend.same{color:#6b7888}.sbl4-trend.same i{background:#eef2f6;color:#6b7888}
.sbl4-trend.new{color:#7b43d1}.sbl4-trend.new i{background:#f1eaff;color:#7b43d1}

/* Desktop presenter cards remain interactive and balanced. */
.sbl4-crew-card{transition:transform .2s ease,background .2s ease,box-shadow .2s ease}
.sbl4-crew-card:hover{transform:translateY(-5px)}
.sbl4-announcer-card--rich{transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
.sbl4-announcer-card--rich:hover{transform:translateY(-3px);box-shadow:0 15px 32px rgba(7,29,53,.09)}

@media (max-width:1180px){
  .sbl4-grid-main>.sbl4-weather{
    display:flex!important;grid-column:1/-1!important;height:auto!important;min-height:260px!important;
    grid-template-columns:none!important;grid-template-areas:none!important
  }
  .sbl4-weather__summary{grid-template-columns:125px minmax(0,1fr)}
  .sbl4-weather__forecast--timeline{min-height:108px}
}
@media (max-width:760px){
  .sbl4-grid-main>.sbl4-weather{display:flex!important;grid-column:auto!important;padding:14px!important;border-radius:17px!important;min-height:300px!important}
  .sbl4-weather__summary{grid-template-columns:112px minmax(0,1fr);margin:8px 0}
  .sbl4-weather__temp strong{font-size:39px!important}
  .sbl4-weather__advice strong{font-size:9px}.sbl4-weather__advice p{font-size:8px}
  .sbl4-weather__forecast--timeline{grid-template-columns:repeat(5,minmax(48px,1fr))!important;overflow-x:auto;scrollbar-width:none}
  .sbl4-weather__forecast--timeline::-webkit-scrollbar{display:none}
  .sbl4-weather-slot{min-width:48px}
  .sbl4-schedule-card .sbl4-schedule-row{min-height:55px;padding:8px 2px!important}
  .sbl4-schedule-card .sbl4-time{font-size:8.7px!important}
  .sbl4-schedule-card .sbl4-program{font-size:10.2px!important}
  .sbl4-schedule-card .sbl4-host{font-size:8.1px!important}
  .sbl4-schedule-card .sbl4-schedule-avatar{width:32px!important;height:32px!important;flex-basis:32px!important}
  .sbl4-trend{min-width:23px!important}
  .sbl4-trend span{display:none}
  .sbl4-trend i{width:20px;height:20px}
  .sbl4-chart-row{grid-template-columns:24px 32px minmax(0,1fr) 22px 22px!important}
  .sbl4-announcer-modal{padding:12px}
  .sbl4-announcer-modal__dialog{grid-template-columns:110px minmax(0,1fr);border-radius:18px}
  .sbl4-announcer-modal__photo{min-height:260px}
  .sbl4-announcer-modal__photo img{max-height:260px}
  .sbl4-announcer-modal__body{padding:30px 18px 20px}
  .sbl4-announcer-modal__body h2{font-size:24px}
  .sbl4-announcer-modal__programs span{font-size:8px;padding:5px 7px}
  .sbl4-announcer-modal__schedule>div:nth-child(n+3){display:none}
}


/* ============================================================
   BETA 19 — INTERNAL PAGE PROFESSIONAL / RESPONSIVE PASS
   Live, Jadwal, Program, Penyiar
   ========================================================== */

/* LIVE RADIO PAGE */
.sbl4-live-stage--pro{
  min-height:410px!important;
  display:block;
  border-radius:24px!important;
  background:#052f59;
  box-shadow:0 22px 48px rgba(6,34,65,.15)!important
}
.sbl4-live-stage--pro .sbl4-live-stage__bg{
  z-index:2;
  background:
    radial-gradient(circle at 20% 12%,rgba(18,168,255,.22),transparent 26%),
    linear-gradient(90deg,rgba(5,50,92,.98) 0%,rgba(5,50,92,.96) 39%,rgba(5,50,92,.66) 54%,rgba(5,50,92,.06) 76%,rgba(5,50,92,0) 100%)!important
}
.sbl4-live-stage--pro .sbl4-live-stage__copy{
  width:55%!important;
  padding:38px 38px 34px!important
}
.sbl4-live-stage--pro .sbl4-live-stage__visual{
  inset:0 0 0 42%!important
}
.sbl4-live-stage--pro .sbl4-live-stage__visual img{
  object-position:center center!important
}
.sbl4-live-stage--pro .sbl4-live-stage__eyebrow{
  display:inline-flex;padding:6px 9px;border-radius:999px;
  background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.14)
}
.sbl4-live-stage--pro h1{font-size:43px!important;max-width:560px;margin-top:14px!important}
.sbl4-live-stage--pro .sbl4-live-stage__copy>p{font-size:13px!important;max-width:560px;color:#d0e2f2}
.sbl4-live-stage__visual-badge{
  position:absolute;z-index:4;right:20px;bottom:18px;
  display:flex;align-items:center;gap:7px;padding:8px 11px;border-radius:999px;
  background:rgba(4,18,34,.74);border:1px solid rgba(255,255,255,.18);
  color:#fff;font-size:9px;font-weight:850;backdrop-filter:blur(8px)
}
.sbl4-live-console{
  margin-top:22px;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(240px,.85fr);gap:10px;
  padding:10px;border-radius:17px;background:rgba(3,25,48,.58);
  border:1px solid rgba(255,255,255,.13);box-shadow:inset 0 1px 0 rgba(255,255,255,.04)
}
.sbl4-live-console__program{
  min-width:0;padding:11px 13px;border-radius:12px;background:rgba(255,255,255,.045)
}
.sbl4-live-console__program>small,
.sbl4-live-console__trackcopy>small{
  display:block;color:#73cdf7;font-size:8px;font-weight:900;letter-spacing:.09em
}
.sbl4-live-console__program>strong{
  display:block;margin-top:4px;font-family:"Outfit";font-size:18px;line-height:1.15;color:#fff
}
.sbl4-live-console__meta{
  display:flex;align-items:center;gap:6px;margin-top:7px;min-width:0;color:#bfd4e7;font-size:9px
}
.sbl4-live-console__meta em{font-style:normal;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sbl4-live-host-button{
  border:0;background:transparent;padding:0;color:#fff;font:inherit;font-weight:900;
  border-bottom:1px dashed rgba(255,255,255,.35);cursor:pointer
}
.sbl4-live-host-button.is-clickable:hover{color:#6ed6ff;border-color:#6ed6ff}
.sbl4-live-host-button:disabled{cursor:default;border-color:transparent;color:#bfd4e7}
.sbl4-live-console__track{
  display:grid;grid-template-columns:56px minmax(0,1fr);gap:10px;align-items:center;
  min-width:0;padding:8px;border-radius:12px;background:rgba(1,17,33,.56)
}
.sbl4-live-console__track img{
  width:56px;height:56px;border-radius:11px;object-fit:cover;
  box-shadow:0 8px 18px rgba(0,0,0,.25)
}
.sbl4-live-console__trackcopy{min-width:0}
.sbl4-live-console__trackcopy b{
  display:block;margin-top:3px;font-size:11px;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis
}
.sbl4-live-console__visualizer{display:flex;align-items:end;gap:2px;height:16px;margin-top:8px}
.sbl4-live-console__visualizer i{
  width:3px;height:5px;border-radius:999px;background:#22b7ff;
  animation:sbl4Wave 1.05s ease-in-out infinite;animation-play-state:paused
}
.sbl4-live-console__visualizer i:nth-child(2){animation-delay:.12s}
.sbl4-live-console__visualizer i:nth-child(3){animation-delay:.24s}
.sbl4-live-console__visualizer i:nth-child(4){animation-delay:.36s}
.sbl4-live-console__visualizer i:nth-child(5){animation-delay:.48s}
.sbl4-live-console__visualizer i:nth-child(6){animation-delay:.60s}
.sbl4-body.sbl4-is-playing .sbl4-live-console__visualizer i{animation-play-state:running}
.sbl4-live-stage--pro .sbl4-live-stage__actions{margin-top:12px!important}
.sbl4-live-facts{margin-top:14px}
.sbl4-live-facts .sbl4-info-tile{
  min-height:74px;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease
}
.sbl4-live-facts .sbl4-info-tile:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(7,29,53,.07);border-color:#bddff5}
.sbl4-live-schedule-card{margin-top:14px}
.sbl4-live-schedule{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin-top:10px}
.sbl4-live-schedule__row{
  border:1px solid var(--sbl4-border)!important;border-radius:13px;padding:10px!important;
  background:var(--sbl4-card);transition:transform .18s ease,box-shadow .18s ease
}
.sbl4-live-schedule__row:hover{transform:translateY(-2px);box-shadow:0 10px 22px rgba(7,29,53,.06)}
.sbl4-live-schedule__row.is-active{
  background:linear-gradient(135deg,#fff3f4,#fff)!important;border-color:#ffc3c8!important;
  box-shadow:0 10px 24px rgba(239,51,64,.08)
}

/* FULL SCHEDULE PAGE */
.sbl4-schedule-page .sbl4-page-hero{margin-bottom:14px}
.sbl4-full-schedule-card{
  padding:16px!important;box-shadow:0 15px 34px rgba(7,29,53,.055)
}
.sbl4-full-days{
  display:grid!important;grid-template-columns:repeat(7,minmax(0,1fr));gap:7px!important
}
.sbl4-full-day{
  min-height:42px!important;border-radius:10px!important;font-size:10.5px!important;font-weight:850!important;
  transition:transform .16s ease,background .16s ease,border-color .16s ease,color .16s ease
}
.sbl4-full-day:hover{transform:translateY(-1px);border-color:#9fd5f4;color:var(--sbl4-blue)}
.sbl4-full-day.is-active{background:var(--sbl4-blue)!important;color:#fff!important;border-color:var(--sbl4-blue)!important}
.sbl4-schedule-summary{margin:12px 0 14px!important;gap:8px!important}
.sbl4-schedule-summary>div{
  min-height:64px;padding:10px 12px!important;border-radius:12px!important;
  background:linear-gradient(180deg,#fbfdff,#f5f9fd)!important
}
.sbl4-full-schedule{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px
}
.sbl4-full-slot{
  grid-template-columns:104px minmax(0,1fr)!important;
  grid-template-rows:auto auto!important;
  gap:8px 12px!important;padding:10px!important;
  border:1px solid var(--sbl4-border)!important;border-radius:14px!important;
  background:var(--sbl4-card);overflow:hidden;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease
}
.sbl4-full-slot:hover{transform:translateY(-2px);border-color:#bddff5!important;box-shadow:0 10px 24px rgba(7,29,53,.07)}
.sbl4-full-slot.is-active{background:linear-gradient(145deg,#fff5f6,#fff)!important;border-color:#ffbbc1!important}
.sbl4-full-slot__image{
  grid-column:1;grid-row:1 / span 2;width:104px!important;height:auto!important;aspect-ratio:16/9;border-radius:10px!important;
  align-self:center;background:#071d33
}
.sbl4-full-slot__image img{object-fit:contain!important}
.sbl4-full-slot__time{grid-column:2;grid-row:1;display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.sbl4-full-slot__time strong{font-size:15px!important}
.sbl4-full-slot__time span{font-size:9px!important}
.sbl4-full-slot__time b{margin:0!important;font-size:8px!important}
.sbl4-full-slot__copy{grid-column:2;grid-row:2}
.sbl4-full-slot__copy small{font-size:8px!important}
.sbl4-full-slot__copy h3{font-size:14px!important;margin:2px 0 3px!important}
.sbl4-full-slot__copy p{font-size:9.5px!important;line-height:1.45;margin-bottom:4px!important}
.sbl4-full-slot__copy span{font-size:9px!important;font-weight:800}

/* PROGRAM PAGE: 4 columns modern 16:9 catalog */
.sbl4-program-page .sbl4-program-grid--rich,
.sbl4-program-grid--rich{
  grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:14px!important
}
.sbl4-program-page .sbl4-program-card--rich{
  border-radius:16px;box-shadow:0 6px 20px rgba(7,29,53,.045);
  transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;
  display:flex!important;flex-direction:column!important;height:100%!important
}
.sbl4-program-page .sbl4-program-card--rich:hover{
  transform:translateY(-3px);border-color:#bddff5;box-shadow:0 14px 30px rgba(7,29,53,.09)
}
.sbl4-program-page .sbl4-program-card__image{
  height:auto!important;aspect-ratio:16/9!important;background:#071d33!important;overflow:hidden!important
}
.sbl4-program-page .sbl4-program-card__image img{
  width:100%;height:100%;object-fit:cover!important;object-position:center;background:#071d33;display:block
}
.sbl4-program-page .sbl4-program-card__image:after{
  background:linear-gradient(0deg,rgba(0,0,0,.32),transparent 38%)!important
}
.sbl4-program-page .sbl4-program-card--rich .sbl4-program-card__body{
  min-height:0!important;flex:1!important;display:flex!important;flex-direction:column!important;padding:13px 13px 15px!important
}
.sbl4-program-page .sbl4-program-card h2{font-size:15px!important;line-height:1.25!important;margin-bottom:5px!important}
.sbl4-program-page .sbl4-program-card p{font-size:10.5px!important;line-height:1.5;min-height:32px!important;margin:0 0 8px!important}
.sbl4-program-page .sbl4-program-card__meta{font-size:9.5px!important;margin-top:8px}
.sbl4-program-page .sbl4-program-card__slots span{font-size:8px!important;padding:4px 6px}
.sbl4-program-page .sbl4-program-card__actions{margin-top:auto!important;padding-top:10px!important}
.sbl4-program-page .sbl4-program-card__actions a{font-size:9px!important;min-height:34px!important}
.sbl4-program-page .sbl4-program-status{font-size:7.5px!important;padding:4px 7px!important}
.sbl4-program-page .sbl4-program-card__image>span{font-size:7.5px!important;padding:4px 7px!important}

/* ANNOUNCER PAGE */
.sbl4-announcer-page .sbl4-announcer-grid--rich{gap:14px!important}
.sbl4-announcer-page .sbl4-announcer-card--rich{
  min-height:258px!important;border-radius:19px!important;overflow:hidden;
  grid-template-columns:150px minmax(0,1fr)!important
}
.sbl4-announcer-page .sbl4-announcer-card__body{padding:17px 15px!important}
.sbl4-announcer-page .sbl4-announcer-card__body>span{font-size:9px!important;letter-spacing:.07em}
.sbl4-announcer-page .sbl4-announcer-card h2{font-size:24px!important;line-height:1.06;margin:4px 0!important}
.sbl4-announcer-page .sbl4-announcer-card p{font-size:10px!important}
.sbl4-announcer-page .sbl4-announcer-fullname{font-weight:800;color:#5f6f80}
.sbl4-announcer-page .sbl4-announcer-metrics{margin:13px 0 10px!important;gap:6px!important}
.sbl4-announcer-page .sbl4-announcer-metrics>div{padding:8px 4px!important}
.sbl4-announcer-page .sbl4-announcer-metrics strong{font-size:16px!important}
.sbl4-announcer-page .sbl4-announcer-metrics small{font-size:8px!important}
.sbl4-announcer-page .sbl4-announcer-card__programs b{font-size:9px!important;padding:5px 7px!important}
.sbl4-announcer-page .sbl4-announcer-next>small{font-size:8px!important}
.sbl4-announcer-page .sbl4-announcer-next span{font-size:9px!important}
.sbl4-announcer-page .sbl4-announcer-next span b{min-width:105px!important}
.sbl4-announcer-page .sbl4-data-note{
  display:block;margin-top:6px;color:#7b8795;font-size:8px;font-style:normal
}
.sbl4-announcer-page .sbl4-announcer-card__photo>i{display:none!important}

/* DARK MODE internal page polish */
[data-theme="dark"] .sbl4-schedule-summary>div{background:#10243a!important}
[data-theme="dark"] .sbl4-full-slot,[data-theme="dark"] .sbl4-live-schedule__row{background:#0c1d30}
[data-theme="dark"] .sbl4-program-page .sbl4-program-card__image img{background:#071421}

/* RESPONSIVE INTERNAL PAGES */
@media (max-width:1100px){
  .sbl4-live-stage--pro .sbl4-live-stage__copy{width:64%!important}
  .sbl4-live-stage--pro .sbl4-live-stage__visual{inset:0 0 0 45%!important}
  .sbl4-live-console{grid-template-columns:1fr}
  .sbl4-live-console__track{grid-template-columns:48px minmax(0,1fr)}
  .sbl4-live-console__track img{width:48px;height:48px}
  .sbl4-program-page .sbl4-program-grid--rich{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media (max-width:760px){
  .sbl4-live-stage--pro{min-height:530px!important;border-radius:18px!important}
  .sbl4-live-stage--pro .sbl4-live-stage__visual{inset:0!important}
  .sbl4-live-stage--pro .sbl4-live-stage__visual img{object-position:68% center!important}
  .sbl4-live-stage--pro .sbl4-live-stage__bg{
    background:linear-gradient(180deg,rgba(4,38,76,.96) 0%,rgba(4,38,76,.90) 54%,rgba(4,38,76,.56) 100%)!important
  }
  .sbl4-live-stage--pro .sbl4-live-stage__copy{width:100%!important;padding:22px 15px 18px!important}
  .sbl4-live-stage--pro h1{font-size:30px!important;max-width:310px}
  .sbl4-live-stage--pro .sbl4-live-stage__copy>p{font-size:11.5px!important;max-width:315px}
  .sbl4-live-console{margin-top:14px;grid-template-columns:1fr;padding:8px;gap:7px}
  .sbl4-live-console__program{padding:9px 10px}
  .sbl4-live-console__program>strong{font-size:15px}
  .sbl4-live-console__meta{font-size:9px;flex-wrap:wrap}
  .sbl4-live-console__track{grid-template-columns:45px minmax(0,1fr)}
  .sbl4-live-console__track img{width:45px;height:45px}
  .sbl4-live-stage__visual-badge{display:none}
  .sbl4-live-facts{grid-template-columns:1fr!important}
  .sbl4-live-facts .sbl4-info-tile{min-height:62px}
  .sbl4-live-schedule{grid-template-columns:1fr}
  .sbl4-live-schedule__row{padding:9px!important}

  .sbl4-full-days{
    display:flex!important;overflow-x:auto;gap:6px!important;padding-bottom:4px;
    scroll-snap-type:x proximity;scrollbar-width:none
  }
  .sbl4-full-days::-webkit-scrollbar{display:none}
  .sbl4-full-day{flex:0 0 64px!important;min-height:44px!important;scroll-snap-align:start}
  .sbl4-full-schedule{grid-template-columns:1fr}
  .sbl4-full-slot{
    grid-template-columns:88px minmax(0,1fr)!important;gap:7px 10px!important;padding:9px!important
  }
  .sbl4-full-slot__image{width:88px!important}
  .sbl4-full-slot__time strong{font-size:13px!important}
  .sbl4-full-slot__copy h3{font-size:12.5px!important}
  .sbl4-full-slot__copy p{font-size:9px!important}

  .sbl4-program-page .sbl4-program-grid--rich{grid-template-columns:1fr!important;gap:12px!important}
  .sbl4-program-page .sbl4-program-card--rich .sbl4-program-card__body{min-height:auto!important;padding:14px!important}
  .sbl4-program-page .sbl4-program-card h2{font-size:18px!important}
  .sbl4-program-page .sbl4-program-card p{font-size:11px!important}
  .sbl4-program-page .sbl4-program-card__actions a{min-height:42px!important;font-size:11px!important}

  .sbl4-announcer-page .sbl4-announcer-card--rich{
    grid-template-columns:105px minmax(0,1fr)!important;min-height:230px!important
  }
  .sbl4-announcer-page .sbl4-announcer-card__photo img{max-height:215px!important}
  .sbl4-announcer-page .sbl4-announcer-card__body{padding:13px 10px!important}
  .sbl4-announcer-page .sbl4-announcer-card h2{font-size:19px!important}
  .sbl4-announcer-page .sbl4-announcer-card p{font-size:9.5px!important}
  .sbl4-announcer-page .sbl4-announcer-metrics strong{font-size:14px!important}
  .sbl4-announcer-page .sbl4-announcer-metrics small{font-size:7.5px!important}
}


/* ============================================================
   BETA 20 — authoritative data + final consistency pass
   ========================================================== */

/* SVG icon system */
.sbl4-ui-icon{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.sbl4-theme-icon,.sbl4-drawer-theme-icon{display:inline-grid;place-items:center}
.sbl4-drawer-theme{display:inline-flex!important;align-items:center;gap:8px}
.sbl4-drawer-theme b{font:inherit}
.sbl4-carousel-btn svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2.1;stroke-linecap:round;stroke-linejoin:round}

/* Ruang Musik — use SBL brand red family, not a separate maroon identity. */
.sbl4-music-band{
  background:
    radial-gradient(circle at 82% 12%,rgba(255,255,255,.12),transparent 23%),
    linear-gradient(135deg,#77101a 0%,#a81724 38%,#cf2431 68%,#ef3340 100%)!important;
  border-color:rgba(239,51,64,.28)!important;
  box-shadow:0 16px 38px rgba(148,20,32,.20)!important
}
.sbl4-music-band .sbl4-sub{color:#ffe9ec!important}
.sbl4-music-head-actions{align-items:center!important}
.sbl4-carousel-controls{height:40px;display:flex;align-items:center;gap:7px}
.sbl4-carousel-btn{
  width:38px!important;height:38px!important;padding:0!important;
  display:grid!important;place-items:center!important;
  color:#fff!important;border:1px solid rgba(255,255,255,.32)!important;
  background:rgba(63,6,13,.22)!important;backdrop-filter:blur(8px);
  transition:transform .18s ease,background .18s ease,border-color .18s ease
}
.sbl4-carousel-btn:hover{transform:translateY(-1px);background:rgba(255,255,255,.16)!important;border-color:rgba(255,255,255,.52)!important}

/* Never present schedule-by-clock as confirmed ON AIR. */
.sbl4-now-slot,
.sbl4-live-schedule__row b.is-scheduled,
.sbl4-full-slot__time b.is-scheduled{
  display:inline-flex;align-items:center;justify-content:center;
  border-radius:999px;background:#e7f4ff;color:#0873bb;
  font-size:9.5px!important;font-weight:900;padding:4px 7px;margin-right:6px
}
[data-theme="dark"] .sbl4-now-slot,
[data-theme="dark"] .sbl4-live-schedule__row b.is-scheduled,
[data-theme="dark"] .sbl4-full-slot__time b.is-scheduled{
  background:#14324d;color:#7ad0ff
}

/* Transparent sync/empty states — no fabricated schedule or ranking. */
.sbl4-sync-empty,.sbl4-chart-empty{
  min-height:150px;display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;padding:22px;border:1px dashed var(--sbl4-border);border-radius:13px;
  background:linear-gradient(180deg,var(--sbl4-surface),var(--sbl4-card))
}
.sbl4-sync-empty strong,.sbl4-chart-empty strong{font-family:"Outfit";font-size:15px}
.sbl4-sync-empty span,.sbl4-chart-empty span{margin-top:5px;color:var(--sbl4-muted);font-size:10.5px;line-height:1.45;max-width:330px}
.sbl4-chart-empty{min-height:260px}

/* Weather typography: preserve compact card without 6–8px copy. */
.sbl4-weather__head strong{font-size:11.5px!important}
.sbl4-weather__uv-badge{font-size:9px!important;min-width:31px!important;height:22px!important}
.sbl4-weather__advice strong{font-size:10px!important;line-height:1.25!important}
.sbl4-weather__advice p{font-size:9px!important;line-height:1.35!important}
.sbl4-weather__switch button{font-size:9px!important;min-height:29px!important}
.sbl4-weather-slot{padding:6px 1px!important}
.sbl4-weather-slot b{font-size:9px!important}
.sbl4-weather-slot strong{font-size:11px!important}
.sbl4-weather-slot small{font-size:9px!important}
.sbl4-weather-slot em{font-size:8.5px!important}
.sbl4-weather__nav button{font-size:9px!important;padding:5px 8px!important}
.sbl4-weather__foot,.sbl4-weather__foot small{font-size:9px!important}
.sbl4-weather__forecast--timeline{gap:2px!important}

/* Homepage cards: readable type, use layout rather than microscopic labels. */
.sbl4-schedule-card .sbl4-time{font-size:10.5px!important}
.sbl4-schedule-card .sbl4-program{font-size:12.3px!important}
.sbl4-schedule-card .sbl4-host{font-size:10px!important}
.sbl4-schedule-card .sbl4-onair{font-size:9.5px!important}
.sbl4-chart-row .sbl4-song strong{font-size:11px!important}
.sbl4-chart-row .sbl4-song span{font-size:9.5px!important}
.sbl4-chart-footer strong{font-size:10px!important}
.sbl4-chart-footer span{font-size:9px!important}
.sbl4-chart-footer a{font-size:9.5px!important}
.sbl4-trend span{font-size:9px!important}

/* Bottom player: metadata remains legible. */
.sbl4-player__next small{font-size:8.5px!important}
.sbl4-player__next strong{font-size:10.5px!important;line-height:1.25}
.sbl4-player__next span{font-size:9px!important;line-height:1.25}

/* Presenter page: readable labels and stats. */
.sbl4-crew-toolbar strong{font-size:11px!important}
.sbl4-crew-toolbar>div>span{font-size:9.5px!important}
.sbl4-crew-toolbar input,.sbl4-podcast-toolbar input{font-size:10.5px!important}
.sbl4-announcer-page .sbl4-announcer-card__body>span{font-size:9.5px!important}
.sbl4-announcer-page .sbl4-announcer-card p{font-size:10.5px!important}
.sbl4-announcer-page .sbl4-announcer-metrics small{font-size:9px!important}
.sbl4-announcer-page .sbl4-announcer-card__programs b{font-size:9.5px!important}
.sbl4-announcer-page .sbl4-announcer-next>small{font-size:9px!important}
.sbl4-announcer-page .sbl4-announcer-next span{font-size:9.5px!important;line-height:1.35}
.sbl4-announcer-page .sbl4-data-note{font-size:9px!important}

/* Live page metadata. */
.sbl4-live-console__program>small,.sbl4-live-console__trackcopy>small{font-size:9px!important}
.sbl4-live-console__meta{font-size:10px!important}
.sbl4-live-stage__visual-badge{font-size:9.5px!important}

/* Program cards */
.sbl4-program-page .sbl4-program-status{font-size:9.5px!important}
.sbl4-program-page .sbl4-program-card__image>span{font-size:9.5px!important}
.sbl4-program-page .sbl4-program-card__actions a{font-size:10.5px!important}

/* Functional public-service pages */
.sbl4-public-service-page .sbl4-page-hero{margin-bottom:14px}
.sbl4-public-service-card{
  display:grid;grid-template-columns:minmax(0,1.25fr) minmax(280px,.75fr);
  gap:24px;align-items:center;padding:26px!important
}
.sbl4-public-service-copy h2{font-family:"Outfit";font-size:26px;line-height:1.08;margin:5px 0 8px}
.sbl4-public-service-copy p{font-size:12px;line-height:1.65;color:var(--sbl4-muted);margin:0}
.sbl4-public-service-actions{display:grid;gap:10px}
.sbl4-public-service-actions a{
  min-height:46px;border-radius:12px;display:flex;align-items:center;justify-content:center;
  font-size:11px;font-weight:900;border:1px solid var(--sbl4-border)
}
.sbl4-public-service-actions a.is-primary{background:var(--sbl4-blue);color:#fff;border-color:var(--sbl4-blue)}
.sbl4-public-service-actions a.is-wa{background:#20b95b;color:#fff;border-color:#20b95b}
.sbl4-contact-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.sbl4-contact-grid article{padding:22px!important}
.sbl4-contact-grid small{font-size:9px;font-weight:900;letter-spacing:.08em;color:var(--sbl4-blue)}
.sbl4-contact-grid h2{font-family:"Outfit";font-size:19px;margin:6px 0}
.sbl4-contact-grid p,.sbl4-contact-grid a{font-size:11px;line-height:1.6;color:var(--sbl4-muted)}
.sbl4-contact-grid a:hover{color:var(--sbl4-blue)}

/* Internal page card typography floor */
.sbl4-full-slot__time span,.sbl4-full-slot__copy small,.sbl4-full-slot__copy span{font-size:9.5px!important}
.sbl4-full-slot__time b{font-size:9px!important}
.sbl4-full-slot__copy p{font-size:10px!important}

/* Mobile: preserve readability and avoid overlap. */
@media (max-width:760px){
  .sbl4-weather__summary{grid-template-columns:108px minmax(0,1fr)!important}
  .sbl4-weather__advice strong{font-size:9.5px!important}
  .sbl4-weather__advice p{font-size:8.8px!important}
  .sbl4-weather-slot{min-width:50px!important}
  .sbl4-weather-slot b{font-size:8.5px!important}
  .sbl4-weather-slot strong{font-size:10.5px!important}
  .sbl4-weather-slot small{font-size:8.5px!important}
  .sbl4-weather-slot em{font-size:8px!important}

  .sbl4-schedule-card .sbl4-time{font-size:9.5px!important}
  .sbl4-schedule-card .sbl4-program{font-size:11px!important}
  .sbl4-schedule-card .sbl4-host{font-size:9px!important}

  .sbl4-public-service-card{grid-template-columns:1fr;padding:18px!important}
  .sbl4-public-service-copy h2{font-size:22px}
  .sbl4-public-service-copy p{font-size:11px}
  .sbl4-contact-grid{grid-template-columns:1fr}
  .sbl4-contact-grid article{padding:17px!important}

  .sbl4-player__next{min-width:0}
  .sbl4-player__next small{font-size:8px!important}
  .sbl4-player__next strong{font-size:9.5px!important}
  .sbl4-player__next span{font-size:8.5px!important}
}


/* Full weather modal */
.sbl4-weather-modal{position:fixed;inset:0;z-index:1650;display:none;align-items:center;justify-content:center;padding:20px}
.sbl4-weather-modal.is-open{display:flex}
.sbl4-weather-modal__backdrop{position:absolute;inset:0;border:0;background:rgba(3,16,31,.66);backdrop-filter:blur(8px)}
.sbl4-weather-modal__dialog{
  position:relative;z-index:2;width:min(720px,calc(100vw - 28px));overflow:hidden;
  border-radius:22px;background:var(--sbl4-card);border:1px solid var(--sbl4-border);
  box-shadow:0 30px 90px rgba(2,12,25,.32)
}
.sbl4-weather-modal__head,.sbl4-weather-modal__foot{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:18px 20px}
.sbl4-weather-modal__head{border-bottom:1px solid var(--sbl4-border)}
.sbl4-weather-modal__head span{font-size:9px;font-weight:900;letter-spacing:.09em;color:var(--sbl4-blue)}
.sbl4-weather-modal__head h2{font-family:"Outfit";font-size:24px;margin:3px 0 0}
.sbl4-weather-modal__close{width:38px;height:38px;border-radius:50%;border:1px solid var(--sbl4-border);background:var(--sbl4-surface);color:var(--sbl4-text);font-size:22px}
.sbl4-weather-modal__body{padding:14px 20px;display:grid;gap:8px}
.sbl4-weather-modal__day{
  display:grid;grid-template-columns:100px 42px minmax(0,1fr) 86px;gap:12px;align-items:center;
  padding:12px;border:1px solid var(--sbl4-border);border-radius:13px;background:var(--sbl4-surface)
}
.sbl4-weather-modal__day>div:first-child strong,.sbl4-weather-modal__condition b,.sbl4-weather-modal__temp strong{display:block}
.sbl4-weather-modal__day>div:first-child strong{font-size:11px}
.sbl4-weather-modal__day>div:first-child span{font-size:9px;color:var(--sbl4-muted)}
.sbl4-weather-modal__condition b{font-size:11px}.sbl4-weather-modal__condition span{font-size:9px;color:var(--sbl4-muted)}
.sbl4-weather-modal__temp{text-align:right}.sbl4-weather-modal__temp strong{font-family:"Outfit";font-size:20px}.sbl4-weather-modal__temp span{font-size:10px;color:var(--sbl4-muted)}
.sbl4-weather-modal__foot{border-top:1px solid var(--sbl4-border);font-size:9px;color:var(--sbl4-muted)}
@media(max-width:600px){
  .sbl4-weather-modal{padding:10px}
  .sbl4-weather-modal__day{grid-template-columns:74px 34px minmax(0,1fr) 56px;gap:7px;padding:10px}
  .sbl4-weather-modal__body{padding:10px}
  .sbl4-weather-modal__head,.sbl4-weather-modal__foot{padding:14px}
  .sbl4-weather-modal__head h2{font-size:20px}
  .sbl4-weather-modal__condition span{font-size:8.5px}
}


/* Final mobile typography floor for persistent player */
@media(max-width:760px){
  .sbl4-player__live{font-size:8.5px!important}
  .sbl4-player__title{font-size:10px!important}
  .sbl4-player__meta{font-size:9px!important}
}


.sbl4-public-service-hero{
  background:radial-gradient(circle at 90% 15%,rgba(61,188,112,.17),transparent 28%),linear-gradient(135deg,#fff,#eefaf2)!important;
  border-color:#d3ecdc!important
}
[data-theme="dark"] .sbl4-public-service-hero{
  background:linear-gradient(135deg,#10251b,#143323)!important;border-color:#285c40!important
}


/* ============================================================
   BETA 21 — CENTOVA PREVIOUS TRACK
   ========================================================== */

/* Permanent player uses four areas only when a real previous track exists. */
.sbl4-player[data-has-history="1"] .sbl4-player__in{
  grid-template-columns:minmax(290px,1.22fr) minmax(260px,.68fr) minmax(220px,.70fr) minmax(145px,.40fr)!important
}
.sbl4-player[data-has-history="0"] .sbl4-player__in{
  grid-template-columns:minmax(330px,1.35fr) minmax(300px,.82fr) minmax(150px,.42fr)!important
}
.sbl4-player[data-has-history="0"] .sbl4-player__right{grid-column:3}
.sbl4-player__history{min-width:0}
.sbl4-player__history[hidden]{display:none!important}
.sbl4-player__history small{
  display:block;margin-bottom:3px;color:#7fa0bb;
  font-size:9px;font-weight:900;letter-spacing:.08em
}
.sbl4-player__history strong{
  display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  color:#fff;font-size:10.5px;line-height:1.25
}
.sbl4-player__history span{
  display:block;min-height:11px;margin-top:2px;color:#8fa9bf;font-size:8.5px;line-height:1.2
}
.sbl4-volume-icon{display:grid;place-items:center;width:20px;height:20px;color:#e8f4ff}
.sbl4-volume-icon svg{
  width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;
  stroke-linecap:round;stroke-linejoin:round
}
.sbl4-centova-recenttracks-probe{
  position:fixed!important;left:-100000px!important;top:-100000px!important;
  width:1px!important;height:1px!important;overflow:hidden!important;opacity:0!important;
  pointer-events:none!important
}

/* Tablet keeps previous-track context if room permits. */
@media(max-width:1050px) and (min-width:761px){
  .sbl4-player[data-has-history="1"] .sbl4-player__in{
    grid-template-columns:minmax(240px,1fr) minmax(220px,.75fr) minmax(175px,.62fr) 120px!important;
    gap:12px!important
  }
  .sbl4-player[data-has-history="0"] .sbl4-player__in{
    grid-template-columns:minmax(280px,1.1fr) minmax(230px,.8fr) 125px!important
  }
  .sbl4-player__history strong{font-size:9.8px}
}

/* On phones the player remains compact; history is deliberately omitted. */
@media(max-width:760px){
  .sbl4-player__history{display:none!important}
  .sbl4-player[data-has-history="1"] .sbl4-player__in,
  .sbl4-player[data-has-history="0"] .sbl4-player__in{
    grid-template-columns:minmax(0,1fr) 44px!important
  }
  .sbl4-player[data-has-history="0"] .sbl4-player__right{grid-column:auto}
}

/* ============================================================
   BETA 22 — BALANCED MULTI-COLUMN INTERNAL PAGES & 16:9 COVERS
   Menata ulang halaman program (4 kolom 16:9), penyiar (3 kolom),
   podcast (3 kolom), dan ruang musik agar proporsional di desktop
   tanpa merusak estetika yang sudah baik.
   ============================================================ */

/* --- 1. Halaman Program (Desktop 4 Kolom, Rasio Cover 16:9 Konsisten) --- */
.sbl4-program-page .sbl4-program-grid,
.sbl4-program-page .sbl4-program-grid--rich,
.sbl4-program-grid,
.sbl4-program-grid--rich {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 14px !important;
}

.sbl4-program-card,
.sbl4-program-card--rich {
  display: flex !important;
  flex-direction: column !important;
  background: var(--sbl4-card);
  border: 1px solid var(--sbl4-border);
  border-radius: var(--sbl4-r2);
  overflow: hidden;
  box-shadow: 0 4px 18px rgba(7, 29, 53, .04);
  transition: transform .2s ease, box-shadow .2s ease;
  height: 100%;
}

.sbl4-program-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 10px 26px rgba(7, 29, 53, .08);
}

.sbl4-program-card__image,
.sbl4-program-grid--rich .sbl4-program-card__image {
  position: relative !important;
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 16 / 9 !important;
  min-height: 0 !important;
  background: #17314d !important;
  overflow: hidden !important;
}

.sbl4-program-card__image img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
  transition: transform .35s ease;
}

.sbl4-program-card:hover .sbl4-program-card__image img {
  transform: scale(1.04);
}

.sbl4-program-card__body,
.sbl4-program-grid--rich .sbl4-program-card__body {
  display: flex !important;
  flex-direction: column !important;
  flex: 1 !important;
  padding: 14px 15px 16px !important;
  min-height: 0 !important;
}

.sbl4-program-card h2 {
  font-family: "Outfit", sans-serif;
  font-size: 16px !important;
  line-height: 1.25 !important;
  margin: 0 0 6px !important;
  letter-spacing: -.015em;
}

.sbl4-program-card p,
.sbl4-program-grid--rich .sbl4-program-card__body > p {
  font-size: 11px !important;
  line-height: 1.55 !important;
  color: var(--sbl4-muted) !important;
  margin: 0 0 10px !important;
  min-height: 34px !important;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.sbl4-program-card__meta {
  font-size: 10.5px !important;
  font-weight: 700 !important;
  color: var(--sbl4-text) !important;
  margin-top: auto !important;
  padding-top: 4px !important;
}

.sbl4-program-card__slots {
  display: flex !important;
  gap: 4px !important;
  flex-wrap: wrap !important;
  margin-top: 8px !important;
}

.sbl4-program-card__slots span {
  font-size: 9px !important;
  border: 1px solid var(--sbl4-border) !important;
  background: var(--sbl4-surface) !important;
  border-radius: 999px !important;
  padding: 3px 8px !important;
  white-space: nowrap !important;
}

.sbl4-program-card__actions {
  display: flex !important;
  gap: 6px !important;
  margin-top: 12px !important;
  padding-top: 10px !important;
  border-top: 1px solid var(--sbl4-border);
}

.sbl4-program-card__actions a {
  flex: 1 !important;
  min-height: 34px !important;
  border: 1px solid var(--sbl4-border) !important;
  border-radius: 9px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 10px !important;
  font-weight: 800 !important;
}

/* Responsif Program Grid: 4 Kolom di seluruh desktop & laptop (>= 881px) */
@media (max-width: 880px) and (min-width: 561px) {
  .sbl4-program-grid,
  .sbl4-program-grid--rich {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px !important;
  }
}

@media (max-width: 560px) {
  .sbl4-program-grid,
  .sbl4-program-grid--rich {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }
}

/* --- 2. Halaman Penyiar (Studio Portrait Cards — Mewah, Elegan & Proporsional) --- */
.sbl4-announcer-grid--rich {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 22px !important;
}

.sbl4-announcer-card--rich {
  display: flex !important;
  flex-direction: column !important;
  grid-template-columns: none !important;
  position: relative !important;
  overflow: hidden !important;
  border-radius: 24px !important;
  background: var(--sbl4-card) !important;
  border: 1px solid var(--sbl4-border) !important;
  box-shadow: 0 10px 30px rgba(7, 29, 53, 0.06) !important;
  cursor: pointer !important;
  transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.3s ease, border-color 0.3s ease !important;
}

.sbl4-announcer-card--rich:hover {
  transform: translateY(-6px) !important;
  box-shadow: 0 20px 48px rgba(7, 29, 53, 0.12) !important;
  border-color: rgba(8, 102, 181, 0.35) !important;
}

.sbl4-announcer-card--rich.is-selected {
  border-color: var(--sbl4-blue) !important;
  box-shadow: 0 0 0 3px rgba(8, 102, 181, 0.18), 0 20px 48px rgba(7, 29, 53, 0.12) !important;
}

.sbl4-announcer-card--rich.is-onair {
  border-color: #ef3340 !important;
  box-shadow: 0 0 0 3px rgba(239, 51, 64, 0.22), 0 22px 50px rgba(239, 51, 64, 0.16) !important;
}

/* Zona Foto Portrait Studio */
.sbl4-announcer-card--rich .sbl4-announcer-card__photo {
  position: relative !important;
  width: 100% !important;
  height: 320px !important;
  min-height: 320px !important;
  max-height: 340px !important;
  aspect-ratio: auto !important;
  display: flex !important;
  align-items: flex-end !important;
  justify-content: center !important;
  overflow: hidden !important;
  background: radial-gradient(circle at 50% 30%, #1e4b7a 0%, #072545 100%) !important;
  isolation: isolate;
}

.sbl4-announcer-card--rich .sbl4-announcer-card__photo:after {
  display: none !important;
}

.sbl4-announcer-photo-frame {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: flex-end;
  justify-content: center;
}

.sbl4-announcer-card--rich .sbl4-announcer-card__photo img {
  width: 100% !important;
  height: 100% !important;
  max-height: 320px !important;
  object-fit: contain !important;
  object-position: center bottom !important;
  filter: drop-shadow(0 14px 22px rgba(0, 0, 0, 0.38)) !important;
  transition: transform 0.4s cubic-bezier(0.2, 0.7, 0.2, 1), filter 0.3s ease !important;
}

.sbl4-announcer-card--rich:hover .sbl4-announcer-card__photo img {
  transform: scale(1.04) !important;
  filter: drop-shadow(0 18px 28px rgba(0, 0, 0, 0.48)) !important;
}

.sbl4-announcer-photo-label {
  position: absolute !important;
  right: 12px !important;
  bottom: 12px !important;
  padding: 4px 10px !important;
  border-radius: 999px !important;
  background: rgba(3, 20, 38, 0.65) !important;
  color: #bfe3fc !important;
  font-size: 8px !important;
  font-weight: 850 !important;
  letter-spacing: 0.05em !important;
  backdrop-filter: blur(8px) !important;
  border: 1px solid rgba(255, 255, 255, 0.15) !important;
  z-index: 4 !important;
}

/* Badge ON AIR Animasi Radar di Halaman Penyiar */
.sbl4-announcer-live {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  position: absolute !important;
  top: 14px !important;
  left: 14px !important;
  z-index: 5 !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 5px 11px !important;
  border-radius: 999px !important;
  background: linear-gradient(135deg, #ff3b4b, #d91424) !important;
  color: #fff !important;
  font-size: 9px !important;
  font-weight: 900 !important;
  letter-spacing: 0.06em !important;
  box-shadow: 0 6px 18px rgba(239, 51, 64, 0.45) !important;
  border: 1px solid rgba(255, 255, 255, 0.35) !important;
}

.sbl4-announcer-card--rich.is-onair .sbl4-announcer-live {
  display: inline-flex !important;
  visibility: visible !important;
  opacity: 1 !important;
}

.sbl4-announcer-live i.sbl4-live-dot,
.sbl4-announcer-live b {
  width: 7px !important;
  height: 7px !important;
  border-radius: 50% !important;
  background: #fff !important;
  display: inline-block !important;
  animation: sbl4RadarPulse 1.4s infinite cubic-bezier(0.66, 0, 0, 1) !important;
}

/* Zona Informasi Bawah */
.sbl4-announcer-card--rich .sbl4-announcer-card__body {
  display: flex !important;
  flex: 1 !important;
  flex-direction: column !important;
  padding: 22px 20px 20px !important;
}

.sbl4-announcer-card__tagrow {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  margin-bottom: 8px !important;
}

.sbl4-announcer-badge {
  font-size: 8.5px !important;
  font-weight: 900 !important;
  letter-spacing: 0.08em !important;
  color: var(--sbl4-blue) !important;
  background: rgba(8, 102, 181, 0.08) !important;
  padding: 3px 8px !important;
  border-radius: 6px !important;
}

.sbl4-announcer-station {
  font-size: 8.5px !important;
  font-weight: 800 !important;
  color: var(--sbl4-muted) !important;
}

.sbl4-announcer-name {
  font-family: "Outfit", sans-serif !important;
  font-size: 24px !important;
  font-weight: 800 !important;
  line-height: 1.15 !important;
  margin: 0 0 4px !important;
  color: var(--sbl4-text) !important;
  letter-spacing: -0.02em !important;
}

.sbl4-announcer-meta {
  font-size: 11px !important;
  color: var(--sbl4-muted) !important;
  margin: 0 0 14px !important;
  line-height: 1.4 !important;
}

.sbl4-announcer-fullname {
  color: var(--sbl4-text) !important;
  font-weight: 600 !important;
}

.sbl4-announcer-card--rich .sbl4-announcer-metrics {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 8px !important;
  margin: 0 0 14px !important;
}

.sbl4-announcer-card--rich .sbl4-announcer-metrics > div {
  padding: 8px 4px !important;
  border-radius: 12px !important;
  background: var(--sbl4-surface) !important;
  border: 1px solid var(--sbl4-border) !important;
  text-align: center !important;
}

.sbl4-announcer-card--rich .sbl4-announcer-metrics strong {
  display: block !important;
  font-size: 15px !important;
  font-weight: 850 !important;
  color: var(--sbl4-text) !important;
}

.sbl4-announcer-card--rich .sbl4-announcer-metrics small {
  display: block !important;
  font-size: 8.5px !important;
  color: var(--sbl4-muted) !important;
  margin-top: 2px !important;
}

.sbl4-announcer-card__programs {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
  margin-bottom: 14px !important;
}

.sbl4-announcer-card__programs b {
  font-size: 9px !important;
  font-weight: 750 !important;
  padding: 4px 8px !important;
  border-radius: 999px !important;
  background: #eaf4fd !important;
  color: #0b68af !important;
  border: 1px solid #d3e7f9 !important;
}

[data-theme="dark"] .sbl4-announcer-card__programs b {
  background: #112d47 !important;
  color: #8cc8f5 !important;
  border-color: #1a4163 !important;
}

.sbl4-announcer-next {
  margin-top: auto !important;
  margin-bottom: 14px !important;
  padding: 10px 12px !important;
  border-radius: 12px !important;
  background: var(--sbl4-surface) !important;
  border: 1px dashed var(--sbl4-border) !important;
}

.sbl4-announcer-next small {
  display: block !important;
  font-size: 8px !important;
  font-weight: 900 !important;
  color: var(--sbl4-muted) !important;
  letter-spacing: 0.08em !important;
  margin-bottom: 4px !important;
}

.sbl4-announcer-next span {
  font-size: 9.5px !important;
  color: var(--sbl4-text) !important;
  line-height: 1.4 !important;
}

.sbl4-announcer-profile-button {
  display: flex !important;
  width: 100% !important;
  min-height: 42px !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 0 16px !important;
  border: 1px solid var(--sbl4-border) !important;
  border-radius: 12px !important;
  background: var(--sbl4-surface) !important;
  color: var(--sbl4-blue) !important;
  font-size: 10px !important;
  font-weight: 850 !important;
  cursor: pointer !important;
  transition: all 0.25s ease !important;
}

.sbl4-announcer-profile-button:hover {
  background: var(--sbl4-blue) !important;
  border-color: var(--sbl4-blue) !important;
  color: #fff !important;
  box-shadow: 0 6px 18px rgba(8, 102, 181, 0.25) !important;
}

.sbl4-announcer-profile-button:hover .sbl4-btn-arrow {
  transform: translateX(4px) !important;
}

.sbl4-btn-arrow {
  font-size: 16px !important;
  transition: transform 0.2s ease !important;
}

@media (max-width: 1150px) and (min-width: 761px) {
  .sbl4-announcer-grid--rich {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 18px !important;
  }
}

@media (max-width: 760px) {
  .sbl4-announcer-grid--rich {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }
  .sbl4-announcer-card--rich .sbl4-announcer-card__photo {
    height: 290px !important;
  }
}

/* --- 3. Halaman Podcast (Desktop 3 Kolom Modern Card dengan Cover 16:9) --- */
.sbl4-on-demand-grid,
.sbl4-on-demand-grid--podcast {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 16px !important;
}

.sbl4-on-demand-card {
  display: flex !important;
  flex-direction: column !important;
  border-radius: var(--sbl4-r2) !important;
  overflow: hidden !important;
  box-shadow: 0 4px 18px rgba(7, 29, 53, .04);
  transition: transform .2s ease, box-shadow .2s ease;
  height: 100%;
}

.sbl4-on-demand-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 10px 24px rgba(7, 29, 53, .08);
}

.sbl4-on-demand-card__image {
  position: relative !important;
  width: 100% !important;
  aspect-ratio: 16 / 9 !important;
  height: auto !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

.sbl4-on-demand-card__image img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}

.sbl4-on-demand-card > div {
  padding: 14px 15px 16px !important;
  display: flex !important;
  flex-direction: column !important;
  flex: 1 !important;
}

.sbl4-on-demand-card h2 {
  font-family: "Outfit", sans-serif;
  font-size: 15px !important;
  line-height: 1.25 !important;
  margin: 4px 0 6px !important;
}

.sbl4-on-demand-card p {
  font-size: 11px !important;
  line-height: 1.55 !important;
  color: var(--sbl4-muted) !important;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  margin: 0 0 10px !important;
}

.sbl4-on-demand-card b {
  margin-top: auto !important;
  font-size: 9.5px !important;
}

@media (max-width: 1100px) and (min-width: 761px) {
  .sbl4-on-demand-grid,
  .sbl4-on-demand-grid--podcast {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 14px !important;
  }
}

@media (max-width: 760px) {
  .sbl4-on-demand-grid,
  .sbl4-on-demand-grid--podcast {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }
}

/* --- 4. Halaman Ruang Musik (Cover 16:9 & Card Proporsional) --- */
.sbl4-music-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 16px !important;
}

.sbl4-music-profile {
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
  border-radius: var(--sbl4-r2) !important;
  overflow: hidden !important;
  box-shadow: 0 4px 18px rgba(7, 29, 53, .04);
  transition: transform .2s ease, box-shadow .2s ease;
}

.sbl4-music-profile:hover {
  transform: translateY(-3px);
  box-shadow: 0 10px 24px rgba(7, 29, 53, .08);
}

.sbl4-music-profile > div {
  width: 100% !important;
  aspect-ratio: 16 / 9 !important;
  height: auto !important;
  position: relative !important;
  overflow: hidden !important;
}

.sbl4-music-profile h2 {
  font-size: 15px !important;
  margin: 10px 12px 4px !important;
}

.sbl4-music-profile p {
  font-size: 11px !important;
  margin: 0 12px 12px !important;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

@media (max-width: 1200px) and (min-width: 861px) {
  .sbl4-music-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 860px) and (min-width: 541px) {
  .sbl4-music-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 540px) {
  .sbl4-music-grid {
    grid-template-columns: 1fr !important;
  }
}

/* --- 5. Halaman Warta & Arsip Berita (Desktop 4 Kolom & Cover 16:9) --- */
.sbl4-archive-grid,
.sbl4-warta-page-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 16px !important;
}

.sbl4-archive-card,
.sbl4-warta-card,
.sbl4-warta-feature {
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
  background: var(--sbl4-card);
  border: 1px solid var(--sbl4-border);
  border-radius: var(--sbl4-r2);
  overflow: hidden;
  box-shadow: 0 4px 18px rgba(7, 29, 53, .04);
  transition: transform .2s ease, box-shadow .2s ease;
}

.sbl4-archive-card:hover,
.sbl4-warta-card:hover,
.sbl4-warta-feature:hover {
  transform: translateY(-3px);
  box-shadow: 0 10px 24px rgba(7, 29, 53, .08);
}

.sbl4-archive-card__image,
.sbl4-warta-image {
  position: relative !important;
  width: 100% !important;
  aspect-ratio: 16 / 9 !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: hidden !important;
  background: linear-gradient(135deg, #0a3358, #0b76c5) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.sbl4-archive-card__image img,
.sbl4-warta-image img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
  transition: transform .35s ease;
}

.sbl4-archive-card:hover .sbl4-archive-card__image img,
.sbl4-warta-card:hover .sbl4-warta-image img,
.sbl4-warta-feature:hover .sbl4-warta-image img {
  transform: scale(1.04);
}

.sbl4-archive-card__body,
.sbl4-warta-card > div,
.sbl4-warta-feature > div {
  padding: 14px 15px 16px !important;
  display: flex !important;
  flex-direction: column !important;
  flex: 1 !important;
  min-height: 0 !important;
}

.sbl4-archive-card small,
.sbl4-warta-card small,
.sbl4-warta-feature small {
  font-size: 10px !important;
  font-weight: 600;
  color: var(--sbl4-muted) !important;
  margin-bottom: 5px !important;
  display: block;
}

.sbl4-archive-card h2,
.sbl4-warta-card h2,
.sbl4-warta-feature h2 {
  font-family: "Outfit", sans-serif;
  font-size: 14.5px !important;
  line-height: 1.3 !important;
  margin: 0 0 8px !important;
  letter-spacing: -.01em;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.sbl4-warta-feature h2 {
  font-size: 17px !important;
}

.sbl4-archive-card h2 a,
.sbl4-warta-card h2 a,
.sbl4-warta-feature h2 a {
  color: var(--sbl4-text);
  transition: color .2s ease;
}

.sbl4-archive-card h2 a:hover,
.sbl4-warta-card h2 a:hover,
.sbl4-warta-feature h2 a:hover {
  color: var(--sbl4-blue);
}

.sbl4-archive-card p,
.sbl4-warta-card p,
.sbl4-warta-feature p {
  font-size: 11px !important;
  line-height: 1.55 !important;
  color: var(--sbl4-muted) !important;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  margin: 0 0 12px !important;
}

.sbl4-archive-card__more {
  margin-top: auto !important;
  font-size: 10.5px !important;
  font-weight: 800 !important;
  color: var(--sbl4-blue) !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px;
  padding-top: 8px;
  border-top: 1px solid var(--sbl4-border);
}

.sbl4-archive-card__more:hover {
  text-decoration: underline;
}

.sbl4-warta-feature {
  grid-column: span 2 !important;
}

@media (max-width: 1024px) and (min-width: 761px) {
  .sbl4-archive-grid,
  .sbl4-warta-page-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 14px !important;
  }
  .sbl4-warta-feature {
    grid-column: 1 / -1 !important;
  }
}

@media (max-width: 760px) {
  .sbl4-archive-grid,
  .sbl4-warta-page-grid {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }
  .sbl4-warta-feature {
    grid-column: auto !important;
  }
}

/* --- 6. Suara di Balik SBL: Didefinisikan secara komprehensif pada Bagian SBL Web 4.1.3 di baris 4161 (Desktop: Horizontal 90% Tinggi Card, Mobile: Vertikal 90% Lebar Card) --- */

/* --- 7. SBL Top Chart: Badge Sumber Data Resmi & Indikator Trend Modern --- */
.sbl4-chart-source-badge {
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  margin-top: 5px !important;
  font-size: 9.5px !important;
  font-weight: 750 !important;
  color: var(--sbl4-blue) !important;
  text-decoration: none !important;
  transition: opacity .2s ease;
}
.sbl4-chart-source-badge:hover {
  text-decoration: underline !important;
  opacity: .85;
}
.sbl4-chart-source-badge svg {
  width: 12px;
  height: 12px;
  stroke: currentColor;
  stroke-width: 2;
  fill: none;
}

.sbl4-chart-footer {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  margin-top: 14px !important;
  padding-top: 12px !important;
  border-top: 1px solid var(--sbl4-border) !important;
}
.sbl4-chart-footer-actions {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}
.sbl4-chart-source-link {
  display: inline-flex !important;
  align-items: center !important;
  background: var(--sbl4-surface) !important;
  border: 1px solid var(--sbl4-border) !important;
  color: var(--sbl4-text) !important;
  border-radius: 999px !important;
  padding: 6px 12px !important;
  font-size: 9.5px !important;
  font-weight: 800 !important;
  text-decoration: none !important;
  transition: all .2s ease !important;
}
.sbl4-chart-source-link:hover {
  background: #ecf6ff !important;
  border-color: var(--sbl4-blue) !important;
  color: var(--sbl4-blue) !important;
}
.sbl4-chart-wa {
  background: var(--sbl4-green) !important;
  color: #fff !important;
  border-radius: 999px !important;
  padding: 6px 13px !important;
  font-size: 9.5px !important;
  font-weight: 800 !important;
  text-decoration: none !important;
}

/* Redesain Elegan untuk Icon & Badge Peringkat (Trend Indicators) */
.sbl4-chart-row {
  grid-template-columns: 28px 40px minmax(0, 1fr) auto 32px !important;
  gap: 10px !important;
  align-items: center !important;
}

.sbl4-trend {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 4px 10px !important;
  border-radius: 999px !important;
  font-size: 10px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
  min-width: 0 !important;
  transition: transform .2s ease, box-shadow .2s ease !important;
}

.sbl4-trend i {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 17px !important;
  height: 17px !important;
  border-radius: 50% !important;
  flex: 0 0 17px !important;
}

.sbl4-trend i svg {
  width: 11px !important;
  height: 11px !important;
  display: block !important;
}

.sbl4-trend span {
  font-size: 9.5px !important;
  font-weight: 800 !important;
}

/* NAIK (UP) */
.sbl4-trend.up {
  background: rgba(16, 185, 129, 0.12) !important;
  color: #059669 !important;
  border: 1px solid rgba(16, 185, 129, 0.28) !important;
}
.sbl4-trend.up i {
  background: #10b981 !important;
  color: #fff !important;
  box-shadow: 0 2px 6px rgba(16, 185, 129, 0.35) !important;
}
.sbl4-chart-row:hover .sbl4-trend.up {
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(16, 185, 129, 0.22);
}

/* TURUN (DOWN) */
.sbl4-trend.down {
  background: rgba(239, 68, 68, 0.12) !important;
  color: #dc2626 !important;
  border: 1px solid rgba(239, 68, 68, 0.28) !important;
}
.sbl4-trend.down i {
  background: #ef4444 !important;
  color: #fff !important;
  box-shadow: 0 2px 6px rgba(239, 68, 68, 0.35) !important;
}
.sbl4-chart-row:hover .sbl4-trend.down {
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(239, 68, 68, 0.22);
}

/* TETAP (SAME) */
.sbl4-trend.same {
  background: rgba(100, 116, 139, 0.08) !important;
  color: #475569 !important;
  border: 1px solid rgba(100, 116, 139, 0.22) !important;
}
.sbl4-trend.same i {
  background: #94a3b8 !important;
  color: #fff !important;
}

/* BARU (NEW ENTRY) */
.sbl4-trend.new {
  background: linear-gradient(135deg, rgba(245, 158, 11, 0.15), rgba(251, 191, 36, 0.25)) !important;
  color: #b45309 !important;
  border: 1px solid rgba(245, 158, 11, 0.38) !important;
}
.sbl4-trend.new i {
  background: #f59e0b !important;
  color: #fff !important;
  box-shadow: 0 2px 6px rgba(245, 158, 11, 0.35) !important;
}

[data-theme="dark"] .sbl4-trend.up {
  background: rgba(16, 185, 129, 0.18) !important;
  color: #34d399 !important;
}
[data-theme="dark"] .sbl4-trend.down {
  background: rgba(239, 68, 68, 0.18) !important;
  color: #f87171 !important;
}
[data-theme="dark"] .sbl4-trend.same {
  background: rgba(148, 163, 184, 0.12) !important;
  color: #cbd5e1 !important;
  border-color: rgba(148, 163, 184, 0.25) !important;
}
[data-theme="dark"] .sbl4-trend.new {
  background: rgba(245, 158, 11, 0.2) !important;
  color: #fbbf24 !important;
}

.sbl4-chart-go {
  width: 28px !important;
  height: 28px !important;
  border-radius: 50% !important;
  display: grid !important;
  place-items: center !important;
  font-size: 10px !important;
}

/* 4.0.1 — focused production hardening */
.sbl4-ticker__pause{width:28px;height:28px;flex:0 0 auto;border:1px solid var(--sbl4-border);border-radius:50%;background:var(--sbl4-surface);color:var(--sbl4-muted);font-size:10px;font-weight:900;display:grid;place-items:center}
.sbl4-ticker__pause:hover,.sbl4-ticker__pause:focus-visible{border-color:var(--sbl4-blue);color:var(--sbl4-blue)}
.sbl4-public-summary{max-width:780px;margin:18px 0;padding:18px 20px;background:var(--sbl4-card);border:1px solid var(--sbl4-border);border-radius:var(--sbl4-r2)}
.sbl4-public-summary h2{font-family:"Outfit",sans-serif;font-size:21px;margin:4px 0 6px}.sbl4-public-summary p{color:var(--sbl4-muted);font-size:12px;line-height:1.7;margin:0}
.sbl4-page-hero--video{background:linear-gradient(125deg,#071d35,#0a4774);color:#fff}.sbl4-page-hero--video p{color:#d3e4f2}.sbl4-page-hero__buttons .is-youtube{background:#e62117;color:#fff;border-color:#e62117}
.sbl4-video-section{margin-top:18px}.sbl4-video-search input{height:40px;width:min(280px,70vw);border:1px solid var(--sbl4-border);border-radius:999px;background:var(--sbl4-card);color:var(--sbl4-text);padding:0 14px}
.sbl4-video-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.sbl4-video-card{overflow:hidden;background:var(--sbl4-card);border:1px solid var(--sbl4-border);border-radius:var(--sbl4-r2);box-shadow:var(--sbl4-shadow)}.sbl4-video-card.is-featured{grid-column:span 2}.sbl4-video-facade{position:relative;width:100%;padding:0;border:0;background:#071d35;aspect-ratio:16/9;overflow:hidden}.sbl4-video-facade img{width:100%;height:100%;object-fit:cover}.sbl4-video-facade>span{position:absolute;inset:50% auto auto 50%;transform:translate(-50%,-50%);width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:#e62117;color:#fff;box-shadow:0 8px 24px rgba(0,0,0,.3)}.sbl4-video-card>div{padding:14px}.sbl4-video-card small{font-size:9px;color:var(--sbl4-muted)}.sbl4-video-card h3{font-family:"Outfit",sans-serif;font-size:15px;line-height:1.35;margin:5px 0 10px}.sbl4-video-card a{font-size:9px;font-weight:900;color:var(--sbl4-blue)}.sbl4-video-empty{padding:24px;text-align:center;color:var(--sbl4-muted)}
:where(a,button,input,select,textarea,[tabindex]):focus-visible{outline:3px solid #12a8ff;outline-offset:3px}
@media(max-width:760px){.sbl4-video-grid{grid-template-columns:1fr 1fr}.sbl4-video-card.is-featured{grid-column:1/-1}.sbl4-video-search input{width:100%}}
@media(max-width:430px){.sbl4-video-grid{grid-template-columns:1fr}.sbl4-video-card.is-featured{grid-column:auto}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto!important}*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}

/* 4.0.2 — professional single article experience */
.sbl4-article-page{background:radial-gradient(circle at 50% 0,rgba(18,168,255,.055),transparent 34%)}
.sbl4-article{max-width:1040px;margin:0 auto 32px}.sbl4-article__head{padding:28px 54px 32px}.sbl4-article__category{padding:7px 12px;font-size:10px;box-shadow:inset 0 0 0 1px rgba(8,102,181,.08)}
.sbl4-article__head h1{font-size:clamp(38px,4.4vw,62px);line-height:1.05;letter-spacing:-.038em;max-width:980px;margin:14px auto 18px;text-wrap:balance}
.sbl4-article__meta{gap:14px;font-size:11px}.sbl4-article__meta-item{display:inline-flex;align-items:center;gap:6px}.sbl4-article__meta-item svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;color:var(--sbl4-blue)}
.sbl4-article__hero{margin:0 0 20px;border:1px solid var(--sbl4-border);border-radius:24px;background:var(--sbl4-card);box-shadow:0 18px 50px rgba(7,29,53,.09)}.sbl4-article__hero img{width:100%;height:auto;max-height:none;object-fit:contain}.sbl4-article__hero figcaption{padding:13px 18px 15px;border-top:1px solid var(--sbl4-border);color:var(--sbl4-muted);font-size:11px;line-height:1.55}
.sbl4-article__body{padding:54px clamp(28px,6vw,76px);border-radius:24px;font-size:18px;line-height:1.86;letter-spacing:-.004em;box-shadow:0 15px 45px rgba(7,29,53,.055)}
.sbl4-article__body>*:first-child{margin-top:0}.sbl4-article__body>*:last-child{margin-bottom:0}.sbl4-article__body>p:first-child{font-size:20px;line-height:1.78;font-weight:550;color:color-mix(in srgb,var(--sbl4-text) 92%,var(--sbl4-blue))}
.sbl4-article__body p{margin:0 0 1.35em}.sbl4-article__body strong,.sbl4-article__body b{font-weight:800;color:color-mix(in srgb,var(--sbl4-text) 92%,#000)}[data-theme="dark"] .sbl4-article__body strong,[data-theme="dark"] .sbl4-article__body b{color:#fff}.sbl4-article__body em,.sbl4-article__body i{font-style:italic}
.sbl4-article__body a:not(.wp-element-button){color:#0568b5;font-weight:700;text-decoration:underline;text-decoration-color:rgba(5,104,181,.35);text-decoration-thickness:2px;text-underline-offset:3px;overflow-wrap:anywhere;transition:color .2s ease,text-decoration-color .2s ease}.sbl4-article__body a:not(.wp-element-button):hover{color:#ef3340;text-decoration-color:#ef3340}
.sbl4-article__body h2,.sbl4-article__body h3,.sbl4-article__body h4{color:var(--sbl4-text);text-wrap:balance;scroll-margin-top:110px}.sbl4-article__body h2{font-size:clamp(26px,3vw,34px);line-height:1.18;margin:1.65em 0 .6em;padding-top:.25em;letter-spacing:-.025em}.sbl4-article__body h3{font-size:clamp(21px,2.3vw,27px);line-height:1.24;margin:1.45em 0 .55em;letter-spacing:-.018em}.sbl4-article__body h4{font:800 19px/1.3 "Outfit",sans-serif;margin:1.35em 0 .5em}
.sbl4-article__body ul,.sbl4-article__body ol{margin:0 0 1.5em;padding-left:1.45em}.sbl4-article__body li{padding-left:.35em;margin:.45em 0}.sbl4-article__body li::marker{color:var(--sbl4-blue);font-weight:800}
.sbl4-article__body blockquote{position:relative;margin:34px 0;padding:25px 28px 25px 34px;border:0;border-left:5px solid var(--sbl4-blue);background:linear-gradient(135deg,#eef8ff,#f8fbfe);border-radius:0 18px 18px 0;font:700 clamp(18px,2vw,23px)/1.55 "Outfit",sans-serif;color:#123a5d}.sbl4-article__body blockquote:before{content:"“";position:absolute;right:20px;top:-8px;font-size:70px;line-height:1;color:rgba(8,102,181,.1)}.sbl4-article__body blockquote p:last-child{margin-bottom:0}[data-theme="dark"] .sbl4-article__body blockquote{background:#13283d;color:#e9f6ff}
.sbl4-article__body figure{margin:34px 0}.sbl4-article__body figure img{border-radius:18px;box-shadow:0 10px 32px rgba(7,29,53,.09)}.sbl4-article__body figcaption{max-width:760px;margin:10px auto 0;color:var(--sbl4-muted);font-size:12px;line-height:1.55;text-align:center}.sbl4-article__body .alignwide{width:min(112%,1040px);max-width:none;margin-left:50%;transform:translateX(-50%)}
.sbl4-article__body .wp-block-gallery,.sbl4-article__body .wp-block-gallery.has-nested-images{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.sbl4-article__body .wp-block-gallery.columns-3{grid-template-columns:repeat(3,minmax(0,1fr))}.sbl4-article__body .wp-block-gallery.columns-4{grid-template-columns:repeat(4,minmax(0,1fr))}.sbl4-article__body .wp-block-gallery figure,.sbl4-article__body .wp-block-gallery.has-nested-images figure.wp-block-image{position:relative;width:100%;margin:0;overflow:hidden;border-radius:16px;background:var(--sbl4-surface);aspect-ratio:4/3}.sbl4-article__body .wp-block-gallery figure img{width:100%;height:100%;object-fit:cover;border-radius:0;box-shadow:none;transition:transform .45s cubic-bezier(.2,.7,.2,1)}.sbl4-article__body .wp-block-gallery figure:hover img{transform:scale(1.035)}.sbl4-article__body .wp-block-gallery figure figcaption{position:absolute;left:0;right:0;bottom:0;margin:0;padding:30px 12px 10px;background:linear-gradient(transparent,rgba(3,18,34,.82));color:#fff;text-align:left;font-size:10px}
.sbl4-article__body .wp-block-embed,.sbl4-article__body .wp-block-video{margin:34px 0}.sbl4-article__body .wp-block-embed__wrapper,.sbl4-article__body .wp-has-aspect-ratio .wp-block-embed__wrapper{position:relative;width:100%;aspect-ratio:16/9;overflow:hidden;border-radius:20px;background:#061326;box-shadow:0 16px 42px rgba(7,29,53,.16)}.sbl4-article__body .wp-block-embed__wrapper iframe{position:absolute;inset:0;width:100%;height:100%;border:0;border-radius:20px}.sbl4-article__body>iframe[src*="youtube.com"],.sbl4-article__body>iframe[src*="youtube-nocookie.com"],.sbl4-article__body>iframe[src*="youtu.be"]{display:block;width:100%;height:auto;aspect-ratio:16/9;margin:34px 0;border:0;border-radius:20px;background:#061326;box-shadow:0 16px 42px rgba(7,29,53,.16)}.sbl4-article__body video{display:block;width:100%;border-radius:20px;background:#061326;box-shadow:0 16px 42px rgba(7,29,53,.15)}
.sbl4-article__body .wp-block-table{margin:30px 0;overflow-x:auto;border:1px solid var(--sbl4-border);border-radius:15px}.sbl4-article__body table{width:100%;border-collapse:collapse;min-width:560px;font-size:14px}.sbl4-article__body th{background:#0a3157;color:#fff;text-align:left}.sbl4-article__body th,.sbl4-article__body td{padding:12px 14px;border-bottom:1px solid var(--sbl4-border)}.sbl4-article__body tr:last-child td{border-bottom:0}.sbl4-article__body pre{overflow:auto;padding:18px 20px;border-radius:15px;background:#071d35;color:#eaf5ff;font:13px/1.65 ui-monospace,SFMono-Regular,Consolas,monospace}.sbl4-article__body code:not(pre code){padding:.15em .4em;border-radius:6px;background:var(--sbl4-surface);color:#b42318;font-size:.88em}.sbl4-article__body hr,.sbl4-article__body .wp-block-separator{border:0;border-top:1px solid var(--sbl4-border);margin:42px auto;max-width:65%}
.sbl4-article__footer{position:relative;margin-top:18px;padding:22px 24px;border-radius:19px;background:linear-gradient(135deg,var(--sbl4-card),color-mix(in srgb,var(--sbl4-card) 92%,#dff3ff));box-shadow:0 10px 30px rgba(7,29,53,.045)}.sbl4-article__share-copy{max-width:430px}.sbl4-article__footer .sbl4-article__share-copy strong{font:800 17px/1.2 "Outfit",sans-serif;margin-top:3px}.sbl4-article__share-copy p{margin:5px 0 0;color:var(--sbl4-muted);font-size:11px;line-height:1.5}.sbl4-article__share{position:relative;display:flex;gap:9px;flex-wrap:wrap;justify-content:flex-end}.sbl4-article__share a,.sbl4-article__share button{min-height:43px;padding:0 14px;border:1px solid var(--sbl4-border);border-radius:999px;background:var(--sbl4-card);color:var(--sbl4-text);display:inline-flex;align-items:center;gap:8px;font-size:10px;font-weight:850;box-shadow:0 4px 12px rgba(7,29,53,.04);transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease,color .22s ease,background .22s ease}.sbl4-article__share svg{width:17px;height:17px;fill:currentColor}.sbl4-article__share a:hover,.sbl4-article__share button:hover{transform:translateY(-3px);box-shadow:0 10px 22px rgba(7,29,53,.12)}.sbl4-article__share .is-whatsapp:hover{background:#20bf6b;border-color:#20bf6b;color:#fff}.sbl4-article__share .is-facebook:hover{background:#1877f2;border-color:#1877f2;color:#fff}.sbl4-article__share .is-x:hover{background:#111;border-color:#111;color:#fff}.sbl4-article__share .is-copy:hover,.sbl4-article__share .is-copy.is-copied{background:var(--sbl4-blue);border-color:var(--sbl4-blue);color:#fff}.sbl4-share-status{position:absolute;right:0;top:calc(100% + 7px);font-size:9px;color:var(--sbl4-green);white-space:nowrap}
.sbl4-related{max-width:1040px;margin:34px auto 28px}.sbl4-related .sbl4-inner-head{margin-bottom:15px}.sbl4-related .sbl4-inner-head h2{font-size:27px}.sbl4-related-grid{gap:16px}.sbl4-related-card{min-width:0;padding:0;border-radius:19px;overflow:hidden;background:var(--sbl4-card);border:1px solid var(--sbl4-border);box-shadow:0 8px 24px rgba(7,29,53,.055);transition:transform .28s cubic-bezier(.2,.7,.2,1),box-shadow .28s ease,border-color .28s ease}.sbl4-related-card:hover{transform:translateY(-7px);border-color:rgba(8,102,181,.3);box-shadow:0 18px 38px rgba(7,29,53,.13)}.sbl4-related-card__media{position:relative;display:block;width:100%;height:auto;aspect-ratio:16/10;overflow:hidden;background:linear-gradient(135deg,#0a3358,#0b76c5)}.sbl4-related-card__media img{width:100%;height:100%;object-fit:cover;transition:transform .5s cubic-bezier(.2,.7,.2,1),filter .3s ease}.sbl4-related-card:hover .sbl4-related-card__media img{transform:scale(1.055);filter:saturate(1.06)}.sbl4-related-card__media>span{height:100%;display:grid;place-items:center;color:#fff;font:900 22px "Outfit",sans-serif}.sbl4-related-card__media>b{position:absolute;left:12px;top:12px;padding:5px 8px;border-radius:999px;background:rgba(5,31,56,.78);color:#fff;font-size:8px;letter-spacing:.04em;text-transform:uppercase;backdrop-filter:blur(8px)}.sbl4-related-card__body{padding:15px 16px 17px}.sbl4-related-card__body time{display:block;color:var(--sbl4-muted);font-size:9.5px;font-weight:650}.sbl4-related-card__body h3{min-height:3.9em;margin:6px 0 14px;font:800 15px/1.3 "Outfit",sans-serif;letter-spacing:-.012em;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden}.sbl4-related-card__body h3 a{color:var(--sbl4-text);transition:color .2s ease}.sbl4-related-card:hover h3 a{color:var(--sbl4-blue)}.sbl4-related-card__read{display:flex;align-items:center;justify-content:space-between;padding-top:11px;border-top:1px solid var(--sbl4-border);color:var(--sbl4-blue);font-size:9px;font-weight:850}.sbl4-related-card__read i{font-style:normal;font-size:16px;transition:transform .2s ease}.sbl4-related-card:hover .sbl4-related-card__read i{transform:translateX(4px)}
@media(max-width:760px){.sbl4-article__head{padding:12px 2px 22px}.sbl4-article__head h1{font-size:clamp(30px,9vw,42px);line-height:1.1;margin:10px 0 14px;text-align:left}.sbl4-article__meta{justify-content:flex-start;gap:8px 12px;flex-wrap:wrap}.sbl4-article__hero{border-radius:18px}.sbl4-article__body{padding:27px 20px;font-size:16px;line-height:1.8;border-radius:19px}.sbl4-article__body>p:first-child{font-size:17.5px}.sbl4-article__body .alignwide{width:100%;margin-left:0;transform:none}.sbl4-article__body .wp-block-gallery.columns-3,.sbl4-article__body .wp-block-gallery.columns-4{grid-template-columns:repeat(2,minmax(0,1fr))}.sbl4-article__footer{align-items:flex-start;padding:19px;display:block}.sbl4-article__share{justify-content:flex-start;margin-top:15px}.sbl4-article__share a,.sbl4-article__share button{min-height:42px;padding:0 12px}.sbl4-share-status{left:0;right:auto}.sbl4-related{margin-top:32px}.sbl4-related-grid{grid-template-columns:1fr}.sbl4-related-card{display:grid;grid-template-columns:145px minmax(0,1fr)}.sbl4-related-card__media{height:100%;aspect-ratio:auto;min-height:150px}.sbl4-related-card__body{padding:14px}.sbl4-related-card__body h3{font-size:14px;min-height:auto;margin-bottom:12px}}
@media(max-width:430px){.sbl4-article__body{padding:24px 17px}.sbl4-article__body .wp-block-gallery,.sbl4-article__body .wp-block-gallery.has-nested-images,.sbl4-article__body .wp-block-gallery.columns-3,.sbl4-article__body .wp-block-gallery.columns-4{grid-template-columns:1fr}.sbl4-article__share a,.sbl4-article__share button{flex:1 1 calc(50% - 6px);justify-content:center}.sbl4-related-card{grid-template-columns:112px minmax(0,1fr)}.sbl4-related-card__media{min-height:140px}.sbl4-related-card__media>b{display:none}.sbl4-related-card__body h3{-webkit-line-clamp:4;font-size:13px}.sbl4-related-card__read{font-size:8.5px}}
/* 4.0.2 — editorial channels, integrity note, and Warta navigation */
.sbl4-nav-menu{position:relative;display:flex;align-items:center}.sbl4-nav-menu__link{padding-right:3px!important}.sbl4-nav-menu__toggle{width:24px;height:34px;padding:0;border:0;background:transparent;color:var(--sbl4-muted);border-radius:8px;cursor:pointer}.sbl4-nav-menu__toggle:hover,.sbl4-nav-menu__toggle:focus-visible{background:#ecf6ff;color:var(--sbl4-blue)}.sbl4-nav-menu__panel{position:absolute;z-index:40;top:calc(100% + 8px);left:0;width:210px;padding:7px;background:var(--sbl4-card);border:1px solid var(--sbl4-border);border-radius:14px;box-shadow:0 18px 42px rgba(7,29,53,.18);opacity:0;visibility:hidden;transform:translateY(-5px);transition:.18s ease}.sbl4-nav-menu__panel a{display:block!important;padding:10px 11px!important;border-radius:9px;font-size:11.5px!important}.sbl4-nav-menu:hover .sbl4-nav-menu__panel,.sbl4-nav-menu:focus-within .sbl4-nav-menu__panel,.sbl4-nav-menu.is-open .sbl4-nav-menu__panel{opacity:1;visibility:visible;transform:none}
.sbl4-drawer-group{grid-column:1/-1;border:1px solid var(--sbl4-border);border-radius:13px;background:var(--sbl4-card)}.sbl4-drawer-group summary{min-height:48px;padding:8px;display:flex;align-items:center;gap:8px;cursor:pointer;list-style:none}.sbl4-drawer-group summary::-webkit-details-marker{display:none}.sbl4-drawer-group summary>span{width:26px;height:26px;border-radius:8px;background:#eaf5ff;color:var(--sbl4-blue);display:grid;place-items:center}.sbl4-drawer-group summary b{font-size:12px;flex:1}.sbl4-drawer-group summary i{font-style:normal;transition:transform .2s}.sbl4-drawer-group[open] summary i{transform:rotate(180deg)}.sbl4-drawer-group>div{display:grid;grid-template-columns:1fr 1fr;gap:5px;padding:0 8px 8px}.sbl4-drawer-group>div a{min-height:38px!important;padding:8px 10px!important;background:var(--sbl4-bg);font-size:11px!important;font-weight:750}
.sbl4-integrity-note{display:grid;grid-template-columns:26px 1fr;gap:13px;margin:28px 0 6px;padding:20px 22px;border:1px solid #cfe3d9;border-radius:16px;background:#f3f8f5;color:#173d30}.sbl4-integrity-note__icon{width:22px;height:22px;border:2px solid #087253;border-radius:50%;display:grid;place-items:center;color:#087253;font-family:Georgia,serif;font-weight:800}.sbl4-integrity-note h2{margin:1px 0 7px!important;font-family:"Outfit",sans-serif!important;font-size:14px!important;line-height:1.25!important;color:#075d46!important}.sbl4-integrity-note p{margin:0!important;font-size:12px!important;line-height:1.75!important;color:#29483e!important}.sbl4-integrity-note small{display:block;margin-top:6px;font-size:10.5px;color:#527066}.sbl4-integrity-note+ .sbl4-article__footer{margin-top:18px}
.sbl4-channel .sbl4-archive-head{position:relative;overflow:hidden;min-height:150px;padding:32px 34px;background:linear-gradient(135deg,var(--channel-a,#071d35),var(--channel-b,#0866b5));border:0;color:#fff;box-shadow:0 15px 36px rgba(7,29,53,.13)}.sbl4-channel .sbl4-archive-head:after{content:"";position:absolute;right:-55px;bottom:-85px;width:250px;height:250px;border:38px solid rgba(255,255,255,.07);border-radius:50%}.sbl4-channel .sbl4-archive-head>div,.sbl4-channel__signal{position:relative;z-index:1}.sbl4-channel .sbl4-page-hero__kicker{color:var(--channel-accent,#71d0ff)}.sbl4-channel .sbl4-archive-head h1{max-width:700px;color:#fff;font-size:38px}.sbl4-channel .sbl4-archive-head p{max-width:680px;color:rgba(255,255,255,.78);font-size:12px;line-height:1.65}.sbl4-channel--kareba{--channel-a:#071d35;--channel-b:#075fa8;--channel-accent:#ff6972}.sbl4-channel--opd{--channel-a:#073763;--channel-b:#088bb4;--channel-accent:#7ee8ff}.sbl4-channel--budaya{--channel-a:#251b2f;--channel-b:#854229;--channel-accent:#f3c86a}.sbl4-channel--musik{--channel-a:#11152e;--channel-b:#4c2d86;--channel-accent:#62dcff}.sbl4-channel__signal{display:flex;align-items:end;gap:4px}.sbl4-channel__signal i{width:4px;border-radius:5px;background:var(--channel-accent);animation:sbl4Signal 1.3s ease-in-out infinite alternate}.sbl4-channel__signal i:nth-child(1){height:18px}.sbl4-channel__signal i:nth-child(2){height:34px;animation-delay:-.4s}.sbl4-channel__signal i:nth-child(3){height:25px;animation-delay:-.8s}.sbl4-channel__signal b{margin-left:6px;font-size:10px;letter-spacing:.08em}.sbl4-channel-tabs{display:flex;gap:7px;overflow-x:auto;margin:0 0 16px;padding:4px 1px 6px}.sbl4-channel-tabs a{flex:0 0 auto;padding:9px 13px;border:1px solid var(--sbl4-border);border-radius:999px;background:var(--sbl4-card);color:var(--sbl4-muted);font-size:10.5px;font-weight:800}.sbl4-channel-tabs a:hover,.sbl4-channel-tabs a[aria-current="page"]{border-color:var(--channel-b);background:var(--channel-b);color:#fff}.sbl4-channel .sbl4-archive-card__image{background:linear-gradient(135deg,var(--channel-a),var(--channel-b))}.sbl4-channel .sbl4-archive-card__more{color:var(--channel-b)!important}
@keyframes sbl4Signal{to{height:9px}}@media(prefers-reduced-motion:reduce){.sbl4-channel__signal i{animation:none}}[data-theme="dark"] .sbl4-integrity-note{background:#102a24;border-color:#285044;color:#dcebe6}[data-theme="dark"] .sbl4-integrity-note h2{color:#82ddc0!important}[data-theme="dark"] .sbl4-integrity-note p,[data-theme="dark"] .sbl4-integrity-note small{color:#bdd1ca!important}[data-theme="dark"] .sbl4-nav-menu__toggle:hover,[data-theme="dark"] .sbl4-nav-menu__toggle:focus-visible{background:#173653}
@media(max-width:1180px){.sbl4-nav-menu{display:none}}@media(max-width:760px){.sbl4-integrity-note{grid-template-columns:22px 1fr;padding:16px 14px}.sbl4-channel .sbl4-archive-head{min-height:0;padding:23px 18px}.sbl4-channel .sbl4-archive-head h1{font-size:28px}.sbl4-channel__signal{display:none}.sbl4-channel-tabs{margin-bottom:10px}}

/* 4.0.2 — refined Warta navigation */
.sbl4-nav-menu{height:48px;gap:0;border-radius:12px}.sbl4-nav-menu__link{padding:10px 3px 10px 10px!important}.sbl4-nav-menu__toggle{width:28px;height:36px;display:grid;place-items:center;margin-right:2px;transition:background-color .18s ease,color .18s ease}.sbl4-nav-menu__toggle svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;transition:transform .18s ease}.sbl4-nav-menu.is-open .sbl4-nav-menu__toggle svg{transform:rotate(180deg)}
.sbl4-nav-menu__panel{top:calc(100% + 9px);left:50%;width:324px;padding:8px;border-radius:18px;transform:translate(-50%,-7px);box-shadow:0 24px 60px rgba(7,29,53,.2),0 4px 14px rgba(7,29,53,.08);overflow:visible}.sbl4-nav-menu__panel:before{content:"";position:absolute;left:0;right:0;top:-12px;height:12px}.sbl4-nav-menu:hover .sbl4-nav-menu__panel,.sbl4-nav-menu:focus-within .sbl4-nav-menu__panel,.sbl4-nav-menu.is-open .sbl4-nav-menu__panel{transform:translate(-50%,0)}.sbl4-nav-menu__head{padding:10px 11px 9px;border-bottom:1px solid var(--sbl4-border);margin-bottom:4px}.sbl4-nav-menu__head span{display:block;color:var(--sbl4-blue);font-size:8px;font-weight:900;letter-spacing:.12em}.sbl4-nav-menu__head strong{display:block;margin-top:2px;color:var(--sbl4-text);font-size:12px;font-weight:800}.sbl4-nav-menu__panel a{position:relative!important;display:grid!important;grid-template-columns:38px minmax(0,1fr) 14px;align-items:center;gap:10px;min-height:60px;padding:8px 10px!important;border:1px solid transparent;border-radius:12px!important;color:var(--sbl4-text)!important;transition:background-color .16s ease,border-color .16s ease,transform .16s ease!important}.sbl4-nav-menu__panel a::after{display:none!important}.sbl4-nav-menu__panel a:hover,.sbl4-nav-menu__panel a:focus-visible,.sbl4-nav-menu__panel a.is-current{background:var(--sbl4-surface)!important;border-color:var(--sbl4-border)!important;transform:translateX(2px);outline:none}.sbl4-nav-menu__panel a>i{width:38px;height:38px;display:grid;place-items:center;border-radius:11px;font-style:normal}.sbl4-nav-menu__panel a>i svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.sbl4-nav-menu__panel a>i.is-kareba{background:#eaf5ff;color:#0872c9}.sbl4-nav-menu__panel a>i.is-opd{background:#e9f9fb;color:#07849b}.sbl4-nav-menu__panel a>i.is-budaya{background:#fff4df;color:#a56510}.sbl4-nav-menu__panel a>i.is-musik{background:#f2edff;color:#6b45b5}.sbl4-nav-menu__panel a>span{min-width:0}.sbl4-nav-menu__panel a strong{display:block;font-size:11.5px;line-height:1.25}.sbl4-nav-menu__panel a small{display:block;margin-top:3px;color:var(--sbl4-muted);font-size:8.5px;line-height:1.35;white-space:normal}.sbl4-nav-menu__panel a>b{color:#9aa9ba;font-size:20px;font-weight:400}.sbl4-nav-menu__panel a:hover>b,.sbl4-nav-menu__panel a:focus-visible>b,.sbl4-nav-menu__panel a.is-current>b{color:var(--sbl4-blue)}
.sbl4-drawer-group{overflow:hidden}.sbl4-drawer-group summary{padding:10px 11px}.sbl4-drawer-group>div{grid-template-columns:1fr;gap:6px;padding:2px 8px 8px}.sbl4-drawer-group>div a{display:block!important;min-height:54px!important;padding:9px 11px!important;border:1px solid transparent;border-radius:10px!important;background:var(--sbl4-bg);color:var(--sbl4-text)}.sbl4-drawer-group>div a:hover,.sbl4-drawer-group>div a:focus-visible,.sbl4-drawer-group>div a.is-current{border-color:var(--sbl4-blue);background:#eaf5ff!important;outline:none}.sbl4-drawer-group>div a strong{display:block;font-size:11.5px;line-height:1.25}.sbl4-drawer-group>div a small{display:block;margin-top:3px;color:var(--sbl4-muted);font-size:8.5px;line-height:1.3;font-weight:600}
[data-theme="dark"] .sbl4-nav-menu__panel a>i.is-kareba,[data-theme="dark"] .sbl4-nav-menu__panel a>i.is-opd,[data-theme="dark"] .sbl4-nav-menu__panel a>i.is-budaya,[data-theme="dark"] .sbl4-nav-menu__panel a>i.is-musik{background:#19314a}[data-theme="dark"] .sbl4-drawer-group>div a:hover,[data-theme="dark"] .sbl4-drawer-group>div a:focus-visible,[data-theme="dark"] .sbl4-drawer-group>div a.is-current{background:#173653!important}
@media(max-width:430px){.sbl4-drawer-group>div a{min-height:52px!important}.sbl4-drawer-group>div a small{font-size:8px}}
.sbl4-nav-menu:hover:not(.is-open):not(:focus-within) .sbl4-nav-menu__panel{opacity:0;visibility:hidden;transform:translate(-50%,-7px)}

/* 4.0.2 — horizontal news ticker (diatur terpusat di blok utama running ticker) */
.sbl4-ticker{overflow:hidden}.sbl4-ticker__in{position:relative;overflow:hidden}.sbl4-ticker__label{position:relative;z-index:2;flex:0 0 auto}.sbl4-ticker__items{position:relative!important;display:block!important;flex:1;min-width:0;height:24px!important;overflow:hidden;mask-image:linear-gradient(90deg,transparent,#000 18px,#000 calc(100% - 18px),transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 18px,#000 calc(100% - 18px),transparent)}.sbl4-ticker__items>.sbl4-ticker__item{display:none!important}
@media(max-width:760px){.sbl4-ticker__in{gap:9px}.sbl4-ticker__label{padding:4px 8px}.sbl4-ticker__items{mask-image:linear-gradient(90deg,transparent,#000 10px,#000 calc(100% - 10px),transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 10px,#000 calc(100% - 10px),transparent)}}

/* 4.0.2 — native Khazanah Bugis templates */
.sbl4-budaya{--budaya-deep:#251b2f;--budaya-earth:#854229;--budaya-gold:#f2c66d;--budaya-green:#26735e}.sbl4-budaya-hero{position:relative;isolation:isolate;overflow:hidden;display:flex;align-items:flex-end;justify-content:space-between;gap:28px;min-height:220px;margin-bottom:16px;padding:38px 40px;border-radius:26px;background:radial-gradient(circle at 82% 12%,rgba(242,198,109,.2),transparent 30%),linear-gradient(125deg,#17162b,#45233a 55%,#854229);color:#fff;box-shadow:0 18px 45px rgba(37,27,47,.18)}.sbl4-budaya-hero:after{content:"";position:absolute;z-index:-1;right:-70px;bottom:-120px;width:310px;height:310px;border:44px solid rgba(255,255,255,.055);transform:rotate(45deg)}.sbl4-budaya-kicker{display:inline-flex;margin-bottom:10px;padding:6px 10px;border:1px solid rgba(242,198,109,.5);border-radius:999px;background:rgba(242,198,109,.12);color:#ffe3a4;font-size:9px;font-weight:900;letter-spacing:.12em}.sbl4-budaya-hero h1{max-width:760px;margin:0;font-family:"Outfit",sans-serif;font-size:clamp(32px,4vw,52px);line-height:1.02;letter-spacing:-.035em}.sbl4-budaya-hero p{max-width:720px;margin:12px 0 0;color:#eadfe8;font-size:12px;line-height:1.7}.sbl4-budaya-stats{position:relative;z-index:1;display:flex;gap:8px;margin:0}.sbl4-budaya-stats div{min-width:86px;padding:13px;border:1px solid rgba(255,255,255,.15);border-radius:14px;background:rgba(10,9,22,.28);text-align:center;backdrop-filter:blur(8px)}.sbl4-budaya-stats dt{font-family:"Outfit",sans-serif;font-size:24px;font-weight:800;color:#ffe3a4}.sbl4-budaya-stats dd{margin:1px 0 0;font-size:8px;font-weight:800;text-transform:uppercase;letter-spacing:.09em;color:#eadfe8}.sbl4-budaya-topics{display:flex;gap:7px;overflow-x:auto;margin-bottom:18px;padding:2px 1px 7px;scrollbar-width:thin}.sbl4-budaya-topics a{display:inline-flex;align-items:center;gap:7px;flex:0 0 auto;padding:9px 12px;border:1px solid var(--sbl4-border);border-radius:999px;background:var(--sbl4-card);font-size:10px;font-weight:800;color:var(--sbl4-muted)}.sbl4-budaya-topics a small{display:grid;place-items:center;min-width:18px;height:18px;border-radius:999px;background:var(--sbl4-surface);font-size:8px}.sbl4-budaya-topics a:hover,.sbl4-budaya-topics a:focus-visible,.sbl4-budaya-topics a[aria-current="page"]{border-color:var(--budaya-earth);background:var(--budaya-earth);color:#fff;outline:none}.sbl4-budaya-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.sbl4-budaya-card{display:flex;min-width:0;flex-direction:column;overflow:hidden;border:1px solid var(--sbl4-border);border-radius:18px;background:var(--sbl4-card);box-shadow:0 8px 25px rgba(7,29,53,.05);transition:transform .2s ease,box-shadow .2s ease}.sbl4-budaya-card:hover{transform:translateY(-3px);box-shadow:0 15px 35px rgba(37,27,47,.12)}.sbl4-budaya-card__media{display:grid;place-items:center;aspect-ratio:16/9;overflow:hidden;background:linear-gradient(135deg,var(--budaya-deep),var(--budaya-earth));color:var(--budaya-gold);font-size:28px;font-weight:800}.sbl4-budaya-card__media img{width:100%;height:100%;object-fit:cover;transition:transform .35s ease}.sbl4-budaya-card:hover .sbl4-budaya-card__media img{transform:scale(1.035)}.sbl4-budaya-card__body{display:flex;flex:1;flex-direction:column;padding:16px}.sbl4-budaya-card__meta{display:flex;align-items:center;justify-content:space-between;gap:10px;color:var(--budaya-green);font-size:8.5px;font-weight:850;text-transform:uppercase}.sbl4-budaya-card__meta i{color:var(--budaya-earth);font-size:13px;font-style:normal;text-transform:none}.sbl4-budaya-card h2{margin:7px 0;font-family:"Outfit",sans-serif;font-size:16px;line-height:1.3}.sbl4-budaya-card p{margin:0 0 15px;color:var(--sbl4-muted);font-size:10.5px;line-height:1.65}.sbl4-budaya-card__foot{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:auto;padding-top:11px;border-top:1px solid var(--sbl4-border);font-size:9px}.sbl4-budaya-card__foot time{color:var(--sbl4-muted)}.sbl4-budaya-card__foot a{color:var(--budaya-earth);font-weight:850}.sbl4-budaya-single__head{position:relative}.sbl4-budaya-single .sbl4-article__category{background:#f6eee9;color:#854229}.sbl4-budaya-lontara{display:block;margin:12px 0 3px;color:#854229;font-size:22px;font-weight:800;letter-spacing:.08em}.sbl4-budaya-facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:18px auto 24px;max-width:980px}.sbl4-budaya-facts div{padding:14px 15px;border:1px solid var(--sbl4-border);border-radius:14px;background:var(--sbl4-surface)}.sbl4-budaya-facts span{display:block;margin-bottom:5px;color:var(--sbl4-muted);font-size:8px;font-weight:850;text-transform:uppercase;letter-spacing:.08em}.sbl4-budaya-facts strong{display:block;font-size:11px;line-height:1.55}.sbl4-budaya-facts strong[lang="bug"]{color:#854229;font-size:17px}.sbl4-budaya-single .sbl4-article__hero img{aspect-ratio:16/9;object-fit:cover}
[data-theme="dark"] .sbl4-budaya-single .sbl4-article__category{background:#3b2926;color:#ffd19b}[data-theme="dark"] .sbl4-budaya-lontara,[data-theme="dark"] .sbl4-budaya-facts strong[lang="bug"]{color:#f2c66d}
@media(max-width:980px){.sbl4-budaya-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.sbl4-budaya-hero{padding:30px}.sbl4-budaya-facts{grid-template-columns:1fr 1fr}.sbl4-budaya-facts div:last-child{grid-column:1/-1}}
@media(max-width:620px){.sbl4-budaya-hero{display:block;min-height:0;padding:24px 18px;border-radius:19px}.sbl4-budaya-hero h1{font-size:30px}.sbl4-budaya-stats{margin-top:20px}.sbl4-budaya-stats div{min-width:76px}.sbl4-budaya-grid{grid-template-columns:1fr;gap:11px}.sbl4-budaya-facts{grid-template-columns:1fr}.sbl4-budaya-facts div:last-child{grid-column:auto}}

/* 4.0.3 — polished related stories and adaptive article gallery */
.sbl4-related-card{background:var(--sbl4-card)!important;border-color:var(--sbl4-border)!important;box-shadow:0 10px 28px rgba(7,29,53,.07)}
.sbl4-related-card__body{display:flex;min-width:0;height:auto!important;flex-direction:column;background:var(--sbl4-card)!important;padding:17px 18px 18px!important}
.sbl4-related-card__body time{color:var(--sbl4-muted)!important;font-size:10px;font-weight:700;letter-spacing:.01em}
.sbl4-related-card__body h3{min-height:0!important;margin:7px 0 16px!important;font-size:15px;line-height:1.38}
.sbl4-related-card__body h3 a{color:var(--sbl4-text)!important;text-decoration:none!important;text-decoration-color:transparent!important}
.sbl4-related-card:hover .sbl4-related-card__body h3 a,.sbl4-related-card__body h3 a:focus-visible{color:var(--sbl4-blue)!important}
.sbl4-related-card__read{margin-top:auto;color:var(--sbl4-blue)!important;border-color:var(--sbl4-border)!important}
[data-theme="dark"] .sbl4-related-card__body{background:var(--sbl4-card)!important}

.sbl4-article__body .sbl4-gallery-auto{--sbl4-gallery-cols:2;display:grid!important;grid-template-columns:repeat(var(--sbl4-gallery-cols),minmax(0,1fr))!important;grid-auto-flow:dense;grid-auto-rows:8px;gap:12px!important;width:100%;margin:34px 0!important;padding:0;list-style:none}
.sbl4-article__body .sbl4-gallery-auto>figure,.sbl4-article__body .sbl4-gallery-auto>.gallery-item{position:relative;grid-column-end:span var(--sbl4-gallery-col,1);grid-row-end:span var(--sbl4-gallery-row,36);width:100%!important;height:100%!important;min-height:150px;margin:0!important;overflow:hidden;border-radius:17px;background:var(--sbl4-surface);aspect-ratio:auto!important;isolation:isolate}
.sbl4-article__body .sbl4-gallery-auto .gallery-icon{width:100%;height:100%}
.sbl4-article__body .sbl4-gallery-auto .sbl4-gallery-trigger{display:block;width:100%;height:100%;cursor:zoom-in;outline-offset:-4px}
.sbl4-article__body .sbl4-gallery-auto img{display:block;width:100%!important;height:100%!important;margin:0!important;border-radius:0!important;object-fit:cover;box-shadow:none!important;transition:transform .4s cubic-bezier(.2,.7,.2,1),filter .25s ease}
.sbl4-article__body .sbl4-gallery-auto>figure:after,.sbl4-article__body .sbl4-gallery-auto>.gallery-item:after{content:"+";position:absolute;z-index:3;right:11px;top:11px;display:grid;place-items:center;width:31px;height:31px;border:1px solid rgba(255,255,255,.45);border-radius:50%;background:rgba(4,25,45,.68);color:#fff;font:500 20px/1 Arial,sans-serif;pointer-events:none;opacity:.88;backdrop-filter:blur(7px);transition:transform .2s ease,background-color .2s ease}
.sbl4-article__body .sbl4-gallery-auto>figure:hover img,.sbl4-article__body .sbl4-gallery-auto>.gallery-item:hover img{transform:scale(1.035);filter:saturate(1.04)}
.sbl4-article__body .sbl4-gallery-auto>figure:hover:after,.sbl4-article__body .sbl4-gallery-auto>.gallery-item:hover:after{transform:scale(1.08);background:var(--sbl4-blue)}
.sbl4-article__body .sbl4-gallery-auto figcaption,.sbl4-article__body .sbl4-gallery-auto .gallery-caption{z-index:2;box-sizing:border-box;max-width:none;margin:0!important;padding:42px 13px 12px!important;background:linear-gradient(transparent,rgba(3,18,34,.84))!important;color:#fff!important;text-align:left!important;font-size:11px!important;line-height:1.45}

.sbl4-image-lightbox{display:none;position:fixed;z-index:1800;inset:0;align-items:center;justify-content:center;padding:22px}.sbl4-image-lightbox.is-open{display:flex}.sbl4-image-lightbox__backdrop{position:absolute;inset:0;border:0;background:rgba(2,9,18,.9);backdrop-filter:blur(12px)}.sbl4-image-lightbox__dialog{position:relative;z-index:2;display:flex;width:min(1180px,96vw);max-height:94vh;flex-direction:column;overflow:hidden;border:1px solid rgba(255,255,255,.16);border-radius:22px;background:#07182c;color:#fff;box-shadow:0 32px 100px rgba(0,0,0,.55)}.sbl4-image-lightbox__head,.sbl4-image-lightbox__foot{display:flex;flex:0 0 auto;align-items:center;justify-content:space-between;gap:15px;padding:13px 17px}.sbl4-image-lightbox__head{border-bottom:1px solid rgba(255,255,255,.11)}.sbl4-image-lightbox__head span{display:block;color:#67cdfd;font-size:8px;font-weight:900;letter-spacing:.12em}.sbl4-image-lightbox__head strong{display:block;margin-top:2px;font-size:13px}.sbl4-image-lightbox__close,.sbl4-image-lightbox__nav{display:grid;place-items:center;border:1px solid rgba(255,255,255,.17);border-radius:50%;background:rgba(255,255,255,.08);color:#fff;cursor:pointer}.sbl4-image-lightbox__close{width:40px;height:40px;font-size:25px}.sbl4-image-lightbox__stage{position:relative;display:grid;min-height:260px;flex:1 1 auto;grid-template-columns:58px minmax(0,1fr) 58px;align-items:center;background:#020a13}.sbl4-image-lightbox__stage figure{display:flex;min-width:0;min-height:0;height:100%;margin:0;flex-direction:column;align-items:center;justify-content:center}.sbl4-image-lightbox__stage img{display:block;max-width:100%;max-height:calc(94vh - 145px);width:auto;height:auto;object-fit:contain}.sbl4-image-lightbox__stage figcaption{max-width:760px;padding:10px 15px 4px;color:#cbd9e7;font-size:11px;line-height:1.5;text-align:center}.sbl4-image-lightbox__nav{position:relative;z-index:2;width:42px;height:42px;margin:auto;font-size:34px}.sbl4-image-lightbox__close:hover,.sbl4-image-lightbox__close:focus-visible,.sbl4-image-lightbox__nav:hover,.sbl4-image-lightbox__nav:focus-visible{border-color:#69cfff;background:var(--sbl4-blue);outline:none}.sbl4-image-lightbox__foot{border-top:1px solid rgba(255,255,255,.1);color:#aebed0;font-size:10px}.sbl4-image-lightbox__foot a{color:#69cfff;font-weight:800}
@media(max-width:760px){.sbl4-related-card__body{padding:15px!important}.sbl4-related-card__body h3{font-size:14px}.sbl4-article__body .sbl4-gallery-auto{--sbl4-gallery-cols:2!important;gap:9px!important;grid-auto-rows:7px}.sbl4-image-lightbox{padding:8px}.sbl4-image-lightbox__dialog{width:100%;max-height:96vh;border-radius:16px}.sbl4-image-lightbox__stage{grid-template-columns:44px minmax(0,1fr) 44px}.sbl4-image-lightbox__nav{width:35px;height:35px;font-size:28px}.sbl4-image-lightbox__stage img{max-height:calc(96vh - 155px)}}
@media(max-width:480px){.sbl4-article__body .sbl4-gallery-auto{--sbl4-gallery-cols:1!important}.sbl4-article__body .sbl4-gallery-auto>figure,.sbl4-article__body .sbl4-gallery-auto>.gallery-item{grid-column-end:span 1}.sbl4-image-lightbox__head,.sbl4-image-lightbox__foot{padding:11px 12px}.sbl4-image-lightbox__stage{display:block;padding:46px 10px}.sbl4-image-lightbox__stage figure{min-height:240px}.sbl4-image-lightbox__nav{position:absolute;top:50%;transform:translateY(-50%);background:rgba(4,25,45,.78)}.sbl4-image-lightbox__nav.is-prev{left:9px}.sbl4-image-lightbox__nav.is-next{right:9px}}
@media(prefers-reduced-motion:reduce){.sbl4-article__body .sbl4-gallery-auto img{transition:none}}

/* 4.0.4 — production polish: public information, announcers, ticker */
.sbl4-public-page .sbl4-page-hero{position:relative;isolation:isolate;overflow:hidden;display:flex;align-items:center;justify-content:space-between;gap:30px;min-height:190px;padding:34px 38px;background:radial-gradient(circle at 86% 18%,rgba(27,165,86,.18),transparent 30%),linear-gradient(125deg,#fff,#edf9f2)!important}
.sbl4-public-page .sbl4-page-hero:after{content:"";position:absolute;z-index:-1;right:-48px;bottom:-94px;width:245px;height:245px;border:34px solid rgba(24,139,73,.055);border-radius:50%}
.sbl4-public-page .sbl4-page-hero h1{max-width:820px}.sbl4-public-page .sbl4-page-hero p{max-width:760px;font-size:13px;line-height:1.65}
.sbl4-public-hero-mark{display:flex;flex:0 0 auto;align-items:center;gap:11px;padding:13px 16px;border:1px solid rgba(20,130,69,.18);border-radius:16px;background:rgba(255,255,255,.72);box-shadow:0 10px 30px rgba(24,112,62,.08);color:#176d40;backdrop-filter:blur(8px)}.sbl4-public-hero-mark svg{width:42px;height:42px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.sbl4-public-hero-mark span{font-size:9px;line-height:1.35;text-transform:uppercase;letter-spacing:.06em}.sbl4-public-hero-mark b{font-size:11px}
.sbl4-public-summary{display:flex;max-width:none!important;align-items:center;justify-content:space-between;gap:30px;margin:18px 0 14px!important;padding:22px 24px!important}.sbl4-public-summary>div{max-width:780px}.sbl4-public-summary ul{display:flex;flex:0 0 auto;gap:7px;margin:0;padding:0;list-style:none}.sbl4-public-summary li{position:relative;padding:8px 10px 8px 25px;border:1px solid #d6eadf;border-radius:999px;background:#f4fbf7;color:#35634a;font-size:9px;font-weight:800;white-space:nowrap}.sbl4-public-summary li:before{content:"✓";position:absolute;left:9px;color:#11834a;font-weight:900}
.sbl4-public-page-grid{grid-template-columns:repeat(6,minmax(0,1fr))!important;gap:13px!important;margin-bottom:14px!important}.sbl4-public-page-card{position:relative;grid-column:span 2;min-height:138px;grid-template-columns:48px minmax(0,1fr) 28px!important;gap:14px!important;padding:20px!important;overflow:hidden;border-radius:18px!important;box-shadow:0 7px 24px rgba(15,86,48,.035);transition:transform .24s cubic-bezier(.2,.7,.2,1),box-shadow .24s ease,border-color .24s ease!important}.sbl4-public-page-card:nth-child(4),.sbl4-public-page-card:nth-child(5){grid-column:span 3}.sbl4-public-page-card:after{content:"";position:absolute;right:-46px;bottom:-70px;width:130px;height:130px;border:22px solid rgba(22,137,72,.035);border-radius:50%;transition:transform .3s ease}.sbl4-public-page-card:hover,.sbl4-public-page-card:focus-visible{transform:translateY(-5px)!important;border-color:#72c494!important;box-shadow:0 18px 40px rgba(23,124,72,.13)!important;outline:none}.sbl4-public-page-card:hover:after,.sbl4-public-page-card:focus-visible:after{transform:scale(1.15)}
.sbl4-public-page-card__icon{width:48px!important;height:48px!important;border-radius:14px!important}.sbl4-public-page-card__icon svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.sbl4-public-page-card small{display:block;margin-bottom:5px;color:#17834d;font-size:8px;font-weight:900;text-transform:uppercase;letter-spacing:.09em}.sbl4-public-page-card h2{font-size:15px!important;line-height:1.25;margin:0 0 5px!important}.sbl4-public-page-card p{max-width:430px;font-size:10.5px!important;line-height:1.55}.sbl4-public-page-card em{display:block;margin-top:11px;color:#167746;font-size:9px;font-style:normal;font-weight:850;opacity:0;transform:translateY(4px);transition:.2s ease}.sbl4-public-page-card:hover em,.sbl4-public-page-card:focus-visible em{opacity:1;transform:none}.sbl4-public-page-card>b{position:relative;z-index:1;display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:#e8f7ee;font-size:15px;transition:.2s ease}.sbl4-public-page-card:hover>b,.sbl4-public-page-card:focus-visible>b{background:#11834a;color:#fff;transform:translateX(2px)}
.sbl4-public-help{display:flex;align-items:center;justify-content:space-between;gap:30px;margin:14px 0 24px;padding:25px 28px;border-radius:20px;background:linear-gradient(125deg,#0b3d2a,#12683f);color:#fff;box-shadow:0 15px 38px rgba(12,72,43,.15)}.sbl4-public-help>div:first-child{max-width:760px}.sbl4-public-help span{color:#8fe0ae;font-size:8px;font-weight:900;letter-spacing:.12em}.sbl4-public-help h2{margin:5px 0;font:800 21px/1.2 "Outfit",sans-serif}.sbl4-public-help p{margin:0;color:#c5e2d1;font-size:10.5px;line-height:1.6}.sbl4-public-help>div:last-child{display:flex;flex:0 0 auto;gap:8px}.sbl4-public-help a{display:inline-flex;min-height:42px;align-items:center;padding:0 15px;border:1px solid #fff;border-radius:999px;background:#fff;color:#0e5a36;font-size:9px;font-weight:900}.sbl4-public-help a.is-secondary{background:transparent;color:#fff;border-color:rgba(255,255,255,.38)}.sbl4-public-help a:hover,.sbl4-public-help a:focus-visible{transform:translateY(-2px);box-shadow:0 8px 20px rgba(0,0,0,.15);outline:none}
[data-theme="dark"] .sbl4-public-hero-mark{background:rgba(14,48,31,.78);border-color:#2d6847;color:#8fe0ae}[data-theme="dark"] .sbl4-public-summary li{background:#132d20;border-color:#28563d;color:#bad8c6}[data-theme="dark"] .sbl4-public-page .sbl4-page-hero{background:linear-gradient(125deg,#10251b,#143323)!important}

.sbl4-announcer-page .sbl4-announcer-hero{position:relative;overflow:hidden;min-height:174px;padding:31px 34px;background:radial-gradient(circle at 88% 10%,rgba(35,158,237,.17),transparent 28%),linear-gradient(125deg,#fff,#edf7ff)}.sbl4-announcer-page .sbl4-announcer-hero:after{content:"";position:absolute;right:80px;bottom:-105px;width:230px;height:230px;border:34px solid rgba(8,102,181,.045);border-radius:50%}.sbl4-announcer-page .sbl4-announcer-hero>div,.sbl4-announcer-page .sbl4-page-hero__cta{position:relative;z-index:1}.sbl4-announcer-page .sbl4-page-hero__cta{min-height:42px;padding:0 16px;box-shadow:0 9px 22px rgba(8,102,181,.16);transition:transform .2s ease,box-shadow .2s ease}.sbl4-announcer-page .sbl4-page-hero__cta:hover,.sbl4-announcer-page .sbl4-page-hero__cta:focus-visible{transform:translateY(-2px);box-shadow:0 13px 28px rgba(8,102,181,.24);outline:none}[data-theme="dark"] .sbl4-announcer-page .sbl4-announcer-hero{background:linear-gradient(125deg,#0c2033,#12334d)}
.sbl4-announcer-page .sbl4-crew-toolbar{position:sticky;z-index:10;top:8px;margin:14px 0;padding:13px 15px;border-radius:16px;box-shadow:0 8px 25px rgba(7,29,53,.055);backdrop-filter:blur(12px)}.sbl4-announcer-page .sbl4-crew-toolbar label{height:42px;border-radius:12px;transition:border-color .2s ease,box-shadow .2s ease}.sbl4-announcer-page .sbl4-crew-toolbar label:focus-within{border-color:var(--sbl4-blue);box-shadow:0 0 0 3px rgba(8,102,181,.1)}.sbl4-announcer-page .sbl4-crew-toolbar input{font-size:10px}
.sbl4-announcer-page .sbl4-announcer-grid--rich{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:22px!important}
@media(max-width:1150px) and (min-width:761px){.sbl4-public-summary{align-items:flex-start}.sbl4-public-summary ul{flex-direction:column}.sbl4-public-page-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}.sbl4-public-page-card,.sbl4-public-page-card:nth-child(4),.sbl4-public-page-card:nth-child(5){grid-column:span 1}.sbl4-public-page-card:last-child{grid-column:1/-1}.sbl4-announcer-page .sbl4-announcer-grid--rich{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(max-width:760px){.sbl4-public-page .sbl4-page-hero{display:block;min-height:0;padding:24px 19px}.sbl4-public-page .sbl4-page-hero h1{font-size:29px}.sbl4-public-page .sbl4-page-hero p{font-size:11px}.sbl4-public-hero-mark{width:max-content;margin-top:18px;padding:9px 12px}.sbl4-public-hero-mark svg{width:32px;height:32px}.sbl4-public-summary{display:block;padding:18px!important}.sbl4-public-summary ul{margin-top:14px;overflow-x:auto;padding-bottom:3px;scrollbar-width:none}.sbl4-public-summary li{flex:0 0 auto}.sbl4-public-page-grid{grid-template-columns:1fr!important;gap:10px!important}.sbl4-public-page-card,.sbl4-public-page-card:nth-child(4),.sbl4-public-page-card:nth-child(5){grid-column:span 1;min-height:126px;padding:16px!important}.sbl4-public-page-card em{opacity:1;transform:none}.sbl4-public-help{display:block;padding:21px 18px}.sbl4-public-help>div:last-child{margin-top:16px}.sbl4-public-help a{flex:1;justify-content:center}.sbl4-announcer-page .sbl4-announcer-hero{padding:24px 18px}.sbl4-announcer-page .sbl4-crew-toolbar{position:relative;top:auto;padding:13px}.sbl4-announcer-page .sbl4-announcer-grid--rich{grid-template-columns:1fr!important;gap:16px!important}.sbl4-announcer-page .sbl4-announcer-card--rich .sbl4-announcer-card__photo{height:290px!important}.sbl4-announcer-page .sbl4-announcer-next{min-height:0}.sbl4-announcer-page .sbl4-announcer-next span:nth-child(n+4){display:none}}
@media(max-width:390px){.sbl4-public-page-card{grid-template-columns:42px minmax(0,1fr) 25px!important;gap:10px!important}.sbl4-public-page-card__icon{width:42px!important;height:42px!important}.sbl4-public-help>div:last-child{display:grid}}
@media(prefers-reduced-motion:reduce){.sbl4-public-page-card,.sbl4-public-help a,.sbl4-announcer-card--rich,.sbl4-announcer-card__photo img{transition:none!important}}

/* ============================================================
   SBL WEB 4 — COMPLETE VISUALIZER, RUNNING TICKER, BUDAYA & CREW FIX
   ============================================================ */

/* 1. HERO BANNER EQUALIZER WAVE (5 BARS) */
.sbl4-wave {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 3.5px !important;
  height: 28px !important;
  padding: 0 !important;
}
.sbl4-wave i {
  display: block !important;
  width: 3.5px !important;
  height: 4px;
  background: #00f0ff !important;
  border-radius: 999px !important;
  box-shadow: 0 0 7px rgba(0, 240, 255, .65) !important;
  opacity: .45;
  transition: height .2s ease, opacity .2s ease !important;
  transform-origin: center center !important;
}
.sbl4-body.sbl4-is-playing .sbl4-wave i,
.sbl4-player[data-state="playing"] ~ * .sbl4-wave i {
  opacity: 1 !important;
}
.sbl4-body:not(.sbl4-is-playing) .sbl4-wave i {
  animation: none !important;
  height: 4px !important;
  opacity: .35 !important;
}
.sbl4-body.sbl4-is-playing .sbl4-wave i:nth-child(1) { animation: sbl4HeroEq 0.85s ease-in-out infinite alternate !important; animation-delay: 0s !important; }
.sbl4-body.sbl4-is-playing .sbl4-wave i:nth-child(2) { animation: sbl4HeroEq 1.15s ease-in-out infinite alternate !important; animation-delay: 0.22s !important; }
.sbl4-body.sbl4-is-playing .sbl4-wave i:nth-child(3) { animation: sbl4HeroEq 0.72s ease-in-out infinite alternate !important; animation-delay: 0.10s !important; }
.sbl4-body.sbl4-is-playing .sbl4-wave i:nth-child(4) { animation: sbl4HeroEq 1.28s ease-in-out infinite alternate !important; animation-delay: 0.35s !important; }
.sbl4-body.sbl4-is-playing .sbl4-wave i:nth-child(5) { animation: sbl4HeroEq 0.94s ease-in-out infinite alternate !important; animation-delay: 0.16s !important; }

@keyframes sbl4HeroEq {
  0%   { height: 4px; }
  25%  { height: 17px; }
  50%  { height: 8px; }
  75%  { height: 25px; }
  100% { height: 11px; }
}

/* 2. RADIO PLAYER BOTTOM EQUALIZER (16 BARS AUDIO SPECTRUM - MURNI TANPA FRAME) */
.sbl4-player__in {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  height: 100% !important;
  gap: 14px !important;
}

.sbl4-player__info {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  min-width: 0 !important;
  flex: 0 1 auto !important;
}

.sbl4-player__visualizer {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 4px !important;
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  flex-shrink: 0 !important;
}

.sbl4-player-equalizer {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 3px !important;
  height: 28px !important;
  min-width: 96px !important;
  padding: 0 !important;
  background: transparent !important;
}

.sbl4-player-equalizer i {
  display: block !important;
  width: 3px !important;
  height: 4px;
  border-radius: 999px !important;
  background: linear-gradient(to top, #0077ff 0%, #00d2ff 65%, #60efff 100%) !important;
  box-shadow: 0 0 6px rgba(0, 210, 255, 0.45) !important;
  opacity: 0.4;
  transition: height 0.2s ease, opacity 0.2s ease !important;
  transform-origin: center center !important;
}

.sbl4-player__center {
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  flex-shrink: 0 !important;
}

.sbl4-player__right {
  display: flex !important;
  align-items: center !important;
  flex-shrink: 0 !important;
}

/* State: PAUSED (Terkunci tenang di 4px, tidak berdenyut) */
.sbl4-player[data-state="paused"] .sbl4-player-equalizer i,
.sbl4-body:not(.sbl4-is-playing) .sbl4-player-equalizer i {
  animation: none !important;
  height: 4px !important;
  opacity: 0.35 !important;
  box-shadow: none !important;
}

/* State: PLAYING (Aktif berdenyut dinamis independen meniru spektrum audio studio) */
.sbl4-player[data-state="playing"] .sbl4-player-equalizer i,
.sbl4-body.sbl4-is-playing .sbl4-player-equalizer i {
  opacity: 1 !important;
}

.sbl4-body.sbl4-is-playing .sbl4-player-equalizer i:nth-child(1),
.sbl4-player[data-state="playing"] .sbl4-player-equalizer i:nth-child(1)   { animation: eqSpectrumBass 0.72s ease-in-out infinite alternate !important; animation-delay: 0.02s !important; }
.sbl4-body.sbl4-is-playing .sbl4-player-equalizer i:nth-child(2),
.sbl4-player[data-state="playing"] .sbl4-player-equalizer i:nth-child(2)   { animation: eqSpectrumMid  0.55s ease-in-out infinite alternate !important; animation-delay: 0.16s !important; }
.sbl4-body.sbl4-is-playing .sbl4-player-equalizer i:nth-child(3),
.sbl4-player[data-state="playing"] .sbl4-player-equalizer i:nth-child(3)   { animation: eqSpectrumHigh 0.84s ease-in-out infinite alternate !important; animation-delay: 0.08s !important; }
.sbl4-body.sbl4-is-playing .sbl4-player-equalizer i:nth-child(4),
.sbl4-player[data-state="playing"] .sbl4-player-equalizer i:nth-child(4)   { animation: eqSpectrumPeak 0.62s ease-in-out infinite alternate !important; animation-delay: 0.22s !important; }
.sbl4-body.sbl4-is-playing .sbl4-player-equalizer i:nth-child(5),
.sbl4-player[data-state="playing"] .sbl4-player-equalizer i:nth-child(5)   { animation: eqSpectrumBass 0.90s ease-in-out infinite alternate !important; animation-delay: 0.12s !important; }
.sbl4-body.sbl4-is-playing .sbl4-player-equalizer i:nth-child(6),
.sbl4-player[data-state="playing"] .sbl4-player-equalizer i:nth-child(6)   { animation: eqSpectrumMid  0.48s ease-in-out infinite alternate !important; animation-delay: 0.04s !important; }
.sbl4-body.sbl4-is-playing .sbl4-player-equalizer i:nth-child(7),
.sbl4-player[data-state="playing"] .sbl4-player-equalizer i:nth-child(7)   { animation: eqSpectrumHigh 0.78s ease-in-out infinite alternate !important; animation-delay: 0.25s !important; }
.sbl4-body.sbl4-is-playing .sbl4-player-equalizer i:nth-child(8),
.sbl4-player[data-state="playing"] .sbl4-player-equalizer i:nth-child(8)   { animation: eqSpectrumPeak 0.66s ease-in-out infinite alternate !important; animation-delay: 0.14s !important; }
.sbl4-body.sbl4-is-playing .sbl4-player-equalizer i:nth-child(9),
.sbl4-player[data-state="playing"] .sbl4-player-equalizer i:nth-child(9)   { animation: eqSpectrumBass 0.82s ease-in-out infinite alternate !important; animation-delay: 0.06s !important; }
.sbl4-body.sbl4-is-playing .sbl4-player-equalizer i:nth-child(10),
.sbl4-player[data-state="playing"] .sbl4-player-equalizer i:nth-child(10)  { animation: eqSpectrumMid  0.58s ease-in-out infinite alternate !important; animation-delay: 0.28s !important; }
.sbl4-body.sbl4-is-playing .sbl4-player-equalizer i:nth-child(11),
.sbl4-player[data-state="playing"] .sbl4-player-equalizer i:nth-child(11)  { animation: eqSpectrumHigh 0.70s ease-in-out infinite alternate !important; animation-delay: 0.10s !important; }
.sbl4-body.sbl4-is-playing .sbl4-player-equalizer i:nth-child(12),
.sbl4-player[data-state="playing"] .sbl4-player-equalizer i:nth-child(12)  { animation: eqSpectrumPeak 1.02s ease-in-out infinite alternate !important; animation-delay: 0.03s !important; }
.sbl4-body.sbl4-is-playing .sbl4-player-equalizer i:nth-child(13),
.sbl4-player[data-state="playing"] .sbl4-player-equalizer i:nth-child(13)  { animation: eqSpectrumBass 0.60s ease-in-out infinite alternate !important; animation-delay: 0.20s !important; }
.sbl4-body.sbl4-is-playing .sbl4-player-equalizer i:nth-child(14),
.sbl4-player[data-state="playing"] .sbl4-player-equalizer i:nth-child(14)  { animation: eqSpectrumMid  0.74s ease-in-out infinite alternate !important; animation-delay: 0.15s !important; }
.sbl4-body.sbl4-is-playing .sbl4-player-equalizer i:nth-child(15),
.sbl4-player[data-state="playing"] .sbl4-player-equalizer i:nth-child(15)  { animation: eqSpectrumHigh 0.46s ease-in-out infinite alternate !important; animation-delay: 0.18s !important; }
.sbl4-body.sbl4-is-playing .sbl4-player-equalizer i:nth-child(16),
.sbl4-player[data-state="playing"] .sbl4-player-equalizer i:nth-child(16)  { animation: eqSpectrumPeak 0.88s ease-in-out infinite alternate !important; animation-delay: 0.07s !important; }

/* 4 Karakteristik Gelombang Frekuensi Spektrum Audio */
@keyframes eqSpectrumBass {
  0%   { height: 4px; }
  25%  { height: 18px; }
  50%  { height: 7px; }
  75%  { height: 23px; }
  100% { height: 6px; }
}

@keyframes eqSpectrumMid {
  0%   { height: 5px; }
  30%  { height: 13px; }
  55%  { height: 21px; }
  80%  { height: 7px; }
  100% { height: 15px; }
}

@keyframes eqSpectrumHigh {
  0%   { height: 4px; }
  20%  { height: 16px; }
  45%  { height: 6px; }
  70%  { height: 24px; }
  100% { height: 5px; }
}

@keyframes eqSpectrumPeak {
  0%   { height: 6px; }
  35%  { height: 22px; }
  60%  { height: 10px; }
  85%  { height: 17px; }
  100% { height: 4px; }
}

@media (max-width: 1150px) {
  .sbl4-player__visualizer {
    display: none !important;
  }
}

/* 3. RUNNING TICKER (SEAMLESS CONTINUOUS MARQUEE) */
/* 3. RUNNING TICKER (SEAMLESS CONTINUOUS MARQUEE) */
.sbl4-ticker {
  overflow: hidden !important;
}
.sbl4-ticker__items {
  display: block !important;
  position: relative !important;
  flex: 1 !important;
  min-width: 0 !important;
  overflow: hidden !important;
  mask-image: linear-gradient(90deg, transparent, #000 20px, #000 calc(100% - 20px), transparent) !important;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 20px, #000 calc(100% - 20px), transparent) !important;
}
.sbl4-ticker__track {
  display: flex !important;
  width: max-content !important;
  white-space: nowrap !important;
  animation: sbl4TickerScroll 36s linear infinite !important;
  will-change: transform !important;
}
.sbl4-ticker__track:hover,
.sbl4-ticker__item:hover {
  animation-play-state: paused !important;
}
.sbl4-ticker__group {
  display: inline-flex !important;
  align-items: center !important;
  flex-shrink: 0 !important;
}
.sbl4-ticker__item {
  display: inline-flex !important;
  align-items: center !important;
  padding: 0 10px !important;
  font-size: 12.5px !important;
  color: var(--sbl4-text, #20344d) !important;
  text-decoration: none !important;
  font-weight: 650 !important;
  transition: color .2s ease !important;
}
.sbl4-ticker__item:hover {
  color: #ef3340 !important;
}
.sbl4-ticker__sep {
  display: inline-block !important;
  width: 5px !important;
  height: 5px !important;
  border-radius: 50% !important;
  background: var(--sbl4-red, #ef3340) !important;
  box-shadow: 0 0 0 3px rgba(239, 51, 64, 0.18) !important;
  margin: 0 12px !important;
  vertical-align: middle !important;
  flex-shrink: 0 !important;
}
.sbl4-ticker__dot {
  display: inline-block !important;
  width: 5px !important;
  height: 5px !important;
  border-radius: 50% !important;
  background: var(--sbl4-red, #ef3340) !important;
  margin: 0 12px !important;
  flex-shrink: 0 !important;
}

@keyframes sbl4TickerScroll {
  0%   { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

/* 4. KHAZANAH BUDAYA HOME (PROPORSIONAL, COVER LEBIH BESAR & TINGGI SEIMBANG DENGAN CARD PENYIAR) */
.sbl4-budaya-home-shell {
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
}
.sbl4-budaya-home-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 12px 10px !important;
}
.sbl4-budaya-home-card {
  display: flex !important;
  flex-direction: column !important;
  border-radius: 16px !important;
  overflow: hidden !important;
  background: #fdfbf7 !important;
  border: 1px solid #efe7d9 !important;
  transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease, background .2s ease !important;
  color: inherit !important;
  text-decoration: none !important;
}
.sbl4-budaya-home-card:hover {
  transform: translateY(-2px) !important;
  background: #fbf5eb !important;
  border-color: #d97706 !important;
  box-shadow: 0 8px 24px rgba(217, 119, 6, 0.14) !important;
}
[data-theme="dark"] .sbl4-budaya-home-card {
  background: #1b1916 !important;
  border-color: rgba(217, 119, 6, 0.22) !important;
}
[data-theme="dark"] .sbl4-budaya-home-card:hover {
  background: #24201b !important;
  border-color: #f59e0b !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35) !important;
}
.sbl4-budaya-home-card__cover {
  display: block !important;
  width: calc(100% - 12px) !important;
  height: 125px !important;
  aspect-ratio: auto !important;
  margin: 6px 6px 0 6px !important;
  border-radius: 12px !important;
  overflow: hidden !important;
  background: #091a2e !important;
  position: relative !important;
  flex-shrink: 0 !important;
}
.sbl4-budaya-home-card__cover img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center center !important;
  transition: transform .35s ease !important;
}
.sbl4-budaya-home-card:hover .sbl4-budaya-home-card__cover img {
  transform: scale(1.05) !important;
}
.sbl4-budaya-home-card__cover-placeholder {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 100% !important;
  font-size: 26px !important;
  color: #ffaa44 !important;
  background: linear-gradient(135deg, #07192f, #0d2d52) !important;
}
.sbl4-budaya-home-card__body {
  display: flex !important;
  flex-direction: column !important;
  flex: 1 !important;
  padding: 9px 10px 11px !important;
  gap: 3px !important;
}
.sbl4-budaya-home-card__meta {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 4px !important;
}
.sbl4-budaya-home-card__pill {
  font-size: 8px !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
  color: #b45309 !important;
  letter-spacing: .06em !important;
}
[data-theme="dark"] .sbl4-budaya-home-card__pill {
  color: #ffb03a !important;
}
.sbl4-budaya-home-card__lontara {
  font-size: 12px !important;
  color: #854229 !important;
  line-height: 1 !important;
}
[data-theme="dark"] .sbl4-budaya-home-card__lontara {
  color: #f2c66d !important;
}
.sbl4-budaya-home-card__title {
  font-size: 11.5px !important;
  font-weight: 800 !important;
  color: var(--sbl4-text, #10243e) !important;
  line-height: 1.35 !important;
  margin: 2px 0 0 0 !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
}
.sbl4-budaya-home-card__title a {
  color: inherit !important;
  text-decoration: none !important;
}
[data-theme="dark"] .sbl4-budaya-home-card__title {
  color: #e6f1fc !important;
}
.sbl4-budaya-home-card__foot {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  margin-top: auto !important;
  padding-top: 6px !important;
  font-size: 8.5px !important;
  color: var(--sbl4-muted, #72849a) !important;
}
.sbl4-budaya-home-card__read {
  color: var(--sbl4-blue, #0866b5) !important;
  font-weight: 800 !important;
  font-size: 8.5px !important;
}
@media (max-width: 768px) {
  .sbl4-budaya-home-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
  }
  .sbl4-budaya-home-card__cover {
    height: 100px !important;
  }
}

/* 6. LIVE CONSOLE FLOATING EQUALIZER (TITIK-TITIK BIRU DI HALAMAN LIVE STREAMING) */
.sbl4-live-console__visualizer {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 3.5px !important;
  height: 18px !important;
  margin-top: 6px !important;
}
.sbl4-live-console__visualizer i {
  display: inline-block !important;
  width: 3.5px !important;
  height: 14px !important;
  border-radius: 999px !important;
  background: #22b7ff !important;
  transform: scaleY(0.25) !important;
  transform-origin: center center !important;
  opacity: 0.65 !important;
  transition: transform 0.22s ease, opacity 0.22s ease !important;
}
.sbl4-body.sbl4-is-playing .sbl4-live-console__visualizer i,
body.sbl4-is-playing .sbl4-live-console__visualizer i {
  opacity: 1 !important;
}
.sbl4-body.sbl4-is-playing .sbl4-live-console__visualizer i:nth-child(1),
body.sbl4-is-playing .sbl4-live-console__visualizer i:nth-child(1) {
  animation: sbl4LiveDotPulse 0.85s ease-in-out infinite alternate !important;
  animation-delay: 0s !important;
}
.sbl4-body.sbl4-is-playing .sbl4-live-console__visualizer i:nth-child(2),
body.sbl4-is-playing .sbl4-live-console__visualizer i:nth-child(2) {
  animation: sbl4LiveDotPulse 1.15s ease-in-out infinite alternate !important;
  animation-delay: 0.22s !important;
}
.sbl4-body.sbl4-is-playing .sbl4-live-console__visualizer i:nth-child(3),
body.sbl4-is-playing .sbl4-live-console__visualizer i:nth-child(3) {
  animation: sbl4LiveDotPulse 0.72s ease-in-out infinite alternate !important;
  animation-delay: 0.10s !important;
}
.sbl4-body.sbl4-is-playing .sbl4-live-console__visualizer i:nth-child(4),
body.sbl4-is-playing .sbl4-live-console__visualizer i:nth-child(4) {
  animation: sbl4LiveDotPulse 1.28s ease-in-out infinite alternate !important;
  animation-delay: 0.35s !important;
}
.sbl4-body.sbl4-is-playing .sbl4-live-console__visualizer i:nth-child(5),
body.sbl4-is-playing .sbl4-live-console__visualizer i:nth-child(5) {
  animation: sbl4LiveDotPulse 0.94s ease-in-out infinite alternate !important;
  animation-delay: 0.16s !important;
}
.sbl4-body.sbl4-is-playing .sbl4-live-console__visualizer i:nth-child(6),
body.sbl4-is-playing .sbl4-live-console__visualizer i:nth-child(6) {
  animation: sbl4LiveDotPulse 1.05s ease-in-out infinite alternate !important;
  animation-delay: 0.28s !important;
}

@keyframes sbl4LiveDotPulse {
  0% {
    transform: scaleY(0.24);
    opacity: 0.65;
  }
  50% {
    transform: scaleY(0.95);
    opacity: 1;
  }
  100% {
    transform: scaleY(0.35);
    opacity: 0.75;
  }
}

/* 5. CREW ON-AIR BADGE REFINED */

/* ============================================================
   PODCAST & YOUTUBE MEDIA CARDS - VISUAL RELEVAN & JERNIH
   ============================================================ */

/* 1. Card Podcast Spotify (Background Studio Broadcast Mewah & Relevan) */
.sbl4-feature-media--spotify {
  position: relative !important;
  overflow: hidden !important;
}
.sbl4-feature-media--spotify .sbl4-feature-media__bg {
  filter: brightness(0.72) contrast(1.05) !important;
  transform: scale(1.02) !important;
  background-size: cover !important;
  background-position: center 30% !important;
  transition: transform .35s ease, filter .35s ease !important;
}
.sbl4-feature-media--spotify:hover .sbl4-feature-media__bg {
  transform: scale(1.06) !important;
  filter: brightness(0.8) contrast(1.05) !important;
}
.sbl4-feature-media--spotify .sbl4-feature-media__shade {
  background: linear-gradient(90deg, rgba(3,17,34,0.95) 0%, rgba(3,17,34,0.85) 32%, rgba(3,17,34,0.45) 70%, rgba(3,17,34,0.2) 100%) !important;
}
.sbl4-feature-media__podcast-cover {
  box-shadow: 0 16px 36px rgba(0,0,0,0.4) !important;
  border: 1px solid rgba(255,255,255,0.2) !important;
}

/* 2. Card YouTube (Cover Video Asli Jernih & Tajam Tanpa Blur) */
.sbl4-feature-media--youtube {
  position: relative !important;
  overflow: hidden !important;
}
.sbl4-feature-media--youtube .sbl4-feature-media__bg {
  filter: brightness(0.88) contrast(1.03) !important;
  transform: scale(1.0) !important;
  background-size: cover !important;
  background-position: center center !important;
  transition: transform .35s ease, filter .35s ease !important;
}
.sbl4-feature-media--youtube:hover .sbl4-feature-media__bg {
  transform: scale(1.04) !important;
  filter: brightness(0.96) contrast(1.05) !important;
}
.sbl4-feature-media--youtube .sbl4-feature-media__shade {
  background: linear-gradient(180deg, rgba(3,17,34,0.1) 0%, rgba(3,17,34,0.42) 48%, rgba(3,17,34,0.94) 100%) !important;
}

/* ============================================================
   7. PENYIAR & BUDAYA SEIMBANG (HORIZONTAL DESKTOP CARD, SOFT TONE)
   ============================================================ */
.sbl4-crew-shell {
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
}
.sbl4-crew {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 16px !important;
  padding: 4px 0 0 !important;
  overflow: visible !important;
}
.sbl4-crew .sbl4-crew-card {
  position: relative !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  text-align: left !important;
  height: 126px !important;
  min-height: 126px !important;
  box-sizing: border-box !important;
  padding: 0 18px 0 14px !important;
  border-radius: 20px !important;
  background: #ffffff !important;
  border: 1px solid #dce7f2 !important;
  text-decoration: none !important;
  gap: 16px !important;
  min-width: 0 !important;
  box-shadow: 0 4px 16px rgba(7, 29, 53, 0.04) !important;
  transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease, background .2s ease !important;
}
.sbl4-crew .sbl4-crew-card:hover {
  transform: translateY(-3px) !important;
  background: #f7fbff !important;
  border-color: var(--sbl4-blue, #0866b5) !important;
  box-shadow: 0 12px 28px rgba(7, 29, 53, 0.09) !important;
}
[data-theme="dark"] .sbl4-crew .sbl4-crew-card {
  background: #112338 !important;
  border-color: rgba(255,255,255,0.08) !important;
}
[data-theme="dark"] .sbl4-crew .sbl4-crew-card:hover {
  background: #162f4c !important;
  border-color: #38bdf8 !important;
  box-shadow: 0 8px 22px rgba(0,0,0,0.32) !important;
}

/* Foto Penyiar: 90% Tinggi Card Setiap Penyiar (Desktop) */
.sbl4-avatar-wrap {
  position: relative !important;
  height: 90% !important;
  aspect-ratio: 1 / 1 !important;
  flex: 0 0 auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}
.sbl4-avatar {
  position: relative !important;
  width: 100% !important;
  height: 100% !important;
  border-radius: 50% !important;
  overflow: hidden !important;
  background: linear-gradient(160deg, #f7fbff 0%, #eaf3fb 100%) !important;
  border: 3px solid #ffffff !important;
  box-shadow: 0 4px 14px rgba(7, 29, 53, 0.12) !important;
  margin: 0 !important;
}
.sbl4-avatar img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center top !important;
  display: block !important;
}

/* Badge ON AIR: Overlap dengan Foto & Rata Bawah dengan Foto (Tanpa Menutupi Wajah) */
.sbl4-avatar-wrap .sbl4-crew-live,
.sbl4-crew-card .sbl4-crew-live {
  display: none !important;
  position: absolute !important;
  top: auto !important;
  bottom: 0px !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  height: auto !important;
  max-height: 20px !important;
  box-sizing: border-box !important;
  z-index: 5 !important;
  background: #dc2626 !important;
  color: #ffffff !important;
  font-family: 'Outfit', sans-serif !important;
  font-size: 8px !important;
  font-weight: 850 !important;
  letter-spacing: 0.08em !important;
  padding: 3px 8px !important;
  border-radius: 999px !important;
  border: 1.5px solid #ffffff !important;
  box-shadow: 0 2px 6px rgba(15, 23, 42, 0.28) !important;
  white-space: nowrap !important;
  line-height: 1 !important;
  align-items: center !important;
  gap: 4px !important;
}
.sbl4-avatar-wrap .sbl4-crew-live i,
.sbl4-crew-card .sbl4-crew-live i {
  width: 5px !important;
  height: 5px !important;
  border-radius: 50% !important;
  background: #ffffff !important;
  display: inline-block !important;
  animation: sbl4TallyPulse 1.2s infinite ease-in-out !important;
}
.sbl4-crew-card.is-onair .sbl4-crew-live {
  display: inline-flex !important;
  visibility: visible !important;
  opacity: 1 !important;
}
.sbl4-crew-card.is-onair .sbl4-avatar {
  border-color: #ffffff !important;
  box-shadow: 0 0 0 2.5px #ffffff, 0 0 0 4.5px #dc2626 !important;
}
.sbl4-crew-card.is-onair {
  background: #fff8f8 !important;
  border-color: rgba(220, 38, 38, 0.35) !important;
  box-shadow: 0 8px 24px rgba(220, 38, 38, 0.08) !important;
}

/* Teks Berada di Samping Foto dengan Kontras Sangat Baik */
.sbl4-crew-info {
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  align-items: flex-start !important;
  text-align: left !important;
  flex: 1 !important;
  min-width: 0 !important;
  gap: 4px !important;
}
.sbl4-crew-card strong {
  display: block !important;
  font-family: 'Outfit', sans-serif !important;
  font-size: 16.5px !important;
  font-weight: 800 !important;
  color: #07192f !important;
  line-height: 1.2 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  margin: 0 !important;
  width: 100% !important;
  letter-spacing: -0.01em !important;
}
[data-theme="dark"] .sbl4-crew-card strong {
  color: #ffffff !important;
}
.sbl4-crew-card span.sbl4-crew-role,
.sbl4-crew-card>span,
.sbl4-crew-info>span {
  display: block !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  color: #334e68 !important;
  margin: 0 !important;
  letter-spacing: 0.01em !important;
}
[data-theme="dark"] .sbl4-crew-card span.sbl4-crew-role,
[data-theme="dark"] .sbl4-crew-card>span,
[data-theme="dark"] .sbl4-crew-info>span {
  color: #94a3b8 !important;
}
.sbl4-crew-card.is-onair strong {
  color: #991b1b !important;
}
.sbl4-crew-card.is-onair .sbl4-crew-role {
  color: #b91c1c !important;
  font-weight: 700 !important;
}
/* Crew ON AIR styling didefinisikan secara presisi pada bagian 4.1.3 di bawah */

/* ============================================================
   8. MOBILE RESPONSIVE POLISH (HERO & RUANG MUSIK LEGA & RAPI)
   ============================================================ */
@media (max-width: 768px) {
  /* Hero Mobile Rapi & Lega Tanpa Tabrakan */
  .sbl4-hero {
    height: auto !important;
    min-height: 440px !important;
    border-radius: 20px !important;
    background-position: 70% top !important;
    padding-bottom: 20px !important;
    overflow: hidden !important;
  }
  .sbl4-hero__veil {
    background: linear-gradient(180deg, rgba(4,31,63,0.92) 0%, rgba(4,31,63,0.85) 50%, rgba(4,31,63,0.96) 100%) !important;
  }
  .sbl4-hero__copy {
    width: 100% !important;
    padding: 22px 16px 14px !important;
  }
  .sbl4-hero h1 {
    font-size: 25px !important;
    line-height: 1.15 !important;
    margin: 8px 0 4px !important;
  }
  .sbl4-hero__meta {
    font-size: 11px !important;
    margin-top: 6px !important;
  }
  .sbl4-hero__actions {
    display: flex !important;
    width: 100% !important;
    gap: 8px !important;
    margin-top: 14px !important;
    flex-wrap: nowrap !important;
  }
  .sbl4-hero__actions .sbl4-btn-primary,
  .sbl4-hero__actions .sbl4-btn-outline {
    flex: 1 !important;
    height: 42px !important;
    padding: 0 12px !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    justify-content: center !important;
  }
  .sbl4-nowtrack {
    margin-top: 14px !important;
    padding: 8px 12px !important;
    background: rgba(0,0,0,0.28) !important;
    border-radius: 11px !important;
    border: 1px solid rgba(255,255,255,0.08) !important;
    max-width: 100% !important;
  }
  .sbl4-next {
    position: relative !important;
    left: auto !important;
    right: auto !important;
    bottom: auto !important;
    margin: 12px 16px 0 !important;
    width: calc(100% - 32px) !important;
    min-height: 60px !important;
    padding: 10px 14px !important;
    background: rgba(4,20,39,0.85) !important;
    border-radius: 13px !important;
  }

  /* Ruang Musik Mobile Super Rapi & Smooth Horizontal Scroller */
  .sbl4-darkband {
    padding: 16px 14px !important;
    border-radius: 18px !important;
  }
  .sbl4-music-band .sbl4-section-head {
    flex-wrap: wrap !important;
    gap: 8px !important;
  }
  .sbl4-music-head-actions {
    width: 100% !important;
    justify-content: flex-end !important;
    gap: 10px !important;
  }
  .sbl4-music-head-actions .sbl4-carousel-controls {
    display: none !important;
  }
  .sbl4-scroller {
    display: flex !important;
    gap: 10px !important;
    overflow-x: auto !important;
    scroll-snap-type: x mandatory !important;
    padding-bottom: 6px !important;
    -webkit-overflow-scrolling: touch !important;
    margin-top: 10px !important;
  }
  .sbl4-music-card {
    flex: 0 0 156px !important;
    min-width: 156px !important;
    width: 156px !important;
    max-width: 156px !important;
    height: 98px !important;
    border-radius: 13px !important;
    scroll-snap-align: start !important;
  }
  .sbl4-music-card div {
    left: 8px !important;
    right: 8px !important;
    bottom: 8px !important;
  }
  .sbl4-music-card span {
    font-size: 7px !important;
  }
  .sbl4-music-card strong {
    font-size: 9.5px !important;
    line-height: 1.25 !important;
  }

  /* Suara di Balik SBL Mobile: Foto 90% dari Lebar Card & Teks di Bawah Foto */
  .sbl4-crew {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px !important;
    padding: 4px 0 0 !important;
  }
  .sbl4-crew .sbl4-crew-card {
    height: auto !important;
    min-height: 0 !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    padding: 16px 10px 14px !important;
    gap: 12px !important;
    border-radius: 18px !important;
  }
  .sbl4-avatar-wrap {
    width: 90% !important;
    height: auto !important;
    aspect-ratio: 1 / 1 !important;
    margin: 0 auto !important;
  }
  .sbl4-avatar {
    width: 100% !important;
    height: 100% !important;
    flex: 0 0 auto !important;
    margin: 0 !important;
  }
  .sbl4-avatar-wrap .sbl4-crew-live,
  .sbl4-crew .sbl4-crew-card .sbl4-crew-live {
    top: auto !important;
    bottom: 0px !important;
    height: auto !important;
    max-height: 20px !important;
    box-sizing: border-box !important;
    font-size: 7.5px !important;
    padding: 2.5px 7px !important;
  }
  .sbl4-crew-info {
    align-items: center !important;
    text-align: center !important;
    width: 100% !important;
    gap: 2px !important;
  }
  .sbl4-crew .sbl4-crew-card strong {
    font-size: 14.5px !important;
    text-align: center !important;
    width: 100% !important;
  }
  .sbl4-crew .sbl4-crew-card span.sbl4-crew-role,
  .sbl4-crew .sbl4-crew-card>span,
  .sbl4-crew-info>span {
    font-size: 11px !important;
    text-align: center !important;
  }

  /* Khazanah Budaya Mobile: Grid 1x3 (Bertumpuk Rapi ke Bawah Tanpa Ruang Kosong) */
  .sbl4-budaya-home-grid {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }
  .sbl4-budaya-home-card__cover {
    height: 140px !important;
    width: calc(100% - 12px) !important;
    margin: 6px 6px 0 6px !important;
  }
  .sbl4-budaya-home-card__title {
    font-size: 13px !important;
  }
}

/* ============================================================
   SBL WEB 4.1.3 — REFINED BROADCASTER (PENYIAR) SHOWCASE & MODAL
   Latar biru muda dengan watermark logo SBL soft, badge ON AIR presisi,
   dan modal responsif (desktop 2-kolom, mobile foto di atas & konten di bawah)
   ============================================================ */

/* Grid Halaman Penyiar */
.sbl4-announcer-page .sbl4-announcer-grid,
.sbl4-announcer-page .sbl4-announcer-grid--rich {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 24px !important;
  margin-top: 24px !important;
}

.sbl4-announcer-grid .sbl4-announcer-card,
.sbl4-announcer-grid .sbl4-announcer-card--rich,
.sbl4-announcer-page .sbl4-announcer-grid .sbl4-crew-card {
  display: flex !important;
  flex-direction: column !important;
  grid-template-columns: none !important;
  height: auto !important;
  min-height: 0 !important;
  background: var(--sbl4-card) !important;
  border: 1px solid var(--sbl4-border) !important;
  border-radius: 24px !important;
  overflow: hidden !important;
  padding: 0 !important;
  gap: 0 !important;
  box-shadow: 0 10px 30px rgba(7, 29, 53, 0.04) !important;
  transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.3s ease, border-color 0.3s ease !important;
  position: relative !important;
  cursor: pointer !important;
}

.sbl4-announcer-grid .sbl4-announcer-card:hover,
.sbl4-announcer-page .sbl4-announcer-grid .sbl4-crew-card:hover {
  transform: translateY(-6px) !important;
  box-shadow: 0 24px 50px rgba(7, 29, 53, 0.12) !important;
  border-color: rgba(8, 102, 181, 0.35) !important;
}

/* Frame Foto Studio Portrait: Latar Biru Muda + Watermark Logo SBL 1 Warna Soft */
.sbl4-announcer-page .sbl4-announcer-card__photo {
  position: relative !important;
  width: 100% !important;
  height: 310px !important;
  background: linear-gradient(160deg, #f7fbff 0%, #eaf3fb 50%, #d5e8f8 100%) !important;
  display: flex !important;
  align-items: flex-end !important;
  justify-content: center !important;
  overflow: hidden !important;
  padding: 0 !important;
  border-bottom: 1px solid rgba(8, 102, 181, 0.09) !important;
}

/* Watermark Logo SBL 1 Warna Transparan/Soft */
.sbl4-announcer-page .sbl4-announcer-card__photo:before {
  content: "" !important;
  position: absolute !important;
  top: 48% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
  width: 190px !important;
  height: 190px !important;
  background-image: url('assets/images/logo-sbl-square.png') !important;
  background-repeat: no-repeat !important;
  background-position: center center !important;
  background-size: contain !important;
  opacity: 0.13 !important;
  filter: grayscale(100%) brightness(0.4) sepia(100%) hue-rotate(185deg) saturate(300%) !important;
  pointer-events: none !important;
  z-index: 1 !important;
  transition: transform 0.4s ease, opacity 0.4s ease !important;
}

.sbl4-announcer-page .sbl4-announcer-card:hover .sbl4-announcer-card__photo:before {
  transform: translate(-50%, -50%) scale(1.08) !important;
  opacity: 0.18 !important;
}

.sbl4-announcer-page .sbl4-announcer-card__photo:after {
  display: none !important;
}

.sbl4-announcer-page .sbl4-announcer-photo-frame {
  width: 100% !important;
  height: 100% !important;
  display: flex !important;
  align-items: flex-end !important;
  justify-content: center !important;
  position: relative !important;
  z-index: 2 !important;
}

.sbl4-announcer-page .sbl4-announcer-card__photo img,
.sbl4-announcer-page .sbl4-announcer-photo-frame img {
  width: auto !important;
  height: 100% !important;
  max-height: 295px !important;
  max-width: 92% !important;
  object-fit: contain !important;
  object-position: center bottom !important;
  filter: drop-shadow(0 14px 22px rgba(7, 35, 65, 0.16)) !important;
  transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.sbl4-announcer-page .sbl4-announcer-card:hover .sbl4-announcer-photo-frame img {
  transform: scale(1.04) !important;
}

/* Lencana Frekuensi Kapsul Kaca Putih */
.sbl4-announcer-page .sbl4-announcer-photo-label {
  position: absolute !important;
  right: 14px !important;
  bottom: 14px !important;
  z-index: 4 !important;
  background: rgba(255, 255, 255, 0.88) !important;
  color: #074780 !important;
  border: 1px solid rgba(8, 102, 181, 0.16) !important;
  backdrop-filter: blur(8px) !important;
  -webkit-backdrop-filter: blur(8px) !important;
  font-family: 'JetBrains Mono', monospace !important;
  font-size: 8.5px !important;
  font-weight: 800 !important;
  padding: 4px 10px !important;
  border-radius: 999px !important;
  letter-spacing: 0.04em !important;
  box-shadow: 0 3px 10px rgba(7, 29, 53, 0.06) !important;
}

/* Label ON AIR di Halaman Penyiar: Lampu Tally Studio Siaran Presisi */
.sbl4-announcer-live {
  display: none !important;
  position: absolute !important;
  top: 14px !important;
  left: 14px !important;
  z-index: 5 !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 5px 11px !important;
  border-radius: 6px !important;
  background: #dc2626 !important;
  color: #ffffff !important;
  font-family: 'Outfit', sans-serif !important;
  font-size: 9px !important;
  font-weight: 850 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  border: 1px solid rgba(255, 255, 255, 0.6) !important;
  box-shadow: 0 2px 6px rgba(15, 23, 42, 0.2), 0 1px 2px rgba(15, 23, 42, 0.1) !important;
  line-height: 1 !important;
}

.sbl4-announcer-card--rich.is-onair .sbl4-announcer-live,
.sbl4-announcer-card.is-onair .sbl4-announcer-live {
  display: inline-flex !important;
  visibility: visible !important;
  opacity: 1 !important;
}

.sbl4-announcer-card.is-onair {
  border-color: rgba(220, 38, 38, 0.35) !important;
  box-shadow: 0 14px 34px rgba(15, 23, 42, 0.08) !important;
}

/* Radar Pulse Animation */
.sbl4-live-dot,
.sbl4-announcer-radar-dot {
  width: 6px !important;
  height: 6px !important;
  border-radius: 50% !important;
  background: #ffffff !important;
  display: inline-block !important;
  box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.8) !important;
  animation: sbl4RadarPulse 1.4s infinite cubic-bezier(0.66, 0, 0, 1) !important;
}

@keyframes sbl4RadarPulse {
  0% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.8); }
  70% { transform: scale(1); box-shadow: 0 0 0 7px rgba(255, 255, 255, 0); }
  100% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(255, 255, 255, 0); }
}

/* Badan Kartu */
.sbl4-announcer-page .sbl4-announcer-card__body {
  padding: 22px 20px 20px !important;
  display: flex !important;
  flex-direction: column !important;
  flex: 1 !important;
}

.sbl4-announcer-card__tagrow {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  margin-bottom: 6px !important;
}

.sbl4-announcer-badge {
  font-size: 8px !important;
  font-weight: 850 !important;
  color: var(--sbl4-blue) !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
}

.sbl4-announcer-station {
  font-size: 7.5px !important;
  font-weight: 750 !important;
  color: var(--sbl4-muted) !important;
  letter-spacing: 0.05em !important;
}

.sbl4-announcer-page .sbl4-announcer-name {
  font-family: 'Outfit', sans-serif !important;
  font-size: 24px !important;
  font-weight: 800 !important;
  color: var(--sbl4-text) !important;
  line-height: 1.15 !important;
  margin: 0 0 4px !important;
  letter-spacing: -0.02em !important;
}

.sbl4-announcer-page .sbl4-announcer-meta {
  font-size: 11px !important;
  color: var(--sbl4-muted) !important;
  line-height: 1.4 !important;
  margin: 0 0 14px !important;
}

.sbl4-announcer-fullname {
  font-weight: 600 !important;
  color: var(--sbl4-text) !important;
}

/* Metrik 3 Kolom */
.sbl4-announcer-page .sbl4-announcer-metrics {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 8px !important;
  margin: 0 0 14px !important;
}

.sbl4-announcer-page .sbl4-announcer-metrics > div {
  padding: 8px 4px !important;
  background: var(--sbl4-surface) !important;
  border: 1px solid var(--sbl4-border) !important;
  border-radius: 12px !important;
  text-align: center !important;
}

.sbl4-announcer-page .sbl4-announcer-metrics strong {
  display: block !important;
  font-family: 'Outfit', sans-serif !important;
  font-size: 15px !important;
  font-weight: 800 !important;
  color: var(--sbl4-text) !important;
}

.sbl4-announcer-page .sbl4-announcer-metrics small {
  display: block !important;
  font-size: 8px !important;
  color: var(--sbl4-muted) !important;
  margin-top: 2px !important;
  font-weight: 600 !important;
}

/* Program Chips */
.sbl4-announcer-page .sbl4-announcer-card__programs {
  display: flex !important;
  gap: 5px !important;
  flex-wrap: wrap !important;
  margin-bottom: 12px !important;
  min-height: 26px !important;
}

.sbl4-announcer-page .sbl4-announcer-card__programs b,
.sbl4-announcer-page .sbl4-announcer-card__programs span {
  font-size: 9px !important;
  font-weight: 700 !important;
  padding: 4px 9px !important;
  border-radius: 999px !important;
  background: #eaf4fd !important;
  color: #0b68af !important;
  border: 1px solid #d8e9f8 !important;
}

/* Cuplikan Jadwal */
.sbl4-announcer-page .sbl4-announcer-next {
  background: var(--sbl4-surface) !important;
  border: 1px solid var(--sbl4-border) !important;
  border-radius: 12px !important;
  padding: 10px 12px !important;
  margin: 0 0 16px !important;
}

.sbl4-announcer-page .sbl4-announcer-next > small {
  font-size: 8px !important;
  font-weight: 850 !important;
  letter-spacing: 0.08em !important;
  color: var(--sbl4-muted) !important;
  display: block !important;
  margin-bottom: 4px !important;
}

.sbl4-announcer-page .sbl4-announcer-next span {
  font-size: 10px !important;
  line-height: 1.4 !important;
  color: var(--sbl4-text) !important;
  display: block !important;
}

/* Tombol Profil */
.sbl4-announcer-profile-button {
  width: 100% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  background: #f1f6fb !important;
  color: var(--sbl4-blue) !important;
  border: 1px solid #dbe6f2 !important;
  border-radius: 12px !important;
  padding: 11px 16px !important;
  font-size: 11px !important;
  font-weight: 750 !important;
  cursor: pointer !important;
  transition: all 0.2s ease !important;
  margin-top: auto !important;
}

.sbl4-announcer-card:hover .sbl4-announcer-profile-button {
  background: var(--sbl4-blue) !important;
  color: #fff !important;
  border-color: var(--sbl4-blue) !important;
  box-shadow: 0 6px 16px rgba(8, 102, 181, 0.25) !important;
}

.sbl4-announcer-profile-button .sbl4-btn-arrow {
  transition: transform 0.2s ease !important;
}

.sbl4-announcer-card:hover .sbl4-announcer-profile-button .sbl4-btn-arrow {
  transform: translateX(4px) !important;
}

/* Modal Popup Latar Biru Muda + Watermark Logo SBL Soft */
.sbl4-announcer-modal__photo {
  position: relative !important;
  min-height: 460px !important;
  display: flex !important;
  align-items: flex-end !important;
  justify-content: center !important;
  overflow: hidden !important;
  background: linear-gradient(160deg, #f7fbff 0%, #e8f3fb 50%, #d6e9f8 100%) !important;
}

.sbl4-announcer-modal__photo:before {
  content: "" !important;
  position: absolute !important;
  top: 45% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
  width: 220px !important;
  height: 220px !important;
  background-image: url('assets/images/logo-sbl-square.png') !important;
  background-repeat: no-repeat !important;
  background-position: center center !important;
  background-size: contain !important;
  opacity: 0.12 !important;
  filter: grayscale(100%) brightness(0.4) sepia(100%) hue-rotate(185deg) saturate(300%) !important;
  pointer-events: none !important;
  z-index: 1 !important;
}

.sbl4-announcer-modal__photo img {
  position: relative !important;
  z-index: 2 !important;
  width: 100% !important;
  height: 100% !important;
  max-height: 440px !important;
  object-fit: contain !important;
  object-position: center bottom !important;
  filter: drop-shadow(0 14px 22px rgba(7, 35, 65, 0.18)) !important;
}

.sbl4-announcer-modal__seal {
  position: absolute !important;
  bottom: 14px !important;
  left: 14px !important;
  z-index: 4 !important;
  padding: 5px 12px !important;
  background: rgba(255, 255, 255, 0.9) !important;
  border: 1px solid rgba(8, 102, 181, 0.16) !important;
  border-radius: 999px !important;
  color: #074780 !important;
  font-size: 8.5px !important;
  font-weight: 850 !important;
  box-shadow: 0 4px 12px rgba(7, 29, 53, 0.06) !important;
  backdrop-filter: blur(8px) !important;
}

.sbl4-modal-onair-badge {
  z-index: 5 !important;
  top: 14px !important;
  left: 14px !important;
  padding: 5px 11px !important;
  border-radius: 6px !important;
  background: #dc2626 !important;
  color: #ffffff !important;
  font-family: 'Outfit', sans-serif !important;
  font-size: 9px !important;
  font-weight: 850 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  box-shadow: 0 2px 6px rgba(15, 23, 42, 0.2), 0 1px 2px rgba(15, 23, 42, 0.1) !important;
  border: 1px solid rgba(255, 255, 255, 0.6) !important;
}

/* ============================================================
   RESPONSIVE BREAKPOINTS: DESKTOP vs MOBILE
   Khusus Mobile: Foto di Atas, Selebihnya di Bawah Rapi
   ============================================================ */
@media (max-width: 1180px) {
  .sbl4-announcer-page .sbl4-announcer-grid,
  .sbl4-announcer-page .sbl4-announcer-grid--rich {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 18px !important;
  }
}

@media (max-width: 768px) {
  .sbl4-announcer-page .sbl4-announcer-grid,
  .sbl4-announcer-page .sbl4-announcer-grid--rich {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }
  .sbl4-announcer-page .sbl4-announcer-card__photo {
    height: 290px !important;
  }

  /* MODAL POPUP MOBILE: FOTO DI ATAS, SELEBIHNYA DI BAWAH */
  .sbl4-announcer-modal {
    padding: 12px !important;
    align-items: center !important;
  }
  .sbl4-announcer-modal__dialog {
    display: flex !important;
    flex-direction: column !important;
    grid-template-columns: none !important;
    width: 100% !important;
    max-width: 480px !important;
    max-height: 88vh !important;
    border-radius: 24px !important;
    overflow: hidden !important;
    margin: auto !important;
  }

  /* Foto di bagian ATAS */
  .sbl4-announcer-modal__photo {
    width: 100% !important;
    min-height: 0 !important;
    height: 220px !important;
    flex: 0 0 220px !important;
    background: linear-gradient(160deg, #f7fbff 0%, #e8f3fb 50%, #d6e9f8 100%) !important;
    position: relative !important;
    border-bottom: 1px solid var(--sbl4-border) !important;
  }
  .sbl4-announcer-modal__photo:before {
    width: 140px !important;
    height: 140px !important;
  }
  .sbl4-announcer-modal__photo img {
    max-height: 205px !important;
    width: auto !important;
  }
  .sbl4-announcer-modal__close {
    top: 10px !important;
    right: 10px !important;
    width: 34px !important;
    height: 34px !important;
    background: rgba(255, 255, 255, 0.92) !important;
    border: 1px solid rgba(0, 0, 0, 0.1) !important;
    color: #071d35 !important;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1) !important;
  }

  /* Selebihnya di bagian BAWAH */
  .sbl4-announcer-modal__body {
    flex: 1 1 auto !important;
    max-height: calc(88vh - 220px) !important;
    overflow-y: auto !important;
    padding: 16px 16px 20px !important;
    -webkit-overflow-scrolling: touch !important;
  }
  .sbl4-announcer-modal__body h2 {
    font-size: 22px !important;
    margin-bottom: 3px !important;
  }
  .sbl4-announcer-modal__body > p,
  .sbl4-announcer-modal__header > p {
    font-size: 11px !important;
  }
  .sbl4-announcer-modal__metrics {
    gap: 6px !important;
    margin-bottom: 14px !important;
  }
  .sbl4-announcer-modal__metrics > div {
    padding: 6px 4px !important;
    border-radius: 10px !important;
  }
  .sbl4-announcer-modal__metrics strong {
    font-size: 14px !important;
  }
  .sbl4-announcer-modal__metrics small {
    font-size: 7.5px !important;
  }

  /* Tabel Jadwal di Mobile */
  .sbl4-modal-schedule-item {
    grid-template-columns: 80px 108px minmax(0, 1fr) !important;
    padding: 8px 10px !important;
    gap: 6px !important;
  }
  .sbl4-modal-schedule-item__day strong {
    font-size: 10px !important;
  }
  .sbl4-sched-pill {
    font-size: 6.5px !important;
    padding: 1px 5px !important;
  }
  .sbl4-modal-schedule-item__time {
    font-size: 8.5px !important;
  }
  .sbl4-modal-schedule-item__prog {
    font-size: 9.5px !important;
  }

  .sbl4-announcer-modal__actions {
    flex-direction: column !important;
    gap: 8px !important;
    margin-top: 14px !important;
  }
  .sbl4-modal-wa-btn {
    width: 100% !important;
    justify-content: center !important;
    min-height: 40px !important;
    font-size: 11px !important;
  }
  .sbl4-announcer-modal__link {
    width: 100% !important;
    margin-left: 0 !important;
    justify-content: center !important;
    min-height: 38px !important;
    font-size: 10px !important;
  }
}

/* ============================================================
   JADWAL ACARA HARI INI — ANTI TEKS BERTUMPUK (DESKTOP & MOBILE)
   ============================================================ */
.sbl4-schedule-row {
  display: grid !important;
  grid-template-columns: 144px minmax(0, 1fr) !important;
  gap: 14px !important;
  align-items: center !important;
  padding: 10px 8px !important;
  border-top: 1px solid var(--sbl4-border) !important;
}
.sbl4-schedule-row:first-child {
  border-top: 0 !important;
}
.sbl4-schedule-row .sbl4-time {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  justify-content: center !important;
  gap: 4px !important;
  min-width: 0 !important;
  line-height: 1.25 !important;
}
.sbl4-schedule-row .sbl4-now-slot,
.sbl4-schedule-row .sbl4-onair {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 4px !important;
  margin: 0 !important;
  padding: 3px 8px !important;
  border-radius: 999px !important;
  font-family: 'Outfit', sans-serif !important;
  font-size: 8.5px !important;
  font-weight: 850 !important;
  letter-spacing: 0.04em !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}
.sbl4-schedule-row .sbl4-now-slot {
  background: #e0f2fe !important;
  color: #0369a1 !important;
  border: 1px solid rgba(2, 132, 199, 0.25) !important;
}
[data-theme="dark"] .sbl4-schedule-row .sbl4-now-slot {
  background: #0c2b45 !important;
  color: #38bdf8 !important;
  border-color: rgba(56, 189, 248, 0.3) !important;
}
.sbl4-schedule-row .sbl4-onair {
  background: #fef2f2 !important;
  color: #dc2626 !important;
  border: 1px solid rgba(220, 38, 38, 0.25) !important;
}
.sbl4-schedule-row .sbl4-time-range {
  display: block !important;
  font-family: 'JetBrains Mono', monospace, sans-serif !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  color: #334e68 !important;
  white-space: nowrap !important;
  line-height: 1.25 !important;
}
[data-theme="dark"] .sbl4-schedule-row .sbl4-time-range {
  color: #94a3b8 !important;
}
.sbl4-schedule-row.is-active {
  background: rgba(8, 102, 181, 0.05) !important;
  border-radius: 12px !important;
  border: 1px solid rgba(8, 102, 181, 0.15) !important;
  padding: 10px 10px !important;
}
[data-theme="dark"] .sbl4-schedule-row.is-active {
  background: rgba(56, 189, 248, 0.06) !important;
  border-color: rgba(56, 189, 248, 0.18) !important;
}

@media (max-width: 768px) {
  .sbl4-schedule-row {
    grid-template-columns: 112px minmax(0, 1fr) !important;
    gap: 10px !important;
    padding: 9px 6px !important;
  }
  .sbl4-schedule-row .sbl4-now-slot,
  .sbl4-schedule-row .sbl4-onair {
    font-size: 7.5px !important;
    padding: 2px 6px !important;
  }
  .sbl4-schedule-row .sbl4-time-range {
    font-size: 9.5px !important;
  }
}

/* ============================================================
   PROTEKSI MUTLAK BADGE ON AIR BERANDA (ANTI KAPSUL VERTIKAL)
   Mencegah browser menerapkan top dan bottom bersamaan yang meregangkan elemen
   ============================================================ */
.sbl4-crew-live,
.sbl4-avatar-wrap .sbl4-crew-live,
.sbl4-crew .sbl4-crew-card .sbl4-crew-live,
.sbl4-crew-card .sbl4-crew-live {
  top: auto !important;
  bottom: 0px !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  height: auto !important;
  max-height: 20px !important;
  box-sizing: border-box !important;
  white-space: nowrap !important;
  flex-direction: row !important;
  line-height: 1 !important;
}

/* ============================================================
   SBL PODCAST & PINRANG BERKABAR — VIDEO ON-DEMAND SYSTEM
   Desain profesional, rapi, dan super responsif / mobile-friendly
   ============================================================ */
.sbl4-btn-yt-badge {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  background: #ff0000 !important;
  color: #fff !important;
  border-radius: 999px;
  padding: 8px 14px;
  font-size: 11px;
  font-weight: 850;
  text-decoration: none;
  transition: transform .2s ease, opacity .2s ease;
}
.sbl4-btn-yt-badge:hover {
  transform: translateY(-1px);
  opacity: .95;
}
.sbl4-podcast-hero__copy div {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 14px;
}
.sbl4-podcast-hero__copy .is-spotify {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  background: #1db954 !important;
  color: #05190b !important;
  border-radius: 999px;
  padding: 8px 14px;
  font-size: 11px;
  font-weight: 850;
  text-decoration: none;
}

/* Spotlight Video Unggulan Terbaru */
.sbl4-podcast-spotlight {
  display: grid;
  grid-template-columns: 1.15fr 1fr;
  align-items: center;
  gap: 24px;
  background: linear-gradient(135deg, #071d35 0%, #0a355c 60%, #06223e 100%);
  border: 1px solid rgba(255, 255, 255, .14);
  border-radius: 22px;
  padding: 22px 24px;
  color: #fff;
  margin: 18px 0 22px;
  box-shadow: 0 18px 45px rgba(7, 29, 53, .16);
  position: relative;
  overflow: hidden;
}
.sbl4-podcast-spotlight:after {
  content: "";
  position: absolute;
  right: -50px;
  top: -50px;
  width: 250px;
  height: 250px;
  background: radial-gradient(circle, rgba(18, 168, 255, .15), transparent 70%);
  pointer-events: none;
}
.sbl4-podcast-spotlight__media {
  width: 100%;
}
.sbl4-podcast-spotlight__facade {
  position: relative;
  width: 100%;
  aspect-ratio: 16/9;
  border-radius: 16px;
  overflow: hidden;
  border: 0;
  padding: 0;
  background: #020b14;
  cursor: pointer;
  box-shadow: 0 10px 30px rgba(0, 0, 0, .35);
  display: block;
}
.sbl4-podcast-spotlight__facade img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .35s ease;
}
.sbl4-podcast-spotlight__facade:hover img {
  transform: scale(1.04);
}
.sbl4-podcast-spotlight__shade {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0,0,0,0) 50%, rgba(3,17,34,.75) 100%);
}
.sbl4-podcast-spotlight__play {
  position: absolute;
  inset: 50% auto auto 50%;
  transform: translate(-50%, -50%);
  width: 58px;
  height: 58px;
  border-radius: 50%;
  background: #ff0000;
  color: #fff;
  display: grid;
  place-items: center;
  font-size: 20px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, .45);
  transition: transform .25s ease, background .25s ease;
}
.sbl4-podcast-spotlight__facade:hover .sbl4-podcast-spotlight__play {
  transform: translate(-50%, -50%) scale(1.12);
  background: #ff1f2d;
}
.sbl4-podcast-spotlight__content {
  position: relative;
  z-index: 2;
}
.sbl4-podcast-spotlight__eyebrow {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 8px;
}
.sbl4-video-badge--spotlight {
  position: static !important;
  display: inline-flex !important;
  align-items: center;
  background: #ff0000;
  color: #fff;
  border-radius: 999px;
  padding: 4px 10px;
  font-size: 8.5px;
  font-weight: 900;
  letter-spacing: .05em;
  box-shadow: none;
}
.sbl4-spotlight-date {
  font-size: 11px;
  color: #8ed0ff;
  font-weight: 700;
}
.sbl4-podcast-spotlight__title {
  font-family: "Outfit", sans-serif;
  font-size: clamp(21px, 2.3vw, 29px);
  line-height: 1.22;
  margin: 6px 0 10px;
  letter-spacing: -.02em;
  color: #fff;
}
.sbl4-podcast-spotlight__desc {
  font-size: 12px;
  line-height: 1.6;
  color: #bed5ea;
  margin: 0 0 16px;
  max-width: 520px;
}
.sbl4-podcast-spotlight__actions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

/* Control Bar (Filter Tabs & Search Input) */
.sbl4-podcast-control-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  background: var(--sbl4-card);
  border: 1px solid var(--sbl4-border);
  border-radius: 18px;
  padding: 12px 16px;
  margin-bottom: 18px;
  box-shadow: 0 4px 18px rgba(7, 29, 53, .04);
}
.sbl4-podcast-filter-tabs {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.sbl4-tab-pill {
  border: 1px solid var(--sbl4-border);
  background: var(--sbl4-surface);
  color: var(--sbl4-muted);
  border-radius: 999px;
  padding: 8px 15px;
  font-size: 11px;
  font-weight: 800;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  cursor: pointer;
  transition: all .2s ease;
}
.sbl4-tab-pill:hover {
  color: var(--sbl4-blue);
  border-color: var(--sbl4-blue);
}
.sbl4-tab-pill.is-active {
  background: var(--sbl4-blue);
  color: #fff;
  border-color: var(--sbl4-blue);
  box-shadow: 0 4px 14px rgba(8, 102, 181, .25);
}
.sbl4-pill-count {
  background: rgba(0, 0, 0, .08);
  color: inherit;
  border-radius: 999px;
  padding: 2px 7px;
  font-size: 9.5px;
  font-weight: 900;
}
.sbl4-tab-pill.is-active .sbl4-pill-count {
  background: rgba(255, 255, 255, .25);
  color: #fff;
}
.sbl4-podcast-search-wrap {
  flex: 0 1 300px;
}
.sbl4-search-box {
  display: flex;
  align-items: center;
  gap: 9px;
  background: var(--sbl4-surface);
  border: 1px solid var(--sbl4-border);
  border-radius: 999px;
  padding: 0 14px;
  height: 40px;
  width: 100%;
}
.sbl4-search-box:focus-within {
  border-color: var(--sbl4-blue);
  background: var(--sbl4-card);
  box-shadow: 0 0 0 3px rgba(8, 102, 181, .12);
}
.sbl4-search-icon {
  color: var(--sbl4-muted);
  flex-shrink: 0;
}
.sbl4-search-box input {
  border: 0;
  outline: 0;
  background: transparent;
  color: var(--sbl4-text);
  font-size: 11px;
  width: 100%;
}

/* Video Grid & Cards */
.sbl4-podcast-video-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  margin-bottom: 24px;
}
.sbl4-podcast-card {
  display: flex;
  flex-direction: column;
  background: var(--sbl4-card);
  border: 1px solid var(--sbl4-border);
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 6px 20px rgba(7, 29, 53, .04);
  transition: transform .22s ease, box-shadow .22s ease;
}
.sbl4-podcast-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 14px 34px rgba(7, 29, 53, .10);
}
.sbl4-podcast-card .sbl4-video-facade {
  position: relative;
  width: 100%;
  aspect-ratio: 16/9;
  border: 0;
  padding: 0;
  background: #071d35;
  cursor: pointer;
  overflow: hidden;
}
.sbl4-podcast-card .sbl4-video-facade img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .3s ease;
}
.sbl4-podcast-card:hover .sbl4-video-facade img {
  transform: scale(1.04);
}
.sbl4-video-badge {
  position: absolute;
  top: 10px !important;
  left: 10px !important;
  bottom: auto !important;
  right: auto !important;
  transform: none !important;
  width: auto !important;
  height: auto !important;
  z-index: 2;
  border-radius: 999px !important;
  padding: 4px 9px !important;
  font-size: 8px !important;
  font-weight: 900;
  letter-spacing: .04em;
  backdrop-filter: blur(6px);
  box-shadow: 0 2px 8px rgba(0,0,0,.35) !important;
}
.sbl4-video-facade > .sbl4-video-badge {
  inset: auto auto auto auto !important;
  top: 10px !important;
  left: 10px !important;
  transform: none !important;
  width: auto !important;
  height: auto !important;
}
.sbl4-video-badge--podcast {
  background: rgba(8, 102, 181, .94) !important;
  color: #fff !important;
  border: 1px solid rgba(255, 255, 255, .3) !important;
}
.sbl4-video-badge--berkabar {
  background: rgba(239, 51, 64, .94) !important;
  color: #fff !important;
  border: 1px solid rgba(255, 255, 255, .3) !important;
}
.sbl4-video-play-btn,
.sbl4-video-facade > .sbl4-video-play-btn {
  position: absolute !important;
  inset: 50% auto auto 50% !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
  width: 46px !important;
  height: 46px !important;
  border-radius: 50% !important;
  background: rgba(239, 51, 64, .92) !important;
  color: #fff !important;
  display: grid !important;
  place-items: center !important;
  font-size: 15px !important;
  box-shadow: 0 6px 18px rgba(0, 0, 0, .4) !important;
  transition: transform .2s ease, background .2s ease;
  z-index: 2;
}
.sbl4-podcast-card:hover .sbl4-video-play-btn {
  transform: translate(-50%, -50%) scale(1.12) !important;
  background: #ff0000 !important;
}
.sbl4-podcast-card__body {
  padding: 14px 16px;
  display: flex;
  flex-direction: column;
  flex: 1;
}
.sbl4-podcast-card__meta {
  font-size: 10px;
  color: var(--sbl4-muted);
  display: flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 6px;
  font-weight: 700;
}
.sbl4-meta-dot {
  opacity: .4;
}
.sbl4-podcast-card__channel {
  color: var(--sbl4-blue);
  font-weight: 800;
}
.sbl4-podcast-card__title {
  font-family: "Outfit", sans-serif;
  font-size: 14.5px;
  line-height: 1.35;
  margin: 0 0 12px;
  font-weight: 700;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.sbl4-podcast-card__title a {
  color: var(--sbl4-text);
  text-decoration: none;
  transition: color .2s ease;
}
.sbl4-podcast-card__title a:hover {
  color: var(--sbl4-blue);
}
.sbl4-podcast-card__footer {
  margin-top: auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding-top: 10px;
  border-top: 1px solid var(--sbl4-border);
}
.sbl4-podcast-action-play {
  border: 0;
  background: var(--sbl4-surface);
  color: var(--sbl4-blue);
  border-radius: 999px;
  padding: 6px 12px;
  font-size: 10px;
  font-weight: 850;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  cursor: pointer;
  transition: all .2s ease;
}
.sbl4-podcast-action-play:hover {
  background: var(--sbl4-blue);
  color: #fff;
}
.sbl4-podcast-action-play i {
  font-style: normal;
  font-size: 9px;
}
.sbl4-podcast-link-yt {
  font-size: 10px;
  font-weight: 850;
  color: #ef3340;
  text-decoration: none;
  transition: opacity .2s ease;
}
.sbl4-podcast-link-yt:hover {
  opacity: .8;
}

/* Empty State */
.sbl4-video-empty {
  padding: 36px 18px;
  text-align: center;
  background: var(--sbl4-card);
  border: 1px solid var(--sbl4-border);
  border-radius: 16px;
  color: var(--sbl4-muted);
}
.sbl4-empty-icon {
  font-size: 32px;
  margin-bottom: 8px;
}
.sbl4-video-empty strong {
  display: block;
  font-size: 13px;
  color: var(--sbl4-text);
  margin-bottom: 4px;
}
.sbl4-video-empty p {
  font-size: 11px;
  margin: 0;
}

/* Responsivitas Media Queries Halaman Podcast */
@media (max-width: 960px) {
  .sbl4-podcast-spotlight {
    grid-template-columns: 1fr;
    gap: 16px;
    padding: 18px;
  }
  .sbl4-podcast-video-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .sbl4-podcast-control-bar {
    flex-direction: column;
    align-items: stretch;
  }
  .sbl4-podcast-search-wrap {
    flex: 1 1 auto;
    width: 100%;
  }
}

@media (max-width: 580px) {
  .sbl4-podcast-video-grid {
    grid-template-columns: 1fr;
  }
  .sbl4-podcast-filter-tabs {
    width: 100%;
  }
  .sbl4-tab-pill {
    flex: 1 1 calc(50% - 6px);
    justify-content: center;
    font-size: 10px;
    padding: 7px 10px;
  }
  .sbl4-podcast-spotlight__title {
    font-size: 18px;
  }
  .sbl4-podcast-card__title {
    font-size: 13.5px;
  }
  .sbl4-podcast-spotlight__play {
    width: 48px;
    height: 48px;
    font-size: 17px;
  }
}