/* ============================================================
   FarooqStars 2.0 — observatory/assets/obs-site.css   (v3 · 7 Oct 2026 · K1 repair round 7: menu quiet label --menu-quiet + desktop menu size · v2 · 7 Oct 2026 · FA-001 Observatory colours: the Observatory lines at the end use site variables · v1 Observatory build, AI1-Claude1)
   The SITE header, menu (drawer) and footer on the Observatory pages — copied rule-for-rule from
   assets/css/fs-design.css (v20) but scoped to the shell elements only, so the site's general rules
   (.card, .chip, .wrap, inputs…) never touch the Observatory's own design. The 3D/graphics CSS
   (assets/celestial.css) is not touched. When fs-design.css changes its header/drawer/footer rules,
   copy the same lines here.
   Plus: the ONE site font (Farooq 21 Sep 2026: Naskh, a little larger) and the RTL number law.
   ============================================================ */
@font-face{font-family:'FS Urdu';font-style:normal;font-weight:400;font-display:swap;size-adjust:112%;
  src:url(../../assets/fonts/noto-naskh-arabic-arabic-400-normal.woff2) format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}
@font-face{font-family:'FS Urdu';font-style:normal;font-weight:700;font-display:swap;size-adjust:112%;
  src:url(../../assets/fonts/noto-naskh-arabic-arabic-700-normal.woff2) format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}

/* site tokens — only inside the shell parts */
.fs-header,.fs-drawer,.fs-overlay,.fs-footer{
  --bg:#070d1e; --bg2:#0c1530; --card:#0f1a33; --card2:#152039;
  --line:#2c4070; --ink:#f3eee5; --muted:#93a0bc;
  --gold:#d9b36c; --gold-ink:#231903;
  --pur:#a796ec;  --pur-ink:#120e28;
  --green:#5fc08a; --warn:#ebb552; --red:#f08b8b; --cool:#7fb0f0;
  --chipbg:#131e39; --shadow:0 14px 34px rgba(0,0,0,.5);
  --focus:#f4dda8;
  --menu-quiet:#93a0bc;   /* K1 round 7: quiet menu section label (Site) — 6.58:1 on the drawer card */
  /* the fixed 12 sign colours (same in both themes) */
  --sign1:#ff5e5e; --sign2:#4fc76f; --sign3:#ffd35e; --sign4:#6fd3ff;
  --sign5:#ff9f45; --sign6:#9fd06c; --sign7:#ff8fc0; --sign8:#e34f6f;
  --sign9:#b18cff; --sign10:#8fa3b8; --sign11:#5ec9e8; --sign12:#7fe0c3;
  --radius:16px; --radius-s:10px;
  /* ---------- v78: مینو کے نشانوں کے رنگ ----------
     ہر لنک کا اپنا رنگ۔ روشن theme کے لیے وہی رنگ گہرے کر کے رکھے ہیں —
     ورنہ سفید کارڈ پر ہلکا رنگ نظر ہی نہیں آتا (ناپ کر دیکھا: کچھ نشان
     1.29:1 پر تھے، یعنی تقریباً غائب)۔ اب دونوں theme میں کم از کم 3.8:1۔ */
  --ic-gold:#d9b36c; --ic-red:#ef7a7a; --ic-green:#63c98d; --ic-amber:#f0d074;
  --ic-sky:#74c8ee; --ic-orange:#ef9f66; --ic-lime:#a8cd7c; --ic-pink:#f09ac4;
  --ic-crimson:#e5738f; --ic-violet:#c78ce9; --ic-slate:#95a8c6; --ic-cyan:#4ec7d2;
  --ic-teal:#79d8bd; --ic-blue:#7fb0f0; --ic-purple:#a796ec; --ic-warn:#ebb552;
  --ic-emerald:#54cba6;
  --accent:var(--gold); --accent-ink:var(--gold-ink);
}
html[data-theme="light"] .fs-header,html[data-theme="light"] .fs-drawer,html[data-theme="light"] .fs-overlay,html[data-theme="light"] .fs-footer{
  --bg:#f7f4ec; --bg2:#efe9db; --card:#ffffff; --card2:#faf7f0;
  --line:#cbbc99; --ink:#16233f; --muted:#4d5b76;
  --gold:#8a6410; --gold-ink:#fffdf5;
  --pur:#4a3fb0;  --pur-ink:#f7f5ff;
  --green:#0c7a55; --warn:#8c5a08; --red:#b83232; --cool:#1d5ac0;
  --chipbg:#f3ecdf; --shadow:0 10px 24px rgba(20,32,60,.14);
  --focus:#8a6410;
  --menu-quiet:#4d5b76;   /* K1 round 7: quiet menu section label in day — 6.83:1 on white (was gold at .6 opacity = 2.48:1) */
  /* وہی رنگ، مگر سفید پر پڑھے جانے کے قابل (v78) */
  --ic-gold:#8a6410; --ic-red:#b83232; --ic-green:#1e8028; --ic-amber:#736e00;
  --ic-sky:#046d9c; --ic-orange:#bd4a02; --ic-lime:#4f7a22; --ic-pink:#b81b58;
  --ic-crimson:#a81239; --ic-violet:#6740c9; --ic-slate:#4d6076; --ic-cyan:#0d7089;
  --ic-teal:#0b7268; --ic-blue:#1d5ac0; --ic-purple:#4a3fb0; --ic-warn:#a06828;
  --ic-emerald:#067e3e;
}
.icon{display:inline-flex;width:1.35em;height:1.35em;vertical-align:-0.28em;color:inherit}
.icon svg{width:100%;height:100%}
.icon.gold{color:var(--gold)} .icon.pur{color:var(--pur)} .icon.accent{color:var(--accent)}

