/* ============================================================
   TELL — Genesis, excavated
   Design tokens
   ============================================================ */
:root{
  --limestone: #ECE6D6;
  --limestone-deep: #E1D8C2;
  --paper-card: #F7F3E7;
  --ink: #2B2419;
  --ink-soft: #5C5240;
  --ink-faint: #8A7E68;
  --line: #C9BC9E;
  --line-soft: #DCD3BC;

  --patina: #3E6657;
  --patina-deep: #2E4D42;
  --patina-bg: #E3EAE2;

  --ochre: #A6752B;
  --ochre-deep: #7E5A20;
  --ochre-bg: #F1E6CE;

  --terracotta: #A6432A;
  --terracotta-deep: #7C3220;
  --terracotta-bg: #F0DDD3;

  --shadow: 0 12px 30px -12px rgba(43,36,25,.35);
  --shadow-soft: 0 4px 14px -6px rgba(43,36,25,.25);

  --terr-canaan: #8A9667;
  --terr-egypt: #D9B96C;
  --terr-mesopotamia: #8FA6A9;
  --map-river: #6E8C8A;
  --map-bg-center: #F7F3E7;
  --map-bg-edge: #E1D8C2;

  --word-ink: #6E6A9C;
  --word-ink-deep: #4F4B79;
  --word-bg: #EAE8F2;

  --link: #1F6E8C;
  --link-deep: #154E64;

  --display: "Fraunces", serif;
  --body: "Spectral", serif;
  --mono: "IBM Plex Mono", monospace;
}

@media (prefers-color-scheme: dark){ /* intentionally not inverted — this site reads as physical paper regardless of OS theme */ }

*{ box-sizing: border-box; }
html{ scroll-behavior: smooth; }
body{
  margin:0;
  background: var(--limestone);
  color: var(--ink);
  font-family: var(--body);
  font-size: 18px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}
img{ max-width:100%; display:block; }
a{ color: inherit; }

/* Generic content links — anything not part of the entry/word-mark/cross-link systems */
.prose a, .callout p a, .term-card p a, .map-caption a, .summary a, .grid-key a, .chapter-summary a{
  color: var(--link);
  text-decoration: underline;
  text-decoration-color: currentColor;
  text-underline-offset: 2px;
  font-weight: 600;
}
.prose a:hover, .callout p a:hover, .term-card p a:hover, .map-caption a:hover, .summary a:hover, .grid-key a:hover{
  color: var(--link-deep);
}
.visually-hidden{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;
}
:focus-visible{
  outline: 3px solid var(--terracotta);
  outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce){
  *{ animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; scroll-behavior:auto !important; }
}

/* ============================================================
   Header / footer
   ============================================================ */
.site-header{
  display:flex; align-items:center; justify-content:space-between;
  padding: 22px clamp(20px,5vw,56px);
  border-bottom: 1px solid var(--line);
}
.site-brand{
  font-family: var(--display);
  font-weight: 600;
  font-size: 1.6rem;
  letter-spacing: .03em;
  text-decoration:none;
  color: var(--ink);
  display:flex; align-items:baseline; gap:10px;
}
.site-brand .mark{
  font-family: var(--mono);
  font-size: .55rem;
  letter-spacing: .12em;
  color: var(--patina);
  border:1px solid var(--patina);
  padding: 2px 6px;
  border-radius: 2px;
  transform: translateY(-4px);
}
.site-brand .tagline{
  font-family: var(--mono);
  font-size: .62rem;
  font-weight: 400;
  letter-spacing: .04em;
  color: var(--ink-faint);
  margin-left: 10px;
  text-transform: none;
  border-left: 1px solid var(--line);
  padding-left: 10px;
}
@media (max-width: 560px){ .site-brand .tagline{ display:none; } }
.site-nav{ display:flex; gap: clamp(14px,3vw,28px); font-family: var(--mono); font-size:.78rem; letter-spacing:.04em; }
.site-nav a{ text-decoration:none; color: var(--ink-soft); border-bottom: 1px solid transparent; padding-bottom:2px; }
.site-nav a:hover, .site-nav a[aria-current="page"]{ color: var(--ink); border-color: var(--terracotta); }

.site-footer{
  margin-top: 64px;
  padding: 32px clamp(20px,5vw,56px) 48px;
  border-top: 1px solid var(--line);
  font-family: var(--mono);
  font-size: .76rem;
  color: var(--ink-faint);
  display:flex; flex-wrap:wrap; gap: 10px 28px; justify-content:space-between;
}
.site-footer a{ color: var(--ink-soft); }

main{ max-width: 1080px; margin: 0 auto; padding: 0 clamp(20px,5vw,56px); }

/* ============================================================
   Homepage hero + stratigraphy signature
   ============================================================ */
.hero{
  display:grid; grid-template-columns: 1.3fr 1fr; gap: 48px;
  align-items:center;
  padding: 56px 0 40px;
  border-bottom: 1px solid var(--line);
}
@media (max-width: 760px){ .hero{ grid-template-columns: 1fr; padding-top:32px; } }

.hero h1{
  font-family: var(--display);
  font-weight: 600;
  font-size: clamp(2.6rem, 6vw, 4rem);
  line-height: .98;
  margin: 0 0 18px;
  letter-spacing: -.01em;
}
.hero h1 em{ font-style: italic; color: var(--patina); }
.hero p.lede{
  font-size: 1.18rem;
  color: var(--ink-soft);
  max-width: 46ch;
  margin: 0 0 22px;
}
.hero .tags{ display:flex; gap:8px; flex-wrap:wrap; font-family: var(--mono); font-size:.72rem; }
.hero .tags span{ border:1px solid var(--line); padding:4px 9px; border-radius:2px; color: var(--ink-soft); }

.hero-photo{ margin:0; }
.hero-photo img{ width:100%; height:auto; border-radius:4px; box-shadow: var(--shadow-soft); display:block; }
.hero-photo figcaption{
  font-family: var(--mono); font-size:.72rem; color: var(--ink-soft); margin-top:10px; line-height:1.6;
}
.hero-photo figcaption span{ color: var(--ink-faint); }

.strata{ width:100%; }

/* "What this is not" callout */
.callout{
  background: var(--paper-card);
  border:1px solid var(--line);
  border-left: 4px solid var(--terracotta);
  padding: 22px 26px;
  margin: 40px 0;
  border-radius: 2px;
}
.callout h2{
  font-family: var(--mono); font-size:.78rem; text-transform:uppercase; letter-spacing:.1em;
  color: var(--terracotta-deep); margin: 0 0 10px;
}
.callout p{ margin:0 0 10px; color: var(--ink-soft); }
.callout p:last-child{ margin-bottom:0; }

/* ============================================================
   Evidence tier legend
   ============================================================ */
.tier-legend{
  display:grid; grid-template-columns: repeat(3,1fr); gap:16px;
  margin: 36px 0 8px;
}
@media (max-width:700px){ .tier-legend{ grid-template-columns:1fr; } }
.tier-card{
  border:1px solid var(--line); background: var(--paper-card);
  padding:18px 18px 20px; border-radius:3px;
}
.tier-card .dot{ width:11px; height:11px; border-radius:50%; display:inline-block; margin-right:8px; }
.tier-card h3{ font-family: var(--mono); font-size:.82rem; letter-spacing:.03em; margin: 0 0 8px; display:flex; align-items:center; }
.tier-card p{ margin:0; font-size:.92rem; color: var(--ink-soft); }
.tier-attested .dot{ background: var(--patina); }
.tier-parallel .dot{ background: var(--ochre); }
.tier-debated .dot{ background: var(--terracotta); }
.tier-attested h3{ color: var(--patina-deep); }
.tier-parallel h3{ color: var(--ochre-deep); }
.tier-debated h3{ color: var(--terracotta-deep); }

/* ============================================================
   Chapter grid (homepage)
   ============================================================ */
.section-label{
  font-family: var(--mono); font-size:.78rem; letter-spacing:.1em; text-transform:uppercase;
  color: var(--ink-faint); margin: 56px 0 18px; display:flex; align-items:center; gap:12px;
}
.section-label::after{ content:""; flex:1; height:1px; background: var(--line); }

.chapter-grid{
  display:grid; grid-template-columns: repeat(10, 1fr); gap:8px;
  margin-bottom: 8px;
}
@media (max-width: 900px){ .chapter-grid{ grid-template-columns: repeat(8,1fr); } }
@media (max-width: 620px){ .chapter-grid{ grid-template-columns: repeat(6,1fr); } }
@media (max-width: 440px){ .chapter-grid{ grid-template-columns: repeat(5,1fr); } }

.chapter-tile{
  aspect-ratio: 1;
  display:flex; align-items:center; justify-content:center;
  font-family: var(--mono); font-size:.95rem;
  border:1px solid var(--line-soft);
  color: var(--ink-faint);
  text-decoration:none;
  border-radius: 2px;
  background: transparent;
  position:relative;
}
.chapter-tile.active{
  background: var(--paper-card);
  border-color: var(--patina);
  color: var(--ink);
  font-weight:600;
  box-shadow: var(--shadow-soft);
}
.chapter-tile.active::after{
  content:"";
  position:absolute; bottom:5px; left:50%; transform:translateX(-50%);
  width:5px; height:5px; border-radius:50%; background: var(--patina);
}
.chapter-tile.active:hover{ border-color: var(--terracotta); }
.chapter-tile:not(.active){ cursor: default; }
.grid-key{ font-family: var(--mono); font-size:.74rem; color: var(--ink-faint); margin: 14px 0 0; }

/* ============================================================
   About / Methods content pages
   ============================================================ */
.prose{ max-width: 70ch; }
.prose h1{
  font-family: var(--display); font-weight:600; font-size: clamp(2.2rem,5vw,3rem);
  margin: 40px 0 8px; letter-spacing:-.01em;
}
.prose .kicker{ font-family: var(--mono); font-size:.78rem; letter-spacing:.1em; text-transform:uppercase; color: var(--patina-deep); }
.prose h2{
  font-family: var(--display); font-weight:600; font-size: 1.5rem; margin: 48px 0 14px;
}
.prose h3{ font-family: var(--mono); font-size:.95rem; letter-spacing:.02em; margin: 28px 0 10px; color: var(--ink-soft); text-transform:uppercase; }
.prose p{ margin: 0 0 18px; }
.prose ul, .prose ol{ margin: 0 0 18px; padding-left: 1.3em; }
.prose li{ margin-bottom:8px; }
.prose strong{ color: var(--ink); }

.term-card{
  border:1px solid var(--line); background: var(--paper-card);
  padding: 18px 22px; margin: 0 0 16px; border-radius:3px;
}
.term-card h3{ font-family: var(--display); font-style:italic; font-weight:600; font-size:1.15rem; margin:0 0 8px; text-transform:none; color: var(--ink); letter-spacing:0; }
.term-card p{ margin:0; color: var(--ink-soft); font-size:.96rem; }

