:root {
  --letter-glow: #ff5470;
  --letter-val:  #ffffff;
  --bg-deep:    #000000;
  --bg-card:    #000000;
  --bg-input:   #000000;
  --bg-hover:   #14161a;
  --border:     #ffffff;
  --border-lit: #ffffff;
  --gold:       #c9a84c;
  --gold-dim:   #7a6030;
  --gold-glow:  #e8c96a;
  --cyan:       #22d3ee;
  --cyan-glow:  #67e8f9;
  --violet:     #a78bfa;
  --rose:       #f87171;
  --sage:       #6ab88a;
  --amber:      #fbbf24;
  --sky:        #38bdf8;
  --text-pri:   #e8e2d5;
  --text-sec:   #8a96a8;
  --text-muted: #c9a84c;
  --radius:     8px;
  --radius-lg:  14px;
  --amber-num:  #ffca28;   /* لون قيم الأرقام المميّزة — مستخدَم ١١ مرة عبر الملف، اسمه الآن رسمي */
  --gold-deep:  #a07830;   /* نهاية تدرّج الذهب في الأزرار النشطة — ١٧ استخدامًا */
  --ink:        #0a0c10;   /* نص داكن فوق خلفيات ذهبية — ٣٨ استخدامًا */
  /* ── خلفية الصفحة (--bg-deep/--bg) أسود خالص. خلفيات البطاقات (--bg-card/--bg2/--bg3/--bg4)
     رُجِّعت لأسود قاتم كامل أيضًا (٢٠٢٦-٠٧-١٨) — بطلب صريح: أي مربع فيه نص لازم يكون أسود قاتم
     كاملًا عشان يحجب صورة الخلفية المتحركة/الساطعة خلفه تمامًا، بدل الاعتماد على تعتيم الصورة نفسها. ── */
  --bg2:#000000; --bg3:#0a0c10; --bg4:#14161a;
  --bdr:#ffffff; --bdr2:#ffffff;
  --gold2:#e8c96a;   /* == --gold-glow بنفس القيمة، اسم مكرَّر — أُبقي عليه بلا حذف الآن، مرشَّح لدمج لاحق منفصل */
  --green:#34d399;
  --txt:#e2e8f0; --txt2:#94a3b8; --txt3:#c9a84c;   /* --txt3 == --gold == --text-muted بنفس القيمة أيضًا */
  --r:10px; --r2:16px;
  --font-main: 'IBM Plex Sans Arabic', sans-serif;
  color-scheme: dark;
  --color-scheme: dark;
  --gold2-cell-bg: transparent;   --gold2-cell-fg: var(--gold2);
  --cyan-cell-bg: transparent;    --cyan-cell-fg: var(--cyan);
  --violet-cell-bg: transparent;  --violet-cell-fg: var(--violet);
  --green-cell-bg: transparent;   --green-cell-fg: var(--green);
  --tarot-upright-bg: #0a180a;
  --tarot-contrary-bg: #180a0a;
  --dcr-default: #ffd740;
  --dcr-doy: #00e5ff;
  --dcr-product: #69f0ae;
  --dcr-day: #a78bfa;
  --dcr-woy: #2dd4bf;
  /* حبر الشروحات المعمَّم: بديل ملوَّن عن الأبيض/الأسود الصافيين — دافئ وبارد، بنسختين للوضعين */
  --ink-warm: #e8dfc4;
  --ink-cool: #cfe2ee;
  --z-aries: #EF5350; --z-taurus: #66BB6A; --z-gemini: #FFF176; --z-cancer: #4FC3F7;
  --z-leo: #FFA726; --z-virgo: #A5D6A7; --z-libra: #FFE082; --z-scorpio: #7E57C2;
  --z-sagittarius: #FF7043; --z-capricorn: #8D6E63; --z-aquarius: #80DEEA; --z-pisces: #80CBC4;
  --quran-teal: #4ecdc4;
  --quran-violet: #9b7cdb;
  --danger: #e05c7a;
  --tol-blue: #3498db;
  --tol-purple: #9b59b6;
  --g3d-blue: #5b8ac4;
  --g3d-indigo: #7a8bc4;
  --g3d-tan: #a8894a;
  --g3d-teal: #3ba9a0;
  --g3d-green: #4a9d6b;
  --g3d-orange: #d17a3a;
  --g3d-pink: #d4657f;
  --g3d-rose: #e0708a;
  --g3d-amber: #d4a13a;
  --g3d-violet: #9b6fd1;
  --g3d-peach: #e8935a;
  --g3d-lime: #6bbf59;
  --elem-fire: #e74c3c;
  --elem-water: #1abc9c;
  --elem-earth: #e67e22;
  --pl-sun: #F4A425;
  --pl-moon: #B0BEC5;
  --pl-mercury: #90A4AE;
  --pl-venus: #CE93D8;
  --pl-saturn: #78909C;
  --pl-neptune: #5C6BC0;
  --pl-uranus: #4DD0E1;
  --gold-title: #f3dfa3;
  --about-text: #c8c4b8;
  --admin-success: #7ecb7e;
  --admin-error: #e05252;
  --admin-gray: #888888;
  --moon-alt-ar: #8899aa;
  --moon-en: #c0c8d8;
  --moon-alt-en: #667788;
  --nav-sky: #5bb8e8;
  --nav-amber2: #e89f4e;
  --nav-orchid: #ce93d8;
  --nav-emerald: #4cc27a;
  --nav-tan: #b08968;
  --nav-mustard: #c99a3f;
  --nav-lilac: #b89ee8;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}

/* ═══ الوضع النهاري — يعيد تعريف المتغيرات البنيوية فقط (خلفية/نص/حدود)، لا يمس
   أي لون تصنيفي/زخرفي حرفي (أنظمة الجُمَّل، بطاقات التاروت، الكواكب...) ═══ */
html[data-theme="light"] {
  --letter-glow: #ae1d40;
  --letter-val:  #1c1a14;
  --bg-deep:    #f7f5ef;
  --bg-card:    #ffffff;
  --bg-input:   #ffffff;
  --bg-hover:   #ece7d8;
  --border:     #000000;
  --border-lit: #000000;
  --bdr:        #000000;
  --bdr2:       #000000;
  --text-pri:   #1c1a14;
  --text-sec:   #4a4636;
  --text-muted: #8d490d;
  --bg2:        #efe9db;
  --bg3:        #e6dfc9;
  --bg4:        #ddd4b8;
  --txt:        #1c1a14;
  --txt2:       #4a4636;
  --txt3:       #8d490d;
  --gold:       #8d490d;
  --gold-dim:   #8a4a12;
  --gold-glow:  #884a0d;
  --gold2:      #884a0d;
  --cyan:       #146470;
  --cyan-glow:  #106570;
  --violet:     #705718;
  --rose:       #971616;
  --sage:       #37654a;
  --amber:      #73570d;
  --sky:        #116084;
  --green:      #20674d;
  color-scheme: light;
  --color-scheme: light;
  --gold2-cell-bg: #f1e9d0;   --gold2-cell-fg: #111111;
  --cyan-cell-bg: #cdeff4;    --cyan-cell-fg: #111111;
  --violet-cell-bg: #d6cbf5; --violet-cell-fg: #111111;
  --green-cell-bg: #d2efe4;  --green-cell-fg: #111111;
  --tarot-upright-bg: #dfece4;
  --tarot-contrary-bg: #f2d9df;
  --dcr-default: #6d5809;
  --dcr-doy: #096570;
  --dcr-product: #12673e;
  --dcr-day: #35139a;
  --dcr-woy: #1d675d;
  --ink-warm: #3d2b10;
  --ink-cool: #12374e;
  --z-aries: #b51c18; --z-taurus: #2a672d; --z-gemini: #655d1e; --z-cancer: #106186;
  --z-leo: #854f00; --z-virgo: #456247; --z-libra: #6b5927; --z-scorpio: #6b3fa0;
  --z-sagittarius: #ab2e07; --z-capricorn: #745347; --z-aquarius: #2c636b; --z-pisces: #346460;
  --quran-teal: #25625e;
  --quran-violet: #634f8c;
  --danger: #943d51;
  --tol-blue: #205e88;
  --tol-purple: #79458e;
  --g3d-blue: #3e5e85;
  --g3d-indigo: #4e597d;
  --g3d-tan: #6c582f;
  --g3d-teal: #236560;
  --g3d-green: #2f6444;
  --g3d-orange: #864e25;
  --g3d-pink: #8c4354;
  --g3d-rose: #8b4556;
  --g3d-amber: #72571f;
  --g3d-violet: #6c4e92;
  --g3d-peach: #7d4f31;
  --g3d-lime: #38632e;
  --elem-fire: #a2352a;
  --elem-water: #0e6654;
  --elem-earth: #8a4c14;
  --pl-sun: #7a5212;
  --pl-moon: #545b5f;
  --pl-mercury: #515c61;
  --pl-venus: #6f4f75;
  --pl-saturn: #4d5c64;
  --pl-neptune: #4a569a;
  --pl-uranus: #25646c;
  --gold-title: #8a6d0f;
  --about-text: #5c5a55;
  --admin-success: #3f653f;
  --admin-error: #9d3939;
  --admin-gray: #5c5c5c;
  --moon-alt-ar: #525c66;
  --moon-en: #585c63;
  --moon-alt-en: #505d6a;
  --nav-sky: #2f6079;
  --nav-amber2: #795329;
  --nav-orchid: #6f4f75;
  --nav-emerald: #28653f;
  --nav-tan: #6d5540;
  --nav-mustard: #715623;
  --nav-lilac: #63557d;
}
html[data-theme="light"] body { background-image: none; }
select{background:var(--bg-input);color:var(--text-pri);border:1px solid var(--border);border-radius:var(--radius);}
input{background:var(--bg-input);color:var(--text-pri);font-weight:700;}
input::placeholder{color:var(--text-sec);opacity:1;}
html[data-theme="light"] input,
html[data-theme="light"] select,
html[data-theme="light"] textarea { color:#000000; }

/* ═══ حجم الخط — الموقع مبني بوحدة rem (٩٧٠ استخدامًا مقابل ٣٤ px فقط) ═══ */
html[data-fontsize="small"]  { font-size: 87.5%; }
html[data-fontsize="medium"] { font-size: 100%; }
html[data-fontsize="large"]  { font-size: 115%; }

/* ═══ لوحة إعدادات العرض (خط / حجم / مظهر) ═══ */
.raqeem-settings-panel{
  display:none;position:absolute;top:calc(100% + 6px);right:0;z-index:600;
  background:var(--bg-card);border:1px solid var(--border-lit);border-radius:var(--radius-lg);
  padding:.8rem;min-width:210px;box-shadow:0 8px 24px rgba(0,0,0,.35);direction:rtl
}
.raqeem-settings-panel.open{display:block}
.raqeem-settings-group{margin-bottom:.7rem}
.raqeem-settings-group:last-child{margin-bottom:0}
.raqeem-settings-label{font-family:var(--font-main);font-size:.7rem;color:var(--text-muted);margin-bottom:.35rem;font-weight:700}
.raqeem-settings-opt{
  display:block;width:100%;text-align:right;background:transparent;border:1px solid var(--border);
  border-radius:var(--radius);color:var(--text-sec);font-family:var(--font-main);font-size:.8rem;
  padding:.4rem .7rem;margin-bottom:.3rem;cursor:pointer;transition:all .15s
}
.raqeem-settings-opt:last-child{margin-bottom:0}
.raqeem-settings-opt:hover{border-color:var(--gold-dim);color:var(--text-pri)}
.raqeem-settings-opt.active{background:var(--gold);border-color:var(--gold);color:#0a0c10;font-weight:700}

/* ── TOP NAVIGATION BAR ── */
.top-nav {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .3rem;
  padding: .6rem 1.5rem;
  background: var(--bg-card);
  border-bottom: 1px solid var(--border);
  direction: rtl;
  position: sticky;
  top: 0;
  z-index: 500;
}
.nav-btn {
  background: transparent;
  border: none;
  padding: .4rem .8rem;
  cursor: pointer;
  transition: opacity .14s;
  white-space: nowrap;
  outline: none;
}
.nav-btn:hover { opacity: .7; }
.nav-btn:active { transform: translateY(1px); }
.nav-label {
  font-family: var(--font-main);
  font-weight: 700;
  font-size: 1.1rem;
  background: linear-gradient(135deg,#f3dfa3,#c9a84c 55%,#9a6820);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  letter-spacing: .03em;
  white-space: nowrap;
  pointer-events: none;
}
/* .nav-label defined above */
.nav-dropdown { position: relative; }
.nav-menu {
  display: none;
  position: absolute;
  top: calc(100% + 4px);
  right: 0;
  min-width: 200px;
  background: var(--bg-card);
  border: 1px solid var(--border-lit);
  border-radius: var(--radius);
  box-shadow: 0 8px 30px rgba(0,0,0,.5);
  z-index: 501;
  overflow: visible;
  direction: rtl;
}
.nav-menu.open { display: block; }
/* dropdown that opens from left edge (for left-side nav buttons) */
.nav-menu.open-left {
  right: auto;
  left: 0;
}
.nav-menu-item {
  display: block;
  width: 100%;
  padding: .6rem 1rem;
  background:var(--bg-card);
  border: none;
  text-align: right;
  font-family:var(--font-main);
  font-size: .85rem;
  color: var(--text-pri);
  cursor: pointer;
  transition: background .12s;
}
.nav-menu-item:hover { background: var(--bg-hover); }
.nav-menu-item.disabled { color: var(--text-muted); cursor: default; }
.nav-menu-item.disabled:hover { background: none; }
.nav-menu-item .coming { font-size: .65rem; color: var(--text-muted); margin-right: .3rem; }

/* ══ Mega Menu ══ */
.nav-mega {
  display: none;
  position: absolute;
  top: calc(100% + 4px);
  right: 0;
  background:var(--bg-card);
  border: 1px solid rgba(201,168,76,.2);
  border-radius: 12px;
  box-shadow: 0 8px 40px rgba(0,0,0,.8);
  z-index: 501;
  direction: rtl;
  padding: .5rem;
  gap: 0;
  display: none;
  overflow: hidden;
  width: fit-content;
}
.nav-mega.open {
  display: flex;
  flex-direction: row;
}
#symbolsMenu.open, #gematriaMenu.open {
  display: block;
}
.tools-grid-btn {
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:.5rem;padding:.9rem .5rem;
  background:transparent;border:1px solid #1e1e2e;border-radius:10px;
  cursor:pointer;transition:all .18s;text-align:center;
  font-family:var(--font-main);
}
.tools-grid-btn:hover {
  background:rgba(201,168,76,.1);
  border-color:rgba(201,168,76,.4);
  transform:translateY(-2px);
}
.tools-grid-lbl {
  font-size:.78rem;color:#e8d49a;line-height:1.4;
  font-family:var(--font-main);
}
.tgb {
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:.35rem;padding:.7rem .35rem;min-width:5.125rem;min-height:5.125rem;height:auto;
  background:var(--bg2);border:1px solid var(--bdr);border-radius:10px;
  cursor:pointer;transition:all .15s;
}
.tgb:hover { background:rgba(201,168,76,.1);border-color:rgba(201,168,76,.4);transform:translateY(-2px); }
.tgi { font-size:1.85rem;line-height:1;font-family:serif; }
.tgl { font-size:.74rem;color:var(--txt2);line-height:1.3;font-family:var(--font-main);text-align:center; }
/* كل عمود له لون مختلف */
.nav-mega-col {
  min-width: 150px;
  display: flex;
  flex-direction: column;
  gap: 0;
  border-radius: 8px;
  overflow: hidden;
  margin: 2px;
}
.nav-mega-col:nth-child(1) { --col:#c9a84c; --colbg:transparent; }
.nav-mega-col:nth-child(2) { --col:#c9a84c; --colbg:transparent; }
.nav-mega-col:nth-child(3) { --col:#c9a84c; --colbg:transparent; }
.nav-mega-col { background: transparent; }
.nav-mega-col + .nav-mega-col {
  border-right: 1px solid rgba(255,255,255,.06);
}
.nav-mega-title {
  font-family:var(--font-main);
  font-size: .7rem;
  font-weight: 700;
  letter-spacing: .08em;
  color: var(--col);
  padding: .55rem .8rem .45rem;
  border-bottom: 1px solid rgba(255,255,255,.08);
  margin-bottom: .1rem;
  display: flex;
  align-items: center;
  gap: .4rem;
}
.nav-mega-col .nav-menu-item {
  font-size: .85rem;
  padding: .45rem .8rem;
  transition: color .12s, background .12s;
}
/* ألوان الكلمات — كل عمود لون مختلف */
.nav-mega-col .nav-menu-item { color: #e8d49a; }
.nav-mega-col .nav-menu-item:hover { background: rgba(201,168,76,.08); color: #f3dfa3; }

/* brand mark "الرقيم" */
.brand-raqim {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  cursor: pointer;
  padding-left: .9rem;
  margin-left: .3rem;
  border-left: 1px solid var(--border-lit, #2a3346);
  white-space: nowrap;
}
.brand-raqim-text {
  font-family: 'Amiri', serif;
  font-weight: 700;
  font-size: 1.35rem;
  background: linear-gradient(135deg,#f3dfa3,#c9a84c 55%,#9a6820);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  letter-spacing: .04em;
}
.brand-raqim-icon { width: 22px; height: 22px; flex-shrink: 0; }

/* ── HERO HEADER ── */
.hero-header {
  position: relative;
  text-align: center;
  padding: 3.5rem 1.5rem 2.5rem;
  border-bottom: 1px solid var(--border);
  overflow: hidden;
}
.hero-header::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 70% 60% at 50% -10%, rgba(201,168,76,.13) 0%, transparent 70%),
    radial-gradient(circle at 15% 50%, rgba(155,124,219,.07) 0%, transparent 50%),
    radial-gradient(circle at 85% 50%, rgba(78,205,196,.06) 0%, transparent 50%);
  pointer-events: none;
}
.hero-mandala {
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%,-50%);
  width: 480px; height: 480px;
  opacity: .04;
  pointer-events: none;
}
.hero-eyebrow {
  font-family: 'Ubuntu Mono', monospace;
  font-size: .68rem;
  letter-spacing: .22em;
  color: var(--gold-dim);
  text-transform: uppercase;
  margin-bottom: .9rem;
}
.hero-title {
  font-family: 'Amiri', serif;
  font-size: clamp(3rem, 7vw, 5.5rem);
  font-weight: 700;
  line-height: 1.05;
  background: linear-gradient(160deg,#fff5d6 0%,#f3dfa3 30%,#c9a84c 60%,#9a6820 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  letter-spacing: .06em;
  margin-bottom: .4rem;
  text-shadow: none;
  position: relative;
}
.hero-title-deco {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  margin-bottom: 1.2rem;
}
.hero-title-deco .deco-line {
  flex: 1;
  max-width: 80px;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--gold-dim));
}
.hero-title-deco .deco-line.right {
  background: linear-gradient(90deg, var(--gold-dim), transparent);
}
.hero-title-deco .deco-glyph {
  color: var(--gold-dim);
  font-size: 1rem;
  letter-spacing: .1em;
}
.hero-verse-wrap {
  position: relative;
  display: inline-block;
  margin: 1rem auto .6rem;
  padding: 1rem 2rem;
  border: 1px solid rgba(201,168,76,.2);
  border-radius: 6px;
  background: rgba(201,168,76,.04);
  max-width: 680px;
}
.hero-verse-wrap::before,
.hero-verse-wrap::after {
  content: '❧';
  position: absolute;
  top: 50%; transform: translateY(-50%);
  color: rgba(201,168,76,.2);
  font-size: 1.4rem;
}
.hero-verse-wrap::before { right: .6rem; }
.hero-verse-wrap::after  { left:  .6rem; }
.hero-verse {
  font-family: 'Amiri', serif;
  font-size: clamp(1.05rem, 2.2vw, 1.35rem);
  color: #d4b97a;
  line-height: 2;
  direction: rtl;
  text-align: center;
  letter-spacing: .02em;
}
.hero-verse-ref {
  font-family: 'Ubuntu Mono', monospace;
  font-size: .65rem;
  color: var(--gold-dim);
  letter-spacing: .14em;
  margin-top: .4rem;
  display: block;
}
.hero-tagline {
  color: var(--text-sec);
  font-size: .82rem;
  max-width: 460px;
  margin: .8rem auto 0;
  line-height: 1.8;
}
.hero-numbers-strip {
  display: flex;
  justify-content: center;
  gap: 2.5rem;
  margin-top: 1.6rem;
  flex-wrap: wrap;
}
.hero-stat {
  text-align: center;
}
.hero-stat .hs-num {
  font-family: 'JetBrains Mono', monospace;
  font-size: 1.5rem;
  font-weight: 600;
  color: var(--gold);
  line-height: 1;
}
.hero-stat .hs-lbl {
  font-size: .65rem;
  letter-spacing: .12em;
  color: var(--text-muted);
  text-transform: uppercase;
  margin-top: .25rem;
}

/* ══════════════════════════════════════
   LANDING PAGE — image
══════════════════════════════════════ */
.landing-img-wrap {
  width: 100%;
  min-height: calc(100vh - 52px);
  display: flex;
  align-items: flex-start;
  justify-content: center;
  background:var(--bg-card);
  padding: 0;
}
.landing-img {
  width: 100%;
  max-width: 1100px;
  height: auto;
  display: block;
  user-select: none;
  -webkit-user-drag: none;
}

/* page views */
.page-view { display: none; }
.page-view.active { display: block; }

/* ══════════════════════════════════════
   MAGIC SQUARES PAGE
══════════════════════════════════════ */
.ms-wrap {
  max-width: 780px;
  margin: 0 auto;
  padding: 2rem 1.5rem 5rem;
}
.ms-hero {
  text-align: center;
  padding: 2.5rem 0 2rem;
  border-bottom: 1px solid var(--border);
  margin-bottom: 2rem;
}
.ms-hero-title {
  font-family: 'Amiri', serif;
  font-size: clamp(1.6rem, 3.5vw, 2.4rem);
  color: var(--gold-glow);
  margin-bottom: .4rem;
}
.ms-hero-sub {
  font-family: 'JetBrains Mono', monospace;
  font-size: .7rem;
  color: var(--text-sec);
  letter-spacing: .06em;
}

/* ══ صفحة "الكون الأكبر والأصغر" ══ */
.mc-intro {
  max-width: 640px; margin: 1.2rem auto 2rem; text-align: center;
  font-size: 1rem; line-height: 2; color: var(--text-sec);
}
.mc-intro b { color: var(--gold-glow); }
.mc-nav {
  display: flex; flex-wrap: wrap; gap: .5rem; justify-content: center;
  margin-bottom: 2.2rem; padding-bottom: 1.5rem; border-bottom: 1px solid var(--border);
}
.mc-nav a {
  font-size: .82rem; color: var(--text-sec); text-decoration: none;
  border: 1px solid var(--border); border-radius: 20px; padding: .3rem .9rem;
  transition: all .15s;
}
.mc-nav a:hover { color: var(--gold-glow); border-color: var(--gold-glow); }

.mc-section { max-width: 760px; margin: 0 auto 3rem; scroll-margin-top: 80px; }
.mc-section-eyebrow {
  font-family: 'JetBrains Mono', monospace; font-size: .68rem; letter-spacing: .12em;
  color: var(--gold-dim); text-transform: uppercase; margin-bottom: .3rem; text-align: center;
}
.mc-section-title {
  font-family: 'Amiri', serif; font-size: 1.6rem; color: var(--gold-glow);
  text-align: center; margin-bottom: 1.4rem;
}
.mc-section-body { font-size: .96rem; line-height: 2.1; color: var(--text-sec); }
.mc-section-body p { margin-bottom: 1.1rem; }
.mc-section-body b { color: var(--gold-glow); font-weight: 600; }
.mc-quote {
  border-right: 3px solid var(--gold-dim); padding: .3rem 1.2rem;
  margin: 1.3rem 0; font-family: 'Amiri', serif; font-size: 1.05rem;
  color: var(--text-main); line-height: 1.9; background: rgba(255,255,255,.02);
}
.mc-quote-src { font-size: .74rem; color: var(--text-sec); margin-top: .4rem; }

.mc-diagram-box {
  display: flex; justify-content: center; margin: 1.6rem 0;
  padding: 1rem; background: var(--bg2); border: 1px solid var(--border); border-radius: 12px;
}
.mc-diagram-box svg { max-width: 100%; height: auto; }
.mc-diagram-box img { max-width: 100%; max-height: 420px; height: auto; border-radius: 6px; }
.mc-diagram-src { text-align: center; font-size: .68rem; color: var(--text-sec); opacity: .7; margin-top: -1.3rem; margin-bottom: 1.6rem; }
.mc-diagram-cap { text-align: center; font-size: .78rem; color: var(--text-sec); margin-top: -1rem; margin-bottom: 1.6rem; }

.mc-link-btn {
  display: inline-flex; align-items: center; gap: .4rem;
  font-size: .85rem; color: var(--gold-glow); text-decoration: none;
  border: 1px solid var(--gold-dim); border-radius: 8px; padding: .5rem 1rem;
  margin-top: .5rem; cursor: pointer; background: rgba(201,154,63,.06); transition: all .15s;
}
.mc-link-btn:hover { background: rgba(201,154,63,.15); }

.mc-summary-table { width: 100%; border-collapse: collapse; font-size: .88rem; margin-top: 1rem; }
.mc-summary-table th, .mc-summary-table td {
  border: 1px solid var(--border); padding: .55rem .7rem; text-align: right; vertical-align: top;
}
.mc-summary-table th { color: var(--gold-glow); background: var(--bg2); font-weight: 600; }
.mc-summary-table td { color: var(--text-sec); line-height: 1.7; }

/* Input */
.ms-input-row {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  margin-bottom: 1.5rem;
}
.ms-input-group { display: flex; flex-direction: column; gap: .45rem; }
.ms-label {
  font-size: .78rem;
  color: var(--text-sec);
  font-family:var(--font-main);
}
.ms-input {
  width: 100%;
  max-width: 220px;
  padding: .6rem 1rem;
  background: rgba(78,205,196,.06);
  border: 2px solid var(--cyan);
  border-radius: var(--radius);
  color: var(--text-pri);
  font-size: 1.2rem;
  font-family: 'JetBrains Mono', monospace;
  font-weight: 700;
  letter-spacing: .06em;
  box-shadow: 0 0 12px rgba(78,205,196,.25);
  transition: border-color .15s, box-shadow .15s;
}
.ms-input:focus { outline: none; border-color: var(--gold); box-shadow: 0 0 16px rgba(201,168,76,.45); background: rgba(201,168,76,.06); }

.ms-clear-btn {
  padding: .45rem .85rem;
  background: transparent;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  color: var(--text-sec);
  font-size: .78rem;
  font-family:var(--font-main);
  cursor: pointer;
  transition: all .15s;
  white-space: nowrap;
}
.ms-clear-btn:hover { border-color: var(--danger); color: var(--danger); }
.ms-hint-chips {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: .4rem;
}
.ms-hint-lbl {
  font-size: .7rem;
  color: var(--text-sec);
  font-family:var(--font-main);
}
.ms-hint {
  background: rgba(139,92,246,.10);
  border: 1px solid rgba(139,92,246,.45);
  border-radius: 20px;
  color: #c4b5fd;
  font-family: 'JetBrains Mono', monospace;
  font-size: .82rem;
  font-weight: 600;
  padding: .28rem .8rem;
  cursor: pointer;
  transition: all .13s;
}
.ms-hint:hover { border-color:var(--dcr-day); color: #ede9fe; background: rgba(139,92,246,.22); box-shadow: 0 0 10px rgba(139,92,246,.35); transform: translateY(-1px); }
.ms-hint.ms-hint-active { border-color: var(--gold); color: var(--gold); background: rgba(201,168,76,.1); }
.ms-hint-gold { border-color: var(--border); color: var(--text-sec); }
.ms-hint-gold.ms-hint-active { border-color: var(--gold); color: var(--gold); background: rgba(201,168,76,.15); }

/* Error */
.ms-error {
  background: rgba(224,92,122,.1);
  border: 1px solid rgba(224,92,122,.35);
  border-radius: var(--radius);
  color: var(--danger);
  font-size: .85rem;
  font-family:var(--font-main);
  padding: .75rem 1rem;
  margin-bottom: 1.2rem;
  direction: rtl;
  text-align: right;
}

/* Size pills */
.ms-sizes-panel {
  display: flex;
  flex-wrap: wrap;
  gap: .55rem;
  margin-bottom: 1.2rem;
  min-height: 2rem;
}
.ms-pill {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .15rem;
  padding: .55rem 1.2rem;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  cursor: pointer;
  transition: all .15s;
  color: var(--text-sec);
}
.ms-pill:hover { border-color: var(--gold-dim); color: var(--text-pri); }
.ms-pill-active {
  border-color: var(--gold);
  background: rgba(201,168,76,.1);
  color: var(--gold-glow);
}
.ms-pill-n {
  font-family: 'JetBrains Mono', monospace;
  font-size: 1rem;
  font-weight: 700;
}
.ms-pill-count {
  font-size: .6rem;
  font-family:var(--font-main);
  opacity: .7;
}

/* Variant buttons */
.ms-variant-wrap {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
  margin-bottom: 1.4rem;
  min-height: 1.5rem;
}
.ms-var-btn {
  padding: .3rem .85rem;
  background: transparent;
  border: 1px solid var(--border);
  border-radius: 20px;
  color: var(--text-sec);
  font-size: .78rem;
  font-family:var(--font-main);
  cursor: pointer;
  transition: all .13s;
  display: flex;
  align-items: center;
  gap: .35rem;
}
.ms-var-btn:hover { border-color: var(--gold-dim); color: var(--text-pri); }
.ms-var-active { border-color: var(--cyan); color: var(--cyan); }
.ms-var-tag {
  font-size: .58rem;
  background: rgba(78,205,196,.15);
  color: var(--cyan);
  border-radius: 10px;
  padding: .1rem .4rem;
}
.ms-var-range {
  font-family: 'JetBrains Mono', monospace;
  font-size: .78rem;
  letter-spacing: .03em;
}

/* Grid */
.ms-grid-wrap {
  margin-bottom: 1.5rem;
  min-height: 80px;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  overflow-x: auto;
}
.ms-grid {
  display: grid;
  grid-template-columns: repeat(var(--ms-n), var(--ms-cell));
  gap: 2px;
  margin-bottom: 1rem;
  width: fit-content;
}
.ms-cell {
  width: var(--ms-cell);
  height: var(--ms-cell);
  display: flex;
  align-items: center;
  justify-content: center;
  border: 2px solid transparent;
  border-radius: 6px;
  font-family: 'JetBrains Mono', monospace;
  font-size: var(--ms-fs);
  font-weight: 700;
  color:var(--text-pri);
  transition: transform .12s, box-shadow .12s, filter .12s;
  cursor: pointer;
  user-select: none;
  position: relative;
  /* لون الخلفية يُعيَّن ديناميكياً */
}
.ms-cell { filter: saturate(1.55) brightness(1.18); }
.ms-cell:hover {
  transform: scale(1.1);
  z-index: 2;
  box-shadow: 0 0 18px currentColor, 0 0 34px rgba(201,168,76,.35);
  filter: saturate(1.8) brightness(1.55);
}
.ms-cell:active {
  transform: scale(1.16);
  filter: saturate(2) brightness(1.85);
  box-shadow: 0 0 26px currentColor, 0 0 44px rgba(201,168,76,.5);
}
/* الخلايا المضاءة عند hover على صف/عمود/قطر */
.ms-cell.ms-lit {
  transform: scale(1.07);
  filter: saturate(1.9) brightness(1.7);
  box-shadow: 0 0 16px rgba(201,168,76,.75);
  z-index: 1;
  border-color: rgba(201,168,76,.9) !important;
}
.ms-cell.ms-lit-diag {
  filter: saturate(2.1) brightness(1.95);
  box-shadow: 0 0 22px rgba(201,168,76,1);
  border-color: var(--gold) !important;
}
.ms-cell.ms-diag {
  /* لا تمييز بصري — القطر يظهر فقط عند hover */
}
.ms-cell.ms-target {
  border-color: var(--cyan);
  box-shadow: 0 0 12px rgba(78,205,196,.4);
}
/* أنيميشن ظهور */
@keyframes cellPop {
  0% { opacity:0; transform: scale(.4) rotate(-8deg); }
  70% { transform: scale(1.1) rotate(2deg); }
  100% { opacity:1; transform: scale(1) rotate(0); }
}
.ms-cell.ms-anim {
  animation: cellPop .25s ease both;
}
/* شريط المجموع المتحرك */
.ms-sum-live {
  position: fixed;
  bottom: 1.5rem;
  left: 50%;
  transform: translateX(-50%) translateY(60px);
  background: #0a0d14;
  border: 1px solid var(--gold);
  border-radius: 30px;
  padding: .5rem 1.4rem;
  font-family: 'JetBrains Mono', monospace;
  font-size: .9rem;
  color: var(--gold);
  box-shadow: 0 4px 20px rgba(201,168,76,.3);
  transition: transform .2s, opacity .2s;
  opacity: 0;
  pointer-events: none;
  z-index: 100;
  white-space: nowrap;
}
.ms-sum-live.ms-sum-show {
  transform: translateX(-50%) translateY(0);
  opacity: 1;
}
/* placeholder محسّن */
.ms-placeholder {
  text-align: center;
  padding: 4rem 1rem;
  color: var(--text-muted);
  font-family: 'Amiri', serif;
  font-size: 1.2rem;
  border: 1px dashed var(--border);
  border-radius: var(--radius-lg);
  background: radial-gradient(ellipse at 50% 0%, rgba(201,168,76,.04), transparent 70%);
}
.ms-summary {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: .75rem;
  padding: .7rem 0;
  border-top: 1px solid var(--border);
  width: 100%;
  max-width: 600px;
}
.ms-sum-badge {
  background: rgba(201,168,76,.12);
  border: 1px solid var(--gold-dim);
  border-radius: var(--radius);
  padding: .3rem .8rem;
  font-family: 'JetBrains Mono', monospace;
  font-size: .88rem;
  color: var(--gold-glow);
}
.ms-meta {
  font-size: .78rem;
  font-family:var(--font-main);
  color: var(--text-sec);
}
.ms-error-tag { color: var(--rose) !important; }
.ms-copy-btn {
  margin-left: auto;
  background: transparent;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  color: var(--text-sec);
  font-size: .78rem;
  font-family:var(--font-main);
  padding: .3rem .85rem;
  cursor: pointer;
  transition: all .15s;
}
.ms-copy-btn:hover { border-color: var(--gold-dim); color: var(--gold-glow); }

.ms-placeholder {
  text-align: center;
  padding: 3rem 1rem;
  color: var(--text-muted);
  font-family: 'Amiri', serif;
  font-size: 1.1rem;
  border: 1px dashed var(--border);
  border-radius: var(--radius-lg);
}

/* Info card */
.ms-info-card {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 1rem 1.25rem;
  margin-top: 1rem;
  direction: rtl;
}
.ms-info-title {
  font-family:var(--font-main);
  font-size: .8rem;
  font-weight: 700;
  color: var(--gold-dim);
  letter-spacing: .08em;
  text-transform: uppercase;
  margin-bottom: .5rem;
}
.ms-info-body {
  font-family:var(--font-main);
  font-size: .82rem;
  color: var(--text-sec);
  line-height: 1.8;
  text-align: right;
}
.ms-info-body strong { color: var(--text-pri); }

/* ── Magic Squares mode tabs ── */
.ms-mode-tabs{display:flex;justify-content:center;gap:1.2rem;margin-bottom:1.8rem;border-bottom:1px solid var(--border);padding-bottom:0}
.ms-mode-tab{background:transparent;border:none;border-bottom:3px solid transparent;color:var(--cyan);font-family:var(--font-main);font-size:1.2rem;font-weight:700;padding:.6rem 1.6rem .7rem;cursor:pointer;transition:all .15s;margin-bottom:-1px;letter-spacing:.02em}
.ms-mode-tab:hover{color:var(--gold-glow);text-shadow:0 0 12px rgba(201,168,76,.4)}
.ms-mode-active{color:var(--gold) !important;border-bottom-color:var(--gold) !important;text-shadow:0 0 14px rgba(201,168,76,.5)}

/* صفحة الهندسة الثلاثية الأبعاد تحديدًا: لون مختلف لكل نمط بدل الذهبي الموحّد —
   نطاق محدود بـ#pageGeometry3D حتى لا يتأثر تبويب الماكروكوزم المشترك بنفس الأصناف */
#pageGeometry3D .ms-mode-tab[data-mode="metatron"].ms-mode-active{color:var(--g3d-teal) !important;background:rgba(59,169,160,.16);border-color:var(--g3d-teal) !important}
#pageGeometry3D .ms-mode-tab[data-mode="platonic"].ms-mode-active{color:var(--g3d-green) !important;background:rgba(74,157,107,.16);border-color:var(--g3d-green) !important}
#pageGeometry3D .ms-mode-tab[data-mode="pyramid"].ms-mode-active{color:var(--g3d-orange) !important;background:rgba(209,122,58,.16);border-color:var(--g3d-orange) !important}
#pageGeometry3D .ms-mode-tab[data-mode="prism"].ms-mode-active{color:var(--g3d-pink) !important;background:rgba(212,101,127,.16);border-color:var(--g3d-pink) !important}
#pageGeometry3D .ms-hero-title{
  background: linear-gradient(90deg, #e0708a, #e8935a, #6bbf59, #3ba9a0, #5b8ac4, #9b6fd1);
  -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
  background-size: 300% 100%; animation: g3dTitleShift 8s ease-in-out infinite;
}
@keyframes g3dTitleShift{ 0%,100%{background-position:0% 50%} 50%{background-position:100% 50%} }
#pageGeometry3D .ms-mode-tabs{gap:.6rem;border-bottom:none;flex-wrap:wrap}
#pageGeometry3D .ms-mode-tab{border-radius:999px;border:1.5px solid var(--border);padding:.5rem 1.1rem;font-size:1rem;margin-bottom:0}
#pageGeometry3D .ms-mode-tab[data-mode="metatron"].ms-mode-active{background:rgba(59,169,160,.16);border-color:var(--g3d-teal) !important}
#pageGeometry3D .ms-mode-tab[data-mode="platonic"].ms-mode-active{background:rgba(74,157,107,.16);border-color:var(--g3d-green) !important}
#pageGeometry3D .ms-mode-tab[data-mode="pyramid"].ms-mode-active{background:rgba(209,122,58,.16);border-color:var(--g3d-orange) !important}
#pageGeometry3D .ms-mode-tab[data-mode="prism"].ms-mode-active{background:rgba(212,101,127,.16);border-color:var(--g3d-pink) !important}
#pageGeometry3D .ms-mode-tab[data-mode="circles"].ms-mode-active{color:var(--g3d-blue) !important;background:rgba(91,138,196,.16);border-color:var(--g3d-blue) !important}
#pageGeometry3D .ms-mode-tab[data-mode="polygon"].ms-mode-active{color:var(--g3d-tan) !important;background:rgba(168,137,74,.16);border-color:var(--g3d-tan) !important}
#pageGeometry3D .ms-mode-tab[data-mode="clock"].ms-mode-active{color:var(--g3d-indigo) !important;background:rgba(122,139,196,.16);border-color:var(--g3d-indigo) !important}

/* أزرار اختيار الشكل بتبويب "أشكال ثنائية الأبعاد": لون مميّز لكل شكل بدل الذهبي الموحّد */
#g3dPolygonPicker .ms-hint[data-shape="triangle"].ms-hint-active{border-color:var(--g3d-rose) !important;color:var(--g3d-rose) !important;background:rgba(224,112,138,.12) !important}
#g3dPolygonPicker .ms-hint[data-shape="square"].ms-hint-active{border-color:var(--g3d-green) !important;color:var(--g3d-green) !important;background:rgba(74,157,107,.12) !important}
#g3dPolygonPicker .ms-hint[data-shape="rhombus"].ms-hint-active{border-color:var(--g3d-amber) !important;color:var(--g3d-amber) !important;background:rgba(212,161,58,.12) !important}
#g3dPolygonPicker .ms-hint[data-shape="parallelogram"].ms-hint-active{border-color:var(--g3d-blue) !important;color:var(--g3d-blue) !important;background:rgba(91,138,196,.12) !important}
#g3dPolygonPicker .ms-hint[data-shape="pentagon"].ms-hint-active{border-color:var(--g3d-violet) !important;color:var(--g3d-violet) !important;background:rgba(155,111,209,.12) !important}
#g3dPolygonPicker .ms-hint[data-shape="hexagon"].ms-hint-active{border-color:var(--g3d-teal) !important;color:var(--g3d-teal) !important;background:rgba(59,169,160,.12) !important}
#g3dPolygonPicker .ms-hint[data-shape="heptagon"].ms-hint-active{border-color:var(--g3d-peach) !important;color:var(--g3d-peach) !important;background:rgba(232,147,90,.12) !important}
#g3dPolygonPicker .ms-hint[data-shape="octagon"].ms-hint-active{border-color:var(--g3d-lime) !important;color:var(--g3d-lime) !important;background:rgba(107,191,89,.12) !important}
#g3dPolygonPicker .ms-hint[data-shape="decagon"].ms-hint-active{border-color:var(--g3d-pink) !important;color:var(--g3d-pink) !important;background:rgba(212,101,127,.12) !important}
#g3dPolygonPicker .ms-hint[data-shape="dodecagon"].ms-hint-active{border-color:var(--g3d-indigo) !important;color:var(--g3d-indigo) !important;background:rgba(122,139,196,.12) !important}

/* تخفيف اعتماد الصفحة على البنفسجي الموحّد بتحويم أزرار الاختيار — لون أدفأ محايد بدل الموف الثابت */
#pageGeometry3D .ms-hint:hover{border-color:#c9a06a;color:#f0dfc0;background:rgba(201,160,106,.16);box-shadow:0 0 10px rgba(201,160,106,.3);transform:translateY(-1px)}

/* ── Planet grid cards ── */
.ms-planet-intro{font-family:var(--font-main);font-size:.88rem;color:#e8d49a;direction:rtl;text-align:right;margin-bottom:1.5rem;line-height:2;background:rgba(201,168,76,.05);border:1px solid rgba(201,168,76,.2);border-radius:var(--radius);padding:1rem 1.2rem}
.ms-planet-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:1rem;margin-bottom:2rem}
.ms-planet-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:1.1rem 1rem;cursor:pointer;transition:all .18s;display:flex;flex-direction:column;align-items:center;gap:.5rem;text-align:center}
.ms-planet-card:hover{border-color:var(--gold-dim);transform:translateY(-2px);box-shadow:0 4px 16px rgba(0,0,0,.3)}
.ms-pc-sym{font-size:2rem;line-height:1}
.ms-pc-name{font-family:var(--font-main);font-size:.95rem;font-weight:700;color:var(--text-pri)}
.ms-pc-name-en{font-size:.72rem;color:var(--text-muted);font-family:'JetBrains Mono',monospace}
.ms-pc-size{font-size:.75rem;color:var(--text-sec);font-family:'JetBrains Mono',monospace}
.ms-pc-magic{font-family:'JetBrains Mono',monospace;font-size:1.1rem;font-weight:700}
.ms-pc-total{font-size:.7rem;color:var(--text-muted)}
.ms-pc-mini{display:grid;gap:1px;margin-top:.4rem}
.ms-pc-mini-cell{width:16px;height:16px;display:flex;align-items:center;justify-content:center;font-size:.45rem;font-family:'JetBrains Mono',monospace;font-weight:700;background:var(--bg-hover);border-radius:2px}

/* ── Planet detail view ── */
.ms-pd-header{display:flex;align-items:center;gap:1rem;margin-bottom:1.5rem;padding-bottom:.8rem;border-bottom:1px solid var(--border)}
.ms-pd-back{background:transparent;border:1px solid var(--border-lit);border-radius:var(--radius);color:var(--text-sec);font-family:var(--font-main);font-size:.82rem;padding:.35rem .8rem;cursor:pointer;transition:all .15s}
.ms-pd-back:hover{border-color:var(--gold-dim);color:var(--gold)}
.ms-pd-title{font-family:var(--font-main);font-size:1.2rem;font-weight:700;color:var(--gold-glow)}
.ms-pd-body{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;align-items:start}
@media(max-width:640px){.ms-pd-body{grid-template-columns:1fr}}
.ms-pd-left{display:flex;flex-direction:column;align-items:center;gap:1rem}
.ms-pd-stats{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:.8rem 1rem;width:100%}
.ms-pd-stat{display:flex;justify-content:space-between;align-items:center;padding:.3rem 0;border-bottom:1px solid var(--border);font-size:.82rem}
.ms-pd-stat:last-child{border-bottom:none}
.ms-pd-stat-lbl{color:var(--text-sec);font-family:var(--font-main)}
.ms-pd-stat-val{color:var(--gold-glow);font-family:'JetBrains Mono',monospace;font-weight:700}
.ms-pd-right{display:flex;flex-direction:column;gap:1rem}
.ms-pd-lore{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:.8rem 1rem;font-family:var(--font-main);font-size:.82rem;color:var(--text-sec);direction:rtl;text-align:right;line-height:1.9}
.ms-pd-lore-title{font-size:.72rem;font-weight:700;color:var(--gold-dim);letter-spacing:.06em;text-transform:uppercase;margin-bottom:.5rem}
.ms-sigil-wrap{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:.8rem 1rem;display:flex;flex-direction:column;align-items:center;gap:.5rem}
.ms-sigil-title{font-size:.72rem;font-weight:700;color:var(--gold-dim);letter-spacing:.06em;text-transform:uppercase;align-self:flex-start;direction:rtl}
.ms-sigil-note{font-size:.7rem;color:var(--text-muted);font-family:var(--font-main);direction:rtl;text-align:center}

/* number props standalone page */
.np-standalone {
  max-width: 600px;
  margin: 2rem auto;
  padding: 0 1.5rem;
}
.np-standalone .numprops-section {
  display: block;
  margin-top: 0;
}
.np-back-btn {
  display: inline-flex; align-items: center; gap: .3rem;
  background: rgba(255,255,255,.05); border: 1px solid var(--gold-dim);
  color: var(--text-sec); font-size: .85rem; font-weight: 600;
  padding: .45rem 1rem; border-radius: 8px; cursor: pointer;
  margin-bottom: 1rem; transition: all .15s;
}
.np-back-btn:hover { background: rgba(201,168,76,.12); color: var(--gold-glow); border-color: var(--gold-glow); }

body {
  background-color: var(--bg-deep);
  /* الخلفية العامة لكل صفحات الموقع أصبحت أسود قاتم + طبقة رموز/حروف/أرقام متناثرة
     (#rqScatterLayer، عنصر ثابت خلف كل المحتوى) بدل صورة الشبكة العصبية. */
  color: var(--text-pri);
  font-family:var(--font-main);
  min-height: 100vh;
  line-height: 1.6;
}

/* رموز الخلفية المتناثرة — الشفافية الأساسية تُضرَب بمعامل يختلف حسب الوضع:
   الداكن يبقى كما تمت الموافقة عليه (معامل ١)، النهاري يُرفَع بوضوح لأن نفس
   القيم كانت شبه غير مرئية فوق الخلفية الفاتحة. اللون كمان يُغمَّق أكثر بالنهاري لتباين أقوى. */
#rqScatterLayer span { opacity: calc(var(--op, .2) * 1); }
html[data-theme="light"] #rqScatterLayer { color: #4a3818 !important; }
html[data-theme="light"] #rqScatterLayer span { opacity: calc(var(--op, .2) * 2.6); }

/* ── HEADER ── */
header {
  text-align: center;
  padding: 2.5rem 1.5rem 1.8rem;
  position: relative;
  overflow: hidden;
}
header::before {
  content: '';
  position: absolute;
  top: -60px; left: 50%;
  transform: translateX(-50%);
  width: 500px; height: 200px;
  background: radial-gradient(ellipse, rgba(201,168,76,.1) 0%, transparent 70%);
  pointer-events: none;
}
.header-label {
  font-size: .72rem;
  font-family: 'Ubuntu Mono', monospace;
  letter-spacing: .18em;
  color: var(--gold-dim);
  text-transform: uppercase;
  margin-bottom: .5rem;
}
header h1 {
  font-family: 'Amiri', serif;
  font-size: clamp(1.8rem, 4vw, 3rem);
  font-weight: 700;
  color: var(--gold-glow);
  line-height: 1.2;
  margin-bottom: .4rem;
}
header p {
  color: var(--text-sec);
  font-size: .85rem;
  max-width: 440px;
  margin: 0 auto;
}

/* ── CONTAINER ── */
.container {
  max-width: 1100px;
  margin: 0 auto;
  padding: 1.8rem 1.5rem 4rem;
}

/* ── TOP TOOLBAR ── */
.toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: .8rem;
  margin-bottom: 1.4rem;
}
.toolbar-title {
  font-size: .72rem;
  color: var(--text-muted);
  font-family: 'Ubuntu Mono', monospace;
  letter-spacing: .1em;
}

/* dropdown wrapper */
.tables-dropdown { position: relative; }

.btn-tables-menu {
  display: flex;
  align-items: center;
  gap: .5rem;
  background:var(--bg-card);
  border: 1px solid var(--gold-dim);
  border-radius: var(--radius);
  color: var(--gold);
  font-family:var(--font-main);
  font-size: .88rem;
  font-weight: 600;
  padding: .5rem 1.1rem;
  cursor: pointer;
  transition: all .18s;
  user-select: none;
}
.btn-tables-menu:hover,
.btn-tables-menu.open {
  background: rgba(201,168,76,.08);
  border-color: var(--gold);
  color: var(--gold-glow);
}
.btn-tables-menu .btn-arrow {
  font-size: .65rem;
  transition: transform .2s;
  margin-right: .1rem;
}
.btn-tables-menu.open .btn-arrow { transform: rotate(180deg); }

/* dropdown menu */
.tables-menu {
  display: none;
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  min-width: 260px;
  background: var(--bg-card);
  border: 1px solid var(--border-lit);
  border-radius: var(--radius-lg);
  box-shadow: 0 12px 40px rgba(0,0,0,.5);
  z-index: 200;
  overflow: hidden;
  animation: dropDown .15s ease;
  direction: rtl;
}
.tables-menu.open { display: block; }

@keyframes dropDown {
  from { opacity:0; transform: translateY(-6px); }
  to   { opacity:1; transform: translateY(0); }
}

.tmenu-section {
  padding: .5rem 0;
  border-bottom: 1px solid var(--border);
}
.tmenu-section:last-child { border-bottom: none; }
.tmenu-label {
  font-size: .65rem;
  color: var(--text-muted);
  font-family: 'Ubuntu Mono', monospace;
  letter-spacing: .1em;
  padding: .3rem 1rem .15rem;
}
.tmenu-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: .55rem 1rem;
  cursor: pointer;
  transition: background .12s;
  gap: .5rem;
}
.tmenu-item:hover { background: var(--bg-hover); }
.tmenu-item .ti-name {
  font-size: .88rem;
  color: var(--text-pri);
  flex: 1;
}
.tmenu-item .ti-actions {
  display: flex;
  gap: .3rem;
  opacity: 0;
  transition: opacity .12s;
}
.tmenu-item:hover .ti-actions { opacity: 1; }
.ti-btn {
  background: none;
  border: 1px solid var(--border);
  border-radius: 4px;
  color: var(--text-sec);
  font-size: .7rem;
  padding: .15rem .4rem;
  cursor: pointer;
  transition: all .12s;
}
.ti-btn:hover { border-color: var(--gold); color: var(--gold-glow); }
.ti-btn.del:hover { border-color: var(--rose); color: var(--rose); }

.tmenu-add-btn {
  display: flex;
  align-items: center;
  gap: .5rem;
  width: 100%;
  padding: .6rem 1rem;
  background: none;
  border: none;
  color: var(--gold);
  font-family:var(--font-main);
  font-size: .88rem;
  font-weight: 600;
  cursor: pointer;
  transition: background .12s;
  direction: rtl;
  text-align: right;
}
.tmenu-add-btn:hover { background: rgba(201,168,76,.07); }

/* ── INPUT SECTION ── */
.input-section {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 1.5rem 1.8rem;
  margin-bottom: 1.4rem;
}
.input-row {
  display: flex;
  gap: .8rem;
  align-items: flex-end;
  flex-wrap: wrap;
}
.input-group { flex: 1; min-width: 200px; }
label.field-label {
  display: block;
  font-size: .78rem;
  color: var(--text-sec);
  margin-bottom: .45rem;
  letter-spacing: .04em;
}
.arabic-input {
  width: 100%;
  background: var(--bg-input);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  color: var(--text-pri);
  font-family: 'Amiri', serif;
  font-size: 1.5rem;
  padding: .65rem 1rem;
  text-align: center;
  direction: rtl;
  outline: none;
  transition: border-color .2s, box-shadow .2s;
}
.arabic-input:focus {
  border-color: var(--gold);
  box-shadow: 0 0 0 3px rgba(201,168,76,.13);
}
.arabic-input::placeholder { color: var(--text-muted); font-size: 1rem; }

select.system-select {
  width: 100%;
  background: var(--bg-input);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  color: var(--text-pri);
  font-family:var(--font-main);
  font-size: .88rem;
  padding: .7rem 1rem;
  outline: none;
  cursor: pointer;
  transition: border-color .2s;
  direction: rtl;
}
select.system-select:focus { border-color: var(--gold); }

.calc-btn {
  background: linear-gradient(135deg, var(--gold) 0%, #a07830 100%);
  border: none;
  border-radius: var(--radius);
  color: #0a0c10;
  font-family:var(--font-main);
  font-weight: 700;
  font-size: .95rem;
  padding: .7rem 1.8rem;
  cursor: pointer;
  transition: opacity .2s, transform .1s;
  white-space: nowrap;
  min-width: 110px;
}
.calc-btn:hover { opacity: .9; }
.calc-btn:active { transform: scale(.97); }

/* ── LETTER BREAKDOWN ── */
.breakdown-section {
  background: rgba(255,255,255,.035);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 1.2rem 1.6rem;
  margin-top: 1rem;
  margin-bottom: 1.4rem;
  display: none;
}
.section-title {
  font-size: .7rem;
  color: var(--text-muted);
  letter-spacing: .1em;
  text-transform: uppercase;
  font-family: 'Ubuntu Mono', monospace;
  margin-bottom: 1rem;
}
.letters-strip {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  direction: rtl;
}
.letter-chip {
  background: var(--bg-input);
  border-radius: 6px;
  padding: .4rem .6rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .55rem;
  min-width: 44px;
}
.letter-chip .lc-char { font-family: 'Amiri', serif; font-size: 1.3rem; color: var(--letter-glow, #ff5470); text-shadow: 0 0 6px rgba(255,84,112,.55); line-height: 1; }
.letter-chip .lc-val  { font-family: 'Ubuntu Mono', monospace; font-size: 1.06rem; color: var(--letter-val, #ffffff); font-weight: 600; }

.breakdown-total {
  display: flex;
  align-items: center;
  gap: .8rem;
  margin-top: .8rem;
  padding-top: .6rem;
  direction: rtl;
}
.bt-label { font-size: .88rem; color: var(--text-muted); }
.bt-val {
  font-family: 'Ubuntu Mono', monospace;
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--gold-glow);
}
.bt-dr {
  font-family: 'Ubuntu Mono', monospace;
  font-size: .92rem;
  color: var(--text-muted);
}
.bt-dr span { color: var(--cyan); }

/* ── CIPHERS SELECTOR ── */
.results-section {
  display: none;
  background: rgba(255,255,255,.035);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 1rem 1.5rem;
  margin-top: 1rem;
  width: fit-content;
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
}
.ciphers-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 1rem;
  direction: rtl;
  gap: .6rem;
  flex-wrap: wrap;
}
.ciphers-count {
  font-size: .72rem;
  color: var(--text-muted);
  font-family: 'Ubuntu Mono', monospace;
}
.btn-ciphers {
  display: flex;
  align-items: center;
  gap: .5rem;
  background: #1a1408;
  border: 1px solid var(--gold-dim);
  border-radius: var(--radius);
  color: var(--gold);
  font-family:var(--font-main);
  font-size: .88rem;
  font-weight: 600;
  padding: .5rem 1.2rem;
  cursor: pointer;
  transition: all .18s;
}
.btn-ciphers:hover {
  background: rgba(201,168,76,.08);
  border-color: var(--gold);
  color: var(--gold-glow);
}

/* ── CIPHERS MODAL ── */
.ciphers-overlay {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(5,6,10,.85);
  backdrop-filter: blur(4px);
  z-index: 1000;
  align-items: center;
  justify-content: center;
  padding: 1rem;
}
.ciphers-overlay.open { display: flex; }

.ciphers-modal {
  background: var(--bg-card);
  border: 1px solid var(--border-lit);
  border-radius: var(--radius-lg);
  width: 100%;
  max-width: 780px;
  max-height: 88vh;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  box-shadow: 0 20px 60px rgba(0,0,0,.6);
  direction: rtl;
}
.cm-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1rem 1.5rem;
  border-bottom: 1px solid var(--border);
  flex-shrink: 0;
}
.cm-title {
  font-family: 'Amiri', serif;
  font-size: 1.1rem;
  color: var(--gold-glow);
}
.cm-close {
  background: none;
  border: 1px solid var(--border);
  border-radius: 6px;
  color: var(--text-sec);
  width: 30px; height: 30px;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer;
  font-size: .9rem;
  transition: all .14s;
}
.cm-close:hover { border-color: var(--rose); color: var(--rose); }

/* quick-select bar */
.cm-quick {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
  padding: .8rem 1.5rem;
  border-bottom: 1px solid var(--border);
  flex-shrink: 0;
}
.qbtn {
  background: var(--bg-input);
  border: 1px solid var(--border);
  border-radius: 20px;
  color: var(--text-sec);
  font-family:var(--font-main);
  font-size: .74rem;
  padding: .28rem .8rem;
  cursor: pointer;
  transition: all .14s;
}
.qbtn:hover { border-color: var(--gold); color: var(--gold-glow); }
.qbtn.active { background: var(--gold); border-color: var(--gold); color: var(--ink); font-weight: 700; }
.qbtn.danger:hover { border-color: var(--rose); color: var(--rose); }

/* checkbox body */
.cm-body {
  overflow-y: auto;
  padding: 1.2rem 1.5rem;
  flex: 1;
}
.cm-group-title {
  font-size: .72rem;
  color: var(--text-muted);
  font-family: 'Ubuntu Mono', monospace;
  letter-spacing: .08em;
  margin-bottom: .5rem;
  margin-top: 1rem;
}
.cm-group-title:first-child { margin-top: 0; }

.cm-checks {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
  gap: .35rem;
}
@media(max-width:500px) { .cm-checks { grid-template-columns: 1fr 1fr; } }

.cm-check {
  display: flex;
  align-items: center;
  gap: .5rem;
  padding: .4rem .6rem;
  border-radius: 5px;
  cursor: pointer;
  transition: background .12s;
  font-size: .8rem;
  color: var(--text-sec);
}
.cm-check:hover { background: var(--bg-hover); }
.cm-check input[type=checkbox] {
  accent-color: var(--gold);
  width: 15px; height: 15px;
  cursor: pointer;
  flex-shrink: 0;
}
.cm-check.checked { color: var(--text-pri); }
.cm-check-wrap { display: flex; align-items: center; gap: .25rem; }
.cm-del-btn { background: rgba(248,113,113,.12); border: 1px solid rgba(248,113,113,.4); color: #f87171; border-radius: 5px; width: 24px; height: 24px; flex-shrink: 0; cursor: pointer; font-size: .75rem; line-height: 1; display: inline-flex; align-items: center; justify-content: center; transition: background .12s; }
.cm-del-btn:hover { background: rgba(248,113,113,.3); }
.geo-match-head { font-size: .8rem; color: var(--text-muted); text-align: center; margin: 0 0 .5rem; font-family:var(--font-main); }

/* footer */
.cm-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: .8rem 1.5rem;
  border-top: 1px solid var(--border);
  flex-shrink: 0;
  gap: .5rem;
}
.cm-footer .cm-count {
  font-size: .75rem;
  color: var(--text-muted);
  font-family: 'Ubuntu Mono', monospace;
}
.btn-apply-ciphers {
  background: linear-gradient(135deg, var(--gold) 0%, #a07830 100%);
  border: none;
  border-radius: var(--radius);
  color: #0a0c10;
  font-family:var(--font-main);
  font-weight: 700;
  font-size: .88rem;
  padding: .5rem 1.5rem;
  cursor: pointer;
  transition: opacity .14s;
}
.btn-apply-ciphers:hover { opacity: .88; }

/* ── RESULTS GRID (card grid layout) ── */
.results-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(80px, max-content));
  gap: .25rem 1.1rem;
  direction: rtl;
  width: fit-content;
  max-width: 100%;
  margin: 0 auto;
}
@media(max-width:900px) { .results-grid { grid-template-columns: repeat(4, minmax(80px, max-content)); } }
@media(max-width:600px) { .results-grid { grid-template-columns: repeat(3, minmax(80px, max-content)); } }
@media(max-width:400px) { .results-grid { grid-template-columns: repeat(2, minmax(80px, max-content)); } }

/* ── RESULT CARD (no box — plain text, name/value are the only touch targets) ── */
.result-card {
  padding: .5rem .3rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .2rem;
  position: relative;
  text-align: center;
}
.result-card.cat-abjad      { --accent: var(--gold); }
.result-card.cat-alphabetic { --accent: var(--cyan); }
.result-card.cat-prime      { --accent: var(--violet); }
.result-card.cat-fib        { --accent: var(--sage); }
.result-card.cat-phi        { --accent: var(--amber); }
.result-card.cat-euler      { --accent: var(--sky); }
.result-card.cat-satanic    { --accent: var(--rose); }
.result-card.cat-even       { --accent: var(--cyan); }
.result-card.cat-odd        { --accent: var(--violet); }
.result-card.cat-sumerian   { --accent: var(--sage); }
.result-card.cat-other      { --accent: var(--text-muted); }
.result-card.cat-custom     { --accent: var(--amber); }

.rc-name {
  font-size: .9rem;
  color: var(--text-muted);
  line-height: 1.2;
  margin-top: .15rem;
  padding: .3rem .2rem;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  transition: color .12s;
}
/* rc-name same color as rc-val per category */
.cat-abjad      .rc-name { color: var(--gold-glow); }
.cat-alphabetic .rc-name { color: var(--cyan); }
.cat-prime      .rc-name { color: var(--violet); }
.cat-fib        .rc-name { color: var(--sage); }
.cat-phi        .rc-name { color: var(--amber); }
.cat-euler      .rc-name { color: var(--sky); }
.cat-satanic    .rc-name { color: var(--rose); }
.cat-even       .rc-name { color: var(--cyan); }
.cat-odd        .rc-name { color: var(--violet); }
.cat-sumerian   .rc-name { color: var(--sage); }
.cat-other      .rc-name { color: var(--text-muted); }
.rc-name:hover { opacity: .8; }
.rc-val {
  font-family: 'Ubuntu Mono', monospace;
  font-size: 1.4rem;
  font-weight: 700;
  line-height: 1;
  transition: opacity .12s;
}
.rc-val:hover { opacity: .7; }
.cat-abjad      .rc-val { color: var(--gold-glow); }
.cat-alphabetic .rc-val { color: var(--cyan); }
.cat-prime      .rc-val { color: var(--violet); }
.cat-fib        .rc-val { color: var(--sage); }
.cat-phi        .rc-val { color: var(--amber); }
.cat-euler      .rc-val { color: var(--sky); }
.cat-satanic    .rc-val { color: var(--rose); }
.cat-even       .rc-val { color: var(--cyan); }
.cat-odd        .rc-val { color: var(--violet); }
.cat-sumerian   .rc-val { color: var(--sage); }
.cat-other      .rc-val { color: var(--text-pri); }
.cat-custom     .rc-val { color: var(--amber); }

.rc-dr {
  font-family: 'Ubuntu Mono', monospace;
  font-size: .85rem;
  color: var(--text-muted);
}
.rc-dr span { color: var(--text-sec); font-size: .95rem; font-weight: 600; }
.detail-wc { font-size: .8rem; color: #ffffff; margin-top: .2rem; }
html[data-theme="light"] .detail-wc { color: #1c1a14; }
html[data-theme="light"] .lcard-char,
html[data-theme="light"] .letter-chip .lc-char { text-shadow: none; }

/* ── EXPANDED DETAIL (full-width row below grid) ── */
.detail-row {
  display: none;
  grid-column: 1 / -1;
  background: var(--bg-deep);
  border: 1px solid var(--border-lit);
  border-radius: var(--radius);
  padding: 1rem 1.2rem;
  direction: rtl;
  animation: slideDown .15s ease;
}
.detail-row.open { display: block; }

@keyframes slideDown {
  from { opacity: 0; transform: translateY(-6px); }
  to   { opacity: 1; transform: translateY(0); }
}


/* ── LETTER CARD GRID (inline view — read-only display) ── */
.lcard-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(56px, 1fr));
  gap: .2rem;
  direction: rtl;
  margin-bottom: .6rem;
}
.lcard {
  background: var(--bg-input);
  border-radius: 7px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .45rem;
  padding: .55rem .15rem .4rem;
  transition: background .15s;
}

.lcard-char {
  font-family: 'Amiri', serif;
  font-size: 1.5rem;
  color: var(--letter-glow, #ff5470);
  text-shadow: 0 0 6px rgba(255,84,112,.55);
  line-height: 1;
}
.lcard-value {
  font-family: 'Ubuntu Mono', monospace;
  font-size: 1.2rem;
  font-weight: 700;
  color: var(--letter-val, #ffffff);
  line-height: 1;
}
/* variant badge */
.lcard-ref {
  font-size: .58rem;
  color: var(--text-muted);
  font-family: 'Ubuntu Mono', monospace;
}
.lcard-grid-variants {
  grid-template-columns: repeat(auto-fill, minmax(58px, 1fr));
}

.ltable-section-label {
  font-size: .68rem;
  color: var(--text-muted);
  letter-spacing: .08em;
  font-family: 'Ubuntu Mono', monospace;
  margin-bottom: .4rem;
  margin-top: .2rem;
}

/* inline footer */
.inline-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: .6rem;
  margin-top: .9rem;
  padding-top: .8rem;
  border-top: 1px solid var(--border);
  direction: rtl;
}
.if-total {
  display: flex;
  align-items: baseline;
  gap: .5rem;
}
.if-total-label { font-size: .78rem; color: var(--text-muted); }
.if-total-val {
  font-family: 'Ubuntu Mono', monospace;
  font-size: 1.6rem;
  font-weight: 700;
  color: var(--gold-glow);
}
.if-dr {
  font-family: 'Ubuntu Mono', monospace;
  font-size: .72rem;
  color: var(--text-muted);
}
.if-dr span { color: var(--cyan); }

/* custom row delete */
.btn-del-custom {
  background: #2a1a1a;
  border: none;
  color: var(--text-muted);
  cursor: pointer;
  font-size: .8rem;
  padding: .2rem .4rem;
  transition: color .14s;
  margin-right: .3rem;
}
.btn-del-custom:hover { color: var(--rose); }

/* ── EMPTY STATE ── */
.empty-state {
  text-align: center;
  padding: 3.5rem 2rem;
  color: var(--text-muted);
}
.empty-icon {
  font-family: 'Amiri', serif;
  font-size: 3.5rem;
  color: var(--gold-dim);
  opacity: .4;
  display: block;
  margin-bottom: .8rem;
}

/* ── EDIT / ADD TABLE PANEL ── */
.add-panel {
  display: none;
  background: var(--bg-card);
  border: 1px solid var(--border-lit);
  border-radius: var(--radius-lg);
  padding: 1.5rem 1.8rem;
  margin-bottom: 1.4rem;
  animation: slideDown .18s ease;
}
.add-panel.open { display: block; }
.add-panel-title {
  font-size: .82rem;
  color: var(--gold);
  font-weight: 600;
  margin-bottom: 1rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.add-panel-close {
  background: none; border: none;
  color: var(--text-muted); cursor: pointer; font-size: .9rem;
}
.add-panel-close:hover { color: var(--rose); }
.add-panel-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .8rem;
  margin-bottom: 1rem;
}
@media(max-width:500px){ .add-panel-grid { grid-template-columns: 1fr; } }
.add-panel input[type=text], .add-panel select {
  width: 100%;
  background: var(--bg-input);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  color: var(--text-pri);
  font-family:var(--font-main);
  font-size: .88rem;
  padding: .6rem .9rem;
  outline: none;
  direction: rtl;
  transition: border-color .15s;
}
.add-panel input[type=text]:focus,
.add-panel select:focus { border-color: var(--gold); }

.letter-vals-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(68px, 1fr));
  gap: .5rem;
  margin-bottom: 1rem;
  direction: rtl;
}
.lv-cell {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .2rem;
  background: var(--bg-input);
  border: 1px solid var(--border);
  border-radius: 6px;
  padding: .4rem .3rem;
}
.lv-char { font-family: 'Amiri', serif; font-size: 1.3rem; color: var(--gold-glow); line-height: 1; }
.lv-inp {
  width: 100%;
  background: var(--bg-deep);
  border: 1px solid var(--border);
  border-radius: 4px;
  color: var(--cyan);
  font-family: 'Ubuntu Mono', monospace;
  font-size: .82rem;
  text-align: center;
  padding: .2rem;
  outline: none;
}
.lv-inp:focus { border-color: var(--gold); color: var(--gold-glow); }
.add-panel-actions { display: flex; gap: .6rem; justify-content: flex-end; direction: rtl; }
.btn-save-table {
  background: linear-gradient(135deg, var(--gold) 0%, #a07830 100%);
  border: none; border-radius: var(--radius);
  color: #0a0c10;
  font-family:var(--font-main); font-weight: 700; font-size: .88rem;
  padding: .55rem 1.5rem; cursor: pointer;
}
.btn-cancel-table {
  background:var(--bg-card); border: 1px solid var(--border);
  border-radius: var(--radius); color: var(--text-sec);
  font-family:var(--font-main); font-size: .85rem;
  padding: .55rem 1.1rem; cursor: pointer;
}
.btn-cancel-table:hover { border-color: var(--text-sec); color: var(--text-pri); }

/* ── NUMBER PROPERTIES PANEL ── */
.numprops-section {
  display: none;
  margin-top: 1.5rem;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  overflow: hidden;
}
.numprops-section.open { display: block; }

.numprops-header {
  text-align: center;
  padding: 2rem 1.5rem 1.5rem;
  border-bottom: 1px solid var(--border);
  position: relative;
}
.numprops-header .np-close {
  position: absolute;
  top: 1rem; left: 1rem;
  background: none; border: 1px solid var(--border); border-radius: 5px;
  color: var(--text-muted); width: 30px; height: 30px;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; font-size: .9rem;
}
.numprops-header .np-close:hover { color: var(--rose); border-color: var(--rose); }
.np-pre-title {
  font-size: .82rem;
  letter-spacing: .18em;
  color: var(--text-muted);
  font-family: 'Ubuntu Mono', monospace;
  text-transform: uppercase;
  margin-bottom: .3rem;
}
.np-number {
  font-family: 'Ubuntu Mono', monospace;
  font-size: clamp(2.2rem, 5vw, 3.2rem);
  font-weight: 700;
  color: #39ff14;
  line-height: 1.1;
}
.np-factorization {
  font-family: 'Ubuntu Mono', monospace;
  font-size: 1.25rem;
  color: #39ff14;
  margin-top: .3rem;
}
.np-fx { color: #67e8f9; font-weight: 400; padding: 0 .1em; }
.np-identity-tags {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .3rem;
  margin-top: 1rem;
}
.np-id-tag {
  font-size: 1.05rem;
  font-weight: 700;
  padding: .2rem .5rem;
}
/* أربع فئات فقط الآن — لون مستقل للأعداد الأولية، لون للقواسم (أدناه)،
   لون لِـ π/φ (أدناه)، وكل ما تبقى (بقية الشارات + بقية الأرقام) بلون
   موحّد واحد — كل الألوان مختارة رياضيًا لتعمل بوضوح في الوضعين معًا */
.np-id-tag.prime    { color: #cc4828; }
.np-id-tag.fib      { color: #39ff14; }
.np-id-tag.tri      { color: #39ff14; }
.np-id-tag.square   { color: #39ff14; }
.np-id-tag.cube     { color: #39ff14; }
.np-id-tag.penta    { color: #39ff14; }
.np-id-tag.star     { color: #39ff14; }
.np-id-tag.perfect  { color: #39ff14; }
.np-id-tag.hex      { color: #39ff14; }
.np-id-tag.tetra    { color: #39ff14; }
.np-id-tag.sqpyr    { color: #39ff14; }

/* body */
.np-body {
  padding: 1.5rem 2rem 2rem;
  direction: ltr;
  max-width: 550px;
  margin: 0 auto;
  text-align: center;
}

.np-section-head {
  text-align: center;
  font-size: 1.1rem;
  font-weight: 700;
  color:var(--dcr-doy);
  margin: .8rem 0 .6rem;
  letter-spacing: .06em;
}
.np-section-head:first-child { margin-top: 0; }

.np-div-row {
  display: flex;
  justify-content: center;
  gap: 3rem;
  margin-bottom: .8rem;
  flex-wrap: wrap;
}
.np-div-cell { text-align: center; }
.np-div-label { font-size: .95rem; color: #67e8f9; font-weight: 600; margin-bottom: .3rem; }
.np-div-val {
  font-family: 'Ubuntu Mono', monospace;
  font-size: 1.4rem;
  font-weight: 700;
  color: #805ce0;
  text-shadow: 0 0 8px rgba(128,92,224,.3);
}
.np-div-val .np-clk { color: #805ce0; border-bottom-color: rgba(128,92,224,.45); }
.np-div-val .np-clk:hover { color: #a389ec; text-shadow: 0 0 10px rgba(128,92,224,.65); border-bottom-color: #a389ec; }
.np-div-list {
  font-family: 'Ubuntu Mono', monospace;
  font-size: .95rem;
  color: var(--text-sec);
  text-align: center;
  margin-bottom: .5rem;
}
.np-div-list-wrap { margin: .3rem 0 .6rem; text-align: center; }
.np-div-chips { display: flex; flex-wrap: wrap; gap: .3rem; justify-content: center; padding: .4rem 0; }
.np-div-chip {
  font-family: 'Ubuntu Mono', monospace; font-size: .88rem;
  background: rgba(128,92,224,.08); border: 1px solid rgba(128,92,224,.25);
  color: #805ce0; border-radius: 5px; padding: .15rem .55rem;
  cursor: pointer; transition: all .12s;
}
.np-div-chip:hover { background: rgba(128,92,224,.2); color: #a389ec; border-color: #a389ec; }
.np-div-details { display: inline-block; width: 100%; }
.np-div-summary {
  list-style: none; cursor: pointer; display: inline-flex; align-items: center;
  gap: .4rem; font-size: .8rem; color: var(--text-muted);
  background: rgba(0,229,255,.06); border: 1px solid rgba(0,229,255,.15);
  border-radius: 6px; padding: .3rem .8rem; margin-bottom: .4rem;
  transition: background .12s;
}
.np-div-summary::-webkit-details-marker { display: none; }
.np-div-summary:hover { background: rgba(0,229,255,.12); }
.np-div-details[open] .np-div-toggle { color: var(--gold); }
.np-div-toggle { font-size: .75rem; color: var(--gold-dim); }
.np-composite-note {
  text-align: center;
  font-size: .95rem;
  color: #67e8f9;
  font-weight: 600;
  margin-top: .4rem;
}
.np-composite-note .np-ord { color: #67e8f9; font-size: .8em; }

/* nth table */
.np-nth-table {
  width: auto;
  margin: 0 auto;
  border-collapse: collapse;
}
.np-nth-table td {
  padding: .28rem .6rem;
  font-size: .92rem;
  text-align: center;
}
.np-nth-table {
  margin: 0 auto;
  direction: ltr;
  border-collapse: collapse;
}
.np-nth-table td.nth-lbl {
  text-align: right;
  color: var(--text-sec);
  padding: .3rem 1rem .3rem 0;
  white-space: nowrap;
  font-size: .95rem;
}
.np-nth-table td.nth-num {
  font-family: 'Ubuntu Mono', monospace;
  font-weight: 700;
  color: #cc4828;
  text-align: left;
  padding: .3rem 0;
  min-width: 90px;
}
.np-nth-table td:first-child {
  text-align: left;
  color: var(--text-sec);
  padding-right: 1.5rem;
}
.np-nth-table td:last-child {
  font-family: 'Ubuntu Mono', monospace;
  font-weight: 700;
  color: #cc4828;
  font-size: 1.1rem;
  text-align: center;
}

/* ── Number input spinner at bottom ── */
.np-input-section {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  padding: 1.2rem 1.5rem;
  border-top: 1px solid var(--border);
  direction: ltr;
}
.np-spin-input {
  background: var(--bg-input);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  color: var(--gold-glow);
  font-family: 'Ubuntu Mono', monospace;
  font-size: 1.3rem;
  font-weight: 700;
  text-align: center;
  padding: .5rem .8rem;
  width: 140px;
  outline: none;
  transition: border-color .15s;
  -moz-appearance: textfield;
}
.np-spin-input:focus { border-color: var(--gold); }
.np-spin-input::-webkit-inner-spin-button,
.np-spin-input::-webkit-outer-spin-button { -webkit-appearance: none; }

.np-spin-btn {
  background: var(--bg-input);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  color: var(--text-sec);
  width: 36px; height: 36px;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer;
  font-size: 1.1rem;
  transition: all .12s;
  user-select: none;
}
.np-spin-btn:hover { border-color: var(--gold); color: var(--gold-glow); }
.np-spin-btn:active { background: var(--bg-hover); }
.np-go-btn {
  background: linear-gradient(135deg, var(--gold) 0%, #a07830 100%);
  border: none;
  border-radius: var(--radius);
  color: #0a0c10;
  font-family:var(--font-main);
  font-weight: 700;
  font-size: .85rem;
  padding: .5rem 1.2rem;
  cursor: pointer;
  margin-right: .5rem;
}

/* ═══ ألوان لوحة خصائص الأعداد مصممة أصلًا لخلفية داكنة (ألوان نيون
   باهتة) — على الخلفية البيضاء في الوضع النهاري تصير ضعيفة التباين
   وصعبة القراءة. نفرض بدائل أغمق وأكثر تشبّعًا هنا فقط لهذا الوضع،
   بلا أي تغيير على الوضع الليلي ═══ */
html[data-theme="light"] .np-fx { color: #0c647c; }
html[data-theme="light"] .np-div-label { color: #0c647c; }
html[data-theme="light"] .np-composite-note,
html[data-theme="light"] .np-composite-note .np-ord { color: #0c647c; }

/* الكلاسات الفعلية المستخدمة في هذا العرض بالذات (اكتُشفت بعد
   المراجعة — التعديل الأول استهدف جدولًا قديمًا غير مُستخدم هنا) */
html[data-theme="light"] .nth-row-l { color: #0c647c; text-shadow: none; }
html[data-theme="light"] .np-id-tag .np-clk { color: inherit; }
html[data-theme="light"] .np-const-label { color: #0c647c; }
html[data-theme="light"] .np-const-pi .np-const-sym { color: #0c647c; text-shadow: none; }
html[data-theme="light"] .np-const-phi .np-const-sym { color: #7b1fa2; text-shadow: none; }

/* ═══ تدقيق إضافي (٢٠٢٦-٠٧-٢٣): هذي الفئات فاتت المراجعتين السابقتين
   كليًا — ما كان فيها ولا سطر واحد للوضع النهاري. هذا سبب ظهور
   الرقم الكبير والعوامل بأخضر نيون (#39ff14) والقواسم ببنفسجي فاتح
   (#805ce0) بلا أي تغيير رغم التعديلين السابقين ═══ */
html[data-theme="light"] .np-number,
html[data-theme="light"] .np-factorization { color: #186b08; }
html[data-theme="light"] .np-id-tag.prime { color: #9f381f; }
html[data-theme="light"] .np-id-tag.fib,
html[data-theme="light"] .np-id-tag.tri,
html[data-theme="light"] .np-id-tag.square,
html[data-theme="light"] .np-id-tag.cube,
html[data-theme="light"] .np-id-tag.penta,
html[data-theme="light"] .np-id-tag.star,
html[data-theme="light"] .np-id-tag.perfect,
html[data-theme="light"] .np-id-tag.hex,
html[data-theme="light"] .np-id-tag.tetra,
html[data-theme="light"] .np-id-tag.sqpyr { color: #186b08; }
html[data-theme="light"] .np-div-val,
html[data-theme="light"] .np-div-val .np-clk,
html[data-theme="light"] .np-div-chip { color: #6448af; text-shadow: none; }
html[data-theme="light"] .np-div-val .np-clk:hover,
html[data-theme="light"] .np-div-chip:hover { color: #62528e; }
html[data-theme="light"] .np-const-card .np-clk,
html[data-theme="light"] .np-hit { color: #256464; }
html[data-theme="light"] .np-const-card .np-clk:hover { color: #266464; }
html[data-theme="light"] .ls-fbtn { background: var(--bg-card); border-color: var(--border); color: var(--text-sec); }
html[data-theme="light"] .dc-fields label,
html[data-theme="light"] .ecl-inputs label,
html[data-theme="light"] .dc-pm-fields label { color: var(--text-sec); }
html[data-theme="light"] .dc-chk,
html[data-theme="light"] .dc-pm-radio,
html[data-theme="light"] .dc-opt-item,
html[data-theme="light"] .dc-table td:nth-child(odd) { color: var(--text-pri); }

/* ═══ تدقيق شامل لكل الملف (٢٠٢٦-٠٧-٢٣) — ٥٥ قاعدة لون إضافية عبر
   الموقع كامل ما كان فيها أي معالجة للوضع النهاري إطلاقًا (قائمة
   التنقل، الأوفاق، هندسة الأبعاد، بطاقات الأدوات، شجرة الحياة،
   جدول العناصر الفلكية، منازل القمر، شارات الكسوف...). كل قيمة
   محسوبة لتحافظ على درجة اللون الأصلية (Hue) مع تصحيح الإضاءة
   فقط لتحقيق ≥4.5:1 فوق أغمق خلفية بطاقة (--bg4) ═══ */
html[data-theme="light"] .nav-mega-col .nav-menu-item { color: #615941; }
html[data-theme="light"] .nav-mega-col .nav-menu-item:hover { color: #615941; }
html[data-theme="light"] .ms-hint:hover { color: #5a5961; }
html[data-theme="light"] #pageGeometry3D .ms-hint:hover { color: #60594d; }
html[data-theme="light"] .ms-planet-intro { color: #615941; }
html[data-theme="light"] .cm-del-btn { color: #904242; }
html[data-theme="light"] .dc-eclipse-badge.solar { color: #735811; }
html[data-theme="light"] .num-card:hover { color: #66582f; }
html[data-theme="light"] .num-hl { color: #735614; }
html[data-theme="light"] .num-card.on { color: #72561f; }
html[data-theme="light"] .nsvc .nr { color: #535b67; }
html[data-theme="light"] .qbtn.custom .del-x { color: #904242; }
html[data-theme="light"] .bc-table td.bc-red { color: #a33434; }
html[data-theme="light"] .sajda-badge.khilaf { color: #2f6079; }
html[data-theme="light"] .az-tbl td.az-elem-earth { color: #39634b; }
html[data-theme="light"] .az-tbl td.az-elem-air { color: #2f6079; }
html[data-theme="light"] .az-tbl td.az-elem-water { color: #634f8c; }
html[data-theme="light"] .tool-tile.accent-gold .tool-tile-name { color: #66582f; }
html[data-theme="light"] .tool-tile.accent-cyan .tool-tile-name { color: #356360; }
html[data-theme="light"] .tool-tile.accent-violet .tool-tile-name { color: #63557d; }
html[data-theme="light"] .tool-tile.accent-rose .tool-tile-name { color: #874758; }
html[data-theme="light"] .tool-tile.accent-sage .tool-tile-name { color: #3d624d; }
html[data-theme="light"] .tool-tile.accent-amber .tool-tile-name { color: #6f542b; }
html[data-theme="light"] .ckp-sys-btn.ckp-sys-active { color: #615941; }
html[data-theme="light"] .ckp-zitem.active .ckp-zsym { color: #66582f; }
html[data-theme="light"] .ckp-zitem.active .ckp-zname { color: #66582f; }
html[data-theme="light"] .ckp-planet-btn:hover { color: #695728; }
html[data-theme="light"] .ckp-planet-btn.active { color: #615941; }
html[data-theme="light"] .dm-btn-del { color: #8a4545; }
html[data-theme="light"] .dm-btn-edit { color: #2f6079; }
html[data-theme="light"] .dm-line-ymwd { color: #6e581d; }
html[data-theme="light"] .dm-line-ywd { color: #3c606d; }
html[data-theme="light"] .tol-world-btn.tol-world-active { color: #685172; }

/* ═══ تمريرة ثالثة — بارسر CSS حقيقي بديل عن regex سطر-بسطر (٢٠٢٦-٠٧-٢٣):
   القواعد اللي خصائصها موزعة على أكثر من سطر (مثل .nth-row-n, .np-clk)
   كانت تفوت أي بحث بنمط "سطر واحد" مهما تكرر — هذا سبب ظهور نفس القيم
   الخضراء/الأرقام القابلة للنقر بلا تغيير رغم تمريرتين سابقتين. هذا
   الفحص يحلل بنية CSS الفعلية (selector + جسم القاعدة كاملًا بغض النظر
   عن عدد الأسطر) بدل مطابقة نصية سطحية ═══ */
html[data-theme="light"] .tools-grid-lbl { color: #615941; }
html[data-theme="light"] .hero-verse { color: #66593b; }
html[data-theme="light"] .ms-hint { color: #5e5779; }
html[data-theme="light"] .ms-error { color: #943d51; }
html[data-theme="light"] .np-nth-table td.nth-num { color: #9f381f; }
html[data-theme="light"] .np-nth-table td:last-child { color: #9f381f; }
html[data-theme="light"] .dc-hebrew { color: #5a5663; }
html[data-theme="light"] .nth-row-n { color: #186b08; }
html[data-theme="light"] .np-clk { color: #186b08; }
html[data-theme="light"] .np-clk:hover { color: #874c10; }
html[data-theme="light"] .word-subtotal .ws-val { color: #006a36; }
html[data-theme="light"] .home-hero-title { color: #8a6d0f; }
html[data-theme="light"] .hqb-verse { color: #66593b; }
html[data-theme="light"] #pageGematriaEN header h1 { color: #355f5c; }
html[data-theme="light"] #pageGematriaEN .toolbar-title { color: #355f5c; }
html[data-theme="light"] #pageGematriaEN .geo-card-label { color: #415d88; }
html[data-theme="light"] #pageGematriaEN .geo-card-value { color: #355f5c; }
html[data-theme="light"] #pageGematriaEN .geo-card-value:hover { color: #745500; }
html[data-theme="light"] #pageGematriaEN .ciphers-count { color: #745500; }
html[data-theme="light"] #pageGematriaEN .history-title { color: #355f5c; }
html[data-theme="light"] #pageGematriaEN .history-table th { color: #415d88; }
html[data-theme="light"] #pageGematriaEN .geo-match-head { color: #355f5c; }
html[data-theme="light"] #pageGematriaEN .btn-hist.danger { color: #9d344f; }
html[data-theme="light"] #pageGematriaEN .toggle-hist { color: #385d81; }
html[data-theme="light"] #pageGematriaEN .toggle-hist:hover { color: #355f5c; }
html[data-theme="light"] .gen-cipher-count { color: #745500; }
html[data-theme="light"] .gen-btn-outline { color: #355f5c; }
html[data-theme="light"] .gen-bd-total { color: #415d88; }
html[data-theme="light"] .gen-add-header { color: #355f5c; }
html[data-theme="light"] .gen-add-close { color: #415d88; }
html[data-theme="light"] .gen-label { color: #415d88; }
html[data-theme="light"] .gen-btn-cancel { color: #415d88; }
html[data-theme="light"] .gen-hist-title { color: #415d88; }
html[data-theme="light"] .gen-hist-toggle { color: #415d88; }
html[data-theme="light"] .gen-hist-toggle:hover { color: #355f5c; }
html[data-theme="light"] #pageGematriaEN #geoHistorySection .history-table td { color: #545c66; }
html[data-theme="light"] .geo-ctx-item.danger:hover { color: #944154; }
html[data-theme="light"] .ckp-planet-btn { color: #5e5c4c; }
html[data-theme="light"] .dm-line-ym { color: #695728; }
html[data-theme="light"] .dm-line-d { color: #6a571b; }
html[data-theme="light"] .dm-line-yd { color: #2f6079; }
html[data-theme="light"] .dm-line-mwd { color: #4a5f4a; }
html[data-theme="light"] .dm-line-md { color: #3c643c; }
html[data-theme="light"] .dm-line-wd { color: #6f4f75; }

/* rgb() نصوص فاتت الفحص السابق لأنه كان يبحث عن hex فقط */
html[data-theme="light"] #pageGematriaEN .geo-input,
html[data-theme="light"] #pageGematriaEN .history-table td,
html[data-theme="light"] #pageGematriaEN #geoMatchSection { color: #595959; }

/* ── COMPARISON / HISTORY SECTION ── */
.history-section {
  margin-top: 2rem;
  display: none;
}
.history-section.has-data { display: block; }

.history-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: .5rem;
  margin-bottom: 1rem;
  direction: rtl;
}
.history-title {
  font-size: .95rem;
  color: var(--gold);
  font-weight: 600;
}
.history-actions { display: flex; gap: .5rem; }
.btn-hist {
  background:var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  color: var(--text-sec);
  font-family:var(--font-main);
  font-size: .75rem;
  padding: .35rem .8rem;
  cursor: pointer;
  transition: all .14s;
}
.btn-hist:hover { border-color: var(--text-sec); color: var(--text-pri); }
.btn-hist.danger:hover { border-color: var(--rose); color: var(--rose); }

/* search results banner */
.search-banner {
  display: none;
  background: rgba(78,205,196,.08);
  border: 1px solid var(--cyan);
  border-radius: var(--radius);
  padding: .7rem 1rem;
  margin-bottom: 1rem;
  direction: rtl;
  font-size: .85rem;
  color: var(--cyan);
}
.search-banner.open { display: flex; align-items: center; justify-content: space-between; gap: .5rem; }
.search-banner .sb-close {
  background: none; border: none; color: var(--text-muted); cursor: pointer; font-size: .8rem;
}

/* table wrapper */
.history-table-wrap {
  overflow-x: auto;
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  background: var(--bg-card);
}
.history-table {
  width: 100%;
  border-collapse: collapse;
  direction: rtl;
  min-width: 600px;
}
.history-table th {
  background: var(--bg-input);
  font-size: .9rem;
  font-weight: 600;
  color: var(--text-muted);
  padding: .5rem .6rem;
  text-align: center;
  border-bottom: 1px solid var(--border);
  border-left: 1px solid var(--border);
  white-space: nowrap;
  position: sticky;
  top: 0;
  z-index: 1;
}
.history-table th:last-child { border-left: none; }
.history-table th:first-child {
  text-align: right;
  min-width: 100px;
  position: sticky;
  right: 0;
  z-index: 2;
  background: var(--bg-input);
}
.history-table td {
  font-family: 'Ubuntu Mono', monospace;
  font-size: 1.1rem;
  color: var(--text-sec);
  padding: .45rem .5rem;
  text-align: center;
  border-bottom: 1px solid var(--border);
  border-left: 1px solid var(--border);
}
.history-table td:last-child { border-left: none; }
.history-table td:first-child {
  font-family: 'Amiri', serif;
  font-size: 1.35rem;
  color: var(--gold-glow);
  text-align: right;
  position: sticky;
  right: 0;
  background: var(--bg-card);
  z-index: 2;
  min-width: 220px;
  max-width: 420px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  box-shadow: -3px 0 8px rgba(0,0,0,.4);
}
.history-table th:first-child {
  position: sticky;
  right: 0;
  background:var(--bg-card) !important;
  z-index: 3;
  box-shadow: -3px 0 8px rgba(0,0,0,.4);
}
.history-table tr:last-child td { border-bottom: none; }
.history-table tr:hover td { background: var(--bg-hover); }
.history-table tr:hover td:first-child { background: var(--bg-hover); }

/* highlight matching */
.td-match {
  color: var(--gold-glow) !important;
  background: rgba(201,168,76,.12) !important;
  font-weight: 700;
}

/* delete word btn */
.td-del {
  background: none; border: none;
  color: var(--text-muted); cursor: pointer;
  font-size: .7rem; padding: .1rem .3rem;
  transition: color .12s;
}
.td-del:hover { color: var(--rose); }

/* ── DATE CALCULATOR ── */
.dc-container { max-width: 960px; margin: 0 auto; padding: 2rem 1.5rem 3rem; direction: ltr; }
.dc-title { text-align: center; font-family: 'Amiri', serif; font-size: 1.8rem; color: var(--gold-glow); margin-bottom: .2rem; }
.dc-sub { text-align: center; font-size: .78rem; color: var(--text-muted); margin-bottom: 1.5rem; font-family: 'Ubuntu Mono', monospace; letter-spacing: .1em; }
.dc-dates { display: flex; gap: 1rem; justify-content: center; flex-wrap: wrap; margin-bottom: 1.2rem; }
.dc-date-box {
  background: var(--bg-card); border: 1px solid var(--border); border-radius: var(--radius-lg);
  padding: 1rem 1.2rem; min-width: 260px; flex: 1; max-width: 380px;
}
.dc-date-display {
  text-align: center; font-family: 'Ubuntu Mono', monospace; font-size: 1.2rem;
  font-weight: 700; color: var(--gold-glow); margin-bottom: .8rem; font-size: 1.3rem;
  padding: .7rem; border: 2px solid var(--gold-dim); border-radius: var(--radius); background: var(--bg-input);
}
.dc-fields { display: flex; gap: .6rem; justify-content: center; }
.dc-fields div { text-align: center; }
.dc-fields label { display: block; font-size: .8rem; color: #bbb; margin-bottom: .3rem; }
.dc-fields input {
  width: 100px; background: var(--bg-input); border: 1px solid var(--border); border-radius: 5px;
  color: var(--cyan); font-family: 'Ubuntu Mono', monospace; font-size: 1.15rem; font-weight: 700;
  text-align: center; padding: .5rem; outline: none;
}
.dc-fields input:focus { border-color: var(--gold); }
.dc-zodiac {
  margin-top: .9rem; padding-top: .8rem; border-top: 1px dashed var(--gold-dim);
  display: grid; grid-template-columns: auto 1fr; gap: .35rem .7rem; font-size: .82rem;
}
.dc-zodiac .dz-head {
  grid-column: 1 / -1; display: flex; align-items: center; gap: .5rem;
  font-family: 'Amiri', serif; font-size: 1.15rem; color: var(--gold-glow); margin-bottom: .3rem;
}
.dc-zodiac .dz-sym { font-size: 1.4rem; }
.dc-zodiac .dz-label { color: var(--text-muted); }
.dc-zodiac .dz-val { color: var(--text-pri); font-weight: 600; }
.dc-hijri {
  text-align: center; font-family: 'Amiri', serif; font-size: 1.02rem; color: var(--cyan);
  margin-top: .5rem; padding: .4rem; background: rgba(34,211,238,.06); border-radius: var(--radius);
  border: 1px dashed rgba(34,211,238,.35);
  direction: rtl; unicode-bidi: isolate;
}
.dc-hebrew {
  text-align: center; font-family: 'Amiri', serif; font-size: 1.02rem; color: #e0d8f8;
  margin-top: .35rem; padding: .4rem; background: rgba(167,139,250,.08); border-radius: var(--radius);
  border: 1px dashed rgba(200,190,255,.3);
  direction: ltr;
}
.dc-eclipse-badge {
  margin-top: .5rem; text-align: center; font-size: .8rem; font-weight: 700;
  padding: .45rem .6rem; border-radius: var(--radius); cursor: pointer;
}
.dc-eclipse-badge.solar { background: rgba(251,191,36,.12); border: 1px solid rgba(251,191,36,.4); color: #fbbf24; }
.dc-eclipse-badge.lunar { background: rgba(167,139,250,.12); border: 1px solid rgba(167,139,250,.4); color:var(--dcr-day); }
.dc-eclipse-btn { display:block; margin: -.6rem auto 1.2rem; }
.dc-calcmode { display:flex; gap:.6rem; justify-content:center; margin-bottom:1rem; }
.dc-calcmode label { background: var(--bg-card); border:1px solid var(--border); border-radius: var(--radius); padding:.5rem 1.1rem; cursor:pointer; font-size:.85rem; transition: border-color .12s; }
.dc-calcmode label:has(input:checked) { border-color: var(--gold); color: var(--gold-glow); }
.dc-calcmode input { margin-left:.4rem; }

/* ── ECLIPSES PAGE ── */
.ecl-container { max-width: 860px; margin: 0 auto; padding: 2rem 1.5rem 3rem; }
.ecl-back { background:var(--bg-card); border:1px solid #2a3346; color: var(--text-pri); border-radius: var(--radius); padding:.45rem 1rem; font-family:var(--font-main); font-size:.85rem; cursor:pointer; margin-bottom:1rem; }
.ecl-back:hover { background: var(--bg-hover); }
.ecl-mode { display:flex; gap:.6rem; justify-content:center; margin-bottom:1.2rem; }
.ecl-mode label { background: var(--bg-card); border:1px solid var(--border); border-radius: var(--radius); padding:.5rem 1rem; cursor:pointer; font-size:.85rem; }
.ecl-mode input { margin-left:.4rem; }
.ecl-inputs { display:flex; gap:.8rem; justify-content:center; align-items:flex-end; flex-wrap:wrap; margin-bottom:1.4rem; }
.ecl-inputs div { text-align:center; }
.ecl-inputs label { display:block; font-size:.78rem; color:#bbb; margin-bottom:.3rem; }
.ecl-inputs input { width:110px; background: var(--bg-input); border:1px solid var(--border); border-radius:5px; color: var(--cyan); font-family:'Ubuntu Mono',monospace; font-size:1.05rem; font-weight:700; text-align:center; padding:.5rem; outline:none; }
.ecl-inputs input:focus { border-color: var(--gold); }
.ecl-go { background: linear-gradient(135deg,#c9a84c,#9a6820); border:1px solid #c9a84c; color:#0a0c10; font-weight:700; border-radius: var(--radius); padding:.55rem 1.3rem; cursor:pointer; font-family:var(--font-main); }
.ecl-note { text-align:center; font-size:.75rem; color: var(--text-muted); margin-bottom:1.3rem; line-height:1.6; }
.ecl-list { display:flex; flex-direction:column; gap:.6rem; }

/* ── سفر التكوين ── */
.gns-wrap { max-width: 820px; margin: 0 auto; padding: 1.5rem 1rem; }
.gns-panel { background: var(--bg-card); border:1px solid var(--border); border-radius:12px; padding:1.2rem 1.4rem; margin-bottom:1.2rem; }
.gns-panel h2 { font-size:1rem; color:var(--cyan-glow); margin:0 0 .8rem; }
.gns-row { display:flex; gap:.6rem; }
.gns-row input { flex:1; background: var(--bg2); border:1px solid var(--border); border-radius:8px; padding:.6rem .8rem; color:var(--text-pri); font-size:1rem; }
.gns-row button { background: linear-gradient(135deg, var(--gold), var(--gold-deep)); border:none; border-radius:8px; padding:.6rem 1.2rem; color:var(--ink); font-weight:700; cursor:pointer; }
.gns-empty { text-align:center; color:var(--text-muted); padding:1rem; }
.gns-verse-block { border-bottom:1px solid var(--border); padding:.4rem 0; transition: background .3s; border-radius:6px; }
.gns-verse-block.flash { background: rgba(201,168,76,.16); }
.gns-verse-row { display:flex; flex-wrap:wrap; gap:.4rem; direction:rtl; font-size:1.5rem; line-height:2.6; }
.gns-hword { cursor:pointer; padding:.1rem .3rem; border-radius:5px; transition: background .12s, color .12s; }
.gns-hword:hover { background: rgba(201,168,76,.18); color: var(--gold-glow); }
.qword { cursor:pointer; padding:.1rem .25rem; border-radius:5px; transition: background .12s, color .12s; }
.qword:hover { background: rgba(201,168,76,.18); color: var(--gold-glow); }
.gns-verse-num { color: var(--text-muted); font-size:.85rem; align-self:center; margin-left:.5rem; }
.gns-ar-row { direction:rtl; color: var(--text-pri); font-size:1rem; line-height:1.8; padding:.2rem .5rem .4rem; }
.gns-d-word { text-align:center; font-size:2.2rem; color: var(--gold-glow); margin-bottom:.2rem; }
.gns-d-val { text-align:center; font-size:1.3rem; color:var(--amber-num); font-family:'Ubuntu Mono',monospace; margin-bottom:1rem; }
.gns-d-loc { display:flex; flex-wrap:wrap; gap:.45rem; justify-content:center; align-items:center; direction:rtl; color:var(--text-sec); font-size:.85rem; margin-bottom:1rem; }
.gns-match-list { display:flex; flex-wrap:wrap; gap:.5rem; direction:rtl; justify-content:center; }
.gns-match-chip { background: rgba(103,232,249,.08); border:1px solid rgba(103,232,249,.3); color:var(--cyan-glow);
  border-radius:6px; padding:.35rem .7rem; font-size:1.1rem; cursor:pointer; }
.gns-match-chip:hover { background: rgba(103,232,249,.2); }
.gns-match-chip .gns-loc { font-size:.7rem; color:var(--text-muted); display:block; direction:ltr; }
.gns-verse-match { direction:rtl; background: rgba(255,255,255,.03); border:1px solid var(--border); border-radius:8px;
  padding:.6rem .9rem; margin-bottom:.5rem; cursor:pointer; }
.gns-verse-match:hover { background: rgba(201,168,76,.08); border-color: rgba(201,168,76,.3); }
.gns-verse-match .gns-vm-ref { color: var(--gold-glow); font-size:.8rem; margin-bottom:.3rem; direction:ltr; text-align:left; }
.gns-verse-match .gns-vm-he { font-size:1.2rem; margin-bottom:.3rem; }
.gns-verse-match .gns-vm-ar { color: var(--text-sec); font-size:.92rem; }
.gns-result-head { color:var(--text-muted); font-size:.82rem; margin:.9rem 0 .4rem; direction:rtl; text-align:center; }
.gns-notice { direction:rtl; text-align:center; background: rgba(201,168,76,.08); border:1px solid rgba(201,168,76,.3);
  border-radius:10px; padding:.9rem 1.2rem; margin-bottom:1.2rem; font-size:.85rem; line-height:1.9; color: var(--text-sec); }
.gns-notice b { color: var(--gold-glow); }
/* ── صفحة البحث الشامل ── */
.gs-toggle-group { display:flex; gap:.4rem; flex-wrap:wrap; }
.gs-toggle { background: transparent; border:1px solid var(--border); color: var(--text-muted);
  border-radius:8px; padding:.4rem .9rem; font-size:.85rem; cursor:pointer; transition: all .12s; }
.gs-toggle:hover { border-color: rgba(201,168,76,.5); color:var(--text-pri); }
.gs-toggle.on { background: rgba(201,168,76,.15); border-color: var(--gold-glow); color: var(--gold-glow); font-weight:600; }
.gs-stats-tables { display:grid; grid-template-columns: 1fr 1fr; gap:1rem; direction:rtl; }
@media (max-width: 720px) { .gs-stats-tables { grid-template-columns: 1fr; } }
.gs-stat-table { width:100%; border-collapse:collapse; font-size:.82rem; }
.gs-stat-table caption { font-weight:700; color: var(--gold-glow); padding-bottom:.5rem; text-align:center; font-size:.95rem; }
.gs-stat-table th, .gs-stat-table td { border:1px solid var(--border); padding:.35rem .5rem; text-align:center; }
.gs-stat-table th { background: rgba(201,168,76,.08); color: var(--gold-glow); font-weight:600; white-space:nowrap; }
.gs-stat-table td.num { font-family:'Ubuntu Mono',monospace; direction:ltr; }
.gs-stat-table td.gs-npd { cursor:pointer; transition: color .12s, background .12s; }
.gs-stat-table td.gs-npd:hover { color:var(--cyan-glow); background: rgba(103,232,249,.08); }
.gs-stat-table tr.tot td { background: rgba(103,232,249,.06); font-weight:700; color:var(--cyan-glow); }
.gs-stat-table tr:hover td { background: rgba(255,255,255,.04); }
.gs-results { display:flex; flex-direction:column; gap:.4rem; direction:rtl; }
.gs-result-item { background: rgba(255,255,255,.03); border:1px solid var(--border); border-radius:8px;
  padding:.5rem .7rem; cursor:pointer; transition: background .12s; }
.gs-result-item:hover { background: rgba(103,232,249,.06); border-color: rgba(103,232,249,.35); }
.gs-result-book { color: var(--gold-glow); font-size:.78rem; margin-bottom:.15rem; }
.gs-result-text { font-size:1.05rem; color:var(--text-pri); }
.gs-result-val { float:left; font-family:'Ubuntu Mono',monospace; color:var(--cyan-glow); direction:ltr; }
.gns-search-tabs { display:flex; gap:.5rem; direction:rtl; margin-bottom:.8rem; }
.gns-tab { flex:1; background: var(--bg2); border:1px solid var(--border); border-radius:8px;
  padding:.55rem; color: var(--text-sec); font-size:.9rem; cursor:pointer; transition: all .15s; }
.gns-tab:hover { border-color: rgba(201,168,76,.4); color:var(--text-pri); }
.gns-tab.on { background: linear-gradient(135deg, var(--gold), var(--gold-deep)); border-color: var(--gold); color:var(--ink); font-weight:700; }
.gns-row select { flex:1; background: var(--bg2); border:1px solid var(--border); border-radius:8px; padding:.6rem .8rem; color:var(--text-pri); font-size:1rem; }
.gns-clear-btn { background: transparent !important; border:1px solid var(--border) !important; color: var(--text-muted) !important; }
.gns-clear-btn:hover { border-color: rgba(255,255,255,.35) !important; color:var(--text-pri) !important; }
.gns-ch-stats { direction:rtl; display:flex; flex-wrap:wrap; gap:.4rem .9rem; align-items:center;
  color:var(--text-muted); font-size:.78rem; margin:-.3rem 0 .7rem; padding:.45rem .6rem;
  background: rgba(201,168,76,.05); border:1px solid rgba(201,168,76,.2); border-radius:8px; }
.gns-ch-stats b { color: var(--gold-glow); font-weight:600; }
.gns-ch-stats .num { font-family:'Ubuntu Mono',monospace; color:var(--amber-num); direction:ltr; unicode-bidi:isolate; }
/* ── الآية كاملة قابلة للنقر → صفحة إحصائياتها ── */
.gns-verse-block { cursor:pointer; }
.gns-verse-block:hover { background: rgba(103,232,249,.05); }
/* صفحة إحصائيات الآية تستخدم نفس فئات صفحة آية كتاب مرقوم (vdisplay/chip/gc/card) —
   وهذا السطر يمنحها نفس التدرج البني الدافئ بالضبط (نفس override المطبق على #pageQuran) */
html:not([data-theme="light"]) #gnsVersePage{--bg3:#1d1812;--bg4:#241d12;--bdr:#3a2f1e;--bdr2:#4a3c24}
/* توسيط بطاقات الأنظمة: الشبكة الأصلية .gg مصممة لـ11 نظامًا تملأ الصف في كتاب مرقوم —
   هنا الأنظمة قليلة فتتكدس على طرف. flex متوسّط، معزول داخل صفحة الآية العبرية فقط */
#gnsVersePage .gg{display:flex;flex-wrap:wrap;justify-content:center;gap:.55rem}
#gnsVersePage .gc{flex:0 1 170px;min-width:135px}
#gnsVersePage .vdtext.he{font-family:'Amiri',serif;font-size:clamp(1.4rem,3vw,2rem);direction:rtl}
#gnsVersePage .vdtext.grk{font-family:'Georgia',serif;font-size:clamp(1.2rem,2.6vw,1.7rem);direction:ltr;letter-spacing:.02em}
#pageGenesis .gns-verse-row.grk{direction:ltr}
#gnsVersePage .vd-ar{text-align:center;color:var(--txt2);font-size:1rem;line-height:1.9;direction:rtl;margin-bottom:.8rem}
.ecl-card { display:flex; align-items:center; gap:.9rem; background: var(--bg-card); border:1px solid var(--border); border-radius: var(--radius-lg); padding:.8rem 1.1rem; }
.ecl-icon { font-size:1.6rem; }
.ecl-info { flex:1; }
.ecl-info .et { font-weight:700; font-size:.95rem; }
.ecl-info .ed { font-family:'Ubuntu Mono',monospace; font-size:.85rem; color: var(--text-muted); margin-top:.15rem; }
.ecl-info .eh { font-family:'Amiri',serif; font-size:.9rem; color: var(--cyan); margin-top:.15rem; direction: rtl; unicode-bidi: isolate; }
.ecl-card.solar { border-right: 3px solid #fbbf24; }
.ecl-card.lunar { border-right: 3px solid #a78bfa; }
.ecl-band { font-size: .72rem; padding:.25rem .6rem; border-radius:12px; background: rgba(255,255,255,.06); color: var(--text-muted); white-space:nowrap; }

/* ── ENGLISH GEMATRIA PAGE ── */
.geo-container { max-width: 920px; margin: 0 auto; padding: 2rem 1.5rem 3rem; direction: ltr; }
.geo-input-row { display:flex; gap:.7rem; justify-content:center; flex-wrap:wrap; }
.geo-input {
  flex:1; min-width: 260px; max-width: 520px; background: var(--bg-input); border: 2px solid var(--gold-dim);
  border-radius: var(--radius); color: var(--text-pri); font-family: 'JetBrains Mono', monospace;
  font-size: 1.1rem; padding: .7rem 1rem; outline:none;
}
.geo-input:focus { border-color: var(--gold); }
.geo-result-card {
  padding: .5rem .3rem; text-align:center; cursor:default;
  position: relative; display:flex; flex-direction:column;
  align-items:center; gap:.2rem;
}
.geo-result-card .gl {
  font-size: .9rem; color: inherit; letter-spacing:.04em;
  margin-top:.15rem; line-height:1.2; font-weight:600;
}
/* number — large, colored, clickable — no box or border */
.geo-result-card .gv {
  font-family:'Ubuntu Mono',monospace; font-size:1.55rem; font-weight:700;
  cursor:pointer; line-height:1.2;
  transition: opacity .12s;
}
.geo-result-card .gv:hover { opacity:.7; }
/* inline letter table shown below the grid when a card is clicked */
.geo-inline-table-wrap {
  grid-column: 1 / -1; margin-top: .8rem;
  background: var(--bg-card); border: 1px solid var(--border-lit); border-radius: var(--radius-lg);
  padding: 1.1rem 1.4rem;
}
.geo-inline-table-title {
  font-size:.8rem; letter-spacing:.08em; text-transform:uppercase;
  margin-bottom: 1rem; text-align:center; font-weight:600;
}
.geo-lcard-grid { display:grid; grid-template-columns: repeat(auto-fill,minmax(50px,1fr)); gap:.2rem; }
.geo-lcard {
  background:var(--bg-input); border-radius: var(--radius);
  padding:.5rem .15rem; text-align:center; display:flex; flex-direction:column; align-items:center; gap:.4rem;
}
.geo-lcard.active { background: var(--bg-hover); }
.geo-lcard .gc { font-size:1.15rem; font-weight:700; line-height:1; }
.geo-lcard .gn {
  font-family:'Ubuntu Mono',monospace; font-size:1rem; color:var(--text-sec);
  cursor:pointer; padding:.1rem .35rem; border-radius:4px; transition: background .1s;
}
.geo-lcard .gn:hover { background: rgba(255,255,255,.1); color: var(--text-pri); }
.geo-breakdown { margin-top: 1.8rem; }
.geo-section-title { text-align:center; font-size:.85rem; letter-spacing:.1em; text-transform:uppercase; color: var(--text-muted); margin-bottom:.8rem; }
.geo-sys-tabs { display:flex; gap:.4rem; justify-content:center; flex-wrap:wrap; margin-bottom:.9rem; }
.geo-sys-tabs button {
  background:var(--bg-card); border:1px solid #2a3346; color: var(--text-pri); border-radius: var(--radius);
  padding:.35rem .8rem; font-size:.78rem; cursor:pointer; font-family:var(--font-main);
}
.geo-sys-tabs button.on { background: linear-gradient(135deg,#c9a84c,#9a6820); border-color:#c9a84c; color:#0a0c10; font-weight:700; }
.geo-bd .letters-strip { direction: ltr; }

/* duration row: 3-column layout */
.dc-duration-row {
  display: flex; gap: 1rem; margin-bottom: 1.5rem; flex-wrap: wrap;
  align-items: center; justify-content: center;
}
.dc-dur-ctrl { flex: 0 0 180px; }
.dc-dur-center { flex: 1; min-width: 280px; max-width: 420px; text-align: center; border: 1px solid var(--border); border-radius: var(--radius-lg); padding: 1rem 1.5rem; background: var(--bg-card); }
.dc-dur-vars { flex: 0 0 240px; min-width: 240px; text-align: center; }
@media(max-width:700px) {
  .dc-dur-ctrl, .dc-dur-vars { flex: 1 1 100%; }
}

.dc-ctrl-title {
  font-size: .82rem; font-weight: 700; letter-spacing: .08em;
  margin-bottom: .6rem;
}
.dc-dur-ctrl .dc-ctrl-title { color:var(--dcr-doy); }
.dc-dur-vars .dc-ctrl-title { color:var(--dcr-doy); text-align: center; }

.dc-chk {
  display: flex; align-items: center; gap: .4rem; font-size: .92rem; color: #ddd;
  cursor: pointer; margin-bottom: .2rem;
}
.dc-chk input { accent-color: var(--gold); cursor: pointer; }

.dc-from-to { font-size: .85rem; color:var(--text-pri); margin-bottom: .5rem; }
.dc-from-to strong { color: var(--gold-glow); }

.dc-main-duration {
  font-family: 'Ubuntu Mono', monospace;
  font-size: 1.05rem; font-weight: 700; line-height: 1.4;
  border: 1px solid var(--border-lit); border-radius: var(--radius);
  padding: .4rem .9rem; background: var(--bg-input);
  display: inline-block; white-space: nowrap; margin: .4rem auto; width: fit-content; text-align: center;
}
.dc-main-duration .dn { color:var(--dcr-doy); font-size: 1.3rem; cursor: pointer; }
.dc-main-duration .dn:hover { text-decoration: underline; opacity: .85; }
.dc-main-duration .du { color:var(--text-pri); font-weight: 400; font-size: .72rem; letter-spacing: .03em; }

/* variation list */
.dc-var-line { font-size: 1.05rem; margin-bottom: .3rem; line-height: 1.6; text-align: center; }
.dc-var-line .vn { font-family: 'Ubuntu Mono', monospace; font-weight: 700; font-size: 1.15rem; cursor: pointer; }
.dc-var-line .vn:hover { text-decoration: underline; opacity: .85; }
.dc-var-line .vu { color:var(--text-pri); }
/* color each variation differently */
.dc-var-line:nth-child(1) .vn { color:var(--dcr-doy); }
.dc-var-line:nth-child(2) .vn { color:var(--dcr-doy); }
.dc-var-line:nth-child(3) .vn { color:var(--dcr-doy); }
.dc-var-line:nth-child(4) .vn { color:var(--dcr-doy); }
.dc-var-line:nth-child(5) .vn { color:var(--dcr-doy); }
.dc-var-line:nth-child(6) .vn { color:var(--dcr-doy); }

.dc-section { margin-top: 1rem; }
.dc-section-head { font-size: 1.1rem; font-weight: 700; color:var(--dcr-doy); margin-bottom: .5rem; }

/* gematria table */
.dc-table {
  width: 100%; border-collapse: collapse;
  background: var(--bg-card); border-radius: var(--radius-lg); overflow: hidden;
}
.dc-table th {
  background: var(--bg-input); color: var(--text-muted); font-size: .75rem;
  padding: .5rem .6rem; text-align: center; border-bottom: 1px solid var(--border);
}
.dc-table td { padding: .6rem .7rem; border-bottom: 1px solid var(--border); font-size: .95rem; }
.dc-table td:nth-child(odd) { color: #ddd; text-align: right; }
.dc-table td:nth-child(even) { font-family: 'Ubuntu Mono', monospace; font-weight: 700; text-align: center; min-width: 60px; color:var(--dcr-default); font-size: 1.1rem; }
.dc-table tr:hover td { background: var(--bg-hover); }
.dc-table tr.dc-row-doy td:nth-child(even) { color:var(--dcr-doy); }
.dc-table tr.dc-row-product td:nth-child(even) { color:var(--dcr-product); }

/* ── OPTIONS SIDEBAR ── */
#pageDatecalc { position: relative; }
.dc-options-tab {
  display: none;
  position: fixed;
  right: 0;
  top: 160px;
  width: 32px;
  height: 110px;
  background: #1a6eb5;
  border: none;
  border-radius: 50% 0 0 50%;
  color:var(--text-pri);
  font-size: 1rem;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  z-index: 200;
  transition: background .15s;
  box-shadow: -3px 0 14px rgba(0,0,0,.5);
}
.dc-options-tab:hover { background: #2580d0; }

.dc-options-panel {
  position: fixed;
  right: -220px;
  top: 160px;
  transform: none;
  width: 200px;
  background: var(--bg-card);
  border: 1px solid var(--border-lit);
  border-radius: 10px 0 0 10px;
  padding: 1rem;
  z-index: 201;
  transition: right .25s ease;
  box-shadow: -4px 0 20px rgba(0,0,0,.4);
}
.dc-options-panel.open { right: 0; }
.dc-opt-title {
  font-size: .78rem;
  font-weight: 700;
  color:var(--dcr-doy);
  letter-spacing: .1em;
  margin-bottom: .8rem;
  display: flex;
  align-items: center;
  gap: .5rem;
}
.dc-opt-close {
  background: none; border: 1px solid var(--border); border-radius: 4px;
  color: var(--text-muted); width: 22px; height: 22px;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; font-size: .7rem;
}
.dc-opt-close:hover { color: var(--rose); border-color: var(--rose); }
.dc-opt-item {
  display: flex; align-items: center; gap: .5rem;
  font-size: .85rem; color: #ddd; cursor: pointer;
  margin-bottom: .5rem;
}
.dc-opt-item input { accent-color: var(--gold); cursor: pointer; }

/* +/- panel */
.dc-plusminus {
  padding: .6rem 0 .8rem;
  margin-bottom: 1rem;
  direction: ltr;
  text-align: center;
}
.dc-pm-title { display: none; }
.dc-pm-row {
  display: flex; flex-direction: row;
  align-items: center; justify-content: center; gap: 1.5rem;
}
.dc-pm-radios {
  display: flex; flex-direction: column; gap: .4rem; align-items: flex-start;
}
.dc-pm-radio { display: flex; align-items: center; gap: .4rem; font-size: .95rem; color: #ddd; cursor: pointer; }
.dc-pm-radio input[type=radio] {
  accent-color: var(--gold);
  width: 16px; height: 16px; cursor: pointer;
}
.dc-pm-fields { display: flex; gap: .8rem; flex-wrap: wrap; justify-content: center; }
.dc-pm-fields div { text-align: center; }
.dc-pm-fields label { display: block; font-size: .75rem; color: #bbb; margin-bottom: .25rem; }
.dc-pm-fields input {
  width: 75px; background: var(--bg-input); border: 1px solid var(--border);
  border-radius: 5px; color: var(--cyan); font-family: 'Ubuntu Mono', monospace;
  font-size: 1.05rem; font-weight: 700; text-align: center; padding: .45rem; outline: none;
}
.dc-pm-fields input:focus { border-color: var(--gold); }
footer {
  border-top: 1px solid var(--border);
  text-align: center;
  padding: 1.4rem;
  color: var(--text-muted);
  font-size: .72rem;
  font-family: 'Ubuntu Mono', monospace;
}

/* ===== QURAN PLATFORM CSS ===== */
#pageQuran .pg{display:none}
#pageQuran .pg.on{display:block}

*{box-sizing:border-box;margin:0;padding:0}
/* لون صناديق وحدة القرآن (المسار 2 — معزول داخل #pageQuran، لا يمسّ بقية التطبيق) */
html:not([data-theme="light"]) #pageQuran{--bg3:#1d1812;--bg4:#241d12;--bdr:#3a2f1e;--bdr2:#4a3c24}
.num-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(86px,1fr));gap:.5rem}
.num-card{cursor:pointer;text-align:center;padding:.6rem .3rem;border:2px solid #a87f2e;border-radius:.5rem;color:var(--text-pri);transition:all .2s;background:linear-gradient(135deg,#c9a84c,#7a5c1e)}
.num-card:hover{background:linear-gradient(135deg,#e8c96a,#c9a84c);border-color:#e8c96a;transform:translateY(-3px);box-shadow:0 6px 20px rgba(201,168,76,.5);filter:brightness(1.25)}
.num-card.on{background:linear-gradient(135deg,#ffe08a,#e8c96a);border-color:var(--text-pri);color:#1a1200;box-shadow:0 0 18px rgba(232,201,106,.7);filter:brightness(1.35)}
.num-card .nv{font-weight:700;font-size:1.05rem;display:block;color:var(--text-pri);}
.num-card .nc{font-size:.65rem;opacity:.9;display:block;margin-top:.15rem;color:var(--text-pri);}
.num-card.on .nv,.num-card.on .nc{color:#1a1200}
.num-hl{color:#f0b429;font-weight:bold;}
.num-card:hover{border-color:var(--bdr2,#4a3c24);transform:translateY(-2px)}
.num-card.on{background:#7c5a1e;border-color:#a87f2e;color:var(--text-pri);}
.num-card .nv{font-weight:700;font-size:1.05rem;display:block}
.num-card .nc{font-size:.65rem;opacity:.75;display:block;margin-top:.15rem}
/* حماية عناصر التحكم والرؤوس من اللون البنّي (ليست صناديق نتائج) */
#pageQuran input,#pageQuran select,#pageQuran .ssbar input,#pageQuran th,#pageQuran .pb,#pageQuran .cmp-toggle-btn,#pageQuran .st-sub{background:var(--bg3);border-color:var(--bdr)}
input[type="number"]{direction:ltr}
#pageQuran{background:transparent}

.hdr{background:linear-gradient(135deg,var(--bg2),var(--bg3));border-bottom:1px solid var(--bdr2);padding:1.2rem 2rem;text-align:center;position:sticky;top:0;z-index:100}
.hdr h1{font-family:'Amiri',serif;font-size:clamp(1.3rem,3vw,2rem);color:var(--gold2);text-shadow:0 0 30px rgba(201,168,76,.3)}
.hdr p{font-size:.8rem;color:var(--txt2);margin-top:.25rem}

.tabs{display:flex;background:var(--bg2);border-bottom:1px solid var(--bdr);overflow-x:auto;padding:0 .5rem;scrollbar-width:none}
.tabs::-webkit-scrollbar{display:none}
.tab{background:none;border:none;border-bottom:2px solid transparent;color:var(--txt2);font-family:var(--font-main);font-size:.8rem;font-weight:600;padding:.65rem .68rem;cursor:pointer;white-space:nowrap;transition:all .14s;flex-shrink:0}
.tab:hover{color:var(--txt)}
.tab.on{color:var(--gold2);border-bottom-color:var(--gold)}

.body{max-width:1300px;margin:0 auto;padding:1.2rem 1rem 4rem}
.pg{display:none}.pg.on{display:block}

input,select{background:var(--bg3);border:1px solid var(--bdr);border-radius:var(--r);color:var(--txt);font-family:var(--font-main);font-size:.9rem;padding:.55rem .9rem;outline:none;direction:rtl;transition:border-color .14s}
input:focus,select:focus{border-color:var(--gold)}
select{cursor:pointer}

.btn{background:var(--bg-card);border:1px solid #2a3346;border-radius:var(--r);color:var(--txt2);font-family:var(--font-main);font-size:.83rem;font-weight:600;padding:.55rem 1.1rem;cursor:pointer;transition:all .14s;white-space:nowrap}
.btn:hover{border-color:var(--bdr2);color:var(--txt)}
.btn.p{background:linear-gradient(135deg,var(--gold),#9a6820);border-color:var(--gold);color:#07091a;font-weight:700}
.btn.p:hover{opacity:.88}

.bar{display:flex;gap:.5rem;flex-wrap:wrap;align-items:center;margin-bottom:.9rem}
.srch-mode{display:flex;gap:.9rem;align-items:center;font-size:.78rem;color:var(--txt2);background:var(--bg3);border:1px solid var(--bdr);border-radius:var(--r);padding:.45rem .9rem}
.srch-mode label{display:flex;align-items:center;gap:.3rem;cursor:pointer;white-space:nowrap}
.srch-mode input[type=radio]{accent-color:var(--gold)}

.tw{overflow-x:auto;border:1px solid var(--bdr);border-radius:var(--r)}
.tw table{width:100%}
.tw th{font-size:.85rem;padding:.6rem .7rem}
.tw td{font-size:1.08rem;padding:.6rem .7rem}
table{width:auto;max-width:100%;border-collapse:collapse;direction:rtl}
th{background:var(--bg3);color:var(--txt3);font-size:.68rem;font-weight:700;padding:.48rem .65rem;text-align:right;border-bottom:1px solid var(--bdr);white-space:nowrap;letter-spacing:.06em}
td{padding:.5rem .65rem;border-bottom:1px solid var(--bdr);font-size:.9rem;color:var(--text-pri);vertical-align:middle}
tr:hover td{background:rgba(255,255,255,.02)}
tr:last-child td{border-bottom:none}
tr.cr{cursor:pointer}
.vt{font-family:'Amiri',serif;font-size:1.12rem;color:var(--text-pri);line-height:1.85}
.root-breakdown{background:var(--bg2);border:1px solid var(--gold-dim);border-radius:var(--r2);padding:1.3rem 1.5rem;margin-bottom:.9rem;text-align:center}
.rb-title{font-size:.75rem;color:var(--txt3);letter-spacing:.08em;margin-bottom:.6rem}
.rb-root{font-family:'Amiri',serif;font-size:2rem;font-weight:700;color:var(--gold-glow);margin-bottom:.7rem}
.rb-sentence{font-size:.92rem;color:var(--txt2);margin-bottom:.9rem}
.rb-sentence b{color:var(--cyan);font-family:'Ubuntu Mono',monospace}
.rb-list{display:inline-block;text-align:right}
.rb-line{color:var(--txt);line-height:2.1;font-family:'Amiri',serif;font-size:1.02rem}
.rb-line b{color:var(--cyan)}
.rb-gap{height:.7rem}
.mn{font-family:'Ubuntu Mono',monospace;font-weight:600;text-align:center}
.bdg{display:inline-block;padding:.12rem .5rem;border-radius:20px;font-size:.66rem;font-weight:700}
.bg{background:rgba(201,168,76,.12);color:var(--gold);border:1px solid rgba(201,168,76,.25)}
.bc{background:rgba(34,211,238,.1);color:var(--cyan);border:1px solid rgba(34,211,238,.22)}
.bv{background:rgba(167,139,250,.1);color:var(--violet);border:1px solid rgba(167,139,250,.22)}
.hl{background:rgba(201,168,76,.22);border-radius:3px;padding:0 2px}

.pager{display:flex;align-items:center;justify-content:center;gap:.3rem;margin-top:.9rem;flex-wrap:wrap}
.pb{background:var(--bg3);border:1px solid var(--bdr);border-radius:6px;color:var(--txt2);padding:.28rem .6rem;cursor:pointer;font-size:.78rem;transition:all .12s}
.pb:hover{border-color:var(--bdr2);color:var(--txt)}
.pb.on{background:var(--gold);border-color:var(--gold);color:#07091a;font-weight:700}
.pb:disabled{opacity:.3;cursor:default}

/* VERSE DISPLAY */
.vdisplay{background:linear-gradient(135deg,var(--bg3),var(--bg4));border:1px solid var(--bdr2);border-radius:var(--r2);padding:1.4rem 1.8rem;margin-bottom:1rem}
.vdtext{font-family:'Amiri',serif;font-size:clamp(1.2rem,2.5vw,1.6rem);color:var(--text-pri);line-height:2;text-align:center;margin-bottom:.8rem}
.qword{cursor:pointer;border-radius:6px;padding:.05rem .15rem;transition:background-color .12s,color .12s}
.qword:hover{background-color:var(--bg-accent, rgba(201,168,76,.18));color:var(--gold2,inherit)}
.vdref{text-align:center;margin-bottom:1rem}
.chips{display:flex;flex-wrap:wrap;gap:.45rem;justify-content:center}
.chip{background:var(--bg4);border:1px solid var(--bdr2);border-radius:var(--r);padding:.45rem .75rem;text-align:center;cursor:pointer;transition:all .14s;min-width:75px}
.chip:hover{border-color:var(--gold);transform:translateY(-1px)}
.chip.on{border-color:var(--cyan);background:rgba(34,211,238,.08)}
.chip .cl{font-size:.6rem;color:var(--txt3);margin-bottom:.18rem}
.chip .cv{font-family:'Ubuntu Mono',monospace;font-size:1.25rem;font-weight:700;color:var(--gold2)}
.chipx{display:none;background:rgba(34,211,238,.06);border:1px solid var(--bdr2);border-radius:var(--r2);padding:.9rem 1.2rem;margin-top:.4rem;animation:fi .14s ease}
.chipx.on{display:block}
@keyframes fi{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}
.xg{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:.5rem}
.xi{text-align:center;padding:.35rem}
.xi .xl{font-size:.62rem;color:var(--txt3);margin-bottom:.18rem}
.xi .xv{font-family:'Ubuntu Mono',monospace;font-size:.95rem;font-weight:700}

/* GEM CARDS */
.gg{display:grid;grid-template-columns:repeat(auto-fill,minmax(125px,1fr));gap:.55rem}
.gc{background:var(--bg3);border:1px solid var(--bdr);border-radius:var(--r);padding:.65rem .5rem;text-align:center;cursor:pointer;transition:border-color .14s,transform .1s;position:relative;overflow:hidden}
.gc::before{content:'';position:absolute;top:0;left:0;right:0;height:2px}
.gc.c0::before{background:var(--gold)}.gc.c1::before{background:var(--cyan)}
.gc.c2::before{background:var(--violet)}.gc.c3::before{background:var(--green)}
.gc.c4::before{background:var(--amber)}
.gc:hover{border-color:var(--bdr2);transform:translateY(-1px)}
.gc .gl{font-size:.6rem;color:var(--txt3);margin-bottom:.25rem}
.gc .gv{font-family:'Ubuntu Mono',monospace;font-size:1.35rem;font-weight:700}
.gc.c0 .gv{color:var(--gold2)}.gc.c1 .gv{color:var(--cyan)}
.gc.c2 .gv{color:var(--violet)}.gc.c3 .gv{color:var(--green)}.gc.c4 .gv{color:var(--amber)}
.gc .gd{font-size:.58rem;color:var(--txt3);margin-top:.12rem}

/* NUMERIC SEARCH */
.nshero{text-align:center;padding:1.5rem 1rem;border-bottom:1px solid var(--bdr);margin-bottom:1.2rem}
.nshero h2{font-size:1.1rem;font-weight:700;color:var(--gold2);margin-bottom:.25rem}
.nshero p{font-size:.8rem;color:var(--txt2)}
.nsbar{display:flex;gap:.5rem;justify-content:center;max-width:380px;margin:.8rem auto 0}
.nsgrp{border:1px solid var(--bdr);border-radius:var(--r2);overflow:hidden;margin-bottom:.9rem}
.nsgh{display:flex;align-items:center;justify-content:space-between;padding:.75rem 1.1rem;background:var(--bg3);cursor:pointer;transition:background .13s}
.nsgh:hover{background:var(--bg4)}
.nsgt{font-size:.98rem;font-weight:700;color:var(--gold2)}
.nsgc{font-family:'Ubuntu Mono',monospace;font-size:.88rem;color:var(--cyan)}
.nsgb{display:none;padding:.8rem 1.1rem;border-top:1px solid var(--bdr)}
.nsgb.on{display:block}
.nsvg{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:.45rem}
.nsvc{background:var(--bg3);border:1px solid var(--bdr);border-radius:var(--r);padding:.65rem .85rem;cursor:pointer;transition:border-color .12s}
.nsvc:hover{border-color:var(--cyan)}
.nsvc .nr{font-size:.85rem;color:#94a3b8;margin-bottom:.3rem}
.nsvc .nt{font-family:'Amiri',serif;font-size:1.18rem;color:var(--text-pri);line-height:1.7}
.wcgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:.5rem}
.wchip{background:var(--bg3);border:1px solid var(--bdr);border-radius:var(--r);padding:.55rem .7rem;text-align:center;cursor:pointer;transition:border-color .12s,transform .12s;font-family:'Amiri',serif;font-size:1.05rem;color:var(--text-pri);}
.wchip:hover{border-color:var(--gold2);transform:translateY(-1px)}
.wc-empty{font-size:.82rem;color:var(--txt3);text-align:center;padding:.6rem 0}

/* NUMBER PROFILE */
.npmain{text-align:center;padding:1.8rem 1rem 1.2rem}
.npnum{font-family:'Ubuntu Mono',monospace;font-size:5rem;font-weight:700;color:var(--gold2);line-height:1}
.npfact{font-size:.98rem;color:var(--txt2);margin-top:.35rem}
.nptags{display:flex;flex-wrap:wrap;justify-content:center;gap:.4rem;margin-top:.7rem}
.nptag{font-size:.85rem;font-weight:700;padding:.2rem .65rem;border-radius:20px;border:1px solid}
.npsg{display:flex;flex-wrap:nowrap;gap:.6rem;margin:1rem 0;overflow-x:auto}
.nps{background:var(--bg3);border:1px solid var(--bdr);border-radius:var(--r);padding:.75rem .9rem;text-align:center;flex:1;min-width:130px}
.npsl{font-size:.68rem;color:var(--txt3);margin-bottom:.3rem;white-space:nowrap}
.npsv{font-family:'Ubuntu Mono',monospace;font-size:1.35rem;font-weight:700;color:var(--cyan);line-height:1.2}
.npsv.npsv-sm{font-size:.88rem;font-family:var(--font-main);font-weight:600}
.npmr{display:flex;align-items:center;justify-content:space-between;padding:.45rem .65rem;border-bottom:1px solid var(--bdr)}
.npmr:last-child{border-bottom:none}
.npmrl{font-size:.8rem;color:var(--txt2)}
.npmrc{font-family:'Ubuntu Mono',monospace;font-size:.95rem;font-weight:700;color:var(--gold2)}
.npbar{height:3px;border-radius:2px;background:linear-gradient(90deg,var(--gold),transparent);margin-top:.25rem}

/* SURAH */
.sasg{display:grid;grid-template-columns:repeat(auto-fill,minmax(145px,1fr));gap:.55rem;margin-bottom:1rem}
.sas{background:var(--bg3);border:1px solid var(--bdr);border-radius:var(--r);padding:.7rem;text-align:center}
.sasl{font-size:.6rem;color:var(--txt3);margin-bottom:.22rem}
.sasv{font-family:'Ubuntu Mono',monospace;font-size:1.15rem;font-weight:700}
.mq-sasg .sasv{font-size:1.85rem}
.mq-sasg .sasl{font-size:.78rem;white-space:nowrap}
.chwrap{position:relative;height:260px}

/* COMPARE */
.cg2{display:grid;grid-template-columns:1fr 1fr;gap:.9rem;margin-bottom:1rem}
.mq-grid3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:1rem}
@media(max-width:900px){.mq-grid3{grid-template-columns:1fr !important}}
@media(max-width:700px){.mq-grid2{grid-template-columns:1fr !important}}
@media(max-width:600px){.cg2{grid-template-columns:1fr}}
table.ct th{font-size:.95rem;padding:.65rem .8rem}
table.ct td{font-size:1.2rem;padding:.65rem .8rem}
.ct td:first-child{color:var(--txt2);font-size:1.02rem;background:var(--bg3)}
.ctm{background:rgba(52,211,153,.07);color:var(--green)}
.cmp-toggle-row{display:flex;justify-content:center;margin:.7rem 0}
.cmp-toggle-btn{background:var(--bg3);border:1px solid var(--bdr);border-radius:20px;color:var(--txt2);padding:.4rem 1.1rem;font-size:.8rem;cursor:pointer;transition:all .15s}
.cmp-toggle-btn:hover{border-color:var(--gold);color:var(--gold-glow)}

/* CARD */
.card{background:var(--bg2);border:1px solid var(--bdr);border-radius:var(--r2);padding:1.2rem}
.card .ct{font-size:.68rem;font-weight:700;color:var(--txt3);letter-spacing:.1em;text-transform:uppercase;margin-bottom:.8rem}

.empty{text-align:center;padding:3rem;color:var(--txt3)}
.sep{height:1px;background:var(--bdr);margin:1.2rem 0}

/* MUSHAF STRUCTURE STATS */
.st-hero{text-align:center;padding:1.2rem 1rem .8rem;border-bottom:1px solid var(--bdr);margin-bottom:1rem}
.st-hero h2{font-size:1.05rem;font-weight:700;color:var(--gold2);margin-bottom:.2rem}
.st-hero p{font-size:.78rem;color:var(--txt2);max-width:520px;margin:0 auto}
/* ── Sura Statistics tab ── */
.ssbar{display:flex;gap:.6rem;flex-wrap:wrap;justify-content:flex-end;margin-bottom:1rem;direction:rtl}
.ssbar input{background:var(--bg3);border:1px solid var(--bdr);border-radius:var(--r);color:var(--txt1);font-family:var(--font-main);font-size:.88rem;padding:.55rem 1rem;outline:none;width:100%;max-width:380px}
.ssbar input:focus{border-color:var(--gold2)}
/* توهج حول الخانة المطابقة لبحث الرقم داخل جدول إحصائيات السور */
@keyframes ssGlowPulse{
  0%,100%{ box-shadow:0 0 0 2px var(--gold2), 0 0 10px 3px rgba(201,168,76,.55); }
  50%{ box-shadow:0 0 0 2px var(--gold2), 0 0 16px 6px rgba(201,168,76,.85); }
}
#ssTable tbody td.ss-glow{
  background:rgba(201,168,76,.14) !important;
  color:var(--gold2) !important;
  font-weight:700;
  border-radius:6px;
  animation:ssGlowPulse 1.4s ease-in-out infinite;
  position:relative;
  z-index:1;
}
/* spotlight card — single sura match */
.ss-spotlight{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:.55rem;
  margin-bottom:1.2rem;padding:1rem 1.2rem;
  background:var(--bg2);border:1px solid var(--bdr);border-radius:var(--r-lg);
}
.ss-sp-title{grid-column:1/-1;font-family:'Amiri',serif;font-size:1.3rem;color:var(--gold2);text-align:center;margin-bottom:.4rem}
.ss-sp-item{background:var(--bg3);border:1px solid var(--bdr);border-radius:var(--r);padding:.55rem .7rem;text-align:center}
.ss-sp-label{font-size:.65rem;color:var(--txt3);margin-bottom:.3rem}
.ss-sp-val{font-family:'Ubuntu Mono',monospace;font-size:1.15rem;font-weight:700;cursor:pointer;color:var(--gold2)}
.ss-sp-val:hover{opacity:.75}
#ssTable{width:100%;min-width:900px}
#ssTable thead th{background:var(--bg2);font-size:.68rem;color:var(--txt2);padding:.5rem .55rem;text-align:center;cursor:pointer;white-space:nowrap;border-bottom:1px solid var(--bdr);user-select:none;position:sticky;top:0;z-index:1}
#ssTable thead th:first-child{text-align:right;position:sticky;right:0;z-index:2;background:var(--bg2)}
#ssTable thead th:hover{color:var(--gold2)}
#ssTable thead th.sort-asc::after{content:' ▲';color:var(--gold2)}
#ssTable thead th.sort-desc::after{content:' ▼';color:var(--gold2)}
#ssTable tbody td{font-family:'Ubuntu Mono',monospace;font-size:.93rem;padding:.4rem .5rem;text-align:center;border-bottom:1px solid rgba(255,255,255,.04)}
#ssTable tbody td:first-child{font-family:'Amiri',serif;font-size:1.15rem;color:var(--gold2);text-align:right;position:sticky;right:0;background:var(--bg1);min-width:90px}
#ssTable tbody tr:hover td{background:var(--bghv)}
#ssTable tbody tr:hover td:first-child{background:var(--bghv)}
#ssTable .clk-n{cursor:pointer;text-decoration:underline dotted;text-underline-offset:2px}
#ssTable .clk-n:hover{color:var(--txt1)}
.st-summary{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:.55rem;margin:1rem 0 1.2rem}
#mqSummary{display:flex;justify-content:center;grid-template-columns:unset}
.st-sum{background:var(--bg3);border:1px solid var(--bdr);border-radius:var(--r);padding:.75rem .5rem;text-align:center}
.st-sum .sl{font-size:.6rem;color:var(--txt3);margin-bottom:.2rem}
.st-sum .sv{font-family:'Ubuntu Mono',monospace;font-size:1.35rem;font-weight:700;color:var(--gold2)}
.st-subtabs{display:flex;gap:.35rem;flex-wrap:wrap;margin-bottom:1rem}
.st-sub{background:var(--bg3);border:1px solid var(--bdr);border-radius:var(--r);color:var(--txt2);font-family:var(--font-main);font-size:.82rem;font-weight:600;padding:.45rem .95rem;cursor:pointer;transition:all .13s}
.st-sub:hover{border-color:var(--bdr2);color:var(--txt)}
.st-sub.on{color:var(--gold2);border-color:var(--gold);background:rgba(201,168,76,.06)}
.st-juz-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(155px,1fr));gap:.55rem}
.st-juz-card{background:var(--bg3);border:1px solid var(--bdr);border-radius:var(--r2);padding:.85rem .75rem;transition:border-color .13s}
.st-juz-card:hover{border-color:var(--bdr2)}
.st-juz-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:.45rem}
.st-juz-num{font-size:.72rem;color:var(--txt3)}
.st-juz-badge{font-size:.62rem;padding:.1rem .45rem;border-radius:12px;background:rgba(34,211,238,.1);color:var(--cyan);border:1px solid rgba(34,211,238,.2)}
.st-juz-count{font-family:'Ubuntu Mono',monospace;font-size:1.55rem;font-weight:700;color:var(--gold2);text-align:center;margin:.2rem 0}
.st-juz-meta{display:flex;justify-content:space-between;font-size:.68rem;color:var(--txt3);margin-top:.35rem}
.st-rank-cols{display:grid;grid-template-columns:1fr 1fr;gap:.9rem}
@media(max-width:700px){.st-rank-cols{grid-template-columns:1fr}}
.st-rank-list{background:var(--bg3);border:1px solid var(--bdr);border-radius:var(--r2);overflow:hidden}
.st-rank-title{font-size:.72rem;font-weight:700;color:var(--gold2);padding:.65rem .9rem;background:var(--bg4);border-bottom:1px solid var(--bdr)}
.st-rank-row{display:flex;align-items:center;justify-content:space-between;padding:.45rem .9rem;border-bottom:1px solid var(--bdr);font-size:.82rem}
.st-rank-row:last-child{border-bottom:none}
.st-rank-row:hover{background:rgba(255,255,255,.02)}
.st-hizb-filter{display:flex;gap:.5rem;flex-wrap:wrap;margin-bottom:.9rem;align-items:center}
.st-hizb-filter label{font-size:.78rem;color:var(--txt2)}
.st-qbar{display:flex;height:6px;border-radius:3px;overflow:hidden;margin-top:.35rem;gap:1px;background:var(--bg2)}
.st-qbar span{flex:1;min-width:2px}
.st-q1{background:var(--cyan)}.st-q2{background:var(--violet)}.st-q3{background:var(--green)}.st-q4{background:var(--amber)}
.clk-n{cursor:pointer;color:var(--cyan);transition:color .12s}
.clk-n:hover{color:var(--gold2);text-decoration:underline dotted}
.st-ns-hint{background:rgba(201,168,76,.06);border:1px solid rgba(201,168,76,.2);border-radius:var(--r2);padding:.85rem 1rem;margin-bottom:1rem;font-size:.82rem;color:var(--txt2)}
.st-ns-hint b{color:var(--gold2)}
.mq-clk:hover{color:var(--gold2)}
.mq-verses-panel{margin-top:1.2rem;display:none}
.mq-verses-head{font-family:var(--font-main);font-size:.9rem;color:var(--txt2);margin-bottom:.7rem}
.mq-verse-row{background:var(--bg3);border:1px solid var(--bdr);border-radius:var(--r2);padding:.75rem .95rem;margin-bottom:.55rem;cursor:pointer;transition:border-color .13s,background .13s;display:flex;flex-direction:column;gap:.35rem}
.mq-verse-row:hover{border-color:var(--gold2);background:var(--bg4)}
.mq-verse-ref{font-size:.72rem;color:var(--gold)}
.mq-verse-text{font-family:'Amiri',serif;font-size:1.4rem;color:var(--txt);line-height:1.95;direction:rtl}
.mq-verse-go{font-size:.7rem;color:var(--cyan);align-self:flex-start}



/* swapped date columns + alternating rows */
.dc-table td.dc-val { font-family:'Ubuntu Mono',monospace; font-weight:700; color:var(--dcr-default); text-align:right; }
.dc-table td.dc-expr { color:var(--text2); text-align:left; font-size:.8rem; }
.dc-table tr:nth-child(even) td { background:rgba(255,255,255,.03); }
.dc-table tr.dc-row-doy td.dc-val { color:var(--dcr-doy); }
.dc-table tr.dc-row-product td.dc-val { color:var(--dcr-product); }
/* alternating rows everywhere in results */
.np-nth-table tr:nth-child(even) td { background:rgba(255,255,255,.03); }
.history-table tbody tr:nth-child(even) td { background:rgba(255,255,255,.03); }

/* nth two-column flex layout */
.nth-flex { display: flex; justify-content: center; width: 420px; max-width: 96%; margin: 0 auto; }
.nth-col-labels { flex: 0 0 50%; display: flex; flex-direction: column; align-items: flex-end; padding-inline-end: .8rem; box-sizing: border-box; }
.nth-col-nums { flex: 0 0 50%; display: flex; flex-direction: column; align-items: flex-start; padding-inline-start: .8rem; box-sizing: border-box; }
.nth-row-l, .nth-row-n {
  height: 2.4rem; display: flex; align-items: center; padding: 0 .5rem;
  white-space: nowrap; box-sizing: border-box;
}
.nth-row-l {
  color: #67e8f9; font-size: 1rem; font-weight: 600;
  text-shadow: 0 0 8px rgba(103,232,249,.4);
  justify-content: flex-end;
}
.nth-row-n {
  font-family: 'Ubuntu Mono', monospace; font-weight: 700;
  font-size: 1.15rem; color: #39ff14;
  text-shadow: 0 0 6px rgba(176,96,12,.3);
}
/* أُزيل تظليل الصفوف الزوجية بطلب المستخدم — كان يجعل بعض الكلمات
   والأرقام تبدو محاطة بخلفية داكنة غير مرغوبة */

/* ── أرقام قابلة للنقر داخل لوحة خصائص الأعداد — اللون الافتراضي
   ("الباقي") يُستبدل بألوان أكثر تحديدًا داخل أقسام القواسم و π/φ ── */
.np-clk {
  cursor: pointer;
  color: #39ff14;
  border-bottom: 1px dashed rgba(176,96,12,.45);
  transition: color .12s, text-shadow .12s, border-color .12s;
}
.np-clk:hover {
  color: #d97b1a;
  text-shadow: 0 0 10px rgba(176,96,12,.65);
  border-bottom-color: #d97b1a;
}
.np-id-tag .np-clk { color: inherit; border-bottom: none; }
.np-id-tag .np-clk:hover { text-shadow: 0 0 10px currentColor; text-decoration: underline dotted currentColor; text-underline-offset: 3px; }

/* ── أقسام π و φ ── */
.np-const-sec {
  margin-top: 1.6rem;
  padding: 0 .2rem;
}
/* الإطار الخارجي أُزيل بطلب علي — الفصل البصري بين القسمين يكفيه العنوان الملوّن ورمز الثابت */
.np-const-head { display: flex; align-items: baseline; gap: .6rem; justify-content: center; margin-bottom: .9rem; }
.np-const-sym { font-size: 2.1rem; font-weight: 700; line-height: 1; font-family: 'Ubuntu Mono', monospace; }
.np-const-pi  .np-const-sym { color: #4dd0e1; text-shadow: 0 0 14px rgba(77,208,225,.55); }
.np-const-phi .np-const-sym { color: #ce93d8; text-shadow: 0 0 14px rgba(206,147,216,.55); }
.np-const-name { font-size: 1.05rem; color: var(--text-sec); letter-spacing: .04em; }
.np-const-grid { display: flex; gap: 1rem; flex-wrap: wrap; justify-content: center; }
.np-const-card {
  flex: 1 1 220px; max-width: 270px;
  background: rgba(255,255,255,.04);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .85rem .9rem;
  text-align: center;
}
.np-const-label { font-size: .95rem; color: #67e8f9; font-weight: 600; margin-bottom: .5rem; }
.np-const-pos { font-family: 'Ubuntu Mono', monospace; font-size: 1.2rem; color: var(--text-sec); margin-bottom: .45rem; }
.np-const-digits { font-family: 'Ubuntu Mono', monospace; font-size: 1.3rem; letter-spacing: .09em; color: var(--text-sec); word-break: break-all; }
.np-const-digits.big { font-size: 1.55rem; }
/* فئة π/φ — تشمل رقم الموضع والأرقام داخل الخانات، لون مستقل عن البقية */
.np-const-card .np-clk { color: #308080; border-bottom-color: rgba(48,128,128,.45); }
.np-const-card .np-clk:hover { color: #3fa6a6; text-shadow: 0 0 10px rgba(48,128,128,.65); border-bottom-color: #3fa6a6; }
.np-hit { color: #308080; font-weight: 700; text-shadow: 0 0 10px rgba(48,128,128,.5); }
.np-tail { color: var(--text-muted); }
.np-const-none { color: var(--text-muted); font-size: .92rem; }

/* date results: 2 pairs, each = expr column + value column, tight gap */
.dc-results { display: flex; justify-content: center; gap: 2.5rem; flex-wrap: wrap; background: var(--bg-hover); border-radius: 8px; padding: .5rem 1rem; }
.dc-pair { display: flex; gap: 0; }
.dc-col-e { display: flex; flex-direction: column; align-items: flex-start; direction: ltr; }
.dc-col-v { display: flex; flex-direction: column; align-items: flex-start; }
.dcr {
  padding: .5rem .8rem; white-space: nowrap; height: 2.5rem;
  display: flex; align-items: center; box-sizing: border-box;
}
.dcr-e { color: var(--text-sec); font-family: 'Ubuntu Mono', monospace; font-size: 1rem; text-align: left; }
.dcr-v {
  font-family: 'Ubuntu Mono', monospace; font-weight: 700;
  color: var(--dcr-default); min-width: 70px; justify-content: flex-start;
  font-size: 1.25rem; cursor: pointer;
  text-shadow: 0 0 6px rgba(255,215,64,.3);
}
.dcr-v:hover { text-decoration: underline; opacity: .85; }
.dcr-v.dc-row-doy { color: var(--dcr-doy); text-shadow: 0 0 6px rgba(0,229,255,.35); }
.dcr-v.dc-row-product { color: var(--dcr-product); text-shadow: 0 0 6px rgba(105,240,174,.35); font-size: 1.35rem; }

/* word subtotal in breakdown (Gematrinator-style) */
.word-subtotal {
  display: inline-flex; align-items: center; justify-content: center;
  margin: 0 .35rem; padding: .2rem .55rem;
  background: rgba(0,230,118,.1); border: 1px solid rgba(0,230,118,.35);
  border-radius: 8px; align-self: center;
}
.word-subtotal .ws-val {
  font-family: 'Ubuntu Mono', monospace; font-weight: 700;
  font-size: 1.1rem; color: #00e676;
}

/* custom group buttons */
.qbtn-sep { display: inline-block; width: 1px; height: 22px; background: var(--border); margin: 0 .35rem; vertical-align: middle; }
.qbtn.add:hover { border-color: var(--gold); color: var(--gold-glow); }
.qbtn.custom { background: #1a1408; border: 1px solid var(--gold-dim); color: var(--gold); display: inline-flex; align-items: center; gap: .4rem; }
.qbtn.custom:hover { background: #241a0c; border-color: var(--gold); }
.qbtn.custom .del-x { background: rgba(248,113,113,.15); border: 1px solid rgba(248,113,113,.4); color: #f87171; border-radius: 50%; width: 16px; height: 16px; display: inline-flex; align-items: center; justify-content: center; font-size: .7rem; cursor: pointer; line-height: 1; padding: 0; }
.qbtn.custom .del-x:hover { background: rgba(248,113,113,.3); }

/* ── BIRTH CARD ── */
.bc-container { max-width: 1100px; margin: 0 auto; padding: 1.5rem 1rem 3rem; }
.bc-title { text-align: center; font-family: 'Amiri', serif; font-size: clamp(1.5rem,3vw,2rem); color: var(--gold-glow); margin-bottom: .3rem; }
.bc-sub { text-align: center; color: var(--text-sec); font-size: .85rem; margin-bottom: 1.5rem; }
.bc-input-row { display: flex; gap: 1rem; justify-content: center; margin-bottom: 1.5rem; flex-wrap: wrap; }
.bc-field { display: flex; flex-direction: column; gap: .35rem; }
.bc-field label { font-size: .78rem; color: var(--text-sec); }
.bc-field input, .bc-field select {
  background:var(--bg-card); border: 1px solid var(--border); border-radius: 8px;
  color: var(--text-pri); font-family:var(--font-main); font-size: .95rem;
  padding: .55rem .9rem; outline: none; min-width: 160px;
}
.bc-field input:focus, .bc-field select:focus { border-color: var(--gold); }

/* Result panel */
.bc-result-panel {
  background: none;
  border: none;
  padding: 0; margin-bottom: 0; text-align: center;
}
.bc-result-label { font-size: .85rem; color: var(--text-sec); margin-bottom: .8rem; letter-spacing: .08em; }
.bc-card-name { font-size: 1rem; color: var(--gold); margin-top: 1rem; }
/* ── PLAYING CARD SVG ── */
.bc-card-svg {
  width: 175px;
  margin: 0 auto;
  filter: drop-shadow(0 8px 24px rgba(0,0,0,.55));
}
.bc-card-svg svg { width: 100%; height: auto; display: block; border-radius: 9px; }




/* Birth Card Table */
.bc-table-title { text-align: center; font-size: 1rem; color: var(--gold); margin: 1.5rem 0 .8rem; }
.bc-table-wrap { overflow-x: auto; border: 1px solid var(--border); border-radius: 10px; background: var(--bg-hover); width: fit-content; max-width: 100%; margin: 0 auto; }
.bc-table { border-collapse: collapse; margin: 0; font-family: 'Ubuntu Mono', monospace; }
.bc-table th, .bc-table td {
  border: 1px solid var(--border); padding: .5rem .55rem;
  text-align: center; font-size: 1.2rem; min-width: 56px;
  background:var(--bg-card); font-weight: 700;
}
.bc-table td:not(.bc-empty):not(:first-child) { cursor: pointer; transition: outline .1s, background .1s; }
.bc-table td:not(.bc-empty):not(:first-child):hover { outline: 2px solid var(--gold); outline-offset: -2px; position: relative; z-index: 2; }
.bc-table tbody tr:hover td:not(.bc-highlight) { background: rgba(201,168,76,.14); }
.bc-table:has(td[data-col="0"]:hover) td[data-col="0"]:not(.bc-highlight), .bc-table:has(td[data-col="0"]:hover) th[data-col="0"] { background: rgba(201,168,76,.14); }
.bc-table:has(td[data-col="1"]:hover) td[data-col="1"]:not(.bc-highlight), .bc-table:has(td[data-col="1"]:hover) th[data-col="1"] { background: rgba(201,168,76,.14); }
.bc-table:has(td[data-col="2"]:hover) td[data-col="2"]:not(.bc-highlight), .bc-table:has(td[data-col="2"]:hover) th[data-col="2"] { background: rgba(201,168,76,.14); }
.bc-table:has(td[data-col="3"]:hover) td[data-col="3"]:not(.bc-highlight), .bc-table:has(td[data-col="3"]:hover) th[data-col="3"] { background: rgba(201,168,76,.14); }
.bc-table:has(td[data-col="4"]:hover) td[data-col="4"]:not(.bc-highlight), .bc-table:has(td[data-col="4"]:hover) th[data-col="4"] { background: rgba(201,168,76,.14); }
.bc-table:has(td[data-col="5"]:hover) td[data-col="5"]:not(.bc-highlight), .bc-table:has(td[data-col="5"]:hover) th[data-col="5"] { background: rgba(201,168,76,.14); }
.bc-table:has(td[data-col="6"]:hover) td[data-col="6"]:not(.bc-highlight), .bc-table:has(td[data-col="6"]:hover) th[data-col="6"] { background: rgba(201,168,76,.14); }
.bc-table:has(td[data-col="7"]:hover) td[data-col="7"]:not(.bc-highlight), .bc-table:has(td[data-col="7"]:hover) th[data-col="7"] { background: rgba(201,168,76,.14); }
.bc-table:has(td[data-col="8"]:hover) td[data-col="8"]:not(.bc-highlight), .bc-table:has(td[data-col="8"]:hover) th[data-col="8"] { background: rgba(201,168,76,.14); }
.bc-table:has(td[data-col="9"]:hover) td[data-col="9"]:not(.bc-highlight), .bc-table:has(td[data-col="9"]:hover) th[data-col="9"] { background: rgba(201,168,76,.14); }
.bc-table:has(td[data-col="10"]:hover) td[data-col="10"]:not(.bc-highlight), .bc-table:has(td[data-col="10"]:hover) th[data-col="10"] { background: rgba(201,168,76,.14); }
.bc-table:has(td[data-col="11"]:hover) td[data-col="11"]:not(.bc-highlight), .bc-table:has(td[data-col="11"]:hover) th[data-col="11"] { background: rgba(201,168,76,.14); }
.bc-table th {
  background: var(--bg-hover); color: var(--gold); font-weight: 700;
  font-family:var(--font-main); font-size: .78rem;
}
.bc-table th:first-child, .bc-table td:first-child {
  background: var(--bg-hover); color: var(--gold); font-weight: 700;
}
.bc-table td.bc-red { color: #ff5252; }
.bc-table td.bc-blk { color: var(--text-pri); }
.bc-table td.bc-empty { background:var(--bg-card); color: var(--border); }
.bc-table td.bc-highlight {
  background: linear-gradient(135deg, var(--gold), #9a6820) !important;
  color: #000 !important; font-weight: 800;
  box-shadow: 0 0 16px rgba(201,168,76,.6);
}

/* card info beside card */
.bc-result-flex { display: flex; align-items: center; justify-content: center; gap: 2.5rem; flex-wrap: wrap; }
.bc-result-card { display: flex; flex-direction: column; align-items: center; }
.bc-info { text-align: right; min-width: 240px; }
.bc-info-name { font-size: 1.3rem; font-weight: 700; color: var(--gold-glow); margin-bottom: 1rem; font-family:var(--font-main); }
.bc-info-rows { display: flex; flex-direction: column; gap: .5rem; }
.bc-info-row { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; padding: .45rem .8rem; background: var(--bg-hover); border-radius: 8px; }
.bc-il { font-size: .9rem; color: var(--text-sec); font-family:var(--font-main); }
.bc-iv { font-family: 'Ubuntu Mono', monospace; font-weight: 700; font-size: 1.3rem; }

/* ── Birthcard two-column layout ── */
.bc-twocol {
  display: grid;
  grid-template-columns: 200px 1fr;
  gap: 1.5rem;
  align-items: start;
  margin-top: .5rem;
}
.bc-left-col { position: sticky; top: 1rem; }
.bc-right-col { min-width: 0; }
@media (max-width: 700px) {
  .bc-twocol { grid-template-columns: 130px 1fr; gap: .8rem; }
  .bc-left-col { position: sticky; top: .5rem; }
}
@media (max-width: 400px) {
  .bc-twocol { grid-template-columns: 110px 1fr; gap: .6rem; }
}
/* Card image - clean white card, no dark wrapper */
.bc-result-panel { padding: 0; background: none; border: none; margin: 0; }
.bc-card-svg { width: 100%; max-width: 220px; margin: 0 auto; }
.bc-card-svg svg { width: 100%; height: auto; border-radius: 10px;
  box-shadow: 0 4px 20px rgba(0,0,0,.45); display: block; }
.bc-card-img { width: 100%; height: auto; display: block; border-radius: 8px;
  box-shadow: 0 4px 20px rgba(0,0,0,.4); }
.bc-card-svg-fb { width: 100%; }
.bc-card-svg-fb svg { width: 100%; height: auto; border-radius: 8px; display: block; }
.bc-result-flex { flex-direction: column; align-items: stretch; gap: 1rem; }
.bc-result-card { width: 100%; }
.bc-info { min-width: unset; width: 100%; text-align: right; }
.bc-result-label { text-align: center; margin-bottom: .8rem; font-size: .85rem; }

/* ── PERIODIC TABLE ── */
.pt-container { max-width: 1200px; margin: 0 auto; padding: 1.5rem 1rem 3rem; }
.pt-title { text-align: center; font-family: 'Amiri', serif; font-size: clamp(1.5rem,3vw,2rem); color: var(--gold-glow); margin-bottom: .3rem; }
.pt-sub { text-align: center; color: var(--text-sec); font-size: .85rem; margin-bottom: 1.2rem; }
.pt-legend { display: flex; flex-wrap: wrap; gap: .5rem; justify-content: center; margin-bottom: 1.2rem; }

/* TAROT */
/* ── Tarot two-column layout ── */
.tarot-twocol {
  display: grid;
  grid-template-columns: 260px 1fr;
  gap: 1.5rem;
  align-items: start;
  margin-top: 1rem;
}
.tarot-left-col { position: sticky; top: 1rem; }
.tarot-right-col { min-width: 0; }
@media (max-width: 700px) {
  .tarot-twocol { grid-template-columns: 1fr; }
  .tarot-left-col { position: static; }
  .tarot-grid { grid-template-columns: repeat(3, 1fr); }
}
.tarot-detail-placeholder {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  min-height: 360px; border: 1px dashed var(--border); border-radius: var(--radius-lg);
  text-align: center; padding: 2rem;
}
/* Tarot card image - full column width */
#tarotDetail .tarot-detail-img { width: 100%; max-width: 260px; margin: 0 auto 1rem; display: block; }
#tarotDetail .tarot-detail-img svg,
#tarotDetail .tarot-detail-img img { width: 100%; height: auto; border-radius: 10px;
  box-shadow: 0 8px 32px rgba(0,0,0,.55); }
.tarot-grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: .7rem; margin-bottom: 1.3rem; }
.tarot-cell {
  background: linear-gradient(160deg, #1a1330, #0c0f1f); border: 1px solid var(--gold-dim); border-radius: 10px;
  padding: .7rem .4rem; cursor: pointer; text-align: center; transition: transform .12s, box-shadow .12s, border-color .12s;
  display: flex; flex-direction: column; align-items: center; gap: .35rem; aspect-ratio: 3/4.4;
}
html[data-theme="light"] .tarot-cell { background: linear-gradient(160deg, #efe9db, #e6dfc9); }
.tarot-cell:hover { transform: translateY(-4px); border-color: var(--gold-glow); box-shadow: 0 8px 20px rgba(201,168,76,.25); }
.tarot-cell .tc-num { font-family: 'Ubuntu Mono', monospace; font-size: .65rem; color: var(--gold-glow); }
.tarot-cell .tc-icon { font-size: 1.9rem; line-height: 1; }
.tarot-cell .tc-img { width: 100%; flex: 1; min-height: 0; object-fit: cover; border-radius: 6px; background: rgba(255,255,255,.04); }
.tarot-cell .tc-name { font-size: .68rem; color: var(--text-sec); line-height: 1.3; }
.tarot-cell.major { background: linear-gradient(160deg, #2a1a3a, #0c0f1f); }
html[data-theme="light"] .tarot-cell.major { background: linear-gradient(160deg, #e6dfc9, #ddd4b8); }
.tarot-cell.fire { border-color: #c2410c66; }
.tarot-cell.water { border-color: #0369a166; }
.tarot-cell.air { border-color: #57534e66; }
.tarot-cell.earth { border-color: #15803d66; }

.tarot-card-display {
  width: 100%; background: none; border: none;
  border-radius: 0; padding: 0; display: flex; flex-direction: column; gap: 1rem;
}
.tarot-card-big {
  width: 100%; height: auto; min-height: 200px; border-radius: 12px; flex-shrink: 0;
  background: #fff; border: 2px solid var(--gold);
  display: flex; flex-direction: column; align-items: center; justify-content: space-between;
  padding: 1rem; box-shadow: 0 12px 30px rgba(0,0,0,.5);
}
/* Medicine card override */
.med-card-visual {
  width: 200px; flex-shrink: 0;
  border-radius: 14px;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  padding: 1.5rem 1rem;
  box-shadow: 0 8px 30px rgba(0,0,0,.6);
  aspect-ratio: 2/3;
}
.tarot-card-big .tcb-num { font-family: 'Ubuntu Mono', monospace; color: var(--gold); font-size: .85rem; align-self: flex-start; background:var(--gold); color:var(--text-pri); padding:.15rem .5rem; border-radius:4px; }
.tarot-card-big .tcb-icon { font-size: 8rem; line-height: 1; color: #1a1a1a; }
.tarot-card-big .tcb-img { width: 100%; height: auto; object-fit: contain; border-radius: 8px; display: block; }
.tarot-card-big .tcb-name-ar { font-family: 'Amiri', serif; font-size: 1.2rem; color: #1a1a1a; text-align: center; font-weight: 700; }
.tarot-card-big .tcb-name-en { font-size: .78rem; color: #555; text-align: center; }
.tarot-info { flex: 1; min-width: 0; width: 100%; }
.tarot-info h3 { font-family: 'Amiri', serif; color: var(--gold-glow); font-size: 1.5rem; margin-bottom: .2rem; }
.tarot-info .ti-en { color: var(--text-sec); font-size: .95rem; margin-bottom: .9rem; }
.tarot-info .ti-row { display: flex; gap: .6rem; margin-bottom: .55rem; font-size: .88rem; }
.tarot-info .ti-label { color: var(--gold); min-width: 90px; font-weight: 600; }
.tarot-info .ti-meaning { background: rgba(255,255,255,.04); border-radius: 10px; padding: .8rem 1rem; margin-top: .8rem; line-height: 1.8; font-family: 'Amiri', serif; font-size: 1.05rem; }
.tarot-about { max-width: 800px; margin: 0 auto 1.4rem; background: rgba(255,255,255,.03); border: 1px solid var(--gold-dim); border-radius: 14px; padding: 1.3rem 1.5rem; line-height: 1.9; color: var(--text-sec); font-size: .92rem; }
.tarot-about h4 { color: var(--gold-glow); font-family: 'Amiri', serif; font-size: 1.15rem; margin: 1.1rem 0 .5rem; }
.tarot-about p { margin-bottom: .6rem; }
.tarot-about ul { margin: .4rem 0 .6rem 0; padding-right: 1.3rem; }
.tarot-about li { margin-bottom: .3rem; }
.tarot-about b { color: var(--text-pri); }
.tarot-about table th, .tarot-about table td { font-size: .85rem; }
.pt-leg-item { display: flex; align-items: center; gap: .35rem; font-size: .72rem; color: var(--text-sec); }
.pt-leg-swatch { width: 14px; height: 14px; border-radius: 3px; }
.pt-grid-wrap { overflow-x: auto; padding-bottom: .5rem; direction: ltr; }
.pt-grid {
  display: grid;
  direction: ltr;
  grid-template-columns: repeat(18, minmax(44px, 1fr));
  grid-auto-rows: 52px;
  gap: 3px;
  min-width: 850px;
  margin: 0 auto;
}
.pt-cell {
  border-radius: 5px; padding: 0; cursor: pointer; overflow: hidden;
  display: flex; flex-direction: column; justify-content: center; align-items: stretch;
  transition: transform .1s, box-shadow .1s; position: relative;
  border: 1px solid rgba(0,0,0,.2);
}
.pt-cell:hover { transform: scale(1.12); z-index: 5; box-shadow: 0 4px 16px rgba(0,0,0,.5); }
.pt-cell .pt-sym { flex: 1; display: flex; align-items: center; justify-content: center; font-size: 1.15rem; font-weight: 700; line-height: 1; text-align: center; }
.pt-cell .pt-num { font-size: .62rem; line-height: 1.6; font-family: 'Ubuntu Mono', monospace; font-weight: 700; text-align: center; }
.pt-cell.dim { opacity: .25; }
.pt-cell.pt-hit { outline: 3px solid var(--gold-glow); outline-offset: -2px; z-index: 6; box-shadow: 0 0 12px rgba(201,168,76,.6); }
/* category colors removed — now computed inline via ptColorFor() to match RSC reference shades */
/* Detail panel */
.pt-detail-panel {
  background: var(--bg-card);
  border: 1px solid var(--gold-dim); border-radius: 14px;
  padding: 1.5rem 1.5rem 1.5rem 2.5rem; margin-top: 1.5rem;
  box-shadow: 0 0 30px rgba(201,168,76,.1);
  position: relative;
}
.pt-dp-head { display: flex; align-items: center; gap: 1.2rem; margin-bottom: 1.2rem; flex-wrap: wrap; }
.pt-dp-big {
  width: 100px; height: 100px; border-radius: 12px;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.pt-dp-big .b-num { font-size: 1.05rem; font-weight: 700; font-family: 'Ubuntu Mono', monospace; }
.pt-dp-big .b-sym { font-size: 2.6rem; font-weight: 700; line-height: 1; }
.pt-dp-big .b-mass { font-size: .8rem; font-weight: 600; font-family: 'Ubuntu Mono', monospace; }
.pt-dp-names h3 { font-size: 1.6rem; color: var(--gold-glow); font-family: 'Amiri', serif; margin-bottom: .2rem; }
.pt-dp-names .en { font-size: 1rem; color: var(--text-sec); }
.pt-dp-img-wrap { flex-shrink: 0; display: flex; flex-direction: column; align-items: center; gap: .35rem; }
.pt-dp-img-link { display: block; width: 110px; height: 110px; border-radius: 12px; overflow: hidden; border: 1px solid var(--gold-dim); background:var(--bg-card); }
.pt-dp-img-link svg, .pt-dp-img-link img { width: 100%; height: 100%; display: block; object-fit: cover; }
.pt-dp-img-online { font-size: .65rem; color: var(--text-sec); text-decoration: none; border-bottom: 1px dashed var(--gold-dim); }
.pt-dp-img-online:hover { color: var(--gold-glow); border-color: var(--gold-glow); }
.pt-dp-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: .6rem;
}
.pt-dp-item { background: var(--bg-hover); border-radius: 8px; padding: .6rem .9rem; }
.pt-dp-label { font-size: .72rem; color: var(--gold); margin-bottom: .25rem; font-weight: 600; }
.pt-dp-value { font-size: 1.05rem; color: var(--text-pri); font-weight: 700; }
.pt-dp-value.mono { font-family: 'Ubuntu Mono', monospace; color: var(--cyan); direction: ltr; unicode-bidi: embed; text-align: right; }
.pt-dp-text { background: var(--bg-hover); border-radius: 8px; padding: .7rem .9rem; margin-top: .6rem; }
.pt-dp-text-body { font-size: .9rem; line-height: 1.6; color: var(--text-pri); text-align: left; }
.az-date-wrap{
  position:relative; display:flex; align-items:center;
  background:var(--bg-input); border:1px solid var(--border);
  border-radius:var(--radius); cursor:pointer;
  transition:border-color .14s;
}
.az-date-wrap:hover,.az-date-wrap:focus-within{border-color:var(--gold)}
.az-date-icon{padding:.5rem .5rem .5rem .8rem;font-size:1rem;pointer-events:none;flex-shrink:0}
.az-dt-inp{
  flex:1; background:transparent!important; border:none!important;
  outline:none!important; cursor:pointer; padding:.5rem .8rem .5rem .2rem;
  color:var(--text-pri); font-family:var(--font-main); font-size:.9rem;
  color-scheme:var(--color-scheme, dark);
}
/* Make the entire input area clickable on all browsers */
.az-dt-inp::-webkit-calendar-picker-indicator{
  position:absolute; left:0; top:0; width:100%; height:100%;
  opacity:0; cursor:pointer;
}
.az-inp{color-scheme:var(--color-scheme, dark)}
/* ── Sajda (Prostration) Tab ── */
.sajda-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:1rem;margin-top:.5rem}
.sajda-card{background:var(--bg2);border:1px solid var(--bdr);border-radius:12px;padding:1.1rem 1.2rem;cursor:default;transition:border-color .15s}
.sajda-card:hover{border-color:var(--gold2)}
.sajda-card-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:.7rem;gap:.6rem}
.sajda-card-num{background:linear-gradient(135deg,#c9a84c,#9a6820);color:#0a0c10;font-family:'Ubuntu Mono',monospace;font-weight:700;font-size:.85rem;border-radius:6px;padding:.25rem .6rem;flex-shrink:0}
.sajda-card-sura{font-size:1rem;font-weight:700;color:var(--gold2);font-family:'Amiri',serif}
.sajda-card-ayaref{font-size:.72rem;color:var(--txt3);font-family:var(--font-main)}
.sajda-card-madhab{display:flex;gap:.3rem;flex-wrap:wrap;margin-bottom:.6rem}
.sajda-badge.khilaf{background:rgba(91,184,232,.08);color:#5bb8e8;border:1px solid rgba(91,184,232,.25);font-size:.66rem;padding:.15rem .5rem;border-radius:4px;font-weight:600}
.sajda-verse{font-family:'Amiri',serif;font-size:1.15rem;line-height:2;color:var(--txt1);direction:rtl;text-align:right;border-right:3px solid var(--gold-dim);padding-right:.8rem;margin:.5rem 0;cursor:pointer;transition:border-color .15s,color .15s}
.sajda-verse:hover{border-color:var(--gold2);color:var(--gold-glow)}
.sajda-verse-ref{font-size:.7rem;color:var(--txt3);margin-top:.15rem;font-family:var(--font-main)}
.sajda-stats-row{display:flex;gap:.5rem;flex-wrap:wrap;margin-top:.65rem;padding-top:.65rem;border-top:1px solid var(--bdr)}
.sajda-stat{background:rgba(255,255,255,.04);border-radius:6px;padding:.3rem .6rem;font-size:.72rem;text-align:center;flex:1;min-width:70px}
.sajda-stat-lbl{color:var(--txt3);margin-bottom:.15rem}
.sajda-stat-val{color:var(--gold2);font-family:'Ubuntu Mono',monospace;font-weight:700;font-size:.88rem}
.sajda-goto{display:inline-flex;align-items:center;gap:.3rem;font-size:.72rem;color:var(--violet);cursor:pointer;margin-top:.5rem;border:1px solid rgba(155,124,219,.3);border-radius:5px;padding:.2rem .55rem;transition:background .12s}
.sajda-goto:hover{background:rgba(155,124,219,.15)}
.sajda-empty{text-align:center;color:var(--txt3);padding:3rem 1rem;font-size:.9rem}
.sajda-summary-note{background:rgba(201,168,76,.07);border:1px solid rgba(201,168,76,.2);border-radius:8px;padding:.7rem 1rem;font-size:.78rem;color:var(--txt2);text-align:center;margin-bottom:1rem;line-height:1.7}

/* ═══════════════════════════════════════
   ASTRO / ZODIAC EXPLORER STYLES
═══════════════════════════════════════ */
.az-wrap{max-width:1100px;margin:0 auto;padding:.8rem 1rem 2rem}
.az-header{text-align:center;padding:1.2rem 1rem .6rem;border-bottom:1px solid var(--border)}
.az-header-title{display:flex;flex-direction:column;align-items:center;gap:.2rem}
.az-header-en{font-family:var(--font-main);font-size:1.3rem;font-weight:700;color:var(--gold-glow);letter-spacing:.04em}
.az-header-ar{font-family:'Amiri',serif;font-size:1.1rem;color:var(--gold);direction:rtl}
.az-header-sub{font-size:.75rem;color:var(--text-sec);margin-top:.4rem}
.az-ar{font-size:.8rem;color:var(--text-sec);margin-right:.25rem}

.az-input-panel{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:1.1rem 1.2rem;margin:1rem 0}
.az-input-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:.7rem;margin-bottom:.9rem}
.az-field label{display:block;font-size:.72rem;color:var(--text-muted);margin-bottom:.3rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase}
.az-inp{width:100%;background:var(--bg-input);border:1px solid var(--border);border-radius:var(--radius);color:var(--text-pri);font-family:var(--font-main);font-size:.88rem;padding:.5rem .8rem;outline:none;transition:border-color .14s}
.az-inp:focus{border-color:var(--gold)}
.az-inp option{background:var(--bg-input)}
.az-btn-row{display:flex;gap:.6rem;flex-wrap:wrap}
.az-btn-primary{background:linear-gradient(135deg,#c9a84c,#9a6820);border:1px solid #c9a84c;border-radius:var(--radius);color:#0a0c10;font-family:var(--font-main);font-size:.88rem;font-weight:700;padding:.5rem 1.3rem;cursor:pointer;transition:all .14s}
.az-btn-primary:hover{background:linear-gradient(135deg,#d9bb63,#ad7a2a);box-shadow:0 0 10px rgba(201,168,76,.35)}
.az-btn-sec{background:var(--bg-hover);border:1px solid var(--border-lit);border-radius:var(--radius);color:var(--text-pri);font-family:var(--font-main);font-size:.85rem;padding:.5rem 1rem;cursor:pointer;transition:all .14s}
.az-btn-sec:hover{border-color:var(--gold);color:var(--gold)}
/* ── Astro date spinner ── */
.az-dt-row{display:flex;align-items:flex-end;gap:.5rem;flex-wrap:wrap;margin-bottom:.7rem}
.az-spin-sep{color:var(--border-lit);font-size:1.4rem;padding:0 .1rem;align-self:center;padding-bottom:.5rem}
.az-spin-group{display:flex;flex-direction:column;align-items:center;gap:.2rem}
.az-spin-lbl{font-size:.68rem;color:var(--text-muted);font-weight:700;letter-spacing:.06em;text-transform:uppercase}
.az-spin-box{display:flex;flex-direction:column;align-items:center;gap:1px}
.az-spin-btn{background:var(--bg-hover);border:1px solid var(--border-lit);border-radius:4px;color:var(--gold);font-size:.75rem;width:2rem;height:1.3rem;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .12s;padding:0;line-height:1}
.az-spin-btn:hover{background:var(--bg-card);border-color:var(--gold)}
.az-spin-inp{width:2.8rem;text-align:center;background:var(--bg-input);border:1px solid var(--border-lit);border-radius:5px;color:var(--text-pri);font-family:'JetBrains Mono',monospace;font-size:.92rem;font-weight:700;padding:.28rem .1rem;-moz-appearance:textfield}
.az-spin-inp::-webkit-outer-spin-button,.az-spin-inp::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.az-spin-inp:focus{outline:none;border-color:var(--gold)}
.az-spin-year{width:3.8rem}
.az-spin-tz{height:2.05rem;font-size:.8rem;padding:.1rem .3rem;background:var(--bg-input);border:1px solid var(--border-lit);border-radius:5px;color:var(--text-pri);cursor:pointer}
.az-hijri-bar{font-size:.8rem;color:var(--gold);background:var(--bg-hover);border-radius:5px;padding:.3rem .7rem;margin-bottom:.7rem;direction:rtl;text-align:right}
.az-loc-row{margin-bottom:.6rem}
.az-btn-xs{background:var(--bg-hover);border:1px solid var(--border);border-radius:5px;color:var(--text-sec);font-family:var(--font-main);font-size:.72rem;padding:.2rem .55rem;cursor:pointer;transition:all .1s}
.az-btn-xs:hover{border-color:var(--gold-dim);color:var(--gold)}

.az-timeline{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:.7rem 1rem;margin-bottom:.8rem}
.az-tl-label{font-size:.7rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.07em;margin-bottom:.5rem}
.az-tl-controls{display:flex;align-items:center;flex-wrap:wrap;gap:.35rem;justify-content:center}
.az-tl-btn{background:var(--bg-hover);border:1px solid var(--border);border-radius:5px;color:var(--text-sec);font-size:.75rem;padding:.25rem .6rem;cursor:pointer;transition:all .1s}
.az-tl-btn:hover{background:var(--bg-deep);border-color:var(--gold-dim);color:var(--gold)}
.az-tl-now{font-family:'Ubuntu Mono',monospace;font-size:.82rem;color:var(--gold-glow);padding:0 .5rem;min-width:200px;text-align:center}

.az-main{display:grid;grid-template-columns:auto 1fr;gap:1.2rem;align-items:start;margin-top:.5rem}
@media(max-width:760px){.az-main{grid-template-columns:1fr}}

.az-wheel-section{display:flex;flex-direction:column;align-items:center;gap:.7rem}
.az-wheel-wrap{position:relative;cursor:grab;user-select:none;border-radius:50%;touch-action:none}
.az-wheel-wrap:active{cursor:grabbing}
.az-wheel-canvas{border-radius:50%;display:block;max-width:100%}
.az-wheel-controls{display:flex;align-items:center;gap:.6rem;margin-right:auto;flex-wrap:wrap}
.az-wc-toggle{display:flex;align-items:center;gap:.3rem;font-size:.72rem;color:var(--text-sec);cursor:pointer}
.az-wc-toggle input{accent-color:var(--gold);width:13px;height:13px;cursor:pointer}
.az-wc-btn{background:var(--bg-hover);border:1px solid var(--border-lit);border-radius:4px;color:var(--text-sec);font-size:.72rem;padding:.2rem .5rem;cursor:pointer;transition:all .12s}
.az-wc-btn:hover{border-color:var(--gold);color:var(--gold)}
.az-wheel-tooltip{position:absolute;pointer-events:none;background:rgba(10,12,18,.95);border:1px solid var(--gold);border-radius:7px;padding:.5rem .8rem;font-size:.78rem;color:var(--text-pri);white-space:nowrap;z-index:10;max-width:200px;transform:translate(-50%,-115%)}
.az-planet-card{background:var(--bg-card);border:1px solid var(--border-lit);border-radius:var(--radius-lg);padding:.9rem 1.1rem;min-width:220px;max-width:280px}
.az-aspect-legend{display:flex;flex-wrap:wrap;gap:.35rem .7rem;justify-content:center;max-width:320px;padding:.4rem 0}
.az-asp-item{display:flex;align-items:center;gap:.3rem;font-size:.68rem;color:var(--text-sec)}
.az-asp-line{width:22px;height:2px;border-radius:1px}
.az-pc-name{font-size:1.1rem;font-weight:700;color:var(--gold-glow);margin-bottom:.5rem;display:flex;align-items:center;gap:.5rem}
.az-pc-row{display:flex;justify-content:space-between;font-size:.82rem;padding:.2rem 0;border-bottom:1px solid rgba(255,255,255,.04)}
.az-pc-lbl{color:var(--text-muted)}
.az-pc-val{color:var(--text-pri);font-family:'Ubuntu Mono',monospace}

.az-table-section{min-width:0}
.az-section-title{font-size:.78rem;font-weight:700;color:var(--gold);text-transform:uppercase;letter-spacing:.08em;margin-bottom:.7rem;display:flex;align-items:center;gap:.6rem;flex-wrap:wrap}
.az-tbl-btns{display:flex;gap:.35rem;margin-right:auto}
.az-tbl-wrap{overflow-x:auto;border:1px solid var(--border);border-radius:var(--radius)}
.az-tbl{width:100%;border-collapse:collapse;font-size:.8rem}
.az-tbl th{background:var(--bg-hover);color:var(--gold);font-size:.68rem;text-transform:uppercase;letter-spacing:.03em;padding:.45rem .4rem;text-align:left;border-bottom:1px solid var(--border);white-space:nowrap;cursor:pointer}
.az-tbl th:hover{color:var(--gold-glow)}
.az-tbl td{padding:.42rem .4rem;border-bottom:1px solid rgba(255,255,255,.04);color:var(--text-pri);white-space:nowrap;transition:background .1s}
.az-tbl tr:hover td{background:var(--bg-hover)}
.az-tbl td.az-sym{font-size:1rem;text-align:center;padding:.42rem .3rem;width:1.8rem}
.az-tbl td.az-lon{font-family:'Ubuntu Mono',monospace;color:var(--cyan)}
.az-tbl td.az-sign{color:var(--gold-glow);font-weight:600}
.az-tbl td.az-elem-fire{color:var(--danger)}
.az-tbl td.az-elem-earth{color:#6ab88a}
.az-tbl td.az-elem-air{color:#5bb8e8}
.az-tbl td.az-elem-water{color:#9b7cdb}

.az-bar-row{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:.6rem .9rem;margin-bottom:.4rem}
.az-bar-header{display:flex;align-items:center;gap:.5rem;margin-bottom:.35rem;font-size:.8rem}
.az-bar-sym{font-size:1rem;width:1.2rem;text-align:center}
.az-bar-name{color:var(--text-sec);width:70px}
.az-bar-sign{color:var(--gold2);font-weight:600;width:90px}
.az-bar-deg{font-family:'Ubuntu Mono',monospace;color:var(--cyan);font-size:.75rem;margin-right:auto}
.az-bar-track{background:rgba(255,255,255,.07);border-radius:3px;height:8px;flex:1;position:relative;overflow:hidden}
.az-bar-fill{height:100%;border-radius:3px;position:absolute;left:0;top:0;transition:width .4s}
.az-bar-planet-marker{position:absolute;top:-3px;width:14px;height:14px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.6rem;transform:translateX(-50%);pointer-events:none}


.az-finder-section{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:1rem 1.2rem;margin-top:1rem}
.az-finder-row{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;margin-bottom:.8rem}
.az-finder-range{display:flex;gap:.5rem;align-items:center;flex-wrap:wrap;font-size:.8rem;color:var(--text-sec)}
.az-finder-results{max-height:300px;overflow-y:auto}
.az-finder-period{background:var(--bg-hover);border:1px solid var(--border);border-radius:6px;padding:.45rem .8rem;margin:.3rem 0;font-size:.82rem;display:flex;gap:.8rem;align-items:center}
.az-finder-period .az-fp-n{color:var(--text-muted);font-size:.7rem;min-width:20px}
.az-finder-period .az-fp-d{color:var(--text-pri);font-family:'Ubuntu Mono',monospace}
.az-finder-period .az-fp-dur{color:var(--gold-dim);font-size:.75rem}
/* ══════════════════════════════════════
   INFO BAR (top strip)
══════════════════════════════════════ */
.info-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: .35rem 2rem;
  background:var(--bg-card);
  border-bottom: 1px solid rgba(201,168,76,.12);
  font-family: 'Ubuntu Mono', monospace;
  font-size: .68rem;
  letter-spacing: .1em;
  color: var(--gold-dim);
  direction: rtl;
}
.info-bar a { color: var(--gold-dim); text-decoration: none; }
.info-bar a:hover { color: var(--gold); }
.info-bar-left, .info-bar-right { display: flex; align-items: center; gap: 1.4rem; }

/* ══════════════════════════════════════
   NAV — redesigned wider layout
══════════════════════════════════════ */
.top-nav {
  justify-content: space-between !important;
  padding: .55rem 2rem !important;
  background:var(--bg-card) !important;
  border-bottom: 1px solid rgba(201,168,76,.18) !important;
}
.nav-right-group {
  display: flex;
  align-items: center;
  gap: .4rem;
}
.nav-left-group {
  display: flex;
  align-items: center;
  gap: .4rem;
}

/* ══════════════════════════════════════
   HOME PAGE LAYOUT
══════════════════════════════════════ */
.home-wrap {
  min-height: 100vh;
  min-height: 100dvh;
}

/* ── Hero Banner ── */
.home-hero {
  position: relative;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 2rem;
  text-align: center;
  overflow: hidden;
  border-bottom: 1px solid var(--border);
  box-sizing: border-box;
}
.home-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 80% 70% at 50% -5%, rgba(201,168,76,.11) 0%, transparent 65%),
    radial-gradient(circle at 10% 80%, rgba(155,124,219,.06) 0%, transparent 50%),
    radial-gradient(circle at 90% 80%, rgba(78,205,196,.05) 0%, transparent 50%);
  pointer-events: none;
}
.home-hero-eyebrow {
  font-family: 'Ubuntu Mono', monospace;
  font-size: .65rem;
  letter-spacing: .28em;
  color: var(--gold-dim);
  text-transform: uppercase;
  margin-bottom: 1.2rem;
}
.home-hero-title {
  font-family: 'Amiri', serif;
  font-size: clamp(6rem, 14vw, 10.5rem);
  font-weight: 700;
  line-height: 1;
  color: #f3dfa3;
  text-shadow:
    0 0 60px rgba(201,168,76,.45),
    0 0 120px rgba(201,168,76,.2),
    0 2px 4px rgba(0,0,0,.6);
  letter-spacing: .1em;
  margin-bottom: 0;
  position: relative;
}
.home-hero-sub {
  font-family:var(--font-main);
  font-size: clamp(.9rem, 1.8vw, 1.1rem);
  color: var(--text-sec);
  max-width: 560px;
  margin: 0 auto 2rem;
  line-height: 1.9;
}
.home-hero-deco {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.2rem;
  margin: 1rem 0 1.8rem;
}
.home-hero-deco .hdeco-line {
  width: 80px;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(201,168,76,.4));
}
.home-hero-deco .hdeco-line.r {
  background: linear-gradient(90deg, rgba(201,168,76,.4), transparent);
}
.home-hero-deco .hdeco-sym {
  color: var(--gold-dim);
  font-size: 1.1rem;
  letter-spacing: .15em;
}
.home-hero-stats {
  display: flex;
  justify-content: center;
  gap: 1rem;
  flex-wrap: wrap;
  margin-top: 1.8rem;
}
.home-stat {
  display: flex;
  align-items: center;
  gap: .45rem;
  background: rgba(201,168,76,.06);
  border: 1px solid rgba(201,168,76,.18);
  border-radius: 20px;
  padding: .35rem .85rem;
}
.home-stat::after { display: none; }
.home-stat .hs-n {
  font-family: 'Ubuntu Mono', monospace;
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--gold);
  line-height: 1;
}
.home-stat .hs-l {
  font-family:var(--font-main);
  font-size: .72rem;
  letter-spacing: .03em;
  color: var(--text-sec);
  margin-top: 0;
}
.home-hero-cta {
  display: inline-flex;
  align-items: center;
  gap: .6rem;
  margin-top: 2.5rem;
  padding: .85rem 2.4rem;
  background: linear-gradient(135deg, #c9a84c 0%, #9a6820 60%, #7a5010 100%);
  border: 1px solid rgba(201,168,76,.5);
  border-radius: 6px;
  color: #0a0c10;
  font-family: 'Amiri', serif;
  font-size: 1.1rem;
  font-weight: 700;
  cursor: pointer;
  transition: all .18s;
  box-shadow: 0 4px 20px rgba(201,168,76,.2), inset 0 1px 0 rgba(255,255,255,.15);
  letter-spacing: .03em;
}
.home-hero-cta:hover {
  background: linear-gradient(135deg, #d9bb63 0%, #b07a30 60%, #8a6020 100%);
  box-shadow: 0 6px 28px rgba(201,168,76,.35), inset 0 1px 0 rgba(255,255,255,.2);
  transform: translateY(-2px);
  border-color: rgba(201,168,76,.7);
}

/* ── Section header ── */
.home-section {
  max-width: 1200px;
  margin: 0 auto;
  padding: 3rem 2rem;
}
.home-section-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 2rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid var(--border);
}
.home-section-title {
  font-family: 'Amiri', serif;
  font-size: 1.7rem;
  color: var(--gold-glow);
  display: flex;
  align-items: center;
  gap: .6rem;
}
.home-section-title .sec-icon {
  font-size: 1.1rem;
  opacity: .7;
}
.home-section-link {
  font-family:var(--font-main);
  font-size: .8rem;
  color: var(--gold-dim);
  background: none;
  border: 1px solid var(--border-lit);
  border-radius: 20px;
  padding: .3rem .9rem;
  cursor: pointer;
  transition: all .14s;
}
.home-section-link:hover {
  color: var(--gold);
  border-color: var(--gold-dim);
  background: rgba(201,168,76,.06);
}

/* ── Featured grid (3 cols) ── */
.home-featured-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.2rem;
}
.feat-card {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 12px;
  overflow: hidden;
  cursor: pointer;
  transition: all .18s;
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 0;
}
.feat-card:hover {
  border-color: var(--gold-dim);
  transform: translateY(-2px);
  box-shadow: 0 6px 24px rgba(0,0,0,.35), 0 0 0 1px rgba(201,168,76,.1);
}
.feat-card-img {
  width: 80px;
  min-width: 80px;
  height: 80px;
  background: transparent;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 2rem;
  position: relative;
  overflow: hidden;
  border-radius: 0;
  border-left: 1px solid rgba(255,255,255,.04);
  aspect-ratio: unset;
}
.feat-card-img::after { display: none; }
.feat-card-img-bg {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 4rem;
  opacity: .06;
  color: var(--gold);
}
.feat-card-img-icon {
  font-size: 2.4rem;
  position: relative;
  z-index: 1;
  filter: drop-shadow(0 2px 8px rgba(0,0,0,.4));
}
.feat-card-tag {
  position: absolute;
  bottom: .3rem;
  right: .3rem;
  z-index: 2;
  font-family: 'Ubuntu Mono', monospace;
  font-size: .5rem;
  letter-spacing: .08em;
  color: #0a0c10;
  background: var(--gold);
  border-radius: 3px;
  padding: .12rem .35rem;
  text-transform: uppercase;
}
.feat-card-body {
  padding: .75rem 1rem;
  flex: 1;
  display: flex;
  flex-direction: column;
}
.feat-card-title {
  font-family: 'Amiri', serif;
  font-size: 1.15rem;
  font-weight: 700;
  color: var(--gold);
  margin-bottom: .5rem;
  line-height: 1.4;
  letter-spacing: .02em;
}
.feat-card-desc {
  font-family:var(--font-main);
  font-size: .8rem;
  color: var(--text-sec);
  line-height: 1.7;
  flex: 1;
}
.feat-card-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: .9rem;
  padding-top: .7rem;
  border-top: 1px solid var(--border);
}
.feat-card-meta {
  font-family: 'JetBrains Mono', monospace;
  font-size: .65rem;
  color: var(--text-sec);
  letter-spacing: .06em;
}
.feat-card-arrow {
  font-size: .9rem;
  color: var(--gold-dim);
  transition: transform .14s;
}
.feat-card:hover .feat-card-arrow { transform: translateX(-4px); color: var(--gold); }

/* ── Tools quick-launch grid ── */
.home-tools-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1rem;
}
.tool-tile {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 1.4rem 1rem 1.2rem;
  text-align: center;
  cursor: pointer;
  transition: all .16s;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .6rem;
}
.tool-tile:hover {
  border-color: var(--border-lit);
  background: var(--bg-hover);
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(0,0,0,.35);
}
.tool-tile-icon {
  font-size: 2rem;
  line-height: 1;
}
.tool-tile-name {
  font-family: 'Amiri', serif;
  font-size: .98rem;
  font-weight: 700;
  color: var(--text-pri);
  line-height: 1.3;
  letter-spacing: .01em;
}
.tool-tile-sub {
  font-family: 'Ubuntu Mono', monospace;
  font-size: .55rem;
  letter-spacing: .12em;
  color: var(--text-muted);
  text-transform: uppercase;
}
.tool-tile.accent-gold   { border-color: rgba(201,168,76,.35); background: linear-gradient(160deg,#0f0c02,#0d0b01); }
.tool-tile.accent-cyan   { border-color: rgba(78,205,196,.3);  background: linear-gradient(160deg,#020f0e,#020c0b); }
.tool-tile.accent-violet { border-color: rgba(155,124,219,.3); background: linear-gradient(160deg,#0a0812,#08060f); }
.tool-tile.accent-rose   { border-color: rgba(224,92,122,.3);  background: linear-gradient(160deg,#110508,#0d0406); }
.tool-tile.accent-sage   { border-color: rgba(106,184,138,.3); background: linear-gradient(160deg,#030f07,#020c05); }
.tool-tile.accent-amber  { border-color: rgba(232,159,78,.3);  background: linear-gradient(160deg,#0f0901,#0c0701); }

.tool-tile.accent-gold:hover   { border-color: rgba(201,168,76,.7);  box-shadow: 0 6px 24px rgba(201,168,76,.15); }
.tool-tile.accent-cyan:hover   { border-color: rgba(78,205,196,.6);  box-shadow: 0 6px 24px rgba(78,205,196,.12); }
.tool-tile.accent-violet:hover { border-color: rgba(155,124,219,.6); box-shadow: 0 6px 24px rgba(155,124,219,.12); }
.tool-tile.accent-rose:hover   { border-color: rgba(224,92,122,.6);  box-shadow: 0 6px 24px rgba(224,92,122,.12); }
.tool-tile.accent-sage:hover   { border-color: rgba(106,184,138,.6); box-shadow: 0 6px 24px rgba(106,184,138,.12); }
.tool-tile.accent-amber:hover  { border-color: rgba(232,159,78,.6);  box-shadow: 0 6px 24px rgba(232,159,78,.12); }

.tool-tile.accent-gold .tool-tile-name   { color: #e8c96a; }
.tool-tile.accent-cyan .tool-tile-name   { color: #6ecfc9; }
.tool-tile.accent-violet .tool-tile-name { color: #b89ee8; }
.tool-tile.accent-rose .tool-tile-name   { color: #e87a97; }
.tool-tile.accent-sage .tool-tile-name   { color: #7bc49a; }
.tool-tile.accent-amber .tool-tile-name  { color: #e8b05a; }

/* ── Quran highlight banner ── */
.home-quran-banner {
  background: linear-gradient(135deg, #0d1020 0%, #111825 50%, #0d1020 100%);
  border: 1px solid rgba(201,168,76,.2);
  border-radius: var(--radius-lg);
  padding: 2.5rem 3rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 2rem;
  margin: 0 2rem;
  max-width: 1200px;
  margin: 0 auto 3rem;
  position: relative;
  overflow: hidden;
}
/* .home-quran-banner::before removed */
.hqb-text { flex: 1; }
.hqb-eyebrow {
  font-family: 'Ubuntu Mono', monospace;
  font-size: .62rem;
  letter-spacing: .2em;
  color: var(--gold-dim);
  text-transform: uppercase;
  margin-bottom: .6rem;
}
.hqb-title {
  font-family: 'Amiri', serif;
  font-size: 1.5rem;
  color: var(--gold-glow);
  margin-bottom: .4rem;
}
.hqb-desc {
  font-family:var(--font-main);
  font-size: .82rem;
  color: var(--text-sec);
  line-height: 1.8;
  max-width: 420px;
}
.hqb-verse {
  font-family: 'Amiri', serif;
  font-size: 1.3rem;
  color: #d4b97a;
  text-align: center;
  line-height: 2.2;
  direction: rtl;
  padding: 1rem 1.5rem;
  border-right: 2px solid rgba(201,168,76,.3);
}
.hqb-btn {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  margin-top: 1rem;
  padding: .55rem 1.4rem;
  background: none;
  border: 1px solid rgba(201,168,76,.4);
  border-radius: 20px;
  color: var(--gold);
  font-family:var(--font-main);
  font-size: .82rem;
  cursor: pointer;
  transition: all .15s;
}
.hqb-btn:hover {
  background: rgba(201,168,76,.08);
  border-color: var(--gold);
}

/* ── Home footer strip ── */
.home-footer-strip {
  border-top: 1px solid var(--border);
  padding: 1.5rem 2rem;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  font-family: 'Ubuntu Mono', monospace;
  font-size: .62rem;
  letter-spacing: .12em;
  color: var(--text-muted);
  opacity: .5;
}
.home-footer-strip .hfs-dot {
  width: 3px; height: 3px;
  background: var(--gold-dim);
  border-radius: 50%;
}

/* ── Responsive ── */
@media (max-width: 900px) {
  .home-featured-grid { grid-template-columns: 1fr 1fr; }
  .home-tools-grid { grid-template-columns: repeat(2, 1fr); }
  .home-quran-banner { flex-direction: column; }
  .hqb-verse { border-right: none; border-top: 1px solid rgba(201,168,76,.2); padding-top: 1rem; }
}
@media (max-width: 600px) {
  .home-featured-grid { grid-template-columns: 1fr; }
  .home-tools-grid { grid-template-columns: repeat(2, 1fr); }
  .info-bar { display: none; }
  .home-hero { padding: 3rem 1.2rem 2.5rem; }
  .home-hero-stats { gap: 1.5rem; }
}

/* ══════════════════════════════════════
   HOME FULL FOOTER
══════════════════════════════════════ */
.home-full-footer {
  background:var(--bg-card);
  border-top: 1px solid var(--border);
  padding: 3rem 2rem 1.5rem;
  direction: rtl;
}
.hff-inner {
  max-width: 1200px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1.8fr 1fr 1fr 1fr;
  gap: 2.5rem;
  padding-bottom: 2.5rem;
  border-bottom: 1px solid var(--border);
}
.hff-brand-col { padding-left: 1rem; }
.hff-brand {
  font-family: 'Amiri', serif;
  font-size: 2rem;
  font-weight: 700;
  background: linear-gradient(135deg, #f3dfa3, #c9a84c 55%, #9a6820);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  line-height: 1;
  margin-bottom: .2rem;
}
.hff-brand-en {
  font-family: 'Ubuntu Mono', monospace;
  font-size: .6rem;
  letter-spacing: .3em;
  color: var(--gold-dim);
  margin-bottom: 1rem;
}
.hff-brand-desc {
  font-family:var(--font-main);
  font-size: .78rem;
  color: var(--text-sec);
  line-height: 1.8;
  max-width: 280px;
}
.hff-col-title {
  font-family: 'Ubuntu Mono', monospace;
  font-size: .62rem;
  letter-spacing: .2em;
  color: var(--gold-dim);
  text-transform: uppercase;
  margin-bottom: 1rem;
  padding-bottom: .5rem;
  border-bottom: 1px solid var(--border);
}
.hff-link {
  display: block;
  background: none;
  border: none;
  color: var(--text-sec);
  font-family:var(--font-main);
  font-size: .82rem;
  text-align: right;
  padding: .3rem 0;
  cursor: pointer;
  transition: color .13s;
  width: 100%;
}
.hff-link:hover { color: var(--gold); }
.hff-bottom {
  max-width: 1200px;
  margin: 1.5rem auto 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .8rem;
  font-family: 'Ubuntu Mono', monospace;
  font-size: .6rem;
  letter-spacing: .1em;
  color: var(--text-muted);
  opacity: .45;
}
.hff-dot-sep { opacity: .4; }

/* brand-raqim hover when clickable */
.brand-raqim:hover {
  opacity: .8;
}

@media (max-width: 900px) {
  .hff-inner { grid-template-columns: 1fr 1fr; gap: 2rem; }
  .hff-brand-col { grid-column: 1 / -1; }
}
@media (max-width: 600px) {
  .hff-inner { grid-template-columns: 1fr 1fr; gap: 1.5rem; }
}

/* ── ENGLISH HISTORY (LTR override) ── */
/* ── English History: full LTR override ── */
#geoHistorySection .history-header {
  direction: ltr;
  flex-direction: row;
}
#geoHistorySection .history-table {
  direction: ltr;
}
/* all th/td: center */
#geoHistorySection .history-table th,
#geoHistorySection .history-table td {
  text-align: center;
}
/* first-child = Phrase: sticky left */
#geoHistorySection .history-table th:first-child,
#geoHistorySection .history-table td:first-child {
  text-align: left;
  min-width: 90px;
  position: sticky;
  left: 0;
  right: auto;
  border-right: 1px solid var(--border);
  border-left: none;
  background: var(--bg-input);
  font-family: 'JetBrains Mono', monospace;
  font-size: .9rem;
  font-weight: 700;
  color: var(--gold);
}
#geoHistorySection .history-table td:first-child {
  background: var(--bg-card);
  font-family: 'JetBrains Mono', monospace;
  font-size: .9rem;
  font-weight: 700;
  color: var(--gold);
}
#geoHistorySection .history-table tr:hover td:first-child {
  background: var(--bg-hover);
}
/* last-child = X button: no sticky needed */
#geoHistorySection .history-table th:last-child,
#geoHistorySection .history-table td:last-child {
  text-align: center;
  position: static;
  border-left: 1px solid var(--border);
  border-right: none;
  min-width: auto;
  background: transparent;
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
  color: inherit;
}
#geoHistorySection .history-table td:last-child {
  background: transparent;
}
#geoHistorySection .search-banner {
  direction: ltr;
}

/* ── English Match Results table (LTR) ── */
#geoMatchSection .history-table {
  direction: ltr;
}
#geoMatchSection .history-table th,
#geoMatchSection .history-table td {
  text-align: center;
}
#geoMatchSection .history-table th:first-child,
#geoMatchSection .history-table td:first-child {
  text-align: left;
  min-width: 90px;
  position: sticky;
  left: 0;
  right: auto;
  border-right: 1px solid var(--border);
  border-left: none;
  background: var(--bg-input);
  font-family: 'JetBrains Mono', monospace;
  font-size: .9rem;
  font-weight: 700;
  color: var(--gold);
}
#geoMatchSection .history-table td:first-child {
  background: var(--bg-card);
}
#geoMatchSection .history-table tr:hover td:first-child {
  background: var(--bg-hover);
}

/* ══════════════════════════════════════
   ENGLISH GEMATRIA — Gematrinator-inspired styling
   Applied ONLY to #pageGematriaEN
══════════════════════════════════════ */

/* Import Lato font for English page */
@import url('https://fonts.googleapis.com/css2?family=Lato:wght@300;400;700;900&family=Montserrat:wght@600;700&display=swap');

/* Page background */
#pageGematriaEN {
  background:var(--bg-card);
  font-family: 'Lato', 'Ubuntu Mono', sans-serif;
}

/* Header override for EN page */
#pageGematriaEN header h1 {
  font-family: 'Montserrat', sans-serif;
  font-weight: 700;
  font-size: clamp(1.6rem, 3vw, 2.2rem);
  letter-spacing: .12em;
  color: #8cfaf3;
  text-shadow: 0 0 30px rgba(140,250,243,.25);
}

/* Container */
#pageGematriaEN .geo-container {
  font-family: 'Lato', sans-serif;
}

/* Toolbar */
#pageGematriaEN .toolbar {
  background:var(--bg-card);
  border: 1px solid #1c2235;
  border-radius: 6px;
}
#pageGematriaEN .toolbar-title {
  font-family: 'Lato', sans-serif;
  font-size: .72rem;
  letter-spacing: .18em;
  color: #8cfaf3;
}

/* Input section */
#pageGematriaEN .input-section {
  background:var(--bg-card);
  border: 1px solid #1c2a44;
  border-radius: 8px;
}
#pageGematriaEN .geo-input {
  background:var(--bg-card);
  border: 1px solid #1e2d4a;
  color: rgb(222,222,222);
  font-family: 'Lato', sans-serif;
  font-size: 1.05rem;
  font-weight: 300;
}
#pageGematriaEN .geo-input:focus {
  border-color: var(--gold);
  box-shadow: 0 0 0 2px rgba(201,168,76,.2);
  outline: none;
}
#pageGematriaEN .geo-input::placeholder {
  color: var(--text-sec);
}

/* Calculate button */
#pageGematriaEN .ecl-go {
  background: var(--gold);
  border: 1px solid var(--gold);
  color:var(--text-pri);
  font-family: 'Lato', sans-serif;
  font-weight: 700;
  font-size: .9rem;
  letter-spacing: .08em;
  border-radius: 5px;
  transition: background .15s;
}
#pageGematriaEN .ecl-go:hover {
  background: var(--gold-glow);
  border-color: var(--gold-glow);
}

/* Buttons */
#pageGematriaEN .btn-ciphers,
#pageGematriaEN .btn-tables-menu {
  background: transparent;
  border: 1px solid var(--gold-dim);
  color: var(--gold);
  font-family:var(--font-main);
  font-size: .78rem;
}
#pageGematriaEN .btn-ciphers:hover,
#pageGematriaEN .btn-tables-menu:hover {
  background: var(--gold);
  border-color: var(--gold);
  color: #0a0c10;
}

/* Results section */
#pageGematriaEN .geo-results-grid {
  gap: .6rem;
}
#pageGematriaEN .geo-card {
  background:var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 6px;
  transition: border-color .15s, box-shadow .15s;
}
#pageGematriaEN .geo-card:hover {
  border-color: var(--gold);
  box-shadow: 0 4px 16px rgba(201,168,76,.2);
}
#pageGematriaEN .geo-card-label {
  font-family: 'Lato', sans-serif;
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: #4a6a9a;
}
#pageGematriaEN .geo-card-value {
  font-family: 'Montserrat', sans-serif;
  font-size: 1.5rem;
  font-weight: 700;
  color: #8cfaf3;
}
#pageGematriaEN .geo-card-value:hover {
  color: #fcb900;
  cursor: pointer;
}

/* Cipher count badge */
#pageGematriaEN .ciphers-count {
  font-family: 'Lato', sans-serif;
  font-size: .7rem;
  color: #fcb900;
  font-weight: 700;
  letter-spacing: .08em;
}

/* History section */
#pageGematriaEN .history-section {
  background:var(--bg-card);
  border: 1px solid #141d30;
  border-radius: 8px;
}
#pageGematriaEN .history-title {
  font-family: 'Montserrat', sans-serif;
  font-size: .85rem;
  font-weight: 700;
  color: #8cfaf3;
  letter-spacing: .1em;
}
#pageGematriaEN .history-table {
  font-family: 'Lato', sans-serif;
  font-size: .82rem;
}
#pageGematriaEN .history-table th {
  background:var(--bg-card);
  color: #4a6a9a;
  font-family: 'Lato', sans-serif;
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  border-bottom: 1px solid #1a2540;
}
#pageGematriaEN .history-table td {
  border-bottom: 1px solid #101828;
  color: rgb(222,222,222);
  font-size: .85rem;
}
#pageGematriaEN .history-table tr:hover td {
  background:var(--bg-card);
}

/* Match results banner */
#pageGematriaEN #geoMatchSection {
  background:var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 8px;
  font-family: 'Lato', sans-serif;
  color: rgb(222,222,222);
  font-size: .85rem;
}
#pageGematriaEN .geo-match-head {
  color: #8cfaf3;
  font-family: 'Montserrat', sans-serif;
  font-weight: 700;
  font-size: .82rem;
  letter-spacing: .08em;
  padding: .8rem 1rem;
  border-bottom: 1px solid var(--border);
}

/* Export button */
#pageGematriaEN .btn-hist {
  font-family:var(--font-main);
  font-size: .75rem;
  background: transparent;
  border: 1px solid var(--gold-dim);
  color: var(--gold);
  border-radius: 4px;
}
#pageGematriaEN .btn-hist:hover {
  background: var(--gold);
  border-color: var(--gold);
  color: #0a0c10;
}
#pageGematriaEN .btn-hist.danger {
  border-color: #3a1520;
  color: #c04060;
}
#pageGematriaEN .btn-hist.danger:hover {
  background: #8b1a2a;
  border-color: #8b1a2a;
  color:var(--text-pri);
}

/* Hide/Show toggle */
#pageGematriaEN .toggle-hist {
  font-family: 'Lato', sans-serif;
  font-size: .72rem;
  background:var(--bg-card);
  border: 1px solid #1a2540;
  color: #4a7aaa;
  border-radius: 20px;
}
#pageGematriaEN .toggle-hist:hover {
  border-color: #8cfaf3;
  color: #8cfaf3;
}

/* ══════════════════════════════════════
   ENGLISH GEMATRIA — Gematrinator-style full layout
   Scoped entirely to #pageGematriaEN
══════════════════════════════════════ */

#pageGematriaEN {
  background:var(--bg-card);
  min-height: 100vh;
  font-family: 'Lato', 'IBM Plex Sans Arabic', sans-serif;
  direction: ltr;
}
#pageGematriaEN header {
  background:var(--bg-card);
  border-bottom: 2px solid #1a2540;
}
#pageGematriaEN header h1 {
  font-family: 'Amiri', serif !important;
  font-size: clamp(1.6rem,3vw,2.4rem) !important;
  letter-spacing: .08em !important;
  color: var(--gold-glow) !important;
  text-shadow: 0 0 24px rgba(201,168,76,.25) !important;
}

/* TOP BAR */
.gen-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: .7rem 2rem;
  background:var(--bg-card);
  border-bottom: 1px solid #131d30;
  gap: 1rem;
  flex-wrap: wrap;
}
.gen-topbar-left, .gen-topbar-right {
  display: flex;
  align-items: center;
  gap: .5rem;
  flex-wrap: wrap;
}
.gen-btn-cipher {
  background: var(--gold);
  border: none;
  color:var(--text-pri);
  font-family: 'Lato', sans-serif;
  font-size: .82rem;
  font-weight: 700;
  letter-spacing: .08em;
  padding: .45rem 1.1rem;
  border-radius: 5px;
  cursor: pointer;
  transition: background .14s;
}
.gen-btn-cipher:hover { background: var(--gold-glow); }
.gen-cipher-count {
  font-family: 'Lato', monospace;
  font-size: .75rem;
  font-weight: 700;
  color: #fcb900;
  letter-spacing: .06em;
}
.gen-btn-outline {
  background: transparent;
  border: 1px solid #1e3050;
  color: #8cfaf3;
  font-family: 'Lato', sans-serif;
  font-size: .78rem;
  padding: .4rem .9rem;
  border-radius: 5px;
  cursor: pointer;
  transition: all .14s;
}
.gen-btn-outline:hover {
  background:var(--bg-card);
  border-color: #8cfaf3;
}

/* ENTRY */
.gen-entry-wrap {
  display: flex;
  align-items: center;
  gap: .5rem;
  padding: .6rem 2rem;
  background:var(--bg-card);
  border-bottom: 1px solid #131d30;
}
.gen-entry-input {
  flex: 1;
  background:var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 5px;
  color: var(--text-pri);
  font-family: 'Lato', sans-serif;
  font-size: .9rem;
  font-weight: 700;
  padding: .42rem .85rem;
  outline: none;
  transition: border-color .14s, box-shadow .14s;
  letter-spacing: .03em;
}
.gen-entry-input:focus {
  border-color: var(--gold);
  box-shadow: 0 0 0 2px rgba(201,168,76,.15);
}
.gen-entry-input::placeholder { color: var(--text-sec); }
.gen-entry-btn {
  background: var(--gold);
  border: none;
  color:var(--text-pri);
  font-family: 'Lato', sans-serif;
  font-size: .82rem;
  font-weight: 700;
  letter-spacing: .08em;
  padding: .44rem 1.2rem;
  border-radius: 5px;
  cursor: pointer;
  white-space: nowrap;
  transition: background .14s;
}
.gen-entry-btn:hover { background: var(--gold-glow); }

/* RESULTS GRID */
.gen-results-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(80px, max-content));
  gap: .25rem 1.1rem;
  max-width: 100%;
  width: fit-content;
  margin: 1rem auto 0;
  padding: 1rem 1.5rem;
  background: rgba(255,255,255,.035);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
}
/* cols per row selector */
.gen-cols-bar {
  display: flex;
  align-items: center;
  gap: .4rem;
  direction: ltr;
}
.gen-cols-label {
  font-family: 'Lato', sans-serif;
  font-size: .62rem;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--gold-dim);
  margin-right: .3rem;
}
.gen-cols-btn {
  background: transparent;
  border: 1px solid var(--gold-dim);
  color: var(--gold);
  font-family: 'Lato', monospace;
  font-size: .72rem;
  width: 26px;
  height: 26px;
  border-radius: 4px;
  cursor: pointer;
  transition: all .12s;
  display: flex;
  align-items: center;
  justify-content: center;
}
.gen-cols-btn:hover, .gen-cols-btn.active {
  background: var(--gold);
  border-color: var(--gold);
  color: var(--ink);
}
/* override existing geo-result-card inside gen layout */
#pageGematriaEN .geo-result-card {
  padding: .5rem .3rem;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .2rem;
}
#pageGematriaEN .geo-result-card .gv {
  font-family: 'Montserrat', sans-serif;
  font-size: 1.55rem;
  font-weight: 700;
  line-height: 1;
  cursor: pointer;
}
#pageGematriaEN .geo-result-card .gv:hover { opacity: .75; }
#pageGematriaEN .geo-result-card .gl {
  font-family: 'Lato', sans-serif;
  font-size: .9rem;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: inherit;
  margin-top: .1rem;
}

/* inline letter table inside card */
#pageGematriaEN .geo-inline-table-wrap {
  grid-column: 1 / -1;
  background:var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 6px;
  padding: 1rem 1.2rem;
  margin: .5rem 0;
}

/* BREAKDOWN */
.gen-breakdown-wrap {
  max-width: 100%;
  width: fit-content;
  margin: 1rem auto 0;
  padding: 1.2rem 1.6rem;
  background: rgba(255,255,255,.035);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
}
.gen-breakdown-header {
  display: flex;
  align-items: center;
  gap: .8rem;
  margin-bottom: .8rem;
}
.gen-bd-label {
  font-family: 'Lato', sans-serif;
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--text-muted);
}
.gen-bd-sys {
  font-family: 'Lato', sans-serif;
  font-size: .78rem;
  font-weight: 700;
  color: var(--gold);
  letter-spacing: .06em;
}
.gen-letters-strip {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem;
  margin-bottom: .6rem;
}
#pageGematriaEN .letter-chip {
  background:var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 5px;
  padding: .3rem .45rem;
  min-width: 36px;
  text-align: center;
}
.gen-bd-total {
  font-family: 'Montserrat', sans-serif;
  font-size: .82rem;
  color: #4a6a9a;
  letter-spacing: .06em;
}

/* CUSTOM CIPHER PANEL */
.gen-add-panel {
  max-width: 1400px;
  margin: 0 auto;
  padding: 1.2rem 1.5rem;
  background:var(--bg-card);
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
}
.gen-add-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 1rem;
  font-family: 'Montserrat', sans-serif;
  font-size: .85rem;
  font-weight: 700;
  letter-spacing: .1em;
  color: #8cfaf3;
}
.gen-add-close {
  background: none;
  border: none;
  color: #4a6a9a;
  font-size: 1rem;
  cursor: pointer;
}
.gen-add-close:hover { color: var(--danger); }
.gen-add-grid {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 1rem;
  margin-bottom: 1rem;
}
.gen-label {
  font-family: 'Lato', sans-serif;
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: #4a6a9a;
  display: block;
  margin-bottom: .4rem;
}
.gen-field {
  width: 100%;
  background:var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 5px;
  color: var(--text-pri);
  font-family: 'Lato', sans-serif;
  font-size: .9rem;
  padding: .55rem .9rem;
  outline: none;
}
.gen-field:focus { border-color: var(--gold); }
.gen-add-actions {
  display: flex;
  gap: .6rem;
  margin-top: 1rem;
  justify-content: flex-end;
}
.gen-btn-cancel {
  background: transparent;
  border: 1px solid #1e3050;
  color: #4a6a9a;
  font-family: 'Lato', sans-serif;
  font-size: .82rem;
  padding: .5rem 1.2rem;
  border-radius: 5px;
  cursor: pointer;
}
.gen-btn-save {
  background: var(--gold);
  border: none;
  color:var(--text-pri);
  font-family: 'Lato', sans-serif;
  font-size: .82rem;
  font-weight: 700;
  padding: .5rem 1.4rem;
  border-radius: 5px;
  cursor: pointer;
}
.gen-btn-save:hover { background: var(--gold-glow); }

/* HISTORY */
.gen-history-wrap {
  max-width: 1400px;
  margin: 0 auto;
  padding: 0 1.5rem 2rem;
  margin-top: 1rem;
  display: none;
}
.gen-history-wrap.has-data { display: block; }
.gen-hist-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: .7rem 0;
  border-bottom: 1px solid var(--border);
  margin-bottom: .6rem;
}
.gen-hist-title {
  font-family: 'Montserrat', sans-serif;
  font-size: .8rem;
  font-weight: 700;
  letter-spacing: .14em;
  color: #4a6a9a;
  text-transform: uppercase;
  display: flex;
  align-items: center;
  gap: .6rem;
}
.gen-hist-toggle {
  background: transparent;
  border: 1px solid #1e3050;
  color: #4a6a9a;
  font-family: 'Lato', sans-serif;
  font-size: .7rem;
  padding: .2rem .6rem;
  border-radius: 12px;
  cursor: pointer;
  transition: all .13s;
}
.gen-hist-toggle:hover {
  border-color: #8cfaf3;
  color: #8cfaf3;
}

/* history table overrides for EN */
#pageGematriaEN #geoHistorySection .history-table th {
  background:var(--bg-card);
  border-bottom: 1px solid var(--border);
  font-family: 'Lato', sans-serif;
  font-size: .62rem;
  letter-spacing: .14em;
  text-transform: uppercase;
  padding: .55rem .7rem;
}
#pageGematriaEN #geoHistorySection .history-table td {
  font-family: 'Lato', sans-serif;
  font-size: .84rem;
  color: #c0d0e8;
  border-bottom: 1px solid var(--border);
  padding: .5rem .7rem;
}
#pageGematriaEN #geoHistorySection .history-table tr:hover td {
  background:var(--bg-card);
}

/* responsive */
@media (max-width: 768px) {
  .gen-topbar { padding: .6rem 1rem; }
  .gen-entry-wrap { padding: 1rem; flex-wrap: wrap; }
  .gen-entry-btn { width: 100%; }
  .gen-results-grid { padding: .8rem; }
  #pageGematriaEN .geo-result-card { min-height: 66px; }
  #pageGematriaEN .geo-result-card .gv { font-size: 1.3rem; }
}

/* ══════════════════════════════════════
   GEO HISTORY — Context Menu & Row Toggle
══════════════════════════════════════ */

/* context menu */
.geo-ctx-menu {
  background:var(--bg-card);
  border: 1px solid #1e3050;
  border-radius: 7px;
  box-shadow: 0 8px 32px rgba(0,0,0,.7), 0 0 0 1px rgba(140,250,243,.06);
  min-width: 180px;
  overflow: hidden;
  font-family: 'Lato', 'IBM Plex Sans Arabic', sans-serif;
  font-size: .83rem;
  animation: ctxFadeIn .1s ease;
}
@keyframes ctxFadeIn {
  from { opacity:0; transform:translateY(-4px); }
  to   { opacity:1; transform:translateY(0); }
}
.geo-ctx-item {
  padding: .6rem 1.1rem;
  color: var(--text-sec);
  cursor: pointer;
  transition: background .1s, color .1s;
  white-space: nowrap;
}
.geo-ctx-item:hover {
  background: var(--bg-hover);
  color: var(--cyan);
}
.geo-ctx-item.danger { color: var(--danger); }
.geo-ctx-item.danger:hover {
  background: #1a0810;
  color: #ff7090;
}
.geo-ctx-sep {
  height: 1px;
  background: var(--border);
  margin: .25rem 0;
}

/* row toggle — dim the row when "hidden" */
.geo-row-hidden td {
  opacity: .22;
  text-decoration: line-through;
  text-decoration-color: rgba(255,255,255,.2);
}
.geo-ctx-item.disabled {
  opacity: .3;
  pointer-events: none;
  cursor: default;
}

/* ── Hebrew page: same gen-layout styles ── */
#pageHebrewGematria {
  background:var(--bg-card);
  min-height: 100vh;
  font-family: 'Lato', 'IBM Plex Sans Arabic', sans-serif;
}
#pageHebrewGematria header h1 {
  font-family: 'Amiri', serif !important;
  color: var(--gold-glow) !important;
}
#pageHebrewGematria .geo-result-card {
  padding: .5rem .3rem;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .2rem;
}
#pageHebrewGematria .geo-result-card .gv {
  font-family: 'Montserrat', sans-serif;
  font-size: 1.55rem;
  font-weight: 700;
  line-height: 1;
  cursor: pointer;
}
#pageHebrewGematria .geo-result-card .gl {
  font-family: 'Lato', sans-serif;
  font-size: .9rem;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: inherit;
}
#pageHebrewGematria #hebResultsGrid {
  grid-template-columns: repeat(4, minmax(80px, max-content));
}
#pageHebrewGematria #hebHistorySection .history-table th {
  background:var(--bg-card);
  border-bottom: 1px solid var(--border);
  font-size: .9rem;
  letter-spacing: .1em;
  text-transform: uppercase;
  padding: .55rem .7rem;
}
#pageHebrewGematria #hebHistorySection .history-table td {
  font-size: 1.1rem;
  color: var(--text-sec);
  border-bottom: 1px solid var(--border);
  padding: .5rem .7rem;
}
#pageHebrewGematria #hebHistorySection .history-table tr:hover td {
  background:var(--bg-card);
}

/* ── English & Hebrew History table: column dividers + uniform colors ── */
#geoHistorySection .history-table th,
#geoHistorySection .history-table td,
#hebHistorySection .history-table th,
#hebHistorySection .history-table td {
  border-right: 1px solid var(--border);
  border-left: none;
}
#geoHistorySection .history-table th:last-child,
#geoHistorySection .history-table td:last-child,
#hebHistorySection .history-table th:last-child,
#hebHistorySection .history-table td:last-child {
  border-right: none;
}
/* uniform number color — use the system color but same brightness for all */
#geoHistorySection .history-table td.mn,
#hebHistorySection .history-table td.mn {
  font-family: 'JetBrains Mono', 'Lato', monospace;
  font-size: .88rem;
  font-weight: 700;
}
/* first col (Phrase) divider */
#geoHistorySection .history-table th:first-child,
#geoHistorySection .history-table td:first-child,
#hebHistorySection .history-table th:first-child,
#hebHistorySection .history-table td:first-child {
  border-right: 2px solid #1e3050;
}

/* ── Normalize th color brightness in EN/HEB history ── */
#geoHistorySection .history-table th[style],
#hebHistorySection .history-table th[style] {
  opacity: 0.85;
  font-size: .65rem !important;
  font-weight: 700 !important;
  letter-spacing: .1em !important;
  text-transform: uppercase !important;
  padding: .55rem .5rem !important;
  white-space: nowrap;
}

/* ── History table th: keep system color from inline style ── */
#geoHistorySection .history-table thead tr th,
#hebHistorySection .history-table thead tr th {
  background:var(--bg-card) !important;
  font-family: 'Lato', sans-serif !important;
  font-size: .63rem !important;
  font-weight: 700 !important;
  letter-spacing: .13em !important;
  text-transform: uppercase !important;
  padding: .55rem .6rem !important;
  border-bottom: 2px solid var(--border) !important;
  white-space: nowrap;
}

/* ══════════════════════════════════════
   EN + HEB HISTORY: uniform cells + zebra
   Override ALL first/last-child special styling
══════════════════════════════════════ */
#geoHistorySection .history-table th,
#geoHistorySection .history-table td,
#hebHistorySection .history-table th,
#hebHistorySection .history-table td {
  position: static !important;
  right: auto !important;
  left: auto !important;
  z-index: auto !important;
  border-right: 1px solid var(--border) !important;
  border-left: none !important;
}
#hebHistorySection .history-table th:last-child,
#hebHistorySection .history-table td:last-child {
  border-right: none !important;
}

/* uniform td style — all cells same */
#geoHistorySection .history-table td,
#hebHistorySection .history-table td {
  font-family: 'Lato', 'JetBrains Mono', sans-serif !important;
  font-size: .86rem !important;
  padding: .5rem .6rem !important;
  text-align: center !important;
  border-bottom: 1px solid #0e1624 !important;
}

/* phrase cell (first-child) — white, centered */
#geoHistorySection .history-table td:first-child,
#hebHistorySection .history-table td:first-child {
  text-align: center !important;
  font-family: 'Lato', sans-serif !important;
  font-size: .88rem !important;
  color:var(--text-pri) !important;
  font-weight: 600 !important;
  cursor: pointer;
}
/* Phrase/Word th header — white, centered */
#geoHistorySection .history-table th:first-child,
#hebHistorySection .history-table th:first-child {
  color:var(--text-pri) !important;
  text-align: center !important;
}

/* number cells: inline style color takes priority (set in JS) */

/* zebra striping */
#geoHistorySection .history-table tbody tr:nth-child(odd) td,
#hebHistorySection .history-table tbody tr:nth-child(odd) td {
  background: var(--bg-card) !important;
}
#geoHistorySection .history-table tbody tr:nth-child(even) td,
#hebHistorySection .history-table tbody tr:nth-child(even) td {
  background: var(--bg-hover) !important;
}

/* hover overrides zebra */
#geoHistorySection .history-table tbody tr:hover td,
#hebHistorySection .history-table tbody tr:hover td {
  background: var(--bg-hover) !important;
}

/* hidden row */
#geoHistorySection .history-table tbody tr.geo-row-hidden td,
#hebHistorySection .history-table tbody tr.geo-row-hidden td {
  opacity: .2 !important;
  text-decoration: line-through !important;
}

/* ══ FINAL OVERRIDE: Hebrew history — all borders guaranteed ══ */
#pageHebrewGematria #hebHistorySection .history-table,
#pageHebrewGematria #hebHistorySection .history-table th,
#pageHebrewGematria #hebHistorySection .history-table td {
  border-collapse: collapse !important;
}
#pageHebrewGematria #hebHistorySection .history-table th {
  border: 1px solid var(--border) !important;
  background:var(--bg-card) !important;
  font-family: 'Lato', sans-serif !important;
  font-size: .63rem !important;
  font-weight: 700 !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;
  padding: .55rem .6rem !important;
  text-align: center !important;
}
#pageHebrewGematria #hebHistorySection .history-table td {
  border: 1px solid var(--border) !important;
  font-family: 'Lato', sans-serif !important;
  font-size: .86rem !important;
  padding: .5rem .6rem !important;
  text-align: center !important;
}
#pageHebrewGematria #hebHistorySection .history-table td:first-child {
  color:var(--text-pri) !important;
  font-weight: 600 !important;
  cursor: pointer;
}
#pageHebrewGematria #hebHistorySection .history-table th:first-child {
  color:var(--text-pri) !important;
}
#pageHebrewGematria #hebHistorySection .history-table tbody tr:nth-child(odd) td {
  background: var(--bg-card) !important;
}
#pageHebrewGematria #hebHistorySection .history-table tbody tr:nth-child(even) td {
  background: var(--bg-hover) !important;
}
#pageHebrewGematria #hebHistorySection .history-table tbody tr:hover td {
  background: var(--bg-hover) !important;
}
#pageHebrewGematria #hebHistorySection .history-table tbody tr.geo-row-hidden td {
  opacity: .2 !important;
  text-decoration: line-through !important;
}

/* ══ FINAL: row borders for both EN + HEB history ══ */
#geoHistorySection .history-table,
#hebHistorySection .history-table {
  border-collapse: collapse !important;
}
#geoHistorySection .history-table th,
#geoHistorySection .history-table td {
  border: 1px solid var(--border) !important;
}
#geoHistorySection .history-table th:first-child,
#geoHistorySection .history-table td:first-child {
  color:var(--text-pri) !important;
  font-weight: 600 !important;
  text-align: center !important;
}
#geoHistorySection .history-table th {
  background:var(--bg-card) !important;
}
#geoHistorySection .history-table tbody tr:nth-child(odd) td {
  background: var(--bg-card) !important;
}
#geoHistorySection .history-table tbody tr:nth-child(even) td {
  background: var(--bg-hover) !important;
}

/* ══ GREEK & RUSSIAN HISTORY: same style as EN/HEB ══ */
#grkHistorySection .history-table,
#slvHistorySection .history-table {
  border-collapse: collapse !important;
  direction: ltr;
}
#grkHistorySection .history-table th,
#grkHistorySection .history-table td,
#slvHistorySection .history-table th,
#slvHistorySection .history-table td {
  border: 1px solid var(--border) !important;
  text-align: center !important;
  padding: .5rem .6rem !important;
  font-family: 'Lato', 'JetBrains Mono', sans-serif !important;
  font-size: .86rem !important;
}
#grkHistorySection .history-table th,
#slvHistorySection .history-table th {
  background:var(--bg-card) !important;
  font-size: .63rem !important;
  font-weight: 700 !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;
  padding: .55rem .6rem !important;
  white-space: nowrap;
}
#grkHistorySection .history-table td:first-child,
#slvHistorySection .history-table td:first-child {
  color:var(--text-pri) !important;
  font-weight: 600 !important;
  cursor: pointer;
}
#grkHistorySection .history-table th:first-child,
#slvHistorySection .history-table th:first-child {
  color:var(--text-pri) !important;
}
#grkHistorySection .history-table tbody tr:nth-child(odd) td,
#slvHistorySection .history-table tbody tr:nth-child(odd) td {
  background: var(--bg-card) !important;
}
#grkHistorySection .history-table tbody tr:nth-child(even) td,
#slvHistorySection .history-table tbody tr:nth-child(even) td {
  background: var(--bg-hover) !important;
}
#grkHistorySection .history-table tbody tr:hover td,
#slvHistorySection .history-table tbody tr:hover td {
  background: var(--bg-hover) !important;
}
#grkHistorySection .history-table tbody tr.geo-row-hidden td,
#slvHistorySection .history-table tbody tr.geo-row-hidden td {
  opacity: .2 !important;
  text-decoration: line-through !important;
}
/* gen-history-wrap for Greek & Russian: same max-width as EN/HEB */
#pageGreekGematria .gen-history-wrap,
#pageSlavicGematria .gen-history-wrap {
  max-width: 1400px;
  padding: 0 1.5rem 2rem;
}
/* gen-hist-header for Greek & Russian */
#pageGreekGematria .gen-hist-header,
#pageSlavicGematria .gen-hist-header {
  border-bottom: 1px solid var(--border);
  margin-bottom: .6rem;
}

/* ══ ARABIC HISTORY: same borders, zebra, uniform style ══ */
#historySection .history-table {
  border-collapse: collapse !important;
}
#historySection .history-table th,
#historySection .history-table td {
  border: 1px solid var(--border) !important;
  text-align: center !important;
  padding: .5rem .6rem !important;
}
#historySection .history-table th {
  background:var(--bg-card) !important;
  font-size: .63rem !important;
  font-weight: 700 !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;
}
#historySection .history-table th:first-child {
  color:var(--text-pri) !important;
}
#historySection .history-table td:first-child {
  color:var(--text-pri) !important;
  font-weight: 600 !important;
  cursor: pointer;
}
#historySection .history-table tbody tr:nth-child(odd) td {
  background: var(--bg-card) !important;
}
#historySection .history-table tbody tr:nth-child(odd) td:first-child {
  background: var(--bg-card) !important;
}
#historySection .history-table tbody tr:nth-child(even) td {
  background: var(--bg-hover) !important;
}
#historySection .history-table tbody tr:nth-child(even) td:first-child {
  background: var(--bg-hover) !important;
}
#historySection .history-table tbody tr:hover td {
  background: var(--bg-hover) !important;
}
#historySection .history-table tbody tr.geo-row-hidden td {
  opacity: .2 !important;
  text-decoration: line-through !important;
}

/* ══ ARABIC HISTORY: match English exactly ══ */
#pageGematriaAR #historySection .history-table {
  border-collapse: collapse !important;
}
#pageGematriaAR #historySection .history-table th,
#pageGematriaAR #historySection .history-table td {
  border: 1px solid var(--border) !important;
  text-align: center !important;
  padding: .5rem .6rem !important;
  position: static !important;
  right: auto !important;
  left: auto !important;
  z-index: auto !important;
}
#pageGematriaAR #historySection .history-table th {
  background:var(--bg-card) !important;
  font-size: .63rem !important;
  font-weight: 700 !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;
  white-space: nowrap;
  /* system color from inline style takes priority */
}
#pageGematriaAR #historySection .history-table th:first-child {
  color:var(--text-pri) !important;
}
#pageGematriaAR #historySection .history-table td:first-child {
  color:var(--text-pri) !important;
  font-weight: 600 !important;
  cursor: pointer;
}
#pageGematriaAR #historySection .history-table tbody tr:nth-child(odd) td {
  background: var(--bg-card) !important;
}
#pageGematriaAR #historySection .history-table tbody tr:nth-child(even) td {
  background: var(--bg-hover) !important;
}
#pageGematriaAR #historySection .history-table tbody tr:hover td {
  background: var(--bg-hover) !important;
}
#pageGematriaAR #historySection .history-table tbody tr.geo-row-hidden td {
  opacity: .2 !important;
  text-decoration: line-through !important;
}

/* ══ WORD COLUMN: no truncation, proper min-width ══ */
#historySection .history-table td:first-child,
#geoHistorySection .history-table td:first-child,
#hebHistorySection .history-table td:first-child,
#pageGematriaAR #historySection .history-table td:first-child,
#pageGematriaEN #geoHistorySection .history-table td:first-child,
#pageHebrewGematria #hebHistorySection .history-table td:first-child {
  min-width: 120px !important;
  max-width: 260px !important;
  white-space: normal !important;
  word-break: break-word !important;
  overflow: visible !important;
  text-overflow: unset !important;
}

/* ══ Context menu: prevent page scroll/resize ══ */
.geo-ctx-menu {
  max-height: calc(100vh - 20px) !important;
  overflow-y: auto !important;
}

/* ══ Date Calculator: Day vs Week colors ══ */
/* Day of Year + Days Left → orange */
.dc-table tr.dc-row-day td,
.dc-table tr.dc-row-day td.dc-val,
.dc-table tr.dc-row-day td.dc-expr { color:var(--dcr-day) !important; }
.dcr-v.dc-row-day { color: var(--dcr-day) !important; text-shadow: 0 0 6px rgba(167,139,250,.35) !important; }

/* Week of Year + Weeks Left → teal */
.dc-table tr.dc-row-woy td,
.dc-table tr.dc-row-woy td.dc-val,
.dc-table tr.dc-row-woy td.dc-expr { color:var(--dcr-woy) !important; }
.dcr-v.dc-row-woy { color: var(--dcr-woy) !important; text-shadow: 0 0 6px rgba(45,212,191,.35) !important; }

/* dc-title override for Date Calculator page */
#pageDatecalc .dc-title {
  font-family: 'Montserrat', sans-serif !important;
  font-size: clamp(1.4rem,3vw,2rem) !important;
  letter-spacing: .12em !important;
}

/* ══ dcr-e (label text) same color as dcr-v (number) ══ */
.dcr-e.dc-row-day { color:var(--dcr-day) !important; }
.dcr-e.dc-row-woy { color:var(--dcr-woy) !important; }

/* ════════════════════════════════════════
   MOBILE RESPONSIVE — Full overhaul
   Breakpoints: 768px (tablet), 480px (phone)
════════════════════════════════════════ */

/* ── Hamburger button ── */
.nav-hamburger {
  display: none;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  background: none;
  border: 1px solid var(--border-lit);
  border-radius: var(--radius);
  padding: .45rem .6rem;
  cursor: pointer;
  order: -1;
}
.nav-hamburger span {
  display: block;
  width: 22px;
  height: 2px;
  background: var(--gold);
  border-radius: 2px;
  transition: all .2s;
}
.nav-hamburger.open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.nav-hamburger.open span:nth-child(2) { opacity: 0; }
.nav-hamburger.open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* ── Mobile nav menu ── */
.nav-mobile-menu {
  display: flex;
  align-items: center;
  gap: .4rem;
  flex: 1;
  justify-content: space-between;
}

@media (max-width: 768px) {
  /* info bar hidden on mobile */
  .info-bar { display: none !important; }

  /* nav layout */
  .top-nav {
    justify-content: space-between !important;
    padding: .5rem 1rem !important;
    flex-wrap: nowrap !important;
  }
  .nav-hamburger { display: flex !important; }

  /* mobile menu — hidden by default, shown when open */
  .nav-mobile-menu {
    display: none;
    position: fixed;
    top: 50px;
    right: 0;
    left: 0;
    bottom: 0;
    background:var(--bg-card);
    border-bottom: 1px solid var(--border);
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    padding: .5rem 0 2rem;
    z-index: 499;
    box-shadow: 0 8px 24px rgba(0,0,0,.6);
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }
  .nav-mobile-menu.open { display: flex !important; }

  /* الشريط الثابت الجديد يظهر دائمًا على الجوال، والنسخة القديمة المدفونة تُخفى لتفادي التكرار */
  #rqMobileQuickBar { display: flex !important; }
  #rqFontBtn, #rqSizeBtn, #rqThemeBtn { display: none !important; }

  .nav-right-group,
  .nav-left-group {
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    width: 100%;
  }
  .nav-btn {
    width: 100% !important;
    text-align: right !important;
    border-radius: 0 !important;
    border: none !important;
    border-bottom: 1px solid var(--border) !important;
    padding: .75rem 1.2rem !important;
    font-size: .92rem !important;
    background: transparent !important;
    color: var(--gold) !important;
    box-shadow: none !important;
  }
  .nav-btn:hover { background: var(--bg-hover) !important; }
  .nav-dropdown { width: 100%; }
  .nav-menu {
    position: static !important;
    display: none;
    box-shadow: none !important;
    border: none !important;
    border-radius: 0 !important;
    background:var(--bg-card) !important;
  }
  .nav-menu.open { display: block !important; }
  .nav-menu-item {
    padding: .65rem 2rem !important;
    font-size: .88rem !important;
    border-bottom: 1px solid var(--border) !important;
  }

  /* ═══ إصلاح فيض قائمة "الأدوات" (nav-mega) — كانت بلا أي معالجة للجوال إطلاقًا ═══
     3 أعمدة متجاورة min-width:150px = 450px+ تفيض على أي شاشة جوال عادية.
     الحل: تكديس عمودي كامل العرض، بنفس منطق nav-menu أعلاه. */
  .nav-mega {
    position: static !important;
    width: 100% !important;
    max-width: 100% !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    border: none !important;
    border-top: 1px solid var(--border) !important;
  }
  .nav-mega.open { flex-direction: column !important; }
  .nav-mega-col {
    min-width: 0 !important;
    width: 100% !important;
  }
  .nav-mega-col + .nav-mega-col {
    border-right: none !important;
    border-top: 1px solid rgba(255,255,255,.06);
  }

  /* ═══ تكبير أزرار اللمس الصغيرة (خط/حجم/وضع) لحد أدنى مناسب للإصبع (44px) ═══
     كانت 34px على كل الشاشات بما فيها الجوال — أصغر من معيار إتاحة اللمس، لا أكبر منه. */
  #rqFontBtn, #rqSizeBtn, #rqThemeBtn {
    width: 44px !important;
    height: 44px !important;
    font-size: 1rem !important;
  }
  .nav-left-group {
    gap: .5rem !important;
    padding: .5rem 0;
  }

  /* ═══ إصلاح ثانٍ حقيقي لقائمة "الأدوات"/"رمزيات"/"حساب الجُمَّل" — البنية الفعلية
     شبكة أيقونات (tgb) بعرض بكسل ثابت مضمَّن في HTML، لا أعمدة نصية كما افترضت أول مرة.
     overflow:hidden الأصلية (من قاعدة سطح المكتب) قد تقصّ الصفوف الزائدة — نُبطلها هنا. ═══ */
  .nav-mega {
    overflow: visible !important;
    max-height: none !important;
  }
  .nav-mega > div {
    grid-template-columns: repeat(3, 1fr) !important;
    width: 100% !important;
  }
  .tgb {
    width: auto !important;
    height: auto !important;
    aspect-ratio: 1 !important;
    min-width: 0 !important;
  }

  /* ═══ نقل أزرار الخط/الحجم/الوضع (وبقية nav-left-group) لأعلى قائمة الجوال —
     كانت آخر عنصر يُوصَل إليه بعد تمرير كل الروابط والقوائم المتوسِّعة ═══ */
  .nav-right-group { order: 2; }
  .nav-left-group { order: 1; border-bottom: 1px solid var(--border); margin-bottom: .3rem; }

  /* history tables — scrollable */
  .history-table-wrap {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
  }
  .history-table { min-width: 500px; }

  /* results grid */
  .gen-results-grid,
  #hebResultsGrid,
  #geoResultsGrid {
    grid-template-columns: repeat(2, 1fr) !important;
    padding: .6rem !important;
  }

  /* cols bar hidden on mobile — auto 2 cols */
  .gen-cols-bar { display: none !important; }

  /* entry wrap */
  .gen-entry-wrap { flex-wrap: wrap !important; padding: .6rem !important; }
  .gen-entry-btn { width: 100% !important; }

  /* Arabic results */
  .results-grid { grid-template-columns: repeat(2, 1fr) !important; }

  /* Chakra image */
  .ckp-imgwrap { width: 100% !important; height: auto !important; aspect-ratio: 1/1; }
  .ckp-stage { flex-direction: column !important; align-items: center !important; }
  .ckp-chakra-col { display: none !important; }
  .ckp-info-bottom { width: 100% !important; }
  /* عمود الأبراج بالجوال: التموضع المطلق (top:%) يفترض ارتفاعًا ثابتًا للعمود —
     لكن بالتخطيط العمودي بالجوال يفقد العمود ارتفاعه الطبيعي (كل عناصره position:absolute)
     فينهار لصفر ارتفاع وتتكدّس كل الأبراج فوق بعضها. الحل: نرجّعها لتدفّق عادي (صف ملتفّ) بالجوال فقط. */
  .ckp-zodiac-col {
    position: static !important; align-self: auto !important;
    display: flex !important; flex-direction: row !important; flex-wrap: wrap !important;
    justify-content: center !important; width: 100% !important; gap: 4px !important;
  }
  .ckp-zitem { position: static !important; transform: none !important; width: auto !important; }

  /* date calculator */
  .dc-dates { flex-direction: column !important; gap: 1rem !important; }
  .dc-date-box { width: 100% !important; }
  .dc-container { padding: 1rem !important; }

  /* general container padding */
  .container { padding: .8rem !important; }
  .geo-container { padding: 1rem !important; }
  .gen-topbar { padding: .5rem 1rem !important; flex-wrap: wrap !important; }

  /* home page */
  .home-hero { padding: 2rem 1rem !important; }
  .home-hero-stats { gap: 1rem !important; flex-wrap: wrap !important; justify-content: center !important; }
  .home-featured-grid { grid-template-columns: 1fr !important; }
  .home-tools-grid { grid-template-columns: repeat(2, 1fr) !important; }
  .hff-inner { grid-template-columns: 1fr !important; }
  .home-quran-banner { flex-direction: column !important; padding: 1.5rem !important; }

  /* modals */
  .ciphers-modal { width: 95vw !important; max-height: 85vh !important; }

  /* add panel */
  .add-panel { padding: 1rem !important; }
  .add-panel-grid { grid-template-columns: 1fr !important; }
}

@media (max-width: 480px) {
  .home-hero-title { font-size: 4rem !important; }
  .home-stat .hs-n { font-size: 1.4rem !important; }
  .gen-results-grid,
  #hebResultsGrid,
  #geoResultsGrid { grid-template-columns: repeat(2, 1fr) !important; }
  .results-grid { grid-template-columns: repeat(2, 1fr) !important; }
  .dc-fields { flex-direction: column !important; }
}

/* ── Arabic input: same style as EN/HEB gen-entry-wrap ── */
#pageGematriaAR .gen-entry-wrap {
  background:var(--bg-card);
  border-bottom: 1px solid #131d30;
  margin-bottom: 0;
}
.arabic-input-new {
  font-family:var(--font-main) !important;
  font-size: .9rem !important;
  direction: rtl !important;
  text-align: right !important;
}
.arabic-input-new:focus {
  border-color: var(--gold) !important;
  box-shadow: 0 0 0 2px rgba(201,168,76,.15) !important;
}
.arabic-input-new::placeholder {
  color: #2a3a5a;
  font-size: .9rem;
}
#pageGematriaAR .gen-entry-btn {
  background: linear-gradient(135deg, var(--gold) 0%, #a07830 100%) !important;
  color: #0a0c10 !important;
  font-family:var(--font-main) !important;
}
#pageGematriaAR .gen-entry-btn:hover {
  background: linear-gradient(135deg, #d9bb63, #ad7a2a) !important;
}

/* ── EN/HEB topbar: gold buttons like Arabic ── */
#pageGematriaEN .gen-btn-cipher,
#pageGematriaEN .gen-btn-outline,
#pageHebrewGematria .gen-btn-cipher,
#pageHebrewGematria .gen-btn-outline {
  background: #161b26 !important;
  border: 1px solid var(--gold-dim) !important;
  color: var(--gold) !important;
  font-family:var(--font-main) !important;
  font-size: .88rem !important;
  font-weight: 600 !important;
}
#pageGematriaEN .gen-btn-cipher:hover,
#pageGematriaEN .gen-btn-outline:hover,
#pageHebrewGematria .gen-btn-cipher:hover,
#pageHebrewGematria .gen-btn-outline:hover {
  background: rgba(201,168,76,.08) !important;
  border-color: var(--gold) !important;
  color: var(--gold-glow) !important;
}

/* ══ Card labels: wrap words vertically, narrow columns ══ */

/* Arabic result cards */
.result-card {
  min-width: 0 !important;
  width: auto !important;
}
.rc-name {
  word-break: break-word !important;
  overflow-wrap: break-word !important;
  white-space: normal !important;
  overflow: visible !important;
  display: block !important;
  -webkit-line-clamp: unset !important;
  text-align: center !important;
  font-size: .9rem !important;
  line-height: 1.3 !important;
  hyphens: auto !important;
}

/* English & Hebrew geo cards */
.geo-result-card .gl {
  word-break: break-word !important;
  overflow-wrap: break-word !important;
  white-space: normal !important;
  text-align: center !important;
  font-size: .58rem !important;
  line-height: 1.3 !important;
  letter-spacing: .05em !important;
  hyphens: auto !important;
}
#pageGematriaEN .geo-result-card .gl,
#pageHebrewGematria .geo-result-card .gl {
  font-size: .58rem !important;
  letter-spacing: .06em !important;
  line-height: 1.3 !important;
  white-space: normal !important;
  word-break: break-word !important;
  hyphens: auto !important;
}

/* Tighten card padding to allow more columns */
.geo-result-card {
  padding: .7rem .4rem .65rem !important;
  min-height: 70px !important;
}
.result-card {
  padding: .7rem .4rem .65rem !important;
}

/* ══ History table: uniform column width + wrapped headers ══ */
#historySection .history-table th,
#geoHistorySection .history-table th,
#hebHistorySection .history-table th,
#pageGematriaAR #historySection .history-table th,
#pageGematriaEN #geoHistorySection .history-table th,
#pageHebrewGematria #hebHistorySection .history-table th {
  width: 90px !important;
  min-width: 70px !important;
  max-width: 110px !important;
  white-space: normal !important;
  word-break: break-word !important;
  overflow-wrap: break-word !important;
  text-align: center !important;
  line-height: 1.3 !important;
  padding: .45rem .35rem !important;
  font-size: .6rem !important;
  vertical-align: middle !important;
}
/* Word column stays wider */
#historySection .history-table th:first-child,
#geoHistorySection .history-table th:first-child,
#hebHistorySection .history-table th:first-child,
#pageGematriaAR #historySection .history-table th:first-child,
#pageGematriaEN #geoHistorySection .history-table th:first-child,
#pageHebrewGematria #hebHistorySection .history-table th:first-child {
  width: 100px !important;
  min-width: 80px !important;
  max-width: 140px !important;
}
/* td same width */
#historySection .history-table td,
#geoHistorySection .history-table td,
#hebHistorySection .history-table td,
#pageGematriaAR #historySection .history-table td,
#pageGematriaEN #geoHistorySection .history-table td,
#pageHebrewGematria #hebHistorySection .history-table td {
  width: 90px !important;
  min-width: 70px !important;
  max-width: 110px !important;
  padding: .45rem .35rem !important;
  font-size: .82rem !important;
}
#historySection .history-table td:first-child,
#geoHistorySection .history-table td:first-child,
#hebHistorySection .history-table td:first-child,
#pageGematriaAR #historySection .history-table td:first-child,
#pageGematriaEN #geoHistorySection .history-table td:first-child,
#pageHebrewGematria #hebHistorySection .history-table td:first-child {
  width: 100px !important;
  min-width: 80px !important;
  max-width: 140px !important;
}

/* ══ History th: one word per line ══ */
#historySection .history-table th,
#geoHistorySection .history-table th,
#hebHistorySection .history-table th,
#pageGematriaAR #historySection .history-table th,
#pageGematriaEN #geoHistorySection .history-table th,
#pageHebrewGematria #hebHistorySection .history-table th {
  width: 70px !important;
  min-width: 55px !important;
  max-width: 90px !important;
  white-space: normal !important;
  word-break: keep-all !important;
  line-height: 1.5 !important;
  font-size: .62rem !important;
  padding: .5rem .3rem !important;
}
#historySection .history-table td,
#geoHistorySection .history-table td,
#hebHistorySection .history-table td,
#pageGematriaAR #historySection .history-table td,
#pageGematriaEN #geoHistorySection .history-table td,
#pageHebrewGematria #hebHistorySection .history-table td {
  width: 70px !important;
  min-width: 55px !important;
  max-width: 90px !important;
  padding: .45rem .3rem !important;
  font-size: .82rem !important;
}

/* ══ History table: fit-content width, centered ══ */
#historySection .history-table-wrap,
#geoHistorySection .history-table-wrap,
#hebHistorySection .history-table-wrap,
#grkHistorySection .history-table-wrap,
#slvHistorySection .history-table-wrap,
#pageGematriaAR #historySection .history-table-wrap,
#pageGematriaEN #geoHistorySection .history-table-wrap,
#pageHebrewGematria #hebHistorySection .history-table-wrap {
  overflow-x: auto !important;
  display: block !important;
  width: 100% !important;
  text-align: center !important;
}
#historySection .history-table,
#geoHistorySection .history-table,
#hebHistorySection .history-table,
#grkHistorySection .history-table,
#slvHistorySection .history-table,
#pageGematriaAR #historySection .history-table,
#pageGematriaEN #geoHistorySection .history-table,
#pageHebrewGematria #hebHistorySection .history-table {
  width: auto !important;
  min-width: unset !important;
  max-width: none !important;
  table-layout: auto !important;
  margin: 0 auto !important;
}

/* ══ History hide class — overrides flex !important ══ */
.history-table-wrap.hist-hidden,
.tw.hist-hidden,
#historySection .history-table-wrap.hist-hidden,
#geoHistorySection .history-table-wrap.hist-hidden,
#hebHistorySection .history-table-wrap.hist-hidden,
#grkHistorySection .history-table-wrap.hist-hidden,
#slvHistorySection .history-table-wrap.hist-hidden,
#pageGematriaAR #historySection .history-table-wrap.hist-hidden,
#pageGematriaEN #geoHistorySection .history-table-wrap.hist-hidden,
#pageHebrewGematria #hebHistorySection .history-table-wrap.hist-hidden,
.gen-history-wrap .history-table-wrap.hist-hidden {
  display: none !important;
}

/* ══ Remove grey border from history table wrap ══ */
#historySection .history-table-wrap,
#geoHistorySection .history-table-wrap,
#hebHistorySection .history-table-wrap,
#pageGematriaAR #historySection .history-table-wrap,
#pageGematriaEN #geoHistorySection .history-table-wrap,
#pageHebrewGematria #hebHistorySection .history-table-wrap,
.gen-history-wrap .history-table-wrap {
  border: none !important;
  background: transparent !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

/* ══ EN/HEB: center table inside gen-history-wrap ══ */
.gen-history-wrap .history-table-wrap {
  display: block !important;
  overflow-x: auto !important;
  width: 100% !important;
  border: none !important;
  background: transparent !important;
}
.gen-history-wrap .history-table {
  margin: 0 auto !important;
  width: auto !important;
}
#geoHistorySection,
#hebHistorySection {
  border: none !important;
  background: transparent !important;
}

/* ══ EN/HEB: first th (Phrase/Word) white, others keep system color ══ */
#pageGematriaEN #geoHistorySection .history-table th:first-child,
#pageHebrewGematria #hebHistorySection .history-table th:first-child {
  color:var(--text-pri) !important;
}

/* ══ Arabic textarea ══ */
.ar-entry-outer {
  display: flex;
  align-items: flex-start;
  gap: .5rem;
  padding: .5rem .8rem;
  background:var(--bg-card);
  border-bottom: 1px solid #131d30;
  box-sizing: border-box;
}
.ar-textarea {
  flex: 1;
  min-width: 0;
  min-height: 42px;
  max-height: 300px;
  background:var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 6px;
  color: var(--text-pri);
  font-family:var(--font-main);
  font-size: .9rem;
  padding: .5rem .9rem;
  direction: rtl;
  text-align: right;
  outline: none;
  resize: none;
  overflow: hidden;
  line-height: 1.6;
  transition: border-color .14s;
}
.ar-textarea:focus {
  border-color: var(--gold);
  box-shadow: 0 0 0 2px rgba(201,168,76,.15);
}
.ar-textarea::placeholder { color: #2a3a5a; }
.ar-entry-btns {
  display: flex;
  flex-direction: column;
  gap: .4rem;
  flex-shrink: 0;
}

/* ── Arabic entry: slightly narrower than full width ── */
#pageGematriaAR .gen-entry-wrap {
  max-width: 800px;
  margin: 0 auto;
}

/* ── EN/HEB entry: same max-width as Arabic ── */
#pageGematriaEN .gen-entry-wrap,
#pageHebrewGematria .gen-entry-wrap,
#pageGreekGematria .gen-entry-wrap,
#pageSlavicGematria .gen-entry-wrap {
  max-width: 800px;
  margin: 0 auto;
}
/* EN/HEB/GRK/SLV Calculate button: gold like Arabic */
#pageGematriaEN .gen-entry-btn,
#pageHebrewGematria .gen-entry-btn,
#pageGreekGematria .gen-entry-btn,
#pageSlavicGematria .gen-entry-btn {
  background: linear-gradient(135deg, var(--gold) 0%, #a07830 100%) !important;
  color: #0a0c10 !important;
  font-family:var(--font-main) !important;
}
#pageGematriaEN .gen-entry-btn:hover,
#pageHebrewGematria .gen-entry-btn:hover,
#pageGreekGematria .gen-entry-btn:hover,
#pageSlavicGematria .gen-entry-btn:hover {
  background: linear-gradient(135deg, #d9bb63, #ad7a2a) !important;
}


.ls-fbtn{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.2);color:#ccc;padding:.35rem .85rem;border-radius:20px;cursor:pointer;font-size:.8rem;font-family:var(--font-main);transition:.15s}
.ls-fbtn:hover{border-color:var(--gold);color:var(--gold);background:rgba(201,168,76,.1)}
.ls-factive{background:var(--gold);border-color:var(--gold);color:#07091a;font-weight:700}

/* ═══════════════════════════════════════════════════════════════
   GEMATRIA RESULT ORDER & ARABIC PARITY — v8
   Every cipher card shows the system name first, then its value.
   Arabic uses the same visual rhythm as English/Hebrew/Greek/Russian,
   while preserving right-to-left reading direction.
═══════════════════════════════════════════════════════════════ */
.result-card,
.geo-result-card,
#pageGematriaAR .result-card,
#pageGematriaEN .geo-result-card,
#pageHebrewGematria .geo-result-card,
#pageGreekGematria .geo-result-card,
#pageSlavicGematria .geo-result-card {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: flex-start !important;
}

/* Explicit visual order: label above value in every language. */
.result-card .rc-name,
.geo-result-card .gl {
  order: 1 !important;
  margin: 0 0 .24rem !important;
}
.result-card .rc-val,
.geo-result-card .gv {
  order: 2 !important;
  margin: 0 !important;
}
.result-card .rc-dr {
  order: 3 !important;
}

/* Arabic result grid/card parity with the other gematria pages. */
#pageGematriaAR #resultsGrid {
  direction: rtl !important;
  align-items: start;
}
#pageGematriaAR .result-card {
  min-height: 70px !important;
  padding: .7rem .4rem .65rem !important;
  text-align: center !important;
  direction: rtl !important;
}
#pageGematriaAR .result-card .rc-name {
  font-family: 'IBM Plex Sans Arabic', 'Amiri', sans-serif !important;
  font-size: .74rem !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
  word-break: normal !important;
  text-align: center !important;
}
#pageGematriaAR .result-card .rc-val {
  font-family: 'Ubuntu Mono', 'IBM Plex Sans Arabic', monospace !important;
  font-size: 1.55rem !important;
  font-weight: 700 !important;
  line-height: 1.1 !important;
  direction: ltr !important;
  unicode-bidi: isolate !important;
}


/* =========================================================
   V9 — GEMATRIA LETTER TABLES: MAXIMUM TWO ROWS
   ========================================================= */

/* Provide clear separation between the preceding results/table and the
   administrator-only global saved-history search panel on every gematria page. */
.admin-global-search-panel {
  margin-top: 1.75rem !important;
}

/* Every alphabet/cipher letter table is constrained to two visual rows.
   Extra letters continue horizontally and remain accessible by scrolling. */
.lcard-grid,
.geo-lcard-grid,
.letter-vals-grid {
  display: grid !important;
  grid-template-rows: repeat(2, auto) !important;
  grid-template-columns: none !important;
  grid-auto-flow: column !important;
  grid-auto-columns: minmax(56px, 1fr) !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  max-width: 100% !important;
  padding-bottom: .4rem;
  scrollbar-width: thin;
  overscroll-behavior-inline: contain;
}

/* Letter-by-letter breakdowns of entered words also never exceed two rows. */
.letters-strip,
.gen-letters-strip {
  display: grid !important;
  grid-template-rows: repeat(2, auto) !important;
  grid-auto-flow: column !important;
  grid-auto-columns: max-content !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  max-width: 100% !important;
  align-items: start;
  padding-bottom: .4rem;
  scrollbar-width: thin;
  overscroll-behavior-inline: contain;
}

/* Preserve each language's reading direction while horizontal scrolling. */
#pageGematriaAR .lcard-grid,
#pageGematriaAR .letter-vals-grid,
#pageGematriaAR .letters-strip,
#pageHebrewGematria .geo-lcard-grid,
#pageHebrewGematria .letter-vals-grid,
#pageHebrewGematria .gen-letters-strip {
  direction: rtl !important;
}

#pageGematriaEN .geo-lcard-grid,
#pageGematriaEN .letter-vals-grid,
#pageGematriaEN .gen-letters-strip,
#pageGreekGematria .geo-lcard-grid,
#pageGreekGematria .letter-vals-grid,
#pageGreekGematria .gen-letters-strip,
#pageSlavicGematria .geo-lcard-grid,
#pageSlavicGematria .letter-vals-grid,
#pageSlavicGematria .gen-letters-strip {
  direction: ltr !important;
}

@media (max-width: 640px) {
  .admin-global-search-panel { margin-top: 1.35rem !important; }
  .lcard-grid,
  .geo-lcard-grid,
  .letter-vals-grid { grid-auto-columns: minmax(52px, 62px) !important; }
}

/* === Gematria word integrity fix: 2026-07-24 v11 === */
#pageGematriaEN .gen-letters-strip,
#pageHebrewGematria .gen-letters-strip,
#pageGreekGematria .gen-letters-strip,
#pageSlavicGematria .gen-letters-strip {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: flex-start !important;
  gap: .75rem 1.15rem !important;
}
#pageGematriaEN .gen-letters-strip,
#pageGreekGematria .gen-letters-strip,
#pageSlavicGematria .gen-letters-strip {
  direction: ltr !important;
  justify-content: flex-start !important;
}
#pageHebrewGematria .gen-letters-strip {
  direction: rtl !important;
  justify-content: flex-start !important;
}
.gem-word-group {
  display: inline-flex !important;
  flex-wrap: nowrap !important;
  align-items: flex-end !important;
  width: max-content !important;
  max-width: none !important;
  white-space: nowrap !important;
  gap: .08rem !important;
  break-inside: avoid !important;
}
.gem-word-group.gem-word-ltr { direction: ltr !important; }
.gem-word-group.gem-word-rtl { direction: rtl !important; }
#pageGematriaEN .gem-word-group .letter-chip,
#pageHebrewGematria .gem-word-group .letter-chip,
#pageGreekGematria .gem-word-group .letter-chip,
#pageSlavicGematria .gem-word-group .letter-chip {
  display: inline-flex !important;
  flex: 0 0 auto !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: flex-end !important;
  background: transparent !important;
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  min-width: 26px !important;
  padding: .15rem .18rem !important;
  margin: 0 !important;
}
#pageGematriaEN .gem-word-group .word-subtotal,
#pageHebrewGematria .gem-word-group .word-subtotal,
#pageGreekGematria .gem-word-group .word-subtotal,
#pageSlavicGematria .gem-word-group .word-subtotal {
  flex: 0 0 auto !important;
  align-self: center !important;
  margin-inline-start: .28rem !important;
  border: none !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* Gematria breakdown: strict empty state — v14
   Keep the breakdown container completely absent until valid calculated content exists. */