/* ---------- shell: header ---------- */
.fs-header{position:sticky;top:0;z-index:90;border-bottom:1px solid var(--line);
  background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(10px)}
.fs-hrow{max-width:1180px;margin:0 auto;display:flex;align-items:center;gap:10px;padding:8px 14px}
.fs-brand{display:flex;align-items:center;gap:9px;font-weight:600;font-size:16.5px;color:var(--ink);flex:1;min-width:0}
.fs-brand .icon{width:1.6em;height:1.6em;color:var(--gold)}
.fs-brand small{display:block;font-size:10.5px;color:var(--muted);font-weight:400;line-height:1.6}
.fs-tools{display:flex;align-items:center;gap:6px}
.fs-iconbtn{cursor:pointer;border:1px solid var(--line);background:var(--card);color:var(--ink);
  border-radius:12px;width:38px;height:38px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.fs-iconbtn:hover{border-color:var(--accent)}
.fs-iconbtn .icon{width:1.25em;height:1.25em}
.fs-langsel{border:1px solid var(--line);background:var(--card);color:var(--ink);
  border-radius:12px;height:38px;padding:0 10px;font-family:inherit;font-size:13px}
/* v36 (21 ستمبر ٢٠٢٦) — زبان کا dropdown جھنڈوں کے ساتھ (fs-shell.js) */
.fs-langpick{position:relative}
.fs-langpick .fs-langsel{display:inline-flex;align-items:center;gap:7px;cursor:pointer}
.fs-langpick .fs-langsel:hover{border-color:var(--accent)}
.fs-langcaret{font-size:10px;color:var(--muted)}
.fs-langlist{position:absolute;top:calc(100% + 4px);inset-inline-end:0;z-index:60;margin:0;padding:4px;
  list-style:none;min-width:160px;background:var(--card);border:1px solid var(--line);border-radius:12px;
  box-shadow:0 8px 24px rgba(0,0,0,.18)}
.fs-langlist[hidden]{display:none}
.fs-langopt{display:flex;align-items:center;gap:9px;width:100%;padding:7px 10px;border:0;border-radius:8px;
  background:transparent;color:var(--ink);font-family:inherit;font-size:14px;cursor:pointer;text-align:start}
.fs-langopt:hover,.fs-langopt:focus-visible{background:var(--line)}
.fs-langopt.on{font-weight:700;color:var(--accent)}
.fs-langpick img.fsflag.fsflag{margin:0}
/* v61: پٹی کی نچلی سطر — ایک طرف تنبیہ، دوسری طرف آج کی تاریخ (عیسوی + ہجری) */
.fs-disc{max-width:1180px;margin:0 auto;padding:2px 14px 6px;font-size:11px;color:var(--muted);
  display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;justify-content:space-between}
.fs-disc .fs-dateline{white-space:nowrap;color:var(--muted)}
.fs-disc .fs-dateline b{color:var(--gold);font-weight:600}
@media(max-width:560px){ .fs-disc{justify-content:center;text-align:center;gap:2px} .fs-disc .fs-dateline{white-space:normal} }   /* FA-001 round 4 (7 Oct 2026): long date lines (ml…) wrap on phones instead of pushing the page sideways */

/* ---------- shell: drawer ---------- */
.fs-overlay{position:fixed;inset:0;background:rgba(8,5,20,.55);z-index:95;opacity:0;pointer-events:none;transition:opacity .2s}
.fs-overlay.open{opacity:1;pointer-events:auto}
.fs-drawer{position:fixed;top:0;bottom:0;inset-inline-start:0;width:min(320px,86vw);z-index:96;
  background:var(--card);border-inline-end:1px solid var(--line);box-shadow:var(--shadow);
  transform:translateX(calc(var(--drawer-dir,1) * -104%));transition:transform .22s ease;
  overflow-y:auto;padding:14px}
html[dir="rtl"] .fs-drawer{--drawer-dir:-1}
html[dir="ltr"] .fs-drawer{--drawer-dir:1}
.fs-drawer.open{transform:none}
.fs-dhead{display:flex;align-items:center;gap:8px;margin-bottom:8px}
.fs-dhead b{flex:1}
.fs-cat{margin:12px 0 4px;font-size:12px;color:var(--accent);letter-spacing:.4px}
.fs-link{display:flex;align-items:center;gap:10px;padding:7px 10px;border-radius:12px;color:var(--ink);font-size:14px}
.fs-link:hover{background:var(--card2);color:var(--ink)}
.fs-link.active{background:var(--card2);border:1px solid var(--accent)}
.fs-link .icon{color:var(--muted)}
.fs-link:hover .icon{color:var(--accent)}

/* ---------- shell: footer ---------- */
.fs-footer{margin-top:44px;border-top:1px solid var(--line);padding:18px 16px 30px;
  text-align:center;color:var(--muted);font-size:13px}
.fs-footer .fs-links{display:flex;flex-wrap:wrap;gap:14px;justify-content:center;margin:6px 0 10px}
.fs-footer a{color:var(--muted)} .fs-footer a:hover{color:var(--accent)}

.fsflag{display:inline-block;min-width:1.9em;padding:0 .3em;margin-inline-end:.35em;
  border:1px solid var(--line);border-radius:3px;background:var(--card2,transparent);
  font:600 .72em/1.5 ui-monospace,SFMono-Regular,Menlo,monospace;
  letter-spacing:.04em;color:var(--muted);vertical-align:.05em;text-align:center}

img.fsflag.fsflag{margin:0}
/* v61: پٹی کی نچلی سطر — ایک طرف تنبیہ، دوسری طرف آج کی تاریخ (عیسوی + ہجری) */
.fs-disc{max-width:1180px;margin:0 auto;padding:2px 14px 6px;font-size:11px;color:var(--muted);
  display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;justify-content:space-between}
.fs-disc .fs-dateline{white-space:nowrap;color:var(--muted)}
.fs-disc .fs-dateline b{color:var(--gold);font-weight:600}
@media(max-width:560px){ .fs-disc{justify-content:center;text-align:center;gap:2px} .fs-disc .fs-dateline{white-space:normal} }   /* FA-001 round 4 (7 Oct 2026): long date lines (ml…) wrap on phones instead of pushing the page sideways */

/* ---------- shell: drawer ---------- */
.fs-overlay{position:fixed;inset:0;background:rgba(8,5,20,.55);z-index:95;opacity:0;pointer-events:none;transition:opacity .2s}
.fs-overlay.open{opacity:1;pointer-events:auto}
.fs-drawer{position:fixed;top:0;bottom:0;inset-inline-start:0;width:min(320px,86vw);z-index:96;
  background:var(--card);border-inline-end:1px solid var(--line);box-shadow:var(--shadow);
  transform:translateX(calc(var(--drawer-dir,1) * -104%));transition:transform .22s ease;
  overflow-y:auto;padding:14px}
html[dir="rtl"] .fs-drawer{--drawer-dir:-1}
html[dir="ltr"] .fs-drawer{--drawer-dir:1}
.fs-drawer.open{transform:none}
.fs-dhead{display:flex;align-items:center;gap:8px;margin-bottom:8px}
.fs-dhead b{flex:1}
.fs-cat{margin:12px 0 4px;font-size:12px;color:var(--accent);letter-spacing:.4px}
.fs-link{display:flex;align-items:center;gap:10px;padding:7px 10px;border-radius:12px;color:var(--ink);font-size:14px}
.fs-link:hover{background:var(--card2);color:var(--ink)}
.fs-link.active{background:var(--card2);border:1px solid var(--accent)}
.fs-link .icon{color:var(--muted)}
.fs-link:hover .icon{color:var(--accent)}

/* ---------- shell: footer ---------- */
.fs-footer{margin-top:44px;border-top:1px solid var(--line);padding:18px 16px 30px;
  text-align:center;color:var(--muted);font-size:13px}
.fs-footer .fs-links{display:flex;flex-wrap:wrap;gap:14px;justify-content:center;margin:6px 0 10px}
.fs-footer a{color:var(--muted)} .fs-footer a:hover{color:var(--accent)}

/* ---------- degree + RTL law ---------- */
.deg{direction:ltr;unicode-bidi:isolate;font-family:Montserrat,Inter,Arial,sans-serif;white-space:nowrap}

/* ---------- sign colour helpers ---------- */
.s1{color:var(--sign1)}.s2{color:var(--sign2)}.s3{color:var(--sign3)}.s4{color:var(--sign4)}
.s5{color:var(--sign5)}.s6{color:var(--sign6)}.s7{color:var(--sign7)}.s8{color:var(--sign8)}
.s9{color:var(--sign9)}.s10{color:var(--sign10)}.s11{color:var(--sign11)}.s12{color:var(--sign12)}

/* ---------- responsive ---------- */
@media(max-width:900px){ .grid3,.grid4{grid-template-columns:1fr 1fr} }
@media(max-width:640px){
  body{overflow-x:hidden}
  .grid2,.grid3,.grid4{grid-template-columns:1fr}
  .fs-brand small{display:none}
  /* v60: نام پٹی سے باہر نہ نکلے — اوپر کے بٹن اب ایک زیادہ ہیں (💍) */
  .fs-brand > span:not(.icon){overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
  .fs-hrow{gap:7px;padding:8px 10px}
  .fs-tools{gap:5px}
}
@media(max-width:430px){
  .fs-brand > span:not(.icon){display:none}   /* صرف نشان رہے، نام صفحے پر ویسے بھی ہے */
}
@media (prefers-reduced-motion: reduce){
  *{transition:none !important;animation:none !important}
}

/* ---------- personal report (v2) ---------- */
.rp-cover{display:flex;align-items:center;gap:12px;padding:12px;border-radius:14px;margin-bottom:10px;
  background:linear-gradient(135deg,color-mix(in srgb,var(--accent) 16%,var(--card2)),var(--card2));
  border:1px solid var(--accent)}
.rp-title{font-size:17px;font-weight:600}
.rp-sec{border:1px dashed var(--line);border-inline-start:3px solid var(--accent);border-radius:12px;padding:8px 12px;margin:8px 0}
.rp-sechead{font-weight:600;font-size:15px}
.rp-house{border:1px solid var(--line);border-inline-start:4px solid var(--hc,var(--line));border-radius:12px;
  padding:8px 12px;margin:8px 0;background:color-mix(in srgb,var(--hc,transparent) 4%,var(--card))}
.rp-hhead{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.rp-hn{width:24px;height:24px;border-radius:50%;background:var(--hc);color:#141021;font-family:Montserrat;
  font-weight:800;font-size:12px;display:inline-flex;align-items:center;justify-content:center}
.rp-cite{margin:5px 0;line-height:2.05;font-size:13.2px}
.rp-pl{margin:7px 0 7px 0;padding-inline-start:10px;border-inline-start:2px dotted var(--line)}
.rp-plhead{display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.rp-lord{margin-top:5px;padding:5px 9px;border-radius:9px;background:color-mix(in srgb,var(--pur) 8%,var(--card2))}
.rp-more summary{cursor:pointer;color:var(--cool);font-size:12px}
.rp-yrow{border:1px solid var(--line);border-radius:12px;padding:8px 12px;margin:8px 0}
.rp-yhead{display:flex;align-items:center;gap:8px;font-size:14.5px;margin-bottom:4px}
.rp-seg{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:5px 0;border-top:1px dashed var(--line);font-size:12.8px}
.rp-seg:first-of-type{border-top:none}
@media print{
  .fs-header,.fs-footer,.fs-drawer,.fs-overlay,.no-print,.fs-disc{display:none !important}
  body{background:#fff !important;color:#222}
  .card,.rp-house,.rp-yrow{box-shadow:none !important}
}

.rp-eyes{margin-top:5px;padding:4px 9px;border-radius:9px;background:color-mix(in srgb,var(--cool) 8%,var(--card2))}

/* شہر کی تلاش کے نتائج — جھنڈے کے ساتھ */
#fbResults{display:flex;flex-direction:column;gap:4px;margin-top:6px}
#fbResults .mini{padding:2px 0}
.fb-cityopt{display:flex;align-items:center;gap:8px;width:100%;padding:6px 10px;font:inherit;font-size:12.5px;
  text-align:start;color:var(--ink);background:var(--card2);border:1px solid var(--line);border-radius:9px;cursor:pointer}
.fb-cityopt:hover{border-color:var(--gold);background:color-mix(in srgb,var(--gold) 7%,var(--card2))}
body[data-accent="vedic"] .fb-cityopt:hover{border-color:var(--pur);background:color-mix(in srgb,var(--pur) 7%,var(--card2))}
.fb-cityopt img{border-radius:2px;flex:none}

/* 🤖 خلاصہ (AI briefing) */
.rp-brief{background:color-mix(in srgb,var(--gold) 5%,var(--card2))}
body[data-accent="vedic"] .rp-brief{background:color-mix(in srgb,var(--pur) 6%,var(--card2))}

/* 🕰️ ومشوتری دشا */
.rp-dnow{display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin:8px 0}
.rp-dmaha{border:1px solid var(--line);border-radius:11px;margin:7px 0;padding:7px 11px;background:var(--card2)}
.rp-dmaha.cur{border-color:var(--pur);background:color-mix(in srgb,var(--pur) 8%,var(--card2))}
.rp-dmaha summary{cursor:pointer;display:flex;align-items:center;gap:8px;flex-wrap:wrap;list-style-position:outside}
.rp-antar{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;margin-top:8px}
.rp-antar .an{border:1px dashed var(--line);border-radius:8px;padding:4px 8px;font-size:11.5px;display:flex;gap:5px;align-items:center;flex-wrap:wrap}
.rp-antar .an.cur{border-style:solid;border-color:var(--pur);background:color-mix(in srgb,var(--pur) 12%,var(--card2));color:var(--pur)}

/* 📊 سولہ تقسیمی نقشے (varga D1–D60) */
.rp-vgrid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:8px}
.rp-vcard{border:1px solid var(--line);border-radius:12px;padding:9px 11px;background:var(--card2)}
.rp-vcard h4{margin:0 0 6px;display:flex;gap:7px;align-items:baseline;flex-wrap:wrap;font-size:13.5px}
.rp-vcard .vbox svg{display:block;margin:0 auto}
.rp-vstr th,.rp-vstr td{text-align:center}
.rp-vstr th:first-child,.rp-vstr td:first-child{text-align:start}
@media(max-width:760px){.rp-vgrid{grid-template-columns:1fr}.rp-antar{grid-template-columns:1fr 1fr}}

/* جھنڈے کا خانہ — flagcdn کی جگہ، صفر بیرونی درخواست (v85)
   v88 سے یہ صرف **پچھلا سہارا** ہے: جس ملک کی SVG فائل نہیں، اُس کا کوڈ
   اِسی خانے میں دکھتا ہے۔ باقی سب جگہ نیچے والا `img.fsflag` چلتا ہے۔ */
.fsflag{display:inline-block;min-width:1.9em;padding:0 .3em;margin-inline-end:.35em;
  border:1px solid var(--line);border-radius:3px;background:var(--card2,transparent);
  font:600 .72em/1.5 ui-monospace,SFMono-Regular,Menlo,monospace;
  letter-spacing:.04em;color:var(--muted);vertical-align:.05em;text-align:center}

/* اصل جھنڈا — اپنی چھت سے (v88 · v89 میں پہرہ لگا)
   ⚠ `min-width` اور `padding` یہاں **صفر** ہونے چاہییں، ورنہ اوپر والا
   خانے والا اصول تصویر پر بھی لگ کر اُسے کھینچ دیتا ہے۔
   ⚠ `width/height` HTML میں بھی لکھے ہیں (٢٠×١٥) — تصویر آنے پر سطر ہلے نہیں۔

   ⚠⚠ **class دو بار کیوں لکھی ہے؟** (`img.fsflag.fsflag`)
   یہ چال جان بوجھ کر ہے، اور اِس کی ایک اصل وجہ ہے۔ v88 میں جھنڈا `<span>`
   سے `<img>` بنا۔ صفحوں میں پہلے سے ایسے اصول لکھے ہوئے تھے:

        .frline img { width:34px; height:34px; border-radius:50% }

   یعنی «اِس ڈبے کی **ہر** تصویر گول اور بڑی»۔ پہلے جھنڈا تصویر نہیں تھا سو
   بچ جاتا تھا؛ اب وہ اصول جھنڈے پر بھی لگ گیا اور فاروق کو ارکان کی فہرست
   میں **بڑے گول جھنڈے** دکھنے لگے (٢٦ جولائی، اُنہی نے پکڑا)۔
   `.frline img` کا وزن `img.fsflag` کے برابر ہے، اور صفحے کا CSS بعد میں
   آتا ہے — سو وہ جیت جاتا تھا۔ class دو بار لکھنے سے وزن بڑھ جاتا ہے اور
   کوئی صفحہ **غلطی سے** جھنڈے کی ناپ نہیں بدل سکتا۔

   ✅ اور جان بوجھ کر بدلنے کا راستہ کھلا ہے — `!important` نہیں لگایا:
        .locline { --fsflag-w:24px; --fsflag-h:18px }
   یعنی «حادثہ» رُک گیا، «ارادہ» نہیں۔ */
img.fsflag.fsflag{min-width:0;padding:0;
  width:var(--fsflag-w,20px);height:var(--fsflag-h,15px);object-fit:cover;
  border:1px solid var(--line);border-radius:2px;background:transparent;
  vertical-align:-.15em;flex:0 0 auto}


.fs-footer .mini{font-size:13px;color:var(--muted)}
.fs-footer .ltr{direction:ltr;unicode-bidi:isolate}
@media(max-width:640px){
  body{overflow-x:hidden}   /* the same rule the site uses (fs-design.css) */
  .fs-brand .icon{min-width:0;overflow:hidden}   /* the logo may shrink like on the site pages, so the header fits 360 px */
  .fs-brand .icon svg{min-width:0;flex:0 1 auto}
  .fs-brand small{display:none}
  .fs-brand > span:not(.icon){overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
  .fs-hrow{gap:7px;padding:8px 10px}
  .fs-tools{gap:5px}
}
@media(max-width:430px){ .fs-brand > span:not(.icon){display:none} }
/* scan 29 Oct #3/#8 — the same as fs-design.css: under 430px the language button shows only its flag
   (the name stays for screen readers) and the header keeps one row at 360px */
@media(max-width:430px){
  .fs-hrow{gap:5px}
  .fs-tools{gap:4px}
  .fs-homebtn + .fs-brand{visibility:hidden}   /* the Home button beside it already goes home; a squeezed logo was only a dot */
  .fs-langsel{padding:0 8px}
  .fs-langsel > span[lang]{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
}
/* scan 29 Oct #84: anchors land below the sticky header (--fs-header-h from fs-shell.js) */
[id]{scroll-margin-top:calc(var(--fs-header-h,0px) + 8px)}
@media print{ .fs-header,.fs-footer,.fs-drawer,.fs-overlay,.fs-disc,.fs-nav{display:none !important} }

/* the Observatory's own element rules (header{…}, footer{…}, button{…}) must not restyle the site shell */
header.fs-header{display:block;margin:0;gap:0;flex-wrap:nowrap;align-items:normal}
footer.fs-footer{margin-top:44px;padding:18px 16px 30px;border-top:1px solid var(--line);display:block;font-size:13px;color:var(--muted)}
.fs-header button,.fs-drawer button{font-family:inherit;line-height:normal;transition:none}
.fs-header .fs-iconbtn,.fs-drawer .fs-iconbtn{padding:0;font-size:inherit;background:var(--card);border:1px solid var(--line);color:var(--ink);border-radius:12px}
.fs-header .fs-iconbtn:hover,.fs-drawer .fs-iconbtn:hover{background:var(--card);border-color:var(--accent)}
.fs-header .fs-langsel{padding:0 10px;font-size:13px;background:var(--card);border:1px solid var(--line);color:var(--ink);border-radius:12px}
.fs-header .fs-langopt{padding:7px 10px;font-size:14px;background:transparent;border:0;border-radius:8px;color:var(--ink)}
.fs-header .fs-langopt:hover{background:var(--line)}
.fs-header .fs-langopt.on{background:transparent;color:var(--accent);font-weight:700}
.fs-header a,.fs-drawer a,.fs-footer a{color:inherit;text-decoration:none}
.fs-footer a{color:var(--muted)}
#ui-lang{display:none}   /* the page's old EN/UR button: the site header chooses the language now */

/* ---------- the Observatory under the site header ---------- */
html{--urdu:'FS Urdu','Noto Naskh Arabic',serif}
:root{--urdu:'FS Urdu','Noto Naskh Arabic',serif}
/* lang-list-ok: the observatory's own Devanagari font choice (hand-tuned) */
html[lang="hi"] body,html[lang="mr"] body,html[lang="ne"] body{--sans:"Inter","Noto Sans Devanagari",sans-serif}
.fs-nav{position:relative;top:auto}   /* under the sticky site header: one sticky bar only */
.fs-header{z-index:90}
.obs-ic{display:inline-flex;width:1.25em;height:1.25em;vertical-align:-0.25em;color:inherit;flex:0 0 auto}
.obs-ic svg{width:100%;height:100%}
.fs-chip .obs-ic{width:15px;height:15px;color:var(--tc,var(--cool))}
.fs-f-card .obs-ic{width:20px;height:20px;color:var(--tc,var(--cool))}
.fs-actions .obs-ic{width:16px;height:16px}
.fs-g-title .obs-ic{width:18px;height:18px;color:var(--gold)}
.obs-pl,.obs-sg{width:1.2em;height:1.2em}
.fs-g-explain{margin:0 0 12px;max-width:720px}
.fs-g-explain p{margin:0 0 8px;color:var(--muted);font-size:13px;line-height:1.85}
.fs-g-explain b{color:var(--ink)}
body.ur .fs-g-explain p{font-size:14.5px;line-height:2.1}
/* Farooq's RTL law: every degree, time and number reads left-to-right */
bdi.obs-ltr{direction:ltr;unicode-bidi:isolate}
/* Indian scripts: letter-spacing pulls the joined letters of Devanagari/Bengali/Gujarati/Tamil/Malayalam/Sinhala apart —
   no extra spacing and no upper-case in those languages (the Latin look stays for Latin languages) */
/* lang-list-ok: no letter-spacing in the joined Indic scripts (hand-tuned) — TODO: read «script» from lang/langs.json */
:is(html[lang="hi"],html[lang="mr"],html[lang="ne"],html[lang="bn"],html[lang="gu"],html[lang="ta"],html[lang="ml"],html[lang="si"]) body *{letter-spacing:0 !important;text-transform:none !important}

/* ---------- K1 (FA-001 repair round 7, 7 Oct 2026, Farooq) — site menu ----------
   • The quiet section label («Site») was the accent colour at opacity .6 = 2.48:1 in day.
     It is now full opacity in the site variable --menu-quiet (day 6.83:1, night 6.58:1).
   • The quiet links keep their quiet look (opacity .72, a little smaller) — now from CSS, not inline.
   • Desktop (1024 px and wider): menu text a little larger; the icons are 1.35em, so they grow with it.
     Phone sizes are unchanged. */
.fs-cat.fs-quiet{color:var(--menu-quiet);opacity:1}
.fs-link.fs-quiet{opacity:.72;font-size:13px}
@media(min-width:1024px){
  .fs-drawer .fs-dhead b{font-size:17px}
  .fs-cat{font-size:13.5px}
  .fs-link{font-size:15.5px;padding:8px 10px}
  .fs-link.fs-quiet{font-size:14.5px}
}


/* Lane L5: reuse site tokens and fonts; keep diagrams in their physical orientation. */
body[data-page="observatory"] :is(button,select,summary,.fs-chip,.ab-go){min-height:44px;box-sizing:border-box}
body[data-page="observatory"] :is(button,a,input,select,textarea,summary):focus-visible{outline:3px solid var(--gold);outline-offset:3px}
body[data-page="observatory"] .fs-iconbtn{min-width:44px}
body[data-page="observatory"] :is(.wrap,#content,.card,.grid,.bar,.slot,.tools,.field){min-width:0;box-sizing:border-box}
body[data-page="observatory"] :is(input,select,textarea){max-width:100%;box-sizing:border-box}
body[data-page="observatory"] :is(.card,.note,.sub,.slot,.chip,.lead,.celestial-caption){overflow-wrap:anywhere}
body[data-page="observatory"] .appname{margin:0;font-weight:600}
body[data-page="observatory"] #ui-main{min-height:24rem}
body[data-page="observatory"] :is(.td-txt,.ztd-txt){min-height:7rem}
body[data-page="observatory"] :is(canvas,svg){direction:ltr}
body[data-page="observatory"] .obs-sticky{position:sticky;top:var(--fs-header-h,0px);z-index:80;background:var(--bg);padding:10px 0;border-bottom:1px solid var(--line)}
body[data-page="observatory"] .obs-fold{margin:18px 0;padding:12px;border:1px solid var(--line);border-radius:13px;background:var(--card)}
body[data-page="observatory"] .obs-fold>summary{cursor:pointer;color:var(--accent);font-weight:600;align-content:center}
body[data-page="observatory"] .obs-motion{display:flex;justify-content:flex-end;margin:8px 0 18px}
body[data-page="observatory"] .obs-care{padding:12px;border:1px solid var(--line);border-inline-start:3px solid var(--gold);border-radius:10px;color:var(--ink);line-height:1.8}
body[data-page="observatory"] .obs-feedback{color:var(--warn);margin-top:8px;line-height:1.8}
body[data-page="observatory"] .obs-feedback:empty{display:none}
body[data-page="observatory"] .obs-time-note{display:block;font:inherit;color:var(--mut);white-space:normal;margin-top:6px}
body[data-page="observatory"] .obs-controls{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:12px 0}
body[data-page="observatory"] .obs-breath-text{min-height:5rem;text-align:center;padding:14px;line-height:1.8}
body[data-page="observatory"] .celestial-hero{height:220px!important;min-height:0!important;margin-top:24px}
body[data-page="observatory"] .celestial-hero canvas{height:100%!important}
body[data-page="observatory"] .field .fhead{font:inherit;margin:0 0 14px}
@media(max-width:640px){
 body[data-page="observatory"] :is(.grid.g2,.grid.g3,.grid.g4,.td-cards){grid-template-columns:minmax(0,1fr)}
 body[data-page="observatory"] .bar{gap:8px;flex-wrap:wrap}
 body[data-page="observatory"] .bar .dl{min-width:0;flex:1;text-align:center}
 body[data-page="observatory"] #ui-city{flex:1;min-width:0}
 body[data-page="observatory"] #obs-city-label{margin:0}
 body[data-page="observatory"] .slot{flex-wrap:wrap;gap:8px}
 body[data-page="observatory"] .slot .tm{white-space:normal;min-width:0}
 body[data-page="observatory"] .card>div[style*="min-width"]{min-width:0!important}
 body[data-page="observatory"] .celestial-controls{flex-wrap:wrap}
 body[data-page="observatory"] :is(.ctrls,.tiles){grid-template-columns:repeat(auto-fit,minmax(min(100%,140px),1fr))}
 body[data-page="observatory"] .fs-brand small{white-space:normal}
 body[data-page="observatory"] .fs-brand{font-size:14px}
 /* scan 29 Oct #3: on a phone the saat day/place bar scrolls away, it no longer covers half the screen */
 body[data-page="observatory"] .obs-sticky{position:static}
 /* scan 29 Oct #7: the hero captions sit under the drawing, not over its % figure */
 body[data-page="observatory"] .celestial-hero{height:auto!important}
 body[data-page="observatory"] .celestial-hero canvas{height:220px!important}
 body[data-page="observatory"] .celestial-hero .celestial-caption{position:static;flex-wrap:wrap;padding:0 15px 12px}
}
@media(prefers-reduced-motion:reduce){body[data-page="observatory"] *,body[data-page="observatory"] *::before,body[data-page="observatory"] *::after{scroll-behavior:auto!important;animation:none!important;transition:none!important}}
@media(max-width:430px){
 body[data-page="observatory"] .fs-header :is(.fs-iconbtn,.fs-langsel){min-width:40px;min-height:40px;height:40px}   /* scan 29 Oct #3: one header row */
}
@media(max-width:380px){
 body[data-page="observatory"] header:not(.fs-header) .icons{flex-wrap:wrap}
}
body[data-page="observatory"] .fslun-bar{direction:ltr}
/* Keep calculation and motion controls outside the canvas, including Studio. */
body[data-page="observatory"]:not(.studio) #hero{margin-top:0}
body[data-page="observatory"] #calculation-controls{padding:12px 18px}
body[data-page="observatory"].studio{grid-template-rows:auto auto auto minmax(0,1fr)}
body[data-page="observatory"].studio #calculation-controls{grid-column:1/-1;grid-row:2}
body[data-page="observatory"].studio #celestial-settings{grid-column:1/-1;grid-row:3;margin:0}
body[data-page="observatory"].studio #hero{grid-column:1;grid-row:4;min-height:0}
body[data-page="observatory"].studio #studioPanel{grid-column:2;grid-row:4}
@media(max-width:760px){
 body[data-page="observatory"].studio{display:block;height:auto;overflow:auto}
 body[data-page="observatory"].studio #hero{height:65vh;min-height:300px}
}
@media(max-width:640px){
 body[data-page="observatory"] .wrap>.bar{display:grid;grid-template-columns:44px minmax(0,1fr) 44px;align-items:center}
 body[data-page="observatory"] #ui-date{grid-column:1/-1;grid-row:1;min-width:0;width:100%;white-space:normal;text-align:center}
 body[data-page="observatory"] #ui-prev{grid-column:1;grid-row:2}
 body[data-page="observatory"] #ui-today{grid-column:2;grid-row:2}
 body[data-page="observatory"] #ui-next{grid-column:3;grid-row:2}
 body[data-page="observatory"] .bar>.spacer{display:none}
 body[data-page="observatory"] #obs-city-label{grid-column:1/-1;grid-row:3}
 body[data-page="observatory"] #ui-city{grid-column:1/3;grid-row:4;width:100%}
 body[data-page="observatory"] #ui-geo{grid-column:3;grid-row:4}
}