/* Scholarship-shift timeline */
.timeline{
  display:flex; flex-direction:column; gap:0; margin: 28px 0 8px;
  border-left: 2px solid var(--line);
  padding-left: 24px;
}
.timeline-item{ position:relative; padding-bottom: 26px; }
.timeline-item:last-child{ padding-bottom:0; }
.timeline-item::before{
  content:""; position:absolute; left:-29px; top:4px;
  width:10px; height:10px; border-radius:50%;
  background: var(--paper-card); border:2px solid var(--patina);
}
.timeline-item .year{ font-family: var(--mono); font-size:.78rem; color: var(--patina-deep); font-weight:600; }
.timeline-item p{ margin: 4px 0 0; color: var(--ink-soft); font-size:.95rem; }

/* ============================================================
   Chapter reading page
   ============================================================ */
.chapter-head{
  padding: 36px 0 22px;
  border-bottom: 1px solid var(--line);
}
.back-link{
  display:inline-flex; align-items:center; gap:7px;
  font-family: var(--mono); font-size:.76rem; color: var(--ink-soft);
  text-decoration:none; margin-bottom: 18px;
  border: 1px solid var(--line); background: var(--paper-card);
  padding: 8px 14px; border-radius: 20px;
  box-shadow: var(--shadow-soft);
  transition: border-color .15s ease, color .15s ease, transform .15s ease;
}
.back-link:hover{ color: var(--terracotta-deep); border-color: var(--terracotta); transform: translateX(-2px); }
.chapter-head .kicker{ font-family: var(--mono); font-size:.78rem; letter-spacing:.1em; text-transform:uppercase; color: var(--patina-deep); }
.chapter-head h1{ font-family: var(--display); font-weight:600; font-size: clamp(2.2rem,5vw,3.2rem); margin: 6px 0 10px; }
.chapter-head .summary{ color: var(--ink-soft); max-width: 62ch; margin: 0 0 18px; }

.chapter-nav{
  display:flex; justify-content:space-between; align-items:center; gap:12px;
  font-family: var(--mono); font-size:.78rem; flex-wrap:wrap;
}
.chapter-nav a{ text-decoration:none; color: var(--ink-soft); }
.chapter-nav a:hover{ color: var(--terracotta); }
.chapter-nav .nav-spacer{ color: var(--ink-faint); }

/* Dead Sea Scrolls & Quran cross-tradition callouts */
.cross-callouts{ display:grid; grid-template-columns: 1fr 1fr; gap: 18px; margin: 26px 0 4px; }
@media (max-width: 760px){ .cross-callouts{ grid-template-columns: 1fr; } }
.cross-box{
  border: 1px solid var(--line); border-radius: 4px; background: var(--paper-card);
  border-left-width: 4px; border-left-style: solid;
}
.cross-box.dss{ border-left-color: var(--word-ink); }
.cross-box.quran{ border-left-color: var(--ochre); }
.cross-box summary{
  font-family: var(--mono); font-size:.7rem; text-transform:uppercase; letter-spacing:.08em;
  padding: 14px 18px; cursor: pointer; list-style:none; display:flex; align-items:center;
  justify-content:space-between; gap:8px;
}
.cross-box summary::-webkit-details-marker{ display:none; }
.cross-box summary::after{
  content:"+ show"; font-size:.65rem; letter-spacing:.04em; color: var(--ink-faint);
  font-weight:400; text-transform:none; flex-shrink:0;
}
.cross-box[open] summary::after{ content:"\2212 hide"; }
.cross-box.dss summary{ color: var(--word-ink-deep); }
.cross-box.quran summary{ color: var(--ochre-deep); }
.cross-box summary:hover{ background: var(--limestone-deep); }
.cross-box[open] summary{ border-bottom: 1px solid var(--line); }
.cross-box p{ font-size:.9rem; color: var(--ink-soft); margin: 14px 18px 10px; line-height:1.6; }
.cross-box .cross-links{ display:flex; flex-wrap:wrap; gap: 10px 16px; margin:0; padding: 0 18px 16px; list-style:none; }
.cross-box .cross-links a{ font-family: var(--mono); font-size:.74rem; font-weight:600; text-decoration: underline; text-decoration-color: currentColor; text-underline-offset:3px; }
.cross-box.dss .cross-links a{ color: var(--word-ink-deep); }
.cross-box.quran .cross-links a{ color: var(--ochre-deep); }
.cross-box .cross-links a:hover{ opacity:.7; }
.cross-box .none-found{ font-style: italic; color: var(--ink-faint); }

