/* /events — the Event editor. Uses the shared editor-screen shell (editor-screen.css .es-screen) + the
   shared ListPanel (LC). This file styles the MC workspace (recipe config + docked monster grid) and the
   RC difficulty preview. */

/* column widths: MC commands the majority; RC (difficulty preview) stays compact. */
.enc-es { --es-lc: 16.5rem; --es-mc: 1.7fr; --es-rc: minmax(20.625rem, 1fr); }

/* monster picker preview — fills the RC while a grid row is selected (replaces the envelope) */
/* RC is two stacked sections: envelope (top) + monster preview card (bottom) — each scrolls internally */
.enc-rc-top { flex: 1 1 auto; min-height: 5.625rem; overflow-y: auto; padding: var(--sp-7) var(--sp-8); }
.enc-rc-split .enc-rc-top { flex: 0 1 auto; max-height: 44%; }   /* fit the content, cap at the old share — the card below absorbs the slack (operator 2026-08-07) */
.enc-rc-bot { flex: 0 0 auto; display: flex; flex-direction: column; min-height: 0; border-top: 0.0625rem solid var(--border, #2c2519); }
.enc-rc-split .enc-rc-bot { flex: 1 1 auto; min-height: 0; }
.enc-rc-hint { color: var(--muted, #8a8069); font-style: italic; font-size: var(--fs-xs); text-align: center; padding: var(--sp-8); line-height: 1.4; }
.enc-pick { display: flex; flex-direction: column; min-height: 0; flex: 1 1 auto; }
.enc-pickbody { flex: 1 1 auto; min-height: 0; overflow-y: auto; padding: var(--sp-7) var(--sp-8); }
/* action bar pinned to the bottom of the card — mirrors the MC .es-foot Save/Delete bar */
.enc-pickactions { flex: none; display: flex; align-items: stretch; gap: var(--sp-5); padding: var(--sp-6) var(--sp-8); border-top: 0.0625rem solid var(--border, #2c2519); background: var(--panel-2, #201b12); }
.enc-pickx { flex: none; width: 2.75rem; border-radius: var(--r-lg); font-size: var(--fs-base); }  /* icon-btn (2.2) */
/* `btn btn-primary enc-pickadd` — the kit owns the fill, hover, and :disabled treatment (2.1/1.5).
   Only the size + fill-the-row deltas live here (0.15: the bespoke skin override is deleted). */
.enc-pickadd { flex: 1 1 auto; margin: 0; padding: 0.6875rem var(--sp-7); font-size: var(--fs-md); }

/* MC: the config body shares height with the docked monster grid, footer pinned below (from .es-foot). */
.enc-es .es-work-body { flex: 1 1 52%; }
.enc-griddock { flex: 1 1 48%; min-height: 0; display: flex; flex-direction: column;
  border-top: 0.0625rem solid var(--border); padding: var(--sp-6) var(--sp-8) var(--sp-7); }
.enc-griddock-h { font-family: var(--font-mono); font-size: var(--fs-2xs); font-weight: 600;
  letter-spacing: .08em; text-transform: uppercase; color: var(--gold, #c9a227); margin: 0 0 var(--sp-4); flex: none; }
.enc-griddock .dg { flex: 1 1 auto; min-height: 0; }

/* RC: difficulty preview */
.enc-rc { padding: 0; overflow: hidden; }
.enc-rc .enc-h:first-child { margin-top: 0; }

.enc-muted { color: var(--muted, #9a8f78); font-size: var(--fs-sm); }
.enc-h { font-family: var(--font-mono); font-size: var(--fs-2xs); font-weight: 600; letter-spacing: .08em;
  text-transform: uppercase; color: var(--gold, #c9a227); margin: var(--sp-9) 0 var(--sp-3); }

/* roster cards (rendered by the ListPanel's renderCard) */
.enc-shared { font-size: var(--fs-micro); text-transform: uppercase; letter-spacing: .05em; color: var(--muted, #9a8f78); border: 0.0625rem solid var(--border, #2c2519); border-radius: var(--r-sm); padding: 0.0625rem var(--sp-3); }

/* editor fields */
.enc-name { width: 100%; box-sizing: border-box; background: var(--panel-2, #201b12); border: 0.0625rem solid var(--border, #2c2519); color: var(--text, #ece3cf);
  border-radius: var(--r-lg); padding: var(--sp-5) 0.6875rem; font-size: var(--fs-md); margin-bottom: var(--sp-6); }
.enc-name:disabled { opacity: .7; }

/* Compact horizontal field bar — Pillar · Difficulty · Party levels · Weight flow across the wide MC and wrap. */
.enc-fieldbar { display: flex; flex-wrap: wrap; align-items: flex-end; gap: var(--sp-7) var(--sp-11); margin: var(--sp-7) 0 var(--sp-4); }
.enc-field { display: flex; flex-direction: column; gap: 0.3125rem; }
.enc-flbl { font-size: var(--fs-xs); color: var(--muted, #b3a98f); display: inline-flex; align-items: center; gap: var(--sp-3); }
.enc-inline { display: flex; align-items: center; gap: var(--sp-4); height: 1.875rem; }
.enc-dash { color: var(--muted, #8a8069); }
.enc-num { display: inline-block; width: 3.75rem; }
.enc-num .ui-num { width: 100%; box-sizing: border-box; }
.enc-chk { font-size: var(--fs-sm); color: var(--muted, #b3a98f); display: inline-flex; align-items: center; gap: var(--sp-3); cursor: pointer; }

/* foe recipe slots */
.enc-slots { display: flex; flex-direction: column; gap: 0.4375rem; }
.enc-slot { border: 0.0625rem solid var(--border, #2c2519); border-radius: var(--r-lg); padding: var(--sp-5) 0.5625rem; background: rgba(0,0,0,.12); cursor: pointer; transition: border-color .12s, background .12s; }
.enc-slot:hover { border-color: #4a3f2a; }
.enc-slot.on { border-color: var(--accent, #e0792c); background: rgba(var(--accent-rgb, 224,121,44), .06); }
.enc-slot-top { display: flex; align-items: center; gap: var(--sp-5); }
.enc-slot-lbl { flex: 1; min-width: 0; background: none; border: none; border-bottom: 0.0625rem dashed var(--border, #2c2519); color: var(--text, #ece3cf); font-size: var(--fs-sm); padding: var(--sp-1) 0; }
.enc-slot-lbl::placeholder { color: var(--muted, #6f6755); }
.enc-count { display: inline-flex; align-items: center; gap: var(--sp-3); font-size: var(--fs-sm); color: var(--text, #d8cdb3); }
.enc-cnum { display: inline-block; width: 3rem; }
.enc-cnum .ui-num { width: 100%; box-sizing: border-box; text-align: center; font-variant-numeric: tabular-nums; }
.enc-slot-x { width: 1.25rem; height: 1.25rem; border-radius: var(--r-sm); }  /* icon-btn (2.2) */
.enc-refs { display: flex; flex-wrap: wrap; gap: 0.3125rem; margin-top: 0.4375rem; }
.enc-refchip { display: inline-flex; align-items: center; gap: var(--sp-3); background: var(--chip-bg); border: 0.0625rem solid var(--border, #2c2519); color: var(--text, #ece3cf); border-radius: var(--r-pill); padding: var(--sp-1) var(--sp-3) var(--sp-1) var(--sp-6); font-size: var(--fs-xs); }
.enc-refchip button { width: 0.9375rem; height: 0.9375rem; border-radius: var(--r-round); border: none; background: rgba(0,0,0,.3); color: var(--muted, #b3a98f); font-size: var(--fs-2xs); line-height: 1; cursor: pointer; }
.enc-refchip button:hover { color: var(--bad-hover); }
.enc-refchip-view { cursor: pointer; }
.enc-refchip-view:hover, .enc-refchip-view:focus-visible { border-color: var(--gold, #d9b45b); color: var(--gold, #d9b45b); }
/* `btn enc-addslot` — the kit owns colour/radius/hover; the DASHED edge is the only genuine delta
   (it reads as an empty "add here" slot rather than a solid button). 0.15. */
.enc-addslot { margin-top: 0.4375rem; width: 100%; border-style: dashed; }

/* maps binding + notes */
.enc-notes { width: 100%; box-sizing: border-box; margin-top: var(--sp-8); min-height: 3.375rem; background: var(--panel-2, #201b12); border: 0.0625rem solid var(--border, #2c2519); color: var(--text, #ece3cf); border-radius: var(--r-lg); padding: 0.4375rem var(--sp-6); font-size: var(--fs-sm); resize: vertical; }

/* footer buttons: shared with the Atmospheres twin — see editor-screen.css */

/* encounter envelope (RC) */
.enc-partyctl { font-size: var(--fs-sm); color: var(--muted, #b3a98f); display: flex; align-items: center; gap: 0.3125rem; margin-bottom: var(--sp-6); flex-wrap: wrap; }
.enc-rangenote { font-size: var(--fs-2xs); color: var(--muted, #8a8069); font-style: italic; margin-left: var(--sp-1); }
.enc-result { border: 0.0625rem solid var(--border, #2c2519); border-radius: var(--r-lg); padding: 0.6875rem; background: rgba(0,0,0,.12); }

/* the floor→ceiling band scale */
.enc-scale { display: flex; gap: var(--sp-2); }
.enc-scaleseg { flex: 1; text-align: center; font-size: var(--fs-micro); font-weight: 600; text-transform: uppercase; letter-spacing: .03em;
  padding: var(--sp-4) var(--sp-1); border-radius: var(--r-sm); border: 0.0625rem solid transparent; color: var(--muted, #6f6755); background: rgba(255,255,255,.02); }
.enc-scaleseg.in { font-weight: 700; }

/* floor / ceiling endpoints */
.enc-endpts { display: flex; flex-direction: column; gap: var(--sp-5); margin-top: 0.6875rem; }
.enc-endpt { display: flex; flex-direction: column; gap: var(--sp-1); }
.enc-endhd { display: flex; justify-content: space-between; align-items: baseline; gap: var(--sp-5); }
.enc-endlbl { font-size: var(--fs-2xs); text-transform: uppercase; letter-spacing: .05em; color: var(--muted, #8a8069); }
.enc-endband { font-size: var(--fs-sm); font-weight: 700; text-transform: capitalize; }
.enc-endroster { font-size: var(--fs-xs); color: var(--text, #d8cdb3); line-height: 1.35; }

/* per-level sweep */
.enc-sweeph { font-size: var(--fs-2xs); text-transform: uppercase; letter-spacing: .05em; color: var(--muted, #8a8069); margin: var(--sp-8) 0 var(--sp-4); }
.enc-sweep { display: flex; flex-direction: column; gap: var(--sp-2); }
.enc-swrow { display: flex; align-items: center; gap: var(--sp-5); padding: 0.0625rem var(--sp-3); border-radius: var(--r-sm); }
.enc-swrow.on { background: rgba(var(--accent-rgb, 224,121,44), .1); }
.enc-swlvl { flex: none; width: 1.625rem; font-size: var(--fs-2xs); color: var(--muted, #9a8f78); font-variant-numeric: tabular-nums; }
.enc-swbar { flex: 1 1 auto; display: flex; gap: var(--sp-1); min-width: 0; }
.enc-swseg { flex: 1; height: 0.5625rem; border-radius: var(--r-xs); background: rgba(255,255,255,.05); }
.enc-swband { flex: none; width: 4.875rem; text-align: right; font-size: var(--fs-2xs); color: var(--text, #b3a98f); font-variant-numeric: tabular-nums; }