/* Scripture Atlas — shared structural CSS. Per-region palettes stay inline
   in each page's own <style> block and define --accent / --accent-hi /
   --accent-alt; everything here consumes those generic tokens. */

*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;} html,body{margin:0;height:100%;}
body[data-bb-route="atlas-map"]{overflow:hidden;}
.plate{position:fixed;z-index:1;inset:60px 0 0 0;overflow:hidden;display:flex;flex-direction:column;
  padding:clamp(8px,1.4vw,18px) clamp(16px,3vw,40px);
  font-family:'Hoefler Text','Iowan Old Style','Palatino Linotype','Book Antiqua',Georgia,serif;color:var(--ink);
  -webkit-font-smoothing:antialiased;
  background:radial-gradient(120% 100% at 50% 28%, var(--paper-hi) 0%, var(--paper) 44%, var(--paper-lo) 84%, var(--paper-edge) 100%);}
/* 60px matches the reader header's own --header-height; when the WP admin bar is
   showing, the reader header itself shifts down by --admin-bar-height, so follow it */
body.admin-bar .plate{top:calc(var(--admin-bar-height, 32px) + 60px);}

/* preview-only: real BibleBridge site nav, copied 1:1 from reader/topic-map.php */
.nav{position:fixed;top:0;left:0;right:0;z-index:100;background:#0c0b09;border-bottom:1px solid rgba(255,255,255,.05);
  padding:0 1rem;height:60px;display:flex;align-items:center;justify-content:space-between;font-family:'Inter',-apple-system,BlinkMacSystemFont,sans-serif;}
