@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&family=Playfair+Display:wght@700;800&display=swap');
:root{
 --bg0:#020d0b;--bg1:#04231d;--bg2:#073a30;--panel:rgba(5,35,29,.86);--panel2:rgba(5,44,36,.74);
 --gold:#e8bd62;--gold2:#ffe5a0;--gold-rgb:232,189,98;--accent:#2fe0ad;--accent-rgb:47,224,173;
 --text:#f6fffb;--muted:#9fc0b5;--line:rgba(255,255,255,.10);--danger:#ff6b6b;--video-fit:contain;--bg-image:none;
}
body[data-theme=blue]{--bg0:#020913;--bg1:#071c34;--bg2:#0a3153;--panel:rgba(6,24,45,.88);--panel2:rgba(8,41,69,.74);--accent:#43c7ff;--accent-rgb:67,199,255;--gold:#e6c677;--gold-rgb:230,198,119;--muted:#9fbcd0}
body[data-theme=gold]{--bg0:#120d04;--bg1:#302207;--bg2:#543b0b;--panel:rgba(43,29,7,.88);--panel2:rgba(69,46,9,.76);--accent:#ffd76f;--accent-rgb:255,215,111;--gold:#f6c85f;--gold-rgb:246,200,95;--muted:#d4c49d}
body[data-theme=maroon]{--bg0:#110509;--bg1:#35101c;--bg2:#57192b;--panel:rgba(47,11,24,.88);--panel2:rgba(74,18,37,.76);--accent:#ff769a;--accent-rgb:255,118,154;--gold:#e6bd70;--gold-rgb:230,189,112;--muted:#ceb0b9}
*{box-sizing:border-box}html,body{width:100%;height:100%;margin:0;overflow:hidden;background:var(--bg0);color:var(--text);font-family:Inter,Arial,sans-serif}body{font-size:1vw}svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.tv-app{position:relative;width:100vw;height:100vh;display:grid;grid-template-rows:13.3vh minmax(0,1fr) 6.1vh;gap:.85vh;padding:1.15vh 1.1vw;background:radial-gradient(circle at 85% -10%,rgba(var(--accent-rgb),.17),transparent 33%),radial-gradient(circle at 3% 100%,rgba(var(--gold-rgb),.11),transparent 35%),linear-gradient(115deg,rgba(1,12,10,.985),rgba(4,33,27,.955) 48%,rgba(1,13,11,.985)),var(--bg-image);background-size:cover;background-position:center;isolation:isolate}.tv-app:before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(0,0,0,.24),transparent 30%,transparent 70%,rgba(0,0,0,.15));pointer-events:none}.bg-pattern{position:absolute;z-index:-1;inset:0;opacity:.11;background-image:linear-gradient(30deg,rgba(var(--gold-rgb),.45) 12%,transparent 12.5%,transparent 87%,rgba(var(--gold-rgb),.45) 87.5%,rgba(var(--gold-rgb),.45)),linear-gradient(150deg,rgba(var(--gold-rgb),.45) 12%,transparent 12.5%,transparent 87%,rgba(var(--gold-rgb),.45) 87.5%,rgba(var(--gold-rgb),.45)),linear-gradient(30deg,rgba(var(--gold-rgb),.45) 12%,transparent 12.5%,transparent 87%,rgba(var(--gold-rgb),.45) 87.5%,rgba(var(--gold-rgb),.45)),linear-gradient(150deg,rgba(var(--gold-rgb),.45) 12%,transparent 12.5%,transparent 87%,rgba(var(--gold-rgb),.45) 87.5%,rgba(var(--gold-rgb),.45)),linear-gradient(60deg,rgba(var(--accent-rgb),.24) 25%,transparent 25.5%,transparent 75%,rgba(var(--accent-rgb),.24) 75%,rgba(var(--accent-rgb),.24));background-size:78px 138px;background-position:0 0,0 0,39px 69px,39px 69px,0 0;mask-image:linear-gradient(90deg,#000,transparent 34%,transparent 68%,#000)}.bg-light{position:absolute;z-index:-1;width:28vw;height:28vw;border-radius:50%;filter:blur(90px);opacity:.15;animation:float 14s ease-in-out infinite alternate}.bg-light.one{left:-8vw;bottom:-12vw;background:var(--accent)}.bg-light.two{right:-10vw;top:-15vw;background:var(--gold);animation-delay:-7s}.glass{position:relative;overflow:hidden;border:1px solid rgba(var(--gold-rgb),.27);border-radius:1.25vh;background:linear-gradient(145deg,rgba(255,255,255,.035),rgba(255,255,255,.008)),linear-gradient(135deg,var(--panel),rgba(2,20,17,.84));box-shadow:0 1.2vh 3.2vh rgba(0,0,0,.22),inset 0 1px rgba(255,255,255,.04);backdrop-filter:blur(14px)}.glass:before{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:linear-gradient(90deg,transparent,rgba(var(--gold-rgb),.75),rgba(var(--accent-rgb),.55),transparent);opacity:.65}.tv-header{display:grid;grid-template-columns:42% 30% 28%;align-items:center;min-width:0;padding:0 .65vw;border-bottom:1px solid rgba(var(--gold-rgb),.20)}.mosque-brand{display:flex;align-items:center;gap:.85vw;min-width:0}.mosque-logo{width:8.6vh;height:8.6vh;flex:0 0 auto;display:grid;place-items:center;padding:1.05vh;color:var(--gold);border:1px solid rgba(var(--gold-rgb),.45);border-radius:1.65vh;background:linear-gradient(145deg,rgba(var(--gold-rgb),.13),rgba(var(--accent-rgb),.05));box-shadow:0 0 2.4vh rgba(var(--gold-rgb),.08),inset 0 1px rgba(255,255,255,.06)}.mosque-logo img{width:100%;height:100%;object-fit:contain}.mosque-brand>div:last-child{min-width:0}.mosque-brand small{display:block;color:var(--accent);font-size:.86vh;font-weight:900;letter-spacing:.16vw}.mosque-brand h1{margin:.2vh 0 .25vh;color:var(--gold2);font-family:"Playfair Display",Georgia,serif;font-size:3.7vh;line-height:1.05;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-shadow:0 .3vh 1.5vh rgba(var(--gold-rgb),.12)}.mosque-brand p{margin:0;max-width:38vw;color:var(--muted);font-size:1.05vh;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.clock-center{text-align:center}.main-clock{font-size:6.8vh;font-weight:900;line-height:.95;letter-spacing:-.25vh;text-shadow:0 .5vh 2vh rgba(0,0,0,.32)}.main-clock span{font-size:3.2vh;color:var(--accent);letter-spacing:-.1vh}.clock-day{display:flex;align-items:center;justify-content:center;gap:.55vw;margin-top:.6vh;color:var(--gold);font-size:.72vh;letter-spacing:.18vw}.clock-day i{width:2.5vw;height:1px;background:linear-gradient(90deg,transparent,var(--gold))}.clock-day i:last-child{transform:scaleX(-1)}.header-info{display:flex;align-items:center;justify-content:flex-end;gap:1vw}.date-box{display:flex;align-items:center;gap:.55vw;min-width:0}.date-icon{width:4.5vh;height:4.5vh;padding:.75vh;color:var(--gold);border-radius:1vh;background:rgba(var(--gold-rgb),.08);border:1px solid rgba(var(--gold-rgb),.20)}.date-box b,.date-box span{display:block;text-align:left;white-space:nowrap}.date-box b{font-size:1.05vh}.date-box span{margin-top:.28vh;color:var(--muted);font-size:.92vh}.header-actions{display:flex;align-items:center;gap:.45vw}.online-pill{display:flex;align-items:center;gap:.35vw;padding:.7vh .62vw;color:var(--accent);border:1px solid rgba(var(--accent-rgb),.22);border-radius:99px;background:rgba(var(--accent-rgb),.075);font-size:.78vh;font-weight:900;letter-spacing:.05vw}.online-pill i,.live-badge i,.metric-label i,.now-playing i{width:.55vh;height:.55vh;border-radius:50%;background:var(--accent);box-shadow:0 0 .9vh var(--accent);animation:pulse 1.6s infinite}.online-pill.offline{color:#ff8e8e;border-color:rgba(255,100,100,.25);background:rgba(255,80,80,.08)}.online-pill.offline i{background:#ff6464;box-shadow:0 0 .9vh #ff6464}.header-actions button{width:3.7vh;height:3.7vh;padding:.85vh;color:var(--muted);border:1px solid rgba(255,255,255,.10);border-radius:.9vh;background:rgba(255,255,255,.04);cursor:pointer}.tv-main{display:grid;grid-template-columns:41.5% minmax(0,1fr);gap:.8vw;min-height:0}.prayer-section{display:grid;grid-template-rows:7vh 3.6vh minmax(0,1fr) 6.3vh;min-height:0;padding:.55vh .65vw .65vh}.section-title{display:flex;align-items:center;justify-content:space-between;gap:.6vw;padding:.45vh .25vw}.section-title>div{display:flex;align-items:center;gap:.55vw;min-width:0}.section-title .icon-box{width:4.4vh;height:4.4vh;padding:.8vh;color:var(--gold);border-radius:1vh;background:rgba(var(--gold-rgb),.09);border:1px solid rgba(var(--gold-rgb),.20)}.section-title small{display:block;color:var(--accent);font-size:.78vh;font-weight:900;letter-spacing:.13vw}.section-title h2{margin:.2vh 0 0;font-family:"Playfair Display",Georgia,serif;font-size:2.15vh;color:var(--gold2)}.section-title>b{padding:.55vh .55vw;color:var(--gold);border:1px solid rgba(var(--gold-rgb),.22);border-radius:.8vh;background:rgba(var(--gold-rgb),.055);font-size:.78vh;letter-spacing:.09vw}.prayer-head,.prayer-row{display:grid;grid-template-columns:50% 25% 25%;align-items:center}.prayer-head{padding:0 .55vw;color:var(--gold);border-top:1px solid rgba(var(--gold-rgb),.13);border-bottom:1px solid rgba(var(--gold-rgb),.13);background:rgba(var(--gold-rgb),.035);font-size:.82vh;font-weight:900;letter-spacing:.1vw}.prayer-head span:not(:first-child){text-align:center}.prayer-grid{display:grid;grid-template-rows:repeat(7,minmax(0,1fr));min-height:0}.prayer-row{position:relative;padding:.25vh .48vw;border-bottom:1px solid rgba(255,255,255,.065);transition:.35s}.prayer-row:last-child{border-bottom:0}.prayer-name{display:flex;align-items:center;gap:.58vw;min-width:0}.prayer-icon{width:3.4vh;height:3.4vh;flex:0 0 auto;display:grid;place-items:center;padding:.55vh;color:var(--gold);border-radius:.8vh;background:rgba(var(--gold-rgb),.06)}.prayer-name strong,.prayer-name small{display:block}.prayer-name strong{font-size:1.42vh;line-height:1}.prayer-name small{margin-top:.25vh;color:var(--muted);font-size:.72vh;letter-spacing:.07vw}.prayer-time{text-align:center;font-size:1.65vh;font-weight:850;font-variant-numeric:tabular-nums}.next-badge{display:none;margin-left:auto;padding:.4vh .4vw;color:#16362d;border-radius:.6vh;background:linear-gradient(110deg,var(--gold2),var(--gold));font-size:.67vh;font-weight:950;letter-spacing:.06vw}.prayer-row.next{margin:.28vh 0;border:1px solid rgba(var(--gold-rgb),.75);border-radius:.9vh;background:linear-gradient(100deg,rgba(var(--gold-rgb),.96),rgba(var(--gold-rgb),.72));color:#17382f;box-shadow:0 .65vh 1.7vh rgba(var(--gold-rgb),.16);animation:activeGlow 2.8s ease-in-out infinite}.prayer-row.next .prayer-icon{color:#17382f;background:rgba(255,255,255,.18)}.prayer-row.next .prayer-name small{color:rgba(23,56,47,.75)}.prayer-row.next .next-badge{display:inline-block}.daily-message{display:flex;align-items:center;gap:.6vw;margin-top:.45vh;padding:.7vh .65vw;border:1px solid rgba(var(--accent-rgb),.16);border-radius:.9vh;background:linear-gradient(90deg,rgba(var(--accent-rgb),.08),rgba(var(--gold-rgb),.035));overflow:hidden}.daily-message>span{color:var(--gold);font-size:1.7vh}.daily-message small,.daily-message b{display:block}.daily-message small{color:var(--accent);font-size:.68vh;font-weight:900;letter-spacing:.1vw}.daily-message b{margin-top:.18vh;font-size:.94vh;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.right-area{display:grid;grid-template-rows:minmax(0,1fr) 21.7vh;gap:.8vh;min-height:0}.top-feature{display:grid;grid-template-columns:minmax(0,1fr) 23%;gap:.75vw;min-height:0}.video-section{display:grid;grid-template-rows:5.6vh minmax(0,1fr) 4.4vh;padding:.45vh .5vw .5vh;min-height:0}.media-title{padding:.2vh .15vw}.media-title .icon-box{width:3.8vh;height:3.8vh}.media-title h2{font-size:1.65vh}.live-badge{display:flex;align-items:center;gap:.32vw;padding:.42vh .45vw;color:var(--accent);border:1px solid rgba(var(--accent-rgb),.25);border-radius:.65vh;background:rgba(var(--accent-rgb),.07);font-size:.72vh;font-weight:900;letter-spacing:.06vw}.video-shell{position:relative;width:100%;height:auto;aspect-ratio:16/9;justify-self:center;align-self:center;overflow:hidden;border:1px solid rgba(var(--gold-rgb),.32);border-radius:.9vh;background:#020806;box-shadow:0 1.2vh 2.6vh rgba(0,0,0,.28),inset 0 0 3vh rgba(0,0,0,.35)}.media-stage{position:absolute;inset:0;display:grid;place-items:center;overflow:hidden}.media-stage video,.media-stage iframe,.media-stage img{display:block;width:100%;height:100%;border:0;object-fit:var(--video-fit);background:#000}.stage-image{object-fit:contain!important}.video-corners{position:absolute;inset:.4vh;pointer-events:none}.video-corners i{position:absolute;width:1.5vw;height:1.5vh;border-color:var(--gold);opacity:.75}.video-corners i:nth-child(1){left:0;top:0;border-left:1px solid;border-top:1px solid}.video-corners i:nth-child(2){right:0;top:0;border-right:1px solid;border-top:1px solid}.video-corners i:nth-child(3){left:0;bottom:0;border-left:1px solid;border-bottom:1px solid}.video-corners i:nth-child(4){right:0;bottom:0;border-right:1px solid;border-bottom:1px solid}.now-playing{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:.6vw;padding:.5vh .4vw 0}.now-playing span{display:flex;align-items:center;gap:.32vw;color:var(--accent);font-size:.7vh;font-weight:900;letter-spacing:.07vw}.now-playing b{font-size:.9vh;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.default-slide{position:absolute;inset:0;display:grid;place-content:center;text-align:center;overflow:hidden;background:radial-gradient(circle at 50% 15%,rgba(var(--accent-rgb),.18),transparent 33%),linear-gradient(145deg,#06271f,#020d0b)}.default-ornament{position:absolute;left:50%;top:50%;width:28vh;height:28vh;border:1px solid rgba(var(--gold-rgb),.12);transform:translate(-50%,-50%) rotate(45deg);box-shadow:0 0 0 3vh rgba(var(--gold-rgb),.015),0 0 0 6vh rgba(var(--accent-rgb),.012);animation:ornament 14s linear infinite}.default-mosque{position:relative;width:10vh;height:7.5vh;margin:auto;color:var(--gold)}.default-slide p{position:relative;margin:.6vh 0 .2vh;color:var(--accent);font-size:.7vh;font-weight:900;letter-spacing:.18vw}.default-slide h2{position:relative;margin:0;color:var(--gold2);font-family:"Playfair Display",Georgia,serif;font-size:2.7vh}.default-slide>span{position:relative;margin-top:.4vh;color:var(--muted);font-size:.75vh}.media-caption{position:absolute;left:.7vw;right:.7vw;bottom:.7vh;padding:.65vh .7vw;color:#fff;border-radius:.65vh;background:rgba(0,0,0,.65);font-size:.75vh}.audio-slide{display:grid;place-content:center;text-align:center}.audio-slide>div{font-size:5vh;color:var(--gold)}.audio-slide h2{margin:.5vh 0;color:var(--gold2);font-family:"Playfair Display",serif;font-size:2.4vh}.audio-slide p{margin:0;color:var(--muted);font-size:.75vh}.metric-column{display:grid;grid-template-rows:1fr 1fr .72fr;gap:.75vh;min-height:0}.metric-card{padding:.75vh .55vw}.metric-label{display:flex;align-items:center;justify-content:space-between;padding-bottom:.55vh;color:var(--gold);border-bottom:1px solid rgba(var(--gold-rgb),.12);font-size:.72vh;font-weight:900;letter-spacing:.08vw}.metric-core{height:calc(100% - 2vh);display:grid;grid-template-columns:5.8vh minmax(0,1fr);align-items:center;gap:.55vw}.countdown-ring{--progress:0deg;position:relative;width:5.7vh;height:5.7vh;display:grid;place-items:center;padding:1.35vh;color:var(--gold);border-radius:50%;background:conic-gradient(var(--accent) var(--progress),rgba(255,255,255,.08) 0);box-shadow:0 0 1.8vh rgba(var(--accent-rgb),.13)}.countdown-ring:before{content:"";position:absolute;inset:.28vh;border-radius:50%;background:var(--bg1)}.countdown-ring svg{position:relative}.iqamah-icon{width:5.7vh;height:5.7vh;padding:1.25vh;color:var(--accent);border:1px solid rgba(var(--accent-rgb),.25);border-radius:50%;background:rgba(var(--accent-rgb),.07)}.metric-core strong,.metric-core b,.metric-core small{display:block}.metric-core strong{font-size:2.55vh;line-height:1;font-weight:900;font-variant-numeric:tabular-nums;letter-spacing:-.08vh}.metric-core b{margin-top:.35vh;color:var(--gold);font-size:.78vh;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.metric-core small{margin-top:.15vh;color:var(--muted);font-size:.7vh}.officer-mini{display:grid;grid-template-columns:repeat(3,1fr);align-items:center;text-align:center;padding:.55vh .35vw}.officer-mini>div{min-width:0;padding:0 .18vw;border-right:1px solid rgba(var(--gold-rgb),.12)}.officer-mini>div:last-child{border-right:0}.officer-mini small,.officer-mini b{display:block}.officer-mini small{color:var(--accent);font-size:.6vh;font-weight:900;letter-spacing:.06vw}.officer-mini b{margin-top:.3vh;font-size:.76vh;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.bottom-info{display:grid;grid-template-columns:1fr 1fr .92fr;gap:.7vw;min-height:0}.info-card{display:grid;grid-template-rows:4.2vh minmax(0,1fr);padding:.35vh .5vw .45vh;min-height:0}.info-title{display:flex;align-items:center;gap:.45vw;padding:0 .15vw;border-bottom:1px solid rgba(var(--gold-rgb),.12)}.info-title>span{width:2.8vh;height:2.8vh;display:grid;place-items:center;color:var(--gold);border-radius:.7vh;background:rgba(var(--gold-rgb),.08);font-size:1.1vh}.info-title h3{margin:0;color:var(--gold2);font-family:"Playfair Display",serif;font-size:1.35vh}.info-list{display:grid;grid-template-rows:repeat(2,minmax(0,1fr));min-height:0;padding:.35vh .15vw}.info-item{display:flex;align-items:flex-start;gap:.42vw;min-height:0;padding:.35vh 0;border-bottom:1px dashed rgba(255,255,255,.08)}.info-item:last-child{border-bottom:0}.info-bullet{width:.5vh;height:.5vh;flex:0 0 auto;margin-top:.48vh;border-radius:50%;background:var(--gold);box-shadow:0 0 .75vh rgba(var(--gold-rgb),.35)}.info-item div{min-width:0}.info-item b,.info-item span{display:block}.info-item b{font-size:.92vh;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.info-item span{display:-webkit-box;margin-top:.15vh;color:var(--muted);font-size:.78vh;line-height:1.35;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.info-empty{display:grid;place-items:center;grid-row:1/-1;color:var(--muted);font-size:.82vh;text-align:center}.agenda-list .info-bullet{border-radius:1px;background:var(--accent)}.donation-content{display:grid;align-content:center;padding:.6vh .35vw;text-align:center}.donation-content small{color:var(--accent);font-size:.68vh;font-weight:900;letter-spacing:.07vw}.donation-content p{display:-webkit-box;margin:.55vh 0;color:#e8f5f0;font-size:.86vh;line-height:1.45;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.donation-content b{color:var(--gold);font-family:"Playfair Display",serif;font-size:1vh}.ticker-footer{display:grid;grid-template-columns:auto auto minmax(0,1fr);align-items:stretch;overflow:hidden;border:1px solid rgba(var(--gold-rgb),.34);border-radius:1vh;background:rgba(2,21,17,.94);box-shadow:0 -.6vh 2vh rgba(0,0,0,.16)}.ticker-label{display:flex;align-items:center;gap:.4vw;padding:0 1vw 0 .7vw;color:#17372e;background:linear-gradient(115deg,var(--gold2),var(--gold));clip-path:polygon(0 0,calc(100% - .8vw) 0,100% 50%,calc(100% - .8vw) 100%,0 100%)}.ticker-label svg{width:3.2vh;height:3.2vh}.ticker-label small,.ticker-label b{display:block;line-height:1}.ticker-label small{font-size:.48vh;font-weight:950;letter-spacing:.08vw}.ticker-label b{font-family:"Playfair Display",serif;font-size:.9vh}.footer-clock{display:grid;place-items:center;min-width:5vw;color:var(--accent);border-right:1px solid rgba(var(--gold-rgb),.18);background:rgba(var(--accent-rgb),.05);font-size:1.35vh;font-weight:900}.ticker-window{display:flex;align-items:center;overflow:hidden;white-space:nowrap}.ticker{display:inline-block;padding-left:100%;color:#effaf6;font-size:.93vh;font-weight:650;animation:ticker 30s linear infinite;will-change:transform}.boot-screen{position:fixed;z-index:100;inset:0;display:grid;place-items:center;overflow:hidden;background:radial-gradient(circle at 50% 0,rgba(var(--accent-rgb),.25),transparent 42%),linear-gradient(145deg,var(--bg0),var(--bg2) 55%,var(--bg0));transition:.45s}.boot-screen.hide{opacity:0;visibility:hidden}.boot-grid,.overlay-pattern{position:absolute;inset:-20%;opacity:.14;background-image:repeating-conic-gradient(from 0deg,rgba(var(--gold-rgb),.4) 0 4deg,transparent 4deg 20deg);mask-image:radial-gradient(circle,#000,transparent 64%);animation:rotate 90s linear infinite}.boot-card{position:relative;width:min(510px,90vw);padding:3.6vh 2.4vw 3vh;text-align:center;border:1px solid rgba(var(--gold-rgb),.42);border-radius:2.4vh;background:linear-gradient(145deg,rgba(8,51,42,.95),rgba(2,22,18,.97));box-shadow:0 4vh 10vh rgba(0,0,0,.58),inset 0 1px rgba(255,255,255,.05);backdrop-filter:blur(18px)}.boot-card:before{content:"";position:absolute;inset:.6vh;border:1px solid rgba(var(--gold-rgb),.09);border-radius:1.9vh;pointer-events:none}.boot-logo{width:8.5vh;height:8.5vh;margin:auto;padding:1.3vh;color:var(--gold);border:1px solid rgba(var(--gold-rgb),.44);border-radius:2vh;background:rgba(var(--gold-rgb),.07)}.boot-card>p{margin:1.2vh 0 .3vh;color:var(--accent);font-size:.8vh;font-weight:950;letter-spacing:.2vw}.boot-card h1{margin:0;color:var(--gold2);font-family:"Playfair Display",serif;font-size:3.2vh}.boot-card>span{display:block;max-width:40em;margin:.8vh auto 1.5vh;color:var(--muted);font-size:1.05vh;line-height:1.6}.boot-card label{display:block;text-align:left}.boot-card label small{display:block;margin-bottom:.45vh;color:#e2f0eb;font-size:.78vh;font-weight:750}.boot-card input{width:100%;padding:1.05vh .9vw;color:#fff;border:1px solid rgba(255,255,255,.14);border-radius:.9vh;outline:0;background:rgba(255,255,255,.05)}.boot-card input:focus{border-color:rgba(var(--accent-rgb),.58);box-shadow:0 0 0 3px rgba(var(--accent-rgb),.08)}.boot-card button{width:100%;display:flex;align-items:center;justify-content:space-between;margin-top:1vh;padding:1.1vh 1vw;color:#12372d;border:0;border-radius:.9vh;background:linear-gradient(110deg,var(--gold),var(--gold2));font-size:1vh;font-weight:950;cursor:pointer;box-shadow:0 1vh 2.8vh rgba(var(--gold-rgb),.15)}.boot-card button b{font-size:1.8vh}.boot-card em{display:block;margin-top:.8vh;color:#8ba79d;font-size:.65vh;font-style:normal}.overlay{position:fixed;z-index:90;inset:0;display:grid;place-items:center;overflow:hidden;opacity:0;visibility:hidden;background:radial-gradient(circle at center,rgba(var(--accent-rgb),.27),transparent 38%),linear-gradient(145deg,var(--bg0),var(--bg2) 60%,var(--bg0));transition:.45s}.overlay.show{opacity:1;visibility:visible}.overlay:after{content:"";position:absolute;inset:2vh;border:1px solid rgba(var(--gold-rgb),.18);border-radius:3vh}.overlay-content{position:relative;text-align:center}.overlay-emblem{width:11vh;height:11vh;display:grid;place-items:center;margin:auto;color:var(--gold);border:1px solid rgba(var(--gold-rgb),.35);border-radius:50%;font-size:5vh;box-shadow:0 0 5vh rgba(var(--gold-rgb),.14),0 0 0 1.8vh rgba(var(--gold-rgb),.025);animation:adhanPulse 2s infinite}.overlay-content p{margin:1.4vh 0 .2vh;color:var(--accent);font-size:1.45vh;font-weight:950;letter-spacing:.55vw}.adhan-overlay h2{margin:.4vh 0;color:var(--gold2);font-family:"Playfair Display",serif;font-size:10vh;letter-spacing:.7vw;text-shadow:0 .6vh 3vh rgba(var(--gold-rgb),.16)}#adhanTime{font-size:6.4vh;font-weight:950}.overlay-content>span{display:block;margin-top:1vh;color:#fff;font-family:serif;font-size:4vh}.overlay-content>small{display:block;margin-top:.4vh;color:var(--muted);font-size:1.35vh}.iqamah-circle{position:relative;width:32vh;height:32vh;display:grid;place-items:center;margin:2vh auto;border:1px solid rgba(var(--gold-rgb),.38);border-radius:50%;background:radial-gradient(circle,rgba(var(--accent-rgb),.18),transparent 65%);box-shadow:0 0 0 2vh rgba(var(--gold-rgb),.025),0 0 0 4vh rgba(var(--accent-rgb),.018)}.iqamah-circle:after{content:"";position:absolute;inset:-3vh;border:1px dashed rgba(var(--gold-rgb),.18);border-radius:50%;animation:rotate 25s linear infinite}.iqamah-circle h2{margin:0;font-size:9vh;letter-spacing:-.2vh}.iqamah-overlay .overlay-content>span{color:var(--gold2);font-family:Inter,sans-serif;font-size:2vh;font-weight:800}
body[data-period=evening] .tv-app{background:radial-gradient(circle at 82% 4%,rgba(244,167,81,.13),transparent 31%),radial-gradient(circle at 5% 100%,rgba(var(--gold-rgb),.11),transparent 35%),linear-gradient(115deg,rgba(1,12,10,.985),rgba(4,31,25,.96) 48%,rgba(1,13,11,.985)),var(--bg-image)}body[data-period=night] .tv-app{background:radial-gradient(circle at 84% -5%,rgba(72,105,191,.15),transparent 35%),radial-gradient(circle at 5% 100%,rgba(var(--gold-rgb),.08),transparent 34%),linear-gradient(115deg,rgba(1,8,12,.99),rgba(3,24,27,.96) 48%,rgba(1,9,12,.99)),var(--bg-image)}
@keyframes ticker{to{transform:translateX(-100%)}}@keyframes pulse{50%{opacity:.35;transform:scale(.72)}}@keyframes float{to{transform:translate3d(2vw,2vh,0) scale(1.06)}}@keyframes activeGlow{50%{filter:brightness(1.05);box-shadow:0 .8vh 2.1vh rgba(var(--gold-rgb),.23)}}@keyframes ornament{to{transform:translate(-50%,-50%) rotate(405deg)}}@keyframes rotate{to{transform:rotate(360deg)}}@keyframes adhanPulse{50%{transform:scale(1.05);box-shadow:0 0 7vh rgba(var(--gold-rgb),.23),0 0 0 2.4vh rgba(var(--gold-rgb),.02)}}
@media(max-aspect-ratio:4/3){.tv-header{grid-template-columns:44% 34% 22%}.date-box{display:none}.tv-main{grid-template-columns:43% 57%}.top-feature{grid-template-columns:minmax(0,1fr) 27%}.mosque-brand h1{font-size:3.1vh}.next-badge{display:none!important}.right-area{grid-template-rows:minmax(0,1fr) 20vh}.bottom-info{grid-template-columns:1fr 1fr}.donation-card{display:none}.metric-core{grid-template-columns:5vh minmax(0,1fr)}.metric-core strong{font-size:1.85vh}}
@media(max-width:900px){.tv-header{grid-template-columns:50% 38% 12%}.header-info .date-box,.online-pill span{display:none}.mosque-logo{width:7.2vh;height:7.2vh}.mosque-brand h1{font-size:3vh}.tv-main{grid-template-columns:44% 56%}.prayer-row{grid-template-columns:48% 26% 26%}.top-feature{grid-template-columns:minmax(0,1fr) 29%}.officer-mini{display:none}.metric-column{grid-template-rows:1fr 1fr}.right-area{grid-template-rows:minmax(0,1fr) 20vh}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.001ms!important;animation-iteration-count:1!important}}


/* =========================================================
   JAM MASJID v2.1 — PREMIUM READABILITY & RUNNING TEXT
   ========================================================= */
:root{--ticker-height:8.4vh}
.tv-app{
  grid-template-rows:13.3vh minmax(0,1fr) var(--ticker-height);
  gap:.9vh;
}
.glass{
  border-color:rgba(var(--gold-rgb),.34);
  box-shadow:0 1.3vh 3.8vh rgba(0,0,0,.27),inset 0 1px rgba(255,255,255,.055),inset 0 0 3vh rgba(var(--accent-rgb),.018);
}
.glass:after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(125deg,rgba(255,255,255,.025),transparent 28%,transparent 72%,rgba(var(--gold-rgb),.018));
}
.tv-header{position:relative}
.tv-header:after{
  content:"";
  position:absolute;
  left:12%;right:12%;bottom:-1px;height:1px;
  background:linear-gradient(90deg,transparent,var(--gold),var(--accent),var(--gold),transparent);
  opacity:.62;
  box-shadow:0 0 1.2vh rgba(var(--gold-rgb),.28);
}
.mosque-logo{
  box-shadow:0 0 3.2vh rgba(var(--gold-rgb),.13),0 1vh 2.5vh rgba(0,0,0,.22),inset 0 1px rgba(255,255,255,.08);
}
.main-clock{
  font-size:7.05vh;
  text-shadow:0 .55vh 2.2vh rgba(0,0,0,.42),0 0 2.2vh rgba(var(--accent-rgb),.07);
}
.prayer-section,.video-section,.info-card,.metric-card{isolation:isolate}
.prayer-row{border-bottom-color:rgba(255,255,255,.085)}
.prayer-name strong{font-weight:900;letter-spacing:.015em}
.prayer-time{font-size:1.72vh;text-shadow:0 .2vh .8vh rgba(0,0,0,.24)}
.prayer-row.next{
  border-color:rgba(255,229,160,.92);
  background:linear-gradient(100deg,#ffe9a5 0%,#e8bd62 58%,#cf9c3f 100%);
  box-shadow:0 .75vh 2.2vh rgba(var(--gold-rgb),.23),inset 0 1px rgba(255,255,255,.45);
}
.video-shell{
  border:2px solid rgba(var(--gold-rgb),.52);
  border-radius:1.15vh;
  box-shadow:0 1.5vh 3.5vh rgba(0,0,0,.38),0 0 2.2vh rgba(var(--gold-rgb),.08),inset 0 0 3.5vh rgba(0,0,0,.42);
}
.video-shell:before{
  content:"";
  position:absolute;
  z-index:3;
  inset:0;
  pointer-events:none;
  background:linear-gradient(135deg,rgba(255,255,255,.06),transparent 18%,transparent 82%,rgba(var(--gold-rgb),.045));
}
.video-shell:after{
  content:"";
  position:absolute;
  z-index:4;
  left:18%;right:18%;top:-1px;height:1px;
  pointer-events:none;
  background:linear-gradient(90deg,transparent,var(--gold2),var(--accent),var(--gold2),transparent);
  box-shadow:0 0 1.4vh rgba(var(--gold-rgb),.5);
}
.now-playing{padding-top:.65vh}
.now-playing b{font-size:1vh}
.info-title h3{font-size:1.46vh}
.info-item b{font-size:.98vh}
.info-item span{font-size:.83vh}

/* Running text diperbesar dan dibuat seperti lower-third televisi */
.ticker-footer{
  position:relative;
  min-height:58px;
  grid-template-columns:auto auto minmax(0,1fr);
  overflow:hidden;
  border:1px solid rgba(var(--gold-rgb),.62);
  border-radius:1.25vh;
  background:linear-gradient(180deg,rgba(6,43,35,.98),rgba(1,19,16,.99));
  box-shadow:0 -.75vh 2.6vh rgba(0,0,0,.25),0 0 2.5vh rgba(var(--gold-rgb),.055),inset 0 1px rgba(255,255,255,.07);
}
.ticker-footer:before{
  content:"";
  position:absolute;
  z-index:5;
  left:0;right:0;top:0;height:2px;
  background:linear-gradient(90deg,transparent,var(--gold),var(--accent),var(--gold),transparent);
  opacity:.8;
}
.ticker-label{
  position:relative;
  z-index:4;
  min-width:10.4vw;
  gap:.58vw;
  padding:0 1.35vw 0 .9vw;
  color:#12372e;
  background:linear-gradient(118deg,#fff0b5 0%,var(--gold2) 30%,var(--gold) 72%,#c68b2e 100%);
  filter:drop-shadow(.5vw 0 1.2vh rgba(0,0,0,.22));
}
.ticker-label svg{width:4.45vh;height:4.45vh;stroke-width:1.9}
.ticker-label small{
  font-size:clamp(10px,.82vh,16px);
  letter-spacing:.11vw;
}
.ticker-label b{
  margin-top:.16vh;
  font-size:clamp(15px,1.48vh,27px);
  letter-spacing:.025em;
}
.footer-clock{
  position:relative;
  z-index:3;
  min-width:7.2vw;
  padding:0 .8vw;
  color:var(--gold2);
  border-right:1px solid rgba(var(--gold-rgb),.28);
  background:linear-gradient(90deg,rgba(var(--accent-rgb),.12),rgba(var(--accent-rgb),.035));
  font-size:clamp(21px,2.18vh,40px);
  font-weight:950;
  letter-spacing:.02em;
  text-shadow:0 0 1.4vh rgba(var(--accent-rgb),.25);
  font-variant-numeric:tabular-nums;
}
.footer-clock:after{
  content:"";
  position:absolute;
  right:-1px;top:20%;bottom:20%;width:1px;
  background:linear-gradient(transparent,var(--gold),transparent);
}
.ticker-window{
  position:relative;
  z-index:2;
  padding:0 .7vw;
  background:radial-gradient(circle at 50% 150%,rgba(var(--accent-rgb),.11),transparent 60%);
}
.ticker-window:before,.ticker-window:after{
  content:"";
  position:absolute;
  z-index:2;
  top:0;bottom:0;
  width:4vw;
  pointer-events:none;
}
.ticker-window:before{left:0;background:linear-gradient(90deg,rgba(2,25,21,.98),transparent)}
.ticker-window:after{right:0;background:linear-gradient(270deg,rgba(2,25,21,.98),transparent)}
.ticker{
  position:relative;
  z-index:1;
  padding-left:100%;
  color:#ffffff;
  font-size:clamp(18px,1.78vh,34px);
  font-weight:800;
  line-height:1;
  letter-spacing:.012em;
  text-shadow:0 .18vh .8vh rgba(0,0,0,.7),0 0 1.2vh rgba(var(--accent-rgb),.08);
  animation-name:tickerPremium;
  animation-timing-function:linear;
  animation-iteration-count:infinite;
  will-change:transform;
}
@keyframes tickerPremium{to{transform:translateX(-100%)}}

@media(max-height:760px){
  :root{--ticker-height:8.8vh}
  .ticker{font-size:clamp(17px,1.9vh,28px)}
  .ticker-label svg{width:4vh;height:4vh}
}
@media(max-aspect-ratio:4/3){
  .ticker-label{min-width:13vw}
  .footer-clock{min-width:8.5vw}
  .ticker{font-size:clamp(17px,1.65vh,29px)}
}


/* =========================================================
   JAM MASJID v2.2 — SUPER PREMIUM THEMES & EXTRA LARGE TEXT
   ========================================================= */
:root{
  --tv-text-scale:1.08;
  --ticker-height:10.2vh;
  --ticker-font-size:clamp(26px,2.7vh,52px);
  --ticker-label-size:clamp(17px,1.62vh,31px);
  --ticker-clock-size:clamp(27px,2.55vh,48px);
}
body[data-text-size="large"]{--tv-text-scale:1}
body[data-text-size="xlarge"]{--tv-text-scale:1.08}
body[data-text-size="jumbo"]{--tv-text-scale:1.16}
body[data-ticker-size="large"]{--ticker-height:8.9vh;--ticker-font-size:clamp(22px,2.15vh,40px);--ticker-label-size:clamp(15px,1.38vh,27px);--ticker-clock-size:clamp(24px,2.2vh,42px)}
body[data-ticker-size="xlarge"]{--ticker-height:9.6vh;--ticker-font-size:clamp(24px,2.42vh,46px);--ticker-label-size:clamp(16px,1.5vh,29px);--ticker-clock-size:clamp(26px,2.4vh,45px)}
body[data-ticker-size="jumbo"]{--ticker-height:10.2vh;--ticker-font-size:clamp(27px,2.72vh,52px);--ticker-label-size:clamp(18px,1.66vh,32px);--ticker-clock-size:clamp(28px,2.62vh,49px)}
body[data-ticker-size="super"]{--ticker-height:11.2vh;--ticker-font-size:clamp(30px,3.05vh,59px);--ticker-label-size:clamp(19px,1.82vh,35px);--ticker-clock-size:clamp(30px,2.9vh,54px)}

/* Tema tambahan */
body[data-theme="royal"]{--bg0:#010b08;--bg1:#06271f;--bg2:#0b4737;--panel:rgba(3,31,24,.91);--panel2:rgba(6,52,40,.78);--accent:#31e0a4;--accent-rgb:49,224,164;--gold:#e9bd5d;--gold2:#fff0b4;--gold-rgb:233,189,93;--muted:#a8c9bd}
body[data-theme="midnight"]{--bg0:#01050e;--bg1:#07172e;--bg2:#102f59;--panel:rgba(4,16,36,.92);--panel2:rgba(10,41,75,.78);--accent:#62d7ff;--accent-rgb:98,215,255;--gold:#e5c879;--gold2:#fff0b4;--gold-rgb:229,200,121;--muted:#a8bfd7}
body[data-theme="blackgold"]{--bg0:#050402;--bg1:#171207;--bg2:#30230b;--panel:rgba(17,13,5,.94);--panel2:rgba(43,31,8,.82);--accent:#ffd46a;--accent-rgb:255,212,106;--gold:#f2c45f;--gold2:#fff0ad;--gold-rgb:242,196,95;--muted:#d1c49f}
body[data-theme="purple"]{--bg0:#090311;--bg1:#211039;--bg2:#3b1c61;--panel:rgba(28,10,48,.92);--panel2:rgba(56,24,86,.80);--accent:#cf8cff;--accent-rgb:207,140,255;--gold:#ebc777;--gold2:#fff0b9;--gold-rgb:235,199,119;--muted:#cbb8d8}
body[data-theme="turquoise"]{--bg0:#010d10;--bg1:#042a30;--bg2:#07505a;--panel:rgba(2,34,39,.92);--panel2:rgba(4,59,65,.80);--accent:#4ee9df;--accent-rgb:78,233,223;--gold:#e8c776;--gold2:#fff2ba;--gold-rgb:232,199,118;--muted:#a8cdd0}

.tv-app{
  grid-template-rows:13.8vh minmax(0,1fr) var(--ticker-height);
  gap:.95vh;
  padding:1.05vh 1vw;
  background:
    radial-gradient(circle at 84% -8%,rgba(var(--accent-rgb),.22),transparent 32%),
    radial-gradient(circle at 4% 105%,rgba(var(--gold-rgb),.14),transparent 35%),
    linear-gradient(115deg,rgba(1,10,9,.985),rgba(4,30,25,.955) 48%,rgba(1,11,10,.985)),
    var(--bg-image);
  background-size:cover;
  background-position:center;
}
.glass{border-width:1px;border-color:rgba(var(--gold-rgb),.40);box-shadow:0 1.4vh 4vh rgba(0,0,0,.31),0 0 2.6vh rgba(var(--accent-rgb),.025),inset 0 1px rgba(255,255,255,.07)}
.mosque-logo{width:9.1vh;height:9.1vh}
.mosque-brand small{font-size:calc(.93vh * var(--tv-text-scale))}
.mosque-brand h1{font-size:calc(3.95vh * var(--tv-text-scale));letter-spacing:.005em}
.mosque-brand p{font-size:calc(1.16vh * var(--tv-text-scale));font-weight:600}
.main-clock{font-size:calc(7.15vh * var(--tv-text-scale));letter-spacing:-.2vh}
.main-clock span{font-size:calc(3.35vh * var(--tv-text-scale))}
.clock-day{font-size:calc(.82vh * var(--tv-text-scale));font-weight:800}
.date-box b{font-size:calc(1.16vh * var(--tv-text-scale))}
.date-box span{font-size:calc(1.01vh * var(--tv-text-scale))}
.online-pill{font-size:calc(.82vh * var(--tv-text-scale))}
.section-title small{font-size:calc(.88vh * var(--tv-text-scale))}
.section-title h2{font-size:calc(2.28vh * var(--tv-text-scale))}
.section-title>b{font-size:calc(.86vh * var(--tv-text-scale))}
.prayer-head{font-size:calc(.96vh * var(--tv-text-scale));letter-spacing:.09vw}
.prayer-name strong{font-size:calc(1.58vh * var(--tv-text-scale));line-height:1.03}
.prayer-name small{font-size:calc(.79vh * var(--tv-text-scale));font-weight:650}
.prayer-time{font-size:calc(1.88vh * var(--tv-text-scale));font-weight:900}
.next-badge{font-size:calc(.70vh * var(--tv-text-scale))}
.daily-message small{font-size:calc(.68vh * var(--tv-text-scale));font-weight:900}
.daily-message b{font-size:calc(.94vh * var(--tv-text-scale));line-height:1.25}
.media-title h2{font-size:calc(1.82vh * var(--tv-text-scale))}
.live-badge{font-size:calc(.78vh * var(--tv-text-scale))}
.now-playing span{font-size:calc(.72vh * var(--tv-text-scale));font-weight:900}
.now-playing b{font-size:calc(1.08vh * var(--tv-text-scale));font-weight:850}
.metric-label{font-size:calc(.80vh * var(--tv-text-scale))}
.metric-core strong{font-size:calc(2.64vh * var(--tv-text-scale))}
.metric-core b{font-size:calc(.84vh * var(--tv-text-scale))}
.metric-core small{font-size:calc(.68vh * var(--tv-text-scale))}
.officer-mini small{font-size:calc(.65vh * var(--tv-text-scale))}
.officer-mini b{font-size:calc(.83vh * var(--tv-text-scale))}
.info-title h3{font-size:calc(1.5vh * var(--tv-text-scale))}
.info-item b{font-size:calc(1.02vh * var(--tv-text-scale))}
.info-item span{font-size:calc(.86vh * var(--tv-text-scale));line-height:1.32}
.info-empty{font-size:calc(.9vh * var(--tv-text-scale))}
.donation-content small{font-size:calc(.73vh * var(--tv-text-scale))}
.donation-content p{font-size:calc(.92vh * var(--tv-text-scale))}
.donation-content b{font-size:calc(1.08vh * var(--tv-text-scale))}

/* Footer running text lebih besar dan lebih jelas */
.ticker-footer{min-height:68px;border-width:2px;border-color:rgba(var(--gold-rgb),.72);border-radius:1.35vh;background:linear-gradient(180deg,rgba(6,43,35,.99),rgba(1,15,13,.995));box-shadow:0 -.8vh 3vh rgba(0,0,0,.32),0 0 3vh rgba(var(--gold-rgb),.08),inset 0 1px rgba(255,255,255,.09)}
.ticker-label{min-width:11.3vw;padding:0 1.45vw 0 1vw}
.ticker-label svg{width:4.9vh;height:4.9vh}
.ticker-label small{font-size:clamp(11px,.92vh,18px)}
.ticker-label b{font-size:var(--ticker-label-size);font-weight:900}
.footer-clock{min-width:8vw;font-size:var(--ticker-clock-size)}
.ticker{font-size:var(--ticker-font-size);font-weight:900;letter-spacing:.016em;text-shadow:0 .22vh 1vh rgba(0,0,0,.82),0 0 1.6vh rgba(var(--accent-rgb),.12)}
.ticker-window{padding:0 .9vw}
.video-shell{border-width:2px;border-color:rgba(var(--gold-rgb),.64);box-shadow:0 1.7vh 4.2vh rgba(0,0,0,.43),0 0 2.8vh rgba(var(--gold-rgb),.10),inset 0 0 4vh rgba(0,0,0,.46)}

@media(max-height:760px){
  .tv-app{grid-template-rows:13.5vh minmax(0,1fr) var(--ticker-height)}
  .ticker{font-size:var(--ticker-font-size)}
  .prayer-name strong{font-size:calc(1.48vh * var(--tv-text-scale))}
  .prayer-time{font-size:calc(1.76vh * var(--tv-text-scale))}
}
@media(max-aspect-ratio:4/3){
  .ticker-label{min-width:14vw}
  .footer-clock{min-width:9.3vw}
  .ticker{font-size:var(--ticker-font-size)}
}