#geoBreakdownSection[hidden],
#hebBreakdownSection[hidden],
#grkBreakdownSection[hidden],
#slvBreakdownSection[hidden] {
  display: none !important;
}

/* Gematria result grids: hide only when they contain no result cards — v15
   This is the empty middle frame confirmed in DevTools (geoResultsGrid). */
#geoResultsGrid:empty,
#hebResultsGrid:empty,
#grkResultsGrid:empty,
#slvResultsGrid:empty {
  display: none !important;
}

/* v17: clean cipher letter-value tables — no per-letter frames or highlighting */
.geo-inline-table-wrap .geo-lcard,
.geo-inline-table-wrap .geo-lcard.active {
  border: 0 !important;
  outline: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: .3rem .15rem !important;
}
.geo-inline-table-wrap .geo-lcard::before,
.geo-inline-table-wrap .geo-lcard::after { content: none !important; }
.geo-inline-table-wrap .geo-lcard .gc {
  text-shadow: none !important;
  filter: none !important;
}

/* v18: remove every per-letter frame in all gematria letter-value tables */
.geo-inline-table-wrap .geo-lcard .gc,
.geo-inline-table-wrap .geo-lcard.active .gc {
  display: inline-block !important;
  background: transparent !important;
  border: 0 !important;
  outline: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  min-width: 0 !important;
  width: auto !important;
  height: auto !important;
  overflow: visible !important;
  transform: none !important;
  transition: none !important;
  text-shadow: none !important;
  filter: none !important;
}
.geo-inline-table-wrap .geo-lcard .gc::before,
.geo-inline-table-wrap .geo-lcard .gc::after {
  content: none !important;
  display: none !important;
}
.geo-inline-table-wrap .geo-lcard:hover .gc,
.geo-inline-table-wrap .geo-lcard .gc:hover {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  transform: none !important;
}


