:root{--accent:#ffd98a;--text:#f8fcff;--muted:#c9e9ff;--glass:rgba(0,28,67,.26);--line:rgba(255,255,255,.22);--bg1:#087fd2;--bg2:#004f9b}*{box-sizing:border-box}html,body{width:100%;height:100%;margin:0;overflow:hidden;background:#045da9;color:var(--text)}body{font-family:Georgia,"Times New Roman",serif}.screen{position:relative;isolation:isolate;width:100%;height:100svh;min-height:100svh;display:grid;grid-template-rows:auto auto auto 1fr auto auto auto;padding:clamp(13px,2.6vh,38px) clamp(14px,3.5vw,50px) clamp(10px,1.8vh,26px);background:radial-gradient(circle at 50% -15%,rgba(89,204,255,.5),transparent 42%),linear-gradient(160deg,var(--bg1),var(--bg2));text-shadow:0 2px 4px rgba(0,40,85,.55);transition:background 1s}.ambient{position:absolute;inset:0;z-index:-1;opacity:.16;background-image:repeating-radial-gradient(circle at 0 0,transparent 0 18px,rgba(255,255,255,.45) 19px 20px),repeating-radial-gradient(circle at 100% 100%,transparent 0 28px,rgba(255,255,255,.3) 29px 30px);background-size:86px 86px,118px 118px}.screen.custom-bg{background-position:center;background-size:cover}.screen.custom-bg:after{content:"";position:absolute;inset:0;z-index:-1;background:rgba(0,28,55,.52)}button,input,select,textarea{font:inherit}.topbar{display:grid;grid-template-columns:auto auto 1fr auto;align-items:start;gap:clamp(8px,2vw,22px);font-family:Arial,sans-serif}.icon-btn{width:44px;height:44px;padding:0;border:1px solid var(--line);border-radius:12px;background:var(--glass);color:#fff;font-size:25px;cursor:pointer}.weather{display:flex;flex-direction:column;font-size:clamp(12px,1.5vh,18px);color:var(--muted)}.weather strong{font-size:clamp(19px,2.7vh,34px);color:#fff}.dates{text-align:center;line-height:1.2;font-size:clamp(16px,2.2vh,28px)}.dates>*{display:block}.dates span{margin-top:.25em;color:var(--muted)}.hero{position:relative;text-align:center}.mosque{font-size:clamp(17px,2.4vh,32px);margin:.35em 0}.clockline{display:flex;justify-content:center;align-items:flex-start;font-family:Arial,sans-serif;font-variant-numeric:tabular-nums}.clockline #clock{font-size:clamp(68px,12vh,156px);line-height:.9;font-weight:800;letter-spacing:.025em}.clockline #seconds{font-size:clamp(20px,3.8vh,48px);font-weight:700;margin:.08em 0 0 .24em}.clockline #ampm{font-size:clamp(13px,2vh,25px);margin:.4em 0 0 .25em}.next-card{position:absolute;right:0;top:45%;transform:translateY(-50%);display:flex;flex-direction:column;min-width:clamp(95px,16vw,210px);padding:.65em .8em;border:1px solid rgba(255,217,138,.48);border-radius:50%;background:rgba(0,39,86,.28);font-family:Arial,sans-serif}.next-card span,.next-card small{font-size:clamp(10px,1.5vh,18px);color:var(--muted)}.next-card strong{font-size:clamp(22px,4vh,50px);color:var(--accent);font-variant-numeric:tabular-nums}.verse{text-align:center;direction:rtl;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:clamp(19px,2.8vh,38px);line-height:1.45;color:var(--accent);padding:.25em}.prayer-table{align-self:center;width:100%;max-width:1000px;margin:auto}.prayer-head,.row{display:grid;grid-template-columns:1.3fr 1fr 1fr;align-items:center}.prayer-head{padding:0 .5em .35em;border-bottom:1px solid var(--line);font:clamp(12px,1.5vh,18px) Arial,sans-serif;text-transform:uppercase;letter-spacing:.13em;color:var(--muted)}.prayer-head span:nth-child(n+2){text-align:center}.row{min-height:clamp(42px,6.2vh,78px);padding:0 .5em;border-bottom:1px solid var(--line);transition:.35s}.row.past{opacity:.38}.row.active{opacity:1;margin:.2em -.5em;padding:0 1em;border:1px solid rgba(255,217,138,.6);border-radius:12px;background:rgba(0,35,80,.3);box-shadow:0 5px 22px rgba(0,35,78,.2)}.name{font-size:clamp(20px,3.3vh,43px);font-weight:700}.arabic-name{display:block;font:500 .45em Arial,sans-serif;color:var(--muted)}.time,.iqama{text-align:center;font:800 clamp(24px,4vh,52px) Arial,sans-serif;letter-spacing:.045em;font-variant-numeric:tabular-nums}.iqama{color:#fff0bd}.sunrise .iqama{font-size:clamp(13px,1.8vh,22px);font-weight:500;color:var(--muted)}.extras{display:flex;justify-content:center;gap:clamp(8px,4vw,55px);margin-top:.5em;font-family:Arial,sans-serif}.extras div{display:flex;gap:.6em;align-items:center}.extras span{font-size:clamp(11px,1.45vh,18px);color:var(--muted)}.extras strong{font-size:clamp(14px,1.9vh,24px);color:var(--accent)}.dhikr{text-align:center;direction:rtl;font-size:clamp(15px,2vh,25px);min-height:1.4em;color:var(--accent);padding:.25em}footer{text-align:center;font-family:Arial,sans-serif;font-size:clamp(11px,1.45vh,18px);color:var(--muted)}.ticker{overflow:hidden;white-space:nowrap;border-top:1px solid var(--line);padding-top:.45em}.ticker span{display:inline-block;min-width:100%;animation:ticker 24s linear infinite}.hadith{direction:rtl;margin-top:.35em}@keyframes ticker{from{transform:translateX(100%)}to{transform:translateX(-100%)}}.no-data{display:none;align-self:center;text-align:center;font:clamp(22px,4vh,50px) Arial,sans-serif;padding:1em;border:1px solid var(--line);border-radius:18px;background:var(--glass)}.prayer-overlay{display:none;position:fixed;inset:0;z-index:5;align-items:center;justify-content:center;flex-direction:column;background:#030b13;color:white;text-align:center;font-family:Arial,sans-serif}.prayer-overlay.show{display:flex}.prayer-overlay span{font-size:clamp(24px,4vw,55px);color:var(--muted)}.prayer-overlay strong{font-size:clamp(70px,16vw,220px);font-variant-numeric:tabular-nums}
.settings{width:min(940px,96vw);height:min(820px,94vh);padding:0;border:0;border-radius:24px;color:#17283a;background:#f4f7fa;box-shadow:0 30px 100px #001b35}.settings::backdrop{background:rgba(0,15,30,.72);backdrop-filter:blur(6px)}.settings-shell{height:100%;display:grid;grid-template-rows:auto auto 1fr}.settings header{display:flex;justify-content:space-between;align-items:center;padding:22px 26px;background:#063e6d;color:white}.settings header span{font:14px Arial,sans-serif;color:#afdafa}.settings h1{margin:2px 0 0;font:700 27px Arial,sans-serif}.close{border:0;background:transparent;color:#fff;font:36px Arial;cursor:pointer}.tabs{display:flex;overflow:auto;background:#e7eef4;border-bottom:1px solid #ccdae6}.tabs button{flex:1;min-width:105px;padding:15px 10px;border:0;border-bottom:3px solid transparent;background:none;color:#53687a;font:600 14px Arial,sans-serif;cursor:pointer}.tabs button.active{color:#0566ad;border-color:#057bc9;background:#f4f7fa}.panels{overflow:auto;padding:24px 28px 34px}.panel{display:none;font-family:Arial,sans-serif}.panel.active{display:block}.panel h2{margin:0 0 20px;font-size:22px}.panel label{display:flex;flex-direction:column;gap:7px;margin:0 0 17px;font-size:14px;font-weight:700;color:#34495d}.panel input[type=text],.panel input[type=number],.panel select,.panel textarea{width:100%;border:1px solid #b9cad8;border-radius:10px;background:white;padding:11px 12px;color:#17283a;font:16px Arial,sans-serif}.panel textarea{resize:vertical;line-height:1.45}.grid2{display:grid;grid-template-columns:1fr 1fr;gap:16px}.check{flex-direction:row!important;align-items:center;font-weight:500!important;font-size:16px!important}.check input{width:20px;height:20px;accent-color:#057bc9}.upload{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:14px;margin:0 0 14px;border:1px dashed #a9bfce;border-radius:12px;background:white;font:15px Arial,sans-serif}.hint{color:#647789;line-height:1.45}.actions{display:flex;gap:12px;flex-wrap:wrap}.panel button,.file-btn{display:inline-block;border:0;border-radius:10px;padding:12px 17px;background:#057bc9;color:white;font:700 14px Arial,sans-serif;cursor:pointer}.file-btn input{display:none}.panel .danger{margin-top:24px;background:#c73d4d}.status{padding:12px;border-radius:10px;background:#e4f3e8;color:#26723a}.iqama-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.iqama-grid label{margin:0}.force-portrait{max-width:min(56.25vh,100vw);margin:auto}.force-landscape{max-height:min(56.25vw,100vh);margin:auto}
@media (orientation:landscape){.screen:not(.force-portrait){grid-template-columns:.86fr 1.14fr;grid-template-rows:auto auto 1fr auto auto;column-gap:4vw}.screen:not(.force-portrait) .topbar{grid-column:1/3}.screen:not(.force-portrait) .hero{grid-column:1;align-self:end}.screen:not(.force-portrait) .verse{grid-column:1;white-space:normal;align-self:start}.screen:not(.force-portrait) .prayer-table,.screen:not(.force-portrait) .no-data{grid-column:2;grid-row:2/5}.screen:not(.force-portrait) .rows{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.screen:not(.force-portrait) .prayer-head{display:none}.screen:not(.force-portrait) .row{display:flex;flex-direction:column;justify-content:center;min-height:17vh;border:1px solid var(--line);border-radius:13px;background:rgba(0,35,78,.17)}.screen:not(.force-portrait) .name{text-align:center;font-size:clamp(16px,2.3vw,34px)}.screen:not(.force-portrait) .time,.screen:not(.force-portrait) .iqama{font-size:clamp(22px,3.7vw,48px)}.screen:not(.force-portrait) .extras{grid-column:1}.screen:not(.force-portrait) .dhikr{grid-column:1}.screen:not(.force-portrait) footer{grid-column:1/3}.screen:not(.force-portrait) .next-card{position:static;transform:none;width:160px;margin:.6em auto 0}.screen:not(.force-portrait) .row.active{margin:0}}
@media(max-width:620px){.topbar{grid-template-columns:auto 1fr auto}.weather{display:none}.grid2{grid-template-columns:1fr}.settings{width:100vw;height:100vh;max-height:none;border-radius:0}.panels{padding:20px}.iqama-grid{grid-template-columns:1fr 1fr}.next-card{right:-4px}.extras{justify-content:space-between}.extras div{flex-direction:column;gap:0}.verse{white-space:normal}}
@media(prefers-reduced-motion:reduce){.ticker span{animation:none}}
.ambient{background-position:var(--drift,0) var(--drift,0);transition:opacity .8s,background-image .8s}.screen.after-prayer .ambient{opacity:.88;background-position:center;background-size:cover}.screen.after-prayer:after{content:"";position:absolute;inset:0;z-index:-1;background:rgba(0,25,48,.3)}
.format-setting{margin:0 0 20px}.format-setting>span{display:block;margin-bottom:8px;font:700 14px Arial,sans-serif;color:#34495d}.format-picker{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.panel .format-picker button{display:flex;flex-direction:column;align-items:center;gap:5px;padding:14px 8px;border:2px solid #c8d7e2;background:#fff;color:#486074;font-size:28px}.panel .format-picker button small{font-size:13px}.panel .format-picker button.active{border-color:#057bc9;background:#e5f4ff;color:#0566ad}
.screen.force-landscape{grid-template-columns:.86fr 1.14fr;grid-template-rows:auto auto 1fr auto auto;column-gap:4vw}.screen.force-landscape .topbar{grid-column:1/3}.screen.force-landscape .hero{grid-column:1;align-self:end}.screen.force-landscape .verse{grid-column:1;white-space:normal;align-self:start}.screen.force-landscape .prayer-table,.screen.force-landscape .no-data{grid-column:2;grid-row:2/5}.screen.force-landscape .rows{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.screen.force-landscape .prayer-head{display:none}.screen.force-landscape .row{display:flex;flex-direction:column;justify-content:center;min-height:17vh;border:1px solid var(--line);border-radius:13px;background:rgba(0,35,78,.17)}.screen.force-landscape .name{text-align:center;font-size:clamp(16px,2.3vw,34px)}.screen.force-landscape .time,.screen.force-landscape .iqama{font-size:clamp(22px,3.7vw,48px)}.screen.force-landscape .extras{grid-column:1}.screen.force-landscape .dhikr{grid-column:1}.screen.force-landscape footer{grid-column:1/3}.screen.force-landscape .next-card{position:static;transform:none;width:160px;margin:.6em auto 0}.screen.force-landscape .row.active{margin:0}

/* Tawkit-inspirerat liggande TV-läge: en enda scen och alla böner längst ner. */
.screen.layout-landscape{display:grid;grid-template-columns:1fr;grid-template-rows:auto auto auto 1fr auto auto;column-gap:0;padding:clamp(12px,2.2vh,26px) clamp(20px,3vw,48px) clamp(8px,1.3vh,16px)}
.screen.layout-landscape .topbar{grid-column:1;grid-row:1}.screen.layout-landscape .dates{font-size:clamp(16px,2vw,28px)}
.screen.layout-landscape .hero{grid-column:1;grid-row:2;align-self:center}.screen.layout-landscape .mosque{font-size:clamp(16px,1.8vw,27px);margin:.05em 0 .2em}.screen.layout-landscape .clockline #clock{font-size:clamp(78px,12vw,168px);line-height:.82}.screen.layout-landscape .clockline #seconds{font-size:clamp(25px,3.3vw,48px)}
.screen.layout-landscape .next-card{position:absolute;right:1.5vw;top:55%;transform:translateY(-50%);width:clamp(115px,11vw,175px);min-width:0;margin:0;padding:.65em .5em}.screen.layout-landscape .next-card strong{font-size:clamp(25px,3.1vw,45px)}
.screen.layout-landscape .verse{grid-column:1;grid-row:3;align-self:center;white-space:nowrap;font-size:clamp(21px,2.6vw,38px);padding:.15em 8vw .3em}
.screen.layout-landscape .extras{grid-column:1;grid-row:4;align-self:start;margin:.15em 0 0;gap:5vw}.screen.layout-landscape .dhikr{grid-column:1;grid-row:4;align-self:end;padding:.1em}
.screen.layout-landscape .prayer-table,.screen.layout-landscape .no-data{grid-column:1;grid-row:5;width:100%;max-width:none;margin:0;align-self:end}.screen.layout-landscape .prayer-head{display:none}.screen.layout-landscape .rows{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:clamp(5px,1vw,15px)}
.screen.layout-landscape .row{display:flex;flex-direction:column;justify-content:center;min-height:clamp(120px,19vh,190px);margin:0;padding:.5em .3em;border:1px solid var(--line);border-radius:14px;background:rgba(0,35,78,.2)}.screen.layout-landscape .row.active{margin:0;padding:.5em .3em;border-color:var(--accent);background:rgba(0,35,78,.42)}
.screen.layout-landscape .name{order:1;text-align:center;font-size:clamp(17px,1.8vw,29px);line-height:1.05}.screen.layout-landscape .arabic-name{font-size:.5em;margin-top:.18em}.screen.layout-landscape .time{order:2;font-size:clamp(28px,3.7vw,56px);line-height:1.05;margin:.12em 0}.screen.layout-landscape .iqama{order:0;font-size:clamp(14px,1.45vw,22px);line-height:1.2;margin-bottom:.2em}.screen.layout-landscape .sunrise .iqama{font-size:clamp(12px,1.2vw,18px)}
.screen.layout-landscape footer{grid-column:1;grid-row:6;margin-top:.3em}.screen.layout-landscape .ticker{padding-top:.25em}.screen.layout-landscape .hadith{margin-top:.2em}

.iqama-offset,.brand-signature{display:none}
/* Finjusterad liggande placering enligt skissen. */
.screen.layout-landscape{display:block;position:relative;padding:0 2.2vw}
.screen.layout-landscape .topbar{position:absolute;z-index:2;top:2.2vh;left:2.2vw;right:2.2vw;height:6vh;display:flex;align-items:flex-start;gap:1vw}
.screen.layout-landscape .topbar .weather{margin-right:auto}.screen.layout-landscape .topbar #fullBtn{margin-left:auto}
.screen.layout-landscape .dates{position:absolute;top:0;left:24vw;right:24vw;display:flex;flex-direction:row;justify-content:space-between;align-items:center;text-align:left;font-size:clamp(17px,1.55vw,28px);line-height:1.15}
.screen.layout-landscape .dates #gregorian{order:1;margin:0}.screen.layout-landscape .dates #hijri{order:2;margin:0;text-align:right}
.screen.layout-landscape .hero{position:absolute;top:7.2vh;left:0;right:0;height:25vh;padding-top:4.5vh;text-align:center}
.screen.layout-landscape .mosque{position:absolute;top:0;left:0;right:0;margin:0;font-size:clamp(20px,1.8vw,32px)}
.screen.layout-landscape .clockline #clock{font-size:clamp(92px,10.5vw,180px);line-height:.9}.screen.layout-landscape .clockline #seconds{font-size:clamp(28px,3vw,52px)}
.screen.layout-landscape .next-card{right:7vw;top:60%;transform:translateY(-50%);width:clamp(125px,11vw,185px);padding:.7em .5em}
.screen.layout-landscape .verse{position:absolute;top:33vh;left:9vw;right:9vw;height:16vh;display:flex;align-items:center;justify-content:center;padding:0;white-space:normal;overflow:visible;text-overflow:clip;font-size:clamp(34px,3.55vw,65px);line-height:1.45}
.screen.layout-landscape .prayer-table,.screen.layout-landscape .no-data{position:absolute;top:51.5vh;left:2.2vw;right:2.2vw;width:auto;height:27vh;margin:0;align-self:auto}
.screen.layout-landscape .rows{height:100%;align-items:stretch}.screen.layout-landscape .row{min-height:0;height:100%;padding:.65em .25em;background:rgba(0,35,78,.16)}.screen.layout-landscape .row.active{padding:.65em .25em}
.screen.layout-landscape .name{font-size:clamp(20px,1.85vw,32px)}.screen.layout-landscape .time{font-size:clamp(38px,3.8vw,66px);margin:.12em 0}.screen.layout-landscape .iqama{font-size:clamp(17px,1.45vw,25px);font-weight:700;color:var(--accent)}
.screen.layout-landscape .iqama-time{display:none}.screen.layout-landscape .iqama-offset{display:inline}.screen.layout-landscape .sunrise .iqama{font-size:clamp(15px,1.3vw,22px)}
.screen.layout-landscape .extras{position:absolute;z-index:2;left:2.2vw;bottom:1.7vh;margin:0;display:block}.screen.layout-landscape .extras div{display:flex;flex-direction:row;gap:.55em}.screen.layout-landscape .extras span{font-size:clamp(14px,1.1vw,19px)}.screen.layout-landscape .extras strong{font-size:clamp(17px,1.35vw,24px)}
.screen.layout-landscape .dhikr{position:absolute;left:8vw;right:8vw;bottom:14vh;padding:0;font-size:clamp(20px,1.8vw,31px)}
.screen.layout-landscape footer{position:absolute;left:10vw;right:10vw;bottom:2vh;height:15vh;margin:0;display:flex;align-items:flex-start;justify-content:center}
.screen.layout-landscape .hadith{margin:0;padding-top:1.5vh;font-size:clamp(26px,2.45vw,44px);line-height:1.55;color:#fff}
.screen.layout-landscape .brand-signature{display:block;position:fixed;right:2.2vw;bottom:1.8vh;font:clamp(12px,.95vw,17px) Arial,sans-serif;color:rgba(255,255,255,.68);letter-spacing:.02em}.screen.layout-landscape .brand-signature strong{color:var(--accent);font-weight:700}