/* ZamanToon palette: the violet/cyan orbit and yellow/orange Z are the reference. */
:root{
 --brand-violet:#7839ef;--brand-blue:#276df2;--brand-cyan:#20c8fa;--brand-yellow:#ffd329;--brand-orange:#ff9508;--brand-pink:#e82db4;
 --bg:#0c0820;--bg-2:#120d2b;--surface:#1b133b;--surface-2:#251a4e;
 --text:#f8f6ff;--text-2:#ccc5e4;--text-3:#a49abe;
 --line:rgba(145,119,222,.18);--line-2:rgba(149,127,230,.34);
 --primary:var(--brand-yellow);--primary-2:var(--brand-orange);--secondary:var(--brand-cyan);
 --grad:linear-gradient(115deg,#ffe14b 0%,#ffcb15 48%,#ff9808 100%);
 --glow:0 9px 28px -13px rgba(255,168,12,.42);
}
body{background:var(--bg);color:var(--text)}
.nav,.nav.scrolled{background:rgba(12,8,32,.94);border-bottom-color:var(--line)}
.nav-logo>[data-i18n=brandName]{color:var(--brand-yellow)}
.nav-logo [data-i18n=brandName] .brand-toon{display:inline;color:var(--brand-cyan);font:inherit;letter-spacing:inherit}
.nav-logo>.brand-mark{width:66px;height:66px}
.nav-logo>[data-i18n=brandName]{font-size:18px}
html[lang=ar] .nav-logo>[data-i18n=brandName]{font-size:20px}
.nav-links a.active{color:var(--brand-cyan);background:rgba(120,57,239,.20);box-shadow:inset 0 0 0 1px rgba(105,93,231,.28)}
.nav-links a:hover{background:rgba(120,57,239,.12)}
.nav-actions .search-box,.select,.planner-panel input{background:#181030;border-color:var(--line-2)}
.search-box:focus-within,.select:focus,.planner-panel input:focus{border-color:var(--brand-cyan);outline-color:var(--brand-cyan)}
.btn-primary{background:var(--grad);color:#21103a;box-shadow:var(--glow)}
.btn-primary:hover{box-shadow:0 8px 26px -10px #ffaf1459}
.btn-ghost{background:rgba(120,57,239,.07);border-color:var(--line-2);color:var(--text)}
.btn-ghost:hover{border-color:#8f65e7;background:rgba(120,57,239,.15)}
.section-kicker{color:var(--brand-yellow)}
.text-link,.see-all,.link{color:var(--brand-cyan)}
.live-dot{background:var(--brand-orange);box-shadow:0 0 0 4px #ff950815}
.universe-hero{background:radial-gradient(ellipse at 82% 43%,rgba(89,37,177,.24),transparent 62%)}
.planet-photo-hero:before{background:radial-gradient(ellipse,rgba(93,48,187,.20),transparent 70%)}
.universe-counts b,.page h1,.universe-copy h1,.section-title{color:var(--text)}
.planet-card{background:linear-gradient(145deg,#1b123a,#120d2b);border-color:var(--line)}
.planet-card:hover,.planet-card:focus-visible{border-color:rgba(32,200,250,.6)}
.planet-visual .planet-title-name{color:var(--brand-yellow)}
.planet-title-prefix{color:#fff6e2}
.planet-card .planet-card-copy p,.universe-counts span{color:var(--text-3)}
.planet-card .planet-card-copy>span svg{color:var(--brand-cyan)}
.chip{background:#22163f;color:var(--text-2);border-color:var(--line)}
.chip.hot{background:#ffcf191a;color:var(--brand-yellow)}
.tv-invitation{border-color:var(--line);background:linear-gradient(90deg,#2a144455,transparent)}
.program-status{background:#1c133b;border-color:var(--line)}
.planner-panel,.asset-upload,.studio-dialog{background:var(--surface);border-color:var(--line-2)}
.day-strip .active{background:#763aeb1c;box-shadow:inset 0 -2px var(--brand-cyan)}
.day-strip .active b{color:var(--brand-yellow)}
.program-row.ident,.program-row.advert{background:#1c123977}
.studio-tabs button.active{color:var(--brand-cyan);border-color:var(--brand-cyan)}
.studio-dialog .select{background:#130b2a}
.broadcast-card{background:radial-gradient(ellipse at 50% 45%,#271344,#0c0820)}
.tv-gate{background:rgba(12,8,32,.87)}
.tv-control,.tv-live-control{background:#130b2c88;color:#faf5ff}
.tv-control:hover,.tv-control:focus-visible{background:#7739ef3b;color:var(--brand-yellow)}
.tv-volume{accent-color:var(--brand-yellow)}
.tabbar{background:#100b28;border-color:var(--line)}
.tabbar a.active{color:var(--brand-cyan)}
.footer{border-color:var(--line)}

/* Station identifiers remain in the image plane in native and mobile fullscreen. */
.tv-current-planet{position:absolute;left:clamp(12px,2.5vw,32px);top:clamp(12px,2.5vw,30px);z-index:10;display:flex;flex-direction:column;align-items:center;width:108px;max-width:34%;gap:1px;pointer-events:none;text-align:center;filter:drop-shadow(0 2px 4px #000c)}
.tv-current-planet>picture{display:block;width:62px;height:52px;line-height:0}
.tv-current-planet img{display:block;width:100%;height:100%;object-fit:contain;animation:none!important}
.tv-planet-name{font-size:10px;font-weight:800;line-height:1.4;color:#fff6d9;text-shadow:0 1px 3px #000,0 0 8px #000;max-width:100%;overflow-wrap:normal}
.tv-expanded .tv-current-planet{width:140px}
.tv-expanded .tv-current-planet>picture{width:82px;height:68px}
.tv-expanded .tv-planet-name{font-size:12px}
html[lang=ar] .tv-planet-name{font-family:'Cairo',sans-serif}
@media(max-width:700px){.tv-current-planet{left:max(10px,env(safe-area-inset-left));top:max(8px,env(safe-area-inset-top));width:84px;gap:0}.tv-current-planet>picture{width:42px;height:35px}.tv-planet-name{font-size:8px}.tv-expanded .tv-current-planet{width:96px}.tv-expanded .tv-current-planet>picture{width:48px;height:40px}.tv-expanded .tv-planet-name{font-size:9px}}
@media(max-width:600px){.nav-logo>.brand-mark{width:54px;height:54px}.nav-logo>[data-i18n=brandName]{font-size:16px}html[lang=ar] .nav-logo>[data-i18n=brandName]{font-size:18px}}
@media(max-width:380px){.nav{gap:8px}.nav-actions{gap:6px}.nav-logo{gap:4px}.nav-logo>[data-i18n=brandName]{font-size:14px}html[lang=ar] .nav-logo>[data-i18n=brandName]{font-size:16px}}