/* clarity-welcome-compact-css */
/* Welcome compact — no scroll, single moon */
.cw-sub{font-size:.78rem!important;line-height:1.35!important;margin:0 0 .55rem!important}
.cw-track-kicker{font-size:.65rem!important;margin:0 0 .35rem!important}
.cw-steps{gap:.3rem!important;margin:0 0 .55rem!important}
.cw-step,.cw-step-btn{padding:.4rem .5rem!important;font-size:.78rem!important;line-height:1.3!important;border-radius:10px!important;gap:.45rem!important}
.cw-step-num{flex:0 0 1.25rem!important;height:1.25rem!important;font-size:.68rem!important}
.cw-actions{gap:.3rem!important;margin:0!important}
.cw-actions button{padding:.5rem .75rem!important;font-size:.82rem!important;border-radius:10px!important}
.cw-note{font-size:.65rem!important;margin:.4rem 0 0!important;line-height:1.3!important;opacity:.85}
.clarity-welcome-overlay{padding:.5rem!important;align-items:center!important}
/* Growth tree left of name banner (desktop) */
.today-journey-plaque{display:flex!important;flex-direction:row!important;flex-wrap:nowrap!important;align-items:flex-start!important;gap:.85rem!important}
.today-journey-plaque .deed-growth-tree{order:-1;display:flex!important;flex-shrink:0;margin:0}
.today-journey-plaque .tjp-main{flex:1;min-width:0}
@media(max-width:700px){
  .today-journey-plaque{flex-wrap:wrap!important}
  .today-journey-plaque .deed-growth-tree{order:0;margin:0 auto}
}

/* clarity-theme-scroll-type */
html[data-theme="dark"] body::before {
  background: transparent !important;
  opacity: 0 !important;
  content: none !important;
}
html { font-size: 16px; }
body { font-size: 0.92rem; line-height: 1.45; }
/* Panel isolation */
.tab-panel { display: none !important; }
.tab-panel.active, .tab-panel.is-active { display: block !important; }
html.door-rail-on #main-application-workspace {
  max-width: 100%;
  overflow-x: hidden;
  box-sizing: border-box;
}

/* nuros-viewport-layout-v56 */
html, body {
  max-width: 100vw !important;
  overflow-x: hidden !important;
  margin: 0 !important;
  padding: 0 !important;
  padding-bottom: calc(4.8rem + env(safe-area-inset-bottom, 0px)) !important;
}
/* Sticky top stack: global nav then banner */
.global-nav, nav.global-nav {
  position: sticky !important;
  top: 0 !important;
  z-index: 400 !important;
  width: 100% !important;
  max-width: 100vw !important;
  margin: 0 !important;
}
.banner {
  position: sticky !important;
  top: 0 !important;
  z-index: 350 !important; /* mobile override: clarity-mobile-unstick-banner */
  width: 100% !important;
  max-width: 100vw !important;
  margin: 0 !important;
  border-radius: 0 !important;
}
/* When global-nav present, banner sticks under it via flow */
.global-nav + .banner,
.global-nav ~ .banner {
  top: 0 !important;
}
.banner-overlay { width: 100% !important; max-width: 100% !important; }
/* Inline volume in radio row */
.stream-controls {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 0.3rem !important;
  width: 100% !important;
}
.volume-inline {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.3rem !important;
  background: rgba(255,255,255,0.2) !important;
  padding: 0.22rem 0.55rem !important;
  border-radius: 18px !important;
}
.volume-inline input[type="range"] {
  width: 72px !important;
  accent-color: #fff !important;
}
.volume-inline .mute-btn {
  background: none !important;
  border: none !important;
  color: #fff !important;
  font-size: 0.88rem !important;
  cursor: pointer !important;
  padding: 0.1rem !important;
}
.stream-stop-btn { min-width: auto !important; padding: 0.32rem 0.55rem !important; }
/* Hide separate volume row if leftover */
#banner-volume-row, .volume-control.volume-row { display: none !important; }
/* Kill My Journey path dock leak site-wide */
#nuros-daily-dock,
#nuros-daily-dock-disabled,
#daily-dock-toggle,
#nuros-daily-body,
.daily-dock-toggle,
#one-action-strip,
.one-action-strip,
#clarity-oath-strip,
.domain-promise,
#clarity-today-surface,
.card-journey-moved {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  max-height: 0 !important;
  overflow: hidden !important;
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
  pointer-events: none !important;
}
/* Bottom rail */
#clarity-door-rail {
  display: flex !important;
  position: fixed !important;
  bottom: 0 !important;
  left: 0 !important;
  right: 0 !important;
  top: auto !important;
  transform: none !important;
  width: 100% !important;
  max-width: 100vw !important;
  z-index: 500 !important;
  flex-direction: row !important;
  background: rgba(8, 28, 22, 0.98) !important;
  border-top: 2px solid rgba(212,180,90,0.45) !important;
  border-radius: 14px 14px 0 0 !important;
  padding: 0.35rem 0.3rem calc(0.35rem + env(safe-area-inset-bottom, 0px)) !important;
}
nav.nav-tabs { display: none !important; }
/* Full width no side pad */
html.door-rail-on body,
html.door-rail-on .banner,
html.door-rail-on .global-nav,
html.door-rail-on #main-application-workspace {
  padding-left: 0 !important;
  margin-left: 0 !important;
  width: 100% !important;
}
.tab-panel, #main-application-workspace, .page-wrapper {
  padding-left: 0.5rem !important;
  padding-right: 0.5rem !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

/* clarity-isra-banner-plaque-v1 */
/* Isra / next-event: match calendar plaque fonts (no blue link fight) */
#clarity-top-duo .hijri-next-event,
#clarity-top-duo #hijri-ms-event,
#clarity-top-duo .hijri-next-event * {
  font-family: Inter, system-ui, sans-serif !important;
  font-size: 0.54rem !important;
  font-weight: 500 !important;
  line-height: 1.3 !important;
  color: rgba(245,230,184,0.95) !important;
  text-decoration: none !important;
}
#clarity-top-duo a.hijri-event-link {
  color: #f5e6b8 !important;
  text-decoration: none !important;
  font-size: 0.54rem !important;
  font-weight: 600 !important;
  border-bottom: 1px dotted rgba(212,180,90,0.45);
}
#clarity-top-duo .ms-days,
#clarity-top-duo #hijri-ms-event .ms-days {
  display: inline-block !important;
  font-size: 0.52rem !important;
  font-weight: 700 !important;
  background: rgba(255,255,255,0.14) !important;
  color: #fff !important;
  padding: 0.05rem 0.32rem !important;
  border-radius: 6px !important;
  margin-left: 0.15rem !important;
}

/* Banner center as its own beautiful plaque */
#clarity-top-duo .banner-center {
  background: linear-gradient(165deg, rgba(12,40,32,0.55) 0%, rgba(6,24,18,0.62) 100%) !important;
  border-radius: 16px !important;
  box-shadow:
    inset 0 0 0 1.5px rgba(212,180,90,0.35),
    inset 0 1px 0 rgba(255,255,255,0.06),
    0 4px 16px rgba(0,0,0,0.25) !important;
  padding: 0.35rem 0.55rem 0.4rem !important;
  box-sizing: border-box !important;
}
#clarity-top-duo .banner-center .stream-controls {
  max-width: 100% !important;
}

/* Section bookmark chips */

html[data-theme="dark"]
html[data-theme="dark"]

/* Search index restore strip */
.clarity-search-index-frame {
  margin: 0.75rem 0 1rem;
  padding: 0.85rem 1rem;
  border-radius: 14px;
  border: 1px solid rgba(42,95,122,0.25);
  background: linear-gradient(145deg, rgba(232,241,246,0.9), rgba(255,253,248,0.95));
}
.clarity-search-index-frame h3 {
  font-family: "Cormorant Garamond", serif;
  font-size: 1.1rem;
  color: var(--sky, #2a5f7a);
  margin: 0 0 0.35rem;
}
.clarity-search-index-frame p {
  font-size: 0.82rem;
  color: var(--text-muted, #5c6b62);
  margin: 0 0 0.5rem;
  line-height: 1.45;
}
.clarity-search-index-frame .csi-links {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
}
.clarity-search-index-frame .csi-links a {
  font-size: 0.78rem;
  font-weight: 600;
  padding: 0.28rem 0.55rem;
  border-radius: 8px;
  background: rgba(42,95,122,0.1);
  color: var(--sky, #2a5f7a);
  text-decoration: none;
}
html[data-theme="dark"] .clarity-search-index-frame {
  background: linear-gradient(145deg, rgba(26,40,48,0.9), rgba(20,30,25,0.95));
  border-color: rgba(106,159,181,0.3);
}
html[data-theme="dark"] .clarity-search-index-frame h3,
html[data-theme="dark"] .clarity-search-index-frame .csi-links a { color: #6a9fb5; }

/* clarity-tajweed-read-quicknav-v1 */
/* Tajweed always-visible read surface */
.tj-lmr-read-panel {
  margin: 0.65rem 0 0.75rem;
  padding: 0.85rem 1rem;
  border-radius: 14px;
  border: 1px solid rgba(212,180,90,0.4);
  background: linear-gradient(165deg, rgba(12,40,32,0.55), rgba(6,22,18,0.7));
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.04), 0 4px 14px rgba(0,0,0,0.15);
  text-align: center;
}
.tj-lmr-read-label {
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #d4b45a;
  margin-bottom: 0.35rem;
}
.tj-lmr-ar-read {
  font-family: "Scheherazade New", "Amiri", "Noto Naskh Arabic", serif !important;
  font-size: 1.65rem !important;
  line-height: 2.15 !important;
  color: #f5f0e6 !important;
  direction: rtl;
  margin: 0.4rem 0 !important;
  min-height: 2.5rem;
}
#tj-lmr-meta-read {
  font-size: 0.8rem;
  color: rgba(245,230,184,0.85);
  margin-bottom: 0.25rem;
}
html[data-theme="light"] .tj-lmr-read-panel {
  background: linear-gradient(165deg, #f7f3ea, #eef6f1);
  border-color: rgba(13,79,60,0.2);
}
html[data-theme="light"] .tj-lmr-ar-read { color: #0d4f3c !important; }
html[data-theme="light"] .tj-lmr-read-label { color: #0d4f3c; }
html[data-theme="light"] #tj-lmr-meta-read { color: #5c6b62; }

/* Also enlarge step1 ayah card */
#tj-lmr-ar {
  font-size: 1.55rem !important;
  line-height: 2.15 !important;
  min-height: 2.2rem;
}

.callig-center-pill {
  border-radius: 999px !important;
  font-weight: 700 !important;
  font-size: 0.78rem !important;
  padding: 0.28rem 0.7rem !important;
  background: #0d4f3c !important;
  color: #f5e6b8 !important;
  border: 1px solid rgba(212,180,90,0.4) !important;
  white-space: nowrap;
  cursor: pointer;
}
.callig-center-pill:hover { filter: brightness(1.08); }

/* Quick access dock — fixed, on-device */
#clarity-quick-nav {
  position: fixed;
  bottom: calc(4.25rem + env(safe-area-inset-bottom, 0px));
  left: 50%;
  transform: translateX(-50%);
  z-index: 1400;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.35rem;
  max-width: min(96vw, 420px);
  width: max-content;
  pointer-events: none;
}
#clarity-quick-nav * { pointer-events: auto; }
#clarity-qn-toggle {
  border-radius: 999px;
  border: 1px solid rgba(212,180,90,0.45);
  background: rgba(13,79,60,0.94);
  color: #f5e6b8;
  font-weight: 700;
  font-size: 0.8rem;
  padding: 0.45rem 0.9rem;
  box-shadow: 0 4px 18px rgba(0,0,0,0.35);
  cursor: pointer;
}
#clarity-qn-panel {
  display: none;
  width: min(94vw, 400px);
  max-height: 50vh;
  overflow: auto;
  border-radius: 16px;
  border: 1px solid rgba(212,180,90,0.35);
  background: rgba(12,22,18,0.96);
  color: #e8f0ea;
  padding: 0.75rem 0.85rem;
  box-shadow: 0 8px 28px rgba(0,0,0,0.4);
  -webkit-overflow-scrolling: touch;
}
#clarity-quick-nav.open #clarity-qn-panel { display: block; }
#clarity-qn-panel h4 {
  margin: 0 0 0.4rem;
  font-size: 0.85rem;
  color: #d4b45a;
  font-weight: 700;
}
#clarity-qn-panel .qn-list {
  list-style: none; margin: 0 0 0.55rem; padding: 0;
  display: flex; flex-wrap: wrap; gap: 0.3rem;
}
#clarity-qn-panel .qn-list a {
  display: inline-flex; align-items: center; gap: 0.2rem;
  font-size: 0.74rem; font-weight: 600;
  padding: 0.28rem 0.5rem; border-radius: 999px;
  background: rgba(255,255,255,0.08);
  color: #e8f0ea; text-decoration: none;
  border: 1px solid rgba(255,255,255,0.12);
  max-width: 100%;
}
#clarity-qn-panel .qn-list a.qn-pin {
  background: rgba(212,180,90,0.2);
  border-color: rgba(212,180,90,0.4);
  color: #f5e6b8;
}
#clarity-qn-panel .qn-empty {
  font-size: 0.75rem; opacity: 0.7; font-style: italic; margin: 0 0 0.4rem;
}
#clarity-qn-panel .qn-row {
  display: flex; gap: 0.35rem; flex-wrap: wrap; margin-top: 0.35rem;
}
#clarity-qn-panel button.qn-btn {
  font-size: 0.72rem; font-weight: 600;
  padding: 0.28rem 0.55rem; border-radius: 8px;
  border: 1px solid rgba(255,255,255,0.15);
  background: rgba(255,255,255,0.08);
  color: #e8f0ea; cursor: pointer;
}
html[data-theme="light"] #clarity-qn-panel {
  background: rgba(255,253,248,0.98);
  color: #1a2a22;
  border-color: rgba(13,79,60,0.2);
}
html[data-theme="light"] #clarity-qn-panel h4 { color: #0d4f3c; }
html[data-theme="light"] #clarity-qn-panel .qn-list a {
  background: rgba(13,79,60,0.08); color: #0d4f3c; border-color: rgba(13,79,60,0.15);
}
html[data-theme="light"] #clarity-qn-panel .qn-list a.qn-pin {
  background: rgba(212,180,90,0.25); color: #5c4a12;
}

/* clarity-deepen-journey-only-v1 */
/* Deepen your study — Journey only; hide leaks elsewhere */
.tab-panel:not(#tab-journey) #deepen-study-card,
#tab-notes #deepen-study-card,
#tab-seerah #deepen-study-card,
#tab-lectures #deepen-study-card,
#tab-search #deepen-study-card {
  display: none !important;
}
#tab-journey #deepen-study-card {
  display: block !important;
}

/* clarity-uft-registry-force-v1 */
#user-family-tree-card details.uft-registry,
#user-family-tree-card #uft-registry-box,
#user-family-tree-card #uft-reg-new-section,
#user-family-tree-card #uft-reg-saved-section,
#user-family-tree-card #uft-build-section,
#user-family-tree-card #uft-reg-loaded-section,
#user-family-tree-card .uft-data-dock,
#user-family-tree-card .uft-chrome {
  display: block !important;
  visibility: visible !important;
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
  opacity: 1 !important;
}
#user-family-tree-card #uft-registry-box[open] .uft-reg-list,
#user-family-tree-card details[open] .uft-reg-list {
  display: block !important;
}
#user-family-tree-card .uft-reg-list {
  display: block !important;
  min-height: 2rem;
}
#user-family-tree-card .uft-data-dock {
  margin-top: 0.75rem !important;
  padding: 0.65rem !important;
  border: 1px solid rgba(212,180,90,0.3) !important;
  border-radius: 12px !important;
}

