/* ====== PALETAT ====== */
:root{
  --f-body:'Inter Variable','Inter',system-ui,-apple-system,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;
  --f-head:'Lora Variable','Lora',Georgia,'Times New Roman',serif;
  --f-num:'Saira Variable','Saira','Inter Variable',system-ui,sans-serif;
  --f-ar:'Amiri','Noto Naskh Arabic','Traditional Arabic','Scheherazade New',serif;
  --bg:#041a28; --ink:#f6eed9; --mute:rgba(240,230,200,.84);
  --blue:#2b7a99; --blue-2:#86c8df;
  --gold:#e6bf6a; --gold-2:#c99a3c; --gf1:#f6dc9c; --gf2:#d4a64a; --gf3:#a97c2a; --on-gold:#2a1c05; --gl:230,191,106;
  --emerald:var(--blue); --emerald-2:var(--blue-2);
  --panel:rgba(9,48,69,.6); --panel-2:rgba(4,30,46,.82);
  --line:rgba(var(--gl),.26); --line-gold:rgba(246,220,156,.6);
  --track:rgba(var(--gl),.16); --tick:rgba(var(--gl),.42);
  --rg1:#f6dc9c; --rg2:#c99a3c;
  --cell:rgba(0,0,0,.22); --field-bg:rgba(0,0,0,.3); --ico-bg:rgba(134,200,223,.12);
  --act-1:rgba(43,122,153,.42); --act-2:rgba(var(--gl),.3);
  --modal-1:#0a3a55; --modal-2:#041c2c; --th-bg:#0a3a55;
  --compass-bg:radial-gradient(circle,rgba(43,122,153,.28),rgba(2,16,26,.9) 72%);
  --sky-line:rgba(2,16,26,.6); --ok:#4ade80; --err:#fca5a5;
  --glow-1:rgba(43,122,153,.35); --glow-2:rgba(var(--gl),.14);
  --sky-a:rgba(0,0,0,0); --sky-b:rgba(0,0,0,0); --star-op:0;
  --safe-t:env(safe-area-inset-top,0px); --safe-b:env(safe-area-inset-bottom,0px);
}
/* Smerald (Muharrem) */
[data-palette="emerald"]{
  --bg:#04201c; --ink:#f7f0dc; --mute:rgba(226,232,200,.72);
  --blue:#1f8a6c; --blue-2:#7be0b8;
  --gold:#e8c26e; --gold-2:#c99a3c; --gf1:#f6dc9c; --gf2:#d4a64a; --gf3:#a97c2a; --on-gold:#2a1c05; --gl:232,194,110;
  --panel:rgba(8,62,52,.6); --panel-2:rgba(3,38,32,.84);
  --line-gold:rgba(246,220,156,.6); --rg1:#f6dc9c; --rg2:#c99a3c;
  --ico-bg:rgba(123,224,184,.12); --act-1:rgba(31,138,108,.42);
  --modal-1:#0a4a3e; --modal-2:#03221e; --th-bg:#0a4a3e;
  --compass-bg:radial-gradient(circle,rgba(31,138,108,.3),rgba(2,24,20,.9) 72%);
  --sky-line:rgba(1,20,17,.6); --glow-1:rgba(31,138,108,.38);
}
/* Mentë (jeshil-ujë) */
[data-palette="mint"]{
  --bg:#052e2b; --ink:#effcf7; --mute:rgba(200,240,226,.74);
  --blue:#2bb89a; --blue-2:#9ff3d6;
  --gold:#a6f5da; --gold-2:#6fd9b8; --gf1:#d4fbee; --gf2:#7fe6c4; --gf3:#3fb592; --on-gold:#032a22; --gl:159,243,214;
  --panel:rgba(10,84,76,.5); --panel-2:rgba(4,52,48,.8);
  --line-gold:rgba(212,251,238,.6); --rg1:#d4fbee; --rg2:#3fb592;
  --ico-bg:rgba(159,243,214,.12); --act-1:rgba(43,184,154,.42);
  --modal-1:#0b6155; --modal-2:#04302c; --th-bg:#0b6155;
  --compass-bg:radial-gradient(circle,rgba(43,184,154,.3),rgba(3,36,32,.9) 72%);
  --sky-line:rgba(2,30,27,.6); --glow-1:rgba(43,184,154,.42);
}
/* Turkez + ar */
[data-palette="turquoise"]{
  --bg:#06424b; --ink:#fdf6e3; --mute:rgba(235,235,210,.74);
  --blue:#18a2ad; --blue-2:#8eeaf0;
  --gold:#f0bf5a; --gold-2:#d99a2b; --gf1:#fbdc8f; --gf2:#e3a935; --gf3:#b27b14; --on-gold:#2e1d02; --gl:240,191,90;
  --panel:rgba(12,104,116,.52); --panel-2:rgba(6,66,76,.82);
  --line-gold:rgba(251,220,143,.65); --rg1:#fbdc8f; --rg2:#d99a2b;
  --ico-bg:rgba(142,234,240,.13); --act-1:rgba(24,162,173,.45);
  --modal-1:#0d7380; --modal-2:#05353d; --th-bg:#0d7380;
  --compass-bg:radial-gradient(circle,rgba(24,162,173,.32),rgba(3,40,46,.9) 72%);
  --sky-line:rgba(3,38,44,.6); --glow-1:rgba(24,162,173,.45);
}
/* Blu mbretëror */
[data-palette="royal"]{
  --bg:#0a1b4a; --ink:#f8efd6; --mute:rgba(226,224,205,.72);
  --blue:#3d6fe0; --blue-2:#9db8ff;
  --gold:#f2b84b; --gold-2:#d4902a; --gf1:#fbd98a; --gf2:#e9a73a; --gf3:#a8701a; --on-gold:#2e1b02; --gl:242,184,75;
  --panel:rgba(22,48,128,.5); --panel-2:rgba(8,24,76,.82);
  --line-gold:rgba(251,217,138,.62); --rg1:#fbd98a; --rg2:#d4902a;
  --ico-bg:rgba(157,184,255,.13); --act-1:rgba(61,111,224,.45);
  --modal-1:#16348a; --modal-2:#081a52; --th-bg:#16348a;
  --compass-bg:radial-gradient(circle,rgba(61,111,224,.3),rgba(6,16,56,.92) 72%);
  --sky-line:rgba(5,12,44,.6); --glow-1:rgba(61,111,224,.4);
}

