*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#06130f;color:#f7fbf9}.stage{position:relative;width:100vw;height:100vh;background-size:cover;background-position:center;display:grid;grid-template-rows:14vh 1fr 6vh;overflow:hidden}.stage:before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px);background-size:4vw 4vw;mask-image:linear-gradient(to bottom,black,transparent 70%)}.ornament{position:absolute;width:24vw;height:24vw;border:1px solid rgba(233,185,73,.10);transform:rotate(45deg);border-radius:3vw;pointer-events:none}.ornament:after,.ornament:before{content:"";position:absolute;inset:12%;border:1px solid rgba(233,185,73,.08);border-radius:2vw}.ornament:after{inset:26%}.ornament-a{right:-12vw;top:-14vw}.ornament-b{left:-16vw;bottom:-18vw}
header{position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;padding:1.8vh 3vw;border-bottom:1px solid rgba(255,255,255,.08);background:linear-gradient(90deg,rgba(4,22,18,.78),rgba(5,29,24,.44));backdrop-filter:blur(12px)}.brand{display:flex;align-items:center;gap:1vw;min-width:0}.logo-shell{width:4.8vw;height:4.8vw;border-radius:1.15vw;padding:.45vw;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);display:grid;place-items:center}.logo{max-width:100%;max-height:100%;object-fit:contain}.brand-copy{min-width:0}.kicker{font-size:.66vw;font-weight:800;letter-spacing:.22em;color:var(--accent);opacity:.95}h1{font-size:2.35vw;line-height:1.05;margin:.35vh 0 .3vh;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:55vw}.address{font-size:.88vw;color:rgba(238,248,244,.68);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:52vw}.timebox{text-align:right}.clock{font-size:3.45vw;font-weight:800;line-height:.95;letter-spacing:-.04em;font-variant-numeric:tabular-nums}.date{margin-top:.65vh;font-size:.82vw;color:rgba(238,248,244,.72)}
main{position:relative;z-index:1;min-height:0;padding:2vh 3vw 1.55vh;display:grid;grid-template-rows:minmax(0,1fr) 12vh;gap:1.5vh}.content-grid{min-height:0;display:grid;grid-template-columns:27% minmax(0,1fr);gap:1.3vw}.next-card,.slider-shell{border:1px solid rgba(255,255,255,.11);background:linear-gradient(145deg,rgba(18,62,51,.68),rgba(5,25,21,.72));box-shadow:0 18px 60px rgba(0,0,0,.2);backdrop-filter:blur(13px)}.next-card{border-radius:1.35vw;padding:3.1vh 2vw;display:flex;flex-direction:column;justify-content:center;overflow:hidden;position:relative}.next-card:after{content:"";position:absolute;width:12vw;height:12vw;border-radius:50%;right:-6vw;bottom:-5vw;background:var(--primary);filter:blur(25px);opacity:.2}.next-label{font-size:.7vw;letter-spacing:.16em;font-weight:800;color:rgba(239,248,244,.62);display:flex;align-items:center;gap:.5vw}.next-label span{width:.45vw;height:.45vw;border-radius:50%;background:var(--accent);box-shadow:0 0 12px var(--accent)}.next-prayer{font-size:4vw;font-weight:850;line-height:1;margin:2vh 0 .5vh}.next-time{font-size:1.35vw;font-weight:650;color:var(--accent)}.divider{height:1px;background:linear-gradient(90deg,rgba(255,255,255,.18),transparent);margin:3vh 0 2.4vh}.count-label{font-size:.67vw;letter-spacing:.14em;color:rgba(239,248,244,.55);font-weight:750}.countdown{font-size:3.1vw;line-height:1.05;font-weight:800;margin-top:.7vh;font-variant-numeric:tabular-nums;letter-spacing:-.04em}.mini-note{font-size:.75vw;color:rgba(239,248,244,.5);margin-top:1.4vh}.slider-shell{position:relative;border-radius:1.35vw;overflow:hidden;padding:.42vw}.slider{position:relative;width:100%;height:100%;border-radius:1vw;overflow:hidden;background:#081a16}.slide,.slide img,.slide video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.media-label{position:absolute;z-index:8;left:1.35vw;top:1.35vw;background:rgba(4,20,17,.7);border:1px solid rgba(255,255,255,.12);backdrop-filter:blur(8px);padding:.48vh .65vw;border-radius:999px;font-size:.58vw;font-weight:850;letter-spacing:.12em;color:rgba(255,255,255,.82)}.empty-slide{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.5vh;background:radial-gradient(circle at 50% 35%,rgba(35,111,87,.35),transparent 48%);font-size:1.65vw}.empty-slide small{font-size:.8vw;color:rgba(255,255,255,.55)}.crescent{font-size:4.5vw;color:var(--accent);margin-bottom:.8vh}
.prayers{display:grid;grid-template-columns:repeat(6,1fr);gap:.65vw}.prayer-card{position:relative;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;padding:1.15vh 1vw;border-radius:.85vw;background:rgba(13,47,39,.72);border:1px solid rgba(255,255,255,.08);overflow:hidden}.prayer-card:before{content:"";position:absolute;left:0;top:22%;bottom:22%;width:.18vw;border-radius:2px;background:rgba(255,255,255,.16)}.prayer-card.active{background:linear-gradient(135deg,rgba(31,106,78,.92),rgba(19,66,54,.92));border-color:rgba(233,185,73,.35);box-shadow:0 8px 24px rgba(0,0,0,.18)}.prayer-card.active:before{background:var(--accent)}.prayer-name{font-size:.73vw;text-transform:uppercase;letter-spacing:.08em;color:rgba(242,249,246,.62);font-weight:800}.prayer-time{font-size:1.65vw;font-weight:850;margin-top:.25vh;font-variant-numeric:tabular-nums}.prayer-card.active .prayer-name{color:var(--accent)}
footer{position:relative;z-index:2;display:flex;align-items:center;overflow:hidden;background:rgba(3,16,13,.88);border-top:1px solid rgba(255,255,255,.07)}.ticker-label{height:100%;padding:0 1.4vw;display:flex;align-items:center;gap:.55vw;background:var(--primary);font-size:.72vw;font-weight:900;letter-spacing:.12em}.ticker-label span{font-size:.55vw;color:var(--accent)}.ticker-wrap{overflow:hidden;white-space:nowrap;width:100%}.ticker{display:inline-block;padding-left:100%;animation:ticker 30s linear infinite;font-size:1vw}@keyframes ticker{to{transform:translateX(-100%)}}
.overlay-screen{position:fixed;inset:0;z-index:100;display:flex;align-items:center;justify-content:center;text-align:center;background:radial-gradient(circle at center,#174b3c,#020806 76%)}.overlay-screen.hidden{display:none}.overlay-content .small{font-size:2vw;opacity:.75}.overlay-content .big{font-size:8vw;font-weight:900;margin:1vh 0;color:var(--accent)}.overlay-content .arabic{font-size:3vw}.countdown-big{font-variant-numeric:tabular-nums}