/* clarity-uft-uncollapse-v1 */
#user-family-tree-card .uft-editor.uft-data-dock,
#user-family-tree-card #uft-editor {
  display: block !important;
}
#user-family-tree-card .uft-editor .uft-dock-body,
#user-family-tree-card .uft-editor:not(.collapsed) .uft-dock-body {
  display: block !important;
  visibility: visible !important;
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
}
#user-family-tree-card .uft-editor.collapsed .uft-dock-body {
  display: block !important; /* force open inside vault */
}
#user-family-tree-card #uft-registry-box {
  display: block !important;
  margin: 0.75rem 0 !important;
}

/* clarity-vault-consolidated-v1 */
/* Simplified vault — heir collapsed + original fiqh cards */

#tab-notes.active .amana-vault-gate {
  display: grid !important;
  grid-template-columns: 1fr;
  gap: 0.55rem;
  max-width: 28rem !important;
  width: calc(100% - 1.25rem) !important;
  margin: 1rem auto 1.25rem !important;
  box-sizing: border-box !important;
  padding: 1.1rem 1.15rem 1.25rem;
  border-radius: 18px;
  border: 1px solid rgba(212,180,90,0.4);
  background: linear-gradient(165deg, rgba(12,22,18,0.98), rgba(8,16,14,0.99));
}
#tab-notes.active.amana-unlocked .amana-vault-gate { display: none !important; }
#tab-notes.active.amana-locked #amana-vault-interior { display: none !important; }
#tab-notes.active.amana-unlocked #amana-vault-interior {
  display: flex !important;
  flex-direction: column !important;
  gap: 1rem !important;
  width: 100% !important;
}
#tab-notes .amana-vault-gate .av-field { position: relative !important; }
#tab-notes .amana-vault-gate .av-eye {
  position: absolute !important; right: 0.45rem !important; top: 50% !important;
  transform: translateY(-50%) !important; z-index: 6 !important;
  width: 2rem; height: 2rem; border-radius: 8px; cursor: pointer;
  background: rgba(255,255,255,0.08); border: 1px solid rgba(255,255,255,0.15);
}
#tab-notes .amana-vault-gate input { padding-right: 2.75rem !important; }

/* Containment */
html body #tab-notes:not(.active),
body[data-active-tab]:not([data-active-tab="notes"]) #tab-notes {
  display: none !important;
  visibility: hidden !important;
  position: absolute !important;
  left: -99999px !important;
  height: 1px !important;
  overflow: hidden !important;
  pointer-events: none !important;
}
html body #tab-notes.active {
  display: block !important;
  visibility: visible !important;
  position: relative !important;
  left: auto !important;
  height: auto !important;
  overflow: visible !important;
  pointer-events: auto !important;
}

/* Heir readiness collapsed */
#tab-notes.active.amana-unlocked details.amana-heir-dd {
  border: 1px solid rgba(212,180,90,0.35);
  border-radius: 14px;
  background: rgba(0,0,0,0.2);
  margin: 0 0 0.5rem;
}
#tab-notes.active.amana-unlocked details.amana-heir-dd > summary {
  cursor: pointer;
  list-style: none;
  padding: 0.85rem 1rem;
  font-weight: 700;
  color: #d4b45a;
  background: rgba(13,79,60,0.35);
}
#tab-notes.active.amana-unlocked details.amana-heir-dd > summary::-webkit-details-marker { display: none; }
#tab-notes.active.amana-unlocked details.amana-heir-dd:not([open]) > .amana-heir-body {
  display: none !important;
}
#tab-notes.active.amana-unlocked details.amana-heir-dd[open] > .amana-heir-body {
  display: block !important;
  padding: 0.75rem 0.9rem 1rem;
}

/* Original fiqh cards — full normal stack, no overlay framework */
#tab-notes.active.amana-unlocked #user-family-tree-card,
#tab-notes.active.amana-unlocked #faraid-card,
#tab-notes.active.amana-unlocked #wasiyyah-card {
  display: block !important;
  position: relative !important;
  z-index: 1 !important;
  width: 100% !important;
  margin: 0 0 1.15rem !important;
  float: none !important;
  clear: both !important;
}
#tab-notes.active.amana-unlocked #uft-stage {
  max-height: none;
  min-height: min(42vh, 22rem);
  overflow: auto;
}

/* Kill leftover workflow / tool-dd chrome if present */
#tab-notes #fiqh-workflow-card,
#tab-notes #fiqh-workflow-jumps,
#tab-notes #vault-online-resources,
#tab-notes details.vault-tool-dd,
#tab-notes details.vault-fiqh-section {
  display: none !important;
}

/* clarity-fiqh-clean-siblings-v1 */
#tab-notes.active.amana-unlocked #amana-fiqh-tools-wrap {
  display: flex !important;
  flex-direction: column !important;
  gap: 1.35rem !important;
  width: 100% !important;
}
#tab-notes.active.amana-unlocked #user-family-tree-card,
#tab-notes.active.amana-unlocked #faraid-card,
#tab-notes.active.amana-unlocked #wasiyyah-card {
  display: block !important;
  position: relative !important;
  width: 100% !important;
  margin: 0 !important;
  float: none !important;
  clear: both !important;
}
#tab-notes.active.amana-unlocked #uft-stage {
  max-height: none;
  min-height: min(42vh, 22rem);
  overflow: auto;
}

/* clarity-meme-studio-glory-v1 */
/* —— Meme Studio glory layout —— */
#meme-card {
  border-radius: 18px !important;
  border: 1px solid rgba(184,146,42,0.35) !important;
  border-top: 3px solid var(--gold, #b8922a) !important;
  background: linear-gradient(165deg, rgba(255,253,248,0.98), rgba(246,241,231,0.95)) !important;
  box-shadow: 0 8px 28px rgba(15,76,58,0.08) !important;
  padding: 0.85rem 0.9rem 1.1rem !important;
}
html[data-theme="dark"] #meme-card {
  background: linear-gradient(165deg, #121c18, #0c1612) !important;
  border-color: rgba(201,162,39,0.35) !important;
}
#meme-card > h2 {
  font-family: 'Cormorant Garamond', Georgia, serif !important;
  font-size: 1.25rem !important;
  letter-spacing: 0.02em;
  display: flex;
  align-items: center;
  gap: 0.45rem;
  flex-wrap: wrap;
}
#meme-studio-root.meme-realign {
  display: flex !important;
  flex-direction: column !important;
  gap: 0.7rem !important;
}
#meme-studio-root .meme-bar-bg {
  order: -1;
  padding: 0.5rem 0.45rem !important;
  border-radius: 14px !important;
  background: rgba(15,76,58,0.07) !important;
  border: 1px solid rgba(15,76,58,0.12) !important;
}
html[data-theme="dark"] #meme-studio-root .meme-bar-bg {
  background: rgba(201,162,39,0.08) !important;
  border-color: rgba(201,162,39,0.18) !important;
}
#meme-studio-root .meme-tool-label {
  font-size: 0.68rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  color: var(--accent, #0f4c3a) !important;
  margin-bottom: 0.25rem;
}
#meme-studio-root .mv-chip {
  font-size: 0.76rem !important;
  padding: 0.34rem 0.72rem !important;
  border-radius: 999px !important;
  border: 1px solid rgba(15,76,58,0.2) !important;
  background: rgba(255,255,255,0.85) !important;
  cursor: pointer;
  transition: transform 0.12s, box-shadow 0.12s;
}
#meme-studio-root .mv-chip:hover {
  transform: translateY(-1px);
  box-shadow: 0 3px 10px rgba(15,76,58,0.12);
}
html[data-theme="dark"] #meme-studio-root .mv-chip {
  background: rgba(255,255,255,0.06) !important;
  border-color: rgba(255,255,255,0.14) !important;
  color: #e8f0ea;
}
#meme-stage-wrap, #meme-stage {
  border-radius: 14px !important;
  overflow: hidden;
}
#meme-canvas {
  border-radius: 12px;
  max-width: 100%;
  box-shadow: 0 4px 20px rgba(0,0,0,0.15);
}
/* Three-line caption fields */
#meme-top-input, #meme-mid-input, #meme-bottom-input {
  width: 100% !important;
  border-radius: 12px !important;
  border: 1px solid rgba(15,76,58,0.18) !important;
  padding: 0.55rem 0.75rem !important;
  font-size: 0.9rem !important;
  background: rgba(255,255,255,0.9) !important;
}
#meme-bottom-input {
  border-color: rgba(184,146,42,0.45) !important;
  background: linear-gradient(90deg, rgba(245,237,214,0.5), rgba(255,255,255,0.9)) !important;
  font-weight: 600 !important;
  font-size: 0.85rem !important;
  color: #5c4a12 !important;
}
html[data-theme="dark"] #meme-bottom-input {
  background: rgba(201,162,39,0.12) !important;
  color: #f5e6a8 !important;
  border-color: rgba(201,162,39,0.4) !important;
}
.meme-ref-hint {
  font-size: 0.72rem;
  color: var(--text-muted, #5c6b62);
  margin: 0.15rem 0 0.35rem;
}
.clarity-meme-btn {
  display: inline-flex !important;
  align-items: center;
  gap: 0.3rem;
  padding: 0.34rem 0.75rem !important;
  font-size: 0.78rem !important;
  font-weight: 650;
  border-radius: 999px !important;
  cursor: pointer;
  background: linear-gradient(135deg, #0f4c3a, #1a6b52) !important;
  color: #f7f3eb !important;
  border: none !important;
}
.clarity-meme-btn:hover { filter: brightness(1.08); }
#meme-fetch-status, #meme-rrra-status {
  font-size: 0.72rem !important;
  min-height: 1em;
  color: var(--accent, #0f4c3a) !important;
}

/* clarity-meme-lines-v1 */
#meme-studio-root textarea#meme-top-input,
#meme-studio-root textarea#meme-mid-input,
#meme-studio-root textarea#meme-bottom-input {
  display: none !important;
  width: 100% !important;
  margin: 0.15rem 0 0.45rem !important;
  border-radius: 12px !important;
  border: 1px solid rgba(15,76,58,0.2) !important;
  padding: 0.5rem 0.7rem !important;
  font-size: 0.88rem !important;
  font-family: inherit !important;
  resize: vertical;
  background: rgba(255,255,255,0.92) !important;
  color: inherit !important;
}
#meme-studio-root textarea#meme-bottom-input {
  border-color: rgba(184,146,42,0.5) !important;
  background: linear-gradient(90deg, rgba(245,237,214,0.55), rgba(255,255,255,0.95)) !important;
  font-weight: 650 !important;
  color: #4a3b0c !important;
  min-height: 2.4rem !important;
}
html[data-theme="dark"] #meme-studio-root textarea#meme-bottom-input {
  background: rgba(201,162,39,0.14) !important;
  color: #f5e6a8 !important;
}
.meme-line-lab {
  display: block;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--accent, #0f4c3a);
  margin-top: 0.25rem;
}
label.mv-upload, #meme-file { display: none !important; }

/* clarity-meme-layout-groups-v1 */
#meme-studio-root.meme-glory-layout,
#meme-studio-root.meme-realign {
  display: flex !important;
  flex-direction: column !important;
  gap: 0.65rem !important;
}
/* Group 1: backgrounds only */
#meme-studio-root .meme-bar-bg {
  order: 1;
  padding: 0.5rem 0.45rem;
  border-radius: 14px;
  background: rgba(15,76,58,0.06);
  border: 1px solid rgba(15,76,58,0.12);
}
/* Group 2: preview */
#meme-studio-root .meme-preview-only {
  order: 2;
}
/* Group 3: fetch / learn-as chips */
#meme-studio-root #meme-rrra-fetch-bar,
#meme-studio-root .meme-bar-fetch {
  order: 3;
  padding: 0.45rem;
  border-radius: 14px;
  background: rgba(184,146,42,0.08);
  border: 1px solid rgba(184,146,42,0.2);
}
/* Group 4: size / outline scales together */
#meme-studio-root #meme-line-sizes,
#meme-studio-root .meme-bar-scale,
#meme-studio-root .meme-size-row-h {
  order: 4;
}
/* Group 5: export actions */
#meme-studio-root .meme-bar-export {
  order: 5;
}
/* Hide typing surfaces */
#meme-studio-root textarea#meme-top-input,
#meme-studio-root textarea#meme-mid-input,
#meme-studio-root textarea#meme-bottom-input,
#meme-studio-root .meme-line-lab,
#meme-ref-hint {
  display: none !important;
}
/* Stage a bit larger */
#meme-stage-wrap {
  max-width: 520px;
  margin: 0 auto;
}
#meme-canvas {
  width: 100% !important;
  height: auto !important;
}
/* Chip rows denser */
#meme-studio-root .meme-chip-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  align-items: center;
}

/* clarity-meme-handles-v1 */
#meme-stage .meme-text-box,
#meme-box-top, #meme-box-mid, #meme-box-bottom {
  background: transparent !important;
  border: 1px dashed rgba(255,255,255,0.2) !important;
  box-shadow: none !important;
}
.meme-drag-handle {
  background: rgba(0,0,0,0.25) !important;
  color: rgba(255,255,255,0.5) !important;
  opacity: 0.4 !important;
  font-size: 0.62rem !important;
  padding: 0.12rem 0.4rem !important;
}
.meme-text-box:hover .meme-drag-handle { opacity: 0.75 !important; }
#meme-studio-root .meme-bar-fetch,
#meme-rrra-fetch-bar {
  order: 3 !important;
  padding: 0.55rem 0.6rem !important;
  border-radius: 14px !important;
  background: rgba(184,146,42,0.1) !important;
  border: 1px solid rgba(184,146,42,0.3) !important;
}
#meme-studio-root .meme-bar-scale { order: 5 !important; }
#meme-studio-root .meme-bar-bg { order: 1 !important; }
#meme-studio-root .meme-preview-only { order: 2 !important; }
/* mid caption: don't force ALL CAPS overflow off edges */
#meme-canvas { max-width: 100%; }

/* clarity-meme-strip-order-v1 */
#meme-studio-root .meme-bar-bg { order: 1 !important; }
#meme-studio-root .meme-preview-only { order: 2 !important; }
#meme-studio-root .meme-bar-scale { order: 3 !important; } /* closest under canvas */
#meme-studio-root .meme-bar-fetch,
#meme-rrra-fetch-bar { order: 4 !important; }
#meme-studio-root .meme-bar:has(#meme-ratio),
#meme-studio-root .meme-bar-export { order: 5 !important; }

/* clarity-meme-handles-from5tabs-v1 */
#meme-stage .meme-text-box,
#meme-box-top, #meme-box-mid, #meme-box-bottom {
  background: transparent !important;
  border: 1px dashed rgba(255,255,255,0.2) !important;
  box-shadow: none !important;
}
.meme-drag-handle {
  background: rgba(0,0,0,0.3) !important;
  color: rgba(255,255,255,0.55) !important;
  opacity: 0.4 !important;
  font-size: 0.62rem !important;
  padding: 0.12rem 0.4rem !important;
  border: none !important;
}
.meme-text-box:hover .meme-drag-handle { opacity: 0.85 !important; }

