@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400;600;900&family=EB+Garamond:ital,wght@0,400;0,500;0,600;1,400&family=Crimson+Pro:ital,wght@0,300;0,400;1,300&display=swap&font-display=swap');

/* ══ css/platform.css ══ */
/* ===========================================================================
 * platform.css — landing, DM authentication, and the campaign dashboard.
 *
 * Built entirely on the existing --cx-* tokens from theme.css, so the new
 * screens read as the same product as the campaign itself: same gold, same
 * parchment text, same dark ground. Nothing here is a second design system.
 * ======================================================================== */

/* In dashboard mode the campaign app is present in the DOM but not this
   page's job. Hide it wholesale rather than unpicking the markup. */
html.platform-dashboard body > *:not(#platform-root) { display: none !important; }
html.platform-dashboard body { overflow: auto; }

#platform-root { display: none; }
html.platform-dashboard #platform-root,
#platform-root:not(:empty) { display: block; }

.platform-shell {
  max-width: 1120px;
  margin: 0 auto;
  padding: clamp(24px, 5vw, 64px) clamp(16px, 4vw, 32px) 96px;
  color: var(--cx-text, #e8dcc0);
  font-family: inherit;
}

/* --- hero / headings ---------------------------------------------------- */

.platform-hero { text-align: center; margin-bottom: clamp(24px, 4vw, 48px); }

.platform-eyebrow {
  margin: 0 0 10px;
  font-size: 0.74rem;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--cx-accent-deep, #c9a24a);
}

.platform-title {
  margin: 0 0 14px;
  font-size: clamp(1.9rem, 4.4vw, 3rem);
  line-height: 1.12;
  font-weight: 600;
  color: var(--cx-accent, #f4c867);
}

.platform-title--sm { font-size: clamp(1.3rem, 2.6vw, 1.75rem); margin-bottom: 0; }

.platform-lede {
  margin: 0 auto;
  max-width: 62ch;
  font-size: 1.02rem;
  line-height: 1.65;
  color: var(--cx-text-soft, #b0a488);
}

/* --- cards -------------------------------------------------------------- */

.platform-card {
  background: var(--cx-surface, #14100a);
  border: 1px solid var(--cx-border, #2a2418);
  border-radius: 14px;
  padding: clamp(20px, 3vw, 32px);
  box-shadow: 0 18px 48px rgba(0, 0, 0, 0.42);
}

.platform-card--narrow { max-width: 460px; margin: 0 auto; }

.platform-card-title {
  margin: 0 0 18px;
  font-size: 1.15rem;
  font-weight: 600;
  color: var(--cx-text-strong, #f0e7d2);
}

/* --- forms -------------------------------------------------------------- */

.platform-form { display: grid; gap: 16px; }

.platform-label {
  display: grid;
  gap: 6px;
  font-size: 0.78rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--cx-text-dim, #8a8377);
}

.platform-input {
  width: 100%;
  box-sizing: border-box;
  padding: 11px 13px;
  background: var(--cx-field, #100c06);
  border: 1px solid var(--cx-border, #2a2418);
  border-radius: 8px;
  color: var(--cx-text, #e8dcc0);
  font-size: 0.98rem;
  font-family: inherit;
  letter-spacing: normal;
  text-transform: none;
}

.platform-input:focus {
  outline: none;
  border-color: var(--cx-border-strong, #5a4a24);
  box-shadow: 0 0 0 3px rgba(244, 200, 103, 0.12);
}

/* --- buttons ------------------------------------------------------------ */

.platform-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 10px 16px;
  min-height: 40px;
  background: var(--cx-surface-2, #171208);
  border: 1px solid var(--cx-border, #2a2418);
  border-radius: 8px;
  color: var(--cx-text, #e8dcc0);
  font: inherit;
  font-size: 0.9rem;
  text-decoration: none;
  cursor: pointer;
  transition: border-color 0.15s ease, background 0.15s ease;
}

.platform-btn:hover:not(:disabled) { border-color: var(--cx-border-strong, #5a4a24); }
.platform-btn:disabled { opacity: 0.45; cursor: not-allowed; }

.platform-btn--primary {
  background: var(--cx-accent, #f4c867);
  border-color: var(--cx-accent, #f4c867);
  color: var(--cx-on-accent, #161006);
  font-weight: 600;
}

.platform-btn--danger { color: var(--cx-danger, #e06060); }
.platform-btn--danger:hover:not(:disabled) { border-color: var(--cx-danger, #e06060); }

.platform-links {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  justify-content: center;
  margin-top: 20px;
}

.platform-link {
  background: none;
  border: none;
  padding: 0;
  color: var(--cx-accent-deep, #c9a24a);
  font: inherit;
  font-size: 0.86rem;
  text-decoration: underline;
  text-underline-offset: 3px;
  cursor: pointer;
}

.platform-link:hover { color: var(--cx-accent, #f4c867); }

/* --- status ------------------------------------------------------------- */

.platform-status {
  display: none;
  margin: 0 0 16px;
  padding: 10px 13px;
  border-radius: 8px;
  background: var(--cx-field, #100c06);
  border: 1px solid var(--cx-border, #2a2418);
  color: var(--cx-text-soft, #b0a488);
  font-size: 0.88rem;
  line-height: 1.5;
}

.platform-status.is-visible { display: block; }
.platform-status.is-error { color: var(--cx-danger, #e06060); border-color: var(--cx-danger-deep, #7a2b2b); }

.platform-note { margin: 0 0 16px; color: var(--cx-text-soft, #b0a488); line-height: 1.6; }
.platform-note.is-error { color: var(--cx-danger, #e06060); }

/* --- dashboard bar + usage ---------------------------------------------- */

.platform-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  flex-wrap: wrap;
  margin-bottom: 28px;
  padding-bottom: 20px;
  border-bottom: 1px solid var(--cx-border, #2a2418);
}

.platform-usage {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
  margin-bottom: 24px;
}

.platform-usage__count {
  font-size: 0.82rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--cx-accent-deep, #c9a24a);
}

/* --- campaign cards ----------------------------------------------------- */

.campaign-grid {
  display: grid;
  gap: 20px;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
}

.campaign-card {
  display: flex;
  flex-direction: column;
  background: var(--cx-surface, #14100a);
  border: 1px solid var(--cx-border, #2a2418);
  border-radius: 14px;
  overflow: hidden;
}

.campaign-card.is-archived { opacity: 0.62; }

.campaign-card__art {
  height: 132px;
  background: linear-gradient(140deg, var(--cx-surface-3, #1c1610), var(--cx-bg-2, #0f0c07));
  background-size: cover;
  background-position: center;
  display: flex;
  align-items: center;
  justify-content: center;
  border-bottom: 1px solid var(--cx-border, #2a2418);
}

.campaign-card__glyph { font-size: 2rem; color: var(--cx-accent-dim, #7a6432); }

.campaign-card__body { padding: 16px 18px 4px; flex: 1; }

.campaign-card__name {
  margin: 0 0 6px;
  font-size: 1.08rem;
  font-weight: 600;
  color: var(--cx-text-strong, #f0e7d2);
}

.campaign-card__meta { margin: 0 0 10px; font-size: 0.82rem; color: var(--cx-text-dim, #8a8377); }

.campaign-tag {
  display: inline-block;
  padding: 1px 7px;
  border: 1px solid var(--cx-border-strong, #5a4a24);
  border-radius: 999px;
  font-size: 0.68rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--cx-accent-deep, #c9a24a);
}

.campaign-card__link { margin: 0; font-size: 0.78rem; color: var(--cx-text-faint, #5c574d); overflow-wrap: anywhere; }
.campaign-card__link code { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; }

.campaign-card__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 16px 18px 18px;
}

.campaign-card__actions .platform-btn { flex: 1 1 auto; font-size: 0.82rem; padding: 8px 12px; min-height: 36px; }
.campaign-card__actions .platform-btn--primary { flex-basis: 100%; }

@media (max-width: 560px) {
  .platform-bar { flex-direction: column; align-items: flex-start; }
  .campaign-card__actions .platform-btn { flex-basis: calc(50% - 4px); }
}

/* ══ css/storefront.css ══ */
/* ==========================================================================
 * storefront.css — the public storefront, redesigned (v67).
 *
 * Parchment-and-leather look after the reference art: dark leather header
 * and footer, warm parchment sections, crimson wax-seal CTAs, gold accents.
 * All colours are local --sfp-* tokens scoped to .sf-page so the storefront
 * can be light while the app behind it stays dark; platform-* components
 * that appear inside .sf-page (cards, inputs, buttons on the utility pages)
 * are re-skinned here under that scope.
 *
 * Kept invariants (tests/storefront.test.js #15):
 *   breakpoints 860px + 560px, :focus-visible, prefers-reduced-motion,
 *   overflow-wrap, 46px minimum CTA tap targets.
 * ======================================================================== */

.sf-page {
  /* palette */
  --sfp-dark: #17110d;          /* leather header/footer */
  --sfp-dark-2: #221a13;
  --sfp-parchment: #f2e8d2;     /* main section background */
  --sfp-parchment-2: #eadcbe;   /* alternate section background */
  --sfp-card: #f8f1de;
  --sfp-ink: #2c2015;           /* body text on parchment */
  --sfp-ink-soft: #6a5843;
  --sfp-gold: #a97e2f;
  --sfp-gold-soft: #d9c08a;
  --sfp-gold-line: #c9b083;
  --sfp-crimson: #77202c;       /* wax-seal red */
  --sfp-crimson-2: #8d2836;
  --sfp-cream: #f6ecd6;         /* light text on dark */

  min-height: 100vh;
  background: var(--sfp-parchment);
  color: var(--sfp-ink);
  font-family: 'EB Garamond', Georgia, serif;
  font-size: 17.5px;
  line-height: 1.65;
  overflow-x: hidden;
}
.sf-page * { overflow-wrap: break-word; }

.sf-page a { color: var(--sfp-crimson); text-underline-offset: 3px; }
.sf-page a:hover { color: var(--sfp-crimson-2); }

.sf-page :focus-visible,
.sf-page a:focus-visible,
.sf-page button:focus-visible,
.sf-page input:focus-visible,
.sf-page summary:focus-visible {
  outline: 2px solid var(--sfp-gold);
  outline-offset: 3px;
  border-radius: 2px;
}

/* ── buttons (re-skin platform-btn inside the storefront) ─────────────── */

.sf-page .platform-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 46px;
  padding: 10px 26px;
  border: 1px solid var(--sfp-ink);
  border-radius: 3px;
  background: transparent;
  color: var(--sfp-ink);
  font-family: 'EB Garamond', Georgia, serif;
  font-size: 16.5px;
  font-weight: 600;
  letter-spacing: .02em;
  text-decoration: none;
  cursor: pointer;
  transition: background .15s ease, color .15s ease, border-color .15s ease, transform .15s ease;
}
.sf-page .platform-btn:hover { background: rgba(44, 32, 21, .08); color: var(--sfp-ink); }
.sf-page .platform-btn--primary {
  background: var(--sfp-crimson);
  border-color: var(--sfp-crimson);
  color: var(--sfp-cream);
  box-shadow: 0 2px 10px rgba(60, 16, 22, .35);
}
.sf-page .platform-btn--primary:hover {
  background: var(--sfp-crimson-2);
  border-color: var(--sfp-crimson-2);
  color: #fff;
  transform: translateY(-1px);
}
.sf-page .platform-btn:disabled { opacity: .55; cursor: not-allowed; transform: none; }

/* ── test-mode banner ─────────────────────────────────────────────────── */

.sf-testmode {
  background: #5a3c10;
  color: #ffe9bd;
  text-align: center;
  padding: 9px 16px;
  font-size: 15px;
  letter-spacing: .04em;
  border-bottom: 1px solid #8a6120;
}

/* ── header ───────────────────────────────────────────────────────────── */

.sf-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 14px clamp(18px, 5vw, 56px);
  background: var(--sfp-dark);
  border-bottom: 1px solid #3a2c1c;
}

.sf-wordmark {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  text-decoration: none;
  color: var(--sfp-cream);
}
.sf-wordmark:hover { color: var(--sfp-gold-soft); }
.sf-wordmark__emblem { width: 54px; height: auto; filter: brightness(1.5) sepia(.25); }
/* v68.7.1: the crest logo is full-color art with its own wordmark — no
   recolor filter, sized as the whole lockup. */
.sf-wordmark__emblem--full { width: auto; height: 56px; filter: none; }
.sf-footer__brand .sf-wordmark__emblem--full { height: 64px; }
.sf-wordmark__text { display: flex; flex-direction: column; line-height: 1.15; }
.sf-wordmark__the {
  font-size: 12.5px;
  letter-spacing: .06em;
  color: var(--sfp-gold-soft);
}
.sf-wordmark__name {
  font-family: 'Cinzel', serif;
  font-size: 17px;
  font-weight: 600;
  letter-spacing: .04em;
}

.sf-nav { display: flex; align-items: center; gap: clamp(12px, 2.2vw, 26px); flex-wrap: wrap; }
.sf-nav a {
  color: #cdbfa4;
  text-decoration: none;
  font-size: 16px;
  letter-spacing: .02em;
}
.sf-nav a:hover { color: var(--sfp-gold-soft); }
.sf-nav .platform-btn--primary { min-height: 46px; padding: 8px 20px; font-size: 15.5px; }

/* ── hero ─────────────────────────────────────────────────────────────── */

.sf-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr);
  align-items: center;
  gap: clamp(24px, 5vw, 64px);
  padding: clamp(40px, 7vw, 96px) clamp(18px, 6vw, 72px);
  background:
    radial-gradient(120% 90% at 85% 20%, rgba(169, 126, 47, .14), transparent 60%),
    var(--sfp-parchment);
}
.sf-hero__title {
  font-family: 'Cinzel', serif;
  font-weight: 700;
  font-size: clamp(34px, 4.6vw, 56px);
  line-height: 1.12;
  margin: 0 0 20px;
  color: var(--sfp-ink);
}
.sf-hero__lede {
  font-size: 19px;
  max-width: 34em;
  color: var(--sfp-ink-soft);
  margin: 0 0 30px;
}
.sf-hero__actions { display: flex; gap: 14px; flex-wrap: wrap; }
.sf-hero__art { display: flex; justify-content: center; }
.sf-hero__art img {
  width: min(100%, 460px);
  height: auto;
  filter: drop-shadow(0 26px 34px rgba(40, 26, 12, .38));
  transform: rotate(-2deg);
}

/* ── sections ─────────────────────────────────────────────────────────── */

.sf-section {
  padding: clamp(44px, 6vw, 84px) clamp(18px, 6vw, 72px);
  max-width: 1180px;
  margin: 0 auto;
  text-align: center;
}
.sf-section__kicker {
  font-family: 'Cinzel', serif;
  font-size: 12.5px;
  font-weight: 600;
  letter-spacing: .28em;
  text-transform: uppercase;
  color: var(--sfp-crimson);
  margin: 0 0 12px;
}
.sf-section__title {
  font-family: 'Cinzel', serif;
  font-weight: 700;
  font-size: clamp(26px, 3.2vw, 38px);
  line-height: 1.2;
  margin: 0 0 10px;
  color: var(--sfp-ink);
}
.sf-section__lede {
  max-width: 46em;
  margin: 0 auto 8px;
  color: var(--sfp-ink-soft);
  font-size: 18px;
}
.sf-flourish {
  display: block;
  width: min(340px, 70%);
  height: auto;
  margin: 6px auto 10px;
  opacity: .85;
}

/* ── features ─────────────────────────────────────────────────────────── */

.sf-features {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 30px 34px;
  margin-top: 34px;
  text-align: center;
}
.sf-feature { padding: 6px 6px 0; }
.sf-feature__icon {
  width: 72px;
  height: 72px;
  margin: 0 auto 12px;
  display: block;
}
.sf-feature h3 {
  font-family: 'Cinzel', serif;
  font-size: 16.5px;
  font-weight: 600;
  letter-spacing: .02em;
  margin: 0 0 8px;
  color: var(--sfp-ink);
}
.sf-feature p { margin: 0; font-size: 16px; color: var(--sfp-ink-soft); }

/* ── how it works ─────────────────────────────────────────────────────── */

#how { background: var(--sfp-parchment-2); max-width: none; }
#how .sf-steps,
#how .sf-section__title,
#how .sf-section__kicker { max-width: 1180px; margin-left: auto; margin-right: auto; }

.sf-steps {
  list-style: none;
  padding: 0;
  margin: 40px auto 8px;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 26px 22px;
  counter-reset: sf-step;
  text-align: center;
}
.sf-step__badge {
  width: 116px;
  height: 116px;
  /* v67.5a: the badge PNGs are normalized to a shared square canvas with the
     coin at ~93%; object-fit guards any future art that isn't. */
  object-fit: contain;
  display: block;
  margin: 0 auto 12px;
  filter: drop-shadow(0 8px 12px rgba(40, 26, 12, .25));
}
.sf-step h3 {
  font-family: 'Cinzel', serif;
  font-size: 15.5px;
  font-weight: 600;
  margin: 0 0 6px;
  color: var(--sfp-ink);
}
.sf-step p { margin: 0; font-size: 15.5px; color: var(--sfp-ink-soft); }
.sf-steps__cta { margin: 30px 0 0; }

/* ── pricing ──────────────────────────────────────────────────────────── */

.sf-pricing {
  display: flex;
  justify-content: center;
  gap: 28px;
  flex-wrap: wrap;
  margin-top: 30px;
}
.sf-plan {
  background: var(--sfp-card);
  border: 1px solid var(--sfp-gold-line);
  border-radius: 6px;
  box-shadow: 0 14px 34px rgba(56, 38, 18, .16);
  padding: 34px 34px 28px;
  width: min(100%, 400px);
  text-align: center;
  position: relative;
}
.sf-plan::before {
  content: '';
  position: absolute;
  inset: 8px;
  border: 1px solid rgba(169, 126, 47, .35);
  border-radius: 4px;
  pointer-events: none;
}
.sf-plan__name {
  font-family: 'Cinzel', serif;
  font-size: 19px;
  font-weight: 700;
  margin: 0 0 6px;
  color: var(--sfp-ink);
}
.sf-plan__price {
  font-family: 'Cinzel', serif;
  font-size: 44px;
  font-weight: 700;
  color: var(--sfp-crimson);
  margin: 4px 0 2px;
}
.sf-plan__price--tbd { font-size: 19px; color: var(--sfp-ink-soft); font-weight: 600; }
.sf-plan__billing {
  font-size: 14.5px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--sfp-gold);
  margin: 0 0 18px;
}
.sf-plan__list {
  list-style: none;
  padding: 0;
  margin: 0 0 22px;
  text-align: left;
}
.sf-plan__list li {
  padding: 7px 0 7px 28px;
  border-bottom: 1px solid rgba(169, 126, 47, .22);
  position: relative;
  font-size: 16px;
}
.sf-plan__list li:last-child { border-bottom: 0; }
.sf-plan__list li::before {
  content: '\2726';
  position: absolute;
  left: 4px;
  color: var(--sfp-gold);
}
.sf-plan .sf-cta { width: 100%; }
.sf-plan__finalsale {
  /* Required disclosure beside every purchase button: small but legible. */
  margin: 10px 0 0;
  font-size: 11px;
  line-height: 1.5;
  color: var(--sfp-ink-soft);
}
.sf-plan__tax { font-size: 13.5px; color: var(--sfp-ink-soft); margin: 12px 0 0; }
.sf-pricing-note { margin-top: 22px; color: var(--sfp-ink-soft); font-size: 15px; }

/* ── FAQ ──────────────────────────────────────────────────────────────── */

.sf-faq {
  max-width: 760px;
  margin: 26px auto 0;
  text-align: left;
}
.sf-faq details {
  border: 1px solid var(--sfp-gold-line);
  background: var(--sfp-card);
  border-radius: 5px;
  margin-bottom: 12px;
  padding: 0 20px;
}
.sf-faq summary {
  cursor: pointer;
  padding: 15px 4px;
  font-weight: 600;
  font-size: 17px;
  color: var(--sfp-ink);
  list-style-position: inside;
}
.sf-faq summary:hover { color: var(--sfp-crimson); }
.sf-faq__a { margin: 0; padding: 0 4px 16px; color: var(--sfp-ink-soft); }

/* ── CTA band ─────────────────────────────────────────────────────────── */

.sf-band {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: clamp(36px, 5vw, 60px) clamp(18px, 6vw, 72px);
  background:
    linear-gradient(rgba(23, 17, 13, .06), rgba(23, 17, 13, .06)),
    var(--sfp-parchment-2);
  border-top: 1px solid var(--sfp-gold-line);
  border-bottom: 1px solid var(--sfp-gold-line);
}
.sf-band__inner { text-align: center; flex: 1; }
.sf-band__inner h2 {
  font-family: 'Cinzel', serif;
  font-size: clamp(24px, 3vw, 34px);
  font-weight: 700;
  margin: 0 0 8px;
  color: var(--sfp-ink);
}
.sf-band__inner p { margin: 0 0 20px; color: var(--sfp-ink-soft); font-size: 17.5px; }
.sf-band__deco { width: clamp(90px, 12vw, 170px); height: auto; opacity: .8; flex-shrink: 0; }

/* ── footer ───────────────────────────────────────────────────────────── */

.sf-footer {
  background: var(--sfp-dark);
  color: #b8a98c;
  padding: clamp(36px, 5vw, 56px) clamp(18px, 6vw, 72px) 26px;
}
.sf-footer__cols {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) repeat(3, minmax(0, 1fr));
  gap: 34px;
  max-width: 1180px;
  margin: 0 auto;
}
.sf-footer__brand p { margin: 14px 0 0; font-size: 15px; max-width: 30em; }
.sf-footer__col { display: flex; flex-direction: column; gap: 9px; }
.sf-footer__col h3 {
  font-family: 'Cinzel', serif;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--sfp-gold-soft);
  margin: 0 0 4px;
}
.sf-footer__col a {
  color: #b8a98c;
  text-decoration: none;
  font-size: 15.5px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.sf-footer__col a:hover { color: var(--sfp-gold-soft); text-decoration: underline; }
.sf-footer__icon { width: 18px; height: 18px; }
.sf-footer__line {
  text-align: center;
  margin: 34px 0 0;
  padding-top: 20px;
  border-top: 1px solid #33281b;
  font-size: 14px;
  color: #8d7f65;
}

/* ── account status panel (signed-in, unlicensed root view) ───────────── */

.sf-status-panel {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  flex-wrap: wrap;
  margin: 0;
  padding: 18px clamp(18px, 6vw, 72px);
  background: var(--sfp-parchment-2);
  border-bottom: 1px solid var(--sfp-gold-line);
  text-align: left;
}
.sf-status-panel__who { margin: 0 0 4px; font-weight: 600; color: var(--sfp-ink); }
.sf-status-panel__state { margin: 0; color: var(--sfp-ink-soft); font-size: 16px; max-width: 52em; }
.sf-status-panel__actions { display: flex; gap: 10px; flex-wrap: wrap; }

.sf-badge {
  display: inline-block;
  padding: 2px 10px;
  border-radius: 20px;
  font-size: 12.5px;
  letter-spacing: .08em;
  text-transform: uppercase;
  border: 1px solid var(--sfp-gold-line);
  background: var(--sfp-card);
  color: var(--sfp-ink-soft);
  vertical-align: middle;
}
.sf-badge--good { border-color: #3c6a3c; color: #2f5a2f; background: #e4eed9; }
.sf-badge--warn { border-color: #9a7420; color: #7a5a12; background: #f6ecc9; }
.sf-badge--bad  { border-color: #8d3040; color: var(--sfp-crimson); background: #f3dcd8; }

/* ── utility pages: cards, forms, notes (redeem / success / legal) ────── */

.sf-narrow { max-width: 720px; text-align: left; }
.sf-narrow .sf-section__title, .sf-narrow .sf-section__kicker { text-align: left; }

.sf-page .platform-card {
  background: var(--sfp-card);
  border: 1px solid var(--sfp-gold-line);
  border-radius: 6px;
  box-shadow: 0 10px 26px rgba(56, 38, 18, .14);
  padding: 26px;
  color: var(--sfp-ink);
}
.sf-page .platform-title {
  font-family: 'Cinzel', serif;
  color: var(--sfp-ink);
  font-size: 22px;
  margin: 0 0 12px;
}
.sf-page .platform-label {
  display: block;
  font-size: 14px;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--sfp-ink-soft);
  margin: 14px 0 6px;
}
.sf-page .platform-input {
  width: 100%;
  min-height: 46px;
  padding: 9px 12px;
  font-family: 'EB Garamond', Georgia, serif;
  font-size: 17px;
  color: var(--sfp-ink);
  background: #fffdf6;
  border: 1px solid var(--sfp-gold-line);
  border-radius: 4px;
}
.sf-page .platform-input:focus { border-color: var(--sfp-gold); }
.sf-page .platform-note { color: var(--sfp-ink-soft); font-size: 15.5px; }
.sf-page .platform-status {
  min-height: 1.4em;
  margin: 10px 0;
  color: var(--sfp-ink-soft);
}
.sf-page .platform-status.is-error { color: var(--sfp-crimson); }

.sf-spinner {
  display: inline-block;
  width: 22px;
  height: 22px;
  border: 3px solid var(--sfp-gold-line);
  border-top-color: var(--sfp-crimson);
  border-radius: 50%;
  animation: sf-spin 1s linear infinite;
}
@keyframes sf-spin { to { transform: rotate(360deg); } }

/* ── motion & responsiveness ──────────────────────────────────────────── */

@media (prefers-reduced-motion: reduce) {
  .sf-page *, .sf-page *::before, .sf-page *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
  .sf-hero__art img { transform: none; }
}

@media (max-width: 1020px) {
  .sf-features { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sf-steps { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .sf-footer__cols { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 860px) {
  .sf-header { flex-direction: column; align-items: stretch; gap: 12px; }
  .sf-wordmark { justify-content: center; }
  .sf-nav { justify-content: center; }
  .sf-hero { grid-template-columns: 1fr; text-align: center; }
  .sf-hero__lede { margin-left: auto; margin-right: auto; }
  .sf-hero__actions { justify-content: center; }
  .sf-hero__art { order: -1; }
  .sf-hero__art img { width: min(70%, 340px); }
  .sf-band { flex-direction: column; }
  .sf-band__deco--right { display: none; }
}

@media (max-width: 560px) {
  .sf-page { font-size: 16.5px; }
  .sf-features { grid-template-columns: 1fr; }
  .sf-steps { grid-template-columns: 1fr; gap: 22px; }
  .sf-step__badge { width: 104px; height: 104px; }
  .sf-footer__cols { grid-template-columns: 1fr; }
  .sf-status-panel { flex-direction: column; align-items: flex-start; }
  .sf-plan { padding: 26px 20px 22px; }
  .sf-band__deco { display: none; }
  .sf-nav .platform-btn--primary { width: 100%; }
}

/* ══ css/theme.css ══ */
/* ── Codex Theme Tokens (v55) ───────────────────────────────────────────────
   The site's entire palette flows from TEN role tokens the DM can retint
   from Admin → Appearance. Every other shade is DERIVED with color-mix so
   one accent change re-tints borders, hovers, gradients, and button text
   coherently. Derived tokens can still be overridden individually (inline
   overrides on <html> win over these :root defaults).
   Defaults reproduce the shipped gold-parchment look exactly. */
:root{
  /* ── the ten DM-facing roles ── */
  --cx-accent:#f4c867;        /* titles, links, gold highlights */
  --cx-accent-deep:#c9a24a;   /* small-caps labels, deep gold */
  --cx-bg:#0d0b08;            /* page background */
  --cx-surface:#14100a;       /* cards and panels */
  --cx-field:#100c06;         /* inputs and wells */
  --cx-text:#e8dcc0;          /* primary text */
  --cx-text-soft:#b0a488;     /* secondary text */
  --cx-text-dim:#8a8377;      /* muted text, hints */
  --cx-danger:#e06060;        /* destructive, errors */
  --cx-success:#7fbf87;       /* confirmations, healthy */

  /* ── derived family ── */
  --cx-accent-bright:color-mix(in srgb,var(--cx-accent) 64%,white);
  --cx-accent-dim:color-mix(in srgb,var(--cx-accent) 48%,var(--cx-bg));
  --cx-on-accent:color-mix(in srgb,var(--cx-accent) 12%,#161006); /* dark text on accent buttons */
  --cx-bg-2:color-mix(in srgb,var(--cx-bg) 60%,var(--cx-surface));
  --cx-surface-2:color-mix(in srgb,var(--cx-surface) 96%,white);
  --cx-surface-3:color-mix(in srgb,var(--cx-surface) 92%,white);
  --cx-border:color-mix(in srgb,var(--cx-accent) 14%,var(--cx-bg));
  --cx-border-strong:color-mix(in srgb,var(--cx-accent) 38%,var(--cx-bg));
  --cx-text-strong:color-mix(in srgb,var(--cx-text) 80%,white);
  --cx-text-faint:color-mix(in srgb,var(--cx-text-dim) 60%,var(--cx-bg));
  --cx-danger-deep:color-mix(in srgb,var(--cx-danger) 58%,black);
  --cx-success-deep:color-mix(in srgb,var(--cx-success) 70%,black);
}

/* ══ css/base.css ══ */
:root{--bg-deep:var(--cx-bg);--bg-surface:var(--cx-bg-2);--bg-card:var(--cx-surface-2);--bg-card-hover:var(--cx-surface-3);--border:var(--cx-border);--border-glow:var(--cx-border-strong);--gold:var(--cx-accent-deep);--gold-bright:var(--cx-accent);--gold-dim:var(--cx-accent-dim);--red:var(--cx-danger-deep);--red-bright:var(--cx-danger);--text-primary:var(--cx-text);--text-secondary:var(--cx-text-soft);--text-dim:var(--cx-text-faint);--divine:#7090c8;--ancient:var(--cx-success);}
*{box-sizing:border-box;margin:0;padding:0;}
body{background:var(--bg-deep);color:var(--text-primary);font-family:'EB Garamond',Georgia,serif;font-size:17px;line-height:1.7;min-height:100vh;}

#sidebar{width:100%;height:58px;display:flex;flex-direction:row;align-items:stretch;position:fixed;top:0;left:0;right:0;background:color-mix(in srgb,var(--cx-bg) 96%,transparent);border-bottom:1px solid color-mix(in srgb,var(--cx-text-strong) 8%,transparent);box-shadow:0 4px 24px rgba(0,0,0,.5);padding:0;z-index:200;overflow:hidden;}
#sidebar-header{flex-shrink:0;display:flex;align-items:center;gap:10px;padding:0 16px 0 14px;border-right:1px solid color-mix(in srgb,var(--cx-text-strong) 10%,transparent);}
#sidebar-header .world-name{display:none;}
#sidebar-header .campaign-title{font-family:'Cinzel',serif;font-size:14px;color:var(--cx-text-strong);letter-spacing:.1em;white-space:nowrap;}
#sidebar-header .campaign-subtitle{display:none;}
.brand-home{display:inline-flex;align-items:center;cursor:pointer;transition:opacity .15s ease;-webkit-tap-highlight-color:transparent;}
.brand-home:hover .campaign-title{color:var(--cx-accent-bright);text-shadow:0 0 10px color-mix(in srgb,var(--cx-accent-bright) 40%,transparent);}
.brand-home:active{opacity:.78;}
.brand-home:focus-visible{outline:2px solid color-mix(in srgb,var(--cx-accent) 60%,transparent);outline-offset:3px;border-radius:6px;}
#sidebar-header:before{content:"✥";font-size:18px;color:var(--cx-accent);flex-shrink:0;}
#nav-groups{display:flex;flex-direction:row;align-items:stretch;flex:1;overflow:hidden;}
.nav-section{position:static;flex-shrink:0;}
.nav-section-label{display:flex;align-items:center;gap:5px;height:58px;padding:0 14px;font-family:'Cinzel',serif;font-size:11px;font-weight:600;letter-spacing:.07em;color:color-mix(in srgb,var(--cx-text-strong) 72%,transparent);text-transform:uppercase;cursor:pointer;white-space:nowrap;border-bottom:3px solid transparent;transition:color .15s,border-color .15s;user-select:none;}
.nav-section-label::after{content:"▾";font-size:9px;margin-left:3px;opacity:.55;}
.nav-section:hover>.nav-section-label,.nav-section.open>.nav-section-label{color:var(--cx-accent);border-bottom-color:var(--cx-accent);}
.nav-section>.nav-dropdown{display:none;position:fixed;top:58px;min-width:210px;background:color-mix(in srgb,var(--cx-bg) 98%,transparent);border:1px solid color-mix(in srgb,var(--cx-accent-deep) 30%,transparent);border-top:2px solid var(--cx-accent);box-shadow:0 16px 48px rgba(0,0,0,.7);z-index:500;padding:6px 0;}
.nav-section:hover>.nav-dropdown,.nav-section.open>.nav-dropdown{display:block;}
.nav-item{display:flex;align-items:center;gap:9px;padding:9px 18px;color:color-mix(in srgb,var(--cx-text-strong) 75%,transparent);font-family:'EB Garamond',serif;font-size:15px;cursor:pointer;white-space:nowrap;transition:color .12s,background .12s;}
.nav-item:hover{color:var(--cx-accent);background:color-mix(in srgb,var(--cx-accent-deep) 10%,transparent);}
.nav-item.active{color:var(--cx-accent);background:color-mix(in srgb,var(--cx-accent-deep) 13%,transparent);padding-left:14px;border-left:2px solid var(--cx-accent);}
.nav-item .icon{font-size:14px;width:20px;text-align:center;flex-shrink:0;}
#main{margin-left:0;padding-top:58px;}







.page-header{margin-bottom:48px;padding-bottom:24px;border-bottom:1px solid var(--border);}
.page-eyebrow{font-family:'Cinzel',serif;font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold-dim);margin-bottom:10px;}
.page-title{font-family:'Cinzel',serif;font-size:36px;font-weight:900;color:var(--text-primary);line-height:1.1;margin-bottom:14px;}
.page-description{font-family:'Crimson Pro',serif;font-style:italic;font-size:18px;color:var(--text-secondary);max-width:680px;line-height:1.6;}
.section{margin-bottom:48px;}
.section-title{font-family:'Cinzel',serif;font-size:13px;font-weight:600;letter-spacing:.15em;text-transform:uppercase;color:var(--gold);margin-bottom:20px;padding-bottom:8px;border-bottom:1px solid var(--border);}
.card-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px;}
.card{background:var(--bg-card);border:1px solid var(--border);padding:20px;cursor:pointer;transition:transform .2s,box-shadow .2s,border-color .2s;position:relative;}
.card:hover{background:var(--bg-card-hover);border-color:var(--border-glow);}
.card::before{content:'';position:absolute;top:0;left:0;width:3px;height:100%;background:var(--gold-dim);opacity:0;transition:opacity .2s;}
.card:hover::before{opacity:1;}
.card-tag{font-family:'Cinzel',serif;font-size:9px;letter-spacing:.15em;text-transform:uppercase;color:var(--text-dim);margin-bottom:8px;}
.card-title{font-family:'Cinzel',serif;font-size:16px;font-weight:600;color:var(--text-primary);margin-bottom:8px;line-height:1.3;}
.card-body{font-size:14px;color:var(--text-secondary);line-height:1.6;}
.card-meta{margin-top:12px;padding-top:12px;border-top:1px solid var(--border);display:flex;gap:12px;flex-wrap:wrap;}
.pill{font-family:'Cinzel',serif;font-size:9px;letter-spacing:.1em;text-transform:uppercase;padding:3px 8px;border:1px solid var(--border);color:var(--text-secondary);border-radius:2px;}
.pill.gold{border-color:var(--gold-dim);color:var(--gold);}
.pill.red{border-color:var(--red);color:var(--red-bright);}
.pill.blue{border-color:#2a3a5a;color:var(--divine);}
.pill.green{border-color:var(--cx-success-deep);color:var(--ancient);}
.stat-block{background:var(--bg-card);border:1px solid var(--border);padding:24px;margin-bottom:20px;}
.stat-block-header{font-family:'Cinzel',serif;font-size:20px;font-weight:700;color:var(--text-primary);margin-bottom:4px;}
.stat-block-subtitle{font-family:'Crimson Pro',serif;font-style:italic;color:var(--text-secondary);font-size:15px;margin-bottom:16px;padding-bottom:12px;border-bottom:1px solid var(--border);}
.stat-row{display:flex;gap:8px;margin-bottom:6px;font-size:15px;}
.stat-label{font-family:'Cinzel',serif;font-size:11px;font-weight:600;letter-spacing:.08em;color:var(--gold);min-width:140px;padding-top:2px;}
.stat-value{color:var(--text-primary);}
.lore-block{background:var(--bg-card);border-left:3px solid var(--gold-dim);padding:20px 24px;margin:20px 0;font-family:'Crimson Pro',serif;font-style:italic;font-size:17px;color:var(--text-secondary);line-height:1.8;}
.prose{color:var(--text-primary);font-size:16px;line-height:1.8;}
.prose p{margin-bottom:16px;}
.prose h3{font-family:'Cinzel',serif;font-size:14px;font-weight:600;color:var(--gold);letter-spacing:.1em;text-transform:uppercase;margin:28px 0 12px;}
.prose ul{padding-left:20px;margin-bottom:16px;}
.prose li{margin-bottom:6px;color:var(--text-secondary);}
.prose strong{color:var(--gold-bright);font-weight:600;}
.timeline{position:relative;padding-left:32px;}
.timeline::before{content:'';position:absolute;left:8px;top:0;bottom:0;width:1px;background:var(--border);}
.timeline-item{position:relative;margin-bottom:32px;}
.timeline-dot{position:absolute;left:-28px;top:6px;width:10px;height:10px;border-radius:50%;background:var(--gold-dim);border:1px solid var(--gold);}
.timeline-dot.current{background:var(--gold);box-shadow:0 0 8px var(--gold);}
.timeline-dot.death{background:var(--red);border-color:var(--red-bright);}
.timeline-label{font-family:'Cinzel',serif;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--gold-dim);margin-bottom:6px;}
.timeline-title{font-family:'Cinzel',serif;font-size:16px;font-weight:600;color:var(--text-primary);margin-bottom:8px;}
.timeline-body{font-size:15px;color:var(--text-secondary);line-height:1.7;}
.divider{border:none;border-top:1px solid var(--border);margin:32px 0;}
.nation-card{background:var(--bg-card);border:1px solid var(--border);padding:16px 20px;transition:transform .2s,box-shadow .2s,border-color .2s;margin-bottom:10px;}
.nation-card:hover{border-color:var(--border-glow);background:var(--bg-card-hover);}
.nation-name{font-family:'Cinzel',serif;font-size:15px;font-weight:600;color:var(--text-primary);margin-bottom:6px;}
.nation-desc{font-size:13px;color:var(--text-secondary);line-height:1.5;}
.ability{background:var(--bg-card);border:1px solid var(--border);padding:16px 20px;margin-bottom:12px;}
.ability-name{font-family:'Cinzel',serif;font-size:13px;font-weight:600;color:var(--gold);margin-bottom:6px;}
.ability-body{font-size:14px;color:var(--text-secondary);line-height:1.6;}
.img-card{background:var(--bg-card);border:1px solid var(--border);overflow:hidden;margin-bottom:16px;}
.img-card img{width:100%;display:block;opacity:.92;transition:opacity .2s;}
.img-card img:hover{opacity:1;}
.img-card-label{padding:10px 16px;font-family:'Cinzel',serif;font-size:11px;color:var(--text-secondary);letter-spacing:.08em;}
.img-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px;margin-bottom:24px;}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.map-container{width:100%;border:1px solid var(--border);overflow:hidden;margin-bottom:24px;}
.map-container img{width:100%;display:block;opacity:.9;filter:sepia(20%) brightness(.85);transition:filter .3s;}
.map-container:hover img{filter:sepia(10%) brightness(.95);}
#search-box{width:100%;background:var(--bg-card);border:1px solid var(--border);color:var(--text-primary);padding:8px 12px;font-family:'EB Garamond',serif;font-size:14px;outline:none;margin:12px 0 4px;}
#search-box:focus{border-color:var(--gold-dim);}
#search-box::placeholder{color:var(--text-dim);}
::-webkit-scrollbar{width:6px;}
::-webkit-scrollbar-track{background:var(--bg-deep);}
::-webkit-scrollbar-thumb{background:var(--border-glow);border-radius:3px;}
@media(max-width:768px){#content{padding:32px 24px;}}
@media(max-width:700px){.two-col{grid-template-columns:1fr;}}
/* Gallery upload feature */
.gallery-upload{background:var(--bg-card);border:1px dashed var(--gold-dim);padding:24px;margin-bottom:28px;}
.gallery-upload input[type=file],.gallery-upload input[type=text],.gallery-upload textarea{width:100%;background:var(--bg-surface);border:1px solid var(--border);color:var(--text-primary);padding:10px 12px;font-family:'EB Garamond',serif;font-size:15px;margin:8px 0 14px;outline:none;}
.gallery-upload textarea{min-height:70px;resize:vertical;}
.gallery-actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center;}
.wiki-button{background:var(--gold-dim);border:1px solid var(--gold);color:var(--bg-deep);font-family:'Cinzel',serif;font-size:11px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;padding:10px 14px;cursor:pointer;transition:color .15s,background .15s,border-color .15s,opacity .15s;}
.wiki-button:hover{background:var(--gold-bright);}
.wiki-button.danger{background:transparent;color:var(--red-bright);border-color:var(--red);}
.wiki-button.danger:hover{background:var(--red);color:var(--text-primary);}
.gallery-note{font-size:14px;color:var(--text-secondary);margin-top:12px;}
#gallery-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:16px;}
.gallery-card{background:var(--bg-card);border:1px solid var(--border);overflow:hidden;}
.gallery-card img{display:block;width:100%;height:190px;object-fit:cover;cursor:pointer;transition:transform .2s;}
.gallery-card img:hover{transform:scale(1.03);}
.gallery-info{padding:12px;}
.gallery-title{font-family:'Cinzel',serif;font-size:14px;font-weight:600;color:var(--text-primary);margin-bottom:4px;}
.gallery-desc{font-size:14px;color:var(--text-secondary);line-height:1.45;white-space:pre-wrap;}
.gallery-meta{font-size:12px;color:var(--text-dim);margin-top:8px;}
.gallery-empty{border:1px solid var(--border);background:var(--bg-card);padding:28px;color:var(--text-secondary);font-style:italic;}
#lightbox{position:fixed;inset:0;background:rgba(0,0,0,.88);display:none;align-items:center;justify-content:center;z-index:500;padding:32px;}
#lightbox.active{display:flex;}
#lightbox img{max-width:92vw;max-height:82vh;border:1px solid var(--gold-dim);box-shadow:0 0 35px rgba(0,0,0,.8);}
#lightbox-close{position:fixed;top:20px;right:24px;font-size:36px;color:var(--text-primary);cursor:pointer;}
@media(max-width:700px){#gallery-grid{grid-template-columns:1fr;}.gallery-card img{height:240px;}}




/* ── Design tokens — single source of truth ── */
:root {
  --gold: var(--cx-accent);
  --gold-dim: var(--cx-accent-deep);
  --gold-dark: var(--cx-accent-dim);
  --gold-glow: color-mix(in srgb,var(--cx-accent-deep) 40%,transparent);
  --text-primary: var(--cx-text);
  --text-secondary: var(--cx-text-soft);
  --text-dim: var(--cx-text-faint);
  --bg-card: var(--cx-surface-2);
  --bg-deep: var(--cx-bg);
  --border-subtle: color-mix(in srgb,var(--cx-accent-deep) 15%,transparent);
  --border-normal: color-mix(in srgb,var(--cx-accent-deep) 25%,transparent);
  --border-bright: color-mix(in srgb,var(--cx-accent-deep) 50%,transparent);
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
}

/* ── Ensure smooth scrolling ── */
html { scroll-behavior: smooth; }

/* ── Prevent layout shift on mobile ── */
* { box-sizing: border-box; }
img { max-width: 100%; height: auto; }

/* ── Focus styles for accessibility ── */
button:focus-visible,
a:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: 2px solid var(--gold);
  outline-offset: 2px;
}

/* ══ css/components.css ══ */
/* Neutral fantasy Codex redesign */
:root{
  --modern-ink:var(--cx-bg);
  --modern-ink-2:var(--cx-bg);
  --modern-panel:color-mix(in srgb,var(--cx-bg) 96%,transparent);
  --modern-panel-soft:color-mix(in srgb,var(--cx-bg) 85%,transparent);
  --modern-line:color-mix(in srgb,var(--cx-text-strong) 8%,transparent);
  --modern-gold:var(--cx-accent-deep);
  --modern-gold-2:var(--cx-accent);
  --modern-text:var(--cx-text);
  --modern-muted:var(--cx-text-dim);
  --modern-shadow:0 24px 80px color-mix(in srgb,var(--cx-bg) 18%,transparent);
}
body{
  background:
    radial-gradient(circle at 18% 0%, color-mix(in srgb,var(--cx-accent-deep) 25%,transparent), transparent 32%),
    linear-gradient(180deg,var(--cx-bg) 0%,var(--cx-bg) 100%);
  color:var(--modern-text);
  font-family:Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size:16px;
}
body:before{
  content:"";
  position:fixed;inset:0;z-index:-2;
  background:
    linear-gradient(180deg,color-mix(in srgb,var(--cx-bg) 35%,transparent),color-mix(in srgb,var(--cx-bg) 55%,transparent)),
    url('../bg_texture.jpg') center/cover no-repeat;
  opacity:.85;
}
#app{display:block;min-height:100vh;}
#search-box{display:none;}
#topbar{
  position:relative;top:auto;z-index:1;height:290px;padding:58px 6vw 120px;
  background:linear-gradient(90deg,color-mix(in srgb,var(--cx-bg) 88%,transparent),color-mix(in srgb,var(--cx-bg) 40%,transparent)), url('../hero.jpg') center 35%/cover no-repeat;
  border-bottom:0;color:var(--cx-text-strong);display:block;
}
#topbar:after{content:"";position:absolute;inset:auto 0 0;height:120px;background:linear-gradient(180deg,transparent,var(--cx-bg));}
#topbar .breadcrumb{position:relative;z-index:2;color:color-mix(in srgb,var(--cx-text-strong) 72%,transparent);font-family:inherit;font-size:14px;text-transform:none;letter-spacing:0;margin-top:120px;}
#topbar .breadcrumb:before{content:"D20Keep";display:block;font-family:Cinzel, Georgia, serif;font-size:46px;line-height:1;color:var(--cx-text-strong);letter-spacing:.02em;margin-bottom:12px;text-transform:none;}
#topbar .breadcrumb:after{content:"A Living Campaign Website Template for Tabletop Adventures";display:block;font-size:16px;color:color-mix(in srgb,var(--cx-text-strong) 84%,transparent);margin-top:2px;}
#topbar .breadcrumb span{color:var(--modern-gold-2);}
.status-badge{position:absolute;z-index:3;right:6vw;bottom:92px;border:1px solid color-mix(in srgb,var(--cx-accent) 45%,transparent);background:rgba(0,0,0,.32);backdrop-filter:blur(10px);border-radius:999px;color:var(--modern-gold-2);padding:8px 14px;font-family:inherit;}
#content{
  padding:0 6vw 64px;
  max-width:1500px;margin:-70px auto 0;position:relative;z-index:4;
}
.page{display:none;}
.page.active{display:block;}
.page:not(#page-home).active{
  background:color-mix(in srgb,var(--cx-bg) 97%,transparent);border:1px solid color-mix(in srgb,var(--cx-text-strong) 8%,transparent);border-radius:22px;
  box-shadow:0 24px 80px rgba(0,0,0,.4);padding:34px;
}
.page-header{border:0;margin:0 0 28px;padding:0;}
.page-eyebrow{font-family:inherit;color:var(--modern-gold);font-size:12px;letter-spacing:.18em;font-weight:800;}
.page-title{font-family:Cinzel, Georgia, serif;color:var(--cx-text-strong);font-size:38px;letter-spacing:-.02em;}
.page-description{color:var(--cx-text-dim);font-size:17px;max-width:760px;}
.section{background:transparent;border:0;padding:0;margin:28px 0;}
.section-title{font-family:Cinzel, Georgia, serif;color:var(--cx-text-strong);font-size:24px;border-bottom:1px solid var(--modern-line);padding-bottom:12px;margin-bottom:18px;}
.prose{color:var(--cx-text-soft);}
.prose p{margin-bottom:1em;}
.card-grid{grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:18px;}
.card,.nation-card,.stat-block,.lore-block,.gallery-upload,.img-card{
  background:color-mix(in srgb,var(--cx-bg) 97%,transparent);border:1px solid color-mix(in srgb,var(--cx-text-strong) 8%,transparent);border-radius:18px;
  box-shadow:0 12px 32px rgba(0,0,0,.3);transition:transform .18s, box-shadow .18s, border-color .18s;overflow:hidden;
}
.card{padding:22px;}
.card:hover,.img-card:hover,.gallery-card:hover{transform:translateY(-3px);box-shadow:0 18px 42px color-mix(in srgb,var(--cx-bg) 15%,transparent);border-color:color-mix(in srgb,var(--cx-accent-deep) 35%,transparent);}
.card-tag{color:var(--modern-gold);font-family:inherit;font-weight:800;font-size:11px;letter-spacing:.12em;}
.card-title,.nation-name,.stat-block-header{font-family:Cinzel, Georgia, serif;color:var(--cx-text-strong);font-size:21px;}
.card-body,.nation-desc,.stat-row,.stat-block-subtitle{color:var(--cx-text-soft);}
.pill{border-radius:999px;border:0;padding:5px 10px;font-family:inherit;font-size:12px;font-weight:700;}
.pill.gold{background:var(--cx-accent-bright);color:var(--cx-accent-dim)}.pill.blue{background:#dbeafe;color:#1d4ed8}.pill.green{background:var(--cx-success);color:var(--cx-success-deep)}.pill.red{background:var(--cx-danger);color:var(--cx-danger)}
.timeline{border-left:2px solid color-mix(in srgb,var(--cx-accent-deep) 28%,transparent);}
.timeline-item{background:color-mix(in srgb,var(--cx-bg) 97%,transparent);border:1px solid color-mix(in srgb,var(--cx-text-strong) 8%,transparent);border-radius:18px;margin:0 0 16px 22px;padding:20px;position:relative;}
.timeline-delete{position:absolute;top:12px;right:12px;background:color-mix(in srgb,var(--cx-danger) 0%,transparent);border:1px solid color-mix(in srgb,var(--cx-text-strong) 0%,transparent);border-radius:8px;color:color-mix(in srgb,var(--cx-text-strong) 0%,transparent);font-size:12px;padding:4px 10px;cursor:pointer;font-family:'Cinzel',serif;letter-spacing:.06em;transition:all .15s;}
.timeline-item:hover .timeline-delete{background:color-mix(in srgb,var(--cx-danger) 15%,transparent);border-color:color-mix(in srgb,var(--cx-danger) 40%,transparent);color:color-mix(in srgb,var(--cx-danger) 90%,transparent);}
.timeline-delete:hover{background:color-mix(in srgb,var(--cx-danger) 40%,transparent) !important;border-color:color-mix(in srgb,var(--cx-danger) 80%,transparent) !important;color:var(--cx-text-strong) !important;}
.timeline-dot{background:var(--modern-gold);box-shadow:0 0 0 7px color-mix(in srgb,var(--cx-accent-deep) 15%,transparent);}
.timeline-label{color:var(--modern-gold);font-family:inherit;font-weight:800;}
.timeline-title{font-family:Cinzel, Georgia, serif;color:var(--cx-text-strong);font-size:22px;}
.timeline-body{color:#475467;}
.img-grid{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:18px;}
.img-card{padding:0;background:var(--cx-bg);}
.img-card img{height:260px;width:100%;object-fit:cover;border:0;display:block;}
.img-card-label{background:var(--cx-bg);color:var(--cx-text-soft);font-family:inherit;font-size:14px;padding:12px 14px;border:0;}
.map-container{background:var(--cx-bg);border:1px solid color-mix(in srgb,var(--cx-text-strong) 8%,transparent);border-radius:22px;padding:12px;}
.map-container img{border-radius:16px;}
.stat-block{padding:22px;border-left:4px solid var(--modern-gold);}
.stat-row{border-color:var(--modern-line);}
.stat-label{color:var(--cx-accent);font-family:inherit;font-weight:800;}
.lore-block{color:var(--cx-text-soft);border-left:4px solid var(--modern-gold);padding:20px;font-size:18px;background:color-mix(in srgb,var(--cx-bg) 80%,transparent);}
.wiki-button{background:linear-gradient(135deg,var(--cx-accent-deep),var(--cx-accent));border:0;border-radius:12px;color:var(--cx-text-strong);font-family:inherit;font-weight:800;padding:12px 16px;box-shadow:0 10px 26px color-mix(in srgb,var(--cx-accent-deep) 28%,transparent);}
.wiki-button:hover{filter:brightness(1.04);transform:translateY(-1px)}
.wiki-button.danger{background:linear-gradient(135deg,var(--cx-danger),var(--cx-danger));}
.gallery-upload input,.gallery-upload textarea{background:var(--cx-bg);border:1px solid color-mix(in srgb,var(--cx-text-strong) 10%,transparent);border-radius:12px;color:var(--cx-text);padding:12px;font-family:inherit;}
.gallery-upload label{color:var(--cx-text);font-family:inherit;font-weight:800;}
.gallery-note{color:var(--modern-muted);}
#gallery-grid{grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:18px;}
.gallery-card{background:var(--cx-bg);border:1px solid color-mix(in srgb,var(--cx-text-strong) 8%,transparent);border-radius:18px;overflow:hidden;box-shadow:0 12px 32px rgba(0,0,0,.3);transition:transform .18s, box-shadow .18s;}
.gallery-card img{height:220px;object-fit:cover;}
.gallery-info{padding:16px;}
.gallery-title{font-family:Cinzel,Georgia,serif;color:var(--cx-text-strong);font-size:18px;}
.gallery-desc,.gallery-meta{color:#667085;}
.search-results{background:color-mix(in srgb,var(--cx-bg) 97%,transparent);border:1px solid color-mix(in srgb,var(--cx-text-strong) 8%,transparent);border-radius:18px;}
.search-result-item{color:var(--cx-text);border-bottom:1px solid color-mix(in srgb,var(--cx-text-strong) 8%,transparent);}
.search-result-item:hover{background:color-mix(in srgb,var(--cx-accent-deep) 10%,transparent);color:var(--cx-accent);}
@media(max-width:1180px){#topbar{height:250px}.status-badge{display:none}}
@media(max-width:760px){.nav-section-label{font-size:11px;padding:0 10px;letter-spacing:.04em}#topbar{height:220px;padding:32px 20px 70px}#topbar .breadcrumb{margin-top:70px}#topbar .breadcrumb:before{font-size:34px}#content{padding:0 14px 40px;margin-top:-48px}.page{padding:22px;border-radius:18px}.page-title{font-size:30px}.card-grid,.img-grid,#gallery-grid{grid-template-columns:1fr}}


.modern-home-hero{min-height:310px;border-radius:20px;margin:-10px -10px 30px;overflow:hidden;background:linear-gradient(90deg,color-mix(in srgb,var(--cx-bg) 88%,transparent),color-mix(in srgb,var(--cx-bg) 20%,transparent)),url('../hero.jpg') center 35%/cover no-repeat;display:flex;align-items:flex-end;padding:36px;box-shadow:0 24px 70px color-mix(in srgb,var(--cx-bg) 24%,transparent)}.modern-hero-copy{max-width:720px;color:var(--cx-text-strong)}.modern-hero-kicker{text-transform:uppercase;letter-spacing:.18em;color:var(--cx-accent);font-weight:800;font-size:12px;margin-bottom:8px}.modern-hero-copy h1{font-family:Cinzel,Georgia,serif;font-size:56px;line-height:1;margin:0 0 12px}.modern-hero-copy p{font-size:18px;color:color-mix(in srgb,var(--cx-text-strong) 82%,transparent);margin-bottom:18px}.modern-hero-actions{display:flex;gap:12px;flex-wrap:wrap}.modern-hero-actions .wiki-button:last-child{background:color-mix(in srgb,var(--cx-text-strong) 12%,transparent);border:1px solid color-mix(in srgb,var(--cx-text-strong) 24%,transparent);box-shadow:none}@media(max-width:760px){.modern-home-hero{min-height:260px;padding:24px}.modern-hero-copy h1{font-size:40px}}

/* Cinematic homepage redesign */
body.home-active{background:var(--cx-bg);color:var(--cx-accent-bright);}
body.home-active #topbar{display:none;}
body.home-active #sidebar{display:none;}
body.home-active #main{margin-left:0;min-height:100vh;background:var(--cx-bg);}
body.home-active #content{padding:0;max-width:none;width:100%;}

/* Home page nav dropdown overlay — centered at top */
#home-nav-menu{
  display:none;
  position:fixed;
  top:74px;
  left:50%;
  transform:translateX(-50%);
  z-index:200;
  background:color-mix(in srgb,var(--cx-bg) 97%,transparent);
  border:1px solid color-mix(in srgb,var(--cx-accent) 30%,transparent);
  border-radius:14px;
  padding:24px 28px;
  min-width:680px;
  max-width:90vw;
  box-shadow:0 20px 60px rgba(0,0,0,.8),0 0 30px color-mix(in srgb,var(--cx-accent) 8%,transparent);
  backdrop-filter:blur(20px);
  animation:menuDrop .2s ease forwards;
}
#home-nav-menu.open{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;}
@keyframes menuDrop{from{opacity:0;transform:translateX(-50%) translateY(-8px);}to{opacity:1;transform:translateX(-50%) translateY(0);}}
.home-menu-section-title{font-family:Cinzel,serif;font-size:9px;letter-spacing:.15em;text-transform:uppercase;color:color-mix(in srgb,var(--cx-accent) 50%,transparent);padding:0 8px 6px;border-bottom:1px solid color-mix(in srgb,var(--cx-accent) 15%,transparent);margin-bottom:4px;}
.home-menu-item{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:8px;cursor:pointer;color:var(--cx-text-soft);font-family:'EB Garamond',serif;font-size:15px;transition:all .15s;white-space:nowrap;}
.home-menu-item:hover{background:color-mix(in srgb,var(--cx-accent) 10%,transparent);color:var(--cx-accent);}
.home-menu-item .icon{font-size:14px;width:18px;text-align:center;flex-shrink:0;}
#home-nav-backdrop{display:none;position:fixed;inset:0;z-index:199;}
#home-nav-backdrop.open{display:block;}
body.home-active .page.active{display:block;}
.cinematic-home{min-height:100vh;background:var(--cx-bg);color:var(--cx-accent-bright);font-family:'EB Garamond',serif;overflow:hidden;}
.home-nav{height:74px;padding:0 28px;border-bottom:1px solid color-mix(in srgb,var(--cx-accent) 22%,transparent);background:color-mix(in srgb,var(--cx-bg) 88%,transparent);backdrop-filter:blur(16px);display:flex;align-items:center;gap:28px;position:sticky;top:0;z-index:20;}
.home-menu-btn{background:color-mix(in srgb,var(--cx-accent) 8%,transparent);border:1px solid color-mix(in srgb,var(--cx-accent) 35%,transparent);border-radius:8px;color:var(--cx-accent);padding:8px 16px;font-size:14px;font-family:Cinzel,serif;letter-spacing:.08em;cursor:pointer;line-height:1;transition:all .2s;flex-shrink:0;}
.home-menu-btn:hover{background:color-mix(in srgb,var(--cx-accent) 18%,transparent);border-color:var(--cx-accent);}
#home-sidebar-backdrop{display:none;}
.home-brand{display:flex;align-items:center;gap:14px;min-width:285px;}
.home-mark{width:44px;height:44px;border:1px solid color-mix(in srgb,var(--cx-accent) 75%,transparent);border-radius:999px;display:grid;place-items:center;color:var(--cx-accent);font-size:25px;box-shadow:0 0 24px color-mix(in srgb,var(--cx-accent-deep) 18%,transparent) inset,0 0 24px color-mix(in srgb,var(--cx-accent-deep) 12%,transparent);}
.home-brand-title{font-family:'Cinzel',serif;font-size:24px;letter-spacing:.1em;color:var(--cx-accent-bright);line-height:1;}
.home-brand-sub{font-family:'Cinzel',serif;font-size:10px;letter-spacing:.18em;color:var(--cx-accent-deep);text-transform:uppercase;margin-top:5px;}
.home-links{display:flex;gap:8px;align-items:center;flex:1;justify-content:center;}
.home-link{font-family:'Cinzel',serif;color:var(--cx-accent-bright);background:transparent;border:0;border-bottom:2px solid transparent;padding:25px 12px 22px;font-size:13px;letter-spacing:.08em;cursor:pointer;transition:transform .18s ease,color .18s ease,border-color .18s ease;}
.home-link:hover,.home-link.active{color:var(--cx-accent);border-bottom-color:var(--cx-accent);background:linear-gradient(180deg,transparent,color-mix(in srgb,var(--cx-accent-deep) 8%,transparent));}
.home-search{display:flex;align-items:center;border:1px solid color-mix(in srgb,var(--cx-accent) 28%,transparent);border-radius:6px;overflow:hidden;background:rgba(0,0,0,.25);min-width:260px;}
.home-search input{background:transparent;border:0;outline:0;color:var(--cx-accent-bright);padding:12px 14px;width:220px;font-family:inherit;font-size:14px;}
.home-search button{border:0;border-left:1px solid color-mix(in srgb,var(--cx-accent) 25%,transparent);background:transparent;color:var(--cx-accent);padding:12px 14px;font-size:17px;cursor:pointer;}
.home-hero{position:relative;min-height:690px;padding:88px 58px 40px;display:flex;align-items:center;justify-content:center;background:linear-gradient(90deg,color-mix(in srgb,var(--cx-bg) 97%,transparent) 0%,color-mix(in srgb,var(--cx-bg) 75%,transparent) 35%,color-mix(in srgb,var(--cx-bg) 25%,transparent) 65%,color-mix(in srgb,var(--cx-bg) 60%,transparent) 100%),linear-gradient(0deg,color-mix(in srgb,var(--cx-bg) 100%,transparent) 0%,color-mix(in srgb,var(--cx-bg) 0%,transparent) 30%),url('../hero.jpg') center 35%/cover no-repeat;}
.home-hero:before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 70% 38%,color-mix(in srgb,var(--cx-accent) 26%,transparent),transparent 18%),radial-gradient(circle at 54% 45%,rgba(113,154,189,.18),transparent 28%);pointer-events:none;}
.home-hero:after{content:'';position:absolute;left:0;right:0;bottom:0;height:180px;background:linear-gradient(transparent,var(--cx-bg));pointer-events:none;}
.home-hero-content{position:relative;z-index:1;max-width:760px;margin:0 auto;text-align:center;}
.home-actions{justify-content:center;}
.home-welcome{text-align:center;}
.home-tagline{text-align:center;}
.home-hero p{text-align:center;}
.home-welcome{font-family:'Cinzel',serif;font-size:34px;letter-spacing:.14em;color:var(--cx-accent-bright);margin-bottom:6px;display:flex;align-items:center;gap:18px;text-transform:uppercase;}
.home-welcome:before,.home-welcome:after{content:'';height:1px;width:92px;background:linear-gradient(90deg,transparent,var(--cx-accent));}
.home-welcome:after{background:linear-gradient(90deg,var(--cx-accent),transparent);}
.home-title{font-family:'Cinzel',serif;font-size:72px;line-height:.98;letter-spacing:.06em;color:var(--cx-accent-bright);text-shadow:0 2px 0 var(--cx-surface),0 0 36px color-mix(in srgb,var(--cx-accent) 25%,transparent);margin:0 0 24px;}
.home-rule{height:1px;max-width:590px;background:linear-gradient(90deg,var(--cx-accent-dim),var(--cx-accent),var(--cx-accent-dim),transparent);margin:0 0 30px;position:relative;}
.home-rule:after{content:'✦';position:absolute;left:48%;top:-12px;color:var(--cx-accent);background:var(--cx-bg);padding:0 12px;}
.home-tagline{font-family:'Cinzel',serif;color:var(--cx-accent);letter-spacing:.08em;font-size:24px;margin-bottom:20px;text-transform:uppercase;}
.home-copy{font-size:19px;line-height:1.55;color:var(--cx-accent-bright);max-width:560px;text-shadow:0 2px 10px rgba(0,0,0,.6);text-align:center;margin-left:auto;margin-right:auto;}
.home-actions{display:flex;gap:16px;margin-top:32px;justify-content:center;}
.home-action{font-family:'Cinzel',serif;border:1px solid color-mix(in srgb,var(--cx-accent) 55%,transparent);background:color-mix(in srgb,var(--cx-bg) 50%,transparent);color:var(--cx-accent-bright);padding:15px 24px;border-radius:5px;letter-spacing:.07em;cursor:pointer;box-shadow:0 10px 30px rgba(0,0,0,.28);}
.home-action.primary{background:linear-gradient(135deg,var(--cx-accent),var(--cx-accent-dim));color:var(--cx-field);border-color:var(--cx-accent-bright);}
.home-action:hover{transform:translateY(-1px);filter:brightness(1.08);}
.home-realms{position:relative;z-index:4;margin:-62px auto 0;padding:0 58px 70px;max-width:1500px;}
.home-section-title{font-family:'Cinzel',serif;color:var(--cx-accent);text-align:center;font-size:25px;letter-spacing:.16em;text-transform:uppercase;margin-bottom:20px;display:flex;align-items:center;gap:18px;justify-content:center;}
.home-section-title:before,.home-section-title:after{content:'';height:1px;flex:1;max-width:520px;background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--cx-accent-deep) 80%,transparent));}
.home-section-title:after{background:linear-gradient(90deg,color-mix(in srgb,var(--cx-accent-deep) 80%,transparent),transparent);}
.realm-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:20px;}
.realm-card{background:linear-gradient(180deg,color-mix(in srgb,var(--cx-bg) 94%,transparent),color-mix(in srgb,var(--cx-bg) 94%,transparent));border:1px solid color-mix(in srgb,var(--cx-accent-deep) 42%,transparent);border-radius:4px;overflow:hidden;min-height:332px;display:flex;flex-direction:column;box-shadow:0 18px 50px rgba(0,0,0,.35);cursor:pointer;transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease;position:relative;}
.realm-card:hover{transform:translateY(-5px);border-color:var(--cx-accent);box-shadow:0 24px 70px rgba(0,0,0,.48),0 0 32px color-mix(in srgb,var(--cx-accent) 14%,transparent);}
.realm-card img{height:160px;width:100%;object-fit:contain;background:radial-gradient(circle at center,color-mix(in srgb,var(--cx-accent-bright) 15%,transparent),rgba(0,0,0,.45));padding:8px;}
.realm-icon{width:48px;height:48px;border:1px solid color-mix(in srgb,var(--cx-accent) 75%,transparent);border-radius:999px;display:grid;place-items:center;background:var(--cx-bg);color:var(--cx-accent);font-size:22px;margin:-24px auto 12px;position:relative;z-index:2;box-shadow:0 0 0 5px color-mix(in srgb,var(--cx-bg) 90%,transparent);}
.realm-card h3{font-family:'Cinzel',serif;text-align:center;color:var(--cx-accent-bright);font-size:22px;letter-spacing:.06em;margin:0 12px 10px;}
.realm-card p{text-align:center;color:var(--cx-accent-bright);line-height:1.45;font-size:16px;margin:0 20px 16px;flex:1;}
.realm-card .realm-cta{font-family:'Cinzel',serif;text-align:center;color:var(--cx-accent-bright);font-size:13px;letter-spacing:.1em;padding:15px 14px 18px;border-top:1px solid color-mix(in srgb,var(--cx-accent-deep) 18%,transparent);margin:0 20px;}
@media(max-width:1200px){.realm-grid{grid-template-columns:repeat(3,1fr)}.home-links{display:none}.home-search{min-width:200px}.home-title{font-size:58px}}
@media(max-width:760px){.home-nav{height:auto;align-items:flex-start;flex-direction:column;padding:18px}.home-brand{min-width:0}.home-search{width:100%;}.home-search input{width:100%}.home-hero{min-height:620px;padding:60px 26px 120px}.home-title{font-size:42px}.home-welcome{font-size:20px}.home-welcome:before,.home-welcome:after{width:40px}.home-tagline{font-size:18px}.home-actions{flex-direction:column}.home-realms{padding:0 20px 50px}.realm-grid{grid-template-columns:1fr}.realm-card img{height:220px}}


/* Character page upgrades */
#content{max-width:1240px;}
.character-layout{display:grid;grid-template-columns:minmax(360px,0.9fr) minmax(420px,1.1fr);gap:24px;align-items:start;}
.character-art-stack{display:grid;gap:18px;}
.img-card.character-card img,.character-art-stack .img-card img{height:auto;max-height:760px;width:100%;object-fit:contain;background:linear-gradient(135deg,var(--cx-bg),var(--cx-bg));padding:14px;}
.img-card img{height:auto;max-height:720px;width:100%;object-fit:contain;background:linear-gradient(135deg,var(--cx-bg),var(--cx-bg));padding:10px;}
.realm-card img{height:160px;object-fit:contain;padding:8px;}
.player-notes{background:color-mix(in srgb,var(--cx-bg) 97%,transparent);border:1px solid color-mix(in srgb,var(--cx-accent-deep) 28%,transparent);border-radius:18px;padding:18px;margin-top:18px;}
.player-notes-header{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:10px;}
.player-notes-title{font-family:Cinzel,Georgia,serif;font-weight:800;color:var(--cx-text-strong);font-size:18px;}
.player-notes-status{font-size:12px;color:#667085;}
.player-notes textarea{width:100%;min-height:150px;resize:vertical;border:1px solid color-mix(in srgb,var(--cx-text-strong) 10%,transparent);border-radius:14px;padding:14px;background:var(--cx-bg);color:var(--cx-text);font:15px/1.55 Inter,system-ui,sans-serif;box-sizing:border-box;}
.player-notes-actions{display:flex;gap:10px;align-items:center;margin-top:12px;flex-wrap:wrap;}
.player-notes-hint{font-size:12px;color:#667085;line-height:1.4;margin-top:8px;}
@media(max-width:900px){.character-layout{grid-template-columns:1fr}.img-card.character-card img,.character-art-stack .img-card img,.img-card img{max-height:none}}



/* Cosmic Atlas */
.atlas-shell{background:linear-gradient(180deg,var(--cx-bg),var(--cx-bg) 45%,var(--cx-bg));color:#eee;border-radius:26px;overflow:hidden;border:1px solid color-mix(in srgb,var(--cx-accent-deep) 35%,transparent);box-shadow:0 24px 80px rgba(0,0,0,.35);}
.atlas-hero{padding:34px;background:radial-gradient(circle at 50% 0%,color-mix(in srgb,var(--cx-accent-deep) 18%,transparent),transparent 45%),linear-gradient(180deg,color-mix(in srgb,var(--cx-text-strong) 5%,transparent),transparent);border-bottom:1px solid color-mix(in srgb,var(--cx-accent-deep) 25%,transparent);}
.atlas-kicker{font-family:Cinzel,serif;color:var(--cx-accent);letter-spacing:.2em;text-transform:uppercase;font-size:12px;margin-bottom:8px;}
.atlas-title{font-family:Cinzel,serif;font-size:44px;line-height:1;color:var(--cx-accent-bright);margin-bottom:12px;}
.atlas-desc{max-width:900px;color:var(--cx-accent-bright);font-size:17px;line-height:1.65;}
.atlas-toolbar{display:flex;gap:12px;flex-wrap:wrap;margin-top:20px;align-items:center;}
.atlas-search{background:color-mix(in srgb,var(--cx-text-strong) 8%,transparent);border:1px solid color-mix(in srgb,var(--cx-accent-deep) 28%,transparent);border-radius:999px;color:var(--cx-accent-bright);padding:12px 16px;min-width:280px;outline:none;}
.atlas-chip{border:1px solid color-mix(in srgb,var(--cx-accent-deep) 35%,transparent);background:color-mix(in srgb,var(--cx-accent-deep) 8%,transparent);color:var(--cx-accent-bright);border-radius:999px;padding:10px 14px;font-family:Cinzel,serif;font-size:12px;letter-spacing:.08em;cursor:pointer;}
.atlas-chip.active,.atlas-chip:hover{background:color-mix(in srgb,var(--cx-accent-deep) 22%,transparent);border-color:var(--cx-accent);}
.universal-stage{padding:24px 24px 10px;}
.universal-map-wrap{position:relative;border-radius:18px;overflow:hidden;border:1px solid color-mix(in srgb,var(--cx-accent-deep) 42%,transparent);background:var(--cx-bg);box-shadow:0 20px 60px rgba(0,0,0,.45);}
.universal-map-wrap img{display:block;width:100%;height:auto;}
.world-node{position:absolute;transform:translate(-50%,-50%);border:1px solid color-mix(in srgb,var(--cx-accent-bright) 95%,transparent);background:color-mix(in srgb,var(--cx-bg) 82%,transparent);color:var(--cx-accent-bright);border-radius:999px;width:18px;height:18px;padding:0;font-size:0;box-shadow:0 0 0 5px color-mix(in srgb,var(--cx-accent-deep) 14%,transparent),0 0 24px color-mix(in srgb,var(--cx-accent) 45%,transparent);cursor:pointer;white-space:nowrap;transition:transform .18s ease,color .18s ease,border-color .18s ease;z-index:3;}
.world-node::after{content:attr(data-label);position:absolute;left:50%;top:calc(100% + 8px);transform:translateX(-50%);font-size:11px;font-weight:700;color:var(--cx-accent-bright);background:color-mix(in srgb,var(--cx-bg) 86%,transparent);border:1px solid color-mix(in srgb,var(--cx-accent-bright) 65%,transparent);border-radius:999px;padding:5px 8px;box-shadow:0 8px 20px rgba(0,0,0,.35);opacity:.92;}
.world-node:hover{transform:translate(-50%,-50%) scale(1.2);background:color-mix(in srgb,var(--cx-accent-deep) 95%,transparent);color:#111;z-index:8;}
.world-node:hover::after{background:color-mix(in srgb,var(--cx-accent-deep) 96%,transparent);color:var(--cx-field);}
.world-node.divine-pin{width:22px;height:22px;box-shadow:0 0 0 7px color-mix(in srgb,var(--cx-accent-deep) 13%,transparent),0 0 32px color-mix(in srgb,var(--cx-accent-bright) 62%,transparent);}
.atlas-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(245px,1fr));gap:18px;padding:24px;contain:layout;}
.atlas-world-card{background:linear-gradient(180deg,color-mix(in srgb,var(--cx-text-strong) 8%,transparent),color-mix(in srgb,var(--cx-text-strong) 3.5%,transparent));border:1px solid color-mix(in srgb,var(--cx-accent-deep) 28%,transparent);border-radius:18px;overflow:hidden;cursor:pointer;box-shadow:0 16px 44px rgba(0,0,0,.32);transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;will-change:transform;}
.atlas-world-card:hover{transform:translateY(-4px);border-color:var(--cx-accent);box-shadow:0 22px 60px rgba(0,0,0,.45),0 0 28px color-mix(in srgb,var(--cx-accent-deep) 12%,transparent);}
.atlas-world-card img{width:100%;height:170px;object-fit:contain;display:block;background:var(--cx-bg);padding:6px;}
.atlas-world-card .world-card-body{padding:16px;}
.atlas-world-card h3{font-family:Cinzel,serif;color:var(--cx-accent-bright);font-size:20px;margin:0 0 4px;}
.atlas-world-card p{color:var(--cx-accent-bright);margin:0 0 12px;line-height:1.45;font-size:14px;}
.world-card-meta{display:flex;gap:8px;flex-wrap:wrap;color:var(--cx-accent-bright);font-size:12px;}
.world-card-meta span{border:1px solid color-mix(in srgb,var(--cx-accent-deep) 25%,transparent);border-radius:999px;padding:5px 8px;background:rgba(0,0,0,.18);}
.atlas-viewer{display:none;padding:24px;}
.atlas-viewer.active{display:block;}
.world-view-head{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;margin-bottom:18px;}
.world-view-title{font-family:Cinzel,serif;color:var(--cx-accent-bright);font-size:38px;line-height:1;margin-bottom:8px;}
.world-view-sub{color:var(--cx-accent-bright);line-height:1.55;max-width:800px;}

/* ── Session Notes ── */
.session-layout{display:grid;grid-template-columns:1fr 320px;gap:24px;align-items:start;}
.session-main{display:flex;flex-direction:column;gap:20px;}
.session-sidebar{display:flex;flex-direction:column;gap:16px;position:sticky;top:80px;}
.session-card{background:color-mix(in srgb,var(--cx-bg) 97%,transparent);border:1px solid color-mix(in srgb,var(--cx-accent-deep) 22%,transparent);border-radius:16px;padding:20px;}
.session-card h3{font-family:Cinzel,serif;color:var(--cx-accent);font-size:13px;letter-spacing:.12em;text-transform:uppercase;margin:0 0 14px;display:flex;align-items:center;gap:8px;}
.session-card h3::before{content:'✦';font-size:11px;opacity:.7;}
.session-header-card{background:color-mix(in srgb,var(--cx-bg) 97%,transparent);border:1px solid color-mix(in srgb,var(--cx-accent-deep) 22%,transparent);border-radius:16px;padding:24px 24px 20px;}
.session-number{font-family:Cinzel,serif;font-size:34px;font-weight:900;color:var(--cx-text-strong);margin:0 0 4px;}
.session-title-input{font-family:Cinzel,serif;font-size:20px;color:var(--cx-accent);background:transparent;border:none;border-bottom:1px solid color-mix(in srgb,var(--cx-accent-deep) 30%,transparent);width:100%;padding:4px 0;margin-bottom:14px;outline:none;}
.session-title-input::placeholder{color:color-mix(in srgb,var(--cx-accent) 35%,transparent);}
.session-meta{display:flex;flex-wrap:wrap;gap:14px;margin-bottom:0;}
.session-meta-field{display:flex;flex-direction:column;gap:3px;}
.session-meta-label{font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--cx-text-dim);}
.session-meta-input{background:color-mix(in srgb,var(--cx-text-strong) 6%,transparent);border:1px solid color-mix(in srgb,var(--cx-text-strong) 10%,transparent);border-radius:8px;padding:6px 10px;color:var(--cx-text);font-family:'EB Garamond',serif;font-size:14px;outline:none;width:150px;}
.session-meta-input:focus{border-color:color-mix(in srgb,var(--cx-accent-deep) 50%,transparent);}
.session-textarea{width:100%;background:color-mix(in srgb,var(--cx-bg) 80%,transparent);border:1px solid color-mix(in srgb,var(--cx-text-strong) 8%,transparent);border-radius:10px;padding:14px;color:var(--cx-accent-bright);font-family:'EB Garamond',serif;font-size:16px;line-height:1.65;resize:vertical;outline:none;box-sizing:border-box;}
.session-textarea:focus{border-color:color-mix(in srgb,var(--cx-accent-deep) 40%,transparent);}
.session-textarea::placeholder{color:color-mix(in srgb,var(--cx-text-strong) 20%,transparent);}
.event-list{display:flex;flex-direction:column;gap:8px;}
.event-item{display:flex;align-items:flex-start;gap:10px;}
.event-item::before{content:'✦';color:var(--cx-accent);font-size:10px;margin-top:5px;flex-shrink:0;}
.event-input{flex:1;background:color-mix(in srgb,var(--cx-bg) 80%,transparent);border:1px solid color-mix(in srgb,var(--cx-text-strong) 8%,transparent);border-radius:8px;padding:9px 12px;color:var(--cx-accent-bright);font-family:'EB Garamond',serif;font-size:15px;outline:none;}
.event-input:focus{border-color:color-mix(in srgb,var(--cx-accent-deep) 40%,transparent);}
.event-input::placeholder{color:color-mix(in srgb,var(--cx-text-strong) 18%,transparent);}
.add-event-btn{background:transparent;border:1px dashed color-mix(in srgb,var(--cx-accent-deep) 30%,transparent);border-radius:8px;padding:8px;color:var(--cx-accent);font-size:13px;cursor:pointer;width:100%;margin-top:4px;font-family:Cinzel,serif;letter-spacing:.06em;}
.add-event-btn:hover{background:color-mix(in srgb,var(--cx-accent-deep) 8%,transparent);border-color:color-mix(in srgb,var(--cx-accent-deep) 60%,transparent);}
.session-nav-bar{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;}
.session-nav-btn{background:color-mix(in srgb,var(--cx-bg) 97%,transparent);border:1px solid color-mix(in srgb,var(--cx-accent-deep) 22%,transparent);border-radius:10px;padding:8px 16px;color:var(--cx-accent);font-family:Cinzel,serif;font-size:12px;letter-spacing:.06em;cursor:pointer;}
.session-nav-btn:hover{background:color-mix(in srgb,var(--cx-accent-deep) 10%,transparent);}
.session-nav-btn:disabled{opacity:.3;cursor:default;}
.new-session-btn{background:linear-gradient(180deg,var(--cx-accent),var(--cx-accent-dim));border:none;border-radius:10px;padding:8px 18px;color:var(--cx-field);font-family:Cinzel,serif;font-size:12px;font-weight:700;letter-spacing:.06em;cursor:pointer;}
.session-counter{font-family:Cinzel,serif;font-size:13px;color:var(--cx-text-dim);}
.sidebar-stat{display:flex;justify-content:space-between;align-items:baseline;padding:6px 0;border-bottom:1px solid color-mix(in srgb,var(--cx-text-strong) 6%,transparent);}
.sidebar-stat:last-child{border-bottom:none;}
.sidebar-stat-label{font-size:12px;color:var(--cx-text-dim);letter-spacing:.08em;text-transform:uppercase;}
.sidebar-stat-value{font-family:'EB Garamond',serif;font-size:15px;color:var(--cx-text);}
.loot-item{display:flex;align-items:center;gap:10px;padding:6px 0;border-bottom:1px solid color-mix(in srgb,var(--cx-text-strong) 5%,transparent);}
.loot-item:last-child{border-bottom:none;}
.loot-dot{width:8px;height:8px;border-radius:50%;background:var(--cx-accent);flex-shrink:0;}
.loot-input{flex:1;background:transparent;border:none;color:var(--cx-accent-bright);font-family:'EB Garamond',serif;font-size:14px;outline:none;}
.loot-input::placeholder{color:color-mix(in srgb,var(--cx-text-strong) 20%,transparent);}
@media(max-width:900px){.session-layout{grid-template-columns:1fr}.session-sidebar{position:relative;top:auto;}}


/* ── Character Sheets ── */
.char-sheet{background:color-mix(in srgb,var(--cx-bg) 98%,transparent);border:1px solid color-mix(in srgb,var(--cx-accent-deep) 30%,transparent);border-radius:20px;overflow:hidden;margin-bottom:40px;}
.char-sheet-header{display:grid;grid-template-columns:280px 1fr;min-height:360px;position:relative;}
.char-portrait-wrap{position:relative;overflow:hidden;background:var(--cx-bg);}
.char-portrait-wrap img{width:100%;height:100%;object-fit:cover;object-position:top center;display:block;}
.char-portrait-upload{position:absolute;bottom:10px;left:50%;transform:translateX(-50%);background:rgba(0,0,0,.7);border:1px solid color-mix(in srgb,var(--cx-accent-deep) 40%,transparent);border-radius:8px;padding:5px 12px;color:var(--cx-accent);font-family:Cinzel,serif;font-size:10px;letter-spacing:.08em;cursor:pointer;opacity:0;transition:opacity .2s;white-space:nowrap;}
.char-portrait-wrap:hover .char-portrait-upload{opacity:1;}
.char-portrait-input{display:none;}
.char-header-content{padding:28px 32px;display:flex;flex-direction:column;justify-content:space-between;border-left:1px solid color-mix(in srgb,var(--cx-accent-deep) 15%,transparent);}
.char-name{font-family:Cinzel,serif;font-size:38px;font-weight:900;color:var(--cx-text-strong);margin:0 0 4px;}
.char-epithet{font-family:'EB Garamond',serif;font-style:italic;font-size:18px;color:var(--cx-accent);margin:0 0 20px;}
.char-edit-btn{align-self:flex-start;background:color-mix(in srgb,var(--cx-accent-deep) 12%,transparent);border:1px solid color-mix(in srgb,var(--cx-accent-deep) 40%,transparent);border-radius:10px;padding:8px 18px;color:var(--cx-accent);font-family:Cinzel,serif;font-size:12px;letter-spacing:.08em;cursor:pointer;transition:background .15s;}
.char-edit-btn:hover{background:color-mix(in srgb,var(--cx-accent-deep) 25%,transparent);}
.char-edit-btn.active{background:color-mix(in srgb,var(--cx-accent-deep) 30%,transparent);border-color:var(--cx-accent);}
.char-save-btn{background:linear-gradient(180deg,var(--cx-accent),var(--cx-accent-dim));border:none;border-radius:10px;padding:8px 18px;color:var(--cx-field);font-family:Cinzel,serif;font-size:12px;font-weight:700;letter-spacing:.08em;cursor:pointer;margin-left:8px;}
.char-header-btns{display:flex;align-items:center;gap:8px;margin-bottom:16px;}
.char-status{font-size:11px;color:var(--cx-text-dim);font-family:'EB Garamond',serif;min-height:16px;}

/* Summary + Divine grid */
.char-body{padding:24px 28px;display:flex;flex-direction:column;gap:24px;}
.char-top-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;}
.char-section{background:color-mix(in srgb,var(--cx-bg) 80%,transparent);border:1px solid color-mix(in srgb,var(--cx-accent-deep) 15%,transparent);border-radius:14px;padding:18px 20px;}
.char-section-title{font-family:Cinzel,serif;font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--cx-accent);margin:0 0 14px;display:flex;align-items:center;gap:8px;}
.char-section-title::before{content:'✦';font-size:10px;opacity:.7;}

/* Summary rows */
.char-row{display:flex;align-items:baseline;gap:12px;padding:7px 0;border-bottom:1px solid color-mix(in srgb,var(--cx-text-strong) 5%,transparent);}
.char-row:last-child{border-bottom:none;}
.char-row-label{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--cx-text-dim);min-width:120px;flex-shrink:0;}
.char-row-value{font-family:'EB Garamond',serif;font-size:15px;color:var(--cx-text);flex:1;}

/* Editable fields */
.char-field{background:transparent;border:none;color:var(--cx-text);font-family:'EB Garamond',serif;font-size:15px;width:100%;outline:none;padding:0;}
.char-field[readonly]{pointer-events:none;}
.char-sheet.editing .char-field{background:color-mix(in srgb,var(--cx-text-strong) 6%,transparent);border:1px solid color-mix(in srgb,var(--cx-accent-deep) 30%,transparent);border-radius:6px;padding:4px 8px;}
.char-sheet.editing .char-name-field{font-family:Cinzel,serif;font-size:32px;font-weight:900;color:var(--cx-text-strong);}
.char-sheet.editing .char-epithet-field{font-style:italic;color:var(--cx-accent);}
.char-textarea{background:transparent;border:none;color:var(--cx-text-soft);font-family:'EB Garamond',serif;font-size:16px;line-height:1.65;width:100%;resize:vertical;outline:none;min-height:100px;padding:0;}
.char-sheet.editing .char-textarea{background:color-mix(in srgb,var(--cx-text-strong) 5%,transparent);border:1px solid color-mix(in srgb,var(--cx-accent-deep) 20%,transparent);border-radius:8px;padding:10px;}

/* World levels */
.world-levels{display:flex;flex-direction:column;gap:6px;}
.world-level-row{display:flex;align-items:center;gap:8px;}
.world-level-name{font-family:'EB Garamond',serif;font-size:14px;color:var(--cx-text-soft);flex:1;}
.world-level-num{font-family:Cinzel,serif;font-size:14px;color:var(--cx-accent);min-width:30px;}
.world-level-delete{background:transparent;border:none;color:color-mix(in srgb,var(--cx-danger) 50%,transparent);cursor:pointer;font-size:14px;padding:0 4px;display:none;}
.char-sheet.editing .world-level-delete{display:inline;}
.add-world-btn{background:transparent;border:1px dashed color-mix(in srgb,var(--cx-accent-deep) 30%,transparent);border-radius:6px;padding:5px 10px;color:var(--cx-accent);font-size:12px;font-family:Cinzel,serif;cursor:pointer;margin-top:4px;display:none;}
.char-sheet.editing .add-world-btn{display:block;}

/* Items */
.item-list{display:flex;flex-direction:column;gap:12px;}
.item-entry{display:flex;gap:12px;align-items:flex-start;padding:10px;background:color-mix(in srgb,var(--cx-bg) 60%,transparent);border:1px solid color-mix(in srgb,var(--cx-text-strong) 6%,transparent);border-radius:10px;position:relative;}
.item-img-wrap{width:56px;height:56px;flex-shrink:0;border-radius:8px;overflow:hidden;background:color-mix(in srgb,var(--cx-text-strong) 5%,transparent);display:flex;align-items:center;justify-content:center;cursor:pointer;border:1px solid color-mix(in srgb,var(--cx-accent-deep) 20%,transparent);}
.item-img-wrap img{width:100%;height:100%;object-fit:cover;}
.item-img-placeholder{color:color-mix(in srgb,var(--cx-accent-deep) 40%,transparent);font-size:20px;}
.item-img-input{display:none;}
.item-content{flex:1;min-width:0;}
.item-name{font-family:Cinzel,serif;font-size:14px;color:var(--cx-text-strong);margin:0 0 2px;}
.item-type{font-size:12px;color:var(--cx-accent);font-style:italic;margin:0 0 4px;}
.item-desc{font-family:'EB Garamond',serif;font-size:14px;color:var(--cx-text-dim);margin:0;}
.item-delete{position:absolute;top:6px;right:8px;background:transparent;border:none;color:color-mix(in srgb,var(--cx-danger) 40%,transparent);cursor:pointer;font-size:16px;display:none;}
.char-sheet.editing .item-delete{display:block;}
.char-sheet.editing .item-img-wrap{border-style:dashed;border-color:color-mix(in srgb,var(--cx-accent-deep) 40%,transparent);}
.add-item-btn{background:transparent;border:1px dashed color-mix(in srgb,var(--cx-accent-deep) 30%,transparent);border-radius:8px;padding:8px;color:var(--cx-accent);font-size:12px;font-family:Cinzel,serif;cursor:pointer;width:100%;margin-top:8px;display:none;}
.char-sheet.editing .add-item-btn{display:block;}

/* Relationships */
.rel-list{display:flex;flex-direction:column;gap:10px;}
.rel-entry{display:flex;gap:12px;align-items:flex-start;padding:8px 0;border-bottom:1px solid color-mix(in srgb,var(--cx-text-strong) 5%,transparent);position:relative;}
.rel-entry:last-child{border-bottom:none;}
.rel-content{flex:1;}
.rel-name{font-family:Cinzel,serif;font-size:14px;color:var(--cx-text-strong);}
.rel-role{font-size:12px;color:var(--cx-accent);font-style:italic;margin-bottom:2px;}
.rel-desc{font-family:'EB Garamond',serif;font-size:13px;color:var(--cx-text-dim);}
.rel-delete{background:transparent;border:none;color:color-mix(in srgb,var(--cx-danger) 40%,transparent);cursor:pointer;font-size:14px;display:none;padding:0;}
.char-sheet.editing .rel-delete{display:inline;}
.add-rel-btn{background:transparent;border:1px dashed color-mix(in srgb,var(--cx-accent-deep) 30%,transparent);border-radius:8px;padding:8px;color:var(--cx-accent);font-size:12px;font-family:Cinzel,serif;cursor:pointer;width:100%;margin-top:8px;display:none;}
.char-sheet.editing .add-rel-btn{display:block;}

/* Accomplishments */
.acc-list{display:flex;flex-direction:column;gap:8px;}
.acc-entry{display:flex;align-items:flex-start;gap:10px;position:relative;}
.acc-entry::before{content:'✦';color:var(--cx-accent);font-size:10px;margin-top:4px;flex-shrink:0;}
.acc-text{font-family:'EB Garamond',serif;font-size:15px;color:var(--cx-text-soft);flex:1;}
.acc-delete{background:transparent;border:none;color:color-mix(in srgb,var(--cx-danger) 40%,transparent);cursor:pointer;font-size:14px;display:none;padding:0;}
.char-sheet.editing .acc-delete{display:inline;}

/* Quotes */
.quote-list{display:flex;flex-direction:column;gap:14px;}
.quote-entry{border-left:2px solid color-mix(in srgb,var(--cx-accent-deep) 30%,transparent);padding:0 0 0 14px;position:relative;}
.quote-text{font-family:'EB Garamond',serif;font-style:italic;font-size:17px;color:var(--cx-accent-bright);}
.quote-delete{background:transparent;border:none;color:color-mix(in srgb,var(--cx-danger) 40%,transparent);cursor:pointer;font-size:14px;display:none;padding:0;position:absolute;top:0;right:0;}
.char-sheet.editing .quote-delete{display:inline;}

/* Bottom quote bar */
.char-footer-quote{text-align:center;padding:18px 32px;border-top:1px solid color-mix(in srgb,var(--cx-accent-deep) 12%,transparent);font-family:'EB Garamond',serif;font-style:italic;font-size:16px;color:var(--cx-text-dim);}

/* Char sheet save status */
.char-save-status{font-size:11px;color:var(--cx-text-dim);font-family:'EB Garamond',serif;}
.char-shared-save-status{margin:0 0 16px;padding:10px 14px;border:1px solid color-mix(in srgb,var(--cx-accent-deep) 35%,transparent);border-radius:10px;background:color-mix(in srgb,var(--cx-surface) 72%,transparent);color:var(--cx-accent-bright);font-family:'EB Garamond',serif;font-size:14px;line-height:1.35;}
.char-shared-save-status.ok{border-color:color-mix(in srgb,var(--cx-success) 45%,transparent);color:var(--cx-success);background:color-mix(in srgb,var(--cx-success-deep) 12%,transparent);}
.char-shared-save-status.error{border-color:color-mix(in srgb,var(--cx-danger) 55%,transparent);color:var(--cx-danger);background:color-mix(in srgb,var(--cx-danger-deep) 16%,transparent);}

@media(max-width:900px){
  .char-sheet-header{grid-template-columns:1fr;}
  .char-portrait-wrap{height:320px;}
  .char-top-grid{grid-template-columns:1fr;}
}


/* Character Decision Assistant */


/* ── Party Inventory ── */
.inv-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:24px;}
.inv-card{background:color-mix(in srgb,var(--cx-bg) 97%,transparent);border:1px solid color-mix(in srgb,var(--cx-accent-deep) 20%,transparent);border-radius:16px;padding:22px;}
.inv-card-title{font-family:Cinzel,serif;font-size:13px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--cx-accent);margin:0 0 16px;display:flex;align-items:center;gap:8px;}
.inv-card-title::before{content:'✦';font-size:10px;opacity:.7;}
.gold-amount{font-family:Cinzel,serif;font-size:52px;font-weight:900;color:var(--cx-accent);line-height:1;margin:0 0 16px;}
.gold-amount span{font-size:22px;color:var(--cx-text-dim);margin-left:6px;}
.inv-btn-row{display:flex;gap:10px;margin-bottom:16px;}
.inv-btn{padding:9px 18px;border-radius:10px;font-family:Cinzel,serif;font-size:11px;font-weight:700;letter-spacing:.06em;cursor:pointer;border:none;}
.inv-btn.gold{background:linear-gradient(180deg,var(--cx-accent),var(--cx-accent-dim));color:var(--cx-field);}
.inv-btn.spend{background:color-mix(in srgb,var(--cx-danger) 20%,transparent);border:1px solid color-mix(in srgb,var(--cx-danger) 40%,transparent);color:var(--cx-danger);}
.inv-btn.add{background:color-mix(in srgb,var(--cx-accent-deep) 12%,transparent);border:1px solid color-mix(in srgb,var(--cx-accent-deep) 35%,transparent);color:var(--cx-accent);}
.inv-btn.del{background:transparent;border:1px solid color-mix(in srgb,var(--cx-text-strong) 10%,transparent);color:var(--cx-text-dim);padding:6px 10px;}
.inv-btn.del:hover{border-color:color-mix(in srgb,var(--cx-danger) 40%,transparent);color:var(--cx-danger);}
.tx-log{max-height:200px;overflow-y:auto;display:flex;flex-direction:column;gap:6px;}
.tx-row{display:flex;justify-content:space-between;align-items:baseline;padding:6px 0;border-bottom:1px solid color-mix(in srgb,var(--cx-text-strong) 5%,transparent);font-family:'EB Garamond',serif;font-size:14px;}
.tx-row:last-child{border-bottom:none;}
.tx-amount{font-weight:700;}
.tx-amount.pos{color:var(--cx-success);}
.tx-amount.neg{color:var(--cx-danger);}
.tx-desc{color:var(--cx-text-soft);flex:1;margin:0 12px;}
.tx-date{color:var(--cx-text-dim);font-size:12px;white-space:nowrap;}
.item-table{width:100%;border-collapse:collapse;}
.item-table th{font-family:Cinzel,serif;font-size:10px;letter-spacing:.1em;color:var(--cx-text-dim);text-align:left;padding:0 0 8px;border-bottom:1px solid color-mix(in srgb,var(--cx-text-strong) 8%,transparent);}
.item-table td{padding:8px 0;border-bottom:1px solid color-mix(in srgb,var(--cx-text-strong) 4%,transparent);font-family:'EB Garamond',serif;font-size:15px;color:var(--cx-text-soft);vertical-align:middle;}
.item-table tr:last-child td{border-bottom:none;}
.potion-row{display:flex;align-items:center;justify-content:space-between;padding:8px 0;border-bottom:1px solid color-mix(in srgb,var(--cx-text-strong) 5%,transparent);}
.potion-row:last-child{border-bottom:none;}
.potion-name{font-family:'EB Garamond',serif;font-size:15px;color:var(--cx-text-soft);flex:1;}
.potion-controls{display:flex;align-items:center;gap:8px;}
.potion-qty{font-family:Cinzel,serif;font-size:16px;color:var(--cx-accent);min-width:28px;text-align:center;}
.potion-btn{background:color-mix(in srgb,var(--cx-text-strong) 7%,transparent);border:1px solid color-mix(in srgb,var(--cx-text-strong) 12%,transparent);border-radius:6px;width:28px;height:28px;color:var(--cx-text);cursor:pointer;font-size:14px;display:flex;align-items:center;justify-content:center;}
.potion-btn:hover{border-color:color-mix(in srgb,var(--cx-accent-deep) 40%,transparent);color:var(--cx-accent);}
.inv-modal{display:none;position:fixed;inset:0;background:rgba(0,0,0,.7);z-index:500;align-items:center;justify-content:center;}
.inv-modal.open{display:flex;}
.inv-modal-box{background:color-mix(in srgb,var(--cx-bg) 98%,transparent);border:1px solid color-mix(in srgb,var(--cx-accent-deep) 30%,transparent);border-radius:16px;padding:28px;width:360px;max-width:90vw;}
.inv-modal-title{font-family:Cinzel,serif;font-size:16px;color:var(--cx-text-strong);margin:0 0 16px;}
.inv-input{width:100%;background:color-mix(in srgb,var(--cx-text-strong) 6%,transparent);border:1px solid color-mix(in srgb,var(--cx-accent-deep) 25%,transparent);border-radius:8px;padding:10px 14px;color:var(--cx-text);font-family:'EB Garamond',serif;font-size:15px;outline:none;box-sizing:border-box;margin-bottom:10px;}
.inv-input:focus{border-color:color-mix(in srgb,var(--cx-accent-deep) 60%,transparent);}
.inv-save-status{font-size:12px;color:var(--cx-text-dim);font-family:'EB Garamond',serif;margin-top:8px;}
@media(max-width:900px){.inv-grid{grid-template-columns:1fr;}}

/* ── Player Awards ── */
.awards-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:20px;margin-bottom:24px;}
.award-card{background:color-mix(in srgb,var(--cx-bg) 97%,transparent);border:1px solid color-mix(in srgb,var(--cx-accent-deep) 20%,transparent);border-radius:16px;padding:22px;}
.award-title{font-family:Cinzel,serif;font-size:13px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--cx-accent);margin:0 0 4px;display:flex;align-items:center;gap:8px;}
.award-sub{font-size:12px;color:var(--cx-text-dim);margin:0 0 16px;font-family:'EB Garamond',serif;}
.vote-option{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:10px;cursor:pointer;border:1px solid color-mix(in srgb,var(--cx-text-strong) 6%,transparent);margin-bottom:8px;transition:border-color .15s,background .15s;}
.vote-option:hover{background:color-mix(in srgb,var(--cx-accent-deep) 6%,transparent);border-color:color-mix(in srgb,var(--cx-accent-deep) 25%,transparent);}
.vote-option.selected{background:color-mix(in srgb,var(--cx-accent-deep) 12%,transparent);border-color:var(--cx-accent);}
.vote-option img{width:36px;height:36px;border-radius:50%;object-fit:cover;border:2px solid color-mix(in srgb,var(--cx-accent-deep) 25%,transparent);}
.vote-option .vote-name{font-family:Cinzel,serif;font-size:13px;color:var(--cx-text-strong);flex:1;}
.vote-radio{width:16px;height:16px;border-radius:50%;border:2px solid color-mix(in srgb,var(--cx-accent-deep) 40%,transparent);flex-shrink:0;display:flex;align-items:center;justify-content:center;}
.vote-option.selected .vote-radio::after{content:'';width:8px;height:8px;border-radius:50%;background:var(--cx-accent);display:block;}
.trophy-list{display:flex;flex-direction:column;gap:8px;}
.trophy-row{display:flex;align-items:center;gap:12px;padding:8px 0;border-bottom:1px solid color-mix(in srgb,var(--cx-text-strong) 5%,transparent);}
.trophy-row:last-child{border-bottom:none;}
.trophy-rank{font-family:Cinzel,serif;font-size:18px;width:28px;text-align:center;}
.trophy-name{font-family:Cinzel,serif;font-size:14px;color:var(--cx-text-strong);flex:1;}
.trophy-wins{font-family:Cinzel,serif;font-size:13px;color:var(--cx-accent);white-space:nowrap;}
.session-history{display:flex;flex-direction:column;gap:6px;}
.history-row{display:flex;gap:12px;align-items:baseline;padding:7px 0;border-bottom:1px solid color-mix(in srgb,var(--cx-text-strong) 5%,transparent);font-family:'EB Garamond',serif;font-size:14px;color:var(--cx-text-soft);}
.history-row:last-child{border-bottom:none;}
.history-session{font-family:Cinzel,serif;font-size:12px;color:var(--cx-text-dim);min-width:70px;}
.awards-status{font-size:12px;color:var(--cx-text-dim);font-family:'EB Garamond',serif;margin-top:6px;min-height:16px;}
.ballot-open-badge{display:inline-block;background:color-mix(in srgb,var(--cx-success) 15%,transparent);border:1px solid color-mix(in srgb,var(--cx-success) 40%,transparent);border-radius:20px;padding:3px 12px;font-family:Cinzel,serif;font-size:10px;letter-spacing:.1em;color:var(--cx-success);margin-left:10px;}
.ballot-closed-badge{display:inline-block;background:color-mix(in srgb,var(--cx-danger) 12%,transparent);border:1px solid color-mix(in srgb,var(--cx-danger) 30%,transparent);border-radius:20px;padding:3px 12px;font-family:Cinzel,serif;font-size:10px;letter-spacing:.1em;color:var(--cx-danger);margin-left:10px;}
.dm-mvp-input{background:color-mix(in srgb,var(--cx-bg) 80%,transparent);border:1px solid color-mix(in srgb,var(--cx-accent-deep) 25%,transparent);border-radius:8px;padding:8px 12px;color:var(--cx-text);font-family:'EB Garamond',serif;font-size:15px;width:100%;box-sizing:border-box;outline:none;margin-bottom:10px;}
@media(max-width:900px){.awards-grid{grid-template-columns:1fr;}}


/* ── Legendary Items Page ── */
.items-page-wrap{display:flex;flex-direction:column;gap:32px;}
.items-arsenal-section{display:flex;flex-direction:column;gap:14px;}
.items-section-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:4px;}
.items-section-title{font-family:Cinzel,serif;font-size:16px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--cx-accent);display:flex;align-items:center;gap:10px;}
.items-section-title::before{content:'✦';font-size:11px;opacity:.7;}
.items-section-line{flex:1;height:1px;background:linear-gradient(90deg,color-mix(in srgb,var(--cx-accent-deep) 50%,transparent),transparent);margin-left:12px;}

/* Gilded item card */
.leg-item-card{
  position:relative;
  background:color-mix(in srgb,var(--cx-bg) 97%,transparent);
  border-radius:4px;
  padding:20px 22px;
}
.leg-item-card::before{
  content:'';position:absolute;inset:0;border-radius:4px;pointer-events:none;
  border:1px solid color-mix(in srgb,var(--cx-accent-deep) 55%,transparent);
  box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--cx-accent-deep) 12%,transparent), 0 0 20px color-mix(in srgb,var(--cx-accent-deep) 6%,transparent);
}
/* Corner ornaments */
.leg-item-card::after{
  content:'';position:absolute;inset:0;border-radius:4px;pointer-events:none;
  background:
    radial-gradient(circle at 0% 0%, color-mix(in srgb,var(--cx-accent-deep) 18%,transparent) 0%, transparent 40%),
    radial-gradient(circle at 100% 0%, color-mix(in srgb,var(--cx-accent-deep) 18%,transparent) 0%, transparent 40%),
    radial-gradient(circle at 0% 100%, color-mix(in srgb,var(--cx-accent-deep) 18%,transparent) 0%, transparent 40%),
    radial-gradient(circle at 100% 100%, color-mix(in srgb,var(--cx-accent-deep) 18%,transparent) 0%, transparent 40%);
}
.leg-corner{position:absolute;font-size:14px;color:color-mix(in srgb,var(--cx-accent-deep) 60%,transparent);line-height:1;pointer-events:none;}
.leg-corner.tl{top:5px;left:7px;}
.leg-corner.tr{top:5px;right:7px;}
.leg-corner.bl{bottom:5px;left:7px;}
.leg-corner.br{bottom:5px;right:7px;}

.leg-item-inner{display:flex;gap:18px;align-items:flex-start;position:relative;z-index:1;}
.leg-item-img{width:90px;height:110px;flex-shrink:0;border-radius:4px;border:1px solid color-mix(in srgb,var(--cx-accent-deep) 35%,transparent);overflow:hidden;background:color-mix(in srgb,var(--cx-bg) 80%,transparent);display:flex;align-items:center;justify-content:center;cursor:default;position:relative;transition:border-color .2s;}
.leg-item-img img{width:100%;height:100%;object-fit:cover;display:block;}
.leg-item-img-placeholder{color:color-mix(in srgb,var(--cx-accent-deep) 30%,transparent);font-size:28px;}
.leg-item-img-upload-hint{position:absolute;bottom:0;left:0;right:0;background:rgba(0,0,0,.75);color:var(--cx-accent);font-size:10px;text-align:center;padding:4px;font-family:Cinzel,serif;letter-spacing:.04em;opacity:0;transition:opacity .2s;}
.items-editing .leg-item-img{cursor:pointer;border-color:color-mix(in srgb,var(--cx-accent-deep) 50%,transparent);border-style:dashed;}
.items-editing .leg-item-img:hover{border-color:var(--cx-accent);box-shadow:0 0 12px color-mix(in srgb,var(--cx-accent-deep) 20%,transparent);}
.items-editing .leg-item-img:hover .leg-item-img-upload-hint{opacity:1;}
.leg-item-img-input{display:none;}

.leg-item-content{flex:1;min-width:0;}
.leg-item-name-row{display:flex;align-items:center;gap:10px;margin-bottom:2px;}
.leg-item-name{font-family:Cinzel,serif;font-size:16px;font-weight:700;color:var(--cx-text-strong);}
.leg-item-type-badge{font-size:11px;color:var(--cx-accent);font-style:italic;font-family:'EB Garamond',serif;}
.leg-item-divider{width:100%;height:1px;background:linear-gradient(90deg,color-mix(in srgb,var(--cx-accent-deep) 35%,transparent),transparent);margin:8px 0;}
.leg-stat-rows{display:flex;flex-direction:column;gap:5px;margin-bottom:8px;}
.leg-stat-row{display:grid;grid-template-columns:130px 1fr;gap:8px;font-size:14px;}
.leg-stat-key{color:var(--cx-accent);font-family:Cinzel,serif;font-size:11px;letter-spacing:.06em;text-transform:uppercase;padding-top:2px;}
.leg-stat-val{color:var(--cx-text-soft);font-family:'EB Garamond',serif;font-size:15px;line-height:1.5;}
.leg-abilities{display:flex;flex-direction:column;gap:8px;}
.leg-ability{border-left:2px solid color-mix(in srgb,var(--cx-accent-deep) 35%,transparent);padding-left:10px;}
.leg-ability-name{font-family:Cinzel,serif;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--cx-accent);margin-bottom:2px;}
.leg-ability-desc{font-family:'EB Garamond',serif;font-size:14px;color:var(--cx-text-soft);line-height:1.55;}
.leg-item-delete{position:absolute;top:8px;right:10px;background:color-mix(in srgb,var(--cx-danger) 15%,transparent);border:1px solid color-mix(in srgb,var(--cx-danger) 30%,transparent);border-radius:6px;color:color-mix(in srgb,var(--cx-danger) 50%,transparent);cursor:pointer;font-size:11px;font-family:Cinzel,serif;letter-spacing:.05em;padding:4px 10px;z-index:2;display:none;transition:all .2s;}
.items-editing .leg-item-delete{display:block;}
.items-editing .leg-item-delete:hover{background:color-mix(in srgb,var(--cx-danger) 35%,transparent);border-color:var(--cx-danger);color:var(--cx-danger);}

/* Edit mode fields */
.leg-field{background:transparent;border:none;color:inherit;font-family:inherit;font-size:inherit;width:100%;outline:none;resize:none;padding:0;}
.leg-field{background:transparent;border:1px solid transparent;border-radius:3px;outline:none;padding:2px 4px;width:100%;font-size:inherit;color:inherit;font-family:inherit;transition:background .15s,border-color .15s;resize:none;}
.leg-field[readonly]{pointer-events:none;cursor:default;}
.items-editing .leg-field{background:color-mix(in srgb,var(--cx-accent-deep) 6%,transparent);border:1px solid color-mix(in srgb,var(--cx-accent-deep) 25%,transparent);border-radius:4px;padding:3px 6px;pointer-events:auto;cursor:text;}
.items-editing .leg-field:focus{border-color:color-mix(in srgb,var(--cx-accent-deep) 60%,transparent);background:color-mix(in srgb,var(--cx-accent-deep) 10%,transparent);}
.items-editing textarea.leg-field{resize:vertical;min-height:38px;}
/* ── NPC SUB-TABS ── */
.npc-subtabs{display:flex;gap:8px;margin:4px 0 22px;border-bottom:1px solid color-mix(in srgb,var(--cx-accent-deep) 22%,transparent);}
.npc-subtab{font-family:'Cinzel',serif;font-size:14px;letter-spacing:.06em;color:var(--cx-text-dim);background:transparent;border:0;border-bottom:2px solid transparent;padding:10px 16px;margin-bottom:-1px;cursor:pointer;transition:color .18s ease,border-color .18s ease;}
.npc-subtab:hover{color:var(--cx-accent-bright);}
.npc-subtab.active{color:var(--cx-accent-bright);border-bottom-color:var(--cx-accent-deep);}
/* ── TORIL NPC CARDS ── */
#toril-npcs-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;}
.tnpc-card{display:grid;grid-template-columns:150px 1fr;gap:16px;background:color-mix(in srgb,var(--cx-bg) 97%,transparent);border-radius:4px;padding:16px 18px;position:relative;}
.tnpc-card::before{content:'';position:absolute;inset:0;border-radius:4px;pointer-events:none;border:1px solid color-mix(in srgb,var(--cx-accent-deep) 50%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--cx-accent-deep) 10%,transparent),0 0 18px color-mix(in srgb,var(--cx-accent-deep) 5%,transparent);}
.tnpc-portrait{border-radius:4px;overflow:hidden;border:1px solid color-mix(in srgb,var(--cx-accent-deep) 40%,transparent);align-self:start;background:var(--cx-bg);}
.tnpc-portrait img{width:100%;display:block;aspect-ratio:2/3;object-fit:cover;}
.tnpc-body{position:relative;z-index:1;min-width:0;}
.tnpc-name{font-family:'Cinzel',serif;font-size:17px;font-weight:700;color:var(--cx-text-strong);line-height:1.2;}
.tnpc-title{font-family:'EB Garamond',serif;font-style:italic;font-size:13px;color:var(--cx-accent);margin-top:3px;line-height:1.35;}
.tnpc-divider{width:100%;height:1px;background:linear-gradient(90deg,color-mix(in srgb,var(--cx-accent-deep) 40%,transparent),transparent);margin:10px 0;}
.tnpc-field{margin-bottom:7px;font-family:'EB Garamond',serif;font-size:13.5px;line-height:1.5;color:var(--cx-text-soft);}
.tnpc-flabel{display:inline-block;font-family:'Cinzel',serif;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--cx-accent-deep);margin-right:6px;}
.tnpc-field.secret .tnpc-flabel{color:var(--cx-danger);}
.tnpc-quote{margin-top:10px;padding-left:11px;border-left:2px solid color-mix(in srgb,var(--cx-accent-deep) 45%,transparent);font-family:'EB Garamond',serif;font-style:italic;font-size:14px;color:var(--cx-accent-bright);line-height:1.5;}
@media(max-width:1000px){#toril-npcs-grid{grid-template-columns:1fr;}}
@media(max-width:520px){.tnpc-card{grid-template-columns:1fr;}.tnpc-portrait{max-width:200px;margin:0 auto;}}
.leg-field[readonly]{pointer-events:none;}

/* Add item / controls */
.items-add-btn{background:transparent;border:1px dashed color-mix(in srgb,var(--cx-accent-deep) 30%,transparent);border-radius:4px;padding:10px;color:var(--cx-accent);font-family:Cinzel,serif;font-size:12px;letter-spacing:.08em;cursor:pointer;width:100%;display:none;}
.items-editing .items-add-btn{display:block;}
.items-add-btn:hover{background:color-mix(in srgb,var(--cx-accent-deep) 8%,transparent);border-color:color-mix(in srgb,var(--cx-accent-deep) 60%,transparent);}
.items-add-stat-btn,.items-add-ability-btn{background:transparent;border:1px dashed color-mix(in srgb,var(--cx-accent-deep) 20%,transparent);border-radius:3px;padding:3px 8px;color:var(--cx-accent);font-family:Cinzel,serif;font-size:10px;cursor:pointer;display:none;margin-top:4px;}
.items-editing .items-add-stat-btn,.items-editing .items-add-ability-btn{display:inline-block;}

/* Always-visible add button in section header */
.items-add-btn-inline{background:color-mix(in srgb,var(--cx-accent-deep) 10%,transparent);border:1px solid color-mix(in srgb,var(--cx-accent-deep) 30%,transparent);border-radius:6px;padding:5px 12px;color:var(--cx-accent);font-family:Cinzel,serif;font-size:10px;letter-spacing:.08em;cursor:pointer;flex-shrink:0;transition:all .2s;}
.items-add-btn-inline:hover{background:color-mix(in srgb,var(--cx-accent-deep) 20%,transparent);border-color:var(--cx-accent);box-shadow:0 0 12px color-mix(in srgb,var(--cx-accent-deep) 20%,transparent);}

/* Empty state */
.items-empty-msg{font-family:'EB Garamond',serif;font-size:15px;color:var(--cx-text-faint);font-style:italic;padding:16px 0;}
.leg-row-delete,.leg-ability-delete{background:transparent;border:none;color:color-mix(in srgb,var(--cx-danger) 35%,transparent);cursor:pointer;font-size:12px;padding:0 4px;display:none;}
.items-editing .leg-row-delete,.items-editing .leg-ability-delete{display:inline;}

/* Edit bar */
.items-edit-bar{display:flex;align-items:center;gap:10px;margin-bottom:20px;}
.items-edit-btn{background:color-mix(in srgb,var(--cx-accent-deep) 10%,transparent);border:1px solid color-mix(in srgb,var(--cx-accent-deep) 35%,transparent);border-radius:8px;padding:7px 16px;color:var(--cx-accent);font-family:Cinzel,serif;font-size:11px;letter-spacing:.08em;cursor:pointer;}
.items-edit-btn.active{background:color-mix(in srgb,var(--cx-accent-deep) 25%,transparent);border-color:var(--cx-accent);}
.items-save-btn{background:linear-gradient(180deg,var(--cx-accent),var(--cx-accent-dim));border:none;border-radius:8px;padding:7px 16px;color:var(--cx-field);font-family:Cinzel,serif;font-size:11px;font-weight:700;letter-spacing:.08em;cursor:pointer;display:none;}
.items-save-status{font-size:12px;color:var(--cx-text-dim);font-family:'EB Garamond',serif;}
@media(max-width:700px){.leg-item-inner{flex-direction:column}.leg-item-img{width:100%;height:160px;}.leg-stat-row{grid-template-columns:1fr;gap:2px;}}


/* ═══════════════════════════════════════════════════
   VISUAL POLISH PASS
   ═══════════════════════════════════════════════════ */


/* ── Stars & Wishes — deploy143 dark-gold codex redesign ──
   Same class names and DOM as before (js/starswishes.js and mobile.css
   overrides untouched); surfaces, type and controls re-cut to match the
   Pantheon / Creatures / Rules / Wiki idiom: var(--cx-surface) cards, gold-tinted
   borders, Cinzel small-caps labels, EB Garamond body, hover lift. Star
   keeps the gold accent; Wish carries a cool indigo counterpart. */
#page-starswishes{--swg:var(--cx-accent);--swg-dim:var(--cx-accent-deep);--sww:#9fb4ea}
.sw-explainer{display:grid;grid-template-columns:1fr auto 1fr;gap:0;background:var(--cx-surface);border:1px solid color-mix(in srgb,var(--cx-accent) 16%,transparent);border-radius:12px;overflow:hidden;margin-bottom:26px}
.sw-explainer-col{padding:26px 30px;display:flex;flex-direction:column;align-items:center;text-align:center;gap:10px}
.sw-explainer-col.star{background:linear-gradient(160deg,color-mix(in srgb,var(--swg) 7%,transparent),transparent 55%)}
.sw-explainer-col.wish{background:linear-gradient(200deg,color-mix(in srgb,var(--sww) 7%,transparent),transparent 55%)}
.sw-explainer-divider{width:1px;background:linear-gradient(180deg,transparent,color-mix(in srgb,var(--cx-accent) 28%,transparent),transparent)}
.sw-explainer-icon{width:46px;height:46px;display:grid;place-items:center;font-size:22px;border-radius:10px;border:1px solid color-mix(in srgb,var(--swg) 50%,transparent);background:color-mix(in srgb,var(--swg) 12%,transparent);color:var(--swg)}
.sw-explainer-col.wish .sw-explainer-icon{border-color:color-mix(in srgb,var(--sww) 50%,transparent);background:color-mix(in srgb,var(--sww) 12%,transparent);color:var(--sww)}
.sw-explainer-label{font-family:Cinzel,serif;font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--swg-dim)}
.sw-explainer-col.wish .sw-explainer-label{color:var(--sww)}
.sw-explainer-text{font-family:'EB Garamond',serif;font-size:15px;color:var(--cx-text-soft);line-height:1.65;max-width:300px}

.sw-layout{display:grid;grid-template-columns:1fr 220px;gap:16px;margin-bottom:26px;align-items:start}
.sw-submit-card{background:var(--cx-surface);border:1px solid color-mix(in srgb,var(--cx-accent) 16%,transparent);border-radius:12px;padding:20px 22px}
.sw-card-title{font-family:Cinzel,serif;font-size:12.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--swg-dim);margin-bottom:16px;display:flex;align-items:center;gap:8px}
.sw-field-group{margin-bottom:14px}
.sw-label{font-size:10.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--cx-text-dim);display:block;margin-bottom:5px;font-family:'EB Garamond',serif}
.sw-select{width:100%;box-sizing:border-box;background:var(--cx-field);border:1px solid color-mix(in srgb,var(--cx-accent) 22%,transparent);border-radius:8px;padding:9px 30px 9px 11px;color:var(--cx-text);font-family:'EB Garamond',serif;font-size:14.5px;outline:none;cursor:pointer;-webkit-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%23c9a24a' fill='none' stroke-width='1.4'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 11px center}
.sw-select:focus{border-color:var(--swg-dim)}
.sw-textarea{width:100%;box-sizing:border-box;background:var(--cx-field);border:1px solid color-mix(in srgb,var(--cx-accent) 22%,transparent);border-radius:8px;padding:10px 12px;color:var(--cx-text);font-family:'EB Garamond',serif;font-size:15px;line-height:1.6;resize:vertical;outline:none}
.sw-textarea:focus{border-color:var(--swg-dim)}
.sw-textarea::placeholder{color:var(--cx-text-faint)}
.sw-submit-btn{display:inline-flex;align-items:center;gap:7px;background:linear-gradient(180deg,var(--cx-accent),var(--cx-accent-deep));border:1px solid var(--cx-accent);border-radius:8px;padding:9px 18px;color:var(--cx-on-accent);font-family:Cinzel,serif;font-size:12.5px;font-weight:600;letter-spacing:.03em;cursor:pointer;white-space:nowrap}
.sw-submit-btn:hover{filter:brightness(1.06)}
.sw-status{font-family:'EB Garamond',serif;font-size:13.5px;color:var(--cx-text-dim);font-style:italic}
.sw-status.ok{color:var(--cx-success);font-style:normal}.sw-status.err{color:var(--cx-danger);font-style:normal}

.sw-history-nav{background:var(--cx-surface);border:1px solid color-mix(in srgb,var(--cx-accent) 16%,transparent);border-radius:12px;padding:20px;text-align:center}
.sw-nav-btn{display:inline-flex;align-items:center;justify-content:center;background:color-mix(in srgb,var(--cx-accent) 10%,transparent);border:1px solid color-mix(in srgb,var(--cx-accent) 40%,transparent);border-radius:8px;padding:7px 14px;color:var(--swg);font-family:Cinzel,serif;font-size:13px;cursor:pointer;transition:background .15s}
.sw-nav-btn:hover{background:color-mix(in srgb,var(--cx-accent) 20%,transparent)}
.sw-nav-btn:disabled{opacity:.3;cursor:default}
.sw-session-label{font-family:Cinzel,serif;font-size:15px;color:var(--cx-accent);min-width:80px;margin-top:12px}
.sw-stat{font-family:'EB Garamond',serif;font-size:13px;color:var(--cx-text-dim);font-style:italic;margin-top:6px}

.sw-entries{display:flex;flex-direction:column;gap:13px}
.sw-loading{color:var(--cx-text-dim);font-family:'EB Garamond',serif;font-size:15px;font-style:italic;padding:20px 0}
.sw-entry-card{background:var(--cx-surface);border:1px solid color-mix(in srgb,var(--cx-accent) 16%,transparent);border-radius:12px;padding:18px 22px;position:relative;transition:transform .15s,border-color .15s,box-shadow .15s}
.sw-entry-card:hover{transform:translateY(-3px);border-color:color-mix(in srgb,var(--cx-accent) 50%,transparent);box-shadow:0 12px 30px rgba(0,0,0,.45)}
.sw-entry-player{font-family:Cinzel,serif;font-size:15px;color:var(--cx-accent);margin-bottom:12px;display:flex;align-items:center;gap:9px}
.sw-entry-player::before{content:'';display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--swg);box-shadow:0 0 8px color-mix(in srgb,var(--swg) 60%,transparent)}
.sw-entry-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.sw-entry-block{display:flex;flex-direction:column;gap:6px;background:var(--cx-surface-2);border:1px solid color-mix(in srgb,var(--cx-accent) 10%,transparent);border-left:3px solid var(--swg);border-radius:8px;padding:12px 14px}
.sw-entry-row .sw-entry-block:last-child{border-left-color:var(--sww)}
.sw-entry-block-label{font-family:Cinzel,serif;font-size:10.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--swg-dim);display:flex;align-items:center;gap:5px}
.sw-entry-row .sw-entry-block:last-child .sw-entry-block-label{color:var(--sww)}
.sw-entry-block-text{font-family:'EB Garamond',serif;font-size:15.5px;color:var(--cx-text);line-height:1.6}
.sw-entry-del{position:absolute;top:10px;right:12px;background:none;border:none;color:var(--cx-text-faint);cursor:pointer;font-size:14px;transition:color .2s}
.sw-entry-del:hover{color:var(--cx-danger)}
.sw-empty{color:var(--cx-text-dim);font-family:'EB Garamond',serif;font-size:15px;font-style:italic;padding:22px 0;text-align:center;background:var(--cx-surface);border:1px dashed color-mix(in srgb,var(--cx-accent) 18%,transparent);border-radius:12px}
@media(max-width:800px){.sw-explainer{grid-template-columns:1fr}.sw-explainer-divider{width:100%;height:1px}.sw-layout{grid-template-columns:1fr}.sw-entry-row{grid-template-columns:1fr}}
/* the session number input is shared with the Sessions page — recolor it
   only inside Stars & Wishes so that page stays untouched */
#page-starswishes .session-number-input{background:var(--cx-field);border-color:color-mix(in srgb,var(--cx-accent) 22%,transparent);color:var(--cx-text)}
#page-starswishes .session-number-input:focus{border-color:var(--cx-accent-deep);box-shadow:none}
#page-starswishes .sw-session-input-wrap{color:var(--cx-text-dim);font-family:'EB Garamond',serif;font-size:10.5px}

/* ── Session event reorder ── */
.event-item{display:flex;align-items:center;gap:8px;margin-bottom:6px;}
.event-reorder{display:flex;flex-direction:column;gap:2px;flex-shrink:0;}
.ev-move-btn{background:color-mix(in srgb,var(--cx-accent) 8%,transparent);border:1px solid color-mix(in srgb,var(--cx-accent) 20%,transparent);border-radius:4px;color:color-mix(in srgb,var(--cx-accent) 60%,transparent);cursor:pointer;font-size:9px;padding:2px 5px;line-height:1;transition:all .15s;}
.ev-move-btn:hover:not(:disabled){background:color-mix(in srgb,var(--cx-accent) 20%,transparent);color:var(--cx-accent);border-color:color-mix(in srgb,var(--cx-accent) 50%,transparent);}
.ev-move-btn:disabled{opacity:.2;cursor:default;}
.ev-del-btn{background:none;border:1px solid transparent;border-radius:6px;color:color-mix(in srgb,var(--cx-danger) 30%,transparent);cursor:pointer;font-size:13px;padding:3px 7px;flex-shrink:0;transition:all .15s;}
.ev-del-btn:hover{color:var(--cx-danger);border-color:color-mix(in srgb,var(--cx-danger) 35%,transparent);background:color-mix(in srgb,var(--cx-danger) 10%,transparent);}
.event-input{flex:1;}

/* ── Portrait + stat layout (god forms, eld) ── */
.portrait-stat-grid{display:grid;grid-template-columns:280px 1fr;gap:24px;align-items:start;}

/* ── Multi-coin inventory system ── */
.gold-amount{font-family:Cinzel,serif;font-size:38px;font-weight:900;line-height:1.1;margin-bottom:8px;display:flex;align-items:baseline;gap:6px;flex-wrap:wrap;}
.coin-gp{color:var(--cx-accent);}
.coin-sp{color:var(--cx-text-soft);}
.coin-cp{color:var(--cx-accent-deep);}
.coin-label{font-size:14px;font-family:Cinzel,serif;opacity:.7;margin-right:4px;}

.inv-coin-breakdown{display:flex;align-items:center;gap:8px;font-family:'EB Garamond',serif;font-size:13px;color:var(--cx-text-dim);margin-bottom:12px;flex-wrap:wrap;}
.breakdown-item{display:flex;align-items:baseline;gap:3px;}
.breakdown-val{font-family:Cinzel,serif;font-size:14px;color:var(--cx-text-soft);}
.breakdown-sep{color:var(--cx-text-faint);}
.breakdown-note{font-size:12px;color:var(--cx-text-faint);margin-left:4px;}

.inv-coin-legend{display:flex;gap:12px;margin-bottom:14px;flex-wrap:wrap;}
.coin-legend-item{font-family:'EB Garamond',serif;font-size:12px;color:var(--cx-text-dim);display:flex;align-items:center;gap:4px;}
.clg{font-size:10px;}
.clg-gp{color:var(--cx-accent);}.clg-sp{color:var(--cx-text-soft);}.clg-cp{color:var(--cx-accent-deep);}

.tx-log-label{font-family:Cinzel,serif;font-size:10px;letter-spacing:.1em;color:var(--cx-text-dim);margin-bottom:8px;}
.tx-empty{color:var(--cx-text-dim);font-family:'EB Garamond',serif;font-size:14px;}

/* Coin input row in modal */
.coin-input-row{display:flex;align-items:flex-end;gap:6px;margin-bottom:12px;}
.coin-input-group{display:flex;flex-direction:column;gap:4px;flex:1;}
.coin-input-label{font-family:Cinzel,serif;font-size:10px;letter-spacing:.08em;text-transform:uppercase;}
.coin-gp-label{color:var(--cx-accent);}
.coin-sp-label{color:var(--cx-text-soft);}
.coin-cp-label{color:var(--cx-accent-deep);}
.coin-input{text-align:center;padding:8px 6px !important;font-family:Cinzel,serif !important;font-size:18px !important;font-weight:700;}
.coin-input-divider{font-size:18px;color:var(--cx-text-faint);padding-bottom:8px;flex-shrink:0;}

.coin-preview{font-family:Cinzel,serif;font-size:15px;color:var(--cx-accent);text-align:center;min-height:24px;margin-bottom:10px;letter-spacing:.06em;}

.inv-items-count{font-family:'EB Garamond',serif;font-size:13px;color:var(--cx-text-dim);margin-top:10px;}

/* ── Dragon entries ── */
.dragon-entry{display:grid;grid-template-columns:320px 1fr;gap:28px;align-items:start;margin-bottom:32px;}
.dragon-portrait-wrap{border-radius:12px;overflow:hidden;border:1px solid color-mix(in srgb,var(--cx-accent-deep) 25%,transparent);box-shadow:0 0 40px rgba(0,0,0,.6),0 0 20px color-mix(in srgb,var(--cx-accent-deep) 8%,transparent);flex-shrink:0;}
.dragon-portrait{width:100%;height:auto;display:block;transition:transform .4s ease;}
.dragon-portrait-wrap:hover .dragon-portrait{transform:scale(1.03);}
.dragon-content{min-width:0;}

/* ── Construct cards with portrait ── */
.construct-layout{display:grid;grid-template-columns:200px 1fr;gap:22px;align-items:start;}
.construct-portrait-wrap{height:280px;border-radius:10px;overflow:hidden;border:1px solid color-mix(in srgb,var(--cx-accent-deep) 28%,transparent);box-shadow:0 0 30px rgba(0,0,0,.6),0 0 16px color-mix(in srgb,var(--cx-accent-deep) 8%,transparent);background:var(--cx-bg);}
.construct-portrait{width:100%;height:100%;object-fit:cover;object-position:center top;display:block;transition:transform .4s ease;}
.construct-portrait-wrap:hover .construct-portrait{transform:scale(1.04);}
.construct-text{min-width:0;}

/* ── God cards with portrait ── */
.god-grid{display:flex;flex-direction:column;gap:24px;margin-bottom:28px;}
.god-card-full{display:grid;grid-template-columns:200px 1fr;gap:24px;align-items:start;background:color-mix(in srgb,var(--cx-bg) 97%,transparent);border:1px solid color-mix(in srgb,var(--cx-accent-deep) 20%,transparent);border-radius:14px;overflow:hidden;transition:transform .25s,box-shadow .25s;}
.god-card-full:hover{transform:translateY(-3px);box-shadow:0 12px 40px rgba(0,0,0,.5),0 0 20px color-mix(in srgb,var(--cx-accent-deep) 8%,transparent);}
.god-card-img-wrap{overflow:hidden;background:var(--cx-bg);min-height:220px;display:flex;align-items:flex-start;}
.god-card-img{width:100%;height:100%;object-fit:cover;object-position:top;display:block;transition:transform .4s ease;min-height:220px;}
.god-card-full:hover .god-card-img{transform:scale(1.04);}
.god-card-body{padding:20px 22px;display:flex;flex-direction:column;gap:10px;}

/* ── Mobile responsive ── */
@media(max-width:768px){
  .dragon-entry{grid-template-columns:1fr;}
  .dragon-portrait-wrap{max-height:300px;overflow:hidden;}
  .dragon-portrait{width:100%;object-fit:cover;object-position:center top;max-height:300px;}
  .construct-layout{grid-template-columns:1fr;}
  .construct-portrait-wrap{height:300px;}
  .god-card-full{grid-template-columns:1fr;}
  .god-card-img-wrap{min-height:200px;max-height:260px;}
  .god-card-img{max-height:260px;}
}

/* ── Planetary Progression (character sheets) ── */
.prog-intro{font-family:'EB Garamond',serif;font-size:14px;color:var(--cx-text-soft);line-height:1.6;margin-bottom:16px;}
.prog-subhead{font-family:'Cinzel',serif;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--cx-accent);margin:20px 0 4px;display:flex;align-items:center;gap:10px;}
.prog-note{font-family:'EB Garamond',serif;font-size:12.5px;color:var(--cx-accent-deep);margin-bottom:10px;line-height:1.5;}
.prog-fixed-tag{font-family:'EB Garamond',serif;font-size:10px;letter-spacing:.04em;text-transform:none;color:var(--cx-accent-deep);border:1px solid color-mix(in srgb,var(--cx-accent-deep) 50%,transparent);border-radius:10px;padding:1px 8px;}
.prog-combined-wrap{display:flex;gap:14px;flex-wrap:wrap;margin:6px 0 4px;}
.prog-combined-box{display:inline-flex;flex-direction:column;align-items:center;background:linear-gradient(160deg,color-mix(in srgb,var(--cx-accent-deep) 14%,transparent),color-mix(in srgb,var(--cx-accent-deep) 4%,transparent));border:1px solid color-mix(in srgb,var(--cx-accent-deep) 40%,transparent);border-radius:12px;padding:12px 30px;box-shadow:0 0 22px color-mix(in srgb,var(--cx-accent-deep) 6%,transparent);}
.prog-combined-label{font-family:'Cinzel',serif;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--cx-accent-deep);}
.prog-combined-num{font-family:'Cinzel',serif;font-size:46px;font-weight:900;color:var(--cx-accent);line-height:1.05;}
.prog-combined-sub{font-family:'EB Garamond',serif;font-size:12px;color:var(--cx-text-dim);}
.prog-combined-hp{background:linear-gradient(160deg,color-mix(in srgb,var(--cx-success) 16%,transparent),color-mix(in srgb,var(--cx-success) 4%,transparent));border-color:color-mix(in srgb,var(--cx-success) 42%,transparent);box-shadow:0 0 22px color-mix(in srgb,var(--cx-success) 6%,transparent);}
.prog-combined-hp .prog-combined-label{color:var(--cx-success);}
.prog-combined-hp .prog-combined-num{color:var(--cx-success);}
.prog-runs{display:flex;flex-direction:column;gap:10px;margin-bottom:8px;}
.prog-run{position:relative;border:1px solid var(--border);border-radius:10px;padding:12px 14px;background:color-mix(in srgb,var(--cx-surface) 50%,transparent);}
.prog-run-idx{font-family:'Cinzel',serif;font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--cx-accent-deep);margin-bottom:8px;}
.prog-run-delete{position:absolute;top:8px;right:8px;background:transparent;border:none;color:color-mix(in srgb,var(--cx-danger) 50%,transparent);cursor:pointer;font-size:13px;padding:2px 6px;line-height:1;}
.prog-run-delete:hover{color:var(--cx-danger);}
.prog-run-grid{display:grid;grid-template-columns:1.3fr 1.3fr 1.3fr .7fr .7fr;gap:10px;}
.prog-fld{display:flex;flex-direction:column;gap:3px;min-width:0;}
.prog-fld label{font-family:'Cinzel',serif;font-size:9px;letter-spacing:.08em;text-transform:uppercase;color:var(--cx-accent-deep);}
.prog-fld .char-field{width:100%;}
.slot-grid{display:grid;grid-template-columns:repeat(9,1fr);gap:8px;margin-bottom:6px;}
.slot-cell{display:flex;flex-direction:column;align-items:center;gap:4px;background:color-mix(in srgb,var(--cx-surface) 50%,transparent);border:1px solid var(--border);border-radius:8px;padding:8px 4px;}
.slot-label{font-family:'Cinzel',serif;font-size:10px;color:var(--cx-accent-deep);letter-spacing:.03em;}
.slot-input{width:100%;text-align:center;padding-left:4px !important;padding-right:4px !important;}
.stacked-list{display:flex;flex-direction:column;gap:7px;margin-bottom:8px;}
.stacked-entry{display:grid;grid-template-columns:140px 1fr 28px;gap:8px;align-items:center;}
.stacked-cat{font-size:12px !important;color:var(--cx-accent) !important;}
.stacked-delete{background:transparent;border:none;color:color-mix(in srgb,var(--cx-danger) 50%,transparent);cursor:pointer;font-size:13px;line-height:1;}
.stacked-delete:hover{color:var(--cx-danger);}
.core-stats-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;}
.core-stat{display:flex;flex-direction:column;align-items:center;gap:4px;background:color-mix(in srgb,var(--cx-surface) 50%,transparent);border:1px solid color-mix(in srgb,var(--cx-accent-deep) 28%,transparent);border-radius:8px;padding:8px 4px;}
.core-label{font-family:'Cinzel',serif;font-size:11px;color:var(--cx-accent-deep);letter-spacing:.06em;}
.core-input{width:100%;text-align:center;padding-left:4px !important;padding-right:4px !important;}

/* ── Combined HP combat tracker ── */
.prog-hp-tracker{padding:12px 18px;min-width:212px;}
.prog-hp-readout{display:flex;align-items:baseline;justify-content:center;gap:6px;line-height:1.05;margin:2px 0 9px;}
.prog-hp-cur{font-family:'Cinzel',serif;font-size:42px;font-weight:900;color:var(--cx-success);transition:color .2s;}
.prog-hp-cur.hp-low{color:var(--cx-accent);}
.prog-hp-cur.hp-zero{color:var(--cx-danger);}
.prog-hp-slash{font-family:'Cinzel',serif;font-size:22px;color:var(--cx-text-dim);}
.prog-hp-max{font-family:'Cinzel',serif;font-size:24px;font-weight:700;color:var(--cx-text-dim);}
.prog-hp-btns{display:flex;gap:6px;margin-bottom:8px;flex-wrap:wrap;justify-content:center;}
.hp-step{min-width:42px;font-family:'Cinzel',serif;font-size:13px;font-weight:600;border-radius:8px;padding:6px 10px;cursor:pointer;background:color-mix(in srgb,var(--cx-text-strong) 6%,transparent);border:1px solid color-mix(in srgb,var(--cx-text-strong) 15%,transparent);color:var(--cx-text);transition:background .15s,border-color .15s,transform .08s;}
.hp-step:active{transform:translateY(1px);}
.hp-dmg{background:color-mix(in srgb,var(--cx-danger) 14%,transparent);border-color:color-mix(in srgb,var(--cx-danger) 40%,transparent);color:var(--cx-danger);}
.hp-dmg:hover{background:color-mix(in srgb,var(--cx-danger) 26%,transparent);}
.hp-heal{background:color-mix(in srgb,var(--cx-success) 14%,transparent);border-color:color-mix(in srgb,var(--cx-success) 42%,transparent);color:var(--cx-success);}
.hp-heal:hover{background:color-mix(in srgb,var(--cx-success) 26%,transparent);}
.prog-hp-amt{display:flex;gap:6px;align-items:center;flex-wrap:wrap;justify-content:center;}
.hp-amt-input{width:62px;text-align:center;background:var(--cx-bg-2);border:1px solid var(--border,var(--cx-border));color:var(--cx-text);border-radius:8px;padding:6px 8px;font-family:'EB Garamond',serif;font-size:14px;outline:none;}
.hp-amt-input:focus{border-color:var(--cx-accent-deep);}
.hp-apply{font-family:'Cinzel',serif;font-size:11px;font-weight:600;letter-spacing:.04em;border-radius:8px;padding:6px 10px;cursor:pointer;border:1px solid color-mix(in srgb,var(--cx-text-strong) 15%,transparent);background:color-mix(in srgb,var(--cx-text-strong) 6%,transparent);color:var(--cx-text);transition:background .15s,border-color .15s;}
.hp-full{background:color-mix(in srgb,var(--cx-accent-deep) 12%,transparent);border-color:color-mix(in srgb,var(--cx-accent-deep) 40%,transparent);color:var(--cx-accent);}
.hp-full:hover{background:color-mix(in srgb,var(--cx-accent-deep) 22%,transparent);}

/* Divine Multi-World Combat Dashboard v1 */
.divine-os-shell{margin:26px 0;padding:22px;border:1px solid color-mix(in srgb,var(--cx-accent) 42%,transparent);border-radius:24px;background:radial-gradient(circle at 20% 0%,rgba(122,80,188,.22),transparent 34%),linear-gradient(135deg,color-mix(in srgb,var(--cx-bg) 96%,transparent),color-mix(in srgb,var(--cx-bg) 92%,transparent));box-shadow:0 0 34px rgba(0,0,0,.45),inset 0 0 26px color-mix(in srgb,var(--cx-accent) 6%,transparent);position:relative;overflow:hidden}.divine-os-shell:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--cx-accent) 7%,transparent),transparent);opacity:.65;pointer-events:none}.divine-os-topbar{display:flex;justify-content:space-between;gap:18px;align-items:center;position:relative;z-index:1;margin-bottom:18px}.os-kicker{font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--cx-accent)}.divine-os-topbar h2{font-family:Cinzel,serif;margin:3px 0 0;font-size:30px;color:var(--cx-accent-bright);text-shadow:0 0 18px color-mix(in srgb,var(--cx-accent) 28%,transparent)}.merge-toggle{border:1px solid color-mix(in srgb,var(--cx-accent) 65%,transparent);background:color-mix(in srgb,var(--cx-accent) 12%,transparent);color:var(--cx-accent-bright);border-radius:999px;padding:12px 18px;font-family:Cinzel,serif;font-weight:800;cursor:pointer}.os-stat-strip{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;position:relative;z-index:1;margin-bottom:16px}.os-stat-strip div{background:rgba(0,0,0,.28);border:1px solid color-mix(in srgb,var(--cx-accent) 22%,transparent);border-radius:14px;padding:12px;text-align:center}.os-stat-strip span{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.14em;color:var(--cx-accent-deep)}.os-stat-strip strong{display:block;font-family:Cinzel,serif;color:var(--cx-accent-bright);font-size:24px;margin-top:3px}.combat-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;position:relative;z-index:1}.combat-grid.lower{grid-template-columns:1fr 1fr;margin-top:14px}.combat-col,.merge-library{border:1px solid color-mix(in srgb,var(--cx-accent) 24%,transparent);border-radius:18px;background:color-mix(in srgb,var(--cx-bg) 48%,transparent);padding:14px;min-width:0}.combat-col-title{font-family:Cinzel,serif;color:var(--cx-accent-bright);font-size:15px;letter-spacing:.08em;text-transform:uppercase;margin-bottom:10px}.dash-card{border:1px solid color-mix(in srgb,var(--cx-text-strong) 9%,transparent);border-radius:14px;background:color-mix(in srgb,var(--cx-text-strong) 4.5%,transparent);margin-bottom:8px;overflow:hidden}.dash-card summary{cursor:pointer;list-style:none;padding:11px 12px;display:flex;align-items:center;justify-content:space-between;gap:8px;color:var(--cx-accent-bright)}.dash-card summary::-webkit-details-marker{display:none}.dash-card summary span{font-weight:800}.dash-card summary em{font-size:11px;color:var(--cx-accent);font-style:normal}.dash-input,.dash-text{width:calc(100% - 20px);margin:0 10px 8px!important;background:rgba(0,0,0,.25)!important;border:1px solid color-mix(in srgb,var(--cx-accent) 20%,transparent)!important;border-radius:10px!important;color:var(--cx-accent-bright)!important;padding:8px!important}.dash-text{min-height:74px;resize:vertical}.dash-empty{color:var(--cx-text-soft);font-style:italic;font-size:13px;padding:9px 0}.dash-empty.inline{padding:0 8px}.dash-delete{border:1px solid color-mix(in srgb,var(--cx-danger) 35%,transparent);background:color-mix(in srgb,var(--cx-danger-deep) 20%,transparent);color:var(--cx-danger);border-radius:9px;padding:6px 9px;margin:0 10px 10px;cursor:pointer}.resource-row,.spell-row{border:1px solid color-mix(in srgb,var(--cx-text-strong) 9%,transparent);background:color-mix(in srgb,var(--cx-text-strong) 4%,transparent);border-radius:14px;padding:10px;margin-bottom:8px}.resource-main{display:flex;align-items:center;justify-content:space-between;gap:10px}.resource-main span{font-family:Cinzel,serif;color:var(--cx-accent-bright);font-weight:800}.resource-name{font-weight:800}.resource-controls{display:flex;gap:6px;align-items:center;margin-top:8px;flex-wrap:wrap}.resource-controls button,.chip-group>button{border:1px solid color-mix(in srgb,var(--cx-accent) 36%,transparent);background:color-mix(in srgb,var(--cx-accent) 10%,transparent);color:var(--cx-accent-bright);border-radius:8px;padding:6px 9px;cursor:pointer}.resource-max{max-width:70px}.resource-recharge{max-width:130px}.spell-row{display:grid;grid-template-columns:1.2fr 62px 1.8fr 1fr auto;gap:8px;align-items:center}.merge-library{margin-top:14px;position:relative;z-index:1}.chip-group{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:10px 0}.chip-group b{color:var(--cx-accent);min-width:98px;font-size:13px;text-transform:uppercase;letter-spacing:.08em}.merge-chip{display:inline-flex;align-items:center;gap:4px;border:1px solid color-mix(in srgb,var(--cx-accent) 24%,transparent);background:color-mix(in srgb,var(--cx-accent) 8%,transparent);border-radius:999px;padding:5px 7px}.merge-chip input{max-width:170px;background:transparent!important;border:none!important;color:var(--cx-accent-bright)!important}.merge-chip button{border:none;background:transparent;color:var(--cx-danger);cursor:pointer}@media(max-width:980px){.os-stat-strip{grid-template-columns:repeat(2,1fr)}.combat-grid,.combat-grid.lower{grid-template-columns:1fr}.spell-row{grid-template-columns:1fr}.divine-os-topbar{align-items:flex-start;flex-direction:column}}

/* ── Session tracker fixes for Awards and Stars & Wishes ── */
.session-control-strip{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end;}
.session-control-label,.sw-session-input-wrap{font-family:Cinzel,serif;font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--cx-text-dim);display:flex;align-items:center;gap:8px;}
.session-number-input{width:72px;background:color-mix(in srgb,var(--cx-bg) 80%,transparent);border:1px solid color-mix(in srgb,var(--cx-accent-deep) 28%,transparent);border-radius:8px;padding:8px 10px;color:var(--cx-text-strong);font-family:Cinzel,serif;font-size:14px;text-align:center;outline:none;box-sizing:border-box;}
.session-number-input:focus{border-color:color-mix(in srgb,var(--cx-accent-deep) 65%,transparent);box-shadow:0 0 0 2px color-mix(in srgb,var(--cx-accent-deep) 10%,transparent);}
.awards-session-strip .inv-btn{margin:0;}
.sw-session-controls{display:flex;align-items:center;justify-content:center;gap:10px;margin-top:8px;flex-wrap:wrap;}
.sw-new-session-btn{width:100%;margin-top:12px;padding:8px 12px;font-size:10px;}
@media(max-width:700px){
  .session-control-strip{justify-content:stretch;width:100%;}
  .session-control-strip .inv-btn{flex:1 1 auto;}
  .session-control-label{flex:1 1 100%;justify-content:center;order:-1;}
  .session-number-input{width:86px;}
}

/* ── Session Overview (deploy145 #4) ─────────────────────────────────── */
.sess-ov-bar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:4px 0 14px;}
#sess-overview-list{border:1px solid color-mix(in srgb,var(--cx-text-strong) 7%,transparent);border-radius:8px;overflow:hidden;background:rgba(0,0,0,.14);}
.sess-ov-row{display:flex;align-items:flex-start;gap:14px;padding:12px 16px;border-bottom:1px solid color-mix(in srgb,var(--cx-text-strong) 5%,transparent);cursor:pointer;transition:background .15s;}
.sess-ov-row:last-child{border-bottom:none;}
.sess-ov-row:hover,.sess-ov-row:focus-visible{background:color-mix(in srgb,var(--cx-accent) 6%,transparent);outline:none;}
.sess-ov-row.current{background:color-mix(in srgb,var(--cx-accent) 9%,transparent);box-shadow:inset 3px 0 0 var(--cx-accent);}
.sess-ov-num{font-family:'Cinzel',serif;font-weight:700;font-size:15px;color:var(--cx-accent);min-width:34px;text-align:center;padding-top:2px;}
.sess-ov-main{flex:1;min-width:0;}
.sess-ov-title{font-family:'Cinzel',serif;font-size:15px;color:var(--cx-text);letter-spacing:.02em;}
.sess-ov-prev{font-family:'EB Garamond',serif;font-size:13.5px;line-height:1.5;color:var(--cx-text-dim);margin-top:3px;}
.sess-ov-meta{text-align:right;font-family:'EB Garamond',serif;font-size:13px;color:var(--cx-text-soft);white-space:nowrap;flex-shrink:0;}
.sess-ov-ig{color:var(--cx-text-dim);font-style:italic;margin-top:2px;}
@media (max-width:640px){
  .sess-ov-row{flex-wrap:wrap;gap:8px 12px;}
  .sess-ov-meta{text-align:left;width:100%;order:3;display:flex;gap:12px;white-space:normal;}
}
/* loot rows share the event delete affordance (deploy145 #1) */
.loot-item .ev-del-btn{margin-left:auto;}
.loot-item .loot-input{flex:1;}

/* ── Back to Campaigns (v66.1, owner-only; injected by dashboard-nav.js) ──
   Matches the handcrafted gold-on-parchment controls but reads as a
   navigation exit, not an editing mode — deliberately unlike the Admin Mode
   buttons so "leave the campaign" and "leave Admin Mode" cannot be confused. */
.dash-return{
  display:inline-flex;align-items:center;gap:8px;cursor:pointer;
  font-family:'Cinzel',Georgia,serif;font-size:13px;letter-spacing:.08em;
  color:var(--cx-accent-bright);background:color-mix(in srgb,var(--cx-bg) 72%,transparent);
  border:1px solid color-mix(in srgb,var(--cx-accent) 55%,transparent);
  border-radius:8px;padding:9px 14px;transition:background .15s,border-color .15s;
}
.dash-return .ui-icon{width:15px;height:15px;flex:none;}
.dash-return:hover{background:color-mix(in srgb,var(--cx-accent-deep) 22%,transparent);border-color:var(--cx-accent);}
.dash-return:focus-visible{outline:2px solid var(--cx-accent);outline-offset:2px;}
/* v68.2: an ordinary flex item at the header's left edge — no absolute or
   fixed positioning, so it can never float over the shell search, the
   template status badge, or the fixed Admin Mode pill (which keeps the
   header's right corner). Sized to sit inside the slim crafted header. */
.dash-return--topbar{position:static;flex:0 0 auto;order:-1;padding:6px 12px;font-size:12px;}
.dash-return--topbar .ui-icon{width:13px;height:13px;}
.dash-return--home{margin-left:10px;}
/* Full Index panel entry inherits .home-menu-item; keep the icon subtle. */
.dash-return--menu{gap:8px;}
.dash-return--menu .ui-icon{width:14px;height:14px;}
/* Narrower desktop: shorten to "Campaigns" visually; aria-label stays full. */
@media (max-width:1180px){
  .dash-return--topbar .dash-return-long{display:none;}
  .dash-return--topbar{padding:6px 10px;}
}

/* ══ css/mobile.css ══ */
/* ═══════════════════════════════════════════════════════
   MOBILE.CSS — responsive overrides for screens ≤ 768px
   ═══════════════════════════════════════════════════════ */

/* ── Shared small-screen utilities ── */
@media (max-width: 768px) {

  /* ── Sidebar / nav ── */
  #sidebar {
    height: 52px;
    padding: 0;
  }
  #sidebar-header {
    padding: 0 12px 0 10px;
    gap: 8px;
  }
  #sidebar-header .campaign-title {
    font-size: 12px;
  }
  #nav-groups {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    white-space: nowrap;
  }
  #nav-groups::-webkit-scrollbar { display: none; }
  .nav-section { display: inline-flex; }
  .nav-section-label {
    font-size: 11px;
    padding: 0 10px;
    height: 52px;
    display: flex;
    align-items: center;
    white-space: nowrap;
  }
  .nav-dropdown {
    top: 52px;
    min-width: 180px;
    max-height: 60vh;
    overflow-y: auto;
  }
  .nav-item { font-size: 13px; padding: 10px 14px; }

  #main { padding-top: 52px; }
  #content { padding: 16px 14px 40px; }

  /* ── Topbar (inner pages) ── */
  #topbar {
    height: auto !important;
    min-height: 80px;
    padding: 14px 16px 50px !important;
  }
  #topbar .breadcrumb { margin-top: 0 !important; }
  #topbar .breadcrumb::before { font-size: 22px !important; }
  .status-badge { display: none; }

  /* ── Page content ── */
  .page { padding: 16px !important; border-radius: 14px; }
  .page-title { font-size: 26px !important; }
  .page-header { margin-bottom: 20px; padding-bottom: 14px; }

  /* ── Home page ── */
  #home-nav-menu {
    min-width: unset !important;
    width: calc(100vw - 24px) !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    top: 60px !important;
    grid-template-columns: 1fr 1fr !important;
    padding: 16px !important;
    gap: 6px !important;
    max-height: 80vh;
    overflow-y: auto;
  }
  #home-nav-menu.open { grid-template-columns: 1fr 1fr !important; }
  .home-menu-item { font-size: 13px; padding: 7px 8px; }
  .home-menu-section-title { font-size: 8px; }

  .home-nav {
    height: auto !important;
    padding: 12px 14px !important;
    flex-wrap: wrap;
    gap: 10px;
  }
  .home-brand-title { font-size: 14px; }
  .home-brand-sub { font-size: 11px; }
  .home-links { display: none !important; }
  .home-search { width: 100%; min-width: unset !important; }
  .home-search input { width: 100%; }

  .home-hero { min-height: 100svh; }
  .home-hero-content { width: 96% !important; padding: 0 12px !important; }

  .home-realms { padding: 0 12px 40px; }
  .realm-grid { grid-template-columns: 1fr !important; }
  .realm-card img { height: 200px; }

  /* ── Character sheets ── */
  .char-sheet { border-radius: 14px; margin-bottom: 24px; }
  .char-sheet-header {
    grid-template-columns: 1fr !important;
  }
  .char-portrait-wrap {
    height: 280px;
    border-right: none !important;
    border-bottom: 1px solid color-mix(in srgb,var(--cx-accent-deep) 15%,transparent);
  }
  .char-header-content { padding: 18px !important; }
  .char-body { padding: 16px !important; gap: 16px !important; }
  .char-name-field { font-size: 24px !important; }

  /* Ability scores — 3 per row on mobile */
  .char-stats-grid {
    grid-template-columns: repeat(3, 1fr) !important;
  }
  /* Two-col sections → single col */
  .char-body .two-col,
  .char-body .char-grid-2 {
    grid-template-columns: 1fr !important;
  }

  /* Kill/death counters stacked */
  .char-counters {
    grid-template-columns: 1fr 1fr !important;
    gap: 10px !important;
  }
  .char-counter-val { font-size: 32px !important; }

  /* Items */
  .char-item-row { flex-wrap: wrap; }
  .char-item-img { width: 56px !important; height: 56px !important; }

  /* ── Gilded cards ── */
  .leg-item-card { padding: 14px 16px; }
  .leg-item-inner { flex-direction: column !important; }
  .leg-item-img { width: 100% !important; height: 160px !important; }
  .leg-stat-row { grid-template-columns: 1fr !important; gap: 2px !important; }

  /* ── Session notes ── */
  .session-layout,
  .sess-layout {
    grid-template-columns: 1fr !important;
  }
  .session-sidebar { position: relative !important; top: auto !important; }
  .sess-nav { flex-wrap: wrap; gap: 8px; }
  .sess-session-label { min-width: unset; }

  /* ── Party inventory ── */
  .inv-grid { grid-template-columns: 1fr !important; }

  /* ── Awards ── */
  .awards-grid,
  .aw-grid {
    grid-template-columns: 1fr !important;
  }

  /* ── Stars & Wishes ── */
  .sw-explainer {
    grid-template-columns: 1fr !important;
  }
  .sw-explainer-divider { width: 100% !important; height: 1px !important; }
  .sw-layout { grid-template-columns: 1fr !important; }
  .sw-entry-row { grid-template-columns: 1fr !important; }

  /* ── Atlas ── */
  .world-map-panel { grid-template-columns: 1fr !important; }
  .world-detail-card { position: relative !important; top: auto !important; }
  .atlas-title { font-size: 28px !important; }
  .world-map-frame img { min-width: 0 !important; }

  /* ── God forms / Eld portrait layout ── */
  .portrait-stat-grid {
    grid-template-columns: 1fr !important;
  }

  /* ── Gallery ── */
  #gallery-grid { grid-template-columns: repeat(2, 1fr) !important; }

  /* ── NPCs ── */
  .gc { padding: 14px 16px; }

  /* ── Effects / visual ── */
  #rune-ring, #rune-ring-inner { display: none; }

  .home-nav-menu {
    padding: 16px !important;
  }
}

/* ── Very small screens (≤ 380px) ── */
@media (max-width: 380px) {
  .page-title { font-size: 22px !important; }
  #gallery-grid { grid-template-columns: 1fr !important; }
  .home-menu-item span.icon { display: none; }
  #home-nav-menu { grid-template-columns: 1fr !important; }
  #home-nav-menu.open { grid-template-columns: 1fr !important; }
  .char-stats-grid { grid-template-columns: repeat(2, 1fr) !important; }
  .nav-section-label { font-size: 10px; padding: 0 8px; }
}

/* ── Touch targets — make all interactive elements finger-friendly ── */
@media (max-width: 768px) {
  button, .nav-item, .nav-section-label,
  .btn-g, .btn-o, .btn-d, .btn-dash,
  .sw-submit-btn, .sess-nav-btn,
  .sw-nav-btn, .cnt-btn, .pot-btn,
  .ev-move-btn, .ev-del-btn {
    min-height: 40px;
    min-width: 40px;
  }
  .ev-move-btn { min-width: 32px; min-height: 28px; }

  input[type="text"],
  input[type="number"],
  input[type="date"],
  textarea,
  select {
    font-size: 16px !important; /* prevents iOS auto-zoom */
  }
}

/* ══════════════════════════════════════════════════
   MOBILE CONSISTENCY PASS — additional overrides
   ══════════════════════════════════════════════════ */
@media (max-width: 768px) {

  /* ── Portrait/stat grid (god forms, eld) ── */
  .portrait-stat-grid {
    grid-template-columns: 1fr !important;
  }

  /* ── Sessions page meta row ── */
  .session-meta-row {
    flex-direction: column !important;
    gap: 10px !important;
  }
  .session-meta-row > * {
    width: 100% !important;
    min-width: unset !important;
  }

  /* ── Topbar hero image area ── */
  #topbar {
    background-size: cover !important;
    background-position: center bottom !important;
  }

  /* ── Navigation dropdown positioning ── */
  .nav-dropdown {
    position: fixed !important;
    top: 52px !important;
    left: 0 !important;
    right: 0 !important;
    width: 100vw !important;
    border-radius: 0 0 12px 12px !important;
    max-height: 55vh !important;
    overflow-y: auto !important;
    box-shadow: 0 8px 40px rgba(0,0,0,.7) !important;
  }

  /* ── Home nav menu 2-col then 1-col at smallest ── */
  #home-nav-menu {
    top: 56px !important;
    grid-template-columns: 1fr 1fr !important;
    max-height: 75vh;
    overflow-y: auto;
    padding: 14px !important;
  }
  .home-menu-item {
    font-size: 12px !important;
    padding: 7px 8px !important;
    gap: 6px !important;
  }

  /* ── Story / timeline ── */
  .timeline { padding-left: 20px !important; }
  .timeline-item { padding-right: 30px; }

  /* ── Cards consistent spacing ── */
  .leg-item-card,
  .session-card,
  .sw-submit-card,
  .inv-card,
  .aw-card {
    border-radius: 12px !important;
  }

  /* ── Full-width buttons on mobile ── */
  .sw-submit-btn,
  .new-session-btn {
    width: 100% !important;
  }

  /* ── Page eyebrow smaller ── */
  .page-eyebrow { font-size: 10px !important; letter-spacing: .15em !important; }

  /* ── Leg stat row single col ── */
  .leg-stat-row { grid-template-columns: 1fr !important; }

  /* ── Counters ── */
  .char-counters { grid-template-columns: 1fr 1fr !important; }

  /* ── Legend items page wrap ── */
  .items-page-wrap { padding: 0 !important; }

  /* ── NPCs section labels ── */
  .items-section-header { flex-wrap: wrap; gap: 8px; }

  /* ── Awards page ── */
  .awards-grid { grid-template-columns: 1fr !important; }
  .ballot-section { padding: 14px !important; }

  /* ── Inventory gold amount ── */
  .gold-amount { font-size: 38px !important; }

  /* ── Scripture/lore ── */
  .scripture-block { padding: 16px !important; }

  /* ── Atlas ── */
  .atlas-shell { padding: 0 !important; }
  .atlas-hero { padding: 20px 16px 30px !important; }
  .atlas-title { font-size: 26px !important; }
  .atlas-grid { grid-template-columns: repeat(2, 1fr) !important; }
  .world-view { padding: 16px !important; }

  /* ── Constructs ── */
  .constructs-grid { grid-template-columns: 1fr !important; }

  /* ── Prevent horizontal overflow globally ── */
  .page { overflow-x: hidden; }
  #content { overflow-x: hidden; }

  /* ── Gallery 2 cols on medium mobile ── */
  #gallery-grid { grid-template-columns: repeat(2, 1fr) !important; }
}

/* ── iPhone SE / very small ── */
@media (max-width: 380px) {
  #home-nav-menu { grid-template-columns: 1fr !important; }
  .home-menu-item .icon { display: none !important; }
  .char-stats-grid { grid-template-columns: repeat(2, 1fr) !important; }
  .atlas-grid { grid-template-columns: 1fr !important; }
  #gallery-grid { grid-template-columns: 1fr !important; }
  .session-nav-btn { padding: 6px 10px !important; font-size: 11px !important; }
  .page-title { font-size: 20px !important; }
}

/* ── Landscape mobile ── */
@media (max-width: 900px) and (orientation: landscape) {
  .home-hero { min-height: 100vw !important; }
  .home-hero-content { padding: 20px !important; }
  .char-sheet-header { grid-template-columns: 160px 1fr !important; }
  .char-portrait-wrap { height: 200px !important; }
}

/* ── Planetary Progression — mobile ── */
@media (max-width: 768px) {
  .prog-run-grid { grid-template-columns: 1fr 1fr !important; }
  .slot-grid { grid-template-columns: repeat(3, 1fr) !important; }
  .core-stats-grid { grid-template-columns: repeat(3, 1fr) !important; }
  .stacked-entry { grid-template-columns: 100px 1fr 24px !important; }
  .prog-combined-box { display: flex !important; width: 100%; }
}
@media (max-width: 380px) {
  .prog-run-grid { grid-template-columns: 1fr !important; }
  .slot-grid { grid-template-columns: repeat(3, 1fr) !important; }
  .stacked-entry { grid-template-columns: 1fr 1fr 24px !important; }
}

/* ============================================================
 * Deploy81 — mobile home fixes + fullscreen nav
 * ============================================================ */
#mnav-btn, #mnav { display: none; } /* desktop never sees these */

@media (max-width: 768px) {

  /* ── Home hero collision fix ──
     .home-realms pulls itself up (-62px / -48px) for a decorative overlap
     on desktop; on phones the four stacked hero buttons fill that space,
     so the "Explore the Realms" title landed on top of them. */
  .home-hero {
    display: block !important;
    min-height: auto !important;
    padding: 50px 22px 76px !important;
    overflow: visible !important;
  }
  .home-hero-content {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    transform: none !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    padding: 0 !important;
    animation: none !important;
  }
  .home-realms {
    margin-top: 0 !important;
    padding-top: 34px !important;
  }

  /* ── Title wrap fix ── clamp so the campaign title fits one line;
     forbid mid-word breaking outright. */
  .home-title {
    font-size: clamp(32px, 9.8vw, 40px) !important;
    letter-spacing: .005em !important;
    line-height: 1.04 !important;
    overflow-wrap: normal !important;
    word-break: keep-all !important;
    hyphens: none !important;
  }
  .home-title, .home-title * {
    overflow-wrap: normal !important;
    word-break: keep-all !important;
    hyphens: none !important;
  }
  .home-actions {
    gap: 14px !important;
    margin: 30px 0 0 !important;
  }
  .home-action {
    width: 100% !important;
    min-height: 58px !important;
    padding: 14px 12px !important;
    box-sizing: border-box !important;
  }

  /* ── Replace desktop-style dropdown nav on phones ── */
  #nav-groups { display: none; }             /* strip keeps brand + search only */
  #sidebar-header { padding-right: 62px; }   /* clear the hamburger */
  .home-menu-btn { display: none; }          /* global hamburger covers home too */

  /* ── Hamburger ── */
  #mnav-btn {
    display: flex; align-items: center; justify-content: center;
    position: fixed; top: max(8px, env(safe-area-inset-top)); right: max(10px, env(safe-area-inset-right));
    width: 44px; height: 44px; z-index: 8900;
    background: color-mix(in srgb,var(--cx-field) 92%,transparent); color: var(--cx-accent); font-size: 20px;
    border: 1px solid color-mix(in srgb,var(--cx-accent-deep) 55%,transparent); border-radius: 12px;
    box-shadow: 0 6px 18px rgba(0, 0, 0, .45); cursor: pointer;
    backdrop-filter: blur(4px);
  }
  body.dcs-modal-open #mnav-btn, body.mnav-open #mnav-btn { display: none; }
  body.mnav-open { overflow: hidden; }

  /* ── Fullscreen menu ── */
  #mnav {
    display: block; position: fixed; inset: 0; z-index: 9400;
    background: color-mix(in srgb,var(--cx-bg) 98.5%,transparent);
    backdrop-filter: blur(8px);
    overflow-y: auto; -webkit-overflow-scrolling: touch;
    padding: max(14px, env(safe-area-inset-top)) max(18px, env(safe-area-inset-right)) max(30px, env(safe-area-inset-bottom)) max(18px, env(safe-area-inset-left));
    opacity: 0; pointer-events: none; transform: translateY(-10px);
    transition: opacity .18s ease, transform .18s ease;
  }
  #mnav.open { display: block; opacity: 1; pointer-events: auto; transform: translateY(0); }
  .mnav-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; }
  .mnav-brand { font-family: 'Cinzel', serif; color: var(--cx-accent); font-size: 18px; letter-spacing: .08em; }
  .mnav-brand span { display: block; font-size: 10px; letter-spacing: .22em; text-transform: uppercase; color: color-mix(in srgb,var(--cx-accent) 55%,transparent); margin-top: 2px; }
  .mnav-close {
    width: 44px; height: 44px; display: flex; align-items: center; justify-content: center;
    background: none; border: 1px solid color-mix(in srgb,var(--cx-accent-deep) 45%,transparent); border-radius: 12px;
    color: var(--cx-accent); font-size: 18px; cursor: pointer;
  }
  .mnav-label {
    font-family: 'Cinzel', serif; font-size: 11px; letter-spacing: .22em; text-transform: uppercase;
    color: color-mix(in srgb,var(--cx-accent) 60%,transparent); margin: 20px 4px 6px;
  }
  .mnav-item {
    display: flex; align-items: center; gap: 12px; width: 100%; min-height: 48px;
    background: none; border: none; border-bottom: 1px solid color-mix(in srgb,var(--cx-accent-deep) 12%,transparent);
    color: var(--cx-accent-bright); font-family: 'EB Garamond', serif; font-size: 17px; text-align: left;
    padding: 4px 6px; cursor: pointer;
  }
  .mnav-item .icon { width: 24px; text-align: center; font-size: 17px; }
  .mnav-item:active { background: color-mix(in srgb,var(--cx-accent-deep) 10%,transparent); }
}

/* ── Back to Campaigns in the mobile fullscreen menu (v66.1) ── */
@media (max-width: 768px){
  .mnav-account{
    margin-top:22px;padding-top:16px;
    border-top:1px solid color-mix(in srgb,var(--cx-accent) 25%,transparent);
    padding-bottom:calc(14px + env(safe-area-inset-bottom,0px));
  }
  .mnav-account .dash-return--mobile{
    width:100%;justify-content:flex-start;font-size:15px;padding:14px 12px;
    min-height:48px; /* comfortable tap target */
  }
  /* Desktop-only placements stay out of the phone layout entirely. */
  .dash-return--topbar{display:none;}
}

/* ══ css/divine.css ══ */
/* ============================================================================
 * D20Keep - Advanced Character System  (Phase 2 styles)
 * EVERYTHING scoped under .divine-character-system (+ body.dcs-modal-open).
 * Reuses existing theme tokens; introduces no global selectors.
 * ==========================================================================*/

.divine-character-system { --dcs-gold: var(--gold, var(--cx-accent)); --dcs-gold-dim: var(--gold-dim, var(--cx-accent-deep));
  --dcs-border: var(--border, var(--cx-border)); --dcs-card: var(--bg-card, var(--cx-surface)); --dcs-surface: var(--bg-surface, var(--cx-field));
  --dcs-text: var(--text-primary, var(--cx-text)); --dcs-dim: var(--text-dim, var(--cx-text-dim)); --dcs-red: var(--red, var(--cx-danger));
  --dcs-readable: var(--cx-accent-bright); --dcs-readable-dim: var(--cx-accent-bright);
  display: block; margin: 0 0 34px; }

.divine-character-system .dcs-wrap { border: 1px solid var(--dcs-border); border-radius: 14px;
  background: linear-gradient(160deg, color-mix(in srgb,var(--cx-accent-deep) 5%,transparent), rgba(0,0,0,.18)); padding: 20px 20px 24px; }
.divine-character-system .dcs-head { margin-bottom: 14px; }
.divine-character-system .dcs-title { font-family: 'Cinzel', serif; font-size: 21px; letter-spacing: .06em;
  color: var(--dcs-gold); }
.divine-character-system .dcs-sub { font-family: 'EB Garamond', serif; font-size: 13.5px; color: var(--dcs-dim); margin-top: 2px; }

/* player tabs */
.divine-character-system .dcs-tabs { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 16px; }
.divine-character-system .dcs-tab { font-family: 'Cinzel', serif; font-size: 12.5px; letter-spacing: .04em;
  padding: 7px 16px; border-radius: 9px; cursor: pointer; color: var(--dcs-text);
  background: color-mix(in srgb,var(--cx-text-strong) 4%,transparent); border: 1px solid var(--dcs-border); transition: all .18s; }
.divine-character-system .dcs-tab:hover { border-color: var(--dcs-gold-dim); }
.divine-character-system .dcs-tab.active { background: linear-gradient(150deg, color-mix(in srgb,var(--cx-accent-deep) 24%,transparent), color-mix(in srgb,var(--cx-accent-deep) 8%,transparent));
  border-color: var(--dcs-gold-dim); color: var(--dcs-gold); }

/* manager grid */
.divine-character-system .dcs-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 14px; }
.divine-character-system .dcs-card { position: relative; text-align: left; cursor: pointer; padding: 0; overflow: hidden;
  border: 1px solid var(--dcs-border); border-radius: 12px; background: var(--dcs-card); color: var(--dcs-text);
  transition: transform .16s, border-color .16s, box-shadow .16s; display: flex; flex-direction: column; }
.divine-character-system .dcs-card:hover { transform: translateY(-3px); border-color: var(--dcs-gold-dim);
  box-shadow: 0 10px 30px rgba(0,0,0,.5), 0 0 18px color-mix(in srgb,var(--cx-accent-deep) 8%,transparent); }
.divine-character-system .dcs-card-empty { opacity: .72; }
.divine-character-system .dcs-card-empty:hover { opacity: 1; }
.divine-character-system .dcs-card-art { height: 110px; background-size: cover; background-position: center top;
  border-bottom: 1px solid var(--dcs-border); }
.divine-character-system .dcs-card-art-empty { display: flex; align-items: center; justify-content: center;
  background: radial-gradient(circle at 50% 40%, color-mix(in srgb,var(--cx-accent-deep) 10%,transparent), rgba(0,0,0,.25)); }
.divine-character-system .dcs-card-art-empty span { font-family: 'Cinzel', serif; font-size: 30px; color: color-mix(in srgb,var(--cx-accent-deep) 40%,transparent); }
.divine-character-system .dcs-card-body { padding: 11px 13px 13px; flex: 1; }
.divine-character-system .dcs-card-name { font-family: 'Cinzel', serif; font-size: 15px; color: var(--dcs-gold); }
.divine-character-system .dcs-card-meta { display: flex; align-items: center; gap: 8px; margin: 6px 0 4px; }
.divine-character-system .dcs-lvl { font-family: 'Cinzel', serif; font-size: 12px; color: var(--dcs-text); }
.divine-character-system .dcs-status { font-size: 10px; letter-spacing: .04em; text-transform: uppercase;
  padding: 1px 7px; border-radius: 9px; border: 1px solid var(--dcs-border); color: var(--dcs-dim); }
.divine-character-system .dcs-status-active { color: var(--cx-success); border-color: color-mix(in srgb,var(--cx-success) 40%,transparent); }
.divine-character-system .dcs-status-completed { color: var(--dcs-gold); border-color: var(--dcs-gold-dim); }
.divine-character-system .dcs-status-locked { color: var(--dcs-dim); }
.divine-character-system .dcs-card-class { font-family: 'EB Garamond', serif; font-size: 13.5px; color: var(--dcs-text); min-height: 18px; }
.divine-character-system .dcs-sub-tag { color: var(--dcs-dim); font-size: 12px; }
.divine-character-system .dcs-card-foot { display: flex; justify-content: space-between; margin-top: 8px;
  font-family: 'EB Garamond', serif; font-size: 11.5px; color: var(--dcs-dim); }
.divine-character-system .dcs-card-begin { font-family: 'EB Garamond', serif; font-size: 13.5px; color: var(--dcs-gold-dim); margin-top: 6px; }

/* ---- modal editor ---- */
body.dcs-modal-open { overflow: hidden; }
.divine-character-system .dcs-overlay { position: fixed; inset: 0; width: 100vw; height: 100vh; height: 100dvh; z-index: 9000; display: flex; align-items: center;
  justify-content: center; padding: 16px; background: color-mix(in srgb,var(--cx-bg) 74%,transparent); backdrop-filter: blur(3px);
  animation: dcsFade .18s ease; overflow: auto; box-sizing: border-box; }
@keyframes dcsFade { from { opacity: 0; } to { opacity: 1; } }
.divine-character-system .dcs-modal { width: min(880px, calc(100vw - 32px)); background: var(--dcs-surface);
  border: 1px solid var(--dcs-gold-dim); border-radius: 16px; box-shadow: 0 30px 80px rgba(0,0,0,.6);
  animation: dcsRise .22s ease; margin: auto; display: flex; flex-direction: column; max-height: calc(100vh - 32px); max-height: calc(100dvh - 32px); }
@keyframes dcsRise { from { transform: translateY(14px); opacity: 0; } to { transform: translateY(0); opacity: 1; } }
.divine-character-system .dcs-modal-head { flex: 0 0 auto; position: sticky; top: 0; z-index: 2; display: flex; align-items: center; gap: 14px;
  padding: 16px 20px; border-bottom: 1px solid var(--dcs-border);
  background: linear-gradient(180deg, color-mix(in srgb,var(--cx-surface) 98%,transparent), color-mix(in srgb,var(--cx-surface) 92%,transparent)); border-radius: 16px 16px 0 0; }
.divine-character-system .dcs-modal-title { flex: 1; font-family: 'Cinzel', serif; font-size: 19px; color: var(--dcs-gold); }
.divine-character-system .dcs-modal-sub { display: block; font-family: 'EB Garamond', serif; font-size: 11.5px;
  letter-spacing: .03em; color: var(--dcs-dim); text-transform: none; }
.divine-character-system .dcs-save { font-family: 'EB Garamond', serif; font-size: 12.5px; color: var(--cx-success); min-width: 70px; text-align: right; }
.divine-character-system .dcs-close { background: transparent; border: none; color: var(--dcs-dim); font-size: 26px;
  line-height: 1; cursor: pointer; padding: 0 4px; }
.divine-character-system .dcs-close:hover { color: var(--dcs-red); }
.divine-character-system .dcs-modal-body { flex: 1 1 auto; min-height: 0; overflow-y: auto; padding: 8px 20px 22px; }
.divine-character-system .dcs-modal-foot { flex: 0 0 auto; display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 12px 20px; border-top: 1px solid var(--dcs-gold-dim);
  background: linear-gradient(0deg, color-mix(in srgb,var(--cx-surface) 98%,transparent), color-mix(in srgb,var(--cx-surface) 92%,transparent)); border-radius: 0 0 16px 16px; }
.divine-character-system .dcs-modal-foot-right { display: flex; gap: 10px; flex-wrap: wrap; }

/* ---- collapsible sections ---- */
.divine-character-system .dcs-section { border-bottom: 1px solid var(--dcs-border); }
.divine-character-system .dcs-section-head { width: 100%; text-align: left; background: transparent; border: none;
  cursor: pointer; display: flex; justify-content: space-between; align-items: center; padding: 14px 2px;
  font-family: 'Cinzel', serif; font-size: 13px; letter-spacing: .08em; text-transform: uppercase; color: var(--dcs-gold); }
.divine-character-system .dcs-chev { color: var(--dcs-gold-dim); font-size: 10px; }
.divine-character-system .dcs-section-body { display: none; padding: 4px 2px 18px; }
.divine-character-system .dcs-section.open > .dcs-section-body { display: block; }

/* ---- fields ---- */
.divine-character-system .dcs-row { display: flex; flex-wrap: wrap; gap: 12px; margin-bottom: 6px; }
.divine-character-system .dcs-field { display: flex; flex-direction: column; gap: 4px; flex: 1; min-width: 150px; }
.divine-character-system .dcs-field-num { max-width: 150px; }
.divine-character-system .dcs-field-area { flex-basis: 100%; }
.divine-character-system .dcs-field > span { font-family: 'Cinzel', serif; font-size: 9.5px; letter-spacing: .07em;
  text-transform: uppercase; color: var(--dcs-dim); }
.divine-character-system .dcs-input { width: 100%; background: var(--cx-bg-2); border: 1px solid var(--dcs-border);
  color: var(--dcs-text); border-radius: 8px; padding: 8px 10px; font-family: 'EB Garamond', serif; font-size: 14px; outline: none; }
.divine-character-system .dcs-input:focus { border-color: var(--dcs-gold-dim); }
.divine-character-system select.dcs-input { cursor: pointer; }
.divine-character-system .dcs-textarea { resize: vertical; min-height: 44px; line-height: 1.5; }
.divine-character-system .dcs-journal { min-height: 160px; }
.divine-character-system .dcs-w-sm { max-width: 72px; }
.divine-character-system .dcs-w-md { max-width: 140px; }

.divine-character-system .dcs-subhead { font-family: 'Cinzel', serif; font-size: 11px; letter-spacing: .1em;
  text-transform: uppercase; color: var(--dcs-gold-dim); margin: 16px 0 7px; display: flex; align-items: center; gap: 10px; }
.divine-character-system .dcs-derived { font-size: 16px; font-weight: 700; color: var(--dcs-gold); }
.divine-character-system .dcs-hint, .divine-character-system .dcs-note { font-family: 'EB Garamond', serif;
  font-size: 12px; color: var(--dcs-dim); text-transform: none; letter-spacing: 0; }
.divine-character-system .dcs-note { margin-bottom: 8px; }

/* multi-input lines + mini-cards */
.divine-character-system .dcs-line { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-bottom: 7px; }
.divine-character-system .dcs-line .dcs-input { flex: 1; min-width: 90px; }
.divine-character-system .dcs-card-mini { border: 1px solid var(--dcs-border); border-radius: 10px; padding: 10px 12px;
  margin-bottom: 9px; background: color-mix(in srgb,var(--cx-surface) 45%,transparent); }

/* ability + checks + skills */
.divine-character-system .dcs-grid6 { display: grid; grid-template-columns: repeat(6, 1fr); gap: 8px; }
.divine-character-system .dcs-checks { display: flex; flex-wrap: wrap; gap: 10px; }
.divine-character-system .dcs-check { display: inline-flex; align-items: center; gap: 6px; font-family: 'EB Garamond', serif;
  font-size: 13px; color: var(--dcs-text); cursor: pointer; }
.divine-character-system .dcs-skills { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px 14px; }
.divine-character-system .dcs-skill { display: flex; align-items: center; gap: 8px; font-family: 'EB Garamond', serif;
  font-size: 13.5px; color: var(--dcs-text); }
.divine-character-system .dcs-skill-state { width: 26px; height: 26px; border-radius: 7px; cursor: pointer;
  border: 1px solid var(--dcs-border); background: color-mix(in srgb,var(--cx-text-strong) 3%,transparent); color: var(--dcs-dim); font-size: 13px; }
.divine-character-system .dcs-skill-state.prof { color: var(--dcs-gold); border-color: var(--dcs-gold-dim); }
.divine-character-system .dcs-skill-state.exp { color: var(--cx-success); border-color: color-mix(in srgb,var(--cx-success) 50%,transparent); }

/* death saves + slots */
.divine-character-system .dcs-deathsaves { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px;
  font-family: 'Cinzel', serif; font-size: 11px; letter-spacing: .06em; text-transform: uppercase; color: var(--dcs-dim); }
.divine-character-system .dcs-pips { display: inline-flex; gap: 6px; margin-right: 8px; }
.divine-character-system .dcs-pip { width: 18px; height: 18px; border-radius: 50%; cursor: pointer;
  border: 1px solid var(--dcs-border); background: transparent; }
.divine-character-system .dcs-pip.succ { background: var(--cx-success); border-color: var(--cx-success); }
.divine-character-system .dcs-pip.fail { background: var(--dcs-red); border-color: var(--dcs-red); }
.divine-character-system .dcs-slots { display: grid; grid-template-columns: repeat(9, 1fr); gap: 7px; }
.divine-character-system .dcs-slot { display: flex; flex-direction: column; align-items: center; gap: 4px; }
.divine-character-system .dcs-slot span { font-family: 'Cinzel', serif; font-size: 10px; color: var(--dcs-gold-dim); }
.divine-character-system .dcs-slot .dcs-input { text-align: center; padding: 6px 2px; }

/* add/del + chips */
.divine-character-system .dcs-add { font-family: 'Cinzel', serif; font-size: 11px; letter-spacing: .04em; cursor: pointer;
  padding: 7px 14px; border-radius: 8px; color: var(--dcs-gold); background: color-mix(in srgb,var(--cx-accent-deep) 10%,transparent);
  border: 1px solid var(--dcs-gold-dim); margin-top: 4px; transition: background .15s; }
.divine-character-system .dcs-add:hover { background: color-mix(in srgb,var(--cx-accent-deep) 20%,transparent); }
.divine-character-system .dcs-del { background: transparent; border: none; color: color-mix(in srgb,var(--cx-danger) 55%,transparent); cursor: pointer;
  font-size: 16px; line-height: 1; padding: 0 6px; }
.divine-character-system .dcs-del:hover { color: var(--dcs-red); }
.divine-character-system .dcs-chiplist { display: flex; flex-wrap: wrap; gap: 8px; }
.divine-character-system .dcs-chiprow { display: flex; align-items: center; gap: 2px; }
.divine-character-system .dcs-chiprow .dcs-input { min-width: 120px; }

/* ---- responsive ---- */
@media (max-width: 768px) {
  .divine-character-system .dcs-grid { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; }
  .divine-character-system .dcs-grid6 { grid-template-columns: repeat(3, 1fr); }
  .divine-character-system .dcs-skills { grid-template-columns: repeat(2, 1fr); }
  .divine-character-system .dcs-slots { grid-template-columns: repeat(5, 1fr); }
  .divine-character-system .dcs-overlay { padding: 12px 8px; }
  .divine-character-system .dcs-modal-body { padding: 6px 13px 18px; }
  .divine-character-system .dcs-field-num { max-width: none; }
  .divine-character-system .dcs-input { font-size: 16px; } /* iOS no-zoom */
}
@media (max-width: 420px) {
  .divine-character-system .dcs-grid { grid-template-columns: 1fr 1fr; }
  .divine-character-system .dcs-grid6 { grid-template-columns: repeat(3, 1fr); }
  .divine-character-system .dcs-slots { grid-template-columns: repeat(3, 1fr); }
}

/* ============================================================================
 * Phase 3 — Divine Combat Dashboard (scoped)
 * ==========================================================================*/
.divine-character-system .dcs-headrow { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; flex-wrap: wrap; }
.divine-character-system .dcs-formtoggle { display: inline-flex; border: 1px solid var(--dcs-border); border-radius: 10px; overflow: hidden; }
.divine-character-system .dcs-form-btn { font-family: 'Cinzel', serif; font-size: 12px; letter-spacing: .04em; padding: 8px 16px;
  cursor: pointer; background: transparent; border: none; color: var(--dcs-dim); transition: all .18s; }
.divine-character-system .dcs-form-btn:hover { color: var(--dcs-text); }
.divine-character-system .dcs-form-btn.active { background: linear-gradient(150deg, color-mix(in srgb,var(--cx-accent-deep) 26%,transparent), color-mix(in srgb,var(--cx-accent-deep) 8%,transparent));
  color: var(--dcs-gold); }

.divine-character-system .dcs-dashboard { animation: dcsFade .2s ease; }
.divine-character-system .dcs-dash-strip { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin: 4px 0 14px; }
.divine-character-system .dcs-stat { flex: 1; min-width: 88px; border: 1px solid var(--dcs-border); border-radius: 10px;
  padding: 9px 12px; background: linear-gradient(160deg, color-mix(in srgb,var(--cx-accent-deep) 6%,transparent), rgba(0,0,0,.18)); }
.divine-character-system .dcs-stat span { display: block; font-family: 'Cinzel', serif; font-size: 9px; letter-spacing: .07em;
  text-transform: uppercase; color: var(--dcs-dim); }
.divine-character-system .dcs-stat strong { font-family: 'Cinzel', serif; font-size: 22px; color: var(--dcs-gold); }
.divine-character-system .dcs-dash-status { font-family: 'EB Garamond', serif; font-size: 12px; color: var(--cx-success);
  margin-left: auto; align-self: center; }

.divine-character-system .dcs-defrow { display: flex; flex-direction: column; gap: 6px; margin-bottom: 16px; }
.divine-character-system .dcs-def { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.divine-character-system .dcs-def b { font-family: 'Cinzel', serif; font-size: 10px; letter-spacing: .06em; text-transform: uppercase;
  color: var(--dcs-gold-dim); margin-right: 4px; }
.divine-character-system .dcs-chip { font-family: 'EB Garamond', serif; font-size: 12.5px; padding: 2px 10px; border-radius: 20px;
  border: 1px solid var(--dcs-border); color: var(--dcs-text); }
.divine-character-system .dcs-chip.res { border-color: color-mix(in srgb,var(--cx-success) 40%,transparent); color: var(--cx-success); }
.divine-character-system .dcs-chip.imm { border-color: color-mix(in srgb,var(--cx-accent-deep) 45%,transparent); color: var(--dcs-gold); }

.divine-character-system .dcs-dash-cols { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-bottom: 12px; }
.divine-character-system .dcs-dash-cols.lower { grid-template-columns: 2fr 1fr; }
.divine-character-system .dcs-dash-cols.single { grid-template-columns: 1fr; }
.divine-character-system .dcs-dash-col { border: 1px solid var(--dcs-border); border-radius: 12px; padding: 12px; background: color-mix(in srgb,var(--cx-surface) 40%,transparent); }
.divine-character-system .dcs-dash-coltitle { font-family: 'Cinzel', serif; font-size: 12px; letter-spacing: .08em; text-transform: uppercase;
  color: var(--dcs-gold); margin-bottom: 10px; }
.divine-character-system .dcs-empty { font-family: 'EB Garamond', serif; font-size: 13px; color: var(--dcs-dim); font-style: italic; }

.divine-character-system .dcs-feat { border: 1px solid var(--dcs-border); border-radius: 9px; padding: 9px 11px; margin-bottom: 7px;
  background: var(--dcs-card); cursor: pointer; transition: border-color .15s; }
.divine-character-system .dcs-feat:hover { border-color: var(--dcs-gold-dim); }
.divine-character-system .dcs-feat-head { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; }
.divine-character-system .dcs-feat-name { font-family: 'EB Garamond', serif; font-size: 14.5px; color: var(--dcs-text); font-weight: 600; }
.divine-character-system .dcs-feat-tag { font-family: 'Cinzel', serif; font-size: 10px; color: var(--dcs-gold-dim); white-space: nowrap; }
.divine-character-system .dcs-feat-meta { font-family: 'EB Garamond', serif; font-size: 11.5px; color: var(--dcs-dim); margin-top: 2px; }
.divine-character-system .dcs-feat-desc { display: none; font-family: 'EB Garamond', serif; font-size: 13px; color: var(--dcs-text);
  margin-top: 7px; line-height: 1.5; border-top: 1px solid var(--dcs-border); padding-top: 7px; }
.divine-character-system .dcs-feat.open .dcs-feat-desc { display: block; }
.divine-character-system .dcs-pass-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 7px; }
.divine-character-system .dcs-pass-grid .dcs-feat { margin-bottom: 0; }

.divine-character-system .dcs-res { border: 1px solid var(--dcs-border); border-radius: 9px; padding: 9px 11px; margin-bottom: 8px;
  background: var(--dcs-card); }
.divine-character-system .dcs-res-top { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 7px; }
.divine-character-system .dcs-res-name { font-family: 'EB Garamond', serif; font-size: 14px; color: var(--dcs-text); font-weight: 600; }
.divine-character-system .dcs-res-recharge { font-family: 'Cinzel', serif; font-size: 9.5px; letter-spacing: .04em; text-transform: uppercase; color: var(--dcs-gold-dim); }
.divine-character-system .dcs-res-track { display: flex; align-items: center; gap: 10px; }
.divine-character-system .dcs-res-btn { width: 34px; height: 34px; border-radius: 8px; cursor: pointer; font-size: 18px; line-height: 1;
  background: color-mix(in srgb,var(--cx-text-strong) 5%,transparent); border: 1px solid var(--dcs-border); color: var(--dcs-gold); transition: background .15s; }
.divine-character-system .dcs-res-btn:hover:not([disabled]) { background: color-mix(in srgb,var(--cx-accent-deep) 18%,transparent); }
.divine-character-system .dcs-res-btn[disabled] { opacity: .3; cursor: default; }
.divine-character-system .dcs-res-count { font-family: 'Cinzel', serif; font-size: 16px; color: var(--dcs-text); min-width: 56px; text-align: center; }
.divine-character-system .dcs-res-count.spent { color: var(--dcs-red); }

.divine-character-system .dcs-dash-spells { border: 1px solid var(--dcs-border); border-radius: 12px; padding: 12px; background: color-mix(in srgb,var(--cx-surface) 40%,transparent); }
.divine-character-system .dcs-spell-search { margin-bottom: 12px; }
.divine-character-system .dcs-spell-group { margin-bottom: 12px; }
.divine-character-system .dcs-spell-lvl { font-family: 'Cinzel', serif; font-size: 11px; letter-spacing: .06em; text-transform: uppercase;
  color: var(--dcs-gold-dim); margin-bottom: 6px; border-bottom: 1px solid var(--dcs-border); padding-bottom: 4px; }
.divine-character-system .dcs-spell-lvl em { color: var(--dcs-dim); font-style: normal; font-size: 10px; }
.divine-character-system .dcs-spell { border: 1px solid transparent; border-radius: 8px; padding: 6px 8px; cursor: pointer; }
.divine-character-system .dcs-spell:hover { border-color: var(--dcs-border); background: color-mix(in srgb,var(--cx-text-strong) 2%,transparent); }
.divine-character-system .dcs-spell-head { display: flex; align-items: center; gap: 8px; }
.divine-character-system .dcs-spell-name { flex: 1; font-family: 'EB Garamond', serif; font-size: 14px; color: var(--dcs-text); }
.divine-character-system .dcs-spell-tag { font-family: 'Cinzel', serif; font-size: 9.5px; color: var(--dcs-gold-dim); }
.divine-character-system .dcs-spell .dcs-feat-desc, .divine-character-system .dcs-spell .dcs-feat-meta { padding-left: 26px; }
.divine-character-system .dcs-spell.open .dcs-feat-desc { display: block; }
.divine-character-system .dcs-fav { background: transparent; border: none; color: var(--dcs-gold-dim); font-size: 16px; cursor: pointer; padding: 0; line-height: 1; }
.divine-character-system .dcs-fav.on { color: var(--dcs-gold); }

@media (max-width: 768px) {
  .divine-character-system .dcs-dash-cols, .divine-character-system .dcs-dash-cols.lower { grid-template-columns: 1fr; }
  .divine-character-system .dcs-stat { min-width: 70px; }
}

/* ============================================================================
 * Phase 4 — App Shell (selector, nav tabs, save status, library, legacy)
 * ==========================================================================*/
.divine-character-system .dcs-status-wrap { display: inline-flex; align-items: center; gap: 8px; }
.divine-character-system .dcs-status-label { font-family: 'Cinzel', serif; font-size: 9px; letter-spacing: .08em;
  text-transform: uppercase; color: var(--dcs-dim); }
.divine-character-system .dcs-status { font-family: 'EB Garamond', serif; font-size: 12.5px; color: var(--cx-success); min-width: 64px; }
.divine-character-system .dcs-selector { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }

/* nav tabs */
.divine-character-system .dcs-navtabs { display: flex; flex-wrap: wrap; gap: 4px; margin: 16px 0 14px; border-bottom: 1px solid var(--dcs-border); }
.divine-character-system .dcs-navtab { font-family: 'Cinzel', serif; font-size: 12.5px; letter-spacing: .05em; padding: 9px 18px;
  cursor: pointer; background: transparent; border: none; border-bottom: 2px solid transparent; color: var(--dcs-dim);
  transition: color .15s, border-color .15s; margin-bottom: -1px; }
.divine-character-system .dcs-navtab:hover { color: var(--dcs-text); }
.divine-character-system .dcs-navtab.active { color: var(--dcs-gold); border-bottom-color: var(--dcs-gold); }

/* combat-tab form toggle row */
.divine-character-system .dcs-formtoggle-row { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-bottom: 14px; }
.divine-character-system .dcs-pick { max-width: 280px; }
.divine-character-system .dcs-pick-empty { font-family: 'EB Garamond', serif; font-size: 13px; color: var(--dcs-dim); font-style: italic; }

/* library (spells / features) */
.divine-character-system .dcs-lib-bar { margin-bottom: 12px; }
.divine-character-system .dcs-lib-search { width: 100%; }
.divine-character-system .dcs-filters { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 14px; }
.divine-character-system .dcs-filter { font-family: 'Cinzel', serif; font-size: 11px; letter-spacing: .03em; padding: 6px 13px; cursor: pointer;
  border-radius: 8px; background: color-mix(in srgb,var(--cx-text-strong) 4%,transparent); border: 1px solid var(--dcs-border); color: var(--dcs-dim); transition: all .15s; }
.divine-character-system .dcs-filter:hover { color: var(--dcs-text); }
.divine-character-system .dcs-filter.active { background: linear-gradient(150deg, color-mix(in srgb,var(--cx-accent-deep) 22%,transparent), color-mix(in srgb,var(--cx-accent-deep) 6%,transparent)); border-color: var(--dcs-gold-dim); color: var(--dcs-gold); }

/* summary (god sheet) */
.divine-character-system .dcs-sum-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(110px, 1fr)); gap: 9px; margin-bottom: 18px; }
.divine-character-system .dcs-sum-block { margin-bottom: 16px; }
.divine-character-system .dcs-sum-title { font-family: 'Cinzel', serif; font-size: 11px; letter-spacing: .08em; text-transform: uppercase;
  color: var(--dcs-gold); margin-bottom: 8px; border-bottom: 1px solid var(--dcs-border); padding-bottom: 5px; }
.divine-character-system .dcs-sum-list { margin: 0; padding-left: 18px; font-family: 'EB Garamond', serif; font-size: 13.5px; color: var(--dcs-text); line-height: 1.6; }
.divine-character-system .dcs-chiprow-wrap { display: flex; flex-wrap: wrap; gap: 6px; }
.divine-character-system .dcs-summary .dcs-slots { display: flex; flex-wrap: wrap; gap: 8px; }
.divine-character-system .dcs-summary .dcs-slot { border: 1px solid var(--dcs-border); border-radius: 8px; padding: 6px 12px; align-items: center; }
.divine-character-system .dcs-summary .dcs-slot span { font-family: 'Cinzel', serif; font-size: 10px; color: var(--dcs-gold-dim); }
.divine-character-system .dcs-summary .dcs-slot strong { font-family: 'Cinzel', serif; font-size: 16px; color: var(--dcs-gold); }

/* legacy collapsible */
.divine-character-system.dcs-legacy { display: block; margin: 26px 0 0; border: 1px solid var(--dcs-border, var(--cx-border)); border-radius: 12px;
  background: rgba(0,0,0,.16); overflow: hidden; }
.divine-character-system.dcs-legacy .dcs-legacy-summary { cursor: pointer; padding: 14px 18px; font-family: 'Cinzel', serif; font-size: 13px; letter-spacing: .05em;
  color: var(--dcs-gold-dim, var(--cx-accent-deep)); list-style: none; }
.divine-character-system.dcs-legacy .dcs-legacy-summary::-webkit-details-marker { display: none; }
.divine-character-system.dcs-legacy .dcs-legacy-summary::before { content: '▸ '; color: var(--dcs-gold-dim, var(--cx-accent-deep)); }
.divine-character-system.dcs-legacy[open] .dcs-legacy-summary::before { content: '▾ '; }
.divine-character-system.dcs-legacy .dcs-legacy-note { font-family: 'EB Garamond', serif; font-size: 12px; letter-spacing: 0; color: var(--dcs-dim, var(--cx-text-dim)); }
.divine-character-system.dcs-legacy .dcs-legacy-body { padding: 8px 16px 16px; }

@media (max-width: 768px) {
  .divine-character-system .dcs-navtab { padding: 8px 12px; font-size: 11.5px; }
  .divine-character-system .dcs-sum-grid { grid-template-columns: repeat(auto-fill, minmax(90px, 1fr)); }
}

/* ============================================================================
 * Phase 5 — Combat Mode, Global Search, Pins, Resource extras
 * ==========================================================================*/
/* header combat-mode button + global search */
.divine-character-system .dcs-combat-enter { margin-left: 12px; font-family: 'Cinzel', serif; font-size: 11.5px; letter-spacing: .05em;
  padding: 8px 16px; border-radius: 9px; cursor: pointer; color: var(--cx-surface);
  background: linear-gradient(150deg, var(--dcs-gold), var(--dcs-gold-dim)); border: 1px solid var(--dcs-gold-dim);
  font-weight: 700; transition: filter .15s; }
.divine-character-system .dcs-combat-enter:hover { filter: brightness(1.1); }
.divine-character-system .dcs-globalsearch { position: relative; margin-top: 12px; }
.divine-character-system .dcs-gsearch-input { width: 100%; }
.divine-character-system .dcs-gsearch-results { display: none; position: absolute; z-index: 50; left: 0; right: 0; top: calc(100% + 6px);
  background: var(--dcs-surface); border: 1px solid var(--dcs-gold-dim); border-radius: 12px; box-shadow: 0 18px 50px rgba(0,0,0,.6);
  max-height: 420px; overflow-y: auto; padding: 10px; }
.divine-character-system .dcs-gsearch-results.open { display: block; }
.divine-character-system .dcs-gsearch-filters { display: flex; flex-wrap: wrap; gap: 5px; margin-bottom: 10px; padding-bottom: 10px; border-bottom: 1px solid var(--dcs-border); }
.divine-character-system .dcs-gs-group { margin-bottom: 8px; }
.divine-character-system .dcs-gs-cat { font-family: 'Cinzel', serif; font-size: 9.5px; letter-spacing: .08em; text-transform: uppercase; color: var(--dcs-gold-dim); margin: 4px 0; }
.divine-character-system .dcs-gs-item { display: flex; justify-content: space-between; align-items: center; width: 100%; text-align: left;
  background: transparent; border: 1px solid transparent; border-radius: 8px; padding: 7px 10px; cursor: pointer; color: var(--dcs-text); }
.divine-character-system .dcs-gs-item:hover { border-color: var(--dcs-border); background: color-mix(in srgb,var(--cx-text-strong) 3%,transparent); }
.divine-character-system .dcs-gs-name { font-family: 'EB Garamond', serif; font-size: 14px; }
.divine-character-system .dcs-gs-tag { font-family: 'Cinzel', serif; font-size: 9px; letter-spacing: .04em; text-transform: uppercase; color: var(--dcs-dim); }

/* pin buttons */
.divine-character-system .dcs-pin { background: transparent; border: none; cursor: pointer; font-size: 13px; line-height: 1; padding: 0 2px;
  opacity: .35; filter: grayscale(1); transition: opacity .15s; }
.divine-character-system .dcs-pin:hover { opacity: .7; }
.divine-character-system .dcs-pin.on { opacity: 1; filter: none; }
.divine-character-system .dcs-feat-head, .divine-character-system .dcs-spell-head { gap: 6px; }

/* pinned strip */
.divine-character-system .dcs-pinned { border: 1px solid var(--dcs-gold-dim); border-radius: 12px; padding: 12px; margin-bottom: 14px;
  background: linear-gradient(160deg, color-mix(in srgb,var(--cx-accent-deep) 8%,transparent), rgba(0,0,0,.15)); }
.divine-character-system .dcs-pinned-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 8px; }

/* resource extras */
.divine-character-system .dcs-res-reset { width: 30px; height: 34px; border-radius: 8px; cursor: pointer; font-size: 15px; line-height: 1;
  background: color-mix(in srgb,var(--cx-text-strong) 4%,transparent); border: 1px solid var(--dcs-border); color: var(--dcs-gold-dim); transition: background .15s; }
.divine-character-system .dcs-res-reset:hover { background: color-mix(in srgb,var(--cx-accent-deep) 16%,transparent); }
.divine-character-system .dcs-res-src { font-family: 'EB Garamond', serif; font-size: 11px; color: var(--dcs-dim); margin-top: 6px; }

/* ---- Combat Mode overlay ---- */
.divine-character-system .dcs-cm-overlay { position: fixed; inset: 0; z-index: 9500; background: radial-gradient(circle at 50% 0%, color-mix(in srgb,var(--cx-surface) 98%,transparent), color-mix(in srgb,var(--cx-bg) 99%,transparent));
  overflow-y: auto; animation: dcsFade .2s ease; padding: 12px; }
.divine-character-system .dcs-cm { width: min(1920px, calc(100vw - 24px)); max-width: none; margin: 0 auto; }
.divine-character-system .dcs-cm-sticky { position: sticky; top: 0; z-index: 3; background: linear-gradient(180deg, color-mix(in srgb,var(--cx-field) 97%,transparent), color-mix(in srgb,var(--cx-field) 90%,transparent));
  padding: 10px 4px 12px; margin-bottom: 14px; border-bottom: 1px solid var(--dcs-gold-dim); box-shadow: 0 14px 22px rgba(0,0,0,.28); }
.divine-character-system .dcs-cm-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 8px; }
.divine-character-system .dcs-cm-title { font-family: 'Cinzel', serif; font-size: 24px; color: var(--dcs-gold); }
.divine-character-system .dcs-cm-form { font-family: 'EB Garamond', serif; font-size: 13px; color: var(--dcs-readable-dim); margin-left: 12px; }
.divine-character-system .dcs-cm-exit { font-family: 'Cinzel', serif; font-size: 12px; letter-spacing: .05em; padding: 9px 18px; border-radius: 9px;
  cursor: pointer; color: var(--dcs-text); background: color-mix(in srgb,var(--cx-danger) 16%,transparent); border: 1px solid color-mix(in srgb,var(--cx-danger) 50%,transparent); }
.divine-character-system .dcs-cm-exit:hover { background: color-mix(in srgb,var(--cx-danger) 30%,transparent); }
.divine-character-system .dcs-cm-grid { display: grid; grid-template-columns: 300px minmax(0, 1fr) 330px; gap: 14px; align-items: start; }
.divine-character-system .dcs-cm-rollside { position: sticky; top: 76px; align-self: start; min-width: 0; }
.divine-character-system .dcs-cm-left > *, .divine-character-system .dcs-cm-section { margin-bottom: 14px; }
.divine-character-system .dcs-cm .dcs-dash-coltitle { color: var(--cx-accent-bright); text-shadow: 0 1px 2px rgba(0,0,0,.75); }
.divine-character-system .dcs-cm .dcs-feat-meta,
.divine-character-system .dcs-cm .dcs-res-src,
.divine-character-system .dcs-cm .dcs-empty,
.divine-character-system .dcs-cm .dcs-feat-tag,
.divine-character-system .dcs-cm .dcs-res-recharge { color: var(--dcs-readable-dim); }
.divine-character-system .dcs-cm .dcs-feat-desc { color: var(--dcs-readable); }
.divine-character-system .dcs-cm-tile-grid,
.divine-character-system #dcs-cm-spelllist .dcs-spell-grid,
.divine-character-system #dcs-cm-reslist.dcs-cm-resource-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; align-items: stretch; }
.divine-character-system .dcs-cm-tile-grid .dcs-feat { display: flex; flex-direction: column; min-height: 92px; margin-bottom: 0; padding: 10px 11px; }
.divine-character-system .dcs-cm-tile-grid .dcs-feat.open { grid-column: 1 / -1; min-height: 0; }
.divine-character-system .dcs-cm-tile-grid .dcs-feat-head { align-items: flex-start; }
.divine-character-system .dcs-cm-tile-grid .dcs-feat-name { line-height: 1.15; }
.divine-character-system .dcs-cm-tile-grid .dcs-feat-tag { margin-left: auto; }
.divine-character-system .dcs-cm-tile-grid .dcs-roll-actions { margin-top: auto; padding-top: 8px; }
.divine-character-system .dcs-cm-tile-grid .dcs-empty { grid-column: 1 / -1; }
.divine-character-system #dcs-cm-spelllist .dcs-spell { display: flex; flex-direction: column; min-height: 96px; margin-bottom: 0; padding: 10px 11px;
  border-color: var(--dcs-border); background: color-mix(in srgb,var(--cx-surface) 45%,transparent); }
.divine-character-system #dcs-cm-spelllist .dcs-spell:hover { border-color: var(--dcs-gold-dim); background: color-mix(in srgb,var(--cx-accent-deep) 8%,transparent); }
.divine-character-system #dcs-cm-spelllist .dcs-spell.open { grid-column: 1 / -1; min-height: 0; }
.divine-character-system #dcs-cm-spelllist .dcs-spell-head { align-items: flex-start; gap: 6px; }
.divine-character-system #dcs-cm-spelllist .dcs-spell-name { line-height: 1.15; min-width: 0; overflow-wrap: anywhere; }
.divine-character-system #dcs-cm-spelllist .dcs-spell-tag { margin-left: auto; white-space: nowrap; }
.divine-character-system #dcs-cm-spelllist .dcs-spell .dcs-feat-meta { padding-left: 0; margin-top: 5px; }
.divine-character-system #dcs-cm-spelllist .dcs-spell .dcs-feat-desc { padding-left: 0; margin-top: 8px; }
.divine-character-system #dcs-cm-spelllist .dcs-spell .dcs-roll-actions { margin-top: auto; padding-top: 8px; }
.divine-character-system #dcs-cm-spelllist .dcs-spell.open .dcs-roll-actions { margin-top: 8px; }
.divine-character-system #dcs-cm-reslist.dcs-cm-resource-grid .dcs-res { display: flex; flex-direction: column; min-height: 108px; margin-bottom: 0; padding: 10px 11px; }
.divine-character-system #dcs-cm-reslist.dcs-cm-resource-grid .dcs-res-top { align-items: flex-start; gap: 6px; margin-bottom: 8px; }
.divine-character-system #dcs-cm-reslist.dcs-cm-resource-grid .dcs-res-name { line-height: 1.15; min-width: 0; overflow-wrap: anywhere; }
.divine-character-system #dcs-cm-reslist.dcs-cm-resource-grid .dcs-res-recharge { margin-left: auto; white-space: nowrap; }
.divine-character-system #dcs-cm-reslist.dcs-cm-resource-grid .dcs-res-track { margin-top: auto; gap: 6px; justify-content: space-between; }
.divine-character-system #dcs-cm-reslist.dcs-cm-resource-grid .dcs-res-btn { width: 30px; height: 30px; font-size: 16px; }
.divine-character-system #dcs-cm-reslist.dcs-cm-resource-grid .dcs-res-reset { width: 30px; height: 30px; }
.divine-character-system #dcs-cm-reslist.dcs-cm-resource-grid .dcs-res-count { min-width: 46px; font-size: 14px; }
.divine-character-system #dcs-cm-reslist.dcs-cm-resource-grid .dcs-res-src { margin-top: 7px; line-height: 1.15; overflow-wrap: anywhere; }
.divine-character-system #dcs-cm-reslist.dcs-cm-resource-grid .dcs-empty { grid-column: 1 / -1; }
.divine-character-system .dcs-cm-hp { border: 1px solid var(--dcs-border); border-radius: 14px; padding: 14px; text-align: center;
  background: linear-gradient(160deg, color-mix(in srgb,var(--cx-success) 12%,transparent), rgba(0,0,0,.2)); }
.divine-character-system .dcs-cm-hp.low { background: linear-gradient(160deg, color-mix(in srgb,var(--cx-accent) 16%,transparent), rgba(0,0,0,.2)); }
.divine-character-system .dcs-cm-hp.zero { background: linear-gradient(160deg, color-mix(in srgb,var(--cx-danger) 20%,transparent), rgba(0,0,0,.2)); }
.divine-character-system .dcs-cm-hp-label { font-family: 'Cinzel', serif; font-size: 10px; letter-spacing: .08em; text-transform: uppercase; color: var(--dcs-readable-dim); text-shadow: 0 1px 2px rgba(0,0,0,.7); }
.divine-character-system .dcs-cm-hp-val { font-family: 'Cinzel', serif; font-size: 46px; font-weight: 900; color: var(--cx-success); line-height: 1.05; margin-top: 2px; }
.divine-character-system .dcs-cm-hp.low .dcs-cm-hp-val { color: var(--cx-accent); }
.divine-character-system .dcs-cm-hp.zero .dcs-cm-hp-val { color: var(--cx-danger); }
.divine-character-system .dcs-cm-hp-max { font-size: 18px; color: var(--dcs-readable-dim); margin-left: 6px; }
.divine-character-system .dcs-cm-hp-btns { display: flex; gap: 6px; justify-content: center; margin-top: 10px; flex-wrap: wrap; }
.divine-character-system .dcs-cm-hp-custom { display: flex; align-items: center; justify-content: center; gap: 6px; margin-top: 8px; }
.divine-character-system .dcs-cm-hp-amt { width: 82px; text-align: center; font-family: 'Cinzel', serif; font-size: 16px; padding: 5px 7px; }
.divine-character-system .dcs-cm-vitals { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; }
.divine-character-system .dcs-cm-vital { border: 1px solid var(--dcs-border); border-radius: 10px; padding: 9px 12px; background: color-mix(in srgb,var(--cx-surface) 40%,transparent); }
.divine-character-system .dcs-cm-vital span { display: block; font-family: 'Cinzel', serif; font-size: 9px; letter-spacing: .06em; text-transform: uppercase; color: var(--dcs-readable-dim); text-shadow: 0 1px 2px rgba(0,0,0,.7); }
.divine-character-system .dcs-cm-vital strong { font-family: 'Cinzel', serif; font-size: 20px; color: var(--dcs-gold); }
.divine-character-system .dcs-cm-vital-roll { width: 100%; text-align: left; cursor: pointer; }
.divine-character-system .dcs-cm-vital-roll:hover { border-color: var(--dcs-gold-dim); background: color-mix(in srgb,var(--cx-accent-deep) 12%,transparent); }
.divine-character-system .dcs-cm-temp { width: 64px; font-size: 16px; padding: 2px 6px; }
.divine-character-system .dcs-cm-field { border: 1px solid var(--dcs-border); border-radius: 10px; padding: 11px; background: color-mix(in srgb,var(--cx-surface) 40%,transparent); }
.divine-character-system .dcs-cm-field > label { display: block; font-family: 'Cinzel', serif; font-size: 10px; letter-spacing: .06em; text-transform: uppercase; color: var(--dcs-gold-dim); margin-bottom: 7px; }
.divine-character-system .dcs-cm-abil-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; }
.divine-character-system .dcs-abil-card { display: grid; grid-template-columns: 1fr auto; grid-template-rows: auto auto; gap: 2px 6px; align-items: center;
  width: 100%; text-align: left; border: 1px solid var(--dcs-border); border-radius: 10px; padding: 8px 9px; cursor: pointer;
  color: var(--dcs-text); background: linear-gradient(160deg, color-mix(in srgb,var(--cx-accent-deep) 8%,transparent), rgba(0,0,0,.14)); }
.divine-character-system .dcs-abil-card:hover { border-color: var(--dcs-gold-dim); background: color-mix(in srgb,var(--cx-accent-deep) 13%,transparent); }
.divine-character-system .dcs-abil-label { grid-column: 1 / 3; font-family: 'Cinzel', serif; font-size: 9px; letter-spacing: .04em; text-transform: uppercase; color: var(--dcs-readable-dim); text-shadow: 0 1px 2px rgba(0,0,0,.65); }
.divine-character-system .dcs-abil-card strong { font-family: 'Cinzel', serif; font-size: 21px; color: var(--dcs-gold); line-height: 1; }
.divine-character-system .dcs-abil-card em { justify-self: end; min-width: 32px; height: 28px; border: 1px solid var(--dcs-gold-dim); border-radius: 999px;
  display: inline-flex; align-items: center; justify-content: center; color: var(--dcs-text); font-family: 'Cinzel', serif; font-size: 14px; font-style: normal; background: rgba(0,0,0,.22); }
.divine-character-system .dcs-cm-skills { padding-bottom: 14px; }
.divine-character-system .dcs-skill-head, .divine-character-system .dcs-skill-row { display: grid; grid-template-columns: 34px 42px 1fr 58px; align-items: center; gap: 8px; }
.divine-character-system .dcs-skill-head { font-family: 'Cinzel', serif; font-size: 9px; letter-spacing: .06em; text-transform: uppercase; color: var(--dcs-readable-dim); padding: 0 4px 5px; text-shadow: 0 1px 2px rgba(0,0,0,.65); }
.divine-character-system .dcs-skill-row { width: 100%; border: 0; border-top: 1px solid var(--dcs-border); padding: 6px 4px; cursor: pointer;
  color: var(--dcs-text); background: transparent; text-align: left; }
.divine-character-system .dcs-skill-row:hover { background: color-mix(in srgb,var(--cx-accent-deep) 8%,transparent); }
.divine-character-system .dcs-skill-prof { font-size: 16px; color: var(--dcs-readable-dim); text-align: center; }
.divine-character-system .dcs-skill-row.prof .dcs-skill-prof { color: var(--dcs-gold); }
.divine-character-system .dcs-skill-row.exp .dcs-skill-prof { color: var(--cx-accent-bright); }
.divine-character-system .dcs-skill-mod { font-family: 'Cinzel', serif; font-size: 12px; color: var(--dcs-readable-dim); }
.divine-character-system .dcs-skill-name { font-family: 'EB Garamond', serif; font-size: 15px; color: var(--dcs-text); min-width: 0; overflow-wrap: anywhere; }
.divine-character-system .dcs-skill-row strong { justify-self: end; min-width: 48px; border: 1px solid var(--dcs-border); border-radius: 7px; padding: 3px 7px;
  text-align: center; color: var(--dcs-gold); font-family: 'Cinzel', serif; font-size: 16px; background: rgba(0,0,0,.2); }
.divine-character-system .dcs-additional-skills-label { margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--dcs-gold-dim);
  color: var(--dcs-readable-dim); text-align: center; font-family: 'EB Garamond', serif; font-size: 14px; }
.divine-character-system .dcs-additional-skills-label.muted { padding-bottom: 2px; }
.divine-character-system .dcs-cond-row { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 8px; }
.divine-character-system .dcs-cond-chip button { background: transparent; border: none; color: var(--dcs-red); cursor: pointer; margin-left: 5px; font-size: 13px; }
.divine-character-system .dcs-dice { display: flex; flex-wrap: wrap; gap: 5px; margin-bottom: 8px; }
.divine-character-system .dcs-die { font-family: 'Cinzel', serif; font-size: 12px; padding: 7px 11px; border-radius: 8px; cursor: pointer;
  background: color-mix(in srgb,var(--cx-accent-deep) 10%,transparent); border: 1px solid var(--dcs-gold-dim); color: var(--dcs-gold); transition: background .15s; }
.divine-character-system .dcs-die:hover { background: color-mix(in srgb,var(--cx-accent-deep) 24%,transparent); }
.divine-character-system .dcs-dice-custom { display: flex; align-items: center; gap: 5px; flex-wrap: wrap; margin-bottom: 8px; color: var(--dcs-readable-dim); }
.divine-character-system .dcs-cm-rolltray { display: flex; flex-direction: column; gap: 8px;
  border: 1px solid var(--dcs-border); border-radius: 12px; padding: 10px; background: color-mix(in srgb,var(--cx-surface) 78%,transparent);
  box-shadow: 0 14px 28px rgba(0,0,0,.22); }
.divine-character-system .dcs-cm-rolltray-label { font-family: 'Cinzel', serif; font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--dcs-gold-dim); padding-bottom: 6px; border-bottom: 1px solid var(--dcs-border); }
.divine-character-system .dcs-roll-out { font-family: 'EB Garamond', serif; font-size: 13.5px; color: var(--dcs-text); min-height: 22px;
  max-height: calc(100vh - 150px); max-height: calc(100dvh - 150px); overflow-y: auto; padding-right: 4px; scroll-behavior: smooth; }
.divine-character-system .dcs-roll-card { border: 1px solid color-mix(in srgb,var(--cx-accent-deep) 18%,transparent); border-radius: 9px; padding: 7px 9px; margin-bottom: 6px;
  background: linear-gradient(135deg, color-mix(in srgb,var(--cx-accent-deep) 8%,transparent), rgba(0,0,0,.18)); }
.divine-character-system .dcs-roll-main { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; }
.divine-character-system .dcs-roll-text { color: var(--dcs-text); font-size: 14px; line-height: 1.25; overflow-wrap: anywhere; }
.divine-character-system .dcs-roll-total { flex: 0 0 auto; font-family: 'Cinzel', serif; font-size: 22px; color: var(--dcs-gold); line-height: 1; }
.divine-character-system .dcs-roll-dice { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 6px; }
.divine-character-system .dcs-die-face { width: 34px; height: 34px; display: inline-flex; flex-direction: column; align-items: center; justify-content: center;
  border: 1px solid var(--dcs-gold-dim); border-radius: 8px; background: radial-gradient(circle at 35% 25%, color-mix(in srgb,var(--cx-accent-bright) 22%,transparent), color-mix(in srgb,var(--cx-accent-deep) 8%,transparent) 40%, rgba(0,0,0,.24));
  box-shadow: inset 0 0 12px color-mix(in srgb,var(--cx-accent-deep) 12%,transparent), 0 2px 8px rgba(0,0,0,.25); animation: dcsDiePop .24s ease; }
.divine-character-system .dcs-die-face b { font-family: 'Cinzel', serif; color: var(--dcs-gold); font-size: 15px; line-height: 1; }
.divine-character-system .dcs-die-face small { color: var(--dcs-readable-dim); font-size: 8px; line-height: 1; margin-top: 2px; }
.divine-character-system .dcs-roll-detail { margin-top: 4px; color: var(--dcs-readable-dim); font-size: 12px; line-height: 1.25; overflow-wrap: anywhere; }
.divine-character-system .dcs-roll-meta { margin-top: 3px; color: color-mix(in srgb,var(--cx-accent-bright) 72%,transparent); font-family: 'Cinzel', serif; font-size: 9px; letter-spacing: .04em; text-transform: uppercase; }
@keyframes dcsDiePop { from { opacity: 0; transform: translateY(4px) scale(.88); } to { opacity: 1; transform: translateY(0) scale(1); } }
.divine-character-system .dcs-roll-empty, .divine-character-system .dcs-roll-hint { color: var(--dcs-dim); font-family: 'EB Garamond', serif; font-size: 13px; }
.divine-character-system .dcs-roll-hint { margin-top: 2px; }

@media (max-width: 1500px) {
  .divine-character-system .dcs-cm-grid { grid-template-columns: 280px minmax(0, 1fr) 300px; }
  .divine-character-system .dcs-cm-tile-grid,
  .divine-character-system #dcs-cm-spelllist .dcs-spell-grid,
  .divine-character-system #dcs-cm-reslist.dcs-cm-resource-grid { grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); }
}

@media (max-width: 1180px) {
  .divine-character-system .dcs-cm-grid { grid-template-columns: 280px minmax(0, 1fr); }
  .divine-character-system .dcs-cm-rollside { grid-column: 1 / -1; position: relative; top: auto; }
  .divine-character-system .dcs-roll-out { max-height: 420px; }
  .divine-character-system .dcs-cm-tile-grid,
  .divine-character-system #dcs-cm-spelllist .dcs-spell-grid,
  .divine-character-system #dcs-cm-reslist.dcs-cm-resource-grid { grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); }
}

@media (max-width: 768px) {
  .divine-character-system .dcs-cm { width: min(100%, calc(100vw - 18px)); }
  .divine-character-system .dcs-cm-grid { grid-template-columns: 1fr; }
  .divine-character-system .dcs-cm-rollside { grid-column: auto; }
  .divine-character-system .dcs-cm-tile-grid,
  .divine-character-system #dcs-cm-spelllist .dcs-spell-grid,
  .divine-character-system #dcs-cm-reslist.dcs-cm-resource-grid { grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); }
  .divine-character-system .dcs-cm-abil-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .divine-character-system .dcs-cm-head { align-items: flex-start; }
  .divine-character-system .dcs-cm-rolltray { gap: 6px; }
  .divine-character-system .dcs-combat-enter { margin-left: 0; margin-top: 8px; }

  /* Touch targets: glyph buttons get a real ≥32px hit area (Apple HIG). */
  .divine-character-system .dcs-fav,
  .divine-character-system .dcs-pin,
  .divine-character-system .dcs-prep,
  .divine-character-system .dcs-rc { min-width: 32px; min-height: 32px; display: inline-flex; align-items: center; justify-content: center; }
  .divine-character-system .dcs-cm-pip { min-width: 30px; min-height: 30px; font-size: 20px; display: inline-flex; align-items: center; justify-content: center; }
  .divine-character-system .dcs-pip { width: 24px; height: 24px; }
  .divine-character-system .dcs-roll-btn { padding: 8px 12px; min-height: 36px; }

  /* iOS zooms any focused input under 16px; these carried inline 11px before. */
  .divine-character-system .dcs-prep-max,
  .divine-character-system select.dcs-spell-lvlset { font-size: 16px; }

  /* Notch/home-bar safe areas on the full-screen overlays. */
  .divine-character-system .dcs-overlay { padding: max(16px, env(safe-area-inset-top)) max(16px, env(safe-area-inset-right)) max(16px, env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left)); }
  .divine-character-system .dcs-cm-overlay { padding: max(12px, env(safe-area-inset-top)) max(12px, env(safe-area-inset-right)) max(12px, env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-left)); }

  /* ---- Mobile combat tabs (deploy80) ---- */
  /* One panel at a time instead of a mile-long stack. */
  .divine-character-system .dcs-cm { padding-bottom: 86px; } /* clear the fixed bar */
  .divine-character-system .dcs-cm-grid[data-cmtab="stats"] > .dcs-cm-right,
  .divine-character-system .dcs-cm-grid[data-cmtab="stats"] > .dcs-cm-rollside,
  .divine-character-system .dcs-cm-grid[data-cmtab="combat"] > .dcs-cm-left,
  .divine-character-system .dcs-cm-grid[data-cmtab="combat"] > .dcs-cm-rollside,
  .divine-character-system .dcs-cm-grid[data-cmtab="rolls"] > .dcs-cm-left,
  .divine-character-system .dcs-cm-grid[data-cmtab="rolls"] > .dcs-cm-right { display: none; }

  .divine-character-system .dcs-cm-tabbar { display: flex; position: fixed; left: 0; right: 0; bottom: 0; z-index: 9600;
    gap: 6px; padding: 6px max(10px, env(safe-area-inset-right)) max(8px, env(safe-area-inset-bottom)) max(10px, env(safe-area-inset-left));
    background: color-mix(in srgb,var(--cx-field) 97%,transparent); border-top: 1px solid var(--dcs-gold-dim);
    box-shadow: 0 -10px 24px rgba(0, 0, 0, .45); backdrop-filter: blur(6px); }
  .divine-character-system .dcs-cm-tabbtn { flex: 1; position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center;
    gap: 2px; min-height: 50px; background: none; border: none; border-radius: 10px; cursor: pointer;
    color: var(--dcs-readable-dim); font-family: 'Cinzel', serif; font-size: 10px; letter-spacing: .06em; text-transform: uppercase; }
  .divine-character-system .dcs-cm-tabico { font-size: 19px; line-height: 1; }
  .divine-character-system .dcs-cm-tabbtn.on { color: var(--dcs-gold); background: color-mix(in srgb,var(--cx-accent-deep) 12%,transparent); }
  .divine-character-system .dcs-cm-tabbadge { position: absolute; top: 4px; right: 16%; min-width: 16px; height: 16px; padding: 0 4px;
    display: inline-flex; align-items: center; justify-content: center; border-radius: 8px;
    background: var(--dcs-red); color: var(--cx-text-strong); font-family: sans-serif; font-size: 10px; font-style: normal; line-height: 1; }

  /* Always-visible HP in the sticky header. */
  .divine-character-system .dcs-cm-hpmini { display: inline-flex; align-items: baseline; gap: 1px; margin-left: 10px;
    padding: 2px 9px; border: 1px solid var(--dcs-gold-dim); border-radius: 10px;
    font-family: 'Cinzel', serif; font-size: 12px; color: var(--dcs-readable-dim); vertical-align: middle; }
  .divine-character-system .dcs-cm-hpmini b { color: var(--dcs-gold); font-size: 15px; }
  .divine-character-system .dcs-cm-hpmini.low b { color: var(--cx-accent); }
  .divine-character-system .dcs-cm-hpmini.zero b { color: var(--dcs-red); }
}

@media (max-width: 520px) {
  .divine-character-system .dcs-cm-overlay { padding: max(8px, env(safe-area-inset-top)) max(8px, env(safe-area-inset-right)) max(8px, env(safe-area-inset-bottom)) max(8px, env(safe-area-inset-left)); }
  .divine-character-system .dcs-cm-tile-grid,
  .divine-character-system #dcs-cm-spelllist .dcs-spell-grid,
  .divine-character-system #dcs-cm-reslist.dcs-cm-resource-grid { grid-template-columns: 1fr; }
  .divine-character-system .dcs-cm-abil-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .divine-character-system .dcs-skill-head, .divine-character-system .dcs-skill-row { grid-template-columns: 26px 34px 1fr 50px; gap: 5px; }
  .divine-character-system .dcs-skill-name { font-size: 14px; }
}

/* ============================================================================
 * Phase 6 — SRD lookup, row controls, search mode/clear
 * ==========================================================================*/
/* Mobile-polish: sizing for controls that previously carried inline styles.
 * Base = exact previous inline values, so desktop is pixel-identical; the
 * ≤768px block below can now actually override them (inline styles can't
 * be beaten by media queries). */
.divine-character-system .dcs-prep-max { width: 44px; font-size: 11px; padding: 1px 4px; }
.divine-character-system select.dcs-spell-lvlset { font-size: 11px; padding: 1px 4px; width: auto; }
.divine-character-system .dcs-prep { background: none; border: none; cursor: pointer; font-size: 13px; padding: 0 2px; line-height: 1; }
.divine-character-system .dcs-cm-pip { background: none; border: none; cursor: pointer; padding: 0 2px; font-size: 16px; line-height: 1; }

/* Mobile combat tabs (deploy80) — desktop never sees these. */
.divine-character-system .dcs-cm-tabbar { display: none; }
.divine-character-system .dcs-cm-hpmini { display: none; }
.divine-character-system .dcs-srd { font-family: 'Cinzel', serif; font-size: 11px; letter-spacing: .03em; cursor: pointer;
  padding: 7px 14px; border-radius: 8px; margin-left: 8px; color: var(--dcs-text);
  background: rgba(120,150,200,.12); border: 1px solid rgba(120,150,200,.4); transition: background .15s; }
.divine-character-system .dcs-srd:hover { background: rgba(120,150,200,.24); }
.divine-character-system .dcs-rowctrls { display: inline-flex; gap: 2px; align-items: center; margin-left: auto; }
.divine-character-system .dcs-rc { background: transparent; border: none; color: var(--dcs-dim); cursor: pointer; font-size: 12px;
  line-height: 1; padding: 3px 5px; border-radius: 6px; }
.divine-character-system .dcs-rc:hover { color: var(--dcs-gold); background: color-mix(in srgb,var(--cx-text-strong) 5%,transparent); }

/* lookup dialog */
.divine-character-system .dcs-lookup-modal { width: min(640px, 100%); }
.divine-character-system .dcs-lk-results { margin-top: 12px; max-height: 50vh; overflow-y: auto; }
.divine-character-system .dcs-lk-item { display: flex; flex-direction: column; align-items: flex-start; width: 100%; text-align: left;
  background: var(--dcs-card); border: 1px solid var(--dcs-border); border-radius: 9px; padding: 9px 12px; margin-bottom: 7px; cursor: pointer; transition: border-color .15s; }
.divine-character-system .dcs-lk-item:hover { border-color: var(--dcs-gold-dim); }
.divine-character-system .dcs-lk-name { font-family: 'EB Garamond', serif; font-size: 15px; color: var(--dcs-text); font-weight: 600; }
.divine-character-system .dcs-lk-sub { font-family: 'Cinzel', serif; font-size: 10px; letter-spacing: .03em; color: var(--dcs-gold-dim); margin-top: 2px; }

/* search mode bar */
.divine-character-system .dcs-gs-mode { display: flex; align-items: center; gap: 6px; margin-bottom: 10px; }
.divine-character-system .dcs-gs-modebtn { font-family: 'Cinzel', serif; font-size: 10px; letter-spacing: .05em; padding: 5px 12px; border-radius: 7px;
  cursor: pointer; background: color-mix(in srgb,var(--cx-text-strong) 4%,transparent); border: 1px solid var(--dcs-border); color: var(--dcs-dim); }
.divine-character-system .dcs-gs-modebtn.active { background: color-mix(in srgb,var(--cx-accent-deep) 18%,transparent); border-color: var(--dcs-gold-dim); color: var(--dcs-gold); }
.divine-character-system .dcs-gs-clear { margin-left: auto; font-family: 'Cinzel', serif; font-size: 10px; letter-spacing: .04em; padding: 5px 12px;
  border-radius: 7px; cursor: pointer; background: color-mix(in srgb,var(--cx-danger) 12%,transparent); border: 1px solid color-mix(in srgb,var(--cx-danger) 40%,transparent); color: var(--cx-danger); }
.divine-character-system .dcs-gs-clear:hover { background: color-mix(in srgb,var(--cx-danger) 24%,transparent); }

/* ============================================================================
 * Phase 7 — Bulk paste, JSON tools, paste buttons
 * ==========================================================================*/
.divine-character-system .dcs-paste { font-family: 'Cinzel', serif; font-size: 11px; letter-spacing: .03em; cursor: pointer;
  padding: 7px 14px; border-radius: 8px; margin-left: 8px; color: var(--dcs-text);
  background: rgba(150,130,200,.12); border: 1px solid rgba(150,130,200,.4); transition: background .15s; }
.divine-character-system .dcs-paste:hover { background: rgba(150,130,200,.24); }
.divine-character-system .dcs-toolbtns { display: flex; gap: 10px; flex-wrap: wrap; }
.divine-character-system .dcs-del-text { background: transparent; border: 1px solid var(--dcs-border); color: var(--dcs-dim);
  font-family: 'Cinzel', serif; font-size: 11px; padding: 7px 14px; border-radius: 8px; cursor: pointer; }
.divine-character-system .dcs-del-text:hover { color: var(--dcs-red); border-color: var(--dcs-red); }

.divine-character-system .dcs-import-modal { width: min(680px, 100%); }
.divine-character-system .dcs-im-actions { display: flex; gap: 10px; margin-top: 12px; align-items: center; }
.divine-character-system .dcs-im-preview { margin-top: 14px; max-height: 40vh; overflow-y: auto; }
.divine-character-system .dcs-im-count { font-family: 'Cinzel', serif; font-size: 11px; letter-spacing: .04em; color: var(--dcs-gold-dim); margin-bottom: 8px; }
.divine-character-system .dcs-im-card { display: flex; justify-content: space-between; align-items: center;
  background: var(--dcs-card); border: 1px solid var(--dcs-border); border-radius: 8px; padding: 8px 12px; margin-bottom: 6px; }
.divine-character-system .dcs-im-name { font-family: 'EB Garamond', serif; font-size: 15px; color: var(--dcs-text); }
.divine-character-system .dcs-im-sub { font-family: 'Cinzel', serif; font-size: 10px; letter-spacing: .03em; color: var(--dcs-gold-dim); }

/* ============================================================================
 * Phase 8 — Guided wizard, surfaced lookup rows
 * ==========================================================================*/
.divine-character-system .dcs-planets-toolbar { margin-bottom: 14px; }
.divine-character-system .dcs-srdrow { display: flex; flex-wrap: wrap; gap: 8px; margin: 10px 0; }

/* dialogs must stack above the wizard overlay */
.divine-character-system .dcs-wizard-overlay { z-index: 9200; }
.divine-character-system .dcs-lookup-overlay, .divine-character-system .dcs-import-overlay { z-index: 9700; }

.divine-character-system .dcs-wizard-modal { width: min(760px, 100%); }
.divine-character-system .dcs-wiz-progress { height: 5px; background: var(--dcs-border); border-radius: 3px; margin: 4px 0 8px; overflow: hidden; }
.divine-character-system .dcs-wiz-bar { height: 100%; background: linear-gradient(90deg, var(--dcs-gold-dim), var(--dcs-gold)); transition: width .25s ease; }
.divine-character-system .dcs-wiz-steps { display: flex; flex-wrap: wrap; gap: 4px 12px; margin-bottom: 6px; }
.divine-character-system .dcs-wiz-step { font-family: 'Cinzel', serif; font-size: 9.5px; letter-spacing: .04em; text-transform: uppercase; color: var(--dcs-dim); }
.divine-character-system .dcs-wiz-step.active { color: var(--dcs-gold); }
.divine-character-system .dcs-wiz-step.done { color: var(--dcs-gold-dim); }
.divine-character-system .dcs-wiz-footer { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 14px 4px 2px; margin-top: 12px; border-top: 1px solid var(--dcs-border); }
.divine-character-system .dcs-wiz-footer-right { display: flex; gap: 8px; flex-wrap: wrap; }
.divine-character-system .dcs-wiz-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 12px; margin: 4px 0; }
.divine-character-system .dcs-wiz-abils { grid-template-columns: repeat(6, 1fr); }
.divine-character-system .dcs-wiz-field { display: flex; flex-direction: column; gap: 5px; }
.divine-character-system .dcs-wiz-field > span { font-family: 'Cinzel', serif; font-size: 10px; letter-spacing: .05em; text-transform: uppercase; color: var(--dcs-gold-dim); }
.divine-character-system .dcs-wiz-abil { text-align: center; }
.divine-character-system .dcs-wiz-planets { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 8px; margin-top: 10px; }
.divine-character-system .dcs-wiz-planet { display: flex; flex-direction: column; align-items: flex-start; gap: 3px; text-align: left;
  background: var(--dcs-card); border: 1px solid var(--dcs-border); border-radius: 10px; padding: 11px 13px; cursor: pointer; transition: border-color .15s; }
.divine-character-system .dcs-wiz-planet:hover { border-color: var(--dcs-gold-dim); }
.divine-character-system .dcs-wiz-planet.selected { border-color: var(--dcs-gold); background: color-mix(in srgb,var(--cx-accent-deep) 10%,transparent); }
.divine-character-system .dcs-wiz-pname { font-family: 'EB Garamond', serif; font-size: 15px; color: var(--dcs-text); font-weight: 600; }
.divine-character-system .dcs-wiz-pmeta { font-family: 'Cinzel', serif; font-size: 9.5px; letter-spacing: .03em; color: var(--dcs-dim); }
.divine-character-system .dcs-wiz-pmeta.has { color: var(--dcs-gold-dim); }
.divine-character-system .dcs-wiz-chips, .divine-character-system .dcs-wiz-skills { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 8px; }
.divine-character-system .dcs-wiz-chip { font-family: 'Cinzel', serif; font-size: 11px; padding: 6px 12px; border-radius: 7px; cursor: pointer;
  background: color-mix(in srgb,var(--cx-text-strong) 4%,transparent); border: 1px solid var(--dcs-border); color: var(--dcs-dim); }
.divine-character-system .dcs-wiz-chip.on { background: color-mix(in srgb,var(--cx-accent-deep) 18%,transparent); border-color: var(--dcs-gold-dim); color: var(--dcs-gold); }
.divine-character-system .dcs-wiz-skill { font-family: 'EB Garamond', serif; font-size: 13px; padding: 5px 10px; border-radius: 7px; cursor: pointer;
  background: color-mix(in srgb,var(--cx-text-strong) 3%,transparent); border: 1px solid var(--dcs-border); color: var(--dcs-text); }
.divine-character-system .dcs-wiz-skill.prof { border-color: var(--dcs-gold-dim); color: var(--dcs-gold); }
.divine-character-system .dcs-wiz-skill.exp { border-color: var(--dcs-gold); color: var(--dcs-gold); background: color-mix(in srgb,var(--cx-accent-deep) 12%,transparent); }
.divine-character-system .dcs-wiz-addrow { display: flex; gap: 8px; margin: 8px 0; }
.divine-character-system .dcs-wiz-addrow .dcs-input { flex: 1; }
.divine-character-system .dcs-wiz-list { margin-top: 10px; }
.divine-character-system .dcs-wiz-rev { display: flex; justify-content: space-between; gap: 12px; padding: 7px 0; border-bottom: 1px solid var(--dcs-border); }
.divine-character-system .dcs-wiz-rev > span { font-family: 'Cinzel', serif; font-size: 10px; letter-spacing: .04em; text-transform: uppercase; color: var(--dcs-dim); }
.divine-character-system .dcs-wiz-rev > strong { font-family: 'EB Garamond', serif; font-size: 14px; color: var(--dcs-text); text-align: right; }

@media (max-width: 768px) {
  .divine-character-system .dcs-wiz-abils { grid-template-columns: repeat(3, 1fr); }
}

/* ============================================================================
 * Phase 9 — Constellation selector, Journey history, journal polish
 * ==========================================================================*/
.divine-character-system .dcs-planets-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 14px; }
.divine-character-system .dcs-viewtoggle { display: flex; gap: 4px; }
.divine-character-system .dcs-vt { font-family: 'Cinzel', serif; font-size: 11px; letter-spacing: .03em; padding: 7px 13px; border-radius: 8px; cursor: pointer;
  background: color-mix(in srgb,var(--cx-text-strong) 4%,transparent); border: 1px solid var(--dcs-border); color: var(--dcs-dim); }
.divine-character-system .dcs-vt.active { background: color-mix(in srgb,var(--cx-accent-deep) 18%,transparent); border-color: var(--dcs-gold-dim); color: var(--dcs-gold); }

/* constellation */
.divine-character-system .dcs-constellation { background: radial-gradient(ellipse at 50% 0%, color-mix(in srgb,var(--cx-surface) 50%,transparent), color-mix(in srgb,var(--cx-field) 40%,transparent)); border: 1px solid var(--dcs-border); border-radius: 16px; padding: 14px; }
.divine-character-system .dcs-constellation-svg { width: 100%; height: auto; display: block; }
.divine-character-system .dcs-node-link { stroke: color-mix(in srgb,var(--cx-accent-deep) 22%,transparent); stroke-width: 1.5; stroke-dasharray: 4 6; }
.divine-character-system .dcs-node { cursor: pointer; }
.divine-character-system .dcs-node-core { fill: var(--cx-accent-dim); stroke: var(--dcs-border); stroke-width: 2; transition: fill .15s, stroke .15s; }
.divine-character-system .dcs-node.started .dcs-node-core { fill: var(--cx-accent-dim); stroke: var(--dcs-gold-dim); }
.divine-character-system .dcs-node.completed .dcs-node-core { fill: var(--dcs-gold); stroke: var(--cx-accent-bright); }
.divine-character-system .dcs-node.empty .dcs-node-core { fill: var(--cx-surface); stroke: var(--cx-accent-dim); }
.divine-character-system .dcs-node:hover .dcs-node-core { stroke: var(--dcs-gold); }
.divine-character-system .dcs-node-glow { fill: color-mix(in srgb,var(--cx-accent-deep) 28%,transparent); }
.divine-character-system .dcs-node.completed:hover .dcs-node-glow { fill: color-mix(in srgb,var(--cx-accent-deep) 42%,transparent); }
.divine-character-system .dcs-node-ring { fill: none; stroke: var(--dcs-gold); stroke-width: 2.5; opacity: .9; }
.divine-character-system .dcs-node-name { fill: var(--dcs-text); font-family: 'Cinzel', serif; font-size: 14px; }
.divine-character-system .dcs-node.empty .dcs-node-name { fill: var(--dcs-dim); }
.divine-character-system .dcs-node-meta { fill: var(--dcs-gold-dim); font-family: 'EB Garamond', serif; font-size: 12px; }
.divine-character-system .dcs-node.empty .dcs-node-meta { fill: var(--cx-accent-dim); }

/* card journal line */
.divine-character-system .dcs-card-journal { font-family: 'EB Garamond', serif; font-size: 12px; color: var(--dcs-gold-dim); margin-top: 6px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* journey history */
.divine-character-system .dcs-journey-banner { font-family: 'Cinzel', serif; font-size: 20px; color: var(--dcs-gold); text-align: center; padding: 16px 0 6px; }
.divine-character-system .dcs-journey-banner span { display: block; font-family: 'EB Garamond', serif; font-size: 13px; color: var(--dcs-dim); margin-top: 4px; }
.divine-character-system .dcs-journey-item { display: flex; gap: 14px; align-items: flex-start; background: var(--dcs-card); border: 1px solid var(--dcs-border);
  border-left: 3px solid var(--dcs-gold-dim); border-radius: 10px; padding: 13px 16px; margin-bottom: 8px; cursor: pointer; transition: border-color .15s; }
.divine-character-system .dcs-journey-item:hover { border-color: var(--dcs-gold-dim); border-left-color: var(--dcs-gold); }
.divine-character-system .dcs-journey-num { font-family: 'Cinzel', serif; font-size: 22px; font-weight: 900; color: var(--dcs-gold-dim); min-width: 28px; text-align: center; }
.divine-character-system .dcs-journey-body { flex: 1; }
.divine-character-system .dcs-journey-head { display: flex; align-items: center; gap: 10px; }
.divine-character-system .dcs-journey-planet { font-family: 'Cinzel', serif; font-size: 16px; color: var(--dcs-text); }
.divine-character-system .dcs-journey-lvl { font-family: 'Cinzel', serif; font-size: 10px; letter-spacing: .04em; color: var(--dcs-gold); padding: 2px 8px; border: 1px solid var(--dcs-gold-dim); border-radius: 20px; }
.divine-character-system .dcs-journey-done { font-family: 'Cinzel', serif; font-size: 9px; letter-spacing: .05em; text-transform: uppercase; color: var(--cx-surface); background: var(--dcs-gold); padding: 2px 8px; border-radius: 20px; }
.divine-character-system .dcs-journey-class { font-family: 'EB Garamond', serif; font-size: 14px; color: var(--dcs-gold-dim); margin-top: 3px; }
.divine-character-system .dcs-journey-ach { font-family: 'EB Garamond', serif; font-size: 13px; color: var(--dcs-dim); margin-top: 4px; font-style: italic; }

/* ============================================================================
 * Phase 10 — Artifacts, Sources, Awards, journal links
 * ==========================================================================*/
.divine-character-system .dcs-artifacts { margin-top: 12px; }
.divine-character-system .dcs-artifact-card { border: 1px solid var(--dcs-gold-dim); border-radius: 12px; padding: 14px; margin-bottom: 12px;
  background: linear-gradient(160deg, color-mix(in srgb,var(--cx-accent-deep) 6%,transparent), rgba(0,0,0,.12)); }
.divine-character-system .dcs-art-name { font-family: 'Cinzel', serif; font-weight: 700; }
.divine-character-system .dcs-af-field { display: flex; flex-direction: column; gap: 4px; flex: 1; }
.divine-character-system .dcs-af-field > span { font-family: 'Cinzel', serif; font-size: 9px; letter-spacing: .05em; text-transform: uppercase; color: var(--dcs-gold-dim); }
.divine-character-system .dcs-art-toggles { align-items: center; }
.divine-character-system .dcs-check { display: inline-flex; align-items: center; gap: 6px; font-family: 'EB Garamond', serif; font-size: 13px; color: var(--dcs-text); cursor: pointer; }
.divine-character-system .dcs-art-charges { margin: 10px 0; }
.divine-character-system .dcs-art-ability { margin-top: 6px; }

/* sources */
.divine-character-system .dcs-src-filters { margin: 10px 0; }
.divine-character-system .dcs-src-frow { display: flex; flex-wrap: wrap; gap: 5px; align-items: center; margin-bottom: 6px; }
.divine-character-system .dcs-src-frow > span { font-family: 'Cinzel', serif; font-size: 9.5px; letter-spacing: .05em; text-transform: uppercase; color: var(--dcs-dim); min-width: 50px; }
.divine-character-system .dcs-src-count { font-family: 'Cinzel', serif; font-size: 10px; letter-spacing: .04em; color: var(--dcs-gold-dim); margin-bottom: 8px; }
.divine-character-system .dcs-src-group { margin-bottom: 12px; }
.divine-character-system .dcs-src-planet { font-family: 'Cinzel', serif; font-size: 13px; color: var(--dcs-gold); border-bottom: 1px solid var(--dcs-gold-dim); padding-bottom: 4px; margin-bottom: 6px; }
.divine-character-system .dcs-src-row { display: flex; align-items: baseline; gap: 10px; padding: 5px 0; border-bottom: 1px solid var(--dcs-border); }
.divine-character-system .dcs-src-type { font-family: 'Cinzel', serif; font-size: 9px; letter-spacing: .04em; text-transform: uppercase; color: var(--cx-surface); background: var(--dcs-gold-dim); padding: 2px 7px; border-radius: 10px; white-space: nowrap; }
.divine-character-system .dcs-src-name { font-family: 'EB Garamond', serif; font-size: 14.5px; color: var(--dcs-text); flex: 1; }
.divine-character-system .dcs-src-meta { font-family: 'EB Garamond', serif; font-size: 12px; color: var(--dcs-dim); text-align: right; }

/* awards */
.divine-character-system .dcs-award-row { display: flex; gap: 6px; margin-bottom: 6px; flex-wrap: wrap; }
.divine-character-system .dcs-award-legacy { font-family: 'EB Garamond', serif; font-size: 13px; color: var(--dcs-gold-dim); padding: 3px 0; }

/* inventory library */
.divine-character-system .dcs-inv-summary { display: grid; grid-template-columns: repeat(auto-fit, minmax(110px, 1fr)); gap: 8px; margin-bottom: 12px; }
.divine-character-system .dcs-inv-group { margin-bottom: 16px; }
.divine-character-system .dcs-inv-split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 14px; align-items: stretch; }
.divine-character-system .dcs-inv-zone { min-height: 270px; border: 1px solid color-mix(in srgb,var(--cx-accent-deep) 22%,transparent); border-radius: 14px; padding: 12px; background: color-mix(in srgb,var(--cx-bg) 42%,transparent); transition: border-color .15s ease, box-shadow .15s ease, background .15s ease; }
.divine-character-system .dcs-inv-zone.dragover { border-color: var(--dcs-gold); box-shadow: 0 0 0 2px color-mix(in srgb,var(--cx-accent-deep) 14%,transparent), 0 0 24px color-mix(in srgb,var(--cx-accent-deep) 16%,transparent); background: color-mix(in srgb,var(--cx-accent-deep) 8%,transparent); }
.divine-character-system .dcs-inv-zone-head { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; margin-bottom: 3px; }
.divine-character-system .dcs-inv-zone-head strong { font-family: 'Cinzel', serif; font-size: 13px; letter-spacing: .11em; text-transform: uppercase; color: var(--dcs-gold); }
.divine-character-system .dcs-inv-zone-head span { font-family: 'EB Garamond', serif; font-size: 12.5px; color: var(--dcs-dim); white-space: nowrap; }
.divine-character-system .dcs-inv-zone-sub { font-family: 'EB Garamond', serif; font-size: 12.5px; color: var(--dcs-dim); margin-bottom: 10px; }
.divine-character-system .dcs-inv-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 8px; align-items: stretch; }
.divine-character-system .dcs-inv-card { display: flex; flex-direction: column; min-height: 126px; border: 1px solid var(--dcs-border); border-radius: 9px; padding: 10px 11px;
  background: color-mix(in srgb,var(--cx-surface) 45%,transparent); cursor: grab; user-select: none; }
.divine-character-system .dcs-inv-card:active { cursor: grabbing; }
.divine-character-system .dcs-inv-card.dragging { opacity: .55; border-color: var(--dcs-gold); }
.divine-character-system .dcs-inv-card.is-empty { opacity: .72; }
.divine-character-system .dcs-inv-card:hover { border-color: var(--dcs-gold-dim); background: color-mix(in srgb,var(--cx-accent-deep) 7%,transparent); }
.divine-character-system .dcs-inv-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; }
.divine-character-system .dcs-inv-name { font-family: 'EB Garamond', serif; font-size: 15px; line-height: 1.15; color: var(--dcs-text); font-weight: 600; min-width: 0; overflow-wrap: anywhere; }
.divine-character-system .dcs-inv-qty { flex: 0 0 auto; font-family: 'Cinzel', serif; font-size: 10px; color: var(--dcs-gold); border: 1px solid var(--dcs-gold-dim);
  border-radius: 999px; padding: 2px 7px; background: color-mix(in srgb,var(--cx-accent-deep) 8%,transparent); }
.divine-character-system .dcs-inv-desc { display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden;
  font-family: 'EB Garamond', serif; font-size: 12.5px; line-height: 1.28; color: var(--dcs-dim); margin-top: 7px; }
.divine-character-system .dcs-inv-foot { margin-top: auto; padding-top: 10px; display: flex; align-items: center; justify-content: space-between; gap: 8px; flex-wrap: wrap; }
.divine-character-system .dcs-inv-qty-controls { display: inline-flex; align-items: center; gap: 6px; }
.divine-character-system .dcs-inv-qty-now { font-family: 'Cinzel', serif; font-size: 9.5px; color: var(--dcs-dim); letter-spacing: .04em; text-transform: uppercase; min-width: 45px; text-align: center; }
.divine-character-system .dcs-inv-movehint { font-family: 'Cinzel', serif; font-size: 9px; color: var(--dcs-dim); letter-spacing: .08em; text-transform: uppercase; opacity: .72; }
.divine-character-system .dcs-inv-empty { grid-column: 1 / -1; margin: 0; min-height: 88px; display: flex; align-items: center; justify-content: center; text-align: center; }
.divine-character-system .dcs-mini { font-family: 'Cinzel', serif; font-size: 9.5px; letter-spacing: .04em; color: var(--dcs-gold);
  border: 1px solid var(--dcs-gold-dim); border-radius: 7px; padding: 4px 8px; background: color-mix(in srgb,var(--cx-accent-deep) 8%,transparent); cursor: pointer; }
.divine-character-system .dcs-inv-qty-controls .dcs-mini { min-width: 28px; padding: 4px 0; }
.divine-character-system .dcs-mini:hover { background: color-mix(in srgb,var(--cx-accent-deep) 18%,transparent); }
@media (max-width: 860px) {
  .divine-character-system .dcs-inv-split { grid-template-columns: 1fr; }
  .divine-character-system .dcs-inv-zone { min-height: 190px; }
}

/* journal tools */
.divine-character-system .dcs-journal-tools { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; margin-bottom: 10px; }
.divine-character-system .dcs-journal-tools .dcs-input { flex: 1; min-width: 200px; }
.divine-character-system .dcs-major-check { font-size: 11px; white-space: nowrap; }

/* ============================================================================
 * Phase 11 — Validation, attunement, accessibility, mobile polish
 * ==========================================================================*/
/* focus states (keyboard navigation) */
.divine-character-system button:focus-visible,
.divine-character-system input:focus-visible,
.divine-character-system select:focus-visible,
.divine-character-system textarea:focus-visible,
.divine-character-system [role="button"]:focus-visible,
.divine-character-system .dcs-node:focus-visible {
  outline: 2px solid var(--dcs-gold); outline-offset: 2px; border-radius: 6px;
}
.divine-character-system .dcs-node:focus-visible .dcs-node-core { stroke: var(--dcs-gold); }

/* attunement bar */
.divine-character-system .dcs-attune-bar { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin: 10px 0;
  padding: 10px 14px; border: 1px solid var(--dcs-gold-dim); border-radius: 10px; background: color-mix(in srgb,var(--cx-accent-deep) 6%,transparent); }
.divine-character-system .dcs-attune-bar.over { border-color: var(--dcs-red); background: color-mix(in srgb,var(--cx-danger) 10%,transparent); }
.divine-character-system .dcs-attune-label { font-family: 'Cinzel', serif; font-size: 10px; letter-spacing: .06em; text-transform: uppercase; color: var(--dcs-gold-dim); }
.divine-character-system .dcs-attune-count { font-family: 'Cinzel', serif; font-size: 18px; color: var(--dcs-gold); }
.divine-character-system .dcs-attune-bar.over .dcs-attune-count { color: var(--dcs-red); }
.divine-character-system .dcs-attune-slots { display: inline-flex; align-items: center; gap: 6px; font-family: 'EB Garamond', serif; font-size: 12px; color: var(--dcs-dim); }
.divine-character-system .dcs-attune-warn { font-family: 'Cinzel', serif; font-size: 11px; color: var(--dcs-red); letter-spacing: .03em; }

/* validation */
.divine-character-system .dcs-validate-ok { font-family: 'EB Garamond', serif; font-size: 14px; color: var(--cx-success); padding: 6px 0; }
.divine-character-system .dcs-validate-head { font-family: 'Cinzel', serif; font-size: 12px; letter-spacing: .03em; color: var(--dcs-gold); margin-bottom: 8px; }
.divine-character-system .dcs-validate-row { display: flex; align-items: baseline; gap: 10px; padding: 6px 8px; border-radius: 7px; border-left: 3px solid var(--dcs-gold-dim); background: color-mix(in srgb,var(--cx-text-strong) 2%,transparent); margin-bottom: 5px; cursor: pointer; }
.divine-character-system .dcs-validate-row.dcs-v-error { border-left-color: var(--dcs-red); background: color-mix(in srgb,var(--cx-danger) 8%,transparent); }
.divine-character-system .dcs-validate-row:hover { background: color-mix(in srgb,var(--cx-text-strong) 5%,transparent); }
.divine-character-system .dcs-v-planet { font-family: 'Cinzel', serif; font-size: 10px; letter-spacing: .03em; color: var(--dcs-gold-dim); min-width: 90px; }
.divine-character-system .dcs-v-msg { font-family: 'EB Garamond', serif; font-size: 13.5px; color: var(--dcs-text); }

/* journal links */
.divine-character-system .dcs-jlinks { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
.divine-character-system .dcs-jlink { font-family: 'EB Garamond', serif; font-size: 12.5px; color: var(--dcs-gold); background: color-mix(in srgb,var(--cx-accent-deep) 10%,transparent);
  border: 1px solid var(--dcs-gold-dim); border-radius: 7px; padding: 4px 10px; cursor: pointer; }
.divine-character-system .dcs-jlink:hover { background: color-mix(in srgb,var(--cx-accent-deep) 22%,transparent); }

/* mobile polish */
@media (max-width: 768px) {
  .divine-character-system .dcs-navtabs { overflow-x: auto; flex-wrap: nowrap; -webkit-overflow-scrolling: touch; padding-bottom: 4px; }
  .divine-character-system .dcs-navtab { white-space: nowrap; flex: 0 0 auto; }
  .divine-character-system .dcs-planets-toolbar { flex-direction: column; align-items: stretch; }
  .divine-character-system .dcs-viewtoggle { justify-content: stretch; }
  .divine-character-system .dcs-viewtoggle .dcs-vt { flex: 1; }
  .divine-character-system .dcs-row { flex-direction: column; }
  .divine-character-system .dcs-modal-foot { flex-wrap: wrap; }
  .divine-character-system .dcs-src-row { flex-wrap: wrap; }
  .divine-character-system .dcs-award-row { flex-direction: column; }
  .divine-character-system .dcs-attune-bar { gap: 8px; }
}

/* ============================================================================
 * Phase 12 — D&D Beyond / WotC PDF importer (optional)
 * ==========================================================================*/
.divine-character-system .dcs-pdf-overlay { z-index: 9700; } /* above the editor modal */
.divine-character-system .dcs-pdf-modal { width: min(720px, 100%); }
.divine-character-system .dcs-pdf-btn { font-size: 11px; padding: 6px 11px; }
.divine-character-system .dcs-pdf-drop { border: 1.5px dashed var(--dcs-gold-dim); border-radius: 12px; padding: 18px; text-align: center;
  background: color-mix(in srgb,var(--cx-accent-deep) 5%,transparent); margin: 12px 0; }
.divine-character-system .dcs-pdf-drop input[type="file"] { color: var(--dcs-text); font-family: 'EB Garamond', serif; }
.divine-character-system .dcs-pdf-hint { font-family: 'EB Garamond', serif; font-size: 12px; color: var(--dcs-dim); margin-top: 8px; }
.divine-character-system .dcs-pdf-error { font-family: 'EB Garamond', serif; font-size: 14px; color: var(--dcs-red);
  border: 1px solid var(--dcs-red); border-radius: 10px; padding: 12px 14px; margin-bottom: 10px; background: color-mix(in srgb,var(--cx-danger) 8%,transparent); }
.divine-character-system .dcs-pdf-sec { border: 1px solid var(--dcs-border); border-radius: 10px; padding: 12px 14px; margin-bottom: 10px; }
.divine-character-system .dcs-pdf-sec .dcs-check strong { font-family: 'Cinzel', serif; color: var(--dcs-gold); }
.divine-character-system .dcs-pdf-warn { font-family: 'EB Garamond', serif; font-size: 12.5px; color: var(--dcs-gold); margin: 6px 0; }
.divine-character-system .dcs-pdf-preview { font-family: 'EB Garamond', serif; font-size: 13px; color: var(--dcs-dim); margin: 6px 0;
  max-height: 110px; overflow-y: auto; word-break: break-word; }

/* Phase 13 — flattened-text fallback source + confidence banners */
.divine-character-system .dcs-pdf-source { font-family: 'Cinzel', serif; font-size: 12px; letter-spacing: .02em; color: var(--dcs-gold);
  border: 1px solid var(--dcs-gold-dim); border-radius: 8px; padding: 8px 12px; margin-bottom: 10px; background: color-mix(in srgb,var(--cx-accent-deep) 6%,transparent); }
.divine-character-system .dcs-pdf-source-text { color: var(--cx-accent); }
.divine-character-system .dcs-pdf-confidence { border: 1px solid var(--dcs-gold-dim); border-radius: 8px; padding: 8px 12px; margin-bottom: 10px;
  background: color-mix(in srgb,var(--cx-accent-deep) 5%,transparent); font-family: 'EB Garamond', serif; font-size: 12.5px; color: var(--dcs-gold); }
.divine-character-system .dcs-pdf-confidence div { padding: 2px 0; }

/* Combat Mode action roll buttons */
.divine-character-system .dcs-roll-actions { display: flex; flex-wrap: wrap; gap: 6px; margin: 7px 0 3px; }
.divine-character-system .dcs-roll-btn { border: 1px solid var(--dcs-gold-dim); border-radius: 7px; padding: 4px 8px;
  background: color-mix(in srgb,var(--cx-accent-deep) 8%,transparent); color: var(--dcs-gold); font-family: 'Cinzel', serif; font-size: 10px; letter-spacing: .03em; cursor: pointer; }
.divine-character-system .dcs-roll-btn:hover { background: color-mix(in srgb,var(--cx-accent-deep) 18%,transparent); }

/* ============================================================================
 * Deploy93/94 — 3D dice animation + divine natural-20 swirl
 * All classes are dcs-d3d* / dcs-dice3d* / dcs-crit* / dcs-max* — none collide
 * with the .dcs-die roller buttons or .dcs-die-face roll-log pips. CSS-3D only.
 * ==========================================================================*/
.dcs-dice3d-host { position: fixed; inset: 0; z-index: 2147483000; pointer-events: none;
  display: flex; align-items: center; justify-content: center; perspective: 900px; isolation: isolate; transform: translateZ(0); }

.dcs-dice3d-tray { display: flex; flex-wrap: wrap; gap: 18px; align-items: center; justify-content: center;
  max-width: 90vw; transform-style: preserve-3d; animation: dcsTrayIn .2s ease, dcsTrayOut .4s ease 1.15s forwards; }
@keyframes dcsTrayIn { from { opacity: 0; transform: scale(.7); } to { opacity: 1; transform: scale(1); } }
@keyframes dcsTrayOut { to { opacity: 0; transform: scale(.9) translateY(-20px); } }

.dcs-d3d-wrap { width: 84px; height: 84px; transform-style: preserve-3d; }
.dcs-d3d { width: 84px; height: 84px; position: relative; transform-style: preserve-3d;
  animation: dcsTumble 1.15s cubic-bezier(.2,.8,.25,1) forwards; }
/* Settle at full turns on every axis so the die ends FACING FORWARD
   (720 = 2 full turns; the front face is what shows the rolled value). */
@keyframes dcsTumble {
  0%   { transform: rotateX(0) rotateY(0) rotateZ(0) scale(.6); }
  60%  { transform: rotateX(560deg) rotateY(430deg) rotateZ(120deg) scale(1.12); }
  100% { transform: rotateX(720deg) rotateY(720deg) rotateZ(0) scale(1); }
}

/* Faceted "gem" token for d4/d8/d10/d12/d20. */
.dcs-d3d-gem { display: flex; flex-direction: column; align-items: center; justify-content: center;
  background: radial-gradient(circle at 38% 30%, var(--cx-surface), var(--cx-field) 75%);
  border: 2px solid var(--dcs-gold-dim); color: var(--dcs-gold);
  box-shadow: 0 0 22px color-mix(in srgb,var(--cx-accent-deep) 35%,transparent), inset 0 0 18px rgba(0,0,0,.6);
  font-family: 'Cinzel', serif; backface-visibility: hidden; }
.dcs-d3d-num { font-size: 30px; font-weight: 700; line-height: 1; }
.dcs-d3d-type { font-size: 10px; letter-spacing: .12em; opacity: .7; margin-top: 2px; }
.dcs-d3d-shape-d20 { clip-path: polygon(50% 0,93% 25%,93% 75%,50% 100%,7% 75%,7% 25%); }
.dcs-d3d-shape-d12 { clip-path: polygon(50% 0,90% 20%,100% 60%,75% 95%,25% 95%,0 60%,10% 20%); }
.dcs-d3d-shape-d10 { clip-path: polygon(50% 0,90% 38%,68% 100%,32% 100%,10% 38%); }
.dcs-d3d-shape-d8  { clip-path: polygon(50% 0,100% 50%,50% 100%,0 50%); }
.dcs-d3d-shape-d4  { clip-path: polygon(50% 4%,96% 96%,4% 96%); }
.dcs-d3d-shape-dN  { clip-path: polygon(50% 0,93% 25%,93% 75%,50% 100%,7% 75%,7% 25%); }

/* Real cube for d6 — rolled value sits on the FRONT face, which the tumble
   (ending at full turns) leaves facing the viewer. */
.dcs-d3d-cube { transform-style: preserve-3d; }
.dcs-d3d-cube .dcs-d3d-face { position: absolute; width: 84px; height: 84px; display: flex;
  align-items: center; justify-content: center; font-family: 'Cinzel', serif; font-size: 34px; font-weight: 700;
  color: var(--dcs-gold); background: radial-gradient(circle at 40% 32%, var(--cx-surface), var(--cx-field) 78%);
  border: 2px solid var(--dcs-gold-dim); box-shadow: inset 0 0 16px rgba(0,0,0,.6); backface-visibility: hidden; }
.dcs-d3d-cube .f-front  { transform: translateZ(42px); }
.dcs-d3d-cube .f-back   { transform: rotateY(180deg) translateZ(42px); }
.dcs-d3d-cube .f-right  { transform: rotateY(90deg) translateZ(42px); }
.dcs-d3d-cube .f-left   { transform: rotateY(-90deg) translateZ(42px); }
.dcs-d3d-cube .f-top    { transform: rotateX(90deg) translateZ(42px); }
.dcs-d3d-cube .f-bottom { transform: rotateX(-90deg) translateZ(42px); }

/* Max-value die glows gold. */
.dcs-d3d[data-max="1"].dcs-d3d-gem,
.dcs-d3d[data-max="1"] .f-front { border-color: var(--dcs-gold);
  box-shadow: 0 0 34px color-mix(in srgb,var(--cx-accent) 80%,transparent), inset 0 0 20px color-mix(in srgb,var(--cx-accent) 35%,transparent); color: var(--cx-accent-bright); }

.dcs-dice3d-total { width: 100%; text-align: center; margin-top: 6px; font-family: 'Cinzel', serif;
  font-size: 40px; color: var(--dcs-gold); text-shadow: 0 0 18px color-mix(in srgb,var(--cx-accent-deep) 60%,transparent);
  opacity: 0; animation: dcsTotalIn .4s ease .95s forwards; }
@keyframes dcsTotalIn { from { opacity: 0; transform: scale(.6); } to { opacity: 1; transform: scale(1); } }

/* ---- Divine natural-20 swirl (single d20 = 20 only) ---- */
.dcs-crit-swirl { position: fixed; inset: 0; z-index: 2147483020; pointer-events: none; overflow: hidden;
  animation: dcsCritFade .6s ease 3.55s forwards; }
.dcs-crit-swirl .dcs-crit-ring { position: absolute; top: 50%; left: 50%; width: 40vmax; height: 40vmax;
  margin: -20vmax 0 0 -20vmax; border-radius: 50%;
  border: 3px solid transparent; border-top-color: color-mix(in srgb,var(--cx-accent) 90%,transparent); border-right-color: color-mix(in srgb,var(--cx-accent) 40%,transparent);
  animation: dcsCritSpin 1.4s linear infinite, dcsCritGrow 1.8s ease forwards; }
.dcs-crit-swirl .dcs-crit-ring.r2 { width: 60vmax; height: 60vmax; margin: -30vmax 0 0 -30vmax;
  border-top-color: color-mix(in srgb,var(--cx-accent-bright) 70%,transparent); animation: dcsCritSpin 2s linear infinite reverse, dcsCritGrow 1.8s ease forwards; }
.dcs-crit-swirl .dcs-crit-burst { position: absolute; inset: 0;
  background: radial-gradient(circle at 50% 50%, color-mix(in srgb,var(--cx-accent) 42%,transparent), color-mix(in srgb,var(--cx-accent) 10%,transparent) 35%, transparent 60%);
  animation: dcsCritPulse 1.8s ease forwards; }
.dcs-crit-swirl .dcs-crit-word { position: absolute; top: 50%; left: 0; right: 0; text-align: center;
  transform: translateY(-50%); font-family: 'Cinzel', serif; font-size: clamp(38px, 11vw, 120px); font-weight: 700;
  letter-spacing: .1em; color: var(--cx-accent-bright); text-shadow: 0 0 30px color-mix(in srgb,var(--cx-accent) 90%,transparent), 0 0 60px color-mix(in srgb,var(--cx-accent) 50%,transparent);
  animation: dcsCritWord 1.8s cubic-bezier(.2,.9,.2,1) forwards; }
@keyframes dcsCritSpin { to { transform: rotate(360deg); } }
@keyframes dcsCritGrow { from { opacity: 0; transform: scale(.4) rotate(0); } 30% { opacity: 1; } to { opacity: .9; transform: scale(1) rotate(40deg); } }
@keyframes dcsCritPulse { 0% { opacity: 0; } 30% { opacity: 1; } 100% { opacity: 0; } }
@keyframes dcsCritWord { 0% { opacity: 0; transform: translateY(-50%) scale(.6); } 35% { opacity: 1; transform: translateY(-50%) scale(1.08); } 80% { opacity: 1; transform: translateY(-50%) scale(1); } 100% { opacity: 0; transform: translateY(-50%) scale(1.02); } }
@keyframes dcsCritFade { to { opacity: 0; } }

/* ---- Subtle MAX ROLL flash (any non-nat20 die hitting its own max) ---- */
.dcs-max-flash { position: fixed; inset: 0; z-index: 2147483010; pointer-events: none; display: flex;
  align-items: center; justify-content: center; }
.dcs-max-flash .dcs-max-word { font-family: 'Cinzel', serif; font-size: clamp(24px, 6vw, 58px); font-weight: 700;
  letter-spacing: .14em; color: var(--cx-accent-bright); text-shadow: 0 0 20px color-mix(in srgb,var(--cx-accent) 70%,transparent);
  animation: dcsMaxWord 3s ease forwards; }
@keyframes dcsMaxWord { 0% { opacity: 0; transform: translateY(14px) scale(.9); } 30% { opacity: 1; transform: translateY(0) scale(1); } 75% { opacity: 1; } 100% { opacity: 0; transform: translateY(-10px) scale(1); } }

/* Respect reduced-motion: keep the result readable, drop the spin. */
@media (prefers-reduced-motion: reduce) {
  .dcs-d3d { animation: dcsTrayIn .2s ease forwards; }
  .dcs-crit-swirl .dcs-crit-ring { animation: dcsCritGrow 1.2s ease forwards; }
}

/* Deploy97 — screen-traveling dice throw. The dice now enter from off-screen,
   arc across the viewport, bounce, roll, and settle on the real result. */
.dcs-dice3d-host { align-items: stretch; justify-content: stretch; overflow: hidden; }
.dcs-dice3d-tray.dcs-dice3d-arena {
  position: fixed;
  inset: 0;
  z-index: 2147483001;
  width: 100vw;
  height: 100vh;
  max-width: none;
  display: block;
  transform-style: preserve-3d;
  animation: dcsArenaOut .55s ease 4.05s forwards;
}
.dcs-dice3d-arena .dcs-d3d-wrap {
  position: absolute;
  left: 0;
  top: 0;
  width: clamp(58px, 9vw, 84px);
  height: clamp(58px, 9vw, 84px);
  transform-style: preserve-3d;
  animation: dcsDieAcross var(--dur, 1650ms) cubic-bezier(.12,.72,.18,1) var(--delay, 0ms) forwards;
  opacity: 0;
  filter: drop-shadow(0 18px 20px rgba(0,0,0,.5));
}
.dcs-dice3d-arena .dcs-d3d {
  width: 100%;
  height: 100%;
  animation: dcsTumbleAcross var(--dur, 1650ms) cubic-bezier(.08,.76,.2,1) var(--delay, 0ms) forwards;
}
.dcs-dice3d-arena .dcs-d3d-cube .dcs-d3d-face {
  width: 100%;
  height: 100%;
  font-size: clamp(24px, 4vw, 34px);
}
.dcs-dice3d-arena .dcs-d3d-cube .f-front  { transform: translateZ(calc(clamp(58px, 9vw, 84px) / 2)); }
.dcs-dice3d-arena .dcs-d3d-cube .f-back   { transform: rotateY(180deg) translateZ(calc(clamp(58px, 9vw, 84px) / 2)); }
.dcs-dice3d-arena .dcs-d3d-cube .f-right  { transform: rotateY(90deg) translateZ(calc(clamp(58px, 9vw, 84px) / 2)); }
.dcs-dice3d-arena .dcs-d3d-cube .f-left   { transform: rotateY(-90deg) translateZ(calc(clamp(58px, 9vw, 84px) / 2)); }
.dcs-dice3d-arena .dcs-d3d-cube .f-top    { transform: rotateX(90deg) translateZ(calc(clamp(58px, 9vw, 84px) / 2)); }
.dcs-dice3d-arena .dcs-d3d-cube .f-bottom { transform: rotateX(-90deg) translateZ(calc(clamp(58px, 9vw, 84px) / 2)); }
.dcs-dice3d-arena .dcs-dice3d-total {
  position: fixed;
  left: 0;
  right: 0;
  bottom: max(28px, env(safe-area-inset-bottom));
  width: auto;
  margin: 0;
  font-size: clamp(38px, 10vw, 78px);
  animation: dcsTotalThrowIn .35s ease 1.35s forwards;
}
@keyframes dcsDieAcross {
  0% { opacity: 0; transform: translate3d(var(--sx), var(--sy), -80px) scale(.66); }
  8% { opacity: 1; }
  42% { opacity: 1; transform: translate3d(var(--mx), var(--my), 110px) scale(1.14); }
  70% { opacity: 1; transform: translate3d(calc(var(--ex) - 18px), calc(var(--ey) - 36px), 28px) scale(1.02); }
  84% { opacity: 1; transform: translate3d(calc(var(--ex) + 10px), calc(var(--ey) + 7px), 0) scale(.96); }
  92% { opacity: 1; transform: translate3d(calc(var(--ex) - 5px), calc(var(--ey) - 10px), 0) scale(1); }
  100% { opacity: 1; transform: translate3d(var(--ex), var(--ey), 0) scale(1); }
}
@keyframes dcsTumbleAcross {
  0%   { transform: rotateX(0) rotateY(0) rotateZ(0); }
  42%  { transform: rotateX(calc(var(--spin, 1) * 620deg)) rotateY(calc(var(--spin, 1) * 740deg)) rotateZ(calc(var(--spin, 1) * 260deg)); }
  70%  { transform: rotateX(calc(var(--spin, 1) * 1080deg)) rotateY(calc(var(--spin, 1) * 920deg)) rotateZ(calc(var(--spin, 1) * 420deg)); }
  84%  { transform: rotateX(calc(var(--spin, 1) * 1320deg)) rotateY(calc(var(--spin, 1) * 1200deg)) rotateZ(calc(var(--spin, 1) * 540deg)); }
  92%  { transform: rotateX(calc(var(--spin, 1) * 1420deg)) rotateY(calc(var(--spin, 1) * 1340deg)) rotateZ(calc(var(--spin, 1) * 660deg)); }
  100% { transform: rotateX(1440deg) rotateY(1440deg) rotateZ(720deg); }
}
@keyframes dcsTotalThrowIn { from { opacity: 0; transform: translateY(18px) scale(.82); } to { opacity: 1; transform: translateY(0) scale(1); } }
@keyframes dcsArenaOut { to { opacity: 0; } }
@media (max-width: 640px) {
  .dcs-dice3d-arena .dcs-d3d-wrap { width: 62px; height: 62px; }
  .dcs-dice3d-arena .dcs-d3d-num { font-size: 23px; }
  .dcs-dice3d-arena .dcs-d3d-type { font-size: 8px; }
}
@media (prefers-reduced-motion: reduce) {
  .dcs-dice3d-tray.dcs-dice3d-arena { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 14px; animation: dcsArenaOut .45s ease 3.4s forwards; }
  .dcs-dice3d-arena .dcs-d3d-wrap { position: static; opacity: 1; animation: none; }
  .dcs-dice3d-arena .dcs-d3d { animation: none; }
}

/* ---- Combat customization restore (deploy99) ---- */
.divine-character-system .dcs-cm-overlay {
  background-color: var(--dcs-cm-bg, var(--cx-field));
  background-image: radial-gradient(circle at 50% 0%, color-mix(in srgb, var(--dcs-cm-bg, var(--cx-field)) 78%, var(--cx-accent) 10%), color-mix(in srgb,var(--cx-bg) 99%,transparent));
}
/* Deploy110 — Panel color should affect only the actual cards/panels,
   not the larger section/field containers that hold those cards. */
.divine-character-system .dcs-cm-vital,
.divine-character-system .dcs-cm-rolltray,
.divine-character-system .dcs-roll-card,
.divine-character-system #dcs-cm-spelllist .dcs-spell,
.divine-character-system #dcs-cm-reslist .dcs-res,
.divine-character-system .dcs-feat,
.divine-character-system .dcs-pinned,
.divine-character-system .dcs-abil-card,
.divine-character-system .dcs-skill-row,
.divine-character-system .dcs-cm-custom-panel {
  background-color: color-mix(in srgb, var(--dcs-cm-panel, var(--cx-surface)) 82%, transparent);
}
.divine-character-system .dcs-cm .dcs-abil-card {
  background-image: linear-gradient(160deg, color-mix(in srgb,var(--cx-text-strong) 4.5%,transparent), rgba(0,0,0,.14));
}
.divine-character-system .dcs-cm .dcs-abil-card:hover,
.divine-character-system .dcs-cm .dcs-skill-row:hover {
  background-color: color-mix(in srgb, var(--dcs-cm-panel, var(--cx-surface)) 72%, var(--dcs-gold, var(--cx-accent)));
}
.divine-character-system .dcs-cm-section {
  background-color: transparent;
}
.divine-character-system .dcs-cm-hp {
  background-color: color-mix(in srgb, var(--dcs-cm-panel, var(--cx-surface)) 72%, transparent);
}
.divine-character-system .dcs-cm-hpstyle-gold .dcs-cm-hp-val,
.divine-character-system .dcs-cm-hpstyle-gold .dcs-cm-hpmini b { color: var(--dcs-gold); }
.divine-character-system .dcs-cm-hpstyle-player .dcs-cm-hp-val,
.divine-character-system .dcs-cm-hpstyle-player .dcs-cm-hpmini b { color: var(--dcs-gold); }
.divine-character-system .dcs-cm-dicetheme-gold .dcs-die-face,
.divine-character-system .dcs-cm-dicetheme-gold .dcs-die,
.divine-character-system .dcs-cm-dicetheme-player .dcs-die-face,
.divine-character-system .dcs-cm-dicetheme-player .dcs-die { border-color: var(--dcs-gold); color: var(--dcs-gold); }
.divine-character-system .dcs-cm-text-small { font-size: 14px; }
.divine-character-system .dcs-cm-text-normal { font-size: 16px; }
.divine-character-system .dcs-cm-text-large { font-size: 18px; }
.divine-character-system .dcs-cm-density-compact .dcs-cm-left > *,
.divine-character-system .dcs-cm-density-compact .dcs-cm-section { margin-bottom: 8px; }
.divine-character-system .dcs-cm-density-compact .dcs-cm-field,
.divine-character-system .dcs-cm-density-compact .dcs-cm-section,
.divine-character-system .dcs-cm-density-compact .dcs-cm-vital,
.divine-character-system .dcs-cm-density-compact .dcs-cm-hp { padding: 8px; }
.divine-character-system .dcs-cm-density-spacious .dcs-cm-left > *,
.divine-character-system .dcs-cm-density-spacious .dcs-cm-section { margin-bottom: 20px; }
.divine-character-system .dcs-cm-density-spacious .dcs-cm-field,
.divine-character-system .dcs-cm-density-spacious .dcs-cm-section,
.divine-character-system .dcs-cm-density-spacious .dcs-cm-vital,
.divine-character-system .dcs-cm-density-spacious .dcs-cm-hp { padding: 16px; }
.divine-character-system .dcs-cm-buttons-sharp button,
.divine-character-system .dcs-cm-buttons-sharp .dcs-btn,
.divine-character-system .dcs-cm-buttons-sharp .dcs-input { border-radius: 2px !important; }
.divine-character-system .dcs-cm-buttons-rounded button,
.divine-character-system .dcs-cm-buttons-rounded .dcs-btn,
.divine-character-system .dcs-cm-buttons-rounded .dcs-input { border-radius: 10px !important; }
.divine-character-system .dcs-cm-buttons-pill button,
.divine-character-system .dcs-cm-buttons-pill .dcs-btn,
.divine-character-system .dcs-cm-buttons-pill .dcs-input { border-radius: 999px !important; }
.divine-character-system .dcs-cm-custom-panel { margin-top: 18px; padding: 14px; border: 1px solid var(--dcs-border); border-radius: 14px; }
.divine-character-system .dcs-cm-custom-grid { display: grid; grid-template-columns: repeat(5, minmax(140px, 1fr)); gap: 10px; margin-top: 10px; }
.divine-character-system .dcs-cm-color-grid { grid-template-columns: repeat(4, minmax(120px, 1fr)); }
.divine-character-system .dcs-cm-custom-control { display: grid; gap: 5px; font-family: 'EB Garamond', serif; color: var(--dcs-readable); }
.divine-character-system .dcs-cm-custom-control span,
.divine-character-system .dcs-cm-section-toggle span { font-family: 'Cinzel', serif; font-size: 10px; letter-spacing: .06em; text-transform: uppercase; color: var(--dcs-readable-dim); }
.divine-character-system .dcs-cm-color { width: 100%; min-height: 38px; border: 1px solid var(--dcs-border); background: rgba(0,0,0,.25); cursor: pointer; }
.divine-character-system .dcs-cm-wallpaper-box { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; align-items: end; margin-top: 12px; }
.divine-character-system .dcs-cm-toggle-grid { display: grid; grid-template-columns: repeat(5, minmax(130px, 1fr)); gap: 8px; margin-top: 12px; }
.divine-character-system .dcs-cm-section-toggle { display: flex; align-items: center; gap: 7px; padding: 8px 9px; border: 1px solid var(--dcs-border); border-radius: 10px; background: rgba(0,0,0,.18); cursor: pointer; }
.divine-character-system .dcs-cm-section-toggle input { accent-color: var(--dcs-gold); }
.divine-character-system .dcs-cm-custom-actions { margin-top: 12px; display: flex; justify-content: flex-end; }
@media (max-width: 900px) {
  .divine-character-system .dcs-cm-custom-grid,
  .divine-character-system .dcs-cm-color-grid,
  .divine-character-system .dcs-cm-toggle-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .divine-character-system .dcs-cm-wallpaper-box { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
  .divine-character-system .dcs-cm-custom-grid,
  .divine-character-system .dcs-cm-color-grid,
  .divine-character-system .dcs-cm-toggle-grid { grid-template-columns: 1fr; }
}

/* Deploy100 — make non-d6 dice roll reliably too.
   The d6 is a true cube with visible faces, but the other dice were flat
   faceted tokens. Rotating those flat tokens through full X/Y flips made them
   vanish edge-on/back-face during the throw, which made it look like only d6
   was fixed. Keep all non-d6 dice visibly face-forward while still spinning,
   bouncing, and settling on the rolled value. */
.dcs-dice3d-arena .dcs-d3d-gem {
  backface-visibility: visible;
  transform-origin: 50% 50%;
  animation: dcsGemTumbleAcross var(--dur, 1650ms) cubic-bezier(.08,.76,.2,1) var(--delay, 0ms) forwards;
}
.dcs-dice3d-arena .dcs-d3d-gem::before {
  content: "";
  position: absolute;
  inset: 6px;
  clip-path: inherit;
  border: 1px solid color-mix(in srgb,var(--cx-accent) 22%,transparent);
  background: linear-gradient(135deg, color-mix(in srgb,var(--cx-accent) 16%,transparent), transparent 42%, rgba(0,0,0,.22));
  pointer-events: none;
}
.dcs-dice3d-arena .dcs-d3d-gem .dcs-d3d-num,
.dcs-dice3d-arena .dcs-d3d-gem .dcs-d3d-type {
  position: relative;
  z-index: 1;
}
@keyframes dcsGemTumbleAcross {
  0%   { transform: rotateX(24deg) rotateY(-18deg) rotateZ(0deg) scale(.74); }
  28%  { transform: rotateX(-22deg) rotateY(20deg) rotateZ(calc(var(--spin, 1) * 260deg)) scale(1.12); }
  52%  { transform: rotateX(18deg) rotateY(-16deg) rotateZ(calc(var(--spin, 1) * 560deg)) scale(1.04); }
  72%  { transform: rotateX(-14deg) rotateY(12deg) rotateZ(calc(var(--spin, 1) * 790deg)) scale(.98); }
  88%  { transform: rotateX(8deg) rotateY(-7deg) rotateZ(calc(var(--spin, 1) * 910deg)) scale(1.02); }
  100% { transform: rotateX(0deg) rotateY(0deg) rotateZ(calc(var(--spin, 1) * 1080deg)) scale(1); }
}
@media (prefers-reduced-motion: reduce) {
  .dcs-dice3d-arena .dcs-d3d-gem { animation: none; }
}

/* Deploy101 — make every non-d6 die feel like it is actually rolling.
   The gem dice now flash temporary face values during flight and reveal the
   true rolled value only when the die settles. */
.dcs-dice3d-arena .dcs-d3d-gem { overflow: hidden; }
.dcs-dice3d-arena .dcs-d3d-gem .dcs-d3d-finalnum {
  opacity: 0;
  animation: dcsFinalFaceReveal var(--dur, 1650ms) steps(1, end) var(--delay, 0ms) forwards;
}
.dcs-dice3d-arena .dcs-d3d-rollnum {
  position: absolute;
  left: 50%;
  top: 43%;
  z-index: 2;
  opacity: 0;
  transform: translate(-50%, -50%) scale(.92);
  font-size: 30px;
  font-weight: 700;
  line-height: 1;
  color: inherit;
  text-shadow: 0 2px 10px rgba(0,0,0,.55);
  pointer-events: none;
}
.dcs-dice3d-arena .dcs-d3d-rollnum.rn1 { animation: dcsRollFace1 var(--dur, 1650ms) linear var(--delay, 0ms) forwards; }
.dcs-dice3d-arena .dcs-d3d-rollnum.rn2 { animation: dcsRollFace2 var(--dur, 1650ms) linear var(--delay, 0ms) forwards; }
.dcs-dice3d-arena .dcs-d3d-rollnum.rn3 { animation: dcsRollFace3 var(--dur, 1650ms) linear var(--delay, 0ms) forwards; }
.dcs-dice3d-arena .dcs-d3d-rollnum.rn4 { animation: dcsRollFace4 var(--dur, 1650ms) linear var(--delay, 0ms) forwards; }
.dcs-dice3d-arena .dcs-d3d-rollnum.rn5 { animation: dcsRollFace5 var(--dur, 1650ms) linear var(--delay, 0ms) forwards; }
@keyframes dcsRollFace1 { 0%,17% { opacity: 1; transform: translate(-50%, -50%) scale(.92) rotate(-8deg); } 18%,100% { opacity: 0; } }
@keyframes dcsRollFace2 { 0%,17% { opacity: 0; } 18%,34% { opacity: 1; transform: translate(-50%, -50%) scale(1.08) rotate(10deg); } 35%,100% { opacity: 0; } }
@keyframes dcsRollFace3 { 0%,34% { opacity: 0; } 35%,51% { opacity: 1; transform: translate(-50%, -50%) scale(.98) rotate(-14deg); } 52%,100% { opacity: 0; } }
@keyframes dcsRollFace4 { 0%,51% { opacity: 0; } 52%,68% { opacity: 1; transform: translate(-50%, -50%) scale(1.12) rotate(12deg); } 69%,100% { opacity: 0; } }
@keyframes dcsRollFace5 { 0%,68% { opacity: 0; } 69%,84% { opacity: 1; transform: translate(-50%, -50%) scale(1) rotate(-6deg); } 85%,100% { opacity: 0; } }
@keyframes dcsFinalFaceReveal { 0%,84% { opacity: 0; } 85%,100% { opacity: 1; } }
@media (max-width: 640px) {
  .dcs-dice3d-arena .dcs-d3d-rollnum { font-size: 23px; }
}
@media (prefers-reduced-motion: reduce) {
  .dcs-dice3d-arena .dcs-d3d-gem .dcs-d3d-finalnum { opacity: 1; animation: none; }
  .dcs-dice3d-arena .dcs-d3d-rollnum { display: none; }
}

/* Deploy102 — physical faceted rolling for every non-d6 die.
   Previous versions made only the d6 feel like a real object because the other
   dice were flat tokens. These rules turn d4/d8/d10/d12/d20/d100 into a
   multi-face 3D body with temporary numbered faces during the tumble and the
   final result revealed only as the front face settles. */
.dcs-dice3d-arena .dcs-d3d-poly {
  position: relative;
  transform-style: preserve-3d;
  animation: dcsPolyTumbleAcross var(--dur, 1650ms) cubic-bezier(.08,.76,.2,1) var(--delay, 0ms) forwards !important;
  transform-origin: 50% 50%;
}
.dcs-dice3d-arena .dcs-d3d-poly .dcs-d3d-pface {
  position: absolute;
  inset: 6px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: 'Cinzel', serif;
  color: var(--dcs-gold);
  font-size: clamp(20px, 3.7vw, 32px);
  font-weight: 800;
  text-shadow: 0 2px 12px rgba(0,0,0,.75);
  background: radial-gradient(circle at 36% 28%, var(--cx-surface) 0%, var(--cx-surface) 48%, var(--cx-bg) 100%);
  border: 2px solid var(--dcs-gold-dim);
  box-shadow: inset 0 0 18px rgba(0,0,0,.66), 0 0 14px color-mix(in srgb,var(--cx-accent-deep) 18%,transparent);
  backface-visibility: hidden;
  transform-style: preserve-3d;
}
.dcs-dice3d-arena .dcs-d3d-poly .dcs-d3d-pface::after {
  content: "";
  position: absolute;
  inset: 4px;
  clip-path: inherit;
  border: 1px solid color-mix(in srgb,var(--cx-accent) 22%,transparent);
  background: linear-gradient(145deg, color-mix(in srgb,var(--cx-accent-bright) 18%,transparent), transparent 42%, rgba(0,0,0,.28));
  pointer-events: none;
}
.dcs-dice3d-arena .dcs-d3d-poly .dcs-d3d-pface b { position: relative; z-index: 2; }
.dcs-dice3d-arena .dcs-d3d-poly-d4 .dcs-d3d-pface { clip-path: polygon(50% 3%, 97% 97%, 3% 97%); }
.dcs-dice3d-arena .dcs-d3d-poly-d8 .dcs-d3d-pface { clip-path: polygon(50% 0, 100% 50%, 50% 100%, 0 50%); }
.dcs-dice3d-arena .dcs-d3d-poly-d10 .dcs-d3d-pface { clip-path: polygon(50% 0, 91% 35%, 70% 100%, 30% 100%, 9% 35%); }
.dcs-dice3d-arena .dcs-d3d-poly-d12 .dcs-d3d-pface { clip-path: polygon(50% 0, 89% 20%, 100% 61%, 74% 96%, 26% 96%, 0 61%, 11% 20%); }
.dcs-dice3d-arena .dcs-d3d-poly-d20 .dcs-d3d-pface,
.dcs-dice3d-arena .dcs-d3d-poly-dN .dcs-d3d-pface { clip-path: polygon(50% 0, 93% 25%, 93% 75%, 50% 100%, 7% 75%, 7% 25%); }

.dcs-dice3d-arena .dcs-d3d-poly .pf-front { transform: translateZ(calc(clamp(58px, 9vw, 84px) * .43)); }
.dcs-dice3d-arena .dcs-d3d-poly .pf1  { transform: rotateY(58deg) rotateZ(18deg) translateZ(calc(clamp(58px, 9vw, 84px) * .43)); }
.dcs-dice3d-arena .dcs-d3d-poly .pf2  { transform: rotateY(-58deg) rotateZ(-18deg) translateZ(calc(clamp(58px, 9vw, 84px) * .43)); }
.dcs-dice3d-arena .dcs-d3d-poly .pf3  { transform: rotateX(58deg) rotateZ(44deg) translateZ(calc(clamp(58px, 9vw, 84px) * .43)); }
.dcs-dice3d-arena .dcs-d3d-poly .pf4  { transform: rotateX(-58deg) rotateZ(-44deg) translateZ(calc(clamp(58px, 9vw, 84px) * .43)); }
.dcs-dice3d-arena .dcs-d3d-poly .pf5  { transform: rotateY(112deg) rotateX(16deg) translateZ(calc(clamp(58px, 9vw, 84px) * .43)); }
.dcs-dice3d-arena .dcs-d3d-poly .pf6  { transform: rotateY(-112deg) rotateX(-16deg) translateZ(calc(clamp(58px, 9vw, 84px) * .43)); }
.dcs-dice3d-arena .dcs-d3d-poly .pf7  { transform: rotateX(112deg) rotateY(20deg) translateZ(calc(clamp(58px, 9vw, 84px) * .43)); }
.dcs-dice3d-arena .dcs-d3d-poly .pf8  { transform: rotateX(-112deg) rotateY(-20deg) translateZ(calc(clamp(58px, 9vw, 84px) * .43)); }
.dcs-dice3d-arena .dcs-d3d-poly .pf9  { transform: rotateY(146deg) rotateZ(62deg) translateZ(calc(clamp(58px, 9vw, 84px) * .43)); }
.dcs-dice3d-arena .dcs-d3d-poly .pf10 { transform: rotateY(-146deg) rotateZ(-62deg) translateZ(calc(clamp(58px, 9vw, 84px) * .43)); }
.dcs-dice3d-arena .dcs-d3d-poly .pf11 { transform: rotateX(146deg) rotateZ(80deg) translateZ(calc(clamp(58px, 9vw, 84px) * .43)); }
.dcs-dice3d-arena .dcs-d3d-poly .pf12 { transform: rotateX(-146deg) rotateZ(-80deg) translateZ(calc(clamp(58px, 9vw, 84px) * .43)); }
.dcs-dice3d-arena .dcs-d3d-poly .pf13 { transform: rotateY(180deg) rotateZ(30deg) translateZ(calc(clamp(58px, 9vw, 84px) * .43)); }
.dcs-dice3d-arena .dcs-d3d-poly .pf14 { transform: rotateX(180deg) rotateZ(-30deg) translateZ(calc(clamp(58px, 9vw, 84px) * .43)); }

.dcs-dice3d-arena .dcs-d3d-poly .pf-front b {
  opacity: 0;
  animation: dcsPolyFinalReveal var(--dur, 1650ms) steps(1, end) var(--delay, 0ms) forwards;
}
.dcs-dice3d-arena .dcs-d3d-poly .dcs-d3d-polytype {
  position: absolute;
  left: 0;
  right: 0;
  bottom: -16px;
  z-index: 5;
  text-align: center;
  opacity: 0;
  transform: translateZ(calc(clamp(58px, 9vw, 84px) * .46));
  animation: dcsPolyTypeReveal var(--dur, 1650ms) steps(1, end) var(--delay, 0ms) forwards;
}
.dcs-dice3d-arena .dcs-d3d-poly[data-max="1"] .pf-front {
  border-color: var(--dcs-gold);
  box-shadow: 0 0 34px color-mix(in srgb,var(--cx-accent) 78%,transparent), inset 0 0 22px color-mix(in srgb,var(--cx-accent) 32%,transparent);
  color: var(--cx-accent-bright);
}
@keyframes dcsPolyTumbleAcross {
  0%   { transform: rotateX(38deg) rotateY(-34deg) rotateZ(0deg) scale(.68); }
  18%  { transform: rotateX(calc(var(--spin, 1) * 245deg)) rotateY(calc(var(--spin, 1) * -310deg)) rotateZ(calc(var(--spin, 1) * 150deg)) scale(.98); }
  38%  { transform: rotateX(calc(var(--spin, 1) * 580deg)) rotateY(calc(var(--spin, 1) * 470deg)) rotateZ(calc(var(--spin, 1) * 340deg)) scale(1.14); }
  58%  { transform: rotateX(calc(var(--spin, 1) * 920deg)) rotateY(calc(var(--spin, 1) * -760deg)) rotateZ(calc(var(--spin, 1) * 560deg)) scale(1.02); }
  74%  { transform: rotateX(calc(var(--spin, 1) * 1210deg)) rotateY(calc(var(--spin, 1) * 1030deg)) rotateZ(calc(var(--spin, 1) * 735deg)) scale(.94); }
  88%  { transform: rotateX(calc(var(--spin, 1) * 1395deg)) rotateY(calc(var(--spin, 1) * -1260deg)) rotateZ(calc(var(--spin, 1) * 865deg)) scale(1.02); }
  100% { transform: rotateX(1440deg) rotateY(1440deg) rotateZ(720deg) scale(1); }
}
@keyframes dcsPolyFinalReveal { 0%,84% { opacity: 0; } 85%,100% { opacity: 1; } }
@keyframes dcsPolyTypeReveal { 0%,84% { opacity: 0; } 85%,100% { opacity: .72; } }
@media (prefers-reduced-motion: reduce) {
  .dcs-dice3d-arena .dcs-d3d-poly { animation: none !important; }
  .dcs-dice3d-arena .dcs-d3d-poly .pf-front b,
  .dcs-dice3d-arena .dcs-d3d-poly .dcs-d3d-polytype { opacity: 1; animation: none; }
}

/* Deploy103 — canvas-based physical polyhedral dice animation.
   Uses one foreground canvas so d4/d8/d10/d12/d20/d100 animate as tumbling
   faceted objects instead of flat pre-rolled badges. */
.dcs-dice3d-tray.dcs-dice3d-canvas-arena {
  position: fixed;
  inset: 0;
  z-index: 2147483001;
  width: 100vw;
  height: 100vh;
  max-width: none;
  display: block;
  pointer-events: none;
  opacity: 1;
  animation: dcsCanvasDiceArenaOut .7s ease 4.45s forwards;
}
.dcs-dice3d-canvas-arena .dcs-dice3d-canvas {
  position: fixed;
  inset: 0;
  width: 100vw;
  height: 100vh;
  display: block;
  pointer-events: none;
}
.dcs-dice3d-canvas-arena .dcs-dice3d-total {
  position: fixed;
  left: 0;
  right: 0;
  bottom: max(28px, env(safe-area-inset-bottom));
  width: auto;
  margin: 0;
  font-size: clamp(38px, 10vw, 78px);
  opacity: 0;
  animation: dcsTotalThrowIn .35s ease 1.85s forwards;
}
@keyframes dcsCanvasDiceArenaOut { to { opacity: 0; } }
@media (prefers-reduced-motion: reduce) {
  .dcs-dice3d-canvas-arena .dcs-dice3d-total { opacity: 1; animation: none; }
}

/* ---- Deploy104: WebGL true-3D dice tray ---- */
.dcs-dice3d-tray.dcs-dice3d-webgl { position: fixed; inset: 0; display: block; max-width: none;
  animation: dcsTrayIn .2s ease; }
.dcs-dice3d-webgl canvas.dcs-dice3d-canvas { position: absolute; inset: 0; }
.dcs-dice3d-total-webgl { position: absolute; left: 0; right: 0; bottom: 16vh; margin: 0; }

/* ---- Deploy106: Dice Style panel ---- */
.dcs-cm-dicestyle { margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--dcs-border); }
.dcs-dice-presets { display: flex; flex-wrap: wrap; gap: 8px; margin: 10px 0 12px; }
.dcs-dice-preset { font-family: 'Cinzel', serif; font-size: 11px; letter-spacing: .05em;
  padding: 8px 12px; border: 2px solid; border-radius: 9px; cursor: pointer;
  min-height: 36px; box-shadow: inset 0 0 12px rgba(0,0,0,.45); }
.dcs-dice-preset:hover { filter: brightness(1.25); }
.dcs-dice-texrow { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 12px 0 4px; }
.dcs-dice-texlabel { font-family: 'Cinzel', serif; font-size: 11px; letter-spacing: .14em;
  text-transform: uppercase; color: var(--dcs-readable-dim, var(--cx-accent)); margin-right: 4px; }
.dcs-dice-tex { font-family: 'EB Garamond', serif; font-size: 13px; padding: 6px 12px; min-height: 32px;
  background: color-mix(in srgb,var(--cx-accent-deep) 6%,transparent); color: var(--dcs-readable, var(--cx-accent-bright));
  border: 1px solid var(--dcs-border); border-radius: 8px; cursor: pointer; }
.dcs-dice-tex.on { border-color: var(--dcs-gold); color: var(--dcs-gold); background: color-mix(in srgb,var(--cx-accent-deep) 16%,transparent); }

/* Image-texture chips: show the texture as a thumbnail with a readable label. */
.dcs-dice-tex-img { position: relative; background-size: cover; background-position: center;
  color: var(--cx-text-strong) !important; border-color: color-mix(in srgb,var(--cx-text-strong) 25%,transparent) !important;
  text-shadow: 0 1px 3px #000, 0 0 6px #000; min-width: 84px; }
.dcs-dice-tex-img.on { border-color: var(--dcs-gold) !important; box-shadow: 0 0 0 2px color-mix(in srgb,var(--cx-accent-deep) 50%,transparent); }

/* Dice texture upload button */
.dcs-dice-uploadrow { display: flex; align-items: center; gap: 10px; margin-top: 10px; }
.dcs-dice-upload { display: inline-flex; align-items: center; gap: 6px; cursor: pointer;
  font-family: 'EB Garamond', serif; font-size: 13px; padding: 8px 14px; min-height: 36px;
  color: var(--dcs-gold); background: color-mix(in srgb,var(--cx-accent-deep) 10%,transparent); border: 1px dashed var(--dcs-gold-dim);
  border-radius: 8px; }
.dcs-dice-upload:hover { background: color-mix(in srgb,var(--cx-accent-deep) 18%,transparent); }
.dcs-dice-upstatus { font-size: 12px; color: var(--dcs-readable-dim, var(--cx-accent)); }

/* Deploy113: restore the mobile Combat Mode tab bar after later global rules. */
@media (max-width: 768px) {
  body #dcs-cm-tabhost.divine-character-system .dcs-cm-tabbar,
  .divine-character-system .dcs-cm-tabbar {
    display: flex !important;
  }
  .divine-character-system .dcs-cm-hpmini {
    display: inline-flex !important;
  }
  .divine-character-system .dcs-cm {
    padding-bottom: calc(86px + env(safe-area-inset-bottom)) !important;
  }
}
@media (min-width: 769px) {
  body #dcs-cm-tabhost.divine-character-system .dcs-cm-tabbar {
    display: none !important;
  }
}

/* ── D&D Beyond importer ── */
.dcs-ddb-inp{width:auto;min-width:36px;background:rgba(0,0,0,.35);border:1px solid color-mix(in srgb,var(--cx-accent) 35%,transparent);border-radius:4px;color:var(--gold,var(--cx-accent));padding:2px 6px;font:inherit;margin:0 8px 4px 2px}
.dcs-ddb-row{padding:1px 0}
.dcs-ddb-row .dcs-dim{opacity:.55;font-size:.85em}
.dcs-ddb-fallback{margin-top:10px}
.dcs-ddb-fallback summary{cursor:pointer;opacity:.75}
.dcs-ddb-fallback textarea{width:100%;margin-top:6px;background:rgba(0,0,0,.35);border:1px solid color-mix(in srgb,var(--cx-accent) 30%,transparent);border-radius:6px;color:inherit;padding:8px;font-family:monospace;font-size:.8em}
#dcs-ddb-url{width:100%;background:rgba(0,0,0,.35);border:1px solid color-mix(in srgb,var(--cx-accent) 35%,transparent);border-radius:6px;color:inherit;padding:8px 10px;margin:6px 0}
.dcs-field span{display:block;font-size:.85em;opacity:.75;margin-top:8px}

/* ============================================================================
 * deploy132 — feature & fix pass
 * (1) Handcrafted checkbox controls  (2) portraits  (3) prepared-state UI
 * (4) casting-time & components editor  (5) Short Rest dialog  (6) Backstory
 * (7) readability: metadata raised to a 12–13.5px baseline, muted ink
 *     brightened while staying visually secondary. Same brass/parchment
 *     palette — no new visual language.
 * ==========================================================================*/

/* ---- readability: brighter (but still secondary) muted ink ---- */
.divine-character-system { --dcs-dim: var(--cx-text-soft); --dcs-readable-dim: var(--cx-accent-bright); }

/* ---- readability: raise small metadata to a comfortable baseline ---- */
.divine-character-system .dcs-feat-meta { font-size: 13px; }
.divine-character-system .dcs-spell-tag { font-size: 11.5px; }
.divine-character-system .dcs-feat-tag { font-size: 11px; }
.divine-character-system .dcs-spell-lvl { font-size: 12px; }
.divine-character-system .dcs-spell-lvl em { font-size: 11px; }
.divine-character-system .dcs-subhead { font-size: 12px; }
.divine-character-system .dcs-hint, .divine-character-system .dcs-note { font-size: 13.5px; }
.divine-character-system .dcs-cm-field > label { font-size: 11.5px; }
.divine-character-system .dcs-cm-vital span { font-size: 10.5px; }
.divine-character-system .dcs-abil-label { font-size: 10.5px; }
.divine-character-system .dcs-skill-head { font-size: 10.5px; }
.divine-character-system .dcs-roll-meta { font-size: 10.5px; }
.divine-character-system .dcs-stat span { font-size: 10.5px; }
.divine-character-system .dcs-def b { font-size: 11px; }
.divine-character-system .dcs-lk-sub { font-size: 11.5px; }
.divine-character-system .dcs-res-src { font-size: 12px; }
.divine-character-system .dcs-prep-max { width: 48px; font-size: 12px; }
.divine-character-system select.dcs-spell-lvlset { font-size: 12px; }
.divine-character-system .dcs-empty { font-size: 13.5px; }

/* ---- (4) handcrafted checkbox controls (Prepared / Concentration / V·S·M /
        Short Rest picks). Brass fill + inked check when on; visibly empty
        parchment-well when off; full hover / focus-visible / active /
        disabled states; keyboard friendly (real <input type=checkbox>). ---- */
.divine-character-system .dcs-check { gap: 8px; user-select: none; }
.divine-character-system .dcs-check input[type="checkbox"] {
  -webkit-appearance: none; appearance: none; margin: 0; flex: 0 0 auto;
  width: 18px; height: 18px; border-radius: 4px; cursor: pointer; position: relative;
  background: linear-gradient(160deg, rgba(0,0,0,.42), color-mix(in srgb,var(--cx-text-strong) 3%,transparent));
  border: 1.5px solid var(--dcs-gold-dim);
  box-shadow: inset 0 1px 3px rgba(0,0,0,.55);
  transition: background .15s, border-color .15s, box-shadow .15s;
}
.divine-character-system .dcs-check input[type="checkbox"]:hover {
  border-color: var(--dcs-gold); box-shadow: inset 0 1px 3px rgba(0,0,0,.55), 0 0 0 3px color-mix(in srgb,var(--cx-accent-deep) 10%,transparent);
}
.divine-character-system .dcs-check input[type="checkbox"]:focus-visible {
  outline: 2px solid var(--dcs-gold); outline-offset: 2px;
}
.divine-character-system .dcs-check input[type="checkbox"]:active { transform: scale(.94); }
.divine-character-system .dcs-check input[type="checkbox"]:checked {
  background: linear-gradient(150deg, var(--dcs-gold), var(--dcs-gold-dim));
  border-color: var(--dcs-gold);
}
.divine-character-system .dcs-check input[type="checkbox"]:checked::after {
  content: ''; position: absolute; left: 5px; top: 1.5px; width: 5px; height: 9px;
  border: solid var(--cx-surface); border-width: 0 2.5px 2.5px 0; transform: rotate(42deg);
}
.divine-character-system .dcs-check input[type="checkbox"]:disabled {
  opacity: .38; cursor: not-allowed; border-style: dashed;
}
.divine-character-system .dcs-check > span { font-size: 13px; color: var(--dcs-readable); }
.divine-character-system .dcs-check input[type="checkbox"]:checked + span { color: var(--dcs-gold); }

/* ---- (2) character portraits: folio frame, cover-crop inside a deliberate
        square, click opens the full uncropped image ---- */
.divine-character-system .dcs-portrait {
  display: inline-flex; align-items: center; justify-content: center; overflow: hidden;
  width: 64px; height: 64px; flex: 0 0 auto; padding: 0; cursor: pointer;
  border: 1px solid var(--dcs-gold-dim); border-radius: 8px;
  background: linear-gradient(160deg, color-mix(in srgb,var(--cx-accent-deep) 10%,transparent), rgba(0,0,0,.35));
  box-shadow: inset 0 0 0 2px rgba(0,0,0,.45), 0 2px 6px rgba(0,0,0,.4);
}
.divine-character-system .dcs-portrait img { width: 100%; height: 100%; object-fit: cover; object-position: top center; display: block; }
.divine-character-system .dcs-portrait:hover { border-color: var(--dcs-gold); }
.divine-character-system .dcs-portrait:focus-visible { outline: 2px solid var(--dcs-gold); outline-offset: 2px; }
.divine-character-system .dcs-portrait-empty { cursor: default; }
.divine-character-system .dcs-portrait-empty span { font-family: 'Cinzel', serif; font-size: 24px; color: var(--dcs-gold-dim); }
.divine-character-system .dcs-portrait-broken img { display: none; }
.divine-character-system .dcs-headrow { display: flex; align-items: flex-start; gap: 14px; }
.divine-character-system .dcs-headrow > div:nth-child(2) { flex: 1; }
.divine-character-system .dcs-portrait-cm { width: 40px; height: 40px; margin-right: 10px; border-radius: 6px; }
.divine-character-system.dcs-portrait-lightbox {
  position: fixed; inset: 0; z-index: 2147483200; display: flex; flex-direction: column;
  align-items: center; justify-content: center; gap: 12px; cursor: zoom-out;
  background: color-mix(in srgb,var(--cx-bg) 90%,transparent); padding: 24px;
}
.divine-character-system.dcs-portrait-lightbox img {
  max-width: min(92vw, 900px); max-height: 82vh; object-fit: contain;
  border: 1px solid var(--dcs-gold-dim); border-radius: 8px; box-shadow: 0 10px 50px rgba(0,0,0,.8);
}
.divine-character-system.dcs-portrait-lightbox .dcs-portrait-caption {
  font-family: 'Cinzel', serif; font-size: 13px; letter-spacing: .06em; color: var(--dcs-readable-dim);
}

/* ---- (3) prepared state: bar + badge + filter; each spell listed once ---- */
.divine-character-system .dcs-prep-bar {
  display: flex; align-items: center; flex-wrap: wrap; gap: 10px; margin: 4px 0 10px;
  padding: 7px 10px; border: 1px solid var(--dcs-border); border-radius: 8px;
  background: linear-gradient(160deg, color-mix(in srgb,var(--cx-accent-deep) 6%,transparent), rgba(0,0,0,.2));
}
.divine-character-system .dcs-prep-count { font-family: 'Cinzel', serif; font-size: 12px; letter-spacing: .05em; text-transform: uppercase; color: var(--cx-success); }
.divine-character-system .dcs-prep-filter {
  font-family: 'Cinzel', serif; font-size: 11.5px; letter-spacing: .03em; cursor: pointer;
  padding: 4px 11px; border-radius: 7px; color: var(--dcs-readable-dim);
  background: color-mix(in srgb,var(--cx-text-strong) 4%,transparent); border: 1px solid var(--dcs-border); transition: all .15s;
}
.divine-character-system .dcs-prep-filter:hover { border-color: var(--dcs-gold-dim); color: var(--dcs-gold); }
.divine-character-system .dcs-prep-filter:focus-visible { outline: 2px solid var(--dcs-gold); outline-offset: 2px; }
.divine-character-system .dcs-prep-filter.on { background: linear-gradient(150deg, color-mix(in srgb,var(--cx-success) 20%,transparent), color-mix(in srgb,var(--cx-success) 6%,transparent)); border-color: color-mix(in srgb,var(--cx-success) 50%,transparent); color: var(--cx-success); }
.divine-character-system .dcs-prep-maxlabel { margin-left: auto; font-family: 'EB Garamond', serif; font-size: 12.5px; color: var(--dcs-dim); }
.divine-character-system .dcs-prep-badge {
  font-family: 'Cinzel', serif; font-size: 10.5px; letter-spacing: .04em; white-space: nowrap;
  color: var(--cx-success); border: 1px solid color-mix(in srgb,var(--cx-success) 40%,transparent); border-radius: 6px; padding: 1px 7px;
  background: color-mix(in srgb,var(--cx-success) 10%,transparent);
}
.divine-character-system .dcs-spell.is-prepared { border-left: 2px solid color-mix(in srgb,var(--cx-success) 55%,transparent); }

/* ---- (9) spells referenced inside combat action sections ---- */
.divine-character-system .dcs-spell-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.divine-character-system .dcs-spell-chip {
  font-family: 'EB Garamond', serif; font-size: 13px; color: var(--dcs-readable);
  border: 1px solid var(--dcs-border); border-left: 2px solid var(--dcs-gold-dim);
  border-radius: 7px; padding: 3px 9px; background: color-mix(in srgb,var(--cx-accent-deep) 5%,transparent);
}
.divine-character-system .dcs-spell-chip em { font-style: normal; font-family: 'Cinzel', serif; font-size: 10.5px; color: var(--dcs-gold-dim); margin-left: 4px; }

/* ---- (7/9) spell editor rows: casting-time select, components line ---- */
.divine-character-system .dcs-ctsel { max-width: 150px; }
.divine-character-system .dcs-comps-line { align-items: center; flex-wrap: wrap; }
.divine-character-system .dcs-comps-label { font-family: 'Cinzel', serif; font-size: 11px; letter-spacing: .06em; text-transform: uppercase; color: var(--dcs-gold-dim); margin-right: 4px; }
.divine-character-system .dcs-material-text { flex: 1; min-width: 180px; }

/* ---- (10) half proficiency (◐) states ---- */
.divine-character-system .dcs-skill-state.half { color: var(--dcs-gold-dim); border-color: var(--dcs-gold-dim); }
.divine-character-system .dcs-skill-row.half .dcs-skill-prof { color: var(--dcs-gold-dim); }

/* ---- (12) rest controls + Short Rest dialog ---- */
.divine-character-system .dcs-rest-row { display: flex; flex-wrap: wrap; gap: 8px; }
.divine-character-system .dcs-sr-overlay { display: flex; align-items: center; justify-content: center; padding: 18px; z-index: 2147483100; }
/* bug4a: the quick-add dialog is a sibling overlay on document.body; without an
   explicit z-index it inherits the Combat Mode overlay's stacking (9500) and can
   render behind it. Lift it (and the short-rest dialog) above the active overlay,
   and center them as flex overlays so they never flow to the bottom of the page. */
.divine-character-system .dcs-qa-overlay { display: flex; align-items: center; justify-content: center; padding: 18px; z-index: 2147483200; }
.divine-character-system .dcs-qa-overlay .dcs-qa-modal { margin: auto; }
.divine-character-system .dcs-sr-modal {
  width: min(560px, 94vw); max-height: 86vh; overflow-y: auto;
  border: 1px solid var(--dcs-gold-dim); border-radius: 12px; padding: 18px 20px 20px;
  background: linear-gradient(165deg, var(--cx-field), var(--cx-field));
  box-shadow: 0 14px 60px rgba(0,0,0,.75);
}
.divine-character-system .dcs-sr-title { font-family: 'Cinzel', serif; font-size: 18px; letter-spacing: .06em; color: var(--dcs-gold); margin-bottom: 4px; }
.divine-character-system .dcs-sr-note { font-family: 'EB Garamond', serif; font-size: 13.5px; color: var(--dcs-readable-dim); margin-bottom: 10px; }
.divine-character-system .dcs-sr-note.muted { color: var(--dcs-dim); }
.divine-character-system .dcs-sr-item { display: flex; margin: 5px 0; }
.divine-character-system .dcs-sr-item em { font-style: normal; color: var(--dcs-dim); font-size: 12.5px; margin-left: 6px; }
.divine-character-system .dcs-sr-hd { margin: 8px 0; }
.divine-character-system .dcs-sr-hd-label { display: block; font-family: 'EB Garamond', serif; font-size: 13.5px; color: var(--dcs-readable); margin-bottom: 5px; }
.divine-character-system .dcs-sr-hd-controls { display: flex; align-items: center; gap: 8px; font-family: 'EB Garamond', serif; font-size: 13.5px; color: var(--dcs-readable-dim); }
.divine-character-system .dcs-sr-rollhd { font-size: 12.5px; }
.divine-character-system .dcs-sr-summary {
  margin-top: 14px; padding: 9px 11px; border: 1px dashed var(--dcs-gold-dim); border-radius: 8px;
  font-family: 'EB Garamond', serif; font-size: 13.5px; color: var(--dcs-readable);
  background: color-mix(in srgb,var(--cx-accent-deep) 5%,transparent);
}
.divine-character-system .dcs-sr-actions { display: flex; justify-content: flex-end; gap: 10px; margin-top: 14px; }

/* ---- (11) Backstory tab ---- */
.divine-character-system .dcs-backstory .dcs-card-mini { margin-bottom: 12px; }
.divine-character-system .dcs-bs-titlefield { font-family: 'Cinzel', serif; letter-spacing: .04em; }
.divine-character-system .dcs-bs-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 12px; }
.divine-character-system .dcs-bs-hidden { opacity: .72; }
.divine-character-system .dcs-bs-title.muted { font-family: 'Cinzel', serif; font-size: 13px; color: var(--dcs-dim); }
.divine-character-system .dcs-bs-title.muted em { font-style: normal; font-size: 11.5px; letter-spacing: .03em; }

/* ============================================================================
 * deploy133 — Shared Campaign Spell Compendium (player-facing)
 * ==========================================================================*/
/* Search result source labels: Campaign / Open5e / on-character */
.divine-character-system .dcs-lk-group { font-family: 'Cinzel', serif; font-size: 11.5px; letter-spacing: .08em;
  text-transform: uppercase; color: var(--dcs-gold-dim); margin: 12px 0 6px; padding-bottom: 4px;
  border-bottom: 1px solid var(--dcs-border); }
.divine-character-system .dcs-lk-tag { font-family: 'Cinzel', serif; font-size: 10px; letter-spacing: .05em;
  border-radius: 6px; padding: 1px 7px; margin-left: 8px; vertical-align: 1px; white-space: nowrap; }
.divine-character-system .dcs-lk-tag.camp { color: var(--dcs-gold); border: 1px solid var(--dcs-gold-dim); background: color-mix(in srgb,var(--cx-accent-deep) 10%,transparent); }
.divine-character-system .dcs-lk-tag.o5e { color: var(--dcs-readable-dim); border: 1px solid var(--dcs-border); background: color-mix(in srgb,var(--cx-text-strong) 3%,transparent); }
.divine-character-system .dcs-lk-tag.added { color: var(--cx-success); border: 1px solid color-mix(in srgb,var(--cx-success) 40%,transparent); background: color-mix(in srgb,var(--cx-success) 10%,transparent); }
.divine-character-system .dcs-lk-tag.pending { color: var(--cx-accent); border: 1px dashed var(--dcs-gold-dim); background: color-mix(in srgb,var(--cx-accent-deep) 6%,transparent); }
/* Spell editor: campaign link chip + save/submit control */
.divine-character-system .dcs-comp-line { align-items: center; flex-wrap: wrap; gap: 8px; }
.divine-character-system .dcs-comp-chip { font-family: 'Cinzel', serif; font-size: 10.5px; letter-spacing: .05em;
  color: var(--dcs-gold); border: 1px solid var(--dcs-gold-dim); border-radius: 6px; padding: 1px 8px;
  background: color-mix(in srgb,var(--cx-accent-deep) 10%,transparent); white-space: nowrap; }
.divine-character-system .dcs-comp-chip.broken { color: var(--dcs-dim); border-style: dashed; background: color-mix(in srgb,var(--cx-text-strong) 2%,transparent); }
.divine-character-system .dcs-comp-btn { font-family: 'Cinzel', serif; font-size: 11px; letter-spacing: .03em;
  width: auto; height: auto; padding: 3px 10px; white-space: nowrap; }

/* ── deploy139: Combat Mode quick add ───────────────────────────── */
.dcs-cm-sechead{display:flex;align-items:center;justify-content:space-between;gap:10px}
.dcs-cm-qadd{font-family:Cinzel,serif;font-size:10px;letter-spacing:.05em;color:var(--cx-accent-deep);background:none;border:1px solid color-mix(in srgb,var(--cx-accent) 40%,transparent);border-radius:14px;padding:2px 11px;cursor:pointer;min-height:24px;text-transform:uppercase;flex-shrink:0}
.dcs-cm-qadd:hover{color:var(--cx-accent);border-color:color-mix(in srgb,var(--cx-accent) 70%,transparent);background:color-mix(in srgb,var(--cx-accent) 6%,transparent)}
.dcs-cm-qadd:focus-visible{outline:2px solid var(--cx-accent);outline-offset:2px}
.dcs-qa-modal{max-width:440px}
.dcs-qa-field{display:block;margin:10px 0 0}
.dcs-qa-field span{display:block;font-family:Cinzel,serif;font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--cx-accent-deep);margin-bottom:4px}
.dcs-qa-field span em{font-style:normal;text-transform:none;letter-spacing:0;color:var(--cx-accent-deep);font-family:'EB Garamond',serif;font-size:12px}
.dcs-qa-field .dcs-input{width:100%}
.dcs-qa-row{display:flex;gap:12px}
.dcs-qa-field.small{flex:1}
.dcs-qa-desc{min-height:74px;resize:vertical;font-family:'EB Garamond',serif;line-height:1.5}
.dcs-qa-err{font-family:'EB Garamond',serif;font-size:13.5px;color:var(--cx-danger);min-height:18px;margin-top:8px}
@media(max-width:640px){.dcs-qa-row{flex-direction:column;gap:0}}


/* deploy141: dedicated saving throw block */
.divine-character-system .dcs-save-card{position:relative}
.divine-character-system .dcs-save-prof{position:absolute;top:6px;right:8px;color:var(--dcs-readable-dim);font-size:11px}
.divine-character-system .dcs-save-card.prof{border-color:color-mix(in srgb,var(--cx-accent) 55%,transparent);background:color-mix(in srgb,var(--cx-accent) 8%,transparent)}
.divine-character-system .dcs-save-card.prof .dcs-save-prof{color:var(--dcs-gold)}


/* deploy141: spell casting dialog */
.dcs-cast-modal{position:fixed;inset:0;z-index:100080;display:grid;place-items:center;padding:20px}
.dcs-cast-backdrop{position:absolute;inset:0;background:color-mix(in srgb,var(--cx-bg) 78%,transparent)}
.dcs-cast-card{position:relative;width:min(520px,calc(100vw - 28px));max-height:calc(100vh - 36px);overflow:auto;background:var(--cx-surface);border:1px solid color-mix(in srgb,var(--cx-accent) 62%,transparent);box-shadow:0 18px 54px rgba(0,0,0,.58);padding:20px;color:var(--cx-accent-bright)}
.dcs-cast-card h3{margin:0 0 15px;color:var(--cx-accent-bright);font-family:Cinzel,serif;font-size:19px}
.dcs-cast-field{display:grid;gap:6px;margin:12px 0}.dcs-cast-field>span{font-size:12px;color:var(--cx-accent)}
.dcs-cast-preview{display:grid;gap:5px;margin:13px 0;padding:12px;border-left:3px solid var(--cx-accent-deep);background:rgba(0,0,0,.22)}
.dcs-cast-preview strong{font-size:18px;color:var(--cx-accent)}.dcs-cast-preview span,.dcs-cast-preview small{color:var(--cx-accent)}.dcs-cast-preview details{margin-top:5px}.dcs-cast-preview p{white-space:pre-wrap;margin:6px 0 0}
.dcs-cast-status{min-height:20px;color:var(--cx-accent);font-size:12px}.dcs-cast-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:14px}.dcs-cast-confirm{border-color:var(--cx-accent-deep)!important}
.dcs-cast-btn{border-color:color-mix(in srgb,var(--cx-accent-deep) 65%,transparent)!important;color:var(--cx-accent-bright)!important}
@media(max-width:600px){.dcs-cast-modal{align-items:end;padding:10px}.dcs-cast-card{width:100%;max-height:82vh;padding:16px}}

/* ── deploy142: Utility Features ─────────────────────────────────── */
.dcs-cm-utility-list{display:flex;flex-direction:column;gap:10px}
.dcs-util-card{border:1px solid color-mix(in srgb,var(--cx-accent) 28%,transparent);border-radius:10px;padding:11px 13px;background:rgba(0,0,0,.22)}
.dcs-util-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px}
.dcs-util-name{font-family:Cinzel,serif;font-size:14.5px;color:var(--cx-text-strong)}
.dcs-util-src{font-family:Cinzel,serif;font-size:9.5px;letter-spacing:.05em;text-transform:uppercase;color:var(--cx-accent-deep)}
.dcs-util-trigger{font-family:'EB Garamond',serif;font-size:13px;font-style:italic;color:var(--cx-accent-deep);margin-top:3px}
.dcs-util-desc{font-family:'EB Garamond',serif;font-size:13.5px;line-height:1.5;color:var(--cx-text-soft);margin-top:5px}
.dcs-util-controls{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:9px}
.dcs-util-pip{display:inline-block;width:11px;height:11px;border-radius:50%;border:1.5px solid color-mix(in srgb,var(--cx-accent) 55%,transparent);margin-right:3px;vertical-align:middle}
.dcs-util-pip.full{background:var(--cx-accent-deep)}
.dcs-util-count,.dcs-util-recharge{font-family:Cinzel,serif;font-size:10px;letter-spacing:.05em;text-transform:uppercase;color:var(--cx-text-dim)}
.dcs-util-recharge{border:1px solid color-mix(in srgb,var(--cx-accent-deep) 40%,transparent);border-radius:5px;padding:1px 7px}
.dcs-util-btn{font-size:11.5px;min-height:32px}
.dcs-util-btn[disabled]{opacity:.4;cursor:default}
/* ── deploy142 #9: simplified HP controls ───────────────────────── */
/* Bug 6 (HP box): the base .dcs-cm-hp-custom sets align-items:center, which in
   this column layout shrink-wraps the button rows and collapses the flex:1
   Damage/Heal buttons to the inherited 34px .dcs-res-btn square — so the labels
   overflow and collide. Force full-width rows and override the square sizing so
   each button fits its label. */
.divine-character-system .dcs-cm-hp-custom.simplified{display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;gap:12px;margin-top:14px}
.divine-character-system .dcs-cm-hp-custom.simplified .dcs-hp-primary{display:flex;gap:10px;width:100%}
/* Damage / Heal: full labelled buttons, not 34px squares */
.divine-character-system .dcs-cm-hp-custom.simplified .dcs-hp-dmg,
.divine-character-system .dcs-cm-hp-custom.simplified .dcs-hp-heal{flex:1 1 0;width:auto;height:auto;min-height:50px;display:inline-flex;align-items:center;justify-content:center;gap:6px;font-size:14px;font-weight:700;border-radius:12px;padding:0 12px;white-space:nowrap}
/* secondary row: Amount grows, Revert is a labelled button, Reset is the icon */
.divine-character-system .dcs-cm-hp-custom.simplified .dcs-hp-secondary{display:flex;gap:8px;align-items:flex-end;justify-content:stretch;width:100%}
.dcs-hp-amtwrap{display:flex;flex-direction:column;gap:3px;align-items:flex-start;flex:1 1 auto;min-width:0}
.dcs-hp-amtlabel{font-family:'Cinzel',serif;font-size:9px;letter-spacing:.08em;text-transform:uppercase;color:var(--dcs-readable-dim);padding-left:2px}
.divine-character-system .dcs-cm-hp-custom.simplified .dcs-hp-revert{flex:0 0 auto;width:auto;height:auto;min-height:44px;display:inline-flex;align-items:center;justify-content:center;gap:5px;padding:0 14px;font-size:12.5px;white-space:nowrap}
.divine-character-system .dcs-cm-hp-custom.simplified .dcs-hp-reset{flex:0 0 auto;width:44px;height:auto;min-height:44px;display:inline-flex;align-items:center;justify-content:center;font-size:18px}
.dcs-cm-hp-custom.simplified .dcs-cm-hp-amt{width:100%;box-sizing:border-box;text-align:center;font-size:17px;height:44px}
.dcs-hp-dmg{color:var(--cx-danger);border-color:color-mix(in srgb,var(--cx-danger) 50%,transparent)}
.dcs-hp-dmg:hover{background:color-mix(in srgb,var(--cx-danger) 12%,transparent)}
.dcs-hp-heal{color:var(--cx-success);border-color:color-mix(in srgb,var(--cx-success) 50%,transparent)}
.dcs-hp-heal:hover{background:color-mix(in srgb,var(--cx-success) 12%,transparent)}
/* ── deploy142 #10/#11: collapsible sections + heading hierarchy ── */
.dcs-cm-cwrap{margin-bottom:12px}
.dcs-cm-cwrap-head{display:flex;align-items:center;gap:8px;padding:4px 0 6px;border-bottom:1px solid color-mix(in srgb,var(--cx-accent) 22%,transparent);margin-bottom:8px}
.dcs-cm-cwrap.is-collapsed .dcs-cm-cwrap-head{margin-bottom:0;border-bottom-color:color-mix(in srgb,var(--cx-accent) 12%,transparent)}
.dcs-cm-cwrap-title{font-family:Cinzel,serif;font-size:13px;letter-spacing:.07em;text-transform:uppercase;color:var(--cx-accent-deep);flex:1}
.dcs-cm-cwrap-head.emph{border-bottom-width:2px;border-bottom-color:color-mix(in srgb,var(--cx-accent) 40%,transparent);padding-bottom:8px}
.dcs-cm-cwrap-head.emph .dcs-cm-cwrap-title{font-size:16px;color:var(--cx-accent);letter-spacing:.09em}
.dcs-cm-collapse-btn{background:none;border:1px solid color-mix(in srgb,var(--cx-accent) 35%,transparent);border-radius:6px;color:var(--cx-accent-deep);width:26px;height:26px;cursor:pointer;font-size:11px;line-height:1;flex-shrink:0}
.dcs-cm-collapse-btn:hover{border-color:var(--cx-accent);color:var(--cx-accent)}
.dcs-cm-collapse-btn:focus-visible{outline:2px solid var(--cx-accent);outline-offset:2px}
.dcs-cm-cwrap .dcs-cm-field>label{display:none} /* the wrap heading owns the title */
.dcs-cm-cwrap .dcs-cm-hp-label{font-size:10px;opacity:.7}
.dcs-cm-mini{font-family:Cinzel,serif;font-size:10px;letter-spacing:.04em;color:var(--cx-accent-deep);background:none;border:1px solid color-mix(in srgb,var(--cx-accent) 35%,transparent);border-radius:6px;padding:4px 10px;cursor:pointer;min-height:30px;margin-right:6px}
.dcs-cm-mini:hover{border-color:var(--cx-accent);color:var(--cx-accent)}
/* library function groups (#8) */
.dcs-lib-group-title{font-family:Cinzel,serif;font-size:13.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--cx-accent);margin:16px 0 8px;padding-bottom:5px;border-bottom:1px solid color-mix(in srgb,var(--cx-accent) 25%,transparent)}
.dcs-lib-group-title em{font-style:normal;color:var(--cx-text-dim);font-size:11px}
@media(max-width:640px){
  .dcs-cm-hp-custom.simplified .dcs-cm-hp-amt{width:100%}
  .dcs-hp-dmg,.dcs-hp-heal{min-height:50px} .dcs-hp-revert{min-height:44px;flex:1} .dcs-cm-hp-custom.simplified .dcs-hp-secondary{flex-wrap:wrap} /* thumb-accessible */
  .dcs-cm-collapse-btn{width:34px;height:34px}
}
/* deploy142 #3: tab-top add controls */
.dcs-lib-bar{display:flex;gap:9px;align-items:center}
.dcs-lib-add{flex-shrink:0;white-space:nowrap;min-height:38px}
/* ── shared small-button style (Save Notes, Roll, Rest, etc.) ───── */
.divine-character-system .dcs-btn{font-family:Cinzel,serif;font-size:11.5px;letter-spacing:.05em;text-transform:uppercase;
  padding:8px 15px;border-radius:8px;cursor:pointer;color:var(--cx-text);background:color-mix(in srgb,var(--cx-accent) 8%,transparent);
  border:1px solid color-mix(in srgb,var(--cx-accent) 40%,transparent);transition:background .15s,border-color .15s;line-height:1.2}
.divine-character-system .dcs-btn:hover{background:color-mix(in srgb,var(--cx-accent) 16%,transparent);border-color:var(--cx-accent)}
.divine-character-system .dcs-btn:disabled{opacity:.4;cursor:not-allowed}

/* ── deploy142 #4: party overview landing ───────────────────────── */
.dcs-overview .dcs-headtools{display:flex;gap:12px;align-items:center;flex:0 0 auto}
.dcs-ov-manage{display:inline-flex;align-items:center;gap:8px;padding:9px 16px}
.dcs-ov-mico{font-size:13px;filter:grayscale(1) brightness(1.3);opacity:.8}
/* layout toggle */
.divine-character-system .dcs-overview .dcs-headrow{justify-content:space-between;align-items:flex-start}
.dcs-ov-layout{display:inline-flex;border:1px solid color-mix(in srgb,var(--cx-accent) 40%,transparent);border-radius:9px;overflow:hidden}
.dcs-ov-lbtn{font-family:Cinzel,serif;font-size:11px;letter-spacing:.06em;text-transform:uppercase;padding:9px 17px;cursor:pointer;
  background:transparent;color:var(--cx-text-dim);border:0;border-right:1px solid color-mix(in srgb,var(--cx-accent) 28%,transparent);transition:background .15s,color .15s}
.dcs-ov-lbtn:last-child{border-right:0}
.dcs-ov-lbtn:hover{color:var(--cx-text);background:color-mix(in srgb,var(--cx-accent) 6%,transparent)}
.dcs-ov-lbtn.active{background:color-mix(in srgb,var(--cx-accent) 14%,transparent);color:var(--cx-accent)}

.dcs-ov-grid{margin-top:18px}
.dcs-ov-foot{text-align:center;font-family:'EB Garamond',serif;font-size:13.5px;color:var(--cx-accent-deep);margin-top:20px;padding-top:16px;border-top:1px solid color-mix(in srgb,var(--cx-accent) 14%,transparent)}
.dcs-ov-footico{color:var(--cx-accent-deep);margin-right:5px}

/* the row/card frame */
.dcs-ov-card{position:relative;transition:border-color .15s,box-shadow .15s}
.dcs-ov-open{all:unset;display:grid;box-sizing:border-box;width:100%;cursor:pointer;align-items:center;
  grid-template-columns:auto minmax(150px,1.15fr) minmax(150px,1.05fr) minmax(110px,.85fr) minmax(230px,1.2fr);
  column-gap:0;padding:20px 26px}
.dcs-ov-open:focus-visible{outline:2px solid var(--cx-accent);outline-offset:-3px;border-radius:12px}
.dcs-ov-open>*{padding:0 22px}
.dcs-ov-open>.dcs-ov-portwrap{padding-left:4px}
.dcs-ov-open>.dcs-ov-id,.dcs-ov-open>.dcs-ov-hpcol,.dcs-ov-open>.dcs-ov-condcol,.dcs-ov-open>.dcs-ov-combat{border-left:1px solid color-mix(in srgb,var(--cx-accent) 16%,transparent)}
.dcs-ov-open>.dcs-ov-portwrap{border-left:0}

/* portrait — octagonal notched frame */
.dcs-ov-portwrap{display:flex;align-items:center;justify-content:center}
.dcs-ov-portrait{width:104px;height:104px;object-fit:cover;flex-shrink:0;
  clip-path:polygon(20px 0,calc(100% - 20px) 0,100% 20px,100% calc(100% - 20px),calc(100% - 20px) 100%,20px 100%,0 calc(100% - 20px),0 20px);
  border:0;background:rgba(0,0,0,.3);box-shadow:0 0 0 1px color-mix(in srgb,var(--cx-accent) 45%,transparent),0 0 0 5px color-mix(in srgb,var(--cx-field) 90%,transparent),0 0 0 6px color-mix(in srgb,var(--cx-accent) 28%,transparent)}
button.dcs-ov-portrait{cursor:pointer;padding:0}

/* identity */
.dcs-ov-id{min-width:0}
.dcs-ov-name{font-family:Cinzel,serif;font-weight:600;font-size:24px;color:var(--cx-accent-bright);line-height:1.1;letter-spacing:.01em}
.dcs-ov-player{font-family:'EB Garamond',serif;font-size:14px;color:var(--cx-accent);margin-top:9px}
.dcs-ov-species{font-family:'EB Garamond',serif;font-size:14px;color:var(--cx-text-soft);margin-top:3px}
.dcs-ov-classline{font-family:'EB Garamond',serif;font-size:14px;color:var(--cx-text-soft);margin-top:3px}
.dcs-ov-classline .dcs-ov-dot{color:var(--cx-accent-dim);font-weight:400;margin:0 3px}
.dcs-ov-classline .dcs-ov-world{color:var(--cx-accent-deep)}

/* HP column */
.dcs-ov-collabel{display:block;font-style:normal;font-family:Cinzel,serif;font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--cx-accent-deep);margin-bottom:9px}
.dcs-ov-hpval{font-family:Cinzel,serif;line-height:1}
.dcs-ov-hpval strong{font-size:30px;color:var(--cx-text-strong);font-weight:600}
.dcs-ov-hpval i{font-style:normal;font-size:19px;color:var(--cx-accent-deep)}
.dcs-ov-hpbar{height:8px;border-radius:5px;background:rgba(0,0,0,.45);border:1px solid color-mix(in srgb,var(--cx-accent) 22%,transparent);overflow:hidden;margin:11px 0 10px}
.dcs-ov-hpbar span{display:block;height:100%;border-radius:5px;background:linear-gradient(90deg,var(--cx-success),var(--cx-success))}
.dcs-ov-status{font-family:'EB Garamond',serif;font-size:14.5px;color:var(--cx-success);display:flex;align-items:center;gap:7px}
.dcs-ov-statusdot{width:8px;height:8px;border-radius:50%;background:var(--cx-success);flex-shrink:0}
.dcs-ov-temp{font-family:'EB Garamond',serif;font-size:13.5px;color:#7f95a8;margin-top:7px}
.dcs-ov-hpcol.dcs-ov-hp-low .dcs-ov-hpbar span{background:linear-gradient(90deg,var(--cx-accent-deep),var(--cx-accent))}
.dcs-ov-hpcol.dcs-ov-hp-low .dcs-ov-status{color:var(--cx-accent)}
.dcs-ov-hpcol.dcs-ov-hp-low .dcs-ov-statusdot{background:var(--cx-accent)}
.dcs-ov-hpcol.dcs-ov-hp-zero .dcs-ov-hpbar span{background:linear-gradient(90deg,var(--cx-danger),var(--cx-danger))}
.dcs-ov-hpcol.dcs-ov-hp-zero .dcs-ov-hpval strong{color:var(--cx-danger)}
.dcs-ov-hpcol.dcs-ov-hp-zero .dcs-ov-status{color:var(--cx-danger)}
.dcs-ov-hpcol.dcs-ov-hp-zero .dcs-ov-statusdot{background:var(--cx-danger)}

/* conditions column */
.dcs-ov-conds{display:flex;flex-direction:column;gap:9px;align-items:flex-start}
.dcs-ov-cond{display:inline-flex;align-items:center;gap:8px;font-family:'EB Garamond',serif;font-size:14.5px;color:#c9a9c9}
.dcs-ov-conddot{width:9px;height:9px;border-radius:50%;background:#a86ca8;box-shadow:0 0 6px rgba(168,108,168,.6);flex-shrink:0}
.dcs-ov-none{color:var(--cx-accent-dim);font-size:18px}

/* combat column */
.dcs-ov-combat{display:flex;flex-direction:column;gap:14px}
.dcs-ov-cbtrio{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.dcs-ov-cbcell{display:flex;flex-direction:column;align-items:flex-start}
.dcs-ov-cbcell em{font-style:normal;font-family:Cinzel,serif;font-size:9.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--cx-accent-deep);margin-bottom:5px}
.dcs-ov-cbcell strong{font-family:Cinzel,serif;font-size:23px;color:var(--cx-text-strong);font-weight:600;line-height:1}
.dcs-ov-cbcell strong span{font-size:13px;color:var(--cx-text-dim);font-weight:400}
.dcs-ov-caster{margin-top:2px}
.dcs-ov-passive{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-top:12px;border-top:1px solid color-mix(in srgb,var(--cx-accent) 16%,transparent)}
.dcs-ov-passive em{font-style:normal;font-family:Cinzel,serif;font-size:10px;letter-spacing:.07em;text-transform:uppercase;color:var(--cx-text-dim)}
.dcs-ov-passive strong{font-family:Cinzel,serif;font-size:17px;color:var(--cx-text)}
.dcs-ov-attack{display:flex;flex-direction:column;gap:5px;padding-top:12px;border-top:1px solid color-mix(in srgb,var(--cx-accent) 16%,transparent)}
.dcs-ov-attack em{font-style:normal;font-family:Cinzel,serif;font-size:10px;letter-spacing:.07em;text-transform:uppercase;color:var(--cx-accent-deep)}
.dcs-ov-atkline{font-family:'EB Garamond',serif;font-size:15px;color:var(--cx-text-soft)}
.dcs-ov-atkline b{color:var(--cx-text-strong);font-weight:600}

/* DM notes (admin) below a row */
.dcs-ov-notes{padding:14px 26px 20px;border-top:1px dashed color-mix(in srgb,var(--cx-accent) 20%,transparent)}
.dcs-ov-notes-label{font-family:Cinzel,serif;font-size:10.5px;letter-spacing:.07em;text-transform:uppercase;color:var(--cx-accent-deep);display:block;margin-bottom:7px}
.dcs-ov-notes-label em{font-style:italic;text-transform:none;letter-spacing:0;color:var(--cx-accent-deep);font-family:'EB Garamond',serif}
.dcs-ov-notes-text{width:100%;max-width:720px;resize:vertical;font-size:13.5px;min-height:60px}
.dcs-ov-notes-row{display:flex;align-items:center;gap:12px;margin-top:9px}
.dcs-ov-notes-status{font-family:'EB Garamond',serif;font-size:12.5px;color:var(--cx-text-dim)}
.dcs-tab-overview{opacity:.85}

/* ROWS layout — separated by hairline rules, no card chrome */
.dcs-ov-grid.dcs-ov-rows{display:block;border:1px solid color-mix(in srgb,var(--cx-accent) 30%,transparent);border-radius:16px;overflow:hidden;background:linear-gradient(180deg,color-mix(in srgb,var(--cx-field) 50%,transparent),color-mix(in srgb,var(--cx-field) 60%,transparent))}
.dcs-ov-rows .dcs-ov-card{border-top:1px solid color-mix(in srgb,var(--cx-accent) 18%,transparent)}
.dcs-ov-rows .dcs-ov-card:first-child{border-top:0}
.dcs-ov-rows .dcs-ov-card:hover{background:color-mix(in srgb,var(--cx-accent) 3%,transparent)}

/* CARDS layout — each character in its own framed card */
.dcs-ov-grid.dcs-ov-cards{display:grid;grid-template-columns:1fr;gap:18px}
.dcs-ov-cards .dcs-ov-card{border:1px solid color-mix(in srgb,var(--cx-accent) 32%,transparent);border-radius:16px;
  background:linear-gradient(168deg,color-mix(in srgb,var(--cx-surface) 85%,transparent),color-mix(in srgb,var(--cx-field) 90%,transparent));box-shadow:0 6px 18px rgba(0,0,0,.35)}
.dcs-ov-cards .dcs-ov-card:hover{border-color:color-mix(in srgb,var(--cx-accent) 50%,transparent);box-shadow:0 8px 24px rgba(0,0,0,.45)}

@media(max-width:1080px){
  .dcs-ov-open{grid-template-columns:auto 1fr 1fr;grid-auto-rows:auto;row-gap:20px}
  .dcs-ov-open>.dcs-ov-portwrap{grid-row:1;grid-column:1}
  .dcs-ov-open>.dcs-ov-id{grid-row:1;grid-column:2/4;border-left:1px solid color-mix(in srgb,var(--cx-accent) 16%,transparent)}
  .dcs-ov-open>.dcs-ov-hpcol{grid-row:2;grid-column:1/2;border-left:0;padding-left:4px}
  .dcs-ov-open>.dcs-ov-condcol{grid-row:2;grid-column:2/3}
  .dcs-ov-open>.dcs-ov-combat{grid-row:2;grid-column:3/4}
}
@media(max-width:680px){
  .dcs-ov-open{grid-template-columns:auto 1fr;padding:18px}
  .dcs-ov-open>*{padding:0 0 0 16px}
  .dcs-ov-open>.dcs-ov-portwrap{grid-row:1;grid-column:1;padding:0}
  .dcs-ov-open>.dcs-ov-id{grid-row:1;grid-column:2;border-left:0}
  .dcs-ov-open>.dcs-ov-hpcol{grid-row:2;grid-column:1/3;border-left:0;padding-left:0}
  .dcs-ov-open>.dcs-ov-condcol{grid-row:3;grid-column:1/3;border-left:0;padding-left:0}
  .dcs-ov-open>.dcs-ov-combat{grid-row:4;grid-column:1/3;border-left:0;padding-left:0}
  .dcs-ov-portrait{width:88px;height:88px}
  .dcs-overview .dcs-headtools{flex-wrap:wrap}
}
/* ── deploy142 #5: player passwords panel ───────────────────────── */
.codex-cred-list{display:flex;flex-direction:column;gap:10px;margin-top:12px}
.codex-cred-row{display:grid;grid-template-columns:1fr auto auto;gap:10px;align-items:center;border:1px solid color-mix(in srgb,var(--cx-accent) 25%,transparent);border-radius:10px;padding:10px 13px}
.codex-cred-who{display:flex;flex-direction:column}
.codex-cred-badge{font-family:Cinzel,serif;font-size:9.5px;letter-spacing:.06em;text-transform:uppercase;border-radius:6px;padding:2px 8px;border:1px solid}
.codex-cred-badge.stored{color:var(--cx-success);border-color:color-mix(in srgb,var(--cx-success) 50%,transparent)}
.codex-cred-badge.env{color:var(--cx-accent);border-color:color-mix(in srgb,var(--cx-accent) 50%,transparent)}
.codex-cred-badge.none{color:var(--cx-text-dim);border-color:color-mix(in srgb,var(--cx-accent-deep) 40%,transparent)}
.codex-cred-actions{display:flex;gap:7px;flex-wrap:wrap}
.codex-cred-out{grid-column:1/-1;font-size:13px}
.codex-cred-out:empty{display:none}
.codex-cred-ok{color:var(--cx-success)}
.codex-cred-pw{background:rgba(0,0,0,.35);border:1px solid color-mix(in srgb,var(--cx-accent) 40%,transparent);border-radius:6px;padding:3px 9px;font-size:14px;letter-spacing:.05em;user-select:all}
@media(max-width:640px){.codex-cred-row{grid-template-columns:1fr}}
/* ── deploy142 #1: locations + wiki tables ──────────────────────── */
.wiki-locline{display:flex;gap:7px;flex-wrap:wrap;align-items:center;margin:4px 0 10px}
.wiki-locbadge{font-family:Cinzel,serif;font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--cx-accent);border:1px solid color-mix(in srgb,var(--cx-accent) 45%,transparent);border-radius:6px;padding:2px 10px}
.wiki-loctag{font-family:'EB Garamond',serif;font-size:12.5px;color:var(--cx-text-soft);border:1px solid color-mix(in srgb,var(--cx-accent) 28%,transparent);border-radius:6px;padding:1px 9px}
.wiki-ed-locrow{margin-top:8px}
.wiki-ed-tags{font-size:13px}
.wiki-table,.wiki-content table{border-collapse:collapse;width:100%;margin:12px 0;font-family:'EB Garamond',serif;font-size:14px}
.wiki-content th,.wiki-content td,.wiki-table th,.wiki-table td{border:1px solid color-mix(in srgb,var(--cx-accent) 32%,transparent);padding:7px 11px;text-align:left;min-width:64px;color:var(--cx-accent-bright)}
.wiki-content th,.wiki-table th{font-family:Cinzel,serif;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--cx-accent-deep);background:color-mix(in srgb,var(--cx-accent) 8%,transparent)}
.wiki-content tr:nth-child(even) td{background:color-mix(in srgb,var(--cx-text-strong) 2%,transparent)}
.wiki-table-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:100%}
.wiki-tablebar{display:inline-flex;gap:4px;margin-left:8px;padding-left:8px;border-left:1px solid color-mix(in srgb,var(--cx-accent) 30%,transparent)}
.wiki-tablebar button{font-size:11px}
.wiki-ed-body table td:empty::after{content:'\00a0'}
/* ── deploy142 #12: DM console sync chrome ──────────────────────── */
.dc-portrait{width:26px;height:26px;border-radius:6px;object-fit:cover;margin-right:6px;vertical-align:middle;border:1px solid color-mix(in srgb,var(--cx-accent) 35%,transparent)}
.dc-condline{display:block;margin-top:2px}
.dc-chip{display:inline-block;font-size:10.5px;border:1px solid color-mix(in srgb,var(--cx-danger) 50%,transparent);color:var(--cx-danger);border-radius:5px;padding:0 6px;margin-right:4px}
.dc-chip-temp{border-color:rgba(106,150,201,.5);color:#8ab0e0}

/* ══ css/codex.css ══ */
/* D20Keep foundation theme */
:root{
  --codex-accent:var(--cx-accent);
  --codex-secondary:var(--cx-accent-dim);
  --codex-bg:var(--cx-surface);
  --codex-surface:var(--cx-surface);
  --codex-text:var(--cx-accent-bright);
}
body.codex-template,
body{background:radial-gradient(circle at 20% 0%,color-mix(in srgb,var(--cx-accent-dim) 22%,transparent),transparent 34%),linear-gradient(180deg,var(--cx-surface),var(--cx-field) 75%);}
body.codex-template #sidebar{background:linear-gradient(180deg,color-mix(in srgb,var(--cx-surface) 98%,transparent),color-mix(in srgb,var(--cx-surface) 98%,transparent));border-bottom-color:color-mix(in srgb,var(--cx-accent) 24%,transparent);}
body.codex-template #sidebar-header:before{content:"✧";color:var(--codex-accent);}
body.codex-template .nav-section>.nav-dropdown{background:color-mix(in srgb,var(--cx-surface) 98%,transparent);border-color:color-mix(in srgb,var(--cx-accent) 32%,transparent);border-top-color:var(--codex-accent);}
body.codex-template .nav-section:hover>.nav-section-label,
body.codex-template .nav-section.open>.nav-section-label,
body.codex-template .nav-item:hover,
body.codex-template .nav-item.active{color:var(--cx-accent-bright);border-bottom-color:var(--codex-accent);}
body.codex-template .nav-item.active{border-left-color:var(--codex-accent);background:color-mix(in srgb,var(--cx-accent) 12%,transparent);}
body.codex-template #topbar{background:linear-gradient(90deg,color-mix(in srgb,var(--cx-surface) 92%,transparent),color-mix(in srgb,var(--cx-surface) 55%,transparent)),url('../hero.jpg') center/cover no-repeat;}
body.codex-template .status-badge{background:color-mix(in srgb,var(--cx-surface) 82%,transparent);border-color:color-mix(in srgb,var(--cx-accent) 34%,transparent);color:var(--cx-accent-bright);}
body.codex-template .page,
body.codex-template .card,
body.codex-template .stat-block,
body.codex-template .gallery-upload,
body.codex-template .leg-item-card{background:linear-gradient(180deg,color-mix(in srgb,var(--cx-surface) 95%,transparent),color-mix(in srgb,var(--cx-surface) 97%,transparent));border-color:color-mix(in srgb,var(--cx-accent) 22%,transparent);box-shadow:0 18px 48px rgba(0,0,0,.22);}
body.codex-template .page-title,
body.codex-template .home-title{color:var(--cx-accent-bright);}
body.codex-template .page-eyebrow,
body.codex-template .section-title,
body.codex-template .card-title,
body.codex-template .home-section-title{color:var(--cx-accent);}
body.codex-template .page-description,
body.codex-template .prose,
body.codex-template .card-body{color:var(--cx-accent);}
body.home-active.codex-template #main{background:radial-gradient(circle at top,color-mix(in srgb,var(--cx-accent-dim) 28%,transparent),transparent 34%),var(--cx-field);}
body.codex-template .cinematic-home{background:linear-gradient(180deg,color-mix(in srgb,var(--cx-field) 45%,transparent),var(--cx-field)),url('../hero.jpg') center top/cover fixed no-repeat;}
body.codex-template .home-nav{background:color-mix(in srgb,var(--cx-surface) 78%,transparent);border-color:color-mix(in srgb,var(--cx-accent) 18%,transparent);}
body.codex-template .home-brand-title{color:var(--cx-accent-bright);}
body.codex-template .home-brand-sub{color:var(--cx-accent);}
body.codex-template .home-link,
body.codex-template .home-menu-btn{color:var(--cx-accent-bright);border-color:color-mix(in srgb,var(--cx-accent) 18%,transparent);}
body.codex-template .home-link:hover,
body.codex-template .home-link.active{background:color-mix(in srgb,var(--cx-accent) 12%,transparent);color:var(--cx-accent-bright);}
body.codex-template .home-hero{background:radial-gradient(circle at center,color-mix(in srgb,var(--cx-accent) 13%,transparent),transparent 44%);}
body.codex-template .home-copy{color:var(--cx-accent-bright);}
body.codex-template .home-action.primary,
body.codex-template .wiki-button{background:linear-gradient(135deg,var(--cx-accent-dim),var(--cx-accent));color:var(--cx-accent-bright);}
body.codex-template .home-action.secondary{background:color-mix(in srgb,var(--cx-surface) 72%,transparent);border-color:color-mix(in srgb,var(--cx-accent) 30%,transparent);color:var(--cx-accent-bright);}
body.codex-template .realm-card{background:linear-gradient(180deg,color-mix(in srgb,var(--cx-surface) 97%,transparent),color-mix(in srgb,var(--cx-surface) 98%,transparent));border-color:color-mix(in srgb,var(--cx-accent) 22%,transparent);}
body.codex-template .realm-card img{filter:sepia(.16) saturate(.94) contrast(.95);}
body.codex-template .realm-icon{background:color-mix(in srgb,var(--cx-accent) 13%,transparent);color:var(--cx-accent-bright);border-color:color-mix(in srgb,var(--cx-accent) 24%,transparent);}
body.codex-template.advanced-off [data-module="advanced"],
body.codex-template.advanced-off .advanced-module-only{display:none!important;}
.codex-powered{position:fixed;right:14px;bottom:10px;z-index:40;font:11px/1.2 Cinzel,serif;letter-spacing:.08em;text-transform:uppercase;color:color-mix(in srgb,var(--cx-accent-bright) 42%,transparent);pointer-events:none;}

/* Admin Mode */
.codex-admin-shell{display:grid;grid-template-columns:260px 1fr;gap:20px;min-height:640px;}
.codex-admin-side{background:color-mix(in srgb,var(--cx-field) 70%,transparent);border:1px solid color-mix(in srgb,var(--cx-accent) 20%,transparent);border-radius:18px;padding:16px;position:sticky;top:78px;align-self:start;}
.codex-admin-brand{font-family:Cinzel,serif;color:var(--cx-accent-bright);font-size:16px;line-height:1.25;margin-bottom:6px;}
.codex-admin-muted{color:var(--cx-accent);font-size:14px;line-height:1.45;margin-bottom:14px;}
.codex-admin-tabs{display:flex;flex-direction:column;gap:8px;}
.codex-admin-tab{width:100%;text-align:left;background:color-mix(in srgb,var(--cx-text-strong) 3.5%,transparent);border:1px solid color-mix(in srgb,var(--cx-accent) 16%,transparent);border-radius:12px;color:var(--cx-accent-bright);padding:10px 12px;font-family:Cinzel,serif;font-size:12px;letter-spacing:.06em;cursor:pointer;}
.codex-admin-tab.active,.codex-admin-tab:hover{background:color-mix(in srgb,var(--cx-accent) 14%,transparent);color:var(--cx-accent-bright);border-color:color-mix(in srgb,var(--cx-accent) 38%,transparent);}
.codex-admin-main{background:linear-gradient(180deg,color-mix(in srgb,var(--cx-surface) 88%,transparent),color-mix(in srgb,var(--cx-surface) 94%,transparent));border:1px solid color-mix(in srgb,var(--cx-accent) 20%,transparent);border-radius:22px;padding:22px;}
.codex-admin-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;}
.codex-admin-field{display:flex;flex-direction:column;gap:6px;margin-bottom:12px;}
.codex-admin-field label{font-family:Cinzel,serif;color:var(--cx-accent);font-size:11px;letter-spacing:.08em;text-transform:uppercase;}
.codex-admin-input,.codex-admin-textarea,.codex-admin-select{background:var(--cx-surface);border:1px solid color-mix(in srgb,var(--cx-accent) 22%,transparent);border-radius:12px;color:var(--cx-accent-bright);padding:10px 12px;font:15px/1.4 'EB Garamond',serif;outline:none;width:100%;}
.codex-admin-textarea{min-height:140px;resize:vertical;font-family:Consolas,Menlo,monospace;font-size:13px;line-height:1.45;}
.codex-admin-input:focus,.codex-admin-textarea:focus,.codex-admin-select:focus{border-color:color-mix(in srgb,var(--cx-accent) 62%,transparent);box-shadow:0 0 0 3px color-mix(in srgb,var(--cx-accent) 10%,transparent);}
.codex-admin-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px;}
.codex-admin-btn{background:linear-gradient(135deg,var(--cx-accent-dim),var(--cx-accent));border:0;border-radius:12px;color:var(--cx-accent-bright);font-family:Cinzel,serif;font-size:12px;font-weight:800;letter-spacing:.06em;padding:11px 14px;cursor:pointer;}
.codex-admin-btn.secondary{background:color-mix(in srgb,var(--cx-text-strong) 6%,transparent);border:1px solid color-mix(in srgb,var(--cx-accent) 25%,transparent);color:var(--cx-accent-bright);}
.codex-admin-btn.danger{background:linear-gradient(135deg,var(--cx-danger-deep),var(--cx-accent-deep));}
.codex-admin-card{background:color-mix(in srgb,var(--cx-field) 32%,transparent);border:1px solid color-mix(in srgb,var(--cx-accent) 16%,transparent);border-radius:16px;padding:16px;margin-bottom:14px;}
.codex-admin-card h3{font-family:Cinzel,serif;color:var(--cx-accent-bright);font-size:17px;margin-bottom:10px;}
.codex-admin-status{min-height:22px;color:var(--cx-accent);font-size:14px;margin-top:10px;}
.codex-admin-status.error{color:var(--cx-danger);}
.codex-admin-card-row{display:grid;grid-template-columns:80px 1fr;gap:12px;align-items:start;border-top:1px solid color-mix(in srgb,var(--cx-accent) 12%,transparent);padding-top:12px;margin-top:12px;}
.codex-admin-thumb{width:80px;height:62px;object-fit:cover;border-radius:10px;border:1px solid color-mix(in srgb,var(--cx-accent) 18%,transparent);background:var(--cx-surface);}
.codex-login-box{max-width:560px;margin:0 auto;background:color-mix(in srgb,var(--cx-surface) 82%,transparent);border:1px solid color-mix(in srgb,var(--cx-accent) 22%,transparent);border-radius:22px;padding:24px;}
.codex-login-title{font-family:Cinzel,serif;color:var(--cx-accent-bright);font-size:24px;margin-bottom:8px;}
.codex-login-note{color:var(--cx-accent);margin-bottom:18px;}
.codex-module-toggle{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 0;border-bottom:1px solid color-mix(in srgb,var(--cx-accent) 12%,transparent);}
.codex-module-toggle strong{color:var(--cx-accent-bright);}
.codex-module-toggle span{display:block;color:var(--cx-accent);font-size:14px;}
.codex-module-toggle input{width:42px;height:22px;}
@media(max-width:900px){.codex-admin-shell{grid-template-columns:1fr}.codex-admin-side{position:relative;top:auto}.codex-admin-tabs{display:grid;grid-template-columns:repeat(2,1fr)}.codex-admin-grid{grid-template-columns:1fr}.codex-admin-card-row{grid-template-columns:1fr}.codex-admin-thumb{width:100%;height:140px}}
body.advanced-off [data-module="advanced"],
body.advanced-off .advanced-module-only{
  display:none !important;
}

/* Codex product cleanup, setup wizard, diagnostics, media manager */
.codex-module-hidden,.codex-section-hidden{display:none!important;}
body.module-atlas-off #page-atlas,
body.module-inventory-off #page-inventory,
body.module-awards-off #page-awards,
body.module-starswishes-off #page-starswishes,
body.module-gallery-off #page-gallery,
body.module-npcs-off #page-npcs,
body.module-sessions-off #page-sessions{display:none!important;}
.codex-setup-overlay{position:fixed;inset:0;z-index:99999;background:color-mix(in srgb,var(--cx-bg) 82%,transparent);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;padding:20px;}
.codex-setup-modal{width:min(920px,calc(100vw - 32px));max-height:92vh;overflow:auto;background:linear-gradient(180deg,color-mix(in srgb,var(--cx-surface) 98%,transparent),color-mix(in srgb,var(--cx-field) 99%,transparent));border:1px solid color-mix(in srgb,var(--cx-accent) 32%,transparent);border-radius:24px;box-shadow:0 28px 80px rgba(0,0,0,.55);color:var(--codex-text);}
.codex-setup-head{display:flex;justify-content:space-between;gap:18px;padding:24px 24px 12px;border-bottom:1px solid color-mix(in srgb,var(--cx-accent) 14%,transparent);}
.codex-setup-head h2{margin:0 0 6px;color:var(--cx-accent-bright);font-family:Cinzel,serif;font-size:28px;}
.codex-setup-head p{margin:0;color:var(--cx-accent);max-width:720px;}
.codex-setup-kicker{font-family:Cinzel,serif;color:var(--cx-accent);letter-spacing:.12em;text-transform:uppercase;font-size:12px;margin-bottom:6px;}
.codex-setup-close{background:color-mix(in srgb,var(--cx-text-strong) 6%,transparent);border:1px solid color-mix(in srgb,var(--cx-accent) 24%,transparent);color:var(--cx-accent-bright);border-radius:12px;width:38px;height:38px;font-size:24px;cursor:pointer;}
.codex-setup-body{padding:20px 24px;}
.codex-setup-foot{padding:14px 24px 22px;display:flex;gap:10px;justify-content:flex-end;flex-wrap:wrap;border-top:1px solid color-mix(in srgb,var(--cx-accent) 14%,transparent);}
.codex-setup-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-bottom:14px;}
.codex-setup-field{display:flex;flex-direction:column;gap:6px;}
.codex-setup-field label,.codex-setup-body>label{font-family:Cinzel,serif;color:var(--cx-accent);font-size:11px;letter-spacing:.08em;text-transform:uppercase;display:block;margin:6px 0;}
.codex-setup-input,.codex-setup-textarea{background:var(--cx-surface);border:1px solid color-mix(in srgb,var(--cx-accent) 22%,transparent);border-radius:12px;color:var(--cx-accent-bright);padding:10px 12px;font:15px/1.4 'EB Garamond',serif;outline:none;width:100%;box-sizing:border-box;}
.codex-setup-textarea{min-height:110px;resize:vertical;margin-bottom:14px;}
.codex-setup-note{background:color-mix(in srgb,var(--cx-accent) 8%,transparent);border:1px solid color-mix(in srgb,var(--cx-accent) 18%,transparent);border-radius:12px;padding:12px;color:var(--cx-accent);font-size:14px;margin-top:10px;}
.codex-setup-status{min-height:22px;color:var(--cx-accent);font-size:14px;margin-top:12px;}
.codex-setup-status.error{color:var(--cx-danger);}
.codex-diagnostics-output{display:grid;gap:8px;margin-top:16px;}
.codex-check{border:1px solid color-mix(in srgb,var(--cx-accent) 16%,transparent);background:color-mix(in srgb,var(--cx-text-strong) 3.5%,transparent);border-radius:12px;padding:10px 12px;display:grid;gap:4px;}
.codex-check strong{font-family:Cinzel,serif;font-size:12px;letter-spacing:.05em;color:var(--cx-accent-bright);}
.codex-check span{color:var(--cx-accent);font-size:14px;}
.codex-check.ok{border-color:color-mix(in srgb,var(--cx-success) 36%,transparent);background:color-mix(in srgb,var(--cx-success) 8%,transparent);}
.codex-check.bad{border-color:color-mix(in srgb,var(--cx-danger) 36%,transparent);background:color-mix(in srgb,var(--cx-danger) 8%,transparent);}
.codex-image-field{display:flex;gap:8px;align-items:center;}
.codex-image-field input{flex:1;}
.codex-image-field button{white-space:nowrap;padding:10px 12px;}
.codex-media-library-head{display:grid;grid-template-columns:1fr minmax(220px,320px);gap:12px;align-items:end;margin-top:20px;}
.codex-asset-library{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px;margin-top:12px;}
.codex-asset-card{background:color-mix(in srgb,var(--cx-field) 32%,transparent);border:1px solid color-mix(in srgb,var(--cx-accent) 16%,transparent);border-radius:14px;overflow:hidden;display:flex;flex-direction:column;}
.codex-asset-card img{width:100%;height:120px;object-fit:cover;background:var(--cx-field);border-bottom:1px solid color-mix(in srgb,var(--cx-accent) 12%,transparent);}
.codex-asset-body{padding:10px;display:grid;gap:5px;}
.codex-asset-body strong{color:var(--cx-accent-bright);font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.codex-asset-body span{color:var(--cx-accent);font-size:12px;word-break:break-all;}
.codex-admin-sep{border:0;border-top:1px solid color-mix(in srgb,var(--cx-accent) 16%,transparent);margin:22px 0;}
.dcs-pdf-source-layout{background:color-mix(in srgb,var(--cx-accent) 10%,transparent);border:1px solid color-mix(in srgb,var(--cx-accent) 24%,transparent);border-radius:12px;padding:10px 12px;color:var(--cx-accent-bright);margin-bottom:10px;}
@media(max-width:760px){.codex-setup-grid,.codex-media-library-head{grid-template-columns:1fr}.codex-setup-modal{max-height:96vh}.codex-image-field{flex-direction:column;align-items:stretch}.codex-setup-head{padding:18px}.codex-setup-body{padding:16px}.codex-setup-foot{justify-content:stretch}.codex-setup-foot button{width:100%;}}

/* Build 121 hardening: commercial standard-mode cleanup */
body.module-combat-off [data-action="combatmode"],
body.module-combat-off .dcs-cm-trigger,
body.module-combat-off .dcs-combat-enter[data-action="combatmode"]{display:none!important;}
body.module-dice-off .dcs-cm-dicestyle,
body.module-dice-off .dcs-dice-upload,
body.module-dice-off .dcs-dice-texrow,
body.module-dice-off .dcs-dice-presets{display:none!important;}
body.advanced-off #legacy-character-data{display:none!important;}
body.advanced-off .dcs-formtoggle-row,
body.advanced-off .dcs-planets-toolbar,
body.advanced-off .dcs-constellation,
body.advanced-off .dcs-journey{display:none!important;}

/* ══ Campaign Wiki ══ */
.wiki-shell{display:flex;gap:18px;align-items:flex-start;min-height:60vh}
.wiki-side{flex:0 0 250px;position:sticky;top:80px;background:rgba(0,0,0,.28);border:1px solid color-mix(in srgb,var(--cx-accent) 22%,transparent);border-radius:10px;padding:12px;max-height:75vh;display:flex;flex-direction:column}
.wiki-search{width:100%;background:rgba(0,0,0,.4);border:1px solid color-mix(in srgb,var(--cx-accent) 30%,transparent);border-radius:6px;color:inherit;padding:8px 10px;margin-bottom:8px;font:inherit}
.wiki-tree{overflow-y:auto;flex:1}
.wiki-node{padding:6px 10px;border-radius:6px;cursor:pointer;font-size:.94em;line-height:1.3}
.wiki-node:hover{background:color-mix(in srgb,var(--cx-accent) 12%,transparent)}
.wiki-node.active{background:color-mix(in srgb,var(--cx-accent) 22%,transparent);color:var(--gold,var(--cx-accent))}
.wiki-lock{font-size:.8em;opacity:.8}
.wiki-hit-excerpt{font-size:.78em;opacity:.55;margin-top:2px}
.wiki-newbtn{margin-top:10px;background:color-mix(in srgb,var(--cx-accent) 15%,transparent);border:1px solid color-mix(in srgb,var(--cx-accent) 40%,transparent);border-radius:6px;color:var(--gold,var(--cx-accent));padding:8px;cursor:pointer;font:inherit}
.wiki-newbtn:hover{background:color-mix(in srgb,var(--cx-accent) 25%,transparent)}
.wiki-main{flex:1;min-width:0;background:rgba(0,0,0,.22);border:1px solid color-mix(in srgb,var(--cx-accent) 18%,transparent);border-radius:10px;padding:22px 26px}
.wiki-page-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:12px;border-bottom:1px solid color-mix(in srgb,var(--cx-accent) 25%,transparent);padding-bottom:10px;margin-bottom:16px}
.wiki-crumb{width:100%;font-size:.85em;opacity:.7}
.wiki-crumb a{color:var(--gold,var(--cx-accent))}
.wiki-title{font-family:Cinzel,serif;color:var(--gold,var(--cx-accent));margin:0;flex:1}
.wiki-actions{display:flex;gap:8px}
.wiki-btn{background:rgba(0,0,0,.35);border:1px solid color-mix(in srgb,var(--cx-accent) 35%,transparent);border-radius:6px;color:inherit;padding:6px 12px;cursor:pointer;font:inherit;font-size:.85em}
.wiki-btn:hover{border-color:var(--gold,var(--cx-accent))}
.wiki-primary{background:color-mix(in srgb,var(--cx-accent) 20%,transparent);color:var(--gold,var(--cx-accent))}
.wiki-danger{border-color:color-mix(in srgb,var(--cx-danger) 50%,transparent);color:var(--cx-danger)}
.wiki-content{line-height:1.65;font-size:1.02em}
.wiki-content h2,.wiki-content h3{font-family:Cinzel,serif;color:var(--gold,var(--cx-accent))}
.wiki-link{color:var(--gold,var(--cx-accent));border-bottom:1px dotted color-mix(in srgb,var(--cx-accent) 50%,transparent);text-decoration:none}
.wiki-link:hover{border-bottom-style:solid}
.wiki-missing{color:var(--cx-danger);border-bottom-color:color-mix(in srgb,var(--cx-danger) 50%,transparent)}
.wiki-panel{margin-top:22px;padding-top:12px;border-top:1px solid color-mix(in srgb,var(--cx-accent) 18%,transparent)}
.wiki-panel-title{font-size:.78em;letter-spacing:.12em;text-transform:uppercase;opacity:.6;margin-bottom:8px}
.wiki-chip{display:inline-block;background:color-mix(in srgb,var(--cx-accent) 10%,transparent);border:1px solid color-mix(in srgb,var(--cx-accent) 30%,transparent);border-radius:14px;padding:3px 12px;margin:0 6px 6px 0;color:inherit;text-decoration:none;font-size:.88em}
.wiki-chip:hover{border-color:var(--gold,var(--cx-accent))}
.wiki-empty{opacity:.6;padding:14px;font-style:italic}
.wiki-editor{display:flex;flex-direction:column;gap:10px}
.wiki-ed-row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.wiki-ed-title{flex:2;min-width:200px;background:rgba(0,0,0,.4);border:1px solid color-mix(in srgb,var(--cx-accent) 35%,transparent);border-radius:6px;color:var(--gold,var(--cx-accent));padding:10px 12px;font-family:Cinzel,serif;font-size:1.1em}
.wiki-ed-parent{flex:1;min-width:140px;background:rgba(0,0,0,.4);border:1px solid color-mix(in srgb,var(--cx-accent) 30%,transparent);border-radius:6px;color:inherit;padding:9px}
.wiki-ed-secret{white-space:nowrap;opacity:.9}
.wiki-toolbar{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.wiki-toolbar button{background:rgba(0,0,0,.35);border:1px solid color-mix(in srgb,var(--cx-accent) 30%,transparent);border-radius:5px;color:inherit;padding:5px 10px;cursor:pointer;font:inherit}
.wiki-toolbar button:hover{border-color:var(--gold,var(--cx-accent))}
.wiki-toolbar-hint{font-size:.78em;opacity:.55;margin-left:8px}
.wiki-ed-body{min-height:320px;background:rgba(0,0,0,.35);border:1px solid color-mix(in srgb,var(--cx-accent) 30%,transparent);border-radius:8px;padding:16px;line-height:1.6;outline:none}
.wiki-ed-body:focus{border-color:color-mix(in srgb,var(--cx-accent) 60%,transparent)}
.wiki-ed-foot{display:flex;justify-content:flex-end;gap:10px}
/* maps */
.wiki-map-bar{display:flex;gap:8px;flex-wrap:wrap;margin:14px 0 10px}
.wiki-map{height:520px;border:1px solid color-mix(in srgb,var(--cx-accent) 30%,transparent);border-radius:10px;background:var(--cx-field);overflow:hidden}
.wiki-map-hint{font-size:.82em;opacity:.65;margin-top:6px;font-style:italic}
.wiki-pin-wrap{background:none;border:none}
.wiki-pin{width:16px;height:16px;border-radius:50% 50% 50% 0;transform:rotate(-45deg);background:var(--atlas-pin-color,var(--gold,var(--cx-accent)));border:2px solid var(--cx-field);box-shadow:0 2px 5px rgba(0,0,0,.7)}
.wiki-pin-secret{outline:2px dashed var(--cx-danger);outline-offset:2px}
.wiki-pin-lock{font-size:10px}
.wiki-pin-label{position:absolute;left:18px;top:-2px;white-space:nowrap;font-size:11px;font-family:Cinzel,serif;color:var(--cx-accent-bright);text-shadow:0 1px 3px #000,0 0 6px #000;pointer-events:none}
.wiki-pin-form{display:flex;flex-direction:column;gap:6px}
.wiki-pin-form input,.wiki-pin-form select{width:100%;padding:5px 8px;border-radius:4px;border:1px solid #999;font:inherit}
.wiki-pin-form-btns{display:flex;gap:6px;justify-content:flex-end}
.leaflet-container{background:var(--cx-field);font:inherit}
.leaflet-popup-content-wrapper{background:var(--cx-surface);color:var(--cx-text);border:1px solid color-mix(in srgb,var(--cx-accent) 40%,transparent)}
.leaflet-popup-tip{background:var(--cx-surface)}
@media (max-width:820px){.wiki-shell{flex-direction:column}.wiki-side{position:static;flex:none;width:100%;max-height:40vh}.wiki-map{height:380px}}

/* ── Codex Inline Editor ────────────────────────────────────────── */
.cx-host{position:relative}
.cx-edit-btn{position:absolute;top:4px;right:4px;z-index:40;opacity:0;pointer-events:none;background:color-mix(in srgb,var(--cx-field) 92%,transparent);border:1px solid color-mix(in srgb,var(--cx-accent) 50%,transparent);color:var(--cx-accent);border-radius:6px;font-size:12px;line-height:1;padding:5px 7px;cursor:pointer;transition:opacity .15s}
.cx-host:hover>.cx-edit-btn{opacity:1;pointer-events:auto}
.cx-edit-btn:hover{background:color-mix(in srgb,var(--cx-accent) 15%,transparent)}
.cx-sec-del{position:absolute;top:4px;right:64px;z-index:40;opacity:0;pointer-events:none;background:color-mix(in srgb,var(--cx-field) 92%,transparent);border:1px solid color-mix(in srgb,var(--cx-danger) 55%,transparent);color:var(--cx-danger);border-radius:6px;font-size:12px;line-height:1;padding:5px 7px;cursor:pointer;transition:opacity .15s}
.cx-host:hover>.cx-sec-del{opacity:1;pointer-events:auto}
.cx-img-host{position:relative;display:inline-block;max-width:100%}
.cx-img-btn{position:absolute;bottom:8px;right:8px;z-index:40;opacity:0;background:color-mix(in srgb,var(--cx-field) 92%,transparent);border:1px solid color-mix(in srgb,var(--cx-accent) 50%,transparent);color:var(--cx-accent);border-radius:6px;font-size:12px;padding:6px 9px;cursor:pointer;transition:opacity .15s;font-family:Cinzel,serif}
.cx-img-host:hover .cx-img-btn{opacity:1}
.cx-insert-strip{display:flex;justify-content:center;margin:2px 0;min-height:14px;align-items:center}
.cx-insert-btn{opacity:0;background:transparent;border:1px dashed color-mix(in srgb,var(--cx-accent) 45%,transparent);color:color-mix(in srgb,var(--cx-accent) 85%,transparent);border-radius:999px;font-size:11px;letter-spacing:.08em;padding:3px 14px;cursor:pointer;transition:opacity .15s;font-family:Cinzel,serif}
.cx-insert-strip:hover .cx-insert-btn{opacity:1}
.cx-image-section{text-align:center}
.cx-image-section img{max-width:100%;border-radius:10px;border:1px solid color-mix(in srgb,var(--cx-accent) 25%,transparent)}
.cx-image-caption{color:var(--cx-text-dim);font-size:13px;font-style:italic;margin-top:8px}
#cx-modal,#atlas-modal{position:fixed;inset:0;z-index:2147483300;display:flex;align-items:center;justify-content:center;padding:18px;overflow:auto}#cx-modal .cx-modal-card,#atlas-modal .cx-modal-card{margin:auto}
.cx-modal-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.7)}
.cx-modal-card{position:relative;max-width:560px;margin:8vh auto 0;background:var(--cx-surface);border:1px solid color-mix(in srgb,var(--cx-accent) 40%,transparent);border-radius:12px;padding:22px;box-shadow:0 20px 60px rgba(0,0,0,.6);max-height:80vh;overflow:auto}
.cx-modal-title{font-family:Cinzel,serif;color:var(--cx-accent);font-size:17px;letter-spacing:.06em;margin-bottom:14px}
.cx-label{display:block;color:var(--cx-text-dim);font-size:11px;letter-spacing:.1em;text-transform:uppercase;margin:12px 0 4px}
.cx-input,.cx-textarea{width:100%;box-sizing:border-box;background:var(--cx-field);border:1px solid color-mix(in srgb,var(--cx-accent) 30%,transparent);color:var(--cx-text);border-radius:8px;padding:9px 11px;font-size:16px;font-family:inherit}
.cx-textarea{resize:vertical;line-height:1.5}
.cx-hint{color:var(--cx-text-dim);font-size:12px;margin-top:8px}
.cx-hint.err{color:var(--cx-danger)}
.cx-modal-status{min-height:18px;color:var(--cx-text-dim);font-size:12px;margin-top:10px}
.cx-modal-status.err{color:var(--cx-danger)}
.cx-modal-actions{display:flex;gap:8px;margin-top:14px;align-items:center}
.cx-modal-spacer{flex:1}
.cx-btn{background:color-mix(in srgb,var(--cx-accent) 14%,transparent);border:1px solid color-mix(in srgb,var(--cx-accent) 50%,transparent);color:var(--cx-accent);border-radius:8px;padding:8px 16px;cursor:pointer;font-family:Cinzel,serif;font-size:13px;letter-spacing:.05em}
.cx-btn:hover{background:color-mix(in srgb,var(--cx-accent) 24%,transparent)}
.cx-btn:disabled{opacity:.5;cursor:default}
.cx-btn-secondary{background:transparent;border-color:color-mix(in srgb,var(--cx-accent-deep) 50%,transparent);color:var(--cx-text-dim)}
.cx-btn-danger{background:color-mix(in srgb,var(--cx-danger) 12%,transparent);border-color:color-mix(in srgb,var(--cx-danger) 55%,transparent);color:var(--cx-danger)}
.cx-insert-choice{display:flex;gap:10px}
@media (max-width:768px){.cx-edit-btn,.cx-sec-del,.cx-insert-btn,.cx-img-btn{opacity:1;pointer-events:auto}.cx-modal-card{margin:4vh 12px 0}}

/* ── NPC Relationship Web ───────────────────────────────────────── */
.nw-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:14px;margin-bottom:12px;justify-content:space-between}
.nw-legend{display:flex;flex-wrap:wrap;gap:16px;align-items:center}
.nw-leg-item{display:inline-flex;align-items:center;gap:7px;color:var(--cx-text-soft);font-family:Cinzel,serif;font-size:12px;letter-spacing:.05em}
.nw-tools{display:flex;align-items:center;gap:10px}
.nw-canvas{border:1px solid color-mix(in srgb,var(--cx-accent) 22%,transparent);border-radius:12px;background:radial-gradient(ellipse at center,color-mix(in srgb,var(--cx-accent) 4%,transparent),transparent 70%),var(--cx-field);overflow:hidden}
#nw-svg{display:block;width:100%;height:auto;touch-action:none;user-select:none}
.nw-node{cursor:grab}
.nw-node:active{cursor:grabbing}
.nw-node .nw-label{fill:var(--cx-text);font-family:Cinzel,serif;font-size:13px;paint-order:stroke;stroke:var(--cx-field);stroke-width:4px;stroke-linejoin:round}
.nw-node .nw-initial{fill:var(--cx-accent);font-family:Cinzel,serif;font-size:30px;font-weight:700}
.nw-node.nw-selected rect{stroke:var(--cx-text-strong);stroke-width:3.5}
.nw-cross line{stroke:var(--cx-danger);stroke-width:5;stroke-linecap:round;opacity:.9}
.nw-edge-hit{cursor:pointer}
.nw-empty,.nw-hint{color:var(--cx-text-dim);font-family:'EB Garamond',serif;font-size:15px;padding:14px 4px}
.nw-hint{padding:0 4px 12px}
.nw-type-grid{display:flex;flex-wrap:wrap;gap:10px}
.nw-type-btn{display:inline-flex;align-items:center;gap:8px}
.nw-swatch{display:inline-block;width:12px;height:12px;border-radius:50%}
.nw-card-img{width:110px;height:110px;object-fit:cover;border-radius:12px;border:1px solid color-mix(in srgb,var(--cx-accent) 40%,transparent);float:right;margin:0 0 10px 12px}
.nw-card-tag{color:var(--cx-accent);font-style:italic;font-family:'EB Garamond',serif;font-size:14px;margin-bottom:6px}
.nw-card-status{display:inline-block;color:var(--cx-success);border:1px solid var(--cx-success);border-radius:20px;font-family:Cinzel,serif;font-size:11px;padding:2px 10px;margin-bottom:10px}
.nw-card-status.dead{color:var(--cx-danger);border-color:var(--cx-danger)}
.nw-card-desc{color:var(--cx-text-soft);font-family:'EB Garamond',serif;font-size:15px;line-height:1.6;clear:none}
@media (max-width:768px){.nw-toolbar{flex-direction:column;align-items:flex-start}.nw-node .nw-label{font-size:15px}}

/* ── Nested sub-pages ───────────────────────────────────────────── */
.nav-item.nav-subpage{font-size:13px;opacity:.92}
.nav-item.nav-subpage .icon{opacity:.7}
.cx-subpage-link{padding:0}
.cx-subpage-card{display:flex;align-items:center;gap:12px;padding:16px 18px;border:1px solid color-mix(in srgb,var(--cx-accent) 30%,transparent);border-radius:10px;background:color-mix(in srgb,var(--cx-accent) 5%,transparent);cursor:pointer;text-decoration:none;transition:background .15s,border-color .15s}
.cx-subpage-card:hover{background:color-mix(in srgb,var(--cx-accent) 11%,transparent);border-color:color-mix(in srgb,var(--cx-accent) 55%,transparent)}
.cx-subpage-icon{font-size:18px}
.cx-subpage-title{flex:1;color:var(--cx-text-strong);font-family:Cinzel,serif;font-size:15px;letter-spacing:.04em}
.cx-subpage-arrow{color:var(--cx-accent);font-size:16px}
.cx-subpage-bar{display:flex;justify-content:flex-end;margin-top:26px;padding-top:14px;border-top:1px solid color-mix(in srgb,var(--cx-accent) 15%,transparent)}

/* ── Visibility toggles (eye) ───────────────────────────────────── */
.cx-eye-btn{position:absolute;top:4px;right:34px;z-index:40;opacity:0;pointer-events:none;background:color-mix(in srgb,var(--cx-field) 92%,transparent);border:1px solid rgba(127,163,216,.55);color:#7fa3d8;border-radius:6px;font-size:12px;line-height:1;padding:5px 7px;cursor:pointer;transition:opacity .15s}
.cx-host:hover>.cx-eye-btn{opacity:1;pointer-events:auto}
.cx-eye-btn:hover{background:rgba(127,163,216,.15)}
.cx-hidden-block{outline:2px dashed rgba(127,163,216,.55);outline-offset:3px;opacity:.6;position:relative}
.cx-hidden-block::after{content:"Hidden from players";position:absolute;top:-11px;left:8px;background:var(--cx-surface);color:#7fa3d8;font-family:Cinzel,serif;font-size:10px;letter-spacing:.08em;padding:1px 8px;border:1px solid rgba(127,163,216,.5);border-radius:10px;z-index:5}
.cx-img-eye{right:auto;left:8px;border-color:rgba(127,163,216,.55);color:#7fa3d8}

/* ── DDB party import ───────────────────────────────────────────── */
.ddbp-target{font-family:Cinzel,serif;color:var(--cx-text-strong);font-size:15px;letter-spacing:.04em;padding:8px 12px;border:1px solid color-mix(in srgb,var(--cx-accent) 30%,transparent);border-radius:8px;background:color-mix(in srgb,var(--cx-accent) 6%,transparent);margin-bottom:4px}
.ddbp-table{width:100%;border-collapse:collapse;margin:10px 0}
.ddbp-table td{padding:6px 8px;border-bottom:1px solid color-mix(in srgb,var(--cx-accent) 14%,transparent);font-family:'EB Garamond',serif;font-size:14px}
.ddbp-k{color:var(--cx-text-dim);font-family:Cinzel,serif;font-size:11px;letter-spacing:.08em;text-transform:uppercase}
.ddbp-old{color:var(--cx-text-dim);text-decoration:line-through}
.ddbp-new{color:var(--cx-text-strong)}
.ddbp-check{display:block;margin:8px 0;color:var(--cx-text-soft);font-family:'EB Garamond',serif;font-size:14px}
.ddbp-check input{margin-right:8px}

/* ── Whiteboards ────────────────────────────────────────────────── */
.wb-wrap{margin:26px 0}
.wb-head{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px;margin-bottom:10px}
.wb-tools{display:flex;align-items:center;gap:10px}
.wb-scroll{overflow:auto;border:1px solid color-mix(in srgb,var(--cx-accent) 22%,transparent);border-radius:12px;background:var(--cx-field);max-height:70vh}
.wb-board{position:relative;background-image:radial-gradient(color-mix(in srgb,var(--cx-accent) 12%,transparent) 1px,transparent 1px);background-size:34px 34px}
.wb-timeline .wb-axis{position:absolute;left:0;right:0;top:50%;height:3px;background:linear-gradient(90deg,transparent,var(--cx-accent) 6%,var(--cx-accent) 94%,transparent);opacity:.65;pointer-events:none}
.wb-empty{position:absolute;left:50%;top:50%;transform:translate(-50%,-60%);color:var(--cx-text-dim);font-family:'EB Garamond',serif;font-size:16px;text-align:center;max-width:420px}
.wb-card{position:absolute;width:220px;background:var(--cx-surface);border:1px solid color-mix(in srgb,var(--cx-accent) 38%,transparent);border-radius:10px;padding:12px 14px;cursor:grab;box-shadow:0 8px 22px rgba(0,0,0,.5);user-select:none;touch-action:none}
.wb-card:active{cursor:grabbing;z-index:10}
.wb-card-label{display:inline-block;background:color-mix(in srgb,var(--cx-accent) 14%,transparent);border:1px solid color-mix(in srgb,var(--cx-accent) 50%,transparent);color:var(--cx-accent);border-radius:20px;font-family:Cinzel,serif;font-size:10px;letter-spacing:.08em;padding:2px 10px;margin-bottom:8px}
.wb-card-img{width:100%;border-radius:7px;margin-bottom:8px;pointer-events:none}
.wb-card-title{color:var(--cx-text-strong);font-family:Cinzel,serif;font-size:14px;letter-spacing:.03em;margin-bottom:5px}
.wb-card-text{color:var(--cx-text-soft);font-family:'EB Garamond',serif;font-size:13px;line-height:1.5;white-space:pre-wrap}
.wb-add-bar{display:flex;justify-content:center;margin:30px 0 6px;padding-top:16px;border-top:1px dashed color-mix(in srgb,var(--cx-accent) 18%,transparent)}
.wb-img-row{display:flex;align-items:center;gap:10px;margin-top:12px}

/* ── Party roster admin ─────────────────────────────────────────── */
.codex-party-list{display:flex;flex-direction:column;gap:8px;margin-top:10px}
.codex-party-row{display:flex;align-items:center;gap:14px;padding:10px 14px;border:1px solid color-mix(in srgb,var(--cx-accent) 22%,transparent);border-radius:9px;background:color-mix(in srgb,var(--cx-accent) 4%,transparent)}
.codex-party-name{flex:1;color:var(--cx-text-strong);font-family:Cinzel,serif;font-size:14px;letter-spacing:.03em}
.codex-party-id{color:var(--cx-text-dim);font-size:12px;font-family:monospace}

/* ── Spell descriptions & damage (DDB import) ───────────────────── */
.spell-entry{margin-bottom:8px}
.spell-damage{width:110px;flex:0 0 110px;color:var(--cx-accent-deep)}
.spell-desc{width:100%;box-sizing:border-box;margin-top:4px;font-size:13px;line-height:1.45;color:var(--cx-accent);background:rgba(0,0,0,.22);border:1px solid color-mix(in srgb,var(--cx-accent) 14%,transparent);border-radius:7px;padding:7px 10px;resize:vertical;min-height:34px}
.spell-desc[readonly]{border-color:transparent;background:transparent;resize:none}

/* ── Theme editor & image uploads ───────────────────────────────── */
.codex-theme-group{margin-top:14px;padding:12px 14px;border:1px solid color-mix(in srgb,var(--cx-accent) 18%,transparent);border-radius:10px}
.codex-theme-group h4{margin:0 0 10px;color:var(--cx-accent-bright);font-family:Cinzel,serif;font-size:13px;letter-spacing:.06em}
.codex-theme-color{display:flex;align-items:center;gap:8px}
.codex-color-input{width:52px;height:34px;padding:2px;cursor:pointer}
.codex-color-input[data-theme-set=""]{opacity:.35}
.codex-image-field{display:flex;gap:8px;align-items:center}
.codex-image-field input{flex:1;min-width:0}

/* ── Atlas pins ─────────────────────────────────────────────────── */
.ap-pin{position:absolute;transform:translate(-50%,-100%);background:none;border:0;cursor:pointer;padding:4px;z-index:6}
.ap-pin-dot{display:block;width:16px;height:16px;margin:0 auto;background:radial-gradient(circle at 35% 30%,var(--cx-accent-bright),var(--cx-accent) 55%,var(--cx-accent-dim));border:2px solid var(--cx-surface);border-radius:50% 50% 50% 0;transform:rotate(-45deg);box-shadow:0 3px 8px rgba(0,0,0,.6)}
.ap-pin:hover .ap-pin-dot{background:radial-gradient(circle at 35% 30%,var(--cx-accent-bright),var(--cx-accent) 55%,var(--cx-accent-deep))}
.ap-pin-label{display:block;margin-top:5px;max-width:130px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;background:color-mix(in srgb,var(--cx-field) 90%,transparent);border:1px solid color-mix(in srgb,var(--cx-accent) 40%,transparent);border-radius:6px;color:var(--cx-text-strong);font-family:Cinzel,serif;font-size:10px;letter-spacing:.05em;padding:2px 7px;opacity:0;transition:opacity .15s;pointer-events:none}
.ap-pin:hover .ap-pin-label{opacity:1}
.ap-tools{position:absolute;top:10px;right:10px;display:flex;gap:8px;z-index:7}
.ap-pinmode{cursor:crosshair}
.ap-pinmode img{cursor:crosshair}
.ap-card-text{color:var(--cx-text-soft);font-family:'EB Garamond',serif;font-size:15px;line-height:1.6;margin-bottom:6px}

/* ── DM Combat Console ──────────────────────────────────────────── */
.dc-section{margin-top:30px}
.dc-head{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px;margin-bottom:12px}
.dc-head-tools{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.dc-round{color:var(--cx-accent);font-family:Cinzel,serif;font-size:13px;letter-spacing:.05em;margin-right:6px}
.dc-list{display:flex;flex-direction:column;gap:6px;margin-bottom:16px}
.dc-row{display:flex;align-items:center;gap:8px;padding:7px 10px;border:1px solid color-mix(in srgb,var(--cx-accent) 18%,transparent);border-radius:8px;background:rgba(0,0,0,.22);flex-wrap:wrap}
.dc-row.active{border-color:var(--cx-accent);background:color-mix(in srgb,var(--cx-accent) 8%,transparent)}
.dc-row.pc .dc-name{color:#a8c8f0}
.dc-turn-mark{width:16px;color:var(--cx-accent);font-size:13px}
.dc-init{width:48px;text-align:center;background:color-mix(in srgb,var(--cx-accent) 8%,transparent);border:1px solid color-mix(in srgb,var(--cx-accent) 30%,transparent);border-radius:6px;color:var(--cx-accent);font-family:Cinzel,serif;font-size:14px;padding:4px 2px}
.dc-name{flex:1;min-width:120px;color:var(--cx-text-strong);font-family:Cinzel,serif;font-size:14px}
.dc-name em{color:#7fa3d8;font-size:10px;font-style:normal;letter-spacing:.08em;margin-left:6px}
.dc-hp{display:flex;align-items:center;gap:3px}
.dc-hpval{width:44px;text-align:center;background:color-mix(in srgb,var(--cx-danger) 10%,transparent);border:1px solid color-mix(in srgb,var(--cx-danger) 35%,transparent);border-radius:6px;color:var(--cx-danger);font-size:13px;padding:4px 2px}
.dc-maxhp{color:var(--cx-text-dim);font-size:12px}
.dc-ac{display:flex;align-items:center;gap:4px;color:var(--cx-text-dim);font-size:11px;font-family:Cinzel,serif}
.dc-acval{width:36px;text-align:center;background:rgba(127,163,216,.08);border:1px solid rgba(127,163,216,.3);border-radius:6px;color:#a8c8f0;font-size:13px;padding:4px 2px}
.dc-notes{flex:2;min-width:120px;background:rgba(0,0,0,.2);border:1px solid color-mix(in srgb,var(--cx-accent) 14%,transparent);border-radius:6px;color:var(--cx-accent);font-size:12px;padding:4px 8px}
.dc-mini{background:color-mix(in srgb,var(--cx-accent) 10%,transparent);border:1px solid color-mix(in srgb,var(--cx-accent) 30%,transparent);border-radius:6px;color:var(--cx-accent);cursor:pointer;font-size:12px;line-height:1;padding:5px 7px}
.dc-mini:hover{background:color-mix(in srgb,var(--cx-accent) 20%,transparent)}
.dc-remove{border-color:color-mix(in srgb,var(--cx-danger) 40%,transparent);color:var(--cx-danger)}
.dc-rollers{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:12px;margin-bottom:14px}
.dc-roller{border:1px solid color-mix(in srgb,var(--cx-accent) 18%,transparent);border-radius:9px;padding:10px 12px}
.dc-roller h4{margin:0 0 8px;color:var(--cx-accent-bright);font-family:Cinzel,serif;font-size:12px;letter-spacing:.06em}
.dc-roller-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.dc-roller-row label{color:var(--cx-text-dim);font-size:11px;font-family:Cinzel,serif}
.dc-small{width:90px;flex:0 0 auto}
.dc-log{max-height:220px;overflow:auto;border:1px solid color-mix(in srgb,var(--cx-accent) 14%,transparent);border-radius:9px;padding:8px 12px;background:rgba(0,0,0,.25)}
.dc-log-row{padding:4px 0;border-bottom:1px solid color-mix(in srgb,var(--cx-accent) 8%,transparent);color:var(--cx-text-soft);font-size:13px;font-family:'EB Garamond',serif}
.dc-log-row:last-child{border-bottom:0}
.dc-log-time{color:var(--cx-text-dim);font-size:11px;margin-right:8px}
.dc-log-detail{color:var(--cx-text-dim);font-size:12px}
.dc-crit{color:var(--cx-accent);font-weight:700}
.dc-hit{color:var(--cx-success);font-weight:700}
.dc-miss{color:var(--cx-danger);font-weight:700}

/* ── Sheet items: quantity + always-on add/delete (v1.5) ────────── */
/* These override the customizer-only visibility so items can be
   managed straight from the standard character sheet. */
.item-delete{display:block !important;color:color-mix(in srgb,var(--cx-danger) 75%,transparent) !important}
.item-delete:hover{color:var(--cx-danger) !important}
.add-item-btn.always-on{display:block !important}
.item-qty{position:absolute;right:34px;top:5px;display:flex;align-items:center;gap:3px;z-index:2}
.item-qty-btn{background:color-mix(in srgb,var(--cx-accent) 12%,transparent);border:1px solid color-mix(in srgb,var(--cx-accent) 35%,transparent);border-radius:6px;color:var(--cx-accent);cursor:pointer;font-size:13px;line-height:1;padding:3px 7px}
.item-qty-btn:hover{background:color-mix(in srgb,var(--cx-accent) 24%,transparent)}
.item-qty-val{width:38px !important;text-align:center;background:rgba(0,0,0,.3) !important;border:1px solid color-mix(in srgb,var(--cx-accent) 25%,transparent) !important;border-radius:6px !important;color:var(--cx-accent) !important;font-family:Cinzel,serif;font-size:13px;padding:3px 2px !important}
.item-entry{position:relative}
.dash-rolls{display:flex;gap:8px;margin:0 10px 8px}
.dash-roll{margin:0 !important;width:100% !important}

/* ── Party inventory: quantity steppers ─────────────────────────── */
.inv-qty-cell{display:flex;align-items:center;gap:5px}
.inv-qty-btn{background:color-mix(in srgb,var(--cx-accent) 12%,transparent);border:1px solid color-mix(in srgb,var(--cx-accent) 35%,transparent);border-radius:6px;color:var(--cx-accent);cursor:pointer;font-size:13px;line-height:1;padding:3px 7px}
.inv-qty-btn:hover{background:color-mix(in srgb,var(--cx-accent) 24%,transparent)}
.inv-qty-val{width:46px;text-align:center;background:rgba(0,0,0,.3);border:1px solid color-mix(in srgb,var(--cx-accent) 25%,transparent);border-radius:6px;color:var(--cx-accent);font-family:Cinzel,serif;font-size:13px;padding:3px 2px}

/* ── Combat console: actions & spells panel ─────────────────────── */
.dc-actions-panel{border:1px solid color-mix(in srgb,var(--cx-accent) 18%,transparent);border-radius:9px;padding:10px 12px;margin-bottom:14px}
.dc-panel-title{margin:0 0 10px;color:var(--cx-accent-bright);font-family:Cinzel,serif;font-size:12px;letter-spacing:.06em}
.dc-act-head{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:10px}
.dc-actor-sel{width:auto;min-width:150px;flex:0 0 auto}
.dc-act-hint{margin-left:auto}
.dc-act-list{display:flex;flex-direction:column;gap:6px}
.dc-act{display:flex;align-items:center;gap:8px;padding:6px 8px;border:1px solid color-mix(in srgb,var(--cx-accent) 14%,transparent);border-radius:7px;background:rgba(0,0,0,.2);flex-wrap:wrap}
.dc-act-name{flex:1;min-width:130px;color:var(--cx-text-strong);font-family:Cinzel,serif;font-size:13px}
.dc-act-name em{color:var(--cx-text-dim);font-size:10px;font-style:normal;letter-spacing:.06em;margin-left:7px;text-transform:uppercase}
.dc-act-roll{width:96px;background:rgba(0,0,0,.3);border:1px solid color-mix(in srgb,var(--cx-accent) 25%,transparent);border-radius:6px;color:var(--cx-accent);font-size:12px;padding:5px 7px}

/* ── Combat console: action editor ──────────────────────────────── */
.dc-edit-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:2px}
.dc-edit-grid .cx-label{margin-top:10px}
.dc-act-desc{display:block;margin-top:3px;color:var(--cx-text-dim);font-family:'EB Garamond',serif;font-size:12px;line-height:1.4;max-height:34px;overflow:hidden}
@media (max-width:640px){.dc-edit-grid{grid-template-columns:1fr}}

/* ── Character sheet: combat editor (players) ───────────────────── */
/* Mirrors #cx-modal's fixed overlay so the sheet editor centers properly. */
#char-ability-modal{position:fixed;inset:0;z-index:10000}
.cae-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.dash-card-actions{display:flex;gap:8px;margin:0 10px 10px}
.dash-edit{border:1px solid color-mix(in srgb,var(--cx-accent) 40%,transparent);background:color-mix(in srgb,var(--cx-accent) 10%,transparent);color:var(--cx-accent-bright);border-radius:9px;padding:6px 9px;cursor:pointer;font-family:Cinzel,serif;font-size:12px}
.dash-edit:hover{background:color-mix(in srgb,var(--cx-accent) 20%,transparent)}
.dash-card-actions .dash-delete{margin:0}
.dash-rolltag{display:inline-block;margin-left:8px;color:var(--cx-accent-deep);font-family:'EB Garamond',serif;font-size:12px;font-weight:400}
.spell-edit{padding:4px 7px;font-size:12px}
@media (max-width:640px){.cae-grid{grid-template-columns:1fr}}

/* ── Combat Mode panel on the character sheet ───────────────────── */
.combat-mode-panel{margin-bottom:22px;border:1px solid color-mix(in srgb,var(--cx-accent) 28%,transparent);border-radius:12px;background:rgba(0,0,0,.22);overflow:hidden}
.combat-mode-summary{cursor:pointer;list-style:none;padding:14px 18px;color:var(--cx-accent);font-family:Cinzel,serif;font-size:15px;letter-spacing:.06em;user-select:none}
.combat-mode-summary::-webkit-details-marker{display:none}
.combat-mode-summary:hover{background:color-mix(in srgb,var(--cx-accent) 7%,transparent)}
.combat-mode-summary::after{content:"\25be";float:right;transition:transform .2s}
.combat-mode-panel[open] .combat-mode-summary::after{transform:rotate(180deg)}
.combat-mode-panel[open] .combat-mode-summary{border-bottom:1px solid color-mix(in srgb,var(--cx-accent) 20%,transparent)}
.combat-mode-hint{color:var(--cx-text-dim);font-family:'EB Garamond',serif;font-size:13px;letter-spacing:0;margin-left:10px}
.combat-mode-panel .divine-os-shell{padding:16px 18px}

/* ── deploy132: Atlas map text readability ─────────────────────────
   Pin labels, tooltips, popups, and map controls now sit on a small
   padded ink plate (dark translucent, thin brass rule) so they read
   on both bright parchment maps and dark ones. One restrained
   treatment shared by every map text element — no glow, no large
   opaque boxes. */
.wiki-pin-label{
  left:20px;top:-4px;font-size:12.5px;letter-spacing:.03em;color:var(--cx-accent-bright);
  background:color-mix(in srgb,var(--cx-field) 82%,transparent);border:1px solid color-mix(in srgb,var(--cx-accent) 45%,transparent);
  border-radius:6px;padding:2px 8px;line-height:1.3;
  text-shadow:0 1px 2px rgba(0,0,0,.9);
  box-shadow:0 1px 4px rgba(0,0,0,.5);
  max-width:180px;overflow:hidden;text-overflow:ellipsis;
}
.ap-pin-label{
  font-size:12px;color:var(--cx-accent-bright);background:color-mix(in srgb,var(--cx-field) 88%,transparent);
  border-color:color-mix(in srgb,var(--cx-accent) 50%,transparent);max-width:160px;padding:3px 9px;
  text-shadow:0 1px 2px rgba(0,0,0,.9);
}
/* Leaflet tooltips (hover names) match the pin-label plate */
.leaflet-tooltip{
  background:color-mix(in srgb,var(--cx-field) 88%,transparent);border:1px solid color-mix(in srgb,var(--cx-accent) 45%,transparent);
  color:var(--cx-accent-bright);font-family:Cinzel,serif;font-size:12.5px;letter-spacing:.03em;
  border-radius:6px;padding:3px 9px;box-shadow:0 1px 4px rgba(0,0,0,.5);
}
.leaflet-tooltip-top:before,.leaflet-tooltip-bottom:before,
.leaflet-tooltip-left:before,.leaflet-tooltip-right:before{display:none}
/* Popups: brighter body text at a readable size */
.leaflet-popup-content-wrapper{font-size:13.5px;color:var(--cx-accent-bright)}
/* Zoom controls: dark plates with brass glyphs instead of var(--cx-text-strong) chrome */
.leaflet-control-zoom a{
  background:color-mix(in srgb,var(--cx-field) 92%,transparent) !important;color:var(--cx-accent) !important;
  border:1px solid color-mix(in srgb,var(--cx-accent) 40%,transparent) !important;
}
.leaflet-control-zoom a:hover{background:color-mix(in srgb,var(--cx-surface) 95%,transparent) !important;color:var(--cx-accent-bright) !important}
/* Map selector bar + hint text: readable baseline */
.wiki-map-hint{font-size:13px;opacity:.8}

/* ── deploy133: Spell Compendium admin panel ───────────────────────── */
.cx-comp-card{margin-top:10px}
.cx-comp-head{display:flex;align-items:center;flex-wrap:wrap;gap:8px;font-size:15px}
.cx-comp-tag{font-family:Cinzel,serif;font-size:10.5px;letter-spacing:.05em;border-radius:6px;padding:1px 8px;white-space:nowrap}
.cx-comp-tag.camp{color:var(--cx-accent);border:1px solid color-mix(in srgb,var(--cx-accent) 50%,transparent);background:color-mix(in srgb,var(--cx-accent) 8%,transparent)}
.cx-comp-tag.pending{color:var(--cx-accent);border:1px dashed color-mix(in srgb,var(--cx-accent) 55%,transparent);background:color-mix(in srgb,var(--cx-accent) 5%,transparent)}
.cx-comp-tag.dup{color:var(--cx-accent);border:1px solid color-mix(in srgb,var(--cx-accent) 50%,transparent);background:color-mix(in srgb,var(--cx-accent) 8%,transparent)}
.cx-comp-desc{font-size:13.5px;color:var(--cx-accent-bright);margin:6px 0;line-height:1.5}
.cx-comp-toggle{display:inline-flex;align-items:center;gap:6px;margin-right:12px;cursor:pointer}
.cx-comp-setting{margin:12px 0}
.cx-comp-filter{max-width:280px}
.cx-comp-editform{border-top:1px solid color-mix(in srgb,var(--cx-accent) 20%,transparent);margin-top:12px;padding-top:12px}
.cx-comp-scanrow{display:block;padding:5px 0;border-bottom:1px solid color-mix(in srgb,var(--cx-accent) 10%,transparent);font-size:14px}

/* ── deploy134: Hierarchical Atlas navigation ──────────────────────
   Restrained toolbar under the map chips: breadcrumbs on an ink rule,
   compact brass-edged controls, small type tag. Nothing floats over
   the map itself. */
.atlas-nav{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px;margin:2px 0 8px;padding:7px 10px;background:color-mix(in srgb,var(--cx-field) 55%,transparent);border:1px solid color-mix(in srgb,var(--cx-accent) 22%,transparent);border-radius:8px}
.atlas-crumbs{display:flex;align-items:center;flex-wrap:wrap;gap:4px;min-width:0}
.atlas-crumb{background:none;border:none;padding:2px 4px;cursor:pointer;font-family:Cinzel,serif;font-size:13px;letter-spacing:.02em;color:var(--cx-accent-bright);border-radius:4px}
.atlas-crumb:hover{color:var(--cx-accent);text-decoration:underline}
.atlas-crumb:focus-visible{outline:2px solid var(--cx-accent);outline-offset:1px}
.atlas-crumb.current{color:var(--cx-accent-bright);font-weight:600;cursor:default}
.atlas-crumb-sep{color:color-mix(in srgb,var(--cx-accent) 55%,transparent);font-size:12px}
.atlas-type-tag{font-family:Cinzel,serif;font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--cx-accent);border:1px solid color-mix(in srgb,var(--cx-accent) 45%,transparent);border-radius:6px;padding:1px 8px;margin-left:8px;white-space:nowrap}
.atlas-type-tag.small{font-size:9.5px;padding:0 6px;margin-left:6px;opacity:.85}
.atlas-nav-actions{display:flex;align-items:center;flex-wrap:wrap;gap:6px}
.atlas-navbtn{font-family:Cinzel,serif;font-size:12px;letter-spacing:.02em;color:var(--cx-text);background:color-mix(in srgb,var(--cx-text-strong) 3%,transparent);border:1px solid color-mix(in srgb,var(--cx-accent) 30%,transparent);border-radius:7px;padding:4px 10px;cursor:pointer;white-space:nowrap}
.atlas-navbtn:hover{border-color:var(--cx-accent);color:var(--cx-accent-bright)}
.atlas-navbtn:focus-visible{outline:2px solid var(--cx-accent);outline-offset:2px}
.atlas-navbtn.active{background:color-mix(in srgb,var(--cx-accent) 14%,transparent);border-color:color-mix(in srgb,var(--cx-accent) 60%,transparent);color:var(--cx-accent)}
/* toolbar map search */
.atlas-mapsearch-wrap{position:relative;display:inline-block}
.atlas-mapsearch{width:150px;font-size:13px;padding:4px 9px;background:rgba(0,0,0,.35);border:1px solid color-mix(in srgb,var(--cx-accent) 28%,transparent);border-radius:7px;color:var(--cx-text)}
.atlas-mapsearch:focus{outline:none;border-color:var(--cx-accent)}
.atlas-mapsearch-results{position:absolute;top:calc(100% + 4px);right:0;z-index:900;min-width:240px;max-height:280px;overflow:auto;background:var(--cx-surface);border:1px solid color-mix(in srgb,var(--cx-accent) 40%,transparent);border-radius:8px;box-shadow:0 8px 30px rgba(0,0,0,.6)}
.atlas-mapsearch-item{display:block;width:100%;text-align:left;background:none;border:none;border-bottom:1px solid color-mix(in srgb,var(--cx-accent) 12%,transparent);padding:7px 10px;cursor:pointer}
.atlas-mapsearch-item:hover{background:color-mix(in srgb,var(--cx-accent) 8%,transparent)}
.atlas-mapsearch-item strong{display:block;font-family:Cinzel,serif;font-size:13px;color:var(--cx-accent-bright)}
.atlas-mapsearch-item span{display:block;font-size:11.5px;color:var(--cx-text-soft)}
/* empty (no-image) map state — handcrafted folio placeholder */
.atlas-empty-map{border:1px dashed color-mix(in srgb,var(--cx-accent) 40%,transparent);border-radius:10px;background:linear-gradient(165deg,color-mix(in srgb,var(--cx-field) 70%,transparent),color-mix(in srgb,var(--cx-field) 85%,transparent));padding:44px 26px;text-align:center;margin-bottom:8px}
.atlas-empty-title{font-family:Cinzel,serif;font-size:22px;letter-spacing:.05em;color:var(--cx-accent-bright)}
.atlas-empty-sub{font-family:Cinzel,serif;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--cx-accent);margin:4px 0 10px}
.atlas-empty-note{font-family:'EB Garamond',serif;font-size:14.5px;color:var(--cx-accent-bright);max-width:520px;margin:0 auto 16px;line-height:1.55}
/* tree dialog */
.atlas-dialog.wide{max-width:560px}
.atlas-tree{max-height:46vh;overflow:auto;margin:10px 0;border:1px solid color-mix(in srgb,var(--cx-accent) 18%,transparent);border-radius:8px;padding:8px}
.atlas-tree-row{display:flex;align-items:center;gap:6px;padding:3px 4px;border-bottom:1px solid color-mix(in srgb,var(--cx-accent) 8%,transparent)}
.atlas-tree-open{background:none;border:none;cursor:pointer;font-family:Cinzel,serif;font-size:13.5px;color:var(--cx-text);padding:2px 4px;text-align:left}
.atlas-tree-open:hover{color:var(--cx-accent);text-decoration:underline}
.atlas-tree-noimg{font-size:10.5px;color:var(--cx-text-soft);border:1px dashed color-mix(in srgb,var(--cx-accent) 50%,transparent);border-radius:5px;padding:0 6px}
.atlas-tree-fix{margin-left:auto;font-size:11px;padding:2px 8px}
.atlas-orphan-title{margin-top:14px;font-size:15px}
/* settings + delete dialogs */
.atlas-settings-row{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}
.atlas-danger-row{border-top:1px solid color-mix(in srgb,var(--cx-accent) 15%,transparent);padding-top:12px}
.atlas-delete-actions{flex-direction:column;align-items:stretch;gap:8px}
.atlas-delete-actions .cx-btn{text-align:center}
.atlas-delete-actions small{font-weight:normal;opacity:.75}
.atlas-newchild-btn{margin-top:6px;font-size:12.5px}
/* pins that enter another map get a doorway accent */
.wiki-pin-map{border-color:var(--cx-accent);box-shadow:0 0 0 2px color-mix(in srgb,var(--cx-accent) 25%,transparent)}
.wiki-pin-enter{color:var(--cx-accent)}
.atlas-broken{color:var(--cx-danger);font-size:12px}
@media(max-width:640px){
  .atlas-nav{flex-direction:column;align-items:stretch}
  .atlas-nav-actions{justify-content:flex-start}
  .atlas-mapsearch{width:100%;min-width:160px}
  .atlas-mapsearch-wrap{flex:1}
}

/* ── deploy135: Persistent Global Search (top banner, right side) ───
   Same ink/brass folio language: charcoal field, thin brass rule,
   folio result rows, no glow, no glass, compact footprint. */
#gs-root{display:flex;align-items:center;margin-left:auto;padding:0 12px;position:relative;flex-shrink:0}
#gs-field{position:relative;width:230px}
#gs-input{width:100%;font-family:'EB Garamond',serif;font-size:13.5px;color:var(--cx-text);background:rgba(0,0,0,.35);border:1px solid color-mix(in srgb,var(--cx-accent) 28%,transparent);border-radius:7px;padding:6px 11px;outline:none}
#gs-input:focus{border-color:var(--cx-accent)}
#gs-input::placeholder{color:var(--cx-text-dim)}
#gs-mobile-btn{display:none;background:none;border:1px solid color-mix(in srgb,var(--cx-accent) 30%,transparent);border-radius:7px;color:var(--cx-text);width:34px;height:34px;cursor:pointer;align-items:center;justify-content:center}
#gs-mobile-btn:hover{border-color:var(--cx-accent);color:var(--cx-accent)}
#gs-results{position:absolute;top:calc(100% + 6px);right:12px;width:min(430px,92vw);max-height:min(65vh,540px);overflow-y:auto;background:var(--cx-field);border:1px solid color-mix(in srgb,var(--cx-accent) 40%,transparent);border-radius:9px;box-shadow:0 10px 40px rgba(0,0,0,.65);z-index:950}
.gs-row{display:block;width:100%;text-align:left;background:none;border:none;border-bottom:1px solid color-mix(in srgb,var(--cx-accent) 12%,transparent);padding:9px 13px;cursor:pointer}
.gs-row:hover,.gs-row.sel{background:color-mix(in srgb,var(--cx-accent) 8%,transparent)}
.gs-row:focus-visible{outline:2px solid var(--cx-accent);outline-offset:-2px}
.gs-row-top{display:flex;align-items:baseline;justify-content:space-between;gap:10px}
.gs-title{font-family:Cinzel,serif;font-size:14px;color:var(--cx-accent-bright);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gs-type{font-family:Cinzel,serif;font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:var(--cx-accent);border:1px solid color-mix(in srgb,var(--cx-accent) 40%,transparent);border-radius:5px;padding:1px 7px;white-space:nowrap;flex-shrink:0}
.gs-crumb{display:block;font-family:'EB Garamond',serif;font-size:12px;color:var(--cx-text-soft);margin-top:1px}
.gs-excerpt{display:block;font-family:'EB Garamond',serif;font-size:13px;color:var(--cx-accent-bright);margin-top:2px;line-height:1.4;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.gs-hl{background:color-mix(in srgb,var(--cx-accent) 28%,transparent);color:var(--cx-accent-bright);border-radius:2px;padding:0 1px}
.gs-empty{font-family:'EB Garamond',serif;font-size:13.5px;color:var(--cx-text-soft);padding:14px}
.gs-more{display:block;width:100%;background:none;border:none;border-bottom:1px solid color-mix(in srgb,var(--cx-accent) 12%,transparent);color:var(--cx-accent);font-family:Cinzel,serif;font-size:12px;letter-spacing:.04em;padding:8px;cursor:pointer}
.gs-more:hover{background:color-mix(in srgb,var(--cx-accent) 8%,transparent)}
.gs-external{padding:8px 13px 10px;border-top:1px solid color-mix(in srgb,var(--cx-accent) 25%,transparent);background:rgba(0,0,0,.25)}
.gs-external>span{display:block;font-family:Cinzel,serif;font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--cx-text-dim);margin-bottom:4px}
.gs-o5e{background:none;border:none;color:var(--cx-accent-bright);font-family:'EB Garamond',serif;font-size:13px;cursor:pointer;padding:0;text-align:left}
.gs-o5e:hover{color:var(--cx-accent);text-decoration:underline}
.gs-flash{outline:2px solid color-mix(in srgb,var(--cx-accent) 75%,transparent);outline-offset:3px;border-radius:6px;transition:outline-color 1.6s ease}
@media(max-width:900px){
  #gs-field{display:none}
  #gs-mobile-btn{display:inline-flex}
  #gs-root{padding:0 56px 0 8px} /* clear the hamburger */
  #gs-root.gs-mobile-open #gs-field{display:block;position:fixed;top:58px;left:0;right:0;width:auto;padding:10px 12px;background:var(--cx-field);border-bottom:1px solid color-mix(in srgb,var(--cx-accent) 35%,transparent);z-index:940}
  #gs-root.gs-mobile-open #gs-results{position:fixed;top:112px;left:0;right:0;width:auto;max-height:calc(100vh - 112px - 60px);border-radius:0 0 9px 9px} /* leaves the bottom combat tab bar clear */
  .gs-row{padding:12px 14px} /* comfortable tap targets */
}

/* ── deploy135: Atlas Lore panel — an explorer's folio beside the map ──
   The map keeps the visual lead; lore sits in a restrained ink column
   with thin brass rules, editorial headings, and parchment-toned text. */
.atlas-layout{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:14px;align-items:start}
.atlas-map-col{min-width:0}
.atlas-lore{background:linear-gradient(170deg,color-mix(in srgb,var(--cx-field) 72%,transparent),color-mix(in srgb,var(--cx-field) 85%,transparent));border:1px solid color-mix(in srgb,var(--cx-accent) 24%,transparent);border-radius:9px;padding:0;overflow:hidden}
.atlas-lore-head{padding:13px 15px 11px;border-bottom:1px solid color-mix(in srgb,var(--cx-accent) 22%,transparent)}
.atlas-lore-title{font-family:Cinzel,serif;font-size:19px;letter-spacing:.05em;color:var(--cx-accent-bright);margin:0 0 3px}
.atlas-lore-meta{font-family:Cinzel,serif;font-size:11px;letter-spacing:.05em;text-transform:uppercase;color:var(--cx-accent);margin-bottom:6px}
.atlas-lore-desc{font-family:'EB Garamond',serif;font-size:14.5px;line-height:1.55;color:var(--cx-accent-bright)}
.atlas-lore-desc p{margin:0 0 6px}
.atlas-lore-editbtn{margin-top:8px}
.atlas-lore-scroll{padding:6px 15px 14px}
.atlas-lore-sec{padding:10px 0 4px;border-bottom:1px solid color-mix(in srgb,var(--cx-accent) 13%,transparent)}
.atlas-lore-sec:last-child{border-bottom:none}
.atlas-lore-h{font-family:Cinzel,serif;font-size:13px;letter-spacing:.07em;text-transform:uppercase;color:var(--cx-accent);margin:0 0 5px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.atlas-dm-tag{font-size:10px;letter-spacing:.05em;color:var(--cx-accent);border:1px dashed color-mix(in srgb,var(--cx-accent) 50%,transparent);border-radius:5px;padding:0 6px;text-transform:none}
.atlas-lore-body{font-family:'EB Garamond',serif;font-size:14.5px;line-height:1.6;color:var(--cx-accent-bright)}
.atlas-lore-body p{margin:0 0 8px}
.atlas-lore-empty{font-family:'EB Garamond',serif;font-size:14px;color:var(--cx-text-soft);text-align:center;padding:26px 8px;line-height:1.6}
.atlas-lore-empty span{font-size:13px;opacity:.8}
.atlas-subpages{display:flex;flex-wrap:wrap;gap:6px;margin:2px 0 8px}
.atlas-subpage{font-family:'EB Garamond',serif;font-size:13.5px;color:var(--cx-accent-bright);background:color-mix(in srgb,var(--cx-accent) 6%,transparent);border:1px solid color-mix(in srgb,var(--cx-accent) 30%,transparent);border-radius:6px;padding:3px 10px;cursor:pointer}
.atlas-subpage:hover{border-color:var(--cx-accent);color:var(--cx-accent-bright)}
.atlas-subpage:focus-visible{outline:2px solid var(--cx-accent);outline-offset:2px}
.atlas-subpage.broken{border-style:dashed;color:var(--cx-text-soft);cursor:default}
/* editor */
.atlas-le-h{font-size:14px;margin-top:16px}
.atlas-le-field{margin:10px 0}
.atlas-le-fieldhead{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:4px}
.atlas-le-mini{font-family:Cinzel,serif;font-size:10.5px;letter-spacing:.03em;color:var(--cx-accent-bright);background:color-mix(in srgb,var(--cx-text-strong) 3%,transparent);border:1px solid color-mix(in srgb,var(--cx-accent) 30%,transparent);border-radius:6px;padding:2px 9px;cursor:pointer;min-height:26px}
.atlas-le-mini:hover{border-color:var(--cx-accent);color:var(--cx-accent)}
.atlas-le-mini:focus-visible{outline:2px solid var(--cx-accent);outline-offset:1px}
.atlas-le-mini.danger:hover{border-color:var(--cx-danger);color:var(--cx-danger)}
.atlas-le-chips{display:flex;flex-wrap:wrap;gap:7px;margin:8px 0}
.atlas-le-chip{font-family:Cinzel,serif;font-size:11.5px;color:var(--cx-accent);background:color-mix(in srgb,var(--cx-accent) 7%,transparent);border:1px solid color-mix(in srgb,var(--cx-accent) 35%,transparent);border-radius:7px;padding:4px 11px;cursor:pointer;margin-top:6px}
.atlas-le-chip:hover{border-color:var(--cx-accent);background:color-mix(in srgb,var(--cx-accent) 12%,transparent)}
.atlas-le-hiddenrow{font-family:'EB Garamond',serif;font-size:13px;color:var(--cx-text-soft);padding:5px 0;display:flex;align-items:center;gap:8px}
.atlas-le-section{border:1px solid color-mix(in srgb,var(--cx-accent) 18%,transparent);border-radius:8px;padding:9px 11px;margin:9px 0}
.atlas-le-section.is-hidden{opacity:.7}
.atlas-le-title{font-family:Cinzel,serif;letter-spacing:.03em;flex:1;min-width:0}
.atlas-le-secctrls{display:flex;align-items:center;gap:5px;flex-shrink:0}
.atlas-le-secret{display:inline-flex;align-items:center;gap:3px;font-size:12px;color:var(--cx-accent);cursor:pointer}
.atlas-le-subrow{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:7px}
.atlas-le-sub{font-family:'EB Garamond',serif;font-size:13px;color:var(--cx-accent-bright);border:1px solid color-mix(in srgb,var(--cx-accent) 25%,transparent);border-radius:6px;padding:2px 8px;display:inline-flex;align-items:center;gap:5px}
.cx-hint-inline{font-family:'EB Garamond',serif;font-size:12px;color:var(--cx-text-soft);letter-spacing:0;text-transform:none}
@media(max-width:1100px){
  .atlas-layout{grid-template-columns:1fr} /* map first, lore stacks beneath */
  .atlas-lore{max-width:none}
  .atlas-le-mini{min-height:34px;padding:4px 12px} /* tap targets */
  .atlas-subpage{padding:7px 12px}
}

/* ── deploy136: internal @-links ────────────────────────────────────
   Links read as ink annotations: brass underline, no button chrome.
   Broken targets fade to a dotted quiet state — never an error shout. */
.codex-link{color:var(--cx-accent);text-decoration:none;border-bottom:1px solid color-mix(in srgb,var(--cx-accent) 45%,transparent);cursor:pointer;transition:color .12s,border-color .12s}
.codex-link:hover{color:var(--cx-accent-bright);border-bottom-color:var(--cx-accent-bright)}
.codex-link:focus-visible{outline:2px solid var(--cx-accent);outline-offset:2px;border-radius:2px}
.codex-link.is-broken{color:var(--cx-text-soft);border-bottom:1px dotted color-mix(in srgb,var(--cx-accent) 60%,transparent);cursor:help}
/* mention menu */
#codex-mention-menu{position:fixed;z-index:2147483000;width:320px;max-height:300px;overflow-y:auto;background:var(--cx-field);border:1px solid color-mix(in srgb,var(--cx-accent) 40%,transparent);border-radius:9px;box-shadow:0 10px 40px rgba(0,0,0,.65)}
#codex-mention-menu[hidden]{display:none}
.cl-row{display:block;width:100%;text-align:left;background:none;border:none;border-bottom:1px solid color-mix(in srgb,var(--cx-accent) 12%,transparent);padding:8px 12px;cursor:pointer;min-height:40px}
.cl-row:hover,.cl-row.sel{background:color-mix(in srgb,var(--cx-accent) 8%,transparent)}
.cl-row-top{display:flex;align-items:baseline;justify-content:space-between;gap:10px}
.cl-title{font-family:Cinzel,serif;font-size:13.5px;color:var(--cx-accent-bright);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cl-type{font-family:Cinzel,serif;font-size:9.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--cx-accent);border:1px solid color-mix(in srgb,var(--cx-accent) 40%,transparent);border-radius:5px;padding:1px 6px;white-space:nowrap;flex-shrink:0}
.cl-crumb{display:block;font-family:'EB Garamond',serif;font-size:12px;color:var(--cx-text-soft);margin-top:1px}
.cl-hint{font-family:'EB Garamond',serif;font-size:13px;color:var(--cx-text-soft);padding:10px 12px}
@media(max-width:640px){#codex-mention-menu{width:calc(100vw - 16px);left:8px !important}}

/* ── deploy137: NPC portraits on the campaign cards ─────────────── */
.npc-card-head{display:flex;align-items:flex-start;gap:14px}
.npc-card-main{flex:1;min-width:0}
.npc-portrait{position:relative;width:72px;height:72px;flex-shrink:0;border-radius:11px;overflow:hidden;border:2px solid color-mix(in srgb,var(--cx-accent) 50%,transparent);background:var(--cx-surface);display:flex;align-items:center;justify-content:center}
.npc-portrait img{width:100%;height:100%;object-fit:cover;display:block}
.npc-portrait-initial{font-family:Cinzel,serif;font-size:28px;color:var(--cx-accent)}
.npc-portrait.editable{cursor:pointer}
.npc-portrait.editable:hover{border-color:var(--cx-accent)}
.npc-portrait.editable:focus-visible{outline:2px solid var(--cx-accent);outline-offset:2px}
.npc-portrait-hint{position:absolute;right:2px;bottom:2px;width:20px;height:20px;border-radius:6px;background:color-mix(in srgb,var(--cx-field) 85%,transparent);border:1px solid color-mix(in srgb,var(--cx-accent) 50%,transparent);color:var(--cx-accent);font-size:12px;display:flex;align-items:center;justify-content:center;pointer-events:none}
.npc-portrait-remove{align-self:flex-start;background:none;border:1px solid color-mix(in srgb,var(--cx-danger) 50%,transparent);border-radius:6px;color:var(--cx-danger);width:24px;height:24px;cursor:pointer;font-size:11px;margin-left:-8px}
.npc-portrait-remove:hover{border-color:var(--cx-danger);background:color-mix(in srgb,var(--cx-danger) 10%,transparent)}
@media(max-width:640px){.npc-portrait{width:60px;height:60px}}

/* ── deploy137: NPC Web workspace expansion ─────────────────────────
   Large pan/zoom canvas, filter chips, search, inspector panel, focus
   view. Same ink-and-brass board language — no glow, no dashboard. */
.nw-chips{display:flex;flex-wrap:wrap;gap:7px;align-items:center}
.nw-chip{display:inline-flex;align-items:center;gap:6px;font-family:Cinzel,serif;font-size:11px;letter-spacing:.04em;color:var(--cx-text-dim);background:color-mix(in srgb,var(--cx-text-strong) 2%,transparent);border:1px solid color-mix(in srgb,var(--cx-accent-deep) 35%,transparent);border-radius:7px;padding:4px 10px;cursor:pointer;min-height:30px}
.nw-chip.on{color:var(--cx-text);border-color:color-mix(in srgb,var(--cx-accent) 50%,transparent);background:color-mix(in srgb,var(--cx-accent) 7%,transparent)}
.nw-chip:hover{border-color:var(--cx-accent)}
.nw-chip:focus-visible,.nw-zbtn:focus-visible{outline:2px solid var(--cx-accent);outline-offset:2px}
.nw-tools{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.nw-searchwrap{position:relative}
.nw-search{font-family:'EB Garamond',serif;font-size:13.5px;color:var(--cx-text);background:rgba(0,0,0,.35);border:1px solid color-mix(in srgb,var(--cx-accent) 28%,transparent);border-radius:7px;padding:6px 10px;width:170px;outline:none}
.nw-search:focus{border-color:var(--cx-accent)}
.nw-search-results{position:absolute;top:calc(100% + 5px);left:0;width:260px;max-height:280px;overflow-y:auto;background:var(--cx-field);border:1px solid color-mix(in srgb,var(--cx-accent) 40%,transparent);border-radius:9px;box-shadow:0 10px 34px rgba(0,0,0,.6);z-index:960}
.nw-sr-row{display:block;width:100%;text-align:left;background:none;border:none;border-bottom:1px solid color-mix(in srgb,var(--cx-accent) 12%,transparent);padding:9px 12px;cursor:pointer}
.nw-sr-row:hover{background:color-mix(in srgb,var(--cx-accent) 8%,transparent)}
.nw-sr-name{display:block;font-family:Cinzel,serif;font-size:13px;color:var(--cx-accent-bright)}
.nw-sr-tag{display:block;font-family:'EB Garamond',serif;font-size:12px;color:var(--cx-text-soft)}
.nw-sr-none{font-family:'EB Garamond',serif;font-size:13px;color:var(--cx-text-dim);padding:10px 12px}
.nw-zoomgroup{display:inline-flex;align-items:center;gap:2px;border:1px solid color-mix(in srgb,var(--cx-accent) 30%,transparent);border-radius:7px;padding:2px}
.nw-zbtn{font-family:Cinzel,serif;font-size:13px;color:var(--cx-text);background:none;border:none;border-radius:5px;min-width:30px;min-height:30px;cursor:pointer;padding:2px 8px}
.nw-zbtn:hover{background:color-mix(in srgb,var(--cx-accent) 10%,transparent);color:var(--cx-accent)}
.nw-zbtn.wide{border:1px solid color-mix(in srgb,var(--cx-accent) 30%,transparent);font-size:11.5px;letter-spacing:.03em}
.nw-zoomlevel{font-family:'EB Garamond',serif;font-size:12.5px;color:var(--cx-text-dim);min-width:42px;text-align:center}
/* the big board */
.nw-stage{display:grid;grid-template-columns:1fr;gap:12px}
.nw-stage.has-inspector{grid-template-columns:minmax(0,1fr) 300px}
.nw-canvas{min-height:calc(100vh - 320px);height:calc(100vh - 320px);position:relative;cursor:grab;touch-action:none}
.nw-canvas:active{cursor:grabbing}
.nw-canvas svg{width:100%;height:100%;display:block}
.nw-node .nw-flash rect,.nw-node.nw-flash rect{stroke:var(--cx-accent-bright);stroke-width:4}
/* inspector */
.nw-inspector{position:relative;background:linear-gradient(170deg,color-mix(in srgb,var(--cx-field) 72%,transparent),color-mix(in srgb,var(--cx-field) 85%,transparent));border:1px solid color-mix(in srgb,var(--cx-accent) 24%,transparent);border-radius:11px;padding:16px 15px;max-height:calc(100vh - 320px);overflow-y:auto}
.nw-ins-close{position:absolute;top:8px;right:8px;background:none;border:1px solid color-mix(in srgb,var(--cx-accent) 30%,transparent);border-radius:6px;color:var(--cx-text-dim);width:26px;height:26px;cursor:pointer}
.nw-ins-close:hover{color:var(--cx-accent);border-color:var(--cx-accent)}
.nw-ins-head{display:flex;gap:12px;align-items:flex-start;margin-bottom:10px}
.nw-ins-portrait{width:64px;height:64px;border-radius:11px;overflow:hidden;border:2px solid color-mix(in srgb,var(--cx-accent) 50%,transparent);background:var(--cx-surface);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.nw-ins-portrait img{width:100%;height:100%;object-fit:cover}
.nw-ins-portrait span{font-family:Cinzel,serif;font-size:26px;color:var(--cx-accent)}
.nw-ins-name{font-family:Cinzel,serif;font-size:16.5px;color:var(--cx-accent-bright);line-height:1.25}
.nw-ins-tag{font-family:'EB Garamond',serif;font-size:13px;color:var(--cx-text-soft);margin-top:2px}
.nw-ins-status{display:inline-block;font-family:Cinzel,serif;font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:var(--cx-success);border:1px solid color-mix(in srgb,var(--cx-success) 45%,transparent);border-radius:5px;padding:1px 7px;margin-top:5px}
.nw-ins-status.dead{color:var(--cx-danger);border-color:color-mix(in srgb,var(--cx-danger) 50%,transparent)}
.nw-ins-desc{font-family:'EB Garamond',serif;font-size:14px;line-height:1.55;color:var(--cx-accent-bright);border-top:1px solid color-mix(in srgb,var(--cx-accent) 15%,transparent);padding-top:9px}
.nw-ins-desc p{margin:0 0 7px}
.nw-ins-h{font-family:Cinzel,serif;font-size:11.5px;letter-spacing:.07em;text-transform:uppercase;color:var(--cx-accent);margin:12px 0 6px;border-top:1px solid color-mix(in srgb,var(--cx-accent) 15%,transparent);padding-top:10px}
.nw-ins-conn{display:flex;align-items:center;gap:8px;width:100%;text-align:left;background:none;border:none;border-bottom:1px solid color-mix(in srgb,var(--cx-accent) 10%,transparent);padding:7px 2px;cursor:pointer;min-height:36px}
.nw-ins-conn:hover .nw-ins-conn-name{color:var(--cx-accent)}
.nw-ins-conn-name{font-family:'EB Garamond',serif;font-size:14.5px;color:var(--cx-text);flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.nw-ins-conn-type{font-family:Cinzel,serif;font-size:9.5px;letter-spacing:.05em;text-transform:uppercase;color:var(--cx-text-dim)}
.nw-ins-none{font-family:'EB Garamond',serif;font-size:13.5px;color:var(--cx-text-dim);padding:4px 0}
.nw-ins-actions{display:flex;flex-direction:column;gap:7px;margin-top:12px;border-top:1px solid color-mix(in srgb,var(--cx-accent) 15%,transparent);padding-top:12px}
/* focus view: fill the app viewport below the 58px bar — pure CSS, no
   Fullscreen API, no coordinate writes */
#npcweb-root.nw-focus{position:fixed;top:58px;left:0;right:0;bottom:0;z-index:920;background:var(--cx-field);padding:10px 12px calc(10px + env(safe-area-inset-bottom));overflow-y:auto}
#npcweb-root.nw-focus .nw-canvas,#npcweb-root.nw-focus .nw-inspector{height:calc(100vh - 58px - 130px);min-height:calc(100vh - 58px - 130px);max-height:none}
body.nw-focus-open{overflow:hidden}
@media (max-width:760px){
  .nw-canvas{min-height:62vh;height:62vh}
  .nw-stage.has-inspector{grid-template-columns:1fr}
  .nw-inspector{max-height:44vh}
  .nw-search{width:130px}
  .nw-chip,.nw-zbtn{min-height:38px} /* tap targets */
  #npcweb-root.nw-focus .nw-canvas{height:calc(100vh - 58px - 170px);min-height:calc(100vh - 58px - 170px)}
}
/* override the legacy fixed-aspect sizing: the svg now fills the canvas */
#nw-svg{height:100%;width:100%}

/* ── deploy138: NPC directory — toolbar, collapsible rows, badges ── */
.npcs-add-top{margin-right:8px}
.npc-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:2px 0 14px;padding:9px 11px;border:1px solid color-mix(in srgb,var(--cx-accent) 20%,transparent);border-radius:10px;background:rgba(0,0,0,.22)}
.npc-tool{display:inline-flex;align-items:center;gap:6px}
.npc-tool-label{font-family:Cinzel,serif;font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--cx-text-dim)}
.npc-tool-select{font-family:'EB Garamond',serif;font-size:13.5px;color:var(--cx-text);background:var(--cx-surface);border:1px solid color-mix(in srgb,var(--cx-accent) 30%,transparent);border-radius:7px;padding:5px 8px;min-height:32px}
.npc-tool-search{font-family:'EB Garamond',serif;font-size:13.5px;color:var(--cx-text);background:rgba(0,0,0,.35);border:1px solid color-mix(in srgb,var(--cx-accent) 28%,transparent);border-radius:7px;padding:6px 10px;flex:1;min-width:150px;outline:none}
.npc-tool-search:focus{border-color:var(--cx-accent)}
.npc-tool-chip{font-family:Cinzel,serif;font-size:11px;letter-spacing:.04em;color:var(--cx-text-dim);background:color-mix(in srgb,var(--cx-text-strong) 2%,transparent);border:1px solid color-mix(in srgb,var(--cx-accent-deep) 35%,transparent);border-radius:7px;padding:5px 11px;cursor:pointer;min-height:32px}
.npc-tool-chip.on{color:var(--cx-accent);border-color:color-mix(in srgb,var(--cx-accent) 55%,transparent);background:color-mix(in srgb,var(--cx-accent) 8%,transparent)}
.npc-tool-spacer{flex-basis:100%;height:0}
@media(min-width:900px){.npc-tool-spacer{flex:1;flex-basis:auto}}
.npc-tool-mini{font-family:Cinzel,serif;font-size:10.5px;letter-spacing:.03em;color:var(--cx-accent-bright);background:none;border:1px solid color-mix(in srgb,var(--cx-accent) 30%,transparent);border-radius:6px;padding:4px 10px;cursor:pointer;min-height:32px}
.npc-tool-mini:hover,.npc-tool-chip:hover{border-color:var(--cx-accent);color:var(--cx-accent)}
.npc-tool-mini:focus-visible,.npc-tool-chip:focus-visible,.npc-row-head:focus-visible{outline:2px solid var(--cx-accent);outline-offset:2px}
.npc-group-title{font-family:Cinzel,serif;font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--cx-accent);margin:18px 0 8px;padding-bottom:5px;border-bottom:1px solid color-mix(in srgb,var(--cx-accent) 25%,transparent)}
.npc-group-title em{font-style:normal;color:var(--cx-text-dim);font-size:11px}
.npc-none{font-family:'EB Garamond',serif;color:var(--cx-text-dim);padding:18px 4px}
/* rows */
.npc-row{border:1px solid color-mix(in srgb,var(--cx-accent) 18%,transparent);border-radius:11px;margin-bottom:9px;background:linear-gradient(170deg,color-mix(in srgb,var(--cx-field) 50%,transparent),color-mix(in srgb,var(--cx-field) 60%,transparent));overflow:hidden}
.npc-row.is-major{border-color:color-mix(in srgb,var(--cx-accent) 40%,transparent)}
.npc-row-head{display:flex;align-items:center;gap:12px;width:100%;text-align:left;background:none;border:none;padding:9px 13px;cursor:pointer;min-height:56px}
.npc-row-head:hover{background:color-mix(in srgb,var(--cx-accent) 5%,transparent)}
.npc-mini-portrait{width:40px;height:40px;border-radius:9px;overflow:hidden;border:1.5px solid color-mix(in srgb,var(--cx-accent) 45%,transparent);background:var(--cx-surface);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.npc-mini-portrait img{width:100%;height:100%;object-fit:cover}
.npc-mini-portrait span{font-family:Cinzel,serif;font-size:17px;color:var(--cx-accent)}
.npc-row-id{flex:1;min-width:0}
.npc-row-name{display:block;font-family:Cinzel,serif;font-size:15px;color:var(--cx-accent-bright);line-height:1.3}
.npc-row-sub{display:block;font-family:'EB Garamond',serif;font-size:13px;color:var(--cx-text-soft);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.npc-badge{display:inline-block;font-family:Cinzel,serif;font-size:9px;letter-spacing:.06em;text-transform:uppercase;border-radius:5px;padding:1px 6px;vertical-align:2px;margin-left:6px}
.npc-badge.major{color:var(--cx-accent);border:1px solid color-mix(in srgb,var(--cx-accent) 55%,transparent);background:color-mix(in srgb,var(--cx-accent) 8%,transparent)}
.npc-badge.hidden{color:#b48ede;border:1px dashed rgba(180,142,222,.55)}
.npc-row-status{font-family:Cinzel,serif;font-size:10px;letter-spacing:.04em;border:1px solid;border-radius:20px;padding:2px 9px;white-space:nowrap;flex-shrink:0}
.npc-row-status.is-dead,.npc-card-status.is-dead{background:color-mix(in srgb,var(--cx-danger) 14%,transparent)}
.npc-row-status.is-alive,.npc-card-status.is-alive{background:color-mix(in srgb,var(--cx-success-deep) 10%,transparent)}
.npc-row-status.is-neutral,.npc-card-status.is-neutral{background:color-mix(in srgb,var(--cx-text-dim) 10%,transparent)}
.npc-card-status{font-size:11px;font-family:Cinzel,serif;margin-left:10px;padding:2px 8px;border:1px solid;border-radius:20px;white-space:nowrap}
.npc-row-chev{color:var(--cx-text-dim);font-size:13px;flex-shrink:0}
.npc-row-body{padding:0 10px 10px}
.npc-full-card{margin-bottom:0 !important}
/* new fields */
.npc-struct-row{display:flex;gap:8px;margin-bottom:6px;flex-wrap:wrap}
.npc-struct{flex:1;min-width:140px;font-size:13px !important;color:var(--cx-text-soft) !important}
.npc-flag-row{display:flex;gap:16px;flex-wrap:wrap;margin:4px 0 2px}
.npc-flag{display:inline-flex;align-items:center;gap:7px;font-family:Cinzel,serif;font-size:11.5px;letter-spacing:.03em;color:var(--cx-accent-bright);cursor:pointer;min-height:30px}
.npc-flag input{accent-color:var(--cx-accent);width:16px;height:16px}
.npc-vibe-row{margin-top:10px}
.npc-vibe{display:inline-flex;align-items:center;gap:6px;font-family:'EB Garamond',serif;font-size:14px;color:var(--cx-accent);text-decoration:none;border:1px solid color-mix(in srgb,var(--cx-accent) 35%,transparent);border-radius:20px;padding:3px 13px}
.npc-vibe:hover{border-color:var(--cx-accent);color:var(--cx-accent-bright)}
.npc-vibe-edit{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:10px;border-top:1px dashed color-mix(in srgb,var(--cx-accent) 18%,transparent);padding-top:9px}
.npc-vibe-label{font-family:Cinzel,serif;font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--cx-text-dim)}
.npc-vibe-in{font-size:13px !important;width:160px}
.npc-vibe-in.wide{flex:1;min-width:200px}
@media(max-width:640px){
  .npc-row-status{display:none} /* status still inside the expanded card */
  .npc-row-head{min-height:60px}
}
.nw-ins-hiddenbadge{display:inline-block;font-family:Cinzel,serif;font-size:9.5px;letter-spacing:.05em;text-transform:uppercase;color:#b48ede;border:1px dashed rgba(180,142,222,.55);border-radius:5px;padding:1px 7px;margin:5px 6px 0 0}
.nw-ins-majorbadge{display:inline-block;font-family:Cinzel,serif;font-size:9.5px;letter-spacing:.05em;text-transform:uppercase;color:var(--cx-accent);border:1px solid color-mix(in srgb,var(--cx-accent) 50%,transparent);border-radius:5px;padding:1px 7px;margin:5px 0 0}

/* ── deploy138: persistent admin-mode indicator ─────────────────── */
#codex-admin-pill{position:fixed;top:64px;right:10px;z-index:905;display:flex;align-items:center;gap:8px;font-family:Cinzel,serif;font-size:10.5px;letter-spacing:.05em;border-radius:20px;padding:4px 6px 4px 12px;background:color-mix(in srgb,var(--cx-field) 92%,transparent);border:1px solid color-mix(in srgb,var(--cx-accent-deep) 40%,transparent);color:var(--cx-text-dim);box-shadow:0 3px 14px rgba(0,0,0,.4)}
#codex-admin-pill.is-admin{border-color:color-mix(in srgb,var(--cx-accent) 65%,transparent);color:var(--cx-accent);background:linear-gradient(170deg,color-mix(in srgb,var(--cx-surface) 95%,transparent),color-mix(in srgb,var(--cx-surface) 95%,transparent))}
#codex-admin-pill .ap-dot{width:7px;height:7px;border-radius:50%;background:var(--cx-accent);box-shadow:0 0 6px color-mix(in srgb,var(--cx-accent) 80%,transparent);animation:apPulse 2.4s ease-in-out infinite}
@keyframes apPulse{0%,100%{opacity:1}50%{opacity:.45}}
#codex-admin-pill .ap-btn{font-family:Cinzel,serif;font-size:9.5px;letter-spacing:.05em;color:inherit;background:color-mix(in srgb,var(--cx-text-strong) 5%,transparent);border:1px solid currentColor;border-radius:14px;padding:2px 10px;cursor:pointer;min-height:24px}
#codex-admin-pill .ap-btn:hover{background:color-mix(in srgb,var(--cx-accent) 15%,transparent)}
#codex-admin-pill .ap-btn:focus-visible{outline:2px solid var(--cx-accent);outline-offset:2px}
@media(max-width:640px){
  #codex-admin-pill{top:auto;bottom:calc(10px + env(safe-area-inset-bottom));right:10px}
  body.dcs-modal-open #codex-admin-pill{display:none} /* never over combat mode */
}
@media print{#codex-admin-pill{display:none}}


/* deploy141: shared player roll feed in the DM Combat Console */
.dc-player-feed{margin-top:18px;border-top:1px solid color-mix(in srgb,var(--cx-accent) 20%,transparent);padding-top:14px}
.dc-feed-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:8px}
#dc-player-rolls{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:8px}
.dc-player-roll{border:1px solid color-mix(in srgb,var(--cx-accent) 20%,transparent);background:rgba(0,0,0,.22);padding:9px 11px;border-radius:7px;min-width:0}
.dc-player-roll-head,.dc-player-roll-main{display:flex;align-items:center;justify-content:space-between;gap:8px}
.dc-player-roll-head strong{color:var(--cx-accent-bright);font-family:Cinzel,serif;font-size:12px}.dc-player-roll-head span{color:var(--cx-text-soft);font-size:11px}
.dc-player-roll-main{margin-top:5px;color:var(--cx-accent-bright)}.dc-player-roll-main strong{font-size:20px;color:var(--cx-accent)}
.dc-player-roll-detail{font-size:11.5px;color:var(--cx-accent);overflow-wrap:anywhere}.dc-roll-flag{display:inline-block;margin-top:5px;padding:2px 7px;border:1px solid;border-radius:12px;font:10px Cinzel,serif}
.dc-roll-flag.crit,.dc-roll-flag.max{color:var(--cx-accent-bright);border-color:var(--cx-accent-deep)}.dc-roll-flag.fail{color:var(--cx-danger);border-color:var(--cx-danger)}

/* ── Admin → Appearance (v55) ── */
.cxth-presets{display:flex;flex-wrap:wrap;gap:10px;margin:14px 0 18px}
.cxth-preset{display:flex;align-items:center;gap:5px;background:var(--cx-field);border:1px solid color-mix(in srgb,var(--cx-accent) 22%,transparent);border-radius:9px;padding:8px 12px;cursor:pointer;color:var(--cx-text-soft);font-family:"EB Garamond",serif;font-size:13px}
.cxth-preset:hover{border-color:var(--cx-accent-deep)}
.cxth-sw{width:14px;height:14px;border-radius:4px;border:1px solid rgba(0,0,0,.4)}
.cxth-preset-name{margin-left:5px}
.cxth-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:8px 22px;margin:6px 0 16px}
.cxth-row{display:flex;align-items:center;gap:10px;padding:7px 0;border-bottom:1px solid color-mix(in srgb,var(--cx-accent) 8%,transparent)}
.cxth-label{flex:1;color:var(--cx-text);font-size:14px}
.cxth-label em{display:block;font-size:11.5px;color:var(--cx-text-dim);font-style:italic}
.cxth-pick{width:44px;height:30px;border:1px solid color-mix(in srgb,var(--cx-accent) 30%,transparent);border-radius:6px;background:var(--cx-field);padding:2px;cursor:pointer}
.cxth-hex{font-size:11.5px;color:var(--cx-text-dim);min-width:62px}
.cxth-actions{display:flex;gap:10px;flex-wrap:wrap}
@media (max-width:800px){.cxth-grid{grid-template-columns:1fr}}
.cxth-adv-toggle{background:none;border:none;color:var(--cx-accent-deep);font-family:Cinzel,serif;font-size:12.5px;letter-spacing:.06em;cursor:pointer;padding:4px 0;margin:2px 0 6px;display:block}
.cxth-adv-toggle:hover{color:var(--cx-accent)}
.cxth-row .cxth-auto{background:none;border:1px solid color-mix(in srgb,var(--cx-accent) 25%,transparent);color:var(--cx-text-dim);border-radius:6px;width:26px;height:24px;cursor:pointer;font-size:12px;line-height:1}
.cxth-row .cxth-auto:hover{color:var(--cx-accent)}
.cxth-row .cxth-auto:disabled{opacity:.25;cursor:default}
.cxth-row.overridden .cxth-hex{color:var(--cx-accent-deep)}

/* ── v68.4: per-row NPC editor ─────────────────────────────────────────── */
.npc-row-line{display:flex;align-items:stretch;gap:0}
.npc-row-line .npc-row-head{flex:1;min-width:0}
.npc-row-edit{flex:none;align-self:center;margin-right:11px;padding:7px 13px;cursor:pointer;
  font-family:'Cinzel',serif;font-size:11px;letter-spacing:.08em;white-space:nowrap;
  color:var(--cx-accent-bright);background:color-mix(in srgb,var(--cx-accent-deep) 14%,transparent);
  border:1px solid color-mix(in srgb,var(--cx-accent) 45%,transparent);border-radius:8px;
  transition:background .15s,border-color .15s}
.npc-row-edit:hover{background:color-mix(in srgb,var(--cx-accent-deep) 26%,transparent);border-color:var(--cx-accent)}
.npc-row-edit:focus-visible{outline:2px solid var(--cx-accent);outline-offset:2px}
.npc-row-edit.on{color:var(--cx-bg);background:var(--cx-accent);border-color:var(--cx-accent)}
.npc-row.is-editing{border-color:var(--cx-accent);box-shadow:0 0 0 1px color-mix(in srgb,var(--cx-accent) 35%,transparent)}
.cx-img-missing{opacity:.55;object-fit:contain;background:#14100a;border-radius:6px}

/* ══ css/crafted-foundation.css ══ */
/*
 * Handcrafted codex theme
 * A quiet campaign-book presentation layered over the existing feature CSS.
 * Functional feature styles remain in their original files.
 */
:root {
  --ink-black: var(--cx-field);
  --ink-deep: var(--cx-surface);
  --ink-panel: var(--cx-surface);
  --ink-panel-raised: var(--cx-surface);
  --ink-hover: var(--cx-surface);
  --brass: var(--cx-accent-deep);
  --brass-bright: var(--cx-accent);
  --brass-dim: var(--cx-accent-dim);
  --paper: var(--cx-accent-bright);
  --paper-muted: var(--cx-accent);
  --paper-dim: var(--cx-accent-deep);
  --rule: var(--cx-accent-dim);
  --rule-strong: var(--cx-accent-dim);
  --danger: var(--cx-danger);
  --success: var(--cx-success);
  --info: #6d829b;
  --font-display: "Cinzel", Georgia, serif;
  --font-body: "EB Garamond", Georgia, serif;
  --font-prose: "Crimson Pro", Georgia, serif;
  --shell-height: 64px;
  --topbar-height: 42px;
  --content-width: 1380px;

  /* bridge legacy feature tokens */
  --bg-deep: var(--ink-black);
  --bg-surface: var(--ink-deep);
  --bg-card: var(--ink-panel);
  --bg-card-hover: var(--ink-hover);
  --border: var(--rule);
  --border-glow: var(--rule-strong);
  --gold: var(--brass);
  --gold-bright: var(--brass-bright);
  --gold-dim: var(--brass-dim);
  --text-primary: var(--paper);
  --text-secondary: var(--paper-muted);
  --text-dim: var(--paper-dim);
  --red: var(--cx-danger-deep);
  --red-bright: var(--danger);
}

* { box-sizing: border-box; }
html { color-scheme: dark; }
body {
  min-height: 100vh;
  overflow-x: hidden;
  background:
    linear-gradient(color-mix(in srgb,var(--cx-field) 94%,transparent), color-mix(in srgb,var(--cx-field) 97%,transparent)),
    url('../bg_texture.jpg') center / 700px auto repeat;
  color: var(--paper);
  font-family: var(--font-body);
  font-size: 17px;
  line-height: 1.62;
}
body::before { display: none; }
button, input, select, textarea { font: inherit; }
button { color: inherit; }
button, [role="button"] { -webkit-tap-highlight-color: transparent; }
::selection { background: color-mix(in srgb,var(--cx-accent-deep) 32%,transparent); }

button:focus-visible,
a:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
  outline: 2px solid var(--brass-bright);
  outline-offset: 3px;
}

.icon-sprite {
  position: absolute;
  width: 0;
  height: 0;
  overflow: hidden;
}
.ui-icon {
  width: 17px;
  height: 17px;
  display: block;
  flex: 0 0 auto;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.65;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* ── Application shell: horizontal, website-like, not dashboard-like ── */
#app { min-height: 100vh; }
#sidebar {
  position: fixed;
  inset: 0 0 auto 0;
  z-index: 500;
  width: 100%;
  height: var(--shell-height);
  display: flex;
  align-items: stretch;
  overflow: visible;
  padding: 0;
  background: color-mix(in srgb,var(--cx-field) 97%,transparent);
  border: 0;
  border-bottom: 1px solid var(--rule-strong);
  box-shadow: 0 8px 24px rgba(0, 0, 0, .2);
  backdrop-filter: blur(12px);
}
#sidebar-header {
  width: 270px;
  min-width: 270px;
  height: 100%;
  display: flex;
  align-items: center;
  padding: 0 18px;
  border: 0;
  border-right: 1px solid var(--rule);
}
#sidebar-header::before { display: none; }
.brand-home {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 0;
  color: inherit;
  background: transparent;
  border: 0;
  text-align: left;
  cursor: pointer;
}
.brand-mark {
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  color: var(--brass-bright);
  border: 1px solid var(--brass-dim);
  border-radius: 50%;
}
.brand-mark .ui-icon { width: 15px; height: 15px; }
.brand-copy { min-width: 0; }
#sidebar-header .world-name {
  display: block;
  margin-bottom: 2px;
  color: var(--paper-dim);
  font-family: var(--font-display);
  font-size: 8px;
  letter-spacing: .16em;
  line-height: 1.1;
  text-transform: uppercase;
}
#sidebar-header .campaign-title {
  display: block;
  overflow: hidden;
  color: var(--paper);
  font-family: var(--font-display);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .055em;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}
#sidebar-header .campaign-subtitle { display: none; }
.search-field { display: none; }

#nav-groups {
  min-width: 0;
  display: flex;
  align-items: stretch;
  flex: 1;
  overflow: visible;
}
.nav-section { position: relative; flex: 0 0 auto; }
.nav-section-label {
  height: 100%;
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 0 18px;
  color: var(--paper-muted);
  background: transparent;
  border: 0;
  border-bottom: 2px solid transparent;
  font-family: var(--font-display);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .11em;
  text-transform: uppercase;
  cursor: pointer;
}
.nav-section-label::after {
  content: '';
  width: 4px;
  height: 4px;
  border-right: 1px solid currentColor;
  border-bottom: 1px solid currentColor;
  transform: rotate(45deg) translateY(-2px);
  opacity: .65;
}
.nav-section:hover > .nav-section-label,
.nav-section.open > .nav-section-label {
  color: var(--paper);
  border-bottom-color: var(--brass);
}
.nav-dropdown {
  display: none;
  position: absolute;
  top: calc(100% - 1px);
  left: 0;
  min-width: 230px;
  padding: 8px 0;
  background: var(--cx-surface);
  border: 1px solid var(--rule-strong);
  border-top: 2px solid var(--brass);
  box-shadow: 0 18px 45px rgba(0, 0, 0, .42);
}
.nav-section:hover > .nav-dropdown,
.nav-section.open > .nav-dropdown { display: block; }
.nav-item {
  width: 100%;
  min-height: 38px;
  display: flex;
  align-items: center;
  gap: 0;
  padding: 8px 18px;
  color: var(--paper-muted);
  background: transparent;
  border: 0;
  border-left: 2px solid transparent;
  border-radius: 0;
  font-family: var(--font-body);
  font-size: 16px;
  line-height: 1.25;
  text-align: left;
  cursor: pointer;
}
.nav-item .ui-icon { display: none; }
.nav-item:hover {
  color: var(--paper);
  background: color-mix(in srgb,var(--cx-accent-deep) 7%,transparent);
  border-left-color: var(--brass-dim);
}
.nav-item.active {
  color: var(--brass-bright);
  background: color-mix(in srgb,var(--cx-accent-deep) 9%,transparent);
  border-left-color: var(--brass);
}

#main {
  margin: 0;
  padding-top: var(--shell-height);
}
#topbar {
  position: relative;
  top: auto;
  height: auto;
  min-height: var(--topbar-height);
  display: flex;
  flex-wrap: wrap; /* v68.2: header controls reflow instead of overlapping */
  align-items: center;
  justify-content: flex-start;
  gap: 8px 18px;
  padding: 5px 28px;
  background: color-mix(in srgb,var(--cx-field) 74%,transparent);
  border-bottom: 1px solid var(--rule);
}
/* v68.2: the breadcrumb starts the reading line; the badge is pushed to the
   right but stops short of the fixed Admin Mode pill's corner. */
#topbar .status-badge { margin-left: auto; padding-right: 190px; }
@media (max-width: 1180px) { #topbar .status-badge { display: none; } }
#topbar::after { display: none; }
#topbar .breadcrumb {
  margin: 0;
  color: var(--paper-dim);
  font-family: var(--font-display);
  font-size: 9px;
  letter-spacing: .11em;
  text-transform: uppercase;
}
#topbar .breadcrumb::before,
#topbar .breadcrumb::after { display: none; }
#topbar .breadcrumb strong { color: var(--paper-muted); font-weight: 600; }
.status-badge {
  position: static;
  color: var(--paper-dim);
  background: transparent;
  border: 0;
  border-radius: 0;
  font-family: var(--font-body);
  font-size: 13px;
  font-style: italic;
}
#content {
  width: min(100%, var(--content-width));
  max-width: var(--content-width);
  margin: 0 auto;
  padding: 36px 28px 70px;
}
.page-loader {
  padding: 80px 20px;
  color: var(--paper-dim);
  font-family: var(--font-display);
  font-size: 11px;
  letter-spacing: .12em;
  text-align: center;
  text-transform: uppercase;
}

/* ── Shared page language ── */
.page {
  padding: 30px;
  color: var(--paper);
  background: color-mix(in srgb,var(--cx-surface) 94%,transparent);
  border: 1px solid var(--rule);
  border-radius: 2px;
  box-shadow: 0 20px 55px rgba(0, 0, 0, .22);
}
.page:not(#page-home).active {
  padding: 30px;
  background: color-mix(in srgb,var(--cx-surface) 94%,transparent);
  border: 1px solid var(--rule);
  border-radius: 2px;
  box-shadow: 0 20px 55px rgba(0, 0, 0, .22);
}
.page-header {
  margin-bottom: 34px;
  padding: 0 0 20px;
  border-bottom: 1px solid var(--rule-strong);
}
.page-eyebrow,
.eyebrow {
  margin-bottom: 8px;
  color: var(--brass);
  font-family: var(--font-display);
  font-size: 9px;
  font-weight: 600;
  letter-spacing: .18em;
  text-transform: uppercase;
}
.page-title {
  margin: 0 0 10px;
  color: var(--paper);
  background: none;
  font-family: var(--font-display);
  font-size: clamp(29px, 3vw, 43px);
  font-weight: 600;
  letter-spacing: .01em;
  line-height: 1.12;
  -webkit-text-fill-color: currentColor;
}
.page-description {
  max-width: 760px;
  color: var(--paper-muted);
  font-family: var(--font-prose);
  font-size: 18px;
  font-style: italic;
  line-height: 1.55;
}
.section { margin-bottom: 38px; }
.section-title,
.section-header {
  margin-bottom: 16px;
  padding-bottom: 8px;
  color: var(--brass-bright);
  border-bottom: 1px solid var(--rule);
  font-family: var(--font-display);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.card,
.stat-block,
.ability,
.nation-card,
.img-card,
.inv-card,
.award-card,
.session-card,
.leg-item-card,
.atlas-world-card,
.gallery-upload,
.gallery-item,
.char-sheet,
.player-notes {
  color: var(--paper);
  background: var(--ink-panel);
  border: 1px solid var(--rule);
  border-radius: 2px;
  box-shadow: none;
}
.card,
.stat-block,
.ability,
.nation-card { padding: 18px 20px; }
.card::before { display: none; }
.card:hover,
.nation-card:hover,
.ability:hover,
.inv-card:hover,
.award-card:hover,
.session-card:hover,
.leg-item-card:hover,
.atlas-world-card:hover,
.realm-card:hover {
  transform: none;
  background: var(--ink-panel-raised);
  border-color: var(--rule-strong);
  box-shadow: none;
}
.card-title,
.stat-block-header,
.nation-name,
.ability-name,
.inv-card-title,
.award-title,
.leg-item-name {
  color: var(--paper);
  background: none;
  font-family: var(--font-display);
  font-weight: 600;
  -webkit-text-fill-color: currentColor;
}
.card-tag,
.stat-label,
.card-meta,
.pill { color: var(--paper-dim); }
.pill {
  padding: 2px 7px;
  background: transparent;
  border: 1px solid var(--rule);
  border-radius: 1px;
  font-size: 9px;
}
.lore-block {
  margin: 20px 0;
  padding: 18px 22px;
  color: var(--paper-muted);
  background: color-mix(in srgb,var(--cx-accent-deep) 5.5%,transparent);
  border: 0;
  border-left: 2px solid var(--brass);
  font-family: var(--font-prose);
  font-style: italic;
}
.prose { color: var(--paper); }
.prose strong { color: var(--brass-bright); }
.prose h3 { color: var(--brass-bright); }
.timeline-dot { box-shadow: none; }

/* Buttons and inputs */
.button,
.wiki-button,
.new-session-btn,
.char-save-btn,
.inv-btn,
.home-action,
.atlas-button,
.gallery-button,
button[class*="btn"] {
  min-height: 39px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 9px 14px;
  color: var(--paper);
  background: transparent;
  border: 1px solid var(--rule-strong);
  border-radius: 2px;
  box-shadow: none;
  font-family: var(--font-display);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .09em;
  line-height: 1.15;
  text-transform: uppercase;
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
  transition: color 150ms ease, background 150ms ease, border-color 150ms ease;
}
.button:hover,
.wiki-button:hover,
.new-session-btn:hover,
.char-save-btn:hover,
.inv-btn:hover,
.home-action:hover,
.atlas-button:hover,
.gallery-button:hover,
button[class*="btn"]:hover {
  transform: none;
  color: var(--paper);
  background: color-mix(in srgb,var(--cx-accent-deep) 8%,transparent);
  border-color: var(--brass);
  filter: none;
}
.button-primary,
.wiki-button,
.char-save-btn,
.inv-btn.gold,
.home-action.primary {
  color: var(--cx-surface);
  background: var(--brass);
  border-color: var(--brass);
}
.button-primary:hover,
.wiki-button:hover,
.char-save-btn:hover,
.inv-btn.gold:hover,
.home-action.primary:hover {
  color: var(--cx-field);
  background: var(--brass-bright);
  border-color: var(--brass-bright);
}
.button-danger { color: var(--cx-danger); border-color: var(--cx-danger-deep); }
.button-danger:hover { background: color-mix(in srgb,var(--cx-danger) 9%,transparent); border-color: var(--danger); }
.icon-button {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  padding: 0;
  color: var(--paper-muted);
  background: transparent;
  border: 1px solid var(--rule);
  border-radius: 2px;
  cursor: pointer;
}

input,
select,
textarea,
#search-box,
.home-search input,
.atlas-search,
.field input,
.field select,
.field textarea,
.gallery-upload input[type="file"],
.gallery-upload input[type="text"],
.gallery-upload textarea {
  width: 100%;
  color: var(--paper);
  background: var(--cx-field);
  border: 1px solid var(--rule);
  border-radius: 2px;
  outline: 0;
}
input,
select,
textarea { padding: 10px 12px; }
input:focus,
select:focus,
textarea:focus,
#search-box:focus,
.home-search input:focus,
.atlas-search:focus { border-color: var(--brass); box-shadow: none; }
input::placeholder,
textarea::placeholder { color: var(--paper-dim); }

/* Modals remain centered and intentionally plain. */
.modal,
.modal-content,
.dcs-modal,
.dcs-modal-panel,
.inv-modal-content,
.session-modal-content {
  color: var(--paper);
  background: var(--ink-deep);
  border: 1px solid var(--rule-strong);
  border-radius: 2px;
  box-shadow: 0 28px 80px rgba(0, 0, 0, .58);
}


/* Feature-fix pass: stable inner-page navigation and reusable admin controls. */
#sidebar #nav-groups {
  gap: 0;
  align-items: stretch;
}
#sidebar .nav-section {
  position: relative;
  display: flex;
  align-items: stretch;
  border-left: 1px solid color-mix(in srgb,var(--cx-accent-deep) 12%,transparent);
}
#sidebar .nav-section:last-child { border-right: 1px solid color-mix(in srgb,var(--cx-accent-deep) 12%,transparent); }
#sidebar .nav-section > .nav-section-label {
  min-width: 96px;
  justify-content: center;
  padding-inline: clamp(13px, 1.45vw, 22px);
}
#sidebar .nav-section > .nav-dropdown {
  position: absolute;
  top: 100%;
  left: 0;
  right: auto;
  z-index: 1000;
  box-sizing: border-box;
  margin: 0;
}
#sidebar .nav-section:last-child > .nav-dropdown {
  left: auto;
  right: 0;
}

.cx-add-subpage-btn {
  display: block;
  width: max-content;
  max-width: 100%;
  margin: 14px 0 0;
  padding: 7px 11px;
  border: 1px solid var(--rule-strong);
  border-radius: 2px;
  background: color-mix(in srgb,var(--cx-accent-deep) 7%,transparent);
  color: var(--brass-light);
  font: 600 10px/1 var(--font-display);
  letter-spacing: .08em;
  text-transform: uppercase;
  cursor: pointer;
}
.cx-add-subpage-btn:hover { background: color-mix(in srgb,var(--cx-accent-deep) 14%,transparent); }
.cx-subpage-link { margin-top: 14px; }
.cx-subpage-link.section { margin-top: 0; }
.npc-subpage-actions { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 14px; }

.vote-option {
  width: 100%;
  color: inherit;
  background: transparent;
  text-align: left;
}
.vote-option:disabled { opacity: .5; cursor: not-allowed; }
.vote-avatar-fallback {
  width: 36px;
  height: 36px;
  flex: 0 0 36px;
  display: grid;
  place-items: center;
  border: 1px solid color-mix(in srgb,var(--cx-accent-deep) 38%,transparent);
  border-radius: 50%;
  background: color-mix(in srgb,var(--cx-accent-deep) 10%,transparent);
  color: var(--brass-light);
  font: 600 11px/1 var(--font-display);
}

#wiki-map-modal { position: fixed; inset: 0; z-index: 3000; }
#wiki-map-modal .cx-modal-backdrop { position: absolute; inset: 0; }
#wiki-map-modal .wiki-map-dialog {
  position: relative;
  z-index: 1;
  width: min(560px, calc(100vw - 32px));
  margin: 8vh auto 0;
}
#wiki-map-modal input[type="file"] { padding: 10px; }

/* ══ css/crafted-experience.css ══ */
/* ── Home: editorial campaign index ── */
body.home-active {
  background:
    linear-gradient(color-mix(in srgb,var(--cx-field) 86%,transparent), color-mix(in srgb,var(--cx-field) 95%,transparent)),
    url('../bg_texture.jpg') center / 760px auto repeat;
}
body.home-active #sidebar,
body.home-active #topbar { display: none; }
body.home-active #main { padding-top: 0; }
body.home-active #content {
  width: 100%;
  max-width: none;
  padding: 0;
}
.home-page {
  min-height: 100vh;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}
.home-shell {
  width: min(100%, 1480px);
  min-height: 100vh;
  margin: 0 auto;
  padding: 0 34px 70px;
}
.home-nav {
  min-height: 72px;
  display: grid;
  grid-template-columns: auto minmax(220px, 1fr) auto;
  align-items: center;
  gap: 24px;
  padding: 0;
  background: transparent;
  border-bottom: 1px solid var(--rule-strong);
  backdrop-filter: none;
}
.home-menu-btn {
  min-height: 36px;
  padding: 8px 12px;
  color: var(--paper-muted);
  background: transparent;
  border: 1px solid var(--rule);
  border-radius: 2px;
  font-family: var(--font-display);
  font-size: 9px;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.home-brand {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}
.home-brand-mark {
  width: 31px;
  height: 31px;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  color: var(--brass-bright);
  border: 1px solid var(--brass-dim);
  border-radius: 50%;
}
.home-brand-mark .ui-icon { width: 15px; height: 15px; }
.home-brand-title {
  overflow: hidden;
  color: var(--paper);
  font-family: var(--font-display);
  font-size: 14px;
  font-weight: 600;
  letter-spacing: .06em;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.home-brand-sub {
  margin-top: 3px;
  color: var(--paper-dim);
  font-family: var(--font-body);
  font-size: 13px;
  font-style: italic;
  letter-spacing: 0;
  text-transform: none;
}
.home-links {
  display: flex;
  align-items: stretch;
  justify-content: flex-end;
  gap: 0;
}
.home-link {
  min-height: 72px;
  padding: 0 13px;
  color: var(--paper-muted);
  background: transparent;
  border: 0;
  border-bottom: 2px solid transparent;
  border-radius: 0;
  font-family: var(--font-display);
  font-size: 9px;
  font-weight: 600;
  letter-spacing: .1em;
  text-transform: uppercase;
  cursor: pointer;
}
.home-link:hover,
.home-link.active {
  color: var(--paper);
  background: transparent;
  border-bottom-color: var(--brass);
}

.home-hero {
  min-height: 570px;
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(300px, .72fr);
  gap: clamp(42px, 7vw, 100px);
  align-items: center;
  padding: clamp(70px, 9vw, 126px) 0 76px;
  background: transparent;
  border-bottom: 1px solid var(--rule-strong);
}
.home-hero::before,
.home-hero::after { display: none; }
.home-hero-content {
  max-width: 800px;
  margin: 0;
  text-align: left;
}
.home-welcome,
.home-kicker {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 18px;
  color: var(--brass);
  font-family: var(--font-display);
  font-size: 9px;
  font-weight: 600;
  letter-spacing: .2em;
  text-align: left;
  text-transform: uppercase;
}
.home-welcome::before {
  content: '';
  width: 38px;
  height: 1px;
  background: var(--brass);
}
.home-welcome::after { display: none; }
.home-title {
  max-width: 900px;
  margin: 0;
  color: var(--paper);
  background: none;
  font-family: var(--font-display);
  font-size: clamp(48px, 7vw, 92px);
  font-weight: 600;
  letter-spacing: -.025em;
  line-height: .98;
  text-align: left;
  text-shadow: none;
  -webkit-text-fill-color: currentColor;
}
.home-tagline {
  margin: 26px 0 10px;
  color: var(--brass-bright);
  font-family: var(--font-prose);
  font-size: clamp(22px, 2.3vw, 31px);
  font-style: italic;
  letter-spacing: 0;
  line-height: 1.2;
  text-align: left;
  text-transform: none;
}
.home-hero .home-copy {
  max-width: 650px;
  margin: 0;
  color: var(--paper-muted);
  font-family: var(--font-body);
  font-size: 19px;
  line-height: 1.55;
  text-align: left;
  text-shadow: none;
}
.home-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: flex-start;
  margin-top: 30px;
}
.home-actions .button { min-width: 150px; }

.home-folio {
  align-self: stretch;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 24px 0 24px 28px;
  border-left: 1px solid var(--rule-strong);
}
.home-folio-label {
  margin-bottom: 13px;
  color: var(--paper-dim);
  font-family: var(--font-display);
  font-size: 9px;
  letter-spacing: .16em;
  text-transform: uppercase;
}
.home-folio-link {
  width: 100%;
  min-height: 78px;
  display: grid;
  grid-template-columns: 34px 1fr auto;
  align-items: center;
  gap: 12px;
  padding: 15px 0;
  color: var(--paper-muted);
  background: transparent;
  border: 0;
  border-top: 1px solid var(--rule);
  border-radius: 0;
  text-align: left;
  cursor: pointer;
}
.home-folio-link:last-child { border-bottom: 1px solid var(--rule); }
.home-folio-link:hover { color: var(--paper); background: transparent; }
.home-folio-link > span:first-child {
  color: var(--brass-dim);
  font-family: var(--font-display);
  font-size: 9px;
  letter-spacing: .08em;
}
.home-folio-link strong {
  display: block;
  color: currentColor;
  font-family: var(--font-display);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .05em;
}
.home-folio-link small {
  display: block;
  margin-top: 2px;
  color: var(--paper-dim);
  font-family: var(--font-body);
  font-size: 14px;
  font-style: italic;
}
.home-folio-link > span:last-child {
  color: var(--brass);
  font-size: 18px;
}

.home-realms {
  max-width: none;
  margin: 0;
  padding: 54px 0 0;
}
.home-section-heading {
  display: grid;
  grid-template-columns: 160px minmax(200px, 1fr) minmax(240px, 540px);
  gap: 24px;
  align-items: baseline;
  margin-bottom: 24px;
}
.home-section-heading .eyebrow { margin: 0; }
.home-section-heading h2 {
  color: var(--paper);
  font-family: var(--font-display);
  font-size: clamp(25px, 3vw, 38px);
  font-weight: 600;
  letter-spacing: .01em;
}
.home-section-heading > p:last-child {
  color: var(--paper-dim);
  font-size: 16px;
  font-style: italic;
  text-align: right;
}
.realm-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0;
  border-top: 1px solid var(--rule-strong);
  border-left: 1px solid var(--rule-strong);
}
.realm-card {
  min-height: 205px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 24px;
  color: var(--paper);
  background: color-mix(in srgb,var(--cx-surface) 72%,transparent);
  border: 0;
  border-right: 1px solid var(--rule-strong);
  border-bottom: 1px solid var(--rule-strong);
  border-radius: 0;
  box-shadow: none;
  text-align: left;
  cursor: pointer;
}
.realm-card img { display: none; }
.realm-card::before {
  content: attr(data-index);
  display: block;
  margin-bottom: 38px;
  color: var(--brass-dim);
  font-family: var(--font-display);
  font-size: 9px;
  letter-spacing: .13em;
}
.realm-card-body { display: block; }
.realm-card strong {
  display: block;
  margin-bottom: 8px;
  color: var(--paper);
  font-family: var(--font-display);
  font-size: 18px;
  font-weight: 600;
  letter-spacing: .025em;
}
.realm-card span span {
  display: block;
  min-height: 48px;
  color: var(--paper-muted);
  font-family: var(--font-body);
  font-size: 16px;
  line-height: 1.45;
}
.realm-card em {
  display: block;
  margin-top: 18px;
  color: var(--brass);
  font-family: var(--font-display);
  font-size: 9px;
  font-style: normal;
  letter-spacing: .11em;
  text-transform: uppercase;
}
.realm-card:hover { background: color-mix(in srgb,var(--cx-surface) 82%,transparent); }
.realm-card:hover strong { color: var(--brass-bright); }

/* Home navigation sheet */
.home-nav-backdrop {
  position: fixed;
  inset: 0;
  z-index: 899;
  display: none;
  background: rgba(0, 0, 0, .62);
}
.home-nav-backdrop.open { display: block; }
.home-nav-menu {
  position: fixed;
  inset: 0 auto 0 0;
  z-index: 900;
  width: min(440px, 90vw);
  padding: 26px;
  overflow-y: auto;
  color: var(--paper);
  background: var(--cx-surface);
  border-right: 1px solid var(--rule-strong);
  transform: translateX(-102%);
  transition: transform 180ms ease;
}
.home-nav-menu.open { transform: translateX(0); }
.home-menu-head {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  align-items: flex-start;
  margin-bottom: 30px;
  padding-bottom: 18px;
  border-bottom: 1px solid var(--rule-strong);
}
.home-menu-title {
  font-family: var(--font-display);
  font-size: 17px;
  font-weight: 600;
}
.home-menu-subtitle { color: var(--paper-dim); font-size: 14px; font-style: italic; }
.home-menu-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 28px 20px; }
.home-menu-section-title {
  margin-bottom: 8px;
  color: var(--brass);
  font-family: var(--font-display);
  font-size: 9px;
  letter-spacing: .16em;
  text-transform: uppercase;
}
.home-menu-item {
  width: 100%;
  padding: 8px 0;
  color: var(--paper-muted);
  background: transparent;
  border: 0;
  border-bottom: 1px solid var(--rule);
  border-radius: 0;
  text-align: left;
  cursor: pointer;
}
.home-menu-item:hover { color: var(--paper); background: transparent; }

/* Atlas and gallery: remove oversized app-shell treatment */
.atlas-shell,
.gallery-shell {
  color: var(--paper);
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}
.atlas-hero {
  padding: 24px 0;
  background: transparent;
  border-bottom: 1px solid var(--rule-strong);
}
.atlas-title { color: var(--paper); }
.atlas-kicker { color: var(--brass); }
.gallery-upload { border-style: solid; }
.gallery-item img,
.img-card img { background: var(--cx-field); }

/* Character and combat surfaces keep their layouts, but lose dashboard gloss. */
.character-layout,
.char-grid,
.dcs-grid { gap: 16px; }
.char-sheet,
.dcs-panel,
.dcs-card,
.dcs-combat-card,
.dcs-resource-card,
.dcs-spell-card,
.dcs-action-card {
  background: var(--ink-panel);
  border-color: var(--rule);
  border-radius: 3px;
  box-shadow: none;
}
.char-sheet:hover,
.dcs-panel:hover,
.dcs-card:hover,
.dcs-combat-card:hover { transform: none; box-shadow: none; }
.char-name,
.char-section-title,
.dcs-title,
.dcs-section-title {
  color: var(--paper);
  background: none;
  -webkit-text-fill-color: currentColor;
}
.dcs-tab,
.dcs-mobile-tab {
  border-radius: 2px;
}
.dcs-tab.active,
.dcs-mobile-tab.active {
  color: var(--brass-bright);
  background: color-mix(in srgb,var(--cx-accent-deep) 9%,transparent);
  border-color: var(--brass);
}

#lightbox {
  background: color-mix(in srgb,var(--cx-field) 94%,transparent);
}
.lightbox-close { position: fixed; top: 22px; right: 22px; z-index: 2; }

::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: var(--ink-black); }
::-webkit-scrollbar-thumb { background: var(--rule-strong); border: 2px solid var(--ink-black); }

/* ── Responsive shell and home ── */
#mnav-btn,
#mnav { display: none; }

@media (max-width: 1180px) {
  #sidebar-header { width: 240px; min-width: 240px; }
  .nav-section-label { padding: 0 12px; font-size: 9px; }
  .home-links { display: none; }
  .home-nav { grid-template-columns: auto minmax(180px, 1fr) auto; }
  .home-hero { grid-template-columns: minmax(0, 1.25fr) minmax(290px, .75fr); }
}

@media (max-width: 900px) {
  :root { --shell-height: 56px; }
  #sidebar {
    height: var(--shell-height);
    overflow: hidden;
  }
  #sidebar-header {
    width: auto;
    min-width: 0;
    flex: 1;
    padding: 0 14px;
    border-right: 0;
  }
  #sidebar .brand-mark { width: 28px; height: 28px; }
  #nav-groups { display: none; }
  #topbar { display: none; }
  #main { padding-top: var(--shell-height); }
  #content { padding: 20px 14px 72px; }
  .page { padding: 20px 16px; }

  #mnav-btn {
    position: fixed;
    top: 9px;
    right: 12px;
    z-index: 700;
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    color: var(--paper);
    background: var(--cx-surface);
    border: 1px solid var(--rule-strong);
    border-radius: 2px;
  }
  body.home-active #mnav-btn { display: none; }
  body.mnav-open { overflow: hidden; }
  #mnav {
    position: fixed;
    inset: 0;
    z-index: 1000;
    display: block;
    overflow-y: auto;
    padding: 0 0 30px;
    color: var(--paper);
    background: var(--cx-surface);
    opacity: 0;
    pointer-events: none;
    transform: translateY(-14px);
    transition: opacity 160ms ease, transform 160ms ease;
  }
  #mnav.open { opacity: 1; pointer-events: auto; transform: translateY(0); }
  .mnav-head {
    position: sticky;
    top: 0;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 16px;
    background: var(--cx-surface);
    border-bottom: 1px solid var(--rule-strong);
  }
  .mnav-brand {
    color: var(--paper);
    font-family: var(--font-display);
    font-size: 15px;
  }
  .mnav-brand span {
    display: block;
    margin-top: 2px;
    color: var(--paper-dim);
    font-family: var(--font-body);
    font-size: 13px;
    font-style: italic;
  }
  .mnav-close {
    width: 38px;
    height: 38px;
    color: var(--paper-muted);
    background: transparent;
    border: 1px solid var(--rule);
    border-radius: 2px;
  }
  .mnav-section { padding: 18px 16px 0; }
  .mnav-label {
    margin-bottom: 6px;
    color: var(--brass);
    font-family: var(--font-display);
    font-size: 9px;
    letter-spacing: .15em;
    text-transform: uppercase;
  }
  .mnav-item {
    width: 100%;
    min-height: 43px;
    display: flex;
    align-items: center;
    gap: 0;
    padding: 9px 0;
    color: var(--paper-muted);
    background: transparent;
    border: 0;
    border-bottom: 1px solid var(--rule);
    border-radius: 0;
    text-align: left;
  }
  .mnav-item .ui-icon { display: none; }

  .home-shell { padding: 0 18px 46px; }
  .home-nav {
    min-height: 64px;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 13px;
  }
  .home-brand-title { font-size: 12px; }
  .home-brand-sub { font-size: 12px; }
  .home-hero {
    min-height: auto;
    grid-template-columns: 1fr;
    gap: 52px;
    padding: 70px 0 52px;
  }
  .home-title { font-size: clamp(43px, 12vw, 68px); }
  .home-folio {
    padding: 24px 0 0;
    border-top: 1px solid var(--rule-strong);
    border-left: 0;
  }
  .home-section-heading {
    grid-template-columns: 1fr;
    gap: 6px;
  }
  .home-section-heading > p:last-child { text-align: left; }
  .realm-grid { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 620px) {
  body { font-size: 16px; }
  .page-title { font-size: 29px; }
  .home-menu-grid { grid-template-columns: 1fr; }
  .home-title { font-size: 42px; }
  .home-tagline { font-size: 23px; }
  .home-copy { font-size: 17px; }
  .home-actions { flex-direction: column; }
  .home-actions .button { width: 100%; }
  .home-folio-link { grid-template-columns: 28px 1fr auto; }
  .realm-grid { grid-template-columns: 1fr; }
  .realm-card { min-height: 185px; }
}

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

@media (min-width: 901px) and (max-width: 1180px) {
  #sidebar .nav-section > .nav-section-label {
    min-width: 82px;
    padding-inline: 10px;
    font-size: 9px;
  }
}


/* Deploy140 — Campaign Rules & Safety */
.cr-status{display:block;min-height:18px;margin-top:8px;color:var(--cx-accent);font-size:13px}.cr-status.is-error{color:var(--cx-danger)}
.cr-panel{margin:0 0 24px;border:1px solid color-mix(in srgb,var(--cx-accent-deep) 28%,transparent);background:color-mix(in srgb,var(--cx-field) 64%,transparent);padding:20px}
.cr-panel-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:16px}
.cr-title{margin:0 0 4px;font-family:Cinzel,serif;font-size:19px;color:var(--cx-accent-bright)}.cr-help{margin:0;color:var(--cx-accent);font-size:14px;line-height:1.45}
.cr-entry-form{display:grid;grid-template-columns:150px minmax(260px,1fr) auto auto;gap:12px;align-items:end;padding:14px 0 18px;border-bottom:1px solid color-mix(in srgb,var(--cx-accent-deep) 20%,transparent)}
.cr-entry-form label{display:grid;gap:6px;color:var(--cx-accent);font-size:12px;letter-spacing:.05em}.cr-entry-form select,.cr-entry-form textarea,.cr-section-title-input,.cr-section-content{box-sizing:border-box;width:100%;border:1px solid color-mix(in srgb,var(--cx-accent-deep) 34%,transparent);background:var(--cx-field);color:var(--cx-accent-bright);padding:9px 11px;font:inherit}.cr-entry-text{min-width:0}.cr-anon{display:flex!important;grid-auto-flow:column;align-items:center;white-space:nowrap;padding-bottom:10px}.cr-entry-list{display:grid;gap:10px;margin-top:16px}.cr-entry{border-left:3px solid var(--cx-accent-deep);background:rgba(0,0,0,.22);padding:12px 14px}.cr-entry.is-veil{border-left-style:dashed}.cr-entry-head{display:flex;align-items:center;gap:10px}.cr-kind{font-family:Cinzel,serif;font-size:11px;letter-spacing:.14em;color:var(--cx-accent)}.cr-author{color:var(--cx-text-soft);font-size:12px}.cr-entry-actions{margin-left:auto;display:flex;gap:6px}.cr-entry-body p{margin:8px 0 0;line-height:1.55}
.cr-section-list{display:grid;gap:14px}.cr-section{border-top:1px solid color-mix(in srgb,var(--cx-accent-deep) 22%,transparent);padding-top:14px}.cr-section:first-child{border-top:0;padding-top:0}.cr-section h3{margin:0 0 8px;color:var(--cx-accent-bright);font-family:Cinzel,serif}.cr-section-toolbar{display:grid;grid-template-columns:minmax(180px,1fr) auto auto auto auto auto;gap:8px;align-items:center;margin-bottom:8px}.cr-section-toolbar label{display:flex;align-items:center;gap:6px;color:var(--cx-accent);font-size:12px}.cr-section-content{resize:vertical;line-height:1.55;min-height:120px}.cr-section-body{line-height:1.62}.cr-subpages{margin-top:10px;color:var(--cx-text-soft);font-size:13px}.cr-login-note{margin:12px 0;color:var(--cx-accent);font-style:italic}
.awards-history-actions{display:flex;gap:6px;margin-left:auto}.history-row{align-items:center}.awards-danger-zone{display:flex;justify-content:flex-end;margin-top:14px;padding-top:12px;border-top:1px solid color-mix(in srgb,var(--cx-accent-deep) 18%,transparent)}
@media(max-width:850px){.cr-entry-form{grid-template-columns:1fr}.cr-anon{padding-bottom:0}.cr-section-toolbar{grid-template-columns:1fr auto auto}.cr-section-toolbar .cr-section-title-input{grid-column:1/-1}.cr-panel{padding:15px}.cr-panel-head{align-items:stretch;flex-direction:column}}

.history-award-cell{display:inline-flex;align-items:center;gap:6px}.award-mini-delete{border:0;background:transparent;color:var(--cx-danger);font-size:17px;line-height:1;cursor:pointer;padding:2px 5px}.award-mini-delete:hover,.award-mini-delete:focus-visible{background:color-mix(in srgb,var(--cx-danger) 16%,transparent);outline:1px solid color-mix(in srgb,var(--cx-danger) 45%,transparent)}

/* ══ css/npcweb-redesign.css ══ */
/* ============================================================================
 * NPC Relationship Web — reference redesign (deploy143)
 * Left Find & Filter rail | center web (header, tabs, canvas, minimap, zoom)
 * | right Selected NPC inspector. Layers over the existing pan/zoom engine;
 * SVG node/edge internals keep their .nw-* hooks.
 * ==========================================================================*/
.nwx-app{
  --nwx-gold:var(--cx-accent); --nwx-gold-soft:var(--cx-accent-deep); --nwx-ink:var(--cx-bg);
  --nwx-line:color-mix(in srgb,var(--cx-accent) 22%,transparent); --nwx-line2:color-mix(in srgb,var(--cx-accent) 13%,transparent);
  --nwx-text:var(--cx-text); --nwx-dim:var(--cx-text-dim); --nwx-faint:var(--cx-accent-dim);
  --nwx-panel:color-mix(in srgb,var(--cx-field) 60%,transparent); --nwx-panel2:color-mix(in srgb,var(--cx-surface) 62%,transparent);
  --nwx-green:var(--cx-success); --nwx-blue:#5b93c8; --nwx-red:var(--cx-danger); --nwx-amber:var(--cx-accent); --nwx-gray:var(--cx-text-dim);
  display:grid; grid-template-columns:250px minmax(0,1fr) 0; gap:18px; align-items:start;
  color:var(--nwx-text); font-family:'EB Garamond',Georgia,serif; margin-top:6px;
}
.nwx-app.has-inspector{ grid-template-columns:250px minmax(0,1fr) 320px; }
.nwx-app *{ box-sizing:border-box; }
.nwx-app button{ font-family:inherit; }

/* ---- generic controls --------------------------------------------------- */
.nwx-btn{ font-family:'Cinzel',serif; font-size:11px; letter-spacing:.05em; text-transform:uppercase;
  display:inline-flex; align-items:center; gap:7px; padding:8px 13px; border-radius:8px; cursor:pointer;
  color:var(--nwx-text); background:color-mix(in srgb,var(--cx-accent) 6%,transparent); border:1px solid var(--nwx-line); transition:background .15s,border-color .15s,color .15s; }
.nwx-btn:hover{ background:color-mix(in srgb,var(--cx-accent) 13%,transparent); border-color:var(--nwx-gold-soft); }
.nwx-btn.on,.nwx-btn.active{ background:color-mix(in srgb,var(--cx-accent) 14%,transparent); border-color:var(--nwx-gold-soft); color:var(--nwx-gold); }
.nwx-btn.primary{ color:var(--nwx-ink); background:linear-gradient(180deg,var(--cx-accent),var(--cx-accent-deep)); border-color:var(--cx-accent); font-weight:600; }
.nwx-btn.primary:hover{ filter:brightness(1.06); }
.nwx-input,.nwx-select{ width:100%; font-family:'EB Garamond',serif; font-size:13.5px; color:var(--nwx-text);
  background:rgba(0,0,0,.3); border:1px solid var(--nwx-line); border-radius:8px; padding:9px 11px; }
.nwx-input:focus,.nwx-select:focus{ outline:none; border-color:var(--nwx-gold-soft); }
.nwx-select{ appearance:none; padding-right:28px;
  background-image:linear-gradient(45deg,transparent 50%,var(--nwx-dim) 50%),linear-gradient(135deg,var(--nwx-dim) 50%,transparent 50%);
  background-position:calc(100% - 15px) 17px,calc(100% - 10px) 17px; background-size:5px 5px; background-repeat:no-repeat; }

/* ---- left sidebar ------------------------------------------------------- */
.nwx-side{ position:sticky; top:8px; display:flex; flex-direction:column; gap:18px;
  border:1px solid var(--nwx-line); border-radius:14px; background:var(--nwx-panel); padding:18px 16px; }
.nwx-side-title{ font-family:'Cinzel',serif; font-size:14px; letter-spacing:.08em; text-transform:uppercase; color:var(--nwx-gold); }
.nwx-searchwrap{ position:relative; }
.nwx-searchwrap .nwx-search-ico{ position:absolute; right:11px; top:50%; transform:translateY(-50%); color:var(--nwx-dim); pointer-events:none; }
.nwx-group{ display:flex; flex-direction:column; gap:9px; }
.nwx-group.divide{ padding-top:16px; border-top:1px solid var(--nwx-line2); }
.nwx-glabel{ font-family:'Cinzel',serif; font-size:9.5px; letter-spacing:.12em; text-transform:uppercase; color:var(--nwx-gold-soft); }
.nwx-toggle-row{ display:flex; align-items:center; gap:10px; font-size:13.5px; color:var(--nwx-text); cursor:pointer; }
.nwx-switch{ position:relative; width:34px; height:19px; border-radius:11px; background:rgba(0,0,0,.4); border:1px solid var(--nwx-line); flex:0 0 auto; transition:background .15s; }
.nwx-switch::after{ content:''; position:absolute; top:2px; left:2px; width:13px; height:13px; border-radius:50%; background:var(--nwx-dim); transition:transform .15s,background .15s; }
.nwx-toggle-row.on .nwx-switch{ background:color-mix(in srgb,var(--cx-accent) 30%,transparent); border-color:var(--nwx-gold-soft); }
.nwx-toggle-row.on .nwx-switch::after{ transform:translateX(15px); background:var(--nwx-gold); }
.nwx-quick{ display:flex; flex-direction:column; gap:9px; }
.nwx-quick .nwx-btn{ justify-content:center; padding:10px; }
.nwx-legend{ display:flex; flex-direction:column; gap:8px; }
.nwx-leg-row{ display:flex; align-items:center; gap:10px; font-size:13px; color:var(--nwx-text); background:none; border:0; padding:2px 0; cursor:pointer; text-align:left; opacity:1; transition:opacity .15s; }
.nwx-leg-row.off{ opacity:.4; }
.nwx-leg-line{ width:34px; height:0; flex:0 0 auto; }
.nwx-export{ justify-content:center; }

/* ---- center column ------------------------------------------------------ */
.nwx-main{ min-width:0; display:flex; flex-direction:column; gap:14px; }
.nwx-head{ display:flex; align-items:flex-start; gap:16px; }
.nwx-head-txt{ margin-right:auto; }
.nwx-title{ font-family:'Cinzel',serif; font-size:26px; color:var(--nwx-gold); letter-spacing:.01em; line-height:1.1; }
.nwx-sub{ font-size:14px; color:var(--nwx-dim); font-style:italic; margin-top:4px; }
.nwx-head-actions{ display:flex; gap:8px; flex-wrap:wrap; }
.nwx-tabs{ display:flex; gap:26px; border-bottom:1px solid var(--nwx-line); }
.nwx-tab{ font-family:'Cinzel',serif; font-size:12px; letter-spacing:.06em; text-transform:uppercase; color:var(--nwx-dim);
  background:none; border:0; border-bottom:2px solid transparent; padding:11px 2px; cursor:pointer; margin-bottom:-1px; }
.nwx-tab:hover{ color:var(--nwx-text); }
.nwx-tab.active{ color:var(--nwx-gold); border-bottom-color:var(--nwx-gold); }

/* ---- canvas stage ------------------------------------------------------- */
.nw-stage{ position:relative; border:1px solid var(--nwx-line); border-radius:14px; overflow:hidden; background:radial-gradient(120% 120% at 50% 0%,color-mix(in srgb,var(--cx-surface) 50%,transparent),color-mix(in srgb,var(--cx-field) 75%,transparent)); }
.nw-canvas{ width:100%; height:min(72vh,760px); }
#nw-svg{ width:100%; height:100%; display:block; touch-action:none; cursor:grab; }
#nw-svg:active{ cursor:grabbing; }

/* node cards */
.nw-node{ cursor:pointer; }
.nw-card-bg{ fill:color-mix(in srgb,var(--cx-surface) 96%,transparent); stroke:var(--nwx-line); stroke-width:1.5; }
.nw-node.nw-selected .nw-card-bg,.nw-node.nw-flash .nw-card-bg{ stroke:var(--nwx-gold); stroke-width:2.5; filter:drop-shadow(0 0 10px color-mix(in srgb,var(--cx-accent) 55%,transparent)); }
.nw-card-bg.nw-dead{ stroke:var(--cx-danger); }
.nw-card-bg.nw-hidden{ stroke:#b48ede; stroke-dasharray:7 5; }
.nw-name{ fill:var(--cx-accent-bright); font-family:'Cinzel',serif; font-size:14px; font-weight:600; }
.nw-role{ fill:var(--nwx-dim); font-family:'EB Garamond',serif; font-size:12px; }
.nw-loc{ fill:var(--nwx-faint); font-family:'EB Garamond',serif; font-size:11.5px; }
.nw-initial{ fill:color-mix(in srgb,var(--cx-accent) 50%,transparent); font-family:'Cinzel',serif; font-size:34px; }
.nw-star{ fill:var(--nwx-gold); }
.nw-dots{ fill:var(--nwx-dim); }
.nw-cross line{ stroke:var(--cx-danger); stroke-width:3; stroke-linecap:round; }

/* edges */
.nw-edge-label rect{ fill:var(--cx-surface); stroke-width:1; rx:5; }
.nw-edge-label text{ font-family:'Cinzel',serif; font-size:11px; }

/* unconnected tray */
.nwx-tray{ border:1px dashed var(--nwx-line); border-radius:12px; background:var(--nwx-panel); padding:14px 16px; }
.nwx-tray-head{ font-family:'Cinzel',serif; font-size:10px; letter-spacing:.1em; text-transform:uppercase; color:var(--nwx-gold-soft); margin-bottom:10px; }
.nwx-tray-row{ display:flex; align-items:center; gap:14px; }
.nwx-tray-cards{ display:flex; gap:12px; flex-wrap:wrap; }
.nwx-tray-card{ width:96px; border:1px solid var(--nwx-line); border-radius:9px; background:var(--nwx-panel2); padding:8px; text-align:center; cursor:pointer; transition:border-color .15s; }
.nwx-tray-card:hover{ border-color:var(--nwx-gold-soft); }
.nwx-tray-portrait{ width:100%; height:64px; border-radius:6px; object-fit:cover; background:rgba(0,0,0,.35); display:flex; align-items:center; justify-content:center; color:var(--nwx-faint); font-family:'Cinzel',serif; font-size:22px; }
.nwx-tray-name{ font-family:'Cinzel',serif; font-size:10.5px; letter-spacing:.02em; text-transform:uppercase; color:var(--nwx-text); margin-top:6px; line-height:1.2; }
.nwx-tray-role{ font-size:11px; color:var(--nwx-dim); font-style:italic; }
.nwx-tray-hint{ color:var(--nwx-dim); font-size:14px; line-height:1.5; }

/* minimap + zoom overlays */
.nwx-minimap{ position:absolute; right:14px; bottom:60px; width:190px; height:120px; border:1px solid var(--nwx-line); border-radius:9px; background:color-mix(in srgb,var(--cx-field) 80%,transparent); overflow:hidden; }
.nwx-minimap svg{ width:100%; height:100%; display:block; }
.nwx-zoom{ position:absolute; right:14px; bottom:14px; display:flex; align-items:center; gap:6px; }
.nwx-zoom .nwx-zbtn{ width:38px; height:34px; display:flex; align-items:center; justify-content:center; font-size:17px;
  border:1px solid var(--nwx-line); border-radius:8px; background:color-mix(in srgb,var(--cx-field) 82%,transparent); color:var(--nwx-text); cursor:pointer; }
.nwx-zoom .nwx-zbtn:hover{ border-color:var(--nwx-gold-soft); color:var(--nwx-gold); }
.nwx-zoom .nwx-zlevel{ min-width:64px; height:34px; display:flex; align-items:center; justify-content:center;
  border:1px solid var(--nwx-line); border-radius:8px; background:color-mix(in srgb,var(--cx-field) 82%,transparent); color:var(--nwx-text); font-family:'Cinzel',serif; font-size:13px; }
#nw-status{ font-size:12px; }

/* connections / groups tab bodies */
.nwx-conn-list{ display:flex; flex-direction:column; border:1px solid var(--nwx-line); border-radius:12px; overflow:hidden; }
.nwx-conn-item{ display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:14px; padding:12px 16px; border-top:1px solid var(--nwx-line2); cursor:pointer; }
.nwx-conn-item:first-child{ border-top:0; }
.nwx-conn-item:hover{ background:color-mix(in srgb,var(--cx-accent) 4%,transparent); }
.nwx-conn-a{ font-family:'Cinzel',serif; font-size:14px; color:var(--nwx-text); text-align:right; }
.nwx-conn-b{ font-family:'Cinzel',serif; font-size:14px; color:var(--nwx-text); }
.nwx-conn-mid{ display:flex; flex-direction:column; align-items:center; gap:3px; }
.nwx-conn-type{ font-family:'Cinzel',serif; font-size:10px; letter-spacing:.05em; text-transform:uppercase; }
.nwx-group-block{ margin-bottom:18px; }
.nwx-group-h{ font-family:'Cinzel',serif; font-size:13px; letter-spacing:.08em; text-transform:uppercase; color:var(--nwx-gold-soft); padding-bottom:8px; border-bottom:1px solid var(--nwx-line); margin-bottom:12px; }
.nwx-group-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:10px; }
.nwx-mini-card{ display:flex; align-items:center; gap:10px; border:1px solid var(--nwx-line); border-radius:9px; padding:9px 11px; background:var(--nwx-panel2); cursor:pointer; }
.nwx-mini-card:hover{ border-color:var(--nwx-gold-soft); }
.nwx-mini-portrait{ width:34px; height:34px; border-radius:6px; object-fit:cover; flex:0 0 auto; background:rgba(0,0,0,.35); }

/* ---- right inspector ---------------------------------------------------- */
.nw-inspector{ position:sticky; top:8px; border:1px solid var(--nwx-line); border-radius:14px; background:var(--nwx-panel);
  padding:16px; display:flex; flex-direction:column; gap:14px; max-height:calc(100vh - 24px); overflow:auto; }
.nw-inspector[hidden]{ display:none; }
.nwx-ins-head{ display:flex; align-items:center; justify-content:space-between; }
.nwx-ins-head h3{ margin:0; font-family:'Cinzel',serif; font-size:13px; letter-spacing:.09em; text-transform:uppercase; color:var(--nwx-gold); }
.nwx-ins-close{ background:none; border:0; color:var(--nwx-dim); font-size:16px; cursor:pointer; }
.nwx-ins-close:hover{ color:var(--nwx-text); }
.nwx-ins-id{ display:flex; gap:13px; align-items:center; }
.nwx-ins-portrait{ width:78px; height:96px; border-radius:9px; object-fit:cover; flex:0 0 auto; border:1px solid var(--nwx-line); background:rgba(0,0,0,.35);
  display:flex; align-items:center; justify-content:center; color:var(--nwx-faint); font-family:'Cinzel',serif; font-size:26px; position:relative; }
.nwx-ins-portrait .nwx-ins-star{ position:absolute; top:5px; left:5px; color:var(--nwx-gold); }
.nwx-ins-name{ font-family:'Cinzel',serif; font-size:19px; color:var(--cx-accent-bright); line-height:1.15; }
.nwx-ins-role{ font-size:14px; color:var(--nwx-dim); margin-top:5px; }
.nwx-ins-loc{ font-size:13.5px; color:var(--nwx-dim); }
.nwx-ins-btns{ display:flex; gap:10px; }
.nwx-ins-btns .nwx-btn{ flex:1; justify-content:center; }
.nwx-ins-hide{ display:flex; align-items:center; justify-content:space-between; gap:10px; font-family:'Cinzel',serif; font-size:11px; letter-spacing:.05em; text-transform:uppercase; color:var(--nwx-dim); }
.nwx-ins-hlabel{ display:flex; align-items:center; gap:8px; }
.nwx-sec-label{ font-family:'Cinzel',serif; font-size:10px; letter-spacing:.1em; text-transform:uppercase; color:var(--nwx-gold-soft); }
.nwx-ins-conns{ display:flex; flex-direction:column; gap:2px; }
.nwx-ins-conn{ display:grid; grid-template-columns:auto 1fr auto auto; align-items:center; gap:9px; padding:7px 6px; background:none; border:0; border-radius:7px; cursor:pointer; text-align:left; }
.nwx-ins-conn:hover{ background:color-mix(in srgb,var(--cx-accent) 6%,transparent); }
.nwx-ins-conn-av{ width:22px; height:22px; border-radius:5px; object-fit:cover; background:rgba(0,0,0,.4); flex:0 0 auto; }
.nwx-ins-conn-name{ font-size:14px; color:var(--nwx-text); min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.nwx-ins-conn-type{ font-family:'Cinzel',serif; font-size:11px; }
.nwx-ins-conn-dir{ font-size:13px; }
.nwx-ins-conn-star{ color:var(--nwx-gold); font-size:12px; width:14px; }
.nwx-addrel{ width:100%; justify-content:center; }
.nwx-notes{ width:100%; min-height:78px; resize:vertical; font-family:'EB Garamond',serif; font-size:13.5px; color:var(--nwx-text);
  background:rgba(0,0,0,.28); border:1px solid var(--nwx-line); border-radius:8px; padding:9px 11px; }
.nwx-notes:focus{ outline:none; border-color:var(--nwx-gold-soft); }
.nwx-tags{ display:flex; flex-wrap:wrap; gap:7px; align-items:center; }
.nwx-tag{ display:inline-flex; align-items:center; gap:6px; font-family:'Cinzel',serif; font-size:11px; color:var(--nwx-text);
  background:color-mix(in srgb,var(--cx-accent) 8%,transparent); border:1px solid var(--nwx-line); border-radius:6px; padding:4px 9px; }
.nwx-tag button{ border:0; background:none; color:var(--nwx-dim); cursor:pointer; font-size:12px; padding:0; }
.nwx-tag button:hover{ color:var(--nwx-text); }
.nwx-tag-add{ font-family:'Cinzel',serif; font-size:11px; color:var(--nwx-dim); border:1px dashed var(--nwx-line); background:none; border-radius:6px; padding:4px 9px; cursor:pointer; }
.nwx-tag-add:hover{ color:var(--nwx-gold); border-color:var(--nwx-gold-soft); }
.nwx-ins-foot{ display:flex; align-items:center; justify-content:space-between; gap:10px; padding-top:6px; border-top:1px solid var(--nwx-line2); }
.nwx-ins-updated{ font-size:12px; color:var(--nwx-faint); font-style:italic; }

.nwx-empty{ padding:60px 20px; text-align:center; color:var(--nwx-dim); font-style:italic; }

@media(max-width:1180px){
  .nwx-app,.nwx-app.has-inspector{ grid-template-columns:1fr; }
  .nwx-side,.nw-inspector{ position:static; max-height:none; }
}

/* ══ css/factionweb-redesign.css ══ */
/* ============================================================================
 * Factions & Guilds — Faction Web reference redesign (deploy143)
 * Left Filters | center web (header, tabs, legend, canvas, minimap, zoom)
 * | right faction inspector. Scoped under .fwx-app; SVG uses .fw-* hooks.
 * ==========================================================================*/
.fwx-app{
  --fwx-gold:var(--cx-accent); --fwx-gold-soft:var(--cx-accent-deep); --fwx-ink:var(--cx-bg);
  --fwx-line:color-mix(in srgb,var(--cx-accent) 22%,transparent); --fwx-line2:color-mix(in srgb,var(--cx-accent) 13%,transparent);
  --fwx-text:var(--cx-text); --fwx-dim:var(--cx-text-dim); --fwx-faint:var(--cx-accent-dim);
  --fwx-panel:color-mix(in srgb,var(--cx-field) 60%,transparent); --fwx-panel2:color-mix(in srgb,var(--cx-surface) 62%,transparent);
  --fwx-green:var(--cx-success); --fwx-blue:#5b93c8; --fwx-amber:var(--cx-accent); --fwx-orange:var(--cx-accent-deep); --fwx-red:var(--cx-danger);
  display:grid; grid-template-columns:250px minmax(0,1fr) 0; gap:18px; align-items:start;
  color:var(--fwx-text); font-family:'EB Garamond',Georgia,serif; margin-top:6px;
}
.fwx-app.has-inspector{ grid-template-columns:250px minmax(0,1fr) 320px; }
.fwx-app *{ box-sizing:border-box; }
.fwx-app button{ font-family:inherit; }

.fwx-btn{ font-family:'Cinzel',serif; font-size:11px; letter-spacing:.05em; text-transform:uppercase;
  display:inline-flex; align-items:center; gap:7px; padding:8px 13px; border-radius:8px; cursor:pointer;
  color:var(--fwx-text); background:color-mix(in srgb,var(--cx-accent) 6%,transparent); border:1px solid var(--fwx-line); transition:background .15s,border-color .15s,color .15s; }
.fwx-btn:hover{ background:color-mix(in srgb,var(--cx-accent) 13%,transparent); border-color:var(--fwx-gold-soft); }
.fwx-btn.active{ background:color-mix(in srgb,var(--cx-accent) 14%,transparent); border-color:var(--fwx-gold-soft); color:var(--fwx-gold); }
.fwx-btn.primary{ color:var(--fwx-ink); background:linear-gradient(180deg,var(--cx-accent),var(--cx-accent-deep)); border-color:var(--cx-accent); font-weight:600; }
.fwx-btn.primary:hover{ filter:brightness(1.06); }
.fwx-btn.fwx-icon{ padding:8px 11px; }
.fwx-input,.fwx-select{ width:100%; font-family:'EB Garamond',serif; font-size:13.5px; color:var(--fwx-text);
  background:rgba(0,0,0,.3); border:1px solid var(--fwx-line); border-radius:8px; padding:9px 11px; }
.fwx-input:focus,.fwx-select:focus{ outline:none; border-color:var(--fwx-gold-soft); }
.fwx-select{ appearance:none; padding-right:28px;
  background-image:linear-gradient(45deg,transparent 50%,var(--fwx-dim) 50%),linear-gradient(135deg,var(--fwx-dim) 50%,transparent 50%);
  background-position:calc(100% - 15px) 17px,calc(100% - 10px) 17px; background-size:5px 5px; background-repeat:no-repeat; }

/* ---- sidebar ------------------------------------------------------------ */
.fwx-side{ position:sticky; top:8px; display:flex; flex-direction:column; gap:15px; border:1px solid var(--fwx-line); border-radius:14px; background:var(--fwx-panel); padding:18px 16px; }
.fwx-side-head{ display:flex; align-items:center; justify-content:space-between; }
.fwx-side-title{ font-family:'Cinzel',serif; font-size:14px; letter-spacing:.09em; text-transform:uppercase; color:var(--fwx-gold); }
.fwx-reset{ background:none; border:0; color:var(--fwx-dim); font-size:12px; cursor:pointer; font-family:'EB Garamond',serif; }
.fwx-reset:hover{ color:var(--fwx-gold); }
.fwx-searchwrap{ position:relative; }
.fwx-search-ico{ position:absolute; right:11px; top:50%; transform:translateY(-50%); color:var(--fwx-dim); pointer-events:none; }
.fwx-group{ display:flex; flex-direction:column; gap:8px; }
.fwx-group.divide{ padding-top:14px; border-top:1px solid var(--fwx-line2); }
.fwx-glabel{ font-family:'Cinzel',serif; font-size:9.5px; letter-spacing:.12em; text-transform:uppercase; color:var(--fwx-gold-soft); }
.fwx-toggle-row{ display:flex; align-items:center; gap:10px; font-size:13.5px; color:var(--fwx-text); cursor:pointer; }
.fwx-switch{ position:relative; width:34px; height:19px; border-radius:11px; background:rgba(0,0,0,.4); border:1px solid var(--fwx-line); flex:0 0 auto; transition:background .15s; }
.fwx-switch::after{ content:''; position:absolute; top:2px; left:2px; width:13px; height:13px; border-radius:50%; background:var(--fwx-dim); transition:transform .15s,background .15s; }
.fwx-toggle-row.on .fwx-switch{ background:color-mix(in srgb,var(--cx-accent) 30%,transparent); border-color:var(--fwx-gold-soft); }
.fwx-toggle-row.on .fwx-switch::after{ transform:translateX(15px); background:var(--fwx-gold); }
.fwx-quickf{ display:flex; align-items:center; gap:10px; width:100%; text-align:left; font-family:'EB Garamond',serif; font-size:13.5px; color:var(--fwx-text); background:none; border:1px solid transparent; border-radius:9px; padding:8px 11px; cursor:pointer; transition:background .15s,border-color .15s; }
.fwx-quickf:hover{ background:color-mix(in srgb,var(--cx-text-strong) 4%,transparent); }
.fwx-quickf.on{ background:color-mix(in srgb,var(--cx-accent) 12%,transparent); border-color:var(--fwx-gold-soft); color:var(--fwx-gold); }
.fwx-save-filter{ width:100%; justify-content:center; }

/* ---- center ------------------------------------------------------------- */
.fwx-main{ min-width:0; display:flex; flex-direction:column; gap:14px; }
.fwx-head{ display:flex; align-items:flex-start; gap:14px; }
.fwx-head-crest{ width:52px; height:52px; flex:0 0 auto; border:1px solid var(--fwx-line); border-radius:10px; display:flex; align-items:center; justify-content:center; color:var(--fwx-gold); font-size:24px; background:color-mix(in srgb,var(--cx-accent) 5%,transparent); }
.fwx-head-txt{ margin-right:auto; }
.fwx-title{ font-family:'Cinzel',serif; font-size:27px; color:var(--fwx-gold); letter-spacing:.01em; line-height:1.05; }
.fwx-sub{ font-size:14px; color:var(--fwx-dim); font-style:italic; margin-top:4px; }
.fwx-head-actions{ display:flex; gap:8px; }
.fwx-tabrow{ display:flex; align-items:flex-end; justify-content:space-between; border-bottom:1px solid var(--fwx-line); }
.fwx-tabs{ display:flex; gap:24px; }
.fwx-tab{ font-family:'Cinzel',serif; font-size:12px; letter-spacing:.05em; text-transform:uppercase; color:var(--fwx-dim); background:none; border:0; border-bottom:2px solid transparent; padding:11px 2px; cursor:pointer; margin-bottom:-1px; }
.fwx-tab:hover{ color:var(--fwx-text); }
.fwx-tab.active{ color:var(--fwx-gold); border-bottom-color:var(--fwx-gold); }
.fwx-tab-actions{ display:flex; gap:8px; padding-bottom:6px; }

.fwx-legend{ display:flex; flex-wrap:wrap; gap:20px; padding:2px 2px 0; }
.fwx-leg{ display:inline-flex; align-items:center; gap:8px; font-family:'Cinzel',serif; font-size:10px; letter-spacing:.07em; color:var(--fwx-dim); }

/* ---- canvas ------------------------------------------------------------- */
.fwx-stage{ position:relative; border:1px solid var(--fwx-line); border-radius:14px; overflow:hidden; background:radial-gradient(120% 120% at 50% 0%,color-mix(in srgb,var(--cx-surface) 50%,transparent),color-mix(in srgb,var(--cx-field) 78%,transparent)); }
.fw-canvas{ width:100%; height:min(70vh,720px); }
#fw-svg{ width:100%; height:100%; display:block; touch-action:none; cursor:grab; }
#fw-svg:active{ cursor:grabbing; }
.fw-node{ cursor:pointer; }
.fw-glow{ fill:color-mix(in srgb,var(--cx-accent) 5%,transparent); }
.fw-node.fw-selected .fw-glow{ fill:color-mix(in srgb,var(--cx-accent) 16%,transparent); }
.fw-ring{ stroke:color-mix(in srgb,var(--cx-accent) 50%,transparent); stroke-width:2.5; }
.fw-ring.fw-major{ stroke:var(--fwx-gold); stroke-width:3; }
.fw-ring.fw-dead{ stroke:var(--fwx-red); stroke-dasharray:6 5; }
.fw-node.fw-selected .fw-ring{ stroke:var(--fwx-gold); stroke-width:3.5; filter:drop-shadow(0 0 9px color-mix(in srgb,var(--cx-accent) 60%,transparent)); }
.fw-initial{ fill:color-mix(in srgb,var(--cx-accent) 55%,transparent); font-family:'Cinzel',serif; font-size:34px; }
.fw-name{ fill:var(--cx-accent-bright); font-family:'Cinzel',serif; font-size:14px; font-weight:600; letter-spacing:.02em; }
.fw-tag{ fill:var(--fwx-dim); font-family:'EB Garamond',serif; font-size:12px; }
.fw-x{ stroke:var(--fwx-red); stroke-width:3; stroke-linecap:round; }
.fw-edge-label rect{ fill:var(--cx-surface); }
.fw-edge-label text{ font-family:'Cinzel',serif; font-size:11px; }

.fwx-minimap{ position:absolute; left:14px; bottom:58px; width:180px; height:112px; border:1px solid var(--fwx-line); border-radius:9px; background:color-mix(in srgb,var(--cx-field) 82%,transparent); overflow:hidden; }
.fwx-minimap svg{ width:100%; height:100%; display:block; }
.fwx-zoom{ position:absolute; left:14px; bottom:14px; display:flex; align-items:center; gap:6px; }
.fwx-zbtn{ width:38px; height:34px; display:flex; align-items:center; justify-content:center; font-size:16px; border:1px solid var(--fwx-line); border-radius:8px; background:color-mix(in srgb,var(--cx-field) 85%,transparent); color:var(--fwx-text); cursor:pointer; }
.fwx-zbtn:hover{ border-color:var(--fwx-gold-soft); color:var(--fwx-gold); }
.fwx-zlevel{ min-width:60px; height:34px; display:flex; align-items:center; justify-content:center; border:1px solid var(--fwx-line); border-radius:8px; background:color-mix(in srgb,var(--cx-field) 85%,transparent); color:var(--fwx-text); font-family:'Cinzel',serif; font-size:13px; }
.fwx-zoom #fw-status{ margin-left:6px; font-size:12px; }
.fwx-empty{ padding:70px 20px; text-align:center; color:var(--fwx-dim); font-style:italic; }

/* list / groups / timeline tabs */
.fwx-list{ display:flex; flex-direction:column; border:1px solid var(--fwx-line); border-radius:12px; overflow:hidden; }
.fwx-list-row{ display:grid; grid-template-columns:auto 1fr auto auto; align-items:center; gap:14px; padding:11px 15px; border-top:1px solid var(--fwx-line2); background:none; cursor:pointer; text-align:left; }
.fwx-list-row:first-child{ border-top:0; }
.fwx-list-row:hover{ background:color-mix(in srgb,var(--cx-accent) 4%,transparent); }
.fwx-list-crest{ width:40px; height:40px; border-radius:50%; object-fit:cover; flex:0 0 auto; }
.fwx-list-crest.ph,.fwx-mini-crest.ph{ display:flex; align-items:center; justify-content:center; background:rgba(0,0,0,.35); color:var(--fwx-faint); font-family:'Cinzel',serif; }
.fwx-list-name{ font-family:'Cinzel',serif; font-size:15px; color:var(--fwx-text); }
.fwx-star{ color:var(--fwx-gold); font-size:11px; }
.fwx-list-tag{ display:block; font-size:12.5px; color:var(--fwx-dim); font-style:italic; }
.fwx-list-meta{ font-size:13px; color:var(--fwx-dim); }
.fwx-list-conn{ font-family:'Cinzel',serif; font-size:11px; color:var(--fwx-gold-soft); }
.fwx-group-block{ margin-bottom:18px; }
.fwx-group-h{ font-family:'Cinzel',serif; font-size:13px; letter-spacing:.08em; text-transform:uppercase; color:var(--fwx-gold-soft); padding-bottom:8px; border-bottom:1px solid var(--fwx-line); margin-bottom:12px; }
.fwx-group-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(190px,1fr)); gap:10px; }
.fwx-mini-card{ display:flex; align-items:center; gap:11px; border:1px solid var(--fwx-line); border-radius:10px; padding:9px 11px; background:var(--fwx-panel2); cursor:pointer; text-align:left; }
.fwx-mini-card:hover{ border-color:var(--fwx-gold-soft); }
.fwx-mini-crest{ width:38px; height:38px; border-radius:50%; object-fit:cover; flex:0 0 auto; }
.fwx-mini-name{ font-family:'Cinzel',serif; font-size:13.5px; color:var(--fwx-text); }
.fwx-mini-tag{ font-size:12px; color:var(--fwx-dim); font-style:italic; }
.fwx-timeline{ display:flex; flex-direction:column; gap:2px; }
.fwx-tl-row{ display:grid; grid-template-columns:120px auto 1fr; align-items:center; gap:14px; padding:10px 8px; background:none; border:0; cursor:pointer; text-align:left; }
.fwx-tl-row:hover{ background:color-mix(in srgb,var(--cx-accent) 4%,transparent); border-radius:8px; }
.fwx-tl-date{ font-family:'Cinzel',serif; font-size:11px; letter-spacing:.04em; color:var(--fwx-gold-soft); }
.fwx-tl-dot{ width:9px; height:9px; border-radius:50%; background:var(--fwx-gold); }
.fwx-tl-name{ font-family:'Cinzel',serif; font-size:14px; color:var(--fwx-text); }
.fwx-tl-tag{ font-size:12px; color:var(--fwx-dim); font-style:italic; margin-left:8px; }

/* ---- inspector ---------------------------------------------------------- */
.fwx-inspector{ position:sticky; top:8px; border:1px solid var(--fwx-line); border-radius:14px; background:var(--fwx-panel); padding:16px; display:flex; flex-direction:column; gap:14px; max-height:calc(100vh - 24px); overflow:auto; }
.fwx-inspector[hidden]{ display:none; }
.fwx-ins-head{ display:flex; align-items:center; justify-content:space-between; }
.fwx-ins-head h3{ margin:0; font-family:'Cinzel',serif; font-size:15px; letter-spacing:.04em; color:var(--fwx-gold); line-height:1.15; }
.fwx-ins-close{ background:none; border:0; color:var(--fwx-dim); font-size:16px; cursor:pointer; }
.fwx-ins-close:hover{ color:var(--fwx-text); }
.fwx-ins-id{ display:flex; gap:13px; align-items:center; }
.fwx-ins-crest{ width:64px; height:64px; border-radius:50%; flex:0 0 auto; border:1px solid var(--fwx-gold-soft); background:rgba(0,0,0,.35) center/cover; display:flex; align-items:center; justify-content:center; }
.fwx-ins-crest.ph{ color:var(--fwx-faint); font-family:'Cinzel',serif; font-size:24px; }
.fwx-ins-tag{ font-size:13.5px; color:var(--fwx-dim); }
.fwx-ins-badges{ display:flex; flex-wrap:wrap; gap:6px; margin-top:7px; }
.fwx-badge{ font-family:'Cinzel',serif; font-size:10px; letter-spacing:.03em; color:var(--fwx-text); background:color-mix(in srgb,var(--cx-accent) 8%,transparent); border:1px solid var(--fwx-line); border-radius:6px; padding:3px 8px; }
.fwx-badge.gold{ color:var(--fwx-gold); border-color:var(--fwx-gold-soft); }
.fwx-ins-btns{ display:flex; gap:10px; }
.fwx-ins-btns .fwx-btn{ flex:1; justify-content:center; }
.fwx-ins-rows{ display:flex; flex-direction:column; gap:0; border-top:1px solid var(--fwx-line2); }
.fwx-ins-row{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:8px 0; border-bottom:1px solid var(--fwx-line2); }
.fwx-ins-k{ font-family:'Cinzel',serif; font-size:10px; letter-spacing:.08em; text-transform:uppercase; color:var(--fwx-dim); }
.fwx-ins-v{ font-size:14px; color:var(--fwx-text); text-align:right; }
.fwx-ins-inf{ display:flex; gap:5px; }
.fwx-inf{ width:12px; height:12px; border-radius:50%; background:color-mix(in srgb,var(--cx-text-strong) 10%,transparent); border:1px solid var(--fwx-line); cursor:pointer; }
.fwx-inf.on{ background:var(--fwx-gold); border-color:var(--fwx-gold); }
.fwx-ins-hide{ display:flex; align-items:center; justify-content:space-between; gap:10px; font-family:'Cinzel',serif; font-size:10px; letter-spacing:.06em; text-transform:uppercase; color:var(--fwx-dim); }
.fwx-ins-sec{ display:flex; flex-direction:column; gap:9px; padding-top:12px; border-top:1px solid var(--fwx-line2); }
.fwx-ins-sechead{ font-family:'Cinzel',serif; font-size:10px; letter-spacing:.09em; text-transform:uppercase; color:var(--fwx-gold-soft); }
.fwx-ins-conns{ display:flex; flex-direction:column; gap:1px; }
.fwx-ins-conn{ display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:10px; padding:7px 6px; background:none; border:0; border-radius:7px; cursor:pointer; text-align:left; }
.fwx-ins-conn:hover{ background:color-mix(in srgb,var(--cx-accent) 6%,transparent); }
.fwx-ins-conn-av{ width:24px; height:24px; border-radius:50%; object-fit:cover; flex:0 0 auto; background:rgba(0,0,0,.4); }
.fwx-ins-conn-av.ph{ display:flex; align-items:center; justify-content:center; color:var(--fwx-faint); font-family:'Cinzel',serif; font-size:11px; }
.fwx-ins-conn-name{ font-size:14px; color:var(--fwx-text); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.fwx-ins-conn-type{ font-family:'Cinzel',serif; font-size:11px; }
.fwx-ins-none{ color:var(--fwx-faint); font-style:italic; font-size:13px; }
.fwx-addrel{ width:100%; justify-content:center; }
.fwx-notes{ width:100%; min-height:76px; resize:vertical; font-family:'EB Garamond',serif; font-size:13.5px; color:var(--fwx-text); background:rgba(0,0,0,.28); border:1px solid var(--fwx-line); border-radius:8px; padding:9px 11px; }
.fwx-notes:focus{ outline:none; border-color:var(--fwx-gold-soft); }
.fwx-ins-foot{ display:flex; align-items:center; justify-content:space-between; gap:10px; }
.fwx-ins-updated{ font-size:12px; color:var(--fwx-faint); font-style:italic; }
.fwx-ins-dates{ display:flex; gap:24px; padding-top:12px; border-top:1px solid var(--fwx-line2); font-size:13px; color:var(--fwx-dim); }
.fwx-ins-dk{ display:block; font-family:'Cinzel',serif; font-size:9px; letter-spacing:.08em; text-transform:uppercase; color:var(--fwx-faint); margin-bottom:3px; }

.fw-modal-2col{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }

@media(max-width:1180px){
  .fwx-app,.fwx-app.has-inspector{ grid-template-columns:1fr; }
  .fwx-side,.fwx-inspector{ position:static; max-height:none; }
}

/* ══ css/story-timeline.css ══ */
/* ============================================================================
 * Story So Far — Campaign Timeline (deploy143 redesign)
 * Scoped under .st-app. Three-column builder: filters | timeline | edit panel.
 * ==========================================================================*/
.st-app{
  --st-gold:var(--cx-accent); --st-gold-soft:var(--cx-accent-deep); --st-ink:var(--cx-bg);
  --st-line:color-mix(in srgb,var(--cx-accent) 22%,transparent); --st-line-2:color-mix(in srgb,var(--cx-accent) 14%,transparent);
  --st-text:var(--cx-text); --st-dim:var(--cx-text-dim); --st-faint:var(--cx-accent-dim);
  --st-panel:color-mix(in srgb,var(--cx-field) 55%,transparent); --st-panel-2:color-mix(in srgb,var(--cx-surface) 60%,transparent);
  --st-red:var(--cx-danger); --st-green:var(--cx-success); --st-purple:#a86cc8; --st-blue:#5b93c8; --st-teal:#4fae9b;
  display:grid; grid-template-columns:262px minmax(0,1fr) 0; gap:22px;
  align-items:start; color:var(--st-text); font-family:'EB Garamond',Georgia,serif;
}
.st-app.st-editing{ grid-template-columns:262px minmax(0,1fr) 352px; }
.st-app *{ box-sizing:border-box; }

/* ---- shared bits -------------------------------------------------------- */
.st-app .st-eyebrow{ font-family:'Cinzel',serif; font-size:10px; letter-spacing:.16em; text-transform:uppercase; color:var(--st-gold-soft); }
.st-app .st-btn{ font-family:'Cinzel',serif; font-size:11px; letter-spacing:.06em; text-transform:uppercase;
  display:inline-flex; align-items:center; gap:7px; padding:8px 14px; border-radius:8px; cursor:pointer;
  color:var(--st-text); background:color-mix(in srgb,var(--cx-accent) 6%,transparent); border:1px solid var(--st-line); transition:background .15s,border-color .15s,color .15s; }
.st-app .st-btn:hover{ background:color-mix(in srgb,var(--cx-accent) 13%,transparent); border-color:var(--st-gold-soft); }
.st-app .st-btn.st-primary{ color:var(--st-ink); background:linear-gradient(180deg,var(--cx-accent),var(--cx-accent-deep));
  border-color:var(--cx-accent); font-weight:600; box-shadow:0 2px 10px color-mix(in srgb,var(--cx-accent-deep) 25%,transparent); }
.st-app .st-btn.st-primary:hover{ filter:brightness(1.06); }
.st-app .st-btn.st-danger{ color:var(--cx-danger); border-color:color-mix(in srgb,var(--cx-danger) 45%,transparent); background:color-mix(in srgb,var(--cx-danger) 8%,transparent); }
.st-app .st-btn.st-danger:hover{ background:color-mix(in srgb,var(--cx-danger) 16%,transparent); border-color:var(--st-red); }
.st-app .st-btn-ghost{ border:0; background:none; color:var(--st-dim); padding:6px 8px; cursor:pointer; font-size:15px; border-radius:6px; }
.st-app .st-btn-ghost:hover{ color:var(--st-text); background:color-mix(in srgb,var(--cx-text-strong) 5%,transparent); }
.st-app .st-input,.st-app .st-select,.st-app .st-textarea{
  width:100%; font-family:'EB Garamond',serif; font-size:14px; color:var(--st-text);
  background:rgba(0,0,0,.28); border:1px solid var(--st-line); border-radius:8px; padding:9px 11px; }
.st-app .st-input:focus,.st-app .st-select:focus,.st-app .st-textarea:focus{ outline:none; border-color:var(--st-gold-soft); }
.st-app .st-select{ appearance:none; background-image:linear-gradient(45deg,transparent 50%,var(--st-dim) 50%),linear-gradient(135deg,var(--st-dim) 50%,transparent 50%);
  background-position:calc(100% - 16px) 17px,calc(100% - 11px) 17px; background-size:5px 5px,5px 5px; background-repeat:no-repeat; padding-right:30px; }
.st-app .st-label{ display:block; font-family:'Cinzel',serif; font-size:9.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--st-dim); margin:0 0 6px; }

/* ---- left sidebar ------------------------------------------------------- */
.st-side{ position:sticky; top:8px; display:flex; flex-direction:column; gap:20px;
  border:1px solid var(--st-line); border-radius:14px; background:var(--st-panel); padding:20px 18px; }
.st-side-title{ font-family:'Cinzel',serif; font-size:19px; letter-spacing:.03em; color:var(--st-gold); line-height:1.15; }
.st-side-sub{ font-size:13.5px; color:var(--st-dim); margin-top:5px; line-height:1.4; }
.st-side .st-add{ width:100%; justify-content:center; padding:11px; }
.st-side-group{ display:flex; flex-direction:column; gap:9px; }
.st-side-group + .st-side-group{ padding-top:18px; border-top:1px solid var(--st-line-2); }
.st-group-label{ font-family:'Cinzel',serif; font-size:9.5px; letter-spacing:.12em; text-transform:uppercase; color:var(--st-gold-soft); margin-bottom:2px; }
.st-view-btn{ display:flex; align-items:center; gap:10px; width:100%; text-align:left; font-family:'EB Garamond',serif; font-size:14px;
  color:var(--st-text); background:none; border:1px solid transparent; border-radius:9px; padding:9px 11px; cursor:pointer; transition:background .15s,border-color .15s; }
.st-view-btn:hover{ background:color-mix(in srgb,var(--cx-text-strong) 4%,transparent); }
.st-view-btn.active{ background:color-mix(in srgb,var(--cx-accent) 12%,transparent); border-color:var(--st-line); color:var(--st-gold); }
.st-view-btn svg{ width:16px; height:16px; flex:0 0 auto; opacity:.85; }
.st-check{ display:flex; align-items:center; gap:9px; font-size:13.5px; color:var(--st-text); cursor:pointer; padding:2px 0; }
.st-check input{ width:15px; height:15px; accent-color:var(--st-gold); }
.st-quick{ display:flex; flex-wrap:wrap; gap:7px; }
.st-quick-tag{ font-family:'EB Garamond',serif; font-size:12.5px; color:var(--st-text); background:rgba(0,0,0,.25);
  border:1px solid var(--st-line); border-radius:7px; padding:4px 11px; cursor:pointer; transition:all .15s; }
.st-quick-tag:hover{ border-color:var(--st-gold-soft); }
.st-quick-tag.on{ color:var(--st-ink); font-weight:600; }
.st-export{ width:100%; justify-content:center; margin-top:2px; }

/* ---- center: toolbar + timeline ---------------------------------------- */
.st-center{ min-width:0; display:flex; flex-direction:column; gap:16px; }
.st-viewbar{ display:flex; align-items:center; justify-content:flex-end; gap:8px; }
.st-toolbar{ display:flex; align-items:center; gap:12px; flex-wrap:wrap;
  border:1px solid var(--st-line); border-radius:12px; background:var(--st-panel); padding:12px 16px; }
.st-tb-title{ font-family:'Cinzel',serif; font-size:17px; color:var(--st-text); margin-right:auto; }
.st-range{ display:inline-flex; align-items:center; gap:8px; }
.st-range .st-eyebrow{ letter-spacing:.1em; }
.st-range select{ width:auto; min-width:96px; padding:7px 30px 7px 11px; font-size:13px; }
.st-tb-actions{ display:flex; gap:8px; }
.st-tb-actions .st-btn{ padding:7px 12px; }

/* ---- timeline view ------------------------------------------------------ */
.st-list{ position:relative; padding:4px 0 4px 0; }
.st-spine{ position:absolute; left:31px; top:14px; bottom:14px; width:2px; background:linear-gradient(180deg,transparent,var(--st-line) 6%,var(--st-line) 94%,transparent); }
.st-event{ position:relative; display:grid; grid-template-columns:64px minmax(0,1fr); align-items:start; margin-bottom:14px; }
.st-node{ position:relative; z-index:2; display:flex; align-items:flex-start; justify-content:center; padding-top:18px; }
.st-node-ring{ width:44px; height:44px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  background:var(--st-ink); border:2px solid var(--nodec,var(--st-gold-soft)); box-shadow:0 0 0 4px color-mix(in srgb,var(--cx-field) 90%,transparent),0 0 14px -2px var(--nodec,transparent); }
.st-node-ring svg{ width:21px; height:21px; color:var(--nodec,var(--st-gold)); }
.st-card{ border:1px solid var(--st-line); border-radius:12px; background:var(--st-panel-2);
  padding:16px 18px; display:grid; grid-template-columns:minmax(0,1fr) auto; gap:6px 18px; transition:border-color .15s,box-shadow .15s; cursor:pointer; }
.st-card:hover{ border-color:color-mix(in srgb,var(--cx-accent) 40%,transparent); }
.st-event.sel .st-card{ border-color:var(--st-gold); box-shadow:0 0 0 1px var(--st-gold),0 8px 24px rgba(0,0,0,.4); }
.st-card-session{ font-family:'Cinzel',serif; font-size:10px; letter-spacing:.12em; text-transform:uppercase; color:var(--st-gold-soft); }
.st-card-title{ font-family:'Cinzel',serif; font-size:20px; color:var(--st-text); line-height:1.2; margin:3px 0 8px; }
.st-card-desc{ font-size:14.5px; color:var(--cx-accent-bright); line-height:1.55; max-width:60ch; }
.st-card-meta{ grid-column:2; grid-row:1/3; text-align:right; display:flex; flex-direction:column; align-items:flex-end; gap:4px; min-width:118px; }
.st-card-date{ font-family:'Cinzel',serif; font-size:13px; color:var(--st-text); display:inline-flex; align-items:center; gap:6px; white-space:nowrap; }
.st-card-loc{ font-size:13.5px; color:var(--st-dim); font-style:italic; }
.st-secret-eye{ opacity:.6; }
.st-card-tags{ grid-column:1; display:flex; flex-wrap:wrap; gap:7px; margin-top:10px; }
.st-tag{ font-family:'Cinzel',serif; font-size:10.5px; letter-spacing:.04em; padding:3px 10px; border-radius:6px; text-transform:none; border:1px solid transparent; }
.st-card-dots{ grid-column:2; grid-row:1/3; }
.st-menu-btn{ position:absolute; top:12px; right:12px; }
.st-card-wrap{ position:relative; }
.st-collapsed .st-card-desc,.st-collapsed .st-card-tags{ display:none; }
.st-secret-badge{ display:inline-flex; align-items:center; gap:5px; font-family:'Cinzel',serif; font-size:9.5px; letter-spacing:.08em; text-transform:uppercase; color:#c98fbf; margin-top:4px; }

/* list view */
.st-app.view-list .st-spine,.st-app.view-list .st-node{ display:none; }
.st-app.view-list .st-event{ grid-template-columns:1fr; margin-bottom:9px; }
.st-app.view-list .st-card{ padding:12px 16px; }
.st-app.view-list .st-card-title{ font-size:16px; margin:2px 0 4px; }
.st-app.view-list .st-collapsed .st-card-desc{ display:block; -webkit-line-clamp:1; }

/* calendar view */
.st-cal-group{ margin-bottom:20px; }
.st-cal-head{ font-family:'Cinzel',serif; font-size:13px; letter-spacing:.1em; text-transform:uppercase; color:var(--st-gold-soft);
  padding-bottom:8px; margin-bottom:12px; border-bottom:1px solid var(--st-line); }

.st-add-here{ display:flex; align-items:center; justify-content:center; gap:8px; width:100%; margin-top:6px;
  border:1px dashed var(--st-line); border-radius:12px; background:none; color:var(--st-dim);
  font-family:'Cinzel',serif; font-size:11px; letter-spacing:.06em; text-transform:uppercase; padding:15px; cursor:pointer; transition:all .15s; }
.st-add-here:hover{ border-color:var(--st-gold-soft); color:var(--st-gold); background:color-mix(in srgb,var(--cx-accent) 4%,transparent); }
.st-empty{ text-align:center; color:var(--st-dim); font-style:italic; padding:50px 20px; }

/* ---- right: edit panel -------------------------------------------------- */
.st-edit{ position:sticky; top:8px; border:1px solid var(--st-line); border-radius:14px; background:var(--st-panel);
  padding:18px; display:none; flex-direction:column; gap:15px; max-height:calc(100vh - 24px); overflow:auto; }
.st-app.st-editing .st-edit{ display:flex; }
.st-edit-head{ display:flex; align-items:center; justify-content:space-between; }
.st-edit-head h3{ font-family:'Cinzel',serif; font-size:14px; letter-spacing:.08em; text-transform:uppercase; color:var(--st-gold); margin:0; }
.st-field{ display:flex; flex-direction:column; }
.st-row2{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.st-loc-row{ display:flex; gap:7px; }
.st-loc-row .st-select{ flex:1; }
.st-icon-add{ flex:0 0 auto; width:38px; padding:0; justify-content:center; }
.st-rt-toolbar{ display:flex; gap:2px; border:1px solid var(--st-line); border-bottom:0; border-radius:8px 8px 0 0; padding:5px 6px; background:rgba(0,0,0,.2); }
.st-rt-toolbar button{ width:28px; height:26px; border:0; background:none; color:var(--st-dim); border-radius:5px; cursor:pointer; font-size:13px; display:flex; align-items:center; justify-content:center; }
.st-rt-toolbar button:hover{ background:color-mix(in srgb,var(--cx-text-strong) 7%,transparent); color:var(--st-text); }
.st-rt{ min-height:104px; border-radius:0 0 8px 8px; font-family:'EB Garamond',serif; font-size:14px; line-height:1.5; }
.st-rt:focus{ border-color:var(--st-gold-soft); }
.st-taglist{ display:flex; flex-wrap:wrap; gap:7px; align-items:center; }
.st-tag-chip{ display:inline-flex; align-items:center; gap:6px; font-family:'Cinzel',serif; font-size:10.5px; padding:4px 8px 4px 10px; border-radius:6px; border:1px solid transparent; }
.st-tag-chip button{ border:0; background:none; color:inherit; cursor:pointer; opacity:.7; font-size:12px; line-height:1; padding:0; }
.st-tag-chip button:hover{ opacity:1; }
.st-tag-add{ font-family:'Cinzel',serif; font-size:10.5px; letter-spacing:.03em; color:var(--st-dim); border:1px dashed var(--st-line); background:none; border-radius:6px; padding:4px 10px; cursor:pointer; }
.st-tag-add:hover{ color:var(--st-gold); border-color:var(--st-gold-soft); }
.st-img-row{ display:flex; align-items:center; gap:10px; }
.st-img-thumb{ width:56px; height:42px; border-radius:6px; object-fit:cover; border:1px solid var(--st-line); background:rgba(0,0,0,.3); }
.st-img-thumb.empty{ display:flex; align-items:center; justify-content:center; color:var(--st-faint); font-size:16px; }
.st-notes{ background:color-mix(in srgb,var(--cx-danger) 5%,transparent); border-color:color-mix(in srgb,var(--cx-danger) 28%,transparent); }
.st-edit-actions{ display:flex; gap:10px; padding-top:6px; border-top:1px solid var(--st-line-2); margin-top:2px; }
.st-edit-actions .st-btn{ flex:1; justify-content:center; }
.st-edit-note{ font-size:12.5px; color:var(--st-dim); font-style:italic; }
.st-status{ font-size:12px; color:var(--st-dim); min-height:14px; }
.st-status.err{ color:var(--st-red); }

/* dropdown menu */
.st-popmenu{ position:absolute; z-index:40; min-width:158px; background:var(--cx-surface); border:1px solid var(--st-line);
  border-radius:9px; box-shadow:0 12px 30px rgba(0,0,0,.55); padding:5px; }
.st-popmenu button{ display:block; width:100%; text-align:left; font-family:'EB Garamond',serif; font-size:13.5px; color:var(--st-text);
  background:none; border:0; border-radius:6px; padding:8px 11px; cursor:pointer; }
.st-popmenu button:hover{ background:color-mix(in srgb,var(--cx-accent) 10%,transparent); }
.st-popmenu button.danger{ color:var(--cx-danger); }

@media(max-width:1180px){
  .st-app,.st-app.st-editing{ grid-template-columns:1fr; }
  .st-side{ position:static; }
  .st-edit{ position:static; max-height:none; }
}

/* deploy145 (#3): linked-session badge on timeline cards */
.st-sess-link{color:var(--st-gold-soft);text-decoration:none;border-bottom:1px dotted var(--st-gold-soft);cursor:pointer}
.st-sess-link:hover{color:var(--st-gold);border-bottom-color:var(--st-gold)}

/* ══ css/codex-pages-redesign.css ══ */
/* ==========================================================================
 * codex-pages-redesign.css — deploy143 reference redesigns
 * Pantheon & Powers (.pwx) · Creatures & Companions (.cwx)
 * Campaign Rules & Safety (.rsx) · Campaign Wiki (.wkx)
 * Dark-gold codex palette, Cinzel / EB Garamond. All prefixed; scoped to
 * each page's mounted root so nothing else is affected.
 * ==========================================================================*/

/* shared modal extras */
.cx-check{display:flex;align-items:center;gap:8px;color:var(--cx-text-soft);font-size:13.5px;margin-top:10px;cursor:pointer}
.cx-check input{accent-color:var(--cx-accent-deep);width:16px;height:16px}
.cx-modal-card.wide{max-width:760px}
.cx-textarea.mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:13px;line-height:1.55}
.cx-modal-status.err{color:var(--cx-danger)}
.pw-modal-2col,.cw-modal-2col,.rs-modal-2col,.wk-modal-2col{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.cw-modal-3col{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px}
.pw-modal-flags{display:flex;flex-wrap:wrap;gap:16px;margin-top:6px}
.pw-symgrid{display:flex;flex-wrap:wrap;gap:6px}
.pw-sym{width:38px;height:38px;font-size:19px;background:var(--cx-field);border:1px solid color-mix(in srgb,var(--cx-accent) 30%,transparent);border-radius:8px;color:var(--cx-text);cursor:pointer}
.pw-sym.sel{border-color:var(--cx-accent);background:color-mix(in srgb,var(--cx-accent) 16%,transparent)}
.wk-editor-hint{color:var(--cx-text-dim);font-size:11.5px;margin:2px 0 6px}

/* ============================ shared page frame ============================ */
.pwx-app,.cwx-app,.wkx-app{display:grid;gap:0;min-height:78vh;align-items:start;
  font-family:"EB Garamond",Georgia,serif;color:var(--cx-text)}
.pwx-app{grid-template-columns:236px 1fr 300px}
.cwx-app{grid-template-columns:236px 1fr 0}
.cwx-app.has-inspector{grid-template-columns:236px 1fr 340px}
.wkx-app{grid-template-columns:252px 1fr 288px}

.pwx-side,.cwx-side{padding:22px 20px;border-right:1px solid color-mix(in srgb,var(--cx-accent) 12%,transparent)}
.pwx-side-head,.cwx-side-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.pwx-side-title,.cwx-side-title{font-family:Cinzel,serif;letter-spacing:.14em;text-transform:uppercase;font-size:13px;color:var(--cx-accent-deep)}
.pwx-reset,.cwx-reset{background:none;border:none;color:var(--cx-text-dim);font-size:12px;cursor:pointer;font-family:"EB Garamond",serif}
.pwx-reset:hover,.cwx-reset:hover{color:var(--cx-accent)}
.pwx-searchwrap,.cwx-searchwrap{position:relative;margin-bottom:16px}
.pwx-input,.cwx-input{width:100%;box-sizing:border-box;background:var(--cx-field);border:1px solid color-mix(in srgb,var(--cx-accent) 22%,transparent);border-radius:8px;color:var(--cx-text);padding:9px 30px 9px 11px;font-size:14px;font-family:inherit}
.pwx-search-ico,.cwx-search-ico{position:absolute;right:9px;top:50%;transform:translateY(-50%);font-size:12px;opacity:.6}
.pwx-group,.cwx-group{margin-bottom:14px}
.pwx-group.divide{border-top:1px solid color-mix(in srgb,var(--cx-accent) 12%,transparent);padding-top:14px;margin-top:16px}
.pwx-glabel,.cwx-glabel{font-size:10.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--cx-text-dim);margin-bottom:5px}
.pwx-glabel.gold{color:var(--cx-accent-deep)}
.pwx-select,.cwx-select{width:100%;box-sizing:border-box;background:var(--cx-field);border:1px solid color-mix(in srgb,var(--cx-accent) 22%,transparent);border-radius:8px;color:var(--cx-text-soft);padding:9px 11px;font-size:13.5px;font-family:inherit;cursor:pointer;
  -webkit-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%23c9a24a' fill='none' stroke-width='1.4'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 11px center}
.pwx-select.sm{width:auto;padding:7px 30px 7px 11px}

/* toggle rows */
.pwx-toggle-row,.cwx-toggle-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 0;color:var(--cx-text-soft);font-size:13.5px;cursor:pointer}
.pwx-switch,.cwx-switch{width:34px;height:18px;border-radius:10px;background:var(--cx-surface);border:1px solid color-mix(in srgb,var(--cx-accent) 25%,transparent);position:relative;transition:.2s;flex:none}
.pwx-switch::after,.cwx-switch::after{content:"";position:absolute;top:1px;left:1px;width:14px;height:14px;border-radius:50%;background:var(--cx-text-dim);transition:.2s}
.pwx-toggle-row.on .pwx-switch,.cwx-toggle-row.on .cwx-switch{background:color-mix(in srgb,var(--cx-accent-deep) 50%,transparent);border-color:var(--cx-accent-deep)}
.pwx-toggle-row.on .pwx-switch::after,.cwx-toggle-row.on .cwx-switch::after{left:17px;background:var(--cx-accent)}

/* quick filters */
.pwx-quickf{display:flex;align-items:center;gap:9px;width:100%;background:none;border:1px solid transparent;border-radius:8px;color:var(--cx-text-soft);padding:8px 10px;font-size:13.5px;cursor:pointer;font-family:"EB Garamond",serif;text-align:left}
.pwx-quickf:hover{background:color-mix(in srgb,var(--cx-accent) 7%,transparent)}
.pwx-quickf.on{background:color-mix(in srgb,var(--cx-accent) 12%,transparent);border-color:color-mix(in srgb,var(--cx-accent) 30%,transparent);color:var(--cx-accent)}
.pwx-qico{width:16px;text-align:center;opacity:.85}
.pwx-btn.block{width:100%;justify-content:center}

/* ── buttons (shared) ── */
.pwx-btn,.cwx-btn,.rsx-btn,.wkx-btn{display:inline-flex;align-items:center;gap:7px;background:color-mix(in srgb,var(--cx-accent) 10%,transparent);border:1px solid color-mix(in srgb,var(--cx-accent) 40%,transparent);color:var(--cx-accent);border-radius:8px;padding:9px 15px;cursor:pointer;font-family:Cinzel,serif;font-size:12.5px;letter-spacing:.03em;white-space:nowrap}
.pwx-btn:hover,.cwx-btn:hover,.rsx-btn:hover,.wkx-btn:hover{background:color-mix(in srgb,var(--cx-accent) 20%,transparent)}
.pwx-btn.primary,.cwx-btn.primary,.rsx-btn.primary,.wkx-btn.primary{background:linear-gradient(180deg,var(--cx-accent),var(--cx-accent-deep));border-color:var(--cx-accent);color:var(--cx-on-accent);font-weight:600}
.pwx-btn.primary:hover,.cwx-btn.primary:hover,.rsx-btn.primary:hover,.wkx-btn.primary:hover{filter:brightness(1.06)}
.pwx-btn.sm,.cwx-btn.sm{padding:6px 12px;font-size:11.5px}
.pwx-icon,.wkx-icon{padding:9px 12px}

/* ============================ header (pantheon / creatures) ============================ */
.pwx-main,.cwx-main{padding:22px 26px;min-width:0}
.pwx-head,.cwx-head{display:flex;align-items:center;gap:16px;margin-bottom:14px}
.pwx-head-crest,.cwx-head-crest{width:52px;height:52px;flex:none;display:grid;place-items:center;font-size:24px;border-radius:50%;background:radial-gradient(circle at 40% 35%,var(--cx-surface),var(--cx-field));border:1.5px solid color-mix(in srgb,var(--cx-accent) 50%,transparent);color:var(--cx-accent)}
.pwx-head-txt,.cwx-head-txt{flex:1;min-width:0}
.pwx-title,.cwx-title{font-family:Cinzel,serif;font-size:30px;color:var(--cx-accent);letter-spacing:.02em;line-height:1.1}
.pwx-sub,.cwx-sub{color:var(--cx-text-dim);font-size:15px;margin-top:3px}
.pwx-head-actions,.cwx-head-actions{display:flex;align-items:center;gap:9px}
.pwx-head-note{color:var(--cx-text-dim);font-size:12px;font-style:italic}

/* view toggle */
.pwx-viewtoggle,.cwx-viewtoggle{display:flex;border:1px solid color-mix(in srgb,var(--cx-accent) 30%,transparent);border-radius:8px;overflow:hidden}
.pwx-vbtn,.cwx-vbtn{background:transparent;border:none;color:var(--cx-text-dim);padding:8px 11px;cursor:pointer;font-size:15px}
.pwx-vbtn.on,.cwx-vbtn.on{background:color-mix(in srgb,var(--cx-accent) 16%,transparent);color:var(--cx-accent)}

/* tabs */
.pwx-tabrow,.cwx-tabrow{display:flex;align-items:center;gap:4px;border-bottom:1px solid color-mix(in srgb,var(--cx-accent) 14%,transparent);margin-bottom:16px;overflow-x:auto}
.pwx-tab,.cwx-tab{background:none;border:none;border-bottom:2px solid transparent;color:var(--cx-text-dim);padding:11px 14px;cursor:pointer;font-family:Cinzel,serif;font-size:12.5px;letter-spacing:.06em;text-transform:uppercase;white-space:nowrap}
.pwx-tab:hover,.cwx-tab:hover{color:var(--cx-text-soft)}
.pwx-tab.active,.cwx-tab.active{color:var(--cx-accent);border-bottom-color:var(--cx-accent-deep)}
.cwx-status-mini,.pwx-status-mini{margin-left:auto;font-size:11px;color:var(--cx-text-dim)}

/* ============================ Pantheon toolbar + grid ============================ */
.pwx-toolbar{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}
.pwx-count{color:var(--cx-text-dim);font-size:13px;letter-spacing:.04em}
.pwx-tool-right{display:flex;align-items:center;gap:10px}
.pwx-sortlabel{color:var(--cx-text-dim);font-size:11px;letter-spacing:.1em;text-transform:uppercase}
.pwx-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(216px,1fr));gap:18px}
.pwx-card{display:flex;flex-direction:column;text-align:left;background:var(--cx-surface);border:1px solid color-mix(in srgb,var(--cx-accent) 16%,transparent);border-radius:12px;overflow:hidden;cursor:pointer;padding:0;font-family:inherit;transition:transform .15s,border-color .15s,box-shadow .15s}
.pwx-card:hover{transform:translateY(-3px);border-color:color-mix(in srgb,var(--cx-accent) 50%,transparent);box-shadow:0 12px 30px rgba(0,0,0,.45)}
.pwx-card.dead{opacity:.62}
.pwx-card-media{position:relative;aspect-ratio:1/1;overflow:hidden}
.pwx-card-img{position:absolute;inset:0;background-size:cover;background-position:center}
.pwx-card-img.ph{background:radial-gradient(circle at 50% 30%,color-mix(in srgb,var(--acc) 45%,var(--cx-surface-2)),var(--cx-field))}
.pwx-card-media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 45%,color-mix(in srgb,var(--cx-field) 55%,transparent) 78%,var(--cx-surface))}
.pwx-symbol{position:absolute;top:10px;left:10px;z-index:2;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;font-size:17px;color:var(--acc);background:color-mix(in srgb,var(--cx-field) 72%,transparent);border:1.5px solid var(--acc);box-shadow:0 0 12px color-mix(in srgb,var(--acc) 40%,transparent)}
.pwx-symbol.lg{width:44px;height:44px;font-size:22px}
.pwx-hidden-tag{position:absolute;top:10px;right:10px;z-index:2;font-size:10px;background:color-mix(in srgb,var(--cx-field) 80%,transparent);border:1px solid rgba(154,123,200,.6);color:#c3aee0;border-radius:20px;padding:3px 8px}
.pwx-card-body{padding:12px 14px 15px;display:flex;flex-direction:column;gap:7px;flex:1}
.pwx-card-name{font-family:Cinzel,serif;color:var(--cx-accent);font-size:17px;text-align:center;line-height:1.15}
.pwx-card-sub{text-align:center;color:var(--cx-text-soft);font-size:12px;font-style:italic;letter-spacing:.04em;margin-top:-3px}
.pwx-chips{display:flex;flex-wrap:wrap;gap:5px;justify-content:center}
.pwx-chips.ins{margin:4px 0 2px}
.pwx-chip{font-size:11px;border:1px solid;border-radius:5px;padding:2px 8px;letter-spacing:.02em}
.pwx-chip.sm{font-size:10px;padding:1px 6px}
.pwx-card-foot{margin-top:auto;display:flex;align-items:center;justify-content:space-between;border-top:1px solid color-mix(in srgb,var(--cx-accent) 12%,transparent);padding-top:9px}
.pwx-foot-k{color:var(--cx-text-dim);font-size:11px}
.pwx-foot-v{color:var(--cx-text-soft);font-size:12.5px;display:inline-flex;align-items:center;gap:5px}
.pwx-align-ico{color:var(--cx-accent-deep)}
.pwx-star{color:var(--cx-accent)}
.pwx-empty,.cwx-empty{padding:60px 20px;text-align:center;color:var(--cx-text-dim);font-size:15px;border:1px dashed color-mix(in srgb,var(--cx-accent) 20%,transparent);border-radius:12px}

/* pantheon list view */
.pwx-listview,.cwx-listview{display:flex;flex-direction:column;gap:8px}
.pwx-lv-row{display:flex;align-items:center;gap:14px;background:var(--cx-surface);border:1px solid color-mix(in srgb,var(--cx-accent) 14%,transparent);border-radius:10px;padding:10px 14px;cursor:pointer;text-align:left;font-family:inherit;color:inherit}
.pwx-lv-row:hover{border-color:color-mix(in srgb,var(--cx-accent) 40%,transparent)}
.pwx-lv-img{width:42px;height:42px;border-radius:8px;object-fit:cover;flex:none}
.pwx-lv-img.ph{display:grid;place-items:center;color:var(--acc);background:color-mix(in srgb,var(--acc) 25%,var(--cx-surface));border:1px solid var(--acc);font-size:18px}
.pwx-lv-main{display:flex;flex-direction:column;min-width:150px}
.pwx-lv-name{font-family:Cinzel,serif;color:var(--cx-accent);font-size:15px}
.pwx-lv-sub{color:var(--cx-text-dim);font-size:12px;font-style:italic}
.pwx-lv-domains{display:flex;gap:5px;flex:1;flex-wrap:wrap}
.pwx-lv-align{color:var(--cx-text-soft);font-size:12.5px;display:inline-flex;align-items:center;gap:5px}

/* ============================ Pantheon right about/inspector ============================ */
.pwx-aside,.wkx-rail{padding:22px 20px;border-left:1px solid color-mix(in srgb,var(--cx-accent) 12%,transparent)}
.pwx-about-h{font-family:Cinzel,serif;color:var(--cx-accent-deep);font-size:14px;letter-spacing:.1em;text-transform:uppercase;margin-bottom:10px}
.pwx-about-p{color:var(--cx-accent);font-size:13.5px;line-height:1.55}
.pwx-about-sub{color:var(--cx-text-soft);font-size:13px;margin:16px 0 8px}
.pwx-about-item{display:flex;align-items:center;gap:10px;color:var(--cx-text-soft);font-size:13px;padding:6px 0}
.pwx-about-ico{width:22px;height:22px;flex:none;display:grid;place-items:center;color:var(--cx-accent-deep);border:1px solid color-mix(in srgb,var(--cx-accent) 30%,transparent);border-radius:6px;font-size:12px}
.pwx-about-h2{font-family:Cinzel,serif;color:var(--cx-accent-deep);font-size:13px;letter-spacing:.1em;text-transform:uppercase;margin:20px 0 8px}
.pwx-tips{margin:0;padding-left:18px;color:var(--cx-accent);font-size:13px;line-height:1.6}
.pwx-tips li{margin-bottom:6px}
.pwx-aside.inspector .pwx-ins-head,.pwx-ins-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
.pwx-ins-eyebrow,.cwx-ins-eyebrow{font-family:Cinzel,serif;color:var(--cx-accent-deep);font-size:12px;letter-spacing:.12em;text-transform:uppercase}
.pwx-ins-close,.cwx-ins-close{background:none;border:none;color:var(--cx-text-dim);font-size:16px;cursor:pointer}
.pwx-ins-close:hover,.cwx-ins-close:hover{color:var(--cx-accent)}
.pwx-ins-media{position:relative;border-radius:10px;overflow:hidden;aspect-ratio:4/3;margin-bottom:12px}
.pwx-ins-img{position:absolute;inset:0;background-size:cover;background-position:center}
.pwx-ins-img.ph{display:grid;place-items:center;font-size:44px;color:var(--acc);background:radial-gradient(circle at 50% 30%,color-mix(in srgb,var(--acc) 40%,var(--cx-surface)),var(--cx-field))}
.pwx-ins-name{font-family:Cinzel,serif;color:var(--cx-accent);font-size:20px;text-align:center}
.pwx-ins-sub{text-align:center;color:var(--cx-text-soft);font-style:italic;font-size:13px;margin-top:2px}
.pwx-ins-btns,.cwx-ins-btns{display:flex;flex-direction:column;gap:8px;margin:14px 0}
.pwx-ins-btns .pwx-btn,.cwx-ins-btns .cwx-btn{width:100%;justify-content:center}
.pwx-ins-rows,.cwx-ins-sec{border-top:1px solid color-mix(in srgb,var(--cx-accent) 12%,transparent);padding-top:10px;margin-top:4px}
.pwx-ins-row,.cwx-ins-row{display:flex;justify-content:space-between;gap:12px;padding:5px 0;font-size:13.5px}
.pwx-ins-k,.cwx-ins-k{color:var(--cx-text-dim)}
.pwx-ins-v,.cwx-ins-v{color:var(--cx-text-soft);text-align:right;display:inline-flex;align-items:center;gap:6px}
.pwx-ins-sec{margin-top:14px}
.pwx-ins-sechead,.cwx-ins-sechead{font-family:Cinzel,serif;color:var(--cx-accent-deep);font-size:12px;letter-spacing:.1em;text-transform:uppercase;margin-bottom:8px;display:flex;align-items:center;gap:7px}
.pwx-dm,.cwx-dm{font-family:"EB Garamond",serif;letter-spacing:0;text-transform:none;font-size:10px;background:color-mix(in srgb,var(--cx-danger) 16%,transparent);border:1px solid color-mix(in srgb,var(--cx-danger) 40%,transparent);color:var(--cx-danger);border-radius:4px;padding:1px 6px}
.pwx-ins-text{color:var(--cx-accent);font-size:13.5px;line-height:1.55}
.pwx-notes{width:100%;box-sizing:border-box;background:var(--cx-field);border:1px solid color-mix(in srgb,var(--cx-accent) 22%,transparent);border-radius:8px;color:var(--cx-text);padding:9px;font-family:inherit;font-size:13.5px;resize:vertical;min-height:70px}
.pwx-ins-foot{display:flex;align-items:center;justify-content:space-between;margin-top:8px}
.pwx-ins-updated{color:var(--cx-text-dim);font-size:11px}
.pwx-ins-dates{display:flex;justify-content:space-between;gap:10px;margin-top:16px;color:var(--cx-text-dim);font-size:11px;border-top:1px solid color-mix(in srgb,var(--cx-accent) 10%,transparent);padding-top:10px}

/* ============================ Creatures ============================ */
.cwx-groups{display:flex;flex-direction:column;gap:26px}
.cwx-group-h{display:flex;align-items:center;gap:11px;margin-bottom:12px}
.cwx-owner-av{width:30px;height:30px;border-radius:50%;object-fit:cover;flex:none}
.cwx-owner-av.ph{display:grid;place-items:center;background:var(--cx-surface);border:1px solid color-mix(in srgb,var(--cx-accent) 40%,transparent);color:var(--cx-accent-deep);font-size:13px}
.cwx-owner-name{font-family:Cinzel,serif;color:var(--cx-accent);font-size:18px;letter-spacing:.03em}
.cwx-owner-count{color:var(--cx-text-dim);font-size:12.5px}
.cwx-group-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(430px,1fr));gap:16px}
.cwx-card{display:flex;gap:0;background:var(--cx-surface);border:1px solid color-mix(in srgb,var(--cx-accent) 16%,transparent);border-radius:12px;overflow:hidden;cursor:pointer;text-align:left;font-family:inherit;color:inherit;padding:0;transition:border-color .15s,box-shadow .15s}
.cwx-card:hover{border-color:color-mix(in srgb,var(--cx-accent) 45%,transparent);box-shadow:0 10px 26px rgba(0,0,0,.4)}
.cwx-card.sel{border-color:var(--cx-accent-deep)}
.cwx-card-por{width:132px;flex:none;background-size:cover;background-position:center;align-self:stretch;min-height:186px}
.cwx-card-por.ph{display:grid;place-items:center;background:var(--cx-surface-2);color:var(--cx-text-faint);font-family:Cinzel,serif;font-size:32px}
.cwx-card-body{flex:1;min-width:0;padding:13px 16px;display:flex;flex-direction:column;gap:7px}
.cwx-card-name{font-family:Cinzel,serif;color:var(--cx-accent);font-size:19px}
.cwx-card-type{color:var(--cx-text-soft);font-size:13px;font-style:italic;margin-top:-4px}
.cwx-chips{display:flex;flex-wrap:wrap;gap:5px}
.cwx-chip{font-size:11px;border:1px solid color-mix(in srgb,var(--cx-success) 45%,transparent);color:var(--cx-success);border-radius:5px;padding:2px 8px;background:color-mix(in srgb,var(--cx-success) 6%,transparent)}
.cwx-hp{margin-top:2px}
.cwx-hp-label{font-size:12px;color:var(--cx-text-soft)}
.cwx-hp-track{height:6px;border-radius:4px;background:var(--cx-surface);overflow:hidden;margin-top:4px}
.cwx-hp-fill{height:100%;border-radius:4px}
.cwx-card-stats{display:flex;gap:22px;font-size:13px;color:var(--cx-text-soft)}
.cwx-stat-k{color:var(--cx-text-dim);font-size:10.5px;letter-spacing:.08em}
.cwx-card-foot{margin-top:auto;display:flex;gap:14px;border-top:1px solid color-mix(in srgb,var(--cx-accent) 12%,transparent);padding-top:9px}
.cwx-card-foot>span{display:flex;flex-direction:column;gap:2px;min-width:0}
.cwx-foot-k{color:var(--cx-text-dim);font-size:9.5px;letter-spacing:.1em}
.cwx-foot-v{color:var(--cx-text-soft);font-size:12.5px;display:inline-flex;align-items:center;gap:5px}
.cwx-dot{width:8px;height:8px;border-radius:50%;display:inline-block;flex:none}
.cwx-star{color:var(--cx-accent)}
/* creatures list view */
.cwx-lv-row{display:flex;align-items:center;gap:13px;background:var(--cx-surface);border:1px solid color-mix(in srgb,var(--cx-accent) 14%,transparent);border-radius:10px;padding:9px 14px;cursor:pointer;text-align:left;font-family:inherit;color:inherit}
.cwx-lv-row:hover{border-color:color-mix(in srgb,var(--cx-accent) 40%,transparent)}
.cwx-lv-por{width:40px;height:40px;border-radius:8px;object-fit:cover;flex:none}
.cwx-lv-por.ph{display:grid;place-items:center;background:var(--cx-surface-2);color:var(--cx-text-faint);font-family:Cinzel,serif}
.cwx-lv-main{display:flex;flex-direction:column;min-width:150px}
.cwx-lv-name{font-family:Cinzel,serif;color:var(--cx-accent);font-size:15px}
.cwx-lv-type{color:var(--cx-text-dim);font-size:12px;font-style:italic}
.cwx-lv-chips{display:flex;gap:5px;flex:1;flex-wrap:wrap}
.cwx-lv-meta{color:var(--cx-text-soft);font-size:12.5px}
.cwx-lv-status{color:var(--cx-text-soft);font-size:12.5px;display:inline-flex;align-items:center;gap:6px;min-width:74px;justify-content:flex-end}

/* creatures inspector */
.cwx-inspector{padding:22px 20px;border-left:1px solid color-mix(in srgb,var(--cx-accent) 12%,transparent)}
.cwx-inspector[hidden]{display:none}
.cwx-ins-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.cwx-ins-id{display:flex;gap:13px;margin-bottom:14px}
.cwx-ins-por{width:96px;height:96px;border-radius:10px;background-size:cover;background-position:center;flex:none}
.cwx-ins-por.ph{display:grid;place-items:center;background:var(--cx-surface-2);color:var(--cx-text-faint);font-family:Cinzel,serif;font-size:30px}
.cwx-ins-idtxt{min-width:0}
.cwx-ins-name{font-family:Cinzel,serif;color:var(--cx-accent);font-size:22px;line-height:1.1}
.cwx-ins-type{color:var(--cx-text-soft);font-size:13px;font-style:italic;margin:2px 0 8px}
.cwx-ins-owner{display:flex;align-items:center;gap:8px;color:var(--cx-text-dim);font-size:11.5px;line-height:1.3}
.cwx-ins-owner strong{color:var(--cx-text-soft);font-size:13px}
.cwx-ins-owner-av{width:26px;height:26px;border-radius:50%;object-fit:cover;flex:none}
.cwx-ins-owner-av.ph{display:grid;place-items:center;background:var(--cx-surface);border:1px solid color-mix(in srgb,var(--cx-accent) 40%,transparent);color:var(--cx-accent-deep);font-size:11px}
.cwx-ins-desc{color:var(--cx-accent);font-size:13.5px;line-height:1.6;margin-top:14px;padding-top:14px;border-top:1px solid color-mix(in srgb,var(--cx-accent) 12%,transparent)}

/* ============================ Campaign Rules & Safety ============================ */
.rsx-app{font-family:"EB Garamond",Georgia,serif;color:var(--cx-text);max-width:1240px;margin:0 auto;padding:6px 4px 30px}
.rsx-hero{position:relative;display:flex;align-items:flex-start;gap:20px;flex-wrap:wrap;padding:6px 0 22px}
.rsx-hero-left{display:flex;align-items:center;gap:18px;flex:1;min-width:280px}
.rsx-hero-crest{width:64px;height:64px;flex:none;display:grid;place-items:center;font-size:28px;border-radius:50%;background:radial-gradient(circle at 40% 35%,var(--cx-surface),var(--cx-field));border:2px solid color-mix(in srgb,var(--cx-accent) 50%,transparent);color:var(--cx-accent)}
.rsx-hero-title{font-family:Cinzel,serif;font-size:38px;color:var(--cx-accent);letter-spacing:.02em;margin:0;line-height:1.05}
.rsx-hero-sub{color:var(--cx-text-dim);font-size:16px;font-style:italic;margin-top:5px}
.rsx-hero-right{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.rsx-visible{display:flex;align-items:center;gap:10px;background:var(--cx-surface);border:1px solid color-mix(in srgb,var(--cx-accent) 22%,transparent);border-radius:10px;padding:10px 14px}
.rsx-visible-ico{font-size:18px}
.rsx-visible-t{color:var(--cx-text-soft);font-size:13px;font-weight:600}
.rsx-visible-s{color:var(--cx-text-dim);font-size:11.5px}
.rsx-hero-rule{width:100%;display:flex;align-items:center;margin-top:20px}
.rsx-hero-rule::before,.rsx-hero-rule::after{content:"";height:1px;flex:1;background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--cx-accent) 35%,transparent),transparent)}
.rsx-diamond{color:var(--cx-accent-deep);padding:0 14px;font-size:12px}
.rsx-section{background:var(--cx-field);border:1px solid color-mix(in srgb,var(--cx-accent) 16%,transparent);border-radius:14px;padding:24px 26px;margin-bottom:22px}
.rsx-section-head{display:flex;gap:14px;align-items:flex-start;margin-bottom:20px}
.rsx-section-ico{width:34px;height:34px;flex:none;display:grid;place-items:center;border-radius:8px;border:1px solid color-mix(in srgb,var(--acc) 55%,transparent);color:var(--acc);font-size:16px;background:color-mix(in srgb,var(--acc) 12%,transparent)}
.rsx-section-title{font-family:Cinzel,serif;color:var(--cx-accent);font-size:22px;margin:0}
.rsx-section-desc{color:var(--cx-text-dim);font-size:14px;line-height:1.5;margin:4px 0 0;max-width:640px}
.rsx-lv-grid{display:grid;grid-template-columns:1.35fr 1fr;gap:26px;align-items:start}
.rsx-lv-cols{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.rsx-lv-colhead{display:flex;align-items:center;gap:7px;font-family:Cinzel,serif;font-size:13px;letter-spacing:.06em;text-transform:uppercase;margin-bottom:11px;padding-bottom:7px;border-bottom:1px solid color-mix(in srgb,var(--cx-accent) 14%,transparent)}
.rsx-lv-colhead.lines{color:var(--cx-danger)}
.rsx-lv-colhead.veils{color:#b79bd8}
.rsx-lv-hint{color:var(--cx-text-dim);font-size:10.5px;letter-spacing:.03em;text-transform:none;font-family:"EB Garamond",serif}
.rsx-lv-ico{font-size:13px}
.rsx-entry{display:flex;align-items:center;gap:0;background:var(--cx-surface-2);border:1px solid color-mix(in srgb,var(--cx-accent) 12%,transparent);border-radius:8px;margin-bottom:8px;overflow:hidden}
.rsx-entry-bar{width:3px;align-self:stretch;background:var(--acc);flex:none}
.rsx-entry-text{flex:1;padding:11px 12px;font-size:14px;color:var(--cx-text-soft)}
.rsx-anon{font-size:10px;color:var(--cx-text-dim);font-style:italic}
.rsx-entry-del{background:none;border:none;color:var(--cx-accent-dim);font-size:16px;cursor:pointer;padding:0 12px;align-self:stretch}
.rsx-entry-del:hover{color:var(--cx-accent)}
.rsx-empty-sm{color:var(--cx-text-dim);font-size:13px;font-style:italic;padding:8px 2px}
.rsx-addentry{background:var(--cx-surface-2);border:1px solid color-mix(in srgb,var(--cx-accent) 16%,transparent);border-radius:10px;padding:18px}
.rsx-addentry.readonly{background:transparent}
.rsx-addentry-h{font-family:Cinzel,serif;color:var(--cx-accent-deep);font-size:13px;letter-spacing:.1em;text-transform:uppercase;margin-bottom:14px}
.rsx-field{display:grid;grid-template-columns:88px 1fr;gap:12px;align-items:start;margin-bottom:14px}
.rsx-flabel{color:var(--cx-text-dim);font-size:13px;padding-top:9px}
.rsx-select{background:var(--cx-field);border:1px solid color-mix(in srgb,var(--cx-accent) 22%,transparent);border-radius:8px;color:var(--cx-text-soft);padding:9px 11px;font-size:14px;font-family:inherit;cursor:pointer}
.rsx-textarea{width:100%;box-sizing:border-box;background:var(--cx-field);border:1px solid color-mix(in srgb,var(--cx-accent) 22%,transparent);border-radius:8px;color:var(--cx-text);padding:10px;font-size:14px;font-family:inherit;min-height:70px;resize:vertical}
.rsx-addentry-foot{display:flex;align-items:center;justify-content:space-between;gap:12px}
.rsx-anon-toggle{display:flex;align-items:center;gap:8px;color:var(--cx-text-dim);font-size:13px;cursor:pointer}
.rsx-mini-ico{opacity:.6}
.rsx-switch-wrap{width:36px;height:19px;border-radius:11px;background:var(--cx-surface);border:1px solid color-mix(in srgb,var(--cx-accent) 25%,transparent);position:relative;flex:none}
.rsx-switch-wrap .rsx-switch{position:absolute;top:1px;left:1px;width:15px;height:15px;border-radius:50%;background:var(--cx-text-dim);transition:.2s}
.rsx-switch-wrap.on{background:color-mix(in srgb,var(--cx-accent-deep) 50%,transparent);border-color:var(--cx-accent-deep)}
.rsx-switch-wrap.on .rsx-switch{left:18px;background:var(--cx-accent)}
.rsx-lv-note{display:flex;align-items:center;gap:9px;margin-top:16px;color:var(--cx-text-dim);font-size:12.5px;background:var(--cx-field);border:1px solid color-mix(in srgb,var(--cx-accent) 10%,transparent);border-radius:8px;padding:10px 13px}
.rsx-guide-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}
.rsx-guide{background:var(--cx-surface-2);border:1px solid color-mix(in srgb,var(--cx-accent) 14%,transparent);border-top:2px solid var(--acc);border-radius:10px;padding:18px}
.rsx-guide-head{display:flex;align-items:center;gap:11px;margin-bottom:14px}
.rsx-guide-ico{width:34px;height:34px;flex:none;display:grid;place-items:center;border-radius:8px;color:var(--acc);border:1px solid color-mix(in srgb,var(--acc) 50%,transparent);background:color-mix(in srgb,var(--acc) 12%,transparent);font-size:16px}
.rsx-guide-title{font-family:Cinzel,serif;color:var(--cx-text);font-size:16px;margin:0}
.rsx-guide-list{margin:0 0 14px;padding-left:18px;color:var(--cx-accent);font-size:13.5px;line-height:1.7}
.rsx-guide-view{background:none;border:none;color:var(--cx-accent-deep);font-family:Cinzel,serif;font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;cursor:pointer;padding:0}
.rsx-guide-view:hover{color:var(--cx-accent)}
.rsx-footer{display:flex;align-items:center;gap:12px;flex-wrap:wrap;background:var(--cx-field);border:1px solid color-mix(in srgb,var(--cx-accent) 16%,transparent);border-radius:12px;padding:16px 20px}
.rsx-footer-ico{color:var(--cx-accent-deep);font-size:16px}
.rsx-footer-text{flex:1;color:var(--cx-accent);font-size:14px;min-width:200px}
.rsx-footer-updated{color:var(--cx-text-dim);font-size:12px;font-style:italic}

/* ============================ Campaign Wiki ============================ */
.wkx-nav{padding:20px 16px;border-right:1px solid color-mix(in srgb,var(--cx-accent) 12%,transparent);align-self:stretch}
.wkx-newpage{width:100%;background:linear-gradient(180deg,var(--cx-surface),var(--cx-surface));border:1px solid color-mix(in srgb,var(--cx-accent) 40%,transparent);color:var(--cx-accent);border-radius:8px;padding:11px;font-family:Cinzel,serif;font-size:13px;letter-spacing:.04em;cursor:pointer;margin-bottom:14px}
.wkx-newpage:hover{filter:brightness(1.12)}
.wkx-nav-search{position:relative;margin-bottom:12px}
.wkx-input{width:100%;box-sizing:border-box;background:var(--cx-field);border:1px solid color-mix(in srgb,var(--cx-accent) 22%,transparent);border-radius:8px;color:var(--cx-text);padding:9px 30px 9px 11px;font-size:13.5px;font-family:inherit}
.wkx-search-ico{position:absolute;right:9px;top:50%;transform:translateY(-50%);font-size:12px;opacity:.6}
.wkx-nav-home{display:flex;align-items:center;gap:9px;width:100%;background:none;border:none;color:var(--cx-text-soft);font-family:Cinzel,serif;font-size:12.5px;letter-spacing:.05em;padding:9px 8px;cursor:pointer;border-radius:6px;margin-bottom:6px}
.wkx-nav-home:hover,.wkx-nav-home.active{background:color-mix(in srgb,var(--cx-accent) 10%,transparent);color:var(--cx-accent)}
.wkx-nav-gico{width:18px;text-align:center;color:var(--cx-accent-deep);font-size:13px}
.wkx-nav-group{margin-bottom:4px}
.wkx-nav-grouphead{display:flex;align-items:center;gap:9px;width:100%;background:none;border:none;color:var(--cx-accent-deep);font-family:Cinzel,serif;font-size:11.5px;letter-spacing:.08em;padding:8px;cursor:pointer;border-radius:6px}
.wkx-nav-grouphead.static{cursor:default}
.wkx-nav-grouphead:hover{color:var(--cx-accent)}
.wkx-nav-caret{margin-left:auto;color:var(--cx-text-dim);font-size:13px}
.wkx-nav-pages{padding-left:6px}
.wkx-nav-page{display:flex;align-items:center;gap:8px;width:100%;background:none;border:none;border-left:2px solid transparent;color:var(--cx-accent);font-family:"EB Garamond",serif;font-size:13.5px;padding:7px 8px 7px 12px;cursor:pointer;text-align:left}
.wkx-nav-page:hover{color:var(--cx-text);background:color-mix(in srgb,var(--cx-accent) 5%,transparent)}
.wkx-nav-page.active{color:var(--cx-accent);border-left-color:var(--cx-accent-deep);background:color-mix(in srgb,var(--cx-accent) 10%,transparent)}
.wkx-nav-dot{font-size:11px;opacity:.7}
.wkx-nav-page .wkx-star{margin-left:auto;color:var(--cx-accent);font-size:11px}
.wkx-recent{display:block;width:100%;background:none;border:none;color:var(--cx-text-dim);font-size:13px;padding:6px 8px 6px 12px;cursor:pointer;text-align:left}
.wkx-recent:hover{color:var(--cx-accent)}
.wkx-star.lg{font-size:18px}
.wkx-star.dim{color:var(--cx-text-faint)}
/* article */
.wkx-main{padding:24px 34px;min-width:0;max-height:82vh;overflow-y:auto}
.wkx-article{max-width:760px}
.wkx-crumb{display:flex;align-items:center;gap:8px;color:var(--cx-text-dim);font-size:12.5px;margin-bottom:14px}
.wkx-crumb-sep{opacity:.5}
.wkx-crumb-cur{color:var(--cx-accent-deep)}
.wkx-title-row{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}
.wkx-title{font-family:Cinzel,serif;color:var(--cx-accent);font-size:34px;margin:0;line-height:1.05}
.wkx-title-actions{display:flex;gap:8px;flex:none}
.wkx-subtitle{color:var(--cx-text-dim);font-size:15px;font-style:italic;margin:10px 0 0}
.wkx-rule{height:1px;background:linear-gradient(90deg,color-mix(in srgb,var(--cx-accent) 40%,transparent),color-mix(in srgb,var(--cx-accent) 5%,transparent));margin:18px 0 22px}
.wkx-h2{font-family:Cinzel,serif;color:var(--cx-text);font-size:21px;display:flex;align-items:center;gap:11px;margin:26px 0 12px;scroll-margin-top:12px}
.wkx-h2-ico{width:30px;height:30px;flex:none;display:grid;place-items:center;color:var(--cx-accent-deep);border:1px solid color-mix(in srgb,var(--cx-accent) 35%,transparent);border-radius:7px;font-size:15px}
.wkx-h2.wkx-flash{animation:wkxflash 1s ease}
@keyframes wkxflash{0%,100%{background:transparent}30%{background:color-mix(in srgb,var(--cx-accent) 14%,transparent)}}
.wkx-p{color:var(--cx-accent);font-size:15px;line-height:1.65;margin:0 0 12px}
.wkx-ul{margin:0 0 12px;padding-left:20px;color:var(--cx-accent);font-size:14.5px;line-height:1.75}
.wkx-table{width:100%;border-collapse:collapse;margin:0 0 6px;font-size:14px}
.wkx-table th{text-align:left;color:var(--cx-accent-deep);font-family:Cinzel,serif;font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;padding:9px 12px;border-bottom:1px solid color-mix(in srgb,var(--cx-accent) 25%,transparent)}
.wkx-table td{color:var(--cx-text-soft);padding:9px 12px;border-bottom:1px solid color-mix(in srgb,var(--cx-accent) 10%,transparent)}
.wkx-row{display:grid;grid-template-columns:1.3fr 1fr;gap:20px;align-items:start;margin:0 0 12px}
.wkx-callout{background:var(--cx-surface);border:1px solid color-mix(in srgb,var(--acc) 35%,transparent);border-left:3px solid var(--acc);border-radius:8px;padding:14px 16px}
.wkx-callout-head{display:flex;align-items:center;gap:8px;font-family:Cinzel,serif;color:var(--acc);font-size:13px;letter-spacing:.05em;margin-bottom:7px}
.wkx-callout-body{color:var(--cx-accent);font-size:13.5px;line-height:1.6;font-style:italic}
.wkx-article-foot{margin-top:30px;padding-top:16px;border-top:1px solid color-mix(in srgb,var(--cx-accent) 12%,transparent);color:var(--cx-text-dim);font-size:12.5px;text-align:center;font-style:italic}
/* right rail */
.wkx-rail{align-self:stretch}
.wkx-rail-sec{margin-bottom:26px}
.wkx-rail-h{font-family:Cinzel,serif;color:var(--cx-accent-deep);font-size:12px;letter-spacing:.11em;text-transform:uppercase;margin-bottom:12px}
.wkx-toc{display:block;color:var(--cx-text-dim);font-size:13px;padding:5px 0 5px 11px;border-left:2px solid color-mix(in srgb,var(--cx-accent) 20%,transparent);text-decoration:none;cursor:pointer}
.wkx-toc:hover{color:var(--cx-accent);border-left-color:var(--cx-accent-deep)}
.wkx-detail{display:flex;justify-content:space-between;gap:10px;padding:6px 0;font-size:13px}
.wkx-detail-k{color:var(--cx-text-dim)}
.wkx-detail-v{color:var(--cx-text-soft);text-align:right;display:inline-flex;align-items:center;gap:6px}
.wkx-cat-dot{width:8px;height:8px;border-radius:50%;display:inline-block}
.wkx-linked{display:flex;align-items:center;gap:10px;padding:9px 0;border-bottom:1px solid color-mix(in srgb,var(--cx-accent) 8%,transparent);cursor:default}
.wkx-linked-ico{width:26px;height:26px;flex:none;display:grid;place-items:center;background:var(--cx-surface-2);border:1px solid color-mix(in srgb,var(--cx-accent) 25%,transparent);border-radius:6px;font-size:13px}
.wkx-linked-txt{flex:1;min-width:0;display:flex;flex-direction:column}
.wkx-linked-t{color:var(--cx-text-soft);font-size:13px}
.wkx-linked-s{color:var(--cx-text-dim);font-size:11px}
.wkx-linked-arrow{color:var(--cx-text-dim)}
.wkx-rail-empty{color:var(--cx-text-dim);font-size:12.5px;font-style:italic}

/* ============================ responsive ============================ */
@media (max-width:1180px){
  .pwx-app,.cwx-app,.cwx-app.has-inspector,.wkx-app{grid-template-columns:1fr}
  .pwx-side,.cwx-side,.wkx-nav{border-right:none;border-bottom:1px solid color-mix(in srgb,var(--cx-accent) 12%,transparent)}
  .pwx-aside,.cwx-inspector,.wkx-rail{border-left:none;border-top:1px solid color-mix(in srgb,var(--cx-accent) 12%,transparent)}
  .rsx-lv-grid{grid-template-columns:1fr}
  .cwx-group-grid{grid-template-columns:1fr}
  .wkx-main{max-height:none}
}
@media (max-width:640px){
  .rsx-lv-cols{grid-template-columns:1fr}
  .wkx-row{grid-template-columns:1fr}
  .cwx-card{flex-direction:column}
  .cwx-card-por{width:100%;min-height:150px}
  .pw-modal-2col,.cw-modal-2col,.cw-modal-3col,.rs-modal-2col,.wk-modal-2col{grid-template-columns:1fr}
}

/* ══ css/quests.css ══ */
/* ── Quest Log ─────────────────────────────────────────────────────────────
   Layout mirrors the party's reference journal: a quest list rail, and a
   detail view of banner-headed cards — At A Glance / Important Characters /
   Journal on the left; Description / Objectives / Updates / Rewards /
   Campaign History on the right. Banners keep the reference's semantic
   colors (info blue, warning amber, done green, reward magenta) rendered in
   the Codex's own dark-parchment language. */

.quests-status{min-height:20px;margin:0 0 10px;font-size:13px;color:var(--text-secondary,var(--cx-text-soft));font-style:italic}
.quests-status.error{color:var(--cx-danger);font-style:normal}
.quests-status.ok{color:var(--cx-success)}

.quests-toolbar{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin:0 0 18px}
.quests-filters{display:flex;gap:6px;flex-wrap:wrap}
.quests-filter{background:var(--bg-card,var(--cx-surface-2));border:1px solid var(--border,var(--cx-border));color:var(--text-secondary,var(--cx-text-soft));border-radius:999px;padding:6px 14px;font-size:12px;letter-spacing:.06em;text-transform:uppercase;cursor:pointer}
.quests-filter.active{border-color:var(--gold,var(--cx-accent-deep));color:var(--gold,var(--cx-accent-deep))}
.quests-toolbar .button{margin-left:auto}

.quests-layout{display:grid;grid-template-columns:290px minmax(0,1fr);gap:18px;align-items:start}

/* rail */
.quests-rail{display:flex;flex-direction:column;gap:8px}
.quest-card{background:var(--bg-card,var(--cx-surface-2));border:1px solid var(--border,var(--cx-border));border-radius:6px;padding:12px 14px;cursor:pointer;text-align:left;width:100%}
.quest-card:hover{border-color:var(--border-glow,var(--cx-border-strong))}
.quest-card.selected{border-color:var(--gold,var(--cx-accent-deep));box-shadow:0 0 0 1px color-mix(in srgb,var(--cx-accent-deep) 25%,transparent)}
.quest-card-title{color:var(--text-primary,var(--cx-text));font-weight:700;font-size:14px;margin:0 0 4px}
.quest-card-sub{color:var(--text-dim,var(--cx-text-dim));font-size:12px;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.quest-status-pip{display:inline-block;padding:2px 9px;border-radius:999px;font-size:10px;letter-spacing:.08em;text-transform:uppercase;font-weight:700}
.quest-status-pip.active{background:rgba(88,140,220,.18);color:#8fb4ec;border:1px solid rgba(88,140,220,.4)}
.quest-status-pip.onhold{background:color-mix(in srgb,var(--cx-accent) 16%,transparent);color:var(--cx-accent);border:1px solid color-mix(in srgb,var(--cx-accent) 40%,transparent)}
.quest-status-pip.completed{background:color-mix(in srgb,var(--cx-success) 16%,transparent);color:var(--cx-success);border:1px solid color-mix(in srgb,var(--cx-success) 40%,transparent)}
.quest-status-pip.failed{background:color-mix(in srgb,var(--cx-danger) 16%,transparent);color:var(--cx-danger);border:1px solid color-mix(in srgb,var(--cx-danger) 40%,transparent)}
.quests-rail-empty{color:var(--text-dim,var(--cx-text-dim));font-style:italic;font-size:13px;padding:8px 2px}

/* detail */
.quests-detail{min-width:0}
.quests-empty{border:1px dashed var(--border,var(--cx-border));border-radius:8px;padding:38px 20px;text-align:center;color:var(--text-dim,var(--cx-text-dim))}
.quest-head{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:0 0 16px}
.quest-title-input{flex:1;min-width:220px;background:transparent;border:0;border-bottom:1px solid transparent;color:var(--text-primary,var(--cx-text));font-family:"Cinzel",serif;font-size:24px;font-weight:700;padding:4px 2px}
.quest-title-input:focus{outline:none;border-bottom-color:var(--gold,var(--cx-accent-deep))}
.quest-status-select{background:var(--bg-card,var(--cx-surface-2));border:1px solid var(--border,var(--cx-border));color:var(--text-primary,var(--cx-text));border-radius:5px;padding:8px 10px;font-size:13px}
.quest-delete-btn{background:transparent;border:1px solid color-mix(in srgb,var(--cx-danger) 45%,transparent);color:var(--cx-danger);border-radius:5px;padding:8px 12px;font-size:12px;cursor:pointer}
.quest-delete-btn:hover{background:color-mix(in srgb,var(--cx-danger) 12%,transparent)}

.quest-columns{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px;align-items:start}
.quest-col{display:flex;flex-direction:column;gap:16px;min-width:0}

.qsec{border:1px solid var(--border,var(--cx-border));border-radius:8px;background:color-mix(in srgb,var(--cx-field) 55%,transparent);overflow:hidden}
.qsec-banner{display:flex;align-items:center;gap:10px;padding:11px 14px;font-family:"Cinzel",serif;font-weight:700;font-size:14px;letter-spacing:.04em;border-bottom:1px solid var(--border,var(--cx-border))}
.qsec-icon{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:50%;font-size:12px;font-weight:800;flex:none}
.qsec-body{padding:14px}

.qsec.info .qsec-banner{background:linear-gradient(90deg,rgba(52,84,150,.42),rgba(52,84,150,.10));color:#c7d8f2}
.qsec.info .qsec-icon{background:#4a79c9;color:var(--cx-bg)}
.qsec.plain .qsec-banner{background:linear-gradient(90deg,color-mix(in srgb,var(--cx-text-dim) 28%,transparent),color-mix(in srgb,var(--cx-text-dim) 6%,transparent));color:var(--cx-accent-bright)}
.qsec.plain .qsec-icon{background:var(--cx-text-soft);color:var(--cx-surface)}
.qsec.warn .qsec-banner{background:linear-gradient(90deg,color-mix(in srgb,var(--cx-accent-deep) 40%,transparent),color-mix(in srgb,var(--cx-accent-deep) 8%,transparent));color:var(--cx-accent-bright)}
.qsec.warn .qsec-icon{background:var(--cx-accent);color:var(--cx-on-accent)}
.qsec.done .qsec-banner{background:linear-gradient(90deg,color-mix(in srgb,var(--cx-success-deep) 42%,transparent),color-mix(in srgb,var(--cx-success-deep) 10%,transparent));color:var(--cx-success)}
.qsec.done .qsec-icon{background:var(--cx-success-deep);color:var(--cx-bg)}
.qsec.reward .qsec-banner{background:linear-gradient(90deg,rgba(150,44,104,.42),rgba(150,44,104,.10));color:#efc2dc}
.qsec.reward .qsec-icon{background:#c9508f;color:var(--cx-surface)}

/* at-a-glance fields */
.qglance{display:flex;flex-direction:column;gap:9px}
.qglance-row{display:grid;grid-template-columns:130px minmax(0,1fr);gap:8px;align-items:center}
.qglance-row label{color:var(--text-secondary,var(--cx-text-soft));font-size:12px;letter-spacing:.06em;text-transform:uppercase;font-weight:700}
.qfield{width:100%;background:var(--bg-card,var(--cx-surface-2));border:1px solid var(--border,var(--cx-border));color:var(--text-primary,var(--cx-text));border-radius:5px;padding:8px 10px;font-size:14px;font-family:inherit}
.qfield:focus{outline:none;border-color:var(--gold,var(--cx-accent-deep))}
textarea.qfield{resize:vertical;min-height:96px;line-height:1.55}
textarea.qfield.qtall{min-height:150px}

/* important characters table */
.qchars-table{width:100%;border-collapse:collapse}
.qchars-table th{text-align:left;color:var(--text-secondary,var(--cx-text-soft));font-size:12px;letter-spacing:.06em;text-transform:uppercase;padding:0 6px 8px 0;border-bottom:1px solid var(--border,var(--cx-border))}
.qchars-table td{padding:7px 6px 0 0;vertical-align:top}
.qchars-table td:last-child{width:34px}
.qrow-del{background:transparent;border:0;color:var(--text-dim,var(--cx-text-dim));cursor:pointer;font-size:15px;padding:6px 4px}
.qrow-del:hover{color:var(--cx-danger)}
.qsec-addrow{margin-top:10px;background:transparent;border:1px dashed var(--border,var(--cx-border));color:var(--text-secondary,var(--cx-text-soft));border-radius:5px;padding:7px 12px;font-size:12px;cursor:pointer;width:100%}
.qsec-addrow:hover{border-color:var(--gold,var(--cx-accent-deep));color:var(--gold,var(--cx-accent-deep))}

/* objectives */
.qobjs{display:flex;flex-direction:column;gap:8px}
.qobj{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:9px;align-items:start}
.qobj input[type=checkbox]{margin-top:10px;accent-color:var(--cx-accent);width:16px;height:16px}
.qobj.done .qfield{text-decoration:line-through;color:var(--text-dim,var(--cx-text-dim))}

/* updates */
.qupdates{display:flex;flex-direction:column;gap:10px}
.qupdate{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:9px;align-items:start}
.qupdate-when{color:var(--text-dim,var(--cx-text-dim));font-size:11px;margin:4px 0 0}

@media (max-width:1100px){.quest-columns{grid-template-columns:1fr}}
@media (max-width:820px){
  .quests-layout{grid-template-columns:1fr}
  .quests-rail{flex-direction:row;overflow-x:auto;padding-bottom:6px}
  .quest-card{min-width:230px}
  .quests-toolbar .button{margin-left:0}
  .qglance-row{grid-template-columns:110px minmax(0,1fr)}
}

/* @-link rich view: reads like the field it replaces, links clickable */
.qrich-wrap{min-width:0}
.qrich{cursor:text;white-space:pre-wrap;min-height:96px}
.qrich.qtall{min-height:150px}
.qrich p{margin:0 0 6px}
.qrich:hover{border-color:var(--gold,var(--cx-accent-deep))}
.qrich:focus-visible{outline:2px solid var(--gold,var(--cx-accent-deep));outline-offset:2px}
/* v68.2: input-shaped rich views (At A Glance, Important Characters,
   Objectives) — one line tall, sized by the grid/table cell they live in,
   wrapping long link titles instead of overflowing. */
.qrich.qrich-inline{min-height:0;padding:8px 10px;white-space:normal;overflow-wrap:anywhere;line-height:1.4}
.qobj .qrich-inline{min-width:0}
.qchars-table td .qrich-inline{width:100%}
.qupdate .qrich{min-width:0;min-height:52px}

/* ══ css/fallen.css ══ */
/* ── The Fallen — memorial page ─────────────────────────────────────────────
   Calm and restrained. Deploy143 codex surfaces (var(--cx-surface), gold hairlines,
   Cinzel / EB Garamond) with everything turned a step quieter: desaturated
   portraits that warm on hover, thin rules instead of ornament, muted status
   hues, generous space. No glow, no tombstones — the people are the focus. */

.fallen-page .page-description{max-width:640px}

.fallen-rule{display:flex;align-items:center;gap:14px;margin:6px 0 24px;color:color-mix(in srgb,var(--cx-accent) 55%,transparent);font-size:11px}
.fallen-rule::before,.fallen-rule::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--cx-accent) 25%,transparent),transparent)}

.fallen-toolbar{display:flex;align-items:center;gap:14px;justify-content:flex-end;margin:0 0 10px}
.fallen-toolbar-note{color:var(--cx-text-dim);font-size:12px;font-style:italic;font-family:"EB Garamond",serif}
.fallen-status{min-height:18px;margin:0 0 12px;font-size:13px;color:var(--cx-text-dim);font-style:italic;font-family:"EB Garamond",serif;text-align:right}
.fallen-status.ok{color:var(--cx-success);font-style:normal}
.fallen-status.err{color:var(--cx-danger);font-style:normal}

.fallen-gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:18px;align-items:start}
.fallen-loading{grid-column:1/-1;color:var(--cx-text-dim);font-family:"EB Garamond",serif;font-style:italic;padding:26px 0;text-align:center}

/* ---- memorial cards ---- */
.fallen-slot{display:flex;flex-direction:column;min-width:0}
.fallen-card{display:flex;flex-direction:column;width:100%;text-align:center;background:var(--cx-surface);border:1px solid color-mix(in srgb,var(--cx-accent) 14%,transparent);border-radius:12px;overflow:hidden;cursor:pointer;padding:0;font-family:"EB Garamond",Georgia,serif;color:var(--cx-text);transition:transform .18s,border-color .18s,box-shadow .18s}
.fallen-card:hover{transform:translateY(-3px);border-color:color-mix(in srgb,var(--cx-accent) 38%,transparent);box-shadow:0 12px 30px rgba(0,0,0,.45)}
.fallen-card.open{border-color:color-mix(in srgb,var(--cx-accent) 50%,transparent)}
.fallen-media{position:relative;aspect-ratio:3/4;overflow:hidden}
.fallen-por{position:absolute;inset:0;background-size:cover;background-position:center top;filter:saturate(.62) brightness(.92);transition:filter .35s}
.fallen-card:hover .fallen-por,.fallen-card.open .fallen-por{filter:saturate(.9) brightness(1)}
.fallen-por.ph{display:grid;place-items:center;font-family:Cinzel,serif;font-size:52px;color:var(--cx-text-faint);background:radial-gradient(circle at 50% 32%,var(--cx-surface-3),var(--cx-field))}
.fallen-media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,color-mix(in srgb,var(--cx-field) 62%,transparent) 84%,var(--cx-surface))}
.fallen-st{position:absolute;left:0;right:0;bottom:8px;z-index:2;font-family:Cinzel,serif;font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:var(--fst,var(--cx-accent))}
.fallen-st::before,.fallen-st::after{content:"—";opacity:.45;margin:0 7px}
.fallen-st.inline{position:static;text-align:left;margin-top:7px}
.fallen-st.inline::before{margin-left:0}
.st-dead{--fst:var(--cx-accent)}          /* ash */
.st-missing{--fst:#9fb4ea}       /* cool indigo */
.st-retired{--fst:var(--cx-success)}       /* sage */
.st-sacrificed{--fst:var(--cx-danger)}    /* dim rose */
.st-departed{--fst:#b6aed0}      /* dusk violet */

.fallen-body{padding:13px 16px 16px;display:flex;flex-direction:column;gap:4px}
.fallen-name{font-family:Cinzel,serif;font-size:18px;color:var(--cx-accent);line-height:1.15}
.fallen-player{font-size:12.5px;font-style:italic;color:var(--cx-text-dim)}
.fallen-lineage{font-size:13.5px;color:var(--cx-text-soft);letter-spacing:.02em}
.fallen-era{font-size:11.5px;color:var(--cx-text-dim);letter-spacing:.06em;text-transform:uppercase;font-family:Cinzel,serif;margin-top:2px}
.fallen-epitaph{font-size:14.5px;font-style:italic;color:var(--cx-text-soft);line-height:1.55;margin-top:8px;padding-top:9px;border-top:1px solid color-mix(in srgb,var(--cx-accent) 10%,transparent)}

/* ---- admin controls (only rendered for the DM) ---- */
.fallen-admin-row{display:flex;justify-content:center;gap:6px;margin-top:7px}
.fallen-admin-row button{background:none;border:1px solid color-mix(in srgb,var(--cx-accent) 22%,transparent);color:var(--cx-text-dim);border-radius:7px;width:30px;height:26px;font-size:12px;cursor:pointer;line-height:1}
.fallen-admin-row button:hover{color:var(--cx-accent);border-color:color-mix(in srgb,var(--cx-accent) 50%,transparent)}
.fallen-admin-row button.danger:hover{color:var(--cx-danger);border-color:color-mix(in srgb,var(--cx-danger) 50%,transparent)}
.fallen-admin-row button:disabled{opacity:.25;cursor:default}

/* ---- expanded tribute ---- */
.fallen-tribute{grid-column:1/-1;position:relative;background:var(--cx-surface);border:1px solid color-mix(in srgb,var(--cx-accent) 22%,transparent);border-radius:12px;padding:24px 28px;font-family:"EB Garamond",Georgia,serif}
.fallen-tribute-close{position:absolute;top:12px;right:14px;background:none;border:none;color:var(--cx-text-faint);font-size:15px;cursor:pointer}
.fallen-tribute-close:hover{color:var(--cx-accent)}
.fallen-tribute-head{display:flex;gap:20px;align-items:center;margin-bottom:6px}
.fallen-tribute-por{width:88px;height:110px;flex:none;border-radius:10px;background-size:cover;background-position:center top;border:1px solid color-mix(in srgb,var(--cx-accent) 25%,transparent);filter:saturate(.85)}
.fallen-tribute-name{font-family:Cinzel,serif;font-size:26px;color:var(--cx-accent);line-height:1.1}
.fallen-tribute-sub{color:var(--cx-text-soft);font-size:14px;font-style:italic;margin-top:4px}
.fallen-sec{margin-top:18px;padding-top:16px;border-top:1px solid color-mix(in srgb,var(--cx-accent) 10%,transparent)}
.fallen-sec-h{font-family:Cinzel,serif;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--cx-accent-deep);margin-bottom:7px}
.fallen-sec-t{color:var(--cx-text-soft);font-size:16px;line-height:1.7;white-space:pre-wrap}
.fallen-lastwords{margin-top:20px;padding:16px 22px;text-align:center;font-size:18px;font-style:italic;color:var(--cx-text);line-height:1.6;border-top:1px solid color-mix(in srgb,var(--cx-accent) 10%,transparent);border-bottom:1px solid color-mix(in srgb,var(--cx-accent) 10%,transparent)}
.fallen-lastwords span{display:block;margin-top:7px;font-size:12px;font-style:normal;letter-spacing:.14em;text-transform:uppercase;font-family:Cinzel,serif;color:var(--cx-text-dim)}

/* ---- empty state ---- */
.fallen-empty{grid-column:1/-1;text-align:center;padding:56px 24px;background:var(--cx-surface);border:1px dashed color-mix(in srgb,var(--cx-accent) 20%,transparent);border-radius:12px}
.fallen-empty-mark{color:color-mix(in srgb,var(--cx-accent) 50%,transparent);font-size:14px;margin-bottom:14px}
.fallen-empty-line{font-family:Cinzel,serif;font-size:19px;color:var(--cx-text-soft);letter-spacing:.03em}
.fallen-empty-sub{font-family:"EB Garamond",serif;font-style:italic;color:var(--cx-text-dim);font-size:15px;margin-top:8px;max-width:460px;margin-left:auto;margin-right:auto;line-height:1.6}

/* ---- edit modal grid ---- */
.fallen-modal-2col{display:grid;grid-template-columns:1fr 1fr;gap:0 12px}
.fallen-f{margin-bottom:10px}
.fallen-f label{display:block;font-size:10.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--cx-text-dim);margin-bottom:4px;font-family:"EB Garamond",serif}

@media (max-width:800px){
  .fallen-gallery{grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px}
  .fallen-tribute{padding:18px 16px}
  .fallen-tribute-head{gap:14px}
  .fallen-tribute-por{width:68px;height:86px}
  .fallen-tribute-name{font-size:21px}
  .fallen-modal-2col{grid-template-columns:1fr}
  .fallen-toolbar{justify-content:flex-start}
  .fallen-status{text-align:left}
  .fallen-admin-row button{width:36px;height:32px}
}

/* ══ css/bestiary-scripture.css ══ */
/* ── Bestiary — field-guide index ───────────────────────────────────────────
   Compact scannable rows over big cards: thumbnail, name, type/size, threat,
   habitat, status. Deploy143 surfaces and type throughout. */
.bx-toolbar{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin:0 0 10px}
.bx-search{flex:1;min-width:200px;box-sizing:border-box;background:var(--cx-field);border:1px solid color-mix(in srgb,var(--cx-accent) 22%,transparent);border-radius:8px;color:var(--cx-text);padding:9px 12px;font-size:14px;font-family:"EB Garamond",serif}
.bx-search:focus{outline:none;border-color:var(--cx-accent-deep)}
.bx-filter{box-sizing:border-box;background:var(--cx-field);border:1px solid color-mix(in srgb,var(--cx-accent) 22%,transparent);border-radius:8px;color:var(--cx-text-soft);padding:9px 30px 9px 11px;font-size:13px;font-family:"EB Garamond",serif;cursor:pointer;-webkit-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%23c9a24a' fill='none' stroke-width='1.4'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center}
.bx-alpha{display:flex;gap:3px;flex-wrap:wrap;margin:0 0 12px}
.bx-al{background:none;border:1px solid transparent;border-radius:6px;color:var(--cx-text-dim);font-family:Cinzel,serif;font-size:11.5px;min-width:26px;padding:4px 5px;cursor:pointer}
.bx-al:hover{color:var(--cx-accent)}
.bx-al.on{border-color:color-mix(in srgb,var(--cx-accent) 40%,transparent);color:var(--cx-accent);background:color-mix(in srgb,var(--cx-accent) 8%,transparent)}
.bx-al:disabled{opacity:.22;cursor:default}
.bx-status{min-height:16px;margin:0 0 8px;font-size:12.5px;color:var(--cx-text-dim);font-style:italic;font-family:"EB Garamond",serif;text-align:right}
.bx-status.err{color:var(--cx-danger);font-style:normal}

.bx-index{display:flex;flex-direction:column;gap:6px;font-family:"EB Garamond",Georgia,serif}
.bx-loading,.bx-none{color:var(--cx-text-dim);font-style:italic;padding:22px 0;text-align:center}
.bx-letter{font-family:Cinzel,serif;color:var(--cx-accent-deep);font-size:13px;letter-spacing:.2em;margin:14px 0 2px;display:flex;align-items:center;gap:12px}
.bx-letter::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,color-mix(in srgb,var(--cx-accent) 22%,transparent),transparent)}

.bx-row{display:grid;grid-template-columns:44px minmax(0,2.2fr) minmax(0,.9fr) minmax(0,1.3fr) minmax(0,.9fr);gap:12px;align-items:center;width:100%;text-align:left;background:var(--cx-surface);border:1px solid color-mix(in srgb,var(--cx-accent) 12%,transparent);border-radius:10px;padding:8px 14px 8px 8px;cursor:pointer;font-family:inherit;color:var(--cx-text);transition:border-color .15s,transform .15s}
.bx-row:hover{border-color:color-mix(in srgb,var(--cx-accent) 38%,transparent);transform:translateY(-1px)}
.bx-row.open{border-color:color-mix(in srgb,var(--cx-accent) 50%,transparent)}
.bx-thumb{width:44px;height:44px;border-radius:8px;background-size:cover;background-position:center;border:1px solid color-mix(in srgb,var(--cx-accent) 18%,transparent);flex:none}
.bx-thumb.ph{display:grid;place-items:center;font-family:Cinzel,serif;color:var(--cx-text-faint);background:var(--cx-surface-2);font-size:18px}
.bx-row-name{font-family:Cinzel,serif;font-size:15.5px;color:var(--cx-accent);line-height:1.15}
.bx-hiddenmark,.sl-hiddenmark{font-size:9px;letter-spacing:.12em;border:1px solid color-mix(in srgb,var(--cx-accent) 40%,transparent);border-radius:4px;padding:1px 4px;color:var(--cx-accent-deep);vertical-align:2px}
.bx-row-sub{font-size:12.5px;color:var(--cx-text-dim);font-style:italic}
.bx-row-threat{font-family:Cinzel,serif;font-size:12px;color:var(--cx-text-soft);letter-spacing:.04em}
.bx-row-loc{font-size:13px;color:var(--cx-text-soft);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bx-row-st{font-family:Cinzel,serif;font-size:10px;letter-spacing:.18em;text-transform:uppercase;text-align:right;color:var(--bst,var(--cx-text-dim))}
.st-active{--bst:var(--cx-success)}.st-slain{--bst:var(--cx-danger)}.st-dormant{--bst:var(--cx-accent)}.st-unknown{--bst:#9fb4ea}
b.st-active,b.st-slain,b.st-dormant,b.st-unknown{color:var(--bst);font-weight:600}

/* expanded record */
.bx-record{display:flex;gap:20px;background:var(--cx-surface);border:1px solid color-mix(in srgb,var(--cx-accent) 22%,transparent);border-radius:10px;padding:18px 20px;margin:2px 0 8px}
.bx-record-por{width:150px;height:150px;flex:none;border-radius:10px;background-size:cover;background-position:center;border:1px solid color-mix(in srgb,var(--cx-accent) 25%,transparent)}
.bx-record-main{flex:1;min-width:0}
.bx-record-head{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.bx-record-name{font-family:Cinzel,serif;font-size:22px;color:var(--cx-accent);flex:1}
.bx-record-actions{display:flex;gap:8px}
.bx-danger{border-color:color-mix(in srgb,var(--cx-danger) 50%,transparent);color:var(--cx-danger)}
.bx-danger:hover{background:color-mix(in srgb,var(--cx-danger) 12%,transparent)}
.bx-stats{display:flex;flex-wrap:wrap;gap:8px 20px;margin:10px 0 4px;padding:10px 0;border-top:1px solid color-mix(in srgb,var(--cx-accent) 10%,transparent);border-bottom:1px solid color-mix(in srgb,var(--cx-accent) 10%,transparent)}
.bx-stat{font-size:14px;color:var(--cx-text-soft)}
.bx-stat span{display:block;font-family:Cinzel,serif;font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--cx-text-dim);margin-bottom:2px}
.bx-sec{margin-top:12px}
.bx-sec-h{font-family:Cinzel,serif;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--cx-accent-deep);margin-bottom:5px}
.bx-sec-t{color:var(--cx-text-soft);font-size:15px;line-height:1.65;white-space:pre-wrap}
.bx-secret{border:1px dashed color-mix(in srgb,var(--cx-accent) 30%,transparent);border-radius:8px;padding:10px 12px;background:color-mix(in srgb,var(--cx-accent) 4%,transparent)}

.bx-empty{text-align:center;padding:56px 24px;background:var(--cx-surface);border:1px dashed color-mix(in srgb,var(--cx-accent) 20%,transparent);border-radius:12px}
.bx-empty-mark{color:color-mix(in srgb,var(--cx-accent) 50%,transparent);font-size:16px;margin-bottom:12px}
.bx-empty-line{font-family:Cinzel,serif;font-size:19px;color:var(--cx-text-soft)}
.bx-empty-sub{font-family:"EB Garamond",serif;font-style:italic;color:var(--cx-text-dim);font-size:15px;margin-top:8px;max-width:480px;margin-left:auto;margin-right:auto;line-height:1.6}

@media (max-width:800px){
  .bx-row{grid-template-columns:38px minmax(0,1fr) auto;grid-template-areas:"thumb main st" "thumb loc threat";row-gap:2px}
  .bx-thumb{grid-area:thumb;width:38px;height:38px}
  .bx-row-main{grid-area:main}.bx-row-st{grid-area:st}
  .bx-row-loc{grid-area:loc;font-size:12px}.bx-row-threat{grid-area:threat;text-align:right;font-size:11px}
  .bx-record{flex-direction:column;gap:14px}
  .bx-record-por{width:110px;height:110px}
  .bx-filter{flex:1;min-width:44%}
}

/* ── Scripture & Lore — the written word ────────────────────────────────────
   Collections as shelves, entries as quiet text tiles, and a focused reading
   view with wide margins and emphasized passages. Manuscript influence stays
   subtle: hairlines, centered rules, generous leading — no parchment. */
.sl-toolbar{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin:0 0 10px}
.sl-search{flex:1;min-width:200px;box-sizing:border-box;background:var(--cx-field);border:1px solid color-mix(in srgb,var(--cx-accent) 22%,transparent);border-radius:8px;color:var(--cx-text);padding:9px 12px;font-size:14px;font-family:"EB Garamond",serif}
.sl-search:focus{outline:none;border-color:var(--cx-accent-deep)}
.sl-filter{box-sizing:border-box;background:var(--cx-field);border:1px solid color-mix(in srgb,var(--cx-accent) 22%,transparent);border-radius:8px;color:var(--cx-text-soft);padding:9px 30px 9px 11px;font-size:13px;font-family:"EB Garamond",serif;cursor:pointer;-webkit-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%23c9a24a' fill='none' stroke-width='1.4'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center}
.sl-status{min-height:16px;margin:0 0 8px;font-size:12.5px;color:var(--cx-text-dim);font-style:italic;font-family:"EB Garamond",serif;text-align:right}
.sl-status.err{color:var(--cx-danger);font-style:normal}
.sl-loading,.sl-none{color:var(--cx-text-dim);font-family:"EB Garamond",serif;font-style:italic;padding:22px 0;text-align:center}

.sl-collection{margin:0 0 26px}
.sl-coll-head{display:flex;align-items:baseline;gap:12px;margin:0 0 10px;padding-bottom:7px;border-bottom:1px solid color-mix(in srgb,var(--cx-accent) 14%,transparent)}
.sl-coll-name{font-family:Cinzel,serif;font-size:17px;color:var(--cx-accent);letter-spacing:.03em}
.sl-coll-count{font-family:"EB Garamond",serif;font-size:12.5px;color:var(--cx-text-dim);font-style:italic}
.sl-entries{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:12px}
.sl-entry-wrap{position:relative;display:flex;flex-direction:column}
.sl-entry{display:flex;flex-direction:column;gap:5px;width:100%;text-align:left;background:var(--cx-surface);border:1px solid color-mix(in srgb,var(--cx-accent) 14%,transparent);border-radius:10px;padding:14px 16px;cursor:pointer;font-family:"EB Garamond",Georgia,serif;color:var(--cx-text);transition:border-color .15s,transform .15s;flex:1}
.sl-entry:hover{border-color:color-mix(in srgb,var(--cx-accent) 40%,transparent);transform:translateY(-2px)}
.sl-entry-kind{font-family:Cinzel,serif;font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--cx-accent-deep)}
.sl-entry-title{font-family:Cinzel,serif;font-size:16.5px;color:var(--cx-accent);line-height:1.2}
.sl-entry-meta{font-size:12.5px;color:var(--cx-text-dim);font-style:italic}
.sl-entry-excerpt{font-size:13.5px;color:var(--cx-text-soft);line-height:1.55;margin-top:3px}
.sl-admin-row{position:absolute;top:8px;right:8px;display:flex;gap:4px}
.sl-admin-row button{background:color-mix(in srgb,var(--cx-field) 85%,transparent);border:1px solid color-mix(in srgb,var(--cx-accent) 22%,transparent);color:var(--cx-text-dim);border-radius:6px;width:24px;height:22px;font-size:10px;cursor:pointer;line-height:1}
.sl-admin-row button:hover{color:var(--cx-accent);border-color:color-mix(in srgb,var(--cx-accent) 50%,transparent)}
.sl-admin-row button.danger:hover{color:var(--cx-danger);border-color:color-mix(in srgb,var(--cx-danger) 50%,transparent)}
.sl-admin-row button:disabled{opacity:.25;cursor:default}

/* reading view */
.sl-read-bar{display:flex;align-items:center;gap:10px;margin:0 0 14px}
.sl-read{max-width:720px;margin:0 auto;background:var(--cx-surface);border:1px solid color-mix(in srgb,var(--cx-accent) 18%,transparent);border-radius:12px;padding:34px 40px 40px;font-family:"EB Garamond",Georgia,serif}
.sl-read-kind{font-family:Cinzel,serif;font-size:10.5px;letter-spacing:.22em;text-transform:uppercase;color:var(--cx-accent-deep);text-align:center}
.sl-read-title{font-family:Cinzel,serif;font-size:28px;color:var(--cx-accent);text-align:center;line-height:1.2;margin:8px 0 6px}
.sl-read-meta{text-align:center;color:var(--cx-text-dim);font-size:14px;font-style:italic}
.sl-read-rule{display:flex;align-items:center;margin:18px auto 22px;max-width:220px}
.sl-read-rule::before,.sl-read-rule::after{content:"";flex:1;height:1px;background:color-mix(in srgb,var(--cx-accent) 28%,transparent)}
.sl-read-rule{gap:10px}
.sl-read-rule::before{margin-right:0}
.sl-read-body{color:var(--cx-text);font-size:17px;line-height:1.85}
.sl-read-body p{margin:0 0 4px}
.sl-gap{height:14px}
.sl-passage{margin:16px 10px;padding:4px 0 4px 18px;border-left:2px solid color-mix(in srgb,var(--cx-accent) 45%,transparent);font-style:italic;font-size:17.5px;color:var(--cx-text);line-height:1.8}
.sl-secret{margin-top:24px;border:1px dashed color-mix(in srgb,var(--cx-accent) 30%,transparent);border-radius:8px;padding:12px 14px;background:color-mix(in srgb,var(--cx-accent) 4%,transparent);font-size:14.5px;color:var(--cx-text-soft);white-space:pre-wrap}
.sl-secret-h{font-family:Cinzel,serif;font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--cx-accent-deep);margin-bottom:6px}

.sl-empty{text-align:center;padding:56px 24px;background:var(--cx-surface);border:1px dashed color-mix(in srgb,var(--cx-accent) 20%,transparent);border-radius:12px}
.sl-empty-mark{color:color-mix(in srgb,var(--cx-accent) 50%,transparent);font-size:18px;margin-bottom:12px}
.sl-empty-line{font-family:Cinzel,serif;font-size:19px;color:var(--cx-text-soft)}
.sl-empty-sub{font-family:"EB Garamond",serif;font-style:italic;color:var(--cx-text-dim);font-size:15px;margin-top:8px;max-width:480px;margin-left:auto;margin-right:auto;line-height:1.6}

@media (max-width:800px){
  .sl-filter{flex:1;min-width:44%}
  .sl-entries{grid-template-columns:1fr}
  .sl-read{padding:22px 18px 28px}
  .sl-read-title{font-size:22px}
  .sl-read-body{font-size:16px}
}