/*
  04-screens.css — v37 screen layouts.
  Three canonical breakpoints only: <=399 compact, default, >=700 wide.
*/

/* ---------- Hub header (Ship / Codex sub-navigation) ---------- */
.hub-seg { margin: 0 0 var(--gap); box-shadow: var(--e1); }

/* ---------- Helm (Overview) ---------- */
.mvmt-row { min-height: 48px; }
.mvmt-row .lrow-sub { white-space: normal; }

.ship-stat-compact-grid {
  width: 100%; display: grid; grid-template-columns: repeat(6, 1fr); gap: 6px;
  background: transparent; border: 0; border-radius: 0;
  padding: 0; cursor: pointer; font: inherit; box-shadow: none; margin-bottom: 4px;
}
/* Every stat gets its own full box (legacy drew partial dividers on the
   first three only). */
.ship-stat-compact-grid .stat-compact {
  display: flex; flex-direction: column; align-items: center; gap: 2px;
  background: var(--chart); border: 1px solid var(--line-strong);
  border-radius: var(--r-s); padding: 8px 2px; box-shadow: var(--e1); min-width: 0;
}
.ship-stat-compact-grid .stat-compact::before, .ship-stat-compact-grid .stat-compact::after { display: none; }
.ship-stat-compact-grid .stat-name { font-size: .64rem; font-weight: 800; letter-spacing: .06em; color: var(--muted); }
.ship-stat-compact-grid .stat-score { font-family: var(--font-display); font-size: var(--t3); color: var(--ink); }
.stat-note { color: #b9a784; font-size: var(--t0); margin: 2px 2px var(--s2); }

/* Ship components: denser rows */
.component-table { padding: 8px 10px; }
.component-row { padding: 7px 0; }
.component-row .button.mini { min-height: 30px; padding: 4px 8px; font-size: .78rem; }

.crew-compact .crew-line { padding: 6px 10px; }

/* ---------- Ship hub: Stores panes ---------- */
.stores-pane { display: none; }
.stores-pane.active { display: block; animation: fade .14s ease-out; }
.res-row { padding-right: 6px; }
.res-row.debt .lrow-title { color: var(--danger); }
.debt-badge {
  display: inline-flex; align-items: center; margin-left: 6px; padding: 1px 7px; border-radius: 999px;
  background: var(--danger-bg); color: #8f2318; font-size: .66rem; font-weight: 800;
  vertical-align: middle; line-height: 1.25; min-height: 0;
}
.stores-pane .compact-board { margin-top: var(--s2); }

/* ---------- Ship hub: Loadout arcs ---------- */
.arc-pane { display: none; }
.arc-pane.active { display: block; animation: fade .14s ease-out; }
.arc-pane .slot-table-wrap, .arc-pane .slot-grid { margin-bottom: var(--s2); }
.arc-seg .seg-btn small { display: block; font-weight: 550; font-size: .66rem; color: inherit; opacity: .72; }

/* ---------- Codex: quest rows ---------- */
.quest-row { border-left: 4px solid var(--muted); }
.quest-row[data-status="Active"] { border-left-color: var(--brass); }
.quest-row[data-status="Lead"] { border-left-color: var(--lagoon); }
.quest-row[data-status="Rumour"] { border-left-color: var(--blue); }
.quest-row[data-status="On Hold"] { border-left-color: var(--faint); }
.quest-row[data-status="Hidden"], .quest-row.secret { border-left-color: var(--danger); }
.quest-row[data-status="Completed"] { border-left-color: var(--ok); opacity: .82; }
.quest-row[data-status="Failed"] { border-left-color: var(--danger); opacity: .82; }
.qchip { flex: 0 0 auto; }

/* ---------- Codex: NPC rows ---------- */
.npc-row .avatar {
  width: 44px; height: 44px; border-radius: var(--r-s); flex: 0 0 auto;
  background: var(--chart-2); color: var(--ink-soft); font-weight: 800; font-size: 1.05rem;
  display: grid; place-items: center; overflow: hidden; border: 1px solid var(--line);
  position: relative;
}
/* v37.7: absolutely fill the avatar box. Inside the centered grid the img's
   height:100% resolved as auto (content-sized row), so the photo rendered at
   its natural aspect and got clipped instead of cover-cropped — which made
   list and sheet portraits crop differently. Absolute positioning guarantees
   a true object-fit crop, centered the way the index always looked. */
.npc-row .avatar img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; object-position: 50% 50%; }
/* Detail-sheet portraits crop exactly like the list avatars: centered. */
.npc-card .portrait img, .pc-card .portrait img, .modal .portrait img { object-position: 50% 50%; }
.npc-row.dead-row { filter: grayscale(1); opacity: .8; }

/* Detail sheets reuse the full legacy cards; make them fill the sheet. */
.modal .quest-card, .modal .npc-card { margin: 0; box-shadow: none; border: 0; padding: 2px 0 0; background: transparent; }

/* ---------- Loot rows (Treasure pane) ---------- */
.loot-row { border-left: 4px solid var(--muted); }
/* Rarity rail colors, restated unlayered (the legacy .rarity-* colors sit in
   the legacy layer and would lose to the shorthand above). Same hues. */