/* V25 — unified cipher controls and immutable Arabic built-in tables */
.gematria-cipher-controls {
  direction: ltr !important;
  justify-content: flex-start !important;
  align-items: center !important;
}
#pageGematria .toolbar > .gematria-cipher-controls,
#pageGematriaAR .toolbar > .gematria-cipher-controls,
.container > .toolbar > .gematria-cipher-controls {
  width: 100%;
}
#pageHebrewGematria .gen-topbar {
  direction: ltr !important;
}
#viewerLetterGrid .lv-readonly-value {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 38px;
  width: 100%;
  box-sizing: border-box;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--bg-input);
  color: var(--text-pri);
  font-family: 'Ubuntu Mono', monospace;
  font-size: .95rem;
  cursor: default;
  user-select: text;
}

/* V26 — remove horizontal separator lines from all gematria pages */
#pageGematriaAR header,
#pageGematriaEN header,
#pageHebrewGematria header,
#pageGreekGematria header,
#pageSlavicGematria header,
#pageGematriaAR .gen-topbar,
#pageGematriaEN .gen-topbar,
#pageHebrewGematria .gen-topbar,
#pageGreekGematria .gen-topbar,
#pageSlavicGematria .gen-topbar,
#pageGematriaAR .gen-entry-wrap,
#pageGematriaEN .gen-entry-wrap,
#pageHebrewGematria .gen-entry-wrap,
#pageGreekGematria .gen-entry-wrap,
#pageSlavicGematria .gen-entry-wrap,
#pageGematriaAR .gen-hist-header,
#pageGematriaEN .gen-hist-header,
#pageHebrewGematria .gen-hist-header,
#pageGreekGematria .gen-hist-header,
#pageSlavicGematria .gen-hist-header {
  border-top: none !important;
  border-bottom: none !important;
}

