/* One continuous composition: clock and next prayer above the solar arc. */
.tv-stage .tv-content{grid-template-rows:82px minmax(430px,1fr) 215px 40px;gap:18px}
.tv-header{border:0}
.day-overview{min-height:0;display:flex;flex-direction:column;justify-content:center;gap:0}
.day-overview .hero{height:190px;min-height:0;flex-shrink:0;align-items:flex-start;padding-top:12px}
.day-overview .clock{font-size:166px}
.day-overview .next{padding-top:8px}
.day-overview .next h2{font-size:66px;margin:10px 0}
.day-overview .solar-cycle{height:220px;flex-shrink:0;padding:0;border:0;border-radius:0;background:none;overflow:visible}
.solar-heading{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip-path:inset(50%);white-space:nowrap;pointer-events:none}
.day-overview .solar-chart{height:100%}
.solar-night-ground{display:none}
.solar-horizon{stroke-opacity:.18}
.solar-leader{stroke-opacity:.12}
.cards{gap:0;border:0;background:none}
.card{border:0;border-right:1px solid #ffffff13;border-radius:0;background:none;padding:20px 24px 10px}
.card:last-child{border-right:0}
.card.active{background:linear-gradient(180deg,#d6b67509,transparent);border:0;border-right:1px solid #ffffff13;border-radius:0}
.card.active .time{color:var(--gold)}
.card.active:after{top:0;right:24px;font-size:13px;letter-spacing:.03em}
.card .ar{margin-bottom:12px}
.jamaah{border-top-color:#ffffff13}
.tv-bottom{border:0}
.tv-stage[data-orientation=portrait] .tv-content{grid-template-rows:135px minmax(560px,1fr) 500px 50px}
.tv-stage[data-orientation=portrait] .day-overview .hero{height:250px;padding-top:0}
.tv-stage[data-orientation=portrait] .day-overview .solar-cycle{height:300px}
.tv-stage[data-orientation=portrait] .day-overview .clock{font-size:142px}
.tv-stage[data-orientation=portrait] .day-overview .next h2{font-size:49px}
.tv-stage[data-orientation=portrait] .card{padding-top:24px}
.tv-stage[data-orientation=portrait] .card:nth-child(3){border-right:0}
.calculation-info{border:0;border-bottom:1px solid var(--line);border-radius:0;padding:15px 0}

/* The same composition at phone size: no panels around the hero or sun. */
html[data-view=mobile] body{background:#0c2233}
html[data-view=mobile] .tv-screen{background:radial-gradient(ellipse at 0 0,#28567535,transparent 80%)}
html[data-view=mobile] .tv-stage .tv-content{display:flex;gap:17px;padding:19px max(16px,env(safe-area-inset-left)) 25px}
html[data-view=mobile] .tv-stage .tv-header{gap:11px;padding-bottom:0}
html[data-view=mobile] .tv-stage .brand{gap:10px}
html[data-view=mobile] .tv-stage .prayer-signature{height:40px}
html[data-view=mobile] .tv-stage .salah-mark{font-size:25px}
html[data-view=mobile] .tv-stage h1{font-size:25px;margin-top:3px}
html[data-view=mobile] .tv-stage .eyebrow{font-size:9px}
html[data-view=mobile] .tv-stage .date{font-size:11px;line-height:1.65}
html[data-view=mobile] .tv-stage #hijriDate{font-size:11px}
html[data-view=mobile] .tv-stage .day-overview{order:1;display:block;min-height:0}
html[data-view=mobile] .tv-stage .day-overview .hero{position:static;display:flex;flex-direction:row;justify-content:space-between;align-items:flex-start;gap:10px;min-height:0;height:98px;padding:8px 0 0;border:0;border-radius:0;background:none;box-shadow:none}
html[data-view=mobile] .tv-stage .day-overview .clock{position:static;top:auto;right:auto;font:clamp(58px,16.5vw,79px)/1 Arial,sans-serif;letter-spacing:-.065em;color:var(--ink);white-space:nowrap}
html[data-view=mobile] .tv-stage .day-overview .clock:before{content:none}
html[data-view=mobile] .tv-stage .day-overview .clock span{display:inline;font-size:19px;letter-spacing:-.01em;margin-left:5px;color:var(--muted)}
html[data-view=mobile] .tv-stage .day-overview .next{display:block;width:auto;padding:0;min-width:0;text-align:right;border:0}
html[data-view=mobile] .tv-stage .day-overview .next .eyebrow{font-size:9px;letter-spacing:.1em;padding:0}
html[data-view=mobile] .tv-stage .day-overview .next h2{font-size:clamp(22px,6.6vw,29px);line-height:1.2;margin:7px 0 5px;white-space:nowrap}
html[data-view=mobile] .tv-stage .day-overview .countdown{font-size:12px;letter-spacing:0;white-space:nowrap}
html[data-view=mobile] .tv-stage .day-overview .solar-cycle{order:initial;height:179px;width:100%;margin:0;padding:0;border:0;border-radius:0;background:none;overflow:visible}
html[data-view=mobile] .tv-stage .day-overview .solar-chart{height:100%}
html[data-view=mobile] .tv-stage .solar-prayer-name{font-size:12px}
html[data-view=mobile] .tv-stage .solar-sunrise-name{font-size:11px}
html[data-view=mobile] .tv-stage .solar-prayer-time{font-size:12px}
html[data-view=mobile] .tv-stage .cards{order:2;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;overflow:visible;border:0;border-radius:0;background:none;margin:0}
html[data-view=mobile] .tv-stage .card{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:6px;position:relative;text-align:center;min-height:116px;padding:11px 4px 12px;border:0;border-right:1px solid #ffffff12;border-radius:0;background:none;box-shadow:none}
html[data-view=mobile] .tv-stage .card:nth-child(3n){border-right:0}
html[data-view=mobile] .tv-stage .card:nth-child(-n+3){border-bottom:1px solid #ffffff12}
html[data-view=mobile] .tv-stage .card .ar{font-size:23px;line-height:1.1;margin:0;color:#a9bac6;order:0}
html[data-view=mobile] .tv-stage .card .name{font-size:12px;line-height:1.2;color:var(--muted);order:1}
html[data-view=mobile] .tv-stage .card .time{font-size:31px;line-height:1.1;letter-spacing:-.035em;margin:0;color:var(--ink);order:2}
html[data-view=mobile] .tv-stage .card.active{background:radial-gradient(ellipse at 50% 50%,#d6b6750a,transparent 75%);border-right:1px solid #ffffff12;box-shadow:none}
html[data-view=mobile] .tv-stage .card.active:nth-child(3n){border-right:0}
html[data-view=mobile] .tv-stage .card.active .time,html[data-view=mobile] .tv-stage .card.active .ar{color:var(--gold)}
html[data-view=mobile] .tv-stage .card.active .name:after{display:none}
html[data-view=mobile] .tv-stage .card.active:after{display:none}
html[data-view=mobile] .tv-stage .jamaah{order:3;justify-content:center;flex-wrap:nowrap;gap:5px;margin:1px 0 0;padding:0;border:0;line-height:1.3;font-size:9px;white-space:nowrap;color:var(--gold)}
html[data-view=mobile] .tv-stage .tv-bottom{order:3;margin:0;padding-top:0}
html[data-view=mobile] .tv-stage .friday{justify-content:center;align-items:baseline;gap:13px;background:none;border:0;border-radius:0;padding:9px 0}
html[data-view=mobile] .tv-stage .friday h2{font:21px Georgia,serif}
html[data-view=mobile] .tv-stage .friday strong{font-size:23px}
html[data-view=mobile] .lower>div{background:none;border:0;border-radius:0;padding:15px 0}
html[data-view=mobile] .calculation-info{background:none;border:0;border-bottom:1px solid var(--line);border-radius:0;padding:12px 0}
html[data-view=mobile] .mobile-nav{background:#0c2233f5}
@media(max-width:360px){
 html[data-view=mobile] .tv-stage .tv-content{padding-left:13px;padding-right:13px}
 html[data-view=mobile] .tv-stage .day-overview .clock{font-size:57px}
 html[data-view=mobile] .tv-stage .day-overview .clock span{font-size:16px}
 html[data-view=mobile] .tv-stage .day-overview .next h2{font-size:22px}
 html[data-view=mobile] .tv-stage .card .time{font-size:28px}
 html[data-view=mobile] .tv-stage .card .ar{font-size:21px}
 html[data-view=mobile] .tv-stage .solar-prayer-name,html[data-view=mobile] .tv-stage .solar-prayer-time{font-size:11px}
 html[data-view=mobile] .tv-stage .solar-sunrise-name{font-size:10px}
}
/* Keep the whole clock / solar / timetable composition together on tall TVs. */
.tv-stage .tv-content{display:flex;flex-direction:column;gap:18px}
.tv-stage .tv-header{flex:0 0 82px;height:82px;min-height:0}
.board-content{flex:1;min-height:0;display:flex;flex-direction:column;justify-content:center;gap:18px}
.board-content .day-overview{height:410px;flex-shrink:0}
.board-content .cards{height:215px;flex-shrink:0}
.board-content .tv-bottom{height:40px;flex-shrink:0}
.tv-stage[data-orientation=portrait] .tv-header{flex-basis:135px;height:135px}
.tv-stage[data-orientation=portrait] .board-content .day-overview{height:550px}
.tv-stage[data-orientation=portrait] .board-content .cards{height:500px}
.tv-stage[data-orientation=portrait] .board-content .tv-bottom{height:50px}
html[data-view=mobile] .tv-stage .tv-header{flex:initial;height:auto}
html[data-view=mobile] .board-content{display:contents}
html[data-view=mobile] .tv-stage .board-content .day-overview,html[data-view=mobile] .tv-stage .board-content .cards,html[data-view=mobile] .tv-stage .board-content .tv-bottom{height:auto;flex-shrink:initial}

/* Arabic prayer mark above a plain Norwegian place name. */
.brand .prayer-signature{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;text-decoration:none}
.brand .salah-mark{display:block;line-height:1.05}
.logo-place{display:block;font:400 20px/1.1 Arial,Helvetica,sans-serif;letter-spacing:.1em;color:var(--gold)}
html[data-view=mobile] .tv-stage .prayer-signature{height:52px;width:54px;gap:3px}
html[data-view=mobile] .tv-stage .logo-place{font-size:12px;letter-spacing:.1em}