/* Noor-e-Hidayah — polish.css (loads LAST on every page)
   Fixes: mobile overflow, readability over background, tiny text, small tap
   targets, heavy hero art on phones, long-page rendering cost. */

/* 1. No sideways overflow: grid/flex children may shrink */
html body main,html body section,html body article,html body .tool-card,html body .tools-wrap>*{min-width:0}
html body .tools-wrap{grid-template-columns:minmax(0,1fr)!important}
html body h1,html body h2,html body h3,html body p,html body .sub,html body .tool-out{overflow-wrap:anywhere}
html body img,html body svg,html body video,html body canvas{max-width:100%}
html body table{display:block;max-width:100%;overflow-x:auto}

/* 2. Readability: soft glass panel behind text blocks (light mode) */
html:not([data-theme="dark"]) body .tool-card,
html:not([data-theme="dark"]) body .tools-wrap>h1{background-color:rgba(255,252,243,.82);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
html:not([data-theme="dark"]) body .tools-wrap>h1{padding:10px 16px;border-radius:16px;justify-self:center}
html[data-theme="dark"] body .tool-card{background-color:rgba(6,20,17,.72);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
html:not([data-theme="dark"]) body .tool-card p.sub,
html:not([data-theme="dark"]) body main p{--_c:#2f423d}
html:not([data-theme="dark"]) body .tool-card p.sub{opacity:1;color:#2f423d}

/* 3. Cheaper rendering for very long pages (hadith, duas, quran, ...) */
html body .hadith-card,html body .dua-card,html body .verse-card,html body .ayah,html body .prophet-card,html body .sahabi-card{content-visibility:auto;contain-intrinsic-size:auto 320px}

/* 4. Phones */
@media (max-width:760px){
  /* tiny text -> readable (bottom dock labels excluded) */
  html body small:not(.noor-mobile-nav *),
  html body .daily-dua-tag,html body .daily-dua-source,html body .section-kicker,
  html body .eyebrow,html body .z-eyebrow,html body .ah-eyebrow,html body .namaz-eyebrow,
  html body .tradition-desc,html body .z-level-status,html body .pill,html body .start-card-tag,
  html body .daily-learn-kicker,html body .detail-tag,html body .saved-note,html body .z-note,
  html body .z-mini-label,html body .z-audio-chip,html body .z-audio-note,html body .z-list-help,
  html body .z-lesson-badge,html body .step-open,html body .mini-audio,html body .tool-card label{font-size:12.5px!important;line-height:1.45}
  html body p,html body li{font-size:max(1em,14px)}
  html body .noor-mobile-nav small,html body .noor-mobile-nav span{font-size:11px}

  /* tap targets >= 44px */
  html body main a.cta-btn,html body main a.feat-btn,html body main a.gold,html body main a.dash-panel-link,
  html body main button,html body main .roadmap-item,html body main .vt,html body main .bookmark-btn,
  html body main .step-open,html body main .complete-btn,html body main .mini-audio{min-height:44px;min-width:44px}
  html body main a.roadmap-item{display:flex;align-items:center}
  html body main input:not([type=checkbox]):not([type=radio]),html body main select{min-height:44px}

  /* lighter hero on phones: decorative art no longer eats the first screen */
  html body .hadith-hero-visual,html body .hero-art,html body .art-caption,html body .quran-hero-glow,
  html body .hero-orb,html body .dua-orb{display:none!important}
  html body .hadith-hero{min-height:0!important;padding-bottom:12px}

  /* bottom dock never hides the last content */
  html body{padding-bottom:calc(128px + env(safe-area-inset-bottom,0px))!important}
  html{scroll-padding-bottom:128px}
}

/* 5. Respect reduced motion everywhere */
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}}

@media (max-width:760px){
  /* remaining sub-12px text found on Namaz / Qur'an-from-Zero / Dashboard / Prayer / Tasbeeh */
  html body .step-card-actions button,html body .step-card-top strong,html body .step-card-phrase p,
  html body .z-trust-pills span,html body .z-btn,html body .z-arrow,html body .stats article span,
  html body label,html body .audio-legend span,html body .seg button.vt,html body .actions button,
  html body .home-progress-number,html body .home-progress-bottom span,html body .home-progress-bottom a,
  html body .progress-pill,html body .detail-topline span,html body .imam-checklist p,
  html body .z-meter-top b,html body .z-meter-top span,html body .z-list-title,html body .z-memory-card p,
  html body .z-game-prompt button,html body footer span,html body aside{font-size:12.5px!important}
  /* inline links that are tap targets: give them room without changing layout */
  html body main p a,html body footer a,html body .home-progress-bottom a{display:inline-block;padding:10px 4px;margin:-10px -4px}
  html body main a.cta-btn,html body main a.gold,html body main a.feat-btn,html body main a.dash-panel-link{display:inline-flex;align-items:center;justify-content:center}
  /* Qur'an hero decorative page must stay inside the screen */
  html body .quran-page,html body .quran-hero{overflow:hidden}
}

/* ===== v3: premium dark pass + page fixes (polish.css loads last on every page) ===== */
/* skip-link must be hidden everywhere (fixes.css is not loaded on every page) */
.skip-link{position:fixed;left:12px;top:-80px;z-index:100000;padding:12px 18px;border-radius:12px;background:#031d18;color:#fffdf6!important;font:700 14px/1.2 Inter,system-ui,sans-serif;text-decoration:none;border:2px solid #d8bc78;transition:top .15s ease}
.skip-link:focus,.skip-link:focus-visible{top:12px;z-index:100001}

/* Salah hero: buttons align with the copy, mosque caption no longer collides with the door */
.namaz-hero .hero-buttons{justify-content:flex-start}
.namaz-hero .mosque-door{display:none}
.namaz-hero .art-caption{bottom:26px}

/* Dark: replace the muddy brown surfaces with the site's emerald + gold */
html[data-theme="dark"] body .pc-card,
html[data-theme="dark"] body .surah-card,
html[data-theme="dark"] body .quran-dashboard-cta{background:var(--pc-lattice),linear-gradient(135deg,#183f38,#12332e 45%,#0d2926)!important;border-color:rgba(216,188,120,.24)!important;box-shadow:0 14px 34px rgba(0,0,0,.38),inset 0 1px 0 rgba(255,255,255,.05)!important}
html[data-theme="dark"] body .surah-card:hover{border-color:rgba(216,188,120,.6)!important;transform:translateY(-3px)}
html[data-theme="dark"] body .surah-search{background:#0d2b25!important;border-color:rgba(216,188,120,.28)!important}
html[data-theme="dark"] body .quran-search-section{background:linear-gradient(180deg,rgba(8,34,29,.55),rgba(8,34,29,.2))!important}

/* Dark: Qur'an hero */
html[data-theme="dark"] body .quran-hero{background:radial-gradient(circle at 82% 18%,rgba(216,188,120,.22),transparent 34%),linear-gradient(135deg,#0a2f29,#0f4034 62%,#14493c)!important;border-color:rgba(216,188,120,.3)!important;box-shadow:0 30px 70px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,255,255,.07)}
html[data-theme="dark"] body .quran-hero h1{color:#f7f1de!important}
html[data-theme="dark"] body .quran-hero h1 span{color:#e3c987!important}
html[data-theme="dark"] body .quran-hero p{color:#c9d8d0!important}
html[data-theme="dark"] body .quran-page{background:linear-gradient(135deg,#17493d 0%,#0e342c 60%,#0a2923 100%)!important;border-color:rgba(216,188,120,.55)!important;box-shadow:inset 0 0 0 2px rgba(216,188,120,.1),0 18px 30px rgba(0,0,0,.4)!important}
html[data-theme="dark"] body .page-border{border-color:rgba(216,188,120,.6)!important}
html[data-theme="dark"] body .page-border,html[data-theme="dark"] body .page-border *{color:#ecd9a0!important}
html[data-theme="dark"] body .quran-book-caption strong{color:#f1e6c2!important}
html[data-theme="dark"] body .quran-book-caption p{color:#b9cbc2!important}
html[data-theme="dark"] body .quran-hero .primary-quran-btn{background:linear-gradient(180deg,#f0d994,#d4af5a)!important;color:#0a2b25!important;border:1px solid rgba(255,236,170,.6)!important;box-shadow:0 10px 24px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.5)!important}
html[data-theme="dark"] body .quran-hero .hero-quran-btn{background:rgba(255,255,255,.05)!important;color:#f3e8c6!important;border:1px solid rgba(216,188,120,.5)!important}
html[data-theme="dark"] body .quran-hero .hero-quran-btn:hover{background:rgba(216,188,120,.15)!important}
html[data-theme="dark"] body .quran-rehal *{border-color:rgba(216,188,120,.65)!important}
html[data-theme="dark"] body .quran-rehal .rehal-left,html[data-theme="dark"] body .quran-rehal .rehal-right{background:linear-gradient(180deg,#0f3a31,#082721)!important}
html[data-theme="dark"] body .quran-book-caption .caption-arabic{color:#ecd9a0!important}
html[data-theme="dark"] body .quran-book-caption .caption-line{background:linear-gradient(90deg,transparent,#d8bc78,transparent)!important}
/* animated rim: calm at rest, full on hover/focus (looked patchy when 30+ cards were visible) */
body .pc-card > .pc-ring{opacity:.42;transition:opacity .3s ease}
body .pc-card:hover > .pc-ring,body .pc-card:focus-within > .pc-ring{opacity:1}
html[data-theme="dark"] body .pc-card > .pc-ring{opacity:.3}
html[data-theme="dark"] body .pc-card:hover > .pc-ring,html[data-theme="dark"] body .pc-card:focus-within > .pc-ring{opacity:.9}
.namaz-hero .namaz-primary{gap:12px;justify-content:center}

/* ===== v5: the gilded star-lattice box design on EVERY card, every page (dark mode) ===== */
:root{--pc-lattice:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='56'%3E%3Cg fill='none' stroke='%23d8bc78' stroke-opacity='.13'%3E%3Crect x='14' y='14' width='28' height='28'/%3E%3Crect x='14' y='14' width='28' height='28' transform='rotate(45 28 28)'/%3E%3C/g%3E%3C/svg%3E")}
/* card icon boxes: soft transparent gold, no heavy solid fill */
html[data-theme="dark"] body .pc-card :is(.hs-ico,.prophet-icon,.topic-icon,.intro-icon,.lesson-icon,.person-icon,.card-icon,.foundation-icon,.tradition-icon,.journey-step-icon,.today-icon,.featured-icon,.grading-icon,.start-card-icon,.daily-icon,.level-icon,.how-icon,.progress-icon,.trust-icon,.audio-studio-icon,.practice-icon,.takeaway-icon){
  color:#e3c987}
/* serif card titles (same family as the section headings) */
html[data-theme="dark"] body .pc-card :is(h3,h4),html[data-theme="dark"] body .pc-card .hs-tile strong,html[data-theme="dark"] body .hs-tile strong{
  font-family:"Cormorant Garamond","Noto Sans Devanagari","Noto Naskh Arabic","Amiri",Georgia,serif!important;font-weight:700!important;font-size-adjust:.47;letter-spacing:0!important;color:#fffdf5}
/* gold rim: bright again (the design you liked), full on hover */
html[data-theme="dark"] body .pc-card > .pc-ring{opacity:.85}
html[data-theme="dark"] body .pc-card:hover > .pc-ring,html[data-theme="dark"] body .pc-card:focus-within > .pc-ring{opacity:1}
html[data-theme="dark"] body :is(.start-card strong,.pc-card > strong,.pc-card > a > strong){font-family:"Cormorant Garamond","Noto Sans Devanagari","Noto Naskh Arabic","Amiri",Georgia,serif!important;font-weight:700!important;font-size-adjust:.47;letter-spacing:0!important}
html[data-theme="dark"] body :is(.quizbox,.special-card,.panel.reader){background:var(--pc-lattice),linear-gradient(135deg,#183f38,#12332e 45%,#0d2926)!important;border:1px solid rgba(216,188,120,.24)!important;box-shadow:0 14px 34px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.05)!important}

/* ===== v6: icons stand on their own - no box, no background behind them ===== */
body :is(.hs-ico,.prophet-icon,.topic-icon,.intro-icon,.lesson-icon,.person-icon,.card-icon,.foundation-icon,.tradition-icon,.journey-step-icon,.today-icon,.featured-icon,.grading-icon,.start-card-icon,.daily-icon,.level-icon,.how-icon,.progress-icon,.trust-icon,.audio-studio-icon,.practice-icon,.takeaway-icon,.welcome-icon,.checklist-icon,.next-icon,.message-icon,.message-symbol,.why-quran-icon,.empty-icon,.reminder-icon,.daily-symbol,.daily-learn-mark){background:none!important;background-image:none!important;border:0!important;box-shadow:none!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;
  justify-content:flex-start!important;justify-items:start!important;text-align:start!important;filter:none}
html:not([data-theme="dark"]) body :is(.hs-ico,.prophet-icon,.topic-icon,.intro-icon,.lesson-icon,.person-icon,.card-icon,.foundation-icon,.tradition-icon,.journey-step-icon,.today-icon,.featured-icon,.grading-icon,.start-card-icon,.daily-icon,.level-icon,.how-icon,.progress-icon,.trust-icon,.audio-studio-icon,.practice-icon,.takeaway-icon,.welcome-icon,.checklist-icon,.next-icon,.message-icon,.message-symbol,.why-quran-icon,.empty-icon,.reminder-icon,.daily-symbol,.daily-learn-mark){color:#a8792b}
html[data-theme="dark"] body :is(.hs-ico,.prophet-icon,.topic-icon,.intro-icon,.lesson-icon,.person-icon,.card-icon,.foundation-icon,.tradition-icon,.journey-step-icon,.today-icon,.featured-icon,.grading-icon,.start-card-icon,.daily-icon,.level-icon,.how-icon,.progress-icon,.trust-icon,.audio-studio-icon,.practice-icon,.takeaway-icon,.welcome-icon,.checklist-icon,.next-icon,.message-icon,.message-symbol,.why-quran-icon,.empty-icon,.reminder-icon,.daily-symbol,.daily-learn-mark){color:#e3c987}