/* ============================================================
   Undegarth · workspace-v2.css
   ------------------------------------------------------------
   Storyline-first DM workspace: prep IS the live view, one
   capture strip, truly-staged changes, ledger close-out.

   DROP IN:  api/public/workspace-v2.css
   LOAD:     immediately before </head> in app.html, INSTEAD of
             workspace-desktop.css:
               <link rel="stylesheet" href="workspace-v2.css?v=1">

   Loaded after app.html's own <style>, so these rules win on
   equal specificity. Uses app.html's tokens only.
   ============================================================ */

@media (min-width: 900px) {
  body.ws-v2 #scr-games { max-width: 1440px; }
}
body.ws-v2 .ws-quick-bar,
body.ws-v2 .ws-mobile-seg { display: none !important; }
body.ws-v2 #campaign-workspace .workspace-shell { display: block; }
body.ws-v2 #campaign-workspace .workspace-pane { background: none; border: 0; padding: 0; }
body.ws-v2 #campaign-workspace .workspace-pane.sessions,
body.ws-v2 #campaign-workspace .workspace-pane.entities { display: none; }

.wv { display: block; min-width: 0; }
.wv-hidden { display: none !important; }

/* ---------- storyline bar ---------- */
.wv-arc {
  border: 1px solid rgba(224,190,125,.2); border-radius: 13px; overflow: hidden;
  background: linear-gradient(135deg, rgba(38,30,22,.96), rgba(25,20,15,.96));
  box-shadow: 0 10px 28px rgba(0,0,0,.18);
}
.wv-arc-main { display: flex; align-items: flex-start; gap: 22px; padding: 16px 19px; }
.wv-arc-left { min-width: 0; flex: 1; }
.wv-eyebrow {
  font-family: 'Cinzel', serif; font-weight: 700; font-size: 9px; letter-spacing: .18em;
  text-transform: uppercase; color: #938572;
}
.wv-arc-name { font-family: 'Cinzel', serif; font-weight: 700; font-size: 23px; color: #eed9a4; line-height: 1.2; }
.wv-arc-meta { display: flex; align-items: center; flex-wrap: wrap; gap: 9px; margin-top: 7px; font-size: 12.5px; color: #b1a28d; }
.wv-arc-meta .sep { color: #463d33; }
.wv-arc-stop { flex: none; width: 352px; border-left: 1px solid rgba(224,190,125,.14); padding-left: 20px; }
.wv-arc-stop p { margin: 0; font-size: 12.5px; line-height: 1.6; color: #d5cab7; }
.wv-arc-drawer { border-top: 1px solid rgba(224,190,125,.14); background: rgba(8,6,4,.32); padding: 12px 19px; }
.wv-arc-list { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 8px; }
.wv-arc-opt {
  text-align: left; min-width: 0; padding: 10px 12px; border-radius: 9px; cursor: pointer;
  border: 1px solid rgba(224,190,125,.14); background: rgba(8,6,4,.3);
  font-family: inherit; text-transform: none; letter-spacing: 0; font-size: 13px; color: #f2ece0;
}
.wv-arc-opt.on { border-color: rgba(224,190,125,.4); background: rgba(224,190,125,.14); }
.wv-arc-opt.unowned { border-color: rgba(240,145,127,.24); background: rgba(240,145,127,.07); }
.wv-arc-opt small { display: block; font-size: 11px; color: #9a8d7c; margin-top: 3px; }

/* handoff brief */
.wv-brief { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 14px; }
.wv-brief section {
  min-width: 0; padding: 12px 13px; border-radius: 10px;
  border: 1px solid rgba(224,190,125,.16); background: rgba(255,248,235,.028);
}
.wv-brief-line { display: flex; gap: 8px; font-size: 12.5px; line-height: 1.5; color: #d5cab7; }
.wv-brief-line .mark { flex: none; color: #6f6557; font-family: ui-monospace, Menlo, monospace; font-size: 11px; padding-top: 1px; }

/* ---------- one status line ---------- */
.wv-status {
  display: flex; align-items: center; gap: 16px; margin-top: 11px; padding: 10px 4px 11px;
  border-bottom: 1px solid rgba(224,190,125,.14); font-size: 12px; color: #938572;
}
.wv-save { display: flex; align-items: center; gap: 7px; color: #9fe0b6; white-space: nowrap; }
.wv-save.dirty { color: #e0be7d; }
.wv-save.err { color: #f0917f; }
.wv-save i { width: 6px; height: 6px; border-radius: 50%; background: currentColor; display: block; animation: ugPulse 2.6s ease-in-out infinite; }
@keyframes ugPulse { 0%,100% { opacity: .4; } 50% { opacity: 1; } }
.wv-status-tail { margin-left: auto; display: flex; align-items: center; gap: 12px; }

/* ---------- body ---------- */
.wv-body {
  display: grid; grid-template-columns: minmax(0,1.45fr) minmax(300px,.85fr) 296px;
  gap: 14px; align-items: start; margin-top: 14px;
}
.wv-panel {
  min-width: 0; padding: 17px 18px; border: 1px solid rgba(224,190,125,.2); border-radius: 12px;
  box-shadow: 0 8px 24px rgba(0,0,0,.16), inset 0 1px rgba(255,255,255,.018);
}
.wv-panel.run { background: #191510; }
.wv-panel.ledger { background: #1d1812; }
.wv-panel.rail { background: #211a13; position: sticky; top: 16px; }
.wv-mid { min-width: 0; display: grid; gap: 14px; }
.wv-label {
  font-family: 'Cinzel', serif; font-weight: 700; font-size: 9.5px; letter-spacing: .16em;
  text-transform: uppercase; color: #f0cc82;
}
.wv-sublabel {
  font-family: 'Cinzel', serif; font-weight: 700; font-size: 8.5px; letter-spacing: .16em;
  text-transform: uppercase; color: #a08f74;
}
.wv-sub { font-size: 11px; color: #a29480; }
.wv-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 12px; }
.wv-note-sm { margin: 0 0 12px; font-size: 11.5px; line-height: 1.5; color: #7d7161; }

/* ---------- scenes (prep IS live) ---------- */
.wv-scenes { display: grid; gap: 9px; }
.wv-scene { border: 1px solid rgba(224,190,125,.16); border-radius: 11px; background: rgba(255,248,235,.022); }
.wv-scene.now { border-color: rgba(240,145,127,.3); background: rgba(240,145,127,.05); }
.wv-scene-head { display: flex; align-items: center; gap: 11px; padding: 12px 13px; cursor: pointer; }
.wv-tick {
  flex: none; width: 22px; height: 22px; border-radius: 50%; padding: 0; cursor: pointer;
  border: 1px solid rgba(224,190,125,.24); background: transparent; color: transparent;
  font-size: 11px; display: flex; align-items: center; justify-content: center;
}
.wv-scene.done .wv-tick { border-color: rgba(159,224,182,.4); background: rgba(159,224,182,.16); color: #9fe0b6; }
.wv-scene-title { font-family: 'Cinzel', serif; font-weight: 700; font-size: 14px; color: #eed9a4; line-height: 1.3; }
.wv-scene.done .wv-scene-title { color: #a89a85; }
.wv-scene-meta { font-size: 11.5px; color: #9a8d7c; margin-top: 3px; }
.wv-chev { flex: none; color: #6f6557; font-size: 12px; font-family: ui-monospace, Menlo, monospace; }
.wv-scene-body { padding: 2px 13px 14px; }
.wv-slots { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 9px; }
.wv-slot { min-width: 0; padding: 10px 12px; border-radius: 9px; background: rgba(8,6,4,.34); border: 1px solid rgba(224,190,125,.12); }
.wv-slot textarea {
  width: 100%; display: block; resize: vertical; min-height: 54px; margin-top: 6px;
  background: transparent; border: 0; padding: 0; border-radius: 0;
  color: #e0d4c1; font-size: 13px; line-height: 1.6;
}
.wv-slot textarea:focus { outline: none; }
.wv-chips { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; margin-top: 11px; }
.wv-chip {
  display: flex; align-items: center; gap: 6px; padding: 5px 10px; border-radius: 999px; cursor: pointer;
  border: 1px solid rgba(224,190,125,.2); background: rgba(255,248,235,.035);
  font-family: inherit; text-transform: none; letter-spacing: 0; font-size: 12px; color: #e0d4c1;
}
.wv-chip:hover { border-color: rgba(224,190,125,.45); }
.wv-chip i { width: 6px; height: 6px; border-radius: 50%; display: block; background: #9fe0b6; }
.wv-chip.hot i { background: #f0917f; }
.wv-chip.quest i { background: #a8c4e4; }
.wv-chip small { color: #7d7161; font-size: 11px; }
.wv-chip.add { border-style: dashed; background: none; color: #9a8d7c; }
.wv-chip.add:hover { color: #eed9a4; }
.wv-scene-note {
  width: 100%; display: block; resize: vertical; min-height: 96px; margin-top: 11px;
  background: #100d0a; border: 1px solid rgba(224,190,125,.27); border-radius: 10px;
  padding: 13px 15px; color: #f0e7d8; font-size: 14px; line-height: 1.7;
}
.wv-scene-note:focus { outline: none; border-color: rgba(240,204,130,.62); box-shadow: 0 0 0 3px rgba(224,190,125,.07); }
.wv-dash {
  display: flex; align-items: center; gap: 9px; padding: 12px 13px; width: 100%; cursor: pointer;
  border: 1px dashed rgba(224,190,125,.3); border-radius: 11px; background: rgba(255,248,235,.025);
  font-family: inherit; letter-spacing: 0; text-transform: none; font-size: 13px; color: #b9aa94;
}
.wv-dash:hover { color: #eed9a4; border-color: rgba(224,190,125,.4); }

/* ---------- owed + staged ---------- */
.wv-rows { display: grid; gap: 8px; }
.wv-row {
  display: flex; gap: 10px; align-items: flex-start; padding: 10px 11px; border-radius: 9px;
  background: rgba(255,248,235,.03); border: 1px solid rgba(224,190,125,.13);
}
.wv-row-text { min-width: 0; flex: 1; font-size: 12.5px; line-height: 1.5; color: #f2ece0; }
.wv-row-src { font-size: 11px; color: #7d7161; margin-top: 4px; }
.wv-mini {
  flex: none; font-family: 'Cinzel', serif; font-size: 9.5px; letter-spacing: .08em; text-transform: uppercase;
  color: #9a8d7c; background: none; border: 1px solid rgba(224,190,125,.18); padding: 4px 8px; border-radius: 5px; cursor: pointer;
}
.wv-mini:hover { color: #eed9a4; border-color: rgba(224,190,125,.4); }
.wv-ev { display: flex; gap: 11px; padding: 11px 0; border-top: 1px solid rgba(224,190,125,.09); }
.wv-ev-time { flex: none; width: 36px; padding-top: 2px; font-family: ui-monospace, Menlo, monospace; font-size: 11px; color: #9a8c78; }
.wv-ev-body { flex: 1; min-width: 0; }
.wv-ev-text { font-size: 13.5px; line-height: 1.45; color: #f2ece0; }
.wv-ev-tags { display: flex; align-items: center; gap: 7px; margin-top: 6px; }
.wv-ev-tags .who { font-size: 11.5px; color: #9a8d7c; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wv-ev-vis {
  margin-left: auto; flex: none; font-size: 11px; color: #9fe0b6; background: none; border: none;
  cursor: pointer; padding: 0; font-family: inherit; letter-spacing: 0; text-transform: none;
}
.wv-ev-vis.dm { color: #6f6557; }
.wv-ev-del { flex: none; background: none; border: none; color: #463d33; cursor: pointer; padding: 0 2px; font-size: 13px; }
.wv-ev:hover .wv-ev-del { color: #f0917f; }

/* ---------- the capture strip ---------- */
.wv-actions { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 7px; }
.wv-action {
  min-width: 0; padding: 11px 6px; border-radius: 9px; cursor: pointer;
  font-family: 'Cinzel', serif; font-weight: 700; font-size: 9.5px; letter-spacing: .08em; text-transform: uppercase;
  border: 1px solid rgba(224,190,125,.24); background: rgba(255,255,255,.07); color: #ded2bf;
}
.wv-action.renown { color: #e0be7d; background: rgba(224,190,125,.1); border-color: rgba(224,190,125,.22); }
.wv-action.npc { color: #f0a992; background: rgba(240,145,127,.1); border-color: rgba(240,145,127,.22); }
.wv-action.quest { color: #a8c4e4; background: rgba(168,196,228,.1); border-color: rgba(168,196,228,.22); }
.wv-action.on { background: #ddbd7c; border-color: #ddbd7c; color: #21170d; }
.wv-form { margin-top: 13px; padding-top: 13px; border-top: 1px solid rgba(224,190,125,.14); }
.wv-form-fields { display: grid; gap: 8px; }
.wv-form-fields input, .wv-form-fields select, .wv-form-fields textarea {
  width: 100%; font-size: 13px; padding: 10px 11px; border-radius: 9px;
  background: rgba(9,7,5,.42); border: 1px solid rgba(224,190,125,.15); color: #f2ece0;
}
.wv-form-fields textarea { min-height: 92px; resize: vertical; line-height: 1.6; }
.wv-form-grid { display: grid; grid-template-columns: minmax(0,1fr) 74px; gap: 8px; }
.wv-submit {
  width: 100%; margin-top: 9px; padding: 13px 14px; border: none; border-radius: 12px; cursor: pointer;
  background: linear-gradient(135deg,#a63a28,#7c2015); color: #f7e9d7;
  box-shadow: 0 6px 20px rgba(160,53,38,.35);
  font-family: 'Cinzel', serif; font-weight: 700; font-size: 11px; letter-spacing: .08em; text-transform: uppercase;
}
.wv-submit:disabled { opacity: .45; cursor: default; }
.wv-form-note { margin: 9px 0 0; font-size: 11px; line-height: 1.5; color: #7d7161; }
.wv-seats { display: grid; gap: 6px; }
.wv-seat {
  display: flex; align-items: center; gap: 9px; padding: 8px 9px; border-radius: 8px; cursor: pointer;
  background: rgba(255,248,235,.028); border: 1px solid rgba(224,190,125,.09);
  font-family: inherit; text-transform: none; letter-spacing: 0; text-align: left;
}
.wv-seat:hover { border-color: rgba(224,190,125,.4); }
.wv-seat.awarded { background: rgba(224,190,125,.07); border-color: rgba(224,190,125,.16); }
.wv-av {
  flex: none; width: 24px; height: 24px; border-radius: 50%; background: rgba(224,190,125,.14);
  display: flex; align-items: center; justify-content: center;
  font-family: 'Cinzel', serif; font-weight: 700; font-size: 10px; color: #e0be7d;
}
.wv-seat-name { display: block; font-size: 12.5px; color: #f2ece0; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wv-seat-sub { display: block; font-size: 10.5px; color: #b0a18d; margin-top: 2px; }
.wv-seat-delta { flex: none; font-family: 'Cinzel', serif; font-weight: 700; font-size: 11px; color: #7d7161; }
.wv-seat.awarded .wv-seat-delta { color: #9fe0b6; }
.wv-divide { margin-top: 14px; padding-top: 13px; border-top: 1px solid rgba(224,190,125,.14); }

/* ---------- ledger close-out ---------- */
.wvco { display: block; }
.wvco-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; margin-bottom: 4px; }
.wvco-warn {
  display: flex; align-items: center; gap: 10px; margin: 10px 0 15px; padding: 10px 12px;
  border-radius: 10px; border: 1px solid rgba(240,145,127,.22); background: rgba(240,145,127,.06);
  font-size: 12px; line-height: 1.5; color: #d5cab7;
}
.wvco-grid { display: grid; grid-template-columns: minmax(0,1.3fr) minmax(0,1fr); gap: 16px; align-items: start; }
.wvco-col { min-width: 0; display: grid; gap: 14px; }
.wvco-card { padding: 17px 18px; border: 1px solid rgba(224,190,125,.2); border-radius: 12px; background: #1d1812; }
.wvco-card.chronicle { background: #191510; }
.wvco-card.apply { border-color: rgba(240,145,127,.26); background: #211a13; }
.wvco-card.effects { border-style: dashed; border-color: rgba(224,190,125,.26); background: rgba(255,248,235,.022); }
.wvco-title-input { width: 100%; font-size: 15px; padding: 12px 14px; border-radius: 11px; background: rgba(0,0,0,.35); border: 1px solid rgba(224,190,125,.15); color: #f2ece0; }
.wvco-chronicle {
  width: 100%; display: block; resize: vertical; min-height: 280px; margin-top: 0;
  background: #100d0a; border: 1px solid rgba(224,190,125,.27); border-radius: 10px;
  padding: 15px 17px; color: #f0e7d8; font-size: 14.5px; line-height: 1.75;
}
.wvco-summary {
  width: 100%; display: block; resize: vertical; min-height: 88px;
  background: #100d0a; border: 1px solid rgba(224,190,125,.27); border-radius: 10px;
  padding: 13px 15px; color: #f0e7d8; font-size: 13.5px; line-height: 1.65;
}
.wvco-sources { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin: 12px 0 9px; }
.wvco-source {
  display: flex; align-items: center; gap: 7px; padding: 5px 10px; border-radius: 999px; cursor: pointer;
  border: 1px solid rgba(224,190,125,.3); background: rgba(224,190,125,.09);
  font-family: inherit; text-transform: none; letter-spacing: 0; font-size: 12px; color: #e0d4c1;
}
.wvco-source.off { border-color: rgba(224,190,125,.12); background: rgba(255,248,235,.02); color: #8f826f; }
.wvco-source i { width: 6px; height: 6px; border-radius: 50%; display: block; background: #9fe0b6; }
.wvco-source.off i { background: #6f6557; }
.wvco-source small { color: #7d7161; font-size: 11px; }
.wvco-two { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 12px; margin-top: 13px; }
.wvco-tagbox { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; padding: 7px 9px; border-radius: 9px; background: rgba(9,7,5,.42); border: 1px solid rgba(224,190,125,.15); min-height: 41px; }
.wvco-tag { display: inline-block; font-size: 12px; color: #e0d4c1; background: rgba(224,190,125,.1); border: 1px solid rgba(224,190,125,.2); padding: 3px 9px; border-radius: 999px; }
.wvco-attend { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 7px; }
.wvco-person {
  display: flex; align-items: center; gap: 9px; padding: 9px 10px; border-radius: 9px; cursor: pointer;
  background: rgba(255,248,235,.028); border: 1px solid rgba(224,190,125,.09);
  font-family: inherit; text-transform: none; letter-spacing: 0; text-align: left;
}
.wvco-person.on { background: rgba(224,190,125,.07); border-color: rgba(224,190,125,.16); }
.wvco-mark {
  flex: none; width: 20px; height: 20px; border-radius: 50%; font-size: 10px;
  display: flex; align-items: center; justify-content: center;
  border: 1px solid rgba(224,190,125,.24); background: transparent; color: transparent;
}
.wvco-person.on .wvco-mark { border-color: rgba(159,224,182,.4); background: rgba(159,224,182,.16); color: #9fe0b6; }
.wvco-group { margin-bottom: 14px; }
.wvco-group-head { display: flex; align-items: center; gap: 7px; margin-bottom: 8px; }
.wvco-group-head b {
  min-width: 20px; padding: 2px 6px; border-radius: 999px; background: rgba(224,190,125,.12);
  color: #d5c29e; text-align: center; font-family: ui-monospace, Menlo, monospace; font-size: 9px;
}
.wvco-line {
  display: flex; align-items: flex-start; gap: 10px; padding: 10px 11px; border-radius: 9px;
  background: rgba(255,248,235,.035); border: 1px solid rgba(224,190,125,.16);
}
.wvco-line.off { background: rgba(255,248,235,.015); border-color: rgba(224,190,125,.08); }
.wvco-line-name { font-size: 12.5px; color: #f2ece0; font-weight: 600; }
.wvco-line.off .wvco-line-name { color: #8f826f; }
.wvco-keep {
  flex: none; cursor: pointer; padding: 5px 9px; border-radius: 5px;
  font-family: 'Cinzel', serif; font-size: 9.5px; letter-spacing: .08em; text-transform: uppercase;
  border: 1px solid #ddbd7c; background: #ddbd7c; color: #21170d;
}
.wvco-line.off .wvco-keep { border-color: rgba(224,190,125,.18); background: transparent; color: #6f6557; }
.wvco-owner { display: flex; align-items: center; gap: 8px; margin-top: 9px; }
.wvco-owner span { font-size: 11px; color: #7d7161; flex: none; }
.wvco-owner select {
  flex: 1; min-width: 0; font-size: 12px; padding: 7px 9px; border-radius: 8px;
  background: rgba(9,7,5,.42); border: 1px solid rgba(224,190,125,.15); color: #f2ece0;
}
.wvco-owner select.unowned { border-color: rgba(240,145,127,.32); color: #f0a992; }
.wvco-effects { display: grid; gap: 6px; font-size: 12.5px; line-height: 1.5; color: #c9bda8; }
.wvco-effects div { display: flex; gap: 9px; }
.wvco-effects .ok { flex: none; color: #9fe0b6; }
.wvco-publish { margin-top: 16px; }

/* ---------- 900–1279 ---------- */
@media (max-width: 1279px) and (min-width: 900px) {
  .wv-body { grid-template-columns: minmax(0,1.3fr) 300px; }
  .wv-mid { grid-column: 1 / -1; grid-template-columns: repeat(2, minmax(0,1fr)); }
  .wv-arc-stop { width: 300px; }
  .wvco-grid { grid-template-columns: minmax(0,1fr); }
}

/* ---------- < 900: one column, docked strip ---------- */
@media (max-width: 899px) {
  .wv-arc-main { display: grid; grid-template-columns: minmax(0,1fr); gap: 14px; padding: 14px; }
  .wv-arc-stop { width: auto; border-left: 0; border-top: 1px solid rgba(224,190,125,.14); padding: 14px 0 0; }
  .wv-arc-list, .wv-brief { grid-template-columns: minmax(0,1fr); }
  .wv-body { grid-template-columns: 1fr; gap: 11px; }
  .wv-panel { padding: 14px; }
  .wv-panel.rail { position: static; }
  .wv-slots, .wvco-two, .wvco-attend { grid-template-columns: minmax(0,1fr); }
  .wv-status { flex-wrap: wrap; }
  .wv-status-tail { margin-left: 0; width: 100%; }
  .wv-actions { grid-template-columns: repeat(3, minmax(0,1fr)); }
  .wvco-grid { grid-template-columns: minmax(0,1fr); }
}