/* ====== MODI I NDRITSHËM ====== */
[data-theme="light"]{
  --bg:#f6f0e0; --ink:#0c2a3d; --mute:rgba(12,42,61,.8);
  --blue:#1d6a8a; --blue-2:#1d6a8a;
  --gold:#8f6310; --gold-2:#7a520a; --gl:150,108,30;
  --panel:rgba(255,255,255,.86); --panel-2:rgba(251,245,230,.96);
  --line:rgba(150,108,30,.34); --line-gold:rgba(150,108,30,.75);
  --track:rgba(12,42,61,.1); --tick:rgba(12,42,61,.3);
  --rg1:#d9a93e; --rg2:#8f6310;
  --cell:rgba(255,255,255,.75); --field-bg:#fff; --ico-bg:rgba(29,106,138,.1);
  --act-1:rgba(230,191,106,.38); --act-2:rgba(255,236,190,.65);
  --modal-1:#fffaf0; --modal-2:#f1e7cc; --th-bg:#efe3c3;
  --compass-bg:radial-gradient(circle,rgba(230,191,106,.3),rgba(255,250,240,.95) 72%);
  --sky-line:rgba(12,42,61,.15); --ok:#15803d; --err:#b91c1c;
  --glow-1:rgba(230,191,106,.3); --glow-2:rgba(29,106,138,.1);
}
[data-theme="light"][data-palette="emerald"]{
  --bg:#f1f3e3; --ink:#0b2e26; --mute:rgba(11,46,38,.72); --blue:#1a7a5e; --blue-2:#1a7a5e;
  --modal-1:#fbf9ec; --modal-2:#e8ecd2; --th-bg:#e3e8c8; --glow-1:rgba(31,138,108,.22);
  --ico-bg:rgba(26,122,94,.1); --sky-line:rgba(11,46,38,.15);
  --compass-bg:radial-gradient(circle,rgba(31,138,108,.2),rgba(251,249,236,.95) 72%);
}
[data-theme="light"][data-palette="mint"]{
  --bg:#e6f6f1; --ink:#07302b; --mute:rgba(7,48,43,.72);
  --blue:#0f7a63; --blue-2:#0f7a63; --gold:#0f7a63; --gold-2:#0b5f4d; --gl:15,122,99;
  --line:rgba(15,122,99,.3); --line-gold:rgba(15,122,99,.7); --tick:rgba(7,48,43,.3);
  --rg1:#43c9a6; --rg2:#0b6a56; --ico-bg:rgba(15,122,99,.1);
  --act-1:rgba(43,184,154,.28); --act-2:rgba(212,251,238,.7);
  --modal-1:#f6fffb; --modal-2:#d4efe6; --th-bg:#cdeade;
  --glow-1:rgba(43,184,154,.28); --glow-2:rgba(15,122,99,.1); --sky-line:rgba(7,48,43,.15);
  --compass-bg:radial-gradient(circle,rgba(43,184,154,.25),rgba(246,255,251,.95) 72%);
}
[data-theme="light"][data-palette="turquoise"]{
  --bg:#e4f4f3; --ink:#06353b; --mute:rgba(6,53,59,.72); --blue:#0e7f8a; --blue-2:#0e7f8a;
  --gold:#946510; --gl:148,101,16; --ico-bg:rgba(14,127,138,.1);
  --modal-1:#f7fdfc; --modal-2:#d5ecea; --th-bg:#cde6e4; --glow-1:rgba(24,162,173,.25); --sky-line:rgba(6,53,59,.15);
  --compass-bg:radial-gradient(circle,rgba(24,162,173,.22),rgba(247,253,252,.95) 72%);
}
[data-theme="light"][data-palette="royal"]{
  --bg:#e8edfa; --ink:#0b1d52; --mute:rgba(11,29,82,.72); --blue:#2a56c4; --blue-2:#2a56c4;
  --gold:#8a5a0c; --gl:138,90,12; --ico-bg:rgba(42,86,196,.1);
  --modal-1:#fafbff; --modal-2:#dbe3f7; --th-bg:#d3dcf4; --glow-1:rgba(61,111,224,.22); --sky-line:rgba(11,29,82,.15);
  --compass-bg:radial-gradient(circle,rgba(61,111,224,.2),rgba(250,251,255,.95) 72%);
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html{height:100%;overflow-x:hidden}
body{
  margin:0;min-height:100%;line-height:1.5;font-weight:500;letter-spacing:.005em;font-family:var(--f-body);color:var(--ink);
  background-color:var(--bg);
  -webkit-font-smoothing:antialiased;-webkit-text-size-adjust:100%;overflow-x:hidden;
  padding:var(--safe-t) 0 var(--safe-b);transition:background-color .5s ease,color .3s ease;
}
button{font-family:inherit}

/* ---------- ATMOSPHERE ---------- */
.sky{position:fixed;inset:0;z-index:0;pointer-events:none;
  background:radial-gradient(120% 70% at 50% 108%,var(--sky-a),transparent 62%),linear-gradient(180deg,var(--sky-b),transparent 55%),
   radial-gradient(at 15% 0%,var(--glow-1),transparent 55%),radial-gradient(at 90% 100%,var(--glow-2),transparent 55%)}
.stars{position:fixed;inset:0;z-index:0;pointer-events:none;opacity:var(--star-op);transition:opacity 2s ease;
  background-image:
   radial-gradient(1.5px 1.5px at 12% 18%,#fff,transparent),radial-gradient(1px 1px at 28% 8%,#fff,transparent),
   radial-gradient(1.5px 1.5px at 44% 24%,#f6dc9c,transparent),radial-gradient(1px 1px at 63% 12%,#fff,transparent),
   radial-gradient(1.5px 1.5px at 78% 22%,#fff,transparent),radial-gradient(1px 1px at 90% 9%,#f6dc9c,transparent),
   radial-gradient(1px 1px at 8% 46%,#fff,transparent),radial-gradient(1.5px 1.5px at 94% 52%,#fff,transparent),
   radial-gradient(1px 1px at 55% 40%,#fff,transparent),radial-gradient(1px 1px at 35% 58%,#f6dc9c,transparent);
  }
[data-theme="light"] .stars{display:none}

/* ---------- LAYOUT ---------- */
.app{position:relative;z-index:2;max-width:760px;margin:0 auto;padding:12px 12px 28px}
.glass{background:linear-gradient(160deg,var(--panel),var(--panel-2));border:1px solid var(--line);
  border-radius:22px;
  box-shadow:0 6px 18px rgba(0,0,0,.25)}
[data-theme="light"] .glass{box-shadow:0 6px 16px rgba(120,84,20,.12)}

.hdr{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:6px 4px 12px}
.brand{display:flex;align-items:center;gap:10px;min-width:0}
.brand-mark{width:44px;height:44px;flex:none;border-radius:50%;display:grid;place-items:center;color:var(--gf1);font-size:1.1rem;
  background:radial-gradient(circle at 35% 30%,var(--modal-1),var(--modal-2));border:2px solid var(--gf2);
  box-shadow:0 0 0 3px rgba(var(--gl),.2),0 0 22px rgba(var(--gl),.35)}
.brand h1{margin:0;font-family:var(--f-head);font-weight:700;font-size:1.5rem;letter-spacing:.02em;line-height:1}
.brand small{display:block;color:var(--mute);font-size:.74rem;margin-top:3px}
.hdr-right{display:flex;align-items:center;gap:8px}
.chip{display:inline-flex;align-items:center;gap:7px;padding:6px 11px;border-radius:999px;border:1px solid var(--line);background:var(--panel);font-size:.74rem;font-weight:700}
.chip i{color:var(--gold);font-size:.74rem}
.chip small{display:block;color:var(--mute);font-size:.74rem;font-weight:500;line-height:1}
.icon-btn{width:36px;height:36px;border-radius:50%;border:1px solid var(--line);background:var(--panel);color:var(--gold);cursor:pointer;transition:.25s}
.icon-btn:hover{transform:rotate(60deg);border-color:var(--line-gold)}

/* ---------- HERO ---------- */
.top-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.top-row>section{margin:0;min-width:0}
.hero{position:relative;overflow:hidden;padding:18px 8px 0;text-align:center;display:flex;flex-direction:column;align-items:center}
.hero-time{font-family:var(--f-num);font-variant-numeric:tabular-nums;font-weight:900;
  font-size:clamp(1.55rem,7.2vw,3.1rem);line-height:1;letter-spacing:.02em;color:#fff;white-space:nowrap;
  text-shadow:0 0 14px rgba(var(--gl),.45)}
[data-theme="light"] .hero-time{color:var(--ink);text-shadow:none}
.hero-time .sec{font-size:.36em;color:var(--blue-2);margin-left:6px;font-weight:700}
.hero-time .colon{color:var(--gold)}
.hero-date{margin-top:10px;font-family:var(--f-head);font-size:clamp(.88rem,3.4vw,1.15rem);font-weight:700;letter-spacing:.03em}
.hero-date b{color:var(--gold);font-weight:700}
.hero-hijri{margin-top:2px;color:var(--gold);font-family:var(--f-ar);font-size:clamp(.8rem,3vw,1.02rem)}
.sun-row{display:flex;flex-direction:column;align-items:center;gap:4px;margin-top:12px;color:var(--mute);font-size:clamp(.66rem,2.6vw,.78rem);font-weight:600}
.sun-row i{color:var(--gold);margin-right:5px}
.sun-row b{color:var(--ink)}
.skyline{display:block;width:calc(100% + 16px);margin:auto -8px 0;padding-top:8px;height:56px;color:var(--sky-line)}

/* ---------- ACTIONS ---------- */
.actions{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:12px 0}
.act{display:flex;flex-direction:column;align-items:center;gap:6px;padding:12px 4px;border-radius:16px;cursor:pointer;
  color:var(--gold);font-size:.74rem;font-weight:700;border:1px solid var(--line);background:linear-gradient(160deg,var(--panel),var(--panel-2));transition:.25s}
.act i{font-size:1.05rem}
.act:hover{transform:translateY(-2px);border-color:var(--line-gold)}
.act:active{transform:scale(.96)}

/* ---------- COUNTDOWN RING ---------- */
.next{padding:12px 8px;display:flex;flex-direction:column;align-items:center;justify-content:center}
.ring-wrap{position:relative;width:100%;max-width:250px;aspect-ratio:1}
.ring-wrap svg{width:100%;height:100%;transform:rotate(-90deg);overflow:visible}
.ring-track{fill:none;stroke:var(--track);stroke-width:7}
.ring-prog{fill:none;stroke:url(#ringGrad);stroke-width:7;stroke-linecap:round;
  }
.ring-dot{fill:var(--gold)}
.ring-ticks line{stroke:var(--tick);stroke-width:1.5}
.ring-center{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px}
.ring-center .lbl{font-size:clamp(.66rem,2.2vw,.7rem);color:var(--mute);font-weight:600}
.ring-center .pname{font-family:var(--f-head);font-size:clamp(1.15rem,5vw,1.7rem);font-weight:700;line-height:1.05}
.ring-center .parab{font-family:var(--f-ar);color:var(--gold);font-size:clamp(.95rem,3.8vw,1.25rem);line-height:1}
.ring-center .cd{font-family:var(--f-num);font-variant-numeric:tabular-nums;font-weight:700;font-size:clamp(.82rem,3.9vw,1.5rem);margin-top:4px;white-space:nowrap;color:var(--gold)}
.ring-center .at{font-size:clamp(.66rem,2.2vw,.7rem);color:var(--mute);margin-top:2px}

/* ---------- PRAYER LIST ---------- */
#prayerGrid{display:grid;gap:8px;margin:12px 0}
.prayer{position:relative;display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:18px;
  border:1px solid var(--line);background:linear-gradient(150deg,var(--panel),var(--panel-2));
  transition:transform .3s,border-color .3s,opacity .4s,background .4s;overflow:hidden}
.prayer .ico{width:42px;height:42px;flex:none;border-radius:50%;display:grid;place-items:center;
  color:var(--blue-2);background:var(--ico-bg);border:1px solid var(--line);transition:.4s}
.prayer .names{flex:1;min-width:0}
.prayer .sq{font-weight:800;font-size:1rem}
.prayer .ar{font-family:var(--f-ar);font-size:1.05rem;color:var(--mute);line-height:1.1}
.prayer .tm{font-family:var(--f-num);font-weight:700;font-size:1.35rem;color:var(--gold);font-variant-numeric:tabular-nums}
.prayer .st{width:20px;text-align:center;color:var(--blue-2);font-size:.85rem}
.prayer.past{opacity:.6}
.prayer.past .tm{color:var(--mute)}
.prayer.next-up{border-color:var(--line-gold)}
.prayer.next-up .st{color:var(--gold)}
.prayer.active{border-color:var(--gf2);background:linear-gradient(120deg,var(--act-1),var(--act-2),var(--act-1));
  box-shadow:0 0 18px rgba(var(--gl),.35)}
.prayer.active .ico{background:linear-gradient(135deg,var(--gf1),var(--gf2));color:var(--on-gold);border-color:var(--gf2);box-shadow:0 0 20px rgba(var(--gl),.65)}
.prayer.active .tm{color:#fff;text-shadow:0 0 14px rgba(var(--gl),.9)}
[data-theme="light"] .prayer.active .tm{color:var(--ink);text-shadow:none}
.enter{animation:rise .35s ease-out both}
@keyframes rise{from{opacity:0}to{opacity:1}}

/* ---------- AYAH + TOMORROW ---------- */
.ayah{padding:16px 18px;margin-bottom:12px;position:relative}
.ayah::before{content:'\201C';position:absolute;top:-6px;left:12px;font-family:var(--f-head);font-size:4rem;color:var(--gold);opacity:.35;line-height:1}
.ayah p{margin:0}
#ayahText{font-family:var(--f-head);font-size:1.2rem;font-weight:700;line-height:1.35;padding-left:18px}
#ayahSource{margin-top:8px!important;text-align:right;color:var(--gold);font-size:.74rem;font-weight:700}
.tom{padding:12px}
.tom h3{margin:0 0 9px;font-size:.78rem;color:var(--mute);font-weight:700}
#tomorrowGrid{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;text-align:center}
#tomorrowGrid div{padding:7px 2px;border-radius:11px;background:var(--cell);border:1px solid var(--line)}
#tomorrowGrid span{display:block;font-size:.74rem;color:var(--mute);font-weight:600;margin-bottom:3px}
#tomorrowGrid b{font-family:var(--f-num);font-size:.74rem;color:var(--gold)}
#statusText{text-align:center;margin:14px 0 0;font-size:.74rem;color:var(--mute)}

/* ---------- MODALS ---------- */
.modal{position:fixed;inset:0;z-index:100;display:flex;align-items:center;justify-content:center;padding:16px;
  background:rgba(2,10,16,.82);opacity:0;pointer-events:none;transition:opacity .3s}
[data-theme="light"] .modal{background:rgba(40,28,8,.6)}
.modal.show{opacity:1;pointer-events:all}
.modal-content{width:100%;max-width:480px;max-height:90vh;max-height:90dvh;overflow-y:auto;padding:20px 18px;border-radius:26px;
  background:linear-gradient(160deg,var(--modal-1),var(--modal-2));border:1px solid var(--line-gold);color:var(--ink);
  box-shadow:0 0 60px rgba(var(--gl),.15),0 30px 70px rgba(0,0,0,.4);animation:pop .2s ease-out}
@keyframes pop{from{opacity:0}to{opacity:1}}
.modal h2{margin:0;font-family:var(--f-head);font-size:1.55rem;color:var(--gold)}
.modal-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}
.x{background:none;border:none;color:var(--gold);font-size:1.2rem;cursor:pointer}
.field label{display:block;font-size:.74rem;font-weight:700;color:var(--blue-2);margin-bottom:5px}
.field select{width:100%;padding:10px 12px;border-radius:12px;font-size:.82rem;font-family:inherit;
  background:var(--field-bg);color:var(--ink);border:1px solid var(--line);outline:none}
.field select:focus{border-color:var(--line-gold)}
.field select option{background:var(--modal-2);color:var(--ink)}
.stack{display:grid;gap:12px}
.swatches{display:grid;grid-template-columns:repeat(5,1fr);gap:6px}
.sw{display:flex;flex-direction:column;align-items:center;gap:6px;background:none;border:none;cursor:pointer;color:var(--mute);font-size:.74rem;font-weight:700;padding:2px 0}
.sw .dot{width:40px;height:40px;border-radius:50%;border:2px solid var(--line);transition:.25s;position:relative}
.sw .dot::after{content:'\f00c';font-family:'Font Awesome 6 Free';font-weight:900;position:absolute;inset:0;display:grid;place-items:center;color:#fff;font-size:.8rem;opacity:0;text-shadow:0 1px 3px rgba(0,0,0,.6)}
.sw.on{color:var(--gold)}
.sw.on .dot{border-color:var(--gf2);box-shadow:0 0 0 3px rgba(var(--gl),.3)}
.sw.on .dot::after{opacity:1}
.sw:hover .dot{transform:scale(1.07)}
.btn{width:100%;padding:11px;border-radius:13px;border:none;cursor:pointer;font-weight:800;font-size:.8rem;color:var(--on-gold);
  background:linear-gradient(135deg,var(--gf1),var(--gf2));box-shadow:0 4px 18px rgba(var(--gl),.35);transition:.25s}
.btn:hover{transform:translateY(-2px)}
.btn.ghost{background:transparent;color:var(--gold);border:1px solid var(--line-gold);box-shadow:none}
.btn.danger{background:transparent;color:var(--err);border:1px solid var(--err);box-shadow:none;opacity:.85}
.toggle-row{display:flex;justify-content:space-between;align-items:center;padding:10px 12px;border-radius:12px;background:var(--cell);border:1px solid var(--line);font-size:.82rem;font-weight:700}
.switch{width:50px;height:28px;border-radius:99px;border:1px solid var(--line-gold);background:var(--field-bg);position:relative;cursor:pointer}
.switch i{position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:linear-gradient(135deg,var(--gf1),var(--gf2));transition:.3s;box-shadow:0 0 8px rgba(var(--gl),.6)}
.switch.on i{left:calc(100% - 23px)}

/* Qibla */
.compass{position:relative;width:240px;height:240px;margin:0 auto;border-radius:50%;background:var(--compass-bg);
  border:3px solid var(--gf2);box-shadow:0 0 18px rgba(var(--gl),.2);transition:box-shadow .4s,border-color .4s}
[data-theme="light"] .compass{box-shadow:0 8px 26px rgba(120,84,20,.2),inset 0 0 26px rgba(150,108,30,.12)}
.compass.aligned{border-color:var(--ok);box-shadow:0 0 50px var(--ok),inset 0 0 36px rgba(74,222,128,.2)}
.compass .d{position:absolute;font-family:var(--f-head);font-weight:700;color:var(--mute);font-size:1rem}
.d.n{top:7px;left:50%;transform:translateX(-50%);color:var(--gold)!important}.d.s{bottom:7px;left:50%;transform:translateX(-50%)}
.d.e{right:12px;top:50%;transform:translateY(-50%)}.d.w{left:12px;top:50%;transform:translateY(-50%)}
.needle{position:absolute;top:50%;left:50%;width:4px;height:96px;transform-origin:center bottom;transform:translate(-50%,-100%);
  background:linear-gradient(to top,transparent,var(--gf2) 40%,var(--gf2));transition:transform .3s ease;box-shadow:0 0 12px rgba(var(--gl),.7)}
.needle::before{content:'';position:absolute;top:-10px;left:50%;transform:translateX(-50%);border:8px solid transparent;border-bottom:15px solid var(--gf2);border-top:0}
.kaaba{position:absolute;top:50%;left:50%;width:14px;height:14px;margin:-7px;border-radius:50%;background:var(--gf2);box-shadow:0 0 12px var(--gf2)}

/* Calendar */
.cal-table{width:100%;border-collapse:collapse;font-size:.74rem}
.cal-table th{position:sticky;top:0;padding:8px 3px;background:var(--th-bg);color:var(--gold);font-size:.74rem}
.cal-table td{padding:7px 3px;text-align:center;border-bottom:1px solid var(--line);font-family:var(--f-num);font-size:.74rem}
.cal-table td:first-child{font-family:var(--f-body);font-weight:800}
.cal-table tr.today td{background:rgba(var(--gl),.22);color:var(--gold);font-weight:800}

/* Tasbih */
.tasbih{width:170px;height:170px;margin:0 auto;border-radius:50%;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;
  color:#fff;font-family:var(--f-num);font-size:2.8rem;font-weight:900;border:4px solid var(--gf2);
  background:radial-gradient(circle at 35% 30%,var(--blue),#0a2a45 75%);background:radial-gradient(circle at 35% 30%,var(--blue),color-mix(in srgb,var(--blue) 40%,#000) 78%);box-shadow:0 0 40px rgba(var(--gl),.35),inset 0 0 30px rgba(0,0,0,.35);transition:.15s}
.tasbih:active{transform:scale(.94);box-shadow:0 0 60px rgba(var(--gl),.7)}
.tasbih small{font-family:var(--f-body);font-size:.74rem;font-weight:500;opacity:.85}

/* Banner */
.banner{position:fixed;bottom:calc(14px + var(--safe-b));left:50%;transform:translate(-50%,160%);z-index:200;display:flex;align-items:center;gap:10px;
  padding:11px 14px;border-radius:16px;max-width:94%;background:linear-gradient(160deg,var(--modal-1),var(--modal-2));border:1px solid var(--line-gold);color:var(--ink);
  box-shadow:0 20px 50px rgba(0,0,0,.45);transition:transform .5s cubic-bezier(.4,0,.2,1)}
.banner.show{transform:translate(-50%,0)}
.banner .t{font-weight:800;font-size:.78rem}.banner .s{font-size:.74rem;color:var(--mute)}
.banner .btn{width:auto;padding:7px 14px;font-size:.74rem}

.hidden{display:none!important}
.center{text-align:center}
.spin{width:46px;height:46px;border:4px solid var(--track);border-top-color:var(--gold);border-radius:50%;animation:sp 1s linear infinite;margin:0 auto 14px}
@keyframes sp{to{transform:rotate(360deg)}}

@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
@media (max-width:380px){.prayer .tm{font-size:1.15rem}.brand h1{font-size:1.25rem}}

/* =====================================================
   SHTESAT (versioni i plotë)
   ===================================================== */
html[data-font="s"]{font-size:15px}
html[data-font="m"]{font-size:17px}
html[data-font="l"]{font-size:19px}
html[data-font="xl"]{font-size:21px}

.toast{position:fixed;left:50%;bottom:calc(24px + var(--safe-b));transform:translate(-50%,40px);opacity:0;z-index:300;
  padding:9px 16px;border-radius:12px;background:var(--modal-2);color:var(--ink);border:1px solid var(--line-gold);font-size:.78rem;font-weight:700;
  transition:.35s;pointer-events:none}
.toast.show{opacity:1;transform:translate(-50%,0)}

.ezan-stop{position:fixed;top:calc(10px + var(--safe-t));left:50%;transform:translate(-50%,-160%);z-index:250;display:flex;align-items:center;gap:8px;
  padding:9px 16px;border-radius:999px;border:1px solid var(--line-gold);background:var(--modal-1);color:var(--ink);font-weight:800;font-size:.8rem;cursor:pointer;
  box-shadow:0 10px 30px rgba(0,0,0,.45);transition:transform .4s cubic-bezier(.4,0,.2,1)}
.ezan-stop.show{transform:translate(-50%,0)}
.ezan-stop i{color:var(--gold)}

/* cilësimet: seksione */
.sec{border:1px solid var(--line);border-radius:16px;background:var(--cell);padding:0 12px}
.sec>summary{cursor:pointer;list-style:none;padding:12px 2px;font-weight:800;font-size:.86rem;color:var(--gold);display:flex;justify-content:space-between;align-items:center}
.sec>summary::-webkit-details-marker{display:none}
.sec>summary::after{content:'\f078';font-family:'Font Awesome 6 Free';font-weight:900;font-size:.74rem;transition:transform .3s}
.sec[open]>summary::after{transform:rotate(180deg)}
.sec>.stack{padding:2px 0 14px}
.input{width:100%;padding:10px 12px;border-radius:12px;font-size:.84rem;font-family:inherit;background:var(--field-bg);color:var(--ink);border:1px solid var(--line);outline:none}
.input:focus{border-color:var(--line-gold)}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:14px}
.field input[type=range]{width:100%;accent-color:var(--gf2)}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chip-btn{padding:7px 12px;border-radius:999px;border:1px solid var(--line);background:transparent;color:var(--mute);font-size:.74rem;font-weight:700;cursor:pointer;transition:.2s}
.chip-btn.on{background:linear-gradient(135deg,var(--gf1),var(--gf2));color:var(--on-gold);border-color:var(--gf2)}
.adjust{display:grid;gap:6px}
.adj-row{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:6px 10px;border-radius:12px;background:var(--cell);border:1px solid var(--line);font-size:.8rem;font-weight:700}
.adj-ctl{display:flex;align-items:center;gap:8px}
.adj-ctl button{width:30px;height:30px;border-radius:50%;border:1px solid var(--line-gold);background:transparent;color:var(--gold);font-size:1rem;font-weight:800;cursor:pointer;line-height:1}
.adj-ctl output{min-width:34px;text-align:center;font-family:var(--f-num);font-size:.78rem;color:var(--gold)}

/* karta të përgjithshme */
.card{padding:14px 14px 12px;margin-bottom:12px}
.card-title{font-size:.8rem;font-weight:800;color:var(--gold);margin-bottom:10px;display:flex;align-items:center;gap:8px}
.bar{height:7px;border-radius:99px;background:var(--track);overflow:hidden}
.bar i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,var(--gf1),var(--gf2));transition:width .6s ease}

/* butoni i shënimit te vakti */
.chk{width:32px;height:32px;flex:none;border-radius:50%;border:1.5px solid var(--line-gold);background:transparent;color:transparent;cursor:pointer;display:grid;place-items:center;font-size:.8rem;transition:.25s;z-index:2}
.chk:hover{border-color:var(--gf2)}
.chk.on{background:linear-gradient(135deg,var(--gf1),var(--gf2));border-color:var(--gf2);color:var(--on-gold);box-shadow:0 0 14px rgba(var(--gl),.5)}
.prayer.past.done{opacity:.88}
.prayer .ar em{font-style:normal;font-family:var(--f-body);font-size:.74rem;margin-inline-start:6px;opacity:.85}

/* shënim nën unazë */
.endnote{margin-top:8px;padding:5px 12px;border-radius:99px;border:1px solid var(--line-gold);font-size:clamp(.66rem,2.5vw,.74rem);font-weight:800;color:var(--gold);text-align:center}

/* Ramazani */
.ramadan{padding:14px;margin:12px 0}
.ram-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
.ram-title{font-family:var(--f-head);font-size:1.25rem;font-weight:700;color:var(--gold)}
.ram-day{font-size:.78rem;font-weight:800;color:var(--ink);padding:3px 10px;border-radius:99px;border:1px solid var(--line-gold)}
.ram-main{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin-bottom:8px}
.ram-label{font-size:.82rem;color:var(--mute);font-weight:700}
.ram-count{font-family:var(--f-num);font-weight:800;font-size:1.5rem;color:var(--gold);font-variant-numeric:tabular-nums}
.ram-times{display:flex;justify-content:space-between;margin-top:9px;font-size:.76rem;color:var(--mute);font-weight:700}
.ram-times b{font-family:var(--f-num);color:var(--ink);margin-inline-start:4px}

/* gjurmuesi */
.tr-head{display:flex;align-items:baseline;gap:12px;margin-bottom:8px;flex-wrap:wrap}
.tr-head b{font-family:var(--f-num);font-size:1.3rem;color:var(--ink)}
.tr-streak{font-size:.78rem;font-weight:800;color:var(--gold)}
.tr-best{font-size:.74rem;color:var(--mute);font-weight:700;margin-inline-start:auto}
.week{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;margin-top:12px;text-align:center}
.wd{display:flex;flex-direction:column;align-items:center;gap:4px;font-size:.74rem;font-weight:700;color:var(--mute)}
.wd span{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;border:1.5px solid var(--line);font-family:var(--f-num);font-size:.74rem;color:var(--mute)}
.wd.part span{border-color:var(--gf2);color:var(--gold)}
.wd.full span{background:linear-gradient(135deg,var(--gf1),var(--gf2));border-color:var(--gf2);color:var(--on-gold)}
.wd.today{color:var(--ink)}

/* ngjarjet */
.tip{padding:8px 12px;border-radius:12px;background:rgba(var(--gl),.14);border:1px solid var(--line-gold);font-size:.78rem;font-weight:700;margin-bottom:8px}
.ev-list{display:grid;gap:6px}
.ev-item{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:9px 12px;border-radius:12px;background:var(--cell);border:1px solid var(--line);font-size:.8rem;font-weight:700}
.ev-item small{display:block;font-weight:500;color:var(--mute);font-size:.74rem;margin-top:2px}
.ev-in{font-family:var(--f-num);font-size:.74rem;color:var(--gold);white-space:nowrap}

/* orë shtesë */
.extra-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-bottom:10px}
.xc{padding:8px 4px;text-align:center;border-radius:12px;background:var(--cell);border:1px solid var(--line)}
.xc span{display:block;font-size:.74rem;color:var(--mute);font-weight:700;margin-bottom:3px;line-height:1.2}
.xc b{font-family:var(--f-num);font-size:.74rem;color:var(--gold)}
.forb-title{font-size:.74rem;color:var(--mute);font-weight:700;margin:4px 0 6px}

/* ajeti */
.ayah-ar{font-family:var(--f-ar);font-size:1.45rem;line-height:1.9;text-align:center;color:var(--gold);padding:2px 4px 6px;direction:rtl}
.ayah-ar:empty{display:none}

/* kibla */
.big-deg{font-family:var(--f-num);font-size:1.8rem;font-weight:800;color:var(--gold)}
.cal-head{font-family:var(--f-head);font-size:1.15rem;font-weight:700;margin-bottom:8px}

/* tasbih me unazë progresi */
.tasbih-wrap{position:relative;width:200px;height:200px;margin:0 auto 6px;display:grid;place-items:center}
.tas-ring{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg);pointer-events:none}
.tas-track{fill:none;stroke:var(--track);stroke-width:4}
.tas-prog{fill:none;stroke:var(--gf2);filter:none;stroke-width:4;stroke-linecap:round;stroke-dasharray:339.29;stroke-dashoffset:339.29;transition:stroke-dashoffset .25s ease;}
.tasbih{width:166px;height:166px;margin:0;position:relative;z-index:1}
.tas-msg{min-height:1.2em;font-size:.82rem;font-weight:800;color:var(--gold)}

/* 99 emrat */
.names-list{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;max-height:56vh;overflow-y:auto;padding:2px}
.name-card{padding:10px 10px 9px;border-radius:14px;background:var(--cell);border:1px solid var(--line);text-align:center}
.name-card .n{font-size:.74rem;color:var(--mute);font-weight:800}
.name-card .a{font-family:var(--f-ar);font-size:1.5rem;color:var(--gold);line-height:1.5;direction:rtl}
.name-card .tr{font-size:.74rem;font-weight:800}
.name-card .m{font-size:.74rem;color:var(--mute);margin-top:2px}

/* dua */
.dua-list{display:grid;gap:10px;max-height:62vh;overflow-y:auto;padding:2px}
.dua-card{padding:12px 14px;border-radius:16px;background:var(--cell);border:1px solid var(--line)}
.dua-card .a{font-family:var(--f-ar);font-size:1.45rem;line-height:1.9;color:var(--gold);text-align:center;direction:rtl}
.dua-card .tr{font-size:.74rem;font-style:italic;color:var(--mute);margin-top:4px;text-align:center}
.dua-card .m{font-size:.82rem;margin-top:6px;text-align:center;font-weight:600}
.dua-card .rep{display:inline-block;margin-top:6px;padding:2px 10px;border-radius:99px;background:rgba(var(--gl),.18);border:1px solid var(--line-gold);font-family:var(--f-num);font-size:.74rem;color:var(--gold)}

/* RTL (arabisht) */
[dir="rtl"] .ayah::before{left:auto;right:12px}
[dir="rtl"] #ayahText{padding-left:0;padding-right:18px}
[dir="rtl"] #ayahSource{text-align:left}
[dir="rtl"] .sec>summary{flex-direction:row}
[dir="rtl"] .hero-time,[dir="rtl"] .prayer .tm,[dir="rtl"] .ring-center .cd{direction:ltr}
[dir="rtl"] .banner{direction:rtl}

@media (max-width:420px){
  .names-list{grid-template-columns:1fr}
  .extra-grid{grid-template-columns:repeat(3,1fr)}
}

/* numrat dhe orët mbeten gjithmonë majtas→djathtas (edhe në arabisht) */
.xc b,.ev-in,.ram-count,.ram-times b,#tomorrowGrid b,.cal-table td,.big-deg,.tas-msg b,.adj-ctl output,.ring-center .at,.endnote{direction:ltr;unicode-bidi:isolate}
[dir="rtl"] .ring-center .at,[dir="rtl"] .endnote{direction:rtl;unicode-bidi:plaintext}

/* telefon i vogël */
@media (max-width:360px){
  .app{padding:8px 8px 24px}
  .top-row{gap:8px}
  .hero{padding:14px 4px 0}
  .actions{gap:6px}.act{font-size:.74rem;padding:10px 2px}
  .prayer{padding:10px 10px;gap:9px}.prayer .ico{width:36px;height:36px}
  .chip small{display:none}
}
@media (max-width:360px){
  .ring-center .lbl{font-size:.74rem}
  .ring-center .cd{font-size:.8rem}
  .ring-center .pname{font-size:1.05rem}
}

/* instalimi + kontrolli */
.install{display:flex;align-items:center;gap:12px;padding:12px 14px;margin-bottom:12px;border-color:var(--line-gold)}
.install img{border-radius:12px;flex:none}
.install .inst-body{flex:1;min-width:0}
.install b{font-size:.9rem}
.install p{margin:3px 0 0;font-size:.74rem;color:var(--mute);line-height:1.4}
.install p i{color:var(--gold);margin:0 2px}
.install .btn{width:auto;padding:9px 16px;flex:none}
.check-list{display:grid;gap:6px}
.chk-row{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:12px;background:var(--cell);border:1px solid var(--line);font-size:.78rem;font-weight:700}
.chk-row i{width:18px;text-align:center;flex:none}
.chk-row.ok i{color:var(--ok)}.chk-row.bad i{color:var(--err)}.chk-row.warn i{color:var(--gold)}
.chk-row span{flex:1}
.chk-row small{font-weight:600;color:var(--mute);font-size:.74rem;text-align:end}
.note{margin:0;font-size:.74rem;color:var(--mute);line-height:1.5}

/* ===== abonimi, renditja, chat, donate ===== */
.srv-sub{margin:0 0 12px;font-size:.8rem;color:var(--mute);line-height:1.5}
.hp{position:absolute;left:0;top:0;width:1px;height:1px;opacity:0;pointer-events:none;overflow:hidden}
.consent{display:flex;gap:8px;align-items:flex-start;font-size:.74rem;color:var(--mute);margin:10px 0 6px;line-height:1.4;cursor:pointer}
.consent input{margin-top:2px;accent-color:var(--gf2)}
.srv-err{color:var(--err);font-size:.76rem;font-weight:700;min-height:1em;margin:8px 0 0}
.have{margin:10px 0}.have summary{cursor:pointer;font-size:.76rem;color:var(--gold);font-weight:700;margin-bottom:8px}
.acc-head{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:6px}
.acc-head b{font-size:1rem}.acc-today{font-family:var(--f-num);font-size:.74rem;color:var(--gold)}
.acc-row{display:flex;justify-content:space-between;align-items:center;gap:8px;margin:10px 0;font-size:.78rem;font-weight:700}
.btn.small{width:auto;padding:7px 14px;font-size:.74rem;flex:none}
.code-row{display:flex;gap:8px;align-items:center;margin:8px 0}
.code-row code{flex:1;font-size:.74rem;word-break:break-all;padding:8px;border-radius:10px;background:var(--cell);border:1px solid var(--line);direction:ltr;user-select:all}
.acc-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px}
.tabs{display:flex;gap:6px;margin-bottom:10px}
.tabs button{flex:1;padding:8px;border-radius:12px;border:1px solid var(--line);background:transparent;color:var(--mute);font-weight:800;font-size:.76rem;cursor:pointer}
.tabs button.on{background:linear-gradient(135deg,var(--gf1),var(--gf2));color:var(--on-gold);border-color:var(--gf2)}
.lb-list{list-style:none;margin:8px 0;padding:0;display:grid;gap:5px;max-height:440px;overflow-y:auto}
.lb-list li{display:flex;align-items:center;gap:10px;padding:8px 12px;border-radius:12px;background:var(--cell);border:1px solid var(--line);font-size:.82rem;font-weight:700}
.lb-list li.me{border-color:var(--gf2);background:rgba(var(--gl),.16)}
.lb-list .rk{min-width:30px;text-align:center;font-family:var(--f-num);font-size:.74rem;color:var(--gold)}
.lb-list .nm{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lb-list .ct{font-family:var(--f-num);color:var(--gold);font-size:.8rem}
.donate-btn{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;margin:12px 0 4px;padding:15px 18px;border-radius:18px;border:2px solid var(--gf2);
  background:linear-gradient(135deg,var(--gf1),var(--gf2));color:var(--on-gold);font-family:var(--f-body);font-weight:800;font-size:1.05rem;line-height:1.2;cursor:pointer;
  box-shadow:0 6px 18px rgba(var(--gl),.28);transition:transform .2s}
.donate-btn:active{transform:scale(.98)}
.donate-btn i{color:#b91c1c;font-size:1.15rem}
.amounts{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:12px 0}
.amounts button{padding:14px 6px;border-radius:14px;border:1.5px solid var(--line);background:var(--cell);color:var(--ink);font-family:var(--f-num);font-weight:800;font-size:1rem;cursor:pointer}
.amounts button.on{background:linear-gradient(135deg,var(--gf1),var(--gf2));color:var(--on-gold);border-color:var(--gf2)}
.btn.paypal{background:#ffc439;color:#111;box-shadow:none;display:flex;align-items:center;justify-content:center;gap:8px}
.btn.paypal i{color:#003087;font-size:1.1rem}
.chat-fab{position:fixed;right:14px;bottom:calc(16px + var(--safe-b));z-index:120;width:54px;height:54px;border-radius:50%;border:2px solid var(--gf2);
  background:linear-gradient(135deg,var(--modal-1),var(--modal-2));color:var(--gold);font-size:1.25rem;cursor:pointer;box-shadow:0 6px 18px rgba(0,0,0,.4)}
.chat-fab .badge{position:absolute;top:-3px;right:-3px;min-width:18px;height:18px;border-radius:9px;background:var(--err);color:#fff;font-size:.74rem;font-weight:800;display:grid;place-items:center;padding:0 4px}
.chat-panel{position:fixed;right:12px;bottom:calc(80px + var(--safe-b));z-index:130;width:min(360px,calc(100vw - 24px));height:min(70vh,520px);height:min(70dvh,520px);
  display:flex;flex-direction:column;border-radius:20px;background:linear-gradient(160deg,var(--modal-1),var(--modal-2));border:1px solid var(--line-gold);box-shadow:0 14px 40px rgba(0,0,0,.5);overflow:hidden;color:var(--ink)}
.chat-head{display:flex;justify-content:space-between;align-items:center;padding:12px 14px;border-bottom:1px solid var(--line);color:var(--gold);font-size:.9rem}
.chat-list{flex:1;overflow-y:auto;padding:10px;display:flex;flex-direction:column;gap:8px}
.chat-empty{margin:auto;text-align:center;font-size:.78rem;color:var(--mute);padding:20px}
.msg{max-width:86%;padding:7px 10px;border-radius:12px;background:var(--cell);border:1px solid var(--line);align-self:flex-start;font-size:.8rem}
.msg.mine{align-self:flex-end;background:rgba(var(--gl),.2);border-color:var(--gf2)}
.msg .who{font-weight:800;font-size:.74rem;color:var(--gold)}
.msg .tm{font-size:.74rem;color:var(--mute);margin-inline-start:6px}
.msg p{margin:2px 0 0;word-break:break-word;white-space:pre-wrap;line-height:1.4}
.chat-note{margin:0;padding:6px 12px;font-size:.74rem;color:var(--mute);text-align:center}
.chat-note.err{color:var(--err);font-weight:700}
.chat-form{display:flex;gap:8px;padding:6px 10px 10px}
.chat-form .btn{width:auto;padding:9px 14px}
.chat-form .btn:disabled{opacity:.45;cursor:not-allowed;transform:none}
@media (max-width:420px){.chat-panel{right:8px;width:calc(100vw - 16px)}}

/* ===== lexueshmëri: fonte të reja ===== */
html[lang="ar"]{--f-body:'Cairo Variable','Inter Variable',system-ui,sans-serif;--f-head:'Cairo Variable','Inter Variable',sans-serif}
h1,h2,h3,b,strong{font-synthesis:none}
.brand h1{font-size:1.32rem;letter-spacing:0;font-weight:700}
.hero-date{font-weight:700}
.modal h2{font-size:1.35rem;font-weight:700}
#ayahText{font-size:1.12rem;font-weight:600;line-height:1.5}
.ram-title{font-size:1.15rem}
/* numrat e vegjël: font i lexueshëm (Saira te numrat e mëdhenj) */
.cal-table td,#tomorrowGrid b,.xc b,.adj-ctl output,.wd span,.ev-in,.lb-list .rk,.lb-list .ct,.ram-times b,.acc-today,.tr-head b,.sun-row b,.ring-center .at,.cal-table td:first-child{
  font-family:var(--f-body);font-variant-numeric:tabular-nums;font-weight:800;letter-spacing:0}
.cal-table td{font-size:.78rem}
#tomorrowGrid b,.xc b{font-size:.84rem}
.xc span,#tomorrowGrid span{font-size:.74rem;font-weight:600}
.note,.srv-sub{font-size:.8rem}
.prayer .ar{font-size:1.15rem}
.prayer .ar em{font-size:.74rem;font-weight:600}
.sq,.prayer .sq{font-weight:700}
.act{font-size:.76rem;font-weight:700}
.btn{font-weight:700}
.chip,.chip small{font-weight:600}
/* bosh poshtë që ikona e chat-it të mos mbulojë përmbajtjen */
.app{padding-bottom:96px}
.ver{margin:6px 0 0;text-align:center;font-size:.7rem;color:var(--mute);opacity:.7}
.card-title{font-size:1rem;font-weight:800}
.srv .btn{margin-top:10px}
.srv .note{margin:8px 0}

/* ===== renditja: avatar me inicialet, emri bold, vaktet e vogla ===== */
.lb-list{gap:8px}
.lb-list li.lb-row{display:flex;align-items:center;gap:8px;padding:10px 10px;border-radius:16px;background:var(--cell);border:1px solid var(--line)}
.lb-list li.lb-row.me{border-color:var(--gf2);background:rgba(var(--gl),.16)}
.lb-list li.lb-empty{padding:14px;text-align:center;color:var(--mute);font-weight:600;border:1px dashed var(--line);border-radius:14px}
.lb-row .rk{min-width:24px;text-align:center;font-weight:800;font-size:.9rem;color:var(--gold)}
.lb-row .av{flex:none;width:40px;height:40px;border-radius:50%;display:grid;place-items:center;font-weight:800;font-size:.95rem;letter-spacing:.02em;
  color:var(--on-gold);background:linear-gradient(135deg,var(--gf1),var(--gf2));border:2px solid var(--gf2);text-transform:uppercase}
.lb-row .info{flex:1;min-width:0}
.lb-row .nm{display:block;font-size:1rem;font-weight:800;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lb-row .pst{margin-top:3px;display:flex;flex-wrap:wrap;gap:1px 9px;font-size:.74rem;font-weight:600;color:var(--mute);line-height:1.4}
.lb-row .pp{white-space:nowrap}
.lb-row .pp-ok{color:var(--ok);font-weight:700}
.lb-row .pp-bad{color:var(--err);font-weight:700}
.lb-row .pp-wait{opacity:.7}
.lb-row .ct{flex:none;min-width:26px;text-align:center;font-size:1.05rem;font-weight:800;color:var(--gold)}

/* ===== Saira: numrat e mëdhenj (ora, vaktet, numërimi) ===== */
.hero-time{letter-spacing:.01em;font-weight:800;font-size:clamp(1.9rem,8.6vw,3.5rem)}
.hero-time .sec{font-weight:700}
.prayer .tm{font-size:1.6rem;font-weight:700;letter-spacing:.01em;font-variant-numeric:tabular-nums}
.ring-center .cd{font-weight:700;font-size:clamp(1rem,4.6vw,1.7rem);letter-spacing:.01em}
.ram-count{font-weight:700;font-size:1.7rem}
.big-deg{font-weight:700}
.tasbih{font-weight:700}