.loot-row.rarity-mundane, .modal .loot-card.rarity-mundane { border-left-color: #b9a978; }
.loot-row.rarity-common, .modal .loot-card.rarity-common { border-left-color: #d9d2c2; }
.loot-row.rarity-uncommon, .modal .loot-card.rarity-uncommon { border-left-color: #3f9d54; }
.loot-row.rarity-rare, .modal .loot-card.rarity-rare { border-left-color: #2f6db0; }
.loot-row.rarity-legendary, .modal .loot-card.rarity-legendary { border-left-color: #d98b2b; }
.loot-row-price { font-weight: 800; font-variant-numeric: tabular-nums; color: var(--ink); }
.loot-showing { color: #b9a784; font-size: var(--t0); margin: -2px 2px var(--s2); }
.loot-total { color: #e2d2a8; font-size: var(--t1); margin: var(--s2) 2px 0; text-align: right; }
.loot-total b { color: var(--brass-bright); font-variant-numeric: tabular-nums; }
.modal .loot-card { margin: 0; box-shadow: none; border: 0; border-left: 4px solid var(--muted); padding: 2px 0 0 10px; background: transparent; border-radius: 0; }

/* ---------- Treasure: pane switcher + Player Items (v37.7) ---------- */
.treasure-seg { margin: 0 0 var(--s3); }
/* Who-holds-what matrix: players down, magic tiers across, counts where
   they meet. Real table gridlines + zebra row banding for legibility. Tier
   letters and counts use the loot rarity colours. */
.pitem-matrix {
  --pm-line: rgba(30, 20, 10, .16);   /* gridline colour, quiet but visible */
  background: var(--chart); border: 1px solid var(--line); border-radius: var(--r-m);
  box-shadow: var(--e1); overflow: hidden; font-size: var(--t0);
}
.pm-row {
  display: grid;
  grid-template-columns: minmax(0, 2.3fr) repeat(5, minmax(30px, 1fr));
  align-items: stretch;
}
/* Horizontal gridlines between every row. */
.pm-row + .pm-row { border-top: 1px solid var(--pm-line); }
/* Zebra banding: every other data row gets a subtle inset tint. The tint is
   light enough that the dark ink names and tier-coloured numbers keep well
   above WCAG AA contrast on both bands. */
.pm-row:nth-of-type(2n) { background: rgba(30, 20, 10, .045); }
.pm-cell {
  padding: 7px 2px; text-align: center; min-width: 0;
  display: flex; align-items: center; justify-content: center;
}
/* Vertical gridlines: separate the name column and each tier column. */
.pm-cell + .pm-cell { border-left: 1px solid var(--pm-line); }
.pm-head-row { background: var(--chart-2); border-bottom: 2px solid var(--brass); }
.pm-head { font-weight: 800; font-size: .72rem; letter-spacing: .03em; }
.pm-name {
  text-align: left; justify-content: flex-start; padding: 7px 8px; font: inherit; font-weight: 700; color: var(--ink);
  background: none; border: 0; cursor: pointer;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  -webkit-tap-highlight-color: transparent; width: 100%;
}
.pm-head.pm-name { cursor: default; color: var(--ink-soft); text-transform: uppercase; }
.pm-row-btn:active { background: rgba(192, 138, 46, .18); }
.pm-row.active { background: var(--brass); }
.pm-row.active .pm-cell { border-left-color: rgba(27, 17, 5, .22); }
.pm-row.active .pm-name,
.pm-row.active .pm-num { color: #1b1105; }
.pm-num { font-weight: 800; font-variant-numeric: tabular-nums; font-size: var(--t1); }
/* Tier colours (darkened versions of the loot rail hues, chosen to clear
   WCAG AA on both the parchment and the zebra band). */
.rar-m { color: #6f5a2f; }
.rar-c { color: #55503f; }
.rar-u { color: #216b32; }
.rar-r { color: #245a94; }
.rar-l { color: #875200; }

/* ---------- Loadout arc rows ---------- */
.slot-badge { width: 52px; font-size: .74rem; }
.slot-row.unmanned-row .lrow-title { color: var(--muted); }
.empty-slot-row { border-style: dashed; background: var(--chart-2); }
.modal .slot-table-wrap { margin-top: 4px; }

/* ---------- Duty + consumable sheets ---------- */
.duty-line { min-height: 48px; cursor: default; }
.duty-line .duty-line-val { white-space: normal; font-weight: 650; }
.consum-row.depleted { opacity: .65; }
.consum-row.depleted .lrow-title { color: var(--muted); }
.chip.love { background: rgba(214, 92, 132, .16); border-color: rgba(214, 92, 132, .45); color: #a13a60; }

/* ---------- Actions ---------- */
.ref-index { margin-top: var(--s1); }
.ref-row .lrow-title { font-weight: 700; }

/* ---------- Maps ---------- */
.map-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: var(--s2); }

/* ---------- Calendar ---------- */
.cal-hero { padding: 14px; text-align: center; margin-bottom: var(--gap); }
.cal-hero-date { font-family: var(--font-display); font-size: var(--t4); color: var(--ink); letter-spacing: .03em; }
.cal-hero-sub { color: var(--muted); font-size: var(--t1); margin-top: 3px; }
.cal-week-head {
  display: flex; align-items: baseline; justify-content: space-between;
  gap: 8px; margin: 2px 2px 6px;
}
.cal-week-head > span:first-child { font-weight: 800; color: var(--chart); font-size: var(--t1); }
.cal-week-head .hint { color: rgba(239,228,195,.72); font-size: var(--t0); }
/* Horizontal, swipeable week strip. Cells are a fixed width so seven fit a
   phone with a little peek of the next, and the strip auto-centres on today. */
.cal-week {
  display: flex; gap: 5px; margin-bottom: var(--gap);
  overflow-x: auto; -webkit-overflow-scrolling: touch;
  overscroll-behavior-x: contain; scroll-snap-type: none;
  scrollbar-width: none; padding-bottom: 2px;
}
.cal-week::-webkit-scrollbar { display: none; }
.cal-day {
  flex: 0 0 auto; width: calc((100% - 6 * 5px) / 7); min-width: 46px;
  background: var(--chart); border: 1px solid var(--line); border-radius: var(--r-s);
  padding: 6px 2px 6px; text-align: center; box-shadow: var(--e1);
}
/* A quiet left divider marks where a new Golarion month begins in the strip. */
.cal-day.month-start { border-left: 2px solid var(--brass); }
.cal-day-wd {
  display: block; font-size: .58rem; font-weight: 800; letter-spacing: .04em;
  text-transform: uppercase; color: var(--muted); line-height: 1; margin-bottom: 2px;
}
.cal-day-num { font-family: var(--font-display); font-size: var(--t2); color: var(--ink); line-height: 1.05; }
.cal-day-moon { display: block; font-size: .82rem; line-height: 1.1; margin-bottom: 2px; }
.cal-day-dots { min-height: 8px; margin-top: 3px; display: flex; justify-content: center; gap: 3px; }
.cal-day-dots i { width: 6px; height: 6px; border-radius: 999px; background: var(--brass); }
/* Today: a filled brass tile so it's unmistakable at a glance. Dark ink on
   brass clears WCAG AA; the weekday, moon glyph, number, label and dots all
   shift to the dark ink so nothing washes out against the accent. */
.cal-day.today {
  background: var(--brass);
  border-color: var(--brass);
  box-shadow: 0 0 0 2px rgba(192, 138, 46, .35), var(--e2);
}
.cal-day.today .cal-day-num,
.cal-day.today .cal-day-wd,
.cal-day.today .cal-day-moon { color: #1b1105; }
.cal-day.today .cal-day-dots i { background: #1b1105; }
.cal-day-today-label {
  display: block; margin-top: 3px;
  font-size: .56rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase;
  color: #1b1105;
}
.cal-hero-moon { color: var(--ink-soft); font-size: var(--t1); margin-top: 6px; }
.cal-badge {
  flex: 0 0 auto; width: 46px; min-height: 40px; border-radius: var(--r-s);
  background: var(--chart-2); border: 1px solid var(--line); color: var(--ink);
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  font-weight: 800; font-size: .82rem; line-height: 1.05;
}
.cal-badge small { font-weight: 650; font-size: .62rem; color: var(--muted); }
.event-row.overdue .cal-badge { border-color: rgba(194,56,38,.5); color: var(--danger); }
.holiday-row { border-left: 4px solid var(--brass); }
.holiday-desc { color: var(--ink); line-height: 1.45; }
.cal-more-note { color: #b9a784; font-size: var(--t0); margin: 2px 2px var(--s2); }
#screen-calendar .timeline-list { margin-bottom: var(--s2); }

/* ---------- More ---------- */
.more-group { margin-bottom: var(--gap); }
.more-group-title {
  font-family: var(--font-display); color: var(--brass-bright);
  font-size: var(--t2); letter-spacing: .05em; margin: 0 2px var(--s2);
}
#screen-more .compact-board[open] > summary { border-bottom: 1px solid var(--line); }
.version-footer { color: #a08c67; }

/* ---------- Wide (>=700px) ---------- */
@media (min-width: 700px) {
  .tile-grid { grid-template-columns: repeat(6, minmax(0,1fr)); }
  .quest-list, .npc-list { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .map-grid { grid-template-columns: repeat(3, minmax(0,1fr)); }
  .stores-pane .lrow-list { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .holding-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: var(--s2); }
}

/* ---------- Compact (<=399px) ---------- */
@media (max-width: 399px) {
  .tile-grid { gap: 6px; }
  .metric { padding: 8px; min-height: 58px; }
  .navbtn { font-size: .66rem; }
  .lrow { padding: 8px 10px; }
  .step-btn { width: 34px; height: 34px; }
}

/* ============================================================ v39 ======= */

/* ---------- Maps: pinnable map cards ---------- */
/* .map-card became a wrapper div (the open action and the pin toggle are
   separate buttons — nested buttons are invalid HTML). The inner open button
   inherits the old card look from the legacy layer via the wrapper. */
.map-card { position: relative; }
.map-card-open {
  display: flex; flex-direction: column; text-align: left; width: 100%;
  padding: 0; border: 0; background: none; cursor: pointer; font: inherit; color: inherit;
}
.map-card-pin {
  position: absolute; top: 8px; right: 8px; z-index: 2;
  width: 34px; height: 34px; border-radius: 999px;
  display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid rgba(31,22,12,.35); background: rgba(239,228,195,.9);
  color: #5c4a2f; cursor: pointer; padding: 0;
}
.map-card-pin svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linejoin: round; }
.map-card-pin.on { background: var(--brass, #c79234); border-color: #8a5f1d; color: #2a1c08; }
.map-card-pin.on svg { fill: currentColor; }
.map-card.pinned { border-color: var(--brass, #c79234); box-shadow: 0 0 0 1px rgba(199,146,52,.5); }

/* ---------- Maps: Gazetteer (v39.18) ---------- */
/* The first chart in the grid renders full-width with a taller thumb. */
.map-card-hero { grid-column: 1 / -1; }
.map-card-hero .map-card-thumb { height: 150px; }
@media (min-width: 700px) { .map-card-hero .map-card-thumb { height: 210px; } }
/* Ghost rows: known place names with no Gazetteer record yet. */
.loc-ghost-row { opacity: 1; }
.loc-ghost-row .lrow-title { color: var(--ink, #2b2114); font-weight: 700; }
.loc-ghost-avatar {
  display: inline-flex; align-items: center; justify-content: center;
  background: transparent; border: 1.5px dashed var(--faint, #948160);
  color: var(--faint, #948160); font-weight: 700;
}
.place-count-chip { background: rgba(30,158,151,.14); border-color: rgba(30,158,151,.5); color: var(--lagoon-deep, #14615c); }
/* v39.26: pinned places are visually grouped and use a brass rail/tint. */
.place-groups, .place-list-section { display: grid; gap: 10px; }
.place-list-section + .place-list-section { margin-top: 4px; }
.place-list-heading {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  padding: 3px 4px; color: #fff0bd; font-weight: 900; font-size: .84rem;
  letter-spacing: .035em; text-transform: uppercase;
  text-shadow: 0 2px 2px rgba(0,0,0,.78);
}
.place-list-section-pinned .place-list-heading { color: #ffd978; }
.place-list-count {
  min-width: 26px; height: 24px; padding: 0 8px; border-radius: 999px;
  display: inline-flex; align-items: center; justify-content: center;
  background: rgba(92,61,15,.72); border: 1px solid rgba(255,217,120,.32);
  color: #fff0bd; font-size: .74rem; font-weight: 900;
  text-shadow: 0 1px 1px rgba(0,0,0,.72);
}
.place-row { transition: border-color .15s ease, background .15s ease, box-shadow .15s ease; }
.place-row.pinned-place-row {
  background: linear-gradient(100deg, #fff4ca 0%, var(--chart) 72%);
  border: 2px solid rgba(184,126,18,.62); border-left: 7px solid #c9911d;
  box-shadow: 0 4px 12px rgba(91,57,5,.18);
}
.place-pin-btn, .place-pinned-badge {
  flex: 0 0 auto; height: 40px; min-width: 42px; padding: 0 10px;
  display: inline-flex; align-items: center; justify-content: center; gap: 5px;
  border-radius: 999px; border: 1px solid rgba(116,83,21,.42);
  font: inherit; font-size: .76rem; font-weight: 850; color: #69501d;
}
.place-pin-btn { background: transparent; cursor: pointer; }
.place-pin-btn:hover, .place-pin-btn:focus-visible { background: rgba(201,145,29,.14); }
.place-pin-btn.on, .place-pinned-badge {
  background: #d5a52f; border-color: #9f6e0b; color: #241a08;
  box-shadow: inset 0 1px rgba(255,255,255,.4), 0 2px 5px rgba(76,49,4,.18);
}
.place-pin-btn svg, .place-pinned-badge svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; }
.place-pinned-chip { background: #d5a52f; border-color: #9f6e0b; color: #241a08; font-weight: 850; }
.place-detail-pin.pinned { background: #d5a52f; border-color: #9f6e0b; color: #241a08; }
.place-pin-hint {
  margin: 0 2px 8px; padding: 8px 10px; border-radius: 10px;
  background: rgba(213,165,47,.12); border: 1px solid rgba(159,110,11,.28);
  color: var(--ink-soft); font-size: .78rem;
}
@media (max-width: 430px) {
  .place-pin-btn span, .place-pinned-badge span { display: none; }
  .place-pin-btn, .place-pinned-badge { width: 40px; min-width: 40px; padding: 0; }
  .place-row .place-count-chip { display: none; }
}
/* Place detail sheet: derived link rows and stacked sections. */
.loc-detail-card .subhead { margin: 14px 0 6px; }
.loc-sheet-list { margin-bottom: 4px; }
.loc-pin-list { margin-top: 10px; }
.loc-link-row { width: 100%; text-align: left; cursor: pointer; }
.loc-link-row .lrow-title { font-weight: 700; }

/* v39.27: compact, collapsed-by-default place sections. Chart jump links
   remain outside these panels so map navigation is always one tap away. */
.loc-collapsible {
  margin-top: 10px; border: 1px solid var(--line); border-radius: 13px;
  background: rgba(255,255,255,.18); overflow: hidden;
}
.loc-collapsible > summary {
  min-height: 48px; padding: 10px 13px; cursor: pointer; list-style: none;
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  font-weight: 850; color: var(--ink); user-select: none;
}
.loc-collapsible > summary::-webkit-details-marker { display: none; }
.loc-collapsible > summary::before {
  content: '›'; width: 18px; color: var(--faint); font-size: 1.25rem;
  transform-origin: center; transition: transform .15s ease;
}
.loc-collapsible[open] > summary::before { transform: rotate(90deg); }
.loc-collapsible > summary > span:first-of-type { flex: 1; }
.loc-collapsible[open] > summary { border-bottom: 1px solid var(--line); background: rgba(255,255,255,.24); }
.loc-section-count {
  min-width: 30px; height: 26px; padding: 0 8px; border-radius: 999px;
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--chart-2); border: 1px solid var(--line); font-size: .75rem;
}
.loc-collapsible-body { padding: 10px; }
.loc-collapsible-body .loc-sheet-list { margin: 0; }
.place-gallery-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(92px, 1fr)); gap: 10px;
}
.place-gallery-tile, .place-gallery-add {
  min-width: 0; border: 1px solid var(--line); border-radius: 12px; padding: 6px;
  background: var(--chart); color: var(--ink); font: inherit; cursor: pointer;
  box-shadow: var(--e1); text-align: center;
}
.place-gallery-thumb {
  display: block; width: 100%; aspect-ratio: 1 / 1; border-radius: 9px;
  overflow: hidden; background: var(--chart-2);
}
.place-gallery-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.place-gallery-name {
  display: block; margin-top: 6px; font-size: .72rem; line-height: 1.2;
  font-weight: 750; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.place-gallery-add {
  min-height: 116px; display: flex; flex-direction: column; align-items: center;
  justify-content: center; gap: 6px; border-style: dashed; color: var(--lagoon-deep);
}
.place-gallery-add span { font-size: 1.7rem; line-height: 1; }
.place-gallery-add b { font-size: .75rem; }
.place-gallery-form-preview {
  min-height: 180px; border-radius: 12px; overflow: hidden; background: var(--chart-2);
}
.place-gallery-form-preview img { width: 100%; max-height: 340px; object-fit: contain; display: block; }
@media (max-width: 390px) {
  .place-gallery-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; }
  .place-gallery-add { min-height: 100px; }
}
/* Inline place-name links on NPC/quest sheets (v39.19). */
.loc-jump {
  background: none; border: 0; padding: 0; margin: 0; font: inherit; cursor: pointer;
  color: var(--lagoon-deep, #14615c); font-weight: 600;
  text-decoration: underline dotted; text-underline-offset: 2px;
}
.loc-jump:active { color: var(--lagoon, #1e9e97); }
/* Pins drawer: the Gazetteer place-info button gets a lagoon tint (v39.20). */
.map-list-place svg { stroke: #9fe1cb; }
/* v39.21: the legacy row was a 4-column grid, so the place button pushed
   delete onto a second line. Flex keeps dot + name + 3 actions on one row;
   long labels ellipsise instead of wrapping. */
.map-list-row { display: flex; align-items: center; gap: 8px; }
.map-list-row .map-list-main { flex: 1 1 auto; min-width: 0; }
.map-list-row .map-list-name,
.map-list-row .map-list-kind { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.map-list-row .map-list-find,
.map-list-row .map-list-del { flex: 0 0 auto; }
@media (max-width: 400px) {
  .map-list-row .map-list-find, .map-list-row .map-list-del { width: 40px; height: 40px; }
}
/* v39.27 marker colours. Removed legacy classes remain below for old cached state. */
.pin-region .map-pin-dot, .map-list-dot.pin-region, .map-legend-dot.pin-region { background: #547bb8; }
.pin-shop .map-pin-dot, .map-list-dot.pin-shop, .map-legend-dot.pin-shop { background: #c2703d; }
.pin-inn .map-pin-dot, .map-list-dot.pin-inn { background: #4a7fd1; }
.pin-temple .map-pin-dot, .map-list-dot.pin-temple { background: #cc4f9e; }
.pin-guild .map-pin-dot, .map-list-dot.pin-guild { background: #949c48; }

/* ---------- Admin screen ---------- */
.char-strip {
  display: flex; gap: 10px; overflow-x: auto; padding: 4px 2px 8px;
  scrollbar-width: none; -webkit-overflow-scrolling: touch;
}
.char-strip::-webkit-scrollbar { display: none; }
.char-strip-note { margin: -2px 2px 10px; color: #fff0c7; font-weight: 750; text-shadow: 0 1px 2px rgba(0,0,0,.75); }
.char-card {
  flex: 0 0 auto; width: 86px; display: flex; flex-direction: column; align-items: center; gap: 4px;
  padding: 8px 6px; border-radius: 12px; border: 1px solid rgba(31,22,12,.22);
  background: var(--chart); cursor: pointer; font: inherit; color: var(--ink);
}
.char-card:active { transform: translateY(1px); }
.char-face, .char-face-empty {
  width: 62px; height: 62px; border-radius: 999px; background-size: cover; background-position: center top;
  border: 2px solid rgba(31,22,12,.3);
}
.char-face-empty {
  display: flex; align-items: center; justify-content: center;
  background: var(--chart-2); color: #7a6647; font-weight: 900; font-size: 1.3rem;
}
.char-name { font-weight: 800; font-size: .78rem; line-height: 1.15; text-align: center; max-width: 100%; overflow: hidden; text-overflow: ellipsis; }
.char-sub { font-size: .66rem; color: var(--muted); text-transform: uppercase; letter-spacing: .04em; }

/* Dice ledger chart: pure-CSS grouped bars in a sideways scroller. */
.dice-card { padding: 10px 12px 8px; }
.dice-legend { display: flex; gap: 14px; font-size: .74rem; color: var(--muted); margin-bottom: 6px; }
.dice-legend span { display: inline-flex; align-items: center; gap: 5px; }
.dice-dot { width: 10px; height: 10px; border-radius: 3px; display: inline-block; }
.dice-dot-1 { background: #b9573c; }
.dice-dot-20 { background: #3f9d54; }
.dice-chart {
  display: flex; align-items: flex-end; gap: 16px; overflow-x: auto;
  padding: 20px 4px 2px; /* headroom for values above short bars */
  scrollbar-width: thin; -webkit-overflow-scrolling: touch;
}
.dice-col {
  flex: 0 0 auto; display: flex; flex-direction: column; align-items: center; gap: 5px;
  border: 0; background: none; padding: 0 3px; cursor: pointer; font: inherit; color: var(--ink);
  border-radius: 8px;
}
.dice-col:hover { background: rgba(31,22,12,.06); }
.dice-bars { display: flex; align-items: flex-end; gap: 4px; height: 120px; border-bottom: 2px solid rgba(31,22,12,.25); padding: 0 1px; }
.dice-bar {
  width: 22px; min-height: 4px; border-radius: 4px 4px 0 0; position: relative;
}
/* Bar values: above the bar by default (dark ink), inside the top of the bar
   (light) once it's tall enough — so numbers never collide with a neighbour. */
.dice-bar i {
  position: absolute; top: -17px; left: 50%; transform: translateX(-50%);
  font-style: normal; font-size: .72rem; font-weight: 800; color: var(--ink);
  font-variant-numeric: tabular-nums; line-height: 1; white-space: nowrap;
}
.dice-bar.val-in i { top: 4px; color: #fdf6e3; text-shadow: 0 1px 0 rgba(0,0,0,.25); }
.dice-bar-1 { background: #b9573c; }
.dice-bar-20 { background: #3f9d54; }
.dice-label { font-size: .74rem; font-weight: 800; color: var(--muted); }

/* Coin count rows */
.coin-who { display: inline-flex; align-items: center; gap: 9px; min-width: 0; }
.coin-face, .coin-face-empty {
  width: 32px; height: 32px; border-radius: 999px; flex: 0 0 auto;
  background-size: cover; background-position: center top; border: 1px solid rgba(31,22,12,.3);
  display: inline-flex; align-items: center; justify-content: center;
}
.coin-face-empty { background: var(--chart-2); color: #7a6647; font-weight: 900; font-size: .85rem; }
.coin-vals { display: inline-flex; align-items: center; gap: 8px; }
.coin-val { font-weight: 800; font-size: .8rem; white-space: nowrap; }
.coin-gold { color: #8a5f1d; }
.coin-silver { color: #5f6a72; }
.coin-insp { color: #2f8f9c; }

/* Next game countdown */
.cd-card { text-align: center; }
.cd-next { font-weight: 800; margin: 2px 0 8px; }
.cd-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
.cd-cell {
  display: flex; flex-direction: column; align-items: center; gap: 2px;
  background: var(--chart-2); border: 1px solid rgba(31,22,12,.18); border-radius: 10px; padding: 8px 2px;
}
.cd-cell b { font-size: 1.35rem; font-variant-numeric: tabular-nums; line-height: 1; }
.cd-cell small { font-size: .62rem; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); }

/* Document links */
.doc-row { display: flex; align-items: stretch; gap: 6px; }
.doc-row .lrow-main { text-decoration: none; color: inherit; min-width: 0; }
.doc-ext { font-size: .78rem; color: var(--muted); }
.doc-edit { flex: 0 0 auto; align-self: center; }

/* Festival manager rows */
.fest-row { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.fest-row .lrow-main { min-width: 0; }
.fest-row.overdue .lrow-title { color: var(--muted); text-decoration: line-through; }

/* ---------- v39.1 fixes ---------- */
/* Char strip: portrait and name are separate buttons inside the card. */
.char-face-btn, .char-meta-btn {
  border: 0; background: none; padding: 0; cursor: pointer; font: inherit; color: inherit;
  display: flex; flex-direction: column; align-items: center; gap: 4px; width: 100%;
}
.char-face-btn:active .char-face { transform: scale(.96); }
/* Party roster rows: portrait button beside the main row button. */
.roster-row { display: flex; align-items: center; gap: 9px; }
.roster-face-btn { border: 0; background: none; padding: 0; cursor: pointer; flex: 0 0 auto; display: inline-flex; }
.roster-face-btn:active .coin-face { transform: scale(.94); }
.roster-row-main { min-width: 0; text-align: left; background: none; border: 0; padding: 0; cursor: pointer; font: inherit; color: inherit; }


/* ---------- v39.11 Codex: expanded NPC detail sheet ---------- */
.npc-detail-card {
  display: grid;
  gap: var(--s3);
  min-width: 0;
  padding: 2px 0 4px;
}
.npc-detail-summary {
  display: grid;
  grid-template-columns: 54px minmax(0, 1fr);
  gap: 10px;
  align-items: start;
}
.npc-detail-avatar {
  width: 54px;
  height: 54px;
  min-width: 54px;
  border: 1px solid var(--line-strong);
  border-radius: 14px;
  overflow: hidden;
  padding: 0;
  background: var(--chart-2);
  color: var(--ink-soft);
  display: grid;
  place-items: center;
  font: 800 1.15rem/1 var(--font-ui);
}
.npc-detail-avatar img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: 50% 50%;
}
.npc-detail-summary-main { min-width: 0; }
.npc-detail-title {
  color: var(--ink);
  font-family: var(--font-display);
  font-size: 1.02rem;
  font-weight: 800;
  line-height: 1.15;
  overflow-wrap: anywhere;
}
.npc-detail-meta {
  margin-top: 2px;
  color: var(--ink-soft);
  font-size: .78rem;
  line-height: 1.3;
}
.npc-detail-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin-top: 6px;
}
.npc-detail-image-frame {
  appearance: none;
  width: 100%;
  min-width: 0;
  max-height: min(64vh, 720px);
  overflow: hidden;
  border: 10px solid transparent;
  border-radius: 22px;
  padding: clamp(8px, 2vw, 14px);
  background:
    linear-gradient(180deg, #f9edc5, #dcc187) padding-box,
    repeating-linear-gradient(135deg, #2a1b10 0 10px, #8a6330 10px 18px, #d4b66b 18px 26px, #5b3d1d 26px 34px) border-box;
  box-shadow: 0 15px 36px rgba(35, 22, 10, .28), inset 0 0 0 1px rgba(255, 255, 255, .3);
}
.npc-detail-image-button { cursor: zoom-in; }
.npc-detail-image-button:hover,
.npc-detail-image-button:focus-visible {
  outline: 3px solid var(--lagoon);
  outline-offset: 3px;
}
.npc-detail-image-frame img {
  width: 100%;
  height: auto;
  max-height: calc(min(64vh, 720px) - 48px);
  display: block;
  object-fit: contain;
  object-position: center;
  border-radius: 12px;
  background: #1d130b;
  box-shadow: inset 0 0 0 1px rgba(33, 20, 9, .45);
}
.npc-detail-image-empty {
  min-height: 220px;
  border: 1px dashed var(--line-strong);
  border-radius: var(--r-m);
  background: var(--chart-2);
  color: var(--ink-soft);
  display: grid;
  place-items: center;
  align-content: center;
  gap: 8px;
  text-align: center;
}
.npc-detail-image-empty span {
  font-family: var(--font-display);
  font-size: 3rem;
  font-weight: 800;
}
.npc-detail-image-empty small { font-weight: 700; }
.npc-detail-notes {
  color: var(--ink);
  font-size: .88rem;
  line-height: 1.5;
  overflow-wrap: anywhere;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: var(--r-m);
  background: rgba(255, 250, 228, .45);
}
.npc-detail-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}
.npc-detail-actions .button { width: 100%; }
.dead-npc-detail .npc-detail-image-frame,
.dead-npc-detail .npc-detail-avatar { filter: saturate(.75); }
@media (max-width: 520px) {
  .npc-detail-card { gap: 12px; }
  .npc-detail-summary { grid-template-columns: 48px minmax(0, 1fr); gap: 9px; }
  .npc-detail-avatar { width: 48px; height: 48px; min-width: 48px; border-radius: 12px; }
  .npc-detail-image-frame { border-width: 8px; border-radius: 18px; padding: 8px; }
  .npc-detail-notes { padding: 11px 12px; }
}

/* ---------- v39.12 Codex: Ships ---------- */
.codex-ship-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 10px;
}
.codex-ship-card {
  width: 100%;
  min-width: 0;
  display: grid;
  grid-template-columns: 88px minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 10px;
  border: 1px solid var(--line-strong);
  border-radius: var(--r-m);
  background: var(--paper);
  color: var(--ink);
  font: inherit;
  text-align: left;
  cursor: pointer;
  box-shadow: var(--e1);
}
.codex-ship-card.muted-ship-card,
.codex-ship-card.sunk-ship-card,
.codex-ship-card.squibbed-ship-card { filter: grayscale(1); opacity: .8; }
.codex-ship-card:hover,
.codex-ship-card:focus-visible {
  border-color: var(--lagoon);
  outline: 2px solid color-mix(in srgb, var(--lagoon) 45%, transparent);
  outline-offset: 2px;
}
.codex-ship-thumb {
  width: 88px;
  height: 68px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--chart-2);
  display: grid;
  place-items: center;
}
.codex-ship-thumb img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}
.codex-ship-thumb-empty {
  color: var(--ink-soft);
  font-size: 1.7rem;
}
.codex-ship-card-body { min-width: 0; display: grid; gap: 4px; }
.codex-ship-card-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; min-width: 0; }
.ship-card-chips, .ship-detail-chips { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 5px; }
.ship-filter-group { margin-bottom: 8px; }
.ship-filter-label {
  margin: 0 0 5px 2px;
  font-size: .78rem;
  font-weight: 900;
  letter-spacing: .055em;
  text-transform: uppercase;
  color: var(--brass-bright);
  text-shadow: 0 1px 1px rgba(0, 0, 0, .55);
}
.ship-filter-group .status-chips { margin-bottom: 0; }
.codex-ship-name {
  min-width: 0;
  color: var(--ink);
  font-family: var(--font-display);
  font-size: 1rem;
  font-weight: 800;
  line-height: 1.2;
  overflow-wrap: anywhere;
}
.codex-ship-meta { color: var(--ink-soft); font-size: .78rem; line-height: 1.3; }

.ship-detail-card { display: grid; gap: var(--s3); min-width: 0; }
.ship-detail-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.ship-detail-title {
  color: var(--ink);
  font-family: var(--font-display);
  font-size: 1.14rem;
  font-weight: 800;
  line-height: 1.2;
  overflow-wrap: anywhere;
}
.ship-detail-port { margin-top: 3px; color: var(--ink-soft); font-size: .8rem; }
.ship-captain-link {
  width: 100%;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 9px;
  align-items: center;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: var(--r-m);
  background: rgba(255, 250, 228, .45);
  color: var(--ink);
  font: inherit;
  text-align: left;
  cursor: pointer;
}
.ship-captain-link span:first-child { color: var(--ink-soft); font-size: .76rem; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; }
.ship-captain-link strong { overflow-wrap: anywhere; }
.ship-captain-link:not(.ship-captain-empty):hover,
.ship-captain-link:not(.ship-captain-empty):focus-visible { border-color: var(--lagoon); outline: 2px solid color-mix(in srgb, var(--lagoon) 35%, transparent); }
.ship-captain-empty { cursor: default; }
.ship-lineage-links { display: grid; gap: 8px; }
.ship-lineage-link span:first-child { color: var(--brass-dark); }
.ship-squib-line { font-weight: 800; }
.ship-detail-gallery { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.ship-detail-media { min-width: 0; display: grid; gap: 5px; }
.ship-detail-media-label { color: var(--ink-soft); font-size: .76rem; font-weight: 900; text-transform: uppercase; letter-spacing: .055em; }
.ship-detail-image {
  width: 100%;
  min-height: 210px;
  max-height: min(52vh, 520px);
  padding: 0;
  overflow: hidden;
  border: 1px solid var(--line-strong);
  border-radius: 18px;
  background: #1d130b;
  display: grid;
  place-items: center;
}
button.ship-detail-image { cursor: zoom-in; }
button.ship-detail-image:hover,
button.ship-detail-image:focus-visible { outline: 3px solid var(--lagoon); outline-offset: 3px; }
.ship-detail-image img {
  width: 100%;
  height: 100%;
  max-height: min(52vh, 520px);
  display: block;
  object-fit: contain;
  object-position: center;
}
.ship-detail-image-empty {
  color: var(--ink-soft);
  background: var(--chart-2);
  align-content: center;
  gap: 8px;
  text-align: center;
}
.ship-detail-image-empty span { font-size: 3rem; }
.ship-detail-image-empty small { font-weight: 700; }
.ship-detail-facts { display: flex; flex-wrap: wrap; gap: 7px; }
.ship-detail-notes {
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: var(--r-m);
  background: rgba(255, 250, 228, .45);
  color: var(--ink);
  font-size: .88rem;
  line-height: 1.5;
  overflow-wrap: anywhere;
}
.ship-detail-actions {
  display: grid;
  grid-template-columns: 1.2fr 1fr 1fr;
  gap: 8px;
}
.ship-detail-actions .button { width: 100%; }
.ship-form-preview {
  max-height: 260px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: var(--r-m);
  background: var(--chart-2);
}
.ship-form-preview img { width: 100%; max-height: 260px; display: block; object-fit: contain; }
.ship-form-preview-label { padding: 6px 9px; border-bottom: 1px solid var(--line); color: var(--ink-soft); font-size: .72rem; font-weight: 900; text-transform: uppercase; letter-spacing: .04em; }
.ship-form-preview-empty { min-height: 90px; display: grid; place-items: center; padding: 12px; color: var(--ink-soft); font-weight: 700; }
.field-help { margin-top: 5px; color: var(--ink-soft); font-size: .76rem; line-height: 1.35; }
.muted-ship-detail .ship-detail-head,
.muted-ship-detail .ship-captain-link,
.muted-ship-detail .ship-detail-gallery,
.sunk-ship-detail .ship-detail-head,
.sunk-ship-detail .ship-captain-link,
.sunk-ship-detail .ship-detail-gallery,
.squibbed-ship-detail .ship-detail-head,
.squibbed-ship-detail .ship-captain-link,
.squibbed-ship-detail .ship-detail-gallery { filter: grayscale(1); opacity: .82; }

@media (min-width: 700px) {
  .codex-ship-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 399px) {
  .hub-seg .seg-btn { padding-inline: 7px; font-size: .76rem; }
  .codex-ship-card { grid-template-columns: 70px minmax(0, 1fr) auto; gap: 9px; padding: 8px; }
  .codex-ship-thumb { width: 70px; height: 58px; }
  .codex-ship-card-head { display: grid; justify-content: stretch; }
  .ship-card-chips { justify-content: flex-start; }
  .ship-detail-gallery { grid-template-columns: 1fr; }
  .ship-detail-image { min-height: 190px; }
  .ship-detail-actions { grid-template-columns: 1fr; }
}

/* v39.22: marker importance modal section headings. */
.marker-order-section {
  font-family: var(--font-display, inherit);
  font-weight: 700;
  font-size: .82rem;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--ink-soft, #4a3b28);
  margin: 4px 0 -4px;
}


/* v39.39 — Holdings reference hub */
.holding-card-open {
  width: 100%; min-width: 0; display: grid; gap: 8px; padding: 0;
  border: 0; background: transparent; color: inherit; font: inherit; text-align: left;
  cursor: pointer; border-radius: var(--r-m);
}
.holding-card-open:hover,
.holding-card-open:focus-visible { outline: 3px solid color-mix(in srgb, var(--lagoon) 48%, transparent); outline-offset: 4px; }
.holding-card-title-row,
.holding-card-open .island-head { width: 100%; align-items: start; }
.holding-open-chevron { align-self: center; color: var(--ink-soft); font-size: 1.45rem; font-weight: 900; line-height: 1; }
.holding-link-chip { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.holding-link-chip.is-linked { border-color: color-mix(in srgb, var(--lagoon) 45%, var(--line)); background: color-mix(in srgb, var(--lagoon) 13%, rgba(255,255,255,.34)); }
.holding-link-chip.is-unlinked { opacity: .72; }
.holding-reference-panel { display: grid; gap: 8px; }
.holding-reference-link span:first-child { color: var(--brass-dark); }
.holding-ref-mode { font-size: .72rem; }
.holding-detail-actions { grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); }
.holding-detail-hp { margin-bottom: -6px; }
@media (max-width: 430px) {
  .holding-link-chip { max-width: 190px; }
  .holding-detail-actions { grid-template-columns: 1fr; }
}


/* v39.40 — cross-platform free-text location suggestions */
.free-suggest-wrap {
  position: relative;
  width: 100%;
  min-width: 0;
}
.free-suggest-wrap > input { width: 100%; }
.free-suggest-list {
  position: absolute;
  z-index: 420;
  top: calc(100% + 6px);
  left: 0;
  right: 0;
  max-height: min(42dvh, 320px);
  overflow-y: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  border: 1px solid rgba(74, 48, 24, .42);
  border-radius: 14px;
  background: linear-gradient(180deg, #fff7dc, #ead9aa);
  box-shadow: 0 14px 34px rgba(28, 17, 8, .34);
  padding: 6px;
  color: #21150b;
}
.free-suggest-wrap.free-suggest-up .free-suggest-list {
  top: auto;
  bottom: calc(100% + 6px);
}
.free-suggest-list[hidden] { display: none; }
.free-suggest-heading {
  position: sticky;
  top: -6px;
  z-index: 1;
  display: flex;
  justify-content: space-between;
  gap: 10px;
  padding: 9px 10px 7px;
  background: rgba(255, 247, 220, .97);
  border-bottom: 1px solid rgba(74, 48, 24, .18);
  color: #5b3d1f;
  font-size: .76rem;
  font-weight: 900;
  letter-spacing: .02em;
  text-transform: uppercase;
}
.free-suggest-option {
  appearance: none;
  width: 100%;
  min-height: 46px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border: 0;
  border-bottom: 1px solid rgba(74, 48, 24, .13);
  border-radius: 9px;
  background: transparent;
  color: #21150b;
  padding: 10px 11px;
  text-align: left;
  font: inherit;
  font-weight: 800;
  cursor: pointer;
}
.free-suggest-option-main {
  min-width: 0;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.free-suggest-option-main > span:last-child { min-width: 0; overflow-wrap: anywhere; }
.free-suggest-ship-anchor {
  flex: 0 0 28px;
  width: 28px;
  height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: rgba(37, 102, 112, .13);
  border: 1px solid rgba(37, 102, 112, .34);
  color: #155c68;
  font-size: .92rem;
  line-height: 1;
}
.free-suggest-option.is-ship-location small { color: #315f67; }
.free-suggest-option.is-ship-location:hover .free-suggest-ship-anchor,
.free-suggest-option.is-ship-location.active .free-suggest-ship-anchor {
  background: rgba(255,255,255,.48);
  border-color: rgba(33,16,8,.34);
  color: #27170b;
}
.free-suggest-option small {
  flex: 0 0 auto;
  color: #756044;
  font-size: .7rem;
  font-weight: 700;
}
.free-suggest-option:hover,
.free-suggest-option:focus-visible,
.free-suggest-option.active {
  outline: none;
  background: #d99d31;
  color: #1a1008;
}
.free-suggest-option.active small,
.free-suggest-option:hover small { color: #3d290f; }
.free-suggest-empty,
.free-suggest-note {
  padding: 10px 11px;
  color: #6a563b;
  font-size: .78rem;
  line-height: 1.35;
}
.free-suggest-note {
  position: sticky;
  bottom: -6px;
  background: rgba(234, 217, 170, .97);
  border-top: 1px solid rgba(74, 48, 24, .18);
}
@media (max-width: 520px) {
  .free-suggest-list { max-height: min(38dvh, 280px); }
  .free-suggest-option { min-height: 50px; }
}


/* ---------- v39.41 Codex relationship links ---------- */
.codex-note-link {
  display: inline;
  appearance: none;
  -webkit-appearance: none;
  padding: 0;
  border: 0;
  background: transparent;
  color: #1264c5;
  font: inherit;
  font-weight: 750;
  line-height: inherit;
  cursor: pointer;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 2px;
}
.codex-note-link:hover { color: #084b9d; text-decoration-thickness: 2px; }
.codex-note-link:active { color: #073b7a; }
.codex-note-link:focus-visible { outline: 2px solid #1264c5; outline-offset: 2px; border-radius: 3px; }
.codex-reference-list { margin-bottom: 10px; }
.codex-reference-row .lrow-sub { text-transform: none; }
.profile-aliases {
  display: grid;
  gap: 7px;
  padding: 11px 12px;
  border: 1px solid var(--line);
  border-radius: var(--r-m);
  background: rgba(255, 250, 228, .45);
}
.profile-aliases-label { color: var(--ink-soft); font-size: .76rem; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; }
.profile-alias-chips { display: flex; flex-wrap: wrap; gap: 6px; }


/* ---------- v39.43 player profile photo carousel ---------- */
.profile-photo-widget {
  display: grid;
  gap: 9px;
  min-width: 0;
}
.profile-photo-carousel {
  display: flex;
  gap: 12px;
  overflow-x: auto;
  padding: 4px 7% 10px;
  scroll-snap-type: x mandatory;
  scroll-padding-inline: 7%;
  overscroll-behavior-x: contain;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  touch-action: pan-x pan-y;
  cursor: grab;
  user-select: none;
}
.profile-photo-carousel.is-pointer-dragging {
  cursor: grabbing;
  scroll-snap-type: none;
}
.profile-photo-carousel img { -webkit-user-drag: none; user-select: none; }
.profile-photo-carousel::-webkit-scrollbar { display: none; }

.profile-photo-placeholder {
  flex: 0 0 86%;
  min-height: 240px;
  scroll-snap-align: center;
  display: grid;
  place-items: center;
  text-align: center;
  border: 1px dashed var(--line-strong);
  border-radius: 18px;
  background: var(--chart-2);
  color: var(--ink-soft);
  font-weight: 800;
  padding: 20px;
}
.profile-photo-slide {
  position: relative;
  flex: 0 0 86%;
  margin: 0;
  scroll-snap-align: center;
  scroll-snap-stop: always;
  border: 8px solid transparent;
  border-radius: 22px;
  padding: 7px;
  background:
    linear-gradient(180deg, #f9edc5, #dcc187) padding-box,
    repeating-linear-gradient(135deg, #2a1b10 0 10px, #8a6330 10px 18px, #d4b66b 18px 26px, #5b3d1d 26px 34px) border-box;
  box-shadow: 0 12px 28px rgba(35,22,10,.25);
  transition: opacity .15s ease, transform .15s ease;
}
.profile-photo-slide img {
  width: 100%;
  aspect-ratio: 4 / 5;
  max-height: min(58vh, 680px);
  display: block;
  object-fit: contain;
  object-position: center;
  border-radius: 12px;
  background: #1d130b;
}
.profile-photo-slide.is-deleted { display: none; }
.profile-primary-badge,
.profile-new-badge {
  position: absolute;
  top: 16px;
  left: 16px;
  z-index: 2;
  border: 1px solid rgba(255,235,164,.7);
  border-radius: 999px;
  background: rgba(39,27,13,.88);
  color: #ffe29a;
  padding: 5px 9px;
  font-size: .72rem;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .045em;
  box-shadow: 0 4px 12px rgba(0,0,0,.28);
}
.profile-new-badge { left: auto; right: 16px; color: #d8f8ff; border-color: rgba(116,215,237,.65); }
.profile-photo-delete {
  position: absolute;
  top: 12px;
  right: 12px;
  z-index: 3;
  width: 38px;
  height: 38px;
  border-radius: 999px;
  border: 1px solid rgba(255,220,196,.7);
  background: rgba(102,28,18,.9);
  color: #fff4dc;
  font-size: 1.35rem;
  line-height: 1;
  cursor: pointer;
}
.profile-photo-slide.is-new .profile-photo-delete { display: none; }
.profile-photo-nav {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  min-height: 22px;
}
.profile-photo-dots { display: inline-flex; gap: 7px; }
.profile-photo-dot {
  width: 9px;
  height: 9px;
  padding: 0;
  border: 0;
  border-radius: 999px;
  background: rgba(63,45,24,.28);
  cursor: pointer;
}
.profile-photo-dot.active { width: 22px; background: #9c6426; }
.profile-photo-counter { color: var(--muted); font-size: .75rem; font-weight: 800; min-width: 34px; }
.profile-primary-button { justify-self: center; min-width: 148px; }
.profile-photo-empty {
  min-height: 150px;
  display: grid;
  place-items: center;
  text-align: center;
  border: 1px dashed var(--line-strong);
  border-radius: var(--r-m);
  background: var(--chart-2);
  color: var(--ink-soft);
  font-weight: 750;
  padding: 16px;
}
.profile-upload-field { border-top: 1px solid var(--line); padding-top: 10px; }
.profile-lightbox .profile-photo-slide { flex-basis: 92%; }
.profile-lightbox .profile-photo-slide img { max-height: min(70vh, 820px); }
@media (max-width: 520px) {
  .profile-photo-carousel { gap: 9px; padding-inline: 5%; scroll-padding-inline: 5%; }
  .profile-photo-slide { flex-basis: 90%; border-width: 6px; border-radius: 18px; padding: 6px; }
  .profile-photo-slide img { max-height: 56vh; }
}
@media (prefers-reduced-motion: reduce) {
  .profile-photo-slide { transition: none; }
}


/* ---------- v39.44 character relationships ---------- */
.family-surname-link { font-weight: inherit; }
.relationship-chip { cursor: pointer; }
.profile-relationship-section {
  display: grid;
  gap: 8px;
  padding: 12px;
  border: 1px solid rgba(67, 47, 23, .22);
  border-radius: 14px;
  background: rgba(255,255,255,.22);
}
.profile-relationship-heading {
  color: var(--ink-soft);
  font-size: .76rem;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .045em;
}
.profile-relationship-links { display: grid; gap: 7px; }
.relationship-person-link {
  appearance: none;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  border: 1px solid rgba(18,100,197,.28);
  border-radius: 11px;
  padding: 9px 11px;
  background: rgba(18,100,197,.07);
  color: #0b4f9c;
  text-align: left;
  font: inherit;
  font-weight: 850;
  cursor: pointer;
}
.relationship-person-link small { color: #5f503c; font-size: .7rem; font-weight: 750; text-align: right; }
.romantic-person-link { border-color: rgba(154,45,91,.3); background: rgba(154,45,91,.08); color: #8a214e; }
.profile-family-editor {
  border: 1px solid rgba(67,47,23,.25);
  border-radius: 14px;
  background: rgba(255,255,255,.18);
  overflow: hidden;
}
.profile-family-editor > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 13px 14px;
  color: var(--ink);
  font-weight: 900;
  cursor: pointer;
}
.family-picker-count {
  min-width: 28px;
  padding: 3px 8px;
  border-radius: 999px;
  background: var(--brass);
  color: #201307;
  text-align: center;
}
.family-picker-body { display: grid; gap: 10px; padding: 0 12px 12px; }
.family-picker-search { width: 100%; }
.family-picker-list { max-height: 330px; overflow-y: auto; overscroll-behavior: contain; display: grid; gap: 12px; }
.family-picker-group { display: grid; gap: 5px; }
.family-picker-group h4 { margin: 0; color: var(--ink-soft); font-size: .76rem; text-transform: uppercase; letter-spacing: .04em; }
.family-picker-option {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: 10px;
  min-height: 48px;
  padding: 8px 10px;
  border: 1px solid rgba(67,47,23,.18);
  border-radius: 10px;
  background: rgba(255,255,255,.25);
  cursor: pointer;
}
.family-picker-option input { width: 20px; height: 20px; }
.family-picker-option span { display: grid; gap: 2px; min-width: 0; }
.family-picker-option small { color: var(--ink-soft); font-size: .72rem; }
.family-picker-option:has(input:checked) { border-color: rgba(18,100,197,.48); background: rgba(18,100,197,.1); }

/* Full-width suggestion sheet on phones: avoids the two-column form clipping
   shown by iOS/Android keyboards while keeping free typing available. */
.free-suggest-list.is-mobile-fixed {
  position: fixed;
  right: auto;
  bottom: auto;
  width: auto;
  margin: 0;
  max-height: none;
  z-index: 1200;
}
.free-suggest-option > .free-suggest-option-main { min-width: 0; }
.free-suggest-option > small { white-space: nowrap; }
.npc-card > .profile-aliases,
.npc-card > .profile-relationship-section { grid-column: 1 / -1; }


/* v39.52 — DM password lock */
.dm-lock-gate .dm-lock-cancel { margin-top:10px; width:100%; }
.dm-password-reveal { font-size:.95rem; padding:3px 9px; border-radius:8px; background:var(--chart-2); border:1px solid var(--line-strong); color:var(--ink); word-break:break-all; }

/* v39.45 — Secrecy, DM Screen and Plot Hooks (v39.51 readability overhaul) */
.secret-access-panel {
  margin: 16px 0;
  border: 1px solid color-mix(in srgb, var(--gold, #c8912d) 60%, transparent);
  border-radius: 18px;
  background: linear-gradient(180deg, #33241a, #241a13);
  color: #fbf1dc;
  overflow: hidden;
}
.secret-master-toggle { display:flex; align-items:center; gap:12px; padding:15px 16px; cursor:pointer; }
.secret-master-toggle input { width:22px; height:22px; flex:0 0 auto; accent-color:#e2a437; }
.secret-master-toggle > span:last-child { display:grid; gap:2px; }
.secret-master-toggle b { color:#fff3d6; font-size:1.02rem; }
.secret-master-toggle small { color:#e4d5b3; font-weight:500; line-height:1.35; }
.secret-lock-icon { display:grid; place-items:center; width:34px; height:34px; flex:0 0 34px; border:1px solid #d49b37; border-radius:11px; color:#f7cd66; background:rgba(214,155,55,.12); }
.secret-lock-icon svg { width:19px; height:19px; }
.secret-known-picker { padding:4px 14px 16px; border-top:1px solid rgba(240,202,125,.22); background:rgba(20,14,9,.4); }
.secret-known-picker[hidden] { display:none; }
.secret-known-heading { padding:14px 2px 10px; font-weight:800; color:#ffe8aa; font-size:.96rem; }
.secret-person-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); gap:9px; }
.secret-person-option {
  display:flex; align-items:center; gap:11px; min-width:0; padding:11px 13px;
  border:1px solid rgba(236,216,170,.34); border-radius:14px;
  background:rgba(255,248,224,.05); cursor:pointer; transition:border-color .12s, background .12s;
}
.secret-person-option:hover { border-color:rgba(236,216,170,.6); }
.secret-person-option:has(input:checked) { border-color:#e0aa42; background:rgba(224,170,66,.14); }
.secret-person-option:has(input:disabled) { cursor:default; opacity:.92; }
.secret-person-option input { width:21px; height:21px; flex:0 0 auto; accent-color:#e2a437; }
.secret-person-avatar {
  width:38px; height:38px; flex:0 0 38px; border-radius:11px; overflow:hidden;
  display:grid; place-items:center; background:#4a3620; color:#ffe6b6;
  font-weight:800; font-size:1.02rem; border:1px solid rgba(255,231,178,.28);
}
.secret-person-avatar img { width:100%; height:100%; object-fit:cover; }
.secret-person-text { display:grid; min-width:0; gap:1px; }
.secret-person-text b { color:#fff5df; font-size:.98rem; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.secret-person-text small { color:#ddcba6; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.secret-person-option.is-self { border-color:#e0aa42; }
.secret-person-option.is-creator .secret-person-avatar { background:#3a5170; color:#dcecff; }
.secret-access-panel .field-hint { color:#d3c19c; padding:10px 2px 0; }
.secret-chip { background:#2f4a72 !important; border-color:#7ba9dd !important; color:#eaf4ff !important; }
.secret-record-row { box-shadow:inset 4px 0 #5487c2; }

/* DM Screen shell */
.dm-emblem { display:inline-grid; place-items:center; }
.dm-emblem svg { display:block; width:100%; height:100%; filter:drop-shadow(0 2px 3px rgba(0,0,0,.35)); }
.dm-hero-emblem { width:60px; height:60px; flex:0 0 60px; }
.d20-avatar { width:56px; height:56px; }
.plot-hook-summary .d20-avatar { width:52px; height:52px; }

.dm-screen-hero { display:grid; grid-template-columns:auto 1fr auto; gap:15px; align-items:center; margin-bottom:16px; padding:18px; border:1px solid #a07b3b; border-radius:22px; background:linear-gradient(145deg,#33231700,#33231700), linear-gradient(150deg,#3a2817,#20160f); color:#fff2cf; box-shadow:0 12px 30px rgba(0,0,0,.24); }
.dm-screen-hero h2 { margin:0 0 4px; color:#fff7df; }
.dm-screen-hero p { margin:0; color:#e0cfa8; line-height:1.42; }
.dm-metric-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin-bottom:14px; }
.dm-metric-grid .metric { text-align:left; }
.dm-dossier-list { display:grid; gap:14px; }
.dm-dossier {
  border:1px solid rgba(203,171,105,.58);
  border-radius:20px;
  background:linear-gradient(180deg,#f8efd3,#ecddb1);
  color:#21170f;
  overflow:hidden;
  box-shadow:0 8px 22px rgba(0,0,0,.16);
}
.dm-dossier > summary {
  display:grid;
  grid-template-columns:56px minmax(0,1fr) auto;
  align-items:center;
  gap:13px;
  min-height:82px;
  padding:13px 16px;
  cursor:pointer;
  list-style:none;
  background:rgba(255,255,255,.14);
}
.dm-dossier > summary::-webkit-details-marker { display:none; }
.dm-dossier > summary::after {
  content:'›';
  grid-column:4;
  color:#7b643f;
  font-size:1.45rem;
  font-weight:900;
  transform:rotate(90deg);
  transition:transform .16s ease;
}
.dm-dossier[open] > summary { border-bottom:1px solid rgba(92,64,30,.22); }
.dm-dossier[open] > summary::after { transform:rotate(-90deg); }
.dossier-avatar {
  width:54px;
  height:54px;
  border-radius:15px;
  overflow:hidden;
  display:grid;
  place-items:center;
  background:#3b2a1c;
  color:#fff1cf;
  font-weight:900;
  font-size:1.2rem;
  box-shadow:0 2px 8px rgba(0,0,0,.2);
}
.dossier-avatar img { width:100%; height:100%; object-fit:cover; }
.dm-dossier-title { display:grid; gap:2px; min-width:0; }
.dm-dossier-title b { font-size:1.08rem; color:#241a10; }
.dm-dossier-title small { color:#6b5b43; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
.dm-dossier-counts { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:6px; }
.dossier-empty-chip { background:rgba(90,67,37,.12); color:#715e42; border-color:rgba(90,67,37,.26); }
.dossier-connection-chip { background:#e3d5f5; color:#4d2f79; border-color:#b99ddd; }
.dm-dossier-body { display:grid; gap:14px; padding:14px 16px 17px; }
.dossier-panel {
  min-width:0;
  padding:13px;
  border:1px solid rgba(76,54,28,.18);
  border-radius:15px;
  background:rgba(255,255,255,.28);
}
.dossier-panel-heading {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:11px;
}
.dossier-panel-heading > span:first-child { display:grid; gap:2px; min-width:0; }
.dossier-panel-heading b {
  color:#392717;
  font-size:.88rem;
  text-transform:uppercase;
  letter-spacing:.045em;
}
.dossier-panel-heading small { color:#756245; font-size:.74rem; line-height:1.25; }
.dossier-panel-count {
  min-width:32px;
  height:32px;
  padding:0 9px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  box-sizing:border-box;
  line-height:1;
  text-align:center;
  font-variant-numeric:tabular-nums;
  border:1px solid #bca46e;
  border-radius:999px;
  background:#eadcaf;
  color:#352515;
  font-weight:900;
}
.dossier-panel-count.is-secret { background:#dbe7f6; border-color:#9bb7d7; color:#224e7e; }
.dossier-panel-count.is-hook { background:#d8ebe7; border-color:#8ebeb3; color:#175e55; }
.dossier-connection-grid {
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(238px,1fr));
  gap:10px;
  align-items:start;
}
.dossier-connection-card {
  min-width:0;
  display:block;
  border:1px solid rgba(58,43,26,.17);
  border-left-width:4px;
  border-radius:13px;
  background:#fff9e9;
  overflow:hidden;
  box-shadow:0 2px 7px rgba(54,37,20,.07);
  transition:box-shadow .15s ease, transform .15s ease, border-color .15s ease;
}
.dossier-connection-card:hover {
  border-color:rgba(58,43,26,.28);
  box-shadow:0 5px 14px rgba(54,37,20,.11);
}
.dossier-connection-card > summary {
  display:grid;
  grid-template-columns:12px minmax(0,1fr) auto auto;
  align-items:center;
  gap:9px;
  min-height:62px;
  padding:10px 11px;
  cursor:pointer;
  list-style:none;
  user-select:none;
  -webkit-tap-highlight-color:transparent;
}
.dossier-connection-card > summary::-webkit-details-marker { display:none; }
.dossier-connection-card > summary::after {
  content:'›';
  color:#846e4d;
  font-size:1.18rem;
  font-weight:900;
  transform:rotate(90deg);
  transition:transform .16s ease;
}
.dossier-connection-card[open] > summary {
  border-bottom:1px solid rgba(58,43,26,.12);
  background:rgba(255,255,255,.25);
}
.dossier-connection-card[open] > summary::after { transform:rotate(-90deg); }
.dossier-connection-title { display:grid; gap:1px; min-width:0; }
.dossier-connection-title b {
  color:#2e2116;
  font-size:.87rem;
  overflow-wrap:anywhere;
}
.dossier-connection-title small { color:#77654b; font-size:.69rem; }
.dossier-connection-count {
  min-width:29px;
  height:29px;
  padding:0 8px;
  display:inline-grid;
  place-items:center;
  border:1px solid rgba(91,68,36,.2);
  border-radius:999px;
  background:rgba(255,255,255,.48);
  color:#46351f;
  font-size:.75rem;
  font-weight:900;
}
.dossier-connection-content {
  display:grid;
  gap:9px;
  padding:10px;
}
.dossier-connection-mark {
  width:12px;
  height:12px;
  flex:0 0 12px;
  border-radius:999px;
  background:#8e7446;
  box-shadow:0 0 0 4px rgba(142,116,70,.13);
}
.dossier-connection-card.is-romance { border-left-color:#9a2d5b; background:#fff4f7; }
.dossier-connection-card.is-romance .dossier-connection-mark { background:#9a2d5b; box-shadow:0 0 0 4px rgba(154,45,91,.12); }
.dossier-connection-card.is-family { border-left-color:#1264c5; background:#f3f8ff; }
.dossier-connection-card.is-family .dossier-connection-mark { background:#1264c5; box-shadow:0 0 0 4px rgba(18,100,197,.12); }
.dossier-connection-card.is-captain { border-left-color:#14766d; background:#f1fbf8; }
.dossier-connection-card.is-captain .dossier-connection-mark { background:#14766d; box-shadow:0 0 0 4px rgba(20,118,109,.12); }
.dossier-connection-card.is-mention { border-left-color:#6750a4; background:#f7f4ff; }
.dossier-connection-card.is-mention .dossier-connection-mark { background:#6750a4; box-shadow:0 0 0 4px rgba(103,80,164,.12); }
.dossier-connection-card.is-alias { border-left-color:#b67b18; background:#fff9e8; }
.dossier-connection-card.is-alias .dossier-connection-mark { background:#b67b18; box-shadow:0 0 0 4px rgba(182,123,24,.13); }
.dossier-connection-list { display:grid; gap:7px; min-width:0; }
.dossier-connection-list.is-aliases { display:flex; flex-wrap:wrap; align-items:flex-start; }
.dossier-connection-link {
  width:100%;
  min-width:0;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:8px;
  padding:8px 9px;
  border:1px solid rgba(64,50,31,.14);
  border-radius:10px;
  background:rgba(255,255,255,.68);
  color:#2d2116;
  text-align:left;
  font:inherit;
  cursor:pointer;
}
.dossier-connection-link:hover { border-color:rgba(64,50,31,.3); background:#fff; }
.dossier-connection-link > span:first-child { display:grid; gap:1px; min-width:0; }
.dossier-connection-link b { overflow-wrap:anywhere; font-size:.83rem; color:inherit; }
.dossier-connection-link small { overflow-wrap:anywhere; color:#75644c; font-size:.68rem; font-weight:700; }
.dossier-link-chevron { color:#8b7652; font-size:1.15rem; font-weight:900; }
.dossier-alias-chip {
  display:inline-flex;
  align-items:center;
  max-width:100%;
  padding:7px 10px;
  border:1px solid #d2b876;
  border-radius:999px;
  background:#f8e9b9;
  color:#4e3816;
  font-size:.78rem;
  font-weight:850;
  overflow-wrap:anywhere;
}
.dossier-view-all {
  width:100%;
  margin-top:1px;
  padding:8px 10px;
  border:1px solid rgba(103,80,164,.25);
  border-radius:10px;
  background:rgba(103,80,164,.08);
  color:#503c86;
  font:inherit;
  font-size:.76rem;
  font-weight:850;
  cursor:pointer;
}
@media (min-width:760px) {
  .dossier-connection-card[open] { grid-column:span 2; }
  .dossier-connection-card[open] .dossier-connection-list:not(.is-aliases) {
    grid-template-columns:repeat(auto-fit,minmax(190px,1fr));
  }
}
@media (min-width:1180px) {
  .dossier-connection-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
}
.dossier-hidden-grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
  align-items:start;
}
.dossier-hidden-grid .lrow-list { min-width:0; }
.dossier-hidden-grid .lrow { min-width:0; }
.dossier-no-connections { grid-column:1/-1; }
.dossier-profile-action { display:flex; justify-content:flex-end; }
.secret-index-row .codex-type-avatar { flex:0 0 40px; }
.plot-hook-list,.dm-all-hooks,.dm-only-secrets { margin-top:14px; }
.plot-hook-row { border-left:4px solid #3b78ae; }
.hook-shared-section { padding:12px 0; }
.dm-only-secrets .board-intro,.compact-board .board-intro { margin:0 0 10px; color:var(--muted); }
.dm-screen-note { margin:-4px 0 14px; color:#e2d3b2; }
.secrecy-warning { margin-top:16px; }

/* Plot Hook form */
.plot-hook-form { display:grid; gap:15px; }
.plot-hook-form .phf-field { display:grid; gap:6px; }
.plot-hook-form .phf-field > label { font-weight:700; color:var(--ink-soft); font-size:.92rem; }
.phf-created { display:flex; align-items:center; gap:11px; padding:10px 12px; border:1px solid var(--line); border-radius:13px; background:var(--chart-2); }
.phf-created .secret-person-avatar { background:#4a3620; }
.phf-created span { display:grid; line-height:1.3; }
.phf-created small { color:var(--muted); }
.hook-status-seg { display:flex; flex-wrap:wrap; gap:7px; }
.hook-status-option { position:relative; }
.hook-status-option input { position:absolute; opacity:0; pointer-events:none; }
.hook-status-option span {
  display:inline-flex; align-items:center; padding:9px 15px; border-radius:999px;
  border:1px solid var(--line-strong); background:var(--chart-2); color:var(--ink-soft);
  font-weight:700; cursor:pointer; min-height:40px; transition:background .12s, border-color .12s, color .12s;
}
.hook-status-option input:checked + span { background:var(--brass); border-color:var(--brass); color:#20140a; }
.hook-status-option input:focus-visible + span { outline:2px solid var(--lagoon); outline-offset:2px; }
.hook-person-grid { margin-top:2px; }
.plot-hook-form .secret-person-option { border-color:var(--line-strong); background:var(--chart-2); }
.plot-hook-form .secret-person-option:has(input:checked) { border-color:var(--brass); background:color-mix(in srgb, var(--brass) 16%, transparent); }
.plot-hook-form .secret-person-text b { color:var(--ink); }
.plot-hook-form .secret-person-text small { color:var(--muted); }
.plot-hook-form .secret-person-avatar { background:#4a3620; }

@media (max-width:640px) {
  .dm-screen-hero { grid-template-columns:auto 1fr; }
  .dm-screen-hero > .button,.dm-screen-hero .dm-hero-actions { grid-column:1/-1; width:100%; }
  .dm-metric-grid { grid-template-columns:1fr 1fr 1fr; gap:6px; }
  .dm-metric-grid .metric { padding:10px 6px; }
  .dm-metric-grid .value { font-size:1.3rem; }
  .dm-dossier > summary { grid-template-columns:48px minmax(0,1fr) auto; }
  .dm-dossier > summary::after { grid-column:3; grid-row:1; }
  .dm-dossier-counts { grid-column:1/-1; justify-content:flex-start; }
  .dossier-hidden-grid { grid-template-columns:1fr; }
  .dossier-connection-grid { grid-template-columns:1fr; }
  .dossier-connection-card[open] { grid-column:auto; }
  .dossier-connection-card > summary { min-height:58px; padding:9px 10px; }
  .dossier-connection-card[open] .dossier-connection-list:not(.is-aliases) { grid-template-columns:1fr; }
  .dossier-panel { padding:11px; }
  .secret-person-grid { grid-template-columns:1fr; }
}

/* v39.46 — Codex overview, backreferences, and DM briefing filters */
.codex-overview-hero {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  margin:14px 0;
  padding:18px;
  border:1px solid rgba(187,139,55,.72);
  border-radius:22px;
  background:linear-gradient(145deg,rgba(52,35,21,.98),rgba(29,21,16,.98));
  color:#f7e8c2;
  box-shadow:0 10px 26px rgba(0,0,0,.18);
}
.codex-overview-hero h2 { margin:0 0 4px; color:#fff5d7; }
.codex-overview-hero p { margin:0; color:#d9c49c; line-height:1.35; }
.codex-hero-main { min-width:0; }
.codex-glance { display:flex; flex-wrap:wrap; gap:6px 14px; margin-top:10px; color:#d9c49c; font-size:.86rem; }
.codex-glance span { white-space:nowrap; }
.codex-glance b { color:#ffe9b8; font-weight:850; }
.codex-private-section { margin:2px 0 16px; }
.codex-private-row { border-left:4px solid var(--brass); }
.codex-private-emblem { width:36px; height:36px; flex:0 0 36px; margin-right:4px; }
.codex-panel-add { margin-left:auto; white-space:nowrap; }
.codex-panel-title { display:flex; align-items:center; gap:10px; }
/* v39.53: type panels reuse the dedicated screens' lists/grids inside the
   Overview, so their spacing matches when embedded under the type chips. */
.codex-type-chips + .status-chips, .codex-type-chips + .ship-filter-group { margin-top:8px; }
.codex-global-search { margin-bottom:10px; }
.codex-type-chips { margin-bottom:14px; }
.codex-overview-metrics { margin-bottom:18px; }
.codex-metric { text-align:left; cursor:pointer; width:100%; color:inherit; font:inherit; }
.codex-dashboard-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:18px; align-items:start; }
.codex-dashboard-grid > section { min-width:0; }
.codex-overview-row .lrow-sub { white-space:normal; }
.codex-type-avatar {
  flex:0 0 42px;
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  border-radius:14px;
  border:1px solid #b39357;
  background:#ead7a8;
  color:#2b1b0e;
  font-size:.78rem;
  font-weight:950;
  letter-spacing:-.02em;
}
.codex-type-avatar.type-quest { background:#d9c8ef; border-color:#8d72b3; }
.codex-type-avatar.type-npc { background:#c9dfc3; border-color:#6e9865; }
.codex-type-avatar.type-ship { background:#c8dce3; border-color:#658b99; }
.codex-type-avatar.type-location { background:#ead2a4; border-color:#ad7d35; }
.codex-type-avatar.type-map { background:#cbd5b9; border-color:#778b59; }
.codex-type-avatar.type-pc { background:#d2d0cd; border-color:#817d77; }
.codex-type-avatar.type-player { background:#dfc6b2; border-color:#9a6745; }
.codex-type-avatar.codex-type-photo { background-size:cover; background-position:center; background-repeat:no-repeat; color:transparent; border-color:rgba(90,64,30,.5); }
.codex-link-count { min-width:30px; justify-content:center; }
.codex-health-summary { margin-top:18px; }
.codex-health-summary .board-body { display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap; }
.codex-health-summary p { margin:0; flex:1 1 260px; }
.codex-health-group { margin-top:12px; }
.codex-health-row { align-items:center; }
.codex-health-dot { width:10px; height:10px; flex:0 0 10px; border-radius:50%; background:#c78b2c; box-shadow:0 0 0 4px rgba(199,139,44,.14); }
.codex-backlink-section { margin-top:16px; }
.codex-backlink-more { margin-top:10px; }
.codex-backlink-list { margin-top:12px; }
.dm-screen-search { margin:14px 0 10px; }
.dm-mode-chips { margin-bottom:14px; }
.dm-hook-status { margin:10px 0 12px; }
.dm-hero-actions { display:flex; gap:8px; flex-wrap:wrap; justify-content:flex-end; }
.dm-screen-hero .dm-hero-actions .button { white-space:nowrap; }

@media (max-width:760px) {
  .codex-dashboard-grid { grid-template-columns:1fr; }
  .codex-overview-hero { align-items:flex-start; }
  .codex-overview-hero .button { flex:0 0 auto; }
  .dm-hero-actions { grid-column:1/-1; width:100%; }
  .dm-hero-actions .button { flex:1 1 140px; }
}
@media (max-width:480px) {
  .codex-overview-hero { padding:15px; gap:10px; }
  .codex-overview-hero p { font-size:.88rem; }
  .codex-overview-hero .button { padding-inline:14px; }
  .codex-type-avatar { flex-basis:38px; width:38px; height:38px; border-radius:12px; }
}

/* v39.47 — Codex story threads and reliable family filtering */
.family-picker-option[hidden],
.family-picker-group[hidden] { display:none !important; }
.codex-story-section { margin:4px 0 20px; }
.codex-story-list { display:grid; gap:8px; }
.codex-story-thread { align-items:center; }
.codex-thread-marker {
  flex:0 0 42px;
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  border-radius:14px;
  border:1px solid rgba(174,123,38,.72);
  background:linear-gradient(145deg,#f2dfaa,#d9b864);
  color:#2b1b0e;
  font-size:1.2rem;
  font-weight:900;
}
.codex-thread-quests {
  display:block;
  margin-top:3px;
  color:var(--ink-soft);
  font-size:.76rem;
  line-height:1.3;
  white-space:normal;
}
.codex-thread-count { min-width:30px; justify-content:center; }
.codex-supporting-grid { margin-top:8px; }
.codex-supporting-grid .codex-health-summary { margin-top:0; }
@media (max-width:480px) {
  .codex-thread-marker { flex-basis:38px; width:38px; height:38px; border-radius:12px; }
}

/* v39.48 — navigable Active story thread subview */
.codex-subview-nav {
  display:flex;
  align-items:center;
  margin:14px 0 10px;
}
.codex-subview-back { min-height:44px; }
.codex-thread-detail-hero {
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:14px;
  margin:0 0 20px;
  padding:18px;
  border:1px solid rgba(187,139,55,.72);
  border-radius:22px;
  background:linear-gradient(145deg,rgba(52,35,21,.98),rgba(29,21,16,.98));
  color:#f7e8c2;
  box-shadow:0 10px 26px rgba(0,0,0,.18);
}
.codex-thread-detail-hero h2 { margin:2px 0 4px; color:#fff5d7; }
.codex-thread-detail-hero p { margin:0; color:#d9c49c; line-height:1.35; }
.codex-thread-detail-hero .eyebrow { color:#d9b864; font-weight:850; font-size:.75rem; text-transform:uppercase; letter-spacing:.06em; }
.codex-thread-detail-section { margin:0 0 22px; }
@media (max-width:560px) {
  .codex-thread-detail-hero { grid-template-columns:auto minmax(0,1fr); padding:15px; }
  .codex-thread-detail-hero > .button { grid-column:1/-1; width:100%; }
  .codex-subview-back { width:100%; }
}

/* v40.0 — Codex All/search status parity */
.codex-overview-badges {
  display:flex;
  flex-wrap:wrap;
  gap:5px;
  margin-top:6px;
}
.codex-overview-badges .chip {
  min-height:24px;
  padding:3px 8px;
  font-size:.72rem;
  line-height:1.1;
}
.codex-overview-row-muted .codex-type-avatar,
.codex-overview-row-muted .codex-type-photo {
  filter:grayscale(1);
  opacity:.68;
}
.codex-overview-row-muted .lrow-title { opacity:.78; }
.ship-lineage-secret strong { min-height:1em; }

/* v40.0 — secret-linked Place review */
.secret-place-review {
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  gap:14px;
  align-items:start;
  padding:14px;
  border:1px solid color-mix(in srgb, var(--gold) 45%, transparent);
  border-radius:18px;
  background:color-mix(in srgb, var(--gold) 10%, var(--paper));
}
.secret-place-review-icon {
  display:grid;
  place-items:center;
  width:44px;
  height:44px;
  border-radius:14px;
  background:var(--gold);
  color:var(--ink);
  font-size:1.25rem;
  font-weight:900;
}
.secret-place-review h3 { margin:2px 0 7px; }
.secret-place-review p { margin:0; line-height:1.45; }
.secret-place-review-grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
  margin:12px 0;
}
.secret-place-review-grid > div {
  display:flex;
  flex-direction:column;
  gap:3px;
  padding:11px 12px;
  border:1px solid var(--line);
  border-radius:14px;
  background:var(--paper);
}
.secret-place-review-grid span { font-size:.75rem; opacity:.68; }
.secret-place-review-actions { flex-wrap:wrap; }

/* v40.0 — JIRRYarrHarr Ticket Desk */
.suggestion-hero {
  display:flex;
  justify-content:space-between;
  gap:14px;
  align-items:flex-start;
  padding:16px;
  border:1px solid color-mix(in srgb, var(--gold) 45%, transparent);
  border-radius:20px;
  background:linear-gradient(145deg, color-mix(in srgb, var(--gold) 14%, var(--paper)), var(--paper));
}
.suggestion-hero h3 { margin:3px 0 6px; }
.suggestion-hero p { margin:0; max-width:46ch; line-height:1.4; }
.suggestion-metrics {
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin:12px 0;
}
.suggestion-metrics span {
  padding:8px 11px;
  border:1px solid var(--line);
  border-radius:999px;
  background:var(--paper);
}
.suggestion-filter { margin-bottom:12px; }
.suggestion-ticket-row { align-items:flex-start; }
.suggestion-ticket-key {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:66px;
  min-height:34px;
  padding:5px 8px;
  border-radius:10px;
  border:1px solid color-mix(in srgb, var(--gold) 55%, var(--line));
  background:color-mix(in srgb, var(--gold) 16%, var(--paper));
  font-size:.72rem;
  font-weight:900;
  letter-spacing:.03em;
}
.suggestion-ticket-chips {
  display:flex;
  flex-wrap:wrap;
  gap:5px;
  margin-top:6px;
}
.suggestion-ticket-detail { display:grid; gap:14px; }
.suggestion-ticket-detail-head {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
}
.suggestion-ticket-facts {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:9px;
  margin:0;
}
.suggestion-ticket-facts > div {
  padding:10px 11px;
  border:1px solid var(--line);
  border-radius:13px;
  background:var(--paper);
}
.suggestion-ticket-facts dt { font-size:.72rem; opacity:.68; }
.suggestion-ticket-facts dd { margin:3px 0 0; font-weight:800; }
.suggestion-ticket-detail section h3 { margin:0 0 6px; }
.field-optional { font-size:.72rem; font-weight:500; opacity:.65; }

@media (max-width:560px) {
  .suggestion-hero { flex-direction:column; }
  .suggestion-hero .button { width:100%; }
  .suggestion-ticket-key { min-width:58px; }
  .suggestion-ticket-facts,
  .secret-place-review-grid { grid-template-columns:1fr; }
  .secret-place-review-actions .button { flex:1 1 100%; }
}


/* v40.1 — full player-character records and manual romance links */
.profile-record-overview,
.profile-romance-editor {
  border: 1px solid rgba(67,47,23,.25);
  border-radius: 14px;
  background: rgba(255,255,255,.18);
  overflow: hidden;
}
.profile-record-overview > summary,
.profile-romance-editor > summary {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:13px 14px;
  color:var(--ink);
  font-weight:900;
  cursor:pointer;
}
.profile-record-overview-body { display:grid; gap:9px; padding:0 12px 12px; }
.romance-picker-count {
  min-width:28px;
  padding:3px 8px;
  border-radius:999px;
  background:#a53263;
  color:#fff7fb;
  text-align:center;
}
.romance-picker-body { display:grid; gap:10px; padding:0 12px 12px; }
.romance-picker-search { width:100%; }
.romance-picker-list { max-height:330px; overflow-y:auto; overscroll-behavior:contain; display:grid; gap:12px; }
.romance-picker-group { display:grid; gap:5px; }
.romance-picker-group h4 { margin:0; color:var(--ink-soft); font-size:.76rem; text-transform:uppercase; letter-spacing:.04em; }
.romance-picker-option {
  display:grid;
  grid-template-columns:auto 1fr;
  align-items:center;
  gap:10px;
  min-height:48px;
  padding:8px 10px;
  border:1px solid rgba(67,47,23,.18);
  border-radius:10px;
  background:rgba(255,255,255,.25);
  cursor:pointer;
}
.romance-picker-option input { width:20px; height:20px; }
.romance-picker-option span { display:grid; gap:2px; min-width:0; }
.romance-picker-option small { color:var(--ink-soft); font-size:.72rem; }
.romance-picker-option:has(input:checked) { border-color:rgba(154,45,91,.52); background:rgba(154,45,91,.1); }
.romance-picker-option:has(input:disabled) { opacity:.72; cursor:default; }
.romance-picker-option[hidden],
.romance-picker-group[hidden] { display:none !important; }


/* v40.2 — modern ship locations and desktop profile dragging */
.ship-location-jump { color: #0d5f88; font-weight: 900; }
.ship-location-secret { color: var(--ink-soft); font-style: italic; }
.ship-crew-sheet { display: grid; gap: 16px; }
.ship-crew-summary { display: flex; align-items: center; flex-wrap: wrap; gap: 9px; padding: 10px 12px; border: 1px solid var(--line); border-radius: var(--r-m); background: var(--chart-2); }


/* v40.7 — ship command relationships */
.ship-command-links,
.holding-command-panel { display:grid; gap:8px; }
.ship-command-links { grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); }
.ship-commodore-meta { color:color-mix(in srgb, var(--lagoon) 72%, var(--ink)); font-weight:750; }
.ship-officer-secret strong { color:var(--ink-soft); font-style:italic; }
.holding-commodore-chip { border-color:color-mix(in srgb, var(--lagoon) 44%, var(--line)); background:color-mix(in srgb, var(--lagoon) 11%, rgba(255,255,255,.34)); }
.commodore-relationship-section { border-color:color-mix(in srgb, var(--lagoon) 38%, var(--line)); background:color-mix(in srgb, var(--lagoon) 7%, var(--paper)); }
.commodore-person-link { border-color:color-mix(in srgb, var(--lagoon) 34%, var(--line)); }
.dossier-connection-card.is-commodore { --dossier-accent:#227f78; --dossier-soft:#edf8f5; }
@media (max-width:640px) {
  .ship-command-links { grid-template-columns:1fr; }
}


/* v40.8 — contextual chart-marker relationships */
.marker-mentioned-in {
  width: min(100%, 780px);
  margin: 4px auto 14px;
  padding: 14px;
  border: 1px solid rgba(87, 67, 35, .24);
  border-radius: 16px;
  background: rgba(255,255,255,.24);
}
.marker-mentioned-in .profile-relationship-links {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(210px, 100%), 1fr));
  gap: 8px;
}
.marker-mention-link { min-width: 0; }
@media (max-width:520px) {
  .marker-mentioned-in { width: auto; margin-inline: 10px; padding: 12px; }
}

/* ==========================================================================
   v40.20 — Codex Connections redesign ("Chainlink")
   One flat, semantic hierarchy drawn identically everywhere: Codex profiles,
   Admin player profiles, DM dossiers, chart toolbars and marker sheets.
   Four fixed group tones replace the old per-category rainbow:
     Direct ties (brass) · In the story (lagoon) · Mentions (violet)
     · Past & fallen (slate)
   ========================================================================== */
.tone-direct    { --cxn-accent:#a4741f; --cxn-soft:color-mix(in srgb,#c08a2e 10%,var(--chart)); }
.tone-story     { --cxn-accent:#17766d; --cxn-soft:color-mix(in srgb,#1e9e97 9%,var(--chart)); }
.tone-reference { --cxn-accent:#6750a4; --cxn-soft:color-mix(in srgb,#6750a4 8%,var(--chart)); }
.tone-past      { --cxn-accent:#726b5f; --cxn-soft:color-mix(in srgb,#726b5f 8%,var(--chart)); }

.cxn-glyph { width:20px; height:20px; display:block; }
.cxn-glyph-small { width:16px; height:16px; }

/* --- Hub: one calm row while closed ------------------------------------- */
.codex-connections-wrap { min-width:0; margin-top:14px; }
.codex-connections-hub {
  min-width:0;
  border:1px solid color-mix(in srgb,var(--brass) 42%,var(--line));
  border-radius:var(--r-m);
  background:color-mix(in srgb,#fff 30%,var(--chart));
  overflow:hidden;
  box-shadow:var(--e1);
}
.codex-connections-hub > summary {
  min-height:56px;
  display:grid;
  grid-template-columns:36px minmax(0,1fr) auto 14px;
  align-items:center;
  gap:10px;
  padding:9px 12px;
  list-style:none;
  cursor:pointer;
  user-select:none;
  -webkit-tap-highlight-color:transparent;
}
.codex-connections-hub > summary::-webkit-details-marker,
.cxn-past > summary::-webkit-details-marker { display:none; }
.codex-connections-hub[open] > summary {
  border-bottom:1px solid color-mix(in srgb,var(--brass) 26%,var(--line));
  background:color-mix(in srgb,var(--brass) 7%,var(--chart));
}
.cxn-badge {
  width:36px;
  height:36px;
  display:grid;
  place-items:center;
  border-radius:11px;
  border:1px solid color-mix(in srgb,var(--brass) 55%,transparent);
  background:linear-gradient(150deg,#f4e6bd,#e9cf8e);
  color:#6d4c14;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.55);
}
.codex-connections-title { display:grid; gap:2px; min-width:0; }
.codex-connections-title b { color:var(--ink); font-size:.93rem; }
.codex-connections-title small { color:var(--muted); font-size:.71rem; line-height:1.25; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.cxn-caret {
  width:9px;
  height:9px;
  justify-self:center;
  border-right:2.4px solid #82683e;
  border-bottom:2.4px solid #82683e;
  border-radius:1px;
  transform:rotate(45deg) translateY(-2px);
  transition:transform .16s ease;
}
.codex-connections-hub[open] > summary .cxn-caret { transform:rotate(225deg) translateY(-1px); }

/* Facepile preview: real portraits/flags/art instead of abstract badges. */
.cxn-faces { display:flex; align-items:center; padding-left:8px; }
.cxn-face {
  position:relative;
  width:27px;
  height:27px;
  margin-left:-8px;
  display:grid;
  place-items:center;
  border-radius:50%;
  border:2px solid color-mix(in srgb,#fff 62%,var(--chart));
  background:#e5d8b6;
  color:#5f4a26;
  font-size:.6rem;
  font-weight:900;
  overflow:hidden;
  box-shadow:0 1px 3px rgba(43,28,12,.22);
}
.cxn-face img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block; border-radius:inherit; }
.cxn-face-more { background:#43331c; border-color:#43331c; color:#f3e4bd; font-size:.58rem; letter-spacing:.02em; }
.cxn-face.type-npc { background:#d8e7d8; color:#275a35; }
.cxn-face.type-quest { background:#dfd2f2; color:#543482; }
.cxn-face.type-ship { background:#d2e7e4; color:#17665f; }
.cxn-face.type-event { background:#f2dcce; color:#8a4a22; }
.cxn-face.type-location, .cxn-face.type-placeName { background:#efdcae; color:#79500f; }
.cxn-face.type-map, .cxn-face.type-mapPin { background:#d8e1c8; color:#4b6233; }
.cxn-face.type-locationView { background:#d7e2ea; color:#33566e; }
.cxn-face.type-player { background:#ead6c4; color:#804c2b; }
.cxn-face.type-pc { background:#ddd9d3; color:#5e554a; }
.cxn-face.type-holding { background:#eee2c2; color:#7a5a14; }

/* --- Open hub: flat groups, records visible on the first tap ------------- */
.codex-connections-body { display:grid; gap:11px; padding:11px; }
.cxn-sections { display:grid; gap:11px; min-width:0; }
.cxn-section {
  min-width:0;
  display:grid;
  gap:8px;
  padding:9px 10px 10px;
  border:1px solid color-mix(in srgb,var(--cxn-accent,#a4741f) 26%,var(--line));
  border-left:4px solid var(--cxn-accent,#a4741f);
  border-radius:12px;
  background:var(--cxn-soft,var(--chart));
}
.cxn-section-head,
.cxn-past > summary {
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:8px;
}
.cxn-section-title { display:grid; gap:1px; min-width:0; }
.cxn-section-title b { color:var(--ink); font-size:.83rem; letter-spacing:.01em; }
.cxn-section-title small { color:var(--muted); font-size:.66rem; line-height:1.25; }
.cxn-section-count {
  min-width:27px;
  height:23px;
  padding:0 8px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  box-sizing:border-box;
  border-radius:999px;
  border:1px solid color-mix(in srgb,var(--cxn-accent,#a4741f) 42%,transparent);
  background:color-mix(in srgb,var(--cxn-accent,#a4741f) 14%,#fff);
  color:color-mix(in srgb,var(--cxn-accent,#a4741f) 78%,#241a0c);
  font-size:.68rem;
  font-weight:900;
  line-height:1;
}
.cxn-cluster { display:grid; gap:6px; min-width:0; }
.cxn-cluster + .cxn-cluster { margin-top:3px; }
.cxn-cluster-head {
  display:flex;
  align-items:baseline;
  gap:6px;
  color:color-mix(in srgb,var(--cxn-accent,#a4741f) 80%,#241a0c);
  font-size:.64rem;
  font-weight:900;
  letter-spacing:.09em;
  text-transform:uppercase;
}
.cxn-cluster-head small { color:var(--faint); font-size:.64rem; font-weight:850; letter-spacing:0; }
.cxn-items { display:grid; gap:6px; min-width:0; }
.cxn-items.is-aliases { display:flex; flex-wrap:wrap; align-items:flex-start; gap:6px; }

/* Past & fallen stays folded by default so history never crowds the living. */
.cxn-past { overflow:hidden; }
.cxn-past > summary { list-style:none; cursor:pointer; user-select:none; -webkit-tap-highlight-color:transparent; min-height:34px; }
.cxn-past > summary .cxn-section-title b::after {
  content:'›';
  display:inline-block;
  margin-left:6px;
  color:var(--cxn-accent,#726b5f);
  font-weight:950;
  transform:rotate(90deg);
  transition:transform .16s ease;
}
.cxn-past[open] > summary .cxn-section-title b::after { transform:rotate(-90deg); }
.cxn-past > .cxn-section-body { margin-top:8px; }
.cxn-past .codex-connection-item { background:color-mix(in srgb,#fff 42%,var(--cxn-soft)); }

/* --- Record tiles -------------------------------------------------------- */
.codex-connection-item {
  min-width:0;
  min-height:48px;
  display:grid;
  grid-template-columns:38px minmax(0,1fr) 10px;
  align-items:center;
  gap:9px;
  padding:6px 9px;
  border:1px solid color-mix(in srgb,var(--cxn-accent,#8b795d) 22%,var(--line));
  border-radius:11px;
  background:color-mix(in srgb,#fff 58%,var(--chart));
  color:var(--ink);
  font:inherit;
  text-align:left;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
.codex-connection-item:hover {
  border-color:color-mix(in srgb,var(--cxn-accent,#8b795d) 52%,var(--line-strong));
  background:#fff;
}
.codex-connection-avatar {
  position:relative;
  width:38px;
  height:38px;
  display:grid;
  place-items:center;
  border-radius:10px;
  background:#e6dab8;
  color:#5f4a26;
  font-size:.78rem;
  font-weight:900;
}
.codex-connection-avatar.type-npc { background:#d8e7d8; color:#275a35; }
.codex-connection-avatar.type-quest { background:#dfd2f2; color:#543482; }
.codex-connection-avatar.type-ship { background:#d2e7e4; color:#17665f; }
.codex-connection-avatar.type-event { background:#f2dcce; color:#8a4a22; }
.codex-connection-avatar.type-location,
.codex-connection-avatar.type-placeName { background:#efdcae; color:#79500f; }
.codex-connection-avatar.type-map,
.codex-connection-avatar.type-mapPin { background:#d8e1c8; color:#4b6233; }
.codex-connection-avatar.type-locationView { background:#d7e2ea; color:#33566e; }
.codex-connection-avatar.type-player { background:#ead6c4; color:#804c2b; }
.codex-connection-avatar.type-pc { background:#ddd9d3; color:#5e554a; }
.codex-connection-avatar.type-holding { background:#eee2c2; color:#7a5a14; }
.codex-connection-avatar.has-image { overflow:visible; }
.codex-connection-avatar img {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  border-radius:inherit;
}
.cxn-status-dot {
  position:absolute;
  right:-3px;
  bottom:-3px;
  width:11px;
  height:11px;
  border-radius:50%;
  border:2px solid color-mix(in srgb,#fff 66%,var(--chart));
  background:#9a8f79;
}
.cxn-status-dot.is-ok { background:var(--ok); }
.cxn-status-dot.is-warn { background:var(--warn); }
.cxn-status-dot.is-danger { background:var(--danger); }
.codex-connection-copy { min-width:0; display:grid; gap:2px; }
.cxn-item-line { display:flex; align-items:center; gap:7px; min-width:0; }
.cxn-item-line b {
  color:var(--ink);
  font-size:.8rem;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  min-width:0;
}
.cxn-type-tag {
  flex:0 0 auto;
  padding:2px 6px;
  border-radius:6px;
  font-size:.55rem;
  font-weight:900;
  letter-spacing:.07em;
  text-transform:uppercase;
  background:#e6dab8;
  color:#5f4a26;
}
.cxn-type-tag.type-npc { background:#d8e7d8; color:#275a35; }
.cxn-type-tag.type-quest { background:#dfd2f2; color:#543482; }
.cxn-type-tag.type-ship { background:#d2e7e4; color:#17665f; }
.cxn-type-tag.type-event { background:#f2dcce; color:#8a4a22; }
.cxn-type-tag.type-location, .cxn-type-tag.type-placeName { background:#efdcae; color:#79500f; }
.cxn-type-tag.type-map, .cxn-type-tag.type-mapPin { background:#d8e1c8; color:#4b6233; }
.cxn-type-tag.type-locationView { background:#d7e2ea; color:#33566e; }
.cxn-type-tag.type-player { background:#ead6c4; color:#804c2b; }
.cxn-type-tag.type-pc { background:#ddd9d3; color:#5e554a; }
.cxn-type-tag.type-holding { background:#eee2c2; color:#7a5a14; }
.codex-connection-copy small { color:var(--muted); font-size:.66rem; font-weight:740; overflow-wrap:anywhere; }
.codex-connection-status-chips { display:flex; flex-wrap:wrap; gap:4px; margin-top:2px; }
.codex-connection-status-chips .chip { min-height:20px; padding:2px 7px; font-size:.58rem; }
.codex-connection-copy em { color:color-mix(in srgb,var(--cxn-accent,#6750a4) 84%,#241a0c); font-size:.65rem; font-style:normal; font-weight:850; overflow-wrap:anywhere; }
.codex-connection-excerpt { margin-top:2px; color:var(--ink-soft); font-size:.66rem; line-height:1.3; font-weight:600; }
.codex-connection-chevron { color:#8a7654; font-size:1.02rem; font-weight:950; }
.codex-connection-item.is-muted-record {
  border-style:dashed;
  background:color-mix(in srgb,#fff 30%,var(--chart));
  color:var(--muted);
}
.codex-connection-item.is-muted-record .cxn-item-line b { color:var(--muted); text-decoration:line-through; text-decoration-thickness:1px; text-decoration-color:rgba(94,85,74,.5); }
.codex-connection-item.is-muted-record .codex-connection-avatar img { filter:grayscale(1); opacity:.82; }
.codex-connection-alias {
  display:inline-flex;
  align-items:center;
  max-width:100%;
  min-height:30px;
  padding:5px 10px;
  border:1px solid color-mix(in srgb,var(--cxn-accent,#a4741f) 36%,#c8b58a);
  border-radius:999px;
  background:color-mix(in srgb,#fff 62%,var(--chart));
  color:#4d3718;
  font-size:.72rem;
  font-weight:850;
  overflow-wrap:anywhere;
}
.cxn-more {
  width:100%;
  min-height:32px;
  padding:5px 10px;
  border:1px dashed color-mix(in srgb,var(--cxn-accent,#a4741f) 44%,transparent);
  border-radius:9px;
  background:transparent;
  color:color-mix(in srgb,var(--cxn-accent,#a4741f) 82%,#241a0c);
  font:inherit;
  font-size:.71rem;
  font-weight:900;
  cursor:pointer;
}
.cxn-more:hover { background:color-mix(in srgb,var(--cxn-accent,#a4741f) 10%,transparent); }
.codex-connections-view-all {
  width:100%;
  min-height:42px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:8px 12px;
  border:1px solid var(--lagoon-deep);
  border-radius:11px;
  background:var(--lagoon-deep);
  color:#f2fbf8;
  font:inherit;
  font-size:.79rem;
  font-weight:900;
  cursor:pointer;
}
.codex-connections-view-all:hover { background:#0f4f4b; }

/* --- Explorer: search + group filters + everything ----------------------- */
.codex-connection-explorer { display:grid; gap:11px; }
.codex-connection-explorer-tools {
  display:grid;
  gap:8px;
  position:sticky;
  top:0;
  z-index:3;
  padding:2px 0 8px;
  background:linear-gradient(to bottom,var(--chart),var(--chart) 82%,transparent);
}
.codex-connection-filters { margin:0; overflow-x:auto; flex-wrap:nowrap; padding-bottom:2px; }
.codex-connection-filters .fchip { flex:0 0 auto; }
.codex-connection-explorer-groups { display:grid; gap:10px; }
.cxn-explorer-band {
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:8px;
  margin-top:4px;
  padding:2px 2px 7px;
  border-bottom:2px solid color-mix(in srgb,var(--cxn-accent,#a4741f) 46%,transparent);
}
.cxn-explorer-band:first-child { margin-top:0; }
.cxn-explorer-band .cxn-section-title b { font-size:.87rem; }
.codex-connection-explorer-group {
  display:grid;
  gap:8px;
  padding:9px 10px 10px;
  border:1px solid color-mix(in srgb,var(--cxn-accent,#6750a4) 24%,var(--line));
  border-left:4px solid var(--cxn-accent,#6750a4);
  border-radius:12px;
  background:var(--cxn-soft,var(--chart));
}
.codex-connection-explorer-heading {
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:8px;
}
.codex-connection-explorer-heading b {
  color:color-mix(in srgb,var(--cxn-accent,#6750a4) 78%,#241a0c);
  font-size:.68rem;
  font-weight:900;
  letter-spacing:.09em;
  text-transform:uppercase;
}
.codex-connection-explorer-grid { display:grid; gap:6px; min-width:0; }
.codex-connection-explorer-grid.is-aliases { display:flex; flex-wrap:wrap; align-items:flex-start; gap:6px; }
.codex-connection-no-results { text-align:center; }
.codex-connection-item[hidden],
.codex-connection-alias[hidden],
.codex-connection-explorer-group[hidden],
.cxn-explorer-band[hidden] { display:none !important; }

/* DM dossiers and Admin profiles reuse the same sections unchanged. */
.dossier-connection-grid { display:block; min-width:0; }
.dossier-character-intel .cxn-sections { gap:9px; }

/* --- Responsive ---------------------------------------------------------- */
@media (min-width:760px) {
  .cxn-items:not(.is-aliases) { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .cxn-more { grid-column:1 / -1; }
  .codex-connection-explorer-grid:not(.is-aliases) { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (min-width:1180px) {
  .codex-connection-explorer-grid:not(.is-aliases) { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .dossier-character-intel .cxn-items:not(.is-aliases) { grid-template-columns:repeat(3,minmax(0,1fr)); }
}
@media (max-width:640px) {
  .codex-connections-wrap { margin-top:11px; }
  .codex-connections-hub > summary { min-height:52px; grid-template-columns:33px minmax(0,1fr) auto 12px; gap:8px; padding:8px 10px; }
  .cxn-badge { width:33px; height:33px; border-radius:10px; }
  .cxn-glyph { width:18px; height:18px; }
  .cxn-faces .cxn-face:nth-child(n+4):not(.cxn-face-more) { display:none; }
  .cxn-face { width:25px; height:25px; margin-left:-7px; }
  .codex-connections-title b { font-size:.87rem; }
  .codex-connections-title small { font-size:.66rem; }
  .codex-connections-body { padding:8px; gap:9px; }
  .cxn-sections { gap:9px; }
  .cxn-section { padding:8px 8px 9px; }
  .codex-connection-item { min-height:46px; grid-template-columns:34px minmax(0,1fr) 9px; padding:5px 8px; gap:8px; }
  .codex-connection-avatar { width:34px; height:34px; border-radius:9px; }
  .cxn-item-line b { font-size:.77rem; }
  .cxn-type-tag { font-size:.52rem; padding:2px 5px; }
  .codex-connection-status-chips .chip { min-height:19px; padding:2px 6px; font-size:.56rem; }
  .codex-connection-explorer-tools { top:-1px; }
  .codex-connection-explorer-group { padding:8px; }
}

/* v40.12 — final Codex modernization sweep */
.map-editor-bar-actions {
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:7px;
  min-width:0;
}
.map-editor-bar-actions .map-bar-btn { position:relative; }
.map-connections-btn { position:relative; }
.map-bar-count {
  position:absolute;
  top:-5px;
  right:-5px;
  min-width:18px;
  height:18px;
  padding:0 4px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  border:1px solid rgba(255,238,190,.78);
  background:#c9902d;
  color:#1d140b;
  font:800 10px/1 system-ui,sans-serif;
  box-shadow:0 2px 7px rgba(0,0,0,.35);
}
.codex-modern-picker .codex-connection-explorer-grid {
  margin-top:12px;
}
.marker-mentioned-in.cxn-section {
  width:min(100%,780px);
  margin:4px auto 14px;
}
.marker-primary-action > span .cxn-glyph { width:19px; height:19px; }
@media (max-width:520px) {
  .map-editor-bar-actions { gap:5px; }
  .map-editor-bar-actions .map-bar-btn { width:38px; height:38px; }
  .marker-mentioned-in.cxn-section { width:auto; margin-inline:10px; }
}

/* v40.15 — only render Ship media that actually exists */
.ship-detail-gallery.is-single { grid-template-columns: minmax(0, 1fr); }

/* v40.15 — chart Location-view galleries */
.place-view-photo-widget { min-width:0; }
.place-view-photo-widget .profile-photo-carousel { padding-inline:4%; scroll-padding-inline:4%; }
.place-view-photo-widget .profile-photo-slide { flex-basis:92%; }
.place-view-photo-widget .profile-photo-slide img {
  width:100%;
  height:auto;
  max-height:min(64vh,760px);
  aspect-ratio:auto;
  object-fit:contain;
  background:#1c130d;
  border-radius:14px;
}
.place-view-swipe-hint { text-align:center; color:var(--ink-soft); font-size:.82rem; font-weight:700; }
.map-location-view-grid { padding:2px; }
.map-location-views-btn svg { fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.codex-event-row .cal-badge { flex:0 0 auto; }

/* v40.16 — marker Location-view assignments and hidden note names */
.marker-action-sheet,
.marker-link-manager { display:grid; gap:14px; }
.marker-action-head { display:flex; align-items:center; gap:12px; padding:4px 2px; }
.marker-action-head .map-list-dot { width:20px; height:20px; flex:0 0 20px; border-radius:50%; }
.marker-action-head h3 { margin:0; font-size:1.08rem; }
.marker-action-head p { margin:3px 0 0; color:var(--ink-soft); font-size:.86rem; }
.marker-hidden-name-row { display:grid; gap:7px; padding:11px 12px; border:1px solid color-mix(in srgb,var(--purple,#7254ad) 28%,var(--line)); border-radius:14px; background:color-mix(in srgb,var(--purple,#7254ad) 7%,var(--paper)); }
.marker-hidden-name-row > span { color:var(--ink-soft); font-size:.76rem; font-weight:800; text-transform:uppercase; letter-spacing:.05em; }
.marker-hidden-name-row > div { display:flex; flex-wrap:wrap; gap:6px; }
.marker-hidden-name-chip { display:inline-flex; align-items:center; min-height:28px; padding:4px 9px; border:1px solid color-mix(in srgb,var(--purple,#7254ad) 35%,var(--line)); border-radius:999px; background:var(--paper); color:var(--purple-dark,#51368a); font-weight:800; font-size:.8rem; }
.marker-menu-section { display:grid; gap:10px; padding:12px; border:1px solid var(--line); border-radius:16px; background:color-mix(in srgb,var(--paper) 92%,transparent); }
.marker-menu-section-head { display:flex; justify-content:space-between; align-items:center; }
.marker-menu-section-head span { display:grid; place-items:center; min-width:31px; height:31px; padding-inline:8px; border:1px solid var(--line); border-radius:999px; background:var(--paper-deep); font-weight:900; }
.marker-menu-photos { display:grid; grid-template-columns:repeat(auto-fit,minmax(108px,1fr)); gap:9px; }
.marker-menu-photo { min-width:0; display:grid; gap:5px; }
.marker-menu-photo img { width:100%; aspect-ratio:4/3; object-fit:cover; border:1px solid var(--line); border-radius:11px; background:#1d140d; }
.marker-menu-photo small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--ink-soft); font-weight:800; }
.marker-menu-actions { display:flex; flex-wrap:wrap; gap:9px; }
.marker-menu-actions .button { flex:1 1 160px; }
.marker-menu-empty { text-align:center; }
.marker-assignment-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:10px; }
.marker-assignment-tile { position:relative; display:grid; grid-template-columns:74px minmax(0,1fr) 30px; align-items:center; gap:10px; padding:9px; border:1px solid var(--line); border-radius:15px; background:var(--paper); cursor:pointer; box-shadow:0 2px 5px rgba(44,29,13,.07); }
.marker-assignment-tile:hover { border-color:var(--gold); }
.marker-assignment-tile input { position:absolute; opacity:0; pointer-events:none; }
.marker-assignment-thumb img { width:74px; height:58px; object-fit:cover; border-radius:10px; background:#1d140d; }
.marker-assignment-copy { min-width:0; display:grid; gap:3px; }
.marker-assignment-copy b { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.marker-assignment-copy small { color:var(--ink-soft); line-height:1.25; }
.marker-assignment-check { display:grid; place-items:center; width:28px; height:28px; border:1px solid var(--line); border-radius:50%; color:transparent; background:var(--paper-deep); font-weight:1000; }
.marker-assignment-tile:has(input:checked) { border-color:var(--teal); background:color-mix(in srgb,var(--teal) 7%,var(--paper)); }
.marker-assignment-tile:has(input:checked) .marker-assignment-check { color:white; border-color:var(--teal); background:var(--teal); }
.marker-assignment-tile.automatic { cursor:default; border-color:color-mix(in srgb,var(--gold) 50%,var(--line)); background:color-mix(in srgb,var(--gold) 8%,var(--paper)); }
.marker-assignment-tile.conflict { cursor:not-allowed; opacity:.68; }
.marker-edit-links { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:11px 12px; border:1px solid color-mix(in srgb,var(--purple,#7254ad) 24%,var(--line)); border-radius:13px; background:color-mix(in srgb,var(--purple,#7254ad) 6%,var(--paper)); }
.marker-edit-links > div { min-width:0; display:grid; gap:3px; }
.marker-edit-links small { color:var(--ink-soft); line-height:1.3; }
.marker-view-linked { display:block; margin-top:2px; color:var(--teal); font-size:.72rem; font-weight:850; }
@media (max-width:560px) {
  .marker-assignment-grid { grid-template-columns:1fr; }
  .marker-menu-photos { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .marker-edit-links { align-items:flex-start; }
}

/* v40.17 — restrained marker UX and performance polish */
.map-pin-hold-ring {
  position:absolute;
  left:50%;
  bottom:-7px;
  width:29px;
  height:29px;
  transform:translateX(-50%);
  pointer-events:none;
  opacity:0;
  z-index:-1;
}
.map-pin-hold-ring svg { width:100%; height:100%; transform:rotate(-90deg); overflow:visible; }
.map-pin-hold-ring circle {
  fill:none;
  stroke:#fff2bd;
  stroke-width:3;
  stroke-linecap:round;
  stroke-dasharray:69.2;
  stroke-dashoffset:69.2;
  filter:drop-shadow(0 1px 2px rgba(0,0,0,.75));
}
.map-pin.is-hold-pending .map-pin-hold-ring { opacity:1; }
.map-pin.is-hold-pending .map-pin-hold-ring circle { animation:marker-hold-ring var(--marker-hold-ms,600ms) linear forwards; }
@keyframes marker-hold-ring { to { stroke-dashoffset:0; } }
.map-pin.pin-context-active .map-pin-dot {
  box-shadow:0 0 0 5px rgba(255,239,176,.36),0 0 0 9px rgba(53,140,137,.28),0 2px 5px rgba(0,0,0,.7);
  transform:scale(1.12);
}
.marker-action-sheet-v4017 { gap:12px; }
.marker-action-sheet-v4017 .marker-action-head { align-items:flex-start; }
.marker-action-sheet-v4017 .marker-action-head > div { min-width:0; flex:1; }
.marker-menu-summary { display:flex; flex-wrap:wrap; gap:6px; margin-top:8px; }
.marker-menu-summary-chip {
  display:inline-flex;
  align-items:center;
  min-height:27px;
  padding:3px 9px;
  border:1px solid var(--line);
  border-radius:999px;
  background:var(--paper-deep);
  color:var(--ink-soft);
  font-size:.76rem;
  font-weight:850;
}
.marker-menu-preview { grid-template-columns:repeat(3,minmax(0,1fr)); }
.marker-menu-preview .marker-menu-photo img { aspect-ratio:16/10; }
.marker-primary-actions {
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(165px,1fr));
  gap:9px;
}
.marker-primary-action {
  min-width:0;
  display:grid;
  grid-template-columns:34px minmax(0,1fr);
  grid-template-rows:auto auto;
  column-gap:10px;
  align-items:center;
  padding:11px 12px;
  border:1px solid var(--line);
  border-radius:14px;
  background:var(--paper);
  color:var(--ink);
  text-align:left;
  box-shadow:0 2px 5px rgba(44,29,13,.07);
  cursor:pointer;
}
.marker-primary-action:hover { border-color:var(--teal); transform:translateY(-1px); }
.marker-primary-action > span {
  grid-row:1 / 3;
  display:grid;
  place-items:center;
  width:34px;
  height:34px;
  border-radius:11px;
  background:color-mix(in srgb,var(--teal) 10%,var(--paper-deep));
  color:var(--teal);
  font-size:1.05rem;
  font-weight:950;
}
.marker-primary-action b { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:.92rem; }
.marker-primary-action small { color:var(--ink-soft); line-height:1.2; }
.marker-manage-panel {
  border:1px solid color-mix(in srgb,var(--gold) 42%,var(--line));
  border-radius:14px;
  background:color-mix(in srgb,var(--gold) 5%,var(--paper));
  overflow:hidden;
}
.marker-manage-panel > summary {
  list-style:none;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:3px 12px;
  align-items:center;
  padding:11px 13px;
  cursor:pointer;
  font-weight:900;
}
.marker-manage-panel > summary::-webkit-details-marker { display:none; }
.marker-manage-panel > summary::after { content:'⌄'; grid-column:2; grid-row:1 / 3; color:var(--ink-soft); }
.marker-manage-panel[open] > summary::after { content:'⌃'; }
.marker-manage-panel > summary small { color:var(--ink-soft); font-weight:700; }
.marker-manage-body { display:grid; gap:10px; padding:0 12px 12px; }
.place-view-photo-slide img[data-lazy-src] { opacity:.18; }
.place-view-photo-slide img { transition:opacity .16s ease; }
@media (max-width:560px) {
  .marker-menu-preview { grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px; }
  .marker-menu-preview .marker-menu-photo small { font-size:.7rem; }
  .marker-primary-actions { grid-template-columns:1fr; }
}
@media (prefers-reduced-motion:reduce) {
  .map-pin.is-hold-pending .map-pin-hold-ring circle { animation:none; stroke-dashoffset:0; }
  .marker-primary-action { transition:none; }
}
.map-pin-hold-ring { z-index:1; }
.map-pin > .map-pin-dot { position:relative; z-index:2; }
.map-pin > .map-pin-label { z-index:3; }

/* v40.25 — DM quick sign-in on the player gate. (v40.28: stacked at all
   widths — the legacy .access-submit width:100% made the desktop flex row
   collapse the input to a sliver, so field-above-button everywhere now,
   matching the access gate's own layout.) */
.player-gate-dm { margin-top:14px; }
.player-gate-dm-row { display:grid; gap:2px; }
.player-gate-dm-row .access-input { min-width:0; }
.player-gate-dm-row .access-submit { margin:0; }

/* v40.27 — day-pass mistake detector pill. */
.summary-pill.dayflow-pill { border-color:color-mix(in srgb,#a4741f 45%,transparent); }
.summary-pill.dayflow-warn {
  background:color-mix(in srgb,#a33b2e 18%,var(--card,#2a2018));
  border-color:#a33b2e;
  color:#ffd9d0;
  font-weight:700;
}


/* v40.30 — Captain's Favour ------------------------------------------------ */
.captain-favour-hero {
  display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center;
  gap:var(--s4); padding:clamp(16px,4vw,24px); margin-bottom:var(--s4);
  color:var(--chart); background:linear-gradient(135deg,rgba(23,18,16,.98),rgba(59,44,29,.96));
  border:1px solid rgba(232,192,105,.45); border-radius:var(--r-l); box-shadow:var(--e2);
}
.captain-favour-hero h2 { margin:0 0 4px; color:var(--brass-bright); font-size:var(--t4); }
.captain-favour-hero p { margin:0; color:rgba(239,228,195,.82); line-height:1.45; }
.captain-favour-emblem {
  position:relative; width:58px; height:58px; display:grid; place-items:center;
  border:1px solid rgba(232,192,105,.48); border-radius:18px; background:rgba(192,138,46,.13);
}
.captain-favour-emblem svg { width:38px; height:38px; fill:none; stroke:var(--brass-bright); stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.captain-favour-emblem span { position:absolute; top:9px; color:#d35b79; font-size:.9rem; z-index:1; }
.favour-legend {
  display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:6px; margin:0 0 var(--s4);
  padding:8px; border-radius:var(--r-m); background:rgba(23,18,16,.42); border:1px solid rgba(232,192,105,.22);
}
.favour-legend > span { display:flex; align-items:center; justify-content:center; gap:5px; min-width:0; padding:7px 4px; border-radius:10px; color:var(--chart); text-align:center; }
.favour-legend b { font-size:1rem; }
.favour-legend small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.captain-favour-list { display:grid; gap:var(--s4); }
.captain-favour-row {
  padding:var(--s4); border-radius:var(--r-l); background:var(--chart); border:1px solid var(--line);
  box-shadow:var(--e1); overflow:hidden;
}
.captain-favour-person { display:flex; align-items:flex-start; justify-content:space-between; gap:var(--s3); margin-bottom:var(--s3); }
.captain-favour-name { appearance:none; border:0; background:none; padding:0; color:var(--ink); text-align:left; min-width:0; cursor:pointer; }
.captain-favour-name strong { display:block; font-size:var(--t3); line-height:1.15; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.captain-favour-name small { display:block; margin-top:3px; color:var(--muted); }
.favour-current { flex:0 0 auto; max-width:48%; padding:7px 10px; border-radius:999px; font-size:var(--t0); font-weight:800; text-align:center; border:1px solid var(--line); }
.favour-track { position:relative; display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:5px; align-items:stretch; }
.favour-track::before { content:""; position:absolute; left:8%; right:8%; top:25px; height:3px; border-radius:99px; background:linear-gradient(90deg,#a33b32,#b87725,#b99c59,#3f8268,#9b3c68); opacity:.45; }
.favour-stop {
  position:relative; min-width:0; min-height:74px; display:flex; flex-direction:column; align-items:center; justify-content:flex-end;
  gap:3px; padding:8px 2px 7px; border:1px solid transparent; border-radius:13px; background:rgba(226,210,168,.34);
  color:var(--muted); cursor:pointer; transition:transform .14s ease,border-color .14s ease,background .14s ease;
}
.favour-stop:hover,.favour-stop:focus-visible,.favour-stop.drag-target { transform:translateY(-2px); border-color:rgba(30,158,151,.55); background:rgba(30,158,151,.09); }
.favour-stop.selected { border-color:rgba(30,20,10,.28); background:rgba(255,255,255,.48); box-shadow:inset 0 0 0 1px rgba(255,255,255,.35); }
.favour-stop-icon { position:absolute; top:8px; opacity:.62; font-size:.96rem; }
.favour-stop-label { display:block; width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:clamp(.58rem,2.1vw,.78rem); font-weight:800; text-align:center; }
.favour-token {
  position:absolute; top:4px; left:50%; z-index:2; width:48px; height:48px; transform:translateX(-50%);
  display:grid; place-items:center; overflow:hidden; border-radius:50%; border:3px solid var(--chart); background:var(--chart-2);
  color:var(--ink); font-weight:900; box-shadow:0 3px 11px rgba(18,11,4,.35); cursor:grab; touch-action:none; user-select:none;
}
.favour-token img { width:100%; height:100%; object-fit:cover; pointer-events:none; }
.favour-token.is-dragging { cursor:grabbing; transform:translateX(-50%) scale(1.08); box-shadow:0 8px 20px rgba(18,11,4,.42); }
.favour-track.is-dragging .favour-stop:not(.drag-target) { opacity:.58; }
.favour-explanation { margin-top:10px; color:var(--muted); font-size:var(--t0); line-height:1.35; text-align:center; }
.favour-danger { color:#8d2f28; background-color:rgba(194,56,38,.10); }
.favour-warn { color:#8f5717; background-color:rgba(189,116,27,.11); }
.favour-neutral { color:#695a40; background-color:rgba(148,129,96,.12); }
.favour-ok { color:#236945; background-color:rgba(36,115,58,.10); }
.favour-love { color:#93365b; background-color:rgba(166,53,99,.11); }

@media (min-width:760px) {
  .captain-favour-list { grid-template-columns:repeat(2,minmax(0,1fr)); align-items:start; }
  .captain-favour-row { height:100%; }
}
@media (max-width:520px) {
  .captain-favour-hero { grid-template-columns:auto minmax(0,1fr); }
  .captain-favour-hero > .chip { grid-column:2; justify-self:start; }
  .captain-favour-emblem { width:50px; height:50px; }
  .favour-legend small { font-size:.64rem; }
  .captain-favour-row { padding:12px 9px; }
  .favour-current { max-width:52%; padding:6px 8px; }
  .favour-stop { min-height:70px; }
  .favour-token { width:44px; height:44px; }
  .favour-stop-icon { font-size:.82rem; }
}

/* v40.31 — Captain's Favour is visible to all, editable by Guy/DM/Dev only. */
.captain-favour-row.read-only .favour-stop { cursor:default; }
.captain-favour-row.read-only .favour-stop:hover,
.captain-favour-row.read-only .favour-stop:focus-visible { transform:none; border-color:transparent; background:rgba(226,210,168,.34); }
.captain-favour-row.read-only .favour-stop.selected { border-color:rgba(30,20,10,.28); background:rgba(255,255,255,.48); }
.favour-token.read-only { cursor:default; pointer-events:none; }
.favour-track.read-only .favour-stop:disabled { opacity:1; color:var(--muted); }