/* clarity-meme-wm-sep-v1 */
/* Hide DOM overlay site chip — reference is painted on canvas bar only */
#meme-wm-link .wm-hit-label,
#meme-wm-link span {
  opacity: 0 !important;
  font-size: 0 !important;
}
#meme-wm-link {
  /* keep hit area minimal / non-visual */
  opacity: 0.01 !important;
  pointer-events: none !important;
}

/* clarity-amana-secure-login-css-v1 */
#amana-pass-unlock, #amana-pass-new, #amana-pass-confirm {
  /* discourage browser password save UI */
  letter-spacing: 0.04em;
}
#amana-lockout-panel:not([hidden]) {
  animation: amanaLockIn 0.25s ease;
}
@keyframes amanaLockIn {
  from { opacity: 0; transform: translateY(6px); }
  to { opacity: 1; transform: none; }
}
#amana-attempts-lab {
  color: rgba(232,180,160,0.9);
}

/* clarity-amana-fortress-css-v1 */
/* Fortified capsule — sealed = not interactable, not announced, collapsed */
#amana-vault-interior.amana-fortress-capsule[data-amana-sealed="1"],
#amana-vault-interior[data-amana-sealed="1"] {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
  content-visibility: hidden;
}
#amana-vault-interior.amana-fortress-capsule[data-amana-sealed="0"] {
  display: block !important;
  visibility: visible !important;
  pointer-events: auto !important;
  content-visibility: auto;
}
/* Gate only when locked */
#tab-notes.amana-locked #amana-vault-gate { display: block !important; }
#tab-notes.amana-unlocked #amana-vault-gate { display: none !important; }
#tab-notes.amana-locked #amana-vault-interior { display: none !important; }

/* clarity-callig-night-nuke-v1 */
/* DOUBLE NUKE — calligraphy pad/night must win over inline + earlier rules */
html[data-theme="dark"] #callig-lab-card,
html[data-theme="dark"] #callig-lab-card.card,
html[data-theme="dark"] #tab-reminder #callig-lab-card,
html[data-theme="dark"] .tab-panel #callig-lab-card {
  background: #121a16 !important;
  background-color: #121a16 !important;
  background-image: none !important;
  border-color: rgba(201,162,39,0.3) !important;
  color: #e8f0ea !important;
}
html[data-theme="dark"] #callig-lab-card * {
  border-color: rgba(255,255,255,0.12);
}
html[data-theme="dark"] #callig-lab-card h2,
html[data-theme="dark"] #callig-lab-card h3,
html[data-theme="dark"] #callig-lab-card label,
html[data-theme="dark"] #callig-lab-card .card-title {
  color: #f0e6c8 !important;
}
html[data-theme="dark"] #callig-lab-card p,
html[data-theme="dark"] #callig-lab-card .muted,
html[data-theme="dark"] #callig-lab-card span:not(.rrra-badge) {
  color: rgba(210,220,215,0.82) !important;
}
/* Pad — cream fighters lose */
html[data-theme="dark"] #callig-pad,
html[data-theme="dark"] #callig-lab-card #callig-pad,
html[data-theme="dark"] #callig-lab-card .callig-pad,
html[data-theme="dark"] #callig-lab-card [id*="pad"],
html[data-theme="dark"] #callig-lab-card canvas#callig-canvas,
html[data-theme="dark"] canvas#callig-canvas {
  background: #1a2420 !important;
  background-color: #1a2420 !important;
  background-image: repeating-linear-gradient(
    transparent, transparent 31px,
    rgba(255,255,255,0.07) 31px, rgba(255,255,255,0.07) 32px
  ) !important;
  border: 1px solid rgba(255,255,255,0.15) !important;
  box-shadow: inset 0 0 0 1px rgba(0,0,0,0.4) !important;
  color: #e8f0ea !important;
}
html[data-theme="dark"] #callig-lab-card input,
html[data-theme="dark"] #callig-lab-card textarea,
html[data-theme="dark"] #callig-lab-card select {
  background: #0c1210 !important;
  background-color: #0c1210 !important;
  color: #e8f0ea !important;
  border: 1px solid rgba(255,255,255,0.2) !important;
  caret-color: #d4b45a !important;
}
html[data-theme="dark"] #callig-lab-card input::placeholder,
html[data-theme="dark"] #callig-lab-card textarea::placeholder {
  color: rgba(180,190,185,0.45) !important;
  opacity: 1 !important;
}
html[data-theme="dark"] #callig-lab-card button:not(.rrra-badge) {
  background: rgba(255,255,255,0.1) !important;
  color: #e8f0ea !important;
  border: 1px solid rgba(255,255,255,0.18) !important;
}
html[data-theme="dark"] #callig-lab-card button:disabled {
  opacity: 0.45 !important;
}
html[data-theme="dark"] #callig-lab-card [style*="background:#fff"],
html[data-theme="dark"] #callig-lab-card [style*="background: #fff"],
html[data-theme="dark"] #callig-lab-card [style*="background:#f"],
html[data-theme="dark"] #callig-lab-card [style*="background: #f"],
html[data-theme="dark"] #callig-lab-card [style*="background:#FF"],
html[data-theme="dark"] #callig-lab-card [style*="background:white"],
html[data-theme="dark"] #callig-lab-card [style*="background: white"],
html[data-theme="dark"] #callig-lab-card [style*="background-color:#fff"],
html[data-theme="dark"] #callig-lab-card [style*="background-color: #fff"],
html[data-theme="dark"] #callig-lab-card [style*="background-color:#f"] {
  background: #1a2420 !important;
  background-color: #1a2420 !important;
}
html[data-theme="dark"] #callig-lab-card [style*="color:#1"],
html[data-theme="dark"] #callig-lab-card [style*="color: #1"],
html[data-theme="dark"] #callig-lab-card [style*="color:#0"],
html[data-theme="dark"] #callig-lab-card [style*="color:var(--text"] {
  color: rgba(220,230,225,0.9) !important;
}
html[data-theme="dark"] #callig-lab-card div[style*="background:linear"],
html[data-theme="dark"] #callig-lab-card div[style*="background: linear"] {
  background: linear-gradient(135deg, #1a2822, #121a16) !important;
}

/* clarity-shell-landing-v3 */
html[data-shell-mode="landing"] .shell-landing-hide { display: none !important; }
html[data-shell-mode="companion"] #clarity-day-landing { display: none !important; }
html[data-shell-mode="landing"] #clarity-door-rail {
  display: none !important; visibility: hidden !important; pointer-events: none !important;
}
html[data-shell-mode="companion"] #clarity-door-rail {
  display: flex !important; visibility: visible !important;
}
#clarity-reopen-bar {
  display: flex; flex-wrap: wrap; align-items: center; gap: 0.4rem;
  margin: 0.4rem 0.55rem; padding: 0.4rem 0.55rem; border-radius: 12px;
  border: 1px solid rgba(184,146,42,0.35); background: rgba(13,79,60,0.1);
}
html[data-theme="dark"] #clarity-reopen-bar, html[data-theme="night"] #clarity-reopen-bar {
  background: rgba(13,79,60,0.85); color: #f5faf7;
}
#clarity-reopen-bar .crb-label { font-size: 0.7rem; font-weight: 800; text-transform: uppercase; letter-spacing: 0.04em; opacity: 0.85; }
#clarity-reopen-bar .crb-btn {
  border-radius: 999px; border: 1px solid rgba(212,180,90,0.45);
  background: rgba(212,180,90,0.18); color: inherit;
  padding: 0.28rem 0.7rem; font-size: 0.78rem; font-weight: 700; cursor: pointer;
}
#clarity-reopen-bar .crb-open { background: #c9a227; color: #0c1a14; border-color: #c9a227; }
#clarity-reopen-bar .crb-hint { font-size: 0.72rem; opacity: 0.75; }

#clarity-day-landing {
  display: flex; flex-direction: column; gap: 0.55rem;
  margin: 0.35rem 0.55rem 1rem;
}
.dual-tiles {
  display: grid; grid-template-columns: 1fr 1fr; gap: 0.5rem;
}
@media (max-width: 700px) { .dual-tiles { grid-template-columns: 1fr; } }
.dual-tile {
  display: block; text-decoration: none; color: inherit;
  border-radius: 14px; border: 1px solid rgba(184,146,42,0.3);
  background: linear-gradient(165deg, rgba(244,250,246,0.96), rgba(232,243,236,0.98));
  padding: 0.75rem 0.85rem;
}
html[data-theme="dark"] .dual-tile, html[data-theme="night"] .dual-tile {
  background: linear-gradient(165deg, rgba(15,36,28,0.96), rgba(10,24,18,0.99)); color: #e8f0ea;
}
.dual-tile strong { display: block; font-size: 0.95rem; margin: 0.15rem 0; }
.dual-tile small { font-size: 0.8rem; opacity: 0.85; line-height: 1.35; }

.cdl-card {
  border-radius: 14px; border: 1px solid rgba(184,146,42,0.3);
  padding: 0.75rem 0.9rem;
  background: linear-gradient(165deg, rgba(244,250,246,0.96), rgba(232,243,236,0.98));
  color: #0c1a14;
}
html[data-theme="dark"] .cdl-card, html[data-theme="night"] .cdl-card {
  background: linear-gradient(165deg, rgba(15,36,28,0.96), rgba(10,24,18,0.99)); color: #e8f0ea;
}
.cdl-head { display: flex; justify-content: space-between; align-items: center; gap: 0.5rem; margin-bottom: 0.35rem; }
.cdl-head h2 { margin: 0; font-size: 1.05rem; font-weight: 800; }
.cdl-period, .cdl-count-btn {
  font-size: 0.7rem; font-weight: 800; letter-spacing: 0.04em;
  padding: 0.2rem 0.5rem; border-radius: 999px;
  border: 1px solid rgba(13,79,60,0.25); background: rgba(13,79,60,0.1); color: inherit; cursor: pointer;
}
.cdl-row { display: flex; flex-wrap: wrap; gap: 0.75rem; margin-bottom: 0.35rem; font-size: 0.88rem; }
.cdl-lane { font-size: 0.68rem; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; opacity: 0.7; margin-bottom: 0.2rem; }
.cdl-deed { margin: 0 0 0.35rem; font-size: 0.9rem; line-height: 1.45; }
.cdl-note { margin: 0 0 0.45rem; font-size: 0.75rem; opacity: 0.7; }
.cdl-adhkar-ar {
  font-size: 1.25rem; line-height: 1.65; margin: 0.35rem 0;
  font-family: "Amiri", "Scheherazade New", "Noto Naskh Arabic", serif;
}
.cdl-adhkar-en { margin: 0 0 0.25rem; font-size: 0.88rem; }
.cdl-adhkar-ref { margin: 0 0 0.45rem; font-size: 0.72rem; opacity: 0.7; }
.cdl-actions { display: flex; flex-wrap: wrap; gap: 0.4rem; align-items: center; }
.cdl-btn {
  border-radius: 999px; border: 1px solid rgba(212,180,90,0.45);
  background: rgba(212,180,90,0.15); color: inherit;
  padding: 0.3rem 0.75rem; font-size: 0.8rem; font-weight: 700; cursor: pointer;
}
.cdl-btn.cdl-plus, .cdl-mini { background: #0d4f3c; color: #fff; border-color: #0d4f3c; }
.cdl-mini { padding: 0.15rem 0.45rem; font-size: 0.75rem; border-radius: 6px; cursor: pointer; border: none; }
.cdl-streak { font-size: 0.75rem; opacity: 0.75; }

/* clarity-landing-isolate-v3 */
/* === LANDING: only banner + ribbon + day landing visible === */
html[data-shell-mode="landing"] #main-content,
html[data-shell-mode="landing"] .main-content,
html[data-shell-mode="landing"] .tab-panel,
html[data-shell-mode="landing"] .rrra-hub,
html[data-shell-mode="landing"] .rrra-hub-hero,
html[data-shell-mode="landing"] [data-tab-panel],
html[data-shell-mode="landing"] #clarity-door-rail,
html[data-shell-mode="landing"] .shell-landing-hide {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  max-height: 0 !important;
  overflow: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
}

/* Scroll must always work */
html, body {
  overflow-x: hidden !important;
  overflow-y: auto !important;
  height: auto !important;
  min-height: 100% !important;
  overscroll-behavior-y: auto !important;
  touch-action: pan-x pan-y pinch-zoom !important;
}
html[data-shell-mode="landing"] body,
html[data-shell-mode="landing"],
html[data-shell-mode="companion"] body,
html[data-shell-mode="companion"] {
  overflow-y: auto !important;
  height: auto !important;
  position: static !important;
}

/* Keep landing chrome visible */
html[data-shell-mode="landing"] #clarity-day-landing,
html[data-shell-mode="landing"] #clarity-reopen-bar,
html[data-shell-mode="landing"] #clarity-visit-pill-bar,
html[data-shell-mode="landing"] #clarity-top-duo,
html[data-shell-mode="landing"] .banner {
  display: revert !important;
  visibility: visible !important;
  opacity: 1 !important;
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
  pointer-events: auto !important;
}
html[data-shell-mode="landing"] #clarity-day-landing {
  display: flex !important;
  flex-direction: column !important;
}
html[data-shell-mode="landing"] #clarity-reopen-bar {
  display: flex !important;
}

/* Companion: restore main + rail */
html[data-shell-mode="companion"] #main-content,
html[data-shell-mode="companion"] .main-content {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
  pointer-events: auto !important;
}
html[data-shell-mode="companion"] #clarity-door-rail {
  display: flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  height: auto !important;
  max-height: none !important;
  pointer-events: auto !important;
}

/* clarity-perf-v1 */
/* font-display */
@font-face { font-display: swap; }
html { font-display: swap; }
/* Reserve space to cut CLS */
.banner, #banner, [data-banner] {
  min-height: 200px;
}
#clarity-day-landing {
  min-height: 320px;
}
#clarity-reopen-bar {
  min-height: 44px;
}
/* Contain layout for landing cards */
.cdl-card, .dual-tiles {
  contain: layout style;
}
/* Lazy images */
img { max-width: 100%; height: auto; }