/* ══ توسعة صفحة الكون الأكبر والإنسان الأصغر v46 ══ */
.mc-page{padding-bottom:3rem}.mc-intro-wide{max-width:880px}.mc-section-wide{max-width:1080px}.mc-cosmos-diagram svg{width:min(100%,720px);min-height:280px}.mc-section-lead{max-width:820px;margin:0 auto 1.3rem;text-align:center;color:var(--text-sec);line-height:1.9}.mc-two-col{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}.mc-info-card,.mc-type-card,.mc-cosmic-cards article{background:linear-gradient(145deg,rgba(255,255,255,.025),rgba(201,154,63,.035));border:1px solid var(--border);border-radius:14px;padding:1.15rem 1.25rem}.mc-info-card h3,.mc-type-card h3,.mc-cosmic-cards h3,.mc-layer-content h3{font-family:'Amiri',serif;color:var(--gold-glow);font-size:1.2rem;margin:0 0 .55rem}.mc-info-card p,.mc-type-card p,.mc-cosmic-cards p,.mc-layer-content p{color:var(--text-sec);line-height:1.9;margin:0}.mc-note-box,.mc-final-thought{margin:1rem auto 0;padding:1rem 1.2rem;border-radius:12px;background:rgba(77,208,225,.055);border:1px solid rgba(77,208,225,.22);color:var(--text-sec);line-height:1.9}.mc-type-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}.mc-type-card{position:relative;min-height:175px}.mc-type-card>span{font-family:'JetBrains Mono',monospace;color:rgba(201,154,63,.5);font-size:.72rem}.mc-table-wrap{overflow:auto;border-radius:12px;border:1px solid var(--border)}.mc-table-wrap .mc-summary-table{margin:0;min-width:880px}.mc-expanded-table th,.mc-expanded-table td{padding:.75rem .8rem}.mc-expanded-table tbody tr:nth-child(even),.mc-correspondence-table tbody tr:nth-child(even){background:rgba(255,255,255,.018)}.mc-cosmic-cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.8rem;margin-top:1.2rem}.mc-layer-tabs{display:flex;flex-wrap:wrap;gap:.55rem;justify-content:center;margin:1rem 0}.mc-layer-btn{border:1px solid var(--border);background:var(--bg2);color:var(--text-sec);border-radius:999px;padding:.48rem 1rem;cursor:pointer;font-family:var(--font-main);transition:.18s}.mc-layer-btn:hover,.mc-layer-btn.active{border-color:var(--gold-dim);color:var(--gold-glow);background:rgba(201,154,63,.1)}.mc-layer-stage{display:grid;grid-template-columns:240px 1fr;gap:1.5rem;align-items:center;max-width:900px;margin:1rem auto 0;background:var(--bg2);border:1px solid var(--border);border-radius:16px;padding:1.4rem}.mc-human-silhouette{position:relative;width:170px;height:300px;margin:auto}.mc-head{position:absolute;top:5px;left:58px;width:54px;height:54px;border:2px solid var(--gold-dim);border-radius:50%;background:rgba(201,154,63,.06)}.mc-torso{position:absolute;top:68px;left:48px;width:74px;height:125px;border:2px solid var(--gold-dim);border-radius:42% 42% 25% 25%;background:rgba(77,208,225,.04)}.mc-arm,.mc-leg{position:absolute;border:2px solid var(--gold-dim);border-radius:20px;background:rgba(201,154,63,.035)}.mc-arm{top:75px;width:24px;height:132px}.mc-arm.left{left:15px;transform:rotate(10deg)}.mc-arm.right{right:15px;transform:rotate(-10deg)}.mc-leg{top:186px;width:29px;height:110px}.mc-leg.left{left:48px;transform:rotate(5deg)}.mc-leg.right{right:48px;transform:rotate(-5deg)}.mc-layer-content{min-height:210px}.mc-layer-chips{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1rem}.mc-layer-chips span{border:1px solid rgba(77,208,225,.25);background:rgba(77,208,225,.05);color:#bde8ed;border-radius:999px;padding:.35rem .7rem;font-size:.78rem}.mc-agree-card ul,.mc-diff-card ul{margin:.4rem 0 0;padding-right:1.2rem;color:var(--text-sec);line-height:2}.mc-final-thought{margin-top:1.2rem;text-align:center;font-size:1rem}.mc-final-thought b{color:var(--gold-glow)}
@media(max-width:800px){.mc-type-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.mc-cosmic-cards{grid-template-columns:repeat(2,minmax(0,1fr))}.mc-layer-stage{grid-template-columns:1fr}.mc-human-silhouette{transform:scale(.82);margin-top:-25px;margin-bottom:-25px}}
@media(max-width:560px){.mc-two-col,.mc-type-grid,.mc-cosmic-cards{grid-template-columns:1fr}.mc-cosmos-diagram svg{min-height:220px}.mc-layer-stage{padding:1rem}.mc-section-title{font-size:1.4rem}}

/* ══════════════════════════════════════
   MACROCOSM / MICROCOSM — WIDE TABLES + THEME COLORS v47
══════════════════════════════════════ */
.mc-page{
  max-width:1440px;
  width:100%;
  padding-inline:clamp(1rem,2.4vw,2.5rem);
}
.mc-page .mc-section-wide{max-width:1320px;width:100%}
.mc-page .mc-intro-wide{max-width:980px}
.mc-page .mc-table-wrap{
  width:100%;
  overflow:visible;
  border-radius:12px;
  border:1px solid var(--border);
}
.mc-page .mc-table-wrap .mc-summary-table{
  width:100%;
  min-width:0;
  table-layout:fixed;
  margin:0;
}
.mc-page .mc-summary-table th,
.mc-page .mc-summary-table td{
  white-space:normal;
  overflow-wrap:anywhere;
  word-break:normal;
  vertical-align:top;
  padding:.72rem .68rem;
  line-height:1.65;
}
.mc-page .mc-expanded-table{font-size:clamp(.68rem,.72vw,.82rem)}
.mc-page .mc-expanded-table th:nth-child(1){width:15%}
.mc-page .mc-expanded-table th:nth-child(2){width:18%}
.mc-page .mc-expanded-table th:nth-child(3){width:25%}
.mc-page .mc-expanded-table th:nth-child(4){width:22%}
.mc-page .mc-expanded-table th:nth-child(5){width:20%}
.mc-page .mc-correspondence-table{font-size:clamp(.76rem,.82vw,.9rem)}
.mc-page .mc-correspondence-table th:nth-child(1){width:27%}
.mc-page .mc-correspondence-table th:nth-child(2){width:27%}
.mc-page .mc-correspondence-table th:nth-child(3){width:46%}

/* عناوين ملونة ومتكيفة مع النمط */
.mc-page{--mc-gold:#f0c85b;--mc-cyan:#71d7e5;--mc-violet:#c6a5ff;--mc-rose:#ff9db3;--mc-sage:#9ed7b4;--mc-amber:#f2b86f}
.mc-page .mc-section-title{color:var(--mc-gold)}
.mc-page #mcRelationTypes .mc-section-title{color:var(--mc-cyan)}
.mc-page #mcTraditions .mc-section-title{color:var(--mc-violet)}
.mc-page #mcCorrespondences .mc-section-title{color:var(--mc-rose)}
.mc-page #mcCosmicHuman .mc-section-title{color:var(--mc-sage)}
.mc-page #mcLayers .mc-section-title{color:var(--mc-amber)}
.mc-page #mcAgreement .mc-section-title{color:var(--mc-cyan)}
.mc-page .mc-section-eyebrow{color:color-mix(in srgb,currentColor 78%,var(--text-sec))}
.mc-page .mc-summary-table thead th{color:var(--mc-gold);background:color-mix(in srgb,var(--bg2) 88%,var(--mc-gold) 12%)}
.mc-page .mc-expanded-table thead th:nth-child(2){color:var(--mc-cyan)}
.mc-page .mc-expanded-table thead th:nth-child(3){color:var(--mc-violet)}
.mc-page .mc-expanded-table thead th:nth-child(4){color:var(--mc-rose)}
.mc-page .mc-expanded-table thead th:nth-child(5){color:var(--mc-sage)}

html[data-theme="light"] .mc-page{
  --mc-gold:#795800;
  --mc-cyan:#006878;
  --mc-violet:#6848a5;
  --mc-rose:#9b3854;
  --mc-sage:#286b47;
  --mc-amber:#8a4f00;
}
html[data-theme="light"] .mc-page .mc-summary-table thead th{
  background:color-mix(in srgb,#ffffff 82%,var(--mc-gold) 18%);
}
html[data-theme="light"] .mc-page .mc-summary-table td{color:#35322c}
html[data-theme="light"] .mc-page .mc-table-wrap{border-color:#cfc7b5}

@media (max-width:1100px){
  .mc-page{padding-inline:.8rem}
  .mc-page .mc-expanded-table{font-size:.67rem}
  .mc-page .mc-summary-table th,.mc-page .mc-summary-table td{padding:.55rem .42rem;line-height:1.55}
}
@media (max-width:760px){
  .mc-page .mc-table-wrap{overflow:visible}
  .mc-page .mc-expanded-table{font-size:.58rem}
  .mc-page .mc-correspondence-table{font-size:.66rem}
  .mc-page .mc-summary-table th,.mc-page .mc-summary-table td{padding:.42rem .28rem;line-height:1.45}
  .mc-page .mc-expanded-table th:nth-child(1){width:16%}
  .mc-page .mc-expanded-table th:nth-child(2){width:18%}
  .mc-page .mc-expanded-table th:nth-child(3){width:24%}
  .mc-page .mc-expanded-table th:nth-child(4){width:22%}
  .mc-page .mc-expanded-table th:nth-child(5){width:20%}
}


/* v14-20260729 — Arabic gematria breakdown: keep each word on one row before wrapping */
#pageGematria .letters-strip {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: flex-start !important;
  justify-content: flex-start !important;
  gap: .85rem 1rem !important;
  direction: rtl !important;
}
#pageGematria .gem-word-group {
  display: inline-flex !important;
  flex-wrap: nowrap !important;
  align-items: flex-end !important;
  width: max-content !important;
  max-width: none !important;
  white-space: nowrap !important;
  gap: .18rem !important;
  break-inside: avoid !important;
  direction: rtl !important;
}
#pageGematria .gem-word-group .letter-chip {
  display: inline-flex !important;
  flex: 0 0 auto !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: flex-end !important;
  min-width: 44px !important;
  margin: 0 !important;
}
#pageGematria .gem-word-group .word-subtotal {
  flex: 0 0 auto !important;
  align-self: center !important;
  margin-inline-start: .36rem !important;
}


/* v15-20260729 — ensure consecutive words stay on the same row until width is exhausted */
#pageGematria .letters-strip {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap !important;
  align-items: flex-start !important;
  align-content: flex-start !important;
  justify-content: flex-start !important;
  row-gap: .85rem !important;
  column-gap: 1rem !important;
}
#pageGematria .letters-strip > .gem-word-group {
  display: flex !important;
  flex: 0 0 auto !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  white-space: nowrap !important;
}
#pageGematria .letters-strip > .gem-word-group + .gem-word-group {
  margin-inline-start: 0 !important;
}
#pageGematria .letters-strip > .gem-word-group .letter-chip,
#pageGematria .letters-strip > .gem-word-group .word-subtotal {
  flex: 0 0 auto !important;
}