/* translation toggle */
.translation-toggle{
  display:inline-flex; border:1px solid var(--line); border-radius: 20px; overflow:hidden;
  font-family: var(--mono); font-size:.74rem;
}
.translation-toggle button{
  background:none; border:none; padding: 7px 16px; cursor:pointer; color: var(--ink-soft);
  font-family: var(--mono); font-size:.74rem; letter-spacing:.03em;
}
.translation-toggle button[aria-pressed="true"]{ background: var(--patina); color: #fff; }
.translation-note{ font-family: var(--mono); font-size:.7rem; color: var(--ink-faint); margin-top:8px; }

/* Layout: text column + map rail */
.chapter-body{
  display:grid; grid-template-columns: 1fr 340px; gap: 44px;
  padding: 30px 0 60px; align-items:start;
}
@media (max-width: 980px){ .chapter-body{ grid-template-columns: 1fr; } }

.map-rail{ position: sticky; top: 24px; }
@media (max-width: 980px){ .map-rail{ position: static; margin-bottom: 28px; } }
.map-rail .map-frame{
  border:1px solid var(--line); border-radius:6px; overflow:hidden;
  position:relative; background: var(--paper-card);
}

/* MapLibre main map container */
.chapter-map{
  width:100%; height:380px;
}
@media (max-width: 980px){ .chapter-map{ height:300px; } }
@media (max-width: 520px){ .chapter-map{ height:240px; } }

/* MapLibre locator inset — bottom-right corner of map-frame */
.chapter-locator{
  position:absolute; bottom:28px; right:8px; z-index:5;
  width:130px; height:90px;
  border:1px solid var(--line); border-radius:4px; overflow:hidden;
  box-shadow: var(--shadow-soft);
}
.chapter-locator::before{
  content:"Today"; position:absolute; top:4px; left:6px; z-index:6;
  font-family:var(--mono); font-size:8px; font-weight:700; letter-spacing:.06em;
  color:#2B2419; background:rgba(247,243,231,.85); padding:1px 5px; border-radius:2px;
  pointer-events:none;
}

/* MapLibre custom site pins */
.map-site-pin{
  width:20px; height:20px; border-radius:50%;
  background:var(--pin-color, var(--ink-faint));
  border:2.5px solid #F7F3E7;
  box-shadow:0 2px 8px rgba(0,0,0,.4);
  cursor:pointer; position:relative;
  transition:transform .15s ease, box-shadow .15s ease;
  padding:0; outline:none;
}
.map-site-pin:hover{ transform:scale(1.25); box-shadow:0 3px 12px rgba(0,0,0,.5); }
.map-site-pin:focus-visible{ outline:2px solid var(--terracotta); outline-offset:2px; }
.map-site-pin--dim{ opacity:0.35; }
.map-site-pin--dim:hover{ opacity:0.7; }

/* Pin label (shown above pin) */
.map-pin-label{
  position:absolute; bottom:26px; left:50%; transform:translateX(-50%);
  background:#F7F3E7; border:1px solid #C9BC9E; border-radius:3px;
  padding:2px 6px; font-size:10px; font-family:'IBM Plex Mono',monospace;
  white-space:nowrap; color:#2B2419; font-weight:600;
  box-shadow:0 1px 4px rgba(0,0,0,.2); pointer-events:none;
}

/* Override MapLibre default styles to match TELL design */
.maplibregl-ctrl-group{ box-shadow:var(--shadow-soft) !important; border-radius:4px !important; }
.maplibregl-ctrl-group button{ font-family:var(--mono) !important; }
.maplibregl-ctrl-attrib{ font-size:9px !important; background:rgba(247,243,231,.75) !important; }

.map-caption{ font-family: var(--mono); font-size:.68rem; color: var(--ink-faint); margin-top:10px; line-height:1.5; padding:0 4px; }



.verses{ font-family: var(--body); font-size: 1.12rem; }
.verse{ margin: 0 0 1.05em; }
.vnum{
  font-family: var(--mono); font-size:.68rem; color: var(--ink-faint);
  vertical-align: super; margin-right: 5px;
}
.verses h2.subhead{
  font-family: var(--mono); font-size:.78rem; text-transform:uppercase; letter-spacing:.08em;
  color: var(--ink-faint); margin: 30px 0 14px; font-weight:500;
}
.verses h2.subhead:first-child{ margin-top:0; }

/* marked entries inline in text */
.entry{
  cursor:pointer;
  border-bottom: 2px dotted currentColor;
  padding-bottom: 1px;
  position:relative;
  text-decoration:none;
  color: inherit;
}
.entry[data-tier="attested"]{ color: var(--patina-deep); }
.entry[data-tier="parallel"]{ color: var(--ochre-deep); }
.entry[data-tier="debated"]{ color: var(--terracotta-deep); }
.entry:hover{ background: var(--limestone-deep); }

.word-mark{
  cursor:pointer;
  border-bottom: 2px dotted var(--word-ink);
  padding-bottom: 1px;
  text-decoration:none;
  color: var(--word-ink-deep);
  font-style: italic;
}
.word-mark:hover{ background: var(--word-bg); }
.word-mark-sample{ border-bottom: 2px dotted var(--word-ink); color: var(--word-ink-deep); font-style: italic; padding-bottom:1px; }

body.words-off .word-mark{
  border-bottom: none; color: inherit; font-style: normal;
  cursor: text; pointer-events: none;
}

.word-toggle{
  font-family: var(--mono); font-size:.74rem; font-weight:500;
  border: 1px solid var(--word-ink); background: var(--word-bg); color: var(--word-ink-deep);
  border-radius: 20px; padding: 7px 14px; cursor: pointer;
}
.word-toggle[aria-pressed="false"]{
  background: transparent; color: var(--ink-faint); border-color: var(--line);
}
.word-toggle:hover{ opacity: .85; }

.fc-tab.word{ background: var(--word-ink); }
.fc-hebrew{
  font-size: 1.9rem; font-family: "Spectral", serif; direction: rtl;
  color: var(--ink); margin: 0 0 4px; line-height:1.3;
}
.fc-translit{
  font-family: var(--mono); font-size:.82rem; color: var(--word-ink-deep);
  margin: 0 0 18px; padding-bottom:16px; border-bottom: 1px solid var(--line);
}
.fc-greek-note{
  font-family: var(--mono); font-size: .8rem; color: var(--ink-soft);
  background: var(--word-bg); border-radius:4px; padding: 10px 14px; margin: 0 0 20px;
}
.fc-greek-note .greek{ font-style:normal; font-size:1rem; color: var(--word-ink-deep); }

/* two-speed: lightweight hover tooltip */
.entry-tooltip{
  position: fixed;
  background: var(--ink);
  color: var(--limestone);
  font-family: var(--mono);
  font-size: .72rem;
  padding: 7px 11px;
  border-radius: 3px;
  pointer-events:none;
  z-index: 60;
  max-width: 240px;
  box-shadow: var(--shadow-soft);
  opacity:0; transform: translateY(4px);
  transition: opacity .12s ease, transform .12s ease;
}
.entry-tooltip.show{ opacity:1; transform:translateY(0); }
.entry-tooltip .tt-tier{ text-transform:uppercase; letter-spacing:.06em; font-size:.62rem; opacity:.7; display:block; margin-bottom:2px;}

/* ============================================================
   Field card panel
   ============================================================ */
.card-overlay{
  position: fixed; inset:0; background: rgba(43,36,25,.28);
  opacity:0; pointer-events:none; transition: opacity .2s ease;
  z-index: 70;
}
.card-overlay.open{ opacity:1; pointer-events:auto; }

.field-card{
  position: fixed; top:0; right:0; height:100%;
  width: min(440px, 100%);
  background: var(--paper-card);
  border-left: 1px solid var(--line);
  box-shadow: var(--shadow);
  transform: translateX(100%);
  transition: transform .28s cubic-bezier(.2,.8,.2,1);
  z-index: 80;
  overflow-y: auto;
}
.field-card.open{ transform: translateX(0); }
@media (max-width: 620px){
  .field-card{
    top: auto; bottom:0; left:0; right:0; width:auto; height: min(82vh, 640px);
    border-left:none; border-top: 1px solid var(--line);
    border-radius: 10px 10px 0 0;
    transform: translateY(100%);
  }
  .field-card.open{ transform: translateY(0); }
}

.fc-tab{
  font-family: var(--mono); font-size:.68rem; letter-spacing:.1em; text-transform:uppercase;
  display:inline-block; padding: 5px 12px; border-radius: 0 0 4px 0;
  color:#fff;
}
.fc-tab.attested{ background: var(--patina); }
.fc-tab.parallel{ background: var(--ochre); }
.fc-tab.debated{ background: var(--terracotta); }

.fc-close{
  position:absolute; top:14px; right:16px;
  background:none; border:1px solid var(--line); width:30px; height:30px; border-radius:50%;
  font-family: var(--mono); font-size:1rem; cursor:pointer; color: var(--ink-soft);
  display:flex; align-items:center; justify-content:center;
}
.fc-close:hover{ border-color: var(--terracotta); color: var(--terracotta); }

.fc-body{
  padding: 50px 28px 40px;
}
.fc-body > *:first-child{ margin-top:0; }
.fc-title{ font-family: var(--display); font-weight:600; font-size:1.7rem; margin: 0 0 4px; line-height:1.1; }
.fc-meta{ font-family: var(--mono); font-size:.74rem; color: var(--ink-soft); line-height:1.7; margin: 0 0 18px; padding-bottom:16px; border-bottom: 1px solid var(--line); }
.fc-meta .row{ display:flex; gap:8px; }
.fc-meta .k{ color: var(--ink-faint); min-width: 78px; flex-shrink:0; }
.fc-status{ display:inline-block; margin-top:6px; font-size:.7rem; padding: 2px 8px; border:1px solid var(--line); border-radius:10px; color: var(--ink-soft); }

.fc-summary{ font-family: var(--body); font-size: 1.02rem; color: var(--ink); margin: 0 0 22px; }
.fc-summary p{ margin: 0 0 14px; }
.fc-summary p:last-child{ margin-bottom:0; }

.fc-case{
  display:grid; grid-template-columns: 1fr 1fr; gap: 14px; margin: 0 0 22px;
}
@media (max-width: 480px){ .fc-case{ grid-template-columns:1fr; } }
.fc-case .case{ border:1px solid var(--line); border-radius:3px; padding:14px 16px; background: rgba(255,255,255,.4); }
.fc-case .case h4{ margin:0 0 8px; font-family: var(--mono); font-size:.68rem; text-transform:uppercase; letter-spacing:.06em; }
.fc-case .for h4{ color: var(--patina-deep); }
.fc-case .against h4{ color: var(--terracotta-deep); }
.fc-case .case p{ margin:0; font-size:.88rem; color: var(--ink-soft); }

.fc-image{ margin: -50px -28px 22px; display:none; }
.fc-image img{ width:100%; height:200px; object-fit:cover; display:block; }
.fc-image .fc-credit{
  display:block; font-family: var(--mono); font-size:.65rem; color: var(--ink-faint);
  padding: 6px 28px 0; line-height:1.4;
}
.fc-sources{ margin: 0; padding: 0; list-style:none; }
.fc-sources h4.watch-head{ margin-top:18px; }
.fc-sources li a[href*="youtube"]{ color: var(--terracotta-deep); }
.fc-sources h4{ font-family: var(--mono); font-size:.68rem; text-transform:uppercase; letter-spacing:.08em; color: var(--ink-faint); margin: 0 0 10px; }
.fc-sources li{ margin-bottom: 9px; font-size: .88rem; }
.fc-sources a{ color: var(--link); font-weight:600; text-decoration: underline; text-decoration-color: currentColor; text-underline-offset:3px; }
.fc-sources a:hover{ color: var(--link-deep); }

/* ============================================================
   Notes (floating, localStorage)
   ============================================================ */
.notes-toggle{
  position: fixed; bottom: 22px; right: 22px; z-index: 60;
  width: 48px; height: 48px; border-radius: 50%;
  background: var(--ink); color: var(--limestone);
  border: none; cursor: pointer; font-size: 1.25rem;
  display:flex; align-items:center; justify-content:center;
  box-shadow: var(--shadow);
}
.notes-toggle.has-notes::after{
  content:""; position:absolute; top:2px; right:2px;
  width:10px; height:10px; border-radius:50%; background: var(--terracotta);
  border: 2px solid var(--limestone);
}
.notes-toggle:hover{ background: var(--patina-deep); }

.notes-panel{
  position: fixed; bottom: 80px; right: 22px; z-index: 60;
  width: min(320px, calc(100vw - 44px)); max-height: 420px;
  background: var(--paper-card); border: 1px solid var(--line); border-radius: 8px;
  box-shadow: var(--shadow);
  display:flex; flex-direction:column;
  opacity:0; transform: translateY(10px) scale(.97);
  pointer-events:none; transition: opacity .15s ease, transform .15s ease;
}
.notes-panel.open{ opacity:1; transform: translateY(0) scale(1); pointer-events:auto; }
.notes-head{
  display:flex; align-items:center; justify-content:space-between;
  padding: 12px 14px; border-bottom: 1px solid var(--line);
  font-family: var(--mono); font-size:.74rem; color: var(--ink-soft);
}
.notes-close{ background:none; border:none; font-size:1.1rem; cursor:pointer; color: var(--ink-faint); line-height:1; }
.notes-close:hover{ color: var(--terracotta); }
.notes-text{
  flex:1; min-height: 160px; resize: vertical; border:none; outline:none;
  padding: 12px 14px; font-family: var(--body); font-size: .92rem; color: var(--ink);
  background: transparent;
}
.notes-foot{
  display:flex; align-items:center; justify-content:space-between;
  padding: 8px 14px 12px; font-family: var(--mono); font-size:.66rem; color: var(--ink-faint);
}
.notes-clear{ background:none; border:1px solid var(--line); border-radius:12px; padding:4px 10px; cursor:pointer; color: var(--ink-soft); font-family: var(--mono); font-size:.66rem; }
.notes-clear:hover{ border-color: var(--terracotta); color: var(--terracotta-deep); }
@media print{
  .site-header, .site-footer, .map-rail, .field-card, .card-overlay,
  .entry-tooltip, .translation-toggle, .chapter-nav, .tier-legend,
  .notes-toggle, .notes-panel, .map-modal-overlay, .back-link{ display:none !important; }
  body{ background:#fff; color:#000; font-size: 12pt; }
  .chapter-body{ grid-template-columns: 1fr; padding-top:0; }
  .entry{ border-bottom: none; color:#000; font-weight:600; }
  main{ max-width:none; }
  a[href]::after{ content:""; }
}

/* ============================================================
   Homepage — translation bar
   ============================================================ */
.home-hero{
  display:grid; grid-template-columns: 1.2fr 1fr; gap: 48px;
  align-items:center; padding: 48px 0 36px; border-bottom: 1px solid var(--line);
}
@media (max-width: 760px){ .home-hero{ grid-template-columns:1fr; padding-top:28px; } }
.home-hero-text h1{
  font-family: var(--display); font-weight:600;
  font-size: clamp(2.4rem,5.5vw,3.8rem); line-height:.98; margin:0 0 16px; letter-spacing:-.01em;
}
.home-hero-text h1 em{ font-style:italic; color: var(--patina); }
.home-hero-text .lede{ font-size:1.1rem; color:var(--ink-soft); max-width:46ch; margin:0; }

.home-translation-bar{
  display:flex; align-items:center; gap:14px; padding: 22px 0 18px;
  border-bottom: 1px solid var(--line-soft); flex-wrap:wrap;
}
.home-translation-label{
  font-family:var(--mono); font-size:.78rem; color:var(--ink-faint); letter-spacing:.04em;
}
.home-translation.translation-toggle{
  border:none; border-radius:0;
}
.home-translation.translation-toggle button{
  background: var(--paper-card); border:1px solid var(--line); padding:8px 16px;
  font-family:var(--mono); font-size:.78rem; letter-spacing:.04em; cursor:pointer; color:var(--ink-soft);
  border-radius:0;
}
.home-translation.translation-toggle button:first-child{ border-radius:4px 0 0 4px; }
.home-translation.translation-toggle button:last-child{ border-radius:0 4px 4px 0; }
.home-translation.translation-toggle button[aria-pressed="true"]{ background:var(--patina); color:#fff; border-color:var(--patina); }
.translation-help{ font-family:var(--mono); font-size:.74rem; color:var(--link); text-decoration:underline; text-underline-offset:3px; }

/* ============================================================
   Homepage — book library
   ============================================================ */
.testament-section{ margin: 44px 0; }
.book-group{ margin-bottom: 36px; }
.group-label{
  font-family:var(--mono); font-size:.72rem; text-transform:uppercase; letter-spacing:.1em;
  color:var(--ink-faint); margin:0 0 14px; padding-bottom:8px; border-bottom:1px solid var(--line-soft);
}

.book-cards{
  display:grid; grid-template-columns:repeat(auto-fill,minmax(130px,1fr)); gap:10px;
}
@media (max-width: 520px){ .book-cards{ grid-template-columns:repeat(auto-fill,minmax(100px,1fr)); gap:8px; } }

.book-card{
  border:1px solid var(--line); background:var(--paper-card); border-radius:5px;
  overflow:hidden; user-select:none;
}
.book-card.has-content{
  cursor:pointer; border-color:var(--patina);
  box-shadow: 0 2px 8px -4px rgba(62,102,87,.3);
}
.book-card.has-content:hover{ background:var(--limestone-deep); border-color:var(--patina-deep); }
.book-card.has-content:focus-visible{ outline:2px solid var(--terracotta); outline-offset:2px; }
.book-card.expanded{ border-color:var(--terracotta); }

.book-card-inner{ padding:12px 12px 10px; }
.book-name{ display:block; font-family:var(--display); font-weight:600; font-size:.95rem; color:var(--ink); margin-bottom:4px; }
.book-meta{ display:block; font-family:var(--mono); font-size:.66rem; color:var(--ink-faint); margin-bottom:8px; }
.book-progress{
  display:block; height:4px; background:var(--line-soft); border-radius:2px; overflow:hidden;
}
.progress-fill{ display:block; height:100%; background:var(--patina); border-radius:2px; }
.book-soon{ font-family:var(--mono); font-size:.62rem; color:var(--ink-faint); font-style:italic; }
.book-card.coming-soon{ opacity:.5; }

.chapter-panel{ padding:14px 14px 16px; border-top:1px solid var(--line); background:var(--limestone); }
.chapter-panel-label{
  font-family:var(--mono); font-size:.68rem; color:var(--ink-soft); letter-spacing:.03em; margin:0 0 10px;
}
.chapter-panel-grid{
  display:flex; flex-wrap:wrap; gap:5px; margin-bottom:10px;
}
.cp-tile{
  display:flex; align-items:center; justify-content:center;
  width:32px; height:32px; border-radius:3px; border:1px solid var(--line-soft);
  font-family:var(--mono); font-size:.74rem; color:var(--ink-faint); text-decoration:none;
  background:transparent;
}
.cp-tile.active{
  background:var(--patina); color:#fff; border-color:var(--patina-deep);
  font-weight:600; box-shadow:0 1px 4px -2px rgba(62,102,87,.5);
}
.cp-tile.active:hover{ background:var(--patina-deep); }
.chapter-panel-note{
  font-family:var(--mono); font-size:.64rem; color:var(--ink-faint); margin:8px 0 0; line-height:1.6;
}

/* ============================================================
   Layer bar — above verse text on chapter pages
   ============================================================ */
.layer-bar{
  display:flex; gap:8px; flex-wrap:wrap; padding: 16px 0 0;
  border-top:1px solid var(--line-soft);
}
.lb-btn{
  display:inline-flex; align-items:center; gap:6px;
  font-family:var(--mono); font-size:.72rem; font-weight:500;
  border:1px solid var(--line); background:var(--paper-card); color:var(--ink-soft);
  border-radius:20px; padding:6px 13px; cursor:pointer;
  transition: background .12s, border-color .12s, color .12s;
}
.lb-btn[aria-pressed="true"]{ background:var(--ink); color:var(--limestone); border-color:var(--ink); }
.lb-btn[aria-pressed="false"]{ opacity:.55; }
.lb-btn:hover{ opacity:1; }
.lb-icon{ font-size:.85rem; line-height:1; }

/* Layer visibility rules */
body.places-off .entry{ border-bottom:none; color:inherit; cursor:text; pointer-events:none; }
body.words-off .word-mark{ border-bottom:none; color:inherit; font-style:normal; cursor:text; pointer-events:none; }
body.scrolls-off .rail-dss{ display:none !important; }
body.quran-off .rail-quran{ display:none !important; }

/* ============================================================
   Right rail — DSS and Quran panels below the map
   ============================================================ */
.rail-panel{
  margin-top:14px; border:1px solid var(--line); border-radius:4px;
  background:var(--paper-card); border-left-width:4px; border-left-style:solid;
  overflow:hidden;
}
.rail-dss{ border-left-color:var(--word-ink); }
.rail-quran{ border-left-color:var(--ochre); }
.rail-panel-head{
  font-family:var(--mono); font-size:.68rem; text-transform:uppercase; letter-spacing:.08em;
  padding:10px 13px; border-bottom:1px solid var(--line);
  display:flex; align-items:center; gap:7px;
}
.rail-dss .rail-panel-head{ color:var(--word-ink-deep); }
.rail-quran .rail-panel-head{ color:var(--ochre-deep); }
.rail-panel summary{ display:none; } /* hide old summary since panel-head replaces it */
.rail-panel p{
  font-size:.82rem; color:var(--ink-soft); margin:10px 13px 8px; line-height:1.6;
}
.rail-panel .cross-links{
  list-style:none; margin:0; padding:0 13px 12px; display:flex; flex-direction:column; gap:6px;
}
.rail-panel .cross-links a{
  font-family:var(--mono); font-size:.72rem; font-weight:600;
  text-decoration:underline; text-underline-offset:3px;
}
.rail-dss .cross-links a{ color:var(--word-ink-deep); }
.rail-quran .cross-links a{ color:var(--ochre-deep); }
.rail-panel .none-found{ font-style:italic; color:var(--ink-faint); }

/* ============================================================
   New annotation track variables
   ============================================================ */
:root{
  --xref-indigo: #4B47A0;
  --xref-indigo-deep: #3A3780;
  --xref-bg: #EEEDF8;
  --obj-amber: #9A6A1A;
  --obj-amber-deep: #7A5214;
  --obj-bg: #F5EDD8;
  --num-sienna: #C05A2E;
  --num-sienna-deep: #8F3D18;
  --num-bg: #F9EDE8;
  --women-rose: #B05070;
  --women-rose-deep: #7A3050;
}

/* ── Cross-reference marker ── */
.xref-mark{
  display:inline-block; font-family:var(--mono); font-size:.58rem; font-weight:700;
  color:white; background:var(--xref-indigo); border-radius:3px;
  padding:0 4px; margin-left:3px; vertical-align:super; text-decoration:none;
  line-height:1.5; cursor:pointer; letter-spacing:0;
}
.xref-mark:hover{ background:var(--xref-indigo-deep); }
body.xrefs-off .xref-mark{ display:none; }
.fc-tab.xref{ background:var(--xref-indigo); }

/* Cross-ref field card content */
.xref-source-text{
  font-style:italic; color:var(--ink-soft); font-size:.95rem;
  border-left:3px solid var(--xref-indigo); padding:8px 12px;
  margin:0 0 16px; background:var(--xref-bg); border-radius:0 4px 4px 0;
}
.xref-connection{
  border:1px solid var(--line); border-radius:4px; padding:14px 16px;
  background:var(--paper-card); margin-bottom:12px;
}
.xref-conn-head{
  display:flex; align-items:center; gap:10px; margin-bottom:10px; flex-wrap:wrap;
}
.xref-type-badge{
  font-family:var(--mono); font-size:.65rem; font-weight:700; letter-spacing:.06em;
  text-transform:uppercase; color:white; padding:3px 8px; border-radius:3px;
  flex-shrink:0;
}
.xref-target-ref{
  font-family:var(--mono); font-size:.8rem; font-weight:600; color:var(--ink);
}
.xref-verse{
  font-style:italic; color:var(--ink-soft); font-size:.88rem; line-height:1.6;
  border-left:2px solid var(--line); padding-left:12px; margin:0 0 10px;
}
.xref-verse cite{ font-style:normal; font-size:.75rem; color:var(--ink-faint); }
.xref-note{ font-size:.88rem; color:var(--ink); line-height:1.65; margin:0 0 10px; }
.xref-read-link{
  font-family:var(--mono); font-size:.74rem; font-weight:600;
  color:var(--link); text-decoration:underline; text-underline-offset:3px;
}
.xref-read-link:hover{ color:var(--link-deep); }

/* ── Object marker ── */
.obj-mark{
  color:var(--obj-amber-deep); border-bottom:1px solid var(--obj-amber);
  text-decoration:none; cursor:pointer;
  transition:color .15s, border-color .15s;
}
.obj-mark:hover{ color:var(--obj-amber-deep); border-color:var(--obj-amber-deep); }
body.objects-off .obj-mark{ border-bottom:none; color:inherit; cursor:text; pointer-events:none; }
.fc-tab.attested{ background:var(--patina); }
.fc-tab.parallel{ background:var(--ochre); }
.fc-tab.debated{ background:var(--terracotta); }

/* ── Number marker ── */
.num-mark{
  color:var(--num-sienna); border-bottom:1px solid var(--num-sienna);
  text-decoration:none; cursor:pointer;
  transition:color .15s, border-color .15s;
}
.num-mark:hover{ color:var(--num-sienna-deep); border-color:var(--num-sienna-deep); }
body.numbers-off .num-mark{ border-bottom:none; color:inherit; cursor:text; pointer-events:none; }
.fc-tab.textual{ background:var(--num-sienna); }
.fc-tab.scholarly{ background:var(--num-sienna-deep); }
.fc-tab.number{ background:var(--num-sienna); }

/* ── Women in the Text marker ── */
.women-mark{
  color:var(--women-rose); border-bottom:1px solid var(--women-rose);
  text-decoration:none; cursor:pointer;
  transition:color .15s, border-color .15s;
}
.women-mark.unnamed{
  border-bottom:1px dashed var(--women-rose);
}
.women-mark:hover{ color:var(--women-rose-deep); border-color:var(--women-rose-deep); }
body.women-off .women-mark{ border-bottom:none; color:inherit; cursor:text; pointer-events:none; }
.fc-tab.woman{ background:var(--women-rose); }
.lb-btn.lb-women[aria-pressed="true"]  { background:var(--women-rose);     border-color:var(--women-rose-deep);  color:#fff; }

/* ── Layer bar visibility rules (new tracks) ── */
body.xrefs-off .xref-mark{ display:none; }

/* ============================================================
   Layer bar — color-coded per annotation type
   ============================================================ */
/* Generic pressed state (fallback) */
.lb-btn[aria-pressed="true"]{ background:var(--ink); border-color:var(--ink); color:var(--limestone); }
/* Per-type colors override the generic rule (same specificity, later wins) */
.lb-btn.lb-places[aria-pressed="true"]  { background:var(--patina);       border-color:var(--patina-deep);      color:#fff; }
.lb-btn.lb-words[aria-pressed="true"]   { background:var(--word-ink);      border-color:var(--word-ink-deep);    color:#fff; }
.lb-btn.lb-xrefs[aria-pressed="true"]   { background:var(--xref-indigo);   border-color:var(--xref-indigo-deep); color:#fff; }
.lb-btn.lb-objects[aria-pressed="true"] { background:var(--obj-amber);     border-color:var(--obj-amber-deep);   color:#fff; }
.lb-btn.lb-numbers[aria-pressed="true"] { background:var(--num-sienna);     border-color:var(--num-sienna-deep);  color:#fff; }
.lb-btn.lb-scrolls[aria-pressed="true"] { background:var(--word-ink-deep); border-color:var(--word-ink-deep);    color:#fff; }
.lb-btn.lb-quran[aria-pressed="true"]   { background:var(--ochre-deep);    border-color:var(--ochre-deep);       color:#fff; }

/* ============================================================
   Map expand button
   ============================================================ */
.map-expand-btn{
  position:absolute; top:8px; right:8px; z-index:6;
  width:32px; height:32px; border-radius:4px;
  background:rgba(247,243,231,.9); border:1px solid var(--line);
  font-size:1.1rem; cursor:pointer; color:var(--ink-soft);
  display:flex; align-items:center; justify-content:center;
  box-shadow:var(--shadow-soft);
}
.map-expand-btn:hover{ background:var(--paper-card); color:var(--patina); border-color:var(--patina); }
.chapter-locator{ cursor:zoom-in; }
.chapter-locator:hover::before{ background:rgba(247,243,231,1); }

/* ============================================================
   Map fullscreen modal
   ============================================================ */
.map-fs-overlay{
  position:fixed; inset:0; background:rgba(20,16,10,.7);
  z-index:200; display:flex; align-items:center; justify-content:center;
  opacity:0; pointer-events:none; transition:opacity .2s ease;
}
.map-fs-overlay.open{ opacity:1; pointer-events:auto; }
.map-fs-inner{
  width:96vw; height:92vh; display:flex; flex-direction:column;
  background:var(--paper-card); border-radius:8px;
  box-shadow:0 20px 60px rgba(0,0,0,.5); overflow:hidden;
}
.map-fs-toolbar{
  display:flex; align-items:center; justify-content:space-between;
  padding:10px 16px; background:var(--ink); color:var(--limestone);
  flex-shrink:0; gap:12px; flex-wrap:wrap;
}
.map-fs-title{ font-family:var(--mono); font-size:.82rem; font-weight:600; letter-spacing:.04em; }
.map-fs-controls{ display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.map-fs-btn{
  font-family:var(--mono); font-size:.76rem; padding:6px 12px; border-radius:4px;
  border:1px solid rgba(255,255,255,.25); background:rgba(255,255,255,.1);
  color:var(--limestone); cursor:pointer;
}
.map-fs-btn:hover{ background:rgba(255,255,255,.2); border-color:rgba(255,255,255,.5); }
.map-fs-close{ background:var(--terracotta) !important; border-color:var(--terracotta-deep) !important; }
.map-fs-close:hover{ opacity:.85; }
.map-fs-container{ flex:1; min-height:0; }
.map-fs-hint{
  padding:8px 14px; font-family:var(--mono); font-size:.7rem;
  color:var(--ink-faint); background:var(--limestone); text-align:center; flex-shrink:0;
}

/* ============================================================
   Locator expand modal
   ============================================================ */
.loc-expand-overlay{
  position:fixed; inset:0; background:rgba(20,16,10,.65);
  z-index:190; display:flex; align-items:center; justify-content:center;
  opacity:0; pointer-events:none; transition:opacity .2s ease;
}
.loc-expand-overlay.open{ opacity:1; pointer-events:auto; }
.loc-expand-inner{
  width:min(700px,92vw); height:min(520px,88vh);
  background:var(--paper-card); border-radius:8px;
  box-shadow:0 16px 48px rgba(0,0,0,.45); overflow:hidden;
  display:flex; flex-direction:column;
}
.loc-expand-head{
  display:flex; justify-content:space-between; align-items:center;
  padding:12px 16px; background:var(--ink); color:var(--limestone);
  font-family:var(--mono); font-size:.82rem; font-weight:600; flex-shrink:0;
}
.loc-expand-close{
  background:none; border:1px solid rgba(255,255,255,.3); color:var(--limestone);
  width:28px; height:28px; border-radius:50%; cursor:pointer; font-size:1rem;
  display:flex; align-items:center; justify-content:center;
}
.loc-expand-close:hover{ background:var(--terracotta); border-color:var(--terracotta); }
.loc-expand-container{ flex:1; min-height:0; }
.loc-expand-note{
  padding:8px 14px; font-family:var(--mono); font-size:.7rem;
  color:var(--ink-faint); background:var(--limestone); text-align:center; flex-shrink:0;
}

/* ============================================================
   ANE — Ancient Near Eastern Parallels
   ============================================================ */
:root{
  --ane-blue: #2A6496;
  --ane-blue-deep: #1E4D73;
  --ane-bg: #E0EAF5;
}

.lb-btn.lb-ane[aria-pressed="true"]{ background:var(--ane-blue); border-color:var(--ane-blue-deep); color:#fff; }
body.ane-off .rail-ane{ display:none !important; }
.rail-ane{ border-left-color:var(--ane-blue) !important; }
.rail-ane .rail-panel-head{ color:var(--ane-blue-deep) !important; }

.ane-panel-item{ padding:12px 13px; }
.ane-item-head{ display:flex; align-items:flex-start; gap:8px; flex-wrap:wrap; margin-bottom:8px; }
.ane-tier-badge{
  font-family:var(--mono); font-size:.62rem; font-weight:700; letter-spacing:.05em;
  text-transform:uppercase; color:white; padding:2px 7px; border-radius:3px; flex-shrink:0;
}
.ane-item-title{ font-family:var(--display); font-style:italic; font-size:.92rem; color:var(--ink); flex:1; min-width:0; }
.ane-item-body{ font-size:.82rem; color:var(--ink-soft); line-height:1.65; }
.ane-item-body p{ margin:0 0 8px; }
.ane-item-body strong{ color:var(--ink); }
.ane-sources{ list-style:none; margin:8px 0 0; padding:0; }
.ane-sources li{ margin-bottom:5px; }
.ane-sources a{ font-family:var(--mono); font-size:.71rem; font-weight:600; color:var(--ane-blue); text-decoration:underline; text-underline-offset:3px; }
.ane-sources a:hover{ color:var(--ane-blue-deep); }
.ane-divider{ border:none; border-top:1px solid var(--line); margin:4px 0; }

/* ============================================================
   ANE Section (full-width, below chapter body)
   ============================================================ */
.ane-section{
  border-top: 2px solid var(--ane-blue); margin-top: 40px;
  padding-top: 28px; padding-bottom: 48px;
}
body.ane-off .ane-section{ display:none; }
/* Override the old rail rule */
body.ane-off .rail-ane{ display:none !important; }

.ane-section-head{
  display:flex; align-items:baseline; gap:12px; flex-wrap:wrap; margin-bottom:20px;
}
.ane-section-icon{ font-size:1.3rem; color:var(--ane-blue); flex-shrink:0; }
.ane-section-title{
  font-family:var(--display); font-weight:600; font-size:1.2rem; color:var(--ink);
}
.ane-acronym{ font-family:var(--mono); font-size:.78rem; color:var(--ane-blue); font-weight:600; }
.ane-section-note{
  font-family:var(--mono); font-size:.74rem; color:var(--ink-faint);
  padding-left:12px; border-left:1px solid var(--line);
}
.ane-section-body{ display:grid; grid-template-columns:repeat(auto-fit,minmax(340px,1fr)); gap:16px; }
@media(max-width:700px){ .ane-section-body{ grid-template-columns:1fr; } }

/* ANE accordion panels */
.ane-panel-item{
  border:1px solid var(--line); border-radius:5px; background:var(--paper-card);
  border-left:4px solid var(--ane-blue); overflow:hidden;
}
.ane-panel-summary{
  list-style:none; display:flex; align-items:center; gap:10px; flex-wrap:wrap;
  padding:14px 16px; cursor:pointer; user-select:none;
}
.ane-panel-summary::-webkit-details-marker{ display:none; }
.ane-panel-summary::after{
  content:"+ expand"; font-family:var(--mono); font-size:.65rem; color:var(--ink-faint);
  margin-left:auto; flex-shrink:0; letter-spacing:.03em;
}
.ane-panel-item[open] .ane-panel-summary::after{ content:"\2212 collapse"; }
.ane-panel-summary:hover{ background:var(--limestone-deep); }
.ane-panel-item[open] .ane-panel-summary{ border-bottom:1px solid var(--line); }

.ane-panel-title{ font-family:var(--mono); font-size:.84rem; font-weight:600; color:var(--ink); }
.ane-tier-badge{
  font-family:var(--mono); font-size:.62rem; font-weight:700; letter-spacing:.05em;
  text-transform:uppercase; color:white; padding:2px 7px; border-radius:3px; flex-shrink:0;
}
.ane-panel-content{ padding:14px 16px; font-size:.9rem; color:var(--ink-soft); line-height:1.65; }
.ane-panel-content p{ margin:0 0 10px; }
.ane-panel-content p:last-child{ margin-bottom:0; }
.ane-panel-content strong{ color:var(--ink); }
.ane-sources{
  list-style:none; margin:0; padding:8px 16px 14px; display:flex; flex-wrap:wrap; gap:8px 16px;
  border-top:1px solid var(--line-soft);
}
.ane-sources a{
  font-family:var(--mono); font-size:.72rem; font-weight:600;
  color:var(--ane-blue); text-decoration:underline; text-underline-offset:3px;
}

/* ============================================================
   Explore page — intro/empty state
   ============================================================ */
.explore-intro{
  padding: 48px 32px; text-align:center;
  border:1px dashed var(--line); border-radius:6px; background:var(--paper-card);
  grid-column:1/-1;
}
.ei-icon{ font-size:2.4rem; margin-bottom:14px; color:var(--ink-faint); }
.explore-intro h3{ font-family:var(--display); font-size:1.4rem; font-weight:600; margin:0 0 10px; color:var(--ink); }
.explore-intro p{ font-size:.92rem; color:var(--ink-soft); margin:0 0 20px; max-width:50ch; margin-left:auto; margin-right:auto; }
.ei-examples-label{ font-family:var(--mono); font-size:.74rem; color:var(--ink-faint); text-transform:uppercase; letter-spacing:.08em; margin:0 0 10px; }
.ei-examples{ display:flex; flex-wrap:wrap; gap:8px; justify-content:center; margin-bottom:8px; }
.ei-example{
  font-family:var(--mono); font-size:.78rem; padding:7px 14px;
  border:1px solid var(--line); border-radius:20px; background:var(--limestone);
  color:var(--link); cursor:pointer; font-style:italic;
}
.ei-example:hover{ background:var(--xref-bg); border-color:var(--xref-indigo); color:var(--xref-indigo-deep); }

/* ============================================================
   Floating unit calculator
   ============================================================ */
.calc-toggle{
  position:fixed; bottom:80px; left:24px; z-index:50;
  width:46px; height:46px; border-radius:50%;
  background:var(--ochre); color:#fff; font-size:1.2rem;
  border:none; cursor:pointer;
  box-shadow:0 3px 10px rgba(0,0,0,.35);
  transition:transform .15s, background .15s;
  display:flex; align-items:center; justify-content:center;
}
.calc-toggle:hover{ background:var(--obj-amber-deep,#7A5214); transform:scale(1.08); }
.calc-toggle.active{ background:var(--ink); }
@media(max-width:520px){ .calc-toggle{ bottom:76px; left:16px; width:42px; height:42px; } }

.calc-panel{
  position:fixed; bottom:136px; left:24px; z-index:50;
  width:340px; max-height:78vh; overflow-y:auto;
  background:var(--paper-card); border:1px solid var(--line); border-radius:8px;
  box-shadow:0 8px 32px rgba(0,0,0,.25);
  display:none; flex-direction:column;
}
.calc-panel.open{ display:flex; }
@media(max-width:520px){
  .calc-panel{ width:calc(100vw - 32px); left:16px; bottom:128px; }
}

.calc-head{
  display:flex; align-items:center; gap:8px; padding:12px 14px;
  background:var(--ink); border-radius:8px 8px 0 0; flex-shrink:0;
}
.calc-head-title{ font-family:var(--mono); font-size:.78rem; font-weight:600; color:var(--limestone); flex:1; }

.calc-sys-toggle{ display:flex; border:1px solid rgba(255,255,255,.25); border-radius:4px; overflow:hidden; }
.cst-btn{ font-family:var(--mono); font-size:.68rem; padding:4px 9px; background:none; border:none; color:rgba(255,255,255,.6); cursor:pointer; }
.cst-btn.active{ background:var(--patina); color:#fff; }
.cst-btn:hover:not(.active){ color:#fff; }

.calc-close{ background:none; border:none; color:rgba(255,255,255,.6); font-size:1.1rem; cursor:pointer; padding:0 2px; margin-left:4px; }
.calc-close:hover{ color:#fff; }

.calc-cats{ display:flex; padding:10px 10px 0; gap:5px; flex-shrink:0; flex-wrap:wrap; }
.calc-cat{
  font-family:var(--mono); font-size:.7rem; padding:5px 10px; border-radius:20px;
  border:1px solid var(--line); background:var(--limestone); color:var(--ink-soft); cursor:pointer;
}
.calc-cat.active{ background:var(--ink); color:#fff; border-color:var(--ink); }
.calc-cat:hover:not(.active){ border-color:var(--ink-soft); color:var(--ink); }

.calc-inputs{ display:flex; gap:8px; padding:10px 12px; align-items:center; flex-shrink:0; }
.calc-num{
  width:80px; font-family:var(--mono); font-size:.95rem; font-weight:600;
  padding:8px 10px; border:1.5px solid var(--line); border-radius:4px;
  background:var(--paper-card); color:var(--ink); outline:none; flex-shrink:0;
}
.calc-num:focus{ border-color:var(--patina); }
.calc-unit{
  flex:1; font-family:var(--mono); font-size:.76rem; padding:8px 10px;
  border:1.5px solid var(--line); border-radius:4px;
  background:var(--paper-card); color:var(--ink); outline:none; cursor:pointer;
}
.calc-unit:focus{ border-color:var(--patina); }

.calc-results-list{ padding:4px 12px 4px; overflow-y:auto; flex:1; }
.calc-row{
  display:grid; grid-template-columns:1fr auto auto; gap:6px;
  padding:7px 0; border-bottom:1px solid var(--line-soft); align-items:baseline;
}
.calc-row:last-child{ border-bottom:none; }
.calc-row-src{ background:var(--limestone-deep,#E3DCC6); margin:0 -12px; padding:7px 12px; }
.calc-row-name{ font-family:var(--mono); font-size:.74rem; color:var(--ink-soft); }
.calc-heb{ font-size:.9rem; color:var(--word-ink); }
.calc-row-val{ font-family:var(--mono); font-size:.88rem; font-weight:700; color:var(--ink); text-align:right; }
.calc-row-mod{ font-family:var(--mono); font-size:.68rem; color:var(--ink-faint); text-align:right; min-width:80px; }

.calc-pp{
  display:none; margin:0 12px 12px; padding:8px 10px;
  font-family:var(--mono); font-size:.74rem; color:var(--patina-deep);
  background:var(--limestone); border:1px solid var(--line);
  border-left:3px solid var(--patina); border-radius:0 4px 4px 0;
}

/* ============================================================
   Mini embedded converter (inside field cards)
   ============================================================ */
.mini-conv{
  margin-top:18px; border-top:1px solid var(--line); padding-top:14px;
}
.mc-head{
  font-family:var(--mono); font-size:.72rem; font-weight:600;
  color:var(--ochre); margin-bottom:8px; text-transform:uppercase; letter-spacing:.06em;
}
.mc-verse{ font-weight:400; color:var(--ink-faint); text-transform:none; letter-spacing:0; margin-left:6px; }
.mc-inputs{ display:flex; gap:7px; align-items:center; margin-bottom:10px; flex-wrap:wrap; }
.mc-num{
  width:80px; font-family:var(--mono); font-size:.9rem; font-weight:700;
  padding:7px 9px; border:1.5px solid var(--line); border-radius:4px;
  background:var(--limestone); color:var(--ink); outline:none;
}
.mc-num:focus{ border-color:var(--patina); }
.mc-sel{
  font-family:var(--mono); font-size:.76rem; padding:7px 9px; flex:1;
  border:1.5px solid var(--line); border-radius:4px;
  background:var(--limestone); color:var(--ink); outline:none; cursor:pointer;
}
.mc-sel:focus{ border-color:var(--patina); }
.mc-sys{ display:flex; border:1px solid var(--line); border-radius:4px; overflow:hidden; flex-shrink:0; }
.mc-sys-btn{ font-family:var(--mono); font-size:.68rem; padding:6px 9px; background:none; border:none; color:var(--ink-faint); cursor:pointer; }
.mc-sys-btn.active{ background:var(--ink); color:#fff; }

.mc-results{ display:flex; flex-direction:column; gap:3px; }
.mc-row{
  display:grid; grid-template-columns:1fr auto auto; gap:8px;
  padding:4px 0; border-bottom:1px solid var(--line-soft); align-items:baseline;
}
.mc-row:last-child{ border-bottom:none; }
.mc-src{ font-weight:600; }
.mc-rname{ font-family:var(--mono); font-size:.73rem; color:var(--ink-soft); }
.mc-rval{ font-family:var(--mono); font-size:.83rem; font-weight:700; color:var(--ink); }
.mc-rmod{ font-family:var(--mono); font-size:.67rem; color:var(--ink-faint); min-width:70px; text-align:right; }
.mc-pp{
  display:none; margin-top:8px; padding:7px 9px;
  font-family:var(--mono); font-size:.72rem; color:var(--patina-deep);
  background:var(--paper-card); border:1px solid var(--line);
  border-left:3px solid var(--patina); border-radius:0 4px 4px 0;
}

/* ============================================================
   MOBILE SHELL — hidden on desktop, full-viewport at ≤768px
   All .m-* rules live here. They only apply when #m-shell is
   visible, so they have zero effect at desktop widths.
   ============================================================ */
#m-shell{ display:none; flex-direction:column; height:100dvh; position:relative; overflow:hidden; background:var(--limestone); }

@media (max-width:768px){
  body{ overflow:hidden; height:100dvh; margin:0; }
  .site-header,.site-footer,.chapter-head,.chapter-body,
  .notes-toggle,.notes-panel,.calc-toggle,.calc-panel,
  .field-card,.card-overlay,.entry-tooltip,.layer-bar,
  .map-fs-overlay,.loc-expand-overlay{ display:none !important; }
  main{ display:none !important; }
  #m-shell{ display:flex !important; }
}

/* ── Top bar ── */
.m-topbar{display:flex;align-items:center;justify-content:space-between;padding:12px 14px 9px;border-bottom:1px solid var(--line);background:var(--limestone);position:sticky;top:0;z-index:20;gap:8px;flex-shrink:0;}
.m-hamburger{width:34px;height:34px;border-radius:8px;border:1px solid var(--line);background:var(--paper-card);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;flex:0 0 auto;cursor:pointer;}
.m-hamburger span{display:block;width:16px;height:2px;background:var(--ink-soft);border-radius:1px;}
.m-chapter-title{font-family:var(--mono);font-size:.68rem;letter-spacing:.06em;text-transform:uppercase;color:var(--patina-deep);font-weight:600;flex:1;text-align:center;}
.m-topbar-right{display:flex;gap:6px;flex:0 0 auto;}
.m-icon-btn{min-width:44px;min-height:44px;width:44px;height:44px;border-radius:50%;border:1px solid var(--line);background:var(--paper-card);display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:.78rem;color:var(--ink-soft);position:relative;cursor:pointer;}

/* ── Edge nav ── */
.m-edge-nav{position:absolute;bottom:62px;width:48px;height:48px;z-index:35;display:flex;align-items:center;justify-content:center;background:none;border:none;opacity:.9;transition:opacity .15s;cursor:pointer;}
.m-edge-nav:active{opacity:1;}
.m-edge-nav.left{left:10px;} .m-edge-nav.right{right:10px;}
.m-edge-nav .arrow-circle{display:flex;flex-shrink:0;width:40px;height:40px;border-radius:50%;background:var(--paper-card);border:1.5px solid var(--line);align-items:center;justify-content:center;font-size:1.15rem;color:var(--ink-soft);box-shadow:var(--shadow);}

/* ── Scrollable content area ── */
.m-content{flex:1;overflow-y:auto;padding-bottom:8px;-webkit-overflow-scrolling:touch;position:relative;}
.m-hero{padding:16px 40px 6px;}
.m-hero h1{font-family:var(--display);font-weight:600;font-size:1.55rem;margin:4px 0 7px;line-height:1.15;}
.m-hero p{font-size:.82rem;color:var(--ink-soft);line-height:1.5;margin:0 0 12px;}
.annotate-note{margin:0 40px 14px;padding:9px 11px;background:var(--ochre-bg);border-radius:6px;font-size:.7rem;color:var(--ochre-deep);line-height:1.5;}

/* ── Verses ── */
.m-verses{padding:4px 40px 16px;font-size:1rem;line-height:1.72;transition:font-size .15s,line-height .15s,font-family .15s;}
.m-verses h2.subhead{font-family:var(--display);font-size:1.04rem;font-weight:600;color:var(--patina-deep);margin:22px 0 9px;padding-top:13px;border-top:1px solid var(--line-soft);}
.m-verses h2.subhead:first-child{margin-top:4px;border-top:none;padding-top:0;}
.m-verse{display:block;padding:2px 0;border-radius:6px;transition:background .15s;position:relative;}
.m-verse-annotated{cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;}
.m-verse-annotated:active,.m-verse.tapped{background:var(--paper-card);}
.m-vnum{font-family:var(--mono);font-size:.65rem;color:var(--ink-faint);vertical-align:super;margin-right:3px;font-weight:600;}
.m-mark{border-bottom:2.5px solid;padding:0 1px 1px;border-radius:2px;}
.m-mark.place{border-color:var(--patina);background:rgba(62,102,87,.08);}
.m-mark.word{border-color:var(--word-ink);background:rgba(110,106,156,.08);}
.m-mark.xref{border-color:var(--xref-indigo);background:rgba(75,71,160,.08);}
.m-mark.number{border-color:var(--num-sienna);background:rgba(192,90,46,.08);}
.m-mark.woman{border-color:var(--women-rose);background:rgba(176,80,112,.08);}
.m-section-label{font-family:var(--mono);font-size:.66rem;text-transform:uppercase;letter-spacing:.07em;color:var(--ink-faint);padding:0 40px;margin:4px 0 8px;}

/* ── Map ── */
.m-map-frame{margin:0 40px 20px;border-radius:10px;overflow:hidden;border:1px solid var(--line);position:relative;height:190px;box-shadow:var(--shadow-soft);}
.m-map-canvas{width:100%;height:100%;}
.m-map-expand-btn{position:absolute;bottom:9px;right:9px;width:30px;height:30px;border-radius:7px;background:rgba(247,243,231,.95);border:1px solid var(--line);display:flex;align-items:center;justify-content:center;font-size:.85rem;color:var(--ink-soft);box-shadow:var(--shadow-soft);cursor:pointer;}
.m-map-hint{position:absolute;bottom:9px;left:9px;font-family:var(--mono);font-size:.6rem;background:rgba(247,243,231,.92);color:var(--ink-soft);padding:4px 8px;border-radius:10px;border:1px solid var(--line);}
.m-map-loading{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:.7rem;color:var(--ink-faint);pointer-events:none;transition:opacity .3s;background:var(--limestone);}
.m-map-loading.hidden{opacity:0;pointer-events:none;}

/* ── DSS / Quran context panels ── */
.m-context-panel{margin:0 40px 16px;border:1px solid var(--line);border-radius:8px;overflow:hidden;border-left-width:4px;border-left-style:solid;background:var(--paper-card);}
.m-context-panel.dss{border-left-color:var(--word-ink);}
.m-context-panel.quran{border-left-color:var(--ochre);}
.m-context-head{display:flex;align-items:center;gap:7px;padding:10px 13px;font-family:var(--mono);font-size:.68rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;border-bottom:1px solid var(--line-soft);}
.m-context-panel.dss .m-context-head{color:var(--word-ink-deep);}
.m-context-panel.quran .m-context-head{color:var(--ochre-deep);}
.m-context-body{padding:10px 13px 13px;font-size:.81rem;line-height:1.55;color:var(--ink-soft);}

/* ── ANE accordion ── */
.m-ane{margin:0 40px 22px;border:1px solid var(--line);border-radius:8px;overflow:hidden;}
.m-ane-head{display:flex;align-items:center;gap:8px;width:100%;padding:11px 13px;background:var(--paper-card);font-family:var(--mono);font-size:.72rem;font-weight:600;color:var(--ane-blue-deep);border:none;text-align:left;cursor:pointer;}
.m-ane-toggle-icon{margin-left:auto;transition:transform .2s;color:var(--ink-faint);}
.m-ane-head.open .m-ane-toggle-icon{transform:rotate(180deg);}
.m-ane-body{padding:0 13px;max-height:0;overflow:hidden;transition:max-height .25s ease,padding .25s ease;}
.m-ane-body.open{max-height:2000px;padding:4px 13px 13px;}
.m-ane-panel{font-size:.81rem;line-height:1.55;color:var(--ink-soft);padding:9px 0;border-bottom:1px solid var(--line-soft);}
.m-ane-panel:last-child{border-bottom:none;}
.m-ane-panel-title{font-family:var(--display);font-weight:600;color:var(--ink);font-size:.9rem;margin-bottom:4px;}
.m-ane-tier{display:inline-block;font-family:var(--mono);font-size:.56rem;text-transform:uppercase;padding:2px 6px;border-radius:9px;margin-top:6px;border:1px solid var(--patina-deep);color:var(--patina-deep);}

/* ── Verse popup (anchored) ── */
.m-popup-overlay{position:absolute;inset:0;background:transparent;opacity:0;pointer-events:none;transition:opacity .15s;z-index:40;}
.m-popup-overlay.open{opacity:1;pointer-events:auto;}
.m-popup{position:absolute;z-index:50;width:calc(100% - 80px);max-width:320px;background:var(--paper-card);border-radius:12px;box-shadow:var(--shadow);border:1px solid var(--line);opacity:0;transform:translateY(-6px) scale(.97);pointer-events:none;transition:opacity .15s,transform .15s;max-height:320px;display:flex;flex-direction:column;}
.m-popup.open{opacity:1;transform:translateY(0) scale(1);pointer-events:auto;}
.m-popup-arrow{position:absolute;width:13px;height:13px;background:var(--paper-card);border-left:1px solid var(--line);border-top:1px solid var(--line);transform:rotate(45deg);left:22px;}
.m-popup-arrow.above{bottom:-7px;transform:rotate(225deg);}
.m-popup-arrow.below{top:-7px;}
.m-popup-head{display:flex;align-items:center;justify-content:space-between;padding:9px 11px;border-bottom:1px solid var(--line);flex:0 0 auto;}
.m-popup-ref{font-family:var(--mono);font-size:.66rem;color:var(--ink-faint);}
.m-popup-close{font-size:.9rem;color:var(--ink-faint);background:none;border:none;min-width:44px;min-height:44px;padding:2px 5px;display:flex;align-items:center;justify-content:center;cursor:pointer;}
.m-popup-verse-text{padding:8px 11px;font-size:.79rem;line-height:1.48;color:var(--ink-soft);border-bottom:1px solid var(--line-soft);font-style:italic;flex:0 0 auto;}
.m-popup-body{overflow-y:auto;flex:1 1 auto;}
.m-ann-item{display:flex;align-items:flex-start;gap:8px;padding:10px 11px;border-bottom:1px solid var(--line-soft);}
.m-ann-item:last-child{border-bottom:none;}
.m-ann-tab{width:4px;align-self:stretch;border-radius:2px;flex:0 0 4px;min-height:30px;}
.m-ann-tab.place{background:var(--patina);} .m-ann-tab.word{background:var(--word-ink);}
.m-ann-tab.xref{background:var(--xref-indigo);} .m-ann-tab.number{background:var(--num-sienna);}
.m-ann-tab.woman{background:var(--women-rose);}
.m-ann-content{flex:1;min-width:0;}
.m-ann-kicker{font-family:var(--mono);font-size:.58rem;text-transform:uppercase;letter-spacing:.06em;margin-bottom:2px;}
.m-ann-kicker.place{color:var(--patina-deep);} .m-ann-kicker.word{color:var(--word-ink-deep);}
.m-ann-kicker.xref{color:var(--xref-indigo-deep);} .m-ann-kicker.number{color:var(--num-sienna-deep);}
.m-ann-kicker.woman{color:var(--women-rose-deep);}
.m-ann-title{font-family:var(--display);font-weight:600;font-size:.85rem;margin:0 0 3px;}
.m-ann-summary{font-size:.76rem;line-height:1.4;color:var(--ink-soft);margin:0;}
.m-ann-tier{display:inline-block;font-family:var(--mono);font-size:.54rem;text-transform:uppercase;padding:2px 6px;border-radius:8px;margin-top:5px;border:1px solid var(--patina-deep);color:var(--patina-deep);}

/* ── Full-screen map overlay ── */
.m-fullmap-overlay{position:absolute;inset:0;background:var(--limestone);z-index:90;opacity:0;pointer-events:none;transition:opacity .22s;display:flex;flex-direction:column;}
.m-fullmap-overlay.open{opacity:1;pointer-events:auto;}
.m-fullmap-head{display:flex;align-items:center;justify-content:space-between;padding:13px 15px;border-bottom:1px solid var(--line);}
.m-fullmap-title{font-family:var(--display);font-weight:600;font-size:1rem;}
.m-fullmap-close{width:44px;height:44px;border-radius:50%;border:1px solid var(--line);background:var(--paper-card);font-size:.85rem;color:var(--ink-soft);display:flex;align-items:center;justify-content:center;cursor:pointer;}
.m-fullmap-canvas{flex:1;position:relative;}
.m-fullmap-hint{position:absolute;bottom:12px;left:50%;transform:translateX(-50%);font-family:var(--mono);font-size:.62rem;background:rgba(247,243,231,.95);color:var(--ink-soft);padding:5px 11px;border-radius:12px;border:1px solid var(--line);white-space:nowrap;}

/* ── Pin info popup ── */
.m-pin-popup{position:absolute;background:var(--paper-card);border:1px solid var(--line);border-radius:8px;box-shadow:var(--shadow);padding:10px 12px;max-width:200px;z-index:30;font-size:.78rem;display:none;}
.m-pin-popup.show{display:block;}
.m-pin-popup .pp-title{font-family:var(--display);font-weight:600;font-size:.88rem;margin-bottom:3px;}
.m-pin-popup .pp-tier{font-family:var(--mono);font-size:.56rem;text-transform:uppercase;color:var(--patina-deep);}

/* ── Hamburger nav ── */
.m-nav-overlay{position:absolute;inset:0;background:rgba(43,36,25,.45);opacity:0;pointer-events:none;transition:opacity .2s;z-index:80;}
.m-nav-overlay.open{opacity:1;pointer-events:auto;}
.m-nav-menu{position:absolute;top:0;left:0;bottom:0;width:78%;max-width:300px;background:var(--paper-card);box-shadow:var(--shadow);z-index:85;transform:translateX(-100%);transition:transform .26s cubic-bezier(.2,.8,.2,1);overflow-y:auto;}
.m-nav-menu.open{transform:translateX(0);}
.m-nav-brand{padding:22px 20px 16px;border-bottom:1px solid var(--line);}
.m-nav-brand .mark{font-family:var(--mono);font-size:.55rem;letter-spacing:.1em;color:var(--patina);border:1px solid var(--patina);padding:2px 6px;border-radius:2px;display:inline-block;margin-bottom:6px;}
.m-nav-brand .title{font-family:var(--display);font-weight:600;font-size:1.3rem;display:block;}
.m-nav-brand .tagline{font-family:var(--mono);font-size:.66rem;color:var(--ink-faint);display:block;margin-top:2px;}
.m-nav-links{padding:10px 0;}
.m-nav-links a{display:block;padding:13px 20px;font-family:var(--display);font-size:1.05rem;color:var(--ink);text-decoration:none;border-bottom:1px solid var(--line-soft);}
.m-nav-links a.current{color:var(--patina-deep);font-weight:600;}
.m-nav-close{position:absolute;top:18px;right:14px;width:44px;height:44px;border-radius:50%;border:1px solid var(--line);background:var(--limestone);font-size:.85rem;color:var(--ink-soft);display:flex;align-items:center;justify-content:center;cursor:pointer;}

/* ── Layers dropdown ── */
.m-dropdown-scrim{position:absolute;inset:0;background:rgba(43,36,25,.18);opacity:0;pointer-events:none;transition:opacity .15s;z-index:40;}
.m-dropdown-scrim.show{opacity:1;}
.m-layers-dropdown{position:absolute;left:40px;right:40px;background:var(--paper-card);border:1px solid var(--line);border-radius:10px;box-shadow:var(--shadow);z-index:56;opacity:0;transform:translateY(-6px);pointer-events:none;transition:opacity .15s,transform .15s;max-height:60vh;overflow-y:auto;}
.m-layers-dropdown.open{opacity:1;transform:translateY(0);pointer-events:auto;}
.m-layers-bar{margin:0 40px 14px;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:11px 14px;border:1px solid var(--line);border-radius:9px;background:var(--paper-card);cursor:pointer;width:calc(100% - 80px);}
.m-layers-bar-label{display:flex;align-items:center;gap:8px;font-family:var(--mono);font-size:.74rem;font-weight:600;color:var(--ink-soft);}
.m-layers-bar-count{background:var(--patina);color:#fff;font-family:var(--mono);font-size:.62rem;font-weight:700;padding:2px 7px;border-radius:9px;}
.m-layers-bar-chevron{color:var(--ink-faint);font-size:.8rem;transition:transform .2s;}
.m-layers-bar.open .m-layers-bar-chevron{transform:rotate(180deg);}
.m-layer-toggle-row{display:flex;align-items:center;justify-content:space-between;padding:10px 14px;border-bottom:1px solid var(--line-soft);}
.m-layer-toggle-row:last-child{border-bottom:none;}
.m-layer-toggle-row .lbl{display:flex;align-items:center;gap:8px;font-size:.85rem;}
.m-switch{width:34px;height:20px;border-radius:10px;background:var(--line);position:relative;flex:0 0 auto;border:none;padding:0;cursor:pointer;-webkit-appearance:none;appearance:none;}
.m-switch.on{background:var(--patina);}
.m-switch::after{content:"";position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:#fff;transition:left .15s;}
.m-switch.on::after{left:16px;}

/* ── Version dropdown ── */
.m-version-dropdown{position:absolute;top:50px;right:62px;width:140px;background:var(--paper-card);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);z-index:56;opacity:0;transform:translateY(-6px);pointer-events:none;transition:opacity .15s,transform .15s;overflow:hidden;}
.m-version-dropdown.open{opacity:1;transform:translateY(0);pointer-events:auto;}
.m-version-dropdown button{display:block;width:100%;min-height:44px;text-align:left;padding:11px 14px;border:none;background:none;font-family:var(--mono);font-size:.78rem;font-weight:600;color:var(--ink-soft);border-bottom:1px solid var(--line-soft);cursor:pointer;}
.m-version-dropdown button:last-child{border-bottom:none;}
.m-version-dropdown button.active{background:var(--patina);color:#fff;}

/* ── Aa popover ── */
.m-aa-popover{position:absolute;top:50px;right:14px;width:220px;background:var(--paper-card);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);z-index:56;opacity:0;transform:translateY(-6px);pointer-events:none;transition:opacity .15s,transform .15s;}
.m-aa-popover.open{opacity:1;transform:translateY(0);pointer-events:auto;}
.m-aa-section{padding:11px 13px;border-bottom:1px solid var(--line-soft);}
.m-aa-section:last-child{border-bottom:none;}
.m-aa-label{font-family:var(--mono);font-size:.62rem;text-transform:uppercase;letter-spacing:.05em;color:var(--ink-faint);margin-bottom:7px;}
.m-aa-size-row{display:flex;align-items:center;justify-content:space-between;gap:6px;}
.m-aa-size-btn{min-width:44px;min-height:44px;width:44px;height:44px;border-radius:7px;border:1px solid var(--line);background:var(--limestone);font-family:var(--display);color:var(--ink);display:flex;align-items:center;justify-content:center;cursor:pointer;}
.m-aa-size-btn.small{font-size:.76rem;} .m-aa-size-btn.large{font-size:1.1rem;}
.m-aa-size-value{font-family:var(--mono);font-size:.7rem;color:var(--ink-soft);min-width:32px;text-align:center;}
.m-aa-font-choice{display:flex;gap:5px;}
.m-aa-font-choice button{flex:1;min-height:44px;padding:6px;border-radius:6px;border:1px solid var(--line);background:var(--limestone);font-size:.74rem;color:var(--ink-soft);cursor:pointer;}
.m-aa-font-choice button.active{background:var(--ink);color:var(--limestone);border-color:var(--ink);}
.m-aa-toggle-row{display:flex;align-items:center;justify-content:space-between;padding:5px 0;}
.m-aa-toggle-row .lbl{font-size:.8rem;}

/* ── More panel ── */
.m-more-panel{overflow:hidden;max-height:0;transition:max-height .22s ease;background:var(--paper-card);border-top:1px solid var(--line);}
.m-more-panel.open{max-height:120px;}
.m-more-panel a{display:flex;align-items:center;gap:10px;padding:13px 20px;font-family:var(--display);font-size:.92rem;color:var(--ink);text-decoration:none;border-bottom:1px solid var(--line-soft);}
.m-more-panel a:last-child{border-bottom:none;}
.m-more-panel a:active{background:var(--ochre-bg);}

/* ── Bottom tab bar ── */
.m-tabbar{display:flex;border-top:1px solid var(--line);background:var(--paper-card);padding:5px 4px 9px;position:relative;z-index:30;flex-shrink:0;}
.m-tab{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;padding:5px 2px;border:none;background:none;color:var(--ink-faint);font-family:var(--mono);font-size:.58rem;cursor:pointer;}
.m-tab.active{color:var(--patina-deep);}
.m-tab-icon{font-size:1.1rem;line-height:1;}

/* ── Calculator sheet ── */
.m-calc-overlay{position:absolute;inset:0;background:rgba(43,36,25,.4);opacity:0;pointer-events:none;transition:opacity .2s;z-index:65;}
.m-calc-overlay.open{opacity:1;pointer-events:auto;}
.m-calc-sheet{position:absolute;left:0;right:0;bottom:0;background:var(--paper-card);border-radius:16px 16px 0 0;box-shadow:var(--shadow);z-index:66;transform:translateY(100%);visibility:hidden;pointer-events:none;transition:transform .26s cubic-bezier(.2,.8,.2,1),visibility 0s .26s;}
.m-calc-sheet.open{transform:translateY(0);visibility:visible;pointer-events:auto;transition:transform .26s cubic-bezier(.2,.8,.2,1),visibility 0s;}
.m-calc-head{display:flex;align-items:center;justify-content:space-between;padding:6px 18px 10px;border-bottom:1px solid var(--line);font-family:var(--mono);font-size:.78rem;font-weight:600;color:var(--ochre-deep);}
.m-calc-close{background:none;border:none;color:var(--ink-faint);font-size:.9rem;min-width:44px;min-height:44px;display:flex;align-items:center;justify-content:center;cursor:pointer;}
.m-calc-cats{display:flex;border-bottom:1px solid var(--line);overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;}
.m-calc-cats::-webkit-scrollbar{display:none;}
.m-calc-cat{flex:0 0 auto;padding:8px 13px;border:none;background:none;font-family:var(--mono);font-size:.66rem;color:var(--ink-faint);border-bottom:2px solid transparent;cursor:pointer;min-height:36px;}
.m-calc-cat.active{color:var(--ochre-deep);border-bottom-color:var(--ochre);}
.m-calc-body{padding:12px 16px 20px;}
.m-calc-input-row{display:flex;gap:8px;margin-bottom:10px;}
.m-calc-input-row input{flex:1;border:1px solid var(--line);border-radius:7px;padding:9px 10px;font-family:var(--mono);font-size:.86rem;width:0;background:var(--limestone);}
.m-calc-input-row select{flex:1.2;border:1px solid var(--line);border-radius:7px;padding:9px 8px;font-family:var(--mono);font-size:.76rem;background:var(--limestone);}
.m-calc-sys-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:11px;}
.m-calc-sys-label{font-family:var(--mono);font-size:.64rem;color:var(--ink-faint);}
.m-calc-sys-btns{display:flex;border:1px solid var(--line);border-radius:6px;overflow:hidden;}
.m-calc-sys-btn{padding:4px 12px;border:none;background:none;font-family:var(--mono);font-size:.64rem;color:var(--ink-soft);min-height:30px;cursor:pointer;}
.m-calc-sys-btn.active{background:var(--ochre);color:#fff;}
.m-calc-results{border:1px solid var(--line-soft);border-radius:8px;overflow:hidden;margin-bottom:8px;}
.m-calc-result-row{display:grid;grid-template-columns:1fr auto;align-items:baseline;gap:6px;padding:7px 11px;border-bottom:1px solid var(--line-soft);font-family:var(--mono);font-size:.76rem;}
.m-calc-result-row:last-child{border-bottom:none;}
.m-calc-result-row.current-unit{background:var(--ochre-bg);}
.m-calc-result-row .r-unit{color:var(--ink-faint);}
.m-calc-result-row .r-val{color:var(--ink);font-weight:600;text-align:right;}
.m-calc-result-row .r-modern{grid-column:1/-1;font-size:.62rem;color:var(--ink-soft);padding-top:1px;}
.m-calc-ppower{padding:7px 11px;background:var(--ochre-bg);border-radius:7px;font-family:var(--mono);font-size:.67rem;color:var(--ochre-deep);line-height:1.5;display:none;}
.m-calc-ppower.show{display:block;}