/* nuros5-shariah-v2 */
.workspace-safe-frame{position:relative;margin:.75rem 0 1.25rem;padding:.65rem .55rem 1.1rem;border:1px solid rgba(13,79,60,.22);border-radius:16px;background:linear-gradient(180deg,rgba(13,79,60,.04),transparent 40%)}
html[data-theme="dark"] .workspace-safe-frame{border-color:rgba(212,180,90,.28)}
.workspace-safe-frame::before{content:attr(data-frame-label);display:block;font-size:.68rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--accent,#0d4f3c);opacity:.85;margin:0 0 .45rem .15rem}
.workspace-scroll-hint{font-size:.72rem;color:var(--text-muted,#5c6b62);margin:.35rem .15rem 0}
#callig-stage-outer{max-height:min(70vh,520px);overflow:auto;border-radius:12px;border:1px dashed rgba(13,79,60,.25);padding:.35rem;background:#f7f3eb!important;min-height:280px!important}
#callig-canvas,.callig-lab-stage{background:#f7f3eb!important;min-height:260px!important}
#callig-canvas{display:block!important;width:100%!important}
#meme-stage-wrap,#uft-stage{border-radius:12px;border:1px dashed rgba(13,79,60,.25);padding:.35rem}
#callig-text-bridge{margin:0 0 .55rem;padding:.65rem .75rem;border-radius:12px;border:1px solid rgba(13,79,60,.2);background:var(--card-bg,#fffdf8)}
#callig-text-bridge .bridge-title{font-size:.72rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--accent,#0d4f3c);margin-bottom:.35rem}
#callig-text-bridge .bridge-row{display:flex;flex-wrap:wrap;gap:.4rem;align-items:center}
#callig-text-bridge input[type="text"]{flex:1 1 12rem;min-width:8rem;padding:.45rem .65rem;border-radius:10px;border:1px solid var(--border,#e0d5c4);background:#fff;color:var(--text);font-size:.9rem}
#callig-bridge-ar{margin-top:.45rem;font-family:'Scheherazade New',Amiri,serif;direction:rtl;font-size:1.35rem;line-height:1.9;min-height:2.2rem;padding:.4rem .55rem;border-radius:10px;background:rgba(13,79,60,.06);border:1px dashed rgba(13,79,60,.2)}
#callig-bridge-hint{font-size:.75rem;color:var(--text-muted);margin-top:.3rem}
#tj-lmr-random{font-size:1.05rem;min-width:2.4rem}
.banner-media.live-active .banner-live{pointer-events:auto!important;opacity:1!important;z-index:5!important}

/* nx-min */
#banner-live-chip{position:absolute;top:.4rem;right:.45rem;z-index:8;background:#c81e1e;color:#fff;border:1px solid rgba(255,255,255,.35);border-radius:999px;padding:.2rem .65rem;font-size:.72rem;font-weight:700;display:inline-flex;align-items:center;gap:.25rem}
.banner-tools{position:relative}
.banner-media:not(.live-active) #banner-img,.banner-media.live-fallback #banner-img{opacity:1!important;z-index:3!important}
.banner-media:not(.live-active) #banner-still-fallback{opacity:1!important;z-index:2!important;background:url(https://upload.wikimedia.org/wikipedia/commons/thumb/6/67/Kaaba_Masjid_Haraam_Makkah.jpg/640px-Kaaba_Masjid_Haraam_Makkah.jpg) center/cover}
.banner-media:not(.live-active) #banner-live{opacity:0!important;pointer-events:none!important}
#one-action-strip{position:relative;z-index:5}
#nuros-daily-dock.open #nuros-daily-body{position:relative!important;height:auto!important;overflow:visible!important;display:block!important}

/* nx-tj-rule-media-v1 */
.tj-media-row {
  display: flex; flex-wrap: wrap; gap: 0.35rem;
  margin-top: 0.55rem;
}
.tj-media-row .btn-soft {
  margin: 0 !important;
  padding: 0.35rem 0.7rem !important;
  font-size: 0.8rem !important;
}
.tj-media-frame {
  margin-top: 0.55rem;
  border-radius: 12px;
  overflow: hidden;
  background: #0a1812;
}
.tj-embed-wrap {
  position: relative;
  width: 100%;
  aspect-ratio: 16/9;
  background: #000;
}
.tj-embed-wrap iframe {
  position: absolute; inset: 0;
  width: 100%; height: 100%; border: 0;
}

/* nx-tj-lmr-v1 */
.tj-lmr-toolbar {
  display: flex; flex-wrap: wrap; gap: 0.4rem; align-items: flex-end;
  margin-bottom: 0.55rem;
}
.tj-lmr-label {
  display: flex; flex-direction: column; gap: 0.15rem;
  font-size: 0.72rem; font-weight: 650; color: var(--accent);
}
.tj-lmr-label select,
.tj-lmr-label input {
  margin: 0; min-width: 7rem; padding: 0.35rem 0.5rem;
  border-radius: 8px; border: 1px solid var(--border);
  background: var(--card-bg, #fff); color: var(--text);
  font-size: 0.88rem;
}
.tj-lmr-label input { width: 4.5rem; }
.tj-lmr-steps {
  display: flex; flex-wrap: wrap; gap: 0.3rem;
  margin-bottom: 0.55rem;
}
.tj-lmr-step {
  margin: 0 !important;
  padding: 0.32rem 0.65rem !important;
  font-size: 0.78rem !important;
  border-radius: 999px !important;
  background: rgba(13,79,60,0.08) !important;
  color: var(--accent) !important;
  border: 1px solid rgba(13,79,60,0.18) !important;
}
.tj-lmr-step.active {
  background: var(--accent) !important;
  color: #fff !important;
  border-color: var(--accent) !important;
}
.tj-lmr-ayah-card {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 0.75rem 0.85rem;
  background: rgba(13,79,60,0.05);
}
.tj-lmr-meta { font-size: 0.8rem; color: var(--text-muted); margin-bottom: 0.4rem; }
.tj-lmr-ar {
  font-size: 1.45rem; line-height: 2.1; margin: 0.35rem 0;
  text-align: center;
}
.tj-lmr-ar-sm { font-size: 1.25rem; }
.tj-lmr-en { font-size: 0.9rem; color: var(--text-muted); text-align: center; margin-bottom: 0.5rem; }
.tj-lmr-audio-row, .tj-lmr-rec-row {
  display: flex; flex-wrap: wrap; gap: 0.35rem; align-items: center;
}
.tj-lmr-audio-row .btn-soft,
.tj-lmr-rec-row .btn-soft,
.tj-lmr-rec-row .btn-secondary {
  margin: 0 !important; padding: 0.35rem 0.75rem !important; font-size: 0.82rem !important;
}
.tj-lmr-ext { font-size: 0.8rem; color: var(--accent); margin-left: auto; }
.tj-lmr-check { font-size: 0.85rem; display: inline-flex; align-items: center; gap: 0.35rem; }
.tj-lmr-rec-status {
  margin-top: 0.4rem; font-size: 0.82rem; color: var(--text-muted);
}
.tj-lmr-rec-status.rec {
  color: #c0392b; font-weight: 650;
}
.tj-lmr-focus-row {
  display: flex; flex-wrap: wrap; gap: 0.35rem; margin: 0.4rem 0 0.55rem;
}
.tj-lmr-focus-row button {
  margin: 0 !important; padding: 0.3rem 0.65rem !important; font-size: 0.78rem !important;
  border-radius: 999px !important;
}
.tj-lmr-focus-row button.on {
  background: var(--accent) !important; color: #fff !important;
}
.tj-lmr-loop-stat { font-size: 0.8rem; margin-left: 0.5rem; color: var(--text-muted); }
html[data-theme="dark"] .tj-lmr-ayah-card { background: rgba(0,0,0,0.22); }
html[data-theme="dark"] .tj-lmr-step { background: rgba(255,255,255,0.06) !important; }

/* nx-tj-lmr-score-v1 */
.tj-lmr-mode-row {
  display: flex; flex-wrap: wrap; gap: 0.35rem;
  margin-bottom: 0.55rem;
}
.tj-lmr-mode {
  margin: 0 !important;
  padding: 0.35rem 0.8rem !important;
  font-size: 0.82rem !important;
  border-radius: 999px !important;
  background: rgba(13,79,60,0.08) !important;
  color: var(--accent) !important;
  border: 1px solid rgba(13,79,60,0.2) !important;
}
.tj-lmr-mode.active {
  background: var(--accent) !important;
  color: #fff !important;
}
.tj-lmr-score-card {
  margin-top: 0.65rem;
  padding: 0.7rem 0.85rem;
  border-radius: 12px;
  border: 1px solid rgba(184,146,42,0.35);
  background: linear-gradient(145deg, rgba(13,79,60,0.08), rgba(184,146,42,0.08));
}
.tj-lmr-score-title {
  font-size: 0.75rem; font-weight: 700; letter-spacing: 0.04em;
  text-transform: uppercase; color: var(--accent); opacity: 0.9;
}
.tj-lmr-score-val {
  font-size: 1.6rem; font-weight: 700; color: var(--accent);
  margin: 0.15rem 0 0.45rem;
}
.tj-lmr-score-bars { display: flex; flex-direction: column; gap: 0.35rem; }
.tj-lmr-bar { display: grid; grid-template-columns: 6.5rem 1fr; gap: 0.4rem; align-items: center; font-size: 0.78rem; }
.tj-lmr-bar .track {
  height: 0.45rem; border-radius: 999px; background: rgba(13,79,60,0.12); overflow: hidden;
}
.tj-lmr-bar .fill {
  height: 100%; width: 0%; border-radius: 999px; background: var(--accent);
  transition: width 0.4s ease;
}
.tj-lmr-score-note { font-size: 0.82rem; color: var(--text-muted); margin-top: 0.45rem; line-height: 1.4; }
.tj-lmr-log { margin-top: 0.75rem; }
.tj-lmr-log-title { font-size: 0.78rem; font-weight: 650; color: var(--accent); margin-bottom: 0.3rem; }
.tj-lmr-log-list { font-size: 0.82rem; max-height: 9rem; overflow-y: auto; }
.tj-lmr-log-item {
  padding: 0.3rem 0;
  border-bottom: 1px solid rgba(13,79,60,0.1);
}
.tj-lmr-log-when { opacity: 0.7; font-size: 0.75rem; }
html[data-theme="dark"] .tj-lmr-mode { background: rgba(255,255,255,0.06) !important; }
html[data-theme="dark"] .tj-lmr-score-card { background: rgba(0,0,0,0.25); }

/* nuros-bridge-enrich-css */
.callig-text-bridge-solid{
  margin:0.55rem 0 0.65rem;padding:0.7rem 0.8rem;border-radius:14px;
  border:1px solid rgba(13,79,60,0.25);background:var(--card-bg,#fffdf8);
  box-shadow:0 4px 14px rgba(13,50,40,0.06);
}
html[data-theme="dark"] .callig-text-bridge-solid{
  background:rgba(12,36,30,0.95);border-color:rgba(212,180,90,0.28);
}
.callig-text-bridge-solid .bridge-title{
  font-size:0.78rem;font-weight:700;letter-spacing:0.04em;text-transform:uppercase;
  color:var(--accent,#0d4f3c);margin:0 0 0.35rem;
}
html[data-theme="dark"] .callig-text-bridge-solid .bridge-title{color:var(--gold,#d4b45a)}
.callig-text-bridge-solid .bridge-note{
  font-size:0.78rem;line-height:1.45;margin:0 0 0.5rem;padding:0.4rem 0.55rem;
  border-radius:10px;border-left:3px solid var(--gold,#b8922a);
  background:rgba(184,146,42,0.12);color:var(--text,#1c2a22);
}
.callig-text-bridge-solid .bridge-row{display:flex;flex-wrap:wrap;gap:0.35rem;align-items:center}
.callig-text-bridge-solid select,
.callig-text-bridge-solid input[type="text"]{
  padding:0.42rem 0.55rem;border-radius:10px;border:1px solid var(--border,#e0d5c4);
  background:#fff;color:var(--text);font-size:0.88rem;
}
.callig-text-bridge-solid input[type="text"]{flex:1 1 10rem;min-width:7rem}
html[data-theme="dark"] .callig-text-bridge-solid select,
html[data-theme="dark"] .callig-text-bridge-solid input[type="text"]{
  background:#0a1f18;color:#eaf6f0;border-color:rgba(212,180,90,0.3);
}
#callig-bridge-ar,#meme-bridge-ar{
  margin-top:0.45rem;font-family:'Scheherazade New',Amiri,serif;direction:rtl;
  font-size:1.35rem;line-height:1.9;min-height:2.1rem;padding:0.4rem 0.55rem;
  border-radius:10px;background:rgba(13,79,60,0.07);
  border:1px dashed rgba(13,79,60,0.25);
}
.bridge-status{font-size:0.72rem;color:var(--text-muted,#5c6b62);margin:0.35rem 0 0}
.bridge-status.live{color:#c81e1e;font-weight:700}
.tj-lmr-live-meter{margin-top:0.5rem;padding:0.55rem 0.7rem;border-radius:12px;border:1px solid rgba(13,79,60,0.2);background:rgba(13,79,60,0.06)}
.tj-lmr-live-meter .meter-label{font-size:0.72rem;font-weight:700;text-transform:uppercase;letter-spacing:0.04em;color:var(--accent)}
.tj-lmr-live-meter .meter-track{height:0.55rem;border-radius:999px;background:rgba(13,79,60,0.12);overflow:hidden;margin-top:0.35rem}
.tj-lmr-live-meter .meter-fill{height:100%;width:0%;background:linear-gradient(90deg,#0d4f3c,#1fa67a,#7dff9a);border-radius:999px;transition:width 0.08s linear}
.tj-lmr-live-meter.recording .meter-label{color:#c81e1e}

/* nuros-pad-layout-v1 */
#callig-top-audio-row{display:flex;flex-wrap:wrap;gap:0.35rem;align-items:center}
.callig-voice-bar{display:flex !important;flex-wrap:wrap;gap:.35rem;margin-top:.4rem}
#callig-text-bridge .bridge-note{display:block}
/* keep under-canvas Clear Undo Guide Score PNG Log */

/* nuros-banner-seals-v2 */
/* Beautiful circular plaques — Allah (left) & Masjid (right) */
.allah-circular-seal,
.masjid-circular-seal {
  width: 2.35rem;
  height: 2.35rem;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 0.22rem;
  position: relative;
  box-shadow:
    0 0 0 1.5px rgba(212,180,90,0.55),
    0 0 0 3px rgba(13,79,60,0.35),
    0 2px 10px rgba(0,0,0,0.35),
    inset 0 1px 0 rgba(255,255,255,0.15);
  background: radial-gradient(circle at 35% 30%, #1a6b52 0%, #0d4f3c 55%, #0a2e22 100%);
}
.allah-circular-seal::after,
.masjid-circular-seal::after {
  content: "";
  position: absolute;
  inset: -3px;
  border-radius: 50%;
  border: 1px solid rgba(212,180,90,0.25);
  pointer-events: none;
}
.allah-circular-seal .seal-ar {
  font-family: 'Scheherazade New', 'Amiri', serif !important;
  font-size: 1.05rem;
  font-weight: 700;
  color: #f5e6b8;
  line-height: 1;
  text-shadow: 0 1px 3px rgba(0,0,0,0.45);
  direction: rtl;
}
.masjid-circular-seal .seal-icon {
  font-size: 1.15rem;
  line-height: 1;
  filter: drop-shadow(0 1px 2px rgba(0,0,0,0.4));
}
.banner-overlay {
  padding: 0.28rem 0.4rem 0.32rem !important;
  gap: 0.35rem !important;
  min-height: 0 !important;
}
.banner-side {
  width: 148px !important;
  flex: 0 0 148px !important;
}
.banner-center {
  flex: 1 1 auto !important;
  max-width: 520px !important;
  min-width: 0 !important;
}
.banner .bismillah {
  font-size: 0.88rem !important;
  margin-bottom: 0.04rem !important;
  letter-spacing: 0.02em;
  opacity: 0.97;
}
.banner h1, .banner .banner-brand {
  font-size: 1.28rem !important;
  letter-spacing: 0.6px !important;
  margin-bottom: 0.02rem !important;
  line-height: 1.15 !important;
}
.banner .subtitle {
  font-size: 0.68rem !important;
  opacity: 0.92;
  margin-bottom: 0.06rem !important;
}
.banner .rabbana-box {
  margin-top: 0.1rem !important;
  padding: 0.18rem 0.55rem !important;
  max-width: 440px;
}
.rabbana-arabic {
  font-size: 0.86rem !important;
  line-height: 1.4 !important;
}
.banner .rabbana-english {
  font-size: 0.66rem !important;
  line-height: 1.3 !important;
}
.banner .rabbana-ref {
  font-size: 0.56rem !important;
}
.stream-controls {
  margin-top: 0.14rem !important;
  gap: 0.28rem !important;
}
.live-haramain-btn, .quran-stream-btn {
  padding: 0.28rem 0.65rem !important;
  font-size: 0.72rem !important;
}
.hijri-cal-section .cal-title,
.salah-times-section .salah-title {
  font-size: 0.64rem !important;
  letter-spacing: 0.03em;
}
.hijri-cal-grid { font-size: 0.55rem !important; }
.salah-times-list { font-size: 0.6rem !important; }
.hijri-temps {
  display: flex;
  flex-wrap: wrap;
  gap: 0.2rem 0.45rem;
  justify-content: center;
  margin-top: 0.12rem;
  font-size: 0.58rem !important;
}
.hijri-temps .ht-item strong {
  font-variant-numeric: tabular-nums;
  font-weight: 700;
  color: #f5e6b8;
}
@media (min-width: 769px) {
  .mobile-bottom-nav-inner {
    justify-content: center !important;
    overflow-x: auto !important;
  }
  .mb-tab {
    min-width: 4.2rem !important;
    max-width: 5.2rem !important;
    font-size: 0.68rem !important;
  }
}
.nav-tabs-inner {
  flex-wrap: nowrap !important;
  overflow-x: auto !important;
  -webkit-overflow-scrolling: touch;
  justify-content: center !important;
  gap: 0.12rem !important;
}
.nav-tab {
  flex: 0 0 auto !important;
}
#clarity-top-duo .allah-circular-seal,
#clarity-top-duo .masjid-circular-seal {
  width: 1.85rem !important;
  height: 1.85rem !important;
  margin-bottom: 0.12rem !important;
}
#clarity-top-duo .allah-circular-seal .seal-ar {
  font-size: 0.85rem !important;
}
#clarity-top-duo .masjid-circular-seal .seal-icon {
  font-size: 0.95rem !important;
}
@media (max-width: 900px) {
  #clarity-top-duo .allah-circular-seal,
  #clarity-top-duo .masjid-circular-seal {
    width: 2.2rem !important;
    height: 2.2rem !important;
  }
}

/* nuros-meme-ratio-unlock-v1 */
/* Unlock aspect-ratio so format select (memeSetRatio) works */
#meme-stage,
.meme-stage,
#tab-about .meme-stage,
#meme-studio-root .meme-stage,
.meme-realign .meme-stage {
  aspect-ratio: unset !important;
  max-height: 52vh !important;
  max-width: min(100%, 520px) !important;
  width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
.meme-stage-wrap,
#meme-stage-wrap,
#tab-about .meme-stage-wrap {
  max-width: min(100%, 520px) !important;
  max-height: 52vh !important;
  margin: 0.35rem auto !important;
  width: 100% !important;
}
/* Tighten gap under banner */
.page-wrapper, #main-content, .main-content {
  margin-top: 0 !important;
  padding-top: 0.2rem !important;
}
.clarity-tab-disclaimer {
  margin-top: 0.35rem !important;
  margin-bottom: 0.45rem !important;
}
#tab-about .card-meme, #meme-card, .card-meme,
#tab-about .meme-studio, #meme-studio-root {
  min-height: 0 !important;
}

/* nuros-gap-kill-v1 */
/* ===== Nuclear: kill phantom padding under banner on ALL sections ===== */

/* 1. Top nav chips never reserve space when door-rail is primary */
html.door-rail-on nav.nav-tabs,
html.door-rail-on .nav-tabs,
nav.nav-tabs {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  max-height: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: none !important;
  pointer-events: none !important;
}

/* 2. Zero top gap after banner → content */
#clarity-top-duo {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}
#clarity-top-duo + *,
#clarity-top-duo ~ .page-wrapper,
.page-wrapper,
#main-content,
.main-content,
#main-application-workspace {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* 3. Tab panels: only active takes space */
.tab-panel:not(.active):not(.is-active) {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  max-height: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  pointer-events: none !important;
}
.tab-panel.active,
.tab-panel.is-active {
  display: block !important;
  visibility: visible !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0.15rem 0.35rem 0.5rem !important;
  overflow: visible !important;
  scroll-margin-top: 0 !important;
}

/* 4. First child of active panel sits tight under banner */
.tab-panel.active > :first-child,
.tab-panel.is-active > :first-child,
.tab-panel.active .clarity-tab-disclaimer,
.tab-panel.is-active .clarity-tab-disclaimer {
  margin-top: 0.25rem !important;
}

/* 5. Cards don't invent top gap */
.tab-panel.active > .card:first-of-type,
.tab-panel.is-active > .card:first-of-type {
  margin-top: 0.35rem !important;
}

/* 6. Sidebar never leaves a hole */
#clarity-sidebar,
aside.sidebar {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
}

/* 7. Meme stage respects format select (no forced ratio) */
#meme-stage,
.meme-stage,
#tab-about .meme-stage,
#tab-about.active #meme-stage {
  aspect-ratio: unset !important;
  min-height: 0 !important;
  max-height: 52vh !important;
}
#meme-stage[style*="aspect-ratio"],
.meme-stage[style*="aspect-ratio"] {
  /* inline !important from memeSetRatio wins */
}

/* 8. Kill main-content pseudo spacers */
.main-content::after,
#main-content::after,
.page-wrapper::after {
  content: none !important;
  display: none !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* nuros-shell-collapse-v1 */
/* ===== Collapse empty page-wrapper / main shells that push tabs down ===== */
#main-application-workspace {
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
}
/* page-wrapper should not invent vertical space */
#main-content.page-wrapper,
.page-wrapper,
#main-content {
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  min-height: 0 !important;
  height: auto !important;
  max-height: none !important;
  gap: 0 !important;
}
/* empty main inside wrapper */
.page-wrapper > .main-content,
.page-wrapper > main.main-content,
#main-content > .main-content,
main.main-content {
  margin: 0 !important;
  padding: 0 !important;
  min-height: 0 !important;
  height: auto !important;
}
/* Sidebar must not reserve flex space */
#clarity-sidebar,
aside.sidebar {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  flex: 0 0 0 !important;
  overflow: hidden !important;
}
/* Tab panels that are direct children of workspace sit tight under banner */
#main-application-workspace > .tab-panel.active,
#main-application-workspace > .tab-panel.is-active,
.page-wrapper > .tab-panel.active,
.page-wrapper > .tab-panel.is-active,
#main-content > .tab-panel.active,
#main-content > .tab-panel.is-active {
  margin-top: 0 !important;
  padding-top: 0.15rem !important;
}
/* Banner solid (reinforce) */
#clarity-top-duo {
  background: #0a3d30 !important;
  margin-bottom: 0 !important;
}
#clarity-top-duo .banner {
  background: linear-gradient(135deg, #0a3d30 0%, #0d4f3c 45%, #1a6b52 100%) !important;
  min-height: 0 !important;
  height: auto !important;
}
/* Kill flex gap on wrappers */
.page-wrapper {
  display: block !important; /* was flex — flex with empty main creates gap */
}

/* nuros-av-repair-v1 */
/* ===== AV embeds: solid frames, never zeroed ===== */
.hajj-video-frame,
.player-wrap,
.lecture-player-wrap,
.spotify-player-wrap {
  position: relative !important;
  width: 100% !important;
  max-width: 100% !important;
  padding-bottom: 56.25% !important;
  height: 0 !important;
  overflow: hidden !important;
  border-radius: 12px !important;
  background: #0f0f0f !important;
  margin-top: 0.4rem !important;
}
/* Spotify is shorter */
.spotify-player-wrap {
  padding-bottom: 0 !important;
  height: 152px !important;
  min-height: 152px !important;
}
.hajj-video-frame iframe,
.player-wrap iframe,
.lecture-player-wrap iframe,
.spotify-player-wrap iframe,
iframe[data-src*="youtube"],
iframe[src*="youtube"],
iframe[src*="youtube-nocookie"] {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  border: 0 !important;
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  max-height: none !important;
  min-height: 0 !important;
  pointer-events: auto !important;
  background: #0f0f0f !important;
}
.spotify-player-wrap iframe {
  position: relative !important;
  height: 152px !important;
  min-height: 152px !important;
}
/* Active panel must not clip embeds */
.tab-panel.active,
.tab-panel.is-active {
  overflow: visible !important;
  max-height: none !important;
}
/* Banner live iframe */
#banner-live.banner-live-iframe,
iframe#banner-live {
  /* keep controlled by banner JS; do not force absolute full */
}

/* clarity-uft-viewport-recover-v1 */
/* Family tree full viewport — overrides residual hide rules when vault unlocked */
#tab-notes.active.amana-unlocked #user-family-tree-card,
#tab-notes.active.amana-unlocked #uft-stage,
#tab-notes.active.amana-unlocked #uft-preview,
#tab-notes.active.amana-unlocked #uft-branch-wrap:not([hidden]),
#tab-notes.active.amana-unlocked .uft-wrap,
#tab-notes.active.amana-unlocked .uft-chrome,
#tab-notes.active.amana-unlocked .uft-tree-first,
#tab-notes.active.amana-unlocked #uft-preview-wrap,
#tab-notes.active.amana-unlocked #uft-zoom-layer,
#tab-notes.active.amana-unlocked #uft-editor,
#tab-notes.active.amana-unlocked #uft-palette,
#tab-notes.active.amana-unlocked #amana-fiqh-tools-wrap,
#tab-notes.active.amana-unlocked #faraid-card,
#tab-notes.active.amana-unlocked #wasiyyah-card {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
  pointer-events: auto !important;
}
#tab-notes.active.amana-unlocked #uft-palette { display: flex !important; flex-wrap: wrap !important; }
#tab-notes.active.amana-unlocked #amana-fiqh-tools-wrap {
  display: flex !important; flex-direction: column !important; gap: 1.2rem !important; width: 100% !important;
}
#tab-notes.active.amana-unlocked #uft-stage.uft-stage {
  width: 100% !important;
  min-height: min(48vh, 26rem) !important;
  overflow-x: auto !important;
  overflow-y: visible !important;
  -webkit-overflow-scrolling: touch;
}
#tab-notes.active.amana-unlocked #uft-preview {
  min-height: 12rem !important;
  overflow-x: auto !important;
  -webkit-overflow-scrolling: touch;
}
#tab-notes.active.amana-unlocked #user-family-tree-card {
  width: 100% !important;
  margin: 0 0 1.2rem !important;
  overflow-x: auto !important;
}
@media (max-width: 700px) {
  #tab-notes.active.amana-unlocked #uft-stage.uft-stage { min-height: min(40vh, 18rem) !important; }
}

/* clarity-rrra5-unhide-v1 */
/* When a hub is active, every card inside must show — override residual fighters */
#tab-reminder.active .card,
#tab-reminder.is-active .card,
#tab-reality.active .card,
#tab-reality.is-active .card,
#tab-reflection.active .card,
#tab-reflection.is-active .card,
#tab-action.active .card,
#tab-action.is-active .card:not([data-gate-hidden="1"]), #tab-notes.active .card:not([data-gate-hidden="1"]), #tab-notes.is-active .card:not([data-gate-hidden="1"]) { display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
  pointer-events: auto !important;
  position: relative !important;
  left: auto !important;
  clip: auto !important;
}
#tab-reminder.active #meme-card,
#tab-reminder.active #meme-studio-root,
#tab-reminder.is-active #meme-card:not([data-gate-hidden="1"]), #tab-reminder.is-active #meme-studio-root:not([data-gate-hidden="1"]) { display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  height: auto !important;
  max-height: none !important;
  pointer-events: auto !important;
  position: relative !important;
}
#tab-action.active #callig-lab-card,
#tab-action.active #fiqh-quiz-card,
#tab-reality.active #about-clarity-card:not([data-gate-hidden="1"]), #tab-reality.active #authentic-learning-stack:not([data-gate-hidden="1"]) { display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
  height: auto !important;
}
/* Ustazah Najiha tafseer — collapsed by default in Reminder */
#najiha-tafseer-details:not([open]) .najiha-body { display: none; }
#najiha-tafseer-details summary {
  cursor: pointer;
  font-weight: 700;
  color: var(--gold, #c9a227);
  list-style: none;
  padding: 0.35rem 0;
}
#najiha-tafseer-details summary::-webkit-details-marker { display: none; }