/* v16-20260729 — Arabic gematria only: words continue on the same row */
#pageGematriaAR .letters-strip {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap !important;
  align-items: flex-start !important;
  align-content: flex-start !important;
  justify-content: flex-start !important;
  grid-template-rows: none !important;
  grid-auto-flow: unset !important;
  grid-auto-columns: unset !important;
  overflow-x: visible !important;
  overflow-y: visible !important;
  width: 100% !important;
  max-width: 100% !important;
  direction: rtl !important;
  row-gap: .85rem !important;
  column-gap: 1rem !important;
}
#pageGematriaAR .letters-strip > .gem-word-group {
  display: inline-flex !important;
  flex: 0 0 auto !important;
  flex-wrap: nowrap !important;
  align-items: flex-end !important;
  width: auto !important;
  max-width: none !important;
  white-space: nowrap !important;
  direction: rtl !important;
  gap: .18rem !important;
  break-inside: avoid !important;
}
#pageGematriaAR .letters-strip > .gem-word-group .letter-chip,
#pageGematriaAR .letters-strip > .gem-word-group .word-subtotal {
  flex: 0 0 auto !important;
}


/* v17-20260730 — auth login icon button gold and correctly oriented */
#navAuthBtn.nav-auth-icon-btn{display:inline-flex!important;align-items:center!important;gap:.28rem!important;color:var(--gold)!important;background:transparent!important;border:1px solid rgba(201,168,76,.35)!important;padding:.38rem .82rem!important;border-radius:8px!important}
#navAuthBtn.nav-auth-icon-btn .auth-user-icon{font-size:1rem;line-height:1;transform:none!important;color:var(--gold)!important}
#navAuthBtn.nav-auth-icon-btn .auth-plus{font-size:.88rem;font-weight:900;margin-inline-start:-.18rem;color:var(--gold)!important}
#navAuthBtn.nav-auth-icon-btn .auth-login-text{font-weight:700;color:var(--gold)!important}
#navAuthBtn.nav-auth-icon-btn .auth-enter-icon{font-size:1.05rem;line-height:1;color:var(--gold)!important;transform:none!important}


