/* ═══════════════════════════════════════════════════════════════════
   GUARDIANS · THE TERRA ARCHIVE (archive.css)
   The reading room of the canon: the documents that win arguments.
   Erez's archive cabinet stands at the title; the Core waits behind
   the page's ONE gold door; the Canon Shelf carries the citation law
   as its inscription; the Table Drawer holds the play aids; the GM's
   drawer is closed with TRUE WAX (the Bestiary's seal, reused — the
   vocabulary compounds). portal.css is LAW; buttons are the uniform
   ghost from portal-plus.
   ═══════════════════════════════════════════════════════════════════ */

/* Band intro (the hero carries the name now — portal grammar) */
.ar-sub {
  font-family: var(--f-arc); font-style: italic;
  color: #ab9fc4; font-size: 1.02rem;
}
.ar-intro { text-align: center; max-width: 720px; margin: 0 auto 6px; }
.ar-legend { font-size: 0.78rem; color: #9d92b8; margin: 0 auto 8px; }

/* The Canon Shelf: the cabinet presides */
.ar-canonrow {
  max-width: 1100px; margin: 0 auto; display: flex;
  align-items: center; gap: clamp(18px, 3vw, 40px); flex-wrap: wrap;
}
.ar-cabinet {
  flex: 0 1 clamp(150px, 17vw, 215px); width: clamp(150px, 17vw, 215px); height: auto;
  filter: drop-shadow(0 18px 22px rgba(0, 0, 0, 0.7)) drop-shadow(0 0 24px rgba(183, 154, 224, 0.14));
  margin: 0 auto;
}
.ar-canonrow .ar-canon { flex: 1 1 420px; max-width: none; margin: 0; }

/* ── The altar: one gold door ── */
.ar-altar {
  max-width: 760px; margin: 26px auto 0; text-align: center;
  border: 1px solid rgba(183, 154, 224, 0.22); border-radius: 12px;
  background: rgba(16, 13, 30, 0.72); padding: clamp(24px, 4vw, 44px);
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.5);
}
.ar-altar h2 { font-family: var(--f-arc); font-weight: 400; font-size: clamp(1.3rem, 2.6vw, 1.8rem); margin: 0 0 10px; color: #ffe3ae; }
.ar-altar p { font-family: var(--f-arc); line-height: 1.7; color: #c9bfdd; margin: 0 0 20px; }

/* ── The Canon Shelf ── */
.ar-shelfhead {
  max-width: 1100px; margin: 44px auto 6px; display: flex; align-items: baseline; gap: 12px;
  font-size: 0.7rem; font-weight: 700; letter-spacing: 0.26em; text-transform: uppercase; color: #d8b06a;
}
.ar-shelfhead::after { content: ""; flex: 1 1 auto; border-top: 1px solid rgba(216, 176, 106, 0.3); }
.ar-inscription {
  max-width: 1100px; margin: 0 auto 16px; font-family: var(--f-arc); font-style: italic;
  color: #9d92b8; font-size: 0.95rem;
}
.ar-inscription b { color: #d8b06a; font-weight: 400; }
.ar-canon { max-width: 1100px; margin: 0 auto; display: grid; gap: 12px; }
.ar-tome {
  display: flex; align-items: center; gap: clamp(14px, 2.4vw, 28px); flex-wrap: wrap;
  border: 1px solid rgba(216, 176, 106, 0.28); border-radius: 10px;
  background: linear-gradient(rgba(20, 16, 34, 0.85), rgba(14, 11, 26, 0.9));
  padding: clamp(16px, 2.6vw, 26px);
}
.ar-tome .ico { font-size: 1.7rem; flex: 0 0 auto; filter: drop-shadow(0 2px 6px rgba(0,0,0,.6)); }
.ar-tome .tx { flex: 1 1 260px; min-width: 0; }
.ar-tome h3 { font-family: var(--f-arc); font-weight: 400; font-size: 1.15rem; margin: 0 0 4px; color: #f0eaf8; }
.ar-tome p { margin: 0; font-family: var(--f-arc); color: #ab9fc4; line-height: 1.6; }
.ar-tome .btn-ghost { flex: 0 0 auto; }

/* ── The Table Drawer (play aids) ── */
.ar-grid {
  max-width: 1100px; margin: 0 auto; display: grid; gap: 14px;
  grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
}
.ar-card {
  display: flex; flex-direction: column; gap: 8px;
  border: 1px solid rgba(183, 154, 224, 0.2); border-radius: 10px;
  background: rgba(16, 13, 30, 0.72); padding: 20px;
  transition: border-color 0.25s ease, box-shadow 0.25s ease;
}
.ar-card:hover { border-color: rgba(183, 154, 224, 0.45); box-shadow: 0 0 24px rgba(183, 154, 224, 0.12); }
.ar-card .ico { font-size: 1.4rem; }
.ar-card h3 { font-family: var(--f-arc); font-weight: 400; font-size: 1.02rem; margin: 0; color: #f0eaf8; }
.ar-card p { margin: 0; font-family: var(--f-arc); font-size: 0.92rem; color: #ab9fc4; line-height: 1.55; flex: 1 1 auto; }
.ar-card .btn-ghost { align-self: flex-start; padding: 12px 22px; font-size: 0.72rem; }

/* spoiler badges */
.sp { display: inline-block; font-size: 0.62rem; font-weight: 700; letter-spacing: 0.1em; border-radius: 999px; padding: 1px 9px; vertical-align: middle; margin-left: 6px; }
.sp.g { color: #9fd8a8; border: 1px solid rgba(120, 200, 140, 0.45); }
.sp.o { color: #e8c088; border: 1px solid rgba(230, 180, 110, 0.45); }
.sp.r { color: #e89a90; border: 1px solid rgba(220, 110, 95, 0.5); }

/* ── The GM's Sealed Drawer ── */
.ar-sealed {
  max-width: 1100px; margin: 0 auto; position: relative;
  border: 1px solid rgba(220, 110, 95, 0.3); border-radius: 10px;
  background: linear-gradient(rgba(26, 12, 16, 0.8), rgba(16, 10, 16, 0.88));
  padding: 22px 24px; display: flex; align-items: center; gap: clamp(14px, 2.4vw, 28px); flex-wrap: wrap;
}
.ar-sealed .wax {
  flex: 0 0 84px; width: 84px; height: 82px;
  background: url("../images/bestiary/wax-seal.webp") center / contain no-repeat;
  display: flex; align-items: center; justify-content: center;
  font-size: 0.5rem; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase;
  color: rgba(255, 226, 210, 0.95); text-align: center; padding: 20px; box-sizing: border-box;
  text-shadow: 0 1px 2px rgba(60, 6, 8, 0.9); transform: rotate(-8deg);
  filter: drop-shadow(0 4px 7px rgba(0, 0, 0, 0.45));
}
.ar-sealed .tx { flex: 1 1 260px; min-width: 0; }
.ar-sealed h3 { font-family: var(--f-arc); font-weight: 400; font-size: 1.1rem; margin: 0 0 4px; color: #f0d8d2; }
.ar-sealed p { margin: 0; font-family: var(--f-arc); color: #c4a8a8; line-height: 1.6; }
.ar-sealed .btn-ghost { flex: 0 0 auto; }
.ar-sealed .btn-ghost:hover { border-color: rgba(220, 110, 95, 0.7); color: #f0c0b6; box-shadow: 0 0 22px rgba(220, 110, 95, 0.22); }

/* ── The Living Tools bridge ── */
.ar-bridge { max-width: 1100px; margin: 0 auto; display: flex; flex-wrap: wrap; gap: 12px; }
.ar-chip {
  display: inline-flex; align-items: baseline; gap: 8px;
  font-family: var(--f-ui); font-size: 0.74rem; font-weight: 700;
  letter-spacing: 0.14em; text-transform: uppercase; text-decoration: none;
  color: var(--arc-hi); border: 1px solid var(--arc-soft); border-radius: 999px;
  padding: 12px 22px; background: transparent;
  transition: border-color 0.3s ease, color 0.3s ease, box-shadow 0.3s ease;
}
.ar-chip:hover { border-color: var(--arc); color: #f2ecfa; box-shadow: 0 0 22px var(--arc-glow); }
.ar-chip .n { font-size: 0.68rem; color: #9d92b8; letter-spacing: 0.04em; }

/* ── The Lunara band ── */
.ar-lunara {
  max-width: 900px; margin: 0 auto; text-align: center;
  border-top: 1px solid rgba(183, 154, 224, 0.18); padding-top: 34px;
}
.ar-lunara h2 { font-family: var(--f-arc); font-weight: 400; font-size: 1.3rem; margin: 0 0 12px; color: #f0eaf8; }
.ar-lunara p { font-family: var(--f-arc); line-height: 1.75; color: #ab9fc4; margin: 0 0 14px; }
.ar-lunara .glimpses { font-style: italic; color: #9d92b8; }

.ar-gap { height: clamp(30px, 5vw, 54px); }