/* ===== SURAH TITLE FONT ala Quran.com ===== */
@font-face{
  font-family:"SurahNamesQuranCom";
  src:
    url("https://cdn.jsdelivr.net/gh/quran/quran.com-fonts@master/public/fonts/surah_names/surah_names.ttf") format("truetype"),
    url("https://raw.githubusercontent.com/quran/quran.com-fonts/master/public/fonts/surah_names/surah_names.ttf") format("truetype");
  font-display:swap;
}

.mushaf-surah-ar{
  font-family:"SurahNamesQuranCom","UthmanicHafs","Noto Naskh Arabic","Traditional Arabic",serif!important;
  font-weight:400!important;
  font-size:1.16em!important;
  line-height:1.05!important;
  letter-spacing:0!important;
  transform:translateY(-1px);
}

/* Sedikit penyesuaian supaya proporsinya mirip contoh Quran.com */
body.preview-phone.mushaf-final-mode .mushaf-surah-ar{
  font-size:1.08em!important;
}
@media(max-width:560px){
  .mushaf-surah-ar{
    font-size:1.08em!important;
  }
}


:root{
  --green:#0d6b55;
  --green-2:#118064;
  --green-soft:#e8f5ef;
  --green-soft-2:#dff1ea;
  --bg:#f6f8f7;
  --card:#ffffff;
  --text:#1d2724;
  --muted:#6d7a76;
  --line:#e4eae7;
  --gold:#b98a2f;
  --danger:#b84545;
  --shadow:0 10px 30px rgba(12,57,46,.08);
  --radius:20px;
  --arabic-size:34px;
  --translate-size:15px;
  --safe-bottom:env(safe-area-inset-bottom,0px);
  --safe-top:env(safe-area-inset-top,0px);
}
[data-theme="dark"]{
  --bg:#111715;
  --card:#18211e;
  --text:#f1f6f4;
  --muted:#a5b1ad;
  --line:#2a3733;
  --green-soft:#173229;
  --green-soft-2:#1b3b31;
  --shadow:none;
}
*{box-sizing:border-box}
html{background:var(--bg);scroll-behavior:smooth}
body{
  margin:0;background:var(--bg);color:var(--text);
  font-family:"Nunito",system-ui,-apple-system,Segoe UI,sans-serif;
  -webkit-font-smoothing:antialiased;
}
button,input,select{font:inherit}
button,a{-webkit-tap-highlight-color:transparent}
a{color:inherit;text-decoration:none}
.hidden{display:none!important}
.app-shell{min-height:100dvh}
.topbar{
  position:sticky;top:0;z-index:40;
  min-height:72px;padding:calc(10px + var(--safe-top)) 16px 10px;
  display:flex;align-items:center;gap:12px;
  background:color-mix(in srgb,var(--card) 94%, transparent);
  backdrop-filter:blur(18px);border-bottom:1px solid var(--line);
}
.brand{display:flex;align-items:center;gap:10px;min-width:0;flex:1}
.brand-mark{
  width:42px;height:42px;border-radius:14px;display:grid;place-items:center;
  background:var(--green);color:#fff;font-weight:800;font-size:22px;
}
.brand strong{display:block;font-size:18px;line-height:1.1}
.brand span{display:block;color:var(--muted);font-size:11px;margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.icon-btn{
  border:0;background:var(--green-soft);color:var(--green);
  width:42px;height:42px;border-radius:14px;font-size:20px;cursor:pointer;
}
.view{
  width:min(100%,980px);margin:0 auto;
  padding:18px 16px calc(98px + var(--safe-bottom));
  outline:none;
}
.bottom-nav{
  position:fixed;z-index:50;left:50%;transform:translateX(-50%);
  bottom:0;width:min(100%,980px);
  display:grid;grid-template-columns:repeat(5,1fr);
  background:color-mix(in srgb,var(--card) 96%, transparent);
  backdrop-filter:blur(20px);border-top:1px solid var(--line);
  padding:7px 8px calc(7px + var(--safe-bottom));
}
.bottom-nav a{display:flex;flex-direction:column;align-items:center;gap:2px;color:var(--muted);font-size:10px;padding:6px 2px;border-radius:13px}
.bottom-nav a span{font-size:20px;line-height:1}
.bottom-nav a.active{color:var(--green);background:var(--green-soft)}
.page-title{font-size:27px;margin:2px 0 4px;font-weight:800}
.page-subtitle{color:var(--muted);margin:0 0 18px;font-size:14px}
.hero{
  overflow:hidden;position:relative;background:linear-gradient(135deg,var(--green),#0f8265);
  border-radius:26px;color:#fff;padding:20px;box-shadow:var(--shadow);
}
.hero:after{
  content:"";position:absolute;width:180px;height:180px;border-radius:50%;
  background:rgba(255,255,255,.07);right:-55px;bottom:-85px;
}
.hero-top{display:flex;justify-content:space-between;gap:10px;align-items:start}
.hero small{opacity:.82}
.hero h2{font-size:30px;margin:9px 0 0}
.hero .countdown{font-size:14px;font-weight:700;margin-top:4px}
.hero-meta{display:flex;gap:8px;flex-wrap:wrap;margin-top:15px}
.pill{display:inline-flex;align-items:center;gap:6px;padding:7px 10px;border-radius:999px;background:rgba(255,255,255,.13);font-size:12px}
.section-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:24px 2px 12px}
.section-head h3{margin:0;font-size:18px}
.link-btn{border:0;background:none;color:var(--green);font-weight:800;cursor:pointer}
.quick-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.quick{
  border:1px solid var(--line);background:var(--card);border-radius:18px;
  padding:13px 7px;min-height:92px;text-align:center;cursor:pointer;
  box-shadow:0 5px 20px rgba(16,50,42,.03)
}
.quick .qicon{
  width:42px;height:42px;margin:0 auto 7px;border-radius:14px;
  display:grid;place-items:center;background:var(--green-soft);color:var(--green);font-size:21px;font-weight:800;
}
.quick b{font-size:11px;line-height:1.25;display:block}
.searchbox{position:relative}
.searchbox input{
  width:100%;border:1px solid var(--line);background:var(--card);color:var(--text);
  padding:14px 44px 14px 16px;border-radius:18px;outline:none;
}
.searchbox input:focus{border-color:var(--green)}
.searchbox button{position:absolute;right:5px;top:5px;width:38px;height:38px;border:0;border-radius:13px;background:var(--green-soft);color:var(--green)}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:16px;box-shadow:var(--shadow)}
.news-list{display:grid;gap:12px}
.news-card{display:grid;grid-template-columns:96px 1fr;gap:12px;align-items:center;background:var(--card);border:1px solid var(--line);border-radius:18px;padding:9px;cursor:pointer}
.news-thumb{width:96px;height:76px;border-radius:14px;object-fit:cover;background:var(--green-soft)}
.news-card h4{font-size:14px;margin:3px 0 6px;line-height:1.3}
.meta{font-size:11px;color:var(--muted)}
.notice{padding:13px 14px;border-radius:15px;background:var(--green-soft);color:var(--green);font-size:13px}
.warning{background:#fff4df;color:#886114}
.error{background:#fdecec;color:var(--danger)}
.tabs{display:flex;gap:8px;overflow:auto;padding-bottom:4px}
.tab{
  border:1px solid var(--line);background:var(--card);color:var(--muted);
  padding:9px 13px;border-radius:13px;white-space:nowrap;font-weight:700;cursor:pointer;
}
.tab.active{background:var(--green);color:#fff;border-color:var(--green)}
.list{display:grid;gap:8px;margin-top:14px}
.list-item{
  width:100%;display:flex;align-items:center;justify-content:space-between;gap:12px;
  background:var(--card);border:1px solid var(--line);padding:13px 14px;border-radius:16px;cursor:pointer;color:var(--text);
}
.list-item .left{display:flex;align-items:center;gap:12px;min-width:0}
.num{width:36px;height:36px;flex:none;display:grid;place-items:center;border-radius:12px;background:var(--green-soft);color:var(--green);font-weight:800}
.list-item h4{margin:0;font-size:14px}
.list-item p{margin:2px 0 0;font-size:11px;color:var(--muted)}
.ar-name{font-family:"Noto Naskh Arabic","Traditional Arabic",serif;font-size:23px;color:var(--green)}
.reader-toolbar{
  position:sticky;top:76px;z-index:25;background:color-mix(in srgb,var(--bg) 92%,transparent);
  backdrop-filter:blur(12px);padding:7px 0 9px;display:flex;gap:8px;justify-content:space-between;align-items:center;
}
.reader-toolbar .group{display:flex;gap:6px}
.small-btn{border:1px solid var(--line);background:var(--card);color:var(--text);padding:8px 11px;border-radius:12px;font-weight:700;cursor:pointer}
.small-btn.active{background:var(--green);color:white;border-color:var(--green)}
.arabic{
  direction:rtl;text-align:right;font-family:"Noto Naskh Arabic","Traditional Arabic","Amiri",serif;
  font-size:var(--arabic-size);line-height:2.05;
}
.translation{font-size:var(--translate-size);line-height:1.7;color:var(--muted);margin-top:8px}
.ayah{
  border-bottom:1px solid var(--line);padding:18px 4px;cursor:pointer;
}
.ayah:last-child{border-bottom:0}
.ayah-no{display:inline-grid;place-items:center;min-width:32px;height:32px;border-radius:50%;background:var(--green-soft);color:var(--green);font-family:"Nunito";font-size:12px;direction:ltr;margin-left:6px}
.mushaf-wrap{overflow:hidden;border-radius:20px}
.mushaf-pages{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;direction:rtl;scrollbar-width:none}
.mushaf-pages::-webkit-scrollbar{display:none}
.mushaf-page{
  flex:0 0 100%;scroll-snap-align:start;background:var(--card);border:1px solid var(--line);
  border-radius:20px;padding:18px 18px 22px;min-height:65dvh;
}
.mushaf-head{display:flex;justify-content:space-between;direction:ltr;color:var(--muted);font-size:11px;border-bottom:1px solid var(--line);padding-bottom:8px;margin-bottom:10px}
.mushaf-page .arabic{text-align:justify;text-align-last:right}
.reader-footer{text-align:center;color:var(--muted);font-size:11px;margin-top:12px}
.category-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.category{
  min-height:132px;background:var(--card);border:1px solid var(--line);border-radius:22px;padding:17px;cursor:pointer;
}
.category .cat-icon{width:46px;height:46px;border-radius:15px;background:var(--green-soft);color:var(--green);display:grid;place-items:center;font-size:23px}
.category h3{margin:18px 0 3px;font-size:16px}
.category p{margin:0;color:var(--muted);font-size:11px}
.amaliyah-reader{max-width:760px;margin:auto}
.amaliyah-reader .arabic{text-align:right}
.progress-line{height:4px;background:var(--line);border-radius:999px;overflow:hidden}
.progress-line span{display:block;height:100%;background:var(--green);width:0}
.prayer-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.prayer-time{background:var(--card);border:1px solid var(--line);border-radius:17px;padding:14px}
.prayer-time.active{border-color:var(--green);background:var(--green-soft)}
.prayer-time b{display:block;font-size:18px;color:var(--green);margin-top:4px}
.compass-wrap{display:grid;place-items:center;padding:18px 0}
.compass{
  width:min(76vw,340px);aspect-ratio:1;border:8px solid var(--green-soft-2);border-radius:50%;
  position:relative;background:radial-gradient(circle,var(--card) 0 58%,var(--green-soft) 59% 60%,var(--card) 61%);
  box-shadow:var(--shadow);
}
.compass:before,.compass:after{content:"";position:absolute;background:var(--line)}
.compass:before{width:2px;height:90%;left:50%;top:5%}
.compass:after{height:2px;width:90%;top:50%;left:5%}
.qibla-arrow{
  position:absolute;left:50%;top:50%;width:8px;height:42%;background:linear-gradient(var(--gold),var(--green));
  transform-origin:50% 100%;transform:translate(-50%,-100%) rotate(0deg);border-radius:999px;z-index:4;
}
.qibla-arrow:before{content:"◆";position:absolute;top:-18px;left:50%;transform:translateX(-50%);color:var(--gold);font-size:24px}
.compass-label{position:absolute;font-weight:800;color:var(--muted);z-index:3}
.north{top:8px;left:50%;transform:translateX(-50%)}
.east{right:10px;top:50%;transform:translateY(-50%)}
.south{bottom:8px;left:50%;transform:translateX(-50%)}
.west{left:10px;top:50%;transform:translateY(-50%)}
.calendar-today-card{display:flex;align-items:center;gap:13px;margin-bottom:12px;background:linear-gradient(135deg,var(--green-soft),var(--card))}
.calendar-today-icon{width:46px;height:46px;border-radius:15px;background:var(--green);color:#fff;display:grid;place-items:center;font-size:21px;flex:0 0 auto}
.calendar-today-card small,.calendar-today-card b,.calendar-today-card span{display:block}
.calendar-today-card small{color:var(--muted);font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.06em}
.calendar-today-card b{font-size:15px;margin:2px 0}
.calendar-today-card div>span{font-size:12px;color:var(--muted)}
.calendar-card{overflow:hidden}
.calendar-head{display:flex;align-items:center;justify-content:space-between;gap:10px}
.calendar-head-title{text-align:center;min-width:0}
.calendar-head-title>b{display:block;font-size:17px;text-transform:capitalize}
.calendar-head-title .meta{font-size:11px;margin-top:2px}
.calendar-nav-btn{width:38px;height:38px;display:grid;place-items:center;padding:0;flex:0 0 auto}
.calendar-toolbar{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:12px;padding-top:10px;border-top:1px solid var(--line);flex-wrap:wrap}
.calendar-toolbar>span{display:flex;align-items:center;gap:5px;color:var(--muted);font-size:9px;white-space:nowrap;flex-wrap:wrap;justify-content:flex-end}.calendar-legend{margin-left:auto}
.calendar-today-btn{border:0;background:var(--green-soft);color:var(--green);font-size:10px;font-weight:800;border-radius:10px;padding:7px 9px;cursor:pointer}
.cal-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px;margin-top:12px}
.cal-dow{text-align:center;color:var(--muted);font-size:10px;font-weight:800;padding:4px 1px}
.cal-day{position:relative;min-width:0;min-height:64px;border:1px solid var(--line);background:var(--card);color:var(--text);border-radius:13px;padding:7px 6px;text-align:left;cursor:pointer;transition:border-color .15s,background .15s,transform .15s}
.cal-day:hover{border-color:color-mix(in srgb,var(--green) 45%,var(--line))}
.cal-day.muted{opacity:.38}
.cal-day.today{background:var(--green-soft);border-color:color-mix(in srgb,var(--green) 42%,var(--line));color:var(--text)}
.cal-day.selected{outline:2px solid var(--green);outline-offset:-2px}
.cal-day.today.selected{background:var(--green);color:#fff;border-color:var(--green)}
.cal-day>b{font-size:13px;line-height:1}
.cal-day .hijri{font-size:8px;color:var(--muted);display:block;margin-top:5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cal-day.today.selected .hijri{color:rgba(255,255,255,.82)}
.cal-event-dots{display:flex;gap:3px;position:absolute;left:7px;bottom:7px}
.cal-dot{width:6px;height:6px;border-radius:50%;display:inline-block;flex:0 0 auto}
.cal-dot.national{background:var(--danger)}
.cal-dot.islamic{background:var(--gold)}
.cal-dot.nu{background:var(--green)}
.cal-dot.agenda,.cal-dot.ansor{background:#3c78b6}
.cal-day.today.selected .cal-dot.nu,.cal-day.today.selected .cal-dot.agenda,.cal-day.today.selected .cal-dot.ansor{box-shadow:0 0 0 1px rgba(255,255,255,.85)}
.cal-day.has-holiday:not(.selected)>b{color:var(--danger)}
.calendar-note{display:flex;gap:9px;align-items:flex-start;color:var(--muted);font-size:10px;line-height:1.45;padding:10px 4px 0}
.calendar-note i{color:var(--green);margin-top:1px}
.day-detail-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.day-detail-head>b,.day-detail-head div>b{display:block;font-size:15px}
.calendar-today-badge{font-size:9px;font-weight:800;color:var(--green);background:var(--green-soft);border-radius:99px;padding:5px 8px;white-space:nowrap}
.day-detail-label{font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin-top:14px;padding-top:12px;border-top:1px solid var(--line)}
.day-event-list{display:grid;gap:8px;margin-top:12px}
.day-event{display:flex;gap:10px;align-items:flex-start;border-radius:14px;padding:10px 11px;background:var(--bg);border:1px solid var(--line)}
.day-event>span{width:32px;height:32px;border-radius:11px;display:grid;place-items:center;flex:0 0 auto}
.day-event.national>span{background:color-mix(in srgb,var(--danger) 11%,var(--card));color:var(--danger)}
.day-event.islamic>span{background:color-mix(in srgb,var(--gold) 14%,var(--card));color:var(--gold)}
.day-event.nu>span{background:var(--green-soft);color:var(--green)}
.day-event.agenda>span,.day-event.ansor>span{background:color-mix(in srgb,#3c78b6 11%,var(--card));color:#3c78b6}
.calendar-event-badge{display:inline-flex;margin:5px 0 0;padding:3px 7px;border-radius:999px;font-size:8px;font-style:normal;font-weight:850;line-height:1.2}
.calendar-event-badge.holiday{background:color-mix(in srgb,var(--danger) 11%,var(--card));color:var(--danger)}
.calendar-event-badge.leave{background:color-mix(in srgb,#8b5bb5 11%,var(--card));color:#74459d}
.day-event b{display:block;font-size:12px}
.day-event small{display:block;color:var(--muted);font-size:9px;margin-top:2px}
.day-event p{font-size:10px;color:var(--muted);margin:5px 0 0;line-height:1.45}
.calendar-empty-inline{display:flex;gap:8px;align-items:center;color:var(--muted);font-size:10px;margin-top:9px}
.calendar-empty-inline i{color:var(--green)}
.calendar-agenda-list{display:grid;gap:9px}
.calendar-empty{display:flex;align-items:center;gap:12px;color:var(--muted)}
.calendar-empty>i{font-size:24px;color:var(--green)}
.calendar-empty b{display:block;color:var(--text);font-size:12px}
.calendar-empty p{font-size:10px;margin:3px 0 0}
.agenda-card{width:100%;border:1px solid var(--line);display:flex;align-items:center;gap:11px;text-align:left;cursor:pointer;color:var(--text)}
.agenda-date{width:46px;height:46px;border-radius:14px;background:var(--green-soft);color:var(--green);display:grid;place-items:center;align-content:center;flex:0 0 auto}
.agenda-date b{font-size:17px;line-height:1}
.agenda-date small{font-size:8px;text-transform:uppercase;margin-top:3px}
.agenda-copy{flex:1;min-width:0}
.agenda-copy b{display:block;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.agenda-copy small{display:block;color:var(--muted);font-size:9px;margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dot{width:5px;height:5px;border-radius:50%;background:var(--gold);display:block;margin-top:4px}
.setting-group{display:grid;gap:10px;margin-bottom:18px}
.setting-row{display:flex;align-items:center;justify-content:space-between;gap:12px;background:var(--card);border:1px solid var(--line);border-radius:16px;padding:13px 14px}
.setting-row small{display:block;color:var(--muted)}
.setting-row select{max-width:150px;border:1px solid var(--line);background:var(--bg);color:var(--text);border-radius:10px;padding:7px}
.sheet-backdrop{position:fixed;inset:0;z-index:90;background:rgba(0,0,0,.35);display:flex;align-items:flex-end;justify-content:center}
.sheet{width:min(100%,760px);max-height:82dvh;overflow:auto;background:var(--card);border-radius:26px 26px 0 0;padding:18px 18px calc(22px + var(--safe-bottom));box-shadow:0 -20px 60px rgba(0,0,0,.2)}
.sheet-handle{width:48px;height:5px;border-radius:99px;background:var(--line);margin:0 auto 14px}
.sheet h3{margin:0 0 10px}
.tafsir-list{display:grid;gap:7px}
.tafsir-option{border:1px solid var(--line);background:var(--card);color:var(--text);padding:11px;border-radius:14px;display:flex;justify-content:space-between;gap:10px;cursor:pointer;text-align:left}
.tafsir-option b{color:var(--text)}
.tafsir-option .meta{color:var(--muted)}
.badge{font-size:9px;padding:4px 7px;border-radius:99px;background:var(--green-soft);color:var(--green);height:max-content}
.badge.soon{background:#fff4df;color:#886114}
[data-theme="dark"] .sheet .tafsir-option{background:#1c2924;border-color:#33463f;color:#f1f6f4}
[data-theme="dark"] .sheet .tafsir-option b{color:#f1f6f4}
[data-theme="dark"] .sheet .tafsir-option .meta{color:#aebbb6}
[data-theme="dark"] .sheet .section-head h3,[data-theme="dark"] .sheet>h3{color:#f1f6f4}

.article img{max-width:100%;height:auto;border-radius:16px}
.article{line-height:1.75}
.article h1,.article h2,.article h3{line-height:1.3}
.toast{position:fixed;z-index:120;left:50%;bottom:calc(90px + var(--safe-bottom));transform:translate(-50%,20px);opacity:0;pointer-events:none;background:#17211e;color:#fff;padding:10px 14px;border-radius:12px;font-size:12px;transition:.25s;max-width:88vw;text-align:center}
.toast.show{opacity:1;transform:translate(-50%,0)}
.empty{text-align:center;padding:36px 16px;color:var(--muted)}
.spinner{width:30px;height:30px;border:3px solid var(--line);border-top-color:var(--green);border-radius:50%;animation:spin .8s linear infinite;margin:28px auto}
@keyframes spin{to{transform:rotate(360deg)}}

@media (max-width:560px){
  .calendar-today-card{padding:13px}
  .calendar-toolbar{align-items:center;gap:7px}
  .calendar-toolbar>span{font-size:7.5px;gap:4px;white-space:normal}
  .calendar-legend{width:100%;justify-content:center!important;margin-left:0!important;padding-top:2px}
  .cal-grid{gap:4px}
  .cal-day{min-height:57px;border-radius:11px;padding:6px 5px}
  .cal-day>b{font-size:12px}
  .cal-day .hijri{font-size:7px;margin-top:4px}
  .cal-event-dots{left:6px;bottom:6px}
  .cal-dot{width:5px;height:5px}
}

@media (min-width:700px){
  .view{padding-left:26px;padding-right:26px}
  .quick-grid{grid-template-columns:repeat(8,minmax(0,1fr))}
  .category-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
  .prayer-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
  .news-list{grid-template-columns:repeat(3,1fr)}
  .news-card{grid-template-columns:1fr;align-items:start}
  .news-thumb{width:100%;height:140px}
}
@media (max-width:370px){
  :root{--arabic-size:30px}
  .quick-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:7px}
  .quick{padding-left:3px;padding-right:3px}
  .quick .qicon{width:38px;height:38px}
}


/* Preview HP dari laptop/desktop */
.device-preview-tools{
  position:fixed;z-index:160;right:18px;top:18px;
  display:flex;gap:7px;padding:6px;
  border:1px solid var(--line);border-radius:15px;
  background:color-mix(in srgb,var(--card) 96%,transparent);
  box-shadow:var(--shadow);backdrop-filter:blur(16px)
}
.device-preview-tools button{
  border:0;background:transparent;color:var(--muted);
  border-radius:10px;padding:8px 10px;cursor:pointer;
  display:flex;align-items:center;gap:6px;
  font-weight:800;font-size:11px
}
.device-preview-tools button i{font-size:15px}
.device-preview-tools button.active{background:var(--green);color:#fff}

body.preview-phone{
  overflow:hidden;padding:18px 0;background:#dfe5e2
}
body.preview-phone .app-shell{
  position:relative;
  width:390px;max-width:calc(100vw - 24px);
  height:min(844px,calc(100dvh - 36px));
  margin:0 auto;overflow-y:auto;overflow-x:hidden;
  background:var(--bg);
  border:8px solid #202725;border-radius:30px;
  box-shadow:0 25px 70px rgba(0,0,0,.25);
  scrollbar-width:none
}
body.preview-phone .app-shell::-webkit-scrollbar{display:none}
body.preview-phone .topbar{top:0}
body.preview-phone .view{
  width:100%;padding-left:16px;padding-right:16px
}
body.preview-phone .quick-grid{
  grid-template-columns:repeat(4,minmax(0,1fr))
}
body.preview-phone .category-grid{
  grid-template-columns:repeat(2,minmax(0,1fr))
}
body.preview-phone .prayer-grid{
  grid-template-columns:repeat(2,minmax(0,1fr))
}
body.preview-phone .news-list{
  grid-template-columns:1fr
}
body.preview-phone .news-card{
  grid-template-columns:96px 1fr;align-items:center
}
body.preview-phone .news-thumb{
  width:96px;height:76px
}
body.preview-phone .bottom-nav{
  width:390px;max-width:calc(100vw - 24px);
  bottom:18px
}

/* Preview HP: bottom navigation menjadi bagian tetap dari bingkai perangkat.
   Scroll hanya terjadi di area konten, jadi tidak ada konten yang terlihat
   di bawah nav dan nav tidak tampak mengambang saat Beranda di-scroll. */
body.preview-phone.bottom-nav-visible .app-shell{
  display:flex;
  flex-direction:column;
  overflow:hidden!important;
}
body.preview-phone.bottom-nav-visible .topbar{
  position:relative;
  top:auto;
  flex:0 0 auto;
}
body.preview-phone.bottom-nav-visible .view{
  flex:1 1 auto;
  min-height:0;
  overflow-y:auto;
  overflow-x:hidden;
  overscroll-behavior:contain;
  padding-bottom:24px;
  scrollbar-width:none;
}
body.preview-phone.bottom-nav-visible .view::-webkit-scrollbar{display:none}
body.preview-phone.bottom-nav-visible .bottom-nav{
  position:relative;
  left:auto;
  transform:none;
  bottom:auto;
  width:100%;
  max-width:none;
  flex:0 0 auto;
}
body.preview-phone .sheet-backdrop{
  width:390px;max-width:calc(100vw - 24px);
  left:50%;right:auto;top:18px;bottom:18px;
  transform:translateX(-50%);
  border-radius:22px;overflow:hidden
}
body.preview-phone .toast{bottom:102px}

@media(max-width:1023px){
  .device-preview-tools{display:none}
}

/* Penyempurnaan tampilan awal surah pada Mode Mushaf */
.mushaf-surah-title{\n  margin:8px 0 4px;padding:8px 14px;text-align:center;\n  border:1px solid var(--line);border-radius:13px;background:var(--green-soft);\n  color:var(--green)\n}
.mushaf-surah-title span{\n  display:block;direction:rtl;font-family:"Noto Naskh Arabic","Traditional Arabic",serif;\n  font-size:24px;font-weight:700;line-height:1.35\n}
.mushaf-surah-title small{display:block;font-size:10px;color:var(--muted);margin-top:1px}
.mushaf-basmala{\n  display:block;text-align:center;direction:rtl;\n  font-family:"Noto Naskh Arabic","Traditional Arabic",serif;\n  font-size:calc(var(--arabic-size) * .92);line-height:1.8;\n  padding:9px 2px 12px;margin-bottom:2px\n}
.mushaf-text{\n  text-align:justify;text-align-last:right;line-height:2.05;word-spacing:.04em\n}
.mushaf-ayah-text{display:inline}

.bi{line-height:1;vertical-align:-.08em}
.qicon .bi,.cat-icon .bi{font-size:1em}
.bottom-nav .bi{font-size:20px}


/* Navigasi Mushaf: swipe HP + drag/tombol laptop */
.mushaf-shell{
  position:relative;display:grid;grid-template-columns:44px minmax(0,760px) 44px;
  align-items:center;justify-content:center;gap:10px;margin:0 auto
}
.mushaf-wrap{
  width:100%;max-width:760px;margin:0 auto;overflow:hidden;border-radius:20px
}
.mushaf-pages{
  direction:ltr;cursor:grab;overscroll-behavior-x:contain;
  touch-action:pan-x;scroll-behavior:smooth
}
.mushaf-pages.dragging{cursor:grabbing;scroll-snap-type:none}
.mushaf-page{
  direction:rtl;min-width:100%;width:100%;max-width:760px
}
.mushaf-nav-btn{
  width:42px;height:58px;border:1px solid var(--line);border-radius:16px;
  background:var(--card);color:var(--green);font-size:22px;
  display:grid;place-items:center;cursor:pointer;box-shadow:var(--shadow)
}
.mushaf-nav-btn:disabled{opacity:.28;cursor:not-allowed}
.mushaf-page-status{
  text-align:center;color:var(--muted);font-size:11px;margin:9px 0 2px
}
@media(max-width:820px){
  .mushaf-shell{display:block}
  .mushaf-nav-btn{
    position:absolute;z-index:9;top:50%;transform:translateY(-50%);
    width:36px;height:48px;background:color-mix(in srgb,var(--card) 88%,transparent)
  }
  .mushaf-prev{left:6px}.mushaf-next{right:6px}
}
body.preview-phone .mushaf-shell{display:block}
body.preview-phone .mushaf-wrap{max-width:none}
body.preview-phone .mushaf-nav-btn{
  position:absolute;z-index:9;top:50%;transform:translateY(-50%);
  width:34px;height:46px
}
body.preview-phone .mushaf-prev{left:5px}
body.preview-phone .mushaf-next{right:5px}
\n/* Fix Mushaf preview: tinggi perangkat tidak boleh memanjang ketika di-scroll */\nbody.preview-phone .app-shell{min-height:0!important}\nbody.preview-phone.quran-reader-route .app-shell{overflow:hidden}\nbody.preview-phone.quran-reader-route .view{\n  height:calc(100% - 66px);overflow:hidden;\n  padding-top:8px;padding-bottom:8px\n}\nbody.preview-phone.quran-reader-route .reader-toolbar{\n  top:0;position:relative;padding:4px 0 7px;gap:5px\n}\nbody.preview-phone.quran-reader-route .reader-title{min-width:0;max-width:95px}\nbody.preview-phone.quran-reader-route .reader-title b{font-size:11px}\nbody.preview-phone.quran-reader-route .reader-title .meta{font-size:7px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}\nbody.preview-phone.quran-reader-route .reader-actions{gap:3px;flex-wrap:nowrap}\nbody.preview-phone.quran-reader-route .reader-actions .small-btn{padding:6px 7px;font-size:9px}\nbody.preview-phone.quran-reader-route #qreader{height:calc(100% - 54px);overflow:hidden}\nbody.preview-phone.quran-reader-route .mushaf-shell{height:calc(100% - 22px)}\nbody.preview-phone.quran-reader-route .mushaf-wrap,\nbody.preview-phone.quran-reader-route .mushaf-pages,\nbody.preview-phone.quran-reader-route .mushaf-page{height:100%}\nbody.preview-phone.quran-reader-route .mushaf-page{\n  min-height:0;overflow:hidden;padding:8px 9px 10px;border-radius:10px\n}\nbody.preview-phone.quran-reader-route .mushaf-head{font-size:7px;padding-bottom:3px;margin-bottom:4px}\nbody.preview-phone.quran-reader-route .mushaf-surah-title{margin:3px 0 1px;padding:3px 6px}\nbody.preview-phone.quran-reader-route .mushaf-surah-title span{font-size:15px}\nbody.preview-phone.quran-reader-route .mushaf-surah-title small{font-size:6px}\nbody.preview-phone.quran-reader-route .mushaf-basmala{font-size:21px;line-height:1.5;padding:4px 0 5px}\nbody.preview-phone.quran-reader-route .mushaf-text{font-size:20px;line-height:1.7}\nbody.preview-phone.quran-reader-route .ayah-no{min-width:21px;height:21px;font-size:8px;margin-left:3px}\nbody.preview-phone.quran-reader-route .reader-footer{font-size:7px;margin-top:4px}\nbody.preview-phone.quran-reader-route .mushaf-page-status{font-size:8px;margin:3px 0 0}\nbody.preview-phone.quran-reader-route .mushaf-nav-btn{display:none!important}\n.mushaf-top-nav:disabled{opacity:.28}\n

/* ===== Mode Mushaf fisik QCF V2 ===== */
@font-face{
  font-family:"UthmanicHafs";
  src:url("https://verses.quran.foundation/fonts/quran/hafs/uthmanic_hafs/UthmanicHafs1Ver18.woff2") format("woff2");
  font-display:swap;
}
:root{--mushaf-zoom:1}
.uthmanic-font{font-family:"UthmanicHafs","Noto Naskh Arabic","Traditional Arabic",serif}
body.physical-mushaf-mode{overscroll-behavior:none}
body.physical-mushaf-mode .view{max-width:none}
.mushaf-stage{
  display:grid;place-items:center;
  width:100%;min-height:calc(100dvh - 150px);
  padding:8px 4px 2px;
  overflow:hidden;
  touch-action:pan-y;
}
.mushaf-book-page{
  container-type:inline-size;
  width:min(100%,690px);
  height:min(calc(100dvh - 168px),850px);
  min-height:590px;
  display:grid;
  grid-template-rows:auto minmax(0,1fr) auto;
  background:#fffef7;color:#121714;
  border:1px solid #dedbd0;
  box-shadow:0 12px 34px rgba(33,40,36,.10);
  padding:18px 23px 13px;
  transform:scale(var(--mushaf-zoom));
  transform-origin:center top;
  border-radius:3px;
  overflow:hidden;
}
[data-theme="dark"] .mushaf-book-page{
  background:#f7f3e8;color:#141713;border-color:#77756e
}
.physical-mushaf-head{
  direction:ltr;
  display:flex;justify-content:space-between;align-items:center;
  gap:16px;
  font-family:"Nunito",sans-serif;
  color:#3f423f;
  font-size:clamp(11px,2.5cqw,16px);
  padding:0 3px 12px;
  white-space:nowrap;
  letter-spacing:.005em;
}
.mushaf-15-lines{
  direction:rtl;
  min-height:0;
  display:grid;
  grid-template-rows:repeat(15,minmax(0,1fr));
  align-items:center;
}
.mushaf-fixed-line{
  min-width:0;
  width:100%;
  display:flex;
  flex-direction:row;
  direction:rtl;
  justify-content:center;
  align-items:center;
  column-gap:.10em;
  white-space:nowrap;
  overflow:hidden;
  font-size:34px;
  line-height:1;
}
.mushaf-fixed-line.special{overflow:visible}
.mushaf-fixed-line.empty{visibility:hidden}
.qcf-word,.qcf-end{
  appearance:none;-webkit-appearance:none;
  border:0;background:none;color:inherit;
  padding:0;margin:0;
  font-size:1em;line-height:1;
  cursor:pointer;white-space:nowrap;
}
.qcf-word:hover,.qcf-end:hover{color:var(--green)}
.qcf-end{font-family:"UthmanicHafs","Noto Naskh Arabic",serif}
.mushaf-surah-banner{
  width:92%;height:82%;
  margin:auto;
  display:flex;align-items:center;justify-content:center;
  position:relative;
  border:2px solid #222;border-radius:4px;
  font-family:"UthmanicHafs","Noto Naskh Arabic",serif;
  font-size:.78em;
  background:
    linear-gradient(90deg,transparent 0 9%,rgba(0,0,0,.035) 9% 12%,transparent 12% 88%,rgba(0,0,0,.035) 88% 91%,transparent 91%);
}
.mushaf-surah-banner:before,.mushaf-surah-banner:after{
  content:"✦";
  position:absolute;top:50%;transform:translateY(-50%);
  width:12%;text-align:center;font-family:serif;font-size:.62em;color:#333
}
.mushaf-surah-banner:before{right:1%}
.mushaf-surah-banner:after{left:1%}
.mushaf-surah-banner span{
  position:relative;z-index:1;
  padding:.03em 2.2em;
  background:#fffef7;
  border-left:1px solid #333;border-right:1px solid #333;
}
.mushaf-surah-banner.compact{
  height:96%;flex-direction:column;line-height:1.05
}
.mushaf-surah-banner.compact small{display:block;font-size:.5em;margin-top:.1em}
.mushaf-basmala{
  width:100%;text-align:center;
  direction:rtl;
  font-size:.93em;
  line-height:1;
  white-space:nowrap;
}
.physical-mushaf-footer{
  text-align:center;
  font-family:Georgia,"Times New Roman",serif;
  color:#50524f;
  font-size:clamp(13px,2.8cqw,18px);
  padding-top:9px;
}
.mushaf-swipe-hint{
  text-align:center;color:var(--muted);
  font-size:10px;margin-top:4px
}
.mushaf-stage.slide-next .mushaf-book-page{animation:nuhaPageNext .18s ease-out}
.mushaf-stage.slide-prev .mushaf-book-page{animation:nuhaPagePrev .18s ease-out}
@keyframes nuhaPageNext{from{opacity:.55;transform:translateX(-18px) scale(var(--mushaf-zoom))}to{opacity:1;transform:translateX(0) scale(var(--mushaf-zoom))}}
@keyframes nuhaPagePrev{from{opacity:.55;transform:translateX(18px) scale(var(--mushaf-zoom))}to{opacity:1;transform:translateX(0) scale(var(--mushaf-zoom))}}

body.preview-phone.physical-mushaf-mode .app-shell{overflow:hidden}
body.preview-phone.physical-mushaf-mode .view{
  height:calc(100% - 64px);
  padding:5px 7px 4px;
  overflow:hidden;
}
body.preview-phone.physical-mushaf-mode .reader-toolbar{
  position:relative;top:0;
  min-height:43px;
  padding:2px 0 5px;
}
body.preview-phone.physical-mushaf-mode .reader-title{max-width:87px}
body.preview-phone.physical-mushaf-mode .reader-title b{font-size:10px}
body.preview-phone.physical-mushaf-mode .reader-title .meta{font-size:6px}
body.preview-phone.physical-mushaf-mode .reader-actions{gap:2px}
body.preview-phone.physical-mushaf-mode .reader-actions .small-btn{
  padding:5px 6px;font-size:8px;border-radius:8px
}
body.preview-phone.physical-mushaf-mode #qreader{
  height:calc(100% - 47px);
  overflow:hidden;
}
body.preview-phone.physical-mushaf-mode .mushaf-stage{
  min-height:0;height:calc(100% - 12px);padding:1px 0
}
body.preview-phone.physical-mushaf-mode .mushaf-book-page{
  width:100%;
  height:100%;
  min-height:0;
  padding:10px 12px 8px;
  transform:none;
}
body.preview-phone.physical-mushaf-mode .physical-mushaf-head{
  font-size:7px;padding-bottom:5px
}
body.preview-phone.physical-mushaf-mode .mushaf-fixed-line{
  font-size:21px
}
body.preview-phone.physical-mushaf-mode .physical-mushaf-footer{
  font-size:9px;padding-top:4px
}
body.preview-phone.physical-mushaf-mode .mushaf-swipe-hint{
  display:none
}

@media(max-width:560px){
  body:not(.preview-phone) .mushaf-book-page{
    width:100%;height:calc(100dvh - 155px);min-height:540px;
    padding:13px 15px 9px
  }
  body:not(.preview-phone) .physical-mushaf-head{font-size:9px;padding-bottom:7px}
  body:not(.preview-phone) .mushaf-fixed-line{font-size:clamp(18px,6.4cqw,27px)}
}

.qcf-ready{
  font-variant-ligatures:normal;
  text-rendering:optimizeLegibility;
}
.qcf-word,.qcf-end{
  flex:0 0 auto;
  min-width:0;
}


/* ===== FIX FINAL MODE MUSHAF VERSI 1 =====
   - satu halaman penuh di layar
   - scroll vertikal tidak mengganti halaman
   - tombol kiri/kanan selalu klik
   - swipe hanya horizontal
*/
body.physical-mushaf-mode{
  overflow:hidden!important;
}
body.physical-mushaf-mode .view{
  height:calc(100dvh - 74px)!important;
  padding-top:8px!important;
  padding-bottom:8px!important;
  overflow:hidden!important;
}
body.physical-mushaf-mode .reader-toolbar{
  position:relative!important;
  top:auto!important;
  height:58px;
  min-height:58px;
  margin:0 auto 6px;
  width:min(100%,1000px);
}
body.physical-mushaf-mode #qreader{
  height:calc(100% - 64px)!important;
  min-height:0!important;
  overflow:hidden!important;
}
body.physical-mushaf-mode .mushaf-stage{
  width:100%;
  height:calc(100% - 16px)!important;
  min-height:0!important;
  padding:0!important;
  overflow:hidden!important;
  touch-action:pan-y!important;
}
body.physical-mushaf-mode .mushaf-book-page{
  height:100%!important;
  width:auto!important;
  max-width:min(96vw,720px)!important;
  aspect-ratio:0.665 / 1;
  min-height:0!important;
  margin:0 auto!important;
  padding:14px 20px 10px!important;
  transform:scale(var(--mushaf-zoom))!important;
  transform-origin:center center!important;
}
body.physical-mushaf-mode .physical-mushaf-head{
  font-size:clamp(10px,1.2vw,15px)!important;
  padding-bottom:7px!important;
}
body.physical-mushaf-mode .mushaf-15-lines{
  min-height:0!important;
  height:100%!important;
  grid-template-rows:repeat(15,minmax(0,1fr))!important;
}
body.physical-mushaf-mode .mushaf-fixed-line{
  overflow:hidden!important;
  line-height:1!important;
}
body.physical-mushaf-mode .physical-mushaf-footer{
  padding-top:4px!important;
}
body.physical-mushaf-mode .mushaf-swipe-hint{
  height:12px;
  margin:2px 0 0!important;
  line-height:12px;
}
body.physical-mushaf-mode .mushaf-top-nav{
  pointer-events:auto!important;
  position:relative!important;
  z-index:30!important;
}
body.physical-mushaf-mode .mushaf-stage.swiping .mushaf-book-page{
  transform:translateX(var(--swipe-x,0px)) scale(var(--mushaf-zoom))!important;
  transition:none!important;
}

/* Preview HP: tetap muat satu halaman penuh */
body.preview-phone.physical-mushaf-mode .view{
  height:calc(100% - 64px)!important;
  padding:4px 6px!important;
}
body.preview-phone.physical-mushaf-mode .reader-toolbar{
  height:45px!important;
  min-height:45px!important;
  margin-bottom:3px!important;
}
body.preview-phone.physical-mushaf-mode #qreader{
  height:calc(100% - 48px)!important;
}
body.preview-phone.physical-mushaf-mode .mushaf-stage{
  height:calc(100% - 2px)!important;
}
body.preview-phone.physical-mushaf-mode .mushaf-book-page{
  height:100%!important;
  width:auto!important;
  max-width:100%!important;
  padding:8px 10px 6px!important;
  transform:none!important;
}
body.preview-phone.physical-mushaf-mode .mushaf-swipe-hint{
  display:none!important;
}


/* ===== FULLSCREEN MUSHAF PATCH - VERSI 1 ===== */
body.quran-reader-route.mushaf-fullscreen .topbar{
  display:none!important;
}
body.quran-reader-route.mushaf-fullscreen .view{
  height:100dvh!important;
  width:100%!important;
  max-width:none!important;
  margin:0!important;
  padding:0!important;
  overflow:hidden!important;
}
body.quran-reader-route.mushaf-fullscreen .reader-toolbar{
  position:fixed!important;
  z-index:70!important;
  top:10px!important;
  left:50%!important;
  transform:translateX(-50%)!important;
  width:min(calc(100% - 20px),720px)!important;
  height:48px!important;
  min-height:48px!important;
  padding:5px 7px!important;
  margin:0!important;
  border:1px solid rgba(0,0,0,.08);
  border-radius:15px!important;
  background:color-mix(in srgb,var(--card) 90%,transparent)!important;
  box-shadow:0 8px 24px rgba(0,0,0,.08)!important;
}
body.quran-reader-route.mushaf-fullscreen .reader-title{
  max-width:150px!important;
}
body.quran-reader-route.mushaf-fullscreen .reader-title b{
  font-size:12px!important;
}
body.quran-reader-route.mushaf-fullscreen .reader-title .meta{
  font-size:8px!important;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
body.quran-reader-route.mushaf-fullscreen .reader-actions{
  flex-wrap:nowrap!important;
  gap:4px!important;
}
body.quran-reader-route.mushaf-fullscreen .reader-actions .small-btn{
  padding:6px 8px!important;
  font-size:10px!important;
  border-radius:10px!important;
}
body.quran-reader-route.mushaf-fullscreen #qreader{
  height:100dvh!important;
  width:100%!important;
  padding:64px 6px 6px!important;
  overflow:hidden!important;
}
body.quran-reader-route.mushaf-fullscreen .mushaf-stage{
  height:100%!important;
  min-height:0!important;
  padding:0!important;
  display:grid!important;
  place-items:center!important;
  overflow:hidden!important;
}
body.quran-reader-route.mushaf-fullscreen .mushaf-book-page{
  width:auto!important;
  height:100%!important;
  max-height:100%!important;
  max-width:100%!important;
  aspect-ratio:0.665/1!important;
  min-height:0!important;
  margin:0 auto!important;
  padding:14px 16px 12px!important;
  transform:none!important;
  overflow:hidden!important;
}
body.quran-reader-route.mushaf-fullscreen .mushaf-15-lines{
  height:100%!important;
  min-height:0!important;
  grid-template-rows:repeat(15,minmax(0,1fr))!important;
  overflow:hidden!important;
}
body.quran-reader-route.mushaf-fullscreen .mushaf-fixed-line{
  min-height:0!important;
  overflow:visible!important;
  line-height:1.18!important;
  padding-bottom:1px!important;
  align-items:center!important;
}
body.quran-reader-route.mushaf-fullscreen .mushaf-surah-banner{
  max-height:90%!important;
}
body.quran-reader-route.mushaf-fullscreen .physical-mushaf-head{
  font-size:clamp(9px,1.2vw,14px)!important;
  padding-bottom:5px!important;
}
body.quran-reader-route.mushaf-fullscreen .physical-mushaf-footer{
  font-size:12px!important;
  padding-top:3px!important;
}
body.quran-reader-route.mushaf-fullscreen .mushaf-swipe-hint{
  display:none!important;
}

/* Preview HP: isi memenuhi bingkai perangkat, tanpa sisa header aplikasi */
body.preview-phone.quran-reader-route.mushaf-fullscreen .app-shell{
  overflow:hidden!important;
}
body.preview-phone.quran-reader-route.mushaf-fullscreen .view{
  height:100%!important;
}
body.preview-phone.quran-reader-route.mushaf-fullscreen #qreader{
  height:100%!important;
  padding:55px 4px 4px!important;
}
body.preview-phone.quran-reader-route.mushaf-fullscreen .reader-toolbar{
  top:5px!important;
  width:calc(100% - 10px)!important;
  height:44px!important;
  min-height:44px!important;
  padding:4px 5px!important;
}
body.preview-phone.quran-reader-route.mushaf-fullscreen .reader-title{
  max-width:82px!important;
}
body.preview-phone.quran-reader-route.mushaf-fullscreen .reader-title b{
  font-size:9px!important;
}
body.preview-phone.quran-reader-route.mushaf-fullscreen .reader-title .meta{
  font-size:6px!important;
}
body.preview-phone.quran-reader-route.mushaf-fullscreen .reader-actions{
  gap:2px!important;
}
body.preview-phone.quran-reader-route.mushaf-fullscreen .reader-actions .small-btn{
  padding:5px 6px!important;
  font-size:8px!important;
}
body.preview-phone.quran-reader-route.mushaf-fullscreen .mushaf-book-page{
  height:100%!important;
  width:auto!important;
  max-width:100%!important;
  padding:8px 8px 8px!important;
}
body.preview-phone.quran-reader-route.mushaf-fullscreen .physical-mushaf-head{
  font-size:7px!important;
  padding-bottom:2px!important;
}
body.preview-phone.quran-reader-route.mushaf-fullscreen .physical-mushaf-footer{
  font-size:8px!important;
  padding-top:2px!important;
}


/* ===== Penyesuaian mushaf agar mendekati aplikasi Qur'an contoh ===== */
body.quran-reader-route.mushaf-fullscreen .mushaf-15-lines{
  row-gap:1px!important;
}
body.quran-reader-route.mushaf-fullscreen .mushaf-fixed-line > *{
  transform:translateY(1px);
}
body.quran-reader-route.mushaf-fullscreen .qcf-word,
body.quran-reader-route.mushaf-fullscreen .qcf-end{
  line-height:1.18!important;
}
body.quran-reader-route.mushaf-fullscreen .mushaf-surah-banner{
  margin-bottom:2px!important;
}
body.quran-reader-route.mushaf-fullscreen .mushaf-basmala{
  line-height:1.2!important;
  padding-top:1px!important;
  padding-bottom:2px!important;
}
body.preview-phone.quran-reader-route.mushaf-fullscreen .mushaf-fixed-line{
  line-height:1.16!important;
  padding-bottom:1px!important;
}
body.preview-phone.quran-reader-route.mushaf-fullscreen .mushaf-fixed-line > *{
  transform:translateY(.5px);
}


/* ==========================================================
   NUHA Versi 1 — FINALISASI RENDERER MUSHAF QCF V2
   One source of truth: QCF V2 page font + API line_number.
   ========================================================== */
body.mushaf-final-mode{
  overflow:hidden!important;
}

body.mushaf-final-mode .topbar,
body.preview-phone.mushaf-final-mode .topbar{
  display:none!important;
}

body.mushaf-final-mode .view{
  width:100%!important;
  max-width:none!important;
  height:100dvh!important;
  padding:0!important;
  margin:0!important;
  overflow:hidden!important;
}

body.mushaf-final-mode .mushaf-reader-toolbar{
  position:fixed!important;
  z-index:80!important;
  top:8px!important;
  left:50%!important;
  transform:translateX(-50%)!important;
  width:min(calc(100% - 18px),760px)!important;
  min-height:48px!important;
  padding:5px 8px!important;
  border:1px solid var(--line)!important;
  border-radius:15px!important;
  background:color-mix(in srgb,var(--card) 94%,transparent)!important;
  box-shadow:0 8px 24px rgba(0,0,0,.08)!important;
}

body.mushaf-final-mode .mushaf-reader-toolbar .reader-title{
  min-width:0!important;
  max-width:180px!important;
}

body.mushaf-final-mode .mushaf-reader-toolbar .reader-title b{
  font-size:12px!important;
}

body.mushaf-final-mode .mushaf-reader-toolbar .reader-title .meta{
  font-size:8px!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}

body.mushaf-final-mode .mushaf-reader-toolbar .reader-actions{
  gap:4px!important;
  flex-wrap:nowrap!important;
}

body.mushaf-final-mode .mushaf-reader-toolbar .small-btn{
  padding:6px 9px!important;
  border-radius:10px!important;
  font-size:10px!important;
}

body.mushaf-final-mode #qreader{
  height:100dvh!important;
  padding:64px 6px 6px!important;
  overflow:hidden!important;
}

.mushaf-stage-final{
  width:100%;
  height:100%;
  display:grid;
  place-items:center;
  overflow:hidden;
  touch-action:pan-y;
}

.mushaf-page-final{
  width:auto;
  height:100%;
  max-width:100%;
  aspect-ratio:0.665/1;
  display:grid;
  grid-template-rows:auto minmax(0,1fr) auto;
  padding:13px 18px 9px;
  margin:auto;
  background:#fffdf6;
  color:#101410;
  border:1px solid #ded9cc;
  border-radius:3px;
  box-shadow:0 12px 34px rgba(23,35,30,.08);
  overflow:hidden;
}

[data-theme="dark"] .mushaf-page-final{
  background:#f8f4e9;
  color:#101410;
}

.mushaf-page-head{
  display:flex;
  direction:ltr;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:0 2px 6px;
  color:#343a36;
  font-family:"Nunito",sans-serif;
  font-size:clamp(9px,1.1vw,14px);
  white-space:nowrap;
}

.mushaf-lines{
  min-height:0;
  display:grid;
  grid-template-rows:repeat(15,minmax(0,1fr));
  direction:rtl;
}

.mushaf-line{
  min-width:0;
  min-height:0;
  width:100%;
  display:block;
  direction:rtl;
  text-align:center;
  white-space:nowrap;
  overflow:visible;
  line-height:1.22;
  font-size:30px;
}

.mushaf-glyph{
  display:inline;
  appearance:none;
  -webkit-appearance:none;
  border:0;
  padding:0;
  margin:0;
  background:none;
  color:inherit;
  font-size:1em;
  line-height:1.22;
  vertical-align:middle;
  cursor:pointer;
}

.mushaf-glyph:hover{
  color:var(--green);
}

.mushaf-ayah-end{
  position:relative;
  display:inline-grid;
  place-items:center;
  width:1.62em;
  height:1.62em;
  margin:0 .10em;
  padding:0;
  border:1.4px solid #767c78;
  border-radius:50%;
  background:transparent;
  color:#27322d;
  font-family:"Noto Naskh Arabic","Traditional Arabic",serif;
  font-size:.58em;
  line-height:1;
  vertical-align:middle;
  cursor:pointer;
}

.mushaf-ayah-end::before{
  content:"";
  position:absolute;
  inset:2px;
  border:1px solid rgba(90,98,94,.55);
  border-radius:50%;
  pointer-events:none;
}

.mushaf-ayah-end span{
  transform:translateY(-.02em);
}

.mushaf-special{
  display:flex;
  align-items:center;
  justify-content:center;
}

.mushaf-empty{
  visibility:hidden;
}

.mushaf-surah-banner{
  width:94%;
  height:82%;
  min-height:24px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding:0 12%;
  border:1.6px solid #2f332f;
  border-radius:6px;
  background:#fffdf6;
  position:relative;
}

.mushaf-surah-banner::before,
.mushaf-surah-banner::after{
  content:"✦";
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  color:#343a36;
  font-size:.72em;
}

.mushaf-surah-banner::before{right:4%}
.mushaf-surah-banner::after{left:4%}

.mushaf-surah-ar{
  font-family:"UthmanicHafs","Noto Naskh Arabic","Traditional Arabic",serif;
  font-size:1.02em;
  line-height:1;
}

.mushaf-surah-id{
  font-family:"Nunito",sans-serif;
  font-size:.48em;
  color:#5c6560;
}

.mushaf-surah-banner.compact{
  flex-direction:column;
  gap:1px;
}

.mushaf-surah-banner.compact small{
  font-size:.55em;
  line-height:1;
}

.mushaf-basmala{
  width:100%;
  text-align:center;
  direction:rtl;
  font-family:"UthmanicHafs","Noto Naskh Arabic","Traditional Arabic",serif;
  font-size:.95em;
  line-height:1.18;
}

.mushaf-page-number{
  text-align:center;
  padding-top:3px;
  color:#4d534f;
  font-family:Georgia,"Times New Roman",serif;
  font-size:12px;
}

.mushaf-slide-next .mushaf-page-final{
  animation:nuhaMushafNext .16s ease-out;
}
.mushaf-slide-prev .mushaf-page-final{
  animation:nuhaMushafPrev .16s ease-out;
}
@keyframes nuhaMushafNext{
  from{opacity:.55;transform:translateX(-14px)}
  to{opacity:1;transform:translateX(0)}
}
@keyframes nuhaMushafPrev{
  from{opacity:.55;transform:translateX(14px)}
  to{opacity:1;transform:translateX(0)}
}

/* Laptop normal */
@media(min-width:900px){
  .mushaf-page-final{
    height:min(100%,850px);
  }
}

/* HP asli */
@media(max-width:560px){
  body.mushaf-final-mode .mushaf-reader-toolbar{
    top:4px!important;
    width:calc(100% - 8px)!important;
    min-height:43px!important;
    padding:4px 5px!important;
  }

  body.mushaf-final-mode .mushaf-reader-toolbar .reader-title{
    max-width:84px!important;
  }

  body.mushaf-final-mode .mushaf-reader-toolbar .reader-title b{
    font-size:9px!important;
  }

  body.mushaf-final-mode .mushaf-reader-toolbar .reader-title .meta{
    font-size:6px!important;
  }

  body.mushaf-final-mode .mushaf-reader-toolbar .reader-actions{
    gap:2px!important;
  }

  body.mushaf-final-mode .mushaf-reader-toolbar .small-btn{
    padding:5px 6px!important;
    font-size:8px!important;
  }

  body.mushaf-final-mode #qreader{
    padding:53px 2px 2px!important;
  }

  .mushaf-page-final{
    height:100%;
    width:auto;
    max-width:100%;
    padding:8px 8px 6px;
    box-shadow:none;
  }

  .mushaf-page-head{
    font-size:7px;
    padding-bottom:2px;
  }

  .mushaf-page-number{
    font-size:8px;
    padding-top:1px;
  }

  .mushaf-surah-banner{
    border-width:1px;
  }
}

/* Preview HP di laptop */
body.preview-phone.mushaf-final-mode .app-shell{
  overflow:hidden!important;
}

body.preview-phone.mushaf-final-mode .view{
  height:100%!important;
}

body.preview-phone.mushaf-final-mode #qreader{
  height:100%!important;
  padding:53px 2px 2px!important;
}

body.preview-phone.mushaf-final-mode .mushaf-reader-toolbar{
  top:4px!important;
  width:calc(100% - 8px)!important;
  min-height:43px!important;
  padding:4px 5px!important;
}

body.preview-phone.mushaf-final-mode .mushaf-reader-toolbar .reader-title{
  max-width:82px!important;
}

body.preview-phone.mushaf-final-mode .mushaf-reader-toolbar .reader-title b{
  font-size:9px!important;
}

body.preview-phone.mushaf-final-mode .mushaf-reader-toolbar .reader-title .meta{
  font-size:6px!important;
}

body.preview-phone.mushaf-final-mode .mushaf-reader-toolbar .reader-actions{
  gap:2px!important;
}

body.preview-phone.mushaf-final-mode .mushaf-reader-toolbar .small-btn{
  padding:5px 6px!important;
  font-size:8px!important;
}

body.preview-phone.mushaf-final-mode .mushaf-page-final{
  height:100%!important;
  width:auto!important;
  max-width:100%!important;
  padding:8px 8px 6px!important;
  box-shadow:none!important;
}

body.preview-phone.mushaf-final-mode .mushaf-page-head{
  font-size:7px!important;
  padding-bottom:2px!important;
}

body.preview-phone.mushaf-final-mode .mushaf-page-number{
  font-size:8px!important;
  padding-top:1px!important;
}

/* Perapian Surah header pada Mushaf */
.mushaf-surah-banner{
  padding-left:15%!important;
  padding-right:15%!important;
}
.mushaf-surah-banner .mushaf-surah-id{
  display:none!important;
}
.mushaf-surah-ar{
  font-size:1.08em!important;
  white-space:nowrap!important;
}


/* ===== POLISH AWAL SURAH - NUHA VERSI 1 ===== */
.mushaf-surah-banner{
  width:92%!important;
  height:78%!important;
  min-height:26px!important;
  margin:0 auto!important;
  padding:0 14%!important;
  border:1.6px solid #2f332f!important;
  border-radius:5px!important;
  background:#fffdf6!important;
  position:relative!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  overflow:hidden!important;
}

/* Ornamen menyatu seperti bingkai mushaf, bukan dua kotak terpisah */
.mushaf-surah-banner::before,
.mushaf-surah-banner::after{
  content:""!important;
  position:absolute!important;
  top:50%!important;
  width:12%!important;
  height:64%!important;
  transform:translateY(-50%)!important;
  opacity:.9!important;
  background:
    radial-gradient(circle at 50% 50%, transparent 0 20%, #2f332f 21% 24%, transparent 25% 100%),
    linear-gradient(45deg, transparent 44%, #2f332f 45% 49%, transparent 50%),
    linear-gradient(-45deg, transparent 44%, #2f332f 45% 49%, transparent 50%)!important;
  pointer-events:none!important;
}
.mushaf-surah-banner::before{right:1.5%!important}
.mushaf-surah-banner::after{left:1.5%!important}

.mushaf-surah-ar{
  position:relative!important;
  z-index:2!important;
  display:inline-block!important;
  padding:0 .7em!important;
  background:#fffdf6!important;
  font-family:"UthmanicHafs","Noto Naskh Arabic","Traditional Arabic",serif!important;
  font-size:1.02em!important;
  font-weight:600!important;
  line-height:1!important;
  white-space:nowrap!important;
}

.mushaf-surah-banner.compact{
  height:84%!important;
  min-height:28px!important;
  flex-direction:column!important;
  gap:0!important;
}

.mushaf-surah-banner.compact small{
  margin-top:1px!important;
  font-size:.50em!important;
  line-height:1!important;
}

/* Basmalah jangan lebih dominan daripada teks Qur'an */
.mushaf-basmala{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:100%!important;
  height:100%!important;
  padding:0!important;
  margin:0!important;
  font-size:.78em!important;
  line-height:1.12!important;
  white-space:nowrap!important;
  text-align:center!important;
}

/* Baris khusus awal surah diberi ruang, tapi tidak menggeser komposisi 15 baris */
.mushaf-line.mushaf-special{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:0!important;
  padding:1px 0!important;
  overflow:visible!important;
}

/* Beri sedikit ruang napas antara akhir surah lama dan awal surah baru */
.mushaf-line.mushaf-special + .mushaf-line{
  padding-top:1px!important;
}

/* Preview HP tetap proporsional */
body.preview-phone.mushaf-final-mode .mushaf-surah-banner{
  width:94%!important;
  height:74%!important;
  min-height:22px!important;
  padding:0 13%!important;
  border-width:1px!important;
}
body.preview-phone.mushaf-final-mode .mushaf-surah-ar{font-size:.98em!important}
body.preview-phone.mushaf-final-mode .mushaf-basmala{font-size:.74em!important}

@media(max-width:560px){
  .mushaf-surah-banner{
    width:94%!important;
    height:74%!important;
    min-height:22px!important;
    padding:0 13%!important;
    border-width:1px!important;
  }
  .mushaf-surah-ar{
    font-size:.98em!important;
  }
  .mushaf-basmala{
    font-size:.74em!important;
  }
}


/* ===== FIX FONT NAMA SURAH: ligature font, bukan Arabic Unicode biasa ===== */
.mushaf-surah-glyph{
  display:none;
  font-family:"NaraSurahNames"!important;
  font-size:1.38em!important;
  font-weight:400!important;
  font-style:normal!important;
  line-height:1!important;
  letter-spacing:0!important;
  font-variant-ligatures:common-ligatures discretionary-ligatures!important;
  font-feature-settings:"liga" 1,"dlig" 1!important;
  text-transform:none!important;
  white-space:nowrap!important;
}

.mushaf-surah-fallback{
  display:inline-block;
  font-family:"UthmanicHafs","Noto Naskh Arabic","Traditional Arabic",serif!important;
  font-size:1.02em!important;
  font-weight:600!important;
  line-height:1!important;
  white-space:nowrap!important;
}

/* Baru tampilkan glyph khusus setelah font benar-benar selesai dimuat. */
html.surah-name-font-ready .mushaf-surah-glyph{
  display:inline-block!important;
}
html.surah-name-font-ready .mushaf-surah-fallback{
  display:none!important;
}

body.preview-phone.mushaf-final-mode .mushaf-surah-glyph{
  font-size:1.24em!important;
}
@media(max-width:560px){
  .mushaf-surah-glyph{
    font-size:1.24em!important;
  }
}


/* ===== FIX JUDUL SURAH - GAYA QURAN.COM =====
   Judul tetap berupa teks Arab asli, bukan ligature "surah001".
*/
.mushaf-surah-glyph,
.mushaf-surah-fallback{
  display:none!important;
}

.mushaf-surah-ar{
  display:inline-block!important;
  position:relative!important;
  z-index:2!important;
  padding:0 .55em!important;
  background:#fffdf6!important;
  font-family:"UthmanicHafs","Noto Naskh Arabic","Traditional Arabic",serif!important;
  font-size:1.12em!important;
  font-weight:400!important;
  font-style:normal!important;
  line-height:1.10!important;
  letter-spacing:0!important;
  white-space:nowrap!important;
  transform:none!important;
  direction:rtl!important;
  text-rendering:optimizeLegibility!important;
}

body.preview-phone.mushaf-final-mode .mushaf-surah-ar{
  font-size:1.04em!important;
}

@media(max-width:560px){
  .mushaf-surah-ar{
    font-size:1.04em!important;
  }
}


/* ===== FONT NAMA SURAH - QURAN.COM STYLE / FINAL OVERRIDE ===== */
@font-face{
  font-family:"QuranComSurahNames";
  src:url("https://github.com/quran/quran.com-fonts/raw/refs/heads/master/public/fonts/surah_names/surah_names.ttf") format("truetype");
  font-display:swap;
}

.mushaf-surah-ar{
  display:inline-block!important;
  position:relative!important;
  z-index:3!important;
  padding:0 .55em!important;
  background:#fffdf6!important;
  font-family:"QuranComSurahNames","Noto Naskh Arabic","UthmanicHafs","Traditional Arabic",serif!important;
  font-size:1.30em!important;
  font-weight:600!important;
  font-style:normal!important;
  line-height:1.05!important;
  letter-spacing:0!important;
  white-space:nowrap!important;
  direction:rtl!important;
  transform:none!important;
  text-rendering:optimizeLegibility!important;
}

body.preview-phone.mushaf-final-mode .mushaf-surah-ar{
  font-size:1.18em!important;
}

@media(max-width:560px){
  .mushaf-surah-ar{
    font-size:1.18em!important;
  }
}


/* ===== FONT NAMA SURAH QURAN.COM - MAPPING PUA RESMI ===== */
.mushaf-surah-qurancom{
  display:none;
  font-family:"QuranComSurahNames"!important;
  font-size:1.35em!important;
  font-weight:400!important;
  font-style:normal!important;
  line-height:1!important;
  letter-spacing:0!important;
  white-space:nowrap!important;
  direction:ltr!important;
  text-rendering:geometricPrecision!important;
}

.mushaf-surah-fallback{
  display:inline-block!important;
  font-family:"UthmanicHafs","Noto Naskh Arabic","Traditional Arabic",serif!important;
  font-size:1.05em!important;
  font-weight:500!important;
  line-height:1!important;
  white-space:nowrap!important;
}

html.qurancom-surah-font-ready .mushaf-surah-qurancom{
  display:inline-block!important;
}
html.qurancom-surah-font-ready .mushaf-surah-fallback{
  display:none!important;
}

/* Matikan aturan eksperimen lama agar tidak menimpa hasil baru */
.mushaf-surah-ar,
.mushaf-surah-glyph{
  display:none!important;
}

body.preview-phone.mushaf-final-mode .mushaf-surah-qurancom{
  font-size:1.20em!important;
}

@media(max-width:560px){
  .mushaf-surah-qurancom{font-size:1.20em!important}
}


/* ===== NAMA SURAH + BISMILLAH QURAN.COM ===== */
@font-face{
  font-family:"QuranComBismillah";
  src:url("https://cdn.jsdelivr.net/gh/quran/quran.com-fonts@master/public/fonts/bismillah/bismillah.ttf") format("truetype");
  font-display:swap;
}

/* Lafadz "سُورَةُ" tetap berupa teks Arab, lalu diikuti glyph nama surah Quran.com. */
.mushaf-surah-prefix{
  display:inline-block!important;
  margin-left:.18em!important;
  font-family:"UthmanicHafs","Noto Naskh Arabic","Traditional Arabic",serif!important;
  font-size:.76em!important;
  font-weight:500!important;
  line-height:1!important;
  vertical-align:middle!important;
  white-space:nowrap!important;
  direction:rtl!important;
}

.mushaf-surah-qurancom{
  vertical-align:middle!important;
}

/* Font khusus Bismillah Quran.com menggunakan glyph Unicode U+FDFD. */
.qurancom-bismillah,
.mushaf-basmala.qurancom-bismillah{
  font-family:"QuranComBismillah","UthmanicHafs","Noto Naskh Arabic","Traditional Arabic",serif!important;
  font-size:1.30em!important;
  font-weight:400!important;
  line-height:1!important;
  letter-spacing:0!important;
  direction:rtl!important;
  white-space:nowrap!important;
  text-align:center!important;
  font-feature-settings:normal!important;
}

.mushaf-basmala.qurancom-bismillah{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:100%!important;
  height:100%!important;
  padding:0!important;
  margin:0!important;
}

body.preview-phone.mushaf-final-mode .mushaf-surah-prefix{
  font-size:.70em!important;
}
body.preview-phone.mushaf-final-mode .qurancom-bismillah{
  font-size:1.18em!important;
}

@media(max-width:560px){
  .mushaf-surah-prefix{font-size:.70em!important}
  .qurancom-bismillah{font-size:1.18em!important}
}


/* ==========================================================
   NUHA VERSI 1 — AL-QUR'AN DIKUNCI
   Fokus hanya pada reader Al-Qur'an.
   ========================================================== */

/* Judul surah: satu ornamen utuh seperti mushaf */
.nuha-surah-ornament{
  position:relative!important;
  width:96%!important;
  height:82%!important;
  min-height:32px!important;
  margin:0 auto!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  overflow:visible!important;
}

.nuha-surah-frame{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  object-fit:fill!important;
  display:block!important;
  pointer-events:none!important;
  user-select:none!important;
}

.nuha-surah-title{
  position:relative!important;
  z-index:2!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:.18em!important;
  min-width:34%!important;
  max-width:58%!important;
  padding:0 .65em!important;
  color:#111611!important;
  background:#fffdf6!important;
  white-space:nowrap!important;
  line-height:1!important;
}

.nuha-surah-prefix{
  display:inline-block!important;
  font-family:"UthmanicHafs","Noto Naskh Arabic","Traditional Arabic",serif!important;
  font-size:.80em!important;
  font-weight:500!important;
  line-height:1!important;
  transform:translateY(-.02em)!important;
}

.nuha-surah-qurancom{
  display:none;
  font-family:"QuranComSurahNames"!important;
  font-size:1.26em!important;
  font-weight:400!important;
  font-style:normal!important;
  line-height:1!important;
  direction:ltr!important;
  letter-spacing:0!important;
  text-rendering:geometricPrecision!important;
}

.nuha-surah-fallback{
  display:inline-block;
  font-family:"UthmanicHafs","Noto Naskh Arabic","Traditional Arabic",serif!important;
  font-size:1.02em!important;
  font-weight:500!important;
  line-height:1!important;
}

html.qurancom-surah-font-ready .nuha-surah-qurancom{
  display:inline-block!important;
}
html.qurancom-surah-font-ready .nuha-surah-fallback{
  display:none!important;
}

/* Bismillah: pakai glyph font khusus Quran.com bila font sudah siap */
.nuha-bismillah{
  width:100%!important;
  height:100%!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  text-align:center!important;
  direction:rtl!important;
  white-space:nowrap!important;
  color:#111611!important;
  overflow:visible!important;
}

.nuha-bismillah-glyph{
  display:none;
  font-family:"QuranComBismillah"!important;
  font-size:1.34em!important;
  font-weight:400!important;
  line-height:1!important;
  letter-spacing:0!important;
}

.nuha-bismillah-fallback{
  display:inline-block;
  font-family:"UthmanicHafs","Noto Naskh Arabic","Traditional Arabic",serif!important;
  font-size:.83em!important;
  font-weight:400!important;
  line-height:1.18!important;
}

html.qurancom-bismillah-font-ready .nuha-bismillah-glyph{
  display:inline-block!important;
}
html.qurancom-bismillah-font-ready .nuha-bismillah-fallback{
  display:none!important;
}

/* Baris spesial tidak memotong ornamen/basmalah */
.mushaf-line.mushaf-special{
  overflow:visible!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:0!important;
  padding:0!important;
}

/* Tanda akhir ayat tetap lingkaran/medali */
.mushaf-ayah-end{
  box-sizing:border-box!important;
  border:1.35px solid #69716c!important;
  box-shadow:inset 0 0 0 2px #fffdf6!important;
  background:#fffdf6!important;
}
.mushaf-ayah-end::before{
  inset:2px!important;
  border:.8px solid #9aa09c!important;
}

/* Preview HP */
body.preview-phone.mushaf-final-mode .nuha-surah-ornament{
  width:98%!important;
  min-height:24px!important;
}
body.preview-phone.mushaf-final-mode .nuha-surah-title{
  max-width:62%!important;
  padding:0 .45em!important;
}
body.preview-phone.mushaf-final-mode .nuha-surah-prefix{
  font-size:.72em!important;
}
body.preview-phone.mushaf-final-mode .nuha-surah-qurancom{
  font-size:1.12em!important;
}
body.preview-phone.mushaf-final-mode .nuha-bismillah-glyph{
  font-size:1.18em!important;
}
body.preview-phone.mushaf-final-mode .nuha-bismillah-fallback{
  font-size:.72em!important;
}

@media(max-width:560px){
  .nuha-surah-ornament{
    width:98%!important;
    min-height:24px!important;
  }
  .nuha-surah-title{
    max-width:62%!important;
    padding:0 .45em!important;
  }
  .nuha-surah-prefix{font-size:.72em!important}
  .nuha-surah-qurancom{font-size:1.12em!important}
  .nuha-bismillah-glyph{font-size:1.18em!important}
  .nuha-bismillah-fallback{font-size:.72em!important}
}


/* ==========================================================
   FINAL BINGKAI JUDUL SURAH — ACUAN GAMBAR PENGGUNA
   Jangan kembali ke SVG/ikon silang/ornamen sederhana.
   ========================================================== */
.nuha-surah-ornament{
  position:relative!important;
  width:90%!important;
  height:auto!important;
  aspect-ratio:954/118!important;
  max-height:56px!important;
  margin:0 auto!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  overflow:visible!important;
}

.nuha-surah-frame{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  object-fit:fill!important;
  display:block!important;
  pointer-events:none!important;
  user-select:none!important;
}

/* Panel tengah pada gambar sudah kosong, jadi judul tidak perlu
   background/kotak tambahan yang menutupi ornamen. */
.nuha-surah-title{
  position:relative!important;
  z-index:3!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:.13em!important;
  width:auto!important;
  min-width:0!important;
  max-width:55%!important;
  padding:0 .22em!important;
  margin:0!important;
  background:transparent!important;
  color:#111!important;
  white-space:nowrap!important;
  line-height:1!important;
  transform:translateY(-1px)!important;
}

.nuha-surah-prefix{
  margin:0!important;
  padding:0!important;
  font-family:"UthmanicHafs","Noto Naskh Arabic","Traditional Arabic",serif!important;
  font-size:.76em!important;
  font-weight:500!important;
  line-height:1!important;
  white-space:nowrap!important;
}

.nuha-surah-qurancom{
  font-size:1.12em!important;
  line-height:1!important;
}

.nuha-surah-fallback{
  font-size:.96em!important;
  line-height:1!important;
}

/* Baris judul boleh sedikit keluar dari tinggi grid, seperti mushaf cetak. */
.mushaf-line.mushaf-special{
  overflow:visible!important;
}

/* Tampilan HP / preview HP tetap mempertahankan proporsi ornamen. */
body.preview-phone.mushaf-final-mode .nuha-surah-ornament{
  width:92%!important;
  max-height:42px!important;
}
body.preview-phone.mushaf-final-mode .nuha-surah-title{
  max-width:57%!important;
}
body.preview-phone.mushaf-final-mode .nuha-surah-prefix{
  font-size:.68em!important;
}
body.preview-phone.mushaf-final-mode .nuha-surah-qurancom{
  font-size:1.02em!important;
}
body.preview-phone.mushaf-final-mode .nuha-surah-fallback{
  font-size:.88em!important;
}

@media(max-width:560px){
  .nuha-surah-ornament{
    width:92%!important;
    max-height:42px!important;
  }
  .nuha-surah-title{
    max-width:57%!important;
  }
  .nuha-surah-prefix{font-size:.68em!important}
  .nuha-surah-qurancom{font-size:1.02em!important}
  .nuha-surah-fallback{font-size:.88em!important}
}


/* ==========================================================
   POLISH FINAL JUDUL SURAH — NUHA VERSI 1
   Pertahankan ornamen referensi pengguna, hanya rapikan proporsi.
   ========================================================== */

/* Bingkai dibuat sedikit lebih besar agar ukiran lebih jelas */
.nuha-surah-ornament{
  width:94%!important;
  max-height:62px!important;
  aspect-ratio:954/118!important;
  margin:0 auto 3px!important;
}

/* Panel judul dibuat lebih lega tanpa menutup ornamen kiri-kanan */
.nuha-surah-title{
  max-width:61%!important;
  padding:0 .34em!important;
  gap:.14em!important;
  transform:translateY(1px)!important;
}

/* Posisi tulisan lebih pas di tengah panel */
.nuha-surah-prefix{
  font-size:.78em!important;
  transform:translateY(.02em)!important;
}

.nuha-surah-qurancom{
  font-size:1.15em!important;
  transform:translateY(.015em)!important;
}

.nuha-surah-fallback{
  font-size:.98em!important;
  transform:translateY(.015em)!important;
}

/* Tambah ruang napas antara ornamen dan basmalah */
.nuha-bismillah{
  transform:translateY(2px)!important;
  margin-top:2px!important;
}

/* HP / preview HP tetap proporsional */
body.preview-phone.mushaf-final-mode .nuha-surah-ornament{
  width:95%!important;
  max-height:46px!important;
  margin-bottom:2px!important;
}
body.preview-phone.mushaf-final-mode .nuha-surah-title{
  max-width:63%!important;
  padding:0 .24em!important;
  transform:translateY(.5px)!important;
}
body.preview-phone.mushaf-final-mode .nuha-surah-prefix{
  font-size:.70em!important;
}
body.preview-phone.mushaf-final-mode .nuha-surah-qurancom{
  font-size:1.05em!important;
}
body.preview-phone.mushaf-final-mode .nuha-surah-fallback{
  font-size:.90em!important;
}
body.preview-phone.mushaf-final-mode .nuha-bismillah{
  transform:translateY(1px)!important;
  margin-top:1px!important;
}

@media(max-width:560px){
  .nuha-surah-ornament{
    width:95%!important;
    max-height:46px!important;
    margin-bottom:2px!important;
  }
  .nuha-surah-title{
    max-width:63%!important;
    padding:0 .24em!important;
    transform:translateY(.5px)!important;
  }
  .nuha-surah-prefix{font-size:.70em!important}
  .nuha-surah-qurancom{font-size:1.05em!important}
  .nuha-surah-fallback{font-size:.90em!important}
  .nuha-bismillah{
    transform:translateY(1px)!important;
    margin-top:1px!important;
  }
}


/* ==========================================================
   FIX HARAKAT JUDUL SURAH — jangan menyentuh bingkai
   ========================================================== */
.nuha-surah-ornament{
  max-height:66px!important;
}

.nuha-surah-title{
  max-width:59%!important;
  padding:0 .28em!important;
  line-height:1.18!important;
  transform:translateY(3px)!important;
  overflow:visible!important;
  align-items:center!important;
}

.nuha-surah-prefix{
  font-size:.72em!important;
  line-height:1.18!important;
  transform:none!important;
}

.nuha-surah-qurancom{
  font-size:1.03em!important;
  line-height:1.14!important;
  transform:none!important;
}

.nuha-surah-fallback{
  font-size:.91em!important;
  line-height:1.18!important;
  transform:none!important;
}

/* HP / preview HP: beri ruang harakat yang sama */
body.preview-phone.mushaf-final-mode .nuha-surah-ornament{
  max-height:48px!important;
}
body.preview-phone.mushaf-final-mode .nuha-surah-title{
  max-width:61%!important;
  line-height:1.16!important;
  transform:translateY(2px)!important;
}
body.preview-phone.mushaf-final-mode .nuha-surah-prefix{
  font-size:.66em!important;
}
body.preview-phone.mushaf-final-mode .nuha-surah-qurancom{
  font-size:.96em!important;
}
body.preview-phone.mushaf-final-mode .nuha-surah-fallback{
  font-size:.84em!important;
}

@media(max-width:560px){
  .nuha-surah-ornament{
    max-height:48px!important;
  }
  .nuha-surah-title{
    max-width:61%!important;
    line-height:1.16!important;
    transform:translateY(2px)!important;
  }
  .nuha-surah-prefix{font-size:.66em!important}
  .nuha-surah-qurancom{font-size:.96em!important}
  .nuha-surah-fallback{font-size:.84em!important}
}

/* =====================================================================
   NUHA VERSI 1 — AL-QUR'AN FINAL BLUEPRINT
   Blok ini sengaja menjadi override terakhir agar patch lama tidak lagi
   mengubah perilaku reader Qur'an yang sudah dikunci.
   ===================================================================== */

/* ---------- Indeks 114 Surah / 30 Juz ---------- */
.quran-home-head{display:flex;align-items:end;justify-content:space-between;gap:12px}
.quran-main-tabs{margin-top:4px}
.quran-main-tabs .tab{display:inline-flex;align-items:center;gap:7px}
.quran-search{margin-top:12px!important}
.quran-resume-wrap{margin-top:12px}
.quran-resume-card{
  width:100%;display:flex;align-items:center;gap:12px;text-align:left;
  border:1px solid color-mix(in srgb,var(--green) 28%,var(--line));
  background:linear-gradient(135deg,var(--green-soft),color-mix(in srgb,var(--green-soft) 62%,var(--card)));
  color:var(--text);border-radius:18px;padding:13px 14px;cursor:pointer
}
.resume-icon{width:42px;height:42px;display:grid;place-items:center;flex:none;border-radius:14px;background:var(--green);color:#fff;font-size:19px}
.resume-copy{display:grid;min-width:0;flex:1}
.resume-copy small{font-size:10px;color:var(--green);font-weight:800;text-transform:uppercase;letter-spacing:.04em}
.resume-copy b{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.resume-copy span{font-size:11px;color:var(--muted)}
.resume-arrow{color:var(--green);font-size:17px}
.quran-index-list{padding-bottom:8px}
.quran-surah-item,.quran-juz-item{min-height:66px}
.quran-surah-item .ar-name{font-size:25px;line-height:1.25;max-width:38%;text-align:right}

/* ---------- Reader shell ---------- */
body.quran-reader-route .view{
  width:min(100%,1050px);padding:0 12px 16px
}
body.quran-reader-route .reader-toolbar{
  min-height:56px;gap:8px;margin:0;padding:6px 0 7px
}
body.quran-reader-route .reader-title{min-width:0;flex:1}
body.quran-reader-route .reader-title b{display:block;font-size:14px;line-height:1.15;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body.quran-reader-route .reader-title .meta{margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body.quran-reader-route .reader-actions{display:flex;align-items:center;gap:5px;flex:none}
body.quran-reader-route .reader-actions .small-btn{min-width:38px;padding:7px 9px;border-radius:11px}
body.quran-reader-route .reader-actions [data-mode]{min-width:55px}
body.quran-reader-route .mushaf-top-nav:disabled{opacity:.35;cursor:not-allowed}

body.quran-reader-route.mushaf-final-mode{overflow:hidden}
body.quran-reader-route.mushaf-final-mode .view{
  height:calc(100dvh - 72px);min-height:0;overflow:hidden;padding-bottom:7px
}
body.quran-reader-route.mushaf-final-mode .reader-toolbar{
  position:relative!important;top:auto!important;height:56px;min-height:56px
}
body.quran-reader-route.mushaf-final-mode #qreader{
  height:calc(100% - 56px)!important;min-height:0!important;padding:0!important;overflow:hidden!important
}
body.quran-reader-route:not(.mushaf-final-mode) .reader-toolbar{top:72px}
body.quran-reader-route:not(.mushaf-final-mode) #qreader{padding-top:4px}

/* ---------- Halaman fisik QCF V2 ---------- */
body.quran-reader-route .mushaf-stage-final{
  width:100%;height:100%;min-height:0;display:grid;place-items:center;
  overflow:hidden;touch-action:pan-y;padding:4px 0
}
body.quran-reader-route .mushaf-page-final{
  width:auto!important;height:92%!important;max-height:820px!important;max-width:100%!important;
  aspect-ratio:.665/1!important;margin:auto!important;
  display:grid!important;grid-template-rows:auto minmax(0,1fr) auto!important;
  padding:11px 17px 8px!important;
  background:#fffdf6!important;color:#101410!important;
  border:1px solid #d9d4c8!important;border-radius:3px!important;
  box-shadow:0 12px 34px rgba(23,35,30,.08)!important;
  overflow:hidden!important;
  transform:scale(var(--mushaf-zoom))!important;transform-origin:center center!important
}
body.quran-reader-route .mushaf-page-head{
  min-height:18px!important;padding:0 2px 5px!important;
  display:flex!important;direction:ltr!important;align-items:center!important;justify-content:space-between!important;gap:10px!important;
  color:#3f4541!important;font-family:"Nunito",sans-serif!important;
  font-size:clamp(8.5px,1.05vw,13px)!important;line-height:1.15!important;white-space:nowrap!important
}
body.quran-reader-route .mushaf-lines{
  min-height:0!important;height:100%!important;display:grid!important;
  grid-template-rows:repeat(15,minmax(0,1fr))!important;direction:rtl!important
}
body.quran-reader-route .mushaf-line{
  min-width:0!important;min-height:0!important;width:100%!important;height:100%!important;
  display:flex!important;align-items:center!important;justify-content:center!important;
  direction:rtl!important;text-align:center!important;white-space:nowrap!important;
  overflow:visible!important;line-height:1.18!important;padding:0!important;margin:0!important
}
body.quran-reader-route .mushaf-glyph{
  display:inline!important;appearance:none!important;-webkit-appearance:none!important;
  border:0!important;padding:0!important;margin:0!important;background:none!important;color:inherit!important;
  font-size:1em!important;line-height:1.18!important;vertical-align:middle!important;cursor:pointer!important
}
body.quran-reader-route .mushaf-glyph:hover,
body.quran-reader-route .mushaf-ayah-end:hover{color:var(--green)!important}

/* Fallback marker sebelum font QCF selesai dimuat. */
body.quran-reader-route .mushaf-ayah-end{
  position:relative!important;display:inline-grid!important;place-items:center!important;
  width:1.55em!important;height:1.55em!important;margin:0 .08em!important;padding:0!important;
  border:1.2px solid #777e79!important;border-radius:50%!important;background:#fffdf6!important;color:#27322d!important;
  font-family:"Noto Naskh Arabic","Traditional Arabic",serif!important;font-size:.58em!important;line-height:1!important;
  vertical-align:middle!important;cursor:pointer!important
}
body.quran-reader-route .mushaf-ayah-end::before{
  content:"";position:absolute;inset:2px;border:.8px solid rgba(90,98,94,.52);border-radius:50%;pointer-events:none
}
/* Saat code_v2 tersedia, gunakan rosette/nomor ayat asli dari QCF V2. */
body.quran-reader-route .mushaf-ayah-end.qcf-ready{
  display:inline!important;width:auto!important;height:auto!important;margin:0!important;padding:0!important;
  border:0!important;border-radius:0!important;background:none!important;font-size:1em!important;line-height:1.18!important
}
body.quran-reader-route .mushaf-ayah-end.qcf-ready::before{display:none!important}
body.quran-reader-route .mushaf-ayah-end.qcf-ready span{display:none!important}
body.quran-reader-route .mushaf-empty{visibility:hidden!important}
body.quran-reader-route .mushaf-special{display:flex!important;align-items:center!important;justify-content:center!important;overflow:visible!important}
body.quran-reader-route .mushaf-page-number{
  min-height:16px!important;text-align:center!important;padding-top:2px!important;color:#4d534f!important;
  font-family:Georgia,"Times New Roman",serif!important;font-size:11px!important;line-height:1.1!important
}

/* ---------- Bingkai nama surah: asset referensi pengguna ---------- */
body.quran-reader-route .nuha-surah-ornament{
  position:relative!important;width:94%!important;height:86%!important;max-height:none!important;min-height:0!important;
  margin:0 auto!important;display:flex!important;align-items:center!important;justify-content:center!important;overflow:visible!important
}
body.quran-reader-route .nuha-surah-frame{
  position:absolute!important;inset:0!important;width:100%!important;height:100%!important;
  object-fit:fill!important;display:block!important;pointer-events:none!important;user-select:none!important
}
body.quran-reader-route .nuha-surah-title{
  position:relative!important;z-index:3!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;
  gap:.12em!important;width:auto!important;min-width:0!important;max-width:56%!important;
  margin:0!important;padding:.04em .30em .10em!important;background:transparent!important;color:#111!important;
  white-space:nowrap!important;overflow:visible!important;line-height:1.30!important;
  font-size:clamp(13px,2.05vw,20px)!important;transform:translateY(1.5px)!important
}
body.quran-reader-route .nuha-surah-prefix{
  display:inline-block!important;margin:0!important;padding:0!important;
  font-family:"Noto Naskh Arabic","Traditional Arabic",serif!important;
  font-size:.82em!important;font-weight:500!important;line-height:1.32!important;transform:none!important
}
body.quran-reader-route .nuha-surah-qurancom{
  font-family:"QuranComSurahNames"!important;font-size:1.14em!important;font-weight:400!important;
  line-height:1.16!important;direction:ltr!important;letter-spacing:0!important;transform:none!important
}
body.quran-reader-route .nuha-surah-fallback{
  font-family:"Noto Naskh Arabic","Traditional Arabic",serif!important;font-size:1em!important;font-weight:500!important;
  line-height:1.32!important;transform:none!important
}
html.qurancom-surah-font-ready body.quran-reader-route .nuha-surah-qurancom{display:inline-block!important}
html.qurancom-surah-font-ready body.quran-reader-route .nuha-surah-fallback{display:none!important}

/* ---------- Basmalah ---------- */
body.quran-reader-route .nuha-bismillah{
  width:100%!important;height:82%!important;margin:0!important;padding-top:2px!important;
  display:flex!important;align-items:center!important;justify-content:center!important;text-align:center!important;
  direction:rtl!important;white-space:nowrap!important;color:#111!important;overflow:visible!important;transform:none!important
}
body.quran-reader-route .nuha-bismillah-glyph{
  font-family:"QuranComBismillah"!important;font-size:clamp(18px,3.1vw,29px)!important;
  font-weight:400!important;line-height:1!important;letter-spacing:0!important
}
body.quran-reader-route .nuha-bismillah-fallback{
  font-family:"Noto Naskh Arabic","Traditional Arabic",serif!important;font-size:clamp(14px,2.35vw,22px)!important;
  font-weight:400!important;line-height:1.25!important
}

/* ---------- Mode Ayat ---------- */
.quran-ayah-list{max-width:780px;margin:4px auto 30px;padding:8px 16px}
.quran-ayah-card{padding:18px 3px 20px!important}
.ayah-topline{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:5px;color:var(--muted);font-size:10px;font-weight:800}
.ayah-key{color:var(--green);background:var(--green-soft);padding:4px 7px;border-radius:999px}
.ayah-page{font-weight:700}
.quran-ayah-card .arabic{line-height:2!important}
.ayah-hint{margin-top:9px;color:var(--muted);font-size:10px;display:flex;gap:5px;align-items:center}
.quran-reader-error{max-width:620px;margin:40px auto;text-align:center}
.quran-reader-error .small-btn{margin-top:12px}

/* ---------- Detail ayat & tafsir ---------- */
.ayah-detail-sheet{display:grid;gap:10px}
.ayah-detail-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.ayah-detail-head h3{margin-bottom:2px}
.ayah-detail-ar{padding:10px 2px 4px;line-height:2!important}
.ayah-detail-translation{padding-bottom:8px}
.tafsir-section-head{margin:8px 0 4px!important}
.tafsir-preview{border:1px solid var(--line);border-radius:16px;padding:13px;background:color-mix(in srgb,var(--card) 82%,var(--green-soft));min-height:56px}
.tafsir-source-name{font-size:11px;font-weight:800;color:var(--green);margin-bottom:7px}
.tafsir-text{font-size:15px;line-height:1.78;text-align:left;color:var(--text);white-space:pre-line;overflow-wrap:anywhere}
.tafsir-text.rtl,.tafsir-arabic{font-family:"Noto Naskh Arabic","Traditional Arabic",serif;font-size:22px;line-height:1.9;text-align:right;color:var(--text);white-space:pre-line}
.tafsir-source-note{margin-top:10px;padding-top:8px;border-top:1px dashed var(--line);font-size:10px;line-height:1.45;color:var(--muted);display:flex;gap:6px;align-items:flex-start}
.tafsir-source-note i{color:var(--green);margin-top:1px}
.tafsir-option.selected{border-color:color-mix(in srgb,var(--green) 45%,var(--line));background:color-mix(in srgb,var(--green-soft) 56%,var(--card))}
.ayah-detail-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:3px}
.tafsir-option .badge:not(.soon){background:var(--green);color:#fff}

/* ---------- Desktop ---------- */
@media(min-width:900px){
  body.quran-reader-route .mushaf-page-final{max-height:800px!important}
  body.quran-reader-route .nuha-surah-title{font-size:18px!important}
}

/* ---------- HP asli + Preview HP ---------- */
@media(max-width:560px){
  body.quran-reader-route .view{padding-left:6px;padding-right:6px}
  body.quran-reader-route .reader-toolbar{min-height:49px;height:auto;gap:4px;padding:4px 0 5px}
  body.quran-reader-route .reader-title b{font-size:11px}
  body.quran-reader-route .reader-title .meta{font-size:8.5px}
  body.quran-reader-route .reader-actions{gap:3px}
  body.quran-reader-route .reader-actions .small-btn{min-width:30px;padding:6px 7px;font-size:9px;border-radius:9px}
  body.quran-reader-route .reader-actions [data-mode]{min-width:45px}
  body.quran-reader-route.mushaf-final-mode .view{height:calc(100dvh - 72px)}
  body.quran-reader-route.mushaf-final-mode .reader-toolbar{height:49px;min-height:49px}
  body.quran-reader-route.mushaf-final-mode #qreader{height:calc(100% - 49px)!important}
  body.quran-reader-route .mushaf-stage-final{padding:2px 0}
  body.quran-reader-route .mushaf-page-final{height:91%!important;padding:8px 10px 6px!important;box-shadow:0 6px 20px rgba(23,35,30,.07)!important}
  body.quran-reader-route .mushaf-page-head{font-size:8px!important;padding-bottom:3px!important;min-height:14px!important}
  body.quran-reader-route .mushaf-page-number{font-size:9px!important;min-height:12px!important}
  body.quran-reader-route .nuha-surah-ornament{width:96%!important;height:84%!important}
  body.quran-reader-route .nuha-surah-title{max-width:59%!important;font-size:12.5px!important;line-height:1.32!important;padding:.03em .18em .11em!important;transform:translateY(1px)!important}
  body.quran-reader-route .nuha-surah-prefix{font-size:.78em!important;line-height:1.35!important}
  body.quran-reader-route .nuha-surah-qurancom{font-size:1.08em!important;line-height:1.18!important}
  body.quran-reader-route .nuha-surah-fallback{font-size:.94em!important;line-height:1.35!important}
  body.quran-reader-route .nuha-bismillah{height:80%!important;padding-top:1px!important}
  body.quran-reader-route .nuha-bismillah-glyph{font-size:18px!important}
  body.quran-reader-route .nuha-bismillah-fallback{font-size:14px!important}
  .quran-surah-item .ar-name{font-size:21px;max-width:34%}
  .quran-ayah-list{border-radius:16px;padding:5px 12px}
  .quran-ayah-card{padding:15px 2px 17px!important}
  .tafsir-arabic,.tafsir-text.rtl{font-size:20px}
}

body.preview-phone.quran-reader-route.mushaf-final-mode .app-shell{overflow:hidden!important}
body.preview-phone.quran-reader-route.mushaf-final-mode .view{height:calc(100% - 72px)!important;padding-left:5px!important;padding-right:5px!important}
body.preview-phone.quran-reader-route.mushaf-final-mode .reader-toolbar{height:49px!important;min-height:49px!important}
body.preview-phone.quran-reader-route.mushaf-final-mode #qreader{height:calc(100% - 49px)!important}
body.preview-phone.quran-reader-route .mushaf-page-final{height:90%!important;max-width:100%!important;padding:8px 9px 6px!important}
body.preview-phone.quran-reader-route .nuha-surah-ornament{width:96%!important;height:84%!important;max-height:none!important}
body.preview-phone.quran-reader-route .nuha-surah-title{max-width:59%!important;font-size:12px!important;line-height:1.34!important;transform:translateY(1px)!important}
body.preview-phone.quran-reader-route .nuha-surah-prefix{font-size:.78em!important}
body.preview-phone.quran-reader-route .nuha-surah-qurancom{font-size:1.08em!important}
body.preview-phone.quran-reader-route .nuha-surah-fallback{font-size:.94em!important}
body.preview-phone.quran-reader-route .nuha-bismillah{height:80%!important;transform:none!important;margin:0!important}
body.preview-phone.quran-reader-route .nuha-bismillah-glyph{font-size:18px!important}
body.preview-phone.quran-reader-route .nuha-bismillah-fallback{font-size:14px!important}


/* ==========================================================
   FIX TERBATAS — HARAKAT JUDUL SURAH SAJA
   Jangan ubah komponen Qur'an lainnya.
   ========================================================== */
.nuha-surah-title{
  transform:translateY(6px)!important;
}

body.preview-phone.mushaf-final-mode .nuha-surah-title{
  transform:translateY(4px)!important;
}

@media(max-width:560px){
  .nuha-surah-title{
    transform:translateY(4px)!important;
  }
}

/* =========================================================
   NUHA VERSI 1 — PUSAT BAHTSUL MASAIL
   Sumber isi: Maktabah Az Zaen, tampilan mengikuti identitas NUHA.
   ========================================================= */
.bahtsul-home-card{
  position:relative;
  overflow:hidden;
  margin:28px 0 4px;
  border-radius:28px;
  background:
    radial-gradient(circle at 86% 6%,rgba(255,255,255,.08) 0 21%,transparent 21.3%),
    radial-gradient(circle at 38% 112%,rgba(214,174,91,.08) 0 26%,transparent 26.4%),
    linear-gradient(135deg,#0b503f 0%,#0c684f 58%,#155e4b 100%);
  color:#fff;
  box-shadow:0 18px 42px rgba(9,70,54,.16);
  isolation:isolate;
}
.bahtsul-home-card:before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(118deg,transparent 0 61%,rgba(255,255,255,.025) 61% 76%,transparent 76%),
    radial-gradient(circle at 75% 72%,transparent 0 58px,rgba(214,174,91,.08) 59px 60px,transparent 61px);
  z-index:-1;
}
.bahtsul-home-pattern{
  position:absolute;
  width:180px;height:180px;
  right:-62px;bottom:-72px;
  border:1px solid rgba(214,174,91,.12);
  border-radius:50%;
  pointer-events:none;
}
.bahtsul-home-pattern:before,.bahtsul-home-pattern:after{
  content:"";position:absolute;border:1px solid rgba(214,174,91,.09);border-radius:50%;
}
.bahtsul-home-pattern:before{inset:22px}
.bahtsul-home-pattern:after{inset:48px}
.bahtsul-home-inner{position:relative;padding:28px 28px 26px;z-index:1}
.bahtsul-kicker{
  color:#d9b567;
  font-size:11px;
  line-height:1.2;
  font-weight:800;
  letter-spacing:.16em;
  text-transform:uppercase;
}
.bahtsul-home-card h2{
  margin:13px 0 10px;
  font-size:32px;
  line-height:1.15;
  letter-spacing:-.025em;
  font-weight:800;
}
.bahtsul-home-card p{
  max-width:710px;
  margin:0;
  color:rgba(255,255,255,.84);
  font-size:15px;
  line-height:1.7;
}
.bahtsul-home-stats,.bahtsul-center-stats{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:21px;
}
.bahtsul-home-stats span,.bahtsul-center-stats span{
  display:inline-flex;
  align-items:baseline;
  gap:7px;
  min-height:42px;
  padding:9px 14px;
  border:1px solid rgba(255,255,255,.2);
  border-radius:999px;
  background:rgba(255,255,255,.055);
  color:rgba(255,255,255,.82);
  font-size:12px;
  backdrop-filter:blur(5px);
}
.bahtsul-home-stats b,.bahtsul-center-stats b{color:#fff;font-size:18px;line-height:1;font-weight:800}
.bahtsul-home-cta{
  width:100%;
  min-height:54px;
  margin-top:24px;
  border:0;
  border-radius:17px;
  padding:0 20px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  background:#d5ad59;
  color:#153b31;
  font-weight:800;
  font-size:14px;
  cursor:pointer;
  box-shadow:0 8px 22px rgba(0,0,0,.08);
}
.bahtsul-home-cta i{font-size:17px;transition:transform .2s ease}
.bahtsul-home-cta:hover i{transform:translateX(3px)}
.bahtsul-home-status{
  margin-top:11px;
  color:rgba(255,255,255,.7);
  text-align:center;
  font-size:11px;
}
.bahtsul-home-status i{margin-right:5px}

/* Halaman pusat */
.bahtsul-center-hero{
  position:relative;
  overflow:hidden;
  padding:26px;
  border-radius:26px;
  color:#fff;
  background:
    radial-gradient(circle at 100% 0,rgba(255,255,255,.08) 0 26%,transparent 26.4%),
    linear-gradient(135deg,#0a4d3c,#0c6b52 66%,#17624f);
  box-shadow:0 16px 38px rgba(9,70,54,.13);
}
.bahtsul-center-hero:after{
  content:"";position:absolute;width:160px;height:160px;right:-70px;bottom:-92px;
  border:1px solid rgba(213,173,89,.15);border-radius:50%;
}
.bahtsul-center-icon{
  width:46px;height:46px;border-radius:15px;
  display:grid;place-items:center;
  margin-bottom:18px;
  color:#e0bc70;
  background:rgba(224,188,112,.12);
  border:1px solid rgba(224,188,112,.16);
  font-size:22px;
}
.bahtsul-center-hero h1{margin:10px 0 8px;font-size:30px;line-height:1.18;letter-spacing:-.025em}
.bahtsul-center-hero p{margin:0;max-width:720px;color:rgba(255,255,255,.82);font-size:14px;line-height:1.7}
.bahtsul-center-stats{margin-top:19px}
.bahtsul-sync-notice{
  display:flex;align-items:center;gap:9px;
  margin:14px 0 0;padding:10px 12px;border-radius:14px;
  background:#fff6e5;color:#7f5a14;border:1px solid #f2dfb8;font-size:12px;
}
[data-theme="dark"] .bahtsul-sync-notice{background:#342a17;color:#e5c278;border-color:#554221}
.bahtsul-searchbox{margin-top:18px}
.bahtsul-searchbox input{padding-left:17px}
.bahtsul-theme-scroll{
  display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;
  margin:12px -2px 0;padding:2px 2px 4px;
}
.bahtsul-theme-scroll::-webkit-scrollbar{display:none}
.bahtsul-chip{
  flex:none;
  border:1px solid var(--line);
  background:var(--card);
  color:var(--muted);
  padding:8px 12px;
  border-radius:999px;
  font-size:12px;
  font-weight:700;
  white-space:nowrap;
  cursor:pointer;
}
.bahtsul-chip b{font-size:10px;margin-left:3px;opacity:.72}
.bahtsul-chip.active{background:var(--green);border-color:var(--green);color:#fff}
.bahtsul-list-head{margin-top:20px}
.bahtsul-list-head>div{display:flex;flex-direction:column;gap:2px}
.bahtsul-list-head h3{font-size:19px}
.bahtsul-mini-label{font-size:9px;letter-spacing:.15em;color:var(--gold);font-weight:800}
.bahtsul-list{display:grid;gap:10px}
.bahtsul-item{
  width:100%;
  display:grid;
  grid-template-columns:42px minmax(0,1fr);
  align-items:start;
  gap:12px;
  padding:15px;
  text-align:left;
  color:var(--text);
  background:var(--card);
  border:1px solid var(--line);
  border-radius:18px;
  cursor:pointer;
  box-shadow:0 4px 16px rgba(15,57,47,.025);
}
.bahtsul-item:hover{border-color:color-mix(in srgb,var(--green) 30%,var(--line));transform:translateY(-1px)}
.bahtsul-item-icon{
  width:42px;height:42px;border-radius:13px;
  display:grid;place-items:center;
  background:#f4eddf;
  color:#9b742d;
  font-size:19px;
}
[data-theme="dark"] .bahtsul-item-icon{background:#2c291e;color:#d4ae61}
.bahtsul-item-copy{display:block;min-width:0}
.bahtsul-item-themes{display:flex;flex-wrap:wrap;gap:5px;margin:0 0 6px}
.bahtsul-theme-tag{
  display:inline-flex;align-items:center;
  min-height:20px;padding:3px 7px;border-radius:999px;
  background:var(--green-soft);color:var(--green);
  font-size:9px;font-weight:800;line-height:1;
}
.bahtsul-item-copy>b{display:block;font-size:15px;line-height:1.35;margin-bottom:6px}
.bahtsul-item-copy>small{
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
  color:var(--muted);
  font-size:11px;
  line-height:1.5;
}
.bahtsul-read-more{display:inline-flex;align-items:center;gap:5px;margin-top:9px;color:var(--green);font-size:10px;font-weight:800}
.bahtsul-empty{
  min-height:180px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;
  border:1px dashed var(--line);border-radius:20px;background:var(--card);padding:28px;color:var(--muted);
}
.bahtsul-empty i{font-size:28px;color:var(--green);margin-bottom:9px}
.bahtsul-empty b{color:var(--text);font-size:14px;margin-bottom:4px}
.bahtsul-empty span{font-size:11px}
.bahtsul-skeleton{
  height:126px;border-radius:18px;
  background:linear-gradient(90deg,var(--card) 20%,var(--green-soft) 46%,var(--card) 72%);
  background-size:240% 100%;animation:bahtsulShimmer 1.2s linear infinite;
  border:1px solid var(--line);
}
@keyframes bahtsulShimmer{to{background-position:-240% 0}}

/* Halaman detail */
.bahtsul-detail{max-width:780px;margin:0 auto}
.bahtsul-detail-loading{min-height:50dvh;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:12px;color:var(--muted);font-size:12px}
.bahtsul-detail-head{
  padding:22px 20px;
  margin-bottom:14px;
  border:1px solid var(--line);
  border-radius:22px;
  background:var(--card);
  box-shadow:var(--shadow);
}
.bahtsul-detail-kicker{display:flex;align-items:center;gap:7px;color:var(--gold);font-size:10px;font-weight:800;letter-spacing:.12em}
.bahtsul-detail-head .bahtsul-item-themes{margin-top:12px}
.bahtsul-detail-head h1{margin:9px 0 10px;font-size:29px;line-height:1.28;letter-spacing:-.025em}
.bahtsul-detail-date{display:flex;align-items:center;gap:6px;color:var(--muted);font-size:11px}
.bahtsul-detail-content{display:grid;gap:12px}
.bahtsul-content-section{
  padding:18px 19px;
  border:1px solid var(--line);
  border-radius:20px;
  background:var(--card);
}
.bahtsul-content-section>h2{
  display:flex;align-items:center;gap:8px;
  margin:0 0 11px;
  color:var(--green);
  font-size:18px;
  line-height:1.3;
}
.bahtsul-content-section>h2:before{
  content:"";width:5px;height:20px;border-radius:999px;background:var(--green);flex:none;
}
.bahtsul-content-section p,.bahtsul-content-section li,.bahtsul-content-section blockquote{
  color:var(--text);font-size:14px;line-height:1.8;
}
.bahtsul-content-section p{margin:0 0 10px}
.bahtsul-content-section p:last-child{margin-bottom:0}
.bahtsul-content-section h3{margin:15px 0 7px;font-size:14px;line-height:1.45;color:var(--text)}
.bahtsul-content-section ul,.bahtsul-content-section ol{padding-left:21px;margin:8px 0}
.bahtsul-content-section blockquote{margin:10px 0;padding:10px 13px;border-left:3px solid var(--gold);background:color-mix(in srgb,var(--card) 70%,#fff1d5);border-radius:0 12px 12px 0}
.bahtsul-content-section.is-question{background:color-mix(in srgb,var(--card) 91%,var(--green-soft))}
.bahtsul-content-section.is-answer{border-color:color-mix(in srgb,var(--green) 20%,var(--line))}
.bahtsul-content-section.is-reference{
  background:#fbf7ee;
  border-color:#eadfc9;
}
[data-theme="dark"] .bahtsul-content-section.is-reference{background:#28251e;border-color:#453e30}
.bahtsul-content-section.is-reference>h2{color:#8d6928}
.bahtsul-content-section.is-reference>h2:before{background:#b98a2f}
.bahtsul-arabic{
  direction:rtl;
  text-align:right;
  font-family:"Noto Naskh Arabic","Traditional Arabic",serif!important;
  font-size:20px!important;
  line-height:2!important;
}
.bahtsul-detail-footer{
  margin-top:16px;padding:16px 17px;
  display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;
  border:1px solid var(--line);border-radius:18px;background:var(--card);
}
.bahtsul-detail-footer>span{font-size:11px;color:var(--muted)}
.bahtsul-source-btn{
  display:inline-flex;align-items:center;gap:7px;
  min-height:40px;padding:8px 12px;border-radius:12px;
  background:var(--green);color:#fff;font-size:11px;font-weight:800;
}

@media(min-width:720px){
  .bahtsul-home-inner{padding:34px 36px 32px}
  .bahtsul-home-card h2{font-size:38px}
  .bahtsul-home-card p{font-size:16px}
  .bahtsul-home-cta{max-width:520px}
  .bahtsul-list{grid-template-columns:repeat(2,minmax(0,1fr))}
  .bahtsul-item{min-height:174px}
}

@media(max-width:560px){
  .bahtsul-home-card{margin-top:24px;border-radius:24px}
  .bahtsul-home-inner{padding:23px 20px 21px}
  .bahtsul-kicker{font-size:9px;letter-spacing:.14em}
  .bahtsul-home-card h2{font-size:27px;margin-top:11px}
  .bahtsul-home-card p{font-size:13px;line-height:1.65}
  .bahtsul-home-stats,.bahtsul-center-stats{gap:8px;margin-top:17px}
  .bahtsul-home-stats span,.bahtsul-center-stats span{min-height:38px;padding:8px 12px;font-size:11px}
  .bahtsul-home-stats b,.bahtsul-center-stats b{font-size:16px}
  .bahtsul-home-cta{min-height:50px;margin-top:20px;border-radius:15px;font-size:13px}
  .bahtsul-center-hero{padding:22px 19px;border-radius:23px}
  .bahtsul-center-icon{width:42px;height:42px;margin-bottom:15px}
  .bahtsul-center-hero h1{font-size:27px}
  .bahtsul-center-hero p{font-size:12px}
  .bahtsul-searchbox{margin-top:14px}
  .bahtsul-list-head{margin-top:17px}
  .bahtsul-item{grid-template-columns:38px minmax(0,1fr);padding:13px;gap:10px;border-radius:16px}
  .bahtsul-item-icon{width:38px;height:38px;border-radius:12px;font-size:17px}
  .bahtsul-item-copy>b{font-size:14px}
  .bahtsul-item-copy>small{font-size:10.5px}
  .bahtsul-detail-head{padding:18px 16px;border-radius:19px}
  .bahtsul-detail-head h1{font-size:24px}
  .bahtsul-content-section{padding:16px 15px;border-radius:18px}
  .bahtsul-content-section>h2{font-size:17px}
  .bahtsul-content-section p,.bahtsul-content-section li,.bahtsul-content-section blockquote{font-size:13px;line-height:1.78}
  .bahtsul-arabic{font-size:19px!important;line-height:2!important}
  .bahtsul-detail-footer{align-items:stretch;flex-direction:column}
  .bahtsul-source-btn{justify-content:center}
}

body.preview-phone .bahtsul-home-card{margin-top:24px;border-radius:24px}
body.preview-phone .bahtsul-home-inner{padding:23px 20px 21px}
body.preview-phone .bahtsul-kicker{font-size:9px;letter-spacing:.14em}
body.preview-phone .bahtsul-home-card h2{font-size:27px;margin-top:11px}
body.preview-phone .bahtsul-home-card p{font-size:13px;line-height:1.65}
body.preview-phone .bahtsul-home-cta{min-height:50px;margin-top:20px;border-radius:15px;font-size:13px}
body.preview-phone .bahtsul-center-hero{padding:22px 19px;border-radius:23px}
body.preview-phone .bahtsul-center-hero h1{font-size:27px}
body.preview-phone .bahtsul-center-hero p{font-size:12px}
body.preview-phone .bahtsul-item{grid-template-columns:38px minmax(0,1fr);padding:13px;gap:10px;border-radius:16px}
body.preview-phone .bahtsul-item-icon{width:38px;height:38px;border-radius:12px;font-size:17px}
body.preview-phone .bahtsul-detail-head h1{font-size:24px}

/* NUHA V1 — Bahtsul Masail: mobile list refinement */
@media(max-width:560px){
  .bahtsul-list{
    grid-template-columns:1fr!important;
    gap:9px;
  }
  .bahtsul-item{
    min-height:0!important;
    grid-template-columns:40px minmax(0,1fr)!important;
    gap:11px!important;
    padding:13px 12px!important;
    border-radius:17px!important;
  }
  .bahtsul-item-icon{
    width:40px!important;
    height:40px!important;
    border-radius:12px!important;
    font-size:18px!important;
  }
  .bahtsul-item-themes{
    gap:4px!important;
    margin-bottom:6px!important;
  }
  .bahtsul-theme-tag{
    min-height:19px!important;
    padding:3px 7px!important;
    font-size:8.5px!important;
  }
  .bahtsul-item-copy>b{
    display:-webkit-box!important;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    overflow:hidden;
    font-size:14px!important;
    line-height:1.38!important;
    margin-bottom:5px!important;
  }
  .bahtsul-item-copy>small{
    font-size:10.5px!important;
    line-height:1.48!important;
    -webkit-line-clamp:2!important;
  }
  .bahtsul-read-more{
    margin-top:7px!important;
    font-size:9.5px!important;
  }
}

/* Mode pratinjau HP berjalan pada viewport desktop, jadi aturan HP harus dipaksa. */
body.preview-phone .bahtsul-list{
  grid-template-columns:1fr!important;
  gap:9px!important;
}
body.preview-phone .bahtsul-item{
  min-height:0!important;
  grid-template-columns:40px minmax(0,1fr)!important;
  gap:11px!important;
  padding:13px 12px!important;
  border-radius:17px!important;
}
body.preview-phone .bahtsul-item-icon{
  width:40px!important;
  height:40px!important;
  border-radius:12px!important;
  font-size:18px!important;
}
body.preview-phone .bahtsul-item-themes{gap:4px!important;margin-bottom:6px!important}
body.preview-phone .bahtsul-theme-tag{min-height:19px!important;padding:3px 7px!important;font-size:8.5px!important}
body.preview-phone .bahtsul-item-copy>b{
  display:-webkit-box!important;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
  font-size:14px!important;
  line-height:1.38!important;
  margin-bottom:5px!important;
}
body.preview-phone .bahtsul-item-copy>small{
  font-size:10.5px!important;
  line-height:1.48!important;
  -webkit-line-clamp:2!important;
}
body.preview-phone .bahtsul-read-more{margin-top:7px!important;font-size:9.5px!important}

/* ==========================================================
   NUHA V1 — BAHTSUL MASAIL THEME CHIPS MOBILE
   Satu baris, swipe horizontal, tanpa scrollbar, chip aktif
   otomatis digeser ke area tengah oleh app.js.
   ========================================================== */
.bahtsul-theme-scroll{
  scroll-snap-type:x proximity;
  scroll-padding-inline:2px 18px;
  overscroll-behavior-x:contain;
  -webkit-overflow-scrolling:touch;
}
.bahtsul-theme-scroll .bahtsul-chip{
  scroll-snap-align:start;
  scroll-snap-stop:normal;
}

@media(max-width:560px){
  .bahtsul-theme-scroll{
    gap:8px!important;
    margin:12px -2px 0!important;
    padding:2px 22px 5px 2px!important;
    mask-image:linear-gradient(to right,#000 0,#000 calc(100% - 18px),transparent 100%);
    -webkit-mask-image:linear-gradient(to right,#000 0,#000 calc(100% - 18px),transparent 100%);
  }
  .bahtsul-theme-scroll .bahtsul-chip{
    min-height:40px!important;
    padding:8px 14px!important;
    font-size:11.5px!important;
  }
  .bahtsul-theme-scroll .bahtsul-chip b{
    font-size:9.5px!important;
    margin-left:3px!important;
  }
}

body.preview-phone .bahtsul-theme-scroll{
  gap:8px!important;
  margin:12px -2px 0!important;
  padding:2px 22px 5px 2px!important;
  mask-image:linear-gradient(to right,#000 0,#000 calc(100% - 18px),transparent 100%);
  -webkit-mask-image:linear-gradient(to right,#000 0,#000 calc(100% - 18px),transparent 100%);
}
body.preview-phone .bahtsul-theme-scroll .bahtsul-chip{
  min-height:40px!important;
  padding:8px 14px!important;
  font-size:11.5px!important;
}
body.preview-phone .bahtsul-theme-scroll .bahtsul-chip b{
  font-size:9.5px!important;
  margin-left:3px!important;
}


/* ==========================================================
   NUHA V1 — BAHTSUL THEME EDGE HINT FINAL
   Di posisi awal hanya chip yang muat penuh yang terlihat.
   Chevron kanan menandakan masih ada tema lain untuk digeser.
   ========================================================== */
.bahtsul-theme-wrap{position:relative}
.bahtsul-theme-more{display:none}

@media(max-width:560px){
  .bahtsul-theme-wrap{margin-top:12px}
  .bahtsul-theme-wrap .bahtsul-theme-scroll{
    margin:0 -2px!important;
    padding:2px 42px 5px 2px!important;
    mask-image:none!important;
    -webkit-mask-image:none!important;
  }
  .bahtsul-theme-scroll.at-start:not(.is-interacting) .bahtsul-chip.edge-cut{
    visibility:hidden!important;
    pointer-events:none!important;
  }
  .bahtsul-theme-more{
    position:absolute;z-index:3;right:-2px;top:2px;
    width:38px;height:40px;padding:0;border:0;
    display:flex;align-items:center;justify-content:flex-end;
    color:var(--green);font-size:18px;cursor:pointer;
    background:linear-gradient(to right,transparent 0%,var(--bg) 42%,var(--bg) 100%);
  }
  .bahtsul-theme-more i{
    width:25px;height:25px;border-radius:999px;
    display:grid;place-items:center;
    background:var(--green-soft);
  }
}

body.preview-phone .bahtsul-theme-wrap{margin-top:12px}
body.preview-phone .bahtsul-theme-wrap .bahtsul-theme-scroll{
  margin:0 -2px!important;
  padding:2px 42px 5px 2px!important;
  mask-image:none!important;
  -webkit-mask-image:none!important;
}
body.preview-phone .bahtsul-theme-scroll.at-start:not(.is-interacting) .bahtsul-chip.edge-cut{
  visibility:hidden!important;
  pointer-events:none!important;
}
body.preview-phone .bahtsul-theme-more{
  position:absolute;z-index:3;right:-2px;top:2px;
  width:38px;height:40px;padding:0;border:0;
  display:flex;align-items:center;justify-content:flex-end;
  color:var(--green);font-size:18px;cursor:pointer;
  background:linear-gradient(to right,transparent 0%,var(--bg) 42%,var(--bg) 100%);
}
body.preview-phone .bahtsul-theme-more i{
  width:25px;height:25px;border-radius:999px;
  display:grid;place-items:center;
  background:var(--green-soft);
}


/* ==========================================================
   NUHA V1 — BAHTSUL THEME BIDIRECTIONAL HINT
   Chevron kiri muncul setelah daftar digeser ke kanan;
   chevron kanan hilang saat sudah mencapai ujung kanan.
   ========================================================== */
.bahtsul-theme-prev{display:none}

@media(max-width:560px){
  .bahtsul-theme-prev,
  .bahtsul-theme-more{
    position:absolute;z-index:4;top:2px;
    width:38px;height:40px;padding:0;border:0;
    align-items:center;cursor:pointer;
    color:var(--green);font-size:18px;
  }
  .bahtsul-theme-prev{
    left:-2px;
    display:flex;justify-content:flex-start;
    background:linear-gradient(to left,transparent 0%,var(--bg) 42%,var(--bg) 100%);
  }
  .bahtsul-theme-more{
    right:-2px;
    display:flex;justify-content:flex-end;
  }
  .bahtsul-theme-prev.hidden,
  .bahtsul-theme-more.hidden{display:none!important}
  .bahtsul-theme-prev i,
  .bahtsul-theme-more i{
    width:25px;height:25px;border-radius:999px;
    display:grid;place-items:center;
    background:var(--green-soft);
  }
}

body.preview-phone .bahtsul-theme-prev,
body.preview-phone .bahtsul-theme-more{
  position:absolute;z-index:4;top:2px;
  width:38px;height:40px;padding:0;border:0;
  align-items:center;cursor:pointer;
  color:var(--green);font-size:18px;
}
body.preview-phone .bahtsul-theme-prev{
  left:-2px;
  display:flex;justify-content:flex-start;
  background:linear-gradient(to left,transparent 0%,var(--bg) 42%,var(--bg) 100%);
}
body.preview-phone .bahtsul-theme-more{
  right:-2px;
  display:flex;justify-content:flex-end;
}
body.preview-phone .bahtsul-theme-prev.hidden,
body.preview-phone .bahtsul-theme-more.hidden{display:none!important}
body.preview-phone .bahtsul-theme-prev i,
body.preview-phone .bahtsul-theme-more i{
  width:25px;height:25px;border-radius:999px;
  display:grid;place-items:center;
  background:var(--green-soft);
}

/* ==============================================================
   BERANDA KOMPAK — NUHA Versi 1
   Proporsi mobile dibuat lebih padat agar satu layar memuat lebih
   banyak fungsi, dengan identitas visual NUHA tetap dipertahankan.
   ============================================================== */
body.home-route .topbar{
  min-height:62px;
  padding:calc(8px + var(--safe-top)) 14px 8px;
  gap:10px;
}
body.home-route .brand{gap:9px}
body.home-route .brand-mark{width:38px;height:38px;border-radius:13px;font-size:20px}
body.home-route .brand strong{font-size:17px}
body.home-route .brand span{font-size:10px;margin-top:2px}
body.home-route .icon-btn{width:38px;height:38px;border-radius:13px;font-size:18px}
body.home-route .view{padding-top:12px}

.home-screen .home-prayer{
  padding:14px 15px 12px;
  border:1px solid var(--line);
  border-radius:19px;
  background:var(--card);
  color:var(--text);
  box-shadow:0 5px 18px rgba(16,50,42,.04);
  cursor:pointer;
}
.home-screen .home-prayer:after{
  width:110px;height:110px;right:-42px;bottom:-64px;
  background:color-mix(in srgb,var(--green-soft) 72%,transparent);
}
.home-screen .home-prayer .hero-top{align-items:center}
.home-screen .home-prayer small{
  display:block;color:var(--muted);opacity:1;font-size:10.5px;line-height:1.25;
}
.home-screen .home-prayer-location i{color:var(--green);margin-right:3px}
.home-screen .home-prayer h2{
  margin:3px 0 0;font-size:22px;line-height:1.15;color:var(--text);font-weight:800;
}
.home-screen .home-prayer h2 strong{color:var(--green);font-weight:800}
.home-screen .home-prayer .countdown{
  margin-top:3px;color:var(--muted);font-size:10.5px;font-weight:700;letter-spacing:.01em;
}
.home-prayer-icon{
  position:relative;z-index:1;flex:0 0 auto;width:38px;height:38px;
  display:grid;place-items:center;border-radius:14px;
  background:var(--green-soft);color:var(--green);font-size:19px;
}
.home-screen .home-prayer .hero-meta{gap:5px;margin-top:9px;position:relative;z-index:1}
.home-screen .home-prayer .pill{
  padding:4px 7px;background:var(--green-soft);color:var(--green);
  font-size:9px;font-weight:700;
}

.home-screen .home-quick-grid{
  margin-top:12px;
  gap:4px 3px;
}
.home-screen .quick{
  min-height:72px;
  padding:5px 1px;
  border:0;
  border-radius:14px;
  background:transparent;
  box-shadow:none;
}
.home-screen .quick:hover,.home-screen .quick:focus-visible{background:var(--green-soft)}
.home-screen .quick .qicon{
  width:36px;height:36px;margin:0 auto 5px;border-radius:13px;
  font-size:18px;
}
.home-screen .quick b{
  font-size:10px;line-height:1.15;font-weight:700;
}

.home-screen .home-search{margin-top:12px}
.home-screen .home-search input{
  min-height:44px;padding:11px 42px 11px 14px;border-radius:15px;
  background:color-mix(in srgb,var(--card) 94%,var(--bg));
  font-size:12.5px;
}
.home-screen .home-search button{
  right:4px;top:4px;width:36px;height:36px;border-radius:12px;font-size:16px;
}
.home-screen .home-section-head{margin:18px 2px 9px}
.home-screen .home-section-head h3{font-size:16px;line-height:1.2}
.home-screen .home-section-head .link-btn{font-size:11px;padding:4px}
.home-screen .news-list{gap:9px}
.home-screen .news-card{border-radius:15px;padding:7px;gap:10px}
.home-screen .news-thumb{width:82px;height:64px;border-radius:12px}
.home-screen .news-card h4{font-size:12px;margin:2px 0 4px;line-height:1.25}
.home-screen .meta{font-size:9.5px}

/* Kartu Bahtsul di Beranda ikut dipadatkan agar skala halaman konsisten. */
.home-screen .bahtsul-home-card{margin-top:18px;border-radius:20px}
.home-screen .bahtsul-home-inner{padding:18px 16px 17px}
.home-screen .bahtsul-kicker{font-size:9px}
.home-screen .bahtsul-home-card h2{font-size:22px;margin-top:8px}
.home-screen .bahtsul-home-card p{font-size:12px;line-height:1.55}
.home-screen .bahtsul-home-stats{margin-top:13px}
.home-screen .bahtsul-home-stats span{min-height:34px;padding:7px 10px;font-size:10px}
.home-screen .bahtsul-home-stats b{font-size:14px}
.home-screen .bahtsul-home-cta{min-height:44px;margin-top:15px;border-radius:13px;font-size:12px}

body.preview-phone.home-route .view{padding:10px 12px 18px}
body.preview-phone.home-route .topbar{padding-left:12px;padding-right:12px}
body.preview-phone .home-screen .home-quick-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:3px 2px}
body.preview-phone .home-screen .quick{min-height:69px}
body.preview-phone .home-screen .quick .qicon{width:35px;height:35px;font-size:17px}
body.preview-phone .home-screen .news-card{grid-template-columns:82px 1fr}
body.preview-phone .home-screen .news-thumb{width:82px;height:64px}

@media(max-width:560px){
  body.home-route .view{padding:10px 12px calc(88px + var(--safe-bottom))}
  .home-screen .home-prayer{padding:13px 14px 11px}
  .home-screen .home-prayer h2{font-size:21px}
  .home-screen .home-quick-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:3px 2px}
  .home-screen .quick{min-height:68px}
  .home-screen .quick .qicon{width:35px;height:35px;font-size:17px}
  .home-screen .quick b{font-size:9.7px}
  .home-screen .news-card{grid-template-columns:82px 1fr}
  .home-screen .news-thumb{width:82px;height:64px}
}


/* ==============================================================
   BERANDA — PALET WARNA NUHA
   Light: hijau lembut + aksen emas hangat.
   Dark: dark emerald, bukan hitam pekat, dengan kontras yang jelas.
   Scope hanya Beranda agar modul Al-Qur'an yang sudah dikunci tidak berubah.
   ============================================================== */

/* Light mode: halaman terasa lebih hidup tanpa ramai warna. */
[data-theme="light"] body.home-route{
  --bg:#f1f6f3;
  --card:#ffffff;
  --text:#1b2924;
  --muted:#687871;
  --line:#dce7e2;
  --green-soft:#e4f4ed;
  --green-soft-2:#d8eee5;
  --shadow:0 8px 24px rgba(18,78,61,.07);
  background:#e8efeb;
}
[data-theme="light"] body.home-route .app-shell{
  background:linear-gradient(180deg,#f7faf8 0%,#f1f6f3 42%,#eef4f1 100%);
}
[data-theme="light"] body.home-route .topbar{
  background:rgba(255,255,255,.96);
  border-bottom-color:#dfe8e4;
}
[data-theme="light"] body.home-route .home-prayer{
  border-color:#d5e8df;
  background:linear-gradient(135deg,#ffffff 0%,#f7fbf9 54%,#ecf7f2 100%);
  box-shadow:0 8px 24px rgba(17,86,66,.07);
}
[data-theme="light"] body.home-route .home-prayer:before{
  content:"";
  position:absolute;
  width:74px;height:74px;border-radius:50%;
  right:-22px;top:-29px;
  border:16px solid rgba(185,138,47,.08);
  pointer-events:none;
}
[data-theme="light"] body.home-route .home-prayer .pill:nth-child(2){
  background:#f7efd9;
  color:#966d22;
}
[data-theme="light"] body.home-route .home-prayer .pill:nth-child(3){
  background:#eef2f0;
  color:#5d7068;
}
[data-theme="light"] body.home-route .home-search input{
  background:#ffffff;
  border-color:#dbe6e1;
  box-shadow:0 4px 15px rgba(18,78,61,.025);
}
[data-theme="light"] body.home-route .news-card{
  border-color:#dde8e3;
  box-shadow:0 4px 15px rgba(18,78,61,.035);
}
[data-theme="light"] body.home-route .bottom-nav{
  background:rgba(255,255,255,.97);
}

/* Shortcut: tetap satu keluarga visual NUHA, tapi tidak monoton. */
body.home-route .home-quick-grid .quick:nth-child(1) .qicon,
body.home-route .home-quick-grid .quick:nth-child(8) .qicon{
  background:#e4f4ed;color:#0d765d;
}
body.home-route .home-quick-grid .quick:nth-child(2) .qicon,
body.home-route .home-quick-grid .quick:nth-child(6) .qicon{
  background:#f7efd9;color:#9a6c1d;
}
body.home-route .home-quick-grid .quick:nth-child(3) .qicon,
body.home-route .home-quick-grid .quick:nth-child(7) .qicon{
  background:#e4f3f2;color:#14766f;
}
body.home-route .home-quick-grid .quick:nth-child(4) .qicon,
body.home-route .home-quick-grid .quick:nth-child(5) .qicon{
  background:#edf1e7;color:#607747;
}

/* Dark mode khusus beranda: lebih terang, berlapis, dan terbaca. */
[data-theme="dark"] body.home-route{
  --bg:#18231f;
  --card:#22312b;
  --text:#f3f7f5;
  --muted:#adbbb5;
  --line:#34463e;
  --green-soft:#294139;
  --green-soft-2:#304d43;
  --shadow:0 10px 28px rgba(0,0,0,.20);
  background:#202b27;
}
[data-theme="dark"] body.home-route .app-shell{
  background:linear-gradient(180deg,#1c2924 0%,#18231f 58%,#1b2722 100%);
}
[data-theme="dark"] body.home-route .topbar{
  background:rgba(31,45,39,.97);
  border-bottom-color:#35483f;
}
[data-theme="dark"] body.home-route .brand-mark{
  background:#117c65;
}
[data-theme="dark"] body.home-route .icon-btn{
  background:#29463c;
  color:#71d0b8;
}
[data-theme="dark"] body.home-route .home-prayer{
  background:linear-gradient(135deg,#26372f 0%,#22322b 56%,#20382f 100%);
  border-color:#3a5047;
  box-shadow:0 10px 26px rgba(0,0,0,.18);
}
[data-theme="dark"] body.home-route .home-prayer:after{
  background:rgba(66,190,155,.09);
}
[data-theme="dark"] body.home-route .home-prayer:before{
  content:"";
  position:absolute;
  width:74px;height:74px;border-radius:50%;
  right:-22px;top:-29px;
  border:16px solid rgba(215,183,107,.07);
  pointer-events:none;
}
[data-theme="dark"] body.home-route .home-prayer-location i,
[data-theme="dark"] body.home-route .home-prayer h2 strong,
[data-theme="dark"] body.home-route .home-section-head .link-btn{
  color:#62cdb1;
}
[data-theme="dark"] body.home-route .home-prayer-icon{
  background:#2b493f;
  color:#68d1b5;
}
[data-theme="dark"] body.home-route .home-prayer .pill{
  background:#2c463d;
  color:#bfe7dc;
}
[data-theme="dark"] body.home-route .home-prayer .pill:nth-child(2){
  background:#403925;
  color:#e5c877;
}
[data-theme="dark"] body.home-route .home-prayer .pill:nth-child(3){
  background:#303b36;
  color:#bec9c4;
}
[data-theme="dark"] body.home-route .home-quick-grid .quick:hover,
[data-theme="dark"] body.home-route .home-quick-grid .quick:focus-visible{
  background:#24372f;
}
[data-theme="dark"] body.home-route .home-quick-grid .quick:nth-child(1) .qicon,
[data-theme="dark"] body.home-route .home-quick-grid .quick:nth-child(8) .qicon{
  background:#29483d;color:#67d1b4;
}
[data-theme="dark"] body.home-route .home-quick-grid .quick:nth-child(2) .qicon,
[data-theme="dark"] body.home-route .home-quick-grid .quick:nth-child(6) .qicon{
  background:#403925;color:#e3c474;
}
[data-theme="dark"] body.home-route .home-quick-grid .quick:nth-child(3) .qicon,
[data-theme="dark"] body.home-route .home-quick-grid .quick:nth-child(7) .qicon{
  background:#284442;color:#74cec7;
}
[data-theme="dark"] body.home-route .home-quick-grid .quick:nth-child(4) .qicon,
[data-theme="dark"] body.home-route .home-quick-grid .quick:nth-child(5) .qicon{
  background:#354235;color:#b7c99a;
}
[data-theme="dark"] body.home-route .home-search input{
  background:#22312b;
  border-color:#3a4d45;
  color:#f3f7f5;
}
[data-theme="dark"] body.home-route .home-search input::placeholder{color:#9faea8}
[data-theme="dark"] body.home-route .home-search button{
  background:#2b493f;
  color:#69cfb4;
}
[data-theme="dark"] body.home-route .news-card{
  background:#22312b;
  border-color:#354940;
  box-shadow:0 5px 18px rgba(0,0,0,.12);
}
[data-theme="dark"] body.home-route .bottom-nav{
  background:rgba(31,45,39,.98);
  border-top-color:#35483f;
}
[data-theme="dark"] body.home-route .bottom-nav a{color:#aebbb6}
[data-theme="dark"] body.home-route .bottom-nav a.active{
  color:#6fd2b8;
  background:#29463c;
}

/* Lokasi di kartu jadwal sengaja berupa nama wilayah, bukan koordinat mentah. */
.home-screen .home-prayer-location{
  max-width:260px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

/* ===== NUHA Versi 1 — Beranda dark shortcut text fix =====
   Tombol browser tidak selalu mewarisi `color` dari body. Tetapkan warna
   shortcut secara eksplisit agar label tetap terbaca pada tema gelap. */
.home-screen .home-quick-grid .quick{
  color:var(--text);
}
.home-screen .home-quick-grid .quick b{
  color:inherit;
}
[data-theme="dark"] body.home-route .home-screen .home-quick-grid .quick{
  color:#f1f6f4;
}

/* NUHA v1 — Amaliyah premium landing */
.amaliyah-head{
  display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:14px
}
.amaliyah-head .page-subtitle{margin-bottom:0;max-width:620px}
.amaliyah-head-icon{
  width:44px;height:44px;flex:none;border-radius:15px;display:grid;place-items:center;
  background:var(--green-soft);color:var(--green);font-size:21px
}
.amaliyah-hero{
  position:relative;overflow:hidden;margin-bottom:14px;padding:18px 18px 16px;
  border-radius:28px;border:1px solid rgba(16,99,72,.10);
  background:linear-gradient(135deg,rgba(16,99,72,.08),rgba(255,255,255,.98) 54%,rgba(214,185,118,.12) 100%);
  box-shadow:0 12px 28px rgba(16,50,42,.05)
}
.amaliyah-hero::before{
  content:"";position:absolute;left:-40px;bottom:-44px;width:150px;height:150px;border-radius:50%;
  background:radial-gradient(circle,rgba(16,99,72,.10),rgba(16,99,72,0) 72%)
}
.amaliyah-hero::after{
  content:"";position:absolute;right:-18px;top:-22px;width:118px;height:118px;border-radius:50%;
  background:radial-gradient(circle,rgba(214,185,118,.18),rgba(214,185,118,0) 68%)
}
.amaliyah-hero-copy,.amaliyah-hero .page-title,.amaliyah-hero .page-subtitle{position:relative;z-index:1}
.amaliyah-hero-kicker{
  display:inline-flex;align-items:center;gap:7px;padding:8px 12px;border-radius:999px;
  background:rgba(255,255,255,.72);backdrop-filter:blur(10px);border:1px solid rgba(16,99,72,.08);
  color:var(--brand);font-size:12px;font-weight:800;letter-spacing:.02em;margin-bottom:12px
}
.amaliyah-hero .page-title{margin-bottom:6px}
.amaliyah-hero .page-subtitle{margin-bottom:0;max-width:88%;line-height:1.52}
.amaliyah-hero-orb{
  position:absolute;right:18px;top:18px;width:54px;height:54px;border-radius:18px;display:grid;place-items:center;
  background:rgba(255,255,255,.62);backdrop-filter:blur(12px);border:1px solid rgba(16,99,72,.08);
  color:var(--brand);font-size:22px;box-shadow:0 8px 22px rgba(16,50,42,.04)
}
.amaliyah-category-grid{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px
}
.amaliyah-category{
  position:relative;display:grid;grid-template-columns:44px minmax(0,1fr) 16px;align-items:center;gap:11px;
  min-height:84px;padding:12px 12px;border:1px solid var(--line);border-radius:22px;
  background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(250,252,251,.98));color:var(--text);text-align:left;cursor:pointer;
  box-shadow:0 8px 22px rgba(16,50,42,.035);transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease
}
.amaliyah-category:active{transform:translateY(1px)}
.amaliyah-category .cat-icon{
  width:44px;height:44px;border-radius:15px;display:grid;place-items:center;font-size:20px;
  background:var(--green-soft);color:var(--green);box-shadow:inset 0 0 0 1px rgba(16,99,72,.05)
}
.amaliyah-category-copy{min-width:0}
.amaliyah-category h3{font-size:13.5px;line-height:1.24;margin:0 0 4px}
.amaliyah-category p{font-size:10.5px;line-height:1.3;margin:0;color:var(--muted)}
.amaliyah-category-arrow{font-size:12px;color:var(--muted)}
.amaliyah-category.tone-gold .cat-icon{background:#fff3cf;color:#9b6a08}
.amaliyah-category.tone-teal .cat-icon{background:#e4f5f3;color:#087c72}
.amaliyah-category.tone-olive .cat-icon{background:#edf2df;color:#697b2f}
.amaliyah-section-head{margin-top:22px;margin-bottom:10px;align-items:end}
.amaliyah-section-head h3{font-size:16px}
.amaliyah-section-head p{margin:4px 0 0;font-size:12px;color:var(--muted)}
.amaliyah-surah-quick{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.amaliyah-surah-btn{
  min-width:0;border:1px solid var(--line);background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(247,250,248,.98));color:var(--text);border-radius:18px;
  padding:11px 5px 10px;text-align:center;cursor:pointer;box-shadow:0 8px 20px rgba(16,50,42,.025)
}
.amaliyah-surah-btn .num{width:34px;height:34px;margin:0 auto 6px;border-radius:11px;font-size:12px}
.amaliyah-surah-name{
  height:32px;margin:0 0 4px;padding:0 2px;display:grid;place-items:center;overflow:hidden;color:var(--green)
}
.amaliyah-surah-glyph{
  display:none;
  font-family:"QuranComSurahNames"!important;
  font-size:28px;font-weight:400;font-style:normal;line-height:1;
  color:var(--green);white-space:nowrap;letter-spacing:0;
  text-rendering:geometricPrecision;-webkit-font-smoothing:antialiased;
  transform-origin:center center
}
.amaliyah-surah-name.surah-56 .amaliyah-surah-glyph,
.amaliyah-surah-name.surah-18 .amaliyah-surah-glyph{font-size:24px}
.amaliyah-surah-name.surah-67 .amaliyah-surah-glyph{font-size:27px}
.amaliyah-surah-ar-fallback{
  display:block;
  font-family:"UthmanicHafs","Noto Naskh Arabic","Traditional Arabic",serif;
  font-size:21px;font-weight:400;line-height:1.2;
  color:var(--green);white-space:nowrap;
  text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased
}
html.qurancom-surah-font-ready .amaliyah-surah-glyph{display:block}
html.qurancom-surah-font-ready .amaliyah-surah-ar-fallback{display:none}
.amaliyah-surah-btn b{display:block;font-size:10px;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.selected-surah-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:16px}
.selected-surah-choice{min-width:0;min-height:118px;border:1px solid var(--line);background:linear-gradient(180deg,rgba(255,255,255,.99),rgba(247,250,248,.98));color:var(--text);border-radius:20px;padding:15px 6px 12px;text-align:center;cursor:pointer;box-shadow:0 9px 24px rgba(16,50,42,.035);transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease}
.selected-surah-choice:active{transform:scale(.98)}
.selected-surah-choice:hover{border-color:color-mix(in srgb,var(--green) 28%,var(--line));box-shadow:0 11px 28px rgba(16,50,42,.055)}
.selected-surah-choice .amaliyah-surah-name{height:38px;margin-bottom:7px}
.selected-surah-choice .amaliyah-surah-glyph{font-size:31px}
.selected-surah-choice .amaliyah-surah-name.surah-56 .amaliyah-surah-glyph,
.selected-surah-choice .amaliyah-surah-name.surah-18 .amaliyah-surah-glyph{font-size:27px}
.selected-surah-choice .amaliyah-surah-name.surah-67 .amaliyah-surah-glyph{font-size:30px}
.selected-surah-choice .amaliyah-surah-ar-fallback{font-size:23px}
.selected-surah-choice b{display:block;font-size:12.5px;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.selected-surah-choice small{display:block;margin-top:5px;color:var(--muted);font-size:9.5px;font-weight:700;white-space:nowrap}
[data-theme="dark"] .selected-surah-choice{background:linear-gradient(180deg,rgba(124,211,167,.03),rgba(24,31,28,.98));box-shadow:none;border-color:rgba(124,211,167,.08)}
@media(max-width:360px){
  .selected-surah-grid{gap:7px}
  .selected-surah-choice{min-height:104px;padding:12px 4px 10px;border-radius:17px}
  .selected-surah-choice .amaliyah-surah-name{height:33px;margin-bottom:5px}
  .selected-surah-choice .amaliyah-surah-glyph{font-size:27px}
  .selected-surah-choice .amaliyah-surah-name.surah-56 .amaliyah-surah-glyph,
  .selected-surah-choice .amaliyah-surah-name.surah-18 .amaliyah-surah-glyph{font-size:23px}
  .selected-surah-choice .amaliyah-surah-name.surah-67 .amaliyah-surah-glyph{font-size:26px}
  .selected-surah-choice .amaliyah-surah-ar-fallback{font-size:20px}
  .selected-surah-choice b{font-size:10.5px}
  .selected-surah-choice small{font-size:8.5px}
}
.amaliyah-favorite-row{
  width:100%;margin-top:14px;display:grid;grid-template-columns:40px 1fr 18px;gap:10px;align-items:center;
  border:1px solid var(--line);background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(247,250,248,.98));color:var(--text);border-radius:20px;padding:12px 12px;text-align:left;cursor:pointer;
  box-shadow:0 8px 22px rgba(16,50,42,.03)
}
.amaliyah-favorite-icon{width:40px;height:40px;border-radius:13px;background:var(--green-soft);color:var(--green);display:grid;place-items:center}
.amaliyah-favorite-row b{display:block;font-size:12px}
.amaliyah-favorite-row small{display:block;color:var(--muted);font-size:9px;margin-top:2px}
.amaliyah-favorite-row>.bi{color:var(--muted);font-size:12px}
.amaliyah-list-hero{
  display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:14px;padding:17px 18px;border-radius:26px;
  border:1px solid rgba(16,99,72,.08);background:linear-gradient(135deg,rgba(16,99,72,.07),rgba(255,255,255,.98) 58%,rgba(214,185,118,.10) 100%)
}
.amaliyah-list-hero.tone-teal{background:linear-gradient(135deg,rgba(16,99,72,.08),rgba(255,255,255,.98) 64%,rgba(162,221,216,.16) 100%)}
.amaliyah-list-hero.tone-gold{background:linear-gradient(135deg,rgba(214,185,118,.15),rgba(255,255,255,.98) 56%,rgba(16,99,72,.06) 100%)}
.amaliyah-list-hero .page-subtitle{margin:6px 0 0;max-width:520px;line-height:1.5}
.amaliyah-list-badge{display:inline-flex;align-items:center;justify-content:center;white-space:nowrap;padding:8px 12px;border-radius:999px;background:rgba(255,255,255,.76);border:1px solid rgba(16,99,72,.08);color:var(--brand);font-size:12px;font-weight:800}
body.dark .amaliyah-category.tone-gold .cat-icon{background:#46391f;color:#f3c75d}
body.dark .amaliyah-category.tone-teal .cat-icon{background:#163b37;color:#73d9cf}
body.dark .amaliyah-category.tone-olive .cat-icon{background:#303a27;color:#bdd386}
[data-theme="dark"] .amaliyah-hero,[data-theme="dark"] .amaliyah-list-hero{background:linear-gradient(135deg,rgba(124,211,167,.09),rgba(20,26,23,.96) 58%,rgba(214,185,118,.08) 100%);border-color:rgba(124,211,167,.10);box-shadow:none}
[data-theme="dark"] .amaliyah-hero-kicker,[data-theme="dark"] .amaliyah-hero-orb,[data-theme="dark"] .amaliyah-list-badge{background:rgba(255,255,255,.04);border-color:rgba(124,211,167,.10)}
[data-theme="dark"] .amaliyah-category,[data-theme="dark"] .amaliyah-surah-btn,[data-theme="dark"] .amaliyah-favorite-row{background:linear-gradient(180deg,rgba(124,211,167,.03),rgba(24,31,28,.98));box-shadow:none;border-color:rgba(124,211,167,.08)}
@media(max-width:360px){
  .amaliyah-category-grid{gap:8px}
  .amaliyah-category{grid-template-columns:38px minmax(0,1fr) 12px;gap:8px;padding:10px 9px;min-height:78px}
  .amaliyah-category .cat-icon{width:38px;height:38px;font-size:18px}
  .amaliyah-category h3{font-size:12px}
  .amaliyah-hero{padding:16px 15px 15px;border-radius:24px}
  .amaliyah-hero-orb{width:48px;height:48px;right:14px;top:14px}
  .amaliyah-hero .page-subtitle{max-width:84%}
  .amaliyah-list-hero{padding:15px 14px;border-radius:22px;gap:10px}
  .amaliyah-list-badge{padding:7px 10px;font-size:11px}
  .amaliyah-surah-glyph{font-size:25px}
  .amaliyah-surah-name.surah-56 .amaliyah-surah-glyph,
  .amaliyah-surah-name.surah-18 .amaliyah-surah-glyph{font-size:21px}
  .amaliyah-surah-name.surah-67 .amaliyah-surah-glyph{font-size:24px}
  .amaliyah-surah-ar-fallback{font-size:19px}
  .amaliyah-surah-btn b{font-size:9px}
}

/* NUHA v1 — Yasin & Tahlil reader tabs, gaya ringkas ala aplikasi mobile */
.yt-tabbar{
  position:sticky;top:72px;z-index:34;
  margin:0 -16px 12px;
  padding:9px 16px 10px;
  background:linear-gradient(180deg,#0d765f,var(--green));
  border-bottom:1px solid color-mix(in srgb,var(--green) 70%,#000 8%);
  box-shadow:none;
}
.yt-segmented{
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;
  padding:3px;border-radius:14px;
  background:#f8faf9;
  border:1px solid rgba(0,0,0,.05);
  box-shadow:0 2px 8px rgba(0,0,0,.09);
  overflow:hidden;
}
.yt-tab{
  min-width:0;border:0;border-radius:11px;padding:9px 7px;
  background:transparent;color:#202926;
  font-weight:700;font-size:13px;line-height:1.1;cursor:pointer;
  transition:background .16s ease,color .16s ease;
}
.yt-tab + .yt-tab{border-left:1px solid #e6ebe8}
.yt-tab.active{
  background:#e3e9e6;color:#0b6f59;
  box-shadow:none;
}
.yt-tab:active{background:#dce5e1}
.yt-reader-tools{
  display:flex;align-items:center;justify-content:flex-end;gap:10px;
  margin:0 1px 8px;
}
.yt-reader-label{min-width:0}
.yt-reader-label b{display:block;font-size:14px;line-height:1.15}
.yt-reader-label span{display:block;color:var(--muted);font-size:10px;margin-top:2px}
.yt-aa{
  flex:none;width:34px;height:32px;padding:0;border-radius:10px;
  display:grid;place-items:center;font-size:11px;font-weight:800;
}
.yt-content{
  padding:8px 14px 18px;
  border-radius:18px;
}
.yt-content .ayah{padding:13px 1px}
.yt-content .arabic{
  font-size:calc(var(--arabic-size) * .82);
  line-height:1.82;
  letter-spacing:0;
  text-align:right;
  font-weight:400;
}
.yt-content[data-reading="yasin"] .arabic{
  font-family:"Amiri Quran","Noto Naskh Arabic","Traditional Arabic",serif;
}
.yt-content[data-reading="tahlil"] .arabic,
.yt-content[data-reading="doa"] .arabic{
  font-family:"Amiri","Noto Naskh Arabic","Traditional Arabic",serif;
}
.yt-basmala{
  padding:11px 6px 15px;
  margin:0 0 2px;
  text-align:center!important;
  direction:rtl;
  font-family:"Amiri Quran","Noto Naskh Arabic","Traditional Arabic",serif!important;
  font-size:calc(var(--arabic-size) * .72)!important;
  line-height:1.65!important;
  border-bottom:1px solid var(--line);
}
.yt-content .ayah-no{
  min-width:27px;height:27px;font-size:10px;margin-left:5px;
}
[data-theme="dark"] .yt-tabbar{
  background:linear-gradient(180deg,#135e50,#104d42);
  border-bottom-color:#254b41;
}
[data-theme="dark"] .yt-segmented{
  background:#edf2ef;border-color:#dbe4df;box-shadow:none;
}
[data-theme="dark"] .yt-tab{color:#27312d}
[data-theme="dark"] .yt-tab + .yt-tab{border-left-color:#d9e1dd}
[data-theme="dark"] .yt-tab.active{background:#d5dfda;color:#0b6652}
/* Pada preview HP, .view adalah area scroll. Hilangkan padding atas route ini
   agar bar tab benar-benar menempel di bawah header, lalu sticky terhadap .view. */
body.preview-phone.bottom-nav-visible.yasin-tahlil-route .view{padding-top:0}
body.preview-phone .yt-tabbar{top:0;margin:0 -16px 12px;padding:9px 16px 10px}
body.preview-phone .yt-content{padding:5px 12px 16px}
body.preview-phone .yt-content .arabic{font-size:calc(var(--arabic-size) * .78);line-height:1.78}
body.preview-phone .yt-content .ayah{padding:11px 0}
@media(max-width:420px){
  .yt-tab{font-size:12px;padding:8px 5px}
  .yt-reader-label b{font-size:13px}
  .yt-content .arabic{font-size:calc(var(--arabic-size) * .76)}
  .yt-basmala{font-size:calc(var(--arabic-size) * .68)!important}
}


/* NUHA v1 — konten final Tahlil & Doa Tahlil */
.yt-amal-block{
  position:relative;padding:15px 5px 16px;margin:0;
  border-bottom:1px solid var(--line);
}
.yt-amal-block:last-child{border-bottom:0}
.yt-amal-block .arabic{
  white-space:normal;text-align:right;direction:rtl;
  font-family:"Amiri","Noto Naskh Arabic","Traditional Arabic",serif;
  font-size:calc(var(--arabic-size) * .76);line-height:1.95;
}
.yt-amal-block.center .arabic{text-align:center}
.yt-amal-block.quran .arabic{font-family:"Amiri Quran","Noto Naskh Arabic","Traditional Arabic",serif}
.yt-amal-block.soft{
  margin:7px 0;border:0;border-radius:12px;padding:11px 10px;
  background:color-mix(in srgb,var(--green) 6%,var(--card));
}
.yt-amal-label{
  display:inline-flex;align-items:center;min-height:23px;margin:0 0 8px;
  padding:3px 9px;border-radius:999px;background:var(--soft);color:var(--green);
  font-size:9px;font-weight:800;letter-spacing:.01em;
}
.yt-repeat{
  display:table;margin:8px 0 0 auto;padding:3px 9px;border-radius:999px;
  background:var(--soft);color:var(--green);font-size:10px;font-weight:800;
}
.yt-amal-block.center .yt-repeat{margin-left:auto;margin-right:auto}
.yt-amal-divider{display:flex;align-items:center;gap:8px;margin:4px 0;color:var(--green)}
.yt-amal-divider:before,.yt-amal-divider:after{content:"";height:1px;flex:1;background:var(--line)}
.yt-amal-divider span{font-size:10px;opacity:.7}
.yt-amal-cue{
  width:max-content;max-width:100%;margin:10px auto 3px;padding:5px 12px;border-radius:999px;
  background:color-mix(in srgb,var(--gold,#b38b34) 13%,var(--card));
  color:var(--text);font-family:"Amiri","Noto Naskh Arabic",serif;font-size:17px;direction:rtl;text-align:center;
}
[data-theme="dark"] .yt-amal-block.soft{background:#172b24}
[data-theme="dark"] .yt-amal-label,[data-theme="dark"] .yt-repeat{background:#183c32;color:#8de0c9}
@media(max-width:420px){
  .yt-amal-block{padding:12px 2px 13px}
  .yt-amal-block .arabic{font-size:calc(var(--arabic-size) * .71);line-height:1.9}
}

.maulid-list-item p,.amaliyah-list-item p{display:none}


/* NUHA v1.62 — Maulid & Shalawat list: susunan vertikal stabil */
.maulid-list-item{
  width:100%;display:grid!important;
  grid-template-columns:42px minmax(0,1fr) 18px!important;
  align-items:center!important;gap:12px!important;
  min-height:92px;padding:14px 16px!important;border-radius:19px!important;text-align:left;
}
.maulid-list-item .num{width:40px;height:40px;border-radius:13px;font-size:16px;font-weight:800;align-self:center}
.maulid-list-item .amaliyah-copy{min-width:0;display:flex;flex-direction:column;justify-content:center;gap:5px;text-align:left}
.maulid-list-item .amaliyah-copy h4{
  margin:0!important;font-size:15px!important;line-height:1.24!important;font-weight:800!important;
  letter-spacing:-.01em;color:var(--text);display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;
}
.maulid-list-item .ar-name{
  display:block;width:100%;margin:0!important;
  font-family:"Noto Naskh Arabic","Amiri","Traditional Arabic",serif!important;
  font-size:21px!important;line-height:1.42!important;font-weight:400!important;color:var(--green)!important;
  text-align:right!important;direction:rtl;unicode-bidi:plaintext;overflow-wrap:normal!important;word-break:normal!important;white-space:normal;
}
.maulid-list-item .amaliyah-arrow{
  position:static!important;align-self:center;justify-self:end;flex:none;margin:0!important;color:var(--muted);font-size:15px!important;
}
body.preview-phone .maulid-list-item{
  grid-template-columns:40px minmax(0,1fr) 16px!important;min-height:88px;padding:13px 14px!important;gap:10px!important;
}
body.preview-phone .maulid-list-item .num{width:38px;height:38px;font-size:14px}
body.preview-phone .maulid-list-item .amaliyah-copy h4{font-size:14px!important}
body.preview-phone .maulid-list-item .ar-name{font-size:19px!important;line-height:1.4!important}
[data-theme="dark"] .maulid-list-item .ar-name{color:#8bdcc6!important}


/* NUHA v1.63 — daftar Maulid & Shalawat: satu judul saja */
.maulid-list-item{
  grid-template-columns:40px minmax(0,1fr) 16px!important;
  min-height:72px!important;
  padding:12px 14px!important;
  gap:12px!important;
}
.maulid-list-item .num{width:38px!important;height:38px!important;border-radius:13px!important;font-size:14px!important;background:rgba(16,99,72,.08)!important;color:var(--brand)!important}
.maulid-list-item .amaliyah-copy{gap:0!important;justify-content:center!important}
.maulid-list-item .amaliyah-copy h4{
  font-size:15px!important;line-height:1.3!important;font-weight:800!important;
  -webkit-line-clamp:2;text-align:left!important;
}
.maulid-list-item .ar-name{display:none!important}
body.preview-phone .maulid-list-item{min-height:68px!important;padding:11px 13px!important;gap:10px!important}
body.preview-phone .maulid-list-item .num{width:36px!important;height:36px!important;font-size:13px!important}
body.preview-phone .maulid-list-item .amaliyah-copy h4{font-size:14px!important;line-height:1.28!important}

/* NUHA v1 - Maulid Diba'i reader */
.dibai-card{padding:8px 16px 24px}
.dibai-reader{max-width:720px;margin:0 auto}
.dibai-basmala{
  text-align:center!important;
  font-family:"Amiri Quran","Amiri","Noto Naskh Arabic","Traditional Arabic",serif!important;
  font-size:calc(var(--arabic-size) * .72)!important;
  line-height:1.7!important;
  padding:18px 8px 12px;
  color:var(--green);
}
.dibai-section{
  position:relative;
  padding:18px 2px 20px;
  border-top:1px solid var(--line);
}
.dibai-section:first-of-type{border-top:0}
.dibai-label{
  display:inline-flex;align-items:center;
  min-height:25px;padding:5px 10px;margin:0 0 10px;
  border-radius:999px;background:var(--green-soft);
  color:var(--green);font-size:10px;font-weight:800;letter-spacing:.01em;
}
.dibai-section .arabic{
  font-family:"Amiri","Noto Naskh Arabic","Traditional Arabic",serif;
  font-size:calc(var(--arabic-size) * .78);
  line-height:1.9;
  text-align:right;
}
.dibai-section.poem .arabic{line-height:2.05}
.dibai-section.center .arabic{text-align:center}
.dibai-salawat{
  margin:2px 0 10px;padding:12px 14px;
  border-radius:14px;background:color-mix(in srgb,var(--green-soft) 78%,var(--card));
  color:var(--green);text-align:center!important;
  font-family:"Amiri","Noto Naskh Arabic","Traditional Arabic",serif!important;
  font-size:calc(var(--arabic-size) * .68)!important;
  line-height:1.65!important;
}
[data-theme="dark"] .dibai-label{background:#173e34;color:#8cdfc8}
[data-theme="dark"] .dibai-salawat{background:#173329;color:#9be6d1}
@media(max-width:480px){
  .dibai-card{padding:5px 12px 22px}
  .dibai-basmala{font-size:calc(var(--arabic-size) * .66)!important;padding:14px 4px 10px}
  .dibai-section{padding:14px 0 16px}
  .dibai-section .arabic{font-size:calc(var(--arabic-size) * .72);line-height:1.82}
  .dibai-section.poem .arabic{line-height:1.95}
  .dibai-salawat{font-size:calc(var(--arabic-size) * .62)!important;padding:10px 10px}
  .dibai-label{font-size:9px;padding:4px 9px}
}
body.preview-phone .dibai-card{padding:4px 12px 22px}
body.preview-phone .dibai-section .arabic{font-size:calc(var(--arabic-size) * .70);line-height:1.82}
body.preview-phone .dibai-section.poem .arabic{line-height:1.92}
body.preview-phone .dibai-salawat{font-size:calc(var(--arabic-size) * .60)!important}


/* ===== NUHA BRANDING FINAL — Versi 1 ===== */
.brand-mark.brand-logo{padding:0;background:transparent;overflow:hidden;border-radius:14px}
.brand-mark.brand-logo img{width:100%;height:100%;display:block;object-fit:contain}
body.home-route .brand-mark.brand-logo{background:transparent}
[data-theme="dark"] body.home-route .brand-mark.brand-logo{background:transparent;box-shadow:none}

.app-splash{position:fixed;inset:0;z-index:9999;display:grid;place-items:center;background:var(--bg);transition:opacity .32s ease,visibility .32s ease}
.app-splash.hide{opacity:0;visibility:hidden}
.app-splash-card{width:min(86vw,360px);text-align:center;padding:28px 24px}
.app-splash-logo{width:108px;height:108px;object-fit:contain;filter:drop-shadow(0 12px 24px rgba(10,75,50,.18))}
.app-splash-card strong{display:block;font-size:32px;line-height:1;margin-top:14px;color:var(--green)}
.app-splash-card span{display:block;font-weight:800;font-size:14px;margin-top:9px;color:var(--text)}
.app-splash-card small{display:block;margin-top:5px;color:var(--muted);font-size:12px}

.nuha-settings-brand{display:flex;align-items:center;gap:12px;margin-top:6px}
.nuha-settings-brand img{width:56px;height:56px;object-fit:contain;flex:none}
.nuha-settings-brand b{font-size:20px;color:var(--green)}
.nuha-settings-brand p{margin:2px 0;font-size:12px;font-weight:700}
.nuha-settings-brand small{color:var(--muted);font-size:10px}
.settings-info-item{margin-bottom:0}

.nuha-about{text-align:center;overflow:hidden;padding:20px}
.nuha-about picture{display:block}
.nuha-about picture img{display:block;max-width:100%;max-height:260px;margin:0 auto;object-fit:contain}
.nuha-about-copy{max-width:680px;margin:18px auto 0}
.nuha-about-copy h3{font-size:30px;color:var(--green);margin:0}
.nuha-about-copy p{line-height:1.65;margin:7px 0;color:var(--text)}
.developer-credit{margin:18px auto 0;display:inline-flex;align-items:center;gap:9px;padding:10px 14px;border-radius:999px;background:var(--green-soft);color:var(--green);font-size:12px}

.info-stack{display:grid;gap:12px}
.info-stack .card h3{margin:0 0 7px;font-size:16px}
.info-stack .card p{margin:0;color:var(--muted);font-size:13px;line-height:1.65}
.info-card{display:flex;gap:13px;align-items:flex-start}
.source-card{padding:16px 16px 15px;border-radius:24px}
.source-card-body{min-width:0;flex:1}
.source-kicker{display:inline-flex;align-items:center;gap:6px;margin-bottom:8px;padding:6px 10px;border-radius:999px;background:color-mix(in srgb,var(--green) 10%,var(--card));color:var(--green);font-size:10px;font-weight:900;letter-spacing:.08em;text-transform:uppercase}
.source-card h3{margin:0 0 6px!important;font-size:18px}
.source-card p{margin:0;color:var(--muted);font-size:13px;line-height:1.7}
.source-mini-label{margin-top:12px;margin-bottom:8px;font-size:11px;font-weight:800;color:var(--text);text-transform:uppercase;letter-spacing:.05em}
.source-chip-list{display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0;list-style:none}
.source-chip-list li{display:inline-flex;align-items:center;min-height:34px;padding:8px 12px;border-radius:14px;background:color-mix(in srgb,var(--green) 7%,var(--surface));border:1px solid color-mix(in srgb,var(--green) 14%,var(--line));font-size:12px;font-weight:700;color:var(--text);line-height:1.35}
.source-chip-list.compact-two-cols li{min-width:calc(50% - 4px)}
.source-expand{margin-top:12px;border-top:1px dashed color-mix(in srgb,var(--green) 18%,var(--line));padding-top:12px}
.source-expand summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:10px;cursor:pointer;font-size:13px;font-weight:800;color:var(--green)}
.source-expand summary::-webkit-details-marker{display:none}
.source-expand summary i{transition:transform .2s ease}
.source-expand[open] summary i{transform:rotate(180deg)}
.source-expand-body{padding-top:10px}
.source-expand-body p{margin:0 0 10px;font-size:12.5px;line-height:1.7}
.source-detail-list{margin:0;padding-left:18px;color:var(--muted);display:grid;gap:8px}
.source-detail-list li{font-size:12.5px;line-height:1.6}
.source-card-brief .source-kicker{margin-bottom:7px}
.source-card-brief p{font-size:13px}
@media (max-width:560px){
  .source-card{padding:14px 14px 13px;border-radius:22px}
  .source-card h3{font-size:17px}
  .source-chip-list{gap:7px}
  .source-chip-list li{font-size:11.5px;padding:8px 10px;border-radius:13px}
  .source-chip-list.compact-two-cols li{min-width:100%}
  .source-expand summary{font-size:12.5px}
}
.info-icon{width:42px;height:42px;border-radius:14px;display:grid;place-items:center;background:var(--green-soft);color:var(--green);font-size:20px;flex:none}
.guide-card{display:flex;gap:13px;align-items:flex-start}
.guide-card>span{width:34px;height:34px;border-radius:12px;display:grid;place-items:center;background:var(--green);color:#fff;font-weight:800;flex:none}
.guide-card h3{margin:1px 0 4px!important}
.version-hero{display:flex;align-items:center;gap:14px;margin-bottom:14px}
.version-hero img{width:72px;height:72px;object-fit:contain}
.version-hero span,.version-hero b,.version-hero small{display:block}
.version-hero span{font-size:12px;color:var(--muted)}
.version-hero b{font-size:24px;color:var(--green);margin:2px 0}
.version-hero small{color:var(--muted)}
.version-list .card{display:flex;align-items:center;justify-content:space-between;gap:12px}
.version-list .card b{font-size:13px}
.status-ok,.status-progress{font-size:10px;font-weight:800;border-radius:999px;padding:6px 9px;white-space:nowrap}
.status-ok{background:var(--green-soft);color:var(--green)}
.status-progress{background:#fff4df;color:#886114}
[data-theme="dark"] .status-progress{background:#3b311e;color:#f2ca75}
.nuha-contact{display:flex;gap:16px;align-items:center}
.nuha-contact img{width:86px;height:86px;object-fit:contain;flex:none}
.nuha-contact h3{margin:0 0 5px;color:var(--green)}
.nuha-contact p{margin:0;color:var(--muted);font-size:13px;line-height:1.6}
@media(max-width:560px){
  .brand span{font-size:9.5px}
  .nuha-about picture img{max-height:330px}
  .nuha-about-copy h3{font-size:26px}
  .version-list .card{align-items:flex-start;flex-direction:column;gap:8px}
  .nuha-contact{align-items:flex-start}
  .nuha-contact img{width:68px;height:68px}
}


/* ==============================================================
   NUHA V1.68 — Beranda Desktop
   Desktop tidak lagi memakai skala kompak HP. Konten diperlebar,
   tipografi dan kartu dinaikkan proporsinya; preview HP tetap sama.
   ============================================================== */
@media (min-width:1024px){
  body.home-route:not(.preview-phone) .view{
    width:min(calc(100% - 72px),1240px);
    max-width:1240px;
    padding:22px 0 112px;
  }
  body.home-route:not(.preview-phone) .bottom-nav{
    width:min(calc(100% - 72px),1240px);
    border-left:1px solid var(--line);
    border-right:1px solid var(--line);
    border-radius:18px 18px 0 0;
  }
  body.home-route:not(.preview-phone) .topbar{
    min-height:72px;
    padding:11px 22px;
  }
  body.home-route:not(.preview-phone) .brand-mark{
    width:44px;height:44px;border-radius:14px;
  }
  body.home-route:not(.preview-phone) .brand strong{font-size:19px}
  body.home-route:not(.preview-phone) .brand span{font-size:11px}
  body.home-route:not(.preview-phone) .icon-btn{width:42px;height:42px}

  body.home-route:not(.preview-phone) .home-screen .home-prayer{
    padding:20px 24px 18px;
    border-radius:23px;
  }
  body.home-route:not(.preview-phone) .home-screen .home-prayer small{font-size:12px}
  body.home-route:not(.preview-phone) .home-screen .home-prayer h2{font-size:29px;margin-top:5px}
  body.home-route:not(.preview-phone) .home-screen .home-prayer .countdown{font-size:12px;margin-top:5px}
  body.home-route:not(.preview-phone) .home-prayer-icon{
    width:48px;height:48px;border-radius:16px;font-size:23px;
  }
  body.home-route:not(.preview-phone) .home-screen .home-prayer .hero-meta{margin-top:13px;gap:7px}
  body.home-route:not(.preview-phone) .home-screen .home-prayer .pill{padding:6px 10px;font-size:10.5px}

  body.home-route:not(.preview-phone) .home-screen .home-quick-grid{
    margin-top:18px;
    grid-template-columns:repeat(8,minmax(0,1fr));
    gap:9px;
  }
  body.home-route:not(.preview-phone) .home-screen .quick{
    min-height:88px;
    padding:10px 5px;
    border-radius:17px;
  }
  body.home-route:not(.preview-phone) .home-screen .quick .qicon{
    width:43px;height:43px;margin-bottom:7px;border-radius:14px;font-size:20px;
  }
  body.home-route:not(.preview-phone) .home-screen .quick b{font-size:11.5px;line-height:1.2}

  body.home-route:not(.preview-phone) .home-screen .home-search{margin-top:16px}
  body.home-route:not(.preview-phone) .home-screen .home-search input{
    min-height:50px;padding:13px 50px 13px 17px;border-radius:17px;font-size:14px;
  }
  body.home-route:not(.preview-phone) .home-screen .home-search button{
    width:42px;height:42px;right:4px;top:4px;border-radius:14px;font-size:18px;
  }
  body.home-route:not(.preview-phone) .home-screen .home-section-head{margin:24px 2px 12px}
  body.home-route:not(.preview-phone) .home-screen .home-section-head h3{font-size:20px}
  body.home-route:not(.preview-phone) .home-screen .home-section-head .link-btn{font-size:12.5px}

  body.home-route:not(.preview-phone) .home-screen .news-list{
    grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;
  }
  body.home-route:not(.preview-phone) .home-screen .news-card{
    grid-template-columns:118px minmax(0,1fr);
    align-items:center;
    min-height:122px;
    padding:10px;
    gap:13px;
    border-radius:19px;
  }
  body.home-route:not(.preview-phone) .home-screen .news-thumb{
    width:118px;height:94px;border-radius:15px;
  }
  body.home-route:not(.preview-phone) .home-screen .news-card h4{font-size:14px;line-height:1.3;margin:4px 0 6px}
  body.home-route:not(.preview-phone) .home-screen .meta{font-size:10.5px}

  body.home-route:not(.preview-phone) .home-screen .bahtsul-home-card{margin-top:24px;border-radius:24px}
  body.home-route:not(.preview-phone) .home-screen .bahtsul-home-inner{padding:28px 30px 26px}
  body.home-route:not(.preview-phone) .home-screen .bahtsul-kicker{font-size:10px}
  body.home-route:not(.preview-phone) .home-screen .bahtsul-home-card h2{font-size:30px;margin-top:10px}
  body.home-route:not(.preview-phone) .home-screen .bahtsul-home-card p{font-size:14px;line-height:1.6;max-width:780px}
  body.home-route:not(.preview-phone) .home-screen .bahtsul-home-stats{margin-top:17px}
  body.home-route:not(.preview-phone) .home-screen .bahtsul-home-stats span{min-height:40px;padding:9px 13px;font-size:11.5px}
  body.home-route:not(.preview-phone) .home-screen .bahtsul-home-stats b{font-size:17px}
  body.home-route:not(.preview-phone) .home-screen .bahtsul-home-cta{
    min-height:50px;max-width:620px;margin-top:20px;border-radius:15px;font-size:13px;
  }
}


/* ==============================================================
   NUHA V1.69 — Responsif Beranda Desktop & Pusat Bahtsul Masail
   Memakai ruang layar lebar tanpa membuat banner Bahtsul terlalu tinggi.
   ============================================================== */
@media (min-width:1024px){
  body.home-route:not(.preview-phone) .view{
    width:min(calc(100% - 64px),1440px);
    max-width:1440px;
    padding-left:0;
    padding-right:0;
  }
  body.home-route:not(.preview-phone) .bottom-nav{
    width:min(calc(100% - 64px),1440px);
  }

  body.home-route:not(.preview-phone) .home-screen .bahtsul-home-card{
    min-height:0!important;
    margin-top:28px!important;
    border-radius:24px!important;
  }
  body.home-route:not(.preview-phone) .home-screen .bahtsul-home-inner{
    display:grid!important;
    grid-template-columns:minmax(0,1.55fr) minmax(300px,.72fr)!important;
    grid-template-areas:
      "kicker stats"
      "title cta"
      "desc status"!important;
    column-gap:42px!important;
    row-gap:9px!important;
    align-items:center!important;
    padding:30px 36px!important;
  }
  body.home-route:not(.preview-phone) .home-screen .bahtsul-kicker{
    grid-area:kicker!important;
    align-self:end!important;
    font-size:10px!important;
  }
  body.home-route:not(.preview-phone) .home-screen .bahtsul-home-card h2{
    grid-area:title!important;
    margin:2px 0 0!important;
    font-size:clamp(28px,2vw,34px)!important;
  }
  body.home-route:not(.preview-phone) .home-screen .bahtsul-home-card p{
    grid-area:desc!important;
    max-width:850px!important;
    margin:2px 0 0!important;
    font-size:13.5px!important;
    line-height:1.55!important;
  }
  body.home-route:not(.preview-phone) .home-screen .bahtsul-home-stats{
    grid-area:stats!important;
    justify-content:flex-start!important;
    align-self:end!important;
    margin:0!important;
    gap:8px!important;
  }
  body.home-route:not(.preview-phone) .home-screen .bahtsul-home-stats span{
    min-height:38px!important;
    padding:8px 12px!important;
    font-size:11px!important;
  }
  body.home-route:not(.preview-phone) .home-screen .bahtsul-home-stats b{
    font-size:17px!important;
  }
  body.home-route:not(.preview-phone) .home-screen .bahtsul-home-cta{
    grid-area:cta!important;
    width:100%!important;
    max-width:none!important;
    min-height:48px!important;
    margin:0!important;
    border-radius:14px!important;
    font-size:12.5px!important;
  }
  body.home-route:not(.preview-phone) .home-screen .bahtsul-home-status{
    grid-area:status!important;
    margin:0!important;
    text-align:left!important;
  }
}

/* Laptop / desktop sempit: tetap dua kolom tetapi lebih padat. */
@media (min-width:1024px) and (max-width:1240px){
  body.home-route:not(.preview-phone) .view,
  body.home-route:not(.preview-phone) .bottom-nav{
    width:min(calc(100% - 40px),1120px);
  }
  body.home-route:not(.preview-phone) .home-screen .bahtsul-home-inner{
    grid-template-columns:minmax(0,1.35fr) minmax(280px,.75fr)!important;
    column-gap:26px!important;
    padding:26px 28px!important;
  }
}

/* Tablet: Bahtsul kembali satu kolom dengan ukuran proporsional. */
@media (min-width:561px) and (max-width:1023px){
  .bahtsul-home-card{border-radius:24px!important}
  .bahtsul-home-inner{padding:26px 24px 24px!important}
  .bahtsul-home-card h2{font-size:30px!important}
  .bahtsul-home-card p{font-size:14px!important}
  .bahtsul-home-cta{max-width:560px!important}
}

/* NUHA v1.70 — Syaraf al-Anam, render setia halaman sumber */
.syaraf-card{
  padding:8px 12px 22px;
  overflow:hidden;
}
.syaraf-reader{
  max-width:720px;
  margin:0 auto;
  display:flex;
  flex-direction:column;
  gap:14px;
}
.syaraf-page{
  margin:0;
  padding:12px 6px;
  border-bottom:0;
  overflow:hidden;
}
.syaraf-page:last-child{border-bottom:0;padding-bottom:2px}
.syaraf-page-img{
  display:block;
  width:100%;
  height:auto;
  margin:0 auto;
  object-fit:contain;
  user-select:none;
  -webkit-user-drag:none;
}
[data-theme="dark"] .syaraf-page-img{
  filter:invert(1) brightness(.92) contrast(1.03);
}
@media(max-width:480px){
  .syaraf-card{padding:4px 6px 18px}
  .syaraf-reader{gap:8px}
  .syaraf-page{padding:8px 0}
}
body.preview-phone .syaraf-card{padding:4px 6px 18px}
body.preview-phone .syaraf-reader{gap:8px}
body.preview-phone .syaraf-page{padding:8px 0}

/* NUHA v1.72 — penanda akhir Syaraf al-Anam */
.syaraf-end{
  display:grid;
  grid-template-columns:minmax(28px,1fr) auto minmax(28px,1fr);
  align-items:center;
  gap:12px;
  width:min(92%,560px);
  margin:8px auto 24px;
  padding:6px 0 12px;
  color:var(--muted);
  text-align:center;
}
.syaraf-end span{height:1px;background:var(--line);display:block}
.syaraf-end strong{
  font-size:13px;
  line-height:1.3;
  font-weight:700;
  letter-spacing:.02em;
  color:var(--muted);
}
[data-theme="dark"] .syaraf-end strong{color:var(--text-soft)}
@media(max-width:480px){
  .syaraf-end{width:88%;gap:9px;margin:4px auto 28px}
  .syaraf-end strong{font-size:12px}
}
body.preview-phone .syaraf-end{width:88%;gap:9px;margin:4px auto 28px}
body.preview-phone .syaraf-end strong{font-size:12px}


/* NUHA v1.73 — sticky header pembaca Amaliyah
   Header bacaan + progress menempel tepat di bawah topbar pada HP,
   preview HP dan desktop. Wrapper dipakai agar halaman sumber tidak
   tampak menyelip di atas judul saat konten di-scroll. */
body.amaliyah-reader-route .amaliyah-sticky-head{
  position:sticky;
  top:var(--nuha-topbar-h,72px);
  z-index:35;
  margin:0 -2px;
  padding:0 2px 2px;
  background:var(--bg);
  border-bottom:1px solid color-mix(in srgb,var(--line) 82%,transparent);
  box-shadow:0 7px 16px color-mix(in srgb,#102f27 5%,transparent);
}
body.amaliyah-reader-route .amaliyah-sticky-head .reader-toolbar{
  position:relative!important;
  top:auto!important;
  z-index:auto;
  padding:7px 0 8px;
  background:var(--bg);
  backdrop-filter:none;
}
body.amaliyah-reader-route .amaliyah-sticky-head .progress-line{
  margin:0;
}
body.preview-phone.amaliyah-reader-route .amaliyah-sticky-head{
  top:var(--nuha-topbar-h,72px);
}
[data-theme="dark"] body.amaliyah-reader-route .amaliyah-sticky-head{
  background:var(--bg);
}

/* NUHA v1.76 — source scan polish: tanpa garis bingkai/separator */
.syaraf-page{border-bottom:0!important}

/* NUHA v1.77 — Maulid/Amaliyah continuous reading polish
   Semua bacaan tampil menyatu tanpa divider horizontal antar bagian/scan. */
.dibai-section{border-top:0!important}
.syaraf-reader{gap:0!important}
.syaraf-page{padding:0!important;margin:0!important;border:0!important}
.syaraf-page + .syaraf-page{margin-top:0!important}
.syaraf-card{padding-top:4px!important}
.syaraf-end{
  display:block!important;
  width:auto!important;
  margin:14px auto 24px!important;
  padding:4px 0 12px!important;
}
.syaraf-end span{display:none!important}
.syaraf-end strong{display:block!important;text-align:center}
@media(max-width:480px){
  .syaraf-reader{gap:0!important}
  .syaraf-page{padding:0!important}
}
body.preview-phone .syaraf-reader{gap:0!important}
body.preview-phone .syaraf-page{padding:0!important}


/* NUHA v1.79 — Syaraf al-Anam native HTML
   Scan PPSNH tetap menjadi sumber audit; tampilan memakai teks asli seperti Diba'i. */
.syaraf-html-reader{max-width:720px;margin:0 auto}
.syaraf-html-reader .dibai-section{border-top:0!important}
.syaraf-html-reader .dibai-section:first-of-type{padding-top:10px}
.syaraf-mahal{
  width:min(94%,560px);margin:10px auto 4px;padding:12px 14px;
  border-radius:16px;background:color-mix(in srgb,var(--green-soft) 82%,var(--card));
  color:var(--green);text-align:center;
}
.syaraf-mahal span{
  display:block;font-family:"Amiri","Noto Naskh Arabic","Traditional Arabic",serif;
  font-size:calc(var(--arabic-size) * .64);line-height:1.5;font-weight:700;
}
.syaraf-mahal small{display:block;margin-top:1px;font-size:9px;font-weight:800;letter-spacing:.03em;color:var(--muted)}
.syaraf-html-reader .dibai-section.poem .arabic{white-space:normal}
.syaraf-html-reader .dibai-section.poem .arabic br{display:block;content:"";margin-bottom:.18em}
[data-theme="dark"] .syaraf-mahal{background:#173329;color:#9be6d1}
@media(max-width:480px){
  .syaraf-mahal{margin-top:6px;padding:10px 10px;border-radius:14px}
  .syaraf-mahal span{font-size:calc(var(--arabic-size) * .58)}
  .syaraf-html-reader .dibai-section.poem .arabic{line-height:1.92}
}
body.preview-phone .syaraf-mahal{margin-top:6px;padding:10px 10px;border-radius:14px}
body.preview-phone .syaraf-mahal span{font-size:calc(var(--arabic-size) * .56)}


/* NUHA v1.80 — Syaraf al-Anam: layout syair HP mengikuti desktop.
   Setiap bait tetap satu baris dua sisi; tidak lagi pecah menjadi potongan kata. */
.syaraf-poem-section{padding-left:0!important;padding-right:0!important}
.syaraf-poem-grid{
  width:100%;
  display:flex;
  flex-direction:column;
  gap:4px;
  font-family:"Amiri","Noto Naskh Arabic","Traditional Arabic",serif;
}
.syaraf-poem-row{
  display:grid;
  grid-template-columns:minmax(0,1fr) 18px minmax(0,1fr);
  align-items:center;
  column-gap:7px;
  min-height:48px;
  font-size:calc(var(--arabic-size) * .78);
  line-height:1.72;
  text-align:center;
}
.syaraf-poem-row.single{grid-template-columns:1fr}
.syaraf-hemistich{
  display:block;
  min-width:0;
  white-space:nowrap;
  text-align:center;
}
.syaraf-poem-sep{
  display:grid;
  place-items:center;
  font-family:serif;
  font-size:.68em;
  color:var(--text);
  opacity:.82;
}
@media(max-width:480px){
  .syaraf-poem-grid{gap:2px}
  .syaraf-poem-row{
    grid-template-columns:minmax(0,1fr) 12px minmax(0,1fr);
    column-gap:3px;
    min-height:39px;
    font-size:calc(var(--arabic-size) * .58);
    line-height:1.62;
  }
  .syaraf-poem-sep{font-size:.58em}
}
body.preview-phone .syaraf-poem-grid{gap:2px}
body.preview-phone .syaraf-poem-row{
  grid-template-columns:minmax(0,1fr) 12px minmax(0,1fr);
  column-gap:3px;
  min-height:39px;
  font-size:calc(var(--arabic-size) * .58);
  line-height:1.62;
}
body.preview-phone .syaraf-poem-sep{font-size:.58em}


/* NUHA v1.81 — Simtud Durar native HTML */
.simtud-html-reader{max-width:720px;margin:0 auto}
.simtud-html-reader .syaraf-poem-row{font-size:calc(var(--arabic-size) * .74)}
@media(max-width:480px){
  .simtud-html-reader .syaraf-poem-row{font-size:calc(var(--arabic-size) * .52);column-gap:2px}
}
body.preview-phone .simtud-html-reader .syaraf-poem-row{font-size:calc(var(--arabic-size) * .52);column-gap:2px}

/* NUHA v1.84 — Simtud Durar: HP dibuat lebih kecil dan serasi.
   Dua sisi dipertahankan dalam satu baris seperti desktop; font diperkecil
   secukupnya agar bait tidak turun baris dan tidak saling bertabrakan. */
.simtud-html-reader .syaraf-poem-grid{
  gap:4px;
}
.simtud-html-reader .syaraf-poem-row{
  min-height:48px;
  font-size:calc(var(--arabic-size) * .74);
  line-height:1.68;
  column-gap:6px;
}
.simtud-html-reader .syaraf-hemistich{
  padding-inline:1px;
}
@media(max-width:480px){
  .simtud-html-reader .syaraf-poem-section{
    margin-inline:-4px;
  }
  .simtud-html-reader .syaraf-poem-grid{
    gap:1px;
  }
  .simtud-html-reader .syaraf-poem-row{
    grid-template-columns:minmax(0,1fr) 8px minmax(0,1fr);
    align-items:center;
    min-height:36px;
    padding:1px 0;
    font-size:calc(var(--arabic-size) * .50);
    line-height:1.58;
    column-gap:1px;
  }
  .simtud-html-reader .syaraf-hemistich{
    white-space:nowrap;
    overflow:visible;
    padding-inline:0;
    line-height:1.58;
    letter-spacing:-.01em;
  }
  .simtud-html-reader .syaraf-poem-sep{
    align-self:center;
    font-size:.46em;
  }
}
body.preview-phone .simtud-html-reader .syaraf-poem-section{
  margin-inline:-4px;
}
body.preview-phone .simtud-html-reader .syaraf-poem-grid{
  gap:1px;
}
body.preview-phone .simtud-html-reader .syaraf-poem-row{
  grid-template-columns:minmax(0,1fr) 8px minmax(0,1fr);
  align-items:center;
  min-height:36px;
  padding:1px 0;
  font-size:calc(var(--arabic-size) * .50);
  line-height:1.58;
  column-gap:1px;
}
body.preview-phone .simtud-html-reader .syaraf-hemistich{
  white-space:nowrap;
  overflow:visible;
  padding-inline:0;
  line-height:1.58;
  letter-spacing:-.01em;
}
body.preview-phone .simtud-html-reader .syaraf-poem-sep{
  align-self:center;
  font-size:.46em;
}

/* NUHA v1.86 — Fi Hubbi Sayyidina Muhammad native HTML */
.fi-hubbi-html-reader{max-width:720px;margin:0 auto}
.fi-hubbi-html-reader .fi-hubbi-basmala{margin-top:18px}
.fi-hubbi-html-reader .syaraf-poem-row{
  font-size:calc(var(--arabic-size) * .72);
  line-height:1.68;
  min-height:46px;
  column-gap:5px;
}
.fi-hubbi-html-reader .dibai-section:not(.syaraf-poem-section) .arabic{
  line-height:2.05;
}
@media(max-width:480px){
  .fi-hubbi-html-reader .syaraf-poem-section{margin-inline:-4px}
  .fi-hubbi-html-reader .syaraf-poem-grid{gap:2px}
  .fi-hubbi-html-reader .syaraf-poem-row{
    grid-template-columns:minmax(0,1fr) 8px minmax(0,1fr);
    font-size:calc(var(--arabic-size) * .50);
    line-height:1.58;
    min-height:36px;
    column-gap:1px;
    padding:1px 0;
  }
  .fi-hubbi-html-reader .syaraf-hemistich{white-space:nowrap;padding-inline:0;letter-spacing:-.01em}
  .fi-hubbi-html-reader .syaraf-poem-sep{font-size:.46em}
}
body.preview-phone .fi-hubbi-html-reader .syaraf-poem-section{margin-inline:-4px}
body.preview-phone .fi-hubbi-html-reader .syaraf-poem-grid{gap:2px}
body.preview-phone .fi-hubbi-html-reader .syaraf-poem-row{
  grid-template-columns:minmax(0,1fr) 8px minmax(0,1fr);
  font-size:calc(var(--arabic-size) * .50);
  line-height:1.58;
  min-height:36px;
  column-gap:1px;
  padding:1px 0;
}
body.preview-phone .fi-hubbi-html-reader .syaraf-hemistich{white-space:nowrap;padding-inline:0;letter-spacing:-.01em}
body.preview-phone .fi-hubbi-html-reader .syaraf-poem-sep{font-size:.46em}

/* NUHA v1.87 — Fi Hubbi: harmonisasi ukuran tipografi di HP.
   Teks satu kolom diperkecil sedikit dan syair dua kolom dibesarkan sedikit
   agar seluruh bacaan terasa satu keluarga ukuran tanpa mengorbankan layout. */
@media(max-width:480px){
  .fi-hubbi-html-reader .dibai-section:not(.syaraf-poem-section) .arabic{
    font-size:calc(var(--arabic-size) * .62)!important;
    line-height:1.92!important;
  }
  .fi-hubbi-html-reader .syaraf-poem-row{
    font-size:calc(var(--arabic-size) * .54)!important;
    line-height:1.60;
    min-height:38px;
    column-gap:0;
  }
  .fi-hubbi-html-reader .syaraf-poem-grid{gap:3px}
  .fi-hubbi-html-reader .syaraf-hemistich{
    letter-spacing:-.018em;
  }
}
body.preview-phone .fi-hubbi-html-reader .dibai-section:not(.syaraf-poem-section) .arabic{
  font-size:calc(var(--arabic-size) * .62)!important;
  line-height:1.92!important;
}
body.preview-phone .fi-hubbi-html-reader .syaraf-poem-row{
  font-size:calc(var(--arabic-size) * .54)!important;
  line-height:1.60;
  min-height:38px;
  column-gap:0;
}
body.preview-phone .fi-hubbi-html-reader .syaraf-poem-grid{gap:3px}
body.preview-phone .fi-hubbi-html-reader .syaraf-hemistich{letter-spacing:-.018em}


/* NUHA v1.90 — Qasidah Burdah native HTML */
.burdah-html-reader{max-width:760px;margin:0 auto}
.burdah-refrain{
  width:min(96%,680px);
  margin:8px auto 12px;
  padding:10px 12px;
  border-radius:16px;
  background:color-mix(in srgb,var(--green-soft) 82%,var(--card));
  color:var(--green);
}
.burdah-refrain .syaraf-poem-row{font-size:calc(var(--arabic-size) * .72);font-weight:700;min-height:42px}
.burdah-poem .syaraf-poem-grid{gap:2px}
.burdah-poem .syaraf-poem-row{
  grid-template-columns:minmax(0,1fr) 12px minmax(0,1fr);
  min-height:44px;
  column-gap:3px;
  font-size:calc(var(--arabic-size) * .66);
  line-height:1.64;
}
.burdah-poem .syaraf-hemistich{white-space:nowrap;letter-spacing:-.012em}
@media(max-width:480px){
  .burdah-refrain{width:100%;padding:8px 5px;margin-top:4px;border-radius:13px}
  .burdah-refrain .syaraf-poem-row{grid-template-columns:minmax(0,1fr) 7px minmax(0,1fr);font-size:calc(var(--arabic-size) * .47);column-gap:1px;min-height:34px}
  .burdah-poem{margin-inline:-8px}
  .burdah-poem .syaraf-poem-grid{gap:0}
  .burdah-poem .syaraf-poem-row{
    grid-template-columns:minmax(0,1fr) 6px minmax(0,1fr);
    min-height:34px;
    padding:1px 0;
    column-gap:1px;
    font-size:calc(var(--arabic-size) * .43);
    line-height:1.55;
  }
  .burdah-poem .syaraf-poem-sep{font-size:.42em}
}
body.preview-phone .burdah-refrain{width:100%;padding:8px 5px;margin-top:4px;border-radius:13px}
body.preview-phone .burdah-refrain .syaraf-poem-row{grid-template-columns:minmax(0,1fr) 7px minmax(0,1fr);font-size:calc(var(--arabic-size) * .47);column-gap:1px;min-height:34px}
body.preview-phone .burdah-poem{margin-inline:-8px}
body.preview-phone .burdah-poem .syaraf-poem-grid{gap:0}
body.preview-phone .burdah-poem .syaraf-poem-row{grid-template-columns:minmax(0,1fr) 6px minmax(0,1fr);min-height:34px;padding:1px 0;column-gap:1px;font-size:calc(var(--arabic-size) * .43);line-height:1.55}
body.preview-phone .burdah-poem .syaraf-poem-sep{font-size:.42em}

/* NUHA v1.91 — Qasidah Burdah: luruskan baris syair.
   Kedua belahan bait memakai patokan kanan yang konsisten agar tidak zig-zag. */
.burdah-poem .syaraf-hemistich{
  text-align:right;
  justify-self:stretch;
}
.burdah-poem .syaraf-poem-row{
  align-items:baseline;
}
.burdah-poem .syaraf-poem-sep{
  align-self:baseline;
  padding-top:.18em;
}
@media(max-width:480px){
  .burdah-poem .syaraf-poem-row{align-items:baseline}
  .burdah-poem .syaraf-hemistich{text-align:right}
}
body.preview-phone .burdah-poem .syaraf-poem-row{align-items:baseline}
body.preview-phone .burdah-poem .syaraf-hemistich{text-align:right}


/* NUHA v1.92 — Qasidah Burdah: pusatkan tiap belahan bait.
   Bait pendek/panjang tetap terasa seimbang; pada layar sempit teks boleh menyesuaikan di dalam kolomnya sendiri. */
.burdah-poem .syaraf-hemistich{
  text-align:center!important;
  justify-self:stretch;
}
.burdah-poem .syaraf-poem-row{
  align-items:center;
}
.burdah-poem .syaraf-poem-sep{
  align-self:center;
  padding-top:0;
}
@media(max-width:480px){
  .burdah-poem .syaraf-poem-row{align-items:center}
  .burdah-poem .syaraf-hemistich{
    text-align:center!important;
    white-space:normal;
    overflow-wrap:normal;
    word-break:normal;
    line-height:1.62;
  }
}
body.preview-phone .burdah-poem .syaraf-poem-row{align-items:center}
body.preview-phone .burdah-poem .syaraf-hemistich{
  text-align:center!important;
  white-space:normal;
  overflow-wrap:normal;
  word-break:normal;
  line-height:1.62;
}


/* NUHA v1.93 — Qasidah Burdah: setiap setengah bait wajib satu baris.
   Bait tetap dipusatkan; bait yang lebih panjang dikecilkan otomatis oleh JS,
   bukan dibungkus menjadi dua baris. */
.burdah-poem .syaraf-hemistich,
.burdah-refrain .syaraf-hemistich{
  text-align:center!important;
  justify-self:stretch;
  white-space:nowrap!important;
  overflow-wrap:normal!important;
  word-break:normal!important;
}
@media(max-width:480px){
  .burdah-poem .syaraf-hemistich,
  .burdah-refrain .syaraf-hemistich{
    white-space:nowrap!important;
    line-height:1.58;
  }
}
body.preview-phone .burdah-poem .syaraf-hemistich,
body.preview-phone .burdah-refrain .syaraf-hemistich{
  white-space:nowrap!important;
  line-height:1.58;
}

/* NUHA v1.94 — final audit Maulid & Shalawat: favorite state */
#favReading.active{color:var(--green);background:var(--green-soft);border-color:color-mix(in srgb,var(--green) 28%,var(--line))}
[data-theme="dark"] #favReading.active{color:#9be6d1;background:#173e34}



/* NUHA v95 — Yasin Fadilah native reader (Buku Hizib PPSNH hlm. 1–10) */
.yasin-fadilah-reader{max-width:720px;margin:0 auto}
.yf-source-note{display:flex;align-items:center;justify-content:center;gap:7px;margin:4px 0 5px;padding:7px 10px;border-radius:12px;background:color-mix(in srgb,var(--green) 6%,var(--card));color:var(--muted);font-size:10px;font-weight:800}
.yf-source-note i{color:var(--green)}
.yf-ayah{padding:14px 2px;border-bottom:1px solid color-mix(in srgb,var(--line) 72%,transparent)}
.yf-ayah .arabic,.yf-yasin-seven .arabic{font-family:"Amiri Quran","Amiri","Noto Naskh Arabic","Traditional Arabic",serif;font-size:calc(var(--arabic-size) * .77);line-height:1.95;text-align:right;direction:rtl}
.yf-yasin-seven{padding:14px 4px 17px;text-align:center}
.yf-yasin-seven .arabic{text-align:center;color:var(--text)}
.yf-yasin-seven .yt-repeat{margin-left:auto;margin-right:auto}
.yf-flower{font-family:serif;color:var(--green);font-size:.55em;vertical-align:middle;margin:0 .12em}
.yasin-fadilah-reader .yt-amal-block.soft{background:color-mix(in srgb,var(--green) 5%,var(--card));border:1px solid color-mix(in srgb,var(--green) 12%,var(--line))}
.yasin-fadilah-reader .yt-amal-label{font-size:9px}
.yf-loading{margin:60px auto}
[data-theme="dark"] .yasin-fadilah-reader .yt-amal-block.soft{background:#172b24}
@media(max-width:480px){
  .yf-ayah{padding:11px 0}
  .yf-ayah .arabic,.yf-yasin-seven .arabic{font-size:calc(var(--arabic-size) * .71);line-height:1.88}
  .yf-source-note{font-size:9px;padding:6px 8px}
}
body.preview-phone .yf-ayah .arabic,body.preview-phone .yf-yasin-seven .arabic{font-size:calc(var(--arabic-size) * .69);line-height:1.84}


/* NUHA v97 — daftar Hizib & Ratib: judul Latin saja, lebih ringkas */
.amaliyah-list-item{
  width:100%;display:grid!important;
  grid-template-columns:40px minmax(0,1fr) 16px!important;
  align-items:center!important;gap:12px!important;
  min-height:72px!important;padding:12px 14px!important;border-radius:22px!important;text-align:left!important;background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(248,250,249,.98))!important;border:1px solid var(--line)!important;box-shadow:0 8px 22px rgba(16,50,42,.03)!important;
}
.amaliyah-list-item .num{width:38px!important;height:38px!important;border-radius:13px!important;font-size:14px!important;font-weight:800!important;background:rgba(16,99,72,.08)!important;color:var(--brand)!important}
.amaliyah-list-item .amaliyah-copy{min-width:0;display:flex!important;align-items:center!important;justify-content:flex-start!important;gap:0!important;text-align:left!important}
.amaliyah-list-item .amaliyah-copy h4{
  margin:0!important;font-size:15px!important;line-height:1.3!important;font-weight:800!important;
  letter-spacing:-.01em;color:var(--text)!important;text-align:left!important;
  display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;
}
.amaliyah-list-item .ar-name{display:none!important}
.amaliyah-list-item .amaliyah-arrow{position:static!important;align-self:center!important;justify-self:end!important;flex:none!important;margin:0!important;color:var(--muted)!important;font-size:15px!important}
body.preview-phone .amaliyah-list-item{min-height:68px!important;padding:11px 13px!important;gap:10px!important}
body.preview-phone .amaliyah-list-item .num{width:36px!important;height:36px!important;font-size:13px!important}
body.preview-phone .amaliyah-list-item .amaliyah-copy h4{font-size:14px!important;line-height:1.28!important}
@media(max-width:480px){
  .amaliyah-list-item{min-height:68px!important;padding:11px 13px!important;gap:10px!important}
  .amaliyah-list-item .num{width:36px!important;height:36px!important;font-size:13px!important}
  .amaliyah-list-item .amaliyah-copy h4{font-size:14px!important;line-height:1.28!important}
}


/* NUHA v99 — Hizbun Nasr FINAL AUDIT native HTML (Buku Hizib PPSNH hlm. 11–14) */
.hizbun-nasr-reader{max-width:720px;margin:0 auto}
.hizbun-nasr-reader .yt-amal-block{padding-top:14px;padding-bottom:15px}
.hizbun-nasr-reader .yt-amal-block .arabic{font-size:calc(var(--arabic-size) * .76);line-height:1.95}
.hizbun-nasr-reader .yt-amal-block.soft{background:color-mix(in srgb,var(--green) 5%,var(--card));border:1px solid color-mix(in srgb,var(--green) 12%,var(--line));border-radius:14px;margin:7px 0;padding-left:10px;padding-right:10px}
[data-theme="dark"] .hizbun-nasr-reader .yt-amal-block.soft{background:#172b24}
@media(max-width:480px){
  .hizbun-nasr-reader .yt-amal-block{padding-top:11px;padding-bottom:12px}
  .hizbun-nasr-reader .yt-amal-block .arabic{font-size:calc(var(--arabic-size) * .70);line-height:1.88}
}
body.preview-phone .hizbun-nasr-reader .yt-amal-block .arabic{font-size:calc(var(--arabic-size) * .68);line-height:1.84}

/* =========================================================
   Global Search — v114
   ========================================================= */
.global-search-page{max-width:920px;margin:0 auto}
.global-search-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}
.global-search-head-icon{
  width:48px;height:48px;flex:none;display:grid;place-items:center;border-radius:16px;
  background:var(--green-soft);color:var(--green);font-size:21px
}
.global-search-box{margin-top:2px}
.global-search-box input{min-height:50px;padding-left:17px;font-size:14px}
.global-search-box button{top:6px;right:6px;width:38px;height:38px}
.global-search-status{min-height:24px;margin:11px 2px 2px;color:var(--muted);font-size:12px}
.global-search-loading{display:inline-flex;align-items:center;gap:8px}
.global-search-loading .spinner{width:15px;height:15px;border-width:2px;margin:0}
.global-search-results{display:grid;gap:18px;margin-top:4px}
.global-search-group{display:grid;gap:8px}
.global-search-group .section-head{margin:10px 2px 2px}
.global-search-group .section-head h3{font-size:15px}
.global-search-result{
  width:100%;display:grid;grid-template-columns:44px minmax(0,1fr) 20px;align-items:center;gap:11px;
  padding:11px 12px;border:1px solid var(--line);border-radius:16px;background:var(--card);color:var(--text);
  text-align:left;cursor:pointer;box-shadow:0 4px 16px rgba(16,50,42,.025)
}
.global-search-result:hover,.global-search-result:focus-visible{border-color:color-mix(in srgb,var(--green) 42%,var(--line));background:color-mix(in srgb,var(--green-soft) 35%,var(--card))}
.global-search-result-icon{
  width:42px;height:42px;border-radius:13px;display:grid;place-items:center;background:var(--green-soft);color:var(--green);font-size:18px
}
.global-search-result-copy{min-width:0;display:grid;gap:3px}
.global-search-result-copy b{font-size:13.5px;line-height:1.25;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.global-search-result-copy small{font-size:11px;color:var(--muted);line-height:1.35;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.global-search-result-arrow{color:var(--muted);font-size:13px}
.global-search-empty{
  min-height:180px;padding:30px 18px;border:1px dashed var(--line);border-radius:20px;background:color-mix(in srgb,var(--card) 88%,var(--bg));
  display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:7px;color:var(--muted)
}
.global-search-empty>i{font-size:28px;color:var(--green)}
.global-search-empty b{font-size:15px;color:var(--text)}
.global-search-empty span{max-width:430px;font-size:12px;line-height:1.5}
.global-search-online-note{display:flex;align-items:center;gap:8px}
@media(max-width:560px){
  .global-search-head-icon{width:42px;height:42px;border-radius:14px;font-size:18px}
  .global-search-box input{min-height:46px;font-size:13px}
  .global-search-result{grid-template-columns:40px minmax(0,1fr) 16px;padding:10px;gap:9px;border-radius:14px}
  .global-search-result-icon{width:38px;height:38px;border-radius:12px;font-size:16px}
  .global-search-result-copy b{font-size:12.5px}
  .global-search-result-copy small{font-size:10.5px}
  .global-search-empty{min-height:150px;padding:24px 15px}
}

/* NUHA v115 — Surah Pilihan memakai reader HTML khusus Amaliyah */
.selected-surah-native{padding:2px 2px 6px}
.selected-surah-intro{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  color:var(--muted);font-size:10px;font-weight:800;letter-spacing:.02em;
  padding:2px 3px 10px;border-bottom:1px solid var(--line)
}
.selected-surah-basmala{
  text-align:center!important;padding:18px 8px 20px;border-bottom:1px solid var(--line);
  font-family:"Amiri Quran","Noto Naskh Arabic","Traditional Arabic",serif!important;
  font-size:calc(var(--arabic-size) * .78)!important;line-height:1.8!important
}
.selected-surah-ayah{padding:16px 3px 17px;border-bottom:1px solid var(--line)}
.selected-surah-ayah:last-child{border-bottom:0}
.selected-surah-ayah .arabic{
  font-family:"Amiri Quran","Noto Naskh Arabic","Traditional Arabic",serif;
  font-size:calc(var(--arabic-size) * .82);line-height:1.95;text-align:right
}
.selected-surah-marker{
  color:var(--green);font-family:"Amiri Quran","Noto Naskh Arabic",serif;
  font-size:.72em;white-space:nowrap;margin-inline-start:4px
}
.selected-surah-loading{margin:42px auto}
body.preview-phone .selected-surah-ayah{padding:13px 1px 14px}
body.preview-phone .selected-surah-ayah .arabic{font-size:calc(var(--arabic-size) * .78);line-height:1.88}
@media(max-width:420px){
  .selected-surah-basmala{font-size:calc(var(--arabic-size) * .72)!important}
  .selected-surah-ayah .arabic{font-size:calc(var(--arabic-size) * .76)}
}


/* ==============================================================
   BERANDA — HEADER RINGKAS SAAT SCROLL (v117)
   Referensi perilaku: header aplikasi berita NU yang tetap menyajikan
   identitas aplikasi dan waktu shalat ketika konten Beranda digulir.
   Scope hanya Beranda versi HP/preview HP; halaman lain tidak berubah.
   ============================================================== */
.home-scroll-prayer{
  display:none;border:0;background:transparent;color:var(--text);
  margin-left:auto;min-width:0;text-align:right;cursor:pointer;
  padding:3px 0;line-height:1.15
}
.home-scroll-prayer strong{
  display:block;font-size:12px;font-weight:800;white-space:nowrap
}
.home-scroll-prayer span{
  display:block;margin-top:3px;color:var(--muted);font-size:10px;
  font-variant-numeric:tabular-nums;white-space:nowrap
}

/* Preview HP di desktop. */
body.preview-phone.home-route.home-scrolled .topbar{
  position:relative;isolation:isolate;
  min-height:66px;padding:calc(9px + var(--safe-top)) 20px 9px;
  background:linear-gradient(135deg,var(--green),#168269);
  border-bottom:0;backdrop-filter:none
}
body.preview-phone.home-route.home-scrolled .topbar::before{
  content:"";position:absolute;z-index:-1;
  left:10px;right:10px;top:calc(7px + var(--safe-top));bottom:7px;
  border:1px solid var(--line);border-radius:16px;
  background:color-mix(in srgb,var(--card) 97%,transparent);
  box-shadow:0 5px 18px rgba(10,58,44,.13)
}
body.preview-phone.home-route.home-scrolled .brand{flex:0 1 auto;gap:8px;min-width:0}
body.preview-phone.home-route.home-scrolled .brand-mark{width:34px;height:34px;border-radius:11px}
body.preview-phone.home-route.home-scrolled .brand strong{font-size:15px}
body.preview-phone.home-route.home-scrolled .brand span{display:none}
body.preview-phone.home-route.home-scrolled .home-scroll-prayer{display:block;flex:1 1 auto}
body.preview-phone.home-route.home-scrolled #themeQuick{display:none}

/* HP/browser asli. */
@media(max-width:560px){
  body.home-route.home-scrolled .topbar{
    isolation:isolate;min-height:66px;
    padding:calc(9px + var(--safe-top)) 20px 9px;
    background:linear-gradient(135deg,var(--green),#168269);
    border-bottom:0;backdrop-filter:none
  }
  body.home-route.home-scrolled .topbar::before{
    content:"";position:absolute;z-index:-1;
    left:10px;right:10px;top:calc(7px + var(--safe-top));bottom:7px;
    border:1px solid var(--line);border-radius:16px;
    background:color-mix(in srgb,var(--card) 97%,transparent);
    box-shadow:0 5px 18px rgba(10,58,44,.13)
  }
  body.home-route.home-scrolled .brand{flex:0 1 auto;gap:8px;min-width:0}
  body.home-route.home-scrolled .brand-mark{width:34px;height:34px;border-radius:11px}
  body.home-route.home-scrolled .brand strong{font-size:15px}
  body.home-route.home-scrolled .brand span{display:none}
  body.home-route.home-scrolled .home-scroll-prayer{display:block;flex:1 1 auto}
  body.home-route.home-scrolled #themeQuick{display:none}
}

/* v119 — Pengaturan: ringkas, aman, dan mudah dipakai di HP */
.settings-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:14px}
.settings-head .page-title,.settings-head .page-subtitle{margin-left:0;margin-right:0}
.settings-head-icon{width:46px;height:46px;border-radius:16px;background:var(--green-soft);color:var(--green);display:grid;place-items:center;flex:0 0 auto;font-size:20px}
.settings-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:20px;padding:10px}
.settings-summary>span{min-width:0;text-align:center;border-right:1px solid var(--line);padding:7px 5px}
.settings-summary>span:last-child{border-right:0}
.settings-summary i{display:block;color:var(--green);font-size:16px;margin-bottom:5px}
.settings-summary b{display:block;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.settings-summary small{display:block;color:var(--muted);font-size:9px;margin-top:2px}
.setting-group>h3{font-size:13px;margin:0 3px 1px;color:var(--text)}
.setting-row>div:first-child{min-width:0;flex:1}
.setting-row b{font-size:12px}
.setting-row small{font-size:9px;line-height:1.4;margin-top:3px;max-width:390px}
.setting-row select{width:min(42vw,190px);max-width:190px;flex:0 0 auto}
.setting-action-stack{display:flex;align-items:flex-end;flex-direction:column;gap:7px;flex:0 0 auto}
.small-btn.compact{padding:7px 9px;font-size:9px;white-space:nowrap}
.badge.warning{background:#fff0ed;color:#a33c2d}
.settings-inline-note{display:flex;align-items:flex-start;gap:8px;color:var(--muted);font-size:9px;line-height:1.5;padding:0 4px}
.settings-inline-note i{color:var(--green);margin-top:1px}
.settings-data-item{margin-bottom:0}
.sheet-copy{color:var(--muted);line-height:1.6;margin:0 0 16px}
.sheet-actions{display:flex;justify-content:flex-end;gap:8px;flex-wrap:wrap}
.small-btn.danger{border-color:#d99b93;color:#a33c2d;background:#fff7f5}
[data-theme="dark"] .small-btn.danger{background:rgba(163,60,45,.12);border-color:rgba(217,155,147,.35);color:#f2aaa0}
@media(max-width:560px){
  .settings-summary{gap:4px;padding:8px}
  .settings-summary b{font-size:11px}
  .setting-row{padding:12px}
  .setting-row select{width:132px;max-width:42vw;font-size:10px}
  .setting-location-row{align-items:flex-start}
  .setting-action-stack{gap:6px}
}

/* ==============================================================
   v121 — AYAT HARI INI DI BERANDA
   Kutipan harian Al-Qur'an yang tetap ringkas, terbaca, dan konsisten
   dengan identitas visual NUHA. Dataset tersimpan lokal untuk PWA.
   ============================================================== */
.home-daily-ayah{
  position:relative;isolation:isolate;overflow:hidden;
  margin-top:14px;padding:16px 16px 14px;border-radius:20px;
  color:#f6fffb;border:1px solid rgba(255,255,255,.11);
  background:linear-gradient(138deg,#0b6954 0%,#0e7b62 54%,#149175 100%);
  box-shadow:0 10px 28px rgba(10,92,71,.16);
}
.home-daily-ayah::before{
  content:"“";position:absolute;z-index:-1;right:11px;top:-33px;
  font-family:Georgia,serif;font-size:116px;line-height:1;color:rgba(255,255,255,.075);
  pointer-events:none
}
.home-daily-ayah::after{
  content:"";position:absolute;z-index:-1;width:118px;height:118px;border-radius:50%;
  left:-54px;bottom:-78px;border:18px solid rgba(227,196,113,.09);pointer-events:none
}
.daily-ayah-loading{display:flex;align-items:center;gap:11px;min-height:58px}
.daily-ayah-loading>span{
  width:38px;height:38px;border-radius:13px;display:grid;place-items:center;flex:0 0 auto;
  background:rgba(255,255,255,.12);font-size:17px
}
.daily-ayah-loading b{display:block;font-size:13px}
.daily-ayah-loading small{display:block;margin-top:3px;color:rgba(245,255,251,.74);font-size:10px}
.daily-ayah-error{opacity:.9}
.daily-ayah-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.daily-ayah-head>div{min-width:0}
.daily-ayah-kicker{
  display:inline-flex;align-items:center;gap:5px;font-size:9px;font-weight:800;letter-spacing:.075em;
  color:#f0d992
}
.daily-ayah-head small{display:block;margin-top:3px;color:rgba(245,255,251,.72);font-size:9.5px}
.daily-ayah-theme{
  flex:0 0 auto;max-width:42%;padding:5px 8px;border-radius:999px;
  background:rgba(255,255,255,.11);color:#fff;font-size:8.5px;font-weight:800;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis
}
.daily-ayah-arabic{
  direction:rtl;text-align:right;margin-top:13px;
  font-family:"Amiri Quran","Noto Naskh Arabic","Traditional Arabic",serif;
  font-size:25px;line-height:1.85;font-weight:500
}
.daily-ayah-translation{
  margin:10px 0 0;color:rgba(248,255,252,.91);font-size:11.5px;line-height:1.62;font-weight:600
}
.daily-ayah-foot{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  margin-top:13px;padding-top:11px;border-top:1px solid rgba(255,255,255,.13)
}
.daily-ayah-foot>b{font-size:10.5px;color:#f2d994}
.daily-ayah-actions{display:flex;align-items:center;justify-content:flex-end;gap:7px;flex:0 0 auto}
.daily-ayah-foot button{
  border:0;border-radius:11px;min-height:34px;padding:7px 10px;
  display:inline-flex;align-items:center;justify-content:center;gap:7px;background:rgba(255,255,255,.13);color:#fff;
  font-family:inherit;font-size:9.5px;font-weight:800;cursor:pointer
}
.daily-ayah-foot .daily-ayah-share{
  background:transparent;box-shadow:inset 0 0 0 1px rgba(255,255,255,.22)
}
.daily-ayah-foot button:hover,.daily-ayah-foot button:focus-visible{background:rgba(255,255,255,.2)}
.daily-ayah-foot .daily-ayah-share:hover,.daily-ayah-foot .daily-ayah-share:focus-visible{background:rgba(255,255,255,.11)}

/* Ayat yang dibuka dari kartu Beranda diberi penanda lembut sesaat. */
.quran-ayah-card.daily-ayah-target{
  border-radius:16px;background:var(--green-soft);
  box-shadow:0 0 0 2px color-mix(in srgb,var(--green) 46%,transparent);
  transition:background .35s ease,box-shadow .35s ease
}

[data-theme="dark"] body.home-route .home-daily-ayah{
  background:linear-gradient(138deg,#164a3d 0%,#155746 56%,#14644f 100%);
  border-color:#2f705d;box-shadow:0 12px 30px rgba(0,0,0,.20)
}
[data-theme="dark"] body.home-route .daily-ayah-kicker,
[data-theme="dark"] body.home-route .daily-ayah-foot>b{color:#e7cc7d}

body.preview-phone .home-daily-ayah{margin-top:12px;padding:14px 14px 13px;border-radius:18px}
body.preview-phone .daily-ayah-arabic{font-size:21px;line-height:1.82;margin-top:11px}
body.preview-phone .daily-ayah-translation{font-size:10.5px;line-height:1.55;margin-top:8px}
body.preview-phone .daily-ayah-foot{margin-top:11px;padding-top:9px}
@media(max-width:560px){
  .home-daily-ayah{margin-top:12px;padding:14px 14px 13px;border-radius:18px}
  .daily-ayah-arabic{font-size:21px;line-height:1.82;margin-top:11px}
  .daily-ayah-translation{font-size:10.5px;line-height:1.55;margin-top:8px}
  .daily-ayah-foot{margin-top:11px;padding-top:9px}
  .daily-ayah-actions{gap:6px}
  .daily-ayah-theme{max-width:45%}
}
@media(max-width:380px){
  .daily-ayah-foot{align-items:flex-end}
  .daily-ayah-foot .daily-ayah-share span{display:none}
  .daily-ayah-foot .daily-ayah-share{width:34px;padding:7px}
}
@media(min-width:1024px){
  body.home-route:not(.preview-phone) .home-daily-ayah{
    margin-top:20px;padding:22px 26px 19px;border-radius:24px
  }
  body.home-route:not(.preview-phone) .daily-ayah-head small{font-size:10.5px}
  body.home-route:not(.preview-phone) .daily-ayah-kicker{font-size:10px}
  body.home-route:not(.preview-phone) .daily-ayah-theme{font-size:9.5px;padding:6px 10px}
  body.home-route:not(.preview-phone) .daily-ayah-arabic{font-size:30px;line-height:1.9;max-width:1040px;margin-left:auto}
  body.home-route:not(.preview-phone) .daily-ayah-translation{font-size:13px;max-width:1040px}
  body.home-route:not(.preview-phone) .daily-ayah-foot>b{font-size:11.5px}
  body.home-route:not(.preview-phone) .daily-ayah-foot button{font-size:10.5px;min-height:38px;padding:8px 12px}
  body.home-route:not(.preview-phone) .daily-ayah-actions{gap:8px}
}

/* ===== v122 — KONTEN INFORMASI PENGATURAN ===== */
.settings-info-section{margin-top:12px}
.contact-meta{display:flex;flex-wrap:wrap;gap:7px;margin-top:10px}
.contact-meta span{display:inline-flex;align-items:center;gap:6px;padding:7px 9px;border-radius:10px;background:var(--green-soft);color:var(--green);font-size:10px;font-weight:700}
.settings-external-link{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 15px;border:1px solid var(--line);border-radius:16px;background:var(--card);color:var(--text);text-decoration:none;box-shadow:var(--shadow)}
.settings-external-link span{display:flex;align-items:center;gap:9px;min-width:0}
.settings-external-link i{color:var(--green)}
.settings-external-link:hover{border-color:color-mix(in srgb,var(--green) 38%,var(--line));transform:translateY(-1px)}
.version-note{margin-top:12px}
.version-note h3{margin:0 0 7px;font-size:16px}
.version-note p{margin:0;color:var(--muted);font-size:13px;line-height:1.65}
@media(max-width:560px){
  .contact-meta{display:grid;grid-template-columns:1fr}
  .contact-meta span{width:100%;box-sizing:border-box}
  .settings-external-link{padding:13px}
}

/* ==============================================================
   v125 — PERAPIAN POSISI MENU TENTANG & BANTUAN
   Judul/subjudul setiap item dibuat benar-benar berada di tengah kartu,
   tanpa dipengaruhi panjang teks, ikon kiri, atau chevron kanan.
   ============================================================== */
.settings-info-item{
  position:relative;
  min-height:76px;
  padding-left:64px;
  padding-right:64px;
  justify-content:center;
}
.settings-info-item .left{
  display:block;
  width:100%;
  min-width:0;
}
.settings-info-item .left>.num{
  position:absolute;
  left:14px;
  top:50%;
  transform:translateY(-50%);
}
.settings-info-item .left>div{
  width:100%;
  min-width:0;
  text-align:center;
}
.settings-info-item .left>div h4,
.settings-info-item .left>div p{
  text-align:center;
}
.settings-info-item>i:last-child{
  position:absolute;
  right:14px;
  top:50%;
  transform:translateY(-50%);
}
@media(max-width:420px){
  .settings-info-item{
    padding-left:58px;
    padding-right:58px;
  }
  .settings-info-item .left>.num{left:12px}
  .settings-info-item>i:last-child{right:12px}
}

/* ==============================================================
   v126 — PERAPIAN POSISI DATA DI PERANGKAT
   Judul/subjudul pada kartu aksi Pengaturan dibuat benar-benar
   terpusat, sementara ikon kiri dan ikon aksi kanan berdiri sendiri.
   ============================================================== */
.settings-data-item{
  position:relative;
  min-height:76px;
  padding-left:64px;
  padding-right:64px;
  justify-content:center;
}
.settings-data-item .left{
  display:block;
  width:100%;
  min-width:0;
}
.settings-data-item .left>.num{
  position:absolute;
  left:14px;
  top:50%;
  transform:translateY(-50%);
}
.settings-data-item .left>div{
  width:100%;
  min-width:0;
  text-align:center;
}
.settings-data-item .left>div h4,
.settings-data-item .left>div p{
  text-align:center;
}
.settings-data-item>i:last-child{
  position:absolute;
  right:14px;
  top:50%;
  transform:translateY(-50%);
}
@media(max-width:420px){
  .settings-data-item{
    padding-left:58px;
    padding-right:58px;
  }
  .settings-data-item .left>.num{left:12px}
  .settings-data-item>i:last-child{right:12px}
}

/* v127 — Syair & Lagu Nahdliyin */


/* Syair & Lagu Nahdliyin — premium polish */
.syair-head{position:relative;margin:0 0 18px;padding:18px 18px 16px;border-radius:24px;background:linear-gradient(135deg,rgba(16,99,72,.10),rgba(255,255,255,.98) 60%,rgba(214,185,118,.14) 100%);border:1px solid rgba(16,99,72,.08);box-shadow:0 14px 32px rgba(17,39,33,.05);overflow:hidden}
.syair-head::before{content:"";position:absolute;right:-36px;top:-30px;width:124px;height:124px;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.42) 0,rgba(255,255,255,0) 72%)}
.syair-head::after{content:"";position:absolute;left:-22px;bottom:-48px;width:116px;height:116px;border-radius:50%;background:radial-gradient(circle,rgba(16,99,72,.12) 0,rgba(16,99,72,0) 72%)}
.syair-head-copy,.syair-summary-strip{position:relative;z-index:1}
.syair-head-kicker{display:inline-flex;align-items:center;gap:7px;padding:7px 11px;border-radius:999px;background:rgba(255,255,255,.74);backdrop-filter:blur(10px);border:1px solid rgba(16,99,72,.08);font-size:11px;font-weight:800;color:var(--brand);letter-spacing:.04em;text-transform:uppercase}
.syair-head .page-title{margin:14px 0 6px;line-height:1.08}
.syair-head .page-subtitle{max-width:560px;color:color-mix(in srgb,var(--text) 65%, var(--muted) 35%)}
.syair-summary-strip{display:flex;gap:10px;flex-wrap:wrap;margin-top:15px}
.syair-summary-chip{display:grid;gap:2px;min-width:92px;padding:10px 12px;border-radius:18px;background:rgba(255,255,255,.72);backdrop-filter:blur(8px);border:1px solid rgba(16,99,72,.07);box-shadow:inset 0 1px 0 rgba(255,255,255,.55)}
.syair-summary-chip b{font-size:17px;line-height:1;color:var(--text)}
.syair-summary-chip small{font-size:11px;color:var(--muted);font-weight:700}
.syair-group{margin:20px 0 26px}
.syair-group .section-head{align-items:center;margin-bottom:10px}
.syair-group .section-head h3{font-size:17px}
.syair-group-count{display:inline-flex;align-items:center;justify-content:center;height:28px;padding:0 11px;border-radius:999px;background:rgba(16,99,72,.08);color:var(--brand);font-size:11px;font-weight:800;white-space:nowrap}
.syair-song-list{display:grid;gap:12px}
.syair-song-item{display:grid;grid-template-columns:50px minmax(0,1fr) 14px;gap:13px;align-items:center;min-height:84px;padding:14px 14px 14px 13px;border-radius:22px;border:1px solid rgba(16,99,72,.07);background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(250,252,251,.98));box-shadow:0 10px 24px rgba(18,35,29,.04),inset 0 1px 0 rgba(255,255,255,.7)}
.syair-song-item .amaliyah-arrow{font-size:14px;color:var(--muted)}
.syair-song-icon{width:50px;height:50px;border-radius:18px;display:grid;place-items:center;background:linear-gradient(180deg,rgba(16,99,72,.12),rgba(16,99,72,.07));color:var(--brand);font-size:21px;flex:0 0 auto;box-shadow:inset 0 1px 0 rgba(255,255,255,.7)}
.syair-song-item .amaliyah-copy{min-width:0;text-align:left;display:grid;gap:4px}
.syair-song-title-row{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.syair-song-item .amaliyah-copy h4{margin:0;font-size:16px;line-height:1.24}
.syair-song-item .amaliyah-copy p,.syair-song-item .amaliyah-copy small{display:block;margin:0;color:var(--muted);font-size:12px;line-height:1.4}
.syair-song-item .amaliyah-copy small{margin-top:1px;font-weight:700}
.syair-song-status{display:inline-flex;align-items:center;justify-content:center;padding:5px 10px;border-radius:999px;background:rgba(16,99,72,.09);color:var(--brand);font-size:10px;font-weight:850;letter-spacing:.02em;white-space:nowrap}
[data-theme="dark"] .syair-head{background:linear-gradient(135deg,rgba(124,211,167,.12),rgba(24,31,28,.95) 62%,rgba(214,185,118,.10) 100%);border-color:rgba(124,211,167,.10);box-shadow:none}
[data-theme="dark"] .syair-head-kicker,[data-theme="dark"] .syair-summary-chip{background:rgba(255,255,255,.04);border-color:rgba(124,211,167,.10);box-shadow:none}
[data-theme="dark"] .syair-group-count,[data-theme="dark"] .syair-song-status{background:rgba(124,211,167,.10)}
[data-theme="dark"] .syair-song-item{background:linear-gradient(180deg,rgba(124,211,167,.04),rgba(24,31,28,.96));border-color:rgba(124,211,167,.09);box-shadow:none}
[data-theme="dark"] .syair-song-icon{background:linear-gradient(180deg,rgba(124,211,167,.14),rgba(124,211,167,.08))}
@media (max-width:640px){
  .syair-head{padding:16px 15px 15px;border-radius:22px}
  .syair-head .page-title{margin-top:12px}
  .syair-head .page-subtitle{font-size:14px;line-height:1.55}
  .syair-summary-strip{gap:8px}
  .syair-summary-chip{min-width:84px;padding:9px 10px;border-radius:16px}
  .syair-summary-chip b{font-size:16px}
  .syair-song-item{grid-template-columns:46px minmax(0,1fr) 12px;gap:11px;padding:12px 12px 12px 11px;border-radius:20px;min-height:78px}
  .syair-song-icon{width:46px;height:46px;border-radius:16px;font-size:19px}
  .syair-song-title-row{gap:7px}
  .syair-song-item .amaliyah-copy h4{font-size:15px}
  .syair-song-item .amaliyah-copy p,.syair-song-item .amaliyah-copy small{font-size:11.5px}
}

.syair-plan-note{margin:12px 0 18px}
.syair-group{margin:18px 0 24px}
.syair-group .section-head{align-items:end}
.syair-group .section-head span{font-size:12px;color:var(--muted)}
.syair-song-list{display:grid;gap:10px}
.syair-song-item{min-height:74px;align-items:center}
.syair-song-icon{width:42px;height:42px;border-radius:14px;display:grid;place-items:center;background:rgba(16,99,72,.09);color:var(--brand);font-size:19px;flex:0 0 auto}
.syair-song-item .amaliyah-copy{min-width:0;text-align:left}
.syair-song-item .amaliyah-copy h4{margin:0 0 3px}
.syair-song-item .amaliyah-copy p,.syair-song-item .amaliyah-copy small{display:block;margin:0;color:var(--muted);font-size:12px;line-height:1.35}
.syair-song-item .amaliyah-copy small{margin-top:4px;font-weight:700}
.syair-reader-card{overflow:hidden}
.syair-reader{display:grid;gap:16px}
.syair-title-block{text-align:center;padding:16px 8px 4px}
.syair-title-block h2{margin:6px 0 2px;font-size:28px}
.syair-title-block p{margin:0;color:var(--muted)}
.syair-kicker{display:inline-flex;padding:6px 10px;border-radius:999px;background:rgba(16,99,72,.09);color:var(--brand);font-size:12px;font-weight:800}
.syair-about-card,.syair-format-preview{margin:0;box-shadow:none}
.syair-about-card h3,.syair-format-preview h3{margin-top:0}
.syair-format-row{display:grid;grid-template-columns:34px 1fr;gap:10px;align-items:start;padding:12px 0;border-top:1px solid var(--line)}
.syair-format-row:first-of-type{border-top:0}
.syair-format-row>span{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:rgba(16,99,72,.09);font-weight:800;color:var(--brand)}
.syair-format-row b,.syair-format-row small{display:block}
.syair-format-row small{margin-top:3px;color:var(--muted);line-height:1.45}
[data-theme="dark"] .syair-song-icon,[data-theme="dark"] .syair-kicker,[data-theme="dark"] .syair-format-row>span{background:rgba(124,211,167,.11)}
@media (max-width:640px){.syair-title-block h2{font-size:25px}.syair-song-item{min-height:70px}}

/* v128 — Ya Lal Wathon native HTML reader */
.syair-lyrics-card{margin:0;box-shadow:none;padding:18px}
.syair-section-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:14px}
.syair-section-head h3{margin:3px 0 0;font-size:18px}
.syair-section-kicker{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--brand);font-weight:800}
.syair-repeat{display:inline-flex;align-items:center;justify-content:center;min-width:35px;height:28px;padding:0 9px;border-radius:999px;background:rgba(16,99,72,.10);color:var(--brand);font-size:12px;font-weight:850;white-space:nowrap;vertical-align:middle}
.syair-arabic{
  font-family:"Amiri","Noto Naskh Arabic","Traditional Arabic",serif!important;
  font-size:calc(var(--arabic-size) * .86);line-height:2.12;text-align:center;
  font-weight:400;letter-spacing:0;word-spacing:.08em;text-rendering:optimizeLegibility;
}
.syair-arabic p,.syair-latin-lines p,.syair-meaning-lines p{margin:0}
.syair-arabic p+p{margin-top:7px}
.syair-latin-lines,.syair-meaning-lines{display:grid;gap:9px;font-size:calc(17px * var(--syair-text-scale,1));line-height:1.65;text-align:center}
.syair-latin-lines b,.syair-meaning-lines b{font-weight:850}
.syair-repeat-group,.syair-meaning-stanza{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:12px;margin-top:4px}
.syair-repeat-group>div,.syair-meaning-stanza>div{display:grid;gap:9px}
.syair-stanza-divider{height:1px;background:var(--line);margin:7px 0}
.syair-source-note{margin-top:12px!important;padding-top:12px;border-top:1px solid var(--line);color:var(--muted);font-size:13px;line-height:1.55}
.syair-source-note i{color:var(--brand);margin-right:5px}
[data-theme="dark"] .syair-repeat{background:rgba(124,211,167,.12)}
@media (max-width:640px){
  .syair-lyrics-card{padding:16px 14px}
  .syair-arabic{font-size:calc(var(--arabic-size) * .78);line-height:2.08}
  .syair-latin-lines,.syair-meaning-lines{font-size:calc(16px * var(--syair-text-scale,1))}
  .syair-repeat-group,.syair-meaning-stanza{grid-template-columns:minmax(0,1fr) auto;gap:8px}
}

/* v130 — Ya Lal Wathon: Arabic font/harakat final */
body.preview-phone .syair-arabic{font-size:calc(var(--arabic-size) * .76);line-height:2.05}

.syair-response{font-weight:700;opacity:.78;white-space:nowrap}


/* v140 — Redesign Syair & Lagu Nahdliyin reader */
.syair-reader{gap:18px}
.syair-reader .syair-title-block{
  position:relative;overflow:hidden;text-align:left;padding:18px 20px 18px;border-radius:24px;
  background:linear-gradient(135deg,rgba(16,99,72,.14) 0%,rgba(16,99,72,.05) 58%,rgba(204,166,86,.14) 100%);
  border:1px solid rgba(16,99,72,.12);box-shadow:0 12px 26px rgba(19,29,24,.05);
}
.syair-reader .syair-title-block::before{
  content:"";position:absolute;left:20px;top:0;width:118px;height:4px;border-radius:0 0 999px 999px;
  background:linear-gradient(90deg,var(--brand),rgba(16,99,72,.18));
}
.syair-reader .syair-title-block::after{
  content:"\f49e";position:absolute;right:18px;top:50%;transform:translateY(-50%);font-size:72px;line-height:1;
  font-family:"bootstrap-icons";font-weight:400;color:rgba(16,99,72,.08);pointer-events:none;
}
.syair-reader .syair-title-block h2{margin:8px 0 4px;font-size:29px;line-height:1.15;position:relative;z-index:1}
.syair-reader .syair-title-block p{margin:0;max-width:86%;color:var(--muted);position:relative;z-index:1;line-height:1.45}
.syair-reader .syair-kicker{background:rgba(255,255,255,.66);backdrop-filter:blur(8px);border:1px solid rgba(16,99,72,.09);position:relative;z-index:1}

.syair-reader .syair-lyrics-card,.syair-reader .syair-about-card,.syair-reader .syair-format-preview{
  position:relative;overflow:hidden;border-radius:24px;border:1px solid rgba(16,99,72,.10);
  box-shadow:0 12px 24px rgba(19,29,24,.04);
}
.syair-reader .syair-lyrics-card{padding:24px 18px 20px;background:linear-gradient(180deg,rgba(16,99,72,.03),rgba(255,255,255,.96) 28%)}
.syair-reader .syair-about-card{background:linear-gradient(180deg,rgba(16,99,72,.06),rgba(255,255,255,.98) 36%)}
.syair-reader .syair-format-preview{background:linear-gradient(180deg,rgba(16,99,72,.04),rgba(255,255,255,.98) 40%)}
.syair-reader .syair-lyrics-card::before,.syair-reader .syair-about-card::before,.syair-reader .syair-format-preview::before{
  content:"";position:absolute;left:18px;right:18px;top:0;height:3px;border-radius:0 0 999px 999px;
  background:linear-gradient(90deg,var(--brand),rgba(16,99,72,.18),transparent);
}
.syair-reader .syair-about-card h3,.syair-reader .syair-format-preview h3{font-size:22px;margin-bottom:12px}
.syair-reader .syair-about-card p{line-height:1.72}

.syair-reader .syair-section-head{display:none}
/* Audit v141: label semantik tetap diperlukan pada Ya Lal Wathon (Arab/Terjemahan)
   dan Sholawat An-Nahdliyah (Teks Arab); label LIRIK yang redundan tetap disembunyikan. */
.yalal-reader .syair-section-head,.nahdliyah-reader .syair-section-head{display:flex}
.syair-reader .syair-arabic,.syair-reader .syair-latin-lines,.syair-reader .syair-meaning-lines{max-width:720px;margin:0 auto}
.syair-reader .syair-latin-lines,.syair-reader .syair-meaning-lines{gap:10px;font-size:calc(18px * var(--syair-text-scale,1));line-height:1.7}
.syair-reader .syair-arabic p+p{margin-top:8px}
.syair-reader .syair-repeat{box-shadow:inset 0 0 0 1px rgba(16,99,72,.10)}
.syair-reader .syair-stanza-divider{position:relative;width:124px;height:22px;margin:8px auto;background:none}
.syair-reader .syair-stanza-divider::before{
  content:"";position:absolute;left:0;right:0;top:50%;height:1px;transform:translateY(-50%);
  background:linear-gradient(90deg,transparent,rgba(16,99,72,.28),transparent);
}
.syair-reader .syair-stanza-divider::after{
  content:"◆";position:absolute;left:50%;top:50%;transform:translate(-50%,-58%);font-size:10px;color:var(--brand);
  background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(247,250,248,.98));padding:0 8px;
}
.syair-reader .syair-source-note{margin-top:16px!important;padding-top:14px;border-top:1px dashed rgba(16,99,72,.20)}
.syair-reader .syaraf-end{
  width:auto;margin:0;padding:10px 14px;border-radius:999px;background:rgba(16,99,72,.06);
  border:1px solid rgba(16,99,72,.08);display:flex;flex-wrap:wrap;justify-content:center;gap:8px;
}
.syair-reader .syaraf-end strong{font-size:13px;color:var(--brand)}
.syair-reader .syaraf-end span{display:block!important;height:auto;background:none;color:var(--muted);font-size:12px}

[data-theme="dark"] .syair-reader .syair-title-block{background:linear-gradient(135deg,rgba(124,211,167,.12),rgba(124,211,167,.04) 58%,rgba(214,185,118,.10) 100%);border-color:rgba(124,211,167,.12);box-shadow:none}
[data-theme="dark"] .syair-reader .syair-title-block::after{color:rgba(124,211,167,.08)}
[data-theme="dark"] .syair-reader .syair-kicker{background:rgba(255,255,255,.04);border-color:rgba(124,211,167,.10)}
[data-theme="dark"] .syair-reader .syair-lyrics-card,[data-theme="dark"] .syair-reader .syair-about-card,[data-theme="dark"] .syair-reader .syair-format-preview{background:linear-gradient(180deg,rgba(124,211,167,.04),rgba(24,31,28,.96) 34%);border-color:rgba(124,211,167,.09);box-shadow:none}
[data-theme="dark"] .syair-reader .syair-stanza-divider::before{background:linear-gradient(90deg,transparent,rgba(124,211,167,.30),transparent)}
[data-theme="dark"] .syair-reader .syair-stanza-divider::after{background:linear-gradient(180deg,rgba(24,31,28,.96),rgba(24,31,28,.96))}
[data-theme="dark"] .syair-reader .syaraf-end{background:rgba(124,211,167,.06);border-color:rgba(124,211,167,.10)}

@media (max-width:640px){
  .syair-reader .syair-title-block{padding:16px 16px 16px;border-radius:22px}
  .syair-reader .syair-title-block::before{left:16px;width:92px}
  .syair-reader .syair-title-block::after{right:12px;font-size:58px}
  .syair-reader .syair-title-block h2{font-size:26px}
  .syair-reader .syair-title-block p{max-width:82%;font-size:14px}
  .syair-reader .syair-lyrics-card,.syair-reader .syair-about-card,.syair-reader .syair-format-preview{border-radius:22px}
  .syair-reader .syair-lyrics-card{padding:20px 14px 18px}
  .syair-reader .syair-about-card h3,.syair-reader .syair-format-preview h3{font-size:20px}
  .syair-reader .syair-latin-lines,.syair-reader .syair-meaning-lines{font-size:calc(16px * var(--syair-text-scale,1));line-height:1.68}
}

/* Build 148 — Jumberareka: arti per baris */
.syair-translation-note{display:block;margin-top:2px;font-size:.82em;font-style:italic;font-weight:500;line-height:1.45;opacity:.68}
.jumberareka-lines p{margin-bottom:3px}


/* v153 — Premium polish daftar Syair & Lagu Nahdliyin */
.syair-head{margin-bottom:24px}
.syair-head-kicker{
  display:inline-flex;align-items:center;gap:7px;margin:1px 0 8px;
  padding:6px 10px;border-radius:999px;
  background:rgba(16,99,72,.07);border:1px solid rgba(16,99,72,.08);
  color:var(--brand);font-size:11px;font-weight:800;letter-spacing:.015em
}
.syair-head .page-title{margin-bottom:6px}
.syair-head .page-subtitle{max-width:680px;margin-bottom:16px;line-height:1.5}
.syair-overview{
  display:grid;grid-template-columns:44px minmax(0,1fr) 34px;gap:11px;align-items:center;
  padding:12px 13px;border-radius:18px;
  border:1px solid rgba(16,99,72,.10);
  background:linear-gradient(135deg,rgba(16,99,72,.085),rgba(16,99,72,.025) 62%,rgba(190,151,62,.07));
  box-shadow:0 8px 22px rgba(19,58,46,.045)
}
.syair-overview-icon{width:44px;height:44px;border-radius:14px;display:grid;place-items:center;background:rgba(255,255,255,.72);color:var(--brand);font-size:20px;box-shadow:inset 0 0 0 1px rgba(16,99,72,.07)}
.syair-overview-copy{min-width:0;display:grid;gap:2px;text-align:left}
.syair-overview-copy b{font-size:13px;line-height:1.3}
.syair-overview-copy small{font-size:10.5px;line-height:1.35;color:var(--muted)}
.syair-overview-check{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;color:var(--brand);background:rgba(255,255,255,.62);font-size:17px}
.syair-group{margin:22px 0 28px}
.syair-group .section-head{margin-bottom:10px;align-items:center}
.syair-group .section-head h3{font-size:18px;line-height:1.25;margin:0}
.syair-group .section-head .syair-group-count{display:inline-flex;align-items:center;justify-content:center;min-height:26px;padding:4px 9px;border-radius:999px;background:rgba(16,99,72,.055);border:1px solid rgba(16,99,72,.07);font-size:10.5px;font-weight:750;color:var(--muted)}
.syair-song-list{gap:9px}
.syair-song-item{
  position:relative;display:grid;grid-template-columns:46px minmax(0,1fr) 32px;gap:12px;
  min-height:84px;padding:13px 12px 13px 13px;border-radius:19px;
  border:1px solid rgba(22,56,46,.09);
  background:linear-gradient(135deg,rgba(255,255,255,.99),rgba(248,251,249,.98));
  box-shadow:0 7px 20px rgba(22,54,45,.035);
  overflow:hidden;transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease
}
.syair-song-item::before{content:"";position:absolute;inset:0 auto 0 0;width:3px;background:linear-gradient(180deg,rgba(16,99,72,.62),rgba(16,99,72,.10));opacity:.62}
.syair-song-item:active{transform:scale(.992)}
@media (hover:hover){.syair-song-item:hover{border-color:rgba(16,99,72,.16);box-shadow:0 10px 24px rgba(22,54,45,.065)}}
.syair-song-icon{width:46px;height:46px;border-radius:15px;background:linear-gradient(145deg,rgba(16,99,72,.115),rgba(16,99,72,.055));box-shadow:inset 0 0 0 1px rgba(16,99,72,.055);font-size:20px}
.syair-song-item .amaliyah-copy{display:grid;align-content:center;gap:3px;min-width:0;text-align:left}
.syair-song-item .amaliyah-copy h4{margin:0;font-size:14px;line-height:1.32;font-weight:800;color:var(--text)}
.syair-song-item .amaliyah-copy p{margin:0;font-size:11.5px;line-height:1.35;color:var(--muted)}
.syair-verified{display:inline-flex!important;align-items:center;gap:5px;width:max-content;max-width:100%;margin-top:4px!important;padding:4px 8px;border-radius:999px;background:rgba(16,99,72,.07);color:var(--brand)!important;font-size:9.5px!important;line-height:1!important;font-weight:800!important}
.syair-verified i{font-size:10px}
.syair-song-arrow{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;align-self:center;background:rgba(16,99,72,.045);color:var(--muted);font-size:12px;transition:transform .16s ease,background .16s ease,color .16s ease}
@media (hover:hover){.syair-song-item:hover .syair-song-arrow{transform:translateX(2px);background:rgba(16,99,72,.09);color:var(--brand)}}
[data-theme="dark"] .syair-head-kicker{background:rgba(124,211,167,.08);border-color:rgba(124,211,167,.08)}
[data-theme="dark"] .syair-overview{background:linear-gradient(135deg,rgba(124,211,167,.105),rgba(124,211,167,.03) 62%,rgba(214,185,118,.07));border-color:rgba(124,211,167,.10);box-shadow:none}
[data-theme="dark"] .syair-overview-icon,[data-theme="dark"] .syair-overview-check{background:rgba(255,255,255,.035)}
[data-theme="dark"] .syair-group .section-head .syair-group-count{background:rgba(124,211,167,.055);border-color:rgba(124,211,167,.07)}
[data-theme="dark"] .syair-song-item{background:linear-gradient(135deg,rgba(29,37,33,.98),rgba(24,31,28,.98));border-color:rgba(124,211,167,.08);box-shadow:none}
[data-theme="dark"] .syair-song-icon{background:linear-gradient(145deg,rgba(124,211,167,.13),rgba(124,211,167,.055));box-shadow:inset 0 0 0 1px rgba(124,211,167,.05)}
[data-theme="dark"] .syair-verified{background:rgba(124,211,167,.09)}
[data-theme="dark"] .syair-song-arrow{background:rgba(124,211,167,.055)}
@media(max-width:640px){
  .syair-head{margin-bottom:20px}
  .syair-overview{grid-template-columns:40px minmax(0,1fr) 30px;padding:11px 12px;gap:10px;border-radius:17px}
  .syair-overview-icon{width:40px;height:40px;border-radius:13px;font-size:18px}
  .syair-group{margin:20px 0 25px}
  .syair-group .section-head h3{font-size:17px}
  .syair-song-item{grid-template-columns:44px minmax(0,1fr) 30px;gap:10px;min-height:80px;padding:12px 11px 12px 12px;border-radius:18px}
  .syair-song-icon{width:44px;height:44px;border-radius:14px;font-size:19px}
  .syair-song-item .amaliyah-copy h4{font-size:13.5px}
}


/* v154 — clean hero Syair & Lagu: no audit/stat counters in public UI */
.syair-head .page-subtitle{margin-bottom:0}
.syair-head-copy{padding-bottom:2px}
.syair-song-item .amaliyah-copy{gap:3px}
[data-theme="dark"] .syair-head .page-subtitle{color:var(--muted)}

/* ==============================================================
   NUHA Build 156 — Beranda Premium
   Terinspirasi ritme aplikasi NU modern: hero kuat, akses cepat,
   konten editorial, tanpa mengubah fungsi inti atau modul lain.
   ============================================================== */
body.home-route .home-screen.home-premium{padding-bottom:6px}

body.home-route .home-premium .home-prayer{
  position:relative;overflow:hidden;padding:17px 17px 14px;border-radius:24px;
  border:1px solid color-mix(in srgb,var(--green) 16%,var(--line));
  background:linear-gradient(135deg,#ffffff 0%,#f7fbf9 54%,#eaf6f0 100%);
  box-shadow:0 12px 30px rgba(17,86,66,.08)
}
body.home-route .home-premium .home-prayer:before{
  width:98px;height:98px;right:-31px;top:-37px;border:20px solid rgba(185,138,47,.08)
}
body.home-route .home-premium .home-prayer:after{
  width:154px;height:154px;right:-52px;bottom:-102px;background:rgba(16,99,72,.065)
}
body.home-route .home-premium .home-prayer .hero-top{position:relative;z-index:2}
body.home-route .home-premium .home-prayer h2{font-size:24px;letter-spacing:-.025em;margin-top:5px}
body.home-route .home-premium .home-prayer .countdown{font-size:11px;margin-top:5px}
body.home-route .home-premium .home-prayer-icon{
  width:44px;height:44px;border-radius:16px;background:rgba(228,244,237,.92);font-size:20px;
  box-shadow:inset 0 0 0 1px rgba(16,99,72,.05)
}
body.home-route .home-premium .home-prayer .hero-meta{margin-top:12px;gap:6px}
body.home-route .home-premium .home-prayer .pill{padding:5px 9px;border-radius:999px;font-size:9.5px}
body.home-route .home-premium .home-prayer-source{
  position:relative;z-index:2;display:block;margin-top:8px!important;color:var(--muted)!important;
  font-size:8.7px!important;letter-spacing:.01em
}

body.home-route .home-shortcut-panel{
  margin-top:14px;padding:13px 10px 8px;border-radius:23px;
  border:1px solid color-mix(in srgb,var(--green) 7%,var(--line));
  background:rgba(255,255,255,.52);box-shadow:0 10px 24px rgba(18,78,61,.035)
}
body.home-route .home-mini-head{display:flex;align-items:flex-end;justify-content:space-between;padding:0 5px 7px}
body.home-route .home-mini-head span{
  display:block;color:var(--green);font-size:8.5px;font-weight:850;letter-spacing:.11em
}
body.home-route .home-mini-head b{display:block;margin-top:2px;font-size:12px;line-height:1.25;color:var(--text)}
body.home-route .home-premium .home-quick-grid{margin-top:0;gap:5px 3px}
body.home-route .home-premium .quick{min-height:73px;padding:6px 2px;border-radius:15px}
body.home-route .home-premium .quick:hover,
body.home-route .home-premium .quick:focus-visible{background:rgba(228,244,237,.58)}
body.home-route .home-premium .quick .qicon{
  width:39px;height:39px;margin-bottom:6px;border-radius:14px;font-size:18px;
  box-shadow:inset 0 0 0 1px rgba(16,99,72,.035)
}
body.home-route .home-premium .quick b{font-size:10px;line-height:1.15;font-weight:720}

body.home-route .home-resume-card{
  margin-top:13px;display:grid;grid-template-columns:42px minmax(0,1fr) 38px;align-items:center;gap:11px;
  min-height:68px;padding:10px 11px;border:1px solid color-mix(in srgb,var(--green) 14%,var(--line));
  border-radius:20px;background:linear-gradient(135deg,rgba(228,244,237,.82),rgba(255,255,255,.98));
  box-shadow:0 8px 22px rgba(18,78,61,.04)
}
body.home-route .home-resume-icon{
  width:42px;height:42px;border-radius:14px;display:grid;place-items:center;background:#ffffff;color:var(--green);
  font-size:18px;box-shadow:0 5px 14px rgba(18,78,61,.05)
}
body.home-route .home-resume-copy{min-width:0}
body.home-route .home-resume-copy small{display:block;color:var(--green);font-size:9px;font-weight:800;letter-spacing:.02em}
body.home-route .home-resume-copy b{display:block;margin-top:3px;font-size:12.5px;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body.home-route .home-resume-copy b span{font-weight:600;color:var(--muted)}
body.home-route .home-resume-card>button{
  width:38px;height:38px;border:0;border-radius:13px;background:var(--green);color:#fff;display:grid;place-items:center;cursor:pointer
}

body.home-route .home-premium .home-search{margin-top:13px}
body.home-route .home-premium .home-search input{
  min-height:48px;padding-left:15px;border-radius:18px;border-color:#d7e5df;
  box-shadow:0 7px 20px rgba(18,78,61,.035)
}
body.home-route .home-premium .home-search button{right:4px;top:4px;width:40px;height:40px;border-radius:14px}

body.home-route .home-premium .home-daily-ayah{
  margin-top:14px;border-radius:22px;box-shadow:0 13px 28px rgba(7,83,64,.15)
}
body.home-route .home-premium .daily-ayah-kicker{letter-spacing:.08em}
body.home-route .home-premium .daily-ayah-theme{backdrop-filter:blur(8px)}

body.home-route .home-premium .home-section-head{margin:22px 3px 10px;align-items:flex-end}
body.home-route .home-premium .home-section-head>div{min-width:0}
body.home-route .home-section-kicker{
  display:block;margin-bottom:4px;color:var(--green);font-size:8.5px;font-weight:850;letter-spacing:.11em
}
body.home-route .home-premium .home-section-head h3{font-size:17px;letter-spacing:-.018em}
body.home-route .home-premium .home-section-head .link-btn{
  min-height:30px;padding:5px 9px;border-radius:999px;background:var(--green-soft);font-size:10.5px;font-weight:800
}
body.home-route .home-premium .home-news-list{gap:10px}
body.home-route .home-premium .news-card{
  position:relative;padding:8px;border-radius:18px;border-color:#dbe7e2;
  background:linear-gradient(180deg,#fff,#fbfdfc);box-shadow:0 7px 20px rgba(18,78,61,.04)
}
body.home-route .home-premium .news-thumb{border-radius:14px}
body.home-route .home-premium .news-card h4{font-size:12.5px;line-height:1.3;margin:3px 0 5px}
body.home-route .home-premium .news-card .meta:first-child{color:var(--green);font-weight:700}

body.home-route .home-premium .bahtsul-home-card{
  margin-top:22px;border-radius:24px;box-shadow:0 16px 34px rgba(15,65,52,.11)
}
body.home-route .home-premium .bahtsul-home-inner{padding:21px 18px 20px}
body.home-route .home-premium .bahtsul-home-card h2{font-size:24px}

[data-theme="dark"] body.home-route .home-shortcut-panel{
  background:rgba(34,49,43,.72);border-color:#34463e;box-shadow:none
}
[data-theme="dark"] body.home-route .home-premium .home-prayer{
  background:linear-gradient(135deg,#26372f 0%,#22322b 58%,#20382f 100%);border-color:#3a5047;box-shadow:0 12px 28px rgba(0,0,0,.18)
}
[data-theme="dark"] body.home-route .home-premium .home-prayer-icon{background:#2b493f}
[data-theme="dark"] body.home-route .home-resume-card{
  background:linear-gradient(135deg,#284139,#22312b);border-color:#395148;box-shadow:none
}
[data-theme="dark"] body.home-route .home-resume-icon{background:#30483f;color:#73d3ba;box-shadow:none}
[data-theme="dark"] body.home-route .home-premium .home-section-head .link-btn{background:#29463c;color:#71d0b8}
[data-theme="dark"] body.home-route .home-premium .news-card{background:linear-gradient(180deg,#22312b,#202f29);border-color:#354940;box-shadow:none}

body.preview-phone.home-route .home-shortcut-panel{margin-top:12px;padding:11px 7px 6px;border-radius:21px}
body.preview-phone.home-route .home-premium .home-prayer{padding:15px 15px 13px;border-radius:22px}
body.preview-phone.home-route .home-premium .home-prayer h2{font-size:22px}
body.preview-phone.home-route .home-premium .quick{min-height:70px}
body.preview-phone.home-route .home-premium .quick .qicon{width:37px;height:37px}
body.preview-phone.home-route .home-resume-card{margin-top:12px}

@media(max-width:560px){
  body.home-route .home-shortcut-panel{margin-top:12px;padding:11px 7px 6px;border-radius:21px}
  body.home-route .home-premium .home-prayer{padding:15px 15px 13px;border-radius:22px}
  body.home-route .home-premium .home-prayer h2{font-size:22px}
  body.home-route .home-premium .quick{min-height:70px}
  body.home-route .home-premium .quick .qicon{width:37px;height:37px}
  body.home-route .home-resume-card{margin-top:12px}
}

/* ==============================================================
   NUHA Build 162 — Layered Card Hero FINAL (approved mockup)
   Baseline: Build 156. Top state = hero branding tunggal; scroll =
   compact sticky header Build 156. Tidak mengubah section bawah.
   ============================================================== */
body.home-route .home-screen.home-layered{padding-bottom:6px}

body.home-route .home-layered-zone{
  position:relative;
  isolation:isolate;
  margin:0 -16px 10px;
  padding:14px 20px 38px;
  overflow:hidden;
  background:
    radial-gradient(circle at 22px 22px,rgba(255,255,255,.055) 1.4px,transparent 1.8px) 0 0/21px 21px,
    radial-gradient(circle at 14% 24%,rgba(202,170,87,.10),transparent 28%),
    linear-gradient(145deg,#087051 0%,#08795a 48%,#075f48 100%);
  border-radius:0 0 32px 32px;
}
body.home-route .home-layered-zone::before{
  content:"";position:absolute;z-index:0;left:-72px;top:-68px;width:190px;height:190px;border-radius:50%;
  border:1px solid rgba(213,179,90,.18);box-shadow:0 0 0 18px rgba(213,179,90,.025),0 0 0 42px rgba(213,179,90,.02)
}
body.home-route .home-layered-zone::after{
  content:"";position:absolute;z-index:0;right:-72px;bottom:-92px;width:210px;height:210px;border-radius:50%;
  background:radial-gradient(circle,rgba(89,181,143,.16),rgba(89,181,143,0) 68%)
}
body.home-route .home-layered-decoration{
  position:absolute;z-index:1;left:23px;right:23px;top:25px;height:calc(100% - 58px);
  border-radius:27px;pointer-events:none
}
body.home-route .home-layered-decoration-a{
  transform:translate(5px,8px) rotate(-2deg);background:rgba(191,231,218,.58);border:1px solid rgba(255,255,255,.26)
}
body.home-route .home-layered-decoration-b{
  transform:translate(11px,13px) rotate(1.7deg);background:rgba(247,225,175,.82);left:31px;right:17px
}
body.home-route .home-premium .home-prayer.home-layered-card{
  position:relative;z-index:3;overflow:hidden;
  margin:0;min-height:238px;padding:16px 18px 15px;
  border:1px solid rgba(8,102,75,.08);border-radius:26px;
  background:linear-gradient(180deg,#fff 0%,#fff 80%,#fbfcfb 100%);
  color:var(--text);box-shadow:0 18px 36px rgba(4,55,42,.16);
  transform:rotate(-.45deg);transform-origin:center center
}
body.home-route .home-premium .home-prayer.home-layered-card::before,
body.home-route .home-premium .home-prayer.home-layered-card::after{display:none!important}
body.home-route .home-layered-brand{
  height:50px;display:flex;align-items:center;justify-content:center;margin:-1px auto 8px;transform:rotate(.45deg)
}
body.home-route .home-layered-brand img{display:block;width:auto;height:48px;max-width:76%;object-fit:contain}
body.home-route .home-premium .home-layered-card .hero-top{
  position:relative;z-index:2;display:flex;justify-content:center;align-items:center;text-align:center;transform:rotate(.45deg)
}
body.home-route .home-premium .home-layered-card .hero-top>div:first-child{min-width:0;width:100%}
body.home-route .home-premium .home-layered-card small.home-prayer-location,
body.home-route .home-premium .home-layered-card .hero-top>div>small:first-child{
  display:block;margin:0 auto 2px;color:#63736d!important;opacity:1!important;font-size:10.5px!important;font-weight:550
}
body.home-route .home-premium .home-layered-card .home-prayer-location i{color:#07805d;margin-right:4px}
body.home-route .home-premium .home-layered-card h2{
  margin:5px 0 0!important;font-size:26px!important;line-height:1.08;letter-spacing:-.035em;color:#1e2724!important;font-weight:850
}
body.home-route .home-premium .home-layered-card h2 strong{color:#087b5d!important;font-weight:850}
body.home-route .home-premium .home-layered-card .countdown{
  margin-top:6px!important;color:#66726e!important;font-size:11px!important;font-weight:600!important;font-variant-numeric:tabular-nums
}
body.home-route .home-premium .home-layered-card .home-prayer-icon{
  position:absolute;right:2px;top:15px;width:42px;height:42px;border-radius:15px;
  display:grid;place-items:center;background:#e9f6f1;color:#087b5d;font-size:18px;
  box-shadow:inset 0 0 0 1px rgba(8,123,93,.06)
}
body.home-route .home-premium .home-layered-card .hero-meta{
  position:relative;z-index:2;justify-content:center;gap:7px;margin-top:13px;transform:rotate(.45deg)
}
body.home-route .home-premium .home-layered-card .pill{
  padding:6px 10px;border-radius:999px;font-size:9.5px;font-weight:750;opacity:1
}
body.home-route .home-premium .home-layered-card .pill:first-child{background:#e8f5ef;color:#087257}
body.home-route .home-premium .home-layered-card .pill:nth-child(2){background:#fff3d8;color:#95620d}
body.home-route .home-premium .home-layered-card .home-prayer-source{
  position:relative;z-index:2;display:block;margin:8px auto 0!important;text-align:center;
  color:#7a8581!important;opacity:1!important;font-size:8.4px!important;transform:rotate(.45deg)
}

body.home-route .home-quick-clean{margin:2px 0 2px;padding:5px 0 1px}
body.home-route .home-layered .home-quick-grid{margin:0;gap:8px 3px}
body.home-route .home-layered .quick{
  min-height:76px;padding:7px 2px 5px;border-radius:17px;background:transparent
}
body.home-route .home-layered .quick:hover,
body.home-route .home-layered .quick:focus-visible{background:rgba(229,244,238,.62)}
body.home-route .home-layered .quick .qicon{
  width:44px;height:44px;margin-bottom:6px;border-radius:15px;font-size:20px;
  box-shadow:inset 0 0 0 1px rgba(8,112,81,.045)
}
body.home-route .home-layered .quick b{font-size:10px;line-height:1.18;font-weight:730}
body.home-route .home-layered .home-search{margin-top:9px}
body.home-route .home-layered .home-search input{min-height:48px;border-radius:18px;background:#fbfcfb;box-shadow:none}
body.home-route .home-layered .home-resume-card{margin-top:9px}

/* Top state: no duplicate logo/header. Saat scroll, aturan compact Build 156 aktif kembali. */
body.preview-phone.home-route:not(.home-scrolled) .topbar{display:none}
body.preview-phone.home-route .view{padding-top:0!important}
@media(max-width:560px){
  body.home-route:not(.home-scrolled) .topbar{display:none}
  body.home-route .view{padding-top:0!important}
  body.home-route .home-layered-zone{margin:0 -12px 8px;padding:12px 17px 34px;border-radius:0 0 28px 28px}
  body.home-route .home-layered-decoration{left:20px;right:20px;top:23px;height:calc(100% - 52px)}
  body.home-route .home-layered-decoration-b{left:27px;right:15px}
  body.home-route .home-premium .home-prayer.home-layered-card{min-height:226px;padding:14px 15px 13px;border-radius:24px}
  body.home-route .home-layered-brand{height:47px;margin-bottom:7px}
  body.home-route .home-layered-brand img{height:45px;max-width:78%}
  body.home-route .home-premium .home-layered-card h2{font-size:24px!important}
  body.home-route .home-premium .home-layered-card .home-prayer-icon{right:0;top:13px;width:39px;height:39px;border-radius:14px}
  body.home-route .home-layered .quick{min-height:73px}
  body.home-route .home-layered .quick .qicon{width:42px;height:42px;font-size:19px}
}

[data-theme="dark"] body.home-route .home-layered-zone{
  background:radial-gradient(circle at 22px 22px,rgba(255,255,255,.035) 1.4px,transparent 1.8px) 0 0/21px 21px,linear-gradient(145deg,#0d4435,#103d31 58%,#0a342a)
}
[data-theme="dark"] body.home-route .home-layered-decoration-a{background:rgba(74,130,108,.48)}
[data-theme="dark"] body.home-route .home-layered-decoration-b{background:rgba(116,92,46,.55)}
[data-theme="dark"] body.home-route .home-premium .home-prayer.home-layered-card{
  background:linear-gradient(180deg,#202c27,#1c2823);border-color:rgba(124,211,167,.09);box-shadow:0 18px 36px rgba(0,0,0,.23)
}
[data-theme="dark"] body.home-route .home-premium .home-layered-card h2{color:#edf4f1!important}
[data-theme="dark"] body.home-route .home-premium .home-layered-card small.home-prayer-location,
[data-theme="dark"] body.home-route .home-premium .home-layered-card .hero-top>div>small:first-child,
[data-theme="dark"] body.home-route .home-premium .home-layered-card .countdown,
[data-theme="dark"] body.home-route .home-premium .home-layered-card .home-prayer-source{color:#9fb1aa!important}
[data-theme="dark"] body.home-route .home-premium .home-layered-card .home-prayer-icon{background:#29483c;color:#7ad6bd}
[data-theme="dark"] body.home-route .home-layered .home-search input{background:#202b27}

/* ==============================================================
   NUHA Build 163 — Layered Card Depth & Premium Fix
   Visual polish only. Keeps Build 156 scroll/header behavior.
   ============================================================== */
body.home-route .home-layered-zone{
  margin:0 -16px 12px!important;
  padding:18px 20px 52px!important;
  overflow:hidden;
  border-radius:0 0 38px 38px!important;
  background:
    radial-gradient(circle at 20px 20px,rgba(255,255,255,.07) 1.25px,transparent 1.8px) 0 0/22px 22px,
    radial-gradient(circle at 76% 18%,rgba(255,255,255,.035),transparent 28%),
    linear-gradient(145deg,#086a4d 0%,#08795a 52%,#07583f 100%)!important;
  box-shadow:inset 0 -1px 0 rgba(255,255,255,.08)
}
body.home-route .home-layered-zone::before{
  content:""!important;
  position:absolute!important;z-index:0!important;
  left:-85px!important;top:-60px!important;width:245px!important;height:245px!important;
  border-radius:50%!important;
  border:1px solid rgba(213,179,90,.23)!important;
  background:repeating-radial-gradient(circle at 50% 50%,transparent 0 17px,rgba(213,179,90,.06) 18px 19px,transparent 20px 34px)!important;
  box-shadow:0 0 0 22px rgba(213,179,90,.022),0 0 0 46px rgba(213,179,90,.016)!important
}
body.home-route .home-layered-zone::after{
  content:""!important;
  position:absolute!important;z-index:2!important;
  left:-12%!important;right:-12%!important;bottom:-31px!important;width:auto!important;height:64px!important;
  border-radius:50% 50% 0 0 / 100% 100% 0 0!important;
  background:var(--bg)!important;
  pointer-events:none!important
}
body.home-route .home-layered-ornament-left{
  position:absolute;z-index:0;left:-34px;bottom:54px;width:160px;height:160px;border-radius:50%;
  opacity:.75;pointer-events:none;
  background:
    radial-gradient(circle at center,transparent 0 40px,rgba(220,184,91,.14) 41px 42px,transparent 43px 54px,rgba(220,184,91,.10) 55px 56px,transparent 57px),
    repeating-conic-gradient(from 7deg,rgba(220,184,91,.15) 0 1deg,transparent 1deg 15deg)
}
body.home-route .home-layered-sky{
  position:absolute;z-index:2;right:24px;top:14px;width:42px;height:42px;border-radius:50%;
  display:grid;place-items:center;color:#f7d77c;font-size:24px;opacity:.95;pointer-events:none;
  filter:drop-shadow(0 4px 10px rgba(0,0,0,.09))
}
body.home-route .home-layered-decoration{
  z-index:1!important;
  top:31px!important;
  height:calc(100% - 78px)!important;
  border-radius:30px!important;
  box-shadow:0 12px 24px rgba(3,49,38,.08)
}
body.home-route .home-layered-decoration-a{
  left:26px!important;right:26px!important;
  transform:translate(-2px,11px) rotate(-3.0deg)!important;
  background:linear-gradient(145deg,rgba(219,244,235,.86),rgba(139,205,181,.63))!important;
  border:1px solid rgba(255,255,255,.43)!important
}
body.home-route .home-layered-decoration-b{
  left:32px!important;right:18px!important;
  transform:translate(8px,18px) rotate(2.6deg)!important;
  background:linear-gradient(145deg,rgba(255,245,216,.93),rgba(239,208,139,.78))!important;
  border:1px solid rgba(255,255,255,.30)!important
}
body.home-route .home-premium .home-prayer.home-layered-card{
  z-index:4!important;
  min-height:250px!important;
  padding:18px 20px 17px!important;
  border-radius:30px!important;
  border:1px solid rgba(8,102,75,.07)!important;
  background:linear-gradient(180deg,#fff 0%,#fff 77%,#fbfcfb 100%)!important;
  box-shadow:0 24px 48px rgba(2,46,35,.22),0 6px 16px rgba(2,46,35,.09)!important;
  transform:rotate(-1.15deg)!important
}
body.home-route .home-layered-brand{
  height:58px!important;margin:0 auto 10px!important;transform:rotate(1.15deg)!important
}
body.home-route .home-layered-brand img{
  height:55px!important;max-width:82%!important;
  filter:drop-shadow(0 2px 4px rgba(6,72,51,.06))
}
body.home-route .home-premium .home-layered-card .hero-top,
body.home-route .home-premium .home-layered-card .hero-meta,
body.home-route .home-premium .home-layered-card .home-prayer-source{
  transform:rotate(1.15deg)!important
}
body.home-route .home-premium .home-layered-card h2{
  font-size:28px!important;letter-spacing:-.038em!important;margin-top:7px!important
}
body.home-route .home-premium .home-layered-card .countdown{font-size:11.5px!important;margin-top:7px!important}
body.home-route .home-premium .home-layered-card .home-prayer-icon{
  right:6px!important;top:18px!important;width:46px!important;height:46px!important;border-radius:17px!important;
  background:linear-gradient(180deg,#effaf6,#e3f3ed)!important;
  box-shadow:0 8px 20px rgba(8,123,93,.10),inset 0 0 0 1px rgba(8,123,93,.06)!important
}
body.home-route .home-premium .home-layered-card .hero-meta{margin-top:15px!important;gap:9px!important}
body.home-route .home-premium .home-layered-card .pill{padding:6px 11px!important;font-size:9.8px!important}
body.home-route .home-premium .home-layered-card .home-prayer-source{margin-top:10px!important;font-size:8.6px!important}
body.home-route .home-quick-clean{position:relative;z-index:3;margin-top:-1px!important;padding-top:7px!important}
body.home-route .home-layered .quick .qicon{
  box-shadow:0 7px 16px rgba(10,74,57,.055),inset 0 0 0 1px rgba(8,112,81,.045)!important
}

[data-theme="dark"] body.home-route .home-layered-zone::after{background:var(--bg)!important}
[data-theme="dark"] body.home-route .home-layered-ornament-left{opacity:.42}
[data-theme="dark"] body.home-route .home-premium .home-prayer.home-layered-card{
  background:linear-gradient(180deg,#202c27,#1c2823)!important;
  box-shadow:0 24px 48px rgba(0,0,0,.34),0 6px 16px rgba(0,0,0,.18)!important
}

body.preview-phone.home-route .home-layered-zone{margin:0 -12px 10px!important;padding:15px 17px 46px!important;border-radius:0 0 32px 32px!important}
body.preview-phone.home-route .home-layered-decoration{top:27px!important;height:calc(100% - 69px)!important}
body.preview-phone.home-route .home-layered-decoration-a{left:20px!important;right:20px!important}
body.preview-phone.home-route .home-layered-decoration-b{left:26px!important;right:14px!important}
body.preview-phone.home-route .home-premium .home-prayer.home-layered-card{min-height:238px!important;padding:16px 16px 15px!important;border-radius:27px!important}
body.preview-phone.home-route .home-layered-brand{height:53px!important;margin-bottom:8px!important}
body.preview-phone.home-route .home-layered-brand img{height:51px!important;max-width:84%!important}
body.preview-phone.home-route .home-premium .home-layered-card h2{font-size:25px!important}
body.preview-phone.home-route .home-premium .home-layered-card .home-prayer-icon{right:2px!important;top:15px!important;width:41px!important;height:41px!important;border-radius:15px!important}
body.preview-phone.home-route .home-layered-sky{right:18px;top:10px;font-size:21px}
@media(max-width:560px){
  body.home-route .home-layered-zone{margin:0 -12px 10px!important;padding:15px 17px 46px!important;border-radius:0 0 32px 32px!important}
  body.home-route .home-layered-decoration{top:27px!important;height:calc(100% - 69px)!important}
  body.home-route .home-layered-decoration-a{left:20px!important;right:20px!important}
  body.home-route .home-layered-decoration-b{left:26px!important;right:14px!important}
  body.home-route .home-premium .home-prayer.home-layered-card{min-height:238px!important;padding:16px 16px 15px!important;border-radius:27px!important}
  body.home-route .home-layered-brand{height:53px!important;margin-bottom:8px!important}
  body.home-route .home-layered-brand img{height:51px!important;max-width:84%!important}
  body.home-route .home-premium .home-layered-card h2{font-size:25px!important}
  body.home-route .home-premium .home-layered-card .home-prayer-icon{right:2px!important;top:15px!important;width:41px!important;height:41px!important;border-radius:15px!important}
  body.home-route .home-layered-sky{right:18px;top:10px;font-size:21px}
}

/* ==============================================================
   NUHA Build 164 — Layered Card proportion + authentic wordmark
   Scope: home hero sizing/tilt only, plus compact header wordmark.
   ============================================================== */
.brand-copy{min-width:0}
.brand-wordmark{display:none;width:auto;height:16px;object-fit:contain;object-position:left center}

body.home-route .home-layered-zone{
  margin:0 -14px 8px!important;
  padding:12px 20px 32px!important;
  border-radius:0 0 30px 30px!important;
  background:
    radial-gradient(circle at 18px 18px,rgba(255,255,255,.06) 1.1px,transparent 1.7px) 0 0/22px 22px,
    radial-gradient(circle at 74% 10%,rgba(255,255,255,.03),transparent 26%),
    linear-gradient(145deg,#086a4d 0%,#08795a 54%,#07583f 100%)!important;
}
body.home-route .home-layered-zone::after{
  left:-10%!important;right:-10%!important;bottom:-22px!important;height:43px!important;
  border-radius:50% 50% 0 0 / 100% 100% 0 0!important;
}
body.home-route .home-layered-ornament-left{
  left:-42px!important;bottom:42px!important;width:132px!important;height:132px!important;opacity:.52!important
}
body.home-route .home-layered-sky{right:20px!important;top:9px!important;font-size:20px!important}

body.home-route .home-layered-decoration{
  top:21px!important;
  height:calc(100% - 55px)!important;
  border-radius:26px!important;
  box-shadow:0 10px 20px rgba(3,49,38,.07)!important;
}
body.home-route .home-layered-decoration-a{
  left:25px!important;right:27px!important;
  transform:translate(-6px,7px) rotate(-1.75deg)!important;
}
body.home-route .home-layered-decoration-b{
  left:31px!important;right:20px!important;
  transform:translate(9px,12px) rotate(1.65deg)!important;
}
body.home-route .home-premium .home-prayer.home-layered-card{
  min-height:205px!important;
  padding:13px 18px 12px!important;
  border-radius:27px!important;
  box-shadow:0 18px 38px rgba(2,46,35,.17),0 5px 12px rgba(2,46,35,.075)!important;
  transform:rotate(-.55deg)!important;
}
body.home-route .home-layered-brand{
  height:43px!important;margin:0 auto 5px!important;transform:rotate(.55deg)!important
}
body.home-route .home-layered-brand img{
  height:41px!important;max-width:74%!important
}
body.home-route .home-premium .home-layered-card .hero-top,
body.home-route .home-premium .home-layered-card .hero-meta,
body.home-route .home-premium .home-layered-card .home-prayer-source{
  transform:rotate(.55deg)!important
}
body.home-route .home-premium .home-layered-card h2{
  font-size:25px!important;letter-spacing:-.032em!important;margin-top:4px!important
}
body.home-route .home-premium .home-layered-card .countdown{font-size:10.8px!important;margin-top:5px!important}
body.home-route .home-premium .home-layered-card .home-prayer-icon{display:none!important}
body.home-route .home-premium .home-layered-card .hero-meta{margin-top:11px!important;gap:8px!important;justify-content:center!important}
body.home-route .home-premium .home-layered-card .pill{padding:5px 10px!important;font-size:9.4px!important}
body.home-route .home-premium .home-layered-card .home-prayer-source{display:none!important}
body.home-route .home-quick-clean{margin-top:0!important;padding-top:3px!important}

/* Saat scroll: pertahankan header compact, hanya ganti teks NUHA dengan wordmark master. */
body.preview-phone.home-route.home-scrolled .brand-copy>strong,
body.home-route.home-scrolled .brand-copy>strong{display:none!important}
body.preview-phone.home-route.home-scrolled .brand-wordmark,
body.home-route.home-scrolled .brand-wordmark{display:block!important;height:15px!important;max-width:72px!important}
body.preview-phone.home-route.home-scrolled .brand-copy>span,
body.home-route.home-scrolled .brand-copy>span{display:none!important}

body.preview-phone.home-route .home-layered-zone{
  margin:0 -12px 7px!important;padding:10px 17px 29px!important;border-radius:0 0 28px 28px!important
}
body.preview-phone.home-route .home-layered-decoration{top:19px!important;height:calc(100% - 50px)!important}
body.preview-phone.home-route .home-layered-decoration-a{left:20px!important;right:22px!important;transform:translate(-5px,6px) rotate(-1.65deg)!important}
body.preview-phone.home-route .home-layered-decoration-b{left:25px!important;right:15px!important;transform:translate(8px,10px) rotate(1.55deg)!important}
body.preview-phone.home-route .home-premium .home-prayer.home-layered-card{min-height:196px!important;padding:12px 15px 11px!important;border-radius:25px!important}
body.preview-phone.home-route .home-layered-brand{height:40px!important;margin-bottom:4px!important}
body.preview-phone.home-route .home-layered-brand img{height:39px!important;max-width:76%!important}
body.preview-phone.home-route .home-premium .home-layered-card h2{font-size:23px!important}

@media(max-width:560px){
  body.home-route .home-layered-zone{margin:0 -12px 7px!important;padding:10px 17px 29px!important;border-radius:0 0 28px 28px!important}
  body.home-route .home-layered-decoration{top:19px!important;height:calc(100% - 50px)!important}
  body.home-route .home-layered-decoration-a{left:20px!important;right:22px!important;transform:translate(-5px,6px) rotate(-1.65deg)!important}
  body.home-route .home-layered-decoration-b{left:25px!important;right:15px!important;transform:translate(8px,10px) rotate(1.55deg)!important}
  body.home-route .home-premium .home-prayer.home-layered-card{min-height:196px!important;padding:12px 15px 11px!important;border-radius:25px!important}
  body.home-route .home-layered-brand{height:40px!important;margin-bottom:4px!important}
  body.home-route .home-layered-brand img{height:39px!important;max-width:76%!important}
  body.home-route .home-premium .home-layered-card h2{font-size:23px!important}
  body.home-route.home-scrolled .brand-wordmark{height:15px!important;max-width:72px!important}
}

/* ==============================================================
   NUHA Build 165 — Layered Card aesthetic match
   Fokus: top state lebih dekat mockup pilihan, scroll header tetap.
   ============================================================== */
body.home-route .home-layered-zone{
  margin:0 -12px 10px!important;
  padding:18px 14px 31px!important;
  border-radius:0 0 30px 30px!important;
  overflow:hidden!important;
  background:
    radial-gradient(circle at 18px 18px,rgba(255,255,255,.055) 1.1px,transparent 1.65px) 0 0/22px 22px,
    radial-gradient(circle at 74% 13%,rgba(255,255,255,.04),transparent 25%),
    linear-gradient(145deg,#075f46 0%,#087453 56%,#064c39 100%)!important;
}
body.home-route .home-layered-zone::before{
  left:-64px!important;top:-52px!important;width:205px!important;height:205px!important;
  opacity:.78!important;border-color:rgba(214,178,82,.20)!important;
  background:repeating-radial-gradient(circle at 50% 50%,transparent 0 15px,rgba(214,178,82,.055) 16px 17px,transparent 18px 30px)!important;
}
body.home-route .home-layered-zone::after{
  left:-7%!important;right:-7%!important;bottom:-1px!important;height:27px!important;
  border-radius:50% 50% 0 0 / 100% 100% 0 0!important;
  background:var(--bg)!important;
}
body.home-route .home-layered-ornament-left{
  left:-44px!important;bottom:22px!important;width:118px!important;height:118px!important;opacity:.40!important;
}
body.home-route .home-layered-sky{
  display:grid!important;right:18px!important;top:14px!important;width:34px!important;height:34px!important;
  font-size:20px!important;color:#f2d075!important;opacity:.95!important;
}
body.home-route .home-layered-decoration{
  top:32px!important;height:197px!important;border-radius:27px!important;
  box-shadow:0 12px 24px rgba(2,42,32,.08)!important;
}
body.home-route .home-layered-decoration-a{
  left:8.4%!important;right:8.4%!important;
  transform:translate(-7px,9px) rotate(-2.15deg)!important;
  background:linear-gradient(145deg,rgba(221,244,236,.90),rgba(132,196,174,.72))!important;
}
body.home-route .home-layered-decoration-b{
  left:8.4%!important;right:8.4%!important;
  transform:translate(10px,13px) rotate(1.85deg)!important;
  background:linear-gradient(145deg,rgba(255,246,218,.96),rgba(231,199,126,.82))!important;
}
body.home-route .home-premium .home-prayer.home-layered-card{
  width:84%!important;max-width:none!important;min-height:198px!important;
  margin:13px auto 0!important;padding:13px 17px 12px!important;
  border-radius:27px!important;
  transform:rotate(-1.05deg)!important;
  box-shadow:0 22px 40px rgba(1,38,29,.19),0 5px 13px rgba(1,38,29,.07)!important;
}
body.home-route .home-layered-brand,
body.home-route .home-premium .home-layered-card .hero-top,
body.home-route .home-premium .home-layered-card .hero-meta,
body.home-route .home-premium .home-layered-card .home-prayer-source{
  transform:rotate(1.05deg)!important;
}
body.home-route .home-layered-brand{height:43px!important;margin:0 auto 5px!important}
body.home-route .home-layered-brand img{height:42px!important;max-width:79%!important}
body.home-route .home-premium .home-layered-card h2{font-size:24px!important;line-height:1.08!important;margin-top:4px!important}
body.home-route .home-premium .home-layered-card .countdown{font-size:10.8px!important;margin-top:5px!important}
body.home-route .home-premium .home-layered-card .hero-meta{margin-top:11px!important;gap:8px!important}
body.home-route .home-premium .home-layered-card .pill{padding:5px 10px!important;font-size:9.3px!important}
body.home-route .home-quick-clean{margin-top:7px!important;padding-top:6px!important}

body.preview-phone.home-route .home-layered-zone{
  margin:0 -12px 9px!important;padding:16px 13px 29px!important;border-radius:0 0 28px 28px!important
}
body.preview-phone.home-route .home-layered-decoration{top:29px!important;height:190px!important}
body.preview-phone.home-route .home-layered-decoration-a{left:8.3%!important;right:8.3%!important;transform:translate(-6px,8px) rotate(-2.05deg)!important}
body.preview-phone.home-route .home-layered-decoration-b{left:8.3%!important;right:8.3%!important;transform:translate(9px,12px) rotate(1.75deg)!important}
body.preview-phone.home-route .home-premium .home-prayer.home-layered-card{width:84%!important;min-height:191px!important;margin:12px auto 0!important;padding:12px 15px 11px!important;border-radius:25px!important}
body.preview-phone.home-route .home-layered-brand{height:40px!important;margin-bottom:4px!important}
body.preview-phone.home-route .home-layered-brand img{height:39px!important;max-width:80%!important}
body.preview-phone.home-route .home-premium .home-layered-card h2{font-size:23px!important}

@media(max-width:560px){
  body.home-route .home-layered-zone{margin:0 -12px 9px!important;padding:16px 13px 29px!important;border-radius:0 0 28px 28px!important}
  body.home-route .home-layered-decoration{top:29px!important;height:190px!important}
  body.home-route .home-layered-decoration-a{left:8.3%!important;right:8.3%!important;transform:translate(-6px,8px) rotate(-2.05deg)!important}
  body.home-route .home-layered-decoration-b{left:8.3%!important;right:8.3%!important;transform:translate(9px,12px) rotate(1.75deg)!important}
  body.home-route .home-premium .home-prayer.home-layered-card{width:84%!important;min-height:191px!important;margin:12px auto 0!important;padding:12px 15px 11px!important;border-radius:25px!important}
  body.home-route .home-layered-brand{height:40px!important;margin-bottom:4px!important}
  body.home-route .home-layered-brand img{height:39px!important;max-width:80%!important}
  body.home-route .home-premium .home-layered-card h2{font-size:23px!important}
}

/* ==============================================================
   NUHA Build 167 — Home finishing baseline + stability audit
   Finishing only: proportions, layered-card tilt, wave, spacing.
   Scroll/sticky header behavior remains unchanged from Build 165.
   ============================================================== */
body.home-route .home-layered-zone{
  margin:0 -12px 9px!important;
  padding:16px 13px 27px!important;
  border-radius:0 0 29px 29px!important;
}
body.home-route .home-layered-zone::after{
  left:-6%!important;right:-6%!important;bottom:-1px!important;height:22px!important;
  border-radius:50% 50% 0 0 / 100% 100% 0 0!important;
}
body.home-route .home-layered-decoration{
  top:29px!important;height:186px!important;border-radius:26px!important;
  box-shadow:0 10px 22px rgba(2,42,32,.07)!important;
}
body.home-route .home-layered-decoration-a{
  left:8.8%!important;right:8.8%!important;
  transform:translate(-7px,8px) rotate(-1.85deg)!important;
}
body.home-route .home-layered-decoration-b{
  left:8.8%!important;right:8.8%!important;
  transform:translate(9px,11px) rotate(1.38deg)!important;
}
body.home-route .home-premium .home-prayer.home-layered-card{
  width:82.5%!important;min-height:187px!important;
  margin:12px auto 0!important;padding:11px 15px 10px!important;
  border-radius:26px!important;
  transform:rotate(-.68deg)!important;
  box-shadow:0 19px 34px rgba(1,38,29,.17),0 4px 11px rgba(1,38,29,.06)!important;
}
body.home-route .home-layered-brand,
body.home-route .home-premium .home-layered-card .hero-top,
body.home-route .home-premium .home-layered-card .hero-meta,
body.home-route .home-premium .home-layered-card .home-prayer-source{
  transform:rotate(.68deg)!important;
}
body.home-route .home-layered-brand{height:40px!important;margin:0 auto 4px!important}
body.home-route .home-layered-brand img{height:39px!important;max-width:78%!important}
body.home-route .home-premium .home-layered-card .hero-top>div>small:first-child{margin-bottom:1px!important}
body.home-route .home-premium .home-layered-card h2{font-size:23px!important;margin-top:3px!important}
body.home-route .home-premium .home-layered-card .countdown{font-size:10.5px!important;margin-top:4px!important}
body.home-route .home-premium .home-layered-card .hero-meta{margin-top:10px!important;gap:8px!important}
body.home-route .home-premium .home-layered-card .pill{padding:5px 10px!important;font-size:9.2px!important}
body.home-route .home-quick-clean{margin-top:8px!important;padding-top:5px!important}

body.preview-phone.home-route .home-layered-zone{
  margin:0 -12px 8px!important;padding:15px 13px 26px!important;border-radius:0 0 28px 28px!important
}
body.preview-phone.home-route .home-layered-decoration{top:28px!important;height:183px!important}
body.preview-phone.home-route .home-layered-decoration-a{left:8.7%!important;right:8.7%!important;transform:translate(-6px,7px) rotate(-1.8deg)!important}
body.preview-phone.home-route .home-layered-decoration-b{left:8.7%!important;right:8.7%!important;transform:translate(8px,10px) rotate(1.35deg)!important}
body.preview-phone.home-route .home-premium .home-prayer.home-layered-card{width:82.5%!important;min-height:185px!important;margin:11px auto 0!important;padding:11px 14px 10px!important;border-radius:25px!important}
body.preview-phone.home-route .home-layered-brand{height:39px!important;margin-bottom:4px!important}
body.preview-phone.home-route .home-layered-brand img{height:38px!important;max-width:79%!important}
body.preview-phone.home-route .home-premium .home-layered-card h2{font-size:22.5px!important}

@media(max-width:560px){
  body.home-route .home-layered-zone{margin:0 -12px 8px!important;padding:15px 13px 26px!important;border-radius:0 0 28px 28px!important}
  body.home-route .home-layered-decoration{top:28px!important;height:183px!important}
  body.home-route .home-layered-decoration-a{left:8.7%!important;right:8.7%!important;transform:translate(-6px,7px) rotate(-1.8deg)!important}
  body.home-route .home-layered-decoration-b{left:8.7%!important;right:8.7%!important;transform:translate(8px,10px) rotate(1.35deg)!important}
  body.home-route .home-premium .home-prayer.home-layered-card{width:82.5%!important;min-height:185px!important;margin:11px auto 0!important;padding:11px 14px 10px!important;border-radius:25px!important}
  body.home-route .home-layered-brand{height:39px!important;margin-bottom:4px!important}
  body.home-route .home-layered-brand img{height:38px!important;max-width:79%!important}
  body.home-route .home-premium .home-layered-card h2{font-size:22.5px!important}
}

/* Build 170 — recovery panel for failed routes */
.nuha-error-recovery{max-width:680px;margin:20px auto;padding:18px;border-radius:20px}
.nuha-error-recovery b{display:block;margin-bottom:6px}
.nuha-error-recovery p{margin:0;color:var(--muted);line-height:1.5}
.nuha-error-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.nuha-error-actions .small-btn{border:0;cursor:pointer}

/* Build 171 — performance/PWA/online-readiness audit; no visual changes. */

/* ==========================================================
   Build 173 — Smart Home + Global Search Premium
   ========================================================== */
body.home-route .home-search-cluster{position:relative;z-index:24;margin-top:9px}
body.home-route .home-search-cluster .home-search{margin-top:0!important}
body.home-route .home-search-assist{position:absolute;left:0;right:0;top:calc(100% + 7px);z-index:30;padding:10px;border:1px solid rgba(13,107,85,.16);border-radius:18px;background:rgba(255,255,255,.98);box-shadow:0 18px 42px rgba(19,55,44,.16);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
body.home-route .home-search-assist-title{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:1px 3px 8px;color:#496159;font-size:10px;font-weight:800;letter-spacing:.025em}
body.home-route .home-search-assist-title i{color:#c18c28}
body.home-route .home-search-assist-title small{font-size:9px;font-weight:600;color:#89958f}
body.home-route .home-search-quick-results{display:grid;gap:5px}
body.home-route .home-search-assist .global-search-result{min-height:48px;padding:6px 8px;border:0;background:transparent;box-shadow:none;border-radius:12px}
body.home-route .home-search-assist .global-search-result:hover,body.home-route .home-search-assist .global-search-result:focus-visible{background:#eef8f4}
body.home-route .home-search-assist .global-search-result-icon{width:34px;height:34px;border-radius:11px;font-size:14px}
body.home-route .home-search-assist .global-search-result-copy b{font-size:11.5px}
body.home-route .home-search-assist .global-search-result-copy small{font-size:9.5px}
body.home-route .home-search-openall{width:100%;min-height:46px;display:grid;grid-template-columns:28px minmax(0,1fr) 22px;align-items:center;gap:8px;border:0;background:transparent;color:var(--text);text-align:left;border-radius:12px;padding:6px 8px;font:inherit}
body.home-route .home-search-openall>i:first-child{color:var(--green);font-size:16px}
body.home-route .home-search-openall>i:last-child{color:var(--muted)}
body.home-route .home-search-openall span{font-size:11px;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.global-search-chips{display:flex;flex-wrap:wrap;gap:7px}
.global-search-chip{display:inline-flex;align-items:center;gap:6px;min-height:32px;padding:6px 10px;border:1px solid color-mix(in srgb,var(--green) 17%,var(--line));border-radius:999px;background:color-mix(in srgb,var(--green-soft) 50%,var(--card));color:var(--text);font:inherit;font-size:10.5px;font-weight:700;cursor:pointer}
.global-search-chip i{color:var(--green);font-size:11px}.global-search-chip.recent{background:var(--card);color:var(--muted)}
.global-search-chip:hover,.global-search-chip:focus-visible{border-color:color-mix(in srgb,var(--green) 48%,var(--line));transform:translateY(-1px)}
.global-search-discover{min-height:245px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:24px 18px;border:1px solid var(--line);border-radius:22px;background:linear-gradient(155deg,color-mix(in srgb,var(--green-soft) 42%,var(--card)),var(--card) 56%);color:var(--muted)}
.global-search-discover-icon{width:52px;height:52px;display:grid;place-items:center;margin-bottom:10px;border-radius:18px;background:color-mix(in srgb,var(--green-soft) 75%,var(--card));color:var(--green);font-size:22px;box-shadow:0 8px 24px rgba(13,107,85,.10)}
.global-search-discover>b{font-size:16px;color:var(--text)}.global-search-discover>span{max-width:520px;margin-top:5px;font-size:11.5px;line-height:1.55}
.global-search-discover-block{width:100%;max-width:610px;margin-top:18px;text-align:left}.global-search-discover-block>small{display:block;margin:0 2px 7px;font-size:9.5px;font-weight:800;letter-spacing:.05em;color:var(--muted);text-transform:uppercase}
body.home-route .home-smart-context{--smart-accent:#0b8062;--smart-soft:#eaf7f2;--smart-glow:rgba(13,128,98,.13);position:relative;overflow:hidden;display:grid;grid-template-columns:44px minmax(0,1fr);gap:11px;margin-top:12px;padding:14px;border:1px solid color-mix(in srgb,var(--smart-accent) 18%,var(--line));border-radius:21px;background:linear-gradient(145deg,color-mix(in srgb,var(--smart-soft) 68%,var(--card)),var(--card) 68%);box-shadow:0 12px 30px var(--smart-glow)}
body.home-route .home-smart-context::before{content:"";position:absolute;width:130px;height:130px;border-radius:50%;right:-48px;top:-72px;background:color-mix(in srgb,var(--smart-accent) 10%,transparent);pointer-events:none}
body.home-route .home-smart-context::after{content:"";position:absolute;width:80px;height:80px;border:1px solid color-mix(in srgb,var(--smart-accent) 15%,transparent);border-radius:50%;right:-30px;top:-26px;pointer-events:none}
body.home-route .home-smart-icon{position:relative;z-index:1;width:44px;height:44px;display:grid;place-items:center;border-radius:15px;background:var(--smart-soft);color:var(--smart-accent);font-size:19px;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--smart-accent) 11%,transparent)}
body.home-route .home-smart-copy{position:relative;z-index:1;min-width:0}.home-smart-kicker{display:flex;align-items:center;gap:5px;color:var(--smart-accent);font-size:8.5px;font-weight:900;letter-spacing:.075em}
body.home-route .home-smart-copy h3{margin:3px 0 2px;font-size:13.5px;line-height:1.25;color:var(--text)}
body.home-route .home-smart-copy p{margin:0;color:var(--muted);font-size:10.2px;line-height:1.48}.home-smart-meta{display:block;margin-top:5px;color:color-mix(in srgb,var(--smart-accent) 78%,var(--muted));font-size:9px;font-weight:700}
body.home-route .home-smart-actions{position:relative;z-index:1;grid-column:1/-1;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:7px;margin-top:2px}
body.home-route .home-smart-actions button{min-width:0;min-height:37px;border-radius:12px;font:inherit;cursor:pointer}
body.home-route .home-smart-primary{display:flex;align-items:center;justify-content:center;gap:7px;border:0;background:var(--smart-accent);color:#fff;padding:7px 10px;font-size:9.8px;font-weight:800;box-shadow:0 7px 18px color-mix(in srgb,var(--smart-accent) 22%,transparent)}
body.home-route .home-smart-secondary{display:flex;align-items:center;justify-content:space-between;gap:7px;border:1px solid color-mix(in srgb,var(--smart-accent) 17%,var(--line));background:color-mix(in srgb,var(--card) 90%,var(--smart-soft));color:var(--text);padding:7px 10px;font-size:9.6px;font-weight:750}.home-smart-secondary i{color:var(--smart-accent)}
body.home-route .smart-tone-friday{--smart-accent:#b47b16;--smart-soft:#fff3d9;--smart-glow:rgba(180,123,22,.12)}body.home-route .smart-tone-prayer{--smart-accent:#08765f;--smart-soft:#e1f5ee;--smart-glow:rgba(8,118,95,.15)}body.home-route .smart-tone-morning{--smart-accent:#0c7a78;--smart-soft:#e5f7f6;--smart-glow:rgba(12,122,120,.11)}body.home-route .smart-tone-night{--smart-accent:#657446;--smart-soft:#f0f4e7;--smart-glow:rgba(101,116,70,.11)}
[data-theme="dark"] body.home-route .home-search-assist{background:rgba(27,38,34,.98);border-color:#334a41;box-shadow:0 18px 42px rgba(0,0,0,.34)}[data-theme="dark"] body.home-route .home-search-assist .global-search-result:hover,[data-theme="dark"] body.home-route .home-search-assist .global-search-result:focus-visible{background:#243b33}
[data-theme="dark"] body.home-route .home-smart-context{background:linear-gradient(145deg,color-mix(in srgb,var(--smart-accent) 10%,#202c28),#202b27 72%);border-color:color-mix(in srgb,var(--smart-accent) 28%,#34463f);box-shadow:none}[data-theme="dark"] body.home-route .home-smart-icon{background:color-mix(in srgb,var(--smart-accent) 17%,#26332e)}[data-theme="dark"] body.home-route .home-smart-secondary{background:#26332e;border-color:#3b4c45}[data-theme="dark"] .global-search-discover{background:linear-gradient(155deg,#22342e,#202b27 62%)}
@media(max-width:560px){body.home-route .home-search-assist{border-radius:16px;padding:8px}body.home-route .home-smart-context{margin-top:11px;padding:12px;border-radius:19px;grid-template-columns:40px minmax(0,1fr);gap:10px}body.home-route .home-smart-icon{width:40px;height:40px;border-radius:13px;font-size:17px}body.home-route .home-smart-copy h3{font-size:12.5px}body.home-route .home-smart-copy p{font-size:9.6px}body.home-route .home-smart-actions{gap:6px}body.home-route .home-smart-actions button{min-height:35px;padding:6px 8px;font-size:9px}.global-search-chip{min-height:30px;padding:5px 9px;font-size:9.8px}.global-search-discover{min-height:220px;padding:20px 14px;border-radius:19px}}


/* =========================================================
   NUHA v1.74 — Mode Baca Premium
   Berlaku pada Amaliyah Reader + Yasin/Tahlil/Doa.
   ========================================================= */
.reader-premium-surface{
  transition:background .18s ease,color .18s ease,border-color .18s ease,box-shadow .18s ease;
}
body[data-reader-paper="paper"] .reader-premium-surface{
  --card:#ffffff;--bg:#f7faf8;--text:#202724;--muted:#65716c;--line:#e2e9e5;
  --green-soft:#eaf6f1;--green-soft-2:#dff1e9;
  background:#fff!important;color:#202724!important;border-color:#e2e9e5!important;
  box-shadow:0 12px 34px rgba(25,60,50,.07)!important;
}
body[data-reader-paper="cream"] .reader-premium-surface{
  --card:#fffaf0;--bg:#f8f0df;--text:#2c2a25;--muted:#746d61;--line:#eadfc9;
  --green-soft:#edf5eb;--green-soft-2:#e3efe0;
  background:#fffaf0!important;color:#2c2a25!important;border-color:#eadfc9!important;
  box-shadow:0 12px 34px rgba(91,71,35,.08)!important;
}
body[data-reader-paper="night"] .reader-premium-surface{
  --card:#151d1a;--bg:#101613;--text:#edf5f1;--muted:#aab7b1;--line:#2b3934;
  --green-soft:#18342b;--green-soft-2:#1e4035;
  background:#151d1a!important;color:#edf5f1!important;border-color:#2b3934!important;
  box-shadow:none!important;
}
body[data-reader-spacing="compact"].amaliyah-reader-route .reader-premium-surface .arabic,
body[data-reader-spacing="compact"].yasin-tahlil-route .reader-premium-surface .arabic{line-height:1.70!important}
body[data-reader-spacing="relaxed"].amaliyah-reader-route .reader-premium-surface .arabic,
body[data-reader-spacing="relaxed"].yasin-tahlil-route .reader-premium-surface .arabic{line-height:2.16!important}
body.amaliyah-reader-route .reader-toolbar-title{min-width:0;flex:1}
body.amaliyah-reader-route .reader-toolbar-title>b{
  display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;
}
.reader-settings-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:14px}
.reader-settings-head h3{margin:0 0 3px!important}
.reader-settings-head p{margin:0;color:var(--muted);font-size:11px;line-height:1.45}
.reader-settings-head>span{width:42px;height:42px;border-radius:14px;background:var(--green-soft);color:var(--green);display:grid;place-items:center;flex:none;font-size:18px}
.reader-resume-saved{
  width:100%;display:grid;grid-template-columns:40px minmax(0,1fr) 18px;align-items:center;gap:10px;
  border:1px solid color-mix(in srgb,var(--green) 28%,var(--line));background:var(--green-soft);color:var(--text);
  border-radius:17px;padding:12px 13px;text-align:left;cursor:pointer;
}
.reader-resume-saved>span{width:40px;height:40px;border-radius:13px;background:var(--card);color:var(--green);display:grid;place-items:center;font-size:17px}
.reader-resume-saved b{display:block;font-size:12px;color:var(--green)}
.reader-resume-saved small{display:block;color:var(--muted);font-size:9px;line-height:1.4;margin-top:2px}
.reader-resume-saved>i{color:var(--green)}
.reader-settings-note{display:flex;gap:9px;align-items:flex-start;padding:11px 12px;border-radius:15px;background:var(--green-soft);color:var(--muted);font-size:10px;line-height:1.5}
.reader-settings-note i{color:var(--green);font-size:14px;margin-top:1px}
.yt-reader-tools{justify-content:space-between!important}
.yt-reading-hint{display:flex;align-items:center;gap:6px;color:var(--muted);font-size:10px;font-weight:800}
.yt-reading-hint i{color:var(--green)}
.yt-reader-actions{display:flex;align-items:center;gap:6px}

/* Mode fokus: navigasi aplikasi menghilang, kontrol reader tetap tersedia untuk keluar. */
body.reader-focus-mode .topbar,
body.reader-focus-mode .bottom-nav,
body.reader-focus-mode .device-preview-tools{display:none!important}
body.reader-focus-mode .view{padding-top:10px;padding-bottom:20px}
body.reader-focus-mode.amaliyah-reader-route .amaliyah-sticky-head{top:0!important}
body.reader-focus-mode.yasin-tahlil-route .yt-tabbar{top:0!important}
body.reader-focus-mode .reader-premium-surface{max-width:820px}
body.preview-phone.reader-focus-mode .view{padding-top:0!important;padding-bottom:18px!important}
body.preview-phone.reader-focus-mode.amaliyah-reader-route .amaliyah-sticky-head{top:0!important}

@media(max-width:420px){
  body.amaliyah-reader-route .amaliyah-sticky-head .reader-toolbar .small-btn{padding:7px 9px}
  .reader-settings-head>span{width:38px;height:38px;border-radius:12px}
}


/* =========================================================
   NUHA v1.75 — Share Card Premium
   Gambar 1080×1350 untuk Ayat, Amaliyah, Yasin/Tahlil/Doa,
   dan kutipan Bahtsul Masail. Tidak mengubah isi sumber.
   ========================================================= */
.share-card-sheet{padding-bottom:max(4px,env(safe-area-inset-bottom))}
.share-card-sheet-head{display:grid;grid-template-columns:minmax(0,1fr) 42px;gap:12px;align-items:start;margin-bottom:12px}
.share-card-sheet-head>div>span{display:block;color:var(--green);font-size:8.5px;font-weight:900;letter-spacing:.09em;margin-bottom:3px}
.share-card-sheet-head h3{margin:0!important;font-size:17px}.share-card-sheet-head p{margin:4px 0 0;color:var(--muted);font-size:10px;line-height:1.45}
.share-card-sheet-head>i{width:42px;height:42px;display:grid;place-items:center;border-radius:14px;background:var(--green-soft);color:var(--green);font-size:18px}
.share-card-preview{position:relative;display:grid;place-items:center;min-height:246px;max-height:min(46vh,430px);overflow:hidden;border:1px solid var(--line);border-radius:22px;background:linear-gradient(145deg,var(--green-soft),var(--card));padding:10px}
.share-card-preview img{display:block;max-width:100%;max-height:min(43vh,405px);width:auto;height:auto;border-radius:15px;box-shadow:0 14px 36px rgba(24,50,42,.16)}
.share-card-loading{display:grid;place-items:center;gap:8px;color:var(--muted);font-size:10px;min-height:220px}
.share-card-theme-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin-top:10px}
.share-card-theme{min-width:0;display:flex;align-items:center;justify-content:center;gap:6px;min-height:36px;padding:7px;border:1px solid var(--line);border-radius:12px;background:var(--card);color:var(--muted);font:700 9px Nunito,sans-serif;cursor:pointer}
.share-card-theme i{width:11px;height:11px;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(0,0,0,.08)}
.share-card-theme[data-share-theme="emerald"] i{background:#0b5f4d}.share-card-theme[data-share-theme="ivory"] i{background:#efe9dc}.share-card-theme[data-share-theme="night"] i{background:#17362d}
.share-card-theme.active{border-color:color-mix(in srgb,var(--green) 42%,var(--line));background:var(--green-soft);color:var(--green)}
.share-card-actions{display:grid;grid-template-columns:minmax(0,1.25fr) repeat(2,minmax(0,.75fr));gap:7px;margin-top:10px}
.share-card-actions button{min-width:0;min-height:39px;border-radius:12px;font:inherit;cursor:pointer}
.share-card-primary{display:flex;align-items:center;justify-content:center;gap:7px;border:0;background:var(--green);color:#fff;font-size:10px;font-weight:850;box-shadow:0 8px 20px rgba(13,107,85,.18)}
.share-card-actions .small-btn{justify-content:center;padding:8px;font-size:9.5px}
.share-card-note{display:flex;gap:8px;align-items:flex-start;margin-top:9px;padding:9px 10px;border-radius:13px;background:var(--green-soft);color:var(--muted);font-size:9px;line-height:1.45}
.share-card-note i{color:var(--green);margin-top:1px}
.bahtsul-detail-meta-row{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-top:8px}
.bahtsul-detail-meta-row .bahtsul-detail-date{margin:0}
.bahtsul-share-card{display:inline-flex;align-items:center;gap:6px;border:1px solid color-mix(in srgb,var(--green) 28%,var(--line));background:var(--green-soft);color:var(--green);border-radius:11px;padding:7px 10px;font:800 9.5px Nunito,sans-serif;cursor:pointer}
.ayah-detail-actions{flex-wrap:wrap}.ayah-detail-actions .small-btn{flex:1 1 auto;justify-content:center}
[data-theme="dark"] .share-card-preview{background:linear-gradient(145deg,#263b33,#1f2c27);border-color:#354a42}
@media(max-width:420px){
  .share-card-preview{min-height:220px;max-height:42vh;border-radius:18px}.share-card-preview img{max-height:39vh;border-radius:13px}
  .share-card-theme-row{gap:5px}.share-card-theme{font-size:8.5px;padding:6px 4px}.share-card-actions{grid-template-columns:1fr 1fr}.share-card-primary{grid-column:1/-1}.share-card-actions button{min-height:38px}
  body.amaliyah-reader-route .amaliyah-sticky-head .reader-toolbar .group{gap:4px}
  body.amaliyah-reader-route .amaliyah-sticky-head .reader-toolbar .small-btn{padding:7px 8px}
}

/* =========================================================
   BUILD 176 — OFFLINE CENTER
   ========================================================= */
.offline-hero{display:flex;gap:16px;align-items:flex-start;padding:20px;border:1px solid rgba(13,107,85,.12);background:linear-gradient(145deg,rgba(231,247,241,.96),rgba(255,255,255,.96));overflow:hidden;position:relative}
.offline-hero::after{content:"";position:absolute;width:150px;height:150px;border-radius:50%;right:-64px;top:-70px;background:radial-gradient(circle,rgba(13,107,85,.12),transparent 67%);pointer-events:none}
.offline-hero-icon{width:52px;height:52px;border-radius:17px;display:grid;place-items:center;flex:0 0 auto;background:var(--green);color:#fff;font-size:24px;box-shadow:0 10px 24px rgba(13,107,85,.18)}
.offline-hero span{font-size:11px;letter-spacing:.12em;font-weight:800;color:var(--green)}
.offline-hero h1{font-size:22px;line-height:1.15;margin:3px 0 7px;color:var(--text)}
.offline-hero p{margin:0;color:var(--muted);font-size:13px;line-height:1.5}
.offline-summary-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin:14px 0}
.offline-summary-card{min-width:0;padding:13px 8px;border:1px solid var(--border);border-radius:18px;background:var(--surface);text-align:center;box-shadow:0 7px 18px rgba(32,66,56,.045)}
.offline-summary-card i{display:block;font-size:20px;color:var(--green);margin-bottom:5px}
.offline-summary-card b{display:block;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--text)}
.offline-summary-card small{display:block;margin-top:2px;font-size:10.5px;color:var(--muted)}
.offline-storage{padding:15px;margin-bottom:14px}
.offline-storage>div:first-child{display:flex;flex-direction:column;gap:3px}
.offline-storage b{font-size:13px}.offline-storage small{font-size:11px;color:var(--muted)}
.offline-storage .offline-progress{margin:10px 0}
.offline-section-head{margin-top:17px;margin-bottom:9px}.offline-section-head h3{margin-bottom:2px}.offline-section-head p{margin:0;font-size:11px;color:var(--muted)}
.offline-pack{border:1px solid var(--border);border-radius:22px;background:var(--surface);padding:15px;margin-bottom:11px;box-shadow:0 9px 24px rgba(32,66,56,.05);position:relative;overflow:hidden}
.offline-pack::before{content:"";position:absolute;inset:0 auto 0 0;width:4px;background:rgba(13,107,85,.58)}
.offline-pack.cream::before{background:#c99536}.offline-pack.blue::before{background:#368b95}
.offline-pack-top{display:flex;align-items:flex-start;gap:11px;min-width:0}
.offline-pack-icon{width:42px;height:42px;border-radius:14px;display:grid;place-items:center;flex:0 0 auto;background:rgba(13,107,85,.09);color:var(--green);font-size:19px}
.offline-pack.cream .offline-pack-icon{background:rgba(201,149,54,.12);color:#a66d11}.offline-pack.blue .offline-pack-icon{background:rgba(54,139,149,.11);color:#137881}
.offline-pack-copy{min-width:0;flex:1}.offline-pack h3{margin:0 0 4px;font-size:14px;line-height:1.25}.offline-pack p{margin:0;color:var(--muted);font-size:11px;line-height:1.45}
.offline-status{flex:0 0 auto;max-width:95px;font-size:10px;font-weight:800;padding:5px 8px;border-radius:999px;background:var(--soft);color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.offline-status.ready{background:rgba(13,107,85,.1);color:var(--green)}.offline-status.partial,.offline-status.warning{background:rgba(201,149,54,.13);color:#9a6510}
.offline-progress{height:6px;background:rgba(119,143,135,.14);border-radius:99px;overflow:hidden;margin:12px 0 10px}
.offline-progress span{display:block;height:100%;width:0;border-radius:inherit;background:linear-gradient(90deg,var(--green),#42aa8d);transition:width .25s ease}
.offline-pack.cream .offline-progress span{background:linear-gradient(90deg,#b7791f,#e3b45d)}
.offline-pack.blue .offline-progress span{background:linear-gradient(90deg,#187e87,#62b8bd)}
.offline-pack-actions{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:34px}
.offline-pack-note{font-size:11px;line-height:1.3;color:var(--muted);min-width:0}
.offline-action-group{display:flex;gap:6px;align-items:center;flex:0 0 auto}.offline-pack-actions .small-btn{min-height:34px;white-space:nowrap}.offline-pack-actions .small-btn.primary{background:var(--green);color:#fff;border-color:var(--green)}
.offline-dynamic{display:flex;gap:12px;align-items:flex-start;padding:15px;margin-top:14px}.offline-dynamic-icon{width:39px;height:39px;border-radius:13px;display:grid;place-items:center;background:var(--soft);color:var(--green);flex:0 0 auto}.offline-dynamic b{font-size:13px}.offline-dynamic p{font-size:11px;line-height:1.48;color:var(--muted);margin:3px 0}.offline-dynamic small{font-size:11px;color:var(--green)}
.offline-note{margin-top:11px;margin-bottom:18px}
body.dark .offline-hero{background:linear-gradient(145deg,rgba(18,71,59,.82),rgba(25,36,33,.96))}
body.dark .offline-pack,body.dark .offline-summary-card{box-shadow:none}

@media(max-width:390px){
  .offline-hero{padding:16px;gap:12px}.offline-hero-icon{width:46px;height:46px;border-radius:15px;font-size:21px}.offline-hero h1{font-size:19px}
  .offline-summary-grid{gap:7px}.offline-summary-card{padding:11px 5px}.offline-summary-card b{font-size:11.5px}.offline-summary-card small{font-size:10px}
  .offline-pack{padding:13px}.offline-pack-top{gap:9px}.offline-pack-icon{width:38px;height:38px;border-radius:12px}.offline-status{max-width:82px;padding:4px 6px}
  .offline-pack-actions{align-items:flex-end}.offline-pack-note{font-size:10.5px}.offline-pack-actions .small-btn{padding-left:9px;padding-right:9px;font-size:10px}
}


/* ============================================================
   BUILD 177 — MICROINTERACTION & ANIMASI PREMIUM HALUS
   Gerakan sengaja singkat dan ringan. Sistem Reduce Motion
   selalu dihormati agar NUHA tetap nyaman dan hemat resource.
   ============================================================ */
:root{
  --motion-fast:150ms;
  --motion-base:240ms;
  --motion-slow:340ms;
  --motion-ease:cubic-bezier(.2,.78,.24,1);
}

/* Feedback sentuhan: terasa seperti aplikasi native, tanpa ripple ramai. */
.quick,.list-item,.news-card,.card[data-go],.small-btn,.icon-btn,.tab,.link-btn,
.category-card,.other-item,.tafsir-option,.agenda-card,.calendar-today-btn,
.smart-home-action,.offline-action,.share-card-style,.reader-resume-saved{
  transition:transform var(--motion-fast) var(--motion-ease),
             box-shadow var(--motion-base) var(--motion-ease),
             border-color var(--motion-base) ease,
             background-color var(--motion-base) ease,
             color var(--motion-base) ease;
  transform:translateZ(0);
}
@media (hover:hover) and (pointer:fine){
  .quick:hover,.list-item:hover,.news-card:hover,.card[data-go]:hover,.category-card:hover,.other-item:hover{
    transform:translateY(-2px);
    box-shadow:0 12px 28px rgba(12,57,46,.09);
  }
}
.quick:active,.list-item:active,.news-card:active,.card[data-go]:active,.small-btn:active,.icon-btn:active,
.tab:active,.link-btn:active,.category-card:active,.other-item:active,.tafsir-option:active,
.agenda-card:active,.calendar-today-btn:active,.smart-home-action:active,.offline-action:active,
.share-card-style:active,.reader-resume-saved:active{
  transform:scale(.975);
}

/* Route entrance sangat pendek: cukup memberi rasa perpindahan halaman. */
.route-enter{animation:nuhaRouteEnter 300ms var(--motion-ease) both}
@keyframes nuhaRouteEnter{
  from{opacity:.2;transform:translate3d(0,8px,0)}
  to{opacity:1;transform:translate3d(0,0,0)}
}

/* Skeleton generik untuk request/route yang memang perlu menunggu. */
.premium-route-loader{display:grid;gap:12px;padding:4px 0 8px}
.premium-route-loader>span{
  display:block;height:92px;border:1px solid var(--line);border-radius:20px;
  background:linear-gradient(100deg,var(--card) 18%,var(--green-soft) 38%,var(--card) 58%);
  background-size:220% 100%;animation:nuhaSkeleton 1.15s linear infinite;
}
.premium-route-loader>span:first-child{height:42px;width:62%;border-radius:14px}
.premium-route-loader>span:nth-child(2){height:154px}
.premium-route-loader.compact>span:first-child{width:74%}
.premium-route-loader.compact>span:nth-child(2){height:220px}
@keyframes nuhaSkeleton{to{background-position:-220% 0}}

/* Bottom navigation: hanya ikon yang aktif mendapat pop kecil. */
.nav-icon-pop{animation:nuhaNavPop 360ms var(--motion-ease)}
@keyframes nuhaNavPop{
  0%{transform:scale(.82) translateY(2px)}
  55%{transform:scale(1.12) translateY(-2px)}
  100%{transform:scale(1) translateY(0)}
}

/* Favorit / penanda */
.micro-pop{animation:nuhaMicroPop 390ms var(--motion-ease)}
.micro-success{animation:nuhaSuccess 500ms var(--motion-ease)}
.favorite-burst{animation:nuhaFavoriteBurst 540ms var(--motion-ease)}
.saved-feedback{border-color:color-mix(in srgb,var(--green) 54%,var(--line))!important;color:var(--green)!important;background:var(--green-soft)!important}
@keyframes nuhaMicroPop{0%{transform:scale(.9)}60%{transform:scale(1.08)}100%{transform:scale(1)}}
@keyframes nuhaSuccess{0%{transform:scale(.94)}45%{transform:scale(1.07)}100%{transform:scale(1)}}
@keyframes nuhaFavoriteBurst{0%{transform:scale(.86) rotate(-7deg)}55%{transform:scale(1.16) rotate(4deg)}100%{transform:scale(1) rotate(0)}}

/* Bottom sheet masuk lembut dari bawah; close tetap instan agar aksi berantai aman. */
.sheet-opening{animation:nuhaBackdropIn 250ms ease both}
.sheet-opening .sheet{animation:nuhaSheetIn 330ms var(--motion-ease) both}
@keyframes nuhaBackdropIn{from{background:rgba(0,0,0,0)}to{background:rgba(0,0,0,.35)}}
@keyframes nuhaSheetIn{from{transform:translate3d(0,28px,0);opacity:.72}to{transform:translate3d(0,0,0);opacity:1}}

/* Toast terasa lebih lembut ketika pesan baru masuk. */
.toast{will-change:transform,opacity}
.toast.toast-pop{animation:nuhaToastPop 280ms var(--motion-ease)}
@keyframes nuhaToastPop{
  0%{transform:translate(-50%,16px) scale(.96)}
  65%{transform:translate(-50%,-2px) scale(1.015)}
  100%{transform:translate(-50%,0) scale(1)}
}

/* Spinner lama tetap tersedia untuk loading lokal di dalam halaman. */
.spinner{animation-duration:.72s}

/* Pengguna yang memilih Reduce Motion mendapat UI stabil tanpa gerakan dekoratif. */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto!important}
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
  .premium-route-loader>span,.bahtsul-skeleton{animation:none!important;background:var(--green-soft)!important}
}

/* =========================================================
   BUILD 178 — PRAYER EXPERIENCE PREMIUM
   Halaman Jadwal Shalat dibuat lebih hidup tanpa mengubah
   struktur navigasi utama atau Beranda.
   ========================================================= */
.prayer-page-head{
  display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:16px;
}
.prayer-page-head .page-title{margin-bottom:2px}
.prayer-page-head .page-subtitle{margin-bottom:0}
.prayer-page-kicker{
  display:block;color:var(--green);font-size:9px;font-weight:900;letter-spacing:.16em;margin-bottom:5px;
}
.prayer-head-mark{
  width:46px;height:46px;flex:0 0 46px;border-radius:16px;display:grid;place-items:center;
  background:linear-gradient(145deg,var(--green-soft),var(--card));border:1px solid var(--line);
  color:var(--green);font-size:21px;box-shadow:0 10px 24px rgba(15,84,66,.08);
}
.prayer-premium{display:grid;gap:14px}
.prayer-premium-hero{
  position:relative;isolation:isolate;overflow:hidden;border-radius:28px;padding:21px 20px 18px;
  color:#fff;background:
    radial-gradient(circle at 86% 16%,rgba(255,224,154,.19),transparent 25%),
    linear-gradient(138deg,#075d49 0%,#0a755a 52%,#0e8a68 100%);
  box-shadow:0 18px 40px rgba(5,74,56,.20);
}
.prayer-premium-hero:before{
  content:"";position:absolute;inset:-45% auto auto -12%;width:245px;aspect-ratio:1;border-radius:50%;
  border:1px solid rgba(255,255,255,.06);box-shadow:0 0 0 28px rgba(255,255,255,.025),0 0 0 58px rgba(255,255,255,.018);z-index:-1;
}
.prayer-premium-hero:after{
  content:"";position:absolute;right:-28px;bottom:-42px;width:150px;height:150px;border-radius:44%;
  background:linear-gradient(145deg,rgba(255,221,149,.12),rgba(255,255,255,.02));transform:rotate(28deg);z-index:-1;
}
.prayer-hero-glow{
  position:absolute;width:120px;height:120px;right:-34px;top:-40px;border-radius:50%;
  background:rgba(255,230,172,.10);filter:blur(2px);z-index:-1;
}
.prayer-hero-top,.prayer-hero-main,.prayer-hero-meta{position:relative;z-index:2}
.prayer-hero-top{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:17px}
.prayer-hero-label{font-size:9px;font-weight:900;letter-spacing:.15em;color:rgba(255,255,255,.76)}
.prayer-live-dot{font-size:9px;font-weight:800;color:#e9fff7;display:inline-flex;align-items:center;gap:6px}
.prayer-live-dot i{width:6px;height:6px;border-radius:50%;background:#b8f4dd;box-shadow:0 0 0 5px rgba(184,244,221,.10)}
.prayer-hero-main{display:flex;align-items:center;justify-content:space-between;gap:14px}
.prayer-hero-location{display:block!important;color:rgba(255,255,255,.78)!important;font-size:10.5px!important;margin-bottom:4px}
.prayer-hero-location i{margin-right:3px;color:#c7f5e4}
.prayer-hero-main h2{margin:0;font-size:28px;line-height:1.08;letter-spacing:-.035em;color:#fff}
.prayer-hero-main h2 strong{display:inline-block;color:#d4f8e9;font-weight:900}
.prayer-hero-symbol{
  width:58px;height:58px;flex:0 0 58px;border-radius:21px;display:grid;place-items:center;font-size:24px;
  background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.13);color:#ffdfa1;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.10);
}
.prayer-hero-countdown{display:flex;align-items:center;gap:7px;margin-top:8px;color:rgba(255,255,255,.74);font-size:10.5px}
.prayer-hero-countdown b{
  color:#fff;font-variant-numeric:tabular-nums;letter-spacing:.06em;font-size:12px;padding:3px 7px;border-radius:999px;
  background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.09)
}
.prayer-hero-meta{display:flex;flex-wrap:wrap;gap:7px;margin-top:17px;padding-top:13px;border-top:1px solid rgba(255,255,255,.10)}
.prayer-hero-meta span{
  display:inline-flex;align-items:center;gap:5px;border-radius:999px;padding:6px 9px;font-size:9.5px;font-weight:700;
  color:rgba(255,255,255,.88);background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.08)
}
.prayer-hero-meta i{color:#ffe0a6}

.prayer-journey-card{padding:17px 15px 15px!important;border-radius:24px!important;overflow:hidden}
.prayer-section-title{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:16px}
.prayer-section-title>div>span{display:block;color:var(--green);font-size:8.5px;font-weight:900;letter-spacing:.13em;margin-bottom:3px}
.prayer-section-title h3{margin:0;font-size:15px;letter-spacing:-.01em}
.prayer-section-title>small{color:var(--muted);font-size:8.5px;white-space:nowrap;margin-top:3px}
.prayer-section-title.compact{margin:0 2px 10px}
.prayer-journey{position:relative;padding:3px 2px 0}
.prayer-journey-line{
  position:absolute;top:17px;left:8.5%;right:8.5%;height:3px;border-radius:999px;background:var(--line);overflow:hidden;z-index:0
}
.prayer-journey-line span{
  display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--green),#34a98b);transition:width .8s ease
}
.prayer-journey-steps{position:relative;z-index:1;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:2px}
.prayer-step{text-align:center;min-width:0;color:var(--muted)}
.prayer-step-dot{
  width:31px;height:31px;margin:0 auto 7px;border-radius:50%;display:grid;place-items:center;
  background:var(--card);border:2px solid var(--line);font-size:12px;color:var(--muted);transition:transform .2s ease,border-color .2s ease,background .2s ease
}
.prayer-step>span{display:block;font-size:9px;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.prayer-step>b{display:block;margin-top:2px;font-size:11px;color:var(--text);font-variant-numeric:tabular-nums}
.prayer-step>small{display:block;color:var(--green);font-size:7px;font-weight:900;margin-top:2px}
.prayer-step.past .prayer-step-dot{background:var(--green-soft);border-color:rgba(14,126,96,.20);color:var(--green)}
.prayer-step.past{opacity:.72}
.prayer-step.next{color:var(--green)}
.prayer-step.next .prayer-step-dot{
  transform:scale(1.09);background:var(--green);border-color:var(--green);color:#fff;box-shadow:0 0 0 5px var(--green-soft),0 8px 18px rgba(11,111,83,.15)
}
.prayer-step.next>b{color:var(--green);font-weight:900}
.prayer-journey-note{
  margin-top:14px;padding:9px 10px;border-radius:13px;background:var(--green-soft);color:var(--green);font-size:9.5px;font-weight:700;text-align:center
}

.prayer-support-section{padding:2px 0 0}
.prayer-support-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}
.prayer-support-card{
  min-width:0;padding:12px 10px;border-radius:18px;background:var(--card);border:1px solid var(--line);display:flex;align-items:center;gap:9px;
  box-shadow:0 8px 22px rgba(17,55,45,.035)
}
.prayer-support-icon{
  width:34px;height:34px;flex:0 0 34px;border-radius:12px;display:grid;place-items:center;background:var(--green-soft);color:var(--green);font-size:14px
}
.prayer-support-card span{display:block;color:var(--muted);font-size:8.5px;font-weight:700}
.prayer-support-card b{display:block;color:var(--text);font-size:13px;margin-top:1px;font-variant-numeric:tabular-nums}

.prayer-permission-card{
  display:flex;align-items:center;gap:11px;padding:13px 14px!important;border-radius:20px!important
}
.prayer-permission-icon{
  width:40px;height:40px;flex:0 0 40px;border-radius:14px;display:grid;place-items:center;background:var(--green-soft);color:var(--green);font-size:17px
}
.prayer-permission-copy{min-width:0;flex:1}
.prayer-permission-copy>span{display:block;color:var(--green);font-size:8px;font-weight:900;letter-spacing:.11em}
.prayer-permission-copy>b{display:block;font-size:11px;margin:2px 0 1px}
.prayer-permission-copy>small{display:block;color:var(--muted);font-size:8.5px;line-height:1.35}
.prayer-notify-btn{
  flex:0 0 auto;border:0;border-radius:12px;padding:8px 10px;background:var(--green);color:#fff;font:800 9px "Nunito",sans-serif;cursor:pointer
}
.prayer-source-note{
  display:flex;align-items:flex-start;gap:7px;padding:2px 4px 8px;color:var(--muted);font-size:8.5px;line-height:1.45
}
.prayer-source-note i{color:var(--green);margin-top:1px}
.prayer-location-empty{text-align:center;padding:28px 20px!important;border-radius:24px!important}
.prayer-empty-icon{width:56px;height:56px;margin:0 auto 12px;border-radius:19px;display:grid;place-items:center;background:var(--green-soft);color:var(--green);font-size:24px}
.prayer-location-empty h3{margin:0 0 6px}.prayer-location-empty p{margin:0 auto 15px;color:var(--muted);font-size:11px;max-width:420px;line-height:1.6}
.prayer-location-fallback{max-width:360px;margin:0 auto 12px;padding:13px;border:1px solid var(--line);border-radius:17px;background:var(--green-soft);text-align:left}
.prayer-location-fallback>span{display:block;font-size:9.5px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;color:var(--green);margin-bottom:3px}
.prayer-location-fallback>b{display:block;font-size:12px;color:var(--text);margin-bottom:3px}.prayer-location-fallback>b i{color:var(--green);margin-right:4px}
.prayer-location-fallback>small{display:block;color:var(--muted);font-size:11px;line-height:1.45;margin-bottom:10px}
.prayer-manual-btn{width:100%;justify-content:center;background:var(--green)!important;color:#fff!important;border-color:var(--green)!important}
.prayer-location-empty>.small-btn.ghost{margin-top:2px;background:transparent}

[data-theme="dark"] .prayer-premium-hero{
  background:radial-gradient(circle at 86% 16%,rgba(255,222,151,.12),transparent 25%),linear-gradient(138deg,#123f35 0%,#145244 55%,#176451 100%);
  box-shadow:0 18px 40px rgba(0,0,0,.26)
}
[data-theme="dark"] .prayer-step-dot{background:var(--card)}
[data-theme="dark"] .prayer-step.past .prayer-step-dot{background:#254c40}
[data-theme="dark"] .prayer-step.next .prayer-step-dot{box-shadow:0 0 0 5px rgba(65,167,136,.13),0 8px 18px rgba(0,0,0,.20)}

@media (max-width:390px){
  .prayer-premium-hero{padding:18px 16px 16px;border-radius:24px}
  .prayer-hero-main h2{font-size:25px}
  .prayer-hero-symbol{width:50px;height:50px;flex-basis:50px;border-radius:18px;font-size:21px}
  .prayer-support-card{padding:10px 8px;gap:7px}
  .prayer-support-icon{width:30px;height:30px;flex-basis:30px;border-radius:11px;font-size:12px}
  .prayer-support-card b{font-size:11.5px}
  .prayer-step>span{font-size:8.2px}.prayer-step>b{font-size:10px}
  .prayer-permission-copy>small{font-size:8px}
}
@media (min-width:720px){
  .prayer-premium{grid-template-columns:minmax(0,1.35fr) minmax(270px,.65fr);align-items:start}
  .prayer-premium-hero,.prayer-journey-card{grid-column:1}
  .prayer-support-section,.prayer-permission-card,.prayer-source-note{grid-column:2}
  .prayer-support-grid{grid-template-columns:1fr}
  .prayer-support-card{padding:14px 12px}
  .prayer-source-note{padding:0 4px}
}
@media (prefers-reduced-motion:reduce){
  .prayer-journey-line span,.prayer-step-dot{transition:none!important}
}


/* =========================================================
   BUILD 179 — PRAYER SCHEDULE PREMIUM REDESIGN
   Terinspirasi pola hero + kartu tanggal mengambang + daftar
   vertikal yang mudah dipindai, namun tetap identitas NUHA.
   ========================================================= */
.prayer-premium-v2{display:grid;gap:13px;margin:-6px -2px 0}
.prayer-v2-hero{
  position:relative;isolation:isolate;overflow:hidden;margin:0 -16px;padding:15px 20px 52px;
  border-radius:0 0 32px 32px;color:#fff;background:
    radial-gradient(circle at 82% 13%,rgba(255,224,154,.16),transparent 22%),
    linear-gradient(160deg,#0d8a70 0%,#08785e 48%,#06634f 100%);
  box-shadow:0 15px 36px rgba(5,91,70,.16)
}
.prayer-v2-pattern{position:absolute;inset:0;z-index:-1;opacity:.22;background:
  radial-gradient(circle at 12% 58%,transparent 0 25px,rgba(255,255,255,.12) 26px 27px,transparent 28px 44px,rgba(255,255,255,.07) 45px 46px,transparent 47px),
  linear-gradient(180deg,transparent 64%,rgba(2,67,52,.20) 100%)}
.prayer-v2-pattern:after{content:"";position:absolute;left:-2%;right:-2%;bottom:-1px;height:84px;opacity:.22;background:
  radial-gradient(ellipse at 8% 100%,#063f35 0 23%,transparent 24%),
  radial-gradient(ellipse at 29% 100%,#063f35 0 19%,transparent 20%),
  radial-gradient(ellipse at 52% 100%,#063f35 0 24%,transparent 25%),
  radial-gradient(ellipse at 78% 100%,#063f35 0 20%,transparent 21%),
  radial-gradient(ellipse at 98% 100%,#063f35 0 25%,transparent 26%)}
.prayer-v2-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;position:relative;z-index:2}
.prayer-v2-settings{width:36px;height:36px;border:0;border-radius:13px;display:grid;place-items:center;background:rgba(255,255,255,.10);color:#fff;font-size:18px;cursor:pointer}
.prayer-v2-title{flex:1;text-align:left}.prayer-v2-title span{display:block;font-size:8px;font-weight:900;letter-spacing:.15em;color:rgba(255,255,255,.68)}.prayer-v2-title b{display:block;font-size:17px;line-height:1.2;margin-top:1px}
.prayer-v2-location{position:relative;z-index:2;text-align:center;margin-top:18px;font-size:11px;color:rgba(255,255,255,.84)}.prayer-v2-location i{color:#ffcf72;margin-right:4px}
.prayer-v2-next{position:relative;z-index:2;text-align:center;margin-top:6px;font-size:28px;font-weight:800;letter-spacing:-.04em}.prayer-v2-next strong{color:#e0fff4;font-weight:950}.prayer-v2-next small{font-size:11px;letter-spacing:.02em;color:rgba(255,255,255,.8);font-weight:900}
.prayer-v2-countdown{position:relative;z-index:2;display:flex;justify-content:center;align-items:center;gap:6px;margin-top:5px;color:rgba(255,255,255,.72);font-size:10px}.prayer-v2-countdown b{font-variant-numeric:tabular-nums;color:#fff;letter-spacing:.08em}
.prayer-v2-actions{position:relative;z-index:2;display:flex;justify-content:space-between;gap:10px;margin-top:22px}.prayer-v2-actions button{border:0;background:transparent;color:#eefdf8;font:800 10px "Nunito",sans-serif;display:inline-flex;align-items:center;gap:6px;padding:7px 2px;cursor:pointer}.prayer-v2-actions i{font-size:14px}
.prayer-v2-date-card{position:relative;z-index:3;margin:-38px 10px 0!important;padding:13px 15px!important;border-radius:20px!important;display:grid;grid-template-columns:36px 1fr auto;align-items:center;gap:10px;box-shadow:0 13px 30px rgba(27,58,49,.12)!important}
.prayer-v2-date-card>div:first-child{width:34px;height:34px;border-radius:12px;display:grid;place-items:center;background:var(--green-soft);color:var(--green)}
.prayer-v2-date-card b{display:block;font-size:13px}.prayer-v2-date-card span{display:block;color:var(--muted);font-size:10px;margin-top:2px}
.prayer-v2-date-status{display:flex!important;align-items:center;gap:4px;color:var(--green)!important}.prayer-v2-date-status i{font-size:11px}.prayer-v2-date-status small{font-size:8px;font-weight:900;white-space:nowrap}
.prayer-v2-list{padding:4px 0 6px!important;border-radius:24px!important;overflow:hidden}
.prayer-v2-list-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;padding:15px 16px 9px}.prayer-v2-list-head span{display:block;font-size:8px;font-weight:900;letter-spacing:.13em;color:var(--green)}.prayer-v2-list-head h3{margin:2px 0 0;font-size:14px}.prayer-v2-list-head>small{font-size:8px;color:var(--muted);margin-top:3px;white-space:nowrap}
.prayer-list-rows{padding:0 8px 4px}.prayer-list-row{display:grid;grid-template-columns:38px minmax(0,1fr) auto 30px;align-items:center;gap:8px;min-height:52px;padding:7px 9px;border-radius:16px;transition:background .2s ease,transform .2s ease,opacity .2s ease}
.prayer-list-row+.prayer-list-row{margin-top:2px}.prayer-row-icon{width:34px;height:34px;border-radius:12px;display:grid;place-items:center;color:var(--muted);background:var(--bg);font-size:14px}.prayer-row-name span{display:block;font-size:11px;font-weight:800}.prayer-row-name small{display:block;font-size:7.5px;color:var(--green);font-weight:900;margin-top:1px}.prayer-list-row time{font-size:13px;font-weight:800;font-variant-numeric:tabular-nums;color:var(--text)}.prayer-row-state{width:27px;height:27px;border-radius:10px;display:grid;place-items:center;color:var(--muted);font-size:12px}
.prayer-list-row.past{opacity:.56}.prayer-list-row.past .prayer-row-state{color:var(--green)}
.prayer-list-row.next{background:linear-gradient(90deg,var(--green-soft),rgba(222,250,240,.55));box-shadow:inset 0 0 0 1px rgba(14,126,96,.09)}.prayer-list-row.next .prayer-row-icon{background:#fff;color:var(--green);box-shadow:0 5px 13px rgba(10,111,84,.09)}.prayer-list-row.next .prayer-row-name span,.prayer-list-row.next time,.prayer-list-row.next .prayer-row-state{color:var(--green)}.prayer-list-row.next time{font-weight:950}
.prayer-v2-source{display:flex;gap:11px;align-items:flex-start;padding:13px 14px!important;border-radius:20px!important}.prayer-v2-source-icon{width:38px;height:38px;flex:0 0 38px;border-radius:13px;display:grid;place-items:center;background:var(--green-soft);color:var(--green);font-size:16px}.prayer-v2-source b{display:block;font-size:10.5px}.prayer-v2-source p{margin:3px 0 0;color:var(--muted);font-size:8.5px;line-height:1.45}
[data-theme="dark"] .prayer-v2-hero{background:radial-gradient(circle at 82% 13%,rgba(255,224,154,.10),transparent 22%),linear-gradient(160deg,#155b4c 0%,#104b40 55%,#0b3e36 100%)}
[data-theme="dark"] .prayer-list-row.next{background:linear-gradient(90deg,rgba(52,139,113,.17),rgba(52,139,113,.06))}[data-theme="dark"] .prayer-list-row.next .prayer-row-icon{background:#183c33}
@media (max-width:390px){.prayer-v2-hero{margin-left:-14px;margin-right:-14px;padding:13px 17px 50px}.prayer-v2-next{font-size:25px}.prayer-v2-date-card{margin-left:7px!important;margin-right:7px!important}.prayer-list-row{grid-template-columns:35px minmax(0,1fr) auto 28px;min-height:49px;padding:6px 8px}.prayer-row-icon{width:31px;height:31px}.prayer-v2-list-head{padding-left:14px;padding-right:14px}}
@media (min-width:720px){.prayer-premium-v2{max-width:760px;margin:0 auto}.prayer-v2-hero{margin-left:0;margin-right:0;border-radius:30px;padding-left:28px;padding-right:28px}.prayer-v2-date-card{max-width:620px;width:calc(100% - 40px);margin-left:auto!important;margin-right:auto!important}.prayer-v2-list{padding-left:8px!important;padding-right:8px!important}}
@media (prefers-reduced-motion:reduce){.prayer-list-row{transition:none!important}}


/* =========================================================
   BUILD 181 — PRAYER RESPONSIVE FIX
   Preview HP berjalan di viewport desktop. Paksa layout Jadwal Shalat
   tetap satu kolom mengikuti lebar app-shell, bukan lebar browser.
   Juga menjadi fallback aman bila JS build sebelumnya masih sesaat
   dikendalikan Service Worker lama ketika proses update berlangsung.
   ========================================================= */
body.preview-phone .prayer-premium-v2{
  width:auto!important;max-width:none!important;
  grid-template-columns:minmax(0,1fr)!important;
  margin:-6px -2px 0!important;
}
body.preview-phone .prayer-premium-v2>*{
  grid-column:1!important;min-width:0;max-width:100%;
}
body.preview-phone .prayer-premium-v2 .prayer-v2-hero{
  margin-left:-16px!important;margin-right:-16px!important;
  padding-left:20px!important;padding-right:20px!important;
  border-radius:0 0 32px 32px!important;
}
body.preview-phone .prayer-premium-v2 .prayer-v2-date-card{
  width:auto!important;max-width:none!important;
  margin:-38px 10px 0!important;
}
body.preview-phone .prayer-premium-v2 .prayer-v2-list{
  padding-left:0!important;padding-right:0!important;
}

/* Compatibility: bila HTML Build 178 masih tersisa satu siklus cache,
   aturan desktop 2 kolom tidak boleh memecah tampilan di preview HP. */
body.preview-phone .prayer-premium{
  width:100%!important;max-width:none!important;
  grid-template-columns:minmax(0,1fr)!important;
  align-items:stretch!important;
}
body.preview-phone .prayer-premium>*{
  grid-column:1/-1!important;min-width:0!important;max-width:100%!important;
}
body.preview-phone .prayer-premium .prayer-support-grid{
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
}

@media (max-width:560px){
  .prayer-premium-v2{min-width:0!important;max-width:100%!important}
  .prayer-premium-v2>*{min-width:0;max-width:100%}
  .prayer-v2-date-card{grid-template-columns:34px minmax(0,1fr) auto!important}
  .prayer-v2-list-head{min-width:0}
  .prayer-v2-list-head>div{min-width:0}
}


/* ===== Build 183 — Lainnya Centered Premium ===== */
.other-page{
  width:100%;
}
.other-page > .page-title,
.other-page > .page-subtitle{
  text-align:center;
}
.other-page > .page-title{
  margin-left:auto;
  margin-right:auto;
}
.other-page > .page-subtitle{
  max-width:360px;
  margin-left:auto;
  margin-right:auto;
}
.other-menu-list{
  max-width:520px;
  margin:18px auto 0;
}
.other-menu-list .list-item{
  display:grid;
  grid-template-columns:48px minmax(0,1fr) 28px;
  align-items:center;
  gap:12px;
  min-height:78px;
  padding:12px 16px;
}
.other-menu-list .list-item .left{
  display:contents;
}
.other-menu-list .list-item .num{
  width:44px;
  height:44px;
  border-radius:14px;
  justify-self:start;
  font-size:17px;
}
.other-menu-list .list-item .left > div{
  min-width:0;
  text-align:center;
  justify-self:center;
}
.other-menu-list .list-item h4{
  font-size:15px;
  line-height:1.25;
}
.other-menu-list .list-item p{
  margin-top:4px;
  font-size:11.5px;
  line-height:1.35;
  text-wrap:balance;
}
.other-menu-list .list-item > b,
.other-menu-list .list-item > i{
  justify-self:end;
  color:var(--muted);
  font-size:17px;
}
@media(max-width:560px){
  .other-menu-list{
    width:100%;
  }
  .other-menu-list .list-item{
    grid-template-columns:46px minmax(0,1fr) 24px;
    min-height:80px;
    padding:12px 14px;
  }
  .other-page > .page-subtitle{
    max-width:300px;
  }
}


/* ===== Build 184 — Kalender Indonesia, Islam & NU Premium ===== */
.calendar-card .cal-day.has-event{box-shadow:inset 0 -1px 0 color-mix(in srgb,var(--line) 65%,transparent)}
[data-theme="dark"] .calendar-event-badge.leave{color:#d6b7ef}

/* ===== Compatibility cleanup ===== */
.reader-unavailable{margin-top:14px;padding:28px 20px;text-align:center}
.reader-unavailable-icon{width:58px;height:58px;margin:0 auto 12px;border-radius:19px;display:grid;place-items:center;background:var(--green-soft);color:var(--green);font-size:24px}
.reader-unavailable h3{margin:0 0 7px}
.reader-unavailable p{margin:0 auto 16px;max-width:520px;color:var(--muted);line-height:1.6}
[data-theme="dark"] .reader-unavailable-icon{background:rgba(124,211,167,.12);color:#8de0c9}

/* Build 282 — Tasbih Digital premium */
.tasbih-page{max-width:760px;margin:0 auto;padding-bottom:18px}
.tasbih-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:4px}
.tasbih-kicker{display:inline-flex;align-items:center;gap:7px;margin-bottom:8px;padding:6px 10px;border-radius:999px;background:var(--green-soft);color:var(--green);font-size:10px;font-weight:900;letter-spacing:.035em;text-transform:uppercase}
.tasbih-premium-card{position:relative;overflow:hidden;padding:20px;margin-top:12px;border-color:color-mix(in srgb,var(--green) 18%,var(--line));background:linear-gradient(155deg,color-mix(in srgb,var(--card) 92%,var(--green-soft)) 0%,var(--card) 54%,color-mix(in srgb,var(--card) 88%,#f7eac1) 100%)}
.tasbih-premium-card::before{content:"";position:absolute;width:190px;height:190px;border-radius:50%;right:-80px;top:-105px;background:radial-gradient(circle,color-mix(in srgb,var(--gold) 20%,transparent),transparent 69%);pointer-events:none}
.tasbih-card-head{position:relative;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:7px;text-align:left}
.tasbih-card-head>div{display:flex;flex-direction:column;gap:2px}
.tasbih-card-head b{font-size:15px;color:var(--text)}
.tasbih-overline{font-size:9px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.tasbih-icon-btn{width:42px;height:42px;display:grid;place-items:center;border:1px solid var(--line);border-radius:14px;background:color-mix(in srgb,var(--card) 88%,transparent);color:var(--green);font-size:18px;cursor:pointer;box-shadow:0 8px 22px rgba(13,107,85,.07)}
.tasbih-counter{display:block;width:min(82vw,330px);aspect-ratio:1;margin:10px auto 14px;padding:0;border:0;border-radius:50%;background:transparent;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation}
.tasbih-ring{--tasbih-progress:0%;position:relative;width:100%;height:100%;display:grid;place-items:center;border-radius:50%;background:conic-gradient(var(--green) 0 var(--tasbih-progress),color-mix(in srgb,var(--green-soft-2) 78%,var(--line)) var(--tasbih-progress) 100%);box-shadow:0 22px 55px rgba(13,107,85,.16),inset 0 0 0 1px color-mix(in srgb,var(--green) 15%,transparent);transition:transform .12s ease,background .22s ease,box-shadow .22s ease}
.tasbih-ring::before{content:"";position:absolute;inset:8px;border-radius:50%;background:repeating-conic-gradient(from -2deg,color-mix(in srgb,var(--gold) 60%,var(--green)) 0deg 1deg,transparent 1deg 12deg);opacity:.2;mask:radial-gradient(circle,transparent 71%,#000 72% 76%,transparent 77%);-webkit-mask:radial-gradient(circle,transparent 71%,#000 72% 76%,transparent 77%);pointer-events:none}
.tasbih-ring::after{content:"";position:absolute;inset:14px;border-radius:50%;background:var(--card);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--green) 11%,var(--line)),inset 0 16px 34px color-mix(in srgb,var(--green-soft) 42%,transparent)}
.tasbih-counter:active .tasbih-ring{transform:scale(.975);box-shadow:0 12px 35px rgba(13,107,85,.12)}
.tasbih-ring-inner{position:relative;z-index:2;display:flex;min-width:0;align-items:center;justify-content:center;flex-direction:column;gap:2px;color:var(--text)}
.tasbih-counter-label{font-size:11px;font-weight:800;color:var(--muted);letter-spacing:.04em;text-transform:uppercase}
.tasbih-ring-inner strong{font-size:clamp(68px,18vw,104px);line-height:1;font-variant-numeric:tabular-nums;letter-spacing:-.055em;color:var(--green);text-shadow:0 8px 30px color-mix(in srgb,var(--green) 13%,transparent)}
.tasbih-tap-hint{display:inline-flex;align-items:center;gap:5px;margin-top:5px;color:var(--muted);font-size:10px;font-weight:700}
.tasbih-progress-row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:2px auto 16px;padding:0 6px;color:var(--muted);font-size:11px}
.tasbih-progress-row strong{color:var(--green);font-size:11px}
.tasbih-preset-wrap{padding-top:14px;border-top:1px solid color-mix(in srgb,var(--line) 88%,transparent)}
.tasbih-presets{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:8px}
.tasbih-presets button{min-height:42px;border:1px solid var(--line);border-radius:13px;background:color-mix(in srgb,var(--card) 90%,transparent);color:var(--text);font:inherit;font-size:12px;font-weight:900;cursor:pointer;transition:.18s ease}
.tasbih-presets button:hover{border-color:color-mix(in srgb,var(--green) 42%,var(--line));transform:translateY(-1px)}
.tasbih-presets button.active{background:var(--green);border-color:var(--green);color:#fff;box-shadow:0 8px 18px color-mix(in srgb,var(--green) 20%,transparent)}
.tasbih-presets #tasbihCustom{grid-column:1/-1;background:var(--green-soft);color:var(--green);border-color:color-mix(in srgb,var(--green) 15%,var(--line))}
.tasbih-presets #tasbihCustom:hover{background:color-mix(in srgb,var(--green-soft) 72%,var(--card))}
.tasbih-stats{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:13px}
.tasbih-stats>div{padding:12px 13px;border:1px solid var(--line);border-radius:14px;background:color-mix(in srgb,var(--card) 86%,transparent);display:flex;align-items:center;justify-content:space-between;gap:8px}
.tasbih-stats span{font-size:10px;color:var(--muted);font-weight:700}.tasbih-stats b{font-size:14px;color:var(--green)}
.tasbih-note{display:flex;align-items:flex-start;gap:8px;margin:13px 2px 0;color:var(--muted);font-size:9.5px;line-height:1.55}.tasbih-note i{color:var(--green);font-size:13px;margin-top:1px}
.tasbih-ring.goal-hit{animation:tasbihGoal .5s ease}
@keyframes tasbihGoal{0%{transform:scale(1)}35%{transform:scale(1.035);box-shadow:0 20px 55px color-mix(in srgb,var(--gold) 28%,transparent)}100%{transform:scale(1)}}
.tasbih-custom-sheet{display:grid;gap:12px}.tasbih-custom-label{font-size:10px;font-weight:900;color:var(--muted);text-transform:uppercase;letter-spacing:.05em}.tasbih-custom-input{width:100%;height:52px;border:1px solid var(--line);border-radius:14px;background:var(--card);color:var(--text);padding:0 14px;font:inherit;font-size:18px;font-weight:800;outline:none}.tasbih-custom-input:focus{border-color:var(--green);box-shadow:0 0 0 3px color-mix(in srgb,var(--green) 11%,transparent)}.tasbih-custom-input.invalid{border-color:#c94d4d;box-shadow:0 0 0 3px rgba(201,77,77,.1)}
@media(max-width:520px){.tasbih-page{max-width:none}.tasbih-premium-card{padding:16px}.tasbih-counter{width:min(76vw,292px)}.tasbih-ring-inner strong{font-size:clamp(66px,21vw,88px)}.tasbih-stats>div{padding:11px}.tasbih-note{font-size:9px}}
@media(prefers-reduced-motion:reduce){.tasbih-ring,.tasbih-presets button{transition:none}.tasbih-ring.goal-hit{animation:none}}


/* ==============================================================
   Build 285 — Rapikan Bahasa Tentang Maktabah
   ============================================================== */
.app-splash-developer{margin-top:8px!important;font-size:10px!important;font-weight:700;color:var(--green)!important;opacity:.82}
.developer-profile{display:flex;align-items:center;gap:16px;padding:18px}
.developer-profile-mark{width:68px;height:68px;border-radius:22px;display:grid;place-items:center;flex:none;background:linear-gradient(145deg,var(--green),#0f876a);color:#fff;font-size:30px;box-shadow:0 12px 28px rgba(13,107,85,.2)}
.developer-profile-kicker,.feedback-kicker{display:block;font-size:9px;font-weight:900;letter-spacing:.13em;color:var(--green);margin-bottom:4px}
.developer-profile h3{margin:0 0 5px;font-size:22px;color:var(--green)}
.developer-profile p{margin:0;color:var(--muted);font-size:13px;line-height:1.6}
.feedback-primary-action{width:100%;margin-top:14px;border:1px solid color-mix(in srgb,var(--green) 24%,var(--line));border-radius:16px;background:var(--green-soft);color:var(--green);display:grid;grid-template-columns:36px 1fr 20px;align-items:center;gap:10px;padding:13px 14px;text-align:left;cursor:pointer}
.feedback-primary-action>i:first-child{width:36px;height:36px;border-radius:12px;display:grid;place-items:center;background:var(--green);color:#fff;font-size:17px}
.feedback-primary-action span b,.feedback-primary-action span small{display:block}.feedback-primary-action span small{margin-top:2px;color:var(--muted);font-size:10px}.feedback-primary-action>i:last-child{color:var(--green)}
.feedback-hero{display:flex;gap:15px;align-items:flex-start;padding:18px;margin-bottom:12px;background:linear-gradient(145deg,color-mix(in srgb,var(--green-soft) 72%,var(--card)),var(--card))}
.feedback-hero-icon{width:58px;height:58px;border-radius:19px;display:grid;place-items:center;flex:none;background:var(--green);color:#fff;font-size:25px;box-shadow:0 12px 26px rgba(13,107,85,.2)}
.feedback-hero h3{margin:1px 0 5px;font-size:18px;color:var(--text)}
.feedback-hero p{margin:0;color:var(--muted);font-size:12px;line-height:1.6}
.feedback-tabs{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:12px 0}
.feedback-tabs button{border:1px solid var(--line);background:var(--card);color:var(--muted);border-radius:14px;padding:11px 10px;font-weight:800;cursor:pointer;box-shadow:var(--shadow)}
.feedback-tabs button.active{background:var(--green);border-color:var(--green);color:#fff}.feedback-tabs button span{display:inline-grid;place-items:center;min-width:20px;height:20px;padding:0 5px;margin-left:4px;border-radius:999px;background:color-mix(in srgb,currentColor 12%,transparent);font-size:9px}
.feedback-panel.hidden{display:none!important}.feedback-local-note{margin-bottom:12px}
.feedback-form{display:grid;gap:14px;padding:17px}.feedback-form label{display:grid;gap:6px}.feedback-form label>span{font-size:11px;font-weight:850;color:var(--text)}.feedback-form label>span b{color:#b42318}.feedback-form label>span em{font-style:normal;font-weight:650;color:var(--muted);font-size:9px}
.feedback-form select,.feedback-form textarea,.feedback-form input{width:100%;box-sizing:border-box;border:1px solid var(--line);border-radius:13px;background:var(--bg);color:var(--text);font:inherit;padding:11px 12px;outline:none}.feedback-form textarea{resize:vertical;min-height:130px;line-height:1.55}.feedback-form select:focus,.feedback-form textarea:focus,.feedback-form input:focus{border-color:var(--green);box-shadow:0 0 0 3px color-mix(in srgb,var(--green) 12%,transparent)}
.feedback-form label>small{text-align:right;color:var(--muted);font-size:9px}.feedback-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.feedback-context{display:flex;gap:9px;align-items:flex-start;padding:11px 12px;border-radius:13px;background:color-mix(in srgb,var(--green-soft) 65%,var(--card));color:var(--muted);font-size:10px;line-height:1.5}.feedback-context i{color:var(--green);font-size:15px;flex:none}
.feedback-submit{border:0;border-radius:15px;background:var(--green);color:#fff;display:flex;align-items:center;justify-content:center;gap:10px;padding:12px 16px;cursor:pointer;box-shadow:0 11px 24px rgba(13,107,85,.2)}.feedback-submit>i{font-size:19px}.feedback-submit span b,.feedback-submit span small{display:block}.feedback-submit span small{font-size:9px;opacity:.8;margin-top:1px}
.feedback-list{display:grid;gap:10px}.feedback-item{padding:15px}.feedback-item-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.feedback-item-head small{display:block;color:var(--muted);font-size:10px;font-weight:800;letter-spacing:.04em}.feedback-item h3{margin:2px 0 0;font-size:14px}.feedback-item>p{margin:10px 0;color:var(--muted);font-size:12px;line-height:1.55;white-space:pre-wrap}.feedback-item-meta{display:flex;gap:10px;flex-wrap:wrap;color:var(--muted);font-size:10.5px}.feedback-item-meta span{display:inline-flex;align-items:center;gap:5px}
.feedback-item-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:2px}
.feedback-delete{display:inline-flex;align-items:center;gap:6px;flex:0 0 auto;border:0;background:transparent;color:var(--muted);font-size:10.5px;font-weight:800;padding:7px 8px;border-radius:10px;cursor:pointer}
.feedback-delete:hover,.feedback-delete:focus-visible{background:color-mix(in srgb,#b42318 8%,var(--card));color:#b42318;outline:none}
.feedback-status{padding:6px 9px;border-radius:999px;font-size:9.5px;font-weight:900;white-space:nowrap}.feedback-status.draft{background:#fff3db;color:#8a5b00}.feedback-status.review{background:#e7f0ff;color:#235fa8}.feedback-status.done{background:var(--green-soft);color:var(--green)}
.feedback-empty{text-align:center;padding:28px 18px}.feedback-empty>i{font-size:34px;color:var(--green)}.feedback-empty h3{margin:8px 0 4px}.feedback-empty p{margin:0;color:var(--muted);font-size:12px}
.feedback-saved-sheet{text-align:center}.feedback-saved-icon{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;margin:0 auto 10px;background:var(--green-soft);color:var(--green);font-size:26px}.feedback-saved-sheet h3{margin:0 0 6px}.feedback-saved-sheet p{margin:0;color:var(--muted);font-size:12px;line-height:1.6}
@media(max-width:560px){.developer-profile{align-items:flex-start}.developer-profile-mark{width:54px;height:54px;border-radius:17px;font-size:24px}.developer-profile h3{font-size:19px}.feedback-hero{padding:15px}.feedback-hero-icon{width:50px;height:50px;border-radius:16px;font-size:22px}.feedback-form-grid{grid-template-columns:1fr}.feedback-form{padding:14px}.feedback-tabs button{font-size:10px}.feedback-item-head{gap:8px}}


/* =========================================================
   BUILD 298 — JADWAL SHALAT FULL-WIDTH DI HP
   Halaman Jadwal Shalat memakai hero full-bleed pada viewport
   kecil. Kartu isi tetap memiliki inset aman agar tidak menempel
   ke tepi layar.
   ========================================================= */
@media (max-width:560px){
  #prayerPage{
    width:calc(100% + 32px);
    margin-left:-16px;
    margin-right:-16px;
    overflow-x:hidden;
  }
  #prayerPage .prayer-premium-v2{
    width:100%!important;
    max-width:none!important;
    margin:-6px 0 0!important;
  }
  #prayerPage .prayer-v2-hero{
    width:100%!important;
    max-width:none!important;
    margin-left:0!important;
    margin-right:0!important;
    border-radius:0 0 32px 32px!important;
    padding-left:20px!important;
    padding-right:20px!important;
  }
  #prayerPage .prayer-v2-date-card{
    width:auto!important;
    max-width:none!important;
    margin:-38px 16px 0!important;
  }
  #prayerPage .prayer-v2-list,
  #prayerPage .prayer-v2-source,
  #prayerPage .prayer-permission-card{
    margin-left:16px!important;
    margin-right:16px!important;
  }
}

/* Build 300 — lampiran screenshot Pusat Masukan */
.feedback-attachment-field{display:grid;gap:9px;padding:12px;border:1px solid color-mix(in srgb,var(--green) 14%,var(--line));border-radius:16px;background:color-mix(in srgb,var(--green-soft) 28%,var(--card))}
.feedback-attachment-title{display:flex;align-items:center;justify-content:space-between;gap:10px}
.feedback-attachment-title>span{font-size:11px;font-weight:850;color:var(--text)}
.feedback-attachment-title em{font-style:normal;font-weight:650;color:var(--muted);font-size:9px}
.feedback-attachment-title>small{font-size:9px;color:var(--muted);font-weight:700;white-space:nowrap}
.feedback-attachment-pick{width:100%;border:1px dashed color-mix(in srgb,var(--green) 34%,var(--line));border-radius:14px;background:var(--card);color:var(--green);display:flex;align-items:center;justify-content:center;gap:10px;padding:12px 14px;cursor:pointer;text-align:left}
.feedback-attachment-pick>i{font-size:20px}.feedback-attachment-pick span b,.feedback-attachment-pick span small{display:block}.feedback-attachment-pick span small{margin-top:2px;color:var(--muted);font-size:9px;font-weight:650}
.feedback-attachment-pick.checking{opacity:.8;cursor:wait}.feedback-attachment-pick:disabled{pointer-events:none}.feedback-attachment-pick .spinner{width:18px;height:18px;border-width:2px;margin:0;flex:none}
.feedback-attachment-help{display:flex;align-items:flex-start;gap:7px;margin:0!important;color:var(--muted)!important;font-size:9.5px!important;line-height:1.55!important}.feedback-attachment-help i{color:var(--green);font-size:14px;flex:none;margin-top:1px}
.feedback-attachment-preview{display:grid;gap:8px}.feedback-attachment-preview.hidden{display:none!important}.feedback-attachment-image{overflow:hidden;border-radius:13px;border:1px solid var(--line);background:var(--bg);max-height:220px}.feedback-attachment-image img{display:block;width:100%;max-height:220px;object-fit:contain;background:#eef3f1}
.feedback-attachment-meta{display:flex;align-items:center;justify-content:space-between;gap:10px}.feedback-attachment-meta>span{display:grid;grid-template-columns:18px 1fr;column-gap:5px;align-items:center;min-width:0}.feedback-attachment-meta>span i{grid-row:1/3;color:var(--green);font-size:16px}.feedback-attachment-meta b{font-size:10.5px;color:var(--green)}.feedback-attachment-meta small{font-size:9px;color:var(--muted)}.feedback-attachment-meta button{border:0;background:transparent;color:#a33;font-weight:800;font-size:10px;padding:7px 8px;border-radius:9px;cursor:pointer;white-space:nowrap}
.feedback-item-attachment{margin:10px 0}.feedback-item-attachment>span{display:flex;align-items:center;gap:6px;color:var(--muted);font-size:10px}.feedback-item-image{width:100%;border:1px solid var(--line);border-radius:14px;background:var(--bg);padding:0;overflow:hidden;cursor:pointer;text-align:left}.feedback-item-image img{display:block;width:100%;max-height:190px;object-fit:cover}.feedback-item-image>span{display:flex;align-items:center;gap:6px;padding:8px 10px;color:var(--green);font-size:9.5px;font-weight:800;background:var(--card)}
.feedback-image-sheet{text-align:center}.feedback-image-sheet h3{margin:0 0 10px}.feedback-image-sheet img{display:block;max-width:100%;max-height:62vh;object-fit:contain;margin:0 auto;border-radius:14px;border:1px solid var(--line);background:#eef3f1}.feedback-image-sheet p{color:var(--muted);font-size:10px;line-height:1.55;margin:9px 0 0}
.feedback-reject-sheet{text-align:center}.feedback-reject-icon{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;margin:0 auto 10px;background:#fff0ee;color:#b42318;font-size:23px}.feedback-reject-sheet h3{margin:0 0 6px}.feedback-reject-sheet p{margin:0;color:var(--muted);font-size:12px;line-height:1.6}
@media(max-width:560px){.feedback-attachment-field{padding:11px}.feedback-attachment-image{max-height:180px}.feedback-attachment-image img{max-height:180px}.feedback-attachment-help{font-size:10px!important}.feedback-attachment-meta{align-items:flex-start}.feedback-item-image img{max-height:170px}}

/* =========================================================
   BUILD 307 — PEMILIH LOKASI JADWAL SHALAT & KIBLAT
   Lokasi manual tidak lagi memantulkan pengguna kembali ke
   Jadwal Shalat; pilihan dibuka langsung sebagai bottom sheet.
   ========================================================= */
.prayer-v2-location-btn{
  display:flex;align-items:center;justify-content:center;gap:5px;width:max-content;max-width:90%;
  margin-left:auto;margin-right:auto;padding:5px 9px;border:1px solid rgba(255,255,255,.12);
  border-radius:999px;background:rgba(255,255,255,.07);font-family:inherit;cursor:pointer
}
.prayer-v2-location-btn>span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.prayer-v2-location-btn .prayer-v2-location-edit{margin:0 0 0 2px;color:rgba(255,255,255,.72);font-size:9px}
.prayer-location-sheet{display:grid;gap:13px}
.prayer-location-sheet-head>span{display:block;color:var(--green);font-size:8px;font-weight:900;letter-spacing:.14em;margin-bottom:4px}
.prayer-location-sheet-head h3{margin:0!important;font-size:19px}
.prayer-location-sheet-head p{margin:5px 0 0;color:var(--muted);font-size:10.5px;line-height:1.55}
.prayer-location-choice-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.prayer-location-choice{min-width:0;min-height:48px;border:1px solid var(--line);border-radius:14px;background:var(--bg);color:var(--text);padding:10px 11px;display:flex;align-items:center;justify-content:space-between;gap:8px;text-align:left;font:inherit;cursor:pointer}
.prayer-location-choice>span{display:flex;align-items:center;gap:8px;min-width:0}.prayer-location-choice>span>i{color:var(--green);flex:0 0 auto}.prayer-location-choice b{font-size:10.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.prayer-location-choice>i{color:var(--muted);font-size:10px;flex:0 0 auto}
.prayer-location-choice.selected{border-color:rgba(12,127,96,.32);background:var(--green-soft);color:var(--green)}.prayer-location-choice.selected>i{color:var(--green)}
.prayer-location-custom{border:1px solid var(--line);border-radius:15px;background:var(--card);overflow:hidden}
.prayer-location-custom summary{list-style:none;cursor:pointer;padding:12px 13px;font-size:10.5px;font-weight:800;color:var(--text);display:flex;align-items:center;gap:8px}.prayer-location-custom summary::-webkit-details-marker{display:none}.prayer-location-custom summary i{color:var(--green)}
.prayer-location-custom-grid{border-top:1px solid var(--line);padding:12px;display:grid;grid-template-columns:1fr 1fr;gap:9px}.prayer-location-custom-grid label:first-child{grid-column:1/-1}.prayer-location-custom-grid label{display:grid;gap:4px;color:var(--muted);font-size:8.5px;font-weight:800}.prayer-location-custom-grid input{width:100%;box-sizing:border-box;border:1px solid var(--line);border-radius:11px;background:var(--bg);color:var(--text);padding:9px 10px;font:inherit;font-size:11px;outline:none}.prayer-location-custom-grid input:focus{border-color:rgba(12,127,96,.45);box-shadow:0 0 0 3px rgba(12,127,96,.08)}.prayer-location-custom-grid .small-btn{grid-column:1/-1;justify-content:center}
.prayer-location-auto{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:11px 12px;border-radius:15px;background:var(--green-soft)}.prayer-location-auto>div{min-width:0}.prayer-location-auto b{display:flex;align-items:center;gap:6px;color:var(--green);font-size:10.5px}.prayer-location-auto small{display:block;color:var(--muted);font-size:8.5px;line-height:1.45;margin-top:3px}.prayer-location-auto.disabled{opacity:.72}.prayer-location-auto .small-btn{flex:0 0 auto;white-space:nowrap}
@media(max-width:480px){.prayer-location-choice-list{grid-template-columns:1fr}.prayer-location-auto{align-items:flex-start;flex-direction:column}.prayer-location-auto .small-btn{width:100%;justify-content:center}}


/* BUILD 308 — KOREKSI HIJRIAH RESMI INDONESIA */
.calendar-hijri-official{display:inline-flex;align-items:center;gap:5px;margin-top:6px;padding:5px 8px;border-radius:999px;background:var(--green-soft);color:var(--green);font-size:9px;font-weight:800;line-height:1.25}
.calendar-hijri-official i{font-size:10px}
[data-theme="dark"] .calendar-hijri-official{background:color-mix(in srgb,var(--green) 18%,var(--card));color:#8ed7a7}

/* NUHA Build 322 — Dark mode daftar Amaliyah: jaga kontras kartu dan judul */
[data-theme="dark"] .amaliyah-list-item{
  background:linear-gradient(180deg,#1b2522,#17201d)!important;
  border-color:#31403b!important;
  box-shadow:none!important;
  color:var(--text)!important;
}
[data-theme="dark"] .amaliyah-list-item .amaliyah-copy h4{
  color:#f1f6f4!important;
}
[data-theme="dark"] .amaliyah-list-item .num{
  background:#1b3b31!important;
  color:#8bdcc6!important;
}
[data-theme="dark"] .amaliyah-list-item .amaliyah-arrow{
  color:#a5b1ad!important;
}


/* Build 323 — Aa Syair & Lagu: ukuran lirik Arab/Latin seragam */
.syair-reader .syair-meaning-lines,.syair-reader .syair-latin-lines{transition:font-size .16s ease}


/* Build 324 — Rapikan badge penutup Syair & Lagu Nahdliyin */
.syair-reader .syaraf-end{
  justify-self:center!important;
  align-self:center!important;
  width:fit-content!important;
  max-width:min(100%,360px)!important;
  min-width:0!important;
  margin:10px auto 4px!important;
  padding:10px 18px!important;
  border-radius:18px!important;
  display:inline-flex!important;
  flex-direction:column!important;
  flex-wrap:nowrap!important;
  align-items:center!important;
  justify-content:center!important;
  gap:3px!important;
  text-align:center!important;
  background:linear-gradient(180deg,rgba(16,99,72,.065),rgba(16,99,72,.035))!important;
  border:1px solid rgba(16,99,72,.10)!important;
  box-shadow:0 6px 18px rgba(17,62,48,.045)!important;
}
.syair-reader .syaraf-end strong{
  display:block!important;
  max-width:100%!important;
  margin:0!important;
  color:var(--brand)!important;
  font-size:13px!important;
  line-height:1.35!important;
  font-weight:800!important;
  text-align:center!important;
  overflow-wrap:anywhere!important;
}
.syair-reader .syaraf-end span{
  display:block!important;
  width:auto!important;
  height:auto!important;
  margin:0!important;
  padding:0!important;
  background:none!important;
  color:var(--muted)!important;
  font-size:11.5px!important;
  line-height:1.35!important;
  font-weight:500!important;
  text-align:center!important;
  overflow-wrap:anywhere!important;
}
[data-theme="dark"] .syair-reader .syaraf-end{
  background:linear-gradient(180deg,rgba(124,211,167,.075),rgba(124,211,167,.035))!important;
  border-color:rgba(124,211,167,.13)!important;
  box-shadow:none!important;
}
[data-theme="dark"] .syair-reader .syaraf-end strong{color:#9de2bd!important}
@media(max-width:640px){
  .syair-reader .syaraf-end{
    max-width:calc(100% - 20px)!important;
    padding:9px 15px!important;
    border-radius:17px!important;
  }
  .syair-reader .syaraf-end strong{font-size:12.5px!important}
  .syair-reader .syaraf-end span{font-size:11px!important}
}

.feedback-admin-reply{display:flex;gap:10px;align-items:flex-start;margin:10px 0;padding:11px 12px;border-radius:14px;background:var(--soft,#eef8f3);border:1px solid rgba(11,107,79,.14);color:var(--text,#17241f)}.feedback-admin-reply>i{color:#0b6b4f;margin-top:2px}.feedback-admin-reply span{display:grid;gap:2px;font-size:13px;line-height:1.5}.feedback-admin-reply b{font-size:11px;color:#0b6b4f;text-transform:uppercase;letter-spacing:.4px}body.dark .feedback-admin-reply{background:rgba(25,93,72,.18);border-color:rgba(143,205,181,.18)}body.dark .feedback-admin-reply,body.dark .feedback-admin-reply span{color:#e9f3ef}body.dark .feedback-admin-reply b,body.dark .feedback-admin-reply>i{color:#8fd2b6}