/* Bible reader expansion v19 */
#pageGenesis{--gns-font-scale:1}
.gns-subtabs{display:flex;justify-content:center;gap:.45rem;flex-wrap:wrap;margin:1rem 0}
.gns-subtab,.gns-view-toggle button{border:1px solid var(--border);background:var(--bg-card);color:var(--text-sec);border-radius:8px;padding:.55rem .9rem;cursor:pointer;font-family:var(--font-main);font-weight:700}
.gns-subtab.on,.gns-view-toggle button.on{color:#10131b;background:var(--gold);border-color:var(--gold)}
.gns-pane{display:none}.gns-pane.on{display:block}
.gns-display-controls{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap}
.gns-display-controls h2{margin:0!important}.gns-view-toggle{display:flex;gap:.35rem;flex-wrap:wrap}.gns-font-controls{display:flex;align-items:center;gap:.4rem}.gns-font-controls button{width:2rem;height:2rem;border-radius:7px;border:1px solid var(--border);background:var(--bg2);color:var(--gold);cursor:pointer}
#pageGenesis[data-gns-view="original"] .gns-ar-row{display:none!important}
#pageGenesis[data-gns-view="arabic"] .gns-verse-row{display:none!important}
#pageGenesis .gns-verse-row{font-size:calc(1em * var(--gns-font-scale))}
#pageGenesis .gns-ar-row{font-size:calc(.92rem * var(--gns-font-scale))}
.gns-busy{display:none;align-items:center;justify-content:center;gap:.5rem;margin:.5rem auto;padding:.55rem .85rem;width:max-content;max-width:90%;border:1px solid rgba(201,168,76,.35);border-radius:8px;background:rgba(201,168,76,.08);color:var(--gold);font-weight:700}
.gns-hourglass{display:inline-block;animation:gnsHourglass 1.1s linear infinite}@keyframes gnsHourglass{to{transform:rotate(180deg)}}
.gns-book-summary{display:grid;grid-template-columns:repeat(auto-fit,minmax(135px,1fr));gap:.6rem;margin-bottom:1rem}.gns-book-summary>div{padding:.75rem;border:1px solid var(--border);border-radius:9px;text-align:center;background:var(--bg2)}.gns-book-summary span{display:block;color:var(--text-muted);font-size:.72rem;margin-bottom:.2rem}.gns-book-summary b{font-size:1.05rem;color:var(--gold-glow)}
.gns-stats-table-wrap{overflow:auto}.gns-stats-table{width:100%;border-collapse:collapse;min-width:700px}.gns-stats-table th,.gns-stats-table td{padding:.6rem .55rem;text-align:center;border-bottom:1px solid var(--border)}.gns-stats-table th{color:var(--gold);background:var(--bg2);position:sticky;top:0}.gns-stats-table tbody tr{cursor:pointer}.gns-stats-table tbody tr:hover{background:rgba(201,168,76,.08)}
#gnsSearchPaneMount>.gns-panel{margin:0;padding:0;border:none;background:transparent;box-shadow:none}#gnsSearchPaneMount>#gnsDetail{margin-top:1rem;padding:1rem;border:1px solid var(--border);border-radius:10px}
@media(max-width:700px){.gns-display-controls{justify-content:center;text-align:center}.gns-display-controls h2{width:100%}}


/* Bible word dictionary v20 */
.gns-dict-head{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;flex-wrap:wrap;margin-bottom:.8rem}.gns-dict-head h2{margin:0 0 .2rem!important}.gns-dict-head p{margin:0;color:var(--text-muted);font-size:.8rem}.gns-dict-export{border:1px solid var(--gold);background:rgba(201,168,76,.1);color:var(--gold);border-radius:8px;padding:.5rem .8rem;cursor:pointer;font-weight:800}.gns-dict-controls{display:grid;grid-template-columns:minmax(220px,1fr) minmax(180px,260px);gap:.6rem;margin-bottom:.8rem}.gns-dict-controls input,.gns-dict-controls select{width:100%;border:1px solid var(--border);border-radius:8px;background:var(--bg2);color:var(--text-pri);padding:.65rem .75rem;font-family:var(--font-main)}.gns-dict-table-wrap{overflow:auto}.gns-dict-table{width:100%;min-width:760px;border-collapse:collapse}.gns-dict-table th,.gns-dict-table td{text-align:center;padding:.62rem .55rem;border-bottom:1px solid var(--border)}.gns-dict-table th{position:sticky;top:0;background:var(--bg2);color:var(--gold);z-index:1}.gns-dict-table tbody tr{cursor:pointer}.gns-dict-table tbody tr:hover{background:rgba(201,168,76,.08)}.gns-dict-word{font-size:1rem;font-weight:700;direction:auto}.gns-dict-word small{display:block;color:var(--text-muted);font-size:.65rem;margin-top:.12rem;font-weight:500}@media(max-width:700px){.gns-dict-controls{grid-template-columns:1fr}}


/* Bible panes v22 — static statistics/dictionary rows */
#pageGenesis .gns-stats-table tbody tr,
#pageGenesis .gns-dict-table tbody tr{cursor:default!important}
#pageGenesis .gns-stats-table tbody tr:hover,
#pageGenesis .gns-dict-table tbody tr:hover{transform:none!important}
#pageGenesis .gns-pane h2 span{color:var(--gold,#c9a84c);font-weight:800}


/* Bible layout v23 — selector above all secondary tabs */
#pageGenesis .gns-selector-panel{margin:.9rem 0 0;padding:1rem 1.1rem;border-color:rgba(201,168,76,.32);background:linear-gradient(180deg,rgba(201,168,76,.045),transparent)}
#pageGenesis .gns-selector-panel h2{margin:0 0 .75rem!important;text-align:center;color:var(--gold)!important;font-size:1rem!important}
#pageGenesis .gns-selector-grid{display:grid;grid-template-columns:minmax(240px,1.8fr) minmax(90px,.55fr) minmax(90px,.55fr) auto auto;gap:.6rem;align-items:end;direction:rtl}
#pageGenesis .gns-selector-grid>div{display:flex;flex-direction:column;gap:.3rem}
#pageGenesis .gns-selector-grid label{font-size:.72rem;color:var(--text-muted);text-align:center;font-weight:700}
#pageGenesis .gns-selector-grid select{width:100%;height:2.55rem;background:var(--bg2);border:1px solid var(--border);border-radius:8px;padding:.45rem .65rem;color:var(--text-pri);font-family:var(--font-main);font-size:.9rem}
#pageGenesis .gns-selector-go,#pageGenesis .gns-selector-clear{height:2.55rem;min-width:74px;border-radius:8px;padding:.4rem .75rem;font-family:var(--font-main);font-weight:800;cursor:pointer}
#pageGenesis .gns-selector-go{background:var(--gold);border:1px solid var(--gold);color:#11131a}
#pageGenesis .gns-selector-clear{background:transparent;border:1px solid var(--border);color:var(--text-sec)}
#pageGenesis .gns-subtabs{margin:.7rem 0 1rem}

/* Improved dictionary search control */
#pageGenesis .gns-dict-search-row{display:grid!important;grid-template-columns:minmax(180px,1fr) auto 2.35rem;gap:.4rem;align-items:stretch}
#pageGenesis .gns-dict-search-row input{height:2.65rem!important;border-color:rgba(201,168,76,.28)!important}
#pageGenesis .gns-dict-search-btn{height:2.65rem;display:inline-flex;align-items:center;justify-content:center;gap:.35rem;min-width:88px;border:1px solid var(--gold);border-radius:8px;background:var(--gold);color:#11131a;font-family:var(--font-main);font-weight:900;cursor:pointer;padding:.4rem .85rem}
#pageGenesis .gns-dict-search-btn span{font-size:1.15rem;line-height:1}
#pageGenesis .gns-dict-search-btn:hover{filter:brightness(1.08);transform:translateY(-1px)}
#pageGenesis .gns-dict-reset-btn{height:2.65rem;width:2.35rem;border:1px solid var(--border);border-radius:8px;background:var(--bg2);color:var(--text-muted);font-size:1.2rem;cursor:pointer}
#pageGenesis .gns-dict-reset-btn:hover{color:var(--gold);border-color:var(--gold)}
@media(max-width:760px){#pageGenesis .gns-selector-grid{grid-template-columns:1fr 1fr}#pageGenesis .gns-selector-book{grid-column:1/-1}#pageGenesis .gns-selector-go,#pageGenesis .gns-selector-clear{width:100%}}