/* =============================================================================
   MERIDIAN THEME  —  public/themes/meridian.css
   -----------------------------------------------------------------------------
   Ek bilkul naya design language — purane teal/rounded/soft themes se alag:
     • Palette : deep indigo masthead + amber accent + warm paper canvas
     • Shape   : sharp corners (2px), hard offset shadows, thick rules
     • Type    : Space Grotesk (display) + Inter (text) + JetBrains Mono (meta)
     • Layout  : journal home ka sidebar LEFT, search filters RIGHT,
                 issue TOC RIGHT, ruled editorial lists (cards nahi)
   -----------------------------------------------------------------------------
   Ye file akeli hi poora public site style karti hai (header→footer, journal
   home, article, issue, archive, search, author profile, auth pages, DB blocks).
   ============================================================================= */

@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&family=Inter:wght@300;400;500;600;700&family=JetBrains+Mono:wght@400;500;700&display=swap');

/* ═══════════════════════════════════════════════════════════════════════════
   1. DESIGN TOKENS
   ═══════════════════════════════════════════════════════════════════════════ */
:root {
  /* — core palette — */
  --md-brand:      #1E1A4D;   /* deep indigo — masthead / footer */
  --md-brand-2:    #322A87;   /* lifted indigo — hover / gradient */
  --md-brand-3:    #4B3FC4;   /* electric indigo — links */
  --md-accent:     #E8A317;   /* amber — primary accent */
  --md-accent-2:   #B9720A;   /* deep amber — hover */
  --md-flag:       #C2452D;   /* rust — alerts / OA flag */
  --md-ok:         #2C7A5B;

  /* — neutrals (warm, paper) — */
  --md-ink:        #16142A;
  --md-ink-2:      #2E2A45;
  --md-mid:        #4A4560;
  --md-muted:      #757087;
  --md-faint:      #9A94AA;
  --md-line:       #E4DED0;
  --md-line-2:     #CFC6B2;
  --md-canvas:     #FAF7F0;   /* warm paper page bg */
  --md-wash:       #F3EFE5;   /* tinted band */
  --md-surface:    #FFFFFF;
  --md-dark-wash:  rgba(255,255,255,.08);

  /* — geometry: sharp, not rounded — */
  --md-r:          2px;
  --md-r2:         4px;
  --md-rule:       1px solid var(--md-line);
  --md-rule-2:     2px solid var(--md-ink);
  --md-sh:         0 1px 0 rgba(22,20,42,.05);
  --md-sh-2:       0 2px 0 rgba(22,20,42,.10);
  --md-sh-hard:    3px 3px 0 var(--md-ink);
  --md-sh-amber:   3px 3px 0 var(--md-accent);
  --md-wrap:       1200px;

  /* — type — */
  --md-f-display:  'Space Grotesk', 'Segoe UI', system-ui, sans-serif;
  --md-f-text:     'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --md-f-mono:     'JetBrains Mono', ui-monospace, 'SFMono-Regular', Menlo, monospace;

  /* — sticky offsets — */
  --md-header-h:   152px;   /* Part II me override hota hai */
  --md-sticky-top: 62px;    /* scroll par header condense hokar itna reh jata hai */
  --page-offset:   152px;
  --ar-toolbar-h:  52px;    /* NOTE: JS isko scroll par overwrite karta hai */

  /* — legacy aliases: TSX inline styles aur injected HTML in vars ko use karte hain — */
  --jp-brand:  var(--md-brand);
  --jp-mid:    var(--md-mid);
  --jp-muted:  var(--md-muted);
  --jp-line:   var(--md-line);
  --ar-brand:  var(--md-brand);
  --ar-ink:    var(--md-ink);
  --ar-mid:    var(--md-mid);
  --ar-muted:  var(--md-muted);
  --ar-line:   var(--md-line);
  --ar-wash:   var(--md-wash);
  --ar-serif:  var(--md-f-text);
  --ar-sans:   var(--md-f-text);
  --ph-brand:  var(--md-brand);
  --ph-accent: var(--md-accent);
  --ph-ink:    var(--md-ink);
  --ph-mid:    var(--md-mid);
  --ph-muted:  var(--md-muted);
  --ph-border: var(--md-line);
  --ph-bg:     var(--md-surface);
  --ph-f-sans: var(--md-f-text);
  --ph-f-serif:var(--md-f-display);
  --brand:     var(--md-brand);
  --brand2:    var(--md-brand-2);
  --accent:    var(--md-accent);
  --dark:      var(--md-ink);
  --muted:     var(--md-muted);
  --line:      var(--md-line);
  --container: var(--md-wrap);
}

/* ═══════════════════════════════════════════════════════════════════════════
   2. BASE
   ═══════════════════════════════════════════════════════════════════════════ */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
html, body { overflow-x: clip; }

body {
  /* layout.tsx inline font ko override karna zaroori hai */
  font-family: var(--md-f-text) !important;
  font-size: 15px;
  line-height: 1.65;
  color: var(--md-ink);
  background: var(--md-canvas);
  margin: 0;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-feature-settings: 'cv11', 'ss01';
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--md-f-display);
  font-weight: 600;
  letter-spacing: -.018em;
  line-height: 1.2;
  color: var(--md-ink);
  margin: 0 0 .5rem;
}

a { color: inherit; text-decoration: none; }
a:hover { color: var(--md-brand-3); }
img { max-width: 100%; }
p { margin: 0 0 .8rem; }
hr { border: 0; border-top: var(--md-rule); margin: 1.25rem 0; }

::selection { background: var(--md-accent); color: var(--md-ink); }

:focus-visible {
  outline: 2px solid var(--md-brand-3);
  outline-offset: 2px;
}

button { font-family: inherit; }
input, select, textarea { font-family: inherit; font-size: inherit; }

/* Meridian ka signature: chhote uppercase mono labels */
.md-kicker,
.jp-sh__t, .jp-ss__lbl, .ep-eyebrow, .ia-banner__eyebrow,
.sr-sidebar__hd, .iv-toc__head, .ar-toc-hd, .phf-col-head {
  font-family: var(--md-f-mono);
  text-transform: uppercase;
  letter-spacing: .14em;
  font-size: .68rem;
  font-weight: 500;
}

/* ── Page shells / wrappers ── */
.jp-w, .ep-w, .iv-w, .ia-w, .ar-w, .sr-w, .ap-w, .sc-w, .container {
  width: 100%;
  max-width: var(--md-wrap);
  margin: 0 auto;
  padding: 0 24px;
}
@media (max-width: 640px) {
  .jp-w, .ep-w, .iv-w, .ia-w, .ar-w, .sr-w, .ap-w, .sc-w, .container { padding: 0 16px; }
}

#main-content { min-height: 55vh; background: var(--md-canvas); }

/* Bootstrap-icon shim (DB blocks `bi bi-*` use karte hain) */
.bi { display: inline-block; line-height: 1; vertical-align: -.125em; }