/* clarity-callig-reminder-v1 */
#tab-reminder.active #callig-lab-card,
#tab-reminder.is-active #callig-lab-card:not([data-gate-hidden="1"]), body[data-active-tab="reminder"] #callig-lab-card:not([data-gate-hidden="1"]) { display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  height: auto !important;
  max-height: none !important;
  pointer-events: auto !important;
  position: relative !important;
}
#callig-lab-card { border-top-color: var(--gold,#9a7b24) !important; }

/* clarity-callig-ink-surprise-v1 */
#tab-reminder.active #callig-lab-card {
  box-shadow: 0 8px 28px rgba(15,76,58,0.10), inset 0 1px 0 rgba(255,255,255,0.5) !important;
  background:
    linear-gradient(180deg, rgba(255,252,246,0.95), #fff) !important;
}
#tab-reminder.active #callig-lab-card h2::after {
  content: " · under Tweet desk";
  font-size: 0.65rem;
  font-weight: 600;
  opacity: 0.55;
  letter-spacing: 0.02em;
}
html[data-theme="dark"] #tab-reminder.active #callig-lab-card h2::after { content: none; }

/* clarity-day-layout-v1 */
/* Day mode: airy content under banner */
html[data-theme="light"] .page-wrapper,
html[data-theme="light"] #main-content,
html[data-theme="light"] #main-application-workspace {
  padding-top: 0.35rem;
}
html[data-theme="light"] .tab-panel.active,
html[data-theme="light"] #tab-reminder.active,
html[data-theme="light"] #tab-reality.active,
html[data-theme="light"] #tab-reflection.active,
html[data-theme="light"] #tab-action.active,
html[data-theme="light"] #tab-notes.active {
  padding: 0.65rem 0.55rem 1.4rem;
  max-width: 100%;
  box-sizing: border-box;
}
html[data-theme="light"] .card {
  margin-bottom: 0.85rem;
  border-radius: 14px;
}
html[data-theme="light"] .theme-chip-row .theme-chip {
  font-weight: 650;
  padding: 0.28rem 0.75rem;
  border-radius: 999px;
}
html[data-theme="light"] .theme-chip-row .theme-chip.active {
  background: #0f4c3a;
  color: #fff;
  box-shadow: 0 0 0 2px rgba(15,76,58,0.25);
}
html[data-theme="dark"] .theme-chip-row .theme-chip.active {
  background: #c9a227;
  color: #1a1208;
  box-shadow: 0 0 0 2px rgba(201,162,39,0.35);
}
/* Meme studio sleek rows */
#meme-studio-root.meme-realign {
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
}
#meme-studio-root .meme-bar {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
}
#meme-studio-root .meme-tool-label {
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  color: var(--text-muted, #6b7280);
  text-transform: uppercase;
}
#meme-studio-root .meme-chip-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  align-items: center;
}
#meme-studio-root .mv-chip {
  font-size: 0.78rem;
  padding: 0.32rem 0.7rem;
  border-radius: 999px;
  white-space: nowrap;
}
#meme-studio-root .meme-bar-bg {
  order: -1;
  padding: 0.45rem 0.35rem;
  border-radius: 12px;
  background: rgba(15,76,58,0.06);
  border: 1px solid rgba(15,76,58,0.12);
}
html[data-theme="dark"] #meme-studio-root .meme-bar-bg {
  background: rgba(201,162,39,0.08);
  border-color: rgba(201,162,39,0.18);
}
#meme-studio-root .meme-preview-only {
  order: 0;
}
#meme-studio-root .meme-below {
  order: 1;
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
}
/* Site-wide chip rows in cards */
.card .meme-chip-row,
.card .btn-row,
.card .command-status {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  align-items: center;
}