.nav-brand{font-size:.95rem;font-weight:600;color:#fff;opacity:.9;letter-spacing:.02em;text-decoration:none;line-height:1;}
.nav-brand:hover{opacity:1;color:#fff;}
.nav-right{display:flex;gap:1.25rem;align-items:center;margin-left:auto;}
.nav-cta{background:#9e7640;color:#fff!important;padding:.4rem .9rem;border-radius:6px;font-weight:600;font-size:.78rem;text-decoration:none;transition:background .15s;}
.nav-cta:hover{background:#7e5c2e;color:#fff;}
.grain{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;mix-blend-mode:multiply;opacity:var(--grain-op);}
.glow{position:absolute;inset:0;pointer-events:none;background:radial-gradient(52% 44% at 50% 46%, var(--glow, rgba(0,0,0,.12)) 0%, transparent 72%);}
.vignette{position:absolute;inset:0;pointer-events:none;background:radial-gradient(118% 100% at 50% 42%, transparent 55%, var(--vignette) 100%);}

header.cartouche{text-align:left;position:absolute;z-index:2;top:clamp(10px,1.8vw,22px);left:clamp(16px,3vw,40px);max-width:min(340px,40vw);pointer-events:none;}
h1{color:var(--ink);font-weight:600;font-variant:small-caps;letter-spacing:.05em;font-size:clamp(16px,2.1vw,24px);line-height:1.05;margin:0 0 .12em;white-space:nowrap;}
.subtitle{font-style:italic;color:var(--ink-soft);font-size:clamp(10.5px,1.3vw,12px);line-height:1.35;text-wrap:balance;}
.subtitle .cite{font-style:normal;font-variant:small-caps;letter-spacing:.08em;color:var(--accent);font-size:.82em;white-space:nowrap;}

.chart-wrap{position:relative;z-index:1;flex:1;min-height:0;max-width:1040px;width:100%;margin-inline:auto;overflow:hidden;touch-action:none;}
svg.chart{display:block;width:100%;height:100%;overflow:visible;}
.hl{stroke:var(--hatch);}
.t0{stop-color:var(--term-outer);stop-opacity:0;} .t1{stop-color:var(--term-outer);stop-opacity:var(--term-op);}
.p-out{stroke:var(--ink);} .spec{fill:var(--spec);}
.edge{fill:var(--ink-soft);stroke:none;opacity:var(--eop,.4);transition:opacity .3s ease,fill .3s ease;}
.edge-hit{stroke-width:16px;vector-effect:non-scaling-stroke;}
@media (pointer:coarse){ .edge-hit{stroke-width:36px;} }
.lbl{font-style:italic;fill:var(--ink);font-size:18px;transition:fill .3s ease;pointer-events:none;}
.lbl.big{font-variant:small-caps;font-style:normal;letter-spacing:.05em;font-size:20px;}
.leader{stroke:var(--ink-soft);stroke-width:.6;opacity:.5;transition:opacity .3s ease;pointer-events:none;}
.bgstar{fill:var(--ink-soft);}
.glow-h{opacity:0;pointer-events:none;transition:opacity .35s ease;}
.planet{cursor:pointer;outline:none;}
svg.chart.has-active .edge{opacity:calc(var(--eop,.4) * .17);}
svg.chart.has-active .planet:not(.active):not(.linked){opacity:.3;transition:opacity .3s ease;}
svg.chart.has-active .planet.active .glow-h{opacity:1;}
svg.chart.has-active .edge.lit{opacity:.95;fill:var(--accent);}
.lbl.hot{fill:var(--accent-hi);} .leader.hot{opacity:1;}

.toast{position:fixed;left:50%;bottom:26px;transform:translateX(-50%) translateY(12px);background:var(--paper-hi);color:var(--ink);
  border:1px solid var(--ink-faint);box-shadow:0 6px 22px rgba(0,0,0,.3);
  padding:12px 22px;font-variant:small-caps;letter-spacing:.1em;font-size:13.5px;opacity:0;pointer-events:none;
  transition:opacity .3s,transform .3s;z-index:9;white-space:nowrap;}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0);}
.toast em{font-variant:normal;font-style:italic;color:var(--accent);}
/* shared-verse evidence panel */
.evpanel{position:absolute;top:0;right:0;height:100%;width:min(370px,88%);background:var(--paper-hi);
  border-left:1px solid var(--ink-faint);box-shadow:-9px 0 32px rgba(0,0,0,.3);
  transform:translateX(103%);transition:transform .4s cubic-bezier(.4,0,.2,1);z-index:6;display:flex;flex-direction:column;padding:clamp(18px,2.6vw,30px);}
.evpanel.open{transform:translateX(0);}
.evclose{position:absolute;top:12px;right:15px;background:none;border:none;color:var(--ink-soft);font-size:24px;line-height:1;cursor:pointer;font-family:inherit;}
.evclose:hover{color:var(--accent);}
.evpanel h3{font-variant:small-caps;letter-spacing:.03em;font-weight:600;font-size:clamp(15px,2vw,20px);margin:.1em 34px .06em 0;color:var(--ink);line-height:1.15;}
.evsub{font-variant:small-caps;letter-spacing:.12em;font-size:11px;color:var(--accent);margin-bottom:11px;}
.evrule{height:1px;background:linear-gradient(90deg,var(--accent),transparent);margin-bottom:13px;flex:none;}
.evlist{overflow-y:auto;flex:1;padding-right:6px;scrollbar-width:thin;scrollbar-color:var(--ink-faint) transparent;
  scroll-snap-type:y mandatory;overscroll-behavior:contain;}
.evlist::-webkit-scrollbar{width:8px;}
.evlist::-webkit-scrollbar-track{background:transparent;}
.evlist::-webkit-scrollbar-thumb{background:var(--ink-faint);border-radius:4px;border:2px solid var(--paper-hi);}
.evlist::-webkit-scrollbar-thumb:hover{background:var(--ink-soft);}
.evverse{margin-bottom:12px;scroll-snap-align:start;}
.evverse:not(:last-child){border-bottom:1px solid var(--ink-faint);padding-bottom:11px;}
.evref{font-variant:small-caps;letter-spacing:.06em;font-size:12px;color:var(--accent);display:block;margin-bottom:2px;}
.evtext{font-size:13.5px;line-height:1.5;color:var(--ink);}
.evbridges{margin:2px 0 10px;}
.evbridges .evb-label{font-variant:small-caps;letter-spacing:.08em;font-size:11px;color:var(--accent);display:block;margin-bottom:5px;}
.evb-link{display:block;font-style:italic;font-size:14px;color:var(--accent);text-decoration:none;padding:3px 0;cursor:pointer;background:none;border:none;text-align:left;font-family:inherit;}
.evb-link:hover,.evb-link:focus-visible{text-decoration:underline;}
@media (prefers-reduced-motion:reduce){*{transition:none !important;animation:none !important;}}
@media (max-width:560px){.lbl{font-size:20px;} .subtitle{font-size:13px;} .evtext{font-size:15px;}}
/* Reader's mobile bottom nav (fixed, z-index:200) appears at this same breakpoint
   and sits on top of the evpanel (z-index:6) — without clearance, the last verse
   and the "Show N more" button render underneath it, unreachable. 70px matches
   the reader's own existing bottom-nav clearance (see .reader-index-page). */
@media (max-width:640px){.evlist{padding-bottom:calc(70px + env(safe-area-inset-bottom, 0px));}}