/* spacing utilities jo DB HTML blocks mein aate hain */
.mt-3 { margin-top: .875rem !important; }
.mt-4 { margin-top: 1.5rem !important; }
.me-1 { margin-right: .25rem; } .me-2 { margin-right: .5rem; } .me-3 { margin-right: .75rem; }
.ms-1 { margin-left: .25rem; }  .ms-2 { margin-left: .5rem; }
.ps-3 { padding-left: 1rem; }
.small { font-size: .85em; }
.xsmall { font-size: .75em; }
.fw-semibold { font-weight: 600; }
.text-truncate { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ac-hidden { display: none !important; }

/* skip repeated shadows on print */
@media print {
  .ph-header, .phf-footer, .ar-toolbar-wrap, .cookie-banner, .jp-cta { display: none !important; }
  body { background: #fff; }
}


/* ═══════════════════════════════════════════════════════════════════════════
   3. SITE HEADER  (themes/*/Header.tsx — ph-*)
   NAYA: poora masthead deep-indigo hai (purane themes white the), nav bar
   amber top-rule ke saath, brand ke saath square monogram tile.
   ═══════════════════════════════════════════════════════════════════════════ */
.ph-header {
  position: sticky;
  top: 0;
  z-index: 9000;
  background: var(--md-brand);
  color: #fff;
  isolation: isolate;
  border-bottom: 3px solid var(--md-accent);
}
.ph-header.scrolled { box-shadow: 0 6px 24px rgba(22,20,42,.28); }

/* ── Utility ribbon (top strip) ── */
.ph-ribbon {
  background: rgba(0,0,0,.28);
  border-bottom: 1px solid rgba(255,255,255,.10);
  max-height: 44px;
  overflow: hidden;
  transition: max-height .25s ease, opacity .25s ease;
}
.ph-ribbon.hide { max-height: 0; opacity: 0; pointer-events: none; border-bottom-color: transparent; }
.ph-ribbon__inner {
  max-width: var(--md-wrap);
  margin: 0 auto;
  padding: 0 24px;
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}
.ph-ribbon__left { display: flex; align-items: center; gap: .7rem; min-width: 0; }
.ph-socials { display: flex; align-items: center; gap: .1rem; list-style: none; margin: 0; padding: 0; }
.ph-socials a {
  width: 26px; height: 26px;
  display: flex; align-items: center; justify-content: center;
  color: rgba(255,255,255,.72);
  border: 1px solid transparent;
  border-radius: var(--md-r);
  transition: .15s;
}
.ph-socials a:hover { color: var(--md-brand); background: var(--md-accent); border-color: var(--md-accent); }
.ph-ribbon__sep { width: 1px; height: 16px; background: rgba(255,255,255,.22); }
.ph-ribbon__issn {
  font-family: var(--md-f-mono);
  font-size: .7rem;
  letter-spacing: .06em;
  color: rgba(255,255,255,.68);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ph-ribbon__nav { display: flex; align-items: center; gap: 1.1rem; }
.ph-ribbon__nav a {
  font-size: .74rem;
  font-weight: 500;
  letter-spacing: .03em;
  color: rgba(255,255,255,.75);
  padding: 2px 0;
  border-bottom: 1px solid transparent;
}
.ph-ribbon__nav a:hover { color: #fff; border-bottom-color: var(--md-accent); }
@media (max-width: 900px) { .ph-ribbon__nav { display: none; } }

/* ── Brand row ── */
.ph-brand { background: transparent; }
.ph-brand__inner {
  max-width: var(--md-wrap);
  margin: 0 auto;
  padding: 14px 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.25rem;
}
.ph-brand__identity { display: flex; align-items: center; gap: .8rem; min-width: 0; color: #fff; }
.ph-brand__identity:hover { color: #fff; }
.ph-brand__logo { height: 46px; width: auto; max-width: 210px; object-fit: contain; }
.ph-brand__monogram {
  flex-shrink: 0;
  width: 46px; height: 46px;
  display: flex; align-items: center; justify-content: center;
  background: var(--md-accent);
  color: var(--md-brand);
  font-family: var(--md-f-display);
  font-weight: 700;
  font-size: 1.05rem;
  letter-spacing: .03em;
  border-radius: var(--md-r);
}
.ph-brand__name {
  font-family: var(--md-f-display);
  font-size: 1.24rem;
  font-weight: 600;
  letter-spacing: -.02em;
  line-height: 1.15;
  color: #fff;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
@media (max-width: 767px) { .ph-brand__name { font-size: 1rem; } .ph-brand__monogram { width: 38px; height: 38px; font-size: .9rem; } }

.ph-brand__actions { display: flex; align-items: center; gap: .5rem; flex-shrink: 0; }

/* buttons in header — square, hairline */
.ph-search-btn, .ph-guest-btn {
  display: inline-flex; align-items: center; gap: .4rem;
  height: 36px; padding: 0 .8rem;
  background: transparent;
  border: 1px solid rgba(255,255,255,.28);
  border-radius: var(--md-r);
  color: rgba(255,255,255,.9);
  font-size: .78rem; font-weight: 500;
  cursor: pointer;
  transition: .15s;
}
.ph-search-btn:hover, .ph-guest-btn:hover { border-color: var(--md-accent); color: var(--md-accent); }
.ph-submit-btn {
  display: inline-flex; align-items: center; gap: .4rem;
  height: 36px; padding: 0 1rem;
  background: var(--md-accent);
  color: var(--md-brand);
  border: 1px solid var(--md-accent);
  border-radius: var(--md-r);
  font-size: .78rem; font-weight: 700;
  letter-spacing: .01em;
  transition: .15s;
}
.ph-submit-btn:hover { background: #fff; border-color: #fff; color: var(--md-brand); }
@media (max-width: 1023px) { .ph-search-label, .ph-submit-text, .ph-guest-text { display: none; } .ph-submit-btn, .ph-search-btn, .ph-guest-btn { padding: 0 .65rem; } }

/* avatar + account dropdown */
.ph-dropdown-wrap { position: relative; }
.ph-avatar {
  width: 36px; height: 36px;
  border-radius: var(--md-r);
  background: rgba(255,255,255,.14);
  border: 1px solid rgba(255,255,255,.3);
  color: #fff;
  font-family: var(--md-f-mono);
  font-size: .74rem; font-weight: 700;
  cursor: pointer;
  transition: .15s;
}
.ph-avatar:hover { background: var(--md-accent); border-color: var(--md-accent); color: var(--md-brand); }
.ph-dropdown {
  position: absolute; right: 0; top: calc(100% + 8px);
  min-width: 232px;
  background: var(--md-surface);
  border: 1px solid var(--md-line-2);
  border-radius: var(--md-r);
  box-shadow: var(--md-sh-hard);
  list-style: none; margin: 0; padding: 6px 0;
  z-index: 60;
}
.ph-dropdown__header { padding: .5rem .85rem .6rem; border-bottom: var(--md-rule); margin-bottom: 4px; }
.ph-dropdown__header strong { display: block; font-size: .84rem; color: var(--md-ink); }
.ph-dropdown__header small { font-family: var(--md-f-mono); font-size: .66rem; text-transform: uppercase; letter-spacing: .08em; color: var(--md-muted); }
.ph-dropdown__item {
  display: block; width: 100%; text-align: left;
  padding: .46rem .85rem;
  font-size: .82rem; color: var(--md-mid);
  background: none; border: 0; cursor: pointer;
  border-left: 2px solid transparent;
}
.ph-dropdown__item:hover { background: var(--md-wash); color: var(--md-brand); border-left-color: var(--md-accent); }
.ph-dropdown__item--danger { color: var(--md-flag); }
.ph-dropdown__item--danger:hover { background: #fdf0ec; color: var(--md-flag); border-left-color: var(--md-flag); }
.ph-dropdown__divider { border: 0; border-top: var(--md-rule); margin: 4px 0; }

/* hamburger */
.ph-toggler {
  display: none;
  width: 36px; height: 36px;
  flex-direction: column; align-items: center; justify-content: center; gap: 4px;
  background: transparent;
  border: 1px solid rgba(255,255,255,.28);
  border-radius: var(--md-r);
  cursor: pointer;
}
.ph-toggler span { display: block; width: 16px; height: 1.5px; background: #fff; transition: .2s; }
.ph-toggler.open span:nth-child(1) { transform: translateY(5.5px) rotate(45deg); }
.ph-toggler.open span:nth-child(2) { opacity: 0; }
.ph-toggler.open span:nth-child(3) { transform: translateY(-5.5px) rotate(-45deg); }
@media (max-width: 991px) { .ph-toggler { display: flex; } }

/* ── Main nav ── */
.ph-nav { background: rgba(0,0,0,.18); border-top: 1px solid rgba(255,255,255,.10); }
.ph-nav__inner { max-width: var(--md-wrap); margin: 0 auto; padding: 0 24px; }
.ph-nav__scroll { overflow-x: auto; scrollbar-width: none; }
.ph-nav__scroll::-webkit-scrollbar { display: none; }
.ph-nav__list { display: flex; align-items: stretch; gap: 0; list-style: none; margin: 0; padding: 0; }
.ph-nav__item { position: relative; }
.ph-nav__link, .ph-nav__link-inner {
  display: inline-flex; align-items: center; gap: .3rem;
  padding: .72rem .95rem;
  font-size: .8rem; font-weight: 500;
  letter-spacing: .01em;
  color: rgba(255,255,255,.82);
  white-space: nowrap;
  background: none; border: 0; cursor: pointer;
  border-bottom: 2px solid transparent;
  transition: .15s;
}
.ph-nav__link:hover, .ph-nav__link-inner:hover { color: #fff; background: rgba(255,255,255,.06); border-bottom-color: var(--md-accent); }
.ph-nav__link.is-active, .ph-nav__link.active { color: var(--md-accent); border-bottom-color: var(--md-accent); }
.ph-nav__chev, .ph-nav__mobile-chev { font-size: .6rem; transition: transform .2s; opacity: .75; }
.ph-nav__chev.open, .ph-nav__mobile-chev.open { transform: rotate(180deg); }

.ph-nav__dropdown {
  display: none;
  position: absolute; left: 0; top: 100%;
  min-width: 224px;
  background: var(--md-surface);
  border: 1px solid var(--md-line-2);
  box-shadow: var(--md-sh-hard);
  list-style: none; margin: 0; padding: 5px 0;
  z-index: 55;
}
.ph-nav__dropdown.open { display: block; }
.ph-nav__dropdown a {
  display: block; padding: .45rem .85rem;
  font-size: .81rem; color: var(--md-mid);
  border-left: 2px solid transparent;
}
.ph-nav__dropdown a:hover { background: var(--md-wash); color: var(--md-brand); border-left-color: var(--md-accent); }

/* mobile nav */
.ph-nav__collapse { display: none; border-top: 1px solid rgba(255,255,255,.12); padding: .4rem 0 .8rem; }
.ph-nav__collapse.open { display: block; }
.ph-nav__collapse .ph-nav__list { flex-direction: column; padding: 0 16px; }
.ph-nav__mobile-row { display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid rgba(255,255,255,.08); }
.ph-nav__mobile-row .ph-nav__link { flex: 1; padding: .6rem 0; border-bottom: 0; }
.ph-nav__mobile-chev { background: none; border: 0; color: rgba(255,255,255,.7); padding: .5rem; cursor: pointer; }
.ph-nav__collapse .ph-nav__dropdown {
  display: block; position: static; box-shadow: none;
  background: rgba(0,0,0,.22); border: 0; border-left: 2px solid var(--md-accent);
  margin: 0 0 .4rem .4rem;
}
.ph-nav__collapse .ph-nav__dropdown a { color: rgba(255,255,255,.78); border-left: 0; }
.ph-nav__collapse .ph-nav__dropdown a:hover { background: rgba(255,255,255,.07); color: #fff; }
.ph-nav__mobile-auth { padding: .5rem 16px 0; margin-top: .5rem; border-top: 1px solid rgba(255,255,255,.12); }
.ph-nav__mobile-auth .ph-dropdown__item { color: rgba(255,255,255,.85); }
.ph-nav__mobile-auth .ph-dropdown__item:hover { background: rgba(255,255,255,.08); color: var(--md-accent); }
@media (max-width: 991px) { .ph-nav__inner { display: none; } }

/* impersonate bar */
.ph-impersonate-bar, .site-impersonate {
  background: var(--md-flag); color: #fff;
  text-align: center; font-size: .74rem; font-weight: 600;
  padding: 5px 16px;
  font-family: var(--md-f-mono);
}
.ph-impersonate-bar button, .site-impersonate button {
  background: rgba(255,255,255,.2); color: #fff;
  border: 0; border-radius: var(--md-r);
  padding: 2px 10px; margin-left: 10px;
  font-size: .72rem; font-weight: 700; cursor: pointer;
}

/* ── Search overlay ── */
.ph-search-overlay { position: fixed; inset: 0; z-index: 10000; display: none; }
.ph-search-overlay.open { display: block; }
.ph-search-overlay__bg { position: absolute; inset: 0; background: rgba(22,20,42,.72); backdrop-filter: blur(3px); }
.ph-search-overlay__box {
  position: relative;
  max-width: 720px;
  margin: 12vh auto 0;
  background: var(--md-surface);
  border: 1px solid var(--md-ink);
  border-top: 4px solid var(--md-accent);
  box-shadow: var(--md-sh-hard);
  padding: 1.75rem 1.75rem 1.4rem;
}
.ph-search-overlay__close {
  position: absolute; top: 10px; right: 12px;
  background: none; border: 0; cursor: pointer;
  font-size: .74rem; font-family: var(--md-f-mono);
  color: var(--md-muted);
}
.ph-search-overlay__close:hover { color: var(--md-flag); }
.ph-search-overlay__label {
  display: block;
  font-family: var(--md-f-mono);
  font-size: .68rem; text-transform: uppercase; letter-spacing: .14em;
  color: var(--md-muted); margin-bottom: .55rem;
}
.ph-search-overlay__row { display: flex; gap: 0; }
.ph-search-overlay__input {
  flex: 1;
  height: 48px;
  padding: 0 .9rem;
  border: 1px solid var(--md-line-2);
  border-right: 0;
  border-radius: var(--md-r) 0 0 var(--md-r);
  font-size: .95rem;
  background: var(--md-canvas);
  color: var(--md-ink);
}
.ph-search-overlay__input:focus { outline: 0; border-color: var(--md-brand-3); background: #fff; }
.ph-search-overlay__btn, .ph-search-overlay__go {
  height: 48px; padding: 0 1.4rem;
  display: inline-flex; align-items: center; gap: .4rem;
  background: var(--md-brand); color: #fff;
  border: 1px solid var(--md-brand);
  border-radius: 0 var(--md-r) var(--md-r) 0;
  font-size: .85rem; font-weight: 600; cursor: pointer;
}
.ph-search-overlay__btn:hover { background: var(--md-accent); border-color: var(--md-accent); color: var(--md-brand); }
.ph-search-overlay__hint { margin: .6rem 0 0; font-size: .76rem; color: var(--md-muted); }


/* ═══════════════════════════════════════════════════════════════════════════
   4. SITE FOOTER  (themes/*/Footer.tsx — phf-*) + cookie banner
   NAYA: ink-black footer with amber top rule, asymmetric 3fr/1fr/1fr/1.2fr grid
   ═══════════════════════════════════════════════════════════════════════════ */
.phf-footer {
  background: var(--md-ink);
  color: rgba(255,255,255,.72);
  font-size: .84rem;
  border-top: 3px solid var(--md-accent);
}
.phf-upper { padding: 3rem 0 2.25rem; }
.phf-upper__inner {
  max-width: var(--md-wrap);
  margin: 0 auto;
  padding: 0 24px;
  display: grid;
  grid-template-columns: 2.4fr 1fr 1fr 1.3fr;
  gap: 2.5rem;
}
@media (max-width: 1023px) { .phf-upper__inner { grid-template-columns: 1fr 1fr; gap: 2rem; } }
@media (max-width: 575px)  { .phf-upper__inner { grid-template-columns: 1fr; gap: 1.75rem; } }

.phf-brand-link { display: flex; align-items: center; gap: .75rem; margin-bottom: .9rem; }
.phf-mono {
  flex-shrink: 0;
  width: 44px; height: 44px;
  display: flex; align-items: center; justify-content: center;
  background: var(--md-accent);
  color: var(--md-ink);
  border-radius: var(--md-r);
  font-family: var(--md-f-display);
  font-size: 1.1rem; font-weight: 700;
}
.phf-brand-text { display: flex; flex-direction: column; gap: .15rem; min-width: 0; }
.phf-brand-name { font-family: var(--md-f-display); font-size: 1.02rem; font-weight: 600; color: #fff; }
.phf-brand-issn { font-family: var(--md-f-mono); font-size: .68rem; letter-spacing: .05em; color: rgba(255,255,255,.5); }
.phf-oa-pill {
  display: inline-flex; align-items: center; gap: .35rem;
  padding: .22rem .6rem;
  border: 1px solid rgba(255,255,255,.25);
  border-radius: var(--md-r);
  font-family: var(--md-f-mono);
  font-size: .64rem; text-transform: uppercase; letter-spacing: .1em;
  color: var(--md-accent);
  margin-bottom: .8rem;
}
.phf-desc { font-size: .8rem; line-height: 1.7; color: rgba(255,255,255,.6); max-width: 42ch; margin-bottom: 1rem; }
.phf-index-row { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; }
.phf-index-badge {
  display: inline-flex; align-items: center; gap: .35rem;
  padding: .3rem .6rem;
  border: 1px solid rgba(255,255,255,.16);
  border-radius: var(--md-r);
  font-size: .7rem;
  color: rgba(255,255,255,.7);
  transition: .15s;
}
.phf-index-badge:hover { border-color: var(--md-accent); color: var(--md-accent); }

.phf-col-head {
  color: #fff;
  margin: 0 0 .85rem;
  padding-bottom: .45rem;
  border-bottom: 1px solid rgba(255,255,255,.14);
}
.phf-linklist, .phf-links, .phf-contact-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .42rem; }
.phf-link { font-size: .81rem; color: rgba(255,255,255,.66); transition: .15s; }
.phf-link:hover { color: var(--md-accent); padding-left: 4px; }
.phf-contact-row { display: flex; align-items: flex-start; gap: .55rem; font-size: .8rem; margin-bottom: .6rem; color: rgba(255,255,255,.66); }
.phf-contact-icon { flex-shrink: 0; color: var(--md-accent); margin-top: 2px; }
.phf-contact-email { color: rgba(255,255,255,.8); word-break: break-all; }
.phf-contact-email:hover { color: var(--md-accent); }
.phf-social, .phf-socials { display: flex; gap: .4rem; margin-top: .9rem; }
.phf-social a, .phf-socials a {
  width: 32px; height: 32px;
  display: flex; align-items: center; justify-content: center;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: var(--md-r);
  color: rgba(255,255,255,.7);
  transition: .15s;
}
.phf-social a:hover, .phf-socials a:hover { background: var(--md-accent); border-color: var(--md-accent); color: var(--md-ink); }

.phf-bottom { border-top: 1px solid rgba(255,255,255,.12); background: rgba(0,0,0,.25); }
.phf-bottom__inner {
  max-width: var(--md-wrap); margin: 0 auto; padding: 1rem 24px;
  display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap;
}
.phf-copy { font-family: var(--md-f-mono); font-size: .7rem; letter-spacing: .03em; color: rgba(255,255,255,.5); }
.phf-copy a { color: var(--md-accent); }
.phf-bottom__links, .phf-bottom-links { display: flex; gap: 1.25rem; }
.phf-bottom__links a { font-size: .74rem; color: rgba(255,255,255,.55); }
.phf-bottom__links a:hover { color: var(--md-accent); }

/* legacy footer variants (vf-*, pf-*) — kuch DB HTML aur purane blocks use karte hain */
.vf-footer, .pf-inner { background: var(--md-ink); color: rgba(255,255,255,.72); }
.vf-title, .pf-journal-name { font-family: var(--md-f-display); color: #fff; }
.vf-link, .pf-links a { color: rgba(255,255,255,.66); }
.vf-link:hover, .pf-links a:hover { color: var(--md-accent); }

/* ── Cookie banner ── */
.cookie-banner {
  position: fixed; left: 0; right: 0; bottom: 0;
  z-index: 9500;
  background: var(--md-ink);
  color: rgba(255,255,255,.85);
  border-top: 3px solid var(--md-accent);
  transform: translateY(100%);
  transition: transform .3s ease;
}
.cookie-banner.show { transform: translateY(0); }
.cookie-wrap {
  max-width: var(--md-wrap); margin: 0 auto; padding: .9rem 24px;
  display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap;
  font-size: .82rem;
}
.cookie-wrap a { color: var(--md-accent); text-decoration: underline; }
.cookie-wrap button {
  padding: .42rem 1rem;
  border-radius: var(--md-r);
  font-size: .78rem; font-weight: 600;
  cursor: pointer; margin-left: .5rem;
  border: 1px solid var(--md-accent);
  background: var(--md-accent); color: var(--md-ink);
}
.cookie-wrap button#rejectCookies { background: transparent; color: rgba(255,255,255,.75); border-color: rgba(255,255,255,.25); }
.cookie-wrap button#rejectCookies:hover { border-color: #fff; color: #fff; }


/* ═══════════════════════════════════════════════════════════════════════════
   5. JOURNAL HOME  (JournalHomeClient.tsx — jh-* masthead, jp-* body)
   NAYA LAYOUT: sidebar LEFT (320px) + main RIGHT. Hero split with big
   indigo panel and overlapping cover. Articles = ruled rows, cards nahi.
   ═══════════════════════════════════════════════════════════════════════════ */
.jp { background: var(--md-canvas); }

/* ── Journal masthead hero ── */
.jh-wrap {
  background: var(--md-brand);
  background-image:
    radial-gradient(circle at 88% 12%, rgba(232,163,23,.20), transparent 46%),
    linear-gradient(160deg, var(--md-brand) 0%, #17143C 100%);
  color: #fff;
  position: relative;
  overflow: hidden;
}
.jh-wrap::after {
  content: '';
  position: absolute; inset: 0;
  background-image: linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px);
  background-size: 100% 34px;
  pointer-events: none;
}
.jh-inner {
  position: relative; z-index: 1;
  display: grid;
  grid-template-columns: 210px 1fr;
  gap: 2.5rem;
  align-items: start;
  padding: 3rem 24px 2.5rem;
}
@media (max-width: 860px) { .jh-inner { grid-template-columns: 1fr; gap: 1.5rem; padding: 2rem 16px 1.75rem; } }

.jh-left { position: relative; }
.jh-cover {
  width: 100%;
  aspect-ratio: 3/4;
  object-fit: cover;
  border-radius: var(--md-r);
  border: 1px solid rgba(255,255,255,.2);
  box-shadow: 8px 8px 0 rgba(232,163,23,.9);
  background: #fff;
}
.jh-cover--placeholder {
  display: flex; align-items: center; justify-content: center;
  background: rgba(255,255,255,.07);
  color: var(--md-accent);
  font-family: var(--md-f-display);
  font-size: 3rem; font-weight: 700; letter-spacing: .04em;
}
@media (max-width: 860px) { .jh-left { max-width: 150px; } }

.jh-right { min-width: 0; }
.jh-breadcrumb {
  display: flex; align-items: center; gap: .45rem;
  font-family: var(--md-f-mono);
  font-size: .68rem; text-transform: uppercase; letter-spacing: .1em;
  color: rgba(255,255,255,.55);
  margin-bottom: 1rem;
}
.jh-breadcrumb a:hover { color: var(--md-accent); }
.jh-bc-sep { opacity: .5; }
.jh-title {
  font-family: var(--md-f-display);
  font-size: clamp(1.75rem, 3.6vw, 2.85rem);
  font-weight: 600;
  line-height: 1.08;
  letter-spacing: -.03em;
  color: #fff;
  margin: 0 0 .9rem;
  max-width: 22ch;
}
.jh-title::after {
  content: '';
  display: block;
  width: 68px; height: 4px;
  background: var(--md-accent);
  margin-top: 1rem;
}
.jh-desc {
  font-size: .93rem;
  line-height: 1.75;
  color: rgba(255,255,255,.75);
  max-width: 68ch;
  margin: 1rem 0 1.25rem;
}
.jh-desc p { margin-bottom: .6rem; }
.jh-readmore {
  color: var(--md-accent);
  font-weight: 600;
  font-size: .82rem;
  cursor: pointer;
  border-bottom: 1px solid currentColor;
}
.jh-model { display: flex; align-items: center; gap: .55rem; margin-bottom: 1.25rem; flex-wrap: wrap; }
.jh-model__label {
  font-family: var(--md-f-mono);
  font-size: .66rem; text-transform: uppercase; letter-spacing: .12em;
  color: rgba(255,255,255,.5);
}
.jh-model__val {
  display: inline-flex; align-items: center;
  padding: .2rem .55rem;
  border: 1px solid var(--md-accent);
  border-radius: var(--md-r);
  font-size: .74rem; font-weight: 600;
  color: var(--md-accent);
}
.jh-model__val:hover { background: var(--md-accent); color: var(--md-brand); }
.jh-submit-btn {
  display: inline-flex; align-items: center; gap: .5rem;
  padding: .7rem 1.4rem;
  background: var(--md-accent);
  color: var(--md-brand);
  border-radius: var(--md-r);
  font-size: .86rem; font-weight: 700;
  box-shadow: 4px 4px 0 rgba(255,255,255,.22);
  transition: .15s;
}
.jh-submit-btn:hover { background: #fff; color: var(--md-brand); box-shadow: 4px 4px 0 var(--md-accent); transform: translate(-1px,-1px); }
.jh-arrow { transition: transform .15s; }
.jh-submit-btn:hover .jh-arrow { transform: translateX(3px); }

/* ── Stats strip under hero ── */
.jh-stats-bar {
  position: relative; z-index: 1;
  background: rgba(0,0,0,.28);
  border-top: 1px solid rgba(255,255,255,.12);
}
.jh-stats-inner {
  display: flex; align-items: center; justify-content: space-between;
  gap: 1.25rem; flex-wrap: wrap;
  padding-top: .85rem; padding-bottom: .85rem;
}
.jh-oa-link {
  display: inline-flex; align-items: center; gap: .45rem;
  font-size: .8rem; font-weight: 500;
  color: rgba(255,255,255,.8);
  border-bottom: 1px solid transparent;
}
.jh-oa-link:hover { color: var(--md-accent); border-bottom-color: var(--md-accent); }
.jh-stats-right { display: flex; align-items: stretch; gap: 0; flex-wrap: wrap; }
.jh-stat {
  display: flex; flex-direction: column; gap: .1rem;
  padding: 0 1.15rem;
  border-left: 1px solid rgba(255,255,255,.14);
}
.jh-stat:first-child { border-left: 0; padding-left: 0; }
.jh-stat__val { font-family: var(--md-f-display); font-size: 1.12rem; font-weight: 700; color: var(--md-accent); line-height: 1.1; }
.jh-stat__label { font-family: var(--md-f-mono); font-size: .62rem; text-transform: uppercase; letter-spacing: .1em; color: rgba(255,255,255,.55); }
@media (max-width: 640px) { .jh-stat { padding: 0 .75rem; } .jh-stat__val { font-size: 1rem; } }


/* ── Inline search strip ── */
.jp-sbar { background: var(--md-wash); border-bottom: var(--md-rule); padding: 1.1rem 0; }
.jp-sbar__form { display: flex; gap: 0; max-width: 640px; }
.jp-sbar__q {
  flex: 1; height: 44px; padding: 0 .85rem;
  border: 1px solid var(--md-line-2); border-right: 0;
  border-radius: var(--md-r) 0 0 var(--md-r);
  background: #fff; font-size: .88rem; color: var(--md-ink);
}
.jp-sbar__q:focus { outline: 0; border-color: var(--md-brand-3); }
.jp-sbar__go {
  height: 44px; padding: 0 1.2rem;
  display: inline-flex; align-items: center; gap: .4rem;
  background: var(--md-ink); color: #fff;
  border: 1px solid var(--md-ink);
  border-radius: 0 var(--md-r) var(--md-r) 0;
  font-size: .82rem; font-weight: 600; cursor: pointer;
}
.jp-sbar__go:hover { background: var(--md-accent); border-color: var(--md-accent); color: var(--md-ink); }
.jp-sbar__hint { margin-top: .45rem; font-family: var(--md-f-mono); font-size: .7rem; color: var(--md-muted); }

/* ── Featured / lead article band ── */
.jp-feat { background: var(--md-surface); border-bottom: var(--md-rule); padding: 2.25rem 0 2rem; }
.jp-feat__grid { display: grid; grid-template-columns: 1.55fr 1fr; gap: 2.25rem; align-items: start; }
@media (max-width: 900px) { .jp-feat__grid { grid-template-columns: 1fr; gap: 1.5rem; } }

.jp-lead { position: relative; padding-left: 1.25rem; border-left: 3px solid var(--md-accent); }
.jp-lead__badge {
  display: inline-block;
  font-family: var(--md-f-mono);
  font-size: .64rem; text-transform: uppercase; letter-spacing: .12em;
  color: var(--md-brand);
  background: var(--md-wash);
  padding: .22rem .5rem;
  border-radius: var(--md-r);
  margin-bottom: .7rem;
}
.jp-lead__img {
  width: 100%; max-height: 260px; object-fit: cover;
  border: 1px solid var(--md-line);
  border-radius: var(--md-r);
  margin-bottom: .9rem;
}
.jp-lead__title {
  display: block;
  font-family: var(--md-f-display);
  font-size: 1.5rem; font-weight: 600; line-height: 1.25;
  letter-spacing: -.02em;
  color: var(--md-ink);
  margin-bottom: .5rem;
}
.jp-lead__title:hover { color: var(--md-brand-3); }
.jp-lead__authors { font-size: .84rem; color: var(--md-mid); margin-bottom: .5rem; }
.jp-lead__meta { display: flex; flex-wrap: wrap; gap: .8rem; font-family: var(--md-f-mono); font-size: .72rem; color: var(--md-muted); margin-bottom: .9rem; }
.jp-lead__meta a { color: var(--md-brand-3); }
.jp-lead__btns { display: flex; gap: .5rem; flex-wrap: wrap; }

.jp-btn, .jp-ctabtn {
  display: inline-flex; align-items: center; gap: .4rem;
  padding: .5rem .95rem;
  border-radius: var(--md-r);
  font-size: .8rem; font-weight: 600;
  border: 1px solid transparent;
  transition: .15s;
  cursor: pointer;
}
.jp-btn--solid { background: var(--md-ink); color: #fff; border-color: var(--md-ink); }
.jp-btn--solid:hover { background: var(--md-brand); border-color: var(--md-brand); color: #fff; }
.jp-btn--ghost { background: transparent; color: var(--md-ink); border-color: var(--md-line-2); }
.jp-btn--ghost:hover { border-color: var(--md-accent); background: var(--md-wash); color: var(--md-brand); }

/* secondary list next to lead */
.jp-ss { border-left: var(--md-rule); padding-left: 1.5rem; }
@media (max-width: 900px) { .jp-ss { border-left: 0; padding-left: 0; border-top: var(--md-rule); padding-top: 1.25rem; } }
.jp-ss__lbl { color: var(--md-muted); display: block; margin-bottom: .9rem; padding-bottom: .5rem; border-bottom: 2px solid var(--md-ink); }
.jp-ss-item { display: flex; gap: .8rem; padding: .75rem 0; border-bottom: var(--md-rule); }
.jp-ss-item:last-child { border-bottom: 0; }
.jp-ss-item__n {
  flex-shrink: 0;
  width: 26px; height: 26px;
  display: flex; align-items: center; justify-content: center;
  background: var(--md-wash); color: var(--md-brand);
  font-family: var(--md-f-mono); font-size: .72rem; font-weight: 700;
  border-radius: var(--md-r);
}
.jp-ss-item__sec { font-family: var(--md-f-mono); font-size: .62rem; text-transform: uppercase; letter-spacing: .1em; color: var(--md-accent-2); margin-bottom: .18rem; }
.jp-ss-item__title { display: block; font-size: .87rem; font-weight: 500; line-height: 1.4; color: var(--md-ink); }
.jp-ss-item__title:hover { color: var(--md-brand-3); }
.jp-ss-item__au { font-size: .76rem; color: var(--md-muted); margin-top: .2rem; }

/* slider nav (featured carousel) */
.jp-slider-nav { display: flex; align-items: center; gap: 1rem; margin-top: 1.25rem; padding-top: .9rem; border-top: var(--md-rule); }
.jp-slider-dots { display: flex; gap: .3rem; }
.jp-slider-dot { width: 22px; height: 3px; border: 0; background: var(--md-line-2); cursor: pointer; padding: 0; }
.jp-slider-dot.active { background: var(--md-accent); }
.jp-slider-counter { font-family: var(--md-f-mono); font-size: .72rem; color: var(--md-muted); margin-left: auto; }
.jp-slider-arrows { display: flex; gap: .35rem; }
.jp-slider-arr {
  width: 30px; height: 30px;
  border: 1px solid var(--md-line-2); background: #fff;
  border-radius: var(--md-r);
  color: var(--md-ink); cursor: pointer; font-size: 1rem; line-height: 1;
}
.jp-slider-arr:hover { background: var(--md-ink); color: #fff; border-color: var(--md-ink); }
.jp-slider-progress { height: 3px; background: var(--md-line); margin-top: .6rem; }
.jp-slider-progress-bar { height: 100%; background: var(--md-accent); transition: width .3s; }

/* ── Body grid — SIDEBAR LEFT (naya layout) ── */
/* NOTE: .jp-body do jagah use hoti hai — journal home wrapper (direct child of .jp)
   aur CustomPage ka prose container. Isliye padding sirf journal home par. */
.jp > .jp-body { padding: 2.25rem 0 3rem; }
.jp-body__grid {
  display: grid;
  grid-template-columns: 320px minmax(0, 1fr);
  gap: 2.5rem;
  align-items: start;
}
.jp-body__grid > main { order: 2; min-width: 0; }
.jp-sb { order: 1; }
@media (max-width: 1023px) {
  .jp-body__grid { grid-template-columns: 1fr; gap: 1.75rem; }
  .jp-body__grid > main { order: 1; }
  .jp-sb { order: 2; }
}

/* section head */
.jp-sh { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; margin-bottom: 1.1rem; padding-bottom: .55rem; border-bottom: 2px solid var(--md-ink); }
.jp-sh__t { color: var(--md-ink); }
.jp-sh__more { font-size: .78rem; font-weight: 600; color: var(--md-brand-3); white-space: nowrap; }
.jp-sh__more:hover { color: var(--md-accent-2); }

/* ── Article rows (ruled list, no cards) ── */
.jp-artlist { display: flex; flex-direction: column; }
.jp-arow {
  display: grid;
  grid-template-columns: 78px minmax(0,1fr);
  gap: 1.1rem;
  padding: 1.15rem 0;
  border-bottom: var(--md-rule);
  transition: .15s;
}
.jp-arow:hover { background: rgba(232,163,23,.05); box-shadow: -12px 0 0 rgba(232,163,23,.05), 12px 0 0 rgba(232,163,23,.05); }
.jp-arow__img {
  width: 78px; height: 100px; object-fit: cover;
  border: 1px solid var(--md-line);
  border-radius: var(--md-r);
  background: var(--md-wash);
}
.jp-arow__sec { font-family: var(--md-f-mono); font-size: .63rem; text-transform: uppercase; letter-spacing: .12em; color: var(--md-accent-2); margin-bottom: .3rem; }
.jp-arow__title {
  display: block;
  font-family: var(--md-f-display);
  font-size: 1.03rem; font-weight: 600; line-height: 1.35;
  letter-spacing: -.012em;
  color: var(--md-ink);
  margin-bottom: .3rem;
}
.jp-arow__title:hover { color: var(--md-brand-3); }
.jp-arow__au { font-size: .81rem; color: var(--md-mid); margin-bottom: .45rem; }
.jp-arow__foot { display: flex; align-items: center; gap: .85rem; flex-wrap: wrap; font-family: var(--md-f-mono); font-size: .7rem; color: var(--md-muted); }
.jp-arow__doi a { color: var(--md-brand-3); }
.jp-arow__doi a:hover { text-decoration: underline; }
.jp-arow__views { display: inline-flex; align-items: center; gap: .25rem; }
.jp-arow__lnks { display: inline-flex; gap: .5rem; margin-left: auto; }
.jp-arow__lnk {
  display: inline-flex; align-items: center; gap: .25rem;
  padding: .25rem .55rem;
  border: 1px solid var(--md-line-2);
  border-radius: var(--md-r);
  font-size: .7rem; font-weight: 600;
  color: var(--md-ink);
  font-family: var(--md-f-text);
}
.jp-arow__lnk:hover { background: var(--md-ink); color: #fff; border-color: var(--md-ink); }
@media (max-width: 560px) {
  .jp-arow { grid-template-columns: 56px minmax(0,1fr); gap: .8rem; }
  .jp-arow__img { width: 56px; height: 74px; }
  .jp-arow__lnks { margin-left: 0; width: 100%; margin-top: .3rem; }
}

/* ── Sidebar blocks ── */
.jp-sb-blk {
  background: var(--md-surface);
  border: var(--md-rule);
  border-top: 3px solid var(--md-ink);
  border-radius: var(--md-r);
  padding: 1.1rem 1.15rem 1.2rem;
  margin-bottom: 1.1rem;
}
.jp-sb-blk:nth-child(even) { border-top-color: var(--md-accent); }
.jp-sb-h {
  font-family: var(--md-f-mono);
  font-size: .68rem; text-transform: uppercase; letter-spacing: .14em;
  color: var(--md-brand);
  margin-bottom: .85rem;
  padding-bottom: .5rem;
  border-bottom: var(--md-rule);
}
.jp-cover { width: 100%; border: 1px solid var(--md-line); border-radius: var(--md-r); margin-bottom: .85rem; }
.jp-jinfo { display: grid; grid-template-columns: auto 1fr; gap: .35rem .8rem; margin: 0 0 .75rem; font-size: .79rem; }
.jp-jinfo dt { font-family: var(--md-f-mono); font-size: .66rem; text-transform: uppercase; letter-spacing: .08em; color: var(--md-muted); }
.jp-jinfo dd { margin: 0; color: var(--md-ink); font-family: var(--md-f-mono); font-size: .74rem; }
.jp-jinfo dd a { color: var(--md-brand-3); }

.jp-isbox { background: var(--md-brand); color: #fff; border-radius: var(--md-r); padding: .95rem 1rem; }
.jp-isbox__lbl { font-family: var(--md-f-mono); font-size: .62rem; text-transform: uppercase; letter-spacing: .14em; color: var(--md-accent); }
.jp-isbox__vol { font-family: var(--md-f-display); font-size: 1.05rem; font-weight: 600; margin: .25rem 0 .7rem; }
.jp-islink {
  display: inline-flex; align-items: center; gap: .35rem;
  font-size: .78rem; font-weight: 600;
  color: var(--md-accent);
  border-bottom: 1px solid transparent;
}
.jp-islink:hover { border-bottom-color: currentColor; }
.jp-sb-blk > .jp-islink { color: var(--md-brand-3); }

.jp-eic { display: flex; gap: .7rem; align-items: center; }
.jp-eic__av {
  width: 42px; height: 42px; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  background: var(--md-wash); color: var(--md-brand);
  border-radius: var(--md-r);
  font-family: var(--md-f-mono); font-weight: 700; font-size: .8rem;
}
.jp-eic__name { font-size: .87rem; font-weight: 600; color: var(--md-ink); }
.jp-eic__aff { font-size: .75rem; color: var(--md-muted); line-height: 1.45; }

.jp-rank-item, .jp-cited-item { display: flex; gap: .7rem; padding: .6rem 0; border-bottom: var(--md-rule); }
.jp-rank-item:last-child, .jp-cited-item:last-child { border-bottom: 0; padding-bottom: 0; }
.jp-rank-item__n, .jp-cited-num {
  flex-shrink: 0;
  font-family: var(--md-f-display);
  font-size: 1.1rem; font-weight: 700;
  color: var(--md-line-2);
  line-height: 1;
  width: 22px;
}
.jp-rank-item__title, .jp-cited-title { display: block; font-size: .83rem; font-weight: 500; line-height: 1.4; color: var(--md-ink); }
.jp-rank-item__title:hover, .jp-cited-title:hover { color: var(--md-brand-3); }
.jp-rank-item__meta, .jp-cited-meta { font-family: var(--md-f-mono); font-size: .68rem; color: var(--md-muted); margin-top: .2rem; }
.jp-cited-count { color: var(--md-accent-2); font-weight: 500; }

/* ── Bottom CTA strip ── */
.jp-cta { background: var(--md-ink); color: #fff; padding: 2.25rem 0; border-top: 3px solid var(--md-accent); }
.jp-cta__inner { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; flex-wrap: wrap; }
.jp-cta__title { font-family: var(--md-f-display); font-size: 1.45rem; font-weight: 600; letter-spacing: -.02em; color: #fff; }
.jp-cta__sub { font-size: .87rem; color: rgba(255,255,255,.62); margin-top: .25rem; max-width: 56ch; }
.jp-cta__btns { display: flex; gap: .6rem; flex-wrap: wrap; }
.jp-ctabtn--w { background: var(--md-accent); color: var(--md-ink); border-color: var(--md-accent); font-weight: 700; }
.jp-ctabtn--w:hover { background: #fff; border-color: #fff; }
.jp-ctabtn--o { background: transparent; color: #fff; border-color: rgba(255,255,255,.3); }
.jp-ctabtn--o:hover { border-color: var(--md-accent); color: var(--md-accent); }

/* custom page meta (CustomPage.tsx) */
.jp-meta { margin-top: 1.5rem; padding-top: .8rem; border-top: var(--md-rule); }
.jp-meta__text { font-family: var(--md-f-mono); font-size: .7rem; color: var(--md-muted); }


/* ═══════════════════════════════════════════════════════════════════════════
   6. MAIN SITE HOME  (RootHomePage.tsx — ep-*)
   NAYA: split hero (text left / stats-slab right), journal tiles as
   numbered index cards, ticker strip, ink CTA.
   ═══════════════════════════════════════════════════════════════════════════ */
.ep-main { background: var(--md-canvas); }
.ep-sec { padding: 3.25rem 0; }
.ep-sec--white { background: var(--md-surface); }
.ep-sec--cream { background: var(--md-wash); }

/* ── Hero ── */
.ep-hero {
  position: relative;
  background: var(--md-brand);
  color: #fff;
  overflow: hidden;
  border-bottom: 3px solid var(--md-accent);
}
.ep-hero__grad {
  position: absolute; inset: 0;
  background:
    radial-gradient(circle at 82% 18%, rgba(232,163,23,.24), transparent 48%),
    linear-gradient(150deg, var(--md-brand) 0%, #17143C 70%);
}
.ep-hero__grid {
  position: absolute; inset: 0;
  background-image:
    linear-gradient(rgba(255,255,255,.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.05) 1px, transparent 1px);
  background-size: 44px 44px;
  mask-image: linear-gradient(180deg, rgba(0,0,0,.9), transparent 85%);
}
.ep-hero__wrap {
  position: relative; z-index: 2;
  max-width: var(--md-wrap); margin: 0 auto; padding: 3.75rem 24px 3.25rem;
  display: grid; grid-template-columns: 1.35fr 1fr; gap: 3rem; align-items: center;
}
@media (max-width: 940px) { .ep-hero__wrap { grid-template-columns: 1fr; gap: 2rem; padding: 2.5rem 16px; } }

.ep-hero__pill {
  display: inline-flex; align-items: center; gap: .45rem;
  padding: .3rem .7rem;
  border: 1px solid rgba(255,255,255,.24);
  border-radius: var(--md-r);
  font-family: var(--md-f-mono);
  font-size: .66rem; text-transform: uppercase; letter-spacing: .12em;
  color: rgba(255,255,255,.8);
  margin-bottom: 1.1rem;
}
.ep-hero__live { width: 6px; height: 6px; border-radius: 50%; background: var(--md-accent); box-shadow: 0 0 0 3px rgba(232,163,23,.25); }
.ep-hero__h1 {
  font-family: var(--md-f-display);
  font-size: clamp(2rem, 5vw, 3.35rem);
  font-weight: 600; line-height: 1.05; letter-spacing: -.035em;
  color: #fff; margin: 0 0 .5rem;
}
.ep-hero__sub { font-family: var(--md-f-display); font-size: 1.1rem; font-weight: 400; color: var(--md-accent); margin: 0 0 1rem; }
.ep-hero__desc { font-size: .93rem; line-height: 1.75; color: rgba(255,255,255,.7); max-width: 58ch; margin-bottom: 1.5rem; }
.ep-hero__cta { display: flex; gap: .6rem; flex-wrap: wrap; margin-bottom: 1.6rem; }
.ep-hero__cta > a:first-child,
.ep-cta__btns > a:first-child {
  display: inline-flex; align-items: center; gap: .45rem;
  padding: .7rem 1.35rem;
  background: var(--md-accent); color: var(--md-ink);
  border: 1px solid var(--md-accent); border-radius: var(--md-r);
  font-size: .86rem; font-weight: 700;
  box-shadow: 4px 4px 0 rgba(255,255,255,.2);
  transition: .15s;
}
.ep-hero__cta > a:first-child:hover { background: #fff; border-color: #fff; transform: translate(-1px,-1px); box-shadow: 4px 4px 0 var(--md-accent); }
.ep-hero__ghost, .ep-cta__ghost {
  display: inline-flex; align-items: center; gap: .4rem;
  padding: .7rem 1.2rem;
  border: 1px solid rgba(255,255,255,.32);
  border-radius: var(--md-r);
  font-size: .86rem; font-weight: 600; color: #fff;
  transition: .15s;
}
.ep-hero__ghost:hover, .ep-cta__ghost:hover { border-color: var(--md-accent); color: var(--md-accent); }
.ep-hero__indexed { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; }
.ep-hero__idx-lbl { font-family: var(--md-f-mono); font-size: .64rem; text-transform: uppercase; letter-spacing: .12em; color: rgba(255,255,255,.5); }
.ep-hero__idx-chip {
  padding: .2rem .55rem;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: var(--md-r);
  font-size: .7rem; color: rgba(255,255,255,.72);
}

/* stat slab */
.ep-hero__right { display: flex; justify-content: flex-end; }
.ep-hero__stats {
  display: grid; grid-template-columns: 1fr 1fr;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.16);
  border-radius: var(--md-r);
  backdrop-filter: blur(4px);
  width: 100%;
  max-width: 400px;
}
.ep-stat {
  padding: 1.15rem 1.25rem;
  border-right: 1px solid rgba(255,255,255,.12);
  border-bottom: 1px solid rgba(255,255,255,.12);
}
.ep-stat:nth-child(2n) { border-right: 0; }
.ep-stat:nth-last-child(-n+2) { border-bottom: 0; }
.ep-stat__n { display: block; font-family: var(--md-f-display); font-size: 1.7rem; font-weight: 700; color: var(--md-accent); line-height: 1; }
.ep-stat__l { display: block; font-family: var(--md-f-mono); font-size: .62rem; text-transform: uppercase; letter-spacing: .1em; color: rgba(255,255,255,.6); margin-top: .3rem; }
.ep-hero__tiles { display: none; }

/* journal round-slider inside hero area */
.ep-rslider { position: relative; margin-top: 1.5rem; }
.ep-rslider__track { display: flex; gap: 1.1rem; overflow-x: auto; scroll-behavior: smooth; scrollbar-width: none; padding: .25rem 0; }
.ep-rslider__track::-webkit-scrollbar { display: none; }
.ep-rslide { flex: 0 0 auto; width: 96px; text-align: center; }
.ep-rslide__circle {
  width: 68px; height: 68px; margin: 0 auto .45rem;
  display: flex; align-items: center; justify-content: center;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.22);
  border-radius: var(--md-r);
  font-family: var(--md-f-display); font-weight: 700; font-size: 1rem;
  color: var(--md-accent);
  transition: .15s;
}
.ep-rslide:hover .ep-rslide__circle { background: var(--md-accent); color: var(--md-brand); border-color: var(--md-accent); }
.ep-rslide__name { font-size: .72rem; font-weight: 600; color: rgba(255,255,255,.85); margin: 0; line-height: 1.3; }
.ep-rslide__count { font-family: var(--md-f-mono); font-size: .62rem; color: rgba(255,255,255,.5); margin: .1rem 0 0; }
.ep-rslider__btn {
  position: absolute; top: 24px;
  width: 28px; height: 28px;
  background: rgba(255,255,255,.1);
  border: 1px solid rgba(255,255,255,.25);
  border-radius: var(--md-r);
  color: #fff; cursor: pointer; font-size: 1rem; line-height: 1;
}
.ep-rslider__btn--prev { left: -8px; }
.ep-rslider__btn--next { right: -8px; }
.ep-rslider__btn:hover { background: var(--md-accent); color: var(--md-brand); border-color: var(--md-accent); }
.ep-rslider__dots { display: flex; gap: .25rem; justify-content: center; margin-top: .6rem; }
.ep-rslider__dot { width: 16px; height: 2px; background: rgba(255,255,255,.25); }
.ep-rslider__dot--on { background: var(--md-accent); }

/* ── Ticker ── */
.ep-ticker {
  display: flex; align-items: center; gap: 1rem;
  background: var(--md-ink); color: rgba(255,255,255,.75);
  padding: .55rem 24px;
  overflow: hidden;
}
.ep-ticker__lbl {
  flex-shrink: 0;
  font-family: var(--md-f-mono); font-size: .62rem;
  text-transform: uppercase; letter-spacing: .14em;
  color: var(--md-accent);
  padding-right: 1rem; border-right: 1px solid rgba(255,255,255,.18);
}
.ep-ticker__track { display: flex; gap: 2.5rem; animation: md-ticker 26s linear infinite; white-space: nowrap; }
.ep-ticker__item { font-family: var(--md-f-mono); font-size: .72rem; letter-spacing: .05em; }
@keyframes md-ticker { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) { .ep-ticker__track { animation: none; } }

/* ── Section heads ── */
.ep-shd { margin-bottom: 1.75rem; position: relative; padding-bottom: .75rem; border-bottom: 2px solid var(--md-ink); }
.ep-shd--c { text-align: center; border-bottom-color: rgba(255,255,255,.25); }
.ep-eyebrow { display: block; color: var(--md-accent-2); margin-bottom: .35rem; }
.ep-eyebrow--g { color: var(--md-accent); }
.ep-shd__h2 { font-family: var(--md-f-display); font-size: clamp(1.35rem, 2.6vw, 1.95rem); font-weight: 600; letter-spacing: -.025em; margin: 0; }
.ep-shd__h2--lt { color: #fff; }
.ep-shd__sub { font-size: .87rem; color: var(--md-muted); margin: .3rem 0 0; }
.ep-shd__sub--lt { color: rgba(255,255,255,.6); }
.ep-shd__more { position: absolute; right: 0; bottom: .8rem; font-size: .8rem; font-weight: 600; color: var(--md-brand-3); }
.ep-shd__more:hover { color: var(--md-accent-2); }
@media (max-width: 640px) { .ep-shd__more { position: static; display: inline-block; margin-top: .5rem; } }

/* ── Article cards grid ── */
.ep-acgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: 1.25rem; }
.ep-ac {
  background: var(--md-surface);
  border: var(--md-rule);
  border-radius: var(--md-r);
  display: flex; flex-direction: column;
  transition: .15s;
  position: relative;
}
.ep-ac:hover { border-color: var(--md-ink); box-shadow: var(--md-sh-hard); transform: translate(-2px,-2px); }
.ep-ac__cover {
  position: relative;
  height: 132px;
  background: var(--md-brand);
  display: flex; align-items: center; justify-content: center;
  overflow: hidden;
  border-bottom: 2px solid var(--md-accent);
}
.ep-ac__cover-img { width: 100%; height: 100%; object-fit: cover; }
.ep-ac__mono { color: rgba(255,255,255,.35); font-family: var(--md-f-display); }
.ep-ac__rank {
  position: absolute; top: 8px; left: 8px;
  background: var(--md-accent); color: var(--md-ink);
  font-family: var(--md-f-mono); font-size: .66rem; font-weight: 700;
  padding: .15rem .45rem; border-radius: var(--md-r);
}
.ep-ac__tag {
  position: absolute; bottom: 8px; left: 8px;
  background: rgba(0,0,0,.6); color: #fff;
  font-family: var(--md-f-mono); font-size: .62rem;
  text-transform: uppercase; letter-spacing: .08em;
  padding: .15rem .45rem; border-radius: var(--md-r);
}
.ep-ac__jbadge {
  position: absolute; top: 8px; right: 8px;
  width: 30px; height: 30px;
  display: flex; align-items: center; justify-content: center;
  background: rgba(255,255,255,.9); color: var(--md-brand);
  font-family: var(--md-f-mono); font-size: .64rem; font-weight: 700;
  border-radius: var(--md-r);
}
.ep-ac__body { padding: .9rem 1rem 1rem; display: flex; flex-direction: column; flex: 1; }
.ep-ac__jname { font-family: var(--md-f-mono); font-size: .64rem; text-transform: uppercase; letter-spacing: .1em; color: var(--md-accent-2); margin: 0 0 .35rem; }
.ep-ac__title {
  font-family: var(--md-f-display);
  font-size: .98rem; font-weight: 600; line-height: 1.32;
  color: var(--md-ink); margin-bottom: .4rem;
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}
.ep-ac__title:hover { color: var(--md-brand-3); }
.ep-ac__authors { font-size: .78rem; color: var(--md-mid); margin: 0 0 .35rem; }
.ep-ac__abs { font-size: .79rem; color: var(--md-muted); line-height: 1.55; margin: 0 0 .6rem; }
.ep-ac__chips { display: flex; gap: .4rem; flex-wrap: wrap; margin-bottom: .7rem; }
.ep-ac__doi { font-family: var(--md-f-mono); font-size: .68rem; color: var(--md-brand-3); word-break: break-all; }
.ep-ac__btns { display: flex; gap: .4rem; margin-top: auto; }
.ep-ac__btn {
  flex: 1; text-align: center;
  padding: .42rem .5rem;
  border: 1px solid var(--md-line-2);
  border-radius: var(--md-r);
  font-size: .75rem; font-weight: 600;
  transition: .15s;
}
.ep-ac__btn--full { background: var(--md-ink); color: #fff; border-color: var(--md-ink); }
.ep-ac__btn--full:hover { background: var(--md-brand); color: #fff; }
.ep-ac__btn--pdf { color: var(--md-ink); }
.ep-ac__btn--pdf:hover { background: var(--md-accent); border-color: var(--md-accent); color: var(--md-ink); }

/* ── Journal portfolio grid ── */
.ep-jgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 1.1rem; }
.ep-jcard {
  background: var(--md-surface);
  border: var(--md-rule);
  border-radius: var(--md-r);
  overflow: hidden;
  display: flex; flex-direction: column;
  transition: .15s;
}
.ep-jcard:hover { border-color: var(--md-ink); box-shadow: var(--md-sh-amber); transform: translate(-2px,-2px); }
.ep-jcard__cover {
  position: relative;
  height: 118px;
  background: linear-gradient(140deg, var(--md-brand), #17143C);
  display: flex; align-items: center; justify-content: center;
}
.ep-jcard__no {
  font-family: var(--md-f-display);
  font-size: 2.4rem; font-weight: 700; font-style: normal;
  color: rgba(255,255,255,.16);
}
.ep-jcard__body { padding: .85rem .95rem 1rem; display: flex; flex-direction: column; flex: 1; }
.ep-jcard__title { font-family: var(--md-f-display); font-size: .92rem; font-weight: 600; line-height: 1.3; color: var(--md-ink); margin: 0 0 .3rem; }
.ep-jcard__issn { font-family: var(--md-f-mono); font-size: .66rem; color: var(--md-muted); margin: 0; }
.ep-jcard__foot { display: flex; align-items: center; justify-content: space-between; margin-top: auto; padding-top: .7rem; font-family: var(--md-f-mono); font-size: .68rem; color: var(--md-muted); }
.ep-jcard__arr { color: var(--md-accent-2); font-size: .9rem; transition: transform .15s; }
.ep-jcard:hover .ep-jcard__arr { transform: translateX(4px); }

/* ── Why-us band ── */
.ep-why { background: var(--md-brand); color: #fff; padding: 3.25rem 0; }
.ep-feats { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 1.5rem; }
.ep-feat { border-left: 2px solid rgba(255,255,255,.2); padding-left: 1rem; }
.ep-feat:hover { border-left-color: var(--md-accent); }
.ep-feat__ico { font-size: 1.4rem; display: block; margin-bottom: .5rem; }
.ep-feat__title { display: block; font-family: var(--md-f-display); font-size: 1rem; font-weight: 600; color: #fff; margin-bottom: .3rem; }
.ep-feat__text { font-size: .83rem; color: rgba(255,255,255,.65); line-height: 1.65; margin: 0; }

/* ── Bottom CTA ── */
.ep-cta { background: var(--md-ink); color: #fff; padding: 3rem 0; border-top: 3px solid var(--md-accent); }
.ep-cta__in { max-width: 780px; margin: 0 auto; padding: 0 24px; text-align: center; }
.ep-cta__over { font-family: var(--md-f-mono); font-size: .66rem; text-transform: uppercase; letter-spacing: .16em; color: var(--md-accent); }
.ep-cta__h2 { font-family: var(--md-f-display); font-size: clamp(1.5rem, 3.2vw, 2.25rem); font-weight: 600; letter-spacing: -.03em; color: #fff; margin: .5rem 0 .6rem; }
.ep-cta__p { font-size: .9rem; color: rgba(255,255,255,.65); margin-bottom: 1.4rem; }
.ep-cta__btns { display: flex; gap: .6rem; justify-content: center; flex-wrap: wrap; }
.ep-cta__note { font-family: var(--md-f-mono); font-size: .7rem; color: rgba(255,255,255,.45); margin-top: 1rem; }


/* ═══════════════════════════════════════════════════════════════════════════
   7. ISSUE VIEW / CUSTOM PAGE / EDITORIAL BOARD  (iv-*, eb-*)
   NAYA LAYOUT: TOC ab RIGHT side par hai (pehle left tha), content left.
   ═══════════════════════════════════════════════════════════════════════════ */
.iv { background: var(--md-canvas); }

/* breadcrumb bar */
.iv-crumb, .ia-crumb { background: var(--md-surface); border-bottom: var(--md-rule); }
.iv-crumb__list, .ia-crumb__list {
  display: flex; align-items: center; gap: .45rem; flex-wrap: wrap;
  list-style: none; margin: 0; padding: .6rem 0;
  font-family: var(--md-f-mono);
  font-size: .68rem; text-transform: uppercase; letter-spacing: .08em;
  color: var(--md-muted);
}
.iv-crumb__item::after, .ia-crumb__item::after { content: '/'; margin-left: .45rem; opacity: .45; }
.iv-crumb__item--active::after, .ia-crumb__item--active::after { content: none; }
.iv-crumb__item--active, .ia-crumb__item--active { color: var(--md-ink); font-weight: 500; }
.iv-crumb a:hover, .ia-crumb a:hover { color: var(--md-brand-3); }

/* issue banner */
.iv-banner {
  background: var(--md-brand);
  background-image: linear-gradient(140deg, var(--md-brand), #17143C);
  color: #fff;
  padding: 2.25rem 0 2rem;
  border-bottom: 3px solid var(--md-accent);
}
.iv-banner__top { display: flex; align-items: flex-start; justify-content: space-between; gap: 1.5rem; flex-wrap: wrap; }
.iv-banner__vol {
  font-family: var(--md-f-display);
  font-size: clamp(1.5rem, 3.4vw, 2.35rem);
  font-weight: 600; letter-spacing: -.03em; line-height: 1.1;
  color: #fff;
}
.iv-banner__vol::after { content: ''; display: block; width: 54px; height: 3px; background: var(--md-accent); margin-top: .75rem; }
.iv-banner__meta { display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; margin-top: .85rem; font-family: var(--md-f-mono); font-size: .72rem; color: rgba(255,255,255,.65); }
.iv-count-badge, .ia-count-badge {
  display: inline-flex; align-items: center; gap: .3rem;
  padding: .2rem .55rem;
  border: 1px solid rgba(255,255,255,.25);
  border-radius: var(--md-r);
  font-family: var(--md-f-mono); font-size: .68rem;
  color: var(--md-accent);
}
.iv-banner__desc { font-size: .88rem; line-height: 1.7; color: rgba(255,255,255,.7); max-width: 68ch; margin-top: .9rem; }
.iv-banner__actions { display: flex; gap: .55rem; flex-wrap: wrap; flex-shrink: 0; }
.iv-btn, .iv-hbtn {
  display: inline-flex; align-items: center; gap: .4rem;
  padding: .55rem 1.05rem;
  border-radius: var(--md-r);
  font-size: .8rem; font-weight: 600;
  border: 1px solid transparent;
  transition: .15s;
}
.iv-btn--brand, .iv-hbtn--gold { background: var(--md-accent); color: var(--md-ink); border-color: var(--md-accent); }
.iv-btn--brand:hover { background: #fff; border-color: #fff; }
.iv-btn--ghost, .iv-hbtn--ghost { color: #fff; border-color: rgba(255,255,255,.3); }
.iv-btn--ghost:hover { border-color: var(--md-accent); color: var(--md-accent); }
.iv-btn--primary { background: var(--md-ink); color: #fff; border-color: var(--md-ink); }
.iv-btn--pdf { background: transparent; color: var(--md-ink); border-color: var(--md-line-2); }

/* mobile section filter */
.iv-mobile-filter { display: none; background: var(--md-wash); border-bottom: var(--md-rule); padding: .7rem 0; }
.iv-mobile-select, .iv-mobile-select-main {
  width: 100%; height: 40px; padding: 0 .7rem;
  border: 1px solid var(--md-line-2); border-radius: var(--md-r);
  background: #fff; font-size: .84rem; color: var(--md-ink);
}
@media (max-width: 1023px) { .iv-mobile-filter { display: block; } }

/* body grid — TOC right */
.iv-body { padding: 2rem 0 3rem; }
.iv-body__grid {
  display: grid;
  grid-template-columns: minmax(0,1fr) 262px;
  gap: 2.25rem;
  align-items: start;
}
.iv-main { order: 1; min-width: 0; }
.iv-toc { order: 2; }
@media (max-width: 1023px) {
  .iv-body__grid { grid-template-columns: 1fr; }
  .iv-toc { display: none; }
}
.iv-toc-wrap {
  position: sticky; top: calc(var(--md-sticky-top) + 12px);
  background: var(--md-surface);
  border: var(--md-rule);
  border-top: 3px solid var(--md-ink);
  border-radius: var(--md-r);
  padding: .9rem 0 .5rem;
  max-height: calc(100vh - var(--md-sticky-top) - 40px);
  overflow-y: auto;
  overscroll-behavior: contain;
}
.iv-toc__head, .iv-toc-head { color: var(--md-brand); padding: 0 1rem .6rem; border-bottom: var(--md-rule); }
.iv-toc__list { list-style: none; margin: .4rem 0 0; padding: 0; }
.iv-toc__link {
  display: flex; align-items: center; justify-content: space-between; gap: .5rem;
  padding: .42rem 1rem;
  font-size: .81rem; color: var(--md-mid);
  border-left: 2px solid transparent;
  transition: .12s;
}
.iv-toc__link:hover { background: var(--md-wash); color: var(--md-brand); }
.iv-toc__link.is-active { border-left-color: var(--md-accent); background: var(--md-wash); color: var(--md-brand); font-weight: 600; }
.iv-toc__count {
  font-family: var(--md-f-mono); font-size: .66rem;
  color: var(--md-muted); background: var(--md-wash);
  padding: .05rem .35rem; border-radius: var(--md-r);
}
.iv-toc__empty { display: block; padding: .5rem 1rem; font-size: .78rem; color: var(--md-muted); }
.toc-h3 { padding-left: .75rem; }
.toc-h4 { padding-left: 1.4rem; font-size: .78rem; }

/* section heads inside issue */
.iv-section-group, .eb-section-group { margin-bottom: 2rem; }
.iv-sec-head {
  display: flex; align-items: baseline; gap: .75rem;
  padding-bottom: .5rem; margin-bottom: 1rem;
  border-bottom: 2px solid var(--md-ink);
}
.iv-sec-head__name { font-family: var(--md-f-display); font-size: 1.05rem; font-weight: 600; color: var(--md-ink); }
.iv-sec-head__n { font-family: var(--md-f-mono); font-size: .68rem; color: var(--md-muted); margin-left: auto; }

/* article row in issue */
.iv-art {
  padding: 1.05rem 0 1.05rem 1rem;
  border-bottom: var(--md-rule);
  border-left: 3px solid transparent;
  transition: .15s;
}
.iv-art:hover { border-left-color: var(--md-accent); background: rgba(232,163,23,.045); }
.iv-art__oa { display: inline-flex; align-items: center; gap: .35rem; margin-bottom: .35rem; }
.iv-art__section, .iv-badge-section {
  font-family: var(--md-f-mono); font-size: .62rem;
  text-transform: uppercase; letter-spacing: .12em;
  color: var(--md-accent-2);
}
.iv-art__title {
  display: block;
  font-family: var(--md-f-display);
  font-size: 1.02rem; font-weight: 600; line-height: 1.35;
  color: var(--md-ink); margin-bottom: .3rem;
}
.iv-art__title:hover { color: var(--md-brand-3); }
.iv-art__authors { font-size: .82rem; color: var(--md-mid); margin-bottom: .35rem; }
.iv-art__meta { display: flex; gap: .85rem; flex-wrap: wrap; font-family: var(--md-f-mono); font-size: .7rem; color: var(--md-muted); margin-bottom: .5rem; }
.iv-art__actions { display: flex; gap: .45rem; flex-wrap: wrap; }
.iv-art__btn {
  display: inline-flex; align-items: center; gap: .3rem;
  padding: .3rem .7rem;
  border: 1px solid var(--md-line-2); border-radius: var(--md-r);
  font-size: .74rem; font-weight: 600; color: var(--md-ink);
  transition: .15s;
}
.iv-art__btn--primary { background: var(--md-ink); color: #fff; border-color: var(--md-ink); }
.iv-art__btn--primary:hover { background: var(--md-brand); }
.iv-art__btn--pdf:hover { background: var(--md-accent); border-color: var(--md-accent); color: var(--md-ink); }

.iv-empty { padding: 2.5rem 1rem; text-align: center; color: var(--md-muted); font-size: .9rem; border: 1px dashed var(--md-line-2); border-radius: var(--md-r); background: var(--md-surface); }
.iv-back, .iv-back-link { display: inline-flex; align-items: center; gap: .4rem; margin-top: 1.5rem; font-size: .82rem; font-weight: 600; color: var(--md-brand-3); }
.iv-back:hover { color: var(--md-accent-2); }
.iv-divider { border-top: var(--md-rule); margin: 1.5rem 0; }

/* ── Editorial board ── */
.iv-search-bar { margin-bottom: 1.25rem; }
.iv-search-wrap { display: flex; align-items: center; gap: .75rem; flex-wrap: wrap; }
.iv-search-input {
  flex: 1; min-width: 220px; height: 42px; padding: 0 .8rem;
  border: 1px solid var(--md-line-2); border-radius: var(--md-r);
  background: #fff; font-size: .86rem;
}
.iv-search-input:focus { outline: 0; border-color: var(--md-brand-3); }
.iv-search-count { font-family: var(--md-f-mono); font-size: .72rem; color: var(--md-muted); }

.iv-mem {
  display: block;
  background: var(--md-surface);
  border: var(--md-rule);
  border-radius: var(--md-r);
  padding: 1rem 1.1rem;
  margin-bottom: .8rem;
  transition: .15s;
}
.iv-mem:hover { border-color: var(--md-ink); box-shadow: var(--md-sh-2); }
.iv-mem__role { font-family: var(--md-f-mono); font-size: .62rem; text-transform: uppercase; letter-spacing: .12em; color: var(--md-accent-2); margin-bottom: .5rem; }
.iv-mem__top { display: flex; gap: .85rem; align-items: flex-start; }
.iv-mem__avatar {
  flex-shrink: 0;
  width: 46px; height: 46px;
  display: flex; align-items: center; justify-content: center;
  background: var(--md-brand); color: var(--md-accent);
  border-radius: var(--md-r);
  font-family: var(--md-f-mono); font-weight: 700; font-size: .82rem;
}
.iv-mem__name { font-family: var(--md-f-display); font-size: 1rem; font-weight: 600; margin: 0 0 .15rem; color: var(--md-ink); }
.iv-mem__aff { font-size: .81rem; color: var(--md-mid); line-height: 1.5; }
.iv-mem__bio { font-size: .8rem; color: var(--md-muted); line-height: 1.6; margin: .55rem 0 0; }
.iv-mem__actions { display: flex; gap: .4rem; flex-wrap: wrap; margin-top: .7rem; }
.iv-mem__btn {
  display: inline-flex; align-items: center; gap: .3rem;
  padding: .25rem .6rem;
  border: 1px solid var(--md-line-2); border-radius: var(--md-r);
  font-family: var(--md-f-mono); font-size: .68rem; font-weight: 500;
  color: var(--md-mid); transition: .15s;
}
.iv-mem__btn:hover { background: var(--md-ink); color: #fff; border-color: var(--md-ink); }
.iv-mem__btn--orcid:hover { background: #A6CE39; border-color: #A6CE39; color: var(--md-ink); }
.iv-mem__btn--email:hover { background: var(--md-accent); border-color: var(--md-accent); color: var(--md-ink); }


/* ═══════════════════════════════════════════════════════════════════════════
   8. ISSUE ARCHIVE  (IssueArchivePage.tsx — ia-*)
   NAYA: timeline-style list — left year slab + ruled entries
   ═══════════════════════════════════════════════════════════════════════════ */
.ia { background: var(--md-canvas); }
.ia-banner {
  background: var(--md-ink);
  color: #fff;
  padding: 2.25rem 0 2rem;
  border-bottom: 3px solid var(--md-accent);
}
.ia-banner__eyebrow { font-family: var(--md-f-mono); font-size: .66rem; text-transform: uppercase; letter-spacing: .16em; color: var(--md-accent); }
.ia-banner__title, .ia-hero__title {
  font-family: var(--md-f-display);
  font-size: clamp(1.6rem, 3.4vw, 2.45rem);
  font-weight: 600; letter-spacing: -.03em; color: #fff;
  margin: .4rem 0 .5rem;
}
.ia-banner__sub, .ia-hero__sub { font-size: .87rem; color: rgba(255,255,255,.62); display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; }
.ia-hero__kicker { font-family: var(--md-f-mono); font-size: .66rem; text-transform: uppercase; letter-spacing: .16em; color: var(--md-accent); }
.ia-hero__badges { display: flex; gap: .45rem; flex-wrap: wrap; margin-top: .8rem; }
.ia-hero__badge { padding: .2rem .55rem; border: 1px solid rgba(255,255,255,.22); border-radius: var(--md-r); font-size: .7rem; color: rgba(255,255,255,.72); }

.ia-body { padding: 2rem 0 3rem; }
.ia-list { display: flex; flex-direction: column; }
.ia-issue {
  display: grid;
  grid-template-columns: 96px minmax(0,1fr) auto;
  gap: 1.35rem;
  align-items: start;
  padding: 1.35rem 0;
  border-bottom: var(--md-rule);
  transition: .15s;
}
.ia-issue:hover { background: rgba(232,163,23,.05); }
.ia-issue__badge {
  width: 96px; height: 108px;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .3rem;
  background: var(--md-brand);
  color: var(--md-accent);
  border-radius: var(--md-r);
  border-bottom: 3px solid var(--md-accent);
}
.ia-issue__badge-year { font-family: var(--md-f-display); font-size: 1.15rem; font-weight: 700; }
.ia-issue__badge-icon { opacity: .55; }
.ia-issue__body { min-width: 0; }
.ia-issue__oa { display: inline-flex; align-items: center; gap: .3rem; font-family: var(--md-f-mono); font-size: .62rem; text-transform: uppercase; letter-spacing: .12em; color: var(--md-ok); margin-bottom: .3rem; }
.ia-issue__title {
  display: block;
  font-family: var(--md-f-display);
  font-size: 1.15rem; font-weight: 600; line-height: 1.3;
  color: var(--md-ink); margin-bottom: .25rem;
}
.ia-issue__title:hover { color: var(--md-brand-3); }
.ia-issue__subtitle { font-family: var(--md-f-mono); font-size: .72rem; color: var(--md-muted); margin-bottom: .35rem; }
.ia-issue__meta { display: flex; gap: .8rem; flex-wrap: wrap; font-family: var(--md-f-mono); font-size: .7rem; color: var(--md-muted); }
.ia-issue__desc { font-size: .84rem; color: var(--md-mid); line-height: 1.65; margin-top: .5rem; max-width: 70ch; }
.ia-issue__actions { display: flex; flex-direction: column; gap: .4rem; }
.ia-issue__btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .35rem;
  padding: .45rem .95rem;
  border: 1px solid var(--md-line-2); border-radius: var(--md-r);
  font-size: .78rem; font-weight: 600; color: var(--md-ink);
  white-space: nowrap; transition: .15s;
}
.ia-issue__btn--primary { background: var(--md-ink); color: #fff; border-color: var(--md-ink); }
.ia-issue__btn--primary:hover { background: var(--md-accent); border-color: var(--md-accent); color: var(--md-ink); }
.ia-issue__btn--ghost:hover { border-color: var(--md-ink); }
@media (max-width: 720px) {
  .ia-issue { grid-template-columns: 64px minmax(0,1fr); }
  .ia-issue__badge { width: 64px; height: 76px; }
  .ia-issue__actions { grid-column: 1 / -1; flex-direction: row; }
}
.ia-empty { padding: 3rem 1rem; text-align: center; color: var(--md-muted); border: 1px dashed var(--md-line-2); border-radius: var(--md-r); background: var(--md-surface); }

/* pagination */
.ia-pagination, .ia-page-nums { display: flex; align-items: center; justify-content: center; gap: .3rem; margin-top: 2rem; flex-wrap: wrap; }
.ia-pagination__link, .ia-page-btn, .ia-page-num {
  min-width: 34px; height: 34px;
  display: inline-flex; align-items: center; justify-content: center;
  padding: 0 .6rem;
  border: 1px solid var(--md-line-2); border-radius: var(--md-r);
  font-family: var(--md-f-mono); font-size: .76rem;
  color: var(--md-ink); background: var(--md-surface);
  transition: .15s;
}
.ia-pagination__link:hover, .ia-page-btn:hover, .ia-page-num:hover { border-color: var(--md-ink); background: var(--md-ink); color: #fff; }
.ia-pagination__link.is-active, .ia-page-num--active { background: var(--md-accent); border-color: var(--md-accent); color: var(--md-ink); font-weight: 700; }
.ia-pagination__dots, .ia-page-ellipsis { color: var(--md-muted); padding: 0 .25rem; }


/* ═══════════════════════════════════════════════════════════════════════════
   9. ARTICLE PAGE  (ArticleClient.tsx — ar-*, sdref-*)
   NAYA: white reading slab on paper canvas, ink toolbar, dono rails
   hairline-ruled (cards nahi), prose wider aur zyada readable.
   ═══════════════════════════════════════════════════════════════════════════ */
.ar, .ar-body { background: var(--md-canvas); }
.ar, .ar-body, .ar-w, .ar-layout { overflow: visible; }
.ar-toc-col, .ar-sidebar { overflow: visible; }

/* breadcrumb */
.ar-crumb {
  background: var(--md-surface);
  border-bottom: var(--md-rule);
  padding: .55rem 0;
  font-family: var(--md-f-mono);
  font-size: .68rem; text-transform: uppercase; letter-spacing: .08em;
  color: var(--md-muted);
}
.ar-crumb a:hover { color: var(--md-brand-3); }
.ar-crumb-cur { color: var(--md-ink); }

/* header block */
.ar-header { background: var(--md-surface); border-bottom: var(--md-rule); padding: 1.85rem 0 1.5rem; }
.ar-header-inner { max-width: 900px; }
.ar-eyebrow { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; margin-bottom: .7rem; }
.ar-badge-type {
  font-family: var(--md-f-mono); font-size: .62rem;
  text-transform: uppercase; letter-spacing: .12em;
  color: var(--md-brand); background: var(--md-wash);
  padding: .2rem .5rem; border-radius: var(--md-r);
}
.ar-badge-oa {
  display: inline-flex; align-items: center; gap: .25rem;
  font-family: var(--md-f-mono); font-size: .62rem;
  text-transform: uppercase; letter-spacing: .12em;
  color: var(--md-ok);
  border: 1px solid currentColor; border-radius: var(--md-r);
  padding: .15rem .45rem;
}
.ar-title {
  font-family: var(--md-f-display);
  font-size: clamp(1.45rem, 3vw, 2.15rem);
  font-weight: 600; line-height: 1.2; letter-spacing: -.028em;
  color: var(--md-ink);
  margin: 0 0 .8rem;
}
.ar-authors-line { display: flex; flex-wrap: wrap; align-items: center; gap: .12rem .3rem; margin-bottom: .7rem; }
.ar-achip {
  font-size: .87rem; font-weight: 500;
  color: var(--md-brand-3);
  cursor: pointer;
  border-bottom: 1px dotted transparent;
}
.ar-achip:hover { border-bottom-color: currentColor; }
.ar-asep { color: var(--md-muted); }
.ar-corr-note { font-size: .78rem; color: var(--md-muted); }
.ar-metarow { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1rem; font-family: var(--md-f-mono); font-size: .72rem; color: var(--md-muted); }
.ar-metarow-journal { color: var(--md-ink); font-weight: 500; }
.ar-doi a { color: var(--md-brand-3); }
.ar-doi a:hover { text-decoration: underline; }
.ar-citations-badge {
  display: inline-flex; align-items: center; gap: .25rem;
  color: var(--md-accent-2);
  border: 1px solid var(--md-line-2); border-radius: var(--md-r);
  padding: .1rem .45rem;
}

/* ── Sticky toolbar (ink bar) ── */
/* CRITICAL: height WRAP par honi chahiye, toolbar par nahi.
   ArticleClient ka JS har scroll par wrap ki height measure karke
   --ar-toolbar-h me likhta hai. Agar height toolbar par ho to wrap
   = toolbar + border, aur har scroll par 2px badhta jata hai
   (feedback loop → toolbar ek viewport-size dark block ban jata hai).
   box-sizing:border-box se wrap ki outer height exactly var ke barabar
   rehti hai, isliye JS wahi value wapas likhta hai — stable. */
.ar-toolbar-wrap {
  position: sticky;
  top: var(--md-sticky-top);
  z-index: 40;
  background: var(--md-ink);
  border-bottom: 2px solid var(--md-accent);
  height: var(--ar-toolbar-h);
  box-sizing: border-box;
  display: flex;
  align-items: center;
  align-self: start;   /* grid/flex parent me stretch hone se bachao */
  flex: none;
  overflow: visible;
}
.ar-toolbar {
  width: 100%;
  height: 100%;
  max-width: var(--md-wrap); margin: 0 auto; padding: 0 24px;
  display: flex; align-items: center; gap: .35rem;
  overflow-x: auto; overflow-y: visible; scrollbar-width: none;
}
.ar-toolbar::-webkit-scrollbar { display: none; }
.ar-tbtn {
  display: inline-flex; align-items: center; gap: .35rem;
  height: 32px; padding: 0 .7rem;
  border-radius: var(--md-r);
  font-size: .76rem; font-weight: 600;
  white-space: nowrap; cursor: pointer;
  border: 1px solid transparent;
  background: transparent;
  color: rgba(255,255,255,.82);
  transition: .15s;
}
.ar-tbtn-ghost:hover { background: rgba(255,255,255,.1); color: #fff; }
.ar-tbtn-primary { background: var(--md-accent); color: var(--md-ink); border-color: var(--md-accent); font-weight: 700; }
.ar-tbtn-primary:hover { background: #fff; border-color: #fff; }
.ar-tbtn-moreformats { border-color: rgba(255,255,255,.24); }
.ar-tb-label { display: inline; }
@media (max-width: 720px) { .ar-tb-label { display: none; } .ar-tbtn-primary .ar-tb-label { display: inline; } }
.ar-t-divider { width: 1px; height: 20px; background: rgba(255,255,255,.2); margin: 0 .3rem; }
.ar-t-spacer { flex: 1; }
.ar-t-stats { display: flex; gap: .8rem; font-family: var(--md-f-mono); font-size: .7rem; color: rgba(255,255,255,.6); }
.ar-auto-badge {
  font-family: var(--md-f-mono); font-size: .58rem;
  text-transform: uppercase; letter-spacing: .1em;
  background: rgba(0,0,0,.25); color: rgba(255,255,255,.9);
  padding: .05rem .3rem; border-radius: 2px; margin-left: .3rem;
}
.ar-hide-xs { display: block; }
@media (max-width: 640px) { .ar-hide-xs { display: none; } }

/* toolbar dropdowns */
.ar-tdrop { position: relative; }
.ar-tdrop-menu {
  display: none;
  position: absolute; left: 0; top: calc(100% + 6px);
  min-width: 230px; max-height: 340px; overflow-y: auto;
  background: var(--md-surface);
  border: 1px solid var(--md-line-2);
  box-shadow: var(--md-sh-hard);
  border-radius: var(--md-r);
  padding: 5px 0;
  z-index: 60;
}
.ar-tdrop.open .ar-tdrop-menu { display: block; }
.ar-tdrop-menu-right { left: auto; right: 0; }
.ar-tdrop-menu a, .ar-tdrop-menu button {
  display: block; width: 100%; text-align: left;
  padding: .42rem .8rem;
  font-size: .8rem; color: var(--md-mid);
  background: none; border: 0; cursor: pointer;
  border-left: 2px solid transparent;
}
.ar-tdrop-menu a:hover, .ar-tdrop-menu button:hover { background: var(--md-wash); color: var(--md-brand); border-left-color: var(--md-accent); }

/* ── Layout: TOC rail | reading slab | info rail ── */
.ar-body { padding: 1.75rem 0 3rem; }
.ar-layout {
  display: grid;
  grid-template-columns: 190px minmax(0,1fr) 290px;
  gap: 2rem;
  align-items: start;
}
@media (max-width: 1200px) { .ar-layout { grid-template-columns: minmax(0,1fr) 280px; } .ar-toc-col { display: none; } }
@media (max-width: 900px)  { .ar-layout { grid-template-columns: 1fr; } .ar-sidebar { order: 3; } }

/* left TOC rail — borderless, ruled */
.ar-toc-col { position: sticky; top: calc(var(--md-sticky-top) + var(--ar-toolbar-h) + 16px); align-self: start; }
.ar-toc-inner { max-height: calc(100vh - var(--md-sticky-top) - var(--ar-toolbar-h) - 40px); overflow-y: auto; overscroll-behavior: contain; padding-right: .5rem; }
.ar-toc-hd { color: var(--md-muted); padding-bottom: .5rem; border-bottom: 2px solid var(--md-ink); margin-bottom: .5rem; }
.ar-toc-list { list-style: none; margin: 0; padding: 0; }
.ar-toc-link {
  display: block;
  padding: .3rem 0 .3rem .6rem;
  font-size: .79rem; line-height: 1.4;
  color: var(--md-mid);
  border-left: 2px solid var(--md-line);
}
.ar-toc-link:hover { color: var(--md-brand); border-left-color: var(--md-line-2); }
.ar-toc-link.is-active, .ar-toc-link.active { color: var(--md-brand); font-weight: 600; border-left-color: var(--md-accent); }
.ar-toc-sub { padding-left: 1rem; font-size: .75rem; }

/* reading slab */
.ar-main {
  background: var(--md-surface);
  border: var(--md-rule);
  border-radius: var(--md-r);
  padding: 2rem 2.25rem 2.25rem;
  min-width: 0;
}
@media (max-width: 640px) { .ar-main { padding: 1.25rem 1.1rem 1.5rem; } }

.ar-abstract { margin-bottom: 1.5rem; padding-left: 1rem; border-left: 3px solid var(--md-accent); }
.ar-abstract-lbl {
  font-family: var(--md-f-mono); font-size: .68rem;
  text-transform: uppercase; letter-spacing: .14em;
  color: var(--md-accent-2); margin-bottom: .5rem;
}
.ar-abstract-body { font-size: .95rem; line-height: 1.8; color: var(--md-ink-2); }
.ar-abstract-body p { margin-bottom: .7rem; }

.ar-kw-row { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem; padding: .9rem 0; border-top: var(--md-rule); border-bottom: var(--md-rule); margin-bottom: 1.5rem; }
.ar-kw-lbl { font-family: var(--md-f-mono); font-size: .66rem; text-transform: uppercase; letter-spacing: .12em; color: var(--md-muted); }
.ar-kw {
  padding: .18rem .55rem;
  background: var(--md-wash);
  border-radius: var(--md-r);
  font-size: .76rem; color: var(--md-mid);
  transition: .15s;
}
.ar-kw:hover { background: var(--md-ink); color: #fff; }

/* prose (JATS / HTML full text) */
.ar-prose { color: var(--md-ink); }
.ar-prose h2, .ar-prose .sec-hd {
  font-family: var(--md-f-display);
  font-size: 1.28rem; font-weight: 600; letter-spacing: -.02em;
  color: var(--md-ink);
  margin: 2.25rem 0 .7rem;
  padding-top: 1.5rem;
  border-top: 2px solid var(--md-ink);
}
.ar-prose h3 { font-family: var(--md-f-display); font-size: 1.02rem; font-weight: 600; margin: 1.6rem 0 .45rem; color: var(--md-ink); }
.ar-prose h4 { font-size: .92rem; font-weight: 700; margin: 1.2rem 0 .35rem; color: var(--md-ink-2); }
.ar-prose p { font-size: 1rem; line-height: 1.85; color: var(--md-ink-2); margin-bottom: .9rem; }
.ar-prose ul, .ar-prose ol { font-size: .98rem; line-height: 1.8; color: var(--md-ink-2); padding-left: 1.4rem; margin-bottom: .95rem; }
.ar-prose li { margin-bottom: .3rem; }
.ar-prose blockquote {
  margin: 1.25rem 0; padding: .5rem 0 .5rem 1.1rem;
  border-left: 3px solid var(--md-accent);
  color: var(--md-mid); font-style: italic;
}
.ar-prose figure { margin: 1.75rem 0; text-align: center; }
.ar-prose figcaption { font-family: var(--md-f-mono); font-size: .72rem; color: var(--md-muted); margin-top: .5rem; line-height: 1.55; }
.ar-prose img { max-width: 100%; height: auto; border: 1px solid var(--md-line); border-radius: var(--md-r); cursor: zoom-in; }
.ar-prose table { width: 100%; border-collapse: collapse; font-size: .82rem; margin: 1.4rem 0; }
.ar-prose th { background: var(--md-wash); border-bottom: 2px solid var(--md-ink); padding: .5rem .7rem; text-align: left; font-weight: 700; }
.ar-prose td { border-bottom: var(--md-rule); padding: .45rem .7rem; vertical-align: top; }
.ar-prose a { color: var(--md-brand-3); }
.ar-prose a:hover { text-decoration: underline; }
.ar-prose code { font-family: var(--md-f-mono); font-size: .86em; background: var(--md-wash); padding: .1rem .3rem; border-radius: 2px; }
.ar-prose pre { background: var(--md-ink); color: #E9E6F5; padding: 1rem; border-radius: var(--md-r); overflow-x: auto; font-size: .82rem; }
.ar-hr { border-top: var(--md-rule); margin: 2rem 0; }
.ar-noft { padding: 1.5rem; text-align: center; color: var(--md-muted); background: var(--md-wash); border-radius: var(--md-r); font-size: .88rem; }

/* references */
.ar-refs { margin-top: 2.25rem; padding-top: 1.5rem; border-top: 2px solid var(--md-ink); }
.ar-refs-hd { font-family: var(--md-f-display); font-size: 1.15rem; font-weight: 600; margin-bottom: .9rem; }
.ar-refs ol, .ar-refs ul { padding-left: 1.4rem; }
.ar-refs li { font-size: .87rem; line-height: 1.7; color: var(--md-mid); margin-bottom: .55rem; }
.ar-ref-btns { display: inline-flex; gap: .3rem; margin-left: .4rem; }
.ar-ref-btn {
  font-family: var(--md-f-mono); font-size: .64rem;
  padding: .05rem .35rem;
  border: 1px solid var(--md-line-2); border-radius: 2px;
  color: var(--md-muted); background: #fff; cursor: pointer;
}
.ar-ref-btn:hover { background: var(--md-ink); color: #fff; border-color: var(--md-ink); }
.ar-ref-btn--doi:hover { background: var(--md-brand-3); border-color: var(--md-brand-3); }
.ar-ref-btn--scholar:hover { background: var(--md-accent); border-color: var(--md-accent); color: var(--md-ink); }

/* ── Right info rail ── */
.ar-sidebar { position: sticky; top: calc(var(--md-sticky-top) + var(--ar-toolbar-h) + 16px); align-self: start; }
/* inner scrollbar hata diya — panel content clip ho raha tha.
   Ab rail poori dikhti hai aur page ke saath scroll hoti hai. */
.ar-sb-inner { display: flex; flex-direction: column; gap: 1rem; }
.ar-sb {
  background: var(--md-surface);
  border: var(--md-rule);
  border-top: 3px solid var(--md-ink);
  border-radius: var(--md-r);
  padding: .9rem 1rem 1rem;
}
.ar-sb:nth-child(even) { border-top-color: var(--md-accent); }
.ar-sb-hd, .ar-sb-hd-btn {
  display: flex; align-items: center; justify-content: space-between; gap: .5rem;
  width: 100%;
  font-family: var(--md-f-mono);
  font-size: .68rem; text-transform: uppercase; letter-spacing: .14em;
  color: var(--md-brand);
  background: none; border: 0; padding: 0 0 .55rem; cursor: pointer;
  border-bottom: var(--md-rule);
  margin-bottom: .7rem;
}
.ar-sb-chevron { transition: transform .2s; color: var(--md-muted); }
.ar-sb-collapsible.ar-collapsed .ar-sb-chevron { transform: rotate(180deg); }
.ar-sb-collapsible.ar-collapsed .ar-sb-collapsible-body { display: none; }

.ar-info-dl { display: grid; grid-template-columns: auto 1fr; gap: .35rem .75rem; margin: 0; font-size: .78rem; }
.ar-info-dl dt { font-family: var(--md-f-mono); font-size: .64rem; text-transform: uppercase; letter-spacing: .08em; color: var(--md-muted); }
.ar-info-dl dd { margin: 0; color: var(--md-ink); }
.ar-dd-doi { font-family: var(--md-f-mono); font-size: .72rem; color: var(--md-brand-3); word-break: break-all; }

.ar-stats-row { display: grid; grid-template-columns: repeat(3,1fr); border: var(--md-rule); border-radius: var(--md-r); overflow: hidden; }
.ar-stat { padding: .6rem .4rem; text-align: center; border-right: var(--md-rule); }
.ar-stat:last-child { border-right: 0; }
.ar-stat-n { display: block; font-family: var(--md-f-display); font-size: 1.05rem; font-weight: 700; color: var(--md-brand); }
.ar-stat-l { display: block; font-family: var(--md-f-mono); font-size: .58rem; text-transform: uppercase; letter-spacing: .1em; color: var(--md-muted); }
.ar-chart-box { margin-top: .8rem; }
.ar-chart-wrap { width: 100%; }

.ar-fig-thumbs-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: .35rem; }
.ar-fig-thumb { width: 100%; aspect-ratio: 1; object-fit: cover; border: 1px solid var(--md-line); border-radius: 2px; cursor: zoom-in; }
.ar-fig-thumb:hover { border-color: var(--md-accent); }

.ar-sb-au { display: flex; gap: .55rem; padding: .5rem 0; border-bottom: var(--md-rule); cursor: pointer; }
.ar-sb-au:last-child { border-bottom: 0; }
.ar-sb-av {
  flex-shrink: 0; width: 30px; height: 30px;
  display: flex; align-items: center; justify-content: center;
  background: var(--md-wash); color: var(--md-brand);
  border-radius: var(--md-r);
  font-family: var(--md-f-mono); font-size: .66rem; font-weight: 700;
}
.ar-sb-au-name { font-size: .81rem; font-weight: 500; color: var(--md-ink); }
.ar-sb-au-aff { font-size: .72rem; color: var(--md-muted); line-height: 1.4; }
.ar-sb-au-corr { font-family: var(--md-f-mono); font-size: .6rem; text-transform: uppercase; letter-spacing: .08em; color: var(--md-accent-2); }

.ar-rel { padding: .5rem 0; border-bottom: var(--md-rule); font-size: .81rem; line-height: 1.45; }
.ar-rel:last-child { border-bottom: 0; }
.ar-rel a { color: var(--md-ink); }
.ar-rel a:hover { color: var(--md-brand-3); }
.ar-rel-date { font-family: var(--md-f-mono); font-size: .66rem; color: var(--md-muted); margin-top: .15rem; }

.ar-oa { background: var(--md-wash); border-radius: var(--md-r); padding: .8rem .9rem; }
.ar-oa-title { font-family: var(--md-f-mono); font-size: .66rem; text-transform: uppercase; letter-spacing: .12em; color: var(--md-ok); margin-bottom: .35rem; }
.ar-oa-body { font-size: .77rem; line-height: 1.6; color: var(--md-mid); }
.ar-sb-pdf { margin-top: .6rem; }

/* mobile jump */
.ar-mob-jump { display: none; }
@media (max-width: 900px) { .ar-mob-jump { display: block; margin-bottom: 1rem; } }

/* ── Author modal ── */
.ar-au-overlay {
  position: fixed; inset: 0; z-index: 10000;
  background: rgba(22,20,42,.7);
  display: none; align-items: center; justify-content: center;
  padding: 1rem;
}
.ar-au-overlay.ar-show { display: flex; }
.ar-au-modal {
  position: relative;
  width: 100%; max-width: 460px;
  background: var(--md-surface);
  border: 1px solid var(--md-ink);
  border-top: 4px solid var(--md-accent);
  box-shadow: var(--md-sh-hard);
  border-radius: var(--md-r);
  padding: 1.5rem;
}
.ar-au-modal-close { position: absolute; top: 8px; right: 12px; background: none; border: 0; font-size: 1.3rem; line-height: 1; color: var(--md-muted); cursor: pointer; }
.ar-au-modal-close:hover { color: var(--md-flag); }
.ar-au-modal-avatar {
  width: 54px; height: 54px; margin-bottom: .7rem;
  display: flex; align-items: center; justify-content: center;
  background: var(--md-brand); color: var(--md-accent);
  border-radius: var(--md-r);
  font-family: var(--md-f-mono); font-weight: 700;
}
.ar-au-modal-name { font-family: var(--md-f-display); font-size: 1.15rem; font-weight: 600; margin-bottom: .5rem; }
.ar-au-modal-corr { font-family: var(--md-f-mono); font-size: .66rem; color: var(--md-accent-2); }
.ar-au-modal-row { font-size: .84rem; color: var(--md-mid); margin-bottom: .35rem; display: flex; gap: .4rem; }
.ar-orcid-icon {
  display: inline-flex; align-items: center; justify-content: center;
  width: 18px; height: 18px; background: #A6CE39; color: #fff;
  font-size: .58rem; font-weight: 700; border-radius: 2px;
}
.ar-au-modal-links { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: .9rem; padding-top: .8rem; border-top: var(--md-rule); }
.ar-au-modal-link {
  padding: .3rem .65rem;
  border: 1px solid var(--md-line-2); border-radius: var(--md-r);
  font-size: .76rem; font-weight: 600; color: var(--md-ink);
}
.ar-au-modal-link:hover { background: var(--md-ink); color: #fff; border-color: var(--md-ink); }

/* ── Lightbox ── */
.ar-lb { position: fixed; inset: 0; z-index: 10050; background: rgba(10,9,20,.94); display: none; }
.ar-lb.ar-show { display: block; }
.ar-lb-inner { position: relative; width: 100%; height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 2.5rem 1rem; }
.ar-lb-img { max-width: 92vw; max-height: 80vh; object-fit: contain; }
.ar-lb-cap { color: rgba(255,255,255,.75); font-size: .82rem; margin-top: .8rem; text-align: center; max-width: 60ch; }
.ar-lb-close { position: absolute; top: 14px; right: 18px; background: none; border: 0; color: #fff; font-size: 2rem; cursor: pointer; line-height: 1; }
.ar-lb-nav { position: absolute; top: 50%; transform: translateY(-50%); display: flex; width: 100%; justify-content: space-between; padding: 0 1rem; pointer-events: none; }
.ar-lb-btn { pointer-events: auto; width: 40px; height: 40px; background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.25); border-radius: var(--md-r); color: #fff; cursor: pointer; font-size: 1.2rem; }
.ar-lb-btn:hover { background: var(--md-accent); color: var(--md-ink); border-color: var(--md-accent); }
.ar-lb-counter { position: absolute; bottom: 18px; font-family: var(--md-f-mono); font-size: .74rem; color: rgba(255,255,255,.6); }

/* ── Reference side panel (sdref) ── */
.sdref-backdrop { position: fixed; inset: 0; background: rgba(22,20,42,.45); z-index: 10010; display: none; }
.sdref-backdrop.open { display: block; }
.sdref-panel {
  position: fixed; top: 0; right: 0; bottom: 0;
  width: 400px; max-width: 92vw;
  background: var(--md-surface);
  border-left: 3px solid var(--md-accent);
  box-shadow: -8px 0 32px rgba(22,20,42,.2);
  z-index: 10020;
  transform: translateX(100%);
  transition: transform .25s ease;
  display: flex; flex-direction: column;
}
.sdref-panel.open { transform: translateX(0); }
.sdref-panel__head { display: flex; align-items: center; justify-content: space-between; padding: .9rem 1.1rem; border-bottom: var(--md-rule); }
.sdref-panel__label { font-family: var(--md-f-mono); font-size: .68rem; text-transform: uppercase; letter-spacing: .14em; color: var(--md-muted); }
.sdref-panel__close { background: none; border: 0; font-size: 1.2rem; color: var(--md-muted); cursor: pointer; line-height: 1; }
.sdref-panel__close:hover { color: var(--md-flag); }
.sdref-panel__body { padding: 1.1rem; overflow-y: auto; flex: 1; }
.sdref-authors { font-size: .82rem; color: var(--md-mid); margin-bottom: .35rem; }
.sdref-title { font-family: var(--md-f-display); font-size: 1rem; font-weight: 600; line-height: 1.35; color: var(--md-ink); margin-bottom: .35rem; }
.sdref-source { font-size: .8rem; color: var(--md-muted); font-style: italic; }
.sdref-doi { font-family: var(--md-f-mono); font-size: .74rem; margin-top: .4rem; }
.sdref-doi a { color: var(--md-brand-3); word-break: break-all; }
.sdref-raw-text { font-size: .84rem; line-height: 1.65; color: var(--md-mid); }
.sdref-divider { border: 0; border-top: var(--md-rule); margin: .9rem 0; }
.sdref-actions { display: flex; flex-direction: column; gap: .3rem; }
.sdref-action-link { font-size: .8rem; color: var(--md-brand-3); }
.sdref-action-link:hover { text-decoration: underline; }
.sdref-view-article {
  width: 100%; margin-top: .8rem; padding: .5rem;
  background: var(--md-ink); color: #fff;
  border: 0; border-radius: var(--md-r);
  font-size: .8rem; font-weight: 600; cursor: pointer;
}
.sdref-view-article:hover { background: var(--md-accent); color: var(--md-ink); }
.sdref-nav { display: flex; align-items: center; gap: .5rem; margin-top: .8rem; padding-top: .7rem; border-top: var(--md-rule); }
.sdref-nav-btn {
  padding: .25rem .6rem;
  border: 1px solid var(--md-line-2); border-radius: var(--md-r);
  background: #fff; font-size: .74rem; color: var(--md-mid); cursor: pointer;
}
.sdref-nav-btn:disabled { opacity: .4; cursor: default; }
.sdref-nav-counter { flex: 1; text-align: center; font-family: var(--md-f-mono); font-size: .72rem; color: var(--md-muted); }
.sdref-highlight-flash { background: rgba(232,163,23,.3) !important; transition: background 1s; }


/* ═══════════════════════════════════════════════════════════════════════════
   10. SEARCH  (SearchClient.tsx — sr-*, sc-*, ms-*)
   NAYA LAYOUT: filters ab RIGHT rail par (pehle left), results left, aur
   result rows numbered + ruled.
   ═══════════════════════════════════════════════════════════════════════════ */
.sr-page, .sc-body { background: var(--md-canvas); }
.sr-hero, .sc-banner {
  background: var(--md-brand);
  background-image: linear-gradient(150deg, var(--md-brand), #17143C);
  color: #fff;
  padding: 2.25rem 0 2rem;
  border-bottom: 3px solid var(--md-accent);
}
.sr-banner__label, .sc-banner__label {
  font-family: var(--md-f-mono); font-size: .68rem;
  text-transform: uppercase; letter-spacing: .16em;
  color: var(--md-accent); margin-bottom: .7rem;
}
.sr-form, .sc-banner__form { display: flex; gap: 0; max-width: 720px; }
.sr-input, .sc-banner__q {
  flex: 1; height: 48px; padding: 0 .9rem;
  border: 1px solid rgba(255,255,255,.28); border-right: 0;
  border-radius: var(--md-r) 0 0 var(--md-r);
  background: rgba(255,255,255,.08);
  color: #fff; font-size: .92rem;
}
.sr-input::placeholder { color: rgba(255,255,255,.45); }
.sr-input:focus { outline: 0; border-color: var(--md-accent); background: rgba(255,255,255,.13); }
.sr-banner__btn, .sc-banner__btn {
  height: 48px; padding: 0 1.25rem;
  background: var(--md-accent); color: var(--md-ink);
  border: 1px solid var(--md-accent);
  font-size: .85rem; font-weight: 700; cursor: pointer;
}
.sr-banner__btn:last-child { border-radius: 0 var(--md-r) var(--md-r) 0; }
.sr-banner__btn:hover { background: #fff; border-color: #fff; }
.sr-hint, .sc-banner__hint { margin-top: .55rem; font-family: var(--md-f-mono); font-size: .72rem; color: rgba(255,255,255,.55); }

.sr-body { padding: 1.75rem 0 3rem; }
.sr-layout {
  display: grid;
  grid-template-columns: minmax(0,1fr) 268px;
  gap: 2rem; align-items: start;
}
.sr-main { order: 1; min-width: 0; }
.sr-sidebar { order: 2; }
.sr-layout.sr-loading { opacity: .55; pointer-events: none; }
@media (max-width: 1023px) { .sr-layout { grid-template-columns: 1fr; } .sr-sidebar { display: none; } }

.sr-sidebar {
  position: sticky; top: calc(var(--md-sticky-top) + 12px);
  background: var(--md-surface);
  border: var(--md-rule);
  border-top: 3px solid var(--md-ink);
  border-radius: var(--md-r);
  padding: 1rem;
}
.sr-sidebar__hd, .sc-filters__hd { color: var(--md-brand); padding-bottom: .55rem; border-bottom: var(--md-rule); margin-bottom: .85rem; }
.sr-filter-group, .sc-filter-group { margin-bottom: .95rem; }
.sr-filter-label, .sc-filter-label {
  display: block; margin-bottom: .3rem;
  font-family: var(--md-f-mono); font-size: .64rem;
  text-transform: uppercase; letter-spacing: .1em; color: var(--md-muted);
}
.sr-select, .sr-filter-select, .sc-filter-select {
  width: 100%; height: 38px; padding: 0 .6rem;
  border: 1px solid var(--md-line-2); border-radius: var(--md-r);
  background: var(--md-canvas); font-size: .82rem; color: var(--md-ink);
}
.sr-select:focus { outline: 0; border-color: var(--md-brand-3); }
.sr-clear {
  width: 100%; padding: .45rem;
  background: transparent; color: var(--md-flag);
  border: 1px solid currentColor; border-radius: var(--md-r);
  font-size: .78rem; font-weight: 600; cursor: pointer;
}
.sr-clear:hover { background: var(--md-flag); color: #fff; }

/* mobile filter drawer */
.sr-filter-btn, .sc-mob-filter-btn {
  display: none; align-items: center; gap: .4rem;
  padding: .45rem .9rem; margin-bottom: .9rem;
  border: 1px solid var(--md-line-2); border-radius: var(--md-r);
  background: var(--md-surface); font-size: .8rem; font-weight: 600; cursor: pointer;
}
@media (max-width: 1023px) { .sr-filter-btn { display: inline-flex; } }
.sr-filter-badge { background: var(--md-accent); color: var(--md-ink); font-family: var(--md-f-mono); font-size: .62rem; padding: .05rem .3rem; border-radius: 2px; }
.sr-drawer-overlay { position: fixed; inset: 0; background: rgba(22,20,42,.55); z-index: 9990; display: none; }
.sr-drawer { position: fixed; top: 0; right: 0; bottom: 0; width: 300px; max-width: 88vw; background: var(--md-surface); border-left: 3px solid var(--md-accent); z-index: 9995; transform: translateX(100%); transition: transform .25s; padding: 1rem; overflow-y: auto; }
.sr-drawer-open .sr-drawer-overlay { display: block; }
.sr-drawer-open .sr-drawer { transform: translateX(0); }
.sr-drawer-header { display: flex; align-items: center; justify-content: space-between; padding-bottom: .7rem; border-bottom: var(--md-rule); margin-bottom: .9rem; }
.sr-drawer-title { font-family: var(--md-f-display); font-weight: 600; }
.sr-drawer-close { background: none; border: 0; font-size: 1.1rem; color: var(--md-muted); cursor: pointer; }

/* results */
.sr-topbar { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding-bottom: .6rem; margin-bottom: 1rem; border-bottom: 2px solid var(--md-ink); flex-wrap: wrap; }
.sr-count, .sc-results-count { font-family: var(--md-f-mono); font-size: .76rem; color: var(--md-muted); }
.sr-count strong, .sc-results-q { color: var(--md-ink); }

.sr-list { display: flex; flex-direction: column; }
.sr-card, .sc-art { padding: 1.15rem 0; border-bottom: var(--md-rule); transition: .15s; }
.sr-card:hover { background: rgba(232,163,23,.045); }
.sr-card-top { display: flex; gap: 1rem; }
.sr-rank {
  flex-shrink: 0;
  width: 32px; height: 32px;
  display: flex; align-items: center; justify-content: center;
  background: var(--md-wash); color: var(--md-brand);
  border-radius: var(--md-r);
  font-family: var(--md-f-mono); font-size: .74rem; font-weight: 700;
}
.sr-card-body { min-width: 0; flex: 1; }
.sr-title, .sr-card__title, .sc-art__title {
  display: block;
  font-family: var(--md-f-display);
  font-size: 1.05rem; font-weight: 600; line-height: 1.35;
  color: var(--md-ink); margin-bottom: .3rem;
}
.sr-title:hover { color: var(--md-brand-3); }
.sr-section-tag, .sr-card__sec, .sc-art__sec {
  display: inline-block; margin-left: .4rem;
  font-family: var(--md-f-mono); font-size: .6rem;
  text-transform: uppercase; letter-spacing: .1em;
  color: var(--md-accent-2);
  border: 1px solid currentColor; border-radius: 2px;
  padding: .05rem .3rem; vertical-align: middle;
}
.sr-authors, .sc-art__authors { font-size: .82rem; color: var(--md-mid); margin-bottom: .35rem; }
.sr-author-name { color: var(--md-mid); }
.sr-author-more { color: var(--md-muted); font-style: italic; }
.sr-abstract, .sc-art__snippet { font-size: .84rem; line-height: 1.65; color: var(--md-muted); margin-bottom: .5rem; }
.sr-keywords { display: flex; gap: .3rem; flex-wrap: wrap; margin-bottom: .5rem; font-family: var(--md-f-mono); font-size: .68rem; color: var(--md-muted); }
.sr-meta, .sc-art__meta { display: flex; align-items: center; gap: .7rem; flex-wrap: wrap; font-family: var(--md-f-mono); font-size: .7rem; color: var(--md-muted); }
.sr-meta-doi { color: var(--md-brand-3); }
.sr-meta-doi:hover { text-decoration: underline; }
.sr-badge {
  display: inline-flex; align-items: center; gap: .2rem;
  padding: .1rem .4rem;
  border: 1px solid var(--md-line-2); border-radius: 2px;
  color: var(--md-mid);
}
.sr-badge--views { border-color: var(--md-line-2); }
.sr-badge--dl { color: var(--md-ok); border-color: currentColor; }
.sr-badge--cite { color: var(--md-accent-2); border-color: currentColor; }
.sr-highlight, .vf-mark { background: rgba(232,163,23,.35); color: inherit; padding: 0 .1em; border-radius: 2px; }

.sr-empty, .sc-empty { padding: 3rem 1rem; text-align: center; color: var(--md-muted); border: 1px dashed var(--md-line-2); border-radius: var(--md-r); background: var(--md-surface); }
.sr-empty-icon { font-size: 2rem; display: block; margin-bottom: .6rem; }

/* skeletons */
.sr-skel-wrap { display: flex; flex-direction: column; gap: 1rem; }
.ms-search__skel { padding: 1rem 0; border-bottom: var(--md-rule); }
.ms-search__skel-line { height: 10px; background: linear-gradient(90deg, var(--md-wash) 25%, #EBE5D8 50%, var(--md-wash) 75%); background-size: 200% 100%; animation: md-shimmer 1.3s infinite; border-radius: 2px; margin-bottom: .5rem; }
.ms-search__skel-line--sm { width: 30%; }
.ms-search__skel-line--md { width: 60%; }
.ms-search__skel-line--lg { width: 85%; height: 14px; }
@keyframes md-shimmer { from { background-position: 200% 0; } to { background-position: -200% 0; } }
.ms-search__spinner { display: inline-block; width: 16px; height: 16px; border: 2px solid var(--md-line-2); border-top-color: var(--md-accent); border-radius: 50%; animation: md-spin .7s linear infinite; }
@keyframes md-spin { to { transform: rotate(360deg); } }

.sr-pagination, .sr-pg { display: flex; align-items: center; justify-content: center; gap: .3rem; margin-top: 2rem; flex-wrap: wrap; }
.sr-pg-btn {
  min-width: 34px; height: 34px; padding: 0 .65rem;
  display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid var(--md-line-2); border-radius: var(--md-r);
  background: var(--md-surface); color: var(--md-ink);
  font-family: var(--md-f-mono); font-size: .76rem; cursor: pointer;
}
.sr-pg-btn:hover:not(:disabled) { background: var(--md-ink); color: #fff; border-color: var(--md-ink); }
.sr-pg-btn:disabled { opacity: .4; cursor: default; }
.sr-pg-btn--active { background: var(--md-accent); border-color: var(--md-accent); color: var(--md-ink); font-weight: 700; }
.ms-btn-primary {
  display: inline-flex; align-items: center; gap: .4rem;
  padding: .5rem 1rem; background: var(--md-ink); color: #fff;
  border: 0; border-radius: var(--md-r); font-size: .82rem; font-weight: 600; cursor: pointer;
}
.ms-btn-primary:hover { background: var(--md-accent); color: var(--md-ink); }


/* ═══════════════════════════════════════════════════════════════════════════
   11. AUTHOR PROFILE  (app/author/[slug] — ap-*)
   ═══════════════════════════════════════════════════════════════════════════ */
.ap-page { background: var(--md-canvas); }
.ap-container, .ap-w { max-width: var(--md-wrap); margin: 0 auto; padding: 0 24px; }
.ap-hero, .ap-banner {
  background: var(--md-brand);
  background-image: linear-gradient(150deg, var(--md-brand), #17143C);
  color: #fff; padding: 2.5rem 0 0;
  border-bottom: 3px solid var(--md-accent);
}
.ap-hero__inner, .ap-banner__inner { max-width: var(--md-wrap); margin: 0 auto; padding: 0 24px; display: flex; gap: 1.5rem; align-items: flex-start; flex-wrap: wrap; }
.ap-avatar {
  width: 92px; height: 92px; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  background: var(--md-accent); color: var(--md-brand);
  border-radius: var(--md-r);
  font-family: var(--md-f-display); font-size: 1.9rem; font-weight: 700;
  overflow: hidden;
}
.ap-avatar__img { width: 100%; height: 100%; object-fit: cover; }
.ap-avatar__initials { font-family: var(--md-f-display); }
.ap-info { min-width: 0; flex: 1; }
.ap-info__kicker { font-family: var(--md-f-mono); font-size: .66rem; text-transform: uppercase; letter-spacing: .16em; color: var(--md-accent); }
.ap-info__name, .ap-banner__name { font-family: var(--md-f-display); font-size: clamp(1.4rem,3vw,2.1rem); font-weight: 600; letter-spacing: -.028em; color: #fff; margin: .3rem 0 .35rem; }
.ap-info__aff, .ap-banner__aff { font-size: .88rem; color: rgba(255,255,255,.72); }
.ap-info__country { font-family: var(--md-f-mono); font-size: .74rem; color: rgba(255,255,255,.55); margin-top: .2rem; }
.ap-info__bio, .ap-bio { font-size: .86rem; line-height: 1.7; color: rgba(255,255,255,.68); max-width: 66ch; margin-top: .7rem; }
.ap-badges, .ap-banner__links { display: flex; gap: .4rem; flex-wrap: wrap; margin-top: .85rem; }
.ap-badge, .ap-banner__link {
  display: inline-flex; align-items: center; gap: .3rem;
  padding: .25rem .6rem;
  border: 1px solid rgba(255,255,255,.25); border-radius: var(--md-r);
  font-family: var(--md-f-mono); font-size: .68rem;
  color: rgba(255,255,255,.8); transition: .15s;
}
.ap-badge:hover { border-color: var(--md-accent); color: var(--md-accent); }
.ap-badge--orcid:hover { background: #A6CE39; border-color: #A6CE39; color: var(--md-ink); }
.ap-badge--verified { color: var(--md-accent); border-color: var(--md-accent); }
.ap-claim { margin-top: .9rem; display: flex; align-items: center; gap: .7rem; flex-wrap: wrap; }
.ap-claim__text { font-size: .8rem; color: rgba(255,255,255,.6); }
.ap-claim__btn, .ap-claim-btn {
  padding: .35rem .85rem; background: var(--md-accent); color: var(--md-ink);
  border: 0; border-radius: var(--md-r); font-size: .78rem; font-weight: 700; cursor: pointer;
}
.ap-claim__btn:hover { background: #fff; }

.ap-stats, .ap-stats-bar { background: rgba(0,0,0,.25); margin-top: 1.75rem; border-top: 1px solid rgba(255,255,255,.12); }
.ap-hero__stats-inner, .ap-stats-inner { max-width: var(--md-wrap); margin: 0 auto; padding: .9rem 24px; display: flex; gap: 0; flex-wrap: wrap; }
.ap-stat { padding: 0 1.25rem; border-left: 1px solid rgba(255,255,255,.14); }
.ap-stat:first-child { border-left: 0; padding-left: 0; }
.ap-stat__val, .ap-stat__n { display: block; font-family: var(--md-f-display); font-size: 1.25rem; font-weight: 700; color: var(--md-accent); line-height: 1.1; }
.ap-stat__label, .ap-stat__l { display: block; font-family: var(--md-f-mono); font-size: .62rem; text-transform: uppercase; letter-spacing: .1em; color: rgba(255,255,255,.55); }
.ap-stat--primary .ap-stat__val { color: #fff; }

.ap-body, .ap-main { padding: 2rem 0 3rem; }
.ap-grid { display: grid; grid-template-columns: minmax(0,1fr) 300px; gap: 2rem; align-items: start; }
@media (max-width: 1023px) { .ap-grid { grid-template-columns: 1fr; } }
.ap-section-title, .ap-sh__t { font-family: var(--md-f-display); font-size: 1.1rem; font-weight: 600; padding-bottom: .5rem; margin-bottom: 1rem; border-bottom: 2px solid var(--md-ink); }
.ap-sh { display: flex; align-items: baseline; justify-content: space-between; }
.ap-sh__n { font-family: var(--md-f-mono); font-size: .72rem; color: var(--md-muted); }

.ap-analytics, .ap-sb-card {
  background: var(--md-surface); border: var(--md-rule);
  border-top: 3px solid var(--md-accent); border-radius: var(--md-r);
  padding: 1.1rem; margin-bottom: 1.1rem;
}
.ap-sb-card__hd { font-family: var(--md-f-mono); font-size: .68rem; text-transform: uppercase; letter-spacing: .14em; color: var(--md-brand); padding-bottom: .5rem; border-bottom: var(--md-rule); margin-bottom: .8rem; }
.ap-bars { display: flex; flex-direction: column; gap: .7rem; }
.ap-bar__label { font-size: .78rem; color: var(--md-mid); }
.ap-bar__val { font-family: var(--md-f-mono); font-size: .72rem; color: var(--md-muted); float: right; }
.ap-bar__track { height: 6px; background: var(--md-wash); border-radius: 2px; margin-top: .25rem; overflow: hidden; }
.ap-bar__fill { height: 100%; background: var(--md-accent); }
.ap-ychart__title { font-family: var(--md-f-mono); font-size: .68rem; text-transform: uppercase; letter-spacing: .12em; color: var(--md-muted); margin-bottom: .7rem; }
.ap-ychart__bars { display: flex; align-items: flex-end; gap: .35rem; height: 110px; }
.ap-ychart__col { flex: 1; display: flex; flex-direction: column; align-items: center; gap: .2rem; }
.ap-ychart__bar-wrap { display: flex; align-items: flex-end; gap: 2px; height: 90px; }
.ap-ychart__bar-dl { width: 8px; background: var(--md-brand-3); }
.ap-ychart__bar-cite { width: 8px; background: var(--md-accent); }
.ap-ychart__year { font-family: var(--md-f-mono); font-size: .6rem; color: var(--md-muted); }
.ap-ychart__legend { display: flex; gap: .8rem; margin-top: .7rem; font-family: var(--md-f-mono); font-size: .66rem; color: var(--md-muted); }
.ap-ychart__legend-dot { display: inline-block; width: 8px; height: 8px; margin-right: .25rem; }
.ap-ychart__legend-dot--dl { background: var(--md-brand-3); }
.ap-ychart__legend-dot--cite { background: var(--md-accent); }

.ap-pubs__header { display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; margin-bottom: 1rem; }
.ap-pubs__controls { display: flex; gap: .5rem; }
.ap-search, .ap-sort {
  height: 36px; padding: 0 .7rem;
  border: 1px solid var(--md-line-2); border-radius: var(--md-r);
  background: var(--md-surface); font-size: .82rem;
}
.ap-pub { display: flex; gap: .9rem; padding: 1rem 0; border-bottom: var(--md-rule); }
.ap-pub__num { flex-shrink: 0; font-family: var(--md-f-display); font-size: 1.05rem; font-weight: 700; color: var(--md-line-2); width: 26px; }
.ap-pub__body { min-width: 0; }
.ap-pub__title, .ap-art__title { display: block; font-family: var(--md-f-display); font-size: 1rem; font-weight: 600; line-height: 1.35; color: var(--md-ink); margin-bottom: .25rem; }
.ap-pub__title:hover { color: var(--md-brand-3); }
.ap-pub__meta, .ap-art__meta { font-family: var(--md-f-mono); font-size: .7rem; color: var(--md-muted); }
.ap-pub__journal { color: var(--md-accent-2); }
.ap-pub__doi { font-family: var(--md-f-mono); font-size: .7rem; color: var(--md-brand-3); word-break: break-all; }
.ap-pub__counts { display: flex; gap: .6rem; margin-top: .4rem; font-family: var(--md-f-mono); font-size: .68rem; }
.ap-pub__count { display: inline-flex; align-items: center; gap: .2rem; padding: .05rem .4rem; border: 1px solid var(--md-line-2); border-radius: 2px; color: var(--md-mid); }
.ap-pub__count--cite { color: var(--md-accent-2); }
.ap-pub__count--dl { color: var(--md-ok); }
.ap-empty { padding: 2.5rem 1rem; text-align: center; color: var(--md-muted); border: 1px dashed var(--md-line-2); border-radius: var(--md-r); }
.ap-private { padding: 3rem 1rem; text-align: center; }
.ap-private__icon { font-size: 2rem; }
.ap-private__title { font-family: var(--md-f-display); font-size: 1.25rem; font-weight: 600; margin: .5rem 0 .3rem; }
.ap-private__desc { color: var(--md-muted); font-size: .88rem; }
.ap-info-dl { display: grid; grid-template-columns: auto 1fr; gap: .3rem .7rem; font-size: .8rem; }
.ap-info-dl dt { font-family: var(--md-f-mono); font-size: .64rem; text-transform: uppercase; color: var(--md-muted); }
.ap-info-dl dd { margin: 0; }


/* ═══════════════════════════════════════════════════════════════════════════
   12. CMS / CUSTOM PAGE PROSE  (.jp-body as prose, .pg-* legacy)
   ═══════════════════════════════════════════════════════════════════════════ */
.iv-main .jp-body, .pg-body, .iv-page-content {
  font-size: .96rem;
  line-height: 1.82;
  color: var(--md-ink-2);
  background: var(--md-surface);
  border: var(--md-rule);
  border-radius: var(--md-r);
  padding: 1.75rem 2rem 2rem;
}
@media (max-width: 640px) { .iv-main .jp-body, .pg-body { padding: 1.25rem 1.1rem 1.5rem; } }
.jp-body h2, .pg-body h2 {
  font-family: var(--md-f-display); font-size: 1.28rem; font-weight: 600;
  color: var(--md-ink); margin: 2rem 0 .7rem; padding-top: 1.25rem;
  border-top: 2px solid var(--md-ink); letter-spacing: -.02em;
}
.jp-body h2:first-child, .pg-body h2:first-child { margin-top: 0; padding-top: 0; border-top: 0; }
.jp-body h3, .pg-body h3 { font-family: var(--md-f-display); font-size: 1.05rem; font-weight: 600; color: var(--md-ink); margin: 1.5rem 0 .45rem; }
.jp-body h4, .pg-body h4 { font-size: .93rem; font-weight: 700; color: var(--md-ink-2); margin: 1.15rem 0 .35rem; }
.jp-body p, .pg-body p { margin: 0 0 1rem; }
.jp-body a, .pg-body a { color: var(--md-brand-3); text-decoration: underline; text-decoration-color: rgba(75,63,196,.35); text-underline-offset: 2px; }
.jp-body a:hover, .pg-body a:hover { text-decoration-color: currentColor; }
.jp-body ul, .jp-body ol, .pg-body ul, .pg-body ol { margin: 0 0 1rem; padding-left: 1.4rem; }
.jp-body li, .pg-body li { margin-bottom: .4rem; }
.jp-body strong, .pg-body strong { font-weight: 700; color: var(--md-ink); }
.jp-body blockquote, .pg-body blockquote { margin: 1.25rem 0; padding: .4rem 0 .4rem 1.1rem; border-left: 3px solid var(--md-accent); color: var(--md-mid); }
.jp-body table, .pg-body table { width: 100%; border-collapse: collapse; font-size: .85rem; margin: 1.25rem 0; }
.jp-body th, .pg-body th { background: var(--md-wash); border-bottom: 2px solid var(--md-ink); padding: .5rem .7rem; text-align: left; }
.jp-body td, .pg-body td { border-bottom: var(--md-rule); padding: .45rem .7rem; }
.jp-body img, .pg-body img { border-radius: var(--md-r); border: 1px solid var(--md-line); }
.jp-body hr, .pg-body hr { border-top: var(--md-rule); margin: 1.5rem 0; }

.pg-hero { background: var(--md-brand); color: #fff; padding: 2rem 0; border-bottom: 3px solid var(--md-accent); }
.pg-hero-label { font-family: var(--md-f-mono); font-size: .66rem; text-transform: uppercase; letter-spacing: .16em; color: var(--md-accent); }
.pg-hero-title, .pg-h1 { font-family: var(--md-f-display); font-size: clamp(1.5rem,3.2vw,2.25rem); font-weight: 600; letter-spacing: -.03em; color: #fff; }
.pg-h1-divider { width: 54px; height: 3px; background: var(--md-accent); margin: .8rem 0 0; }
.pg-card { background: var(--md-surface); border: var(--md-rule); border-radius: var(--md-r); padding: 1.5rem; }
.pg-toc, .pg-toc-box { background: var(--md-surface); border: var(--md-rule); border-top: 3px solid var(--md-ink); border-radius: var(--md-r); padding: 1rem; }
.pg-meta { font-family: var(--md-f-mono); font-size: .7rem; color: var(--md-muted); }


/* ═══════════════════════════════════════════════════════════════════════════
   13. DB-DRIVEN SIDEBAR BLOCKS  (admin HTML: jm-card, nr-box, jh-sbox, cfp)
   ═══════════════════════════════════════════════════════════════════════════ */
.jm-card, .nr-box, .jh-sbox, .content-card, .card {
  background: var(--md-surface);
  border: var(--md-rule);
  border-top: 3px solid var(--md-accent);
  border-radius: var(--md-r);
  overflow: hidden;
}
.jm-card + .jm-card, .nr-box + .nr-box, .jh-sbox + .jh-sbox,
.jh-sbox + .nr-box, .nr-box + .jh-sbox { margin-top: 14px; }

.jm-head, .nr-box__head, .jh-sbox__head {
  display: flex; align-items: center; gap: .6rem;
  padding: .8rem 1rem;
  border-bottom: var(--md-rule);
  background: var(--md-wash);
}
.jh-sbox__head--impact { background: var(--md-brand); color: #fff; }
.jm-head-icon, .jh-sbox__icon { color: var(--md-accent-2); flex-shrink: 0; }
.jm-head-title, .nr-box__title, .jh-sbox__title {
  font-family: var(--md-f-mono); font-size: .7rem;
  text-transform: uppercase; letter-spacing: .12em;
  color: var(--md-brand); margin: 0;
}
.jh-sbox__head--impact .jh-sbox__title { color: #fff; }
.jm-head-sub, .nr-box__sub, .jh-sbox__sub { font-size: .72rem; color: var(--md-muted); }
.jm-head-badge, .jm-val-badge {
  margin-left: auto;
  font-family: var(--md-f-mono); font-size: .64rem;
  background: var(--md-accent); color: var(--md-ink);
  padding: .1rem .4rem; border-radius: 2px;
}
.jm-list { list-style: none; margin: 0; padding: 0; }
.jm-row {
  display: flex; align-items: center; gap: .6rem;
  padding: .55rem 1rem;
  border-bottom: var(--md-rule);
  font-size: .82rem;
}
.jm-row:last-child { border-bottom: 0; }
.jm-row--accent { background: var(--md-wash); }
.jm-row--highlight { border-left: 3px solid var(--md-accent); }
.jm-row-icon { color: var(--md-accent-2); }
.jm-row-label { color: var(--md-mid); }
.jm-row-value { margin-left: auto; font-family: var(--md-f-mono); font-weight: 600; color: var(--md-ink); }
.jm-val-big { font-family: var(--md-f-display); font-size: 1.05rem; font-weight: 700; color: var(--md-brand); }
.jm-footer { padding: .6rem 1rem; background: var(--md-wash); font-size: .75rem; color: var(--md-muted); }

.nr-linklist { list-style: none; margin: 0; padding: .5rem 0; }
.nr-linklist li { border-bottom: var(--md-rule); }
.nr-linklist li:last-child { border-bottom: 0; }
.nr-linklist a, .nr-ltxt {
  display: flex; align-items: center; gap: .5rem;
  padding: .5rem 1rem; font-size: .82rem; color: var(--md-mid);
  border-left: 2px solid transparent;
}
.nr-linklist a:hover { background: var(--md-wash); color: var(--md-brand); border-left-color: var(--md-accent); }
.nr-licon { color: var(--md-accent-2); }
.nr-impact { padding: 1rem; text-align: center; }
.nr-impact__value { font-family: var(--md-f-display); font-size: 2rem; font-weight: 700; color: var(--md-brand); }
.nr-impact__note { font-family: var(--md-f-mono); font-size: .66rem; text-transform: uppercase; letter-spacing: .1em; color: var(--md-muted); }

.nr-cfp-mini, .cfp-banner { border: var(--md-rule); border-left: 3px solid var(--md-accent); border-radius: var(--md-r); background: var(--md-surface); overflow: hidden; }
.nr-cfp-mini__head { display: flex; align-items: center; gap: .6rem; padding: .7rem 1rem; background: var(--md-brand); color: #fff; }
.nr-cfp-mini__htitle { font-family: var(--md-f-display); font-size: .92rem; font-weight: 600; }
.nr-cfp-mini__hsub { font-size: .72rem; color: rgba(255,255,255,.65); }
.nr-cfp-mini__hright { margin-left: auto; }
.nr-cfp-mini__body { padding: .9rem 1rem; }
.nr-cfp-mini__text { font-size: .82rem; color: var(--md-mid); line-height: 1.6; }
.nr-cfp-mini__btn, .cfp-btn-primary {
  display: inline-flex; align-items: center; gap: .35rem;
  padding: .42rem .9rem; margin-top: .6rem;
  background: var(--md-accent); color: var(--md-ink);
  border-radius: var(--md-r); font-size: .78rem; font-weight: 700;
}
.nr-cfp-mini__btn:hover, .cfp-btn-primary:hover { background: var(--md-ink); color: #fff; }
.cfp-btn-outline { display: inline-flex; padding: .42rem .9rem; border: 1px solid var(--md-line-2); border-radius: var(--md-r); font-size: .78rem; font-weight: 600; }
.cfp-icon-wrap { color: var(--md-accent-2); }

/* legacy jh-* blocks jo purane DB HTML mein aate hain */
.jh-sbox__empty { padding: 1rem; font-size: .8rem; color: var(--md-muted); }
.jh-pill, .jh-chip {
  display: inline-flex; align-items: center; gap: .3rem;
  padding: .2rem .55rem; border: 1px solid var(--md-line-2);
  border-radius: var(--md-r); font-size: .74rem; color: var(--md-mid);
}
.jh-pill--full { background: var(--md-ink); color: #fff; border-color: var(--md-ink); }
.jh-pill--pdf:hover, .jh-pill-sm--pdf:hover { background: var(--md-accent); border-color: var(--md-accent); color: var(--md-ink); }
.jh-sechead { font-family: var(--md-f-display); font-size: 1.05rem; font-weight: 600; padding-bottom: .5rem; border-bottom: 2px solid var(--md-ink); margin-bottom: 1rem; }
.jh-sechead__hint { font-family: var(--md-f-mono); font-size: .7rem; color: var(--md-muted); float: right; }
.jh-hrule { border-top: var(--md-rule); margin: 1.25rem 0; }
.jh-lbl, .jh-kicker { font-family: var(--md-f-mono); font-size: .66rem; text-transform: uppercase; letter-spacing: .12em; color: var(--md-accent-2); }
.jh-tr__item { display: flex; gap: .7rem; padding: .55rem 0; border-bottom: var(--md-rule); }
.jh-tr__rank { font-family: var(--md-f-display); font-size: 1rem; font-weight: 700; color: var(--md-line-2); }
.jh-tr__title { font-size: .83rem; font-weight: 500; color: var(--md-ink); }
.jh-tr__meta { font-family: var(--md-f-mono); font-size: .68rem; color: var(--md-muted); }
.jh-mbtn, .jh-sbtn {
  display: inline-flex; align-items: center; gap: .35rem;
  padding: .45rem .9rem; border-radius: var(--md-r);
  font-size: .8rem; font-weight: 600; border: 1px solid var(--md-line-2);
}
.jh-mbtn--solid, .jh-sbtn--solid { background: var(--md-ink); color: #fff; border-color: var(--md-ink); }
.jh-mbtn--ghost, .jh-sbtn--ghost { color: var(--md-ink); }
.jh-input, .jh-select {
  height: 38px; padding: 0 .65rem;
  border: 1px solid var(--md-line-2); border-radius: var(--md-r);
  background: #fff; font-size: .84rem;
}
.open-access-badge, .doi-badge {
  display: inline-flex; align-items: center; gap: .25rem;
  font-family: var(--md-f-mono); font-size: .64rem;
  text-transform: uppercase; letter-spacing: .1em;
  color: var(--md-ok); border: 1px solid currentColor;
  padding: .1rem .4rem; border-radius: 2px;
}


/* ═══════════════════════════════════════════════════════════════════════════
   14. AUTH PAGES — login (lc-*), register (rc-*), forgot/reset (fp-*)
   NAYA: split screen — left indigo panel, right form card (sharp, ruled)
   ═══════════════════════════════════════════════════════════════════════════ */
.lc-page, .rc-page, .fp-page { min-height: 72vh; background: var(--md-canvas); }
.lc-grid {
  display: grid; grid-template-columns: 1fr 1fr;
  min-height: 72vh;
}
@media (max-width: 900px) { .lc-grid { grid-template-columns: 1fr; } }

.lc-hero {
  background: var(--md-brand);
  background-image:
    radial-gradient(circle at 80% 20%, rgba(232,163,23,.22), transparent 50%),
    linear-gradient(150deg, var(--md-brand), #17143C);
  color: #fff;
  padding: 3rem 2.5rem;
  display: flex; flex-direction: column; justify-content: center;
}
@media (max-width: 900px) { .lc-hero { padding: 2rem 1.25rem; } }
.lc-hero-tag { font-family: var(--md-f-mono); font-size: .66rem; text-transform: uppercase; letter-spacing: .16em; color: var(--md-accent); margin-bottom: .8rem; }
.lc-hero-note { font-size: .88rem; line-height: 1.75; color: rgba(255,255,255,.68); max-width: 46ch; }
.lc-hero-link { color: var(--md-accent); font-weight: 600; border-bottom: 1px solid currentColor; }

.lc-form, .rc-card, .fp-card {
  background: var(--md-surface);
  border: var(--md-rule);
  border-top: 4px solid var(--md-accent);
  border-radius: var(--md-r);
  padding: 2rem;
  width: 100%; max-width: 460px;
  margin: 2.5rem auto;
  box-shadow: var(--md-sh-2);
}
.lc-form { margin: 0; align-self: center; max-width: 420px; }
.fp-card--center { text-align: center; }
.lc-title, .rc-title, .fp-title {
  font-family: var(--md-f-display);
  font-size: 1.5rem; font-weight: 600; letter-spacing: -.025em;
  color: var(--md-ink); margin-bottom: .35rem;
}
.fp-title--danger { color: var(--md-flag); }
.rc-sub, .fp-sub { font-size: .85rem; color: var(--md-muted); margin-bottom: 1.25rem; }

.lc-label, .rc-label, .fp-label, .form-group > label {
  display: block; margin-bottom: .3rem;
  font-family: var(--md-f-mono); font-size: .66rem;
  text-transform: uppercase; letter-spacing: .1em; color: var(--md-muted);
}
.lc-input, .rc-input, .fp-input, .lc-select, .lc-pw-input, .rc-pw-input, .fp-pw-input,
.form-group input, .form-group select, .form-group textarea {
  width: 100%; height: 42px; padding: 0 .75rem;
  border: 1px solid var(--md-line-2); border-radius: var(--md-r);
  background: var(--md-canvas); font-size: .88rem; color: var(--md-ink);
  transition: .15s;
}
.form-group textarea { height: auto; padding: .6rem .75rem; }
.lc-input:focus, .rc-input:focus, .fp-input:focus,
.form-group input:focus, .form-group select:focus, .form-group textarea:focus {
  outline: 0; border-color: var(--md-brand-3); background: #fff;
  box-shadow: 0 0 0 3px rgba(75,63,196,.12);
}
.lc-input-wrap, .lc-pw, .rc-pw, .fp-pw, .fp-pw-pr { position: relative; }
.lc-pw-btn, .rc-pw-btn, .fp-pw-btn, .lc-pw-toggle {
  position: absolute; right: 8px; top: 50%; transform: translateY(-50%);
  background: none; border: 0; cursor: pointer;
  font-family: var(--md-f-mono); font-size: .68rem; color: var(--md-muted);
}
.lc-pw-btn:hover { color: var(--md-brand); }

.lc-btn, .rc-btn, .fp-btn, .lc-submit, .btn-save, .ms-btn-primary, .btn-primary {
  display: inline-flex; align-items: center; justify-content: center; gap: .4rem;
  width: 100%; height: 44px; padding: 0 1.2rem;
  background: var(--md-ink); color: #fff;
  border: 1px solid var(--md-ink); border-radius: var(--md-r);
  font-size: .88rem; font-weight: 700; cursor: pointer;
  transition: .15s;
}
.lc-btn:hover, .rc-btn:hover, .fp-btn:hover, .btn-primary:hover { background: var(--md-accent); border-color: var(--md-accent); color: var(--md-ink); }
.fp-btn--inline { width: auto; }
.fp-btn--block { width: 100%; }
.lc-google, .rc-google, .google, .social-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
  width: 100%; height: 42px;
  background: #fff; color: var(--md-ink);
  border: 1px solid var(--md-line-2); border-radius: var(--md-r);
  font-size: .84rem; font-weight: 600; cursor: pointer;
}
.lc-google:hover { border-color: var(--md-ink); }
.lc-divider, .rc-divider {
  display: flex; align-items: center; gap: .7rem;
  margin: 1rem 0; font-family: var(--md-f-mono); font-size: .66rem;
  text-transform: uppercase; letter-spacing: .1em; color: var(--md-muted);
}
.lc-divider::before, .lc-divider::after,
.rc-divider::before, .rc-divider::after { content: ''; flex: 1; border-top: var(--md-rule); }

.lc-row, .rc-row { display: flex; align-items: center; justify-content: space-between; gap: .75rem; flex-wrap: wrap; }
.lc-forgot { font-size: .8rem; color: var(--md-brand-3); }
.lc-forgot:hover { text-decoration: underline; }
.lc-footer, .rc-footer, .fp-back, .rc-back-row, .rc-back {
  margin-top: 1.1rem; padding-top: .9rem; border-top: var(--md-rule);
  font-size: .82rem; color: var(--md-muted); text-align: center;
}
.lc-footer a, .rc-footer a, .fp-back a, .rc-back { color: var(--md-brand-3); font-weight: 600; }

.lc-error, .rc-error, .fp-msg--err, .wf-alert-danger {
  background: #FCEEEA; border: 1px solid #F0C4B8; border-left: 3px solid var(--md-flag);
  color: #8B2F1B; border-radius: var(--md-r);
  padding: .6rem .8rem; font-size: .82rem; margin-bottom: .9rem;
}
.lc-success, .rc-success, .fp-msg--ok, .wf-alert-success {
  background: #E9F5EF; border: 1px solid #B7DCC9; border-left: 3px solid var(--md-ok);
  color: #1D5C42; border-radius: var(--md-r);
  padding: .6rem .8rem; font-size: .82rem; margin-bottom: .9rem;
}
.wf-alert-warning { background: #FDF4E3; border: 1px solid #EBD5A8; border-left: 3px solid var(--md-accent); color: #7A5310; border-radius: var(--md-r); padding: .6rem .8rem; font-size: .82rem; }
.lc-success-icon, .rc-success-icon, .fp-check-icon, .fp-expired-icon { font-size: 2rem; display: block; margin-bottom: .5rem; }

/* step indicator */
.lc-step-bar, .rc-steps { display: flex; align-items: center; gap: .4rem; margin-bottom: 1.25rem; }
.lc-step, .rc-step {
  flex: 1; height: 3px; background: var(--md-line);
}
.lc-step.is-active, .rc-step.is-active, .lc-step.active, .rc-step.active { background: var(--md-accent); }
.lc-step-line { flex: 1; height: 1px; background: var(--md-line); }

/* password strength */
.lc-pw-strength, .fp-pw-strength, .rc-pw-bar, .pw-meter { display: flex; gap: 3px; margin-top: .35rem; }
.lc-pw-seg, .fp-pw-seg, .pw-bar { flex: 1; height: 3px; background: var(--md-line); }
.rc-pw-bar-inner { height: 3px; background: var(--md-accent); transition: width .2s; }
.lc-pw-label, .fp-pw-label, .rc-pw-label { font-family: var(--md-f-mono); font-size: .64rem; color: var(--md-muted); margin-top: .2rem; }
.rc-pw-nomatch { color: var(--md-flag); }

/* role picker */
.lc-roles, .rc-roles { display: grid; grid-template-columns: 1fr 1fr; gap: .5rem; }
.lc-role, .rc-role, .role-chip {
  border: 1px solid var(--md-line-2); border-radius: var(--md-r);
  padding: .6rem .7rem; cursor: pointer; transition: .15s;
}
.lc-role:hover, .rc-role:hover { border-color: var(--md-ink); }
.lc-role.selected, .rc-role.selected, .lc-role.sel, .rc-role.sel { border-color: var(--md-accent); background: rgba(232,163,23,.08); }
.rc-role-t { font-size: .84rem; font-weight: 600; color: var(--md-ink); }
.rc-role-d { font-size: .74rem; color: var(--md-muted); }
.rc-role-label-mb { margin-bottom: .35rem; }

/* rc/fp spacing helpers */
.rc-mb-sm, .fp-mb-sm { margin-bottom: .5rem; }
.rc-mb-md, .fp-mb-md { margin-bottom: .9rem; }
.rc-mb-lg { margin-bottom: 1.25rem; }
.rc-mb-xl { margin-bottom: 1.75rem; }
.rc-mt-sm { margin-top: .5rem; }
.rc-mt-md { margin-top: .9rem; }
.rc-mt-lg { margin-top: 1.25rem; }
.rc-text-center { text-align: center; }
.fp-spinner { display: inline-block; width: 15px; height: 15px; border: 2px solid rgba(255,255,255,.35); border-top-color: #fff; border-radius: 50%; animation: md-spin .7s linear infinite; }
.hint, .form-hint { font-size: .74rem; color: var(--md-muted); margin-top: .25rem; }


/* ═══════════════════════════════════════════════════════════════════════════
   15. PROFILE / SHARED FORMS / MODALS  (components/ProfileClient.tsx etc.)
   ═══════════════════════════════════════════════════════════════════════════ */
.profile-page { max-width: 960px; margin: 2rem auto; padding: 0 24px; }
.profile-header {
  display: flex; gap: 1.25rem; align-items: center;
  background: var(--md-brand); color: #fff;
  border-radius: var(--md-r); padding: 1.5rem;
  border-bottom: 3px solid var(--md-accent);
}
.profile-avatar, .avatar, .eic-avatar {
  width: 66px; height: 66px; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  background: var(--md-accent); color: var(--md-brand);
  border-radius: var(--md-r);
  font-family: var(--md-f-display); font-size: 1.4rem; font-weight: 700;
}
.profile-name { font-family: var(--md-f-display); font-size: 1.35rem; font-weight: 600; color: #fff; }
.profile-role { font-family: var(--md-f-mono); font-size: .68rem; text-transform: uppercase; letter-spacing: .12em; color: var(--md-accent); }
.profile-chips { display: flex; gap: .4rem; flex-wrap: wrap; margin-top: .5rem; }
.chip, .badge-primary-role, .badge-status {
  display: inline-flex; align-items: center; gap: .25rem;
  padding: .15rem .5rem;
  border: 1px solid rgba(255,255,255,.28); border-radius: var(--md-r);
  font-family: var(--md-f-mono); font-size: .66rem; color: rgba(255,255,255,.85);
}
.completeness { margin-top: 1rem; }
.comp-bar { height: 5px; background: var(--md-wash); border-radius: 2px; overflow: hidden; }
.comp-fill { height: 100%; background: var(--md-accent); transition: width .3s; }

.tabs, .wf-tabnav, .stab { display: flex; gap: 0; border-bottom: 2px solid var(--md-ink); margin: 1.5rem 0 1.25rem; overflow-x: auto; }
.tabs button, .stab, .wf-tabnav a {
  padding: .55rem 1rem;
  background: none; border: 0; border-bottom: 2px solid transparent;
  margin-bottom: -2px;
  font-family: var(--md-f-mono); font-size: .72rem;
  text-transform: uppercase; letter-spacing: .1em;
  color: var(--md-muted); cursor: pointer; white-space: nowrap;
}
.tabs button:hover, .stab:hover { color: var(--md-ink); }
.tabs button.active, .stab.active, .wf-tabnav a.active { color: var(--md-brand); border-bottom-color: var(--md-accent); font-weight: 700; }
.tab-panel, .tab-pane { display: none; }
.tab-panel.active, .tab-pane.active { display: block; }

.form-section {
  background: var(--md-surface); border: var(--md-rule);
  border-top: 3px solid var(--md-ink);
  border-radius: var(--md-r); padding: 1.25rem 1.35rem 1.5rem; margin-bottom: 1.1rem;
}
.form-section-title {
  font-family: var(--md-f-mono); font-size: .68rem;
  text-transform: uppercase; letter-spacing: .14em; color: var(--md-brand);
  padding-bottom: .5rem; border-bottom: var(--md-rule); margin-bottom: 1rem;
}
.form-group { margin-bottom: .9rem; }
.form-grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: .9rem; }
@media (max-width: 640px) { .form-grid-2 { grid-template-columns: 1fr; } }
.save-bar {
  position: sticky; bottom: 0;
  background: var(--md-surface); border-top: 2px solid var(--md-ink);
  padding: .8rem 1rem; display: flex; justify-content: flex-end; gap: .6rem;
}
.btn-save { width: auto; }

/* modals */
.modal-overlay {
  position: fixed; inset: 0; z-index: 10000;
  background: rgba(22,20,42,.65);
  display: flex; align-items: center; justify-content: center; padding: 1rem;
}
.modal-box, .modal, .eb-modal {
  width: 100%; max-width: 520px;
  background: var(--md-surface);
  border: 1px solid var(--md-ink);
  border-top: 4px solid var(--md-accent);
  border-radius: var(--md-r);
  box-shadow: var(--md-sh-hard);
  max-height: 88vh; display: flex; flex-direction: column;
}
.modal-md { max-width: 660px; }
.modal-header { display: flex; align-items: center; justify-content: space-between; padding: 1rem 1.25rem; border-bottom: var(--md-rule); }
.modal-title { font-family: var(--md-f-display); font-size: 1.05rem; font-weight: 600; margin: 0; }
.close-btn { background: none; border: 0; font-size: 1.3rem; line-height: 1; color: var(--md-muted); cursor: pointer; }
.close-btn:hover { color: var(--md-flag); }
.modal-body { padding: 1.25rem; overflow-y: auto; }
.modal-footer { padding: .9rem 1.25rem; border-top: var(--md-rule); display: flex; justify-content: flex-end; gap: .6rem; }

/* generic buttons used across shared components */
.btn, .wf-btn, .quick-btn {
  display: inline-flex; align-items: center; gap: .35rem;
  padding: .45rem .95rem;
  border: 1px solid var(--md-line-2); border-radius: var(--md-r);
  background: var(--md-surface); color: var(--md-ink);
  font-size: .82rem; font-weight: 600; cursor: pointer; transition: .15s;
}
.btn:hover, .wf-btn:hover { border-color: var(--md-ink); }
.wf-btn-primary { background: var(--md-ink); color: #fff; border-color: var(--md-ink); }
.wf-btn-primary:hover { background: var(--md-accent); border-color: var(--md-accent); color: var(--md-ink); }
.wf-btn-success { background: var(--md-ok); color: #fff; border-color: var(--md-ok); }
.wf-btn-danger { background: var(--md-flag); color: #fff; border-color: var(--md-flag); }
.wf-btn-outline { background: transparent; }
.wf-btn-sm { padding: .28rem .65rem; font-size: .75rem; }
.btn-link { background: none; border: 0; color: var(--md-brand-3); text-decoration: underline; cursor: pointer; padding: 0; }
.wf-status-pill, .badge-status {
  display: inline-flex; align-items: center; gap: .25rem;
  padding: .12rem .5rem;
  font-family: var(--md-f-mono); font-size: .66rem;
  text-transform: uppercase; letter-spacing: .08em;
  border: 1px solid var(--md-line-2); border-radius: 2px; color: var(--md-mid);
}

/* status tracker / misc shared */
.wf-card { background: var(--md-surface); border: var(--md-rule); border-radius: var(--md-r); }
.wf-card-header { padding: .85rem 1.1rem; border-bottom: var(--md-rule); font-family: var(--md-f-display); font-weight: 600; }
.wf-card-body { padding: 1.1rem; }
.wf-timeline-item { display: flex; gap: .75rem; padding: .6rem 0; }
.wf-timeline-dot { width: 10px; height: 10px; border-radius: 50%; background: var(--md-accent); flex-shrink: 0; margin-top: .35rem; }
.wf-step-num, .wf-step-icon {
  width: 26px; height: 26px; border-radius: var(--md-r);
  display: flex; align-items: center; justify-content: center;
  background: var(--md-wash); color: var(--md-brand);
  font-family: var(--md-f-mono); font-size: .7rem; font-weight: 700;
}
.wf-step.is-done .wf-step-num, .wf-step-check { background: var(--md-ok); color: #fff; }


/* ═══════════════════════════════════════════════════════════════════════════
   16. HOME SLIDER (components/JournalSlider.tsx — hp-*)
   ═══════════════════════════════════════════════════════════════════════════ */
.hp-slider { padding: 2.75rem 0; background: var(--md-wash); }
.hp-w { max-width: var(--md-wrap); margin: 0 auto; padding: 0 24px; }
.hp-slider__hd { margin-bottom: 1.5rem; padding-bottom: .6rem; border-bottom: 2px solid var(--md-ink); }
.hp-eyebrow { font-family: var(--md-f-mono); font-size: .66rem; text-transform: uppercase; letter-spacing: .16em; color: var(--md-accent-2); }
.hp-slider__h2 { font-family: var(--md-f-display); font-size: clamp(1.3rem,2.6vw,1.9rem); font-weight: 600; letter-spacing: -.025em; margin: .25rem 0 0; }
.hp-slider__sub { font-size: .86rem; color: var(--md-muted); margin: .25rem 0 0; }
.hp-slider__stage { position: relative; overflow: hidden; }
.hp-slider__track { display: flex; gap: 1.1rem; transition: transform .35s ease; }
.hp-jcard {
  flex: 0 0 auto; width: 240px;
  background: var(--md-surface); border: var(--md-rule); border-radius: var(--md-r);
  overflow: hidden; display: flex; flex-direction: column; transition: .15s;
}
.hp-jcard:hover { border-color: var(--md-ink); box-shadow: var(--md-sh-amber); transform: translate(-2px,-2px); }
.hp-jcard__img { position: relative; height: 130px; background: var(--md-brand); display: flex; align-items: center; justify-content: center; }
.hp-jcard__mono { font-family: var(--md-f-display); font-size: 1.8rem; font-weight: 700; color: rgba(255,255,255,.28); }
.hp-jcard__overlay { position: absolute; inset: 0; background: linear-gradient(180deg, transparent 50%, rgba(0,0,0,.4)); }
.hp-jcard__oa { position: absolute; top: 8px; right: 8px; font-family: var(--md-f-mono); font-size: .6rem; text-transform: uppercase; letter-spacing: .1em; background: var(--md-accent); color: var(--md-ink); padding: .1rem .4rem; border-radius: 2px; }
.hp-jcard__body { padding: .8rem .9rem 1rem; display: flex; flex-direction: column; flex: 1; }
.hp-jcard__title { font-family: var(--md-f-display); font-size: .92rem; font-weight: 600; line-height: 1.3; margin: 0 0 .25rem; }
.hp-jcard__issn { font-family: var(--md-f-mono); font-size: .66rem; color: var(--md-muted); }
.hp-jcard__meta { font-family: var(--md-f-mono); font-size: .68rem; color: var(--md-muted); margin-top: .35rem; }
.hp-jcard__cta { margin-top: auto; padding-top: .6rem; font-size: .78rem; font-weight: 600; color: var(--md-brand-3); }
.hp-slider__nav { display: flex; align-items: center; gap: .8rem; margin-top: 1rem; }
.hp-slider__btn {
  width: 32px; height: 32px;
  border: 1px solid var(--md-line-2); border-radius: var(--md-r);
  background: var(--md-surface); cursor: pointer; color: var(--md-ink);
}
.hp-slider__btn:hover { background: var(--md-ink); color: #fff; border-color: var(--md-ink); }
.hp-slider__dots { display: flex; gap: .25rem; }
.hp-slider__dot { width: 18px; height: 3px; background: var(--md-line-2); border: 0; cursor: pointer; }
.hp-slider__dot.active { background: var(--md-accent); }
.hp-slider__count { font-family: var(--md-f-mono); font-size: .72rem; color: var(--md-muted); margin-left: auto; }


/* ═══════════════════════════════════════════════════════════════════════════
   17. SCROLLBARS + FINAL POLISH
   ═══════════════════════════════════════════════════════════════════════════ */
* { scrollbar-width: thin; scrollbar-color: var(--md-line-2) transparent; }
::-webkit-scrollbar { width: 9px; height: 9px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--md-line-2); border-radius: 0; }
::-webkit-scrollbar-thumb:hover { background: var(--md-muted); }

/* mobile me sticky rails band — chhoti screen par jagah zaroori hai */
@media (max-width: 900px) {
  .ar-sidebar, .ar-toc-col, .iv-toc-wrap, .sr-sidebar { position: static; max-height: none; }
  :root { --md-header-h: 118px; }
}

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


/* ═══════════════════════════════════════════════════════════════════════════
   18. GAP-FILLERS — baaki classes jo shared app pages/components use karti hain
   ═══════════════════════════════════════════════════════════════════════════ */
/* citations page hero (app/index.php/[journal]/citations) */
.ia-hero {
  background: var(--md-ink);
  background-image: linear-gradient(150deg, var(--md-ink), #221E3D);
  color: #fff;
  padding: 2.25rem 0 2rem;
  border-bottom: 3px solid var(--md-accent);
}
.ia-hero .ia-w { max-width: var(--md-wrap); margin: 0 auto; padding: 0 24px; }

/* grid children — overflow guard */
.ep-hero__left, .jh-stats-left, .ap-pubs, .sr-filter-panel { min-width: 0; }
.sr-filter-panel { display: block; }
.jp-arow__date { white-space: nowrap; }
.toc-h { display: block; }
.ar-tb-toc-drop { position: relative; }
.ar-tb-toc-sep { display: block; }
.js-pdf-dl { cursor: pointer; }
.lc-mb-sm { margin-bottom: .5rem; }
.lc-mb-md { margin-bottom: .9rem; }

/* author-profile extras */
.ap-pubs { display: block; }
.ap-bar { margin-bottom: .2rem; }
.ap-ychart { margin-top: 1rem; }
.ap-analytics__chart { width: 100%; overflow-x: auto; }
.ap-pub__count--views { color: var(--md-mid); }
.ap-badge--scopus:hover { background: #E9711C; border-color: #E9711C; color: #fff; }
.ap-badge--scholar:hover { background: var(--md-brand-3); border-color: var(--md-brand-3); color: #fff; }

/* editorial member link buttons */
.iv-mem__btn--gs:hover { background: var(--md-brand-3); border-color: var(--md-brand-3); color: #fff; }
.iv-mem__btn--scopus:hover { background: #E9711C; border-color: #E9711C; color: #fff; }

/* math + table captions (JATS / generated PDF HTML) */
.math-display { display: block; overflow-x: auto; margin: 1.1rem 0; text-align: center; }
.math-formula { font-family: var(--md-f-mono); font-size: .95em; }
.table-caption { font-family: var(--md-f-mono); font-size: .72rem; color: var(--md-muted); margin-bottom: .4rem; }

/* MERIDIAN — end */


/* ═══════════════════════════════════════════════════════════════════════════
   ███  PART II — STRATA COMPONENTS  ███
   Yahan se neeche wo CSS hai jo naye rewrite kiye gaye components ke liye hai:
     mh-*  → Header (condensing command bar)
     mf-*  → Footer (colophon)
     st-*  → Journal home (strata bands, no sidebar)
   Upar ka Part I purane markup wale pages (article/issue/search/auth) ke liye
   hai — wo abhi tak jp-/ph-/ar-/iv-/sr-* classes use karte hain.
   ═══════════════════════════════════════════════════════════════════════════ */

:root {
  --mh-bar-h:      62px;
  --mh-rail-h:     44px;
  --md-header-h:   106px;  /* bar + rail — page ke top par poori height */
  --md-sticky-top: 62px;   /* scroll par rail collapse ho jati hai, sirf bar bachti hai */
  --page-offset:   106px;
}


/* ═══════════════════════════════════════════════════════════════════════════
   H1. HEADER — condensing command bar
   ═══════════════════════════════════════════════════════════════════════════ */
.mh {
  position: sticky;
  top: 0;
  z-index: 9000;
  background: var(--md-brand);
  color: #fff;
  border-bottom: 2px solid var(--md-accent);
  isolation: isolate;
}

/* ── Row 1: command bar ── */
.mh-bar { height: var(--mh-bar-h); display: flex; align-items: center; }
.mh-bar__inner {
  width: 100%;
  max-width: var(--md-wrap);
  margin: 0 auto;
  padding: 0 24px;
  display: flex;
  align-items: center;
  gap: 1rem;
}
@media (max-width: 640px) { .mh-bar__inner { padding: 0 14px; gap: .6rem; } }

.mh-brand { display: flex; align-items: center; gap: .65rem; min-width: 0; color: #fff; flex-shrink: 0; }
.mh-brand:hover { color: #fff; }
.mh-brand__logo { height: 34px; width: auto; max-width: 170px; object-fit: contain; }
.mh-brand__mono {
  width: 34px; height: 34px; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  background: var(--md-accent);
  color: var(--md-brand);
  font-family: var(--md-f-display);
  font-weight: 700; font-size: .82rem; letter-spacing: .02em;
  border-radius: var(--md-r);
}
.mh-brand__text { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.mh-brand__name {
  font-family: var(--md-f-display);
  font-size: .95rem; font-weight: 600; letter-spacing: -.015em;
  line-height: 1.15; color: #fff;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  max-width: 30ch;
}
.mh-brand__issn {
  font-family: var(--md-f-mono);
  font-size: .6rem; letter-spacing: .06em;
  color: rgba(255,255,255,.45);
  white-space: nowrap;
}
@media (max-width: 560px) { .mh-brand__issn { display: none; } .mh-brand__name { max-width: 16ch; } }

/* inline nav — sirf condensed state me dikhta hai */
.mh-inlinenav {
  flex: 1; min-width: 0;
  opacity: 0; visibility: hidden;
  transform: translateY(-4px);
  transition: opacity .2s ease, transform .2s ease, visibility .2s;
}
.mh.is-condensed .mh-inlinenav { opacity: 1; visibility: visible; transform: none; }
.mh-inlinenav__list {
  display: flex; align-items: center; gap: .15rem;
  list-style: none; margin: 0; padding: 0 0 0 .75rem;
  border-left: 1px solid rgba(255,255,255,.16);
  overflow-x: auto; scrollbar-width: none;
}
.mh-inlinenav__list::-webkit-scrollbar { display: none; }
.mh-inlinenav__link {
  display: inline-block;
  padding: .3rem .6rem;
  font-size: .78rem; font-weight: 500;
  color: rgba(255,255,255,.72);
  white-space: nowrap;
  border-radius: var(--md-r);
}
.mh-inlinenav__link:hover { color: var(--md-accent); background: rgba(255,255,255,.07); }
@media (max-width: 991px) { .mh-inlinenav { display: none; } }

.mh-bar__right { display: flex; align-items: center; gap: .5rem; margin-left: auto; flex-shrink: 0; }

/* ── Inline search (hamesha visible, modal nahi) ── */
.mh-find {
  display: flex; align-items: center; gap: .45rem;
  height: 34px;
  padding: 0 .5rem 0 .55rem;
  background: rgba(255,255,255,.09);
  border: 1px solid rgba(255,255,255,.16);
  border-radius: var(--md-r);
  transition: .18s;
  width: 260px;
}
.mh-find:focus-within { background: rgba(255,255,255,.14); border-color: var(--md-accent); width: 320px; }
.mh-find__ico { background: none; border: 0; padding: 0; color: rgba(255,255,255,.6); cursor: pointer; display: flex; }
.mh-find:focus-within .mh-find__ico { color: var(--md-accent); }
.mh-find__input {
  flex: 1; min-width: 0;
  background: transparent; border: 0; outline: 0;
  color: #fff; font-size: .8rem;
}
.mh-find__input::placeholder { color: rgba(255,255,255,.42); }
.mh-find__kbd {
  font-family: var(--md-f-mono); font-size: .62rem;
  color: rgba(255,255,255,.4);
  border: 1px solid rgba(255,255,255,.2);
  border-radius: 2px; padding: 0 .28rem; line-height: 1.5;
}
.mh-find:focus-within .mh-find__kbd { display: none; }
@media (max-width: 1100px) { .mh-find { width: 190px; } .mh-find:focus-within { width: 240px; } }
@media (max-width: 860px) {
  .mh-find { width: 34px; padding: 0; justify-content: center; border-color: transparent; background: transparent; }
  .mh-find__input, .mh-find__kbd { display: none; }
  .mh-find.is-open { width: 200px; padding: 0 .5rem; background: rgba(255,255,255,.12); border-color: var(--md-accent); }
  .mh-find.is-open .mh-find__input { display: block; }
}

.mh-submit {
  display: inline-flex; align-items: center; gap: .35rem;
  height: 34px; padding: 0 .85rem;
  background: var(--md-accent);
  color: var(--md-brand);
  border-radius: var(--md-r);
  font-size: .78rem; font-weight: 700;
  white-space: nowrap;
  transition: .15s;
}
.mh-submit:hover { background: #fff; color: var(--md-brand); }
@media (max-width: 760px) { .mh-submit__t { display: none; } .mh-submit { padding: 0 .6rem; } }
@media (max-width: 420px) { .mh-submit { display: none; } }

/* account */
.mh-acc { position: relative; }
.mh-acc__btn {
  width: 34px; height: 34px;
  display: flex; align-items: center; justify-content: center;
  background: rgba(255,255,255,.1);
  border: 1px solid rgba(255,255,255,.2);
  border-radius: var(--md-r);
  color: #fff;
  font-family: var(--md-f-mono); font-size: .7rem; font-weight: 700;
  cursor: pointer; transition: .15s;
}
.mh-acc__btn:hover { background: var(--md-accent); border-color: var(--md-accent); color: var(--md-brand); }
.mh-acc__panel {
  position: absolute; right: 0; top: calc(100% + 9px);
  min-width: 220px;
  background: var(--md-surface);
  border: 1px solid var(--md-ink);
  border-top: 3px solid var(--md-accent);
  box-shadow: var(--md-sh-hard);
  padding: 5px 0;
  z-index: 60;
}
.mh-acc__head { padding: .55rem .85rem .6rem; border-bottom: var(--md-rule); margin-bottom: 4px; }
.mh-acc__name { display: block; font-size: .84rem; font-weight: 600; color: var(--md-ink); }
.mh-acc__role { display: block; font-family: var(--md-f-mono); font-size: .62rem; text-transform: uppercase; letter-spacing: .1em; color: var(--md-muted); margin-top: 2px; }
.mh-acc__item {
  display: block; width: 100%; text-align: left;
  padding: .44rem .85rem;
  font-size: .82rem; color: var(--md-mid);
  background: none; border: 0; cursor: pointer;
  border-left: 2px solid transparent;
}
.mh-acc__item:hover { background: var(--md-wash); color: var(--md-brand); border-left-color: var(--md-accent); }
.mh-acc__item--out { color: var(--md-flag); border-top: var(--md-rule); margin-top: 4px; padding-top: .5rem; }
.mh-acc__item--out:hover { background: #FCEEEA; color: var(--md-flag); border-left-color: var(--md-flag); }

/* burger */
.mh-burger {
  display: none;
  width: 34px; height: 34px;
  flex-direction: column; align-items: center; justify-content: center; gap: 4px;
  background: transparent;
  border: 1px solid rgba(255,255,255,.2);
  border-radius: var(--md-r);
  cursor: pointer;
}
.mh-burger span { display: block; width: 15px; height: 1.5px; background: #fff; transition: .2s; }
.mh-burger.is-open span:nth-child(1) { transform: translateY(5.5px) rotate(45deg); }
.mh-burger.is-open span:nth-child(2) { opacity: 0; }
.mh-burger.is-open span:nth-child(3) { transform: translateY(-5.5px) rotate(-45deg); }
@media (max-width: 991px) { .mh-burger { display: flex; } }

/* ── Row 2: nav rail (condense par collapse) ── */
.mh-rail {
  height: var(--mh-rail-h);
  background: rgba(0,0,0,.22);
  border-top: 1px solid rgba(255,255,255,.09);
  overflow: visible;
  transition: height .22s ease, opacity .18s ease;
}
.mh.is-condensed .mh-rail { height: 0; opacity: 0; border-top-color: transparent; overflow: hidden; }
.mh-rail__inner {
  max-width: var(--md-wrap);
  margin: 0 auto;
  padding: 0 24px;
  height: var(--mh-rail-h);
  display: flex;
  align-items: stretch;
  justify-content: space-between;
  gap: 1rem;
}
.mh-nav__list { display: flex; align-items: stretch; list-style: none; margin: 0; padding: 0; }
.mh-nav__item { position: relative; display: flex; }
.mh-nav__link {
  display: inline-flex; align-items: center; gap: .3rem;
  padding: 0 .9rem;
  font-family: var(--md-f-mono);
  font-size: .72rem; font-weight: 500;
  text-transform: uppercase; letter-spacing: .1em;
  color: rgba(255,255,255,.75);
  white-space: nowrap;
  background: none; border: 0; cursor: pointer;
  box-shadow: inset 0 -2px 0 transparent;
  transition: .15s;
}
.mh-nav__link:hover { color: #fff; background: rgba(255,255,255,.06); box-shadow: inset 0 -2px 0 var(--md-accent); }
.mh-nav__link.is-active { color: var(--md-accent); box-shadow: inset 0 -2px 0 var(--md-accent); }
.mh-nav__chev { display: flex; opacity: .6; transition: transform .18s; }
.mh-nav__chev.is-open { transform: rotate(180deg); }

/* mega panel — chhoti dropdown ki jagah */
.mh-mega {
  display: none;
  position: absolute; left: 0; top: 100%;
  min-width: 280px;
  background: var(--md-surface);
  border: 1px solid var(--md-ink);
  border-top: 3px solid var(--md-accent);
  box-shadow: var(--md-sh-hard);
  z-index: 55;
}
.mh-mega.is-open { display: block; }
.mh-mega__inner { padding: .85rem 0 .5rem; }
.mh-mega__label {
  font-family: var(--md-f-mono);
  font-size: .62rem; text-transform: uppercase; letter-spacing: .14em;
  color: var(--md-muted);
  padding: 0 1rem .55rem;
  border-bottom: var(--md-rule);
  margin-bottom: .35rem;
}
.mh-mega__list { list-style: none; margin: 0; padding: 0; }
.mh-mega__list a {
  display: flex; align-items: baseline; gap: .6rem;
  padding: .45rem 1rem;
  font-size: .84rem; color: var(--md-mid);
  border-left: 2px solid transparent;
}
.mh-mega__list a:hover { background: var(--md-wash); color: var(--md-brand); border-left-color: var(--md-accent); }
.mh-mega__n { font-family: var(--md-f-mono); font-size: .62rem; color: var(--md-faint); }

.mh-rail__util { display: flex; align-items: center; gap: 1.1rem; }
.mh-rail__util a {
  font-size: .74rem;
  color: rgba(255,255,255,.55);
  border-bottom: 1px solid transparent;
}
.mh-rail__util a:hover { color: var(--md-accent); border-bottom-color: currentColor; }
@media (max-width: 991px) { .mh-rail { display: none; } :root { --md-header-h: 62px; --md-sticky-top: 62px; --page-offset: 62px; } }

/* ── Mobile drawer (right se slide-in) ── */
.mh-drawer { position: fixed; inset: 0; z-index: 9800; pointer-events: none; }
.mh-drawer.is-open { pointer-events: auto; }
.mh-drawer__scrim {
  position: absolute; inset: 0;
  background: rgba(11,10,24,.6);
  opacity: 0; transition: opacity .24s;
}
.mh-drawer.is-open .mh-drawer__scrim { opacity: 1; }
.mh-drawer__panel {
  position: absolute; top: 0; right: 0; bottom: 0;
  width: 320px; max-width: 86vw;
  background: var(--md-brand);
  border-left: 3px solid var(--md-accent);
  transform: translateX(100%);
  transition: transform .26s cubic-bezier(.4,0,.2,1);
  display: flex; flex-direction: column;
  overflow-y: auto;
}
.mh-drawer.is-open .mh-drawer__panel { transform: translateX(0); }
.mh-drawer__top {
  display: flex; align-items: center; justify-content: space-between;
  padding: 1rem 1.1rem;
  border-bottom: 1px solid rgba(255,255,255,.12);
}
.mh-drawer__title {
  font-family: var(--md-f-mono); font-size: .68rem;
  text-transform: uppercase; letter-spacing: .18em;
  color: var(--md-accent);
}
.mh-drawer__x { background: none; border: 0; color: rgba(255,255,255,.7); cursor: pointer; display: flex; }
.mh-drawer__x:hover { color: var(--md-accent); }
.mh-drawer__list { list-style: none; margin: 0; padding: .5rem 0; }
.mh-drawer__row { display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid rgba(255,255,255,.07); }
.mh-drawer__row a {
  flex: 1;
  padding: .75rem 1.1rem;
  font-family: var(--md-f-display);
  font-size: 1rem; font-weight: 500;
  color: rgba(255,255,255,.9);
}
.mh-drawer__row a:hover { color: var(--md-accent); }
.mh-drawer__chev { background: none; border: 0; color: rgba(255,255,255,.5); padding: .6rem 1rem; cursor: pointer; display: flex; }
.mh-drawer__chev.is-open { transform: rotate(180deg); color: var(--md-accent); }
.mh-drawer__sub { list-style: none; margin: 0; padding: .2rem 0 .5rem; background: rgba(0,0,0,.22); border-left: 2px solid var(--md-accent); margin-left: 1.1rem; }
.mh-drawer__sub a { display: block; padding: .45rem 1rem; font-size: .84rem; color: rgba(255,255,255,.7); }
.mh-drawer__sub a:hover { color: var(--md-accent); }
.mh-drawer__foot {
  margin-top: auto;
  padding: 1rem 1.1rem;
  border-top: 1px solid rgba(255,255,255,.12);
  display: flex; flex-direction: column; gap: .5rem;
}
.mh-drawer__foot a { font-size: .82rem; color: rgba(255,255,255,.6); }
.mh-drawer__foot a:hover { color: var(--md-accent); }
.mh-drawer__social { display: flex; gap: .9rem; padding: 0 1.1rem 1.2rem; }
.mh-drawer__social a { font-family: var(--md-f-mono); font-size: .68rem; text-transform: uppercase; letter-spacing: .08em; color: rgba(255,255,255,.5); }
.mh-drawer__social a:hover { color: var(--md-accent); }

.mh-impersonate {
  background: var(--md-flag); color: #fff;
  text-align: center; padding: 5px 16px;
  font-family: var(--md-f-mono); font-size: .72rem; font-weight: 600;
}
.mh-impersonate button {
  background: rgba(255,255,255,.2); color: #fff;
  border: 0; border-radius: var(--md-r);
  padding: 2px 10px; margin-left: 10px;
  font-size: .7rem; font-weight: 700; cursor: pointer;
}


/* ═══════════════════════════════════════════════════════════════════════════
   H2. FOOTER — colophon
   ═══════════════════════════════════════════════════════════════════════════ */
.mf { background: var(--md-ink); color: rgba(255,255,255,.7); border-top: 3px solid var(--md-accent); }
.mf-wrap { max-width: var(--md-wrap); margin: 0 auto; padding: 0 24px; }
@media (max-width: 640px) { .mf-wrap { padding: 0 16px; } }

/* ── 1. Wordmark band ── */
.mf-mark { padding: 2.75rem 0 2.25rem; border-bottom: 1px solid rgba(255,255,255,.1); }
.mf-mark__grid { display: grid; grid-template-columns: 1.5fr 1fr; gap: 3rem; align-items: start; }
@media (max-width: 860px) { .mf-mark__grid { grid-template-columns: 1fr; gap: 1.75rem; } }

.mf-mark__id { display: flex; align-items: center; gap: .8rem; margin-bottom: 1rem; }
.mf-mark__mono {
  width: 46px; height: 46px; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  background: var(--md-accent); color: var(--md-ink);
  border-radius: var(--md-r);
  font-family: var(--md-f-display); font-size: 1.1rem; font-weight: 700;
}
.mf-mark__name {
  font-family: var(--md-f-display);
  font-size: clamp(1.15rem, 2.4vw, 1.7rem);
  font-weight: 600; letter-spacing: -.025em; line-height: 1.15;
  color: #fff;
}
.mf-mark__desc { font-size: .86rem; line-height: 1.75; color: rgba(255,255,255,.55); max-width: 54ch; margin: 0; }

.mf-facts { margin: 0; display: flex; flex-direction: column; }
.mf-facts__row {
  display: grid; grid-template-columns: 72px 1fr;
  gap: .8rem;
  padding: .5rem 0;
  border-bottom: 1px solid rgba(255,255,255,.08);
}
.mf-facts__row:first-child { border-top: 1px solid rgba(255,255,255,.08); }
.mf-facts dt {
  font-family: var(--md-f-mono);
  font-size: .62rem; text-transform: uppercase; letter-spacing: .13em;
  color: rgba(255,255,255,.4);
  padding-top: 2px;
}
.mf-facts dd { margin: 0; font-size: .81rem; color: rgba(255,255,255,.75); line-height: 1.5; }
.mf-facts dd a { color: var(--md-accent); }
.mf-facts dd a:hover { text-decoration: underline; }

/* ── 2. Link matrix ── */
.mf-matrix { padding: 2.25rem 0 2rem; border-bottom: 1px solid rgba(255,255,255,.1); }
.mf-matrix__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 2rem; }
@media (max-width: 860px) { .mf-matrix__grid { grid-template-columns: 1fr 1fr; gap: 1.75rem; } }
@media (max-width: 480px) { .mf-matrix__grid { grid-template-columns: 1fr; gap: 1.5rem; } }

.mf-col__hd {
  font-family: var(--md-f-mono);
  font-size: .64rem; text-transform: uppercase; letter-spacing: .16em;
  color: var(--md-accent);
  margin: 0 0 .85rem;
  padding-bottom: .5rem;
  border-bottom: 1px solid rgba(255,255,255,.12);
}
.mf-col ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.mf-col li { border-bottom: 1px solid rgba(255,255,255,.05); }
.mf-col li:last-child { border-bottom: 0; }
.mf-col a { display: block; padding: .42rem 0; font-size: .82rem; color: rgba(255,255,255,.62); transition: .15s; }
.mf-col a:hover { color: var(--md-accent); padding-left: 5px; }
.mf-col__p { font-size: .81rem; line-height: 1.7; color: rgba(255,255,255,.55); margin: 0 0 .9rem; }
.mf-cta {
  display: inline-flex; align-items: center; gap: .4rem;
  padding: .5rem 1rem;
  background: var(--md-accent); color: var(--md-ink);
  border-radius: var(--md-r);
  font-size: .8rem; font-weight: 700;
  transition: .15s;
}
.mf-cta:hover { background: #fff; color: var(--md-ink); transform: translateX(2px); }

/* ── 3. Legal strip ── */
.mf-strip { background: rgba(0,0,0,.3); }
.mf-strip__inner {
  display: flex; align-items: center; justify-content: space-between;
  gap: 1rem; flex-wrap: wrap;
  padding-top: .9rem; padding-bottom: .9rem;
}
.mf-strip__copy { font-family: var(--md-f-mono); font-size: .68rem; letter-spacing: .03em; color: rgba(255,255,255,.45); }
.mf-strip__copy a { color: var(--md-accent); }
.mf-strip__social { display: flex; gap: 1rem; }
.mf-strip__social a {
  font-family: var(--md-f-mono);
  font-size: .66rem; text-transform: uppercase; letter-spacing: .1em;
  color: rgba(255,255,255,.45);
}
.mf-strip__social a:hover { color: var(--md-accent); }
.mf-strip__legal { display: flex; gap: 1.1rem; }
.mf-strip__legal a { font-size: .72rem; color: rgba(255,255,255,.45); }
.mf-strip__legal a:hover { color: var(--md-accent); }

/* ── Cookie banner ── */
.mf-cookie {
  position: fixed; left: 0; right: 0; bottom: 0;
  z-index: 9500;
  background: var(--md-ink);
  border-top: 3px solid var(--md-accent);
  color: rgba(255,255,255,.85);
}
.mf-cookie__inner {
  max-width: var(--md-wrap); margin: 0 auto; padding: .85rem 24px;
  display: flex; align-items: center; justify-content: space-between;
  gap: 1rem; flex-wrap: wrap;
}
.mf-cookie__text { margin: 0; font-size: .82rem; }
.mf-cookie__text a { color: var(--md-accent); text-decoration: underline; }
.mf-cookie__btns { display: flex; gap: .5rem; }
.mf-cookie__yes, .mf-cookie__no {
  padding: .42rem 1.1rem;
  border-radius: var(--md-r);
  font-size: .78rem; font-weight: 700;
  cursor: pointer;
}
.mf-cookie__yes { background: var(--md-accent); color: var(--md-ink); border: 1px solid var(--md-accent); }
.mf-cookie__yes:hover { background: #fff; border-color: #fff; }
.mf-cookie__no { background: transparent; color: rgba(255,255,255,.7); border: 1px solid rgba(255,255,255,.25); }
.mf-cookie__no:hover { border-color: #fff; color: #fff; }


/* ═══════════════════════════════════════════════════════════════════════════
   H3. JOURNAL HOME — STRATA bands (no sidebar)
   ═══════════════════════════════════════════════════════════════════════════ */
.st { background: var(--md-canvas); }
.st-wrap { max-width: var(--md-wrap); margin: 0 auto; padding: 0 24px; }
@media (max-width: 640px) { .st-wrap { padding: 0 16px; } }

/* shared band header */
.st-bandhead {
  display: flex; align-items: baseline; justify-content: space-between;
  gap: 1rem; flex-wrap: wrap;
  padding-bottom: .6rem; margin-bottom: 1.35rem;
  border-bottom: 2px solid var(--md-ink);
}
.st-bandhead__t {
  font-family: var(--md-f-mono);
  font-size: .74rem; font-weight: 500;
  text-transform: uppercase; letter-spacing: .18em;
  color: var(--md-ink);
  margin: 0;
}
.st-bandhead__more {
  display: inline-flex; align-items: center; gap: .35rem;
  font-size: .78rem; font-weight: 600;
  color: var(--md-brand-3);
}
.st-bandhead__more:hover { color: var(--md-accent-2); gap: .55rem; }
.st-void { color: var(--md-muted); font-size: .88rem; padding: 1.25rem 0; }
.st-void--sm { padding: .5rem 0; font-size: .8rem; }

/* shared link/button */
.st-lnk {
  display: inline-flex; align-items: center; gap: .4rem;
  padding: .45rem .9rem;
  border: 1px solid var(--md-line-2);
  border-radius: var(--md-r);
  font-size: .8rem; font-weight: 600;
  color: var(--md-ink);
  transition: .15s;
}
.st-lnk:hover { border-color: var(--md-ink); color: var(--md-ink); }
.st-lnk--fill { background: var(--md-ink); color: #fff; border-color: var(--md-ink); }
.st-lnk--fill:hover { background: var(--md-accent); border-color: var(--md-accent); color: var(--md-ink); }
.st-lnk--lg { padding: .65rem 1.25rem; font-size: .86rem; }
.st-lnk--ondark { color: #fff; border-color: rgba(255,255,255,.3); }
.st-lnk--ondark:hover { border-color: var(--md-accent); color: var(--md-accent); }

/* ── BAND 1: NAMEPLATE ── */
.st-plate { background: var(--md-surface); padding: 2.5rem 0 0; }
.st-plate__rule { height: 4px; background: var(--md-ink); }
.st-plate__rule + .st-plate__crumbs { margin-top: 1.1rem; }
.st-plate > .st-wrap > .st-plate__rule:last-child { margin-top: 2rem; height: 1px; background: var(--md-line); }
.st-plate__crumbs {
  display: flex; align-items: center; gap: .45rem;
  font-family: var(--md-f-mono);
  font-size: .64rem; text-transform: uppercase; letter-spacing: .14em;
  color: var(--md-muted);
  margin-bottom: 1.1rem;
}
.st-plate__crumbs a:hover { color: var(--md-brand-3); }
.st-plate__title {
  font-family: var(--md-f-display);
  font-size: clamp(2rem, 6vw, 4.2rem);
  font-weight: 600;
  line-height: .98;
  letter-spacing: -.045em;
  color: var(--md-ink);
  margin: 0 0 1.1rem;
  max-width: 20ch;
}
.st-plate__lede {
  font-size: 1.02rem;
  line-height: 1.75;
  color: var(--md-mid);
  max-width: 62ch;
  margin: 0 0 1.5rem;
}
.st-plate__more { color: var(--md-brand-3); font-weight: 600; border-bottom: 1px solid currentColor; }

.st-plate__rail {
  display: flex; flex-wrap: wrap; gap: 0;
  list-style: none; margin: 0 0 1.75rem; padding: 0;
  border-top: 1px solid var(--md-line);
  border-bottom: 1px solid var(--md-line);
}
.st-plate__railitem {
  font-family: var(--md-f-mono);
  font-size: .66rem; text-transform: uppercase; letter-spacing: .11em;
  color: var(--md-muted);
  padding: .6rem 1.1rem;
  border-right: 1px solid var(--md-line);
}
.st-plate__railitem:first-child { padding-left: 0; }
.st-plate__railitem:last-child { border-right: 0; }

.st-plate__find {
  display: flex; align-items: center; gap: .6rem;
  border-bottom: 2px solid var(--md-ink);
  padding-bottom: .5rem;
  max-width: 640px;
}
.st-plate__findico { color: var(--md-muted); display: flex; flex-shrink: 0; }
.st-plate__input {
  flex: 1; min-width: 0;
  border: 0; outline: 0; background: transparent;
  font-size: 1rem; color: var(--md-ink);
  padding: .3rem 0;
}
.st-plate__input::placeholder { color: var(--md-faint); }
.st-plate__go {
  display: inline-flex; align-items: center; gap: .35rem;
  background: none; border: 0; cursor: pointer;
  font-family: var(--md-f-mono);
  font-size: .7rem; text-transform: uppercase; letter-spacing: .12em; font-weight: 500;
  color: var(--md-brand); flex-shrink: 0;
}
.st-plate__go:hover { color: var(--md-accent-2); gap: .6rem; }

/* ── BAND 2: METRICS RIBBON ── */
.st-metrics { background: var(--md-ink); color: #fff; }
.st-metrics__row {
  display: flex; flex-wrap: wrap;
  list-style: none; margin: 0; padding: 0;
}
.st-metric {
  flex: 1 1 140px;
  display: flex; flex-direction: column; gap: .15rem;
  padding: 1.1rem 1.25rem;
  border-right: 1px solid rgba(255,255,255,.1);
}
.st-metric:first-child { padding-left: 0; }
.st-metric:last-child { border-right: 0; }
.st-metric__v {
  font-family: var(--md-f-display);
  font-size: 1.55rem; font-weight: 700; line-height: 1;
  color: var(--md-accent);
}
.st-metric__l {
  font-family: var(--md-f-mono);
  font-size: .62rem; text-transform: uppercase; letter-spacing: .14em;
  color: rgba(255,255,255,.5);
}
@media (max-width: 640px) {
  .st-metric { flex: 1 1 50%; padding: .85rem 1rem; border-bottom: 1px solid rgba(255,255,255,.1); }
  .st-metric:first-child { padding-left: 1rem; }
  .st-metric__v { font-size: 1.25rem; }
}

/* ── BAND 3: SPOTLIGHT ── */
.st-spotlight { background: var(--md-wash); padding: 3rem 0; }
.st-spotlight__grid { display: grid; grid-template-columns: 260px minmax(0,1fr); gap: 3rem; align-items: start; }
@media (max-width: 900px) { .st-spotlight__grid { grid-template-columns: 1fr; gap: 2rem; } }

.st-issue__frame { position: relative; margin-bottom: 1.1rem; }
.st-issue__frame::before {
  content: ''; position: absolute;
  inset: 14px -14px -14px 14px;
  border: 2px solid var(--md-accent);
  border-radius: var(--md-r);
  z-index: 0;
}
.st-issue__cover {
  position: relative; z-index: 1;
  display: block; width: 100%;
  aspect-ratio: 3/4; object-fit: cover;
  background: var(--md-brand);
  border-radius: var(--md-r);
}
.st-issue__cover--blank {
  display: flex; align-items: center; justify-content: center;
  color: rgba(255,255,255,.3);
  font-family: var(--md-f-display); font-size: 2.2rem; font-weight: 700;
}
.st-issue__label {
  font-family: var(--md-f-mono);
  font-size: .62rem; text-transform: uppercase; letter-spacing: .16em;
  color: var(--md-accent-2);
  margin-top: 1.5rem;
}
.st-issue__vol {
  font-family: var(--md-f-display);
  font-size: 1.15rem; font-weight: 600; letter-spacing: -.02em;
  color: var(--md-ink);
  margin: .25rem 0 .9rem;
}
.st-issue__links { display: flex; flex-direction: column; gap: .5rem; align-items: flex-start; }

.st-lead { display: grid; grid-template-columns: 46px minmax(0,1fr); gap: 1rem; padding: 1.15rem 0; border-bottom: 1px solid var(--md-line-2); }
.st-lead:last-child { border-bottom: 0; }
.st-lead__ord {
  font-family: var(--md-f-display);
  font-size: 1.5rem; font-weight: 700; line-height: 1;
  color: var(--md-line-2);
}
.st-lead__sec {
  font-family: var(--md-f-mono);
  font-size: .6rem; text-transform: uppercase; letter-spacing: .13em;
  color: var(--md-accent-2);
  margin-bottom: .3rem;
}
.st-lead__title {
  display: block;
  font-family: var(--md-f-display);
  font-size: 1.24rem; font-weight: 600; line-height: 1.28; letter-spacing: -.022em;
  color: var(--md-ink);
  margin-bottom: .35rem;
}
.st-lead__title:hover { color: var(--md-brand-3); }
.st-lead__au { font-size: .84rem; color: var(--md-mid); margin-bottom: .35rem; }
.st-lead__meta { display: flex; flex-wrap: wrap; gap: .9rem; font-family: var(--md-f-mono); font-size: .68rem; color: var(--md-muted); }

/* ── BAND 4: INDEX GRID ── */
.st-index { background: var(--md-canvas); padding: 3rem 0; }
.st-chips { display: flex; flex-wrap: wrap; gap: .35rem; margin-bottom: 1.5rem; }
.st-chip {
  display: inline-flex; align-items: center; gap: .4rem;
  padding: .32rem .75rem;
  background: transparent;
  border: 1px solid var(--md-line-2);
  border-radius: var(--md-r);
  font-family: var(--md-f-mono);
  font-size: .68rem; text-transform: uppercase; letter-spacing: .08em;
  color: var(--md-mid);
  cursor: pointer; transition: .15s;
}
.st-chip:hover { border-color: var(--md-ink); color: var(--md-ink); }
.st-chip.is-on { background: var(--md-ink); border-color: var(--md-ink); color: #fff; }
.st-chip__n { font-size: .62rem; opacity: .6; }

.st-entries {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 0 3rem;
  list-style: none; margin: 0; padding: 0;
  counter-reset: none;
}
@media (max-width: 860px) { .st-entries { grid-template-columns: 1fr; gap: 0; } }

.st-entry {
  display: grid; grid-template-columns: 40px minmax(0,1fr);
  gap: .9rem;
  padding: 1.25rem 0;
  border-bottom: 1px solid var(--md-line);
}
.st-entry__ord {
  font-family: var(--md-f-mono);
  font-size: .78rem; font-weight: 700;
  color: var(--md-line-2);
  padding-top: .15rem;
}
.st-entry:hover .st-entry__ord { color: var(--md-accent); }
.st-entry__top { display: flex; align-items: center; gap: .55rem; margin-bottom: .35rem; }
.st-entry__sec {
  font-family: var(--md-f-mono);
  font-size: .6rem; text-transform: uppercase; letter-spacing: .13em;
  color: var(--md-accent-2);
}
.st-entry__yr { font-family: var(--md-f-mono); font-size: .6rem; color: var(--md-faint); }
.st-entry__title {
  display: block;
  font-family: var(--md-f-display);
  font-size: 1.06rem; font-weight: 600; line-height: 1.32; letter-spacing: -.018em;
  color: var(--md-ink);
  margin-bottom: .3rem;
}
.st-entry__title:hover { color: var(--md-brand-3); }
.st-entry__au { font-size: .81rem; color: var(--md-mid); margin-bottom: .3rem; }
.st-entry__doi {
  display: inline-block;
  font-family: var(--md-f-mono); font-size: .68rem;
  color: var(--md-brand-3); word-break: break-all;
  margin-bottom: .5rem;
}
.st-entry__doi:hover { text-decoration: underline; }
.st-entry__foot { display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; }
.st-entry__views { font-family: var(--md-f-mono); font-size: .68rem; color: var(--md-muted); }
.st-mini {
  display: inline-flex; align-items: center; gap: .3rem;
  padding: .22rem .55rem;
  border: 1px solid var(--md-line-2);
  border-radius: var(--md-r);
  font-size: .72rem; font-weight: 600;
  color: var(--md-ink);
  transition: .15s;
}
.st-mini:hover { background: var(--md-ink); color: #fff; border-color: var(--md-ink); }

/* ── BAND 5: LEADERBOARDS ── */
.st-boards { background: var(--md-surface); padding: 2.75rem 0; border-top: 1px solid var(--md-line); }
.st-boards__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 3rem; }
@media (max-width: 860px) { .st-boards__grid { grid-template-columns: 1fr; gap: 2rem; } }
.st-board__hd {
  font-family: var(--md-f-mono);
  font-size: .7rem; text-transform: uppercase; letter-spacing: .18em;
  color: var(--md-ink);
  padding-bottom: .55rem; margin-bottom: .5rem;
  border-bottom: 2px solid var(--md-ink);
}
.st-board__list { list-style: none; margin: 0; padding: 0; }
.st-board__row { display: flex; gap: .9rem; padding: .8rem 0; border-bottom: 1px solid var(--md-line); }
.st-board__row:last-child { border-bottom: 0; }
.st-board__n {
  flex-shrink: 0;
  font-family: var(--md-f-display);
  font-size: 1.35rem; font-weight: 700; line-height: 1;
  color: var(--md-line-2);
  width: 26px;
}
.st-board__row:hover .st-board__n { color: var(--md-accent); }
.st-board__title { display: block; font-size: .9rem; font-weight: 500; line-height: 1.4; color: var(--md-ink); }
.st-board__title:hover { color: var(--md-brand-3); }
.st-board__meta { font-family: var(--md-f-mono); font-size: .68rem; color: var(--md-muted); margin-top: .25rem; }

/* ── BAND 6: DESK ── */
.st-desk { background: var(--md-wash); padding: 2.75rem 0; }
.st-desk__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 1.5rem; align-items: start; }
.st-panel {
  background: var(--md-surface);
  border: 1px solid var(--md-line);
  border-top: 3px solid var(--md-ink);
  border-radius: var(--md-r);
  padding: 1.1rem 1.2rem 1.2rem;
  display: flex; flex-direction: column; height: 100%;
}
.st-desk__grid > :nth-child(2) .st-panel, .st-desk__grid > .st-panel:nth-child(2) { border-top-color: var(--md-accent); }
.st-panel__hd {
  font-family: var(--md-f-mono);
  font-size: .66rem; text-transform: uppercase; letter-spacing: .16em;
  color: var(--md-brand);
  padding-bottom: .55rem; margin-bottom: .9rem;
  border-bottom: 1px solid var(--md-line);
}
.st-panel__foot {
  display: inline-flex; align-items: center; gap: .35rem;
  margin-top: auto; padding-top: .9rem;
  font-size: .78rem; font-weight: 600;
  color: var(--md-brand-3);
}
.st-panel__foot:hover { color: var(--md-accent-2); gap: .55rem; }
.st-panel__html { font-size: .84rem; line-height: 1.65; color: var(--md-mid); }
.st-panel__html a { color: var(--md-brand-3); }

.st-record { width: 100%; border-collapse: collapse; font-size: .8rem; }
.st-record th {
  text-align: left; font-weight: 400;
  font-family: var(--md-f-mono);
  font-size: .62rem; text-transform: uppercase; letter-spacing: .1em;
  color: var(--md-muted);
  padding: .42rem 0; width: 45%;
  border-bottom: 1px solid var(--md-line);
  vertical-align: top;
}
.st-record td {
  padding: .42rem 0;
  border-bottom: 1px solid var(--md-line);
  font-family: var(--md-f-mono); font-size: .76rem;
  color: var(--md-ink); word-break: break-word;
}
.st-record td a { color: var(--md-brand-3); }
.st-record tr:last-child th, .st-record tr:last-child td { border-bottom: 0; }

.st-editor { display: flex; gap: .8rem; align-items: flex-start; }
.st-editor__mono {
  width: 44px; height: 44px; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  background: var(--md-brand); color: var(--md-accent);
  border-radius: var(--md-r);
  font-family: var(--md-f-mono); font-size: .8rem; font-weight: 700;
}
.st-editor__role { font-family: var(--md-f-mono); font-size: .6rem; text-transform: uppercase; letter-spacing: .12em; color: var(--md-accent-2); }
.st-editor__name { font-family: var(--md-f-display); font-size: 1rem; font-weight: 600; color: var(--md-ink); margin-top: .15rem; }
.st-editor__aff { font-size: .79rem; color: var(--md-muted); line-height: 1.5; margin-top: .2rem; }

.st-idx { list-style: none; margin: 0; padding: 0; }
.st-idx__item {
  display: flex; align-items: center; gap: .6rem;
  padding: .45rem 0;
  border-bottom: 1px solid var(--md-line);
  font-size: .81rem; color: var(--md-mid);
}
.st-idx__item:last-child { border-bottom: 0; }
.st-idx__tag {
  width: 24px; height: 24px; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  background: var(--md-wash); color: var(--md-brand);
  border-radius: var(--md-r);
  font-family: var(--md-f-mono); font-size: .58rem; font-weight: 700;
}

/* ── BAND 7: CLOSING CTA ── */
.st-close {
  background: var(--md-brand);
  background-image:
    radial-gradient(circle at 85% 20%, rgba(232,163,23,.18), transparent 50%),
    linear-gradient(150deg, var(--md-brand), #17143C);
  color: #fff;
  padding: 3.25rem 0;
  border-top: 3px solid var(--md-accent);
}
.st-close__grid { display: grid; grid-template-columns: 1.25fr 1fr; gap: 3rem; align-items: center; }
@media (max-width: 860px) { .st-close__grid { grid-template-columns: 1fr; gap: 2rem; } }
.st-close__kick {
  font-family: var(--md-f-mono);
  font-size: .64rem; text-transform: uppercase; letter-spacing: .18em;
  color: var(--md-accent);
  margin-bottom: .6rem;
}
.st-close__h {
  font-family: var(--md-f-display);
  font-size: clamp(1.6rem, 3.6vw, 2.6rem);
  font-weight: 600; letter-spacing: -.035em; line-height: 1.08;
  color: #fff; margin: 0 0 .7rem;
}
.st-close__p { font-size: .92rem; line-height: 1.75; color: rgba(255,255,255,.62); max-width: 52ch; margin: 0 0 1.5rem; }
.st-close__btns { display: flex; gap: .6rem; flex-wrap: wrap; }
.st-close__right { min-width: 0; }
.st-steps { list-style: none; margin: 0; padding: 0; }
.st-steps li {
  display: flex; align-items: baseline; gap: .8rem;
  padding: .7rem 0;
  border-bottom: 1px solid rgba(255,255,255,.12);
  font-size: .87rem; color: rgba(255,255,255,.75);
}
.st-steps li:last-child { border-bottom: 0; }
.st-steps__n {
  font-family: var(--md-f-mono);
  font-size: .68rem; font-weight: 700;
  color: var(--md-accent);
  flex-shrink: 0;
}


/* ── structural containers (grid children — overflow guards) ── */
.mf-mark__left, .mf-col--cta { min-width: 0; }
.mh-acc__btn--guest { font-size: 0; }
.mh-acc__btn--guest svg { display: block; }
.mh-drawer__item { list-style: none; }
.mh-nav__item--has { position: relative; }
.st-issue, .st-leads, .st-board, .st-close__left { min-width: 0; }
.st-board__body, .st-entry__main, .st-lead__body { min-width: 0; }


/* ═══════════════════════════════════════════════════════════════════════════
   H4. CUSTOM FOOTER HTML  (admin-set) — pf-* / vf-* families
   -----------------------------------------------------------------------------
   Agar admin ne Journal Settings me custom footer HTML set kiya hai to
   Footer.tsx apna markup render NAHI karta — wo HTML as-is nikalta hai.
   Us HTML ki classes purane themes ki hain, isliye Meridian me unhe style
   karna zaroori hai warna footer ek plain unstyled link-list ban jata hai.
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── shared shell ── */
.pf-footer, .vf-footer, .pf-inner, .vf-inner {
  background: var(--md-ink);
  color: rgba(255,255,255,.7);
  font-family: var(--md-f-text);
}
.pf-footer, .vf-footer { border-top: 3px solid var(--md-accent); }
.pf-inner, .vf-inner {
  max-width: var(--md-wrap);
  margin: 0 auto;
  padding: 2.5rem 24px 0;
}
.vf-topline, .pf-topline { height: 3px; background: var(--md-accent); border: 0; margin: 0; }
.pf-footer a, .vf-footer a, .pf-inner a, .vf-inner a { text-decoration: none; }

/* ── identity row ── */
.pf-top, .vf-brand-bar {
  display: flex; flex-direction: column; gap: 1.25rem;
  padding-bottom: 1.6rem;
  border-bottom: 1px solid rgba(255,255,255,.12);
  margin-bottom: 1.75rem;
}
@media (min-width: 768px) {
  .pf-top, .vf-brand-bar { flex-direction: row; align-items: center; justify-content: space-between; }
}
.pf-identity, .vf-brand-left { display: flex; align-items: center; gap: .85rem; min-width: 0; }
.pf-mono, .vf-mark {
  width: 44px; height: 44px; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  background: var(--md-accent); color: var(--md-ink);
  border: 0; border-radius: var(--md-r);
  font-family: var(--md-f-display); font-size: 1.1rem; font-weight: 700;
}
.pf-journal-name, .vf-title {
  font-family: var(--md-f-display);
  font-size: 1.08rem; font-weight: 600; letter-spacing: -.02em;
  color: #fff; line-height: 1.25; margin: 0 0 .2rem;
}
.pf-issn-row, .vf-title-issn {
  display: block;
  font-family: var(--md-f-mono);
  font-size: .68rem; letter-spacing: .05em;
  color: rgba(255,255,255,.5);
}
.vf-sub, .pf-desc, .vf-about-light {
  font-size: .83rem; line-height: 1.7;
  color: rgba(255,255,255,.6);
  margin: .4rem 0 0;
}
.vf-about-bold { font-size: .84rem; font-weight: 600; color: rgba(255,255,255,.85); line-height: 1.65; margin: 0 0 .5rem; }

/* ── CTA buttons ── */
.pf-top-btns, .vf-brand-btns { display: flex; gap: .55rem; flex-wrap: wrap; flex-shrink: 0; }
.pf-cta-btn, .vf-btn {
  display: inline-flex; align-items: center; gap: .35rem;
  padding: .45rem 1rem;
  border-radius: var(--md-r);
  border: 1px solid transparent;
  font-size: .8rem; font-weight: 700;
  white-space: nowrap;
  transition: .15s;
}
.pf-cta-btn--white, .vf-btn--submit {
  background: var(--md-accent) !important;
  border-color: var(--md-accent) !important;
  color: var(--md-ink) !important;
}
.pf-cta-btn--white:hover, .vf-btn--submit:hover { background: #fff !important; border-color: #fff !important; }
.pf-cta-btn--outline, .vf-btn--issue {
  background: transparent !important;
  border-color: rgba(255,255,255,.32) !important;
  color: #fff !important;
}
.pf-cta-btn--outline:hover, .vf-btn--issue:hover { border-color: var(--md-accent) !important; color: var(--md-accent) !important; }

/* ── column grid ── */
.pf-grid, .vf-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.75rem;
  padding-bottom: 1.75rem;
}
@media (min-width: 576px)  { .pf-grid, .vf-grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1024px) { .pf-grid, .vf-grid { grid-template-columns: 2fr 1fr 1fr 1.3fr; gap: 2.25rem; } }
.pf-col, .vf-col { min-width: 0; }
.pf-col-head, .vf-colhead {
  font-family: var(--md-f-mono);
  font-size: .64rem; font-weight: 500;
  letter-spacing: .16em; text-transform: uppercase;
  color: var(--md-accent);
  border-top: 0;
  border-bottom: 1px solid rgba(255,255,255,.14);
  padding: 0 0 .5rem;
  margin: 0 0 .85rem;
}

/* ── link lists (screenshot me yahi tut rahi thi) ── */
.pf-links, .vf-linklist {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}
.pf-links li, .vf-linklist li {
  margin: 0;
  border-bottom: 1px solid rgba(255,255,255,.05);
}
.pf-links li:last-child, .vf-linklist li:last-child { border-bottom: 0; }
.pf-links a, .vf-link {
  display: flex; align-items: center; gap: .45rem;
  padding: .42rem 0;
  font-size: .82rem;
  color: rgba(255,255,255,.62) !important;
  transition: .15s;
}
.pf-links a:hover, .vf-link:hover { color: var(--md-accent) !important; padding-left: 5px; }
.pf-links a i, .pf-links a .bi, .vf-link i { font-size: .72rem; color: var(--md-accent); opacity: .8; flex-shrink: 0; }

/* ── contact block ── */
.pf-contact, .vf-contact { list-style: none; padding: 0; margin: 0 0 1rem; font-size: .82rem; }
.pf-contact li, .vf-contact-row {
  display: flex; align-items: flex-start; gap: .55rem;
  color: rgba(255,255,255,.62);
  margin-bottom: .55rem; line-height: 1.5;
}
.pf-contact li i, .vf-contact-icon { flex-shrink: 0; margin-top: .15rem; color: var(--md-accent); opacity: .85; }
.pf-contact a { color: rgba(255,255,255,.8) !important; word-break: break-word; }
.pf-contact a:hover { color: var(--md-accent) !important; }

/* ── feature / badge lists (Open Access · Peer Reviewed · Indexing Ready) ── */
.pf-features, .vf-features, .pf-badges {
  list-style: none; padding: 0; margin: .75rem 0 0;
  display: flex; flex-wrap: wrap; gap: .4rem;
}
.pf-features li, .vf-features li, .pf-badges li, .pf-badge, .vf-badge {
  display: inline-flex; align-items: center; gap: .35rem;
  padding: .22rem .6rem;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: var(--md-r);
  font-family: var(--md-f-mono);
  font-size: .64rem; text-transform: uppercase; letter-spacing: .1em;
  color: rgba(255,255,255,.62);
}
.pf-features li i, .pf-badges li i { color: var(--md-accent); }

/* index badge images (CrossRef / Google Scholar chips) */
.pf-index-badges, .vf-index-badges { display: flex; flex-wrap: wrap; gap: .45rem; margin: .85rem 0; }
.pf-index-badges a, .vf-index-badges a,
.pf-indexbadge, .vf-indexbadge {
  display: inline-flex; align-items: center; gap: .35rem;
  padding: .28rem .6rem;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.16);
  border-radius: var(--md-r);
  font-size: .7rem;
  color: rgba(255,255,255,.7) !important;
}
.pf-index-badges a:hover, .vf-index-badges a:hover { border-color: var(--md-accent); color: var(--md-accent) !important; }
.pf-index-badges img, .vf-index-badges img { height: 15px; width: auto; }

/* ── socials ── */
.pf-socials, .vf-social { display: flex; gap: .45rem; margin: .9rem 0; flex-wrap: wrap; }
.pf-social, .vf-social a {
  width: 32px; height: 32px;
  display: flex; align-items: center; justify-content: center;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: var(--md-r);
  color: rgba(255,255,255,.65) !important;
  font-size: .8rem;
  transition: .15s;
}
.pf-social:hover, .vf-social a:hover {
  background: var(--md-accent); border-color: var(--md-accent);
  color: var(--md-ink) !important;
}

/* ── bottom strip ── */
.pf-bottom, .vf-bottom {
  border-top: 1px solid rgba(255,255,255,.1);
  padding: .9rem 0;
  display: flex; flex-wrap: wrap;
  align-items: center; justify-content: space-between;
  gap: .7rem;
  font-family: var(--md-f-mono);
  font-size: .7rem; letter-spacing: .03em;
  color: rgba(255,255,255,.45);
}
.pf-bottom a, .vf-bottom a, .vf-copy a { color: rgba(255,255,255,.55) !important; }
.pf-bottom a:hover, .vf-bottom a:hover { color: var(--md-accent) !important; }
.pf-bottom__links, .vf-bottom-links { display: flex; flex-wrap: wrap; gap: .9rem; }
.vf-copy { font-family: var(--md-f-mono); font-size: .7rem; color: rgba(255,255,255,.45); line-height: 1.5; }

/* Safety net: custom footer HTML me kabhi-kabhi bare <ul> hote hain
   jinpar koi class nahi hoti — unhe bhi list-style se bachao. */
.pf-footer ul, .vf-footer ul, .pf-inner ul, .vf-inner ul { list-style: none; padding-left: 0; }
.pf-footer h1, .pf-footer h2, .pf-footer h3, .pf-footer h4,
.vf-footer h1, .vf-footer h2, .vf-footer h3, .vf-footer h4,
.pf-inner h3, .pf-inner h4, .vf-inner h3, .vf-inner h4 { color: #fff; }


/* ═══════════════════════════════════════════════════════════════════════════
   H5. HOME PAGE POLISH — screenshot ke baad ke fixes
   ═══════════════════════════════════════════════════════════════════════════ */

/* Ek hi board ho to poori width le, aur list 2 columns me bahe —
   pehle aadha band khaali reh jata tha. */
.st-boards__grid.is-single { grid-template-columns: 1fr; }
.st-boards__grid.is-single .st-board__list { columns: 2; column-gap: 3rem; }
.st-boards__grid.is-single .st-board__row { break-inside: avoid; }
@media (max-width: 860px) {
  .st-boards__grid.is-single .st-board__list { columns: 1; }
}

/* Metrics ribbon zyada substantial — pehle patli strip lag rahi thi */
.st-metric { padding: 1.35rem 1.5rem; }
.st-metric__v { font-size: 1.8rem; }
.st-metric__l { margin-top: .3rem; }

/* Nameplate ka lower rule aur search ke beech saans */
.st-plate { padding-bottom: .5rem; }
.st-plate__find { margin-bottom: .5rem; }

/* Desk panels ki height barabar rahe aur grid 3 se zyada na phaile */
.st-desk__grid { grid-template-columns: repeat(auto-fit, minmax(270px, 1fr)); }
@media (min-width: 1100px) { .st-desk__grid { grid-template-columns: repeat(3, 1fr); } }

/* Spotlight ka cover thoda bada — page bharaa hua lage */
@media (min-width: 901px) {
  .st-spotlight__grid { grid-template-columns: 300px minmax(0,1fr); }
}

/* Index grid ki columns ke beech ek hairline — do column alag dikhein */
@media (min-width: 861px) {
  .st-entries { column-gap: 0; }
  .st-entry { padding-right: 1.75rem; }
  .st-entry:nth-child(even) { padding-left: 1.75rem; padding-right: 0; border-left: 1px solid var(--md-line); }
}


/* ═══════════════════════════════════════════════════════════════════════════
   H6. OBSERVATORY HOME  (ob-*)
   ---------------------------------------------------------------------------
   Visual signature:
     • grain texture overlay (inline SVG turbulence)
     • amber arcs jo viewport edge se bleed karte hain
     • outline numerals — -webkit-text-stroke se bane ghost numbers
     • rotated vertical margin labels (writing-mode)
     • hard offset shadows, koi blur nahi
     • oversized display type, tight negative tracking
   ═══════════════════════════════════════════════════════════════════════════ */

.ob { background: var(--md-canvas); overflow-x: clip; }
.ob-wrap { max-width: var(--md-wrap); margin: 0 auto; padding: 0 24px; position: relative; z-index: 2; }
@media (max-width: 640px) { .ob-wrap { padding: 0 18px; } }

/* grain — print jaisa texture, dono dark bands par */
.ob-poster__grain, .ob-close__grain {
  position: absolute; inset: 0;
  pointer-events: none;
  opacity: .30;
  mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='.5'/%3E%3C/svg%3E");
}

/* shared band head */
.ob-head {
  display: flex; align-items: flex-end; justify-content: space-between;
  gap: 1.5rem; flex-wrap: wrap;
  padding-bottom: 1rem; margin-bottom: 2rem;
  border-bottom: 2px solid var(--md-ink);
}
.ob-head__kick {
  display: block;
  font-family: var(--md-f-mono);
  font-size: .64rem; text-transform: uppercase; letter-spacing: .22em;
  color: var(--md-accent-2);
  margin-bottom: .5rem;
}
.ob-head__t {
  font-family: var(--md-f-display);
  font-size: clamp(1.5rem, 3.4vw, 2.4rem);
  font-weight: 600; letter-spacing: -.035em; line-height: 1;
  color: var(--md-ink); margin: 0;
}
.ob-head__more {
  display: inline-flex; align-items: center; gap: .45rem;
  font-family: var(--md-f-mono);
  font-size: .7rem; text-transform: uppercase; letter-spacing: .12em;
  color: var(--md-brand); padding-bottom: .2rem;
  border-bottom: 1px solid var(--md-line-2);
  transition: .18s;
}
.ob-head__more:hover { color: var(--md-accent-2); border-bottom-color: var(--md-accent); gap: .75rem; }
.ob-void { color: var(--md-muted); font-size: .9rem; padding: 1.5rem 0; }
.ob-void--sm { padding: .5rem 0; font-size: .8rem; }

/* shared buttons */
.ob-btn {
  display: inline-flex; align-items: center; gap: .5rem;
  padding: .8rem 1.5rem;
  border-radius: var(--md-r);
  border: 1px solid transparent;
  font-size: .87rem; font-weight: 700;
  transition: .18s;
}
.ob-btn--fill { background: var(--md-accent); color: var(--md-ink); border-color: var(--md-accent); box-shadow: 5px 5px 0 rgba(255,255,255,.18); }
.ob-btn--fill:hover { background: #fff; border-color: #fff; color: var(--md-ink); transform: translate(-2px,-2px); box-shadow: 7px 7px 0 var(--md-accent); }
.ob-btn--ghost { color: #fff; border-color: rgba(255,255,255,.32); }
.ob-btn--ghost:hover { border-color: var(--md-accent); color: var(--md-accent); }
.ob-pill {
  display: inline-flex; align-items: center; gap: .35rem;
  padding: .26rem .65rem;
  border: 1px solid var(--md-line-2);
  border-radius: var(--md-r);
  font-size: .73rem; font-weight: 600;
  color: var(--md-ink);
  transition: .15s;
}
.ob-pill:hover { background: var(--md-ink); color: #fff; border-color: var(--md-ink); }


/* ── BAND 1: POSTER ──────────────────────────────────────────────────── */
.ob-poster {
  position: relative;
  background: var(--md-brand);
  background-image: linear-gradient(155deg, #221D5C 0%, var(--md-brand) 45%, #14113A 100%);
  color: #fff;
  overflow: hidden;
  padding: 3.5rem 0 3rem;
  border-bottom: 3px solid var(--md-accent);
}
@media (max-width: 700px) { .ob-poster { padding: 2.25rem 0 2.25rem; } }

/* bleeding amber arc — right edge se bahar */
.ob-poster__arc {
  position: absolute;
  top: -28%; right: -16%;
  width: 62vw; height: 62vw;
  max-width: 900px; max-height: 900px;
  border-radius: 50%;
  border: 1.5px solid rgba(232,163,23,.32);
  box-shadow: inset 0 0 140px rgba(232,163,23,.09);
  pointer-events: none;
}
.ob-poster__arc::after {
  content: '';
  position: absolute; inset: 14%;
  border-radius: 50%;
  border: 1px solid rgba(232,163,23,.16);
}

/* rotated margin spine */
.ob-poster__spine {
  position: absolute;
  left: 18px; top: 50%;
  transform: translateY(-50%);
  writing-mode: vertical-rl;
  display: flex; align-items: center; gap: .9rem;
  font-family: var(--md-f-mono);
  font-size: .62rem; text-transform: uppercase; letter-spacing: .26em;
  color: rgba(255,255,255,.34);
  z-index: 3;
}
.ob-poster__spine-dot { width: 3px; height: 3px; background: var(--md-accent); border-radius: 50%; }
@media (max-width: 1280px) { .ob-poster__spine { display: none; } }

.ob-poster__grid {
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr);
  gap: 3.5rem;
  align-items: center;
}
@media (max-width: 900px) { .ob-poster__grid { grid-template-columns: 1fr; gap: 2.5rem; } }

.ob-poster__crumb {
  display: flex; align-items: center; gap: .5rem;
  font-family: var(--md-f-mono);
  font-size: .62rem; text-transform: uppercase; letter-spacing: .2em;
  color: rgba(255,255,255,.4);
  margin-bottom: 1.4rem;
}
.ob-poster__crumb a:hover { color: var(--md-accent); }

.ob-poster__title {
  font-family: var(--md-f-display);
  font-size: clamp(2.35rem, 6.4vw, 5rem);
  font-weight: 600;
  line-height: .93;
  letter-spacing: -.05em;
  color: #fff;
  margin: 0;
  max-width: 15ch;
  text-wrap: balance;
}
.ob-poster__underline {
  width: 92px; height: 5px;
  background: var(--md-accent);
  margin: 1.5rem 0 1.25rem;
}
.ob-poster__lede {
  font-size: 1rem; line-height: 1.8;
  color: rgba(255,255,255,.66);
  max-width: 54ch;
  margin: 0 0 1.5rem;
}
.ob-poster__more { color: var(--md-accent); font-weight: 600; border-bottom: 1px solid currentColor; }

.ob-poster__rail {
  display: flex; flex-wrap: wrap;
  list-style: none; margin: 0 0 1.75rem; padding: 0;
  border-top: 1px solid rgba(255,255,255,.16);
  border-bottom: 1px solid rgba(255,255,255,.16);
}
.ob-poster__rail li {
  font-family: var(--md-f-mono);
  font-size: .64rem; text-transform: uppercase; letter-spacing: .14em;
  color: rgba(255,255,255,.55);
  padding: .65rem 1.15rem;
  border-right: 1px solid rgba(255,255,255,.12);
}
.ob-poster__rail li:first-child { padding-left: 0; }
.ob-poster__rail li:last-child { border-right: 0; }

.ob-poster__find {
  display: flex; align-items: center; gap: .7rem;
  border-bottom: 2px solid rgba(255,255,255,.4);
  padding-bottom: .6rem;
  max-width: 560px;
  transition: border-color .2s;
}
.ob-poster__find:focus-within { border-bottom-color: var(--md-accent); }
.ob-poster__findico { color: rgba(255,255,255,.5); display: flex; flex-shrink: 0; }
.ob-poster__input {
  flex: 1; min-width: 0;
  border: 0; outline: 0; background: transparent;
  font-size: 1rem; color: #fff; padding: .3rem 0;
}
.ob-poster__input::placeholder { color: rgba(255,255,255,.35); }
.ob-poster__go {
  display: inline-flex; align-items: center; gap: .4rem;
  background: none; border: 0; cursor: pointer; flex-shrink: 0;
  font-family: var(--md-f-mono);
  font-size: .68rem; text-transform: uppercase; letter-spacing: .14em; font-weight: 500;
  color: var(--md-accent);
}
.ob-poster__go:hover { gap: .7rem; }

/* circular submit disc — bilkul alag CTA shape */
.ob-disc {
  position: relative;
  display: inline-flex; align-items: center; gap: .9rem;
  margin-top: 2rem;
  padding: 0;
  color: #fff;
}
.ob-disc__ring {
  width: 88px; height: 88px; flex-shrink: 0;
  border-radius: 50%;
  border: 1.5px solid rgba(232,163,23,.55);
  position: absolute; left: -14px; top: 50%;
  transform: translateY(-50%);
  transition: .28s cubic-bezier(.4,0,.2,1);
}
.ob-disc__txt {
  position: relative; z-index: 1;
  padding-left: 8px;
  font-family: var(--md-f-display);
  font-size: 1.05rem; font-weight: 600; line-height: 1.15;
  letter-spacing: -.02em;
}
.ob-disc__arrow {
  position: relative; z-index: 1;
  display: flex; align-items: center; justify-content: center;
  width: 40px; height: 40px;
  border-radius: 50%;
  background: var(--md-accent); color: var(--md-brand);
  transition: .28s cubic-bezier(.4,0,.2,1);
}
.ob-disc:hover { color: #fff; }
.ob-disc:hover .ob-disc__ring { border-color: var(--md-accent); transform: translateY(-50%) scale(1.08); }
.ob-disc:hover .ob-disc__arrow { transform: translateX(6px); background: #fff; }

/* cover as tilted object with hard shadow */
.ob-poster__right { display: flex; justify-content: center; }
.ob-object { position: relative; width: 100%; max-width: 280px; }
.ob-object__img {
  display: block; width: 100%;
  aspect-ratio: 3/4; object-fit: cover;
  background: #fff;
  border-radius: var(--md-r);
  transform: rotate(-3.5deg);
  box-shadow: 16px 16px 0 var(--md-accent), 0 26px 60px rgba(0,0,0,.42);
  transition: transform .4s cubic-bezier(.4,0,.2,1), box-shadow .4s;
}
.ob-object:hover .ob-object__img { transform: rotate(0deg) translateY(-6px); box-shadow: 20px 20px 0 var(--md-accent), 0 34px 70px rgba(0,0,0,.5); }
.ob-object__img--blank {
  display: flex; align-items: center; justify-content: center;
  background: rgba(255,255,255,.07);
  color: var(--md-accent);
  font-family: var(--md-f-display); font-size: 3rem; font-weight: 700;
}
.ob-object__tag {
  position: absolute; left: -20px; bottom: 26px;
  background: var(--md-ink);
  border-left: 3px solid var(--md-accent);
  padding: .55rem .9rem;
  border-radius: var(--md-r);
  box-shadow: 5px 5px 0 rgba(0,0,0,.3);
}
.ob-object__tag-l {
  display: block;
  font-family: var(--md-f-mono);
  font-size: .56rem; text-transform: uppercase; letter-spacing: .2em;
  color: var(--md-accent);
}
.ob-object__tag-v {
  display: block;
  font-family: var(--md-f-display);
  font-size: .88rem; font-weight: 600; color: #fff; margin-top: .15rem;
}
@media (max-width: 900px) { .ob-object { max-width: 210px; } .ob-object__tag { left: -12px; } }


/* ── BAND 2: MARQUEE ─────────────────────────────────────────────────── */
.ob-marquee {
  background: var(--md-ink);
  border-bottom: 1px solid rgba(255,255,255,.08);
  overflow: hidden;
  padding: .9rem 0;
  user-select: none;
}
.ob-marquee__track {
  display: flex; align-items: center; gap: 2.5rem;
  white-space: nowrap;
  width: max-content;
  animation: ob-slide 42s linear infinite;
}
.ob-marquee__item {
  display: inline-flex; align-items: center; gap: 2.5rem;
  font-family: var(--md-f-display);
  font-size: 1.5rem; font-weight: 700;
  letter-spacing: -.02em;
  text-transform: uppercase;
  color: transparent;
  -webkit-text-stroke: 1px rgba(255,255,255,.28);
}
.ob-marquee__star { color: var(--md-accent); -webkit-text-stroke: 0; font-size: .8rem; }
@keyframes ob-slide { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) { .ob-marquee__track { animation: none; } }
/* text-stroke na chale to fallback */
@supports not (-webkit-text-stroke: 1px red) {
  .ob-marquee__item { color: rgba(255,255,255,.28); }
}


/* ── BAND 3: DIALS ───────────────────────────────────────────────────── */
.ob-dials { background: var(--md-ink); color: #fff; padding: 2.25rem 0; }
.ob-dials__row {
  display: flex; flex-wrap: wrap;
  list-style: none; margin: 0; padding: 0;
}
.ob-dial {
  flex: 1 1 150px;
  padding: .5rem 1.5rem;
  border-left: 1px solid rgba(255,255,255,.12);
  position: relative;
}
.ob-dial:first-child { border-left: 0; padding-left: 0; }
.ob-dial__v {
  display: block;
  font-family: var(--md-f-display);
  font-size: clamp(1.9rem, 3.6vw, 2.9rem);
  font-weight: 700; line-height: 1;
  letter-spacing: -.04em;
  color: transparent;
  -webkit-text-stroke: 1.4px var(--md-accent);
  transition: color .3s;
}
.ob-dial:hover .ob-dial__v { color: var(--md-accent); }
.ob-dial__l {
  display: block; margin-top: .55rem;
  font-family: var(--md-f-mono);
  font-size: .62rem; text-transform: uppercase; letter-spacing: .18em;
  color: rgba(255,255,255,.48);
}
@supports not (-webkit-text-stroke: 1px red) {
  .ob-dial__v { color: var(--md-accent); }
}
@media (max-width: 640px) {
  .ob-dial { flex: 1 1 45%; padding: .75rem 1rem; border-left: 0; border-bottom: 1px solid rgba(255,255,255,.1); }
  .ob-dial:first-child { padding-left: 1rem; }
}


/* ── BAND 4: SHELF (overlapping slabs) ───────────────────────────────── */
.ob-shelf { background: var(--md-surface); padding: 3.5rem 0; }
.ob-stack { display: flex; flex-direction: column; }
.ob-slab {
  position: relative;
  display: grid;
  grid-template-columns: 92px minmax(0,1fr) 48px;
  gap: 1.5rem;
  align-items: center;
  background: var(--md-surface);
  border: 1px solid var(--md-line);
  border-radius: var(--md-r);
  padding: 1.6rem 1.75rem;
  margin-top: calc(var(--i) * -0.5rem);
  margin-left: calc(var(--i) * 1.5rem);
  z-index: calc(10 - var(--i));
  transition: .28s cubic-bezier(.4,0,.2,1);
}
.ob-slab:first-child { margin-top: 0; }
.ob-slab:hover {
  border-color: var(--md-ink);
  box-shadow: -8px 8px 0 var(--md-accent);
  transform: translateX(-8px);
  z-index: 20;
}
.ob-slab__num {
  font-family: var(--md-f-display);
  font-size: 3.2rem; font-weight: 700; line-height: .85;
  letter-spacing: -.06em;
  color: transparent;
  -webkit-text-stroke: 1.5px var(--md-line-2);
  transition: .28s;
}
.ob-slab:hover .ob-slab__num { -webkit-text-stroke-color: var(--md-accent); color: rgba(232,163,23,.1); }
.ob-slab__sec {
  font-family: var(--md-f-mono);
  font-size: .6rem; text-transform: uppercase; letter-spacing: .18em;
  color: var(--md-accent-2); margin-bottom: .4rem;
}
.ob-slab__title {
  display: block;
  font-family: var(--md-f-display);
  font-size: clamp(1.05rem, 1.9vw, 1.35rem);
  font-weight: 600; line-height: 1.26; letter-spacing: -.024em;
  color: var(--md-ink); margin-bottom: .4rem;
}
.ob-slab__title:hover { color: var(--md-brand-3); }
.ob-slab__au { font-size: .84rem; color: var(--md-mid); margin-bottom: .4rem; }
.ob-slab__meta { display: flex; flex-wrap: wrap; gap: 1rem; font-family: var(--md-f-mono); font-size: .68rem; color: var(--md-muted); }
.ob-slab__go {
  display: flex; align-items: center; justify-content: center;
  width: 44px; height: 44px;
  border-radius: 50%;
  border: 1px solid var(--md-line-2);
  color: var(--md-muted);
  transition: .28s;
}
.ob-slab:hover .ob-slab__go { background: var(--md-ink); border-color: var(--md-ink); color: #fff; transform: translateX(4px); }
@supports not (-webkit-text-stroke: 1px red) { .ob-slab__num { color: var(--md-line-2); } }
@media (max-width: 760px) {
  .ob-slab { grid-template-columns: 54px minmax(0,1fr); gap: 1rem; padding: 1.15rem 1.15rem; margin-left: 0; margin-top: -1px; }
  .ob-slab__num { font-size: 1.9rem; }
  .ob-slab__go { display: none; }
  .ob-slab:hover { transform: none; box-shadow: none; }
}


/* ── BAND 5: THE INDEX (ghost numerals) ──────────────────────────────── */
.ob-index { background: var(--md-canvas); padding: 3.5rem 0; }
.ob-chips { display: flex; flex-wrap: wrap; gap: .4rem; margin-bottom: 2rem; }
.ob-chip {
  display: inline-flex; align-items: center; gap: .45rem;
  padding: .38rem .85rem;
  background: transparent;
  border: 1px solid var(--md-line-2);
  border-radius: 100px;
  font-family: var(--md-f-mono);
  font-size: .68rem; text-transform: uppercase; letter-spacing: .1em;
  color: var(--md-mid);
  cursor: pointer; transition: .18s;
}
.ob-chip:hover { border-color: var(--md-ink); color: var(--md-ink); }
.ob-chip.is-on { background: var(--md-ink); border-color: var(--md-ink); color: #fff; }
.ob-chip em { font-style: normal; font-size: .62rem; opacity: .55; }

.ob-rows { list-style: none; margin: 0; padding: 0; }
.ob-row {
  position: relative;
  display: grid;
  grid-template-columns: 110px minmax(0,1fr);
  gap: 1.5rem;
  padding: 1.9rem 0;
  border-bottom: 1px solid var(--md-line);
  transition: .25s;
}
.ob-row::before {
  content: '';
  position: absolute; left: -24px; top: 0; bottom: 0;
  width: 3px; background: var(--md-accent);
  transform: scaleY(0); transform-origin: top;
  transition: transform .3s cubic-bezier(.4,0,.2,1);
}
.ob-row:hover::before { transform: scaleY(1); }
.ob-row__ghost {
  font-family: var(--md-f-display);
  font-size: clamp(2.6rem, 5vw, 4rem);
  font-weight: 700; line-height: .8;
  letter-spacing: -.07em;
  color: transparent;
  -webkit-text-stroke: 1.5px var(--md-line-2);
  transition: .3s;
  user-select: none;
}
.ob-row:hover .ob-row__ghost { -webkit-text-stroke-color: var(--md-accent); color: rgba(232,163,23,.12); }
@supports not (-webkit-text-stroke: 1px red) { .ob-row__ghost { color: var(--md-line-2); } }

.ob-row__top { display: flex; align-items: center; gap: .7rem; margin-bottom: .5rem; }
.ob-row__sec {
  font-family: var(--md-f-mono);
  font-size: .6rem; text-transform: uppercase; letter-spacing: .18em;
  color: var(--md-accent-2);
}
.ob-row__yr { font-family: var(--md-f-mono); font-size: .6rem; color: var(--md-faint); }
.ob-row__title {
  display: block;
  font-family: var(--md-f-display);
  font-size: clamp(1.1rem, 2.1vw, 1.5rem);
  font-weight: 600; line-height: 1.24; letter-spacing: -.028em;
  color: var(--md-ink);
  margin-bottom: .45rem;
  max-width: 44ch;
}
.ob-row__title:hover { color: var(--md-brand-3); }
.ob-row__au { font-size: .85rem; color: var(--md-mid); margin-bottom: .4rem; }
.ob-row__doi {
  display: inline-block;
  font-family: var(--md-f-mono); font-size: .68rem;
  color: var(--md-brand-3); word-break: break-all; margin-bottom: .7rem;
}
.ob-row__doi:hover { text-decoration: underline; }
.ob-row__foot { display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; }
.ob-row__views { font-family: var(--md-f-mono); font-size: .68rem; color: var(--md-muted); }
@media (max-width: 640px) {
  .ob-row { grid-template-columns: 58px minmax(0,1fr); gap: .9rem; padding: 1.35rem 0; }
  .ob-row::before { left: -18px; }
}


/* ── BAND 6: BOARDS ──────────────────────────────────────────────────── */
.ob-boards { background: var(--md-wash); padding: 3rem 0; }
.ob-boards__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 3.5rem; }
.ob-boards__grid.is-single { grid-template-columns: 1fr; }
.ob-boards__grid.is-single .ob-board__list { columns: 2; column-gap: 3.5rem; }
.ob-boards__grid.is-single .ob-board__row { break-inside: avoid; }
@media (max-width: 860px) {
  .ob-boards__grid, .ob-boards__grid.is-single .ob-board__list { grid-template-columns: 1fr; columns: 1; }
  .ob-boards__grid { gap: 2.25rem; }
}
.ob-board__hd {
  font-family: var(--md-f-mono);
  font-size: .68rem; text-transform: uppercase; letter-spacing: .22em;
  color: var(--md-ink);
  padding-bottom: .6rem; margin-bottom: .5rem;
  border-bottom: 2px solid var(--md-ink);
}
.ob-board__list { list-style: none; margin: 0; padding: 0; }
.ob-board__row { display: flex; gap: 1rem; padding: .95rem 0; border-bottom: 1px solid var(--md-line); }
.ob-board__row:last-child { border-bottom: 0; }
.ob-board__n {
  flex-shrink: 0; width: 30px;
  font-family: var(--md-f-display);
  font-size: 1.6rem; font-weight: 700; line-height: .9;
  color: transparent;
  -webkit-text-stroke: 1.2px var(--md-line-2);
  transition: .25s;
}
.ob-board__row:hover .ob-board__n { -webkit-text-stroke-color: var(--md-accent); }
@supports not (-webkit-text-stroke: 1px red) { .ob-board__n { color: var(--md-line-2); } }
.ob-board__title { display: block; font-size: .92rem; font-weight: 500; line-height: 1.4; color: var(--md-ink); }
.ob-board__title:hover { color: var(--md-brand-3); }
.ob-board__meta { font-family: var(--md-f-mono); font-size: .68rem; color: var(--md-muted); margin-top: .3rem; }


/* ── BAND 7: DESK ────────────────────────────────────────────────────── */
.ob-desk { background: var(--md-canvas); padding: 3rem 0 3.5rem; }
.ob-desk__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(270px, 1fr)); gap: 1.5rem; align-items: stretch; }
@media (min-width: 1100px) { .ob-desk__grid { grid-template-columns: repeat(3, 1fr); } }
.ob-card {
  background: var(--md-surface);
  border: 1px solid var(--md-line);
  border-radius: var(--md-r);
  padding: 1.4rem 1.5rem 1.5rem;
  display: flex; flex-direction: column; height: 100%;
  transition: .22s;
}
.ob-card:hover { border-color: var(--md-ink); box-shadow: 6px 6px 0 var(--md-accent); transform: translate(-3px,-3px); }
.ob-card__hd {
  font-family: var(--md-f-mono);
  font-size: .64rem; text-transform: uppercase; letter-spacing: .2em;
  color: var(--md-brand);
  padding-bottom: .65rem; margin-bottom: 1rem;
  border-bottom: 2px solid var(--md-ink);
}
.ob-card__foot {
  display: inline-flex; align-items: center; gap: .45rem;
  margin-top: auto; padding-top: 1rem;
  font-family: var(--md-f-mono);
  font-size: .66rem; text-transform: uppercase; letter-spacing: .12em;
  color: var(--md-brand-3);
}
.ob-card__foot:hover { color: var(--md-accent-2); gap: .7rem; }
.ob-card__html { font-size: .84rem; line-height: 1.65; color: var(--md-mid); }
.ob-card__html a { color: var(--md-brand-3); }

.ob-record { width: 100%; border-collapse: collapse; font-size: .8rem; }
.ob-record th {
  text-align: left; font-weight: 400;
  font-family: var(--md-f-mono);
  font-size: .6rem; text-transform: uppercase; letter-spacing: .12em;
  color: var(--md-muted);
  padding: .5rem 0; width: 46%;
  border-bottom: 1px solid var(--md-line);
  vertical-align: top;
}
.ob-record td {
  padding: .5rem 0;
  border-bottom: 1px solid var(--md-line);
  font-family: var(--md-f-mono); font-size: .76rem;
  color: var(--md-ink); word-break: break-word;
}
.ob-record td a { color: var(--md-brand-3); }
.ob-record tr:last-child th, .ob-record tr:last-child td { border-bottom: 0; }

.ob-editor { display: flex; gap: .9rem; align-items: flex-start; }
.ob-editor__mono {
  width: 48px; height: 48px; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  background: var(--md-brand); color: var(--md-accent);
  border-radius: var(--md-r);
  font-family: var(--md-f-mono); font-size: .85rem; font-weight: 700;
}
.ob-editor__role { font-family: var(--md-f-mono); font-size: .58rem; text-transform: uppercase; letter-spacing: .16em; color: var(--md-accent-2); }
.ob-editor__name { font-family: var(--md-f-display); font-size: 1.02rem; font-weight: 600; color: var(--md-ink); margin-top: .2rem; }
.ob-editor__aff { font-size: .79rem; color: var(--md-muted); line-height: 1.55; margin-top: .25rem; }

.ob-idx { list-style: none; margin: 0; padding: 0; }
.ob-idx__item {
  display: flex; align-items: center; gap: .65rem;
  padding: .5rem 0;
  border-bottom: 1px solid var(--md-line);
  font-size: .82rem; color: var(--md-mid);
}
.ob-idx__item:last-child { border-bottom: 0; }
.ob-idx__tag {
  width: 26px; height: 26px; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  background: var(--md-wash); color: var(--md-brand);
  border-radius: var(--md-r);
  font-family: var(--md-f-mono); font-size: .58rem; font-weight: 700;
}


/* ── BAND 8: CLOSING ─────────────────────────────────────────────────── */
.ob-close {
  position: relative;
  background: var(--md-ink);
  background-image: linear-gradient(145deg, #1B1735 0%, var(--md-ink) 60%);
  color: #fff;
  padding: 4rem 0;
  overflow: hidden;
  border-top: 3px solid var(--md-accent);
}
.ob-close__arc {
  position: absolute;
  bottom: -42%; left: -12%;
  width: 52vw; height: 52vw;
  max-width: 760px; max-height: 760px;
  border-radius: 50%;
  border: 1.5px solid rgba(232,163,23,.22);
  pointer-events: none;
}
.ob-close__grid { display: grid; grid-template-columns: 1.2fr 1fr; gap: 4rem; align-items: center; }
@media (max-width: 900px) { .ob-close__grid { grid-template-columns: 1fr; gap: 2.5rem; } }
.ob-close__kick {
  display: block;
  font-family: var(--md-f-mono);
  font-size: .64rem; text-transform: uppercase; letter-spacing: .24em;
  color: var(--md-accent);
  margin-bottom: .9rem;
}
.ob-close__h {
  font-family: var(--md-f-display);
  font-size: clamp(2rem, 5vw, 3.6rem);
  font-weight: 600; letter-spacing: -.05em; line-height: .96;
  color: #fff; margin: 0 0 1.1rem;
}
.ob-close__p { font-size: .95rem; line-height: 1.8; color: rgba(255,255,255,.6); max-width: 48ch; margin: 0 0 2rem; }
.ob-close__btns { display: flex; gap: .7rem; flex-wrap: wrap; }
.ob-close__left, .ob-close__right { min-width: 0; }

.ob-steps { list-style: none; margin: 0; padding: 0; }
.ob-steps li {
  display: flex; align-items: center; gap: 1.1rem;
  padding: 1rem 0;
  border-bottom: 1px solid rgba(255,255,255,.13);
  font-size: .9rem; color: rgba(255,255,255,.72);
}
.ob-steps li:last-child { border-bottom: 0; }
.ob-steps__n {
  flex-shrink: 0;
  font-family: var(--md-f-display);
  font-size: 1.5rem; font-weight: 700; line-height: 1;
  color: transparent;
  -webkit-text-stroke: 1.2px var(--md-accent);
}
@supports not (-webkit-text-stroke: 1px red) { .ob-steps__n { color: var(--md-accent); } }


/* structural containers — grid/flex children ke overflow guards */
.ob-board, .ob-board__body, .ob-head__l,
.ob-poster__left, .ob-row__body, .ob-slab__body { min-width: 0; }

/* MERIDIAN — end of Part II */