/* nuros-amana-unlock-fix-css-v21 */
#tab-notes.active { display: block !important; visibility: visible !important; min-height: 12rem !important; }
#tab-notes.amana-locked #amana-vault-gate,
#tab-notes.active.amana-locked #amana-vault-gate,
#tab-notes.active:not(.amana-unlocked) #amana-vault-gate {
  display: block !important; visibility: visible !important; opacity: 1 !important;
  pointer-events: auto !important; height: auto !important;
}
#tab-notes.amana-locked #amana-vault-interior,
#tab-notes:not(.amana-unlocked) #amana-vault-interior {
  display: none !important;
}
#tab-notes.amana-unlocked #amana-vault-gate { display: none !important; }
#tab-notes.amana-unlocked #amana-vault-interior,
#tab-notes.active.amana-unlocked #amana-vault-interior {
  display: block !important; visibility: visible !important; opacity: 1 !important;
  height: auto !important; max-height: none !important; overflow: visible !important;
  pointer-events: auto !important;
}
#amana-vault-gate {
  margin: 0.75rem auto 1.25rem !important; max-width: 28rem !important;
  padding: 1.1rem 1.15rem !important; border-radius: 16px !important;
  border: 1px solid rgba(212,180,90,0.35) !important;
  background: linear-gradient(160deg, rgba(12,28,22,0.95), rgba(8,18,14,0.98)) !important;
  box-shadow: 0 8px 28px rgba(0,0,0,0.35) !important; color: #e8f0ea !important;
}
#amana-gate-status.err {
  color: #ffb4b4 !important; background: rgba(120,30,30,0.35) !important;
  border: 1px solid rgba(255,120,120,0.35) !important; border-radius: 8px !important;
  padding: 0.4rem 0.55rem !important; margin-top: 0.5rem !important; display: block !important;
}
#amana-gate-status:not(.err):not(:empty) {
  color: #c8e6c9 !important; padding: 0.35rem 0.5rem !important; display: block !important;
}

/* clarity-vault-fix-css-v1 */
.amana-vault-gate .av-field { position: relative !important; }
.amana-vault-gate .av-eye,
button.av-eye {
  position: absolute !important;
  right: 0.4rem !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  z-index: 20 !important;
  pointer-events: auto !important;
  width: 2.25rem !important;
  height: 2.25rem !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: rgba(255,255,255,0.12) !important;
  border: 1px solid rgba(255,255,255,0.22) !important;
  border-radius: 8px !important;
  cursor: pointer !important;
  font-size: 1.05rem !important;
  opacity: 1 !important;
  color: inherit !important;
  padding: 0 !important;
  margin: 0 !important;
  -webkit-tap-highlight-color: transparent;
}
.amana-vault-gate input[type="password"],
.amana-vault-gate input[type="text"] {
  padding-right: 2.75rem !important;
}
#tab-notes.amana-unlocked #uft-stage,
#tab-notes.active.amana-unlocked #uft-stage,
body.amana-unlocked #uft-stage,
#uft-stage.uft-stage {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  min-height: min(48vh, 26rem) !important;
  max-height: none !important;
  overflow: auto !important;
  width: 100% !important;
}
#tab-notes.amana-unlocked #uft-preview,
#tab-notes.active.amana-unlocked #uft-preview {
  display: block !important;
  visibility: visible !important;
  min-height: 12rem !important;
}

/* clarity-uft-print-fix-v2 */
@media print {
  body.printing * { visibility: hidden !important; }
  body.printing .print-sheet,
  body.printing .print-sheet * { visibility: visible !important; }
  body.printing .print-sheet {
    display: block !important;
    position: absolute !important;
    left: 0 !important;
    top: 0 !important;
    width: 100% !important;
    min-height: 100% !important;
    margin: 0 !important;
    padding: 12mm !important;
    background: #fff !important;
    color: #111 !important;
    font-size: 11pt !important;
    z-index: 99999 !important;
  }
  body.printing .print-sheet.print-pedigree-snap {
    padding: 6mm !important;
  }
  body.printing .print-sheet.print-pedigree-snap .uft-preview,
  body.printing .print-sheet.print-pedigree-snap #uft-preview,
  body.printing .print-sheet.print-pedigree-snap .uft-stage {
    display: block !important;
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
    width: 100% !important;
    background: #0d3d30 !important;
    color: #e8f0ea !important;
  }
  body.printing .print-sheet .uft-person-card,
  body.printing .print-sheet [class*="uft-card"] {
    break-inside: avoid;
  }
}
.print-sheet {
  display: none;
  background: #fff;
  color: #111;
  padding: 1rem;
  max-width: 48rem;
}
body.printing .print-sheet { display: block !important; }
.print-sheet h2, .print-sheet h3 { color: #0d4f3c; margin: 0.5rem 0 0.35rem; }
.print-sheet p, .print-sheet li { margin: 0.2rem 0; line-height: 1.4; }
.print-sheet ul { padding-left: 1.2rem; }

/* clarity-gate-switcher-css-v1 */
.clarity-gate-switcher {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.4rem;
  margin: 0.4rem 0 0.75rem;
  padding: 0.45rem 0.55rem;
  border-radius: 16px;
  background: linear-gradient(135deg, rgba(13,79,60,0.08), rgba(42,95,122,0.07));
  border: 1px solid rgba(13,79,60,0.16);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.35);
}
.cgs-label {
  font-size: 0.65rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--accent, #0d4f3c);
  margin-right: 0.15rem;
  opacity: 0.85;
}
.cgs-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-size: 0.78rem;
  font-weight: 700;
  padding: 0.38rem 0.75rem 0.38rem 0.55rem;
  border-radius: 999px;
  border: 1.5px solid rgba(13,79,60,0.18);
  background: rgba(255,255,255,0.92);
  color: var(--text, #1c2a22);
  cursor: pointer;
  transition: transform 0.14s ease, box-shadow 0.14s ease, background 0.14s, border-color 0.14s;
  box-shadow: 0 1px 3px rgba(13,79,60,0.06);
}
.cgs-ico { font-size: 1rem; line-height: 1; }
.cgs-num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.1rem;
  height: 1.1rem;
  border-radius: 50%;
  font-size: 0.65rem;
  background: rgba(13,79,60,0.12);
  margin-right: 0.15rem;
}
.cgs-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 14px rgba(13,79,60,0.14);
  border-color: var(--accent, #0d4f3c);
}
.cgs-btn.is-active {
  color: #f5fbf8;
  border-color: transparent;
  box-shadow: 0 3px 14px rgba(13,79,60,0.28);
  transform: translateY(-1px);
}
.cgs-btn.is-active .cgs-num { background: rgba(255,255,255,0.25); color: inherit; }
.cgs-seeker.is-active { background: linear-gradient(135deg, #2a5f7a, #1a4a62); }
.cgs-new.is-active { background: linear-gradient(135deg, #1a7a4a, #0d4f3c); }
.cgs-daily.is-active { background: linear-gradient(135deg, #0d4f3c, #0a3d30); }
.cgs-dai.is-active { background: linear-gradient(135deg, #6b4fa0, #4a3578); }
html[data-theme="dark"] .clarity-gate-switcher {
  background: linear-gradient(135deg, rgba(201,162,39,0.1), rgba(42,95,122,0.12));
  border-color: rgba(201,162,39,0.22);
  box-shadow: none;
}
html[data-theme="dark"] .cgs-btn {
  background: rgba(255,255,255,0.07);
  color: #e8f0ea;
  border-color: rgba(255,255,255,0.12);
}
html[data-theme="dark"] .cgs-btn.is-active { color: #fff; }

/* clarity-section-pills-css-v1 */
#clarity-visit-pill-bar{
  display: flex;
  flex-wrap: nowrap;
  gap: 0.3rem;
  align-items: center;
  padding: 0.3rem 0.5rem;
  margin: 0;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  background: linear-gradient(180deg, rgba(246,241,231,0.98), rgba(246,241,231,0.94));
  border-bottom: 1px solid rgba(13,79,60,0.12);
  z-index: 90;
}
#clarity-visit-pill-bar .cv-label{
  font-size: 0.62rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--accent,#0d4f3c);
  opacity: 0.75;
  flex-shrink: 0;
}
#clarity-visit-pill-bar .cv-pill{
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  padding: 0.26rem 0.65rem;
  border-radius: 999px;
  font-size: 0.7rem;
  font-weight: 650;
  cursor: pointer;
  background: rgba(15,76,58,0.1);
  color: #0f4c3a;
  border: 1px solid rgba(15,76,58,0.22);
  max-width: 11rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  flex-shrink: 0;
}
#clarity-visit-pill-bar .cv-pill .cv-ico{ font-size: 0.8rem; }
#clarity-visit-pill-bar .cv-pill .cv-k{ opacity: 0.75; font-size: 0.62rem; font-weight: 800; }
html[data-theme="dark"] #clarity-visit-pill-bar{
  background: linear-gradient(180deg, rgba(10,24,18,0.96), rgba(10,24,18,0.9));
  border-bottom-color: rgba(201,162,39,0.18);
}
html[data-theme="dark"] #clarity-visit-pill-bar .cv-label{ color: #c9a227; }
html[data-theme="dark"] #clarity-visit-pill-bar .cv-pill{
  background: rgba(201,162,39,0.12);
  color: #e6d090;
  border-color: rgba(201,162,39,0.28);
}
/* Desktop only: sticky under banner edge */
@media (min-width: 900px) {
  #clarity-visit-pill-bar{
    position: sticky;
    top: var(--clarity-sticky-offset, 0px);
    box-shadow: 0 4px 14px rgba(13,79,60,0.06);
    backdrop-filter: blur(8px);
  }
}
/* Mobile: NOT sticky — does not eat viewport while scrolling */
@media (max-width: 899px) {
  #clarity-visit-pill-bar{
    position: relative !important;
    top: auto !important;
    box-shadow: none;
  }
}
.clarity-meme-push-pill{
  display: inline-flex !important;
  align-items: center;
  gap: 0.3rem;
  margin: 0.35rem 0.25rem 0 !important;
  font-size: 0.78rem !important;
}
.cv-flash { outline: 2px solid rgba(13,79,60,0.55) !important; outline-offset: 3px; }
html[data-theme="dark"] .cv-flash { outline-color: rgba(201,162,39,0.65) !important; }

/* clarity-gate-hide-css-v4 */
/* Path filter — sole authority */
.card.gate-hidden,
[id$="-card"].gate-hidden,
.fiqh-tool-card.gate-hidden,
[data-rrra].gate-hidden {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  max-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
  overflow: hidden !important;
  pointer-events: none !important;
}
/* Vault only: never hide these by path */
#tab-notes #user-family-tree-card,
#tab-notes #faraid-card,
#tab-notes #wasiyyah-card,
#user-family-tree-card:not(.gate-force-hide),
#faraid-card:not(.gate-force-hide),
#wasiyyah-card:not(.gate-force-hide) {
  /* path filter script will not add gate-hidden to these */
}
/* Visit bar stitched to banner lower edge */
#clarity-visit-pill-bar.cv-stitched-banner,
#clarity-visit-pill-bar {
  display: flex;
  flex-wrap: nowrap;
  gap: 0.3rem;
  align-items: center;
  padding: 0.32rem 0.55rem;
  margin: 0;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  background: linear-gradient(180deg, rgba(246,241,231,0.98), rgba(236,245,240,0.95));
  border-bottom: 1px solid rgba(13,79,60,0.14);
  width: 100%;
  box-sizing: border-box;
}
#clarity-visit-pill-bar .cv-hint {
  font-size: 0.68rem;
  opacity: 0.55;
  white-space: nowrap;
}
@media (min-width: 900px) {
  #clarity-visit-pill-bar {
    position: sticky;
    top: 0;
    z-index: 95;
    box-shadow: 0 3px 12px rgba(13,79,60,0.08);
  }
}
@media (max-width: 899px) {
  #clarity-visit-pill-bar {
    position: relative !important;
    top: auto !important;
  }
}
html[data-theme="dark"] #clarity-visit-pill-bar {
  background: linear-gradient(180deg, rgba(10,24,18,0.98), rgba(12,28,22,0.95));
  border-bottom-color: rgba(201,162,39,0.2);
}

/* clarity-path-css-filter-v1 */
/* Static base — dynamic lock style#clarity-path-lock is appended last and wins cascade */
[data-gate-hidden="1"] {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  max-height: 0 !important;
  overflow: hidden !important;
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
  pointer-events: none !important;
}
.banner #clarity-visit-pill-bar {
  display: flex !important;
  flex-wrap: nowrap;
  gap: 0.3rem;
  align-items: center;
  width: 100%;
  box-sizing: border-box;
  padding: 0.35rem 0.6rem;
  margin: 0;
  overflow-x: auto;
  border-top: 1px solid rgba(13,79,60,0.12);
  background: rgba(246,241,231,0.96);
  position: relative;
  z-index: 6;
}
html[data-theme="dark"] .banner #clarity-visit-pill-bar {
  background: rgba(10,24,18,0.95);
}

