/* ---------- Hall base ---------- */
:root{
  --ink:#e8dfff; --muted:#c7b6ff; --glow:rgba(120,140,255,.18);
  --panel: rgba(40,20,70,.55); --panel-2: rgba(60,30,110,.35);
  --rule: linear-gradient(90deg, transparent, rgba(180,150,255,.35), transparent);
}
.hall {max-width: 960px; margin: 2.5rem auto; padding: 0 1rem;}
.hall .card{
  background: radial-gradient(120% 120% at 30% 10%, var(--panel), var(--panel-2));
  border: 1px solid rgba(200,170,255,.25);
  border-radius: 16px; padding: 1.25rem 1.25rem 1.1rem;
  box-shadow: 0 8px 28px var(--glow);
}
.hall h2{font-size: clamp(1.3rem, 2vw, 1.6rem); margin:.25rem 0 1rem}
.hall p, .hall li, .hall blockquote{color:var(--ink); opacity:.95}
.hall .meta{opacity:.8; margin:.25rem 0 1rem}

/* details/summary cards */
.hall details.arc{margin: .75rem 0}
.hall details.arc > summary{
  list-style:none; cursor:pointer; user-select:none;
  padding:.8rem 1rem; border-radius:14px;
  background: radial-gradient(120% 120% at 20% 10%, var(--panel), var(--panel-2));
  border:1px solid rgba(200,170,255,.2);
  color:var(--ink);
}
.hall details[open] > summary{ box-shadow: 0 8px 28px var(--glow) }
.hall .arc-links{ padding: .9rem 0 0 }

/* subtle divider */
.hall .rule{height:1px; margin:1rem 0; background:var(--rule)}

/* ---------- WeaveMark watermark (card-local) ---------- */
.weavemark-watermark{ position:relative; overflow:hidden }
.weavemark-watermark::before{
  content:""; position:absolute; inset:-1.25rem;
  background: url("/images/WeaveMark.png") center 14% / clamp(260px, 45vw, 540px) no-repeat;
  opacity:.09; filter: drop-shadow(0 0 22px rgba(123,192,255,.25));
  pointer-events:none; z-index:0;
}
.weavemark-watermark > *{ position:relative; z-index:1 }

/* optional small glyph (if you want it elsewhere) */
.glyph-badge{
  width:120px; height:120px; margin: 4rem 0 0;
  background: url("/images/WeaveMark.png") center/contain no-repeat;
  opacity:.35; filter: drop-shadow(0 0 10px rgba(86,200,255,.25));
}

/* ——— Hall polish ——— */

/* Stack rhythm between Hall sections */
details.arc { margin: 1.25rem 0 0; }
details.arc + details.arc { margin-top: .75rem; }

/* Summary = clickable bar with a subtle arrow */
details.arc > summary {
  list-style: none;            /* hide native marker */
  cursor: pointer;
  position: relative;
  padding-left: 1.25rem;
  font-weight: 600;
  user-select: none;
  transition: color .18s ease, opacity .18s ease;
}
details.arc > summary::before {
  content: "▸";                /* arrow */
  position: absolute;
  left: .25rem;
  top: .1rem;
  opacity: .7;
  transition: transform .2s ease, opacity .2s ease;
}
details.arc[open] > summary::before {
  transform: rotate(90deg);    /* turn when open */
  opacity: .9;
}
details.arc > summary:hover   { opacity: .9; }
details.arc > summary:active  { opacity: .75; }

/* Keep inner card from bumping into the summary line */
details.arc .arc-links { margin-top: .75rem; }

/* Optional: a tiny fade-in for opened content */
details.arc[open] .arc-links { animation: hall-in .18s ease both; }
@keyframes hall-in { from { opacity: 0; transform: translateY(-2px);} }

/* ——— Watermark quick switch ———
   Add class "weave-off" on a section to kill the X watermark for that card only. */
section.weavemark-watermark.weave-off::before { display: none !important; }

/* ——— WeaveMark: unified styling for all Hall cards ——— */

/* Put the watermark on the card */
.card.weavemark-watermark {
  position: relative;
  overflow: hidden;
}

/* The watermark itself (single source of truth) */
.card.weavemark-watermark::before {
  content: "";
  position: absolute;
  inset: -1.25rem;
  background: url("/images/WeaveMark.png") no-repeat center / 520px auto;
  opacity: .08;                    /* subtle; raise to .12 if you want more glow */
  filter: drop-shadow(0 0 22px rgba(123,192,255,.25));
  pointer-events: none;
  z-index: 0;
}

/* Fade the bottom so the large “WEAVE MARK” word never competes with text */
.card.weavemark-watermark::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(to bottom,
               transparent 58%,
               rgba(18, 0, 27, .85) 88%,
               rgba(18, 0, 27, 1) 100%);
  pointer-events: none;
  z-index: 0;  /* stays under content, above the mark */
}

/* Keep card content above the watermark layers */
.card.weavemark-watermark > * {
  position: relative;
  z-index: 1;
}

/* Per-card micro-tuning (all equal for now, easy to tweak later) */
#equivalence-lemma.weavemark-watermark::before,
#truth-lands.weavemark-watermark::before,
#fear-alchemy.weavemark-watermark::before,
#mutual-pact.weavemark-watermark::before {
  background-position: center 32%;
  background-size: 520px auto;
}