/* clarity-path-progress-css-v1 */
.clarity-path-intro {
  margin: 0.4rem 0 0.55rem;
  padding: 0.7rem 0.9rem;
  border-radius: 14px;
  background: linear-gradient(135deg, rgba(13,79,60,0.09), rgba(42,95,122,0.08));
  border: 1px solid rgba(13,79,60,0.15);
  font-size: 0.86rem;
  line-height: 1.5;
  color: var(--text, #1c2a22);
}
.clarity-path-intro strong { color: var(--accent, #0d4f3c); }
html[data-theme="dark"] .clarity-path-intro {
  background: linear-gradient(135deg, rgba(201,162,39,0.1), rgba(42,95,122,0.12));
  border-color: rgba(201,162,39,0.22);
  color: #e8f0ea;
}
html[data-theme="dark"] .clarity-path-intro strong { color: #c9a227; }
.clarity-path-intro .cpi-row {
  display: flex; flex-wrap: wrap; gap: 0.3rem; margin-top: 0.45rem;
}
.clarity-path-intro .cpi-pill {
  font-size: 0.68rem; font-weight: 700; padding: 0.16rem 0.5rem;
  border-radius: 999px; background: rgba(13,79,60,0.1);
}
html[data-theme="dark"] .clarity-path-intro .cpi-pill { background: rgba(201,162,39,0.14); }

/* Smooth quiz — soft sheet, not harsh blackout */
#clarity-path-quiz-modal {
  position: fixed; inset: 0; z-index: 100000;
  display: none; align-items: flex-end; justify-content: center;
  background: rgba(10, 24, 18, 0.35);
  padding: 0;
  opacity: 0;
  transition: opacity 0.2s ease;
}
#clarity-path-quiz-modal.open {
  display: flex !important;
  opacity: 1;
}
@media (min-width: 720px) {
  #clarity-path-quiz-modal { align-items: center; padding: 1rem; }
}
#clarity-path-quiz-modal .cpq-card {
  width: 100%; max-width: 26rem;
  background: #f8f5ee; color: #1c2a22;
  border-radius: 18px 18px 0 0;
  padding: 1.15rem 1.2rem 1.35rem;
  box-shadow: 0 -8px 32px rgba(0,0,0,0.18);
  border: 1px solid rgba(13,79,60,0.16);
  max-height: 88vh; overflow-y: auto;
  transform: translateY(12px);
  transition: transform 0.22s ease;
}
#clarity-path-quiz-modal.open .cpq-card { transform: translateY(0); }
@media (min-width: 720px) {
  #clarity-path-quiz-modal .cpq-card {
    border-radius: 16px;
    transform: translateY(0) scale(0.98);
  }
  #clarity-path-quiz-modal.open .cpq-card { transform: scale(1); }
}
html[data-theme="dark"] #clarity-path-quiz-modal .cpq-card {
  background: #15241d; color: #e8f0ea; border-color: rgba(201,162,39,0.25);
}
#clarity-path-quiz-modal h3 { margin: 0 0 0.3rem; font-size: 1.08rem; color: #0d4f3c; }
html[data-theme="dark"] #clarity-path-quiz-modal h3 { color: #c9a227; }
#clarity-path-quiz-modal .cpq-sub { font-size: 0.82rem; opacity: 0.85; margin: 0 0 0.75rem; line-height: 1.45; }
#clarity-path-quiz-modal .cpq-q { font-weight: 650; margin: 0.55rem 0 0.4rem; font-size: 0.94rem; }
#clarity-path-quiz-modal .cpq-opt {
  display: block; width: 100%; text-align: left; margin: 0.28rem 0;
  padding: 0.58rem 0.8rem; border-radius: 11px;
  border: 1.5px solid rgba(13,79,60,0.2); background: #fff; color: #1c2a22;
  cursor: pointer; font-size: 0.88rem;
}
html[data-theme="dark"] #clarity-path-quiz-modal .cpq-opt {
  background: rgba(255,255,255,0.06); color: #e8f0ea; border-color: rgba(255,255,255,0.12);
}
#clarity-path-quiz-modal .cpq-opt.correct { border-color: #1a7a4a; background: rgba(26,122,74,0.14); }
#clarity-path-quiz-modal .cpq-opt.wrong { border-color: #a44; background: rgba(160,40,40,0.1); }
#clarity-path-quiz-modal .cpq-actions { display: flex; flex-wrap: wrap; gap: 0.4rem; margin-top: 0.85rem; }
#clarity-path-quiz-modal .cpq-actions button {
  border-radius: 999px; padding: 0.45rem 0.95rem; font-weight: 700; cursor: pointer;
  border: 1.5px solid rgba(13,79,60,0.22); background: #fff; color: #0d4f3c; font-size: 0.86rem;
}
#clarity-path-quiz-modal .cpq-actions .cpq-primary {
  background: #0d4f3c; color: #f3faf6; border: none;
}
#clarity-path-rail {
  display: flex; flex-wrap: wrap; gap: 0.28rem; margin: 0.25rem 0 0.4rem; font-size: 0.7rem;
}
#clarity-path-rail .cpr-step {
  padding: 0.18rem 0.5rem; border-radius: 999px;
  border: 1px solid rgba(13,79,60,0.18); background: rgba(13,79,60,0.06);
}
#clarity-path-rail .cpr-step.current { background: #0d4f3c; color: #f5fbf8; border-color: transparent; }
#clarity-path-rail .cpr-step.locked { opacity: 0.45; }
.cgs-btn.path-locked { opacity: 0.5; }
.cgs-btn.path-locked::after { content: " 🔒"; font-size: 0.65rem; }

/* clarity-night-contrast-v1 */
/* Night mode — reduce washout, stronger contrast */
html[data-theme="dark"] {
  --bg: #070d0a !important;
  --bg-elevated: #101a14 !important;
  --text: #eef6f0 !important;
  --text-muted: #a8b9ae !important;
  --border: #2a3d32 !important;
  --accent: #5ec492 !important;
  color: #eef6f0 !important;
  background-color: #070d0a !important;
}
html[data-theme="dark"] body {
  background-color: #070d0a !important;
  color: #eef6f0 !important;
}
html[data-theme="dark"] .card,
html[data-theme="dark"] [class*="card"] {
  background: linear-gradient(165deg, #121c16 0%, #0c1410 100%) !important;
  border-color: #2f4538 !important;
  color: #eef6f0 !important;
}
html[data-theme="dark"] .card p,
html[data-theme="dark"] .card li,
html[data-theme="dark"] .card .td-src {
  color: #d5e3da !important;
}
html[data-theme="dark"] .card h2,
html[data-theme="dark"] .card h3 {
  color: #f0e6c8 !important;
}
html[data-theme="dark"] .btn-soft,
html[data-theme="dark"] button.btn-soft {
  background: #1a2a22 !important;
  color: #e8f5ee !important;
  border-color: #3d5a4a !important;
}
/* Tawbah / step chips that were washed light gray */
html[data-theme="dark"] .card div[style*="background"],
html[data-theme="dark"] .tawbah-step,
html[data-theme="dark"] .step-chip,
html[data-theme="dark"] .card > div > div[style*="#f"],
html[data-theme="dark"] .card div[style*="rgb(245"],
html[data-theme="dark"] .card div[style*="#eef"],
html[data-theme="dark"] .card div[style*="#f7f"] {
  /* cannot reliably override inline; target common classes */
}
html[data-theme="dark"] .hell-step,
html[data-theme="dark"] .tawbah-box,
html[data-theme="dark"] .repent-step {
  background: #1a2820 !important;
  color: #e8f0ea !important;
  border-color: #3d5a4a !important;
}
/* Generic light boxes inside dark cards */
html[data-theme="dark"] .card [style*="background:#f"],
html[data-theme="dark"] .card [style*="background: #f"],
html[data-theme="dark"] .card [style*="background:#e"],
html[data-theme="dark"] .card [style*="background: #e"],
html[data-theme="dark"] .card [style*="background:#fff"],
html[data-theme="dark"] .card [style*="background: #fff"],
html[data-theme="dark"] .card [style*="background:#F"] {
  background: #1a2820 !important;
  color: #e8f0ea !important;
}
html[data-theme="dark"] .global-nav,
html[data-theme="dark"] #clarity-global-nav {
  background: #0c1611 !important;
  border-color: #2a3d32 !important;
  color: #eef6f0 !important;
}
html[data-theme="dark"] .nav-tabs button,
html[data-theme="dark"] .tab-btn {
  color: #c5d4cb !important;
}
html[data-theme="dark"] .nav-tabs button.is-active,
html[data-theme="dark"] .nav-tabs button.active,
html[data-theme="dark"] .tab-btn.active {
  color: #f5fbf8 !important;
}
html[data-theme="dark"] .clarity-path-intro {
  background: linear-gradient(135deg, rgba(30,50,40,0.95), rgba(20,36,28,0.95)) !important;
  color: #e8f0ea !important;
  border-color: #3d5a4a !important;
}
html[data-theme="dark"] #clarity-visit-pill-bar,
html[data-theme="dark"] .banner #clarity-visit-pill-bar {
  background: #0c1611 !important;
  border-color: #2a3d32 !important;
}
html[data-theme="dark"] #clarity-visit-pill-bar .cv-pill {
  background: #1a2a22 !important;
  color: #e6d090 !important;
  border-color: #4a6040 !important;
}
html[data-theme="dark"] .rrra-hub-body,
html[data-theme="dark"] .rrra-hub-hero {
  color: #e8f0ea !important;
}
html[data-theme="dark"] a {
  color: #8fd4b0 !important;
}
html[data-theme="dark"] .cgs-btn {
  background: #152019 !important;
  color: #e8f0ea !important;
  border-color: #3d5a4a !important;
}
html[data-theme="dark"] .cgs-btn.is-active {
  color: #fff !important;
}

/* clarity-path-reset-css-v1 */
.cgs-btn.cgs-reset {
  border-style: dashed;
  opacity: 0.9;
  font-weight: 650;
}
.cgs-btn.cgs-reset:hover {
  border-color: #a44;
  color: #a44;
}
html[data-theme="dark"] .cgs-btn.cgs-reset:hover {
  border-color: #e88;
  color: #f0c0c0;
}
.cgs-btn.cgs-reset.is-active {
  background: transparent !important;
  box-shadow: none !important;
}

/* clarity-tajweed-force-show-css-v1 */
html[data-clarity-path="practicing"] #tajweed-live-card,
html[data-clarity-path="practicing"] #tajweed-path-card,
html[data-clarity-path="practicing"] #tj-deep-studio,
html[data-clarity-path="dai"] #tajweed-live-card,
html[data-clarity-path="dai"] #tajweed-path-card,
html[data-clarity-path="dai"] #tj-deep-studio {
  display: block !important;
  visibility: visible !important;
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
  opacity: 1 !important;
}
#clarity-path-rail { display: none !important; }

/* clarity-track-always-visible-css-v1 */
.clarity-gate-switcher .cgs-btn.cgs-daily,
.clarity-gate-switcher .cgs-btn[data-gate="practicing"],
.clarity-gate-switcher .cgs-btn.cgs-seeker,
.clarity-gate-switcher .cgs-btn.cgs-new,
.clarity-gate-switcher .cgs-btn.cgs-dai,
.clarity-gate-switcher .cgs-btn.cgs-reset {
  display: inline-flex !important;
  visibility: visible !important;
  opacity: 1;
}
.clarity-gate-switcher .cgs-btn.path-locked {
  opacity: 0.55 !important;
}

/* clarity-meme-hide-until-unlock-css-v1 */
/* Hide meme UI on Seeker / New Muslim only */
html[data-clarity-path="seeker"] #meme-card,
html[data-clarity-path="new_muslim"] #meme-card,
html[data-clarity-path="seeker"] .clarity-meme-push-pill,
html[data-clarity-path="new_muslim"] .clarity-meme-push-pill,
html[data-clarity-path="seeker"] .clarity-meme-ui-hidden,
html[data-clarity-path="new_muslim"] .clarity-meme-ui-hidden {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}
/* Explicitly SHOW studio + push UI on Daily + Da’i */
html[data-clarity-path="practicing"] #meme-card,
html[data-clarity-path="dai"] #meme-card {
  display: block !important;
  visibility: visible !important;
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}
html[data-clarity-path="practicing"] #meme-card.gate-hidden,
html[data-clarity-path="dai"] #meme-card.gate-hidden {
  display: block !important;
  visibility: visible !important;
  pointer-events: auto !important;
}
html[data-clarity-path="practicing"] .clarity-meme-ui-hidden,
html[data-clarity-path="dai"] .clarity-meme-ui-hidden {
  display: inline-flex !important;
  visibility: visible !important;
  pointer-events: auto !important;
  width: auto !important;
  height: auto !important;
  overflow: visible !important;
  margin: revert !important;
  padding: revert !important;
  border: revert !important;
  opacity: 1 !important;
}

/* clarity-dedupe-bookmarks-css-v1 */
/* ONE last-visited strip only (under banner) */
#clarity-visit-pill-bar { display: flex !important; flex-wrap: wrap; gap: 0.3rem; }
/* Hide phased-learning mini progress pills — TRACK row is enough */
#clarity-path-intro .cpi-row,
#clarity-path-intro .cpi-pill,
#clarity-path-rail { display: none !important; }
/* Hide any second visit bar clones */
#clarity-visit-pill-bar ~ #clarity-visit-pill-bar,
.clarity-visit-pill-bar-clone { display: none !important; }
/* In-tab section chips OK; hide if they were mistakenly fixed under banner */
.banner #clarity-section-pills,
.banner .clarity-section-pills-host,
#clarity-global-nav ~ .clarity-section-pills-host {
  /* allow in-tab only */
}

/* clarity-doors-flow-css-v1 */
/* Dai phase — never force-hide content cards */
html[data-clarity-path="dai"] .card.gate-hidden,
html[data-clarity-path="dai"] [id$="-card"].gate-hidden,
html[data-clarity-path="dai"] .card[data-gate-hidden="1"],
html[data-clarity-path="dai"] [id$="-card"][data-gate-hidden="1"] {
  display: block !important;
  visibility: visible !important;
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}
html[data-clarity-path="dai"] .cgs-btn.path-locked {
  opacity: 1 !important;
  pointer-events: auto !important;
}
/* Smooth door panel transitions */
.tab-panel {
  transition: opacity 0.2s ease;
}
.tab-panel.active {
  display: block !important;
  opacity: 1 !important;
}
body.section-open #main-application-workspace,
body.section-open .page-wrapper {
  scroll-margin-top: 0.5rem;
}

/* clarity-grave-path-curriculum-css */
.grave-path-strip {
  margin: 0.75rem 0 1rem;
  padding: 0.85rem 1rem;
  border-radius: 16px;
  border: 1px solid rgba(212,180,90,0.35);
  background: linear-gradient(145deg, rgba(13,79,60,0.1), rgba(8,40,30,0.06));
}
.grave-path-strip h3 {
  margin: 0 0 0.35rem;
  font-size: 1rem;
  color: var(--accent, #0d4f3c);
}
.grave-path-strip .gps-goal {
  font-size: 0.82rem;
  color: var(--text-muted, #5c6b62);
  margin: 0 0 0.65rem;
}
.gps-phases {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0.4rem;
}
@media (min-width: 720px) {
  .gps-phases { grid-template-columns: repeat(4, 1fr); }
}
.gps-phase {
  padding: 0.55rem 0.6rem;
  border-radius: 12px;
  background: var(--card-bg, #fff);
  border: 1px solid var(--border, #e0d5c4);
  font-size: 0.75rem;
  line-height: 1.35;
  cursor: pointer;
  text-align: left;
}
.gps-phase strong { display: block; font-size: 0.78rem; margin-bottom: 0.2rem; color: var(--accent, #0d4f3c); }
.gps-phase.active {
  border-color: var(--gold, #b8922a);
  box-shadow: 0 0 0 2px rgba(184,146,42,0.25);
}
.gps-phase .gps-tag {
  display: inline-block;
  margin-top: 0.3rem;
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--gold, #b8922a);
}
#grave-path-card, #new-muslim-foundations-card, #salah-starter-card,
#daily-deed-ledger-card, #dai-transmit-card {
  border-radius: 16px;
  padding: 1rem 1.1rem;
  margin-bottom: 1rem;
  background: var(--card-bg, #f7fcf9);
  border: 1px solid var(--border, #a8c9b6);
}
.gpc-links { display: flex; flex-wrap: wrap; gap: 0.35rem; margin-top: 0.55rem; }
.gpc-links a {
  font-size: 0.72rem; font-weight: 600;
  padding: 0.28rem 0.55rem; border-radius: 999px;
  background: rgba(13,79,60,0.1); color: var(--accent, #0a3d2e);
  text-decoration: none; border: 1px solid rgba(13,79,60,0.18);
}
.gpc-links a:hover { background: rgba(13,79,60,0.18); }
.gpc-note {
  font-size: 0.72rem; margin-top: 0.55rem;
  padding: 0.4rem 0.55rem; border-radius: 10px;
  background: #f3f0e4; color: #2a3228; border: 1px solid #d0c6a4;
}
html[data-theme="dark"] #grave-path-card,
html[data-theme="dark"] #new-muslim-foundations-card,
html[data-theme="dark"] #salah-starter-card,
html[data-theme="dark"] #daily-deed-ledger-card,
html[data-theme="dark"] #dai-transmit-card {
  background: rgba(15,30,24,0.95); border-color: rgba(212,180,90,0.25); color: #e8f0ea;
}
html[data-theme="dark"] .gpc-note { background: rgba(40,36,24,0.9); color: #e8e0d0; border-color: rgba(212,180,90,0.3); }
html[data-theme="dark"] .gpc-links a { background: rgba(212,180,90,0.12); color: #e8d48a; border-color: rgba(212,180,90,0.3); }

/* clarity-banner-nuclear-css */
/* Nuclear: banner is a fixed clip box. Media cannot affect document flow. */
#clarity-top-duo {
  position: relative !important;
  z-index: 20 !important;
  overflow: visible !important;
}
#clarity-top-duo .banner,
.banner {
  position: relative !important;
  display: block !important;
  overflow: hidden !important;
  isolation: isolate !important;
  /* height comes only from overlay; media never contributes */
  height: auto !important;
  min-height: 9.5rem !important;
  max-height: 18rem !important;
  z-index: 1 !important;
}
#clarity-top-duo .banner-overlay,
.banner-overlay {
  position: relative !important;
  z-index: 3 !important;
  display: flex !important;
}
/* Media layer: painted only inside banner, zero layout size contribution */
#clarity-top-duo .banner-media,
.banner-media,
#banner-media {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  z-index: 0 !important;
  pointer-events: none !important;
  /* critical: do not let children escape paint */
  contain: strict !important;
  clip: rect(0, auto, auto, 0) !important;
  clip-path: inset(0) !important;
}
#banner-img,
.banner-still-img,
#banner-live,
.banner-live-iframe,
.banner-media img,
.banner-media iframe {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  max-height: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  padding: 0 !important;
  object-fit: cover !important;
  transform: none !important;
  inset: auto !important; /* override any inset:-18% leftovers */
}
/* Hidden live = no paint, no decode */
#banner-live[hidden],
.banner-live-iframe[hidden],
#banner-live:not([src]),
.banner-media:not(.live-active) #banner-live {
  display: none !important;
  visibility: hidden !important;
  width: 0 !important;
  height: 0 !important;
  opacity: 0 !important;
}
/* Anything that escaped the banner — kill it */
body > #banner-live,
body > #banner-img,
body > .banner-media,
#main-application-workspace > #banner-live,
#main-application-workspace > #banner-img,
.page-wrapper > iframe[src*="youtube"] {
  display: none !important;
  height: 0 !important;
  width: 0 !important;
}
/* Content must start cleanly under duo */
#clarity-visit-pill-bar,
#clarity-grave-path-strip,
#main-application-workspace,
.main-content {
  position: relative !important;
  z-index: 2 !important;
  clear: both !important;
}

/* clarity-visit-strip-visible */
#clarity-visit-pill-bar,
.cv-stitched-banner {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  gap: 0.35rem !important;
  min-height: 2.35rem !important;
  max-height: none !important;
  padding: 0.35rem 0.55rem !important;
  margin: 0 !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  -webkit-overflow-scrolling: touch;
  position: relative !important;
  z-index: 25 !important;
  background: linear-gradient(180deg, #0f241c 0%, #0c1c16 100%) !important;
  border-bottom: 1px solid rgba(212, 180, 90, 0.28) !important;
  color: #e8f0ea !important;
  font-size: 0.72rem !important;
  visibility: visible !important;
  opacity: 1 !important;
}
#clarity-visit-pill-bar .cv-label {
  font-weight: 800 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  color: var(--gold, #d4b45a) !important;
  flex-shrink: 0 !important;
}
#clarity-visit-pill-bar .cv-hint {
  opacity: 0.75 !important;
  flex-shrink: 0 !important;
}
#clarity-visit-pill-bar a,
#clarity-visit-pill-bar button,
#clarity-visit-pill-bar .cv-pill {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.2rem !important;
  padding: 0.2rem 0.5rem !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,0.08) !important;
  border: 1px solid rgba(255,255,255,0.12) !important;
  color: #e8f0ea !important;
  white-space: nowrap !important;
  text-decoration: none !important;
  font-size: 0.68rem !important;
}
html[data-theme="light"] #clarity-visit-pill-bar,
html[data-theme="day"] #clarity-visit-pill-bar {
  background: linear-gradient(180deg, #e8f5ee, #dceee4) !important;
  color: #0c1a14 !important;
  border-bottom-color: #a8c9b6 !important;
}
html[data-theme="light"] #clarity-visit-pill-bar .cv-label,
html[data-theme="day"] #clarity-visit-pill-bar .cv-label {
  color: #0a3d2e !important;
}
html[data-theme="light"] #clarity-visit-pill-bar a,
html[data-theme="light"] #clarity-visit-pill-bar .cv-pill,
html[data-theme="day"] #clarity-visit-pill-bar a,
html[data-theme="day"] #clarity-visit-pill-bar .cv-pill {
  background: rgba(13,79,60,0.08) !important;
  color: #0c1a14 !important;
  border-color: #a8c9b6 !important;
}
/* Banner must not cover the strip */
#clarity-top-duo .banner {
  max-height: min(34vh, 16.5rem) !important;
}

/* clarity-tj-meme-tweet-revamp-css */
/* —— Tajweed record level meter —— */
.tj-lmr-live-meter,
#tj-lmr-meter-host {
  margin: 0.45rem 0 0.35rem !important;
  padding: 0.4rem 0.55rem !important;
  border-radius: 12px !important;
  background: rgba(0,0,0,0.22) !important;
  border: 1px solid rgba(212,180,90,0.25) !important;
}
.tj-lmr-live-meter .meter-label,
.meter-label {
  font-size: 0.68rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase !important;
  color: var(--gold, #d4b45a) !important;
  margin-bottom: 0.25rem !important;
}
.tj-lmr-live-meter .meter-track,
.meter-track {
  height: 0.55rem !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,0.12) !important;
  overflow: hidden !important;
  position: relative !important;
}
.tj-lmr-live-meter .meter-fill,
#tj-lmr-meter-fill,
.meter-fill {
  height: 100% !important;
  width: 0%;
  border-radius: 999px !important;
  background: linear-gradient(90deg, #1a6b52, #d4b45a 70%, #e8c84a) !important;
  transition: width 0.06s linear !important;
  box-shadow: 0 0 8px rgba(212,180,90,0.45) !important;
}
.tj-lmr-live-meter.recording .meter-track {
  box-shadow: inset 0 0 0 1px rgba(212,180,90,0.35);
}
html[data-theme="light"] .tj-lmr-live-meter,
html[data-theme="day"] .tj-lmr-live-meter {
  background: rgba(13,79,60,0.08) !important;
}
html[data-theme="light"] .meter-track,
html[data-theme="day"] .meter-track {
  background: rgba(13,79,60,0.12) !important;
}

/* Indo-Pak style hint in meme font select */
#meme-font option[value="indopak"],
#meme-font option[value="nastaliq"] {
  font-weight: 600;
}

/* clarity-companion-polish-v1 */
/* Companion root — University /campus/ untouched (not in this file) */
#clarity-door-rail {
  display: flex !important;
  visibility: visible !important;
  z-index: 40 !important;
}
#clarity-visit-pill-bar, .cv-stitched-banner {
  display: flex !important;
  align-items: center !important;
  min-height: 2.35rem !important;
  padding: 0.35rem 0.55rem !important;
  visibility: visible !important;
  opacity: 1 !important;
  z-index: 25 !important;
  position: relative !important;
}
.tab-panel { display: none !important; }
.tab-panel.active, .tab-panel.is-active {
  display: block !important;
  opacity: 1 !important;
}
#main-application-workspace, .main-content { min-height: 40vh; }
  display: none !important;
  height: 0 !important;
  width: 0 !important;
  overflow: hidden !important;
  pointer-events: none !important;
}
/* Meter readable */
.tj-lmr-live-meter .meter-track, .meter-track {
  height: 0.55rem !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,0.12) !important;
  overflow: hidden !important;
}
#tj-lmr-meter-fill, .meter-fill {
  height: 100% !important;
  background: linear-gradient(90deg, #1a6b52, #d4b45a) !important;
  transition: width 0.08s linear !important;
}

/* clarity-no-storage-chip */
#nuros-storage-chip,.nuros-storage-chip{display:none!important;height:0!important;overflow:hidden!important;position:absolute!important;left:-9999px!important}

/* ondev-dedupe */
.banner h1 .brand-ondev ~ .brand-ondev,
.banner h1 .nuros-ondev-chip ~ .nuros-ondev-chip { display: none !important; }

/* clarity-landing-day-css */
/* Day landing sits ABOVE Reminder hub — not buried */
#clarity-day-landing {
  order: -1;
  margin: 0.4rem 0.55rem 0.75rem;
  display: grid;
  gap: 0.55rem;
  position: relative;
  z-index: 18;
}
#clarity-day-landing .cdl-card {
  border-radius: 16px;
  border: 1px solid rgba(184,146,42,0.35);
  background: linear-gradient(165deg, rgba(15,36,28,0.97), rgba(10,24,18,0.99));
  color: #e8f0ea;
  padding: 0.8rem 0.95rem;
}
html[data-theme="light"] #clarity-day-landing .cdl-card,
html[data-theme="day"] #clarity-day-landing .cdl-card {
  background: linear-gradient(165deg, #f3faf6, #e7f3ec);
  color: #0c1a14;
  border-color: #a8c9b6;
}
.cdl-head { display:flex; align-items:center; justify-content:space-between; gap:.5rem; flex-wrap:wrap; margin-bottom:.4rem; }
.cdl-head h2 { margin:0; font-size:1.02rem; font-weight:800; }
.cdl-period { font-size:.7rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase;
  color:var(--gold,#d4b45a); padding:.12rem .45rem; border-radius:999px; border:1px solid rgba(212,180,90,.35); }
.cdl-row { display:flex; align-items:center; gap:.55rem; flex-wrap:wrap; }
.cdl-salah, .cdl-tas { display:inline-flex; align-items:center; gap:.3rem; padding:.3rem .5rem; border-radius:12px; background:rgba(255,255,255,.06); font-size:.82rem; }
.cdl-lane { font-size:.68rem; font-weight:800; text-transform:uppercase; letter-spacing:.05em; color:var(--gold,#d4b45a); margin:.3rem 0 .1rem; }
.cdl-deed { margin:0; line-height:1.45; font-size:.92rem; }
.cdl-note { margin:.3rem 0 0; font-size:.7rem; opacity:.78; }
.cdl-tas button { border:0; border-radius:10px; padding:.3rem .5rem; background:rgba(212,180,90,.2); color:inherit; cursor:pointer; font-weight:700; }
.cdl-adhkar-ar { font-size:1.2rem; line-height:1.7; direction:rtl; text-align:right; margin:.35rem 0; font-family:"Noto Naskh Arabic","Scheherazade New",serif; }
.cdl-adhkar-en { margin:.2rem 0; font-size:.88rem; opacity:.92; }
.cdl-adhkar-ref { font-size:.7rem; opacity:.7; margin:.15rem 0 .4rem; }
.cdl-pills { display:flex; flex-wrap:wrap; gap:.3rem; margin-top:.3rem; }
.cdl-pills button { border-radius:999px; border:1px solid rgba(255,255,255,.14); background:rgba(255,255,255,.07);
  color:inherit; padding:.26rem .6rem; font-size:.74rem; cursor:pointer; font-weight:600; }
html[data-theme="light"] .cdl-pills button, html[data-theme="day"] .cdl-pills button {
  border-color:#a8c9b6; background:rgba(13,79,60,.07); color:#0c1a14;
}
.cdl-count-btn { border:0; border-radius:10px; padding:.35rem .7rem; background:linear-gradient(90deg,#1a6b52,#b8922a); color:#fff; font-weight:700; cursor:pointer; }
/* Two paths — Companion + University */
.dual-tiles {
  display: grid !important;
  grid-template-columns: 1fr 1fr;
  gap: 0.55rem;
  margin: 0.15rem 0 0.35rem;
}
@media (max-width: 520px) { .dual-tiles { grid-template-columns: 1fr; } }
.dual-tile {
  display: flex; flex-direction: column; gap: 0.2rem;
  padding: 0.85rem 0.9rem; border-radius: 16px; text-decoration: none; color: inherit;
  border: 1px solid rgba(212,180,90,0.35);
  background: linear-gradient(165deg, rgba(18,28,22,.95), rgba(10,16,13,.98));
  transition: transform .15s ease, border-color .15s ease;
}
.dual-tile:hover { transform: translateY(-2px); border-color: rgba(212,180,90,.55); }
.dual-tile-university { border-color: rgba(212,180,90,.5); }
.dual-ico { font-size: 1.2rem; }
.dual-name { font-weight: 800; font-size: 0.95rem; }
.dual-tile small { opacity: .85; font-size: .75rem; line-height: 1.35; }
html[data-theme="light"] .dual-tile, html[data-theme="day"] .dual-tile {
  background: linear-gradient(165deg, #f7fbf8, #eaf5ef); color: #0c1a14; border-color: #a8c9b6;
}
#clarity-reopen-bar {
  display: flex; align-items: center; gap: .45rem; flex-wrap: wrap;
  margin: 0 .55rem .5rem; padding: .35rem .6rem; border-radius: 12px;
  border: 1px dashed rgba(184,146,42,.4); background: rgba(15,36,28,.55);
  font-size: .78rem; color: #e8f0ea; z-index: 18; position: relative;
}
html[data-theme="light"] #clarity-reopen-bar, html[data-theme="day"] #clarity-reopen-bar {
  background: rgba(232,245,238,.92); color: #0c1a14; border-color: #a8c9b6;
}
#clarity-reopen-bar button {
  border: 0; border-radius: 999px; padding: .22rem .6rem;
  background: var(--gold,#b8922a); color: #0c1a14; font-weight: 700; cursor: pointer;
}
/* Keep landing above main workspace content */
#main-application-workspace { display: flex; flex-direction: column; }
#clarity-day-landing { flex-shrink: 0; }

/* clarity-mobile-unstick-banner */
/* Mobile: never stick banner/nav — free page scroll */
@media (max-width: 900px) {
  html, body {
    height: auto !important;
    min-height: 100% !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    position: static !important;
    overscroll-behavior-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
  }
  .global-nav, nav.global-nav,
  #clarity-top-duo,
  #clarity-top-duo .banner,
  .banner,
  .banner-overlay,
  #one-action-strip,
  .one-action-strip {
    position: relative !important;
    top: auto !important;
    bottom: auto !important;
    sticky: none;
  }
  .banner,
  #clarity-top-duo .banner {
    position: relative !important;
    top: auto !important;
    z-index: 5 !important;
  }
  .global-nav, nav.global-nav {
    position: relative !important;
    top: auto !important;
    z-index: 6 !important;
  }
  #clarity-visit-pill-bar,
  .cv-stitched-banner {
    position: relative !important;
    top: auto !important;
  }
  /* Avoid 100vh lock traps on mobile chrome */
  #main-application-workspace,
  .main-content,
  #clarity-app-root {
    overflow: visible !important;
    height: auto !important;
    max-height: none !important;
  }
  /* Door rail stays fixed at bottom but must not lock body */
  #clarity-door-rail {
    position: fixed !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
  }
}