:root {
  --paper: #f4e6c8;
  --ink: #2a1810;
  --gold: #c9a227;
  --muted: #c4b08a;
  --panel: rgba(16, 9, 5, 0.78);
}
* { box-sizing: border-box; }
[hidden] { display: none !important; }
html, body { height: 100%; margin: 0; }
body {
  color: var(--paper);
  font-family: "Songti SC", "Noto Serif SC", "Source Han Serif SC", serif;
  background: #120c08;
  overflow: hidden;
}
#viewport { position: fixed; inset: 0; z-index: 0; }
#hud { position: relative; z-index: 2; pointer-events: none; height: 100%; }
#hud > * { pointer-events: auto; }

header {
  position: absolute;
  top: 0.7rem; left: 1rem; right: 1rem;
  display: flex; justify-content: space-between; align-items: center;
}
.brand { display: flex; gap: 0.75rem; align-items: center; }
.seal {
  width: 48px; height: 48px; object-fit: cover; object-position: 50% 12%;
  border: 1px solid var(--gold);
}
h1 { margin: 0; font-size: 1.35rem; letter-spacing: 0.28em; text-shadow: 0 2px 12px #000; }
.sub { color: var(--gold); margin: 0.12rem 0 0; font-size: 0.8rem; }
.era-col { display: flex; align-items: center; gap: 0.7rem; }
.era { font-size: 1.55rem; color: var(--gold); text-shadow: 0 2px 16px #000; }
.audio-toggle[aria-pressed="false"] { color: #a89470; border-color: rgba(164, 132, 72, 0.34); }
button {
  appearance: none;
  color: var(--paper);
  border: 0;
  border-radius: 0;
  padding: 0.42rem 1.4rem;
  font: inherit;
  line-height: 1.2;
  letter-spacing: 0.12em;
  cursor: pointer;
  background: transparent;
  min-width: 7.6rem;
  text-shadow: none;
  filter: none;
  transition: color 120ms ease, border-color 120ms ease, background 120ms ease, box-shadow 120ms ease, transform 80ms ease;
}
button:hover { filter: none; }
button:active { transform: translateY(1px); }
button:focus-visible {
  outline: 2px solid rgba(244, 205, 102, 0.92);
  outline-offset: 2px;
}
button:disabled,
button:disabled:hover {
  opacity: 0.52;
  cursor: not-allowed;
  transform: none;
  filter: none;
}
button.primary-action {
  display: inline-flex;
  min-height: 2rem;
  align-items: center;
  justify-content: center;
  color: #f8e9c8;
  border: 1px solid rgba(210, 169, 62, 0.82);
  background:
    linear-gradient(90deg, rgba(255, 238, 188, 0.06), transparent 20%, transparent 80%, rgba(18, 4, 2, 0.2)),
    linear-gradient(180deg, #7b3025 0%, #5d201a 48%, #40130f 100%);
  box-shadow:
    inset 0 0 0 1px rgba(49, 13, 8, 0.88),
    inset 0 1px 0 rgba(255, 224, 151, 0.2),
    0 2px 7px rgba(0, 0, 0, 0.34);
  text-shadow: 0 1px 3px #190604;
}
button.primary-action:hover {
  color: #fff1c9;
  border-color: #e0bd58;
  background:
    linear-gradient(90deg, rgba(255, 238, 188, 0.09), transparent 20%, transparent 80%, rgba(18, 4, 2, 0.16)),
    linear-gradient(180deg, #8c392b 0%, #6b271f 48%, #491711 100%);
  box-shadow:
    inset 0 0 0 1px rgba(49, 13, 8, 0.88),
    inset 0 1px 0 rgba(255, 224, 151, 0.28),
    0 3px 10px rgba(0, 0, 0, 0.4);
}
button.ghost {
  display: inline-flex;
  min-height: 1.9rem;
  align-items: center;
  justify-content: center;
  color: #e5d2aa;
  background: linear-gradient(180deg, rgba(55, 35, 20, 0.58), rgba(24, 14, 8, 0.78));
  border: 1px solid rgba(201, 162, 39, 0.48);
  box-shadow: inset 0 0 0 1px rgba(12, 7, 4, 0.45);
  min-width: auto;
  padding: 0.25rem 0.7rem;
  letter-spacing: 0.12em;
  font-size: 0.8rem;
}
button.ghost:hover {
  color: #ffe6aa;
  border-color: rgba(224, 188, 82, 0.76);
  background: linear-gradient(180deg, rgba(79, 50, 27, 0.68), rgba(33, 19, 10, 0.86));
}

.crisis {
  position: absolute;
  top: 8.55rem; left: 1rem;
  margin: 0;
  color: #e0b070;
  font-size: 0.8rem;
  text-shadow: 0 1px 8px #000;
  max-width: min(44rem, calc(100% - 25rem));
}
.crisis.hot { color: #ffb089; }
.ledger-strip {
  position: absolute;
  top: 9.62rem;
  left: 1rem;
  max-width: min(51rem, calc(100% - 25rem));
  margin: 0;
  padding: 0.2rem 0.45rem;
  color: #d8c49a;
  border-left: 2px solid rgba(201, 162, 39, 0.56);
  background: rgba(16, 9, 5, 0.58);
  font-size: 0.68rem;
  font-variant-numeric: tabular-nums;
  text-shadow: 0 1px 6px #000;
}

.stats {
  position: absolute;
  top: 4.7rem; left: 1rem;
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  width: min(44rem, calc(100% - 25rem));
  gap: 0.4rem;
}
.stats article {
  background: var(--panel);
  border: 1px solid rgba(201, 162, 39, 0.4);
  padding: 0.4rem 0.5rem 0.45rem;
  backdrop-filter: blur(7px);
}
.stats label { display: block; color: var(--muted); font-size: 0.72rem; }
.stats strong { font-size: 1.15rem; margin-right: 0.15rem; }
.stats span { color: #d8c49a; font-size: 0.7rem; white-space: nowrap; }

.court, .inspect {
  position: absolute;
  right: 1rem;
  width: 272px;
  background: var(--panel);
  border: 1px solid rgba(201, 162, 39, 0.35);
  padding: 0.55rem 0.7rem 0.65rem;
  backdrop-filter: blur(8px);
}
.court, .inspect, .dossier,
header, .stats, .crisis, .ledger-strip, .dock {
  transition: opacity 160ms ease, transform 160ms ease;
}
body.map-focus #hud > header,
body.map-focus #hud > .stats,
body.map-focus #hud > .crisis,
body.map-focus #hud > .ledger-strip,
body.map-focus #hud > .court,
body.map-focus #hud > .inspect,
body.map-focus #hud > .dossier,
body.map-focus #hud > .dock {
  opacity: 0;
  pointer-events: none;
}
body.map-focus #hud > .court,
body.map-focus #hud > .inspect,
body.map-focus #hud > .dossier {
  transform: translateX(1rem);
}
body.map-focus #hud > header,
body.map-focus #hud > .stats,
body.map-focus #hud > .crisis,
body.map-focus #hud > .ledger-strip {
  transform: translateY(-0.6rem);
}
body.map-focus #hud > .dock {
  transform: translateY(0.6rem);
}
.court { top: 4.7rem; width: 360px; max-height: calc(100% - 9rem); overflow: auto; scrollbar-color: #7b5b2e rgba(20, 12, 7, 0.35); }
.inspect {
  left: 1rem;
  right: auto;
  top: 15rem;
  bottom: auto;
  width: 16.5rem;
}
button.slim {
  min-width: auto;
  padding: 0.2rem 0.7rem;
  letter-spacing: 0.12em;
  font-size: 0.78rem;
}
.inspect button.slim { margin-top: 0.45rem; }
.inspect-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  margin-top: 0.5rem;
}
.inspect-actions button.slim { margin-top: 0; }

h2 {
  font-size: 0.78rem;
  letter-spacing: 0.32em;
  color: var(--gold);
  border-bottom: 1px solid #5c432c;
  padding-bottom: 0.22rem;
  margin: 0.15rem 0 0.4rem;
}
aside ul { list-style: none; padding: 0; margin: 0 0 0.65rem; }
.person, .task {
  display: grid;
  grid-template-columns: 42px 1fr;
  gap: 0.45rem;
  padding: 0.35rem 0;
  border-bottom: 1px dashed #5c432c;
  align-items: center;
  cursor: pointer;
}
.person:hover, .task:hover { background: rgba(201, 162, 39, 0.12); }
.person.dead { opacity: 0.42; filter: grayscale(0.8); }
.task {
  display: block;
  font-size: 0.82rem;
  line-height: 1.4;
  color: var(--paper);
}
.person img {
  width: 42px; height: 42px; object-fit: cover; object-position: 50% 10%;
  border: 1px solid #8a6a32;
}
.person small { color: var(--muted); display: block; font-size: 0.75rem; }
.person.sel { background: rgba(201, 162, 39, 0.18); }

.court-title {
  display: grid;
  grid-template-columns: 44px 1fr;
  gap: 0.55rem;
  align-items: center;
  margin-bottom: 0.55rem;
}
.court-title h2 { margin: 0; border: 0; }
.court-title p { margin: 0.14rem 0 0; color: var(--muted); font-size: 0.68rem; line-height: 1.45; }
.court-seal {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border: 1px solid #9b6a37;
  box-shadow: inset 0 0 0 3px rgba(48, 22, 10, 0.88);
  background: radial-gradient(circle, rgba(154, 87, 42, 0.34), rgba(28, 13, 7, 0.9));
  color: #edc780;
  font-size: 1.05rem;
}
.politics-summary {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0.28rem;
  margin-bottom: 0.5rem;
}
.politics-metric {
  min-width: 0;
  padding: 0.28rem 0.22rem;
  text-align: center;
  border: 1px solid rgba(201, 162, 39, 0.24);
  background: rgba(201, 162, 39, 0.06);
}
.politics-metric span { display: block; color: var(--muted); font-size: 0.58rem; white-space: nowrap; }
.politics-metric strong { display: block; margin-top: 0.08rem; color: #dfca98; font-size: 0.72rem; font-variant-numeric: tabular-nums; }
.politics-metric.bad { border-color: rgba(194, 82, 55, 0.58); background: rgba(149, 46, 28, 0.12); }
.politics-metric.bad strong { color: #efaa8f; }
.politics-summary > p {
  grid-column: 1 / -1;
  margin: 0;
  padding: 0.28rem 0.38rem;
  border-left: 2px solid rgba(201, 162, 39, 0.46);
  color: #bda986;
  background: rgba(7, 4, 2, 0.26);
  font-size: 0.64rem;
  line-height: 1.4;
}
.court-factions-panel {
  margin: 0 0 0.4rem;
  border: 1px solid rgba(201, 162, 39, 0.18);
  background: rgba(7, 4, 2, 0.22);
}
.court-factions-panel > summary {
  cursor: pointer;
  padding: 0.26rem 0.4rem;
  color: #c4ae82;
  font-size: 0.64rem;
  letter-spacing: 0.16em;
}
.court-factions { display: grid; grid-template-columns: 1fr 1fr; gap: 0.24rem; padding: 0.26rem 0.34rem 0.38rem; }
.faction-chip {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 0.25rem;
  padding: 0.25rem 0.3rem;
  color: #cdb98f;
  background: rgba(201, 162, 39, 0.05);
  border: 1px solid rgba(201, 162, 39, 0.18);
  filter: none;
  letter-spacing: 0;
  text-shadow: none;
  text-align: left;
}
.faction-chip span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 0.58rem; }
.faction-chip strong { color: #d9c082; font-size: 0.56rem; }
.faction-chip em { color: #b87965; font-size: 0.56rem; font-style: normal; }
.faction-chip:hover,
.faction-chip.selected { color: #ffe19a; border-color: rgba(222, 182, 73, 0.58); background: rgba(201, 162, 39, 0.14); filter: none; }
.person.faction-muted { opacity: 0.28; filter: grayscale(0.65); }
.campaign-objectives {
  margin: 0 0 0.55rem;
  border: 1px solid rgba(201, 162, 39, 0.18);
  background: rgba(7, 4, 2, 0.22);
}
.campaign-objectives > summary {
  cursor: pointer;
  padding: 0.26rem 0.4rem;
  color: var(--gold);
  font-size: 0.68rem;
  letter-spacing: 0.18em;
}
.campaign-objectives .objectives { padding: 0.25rem 0.4rem 0.38rem; margin: 0; }
.court-tree { display: grid; gap: 0.32rem; margin-bottom: 0.65rem; }
.court-branch {
  margin: 0;
  border-left: 1px solid rgba(201, 162, 39, 0.32);
  background: rgba(7, 4, 2, 0.2);
}
.court-branch.depth-1 { margin-left: 0.42rem; }
.court-branch.depth-2 { margin-left: 0.32rem; }
.court-branch > summary {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 0.45rem;
  padding: 0.32rem 0.42rem;
  cursor: pointer;
  color: #e3cd9d;
  border-bottom: 1px solid rgba(201, 162, 39, 0.16);
  font-size: 0.74rem;
  letter-spacing: 0.12em;
}
.court-branch > summary::marker { color: #9b783c; }
.court-branch > summary small { color: #9e8b6d; font-size: 0.58rem; letter-spacing: 0; }
.court-branch-children {
  display: grid;
  gap: 0.24rem;
  margin: 0.24rem 0 0.32rem 0.46rem;
  padding-left: 0.46rem;
  border-left: 1px solid rgba(201, 162, 39, 0.22);
}
.court-branch-children.root-children { margin-top: 0.36rem; }
.office-node.person {
  width: 100%;
  min-width: 0;
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 0.45rem;
  align-items: center;
  padding: 0.3rem 0.36rem;
  text-align: left;
  color: var(--paper);
  background: rgba(24, 14, 8, 0.72);
  border: 1px solid rgba(201, 162, 39, 0.2);
  border-left: 2px solid #806137;
  filter: none;
  letter-spacing: 0;
  text-shadow: none;
}
.office-node.person:hover,
.office-node.person.sel { background: rgba(201, 162, 39, 0.13); border-color: rgba(220, 181, 74, 0.58); filter: none; }
.office-node.person.throne { border-color: rgba(214, 173, 57, 0.52); background: linear-gradient(90deg, rgba(118, 65, 27, 0.34), rgba(18, 10, 6, 0.72)); }
.office-node.person.vacant { border-left-color: #704039; color: #aa9271; border-style: dashed; }
.office-node.person.under-review { border-left-color: #b6523d; background: rgba(110, 31, 20, 0.16); }
.court-avatar,
.candidate-avatar {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  object-fit: cover;
  object-position: 50% 12%;
  border: 1px solid #846437;
  border-radius: 50%;
  color: #e7c98c;
  background: radial-gradient(circle at 35% 30%, #79502d, #21120a 72%);
  font-size: 0.82rem;
}
.office-node .court-avatar { width: 34px; height: 34px; border-radius: 50%; }
.court-avatar.monogram,
.candidate-avatar.monogram { font-style: normal; }
.office-copy { min-width: 0; display: grid; gap: 0.05rem; }
.office-copy small { color: #a89574; font-size: 0.57rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.office-copy strong { font-size: 0.82rem; letter-spacing: 0.08em; }
.office-copy em { color: #bfa980; font-size: 0.6rem; font-style: normal; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.office-node.under-review .office-copy em { color: #ef9b7f; }
.court-candidates {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.28rem;
  margin-bottom: 0.65rem;
}
.candidate-card.person {
  min-width: 0;
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  gap: 0.35rem;
  align-items: center;
  padding: 0.28rem;
  color: #dfcca2;
  background: rgba(10, 6, 3, 0.38);
  border: 1px solid rgba(201, 162, 39, 0.18);
  filter: none;
  letter-spacing: 0;
  text-align: left;
}
.candidate-card.person:hover,
.candidate-card.person.sel { background: rgba(201, 162, 39, 0.12); border-color: rgba(201, 162, 39, 0.5); filter: none; }
.candidate-card .candidate-avatar { width: 28px; height: 28px; font-size: 0.7rem; }
.candidate-card > span:last-child { min-width: 0; display: grid; }
.candidate-card strong { font-size: 0.74rem; letter-spacing: 0.08em; }
.candidate-card small { color: #a18c6c; font-size: 0.54rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.dossier {
  position: absolute;
  left: 18.2rem;
  top: 4.7rem;
  width: 22.5rem;
  max-height: calc(100% - 8rem);
  overflow: auto;
  z-index: 6;
  background: var(--panel);
  border: 1px solid rgba(201, 162, 39, 0.5);
  padding: 0.65rem 0.8rem 0.8rem;
  backdrop-filter: blur(10px);
}
.dossier-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 0.5rem;
}
.dossier-head h2 { margin: 0; border: 0; padding: 0; }
.dossier-hero {
  display: grid;
  grid-template-columns: 96px 1fr;
  gap: 0.7rem;
  margin: 0.55rem 0 0.5rem;
  align-items: center;
}
.dossier-hero img {
  width: 96px; height: 118px;
  object-fit: cover; object-position: 50% 12%;
  border: 1px solid var(--gold);
}
.dossier-monogram {
  display: grid;
  place-items: center;
  width: 96px;
  height: 118px;
  border: 1px solid var(--gold);
  box-shadow: inset 0 0 0 5px rgba(48, 23, 11, 0.74);
  background: radial-gradient(circle at 36% 28%, #80532d, #21120a 70%);
  color: #efd59b;
  font-size: 2.2rem;
}
.dossier-hero h3 {
  margin: 0 0 0.2rem;
  font-size: 1.25rem;
  letter-spacing: 0.18em;
}
.dossier-role, .dossier-status, .dossier-bio, .dossier-advice {
  margin: 0;
  color: var(--muted);
  font-size: 0.84rem;
  line-height: 1.55;
}
.dossier-status { color: var(--gold); margin-top: 0.2rem; }
.dossier-bio { margin: 0.35rem 0 0.45rem; color: var(--paper); }
.dossier-scale { margin: 0.32rem 0 0; color: #8f7c60; font-size: 0.62rem; line-height: 1.4; }
.dossier-meta {
  display: grid;
  grid-template-columns: 3.2rem 1fr;
  gap: 0.18rem 0.4rem;
  margin: 0.45rem 0 0.55rem;
  font-size: 0.82rem;
}
.dossier-meta dt { color: var(--muted); }
.dossier-meta dd { margin: 0; }
.dossier-advice {
  border-top: 1px dashed #5c432c;
  padding-top: 0.4rem;
  color: var(--paper);
}
.dossier-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.4rem;
  margin-top: 0.55rem;
}
.dossier-actions button {
  width: 100%;
  min-width: 0;
  min-height: 2.15rem;
  padding: 0.3rem 0.55rem;
  letter-spacing: 0.1em;
  font-size: 0.82rem;
  white-space: nowrap;
}
.dossier-actions button:last-child:nth-child(odd) { grid-column: 1 / -1; }

.dock {
  position: absolute;
  left: 1rem;
  right: 25rem;
  bottom: 0.55rem;
  display: grid;
  gap: 0.35rem;
  max-width: none;
  z-index: 5;
}
.dock.collapsed {
  right: auto;
  width: min(23rem, calc(100% - 2rem));
}
.dock-bar {
  min-height: 2.5rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.7rem;
  padding: 0.3rem 0.4rem 0.3rem 0.72rem;
  background: linear-gradient(90deg, rgba(25, 14, 8, 0.94), rgba(39, 25, 13, 0.9));
  border: 1px solid rgba(201, 162, 39, 0.48);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.34);
  backdrop-filter: blur(9px);
}
.dock-bar-copy {
  min-width: 0;
  display: flex;
  align-items: baseline;
  gap: 0.55rem;
  white-space: nowrap;
}
.dock-bar-copy span {
  color: var(--gold);
  font-size: 0.68rem;
  letter-spacing: 0.18em;
}
.dock-bar-copy strong {
  color: #ead8b4;
  font-size: 0.8rem;
  letter-spacing: 0.12em;
}
.dock-bar-copy small {
  min-width: 0;
  overflow: hidden;
  color: #9f8c6a;
  font-size: 0.62rem;
  text-overflow: ellipsis;
}
#dock-toggle {
  min-width: auto;
  flex: 0 0 auto;
  padding: 0.3rem 0.68rem;
  color: #f0d99d;
  background: rgba(201, 162, 39, 0.09);
  border: 1px solid rgba(201, 162, 39, 0.48);
  filter: none;
  text-shadow: none;
  font-size: 0.68rem;
  letter-spacing: 0.08em;
}
#dock-toggle:hover { background: rgba(201, 162, 39, 0.2); filter: none; }
.dock-content {
  display: grid;
  gap: 0.35rem;
}
.dock.collapsed .dock-content { display: none; }
.edict, .document-dock {
  background: var(--panel);
  border: 1px solid rgba(201, 162, 39, 0.35);
  backdrop-filter: blur(8px);
}
.edict { padding: 0.4rem 0.7rem 0.5rem; }
.edict textarea {
  width: 100%;
  background: url("/static/assets/paper.jpg") center/cover no-repeat;
  color: var(--ink);
  border: 1px solid #c9a227;
  padding: 0.4rem 0.65rem;
  font: inherit;
  font-size: 0.95rem;
  min-height: 2.6rem;
  max-height: 3.4rem;
  resize: none;
}
.row { display: flex; align-items: center; gap: 0.85rem; margin-top: 0.35rem; }
#hint { color: var(--muted); font-size: 0.78rem; }
.turn-feedback {
  margin-top: 0.42rem;
  padding: 0.48rem 0.62rem 0.52rem;
  border: 1px solid rgba(201, 162, 39, 0.4);
  border-left: 3px solid #c9a227;
  background:
    linear-gradient(90deg, rgba(201, 162, 39, 0.08), transparent 42%),
    rgba(11, 7, 4, 0.8);
  box-shadow: inset 0 1px 0 rgba(255, 235, 174, 0.04);
  animation: feedback-arrive 180ms ease-out;
}
.turn-feedback[data-tone="success"] { border-left-color: #9ca45f; }
.turn-feedback[data-tone="warning"] { border-left-color: #d58d43; }
.turn-feedback[data-tone="danger"] { border-left-color: #bb533d; }
.turn-feedback[data-tone="info"] { border-left-color: #78938d; }
.turn-feedback.loading {
  border-left-color: #c9a227;
  background:
    linear-gradient(100deg, transparent 10%, rgba(224, 190, 96, 0.12) 34%, transparent 58%) 0 0 / 220% 100%,
    rgba(11, 7, 4, 0.82);
  animation: feedback-thinking 1.6s linear infinite;
}
.turn-feedback-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.65rem;
}
.turn-feedback-head > div {
  min-width: 0;
  display: flex;
  align-items: baseline;
  gap: 0.55rem;
}
#feedback-kicker {
  color: var(--gold);
  font-size: 0.62rem;
  letter-spacing: 0.16em;
  white-space: nowrap;
}
#feedback-title {
  color: #f0dfba;
  font-size: 0.86rem;
  letter-spacing: 0.08em;
}
button.feedback-close {
  min-width: 1.45rem;
  width: 1.45rem;
  height: 1.45rem;
  padding: 0;
  color: #a99570;
  border: 1px solid rgba(201, 162, 39, 0.24);
  font-family: system-ui, sans-serif;
  font-size: 1rem;
  line-height: 1;
}
button.feedback-close:hover { color: #f0d99d; border-color: rgba(201, 162, 39, 0.56); }
.feedback-summary {
  margin: 0.25rem 0 0;
  color: #d9c8a7;
  font-size: 0.74rem;
  line-height: 1.45;
}
.feedback-meta,
.feedback-changes {
  display: flex;
  align-items: stretch;
  flex-wrap: wrap;
  gap: 0.28rem;
  margin-top: 0.34rem;
}
.feedback-chip {
  padding: 0.15rem 0.38rem;
  color: #ad9a77;
  border: 1px solid rgba(201, 162, 39, 0.22);
  background: rgba(201, 162, 39, 0.04);
  font-size: 0.61rem;
}
.feedback-chip.important { color: #e3bd66; border-color: rgba(213, 141, 67, 0.55); }
.feedback-change {
  display: grid;
  grid-template-columns: auto auto;
  gap: 0.05rem 0.36rem;
  min-width: 7.2rem;
  padding: 0.24rem 0.42rem;
  border: 1px solid rgba(201, 162, 39, 0.22);
  background: rgba(34, 22, 12, 0.72);
  font-variant-numeric: tabular-nums;
}
.feedback-change span { color: #a99572; font-size: 0.59rem; }
.feedback-change strong { grid-row: 1 / 3; grid-column: 2; align-self: center; color: #d8c49b; font-size: 0.7rem; }
.feedback-change.good strong { color: #b8c77c; }
.feedback-change.bad strong { color: #e29376; }
.feedback-change small { color: #766a55; font-size: 0.55rem; }
.feedback-details {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.28rem;
  margin-top: 0.34rem;
}
.feedback-detail {
  min-width: 0;
  padding: 0.28rem 0.4rem;
  border-left: 2px solid rgba(156, 164, 95, 0.62);
  background: rgba(27, 18, 10, 0.48);
  color: #bbaa8b;
  font-size: 0.61rem;
  line-height: 1.35;
}
.feedback-detail.rejected { border-left-color: rgba(187, 83, 61, 0.78); }
.feedback-detail strong { display: block; margin-bottom: 0.08rem; color: #dcca9f; font-size: 0.64rem; }
.feedback-next {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem 0.8rem;
  margin: 0.34rem 0 0;
  padding: 0;
  list-style-position: inside;
  color: #9f8d6c;
  font-size: 0.61rem;
}
.feedback-next li { max-width: 28rem; }
.feedback-actions { display: flex; gap: 0.35rem; margin-top: 0.38rem; }
.feedback-actions button { min-width: auto; padding: 0.26rem 0.62rem; font-size: 0.68rem; }
.interaction-feedback {
  position: absolute;
  top: 10.8rem;
  left: 1rem;
  z-index: 8;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 0.18rem 0.55rem;
  max-width: 35rem;
  padding: 0.4rem 0.6rem;
  color: #d9c7a3;
  border: 1px solid rgba(201, 162, 39, 0.42);
  border-left: 3px solid #c9a227;
  background: rgba(15, 9, 5, 0.88);
  box-shadow: 0 5px 18px rgba(0, 0, 0, 0.42);
  backdrop-filter: blur(7px);
  pointer-events: none;
  animation: feedback-arrive 160ms ease-out;
}
.interaction-feedback strong { color: #eddaae; font-size: 0.7rem; letter-spacing: 0.08em; }
.interaction-feedback span { color: #9f8d6c; font-size: 0.66rem; }
.interaction-feedback[data-tone="success"] { border-left-color: #9ca45f; }
.interaction-feedback[data-tone="warning"] { border-left-color: #d58d43; }
.interaction-feedback[data-tone="danger"] { border-left-color: #bb533d; }
@keyframes feedback-arrive {
  from { opacity: 0; transform: translateY(5px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes feedback-thinking {
  from { background-position: 100% 0, 0 0; }
  to { background-position: -120% 0, 0 0; }
}
.simulation-trace {
  margin-top: 0.38rem;
  padding-top: 0.32rem;
  border-top: 1px solid rgba(201, 162, 39, 0.22);
  color: #bba987;
  font-size: 0.68rem;
}
.simulation-trace summary {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  cursor: pointer;
  color: #d8be76;
  list-style: none;
}
.simulation-trace summary::-webkit-details-marker { display: none; }
.simulation-trace summary::before { content: "史"; color: var(--gold); }
.simulation-trace[open] summary::before { content: "卷"; }
.simulation-trace summary small { color: #897a60; font-size: 0.62rem; }
.simulation-stages { display: flex; gap: 0.35rem; margin-top: 0.35rem; flex-wrap: wrap; }
.simulation-stage {
  padding: 0.15rem 0.36rem;
  border: 1px solid rgba(201, 162, 39, 0.28);
  background: rgba(201, 162, 39, 0.06);
}
.simulation-stage.ok { color: #c8b17a; }
.simulation-stage.failed { color: #e69a7e; border-color: rgba(190, 79, 48, 0.48); }
.simulation-rationale { margin: 0.35rem 0 0; color: #cbbd9e; line-height: 1.45; }
.simulation-beats { display: flex; flex-wrap: wrap; gap: 0.32rem; margin-top: 0.4rem; }
.simulation-beat {
  border: 1px solid rgba(164, 130, 55, 0.42);
  background: rgba(66, 47, 24, 0.5);
  color: #cbb67f;
  padding: 0.16rem 0.38rem;
  font-size: 0.62rem;
}
.simulation-beat.fact { border-color: rgba(101, 133, 103, 0.55); color: #b8c3a2; }
.simulation-beat.rumor { border-color: rgba(137, 102, 84, 0.5); color: #b99582; }
.simulation-beat.person-entry { border-color: rgba(176, 130, 47, 0.62); color: #dfc071; }
.simulation-limits { margin: 0.2rem 0 0; color: #766b58; }
.document-dock {
  min-width: 0;
  box-shadow: 0 10px 26px rgba(0, 0, 0, 0.34);
}
.document-dock-head {
  min-height: 2.45rem;
  padding: 0.28rem 0.48rem 0.28rem 0.72rem;
  display: grid;
  grid-template-columns: minmax(8rem, 1fr) auto auto;
  align-items: center;
  gap: 0.55rem;
  border-bottom: 1px solid rgba(201, 162, 39, 0.28);
}
.document-dock-head > div:first-child { display: flex; align-items: baseline; gap: 0.55rem; min-width: 0; }
.document-kicker {
  color: var(--gold);
  font-size: 0.64rem;
  letter-spacing: 0.18em;
  white-space: nowrap;
}
.document-dock-head strong { color: #ead8b4; letter-spacing: 0.12em; white-space: nowrap; }
.document-filters { display: flex; align-items: center; gap: 0.18rem; }
.document-filter,
.document-expand,
.document-preview,
.document-list button {
  min-width: 0;
  background: none;
  text-shadow: none;
  letter-spacing: 0;
  transform: none;
}
.document-filter {
  padding: 0.26rem 0.48rem;
  color: #a89572;
  border: 1px solid transparent;
  font-size: 0.7rem;
}
.document-filter:hover,
.document-filter.active {
  color: #f0d99d;
  border-color: rgba(201, 162, 39, 0.42);
  background: rgba(116, 78, 28, 0.26);
}
.document-filter b {
  display: inline-grid;
  min-width: 1.1rem;
  height: 1.1rem;
  place-items: center;
  margin-left: 0.15rem;
  border-radius: 50%;
  color: #dfc47e;
  background: rgba(201, 162, 39, 0.13);
  font-size: 0.62rem;
}
.document-expand {
  padding: 0.34rem 0.68rem;
  color: #f0d99d;
  border: 1px solid rgba(201, 162, 39, 0.62);
  background: linear-gradient(180deg, rgba(107, 60, 26, 0.78), rgba(52, 28, 15, 0.92));
  font-size: 0.72rem;
  letter-spacing: 0.08em;
  white-space: nowrap;
}
.document-preview {
  width: 100%;
  display: grid;
  grid-template-columns: auto minmax(8rem, 1fr);
  grid-template-rows: auto 1fr;
  gap: 0.12rem 0.7rem;
  padding: 0.48rem 0.75rem 0.58rem;
  color: var(--paper);
  text-align: left;
  filter: none;
}
.document-preview:hover { background: rgba(201, 162, 39, 0.06); filter: none; }
.document-preview:active { transform: none; }
.document-preview-meta { color: var(--gold); font-size: 0.68rem; white-space: nowrap; }
.document-preview > strong {
  min-width: 0;
  color: #ead8b4;
  font-size: 0.78rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
#gazette {
  grid-column: 1 / -1;
  margin: 0;
  padding: 0.2rem 0 0;
  white-space: pre-wrap;
  min-height: 5rem;
  max-height: 10.5rem;
  overflow: auto;
  font-family: inherit;
  font-size: 0.88rem;
  line-height: 1.55;
  color: #eadfc8;
}

body.documents-open #hud::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 39;
  background: rgba(5, 3, 2, 0.76);
  backdrop-filter: blur(7px);
  pointer-events: auto;
}
.document-reader {
  position: fixed;
  inset: 3vh 3vw;
  z-index: 40;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  color: #eadfc8;
  border: 1px solid rgba(215, 177, 78, 0.66);
  background:
    linear-gradient(rgba(24, 15, 9, 0.94), rgba(13, 8, 5, 0.97)),
    url("/static/assets/paper.jpg") center/cover;
  box-shadow: 0 24px 90px rgba(0, 0, 0, 0.74), inset 0 0 80px rgba(90, 53, 20, 0.2);
}
.document-reader-head {
  position: static;
  display: grid;
  grid-template-columns: minmax(19rem, 1fr) auto auto;
  align-items: center;
  gap: 1rem;
  padding: 0.78rem 1rem;
  border-bottom: 1px solid rgba(201, 162, 39, 0.42);
  background: rgba(10, 6, 4, 0.58);
}
.document-reader-head h2 { margin: 0.12rem 0 0; border: 0; padding: 0; color: #f0d99d; font-size: 1.18rem; }
.document-reader-head p { margin: 0.2rem 0 0; color: #9e8b6d; font-size: 0.72rem; }
.document-reader-head .document-filter { font-size: 0.8rem; padding: 0.42rem 0.75rem; }
.document-close { min-width: 4.8rem; }
.document-reader-layout {
  min-height: 0;
  display: grid;
  grid-template-columns: minmax(16rem, 22rem) minmax(0, 1fr);
}
.document-list {
  min-height: 0;
  overflow: auto;
  padding: 0.65rem;
  border-right: 1px solid rgba(201, 162, 39, 0.28);
  background: rgba(12, 7, 4, 0.48);
}
.document-list button {
  width: 100%;
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 0.16rem 0.5rem;
  margin-bottom: 0.42rem;
  padding: 0.62rem 0.66rem;
  color: #cfc0a5;
  border: 1px solid rgba(126, 94, 49, 0.34);
  text-align: left;
  filter: none;
}
.document-list button:hover,
.document-list button.selected {
  color: #f2dfb5;
  border-color: rgba(201, 162, 39, 0.7);
  background: rgba(126, 82, 31, 0.24);
  filter: none;
}
.document-list button:active { transform: none; }
.document-list .doc-kind {
  grid-row: 1 / span 2;
  align-self: start;
  padding: 0.16rem 0.28rem;
  color: #d5b75e;
  border: 1px solid rgba(201, 162, 39, 0.44);
  font-size: 0.62rem;
}
.document-list strong { font-size: 0.82rem; font-weight: 500; }
.document-list small {
  color: #8f8068;
  font-size: 0.68rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.document-list-empty { padding: 1rem; color: #8f8068; text-align: center; }
.document-sheet {
  min-width: 0;
  min-height: 0;
  overflow: auto;
  padding: clamp(1.25rem, 3vw, 2.8rem) clamp(1.4rem, 5vw, 5rem);
  background:
    linear-gradient(rgba(229, 210, 164, 0.92), rgba(203, 178, 125, 0.9)),
    url("/static/assets/paper.jpg") center/cover;
  color: #332418;
  box-shadow: inset 20px 0 50px rgba(74, 43, 20, 0.16);
}
.document-sheet-meta { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.document-sheet-meta > span { color: #765224; font-size: 0.74rem; letter-spacing: 0.2em; }
.document-sheet-meta button { color: #4c301a; border-color: rgba(90, 53, 20, 0.55); text-shadow: none; }
.document-sheet h3 {
  margin: 0.85rem 0 1.15rem;
  padding-bottom: 0.75rem;
  color: #3a2616;
  border-bottom: 1px solid rgba(83, 52, 24, 0.38);
  font-size: clamp(1.25rem, 2.2vw, 1.8rem);
  letter-spacing: 0.12em;
}
#document-reader-body {
  margin: 0;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  color: #39291c;
  font: inherit;
  font-size: clamp(1rem, 1.45vw, 1.24rem);
  line-height: 1.92;
}

.map-layers {
  position: absolute;
  left: 50%;
  top: 0.8rem;
  transform: translateX(-50%);
  display: flex;
  align-items: center;
  gap: 0.25rem;
  padding: 0.25rem 0.35rem;
  background: rgba(16, 9, 5, 0.7);
  border: 1px solid rgba(201, 162, 39, 0.32);
  backdrop-filter: blur(8px);
}
.map-camera {
  position: absolute;
  left: 1rem;
  top: 11.15rem;
  width: auto;
  max-width: calc(100% - 2rem);
  display: flex;
  align-items: center;
  gap: 0.22rem;
  padding: 0.32rem;
  background: rgba(16, 9, 5, 0.72);
  border: 1px solid rgba(201, 162, 39, 0.32);
  backdrop-filter: blur(8px);
}
.map-zoom {
  display: grid;
  align-items: center;
  gap: 0.2rem;
}
.map-zoom { grid-template-columns: 2rem 3.2rem 2rem 1fr; }
.view-toggle,
.map-zoom button,
.map-focus-button {
  min-width: 0;
  height: 1.8rem;
  padding: 0.1rem 0.35rem;
  color: #e7d2a5;
  background: rgba(201, 162, 39, 0.09);
  border: 1px solid rgba(201, 162, 39, 0.34);
  filter: none;
  font-size: 1rem;
}
.view-toggle,
.map-focus-button {
  width: auto;
  padding-inline: 0.65rem;
  font-size: 0.7rem;
  letter-spacing: 0.1em;
  white-space: nowrap;
}
.view-toggle:hover,
.view-toggle.active,
.map-focus-button:hover,
.map-zoom button:hover {
  color: #ffe29a;
  background: rgba(201, 162, 39, 0.2);
  border-color: rgba(201, 162, 39, 0.58);
  filter: none;
}
.map-zoom output {
  color: var(--muted);
  text-align: center;
  font-size: 0.68rem;
  font-variant-numeric: tabular-nums;
}
.map-zoom button.zoom-reset {
  width: auto;
  padding-inline: 0.55rem;
  font-size: 0.68rem;
  letter-spacing: 0.12em;
}
.map-layers > span {
  color: var(--muted);
  font-size: 0.7rem;
  letter-spacing: 0.2em;
  padding: 0 0.35rem;
}
.map-layers button,
.panel-tab {
  min-width: auto;
  padding: 0.25rem 0.55rem;
  border: 1px solid transparent;
  background: transparent;
  color: var(--muted);
  font-size: 0.72rem;
  letter-spacing: 0.16em;
  filter: none;
}
.map-layers button:hover,
.map-layers button.active,
.panel-tab:hover,
.panel-tab.active {
  color: #ffe29a;
  border-color: rgba(201, 162, 39, 0.48);
  background: rgba(201, 162, 39, 0.13);
  filter: none;
}
.panel-tabs {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.3rem;
  margin-bottom: 0.55rem;
  border-bottom: 1px solid #5c432c;
  padding-bottom: 0.4rem;
}
.objectives {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.25rem 0.45rem;
  margin-bottom: 0.75rem;
}
.objective-clock {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 0.4rem;
  align-items: center;
  color: var(--muted);
  font-size: 0.7rem;
}
.objective-clock i,
.relation-meters i {
  height: 4px;
  background: #352519;
  border: 1px solid #60462b;
}
.objective-clock em,
.relation-meters em {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, #8b4a1e, #d4a24a);
}
.objective {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  font-size: 0.74rem;
  color: #d4c39f;
}
.objective > span { min-width: 0; display: grid; gap: 0.06rem; }
.objective strong { color: inherit; font-size: 0.72rem; font-weight: 500; }
.objective small { color: #8f7c60; font-size: 0.58rem; line-height: 1.35; }
.objective.done small { color: #a9956f; }
.objective > i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  border: 1px solid #8a6739;
}
.objective.done > i { background: #b99a49; box-shadow: 0 0 8px rgba(215, 183, 91, 0.7); }
.objective.open { color: #a98f72; }
.diplomacy-title {
  display: grid;
  grid-template-columns: 52px 1fr;
  gap: 0.55rem;
  align-items: center;
  margin-bottom: 0.55rem;
}
.military-title {
  display: grid;
  grid-template-columns: 48px 1fr;
  gap: 0.55rem;
  align-items: center;
  margin-bottom: 0.55rem;
}
.military-title h2 { margin: 0; }
.military-title p { margin: 0.2rem 0 0; color: var(--muted); font-size: 0.7rem; line-height: 1.4; }
.military-seal {
  display: grid;
  place-items: center;
  width: 46px;
  height: 46px;
  border: 1px solid #a66b35;
  background: radial-gradient(circle, rgba(171, 73, 38, 0.32), rgba(36, 16, 8, 0.82));
  color: #efc17d;
  font-size: 1.25rem;
  box-shadow: inset 0 0 0 3px rgba(45, 18, 9, 0.82);
}
.armies { display: grid; gap: 0.5rem; }
.army-card {
  padding: 0.5rem;
  border: 1px solid rgba(201, 162, 39, 0.25);
  border-left: 3px solid #9a7441;
  background: rgba(8, 5, 3, 0.36);
  cursor: pointer;
}
.army-card.selected { border-color: rgba(230, 191, 81, 0.82); background: rgba(201, 162, 39, 0.1); }
.army-card.unpaid { border-left-color: #b8583c; }
.army-head { display: flex; justify-content: space-between; gap: 0.45rem; align-items: flex-start; }
.army-head strong { display: block; font-size: 0.94rem; letter-spacing: 0.1em; }
.army-head small { display: block; margin-top: 0.08rem; color: var(--muted); font-size: 0.66rem; }
.army-status { color: #d8b96b; font-size: 0.68rem; white-space: nowrap; }
.army-card.unpaid .army-status { color: #ef9b7f; }
.army-ledger {
  display: grid;
  grid-template-columns: 3rem 1fr 3rem 1fr;
  gap: 0.15rem 0.3rem;
  margin: 0.4rem 0 0;
  font-size: 0.69rem;
}
.army-ledger dt { color: var(--muted); }
.army-ledger dd { margin: 0; color: #ead8b4; font-variant-numeric: tabular-nums; }
.army-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 0.3rem; margin-top: 0.45rem; }
.army-actions button {
  width: 100%; min-width: 0; padding: 0.28rem 0.25rem;
  letter-spacing: 0.08em; font-size: 0.68rem;
}
.military-note {
  margin: 0.55rem 0 0;
  padding-top: 0.45rem;
  border-top: 1px dashed #5c432c;
  color: var(--muted);
  font-size: 0.67rem;
  line-height: 1.5;
}
.diplomacy-title img {
  width: 52px;
  height: 52px;
  object-fit: contain;
  filter: drop-shadow(0 2px 6px #000);
}
.diplomacy-title h2 { margin: 0; }
.diplomacy-title p { margin: 0.2rem 0 0; color: var(--muted); font-size: 0.72rem; }
.relations { display: grid; gap: 0.5rem; }
.relation-card {
  padding: 0.5rem;
  border: 1px solid rgba(201, 162, 39, 0.25);
  background: rgba(8, 5, 3, 0.36);
  cursor: pointer;
}
.relation-card.selected { border-color: rgba(230, 191, 81, 0.82); background: rgba(201, 162, 39, 0.1); }
.relation-card.hostile { border-left: 3px solid #a84b3d; }
.relation-card.friendly { border-left: 3px solid #9e9f58; }
.relation-card.guarded { border-left: 3px solid #9a7441; }
.relation-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 0.4rem; }
.relation-head strong { display: block; font-size: 0.94rem; letter-spacing: 0.1em; }
.relation-head small { display: block; color: var(--muted); font-size: 0.68rem; margin-top: 0.08rem; }
.relation-head > b { color: #d8b96b; font-size: 1rem; }
.relation-card.hostile .relation-head > b { color: #ef8e76; }
.relation-card p { margin: 0.38rem 0; color: #d0bc98; font-size: 0.72rem; line-height: 1.45; }
.relation-meters {
  display: grid;
  grid-template-columns: 3.6rem 1fr;
  gap: 0.16rem 0.35rem;
  align-items: center;
  color: var(--muted);
  font-size: 0.66rem;
}
button.relation-action {
  width: 100%;
  margin-top: 0.45rem;
  padding: 0.28rem 0.4rem;
  letter-spacing: 0.1em;
  font-size: 0.72rem;
}
.inspect-kicker {
  margin: 0 0 0.25rem;
  color: #b89555;
  font-size: 0.64rem;
  letter-spacing: 0.18em;
}
.inspect-fact,
.inspect-rumor {
  margin: 0.45rem 0 0;
  padding-top: 0.38rem;
  border-top: 1px dashed #5c432c;
  font-size: 0.76rem;
  line-height: 1.48;
}
.inspect-fact { color: #e1cfaa; }
.inspect-rumor { color: #d58c73; }
.map-legend {
  position: absolute;
  left: 50%;
  top: 3rem;
  transform: translateX(-50%);
  display: flex;
  gap: 0.65rem;
  padding: 0.28rem 0.5rem;
  background: rgba(16, 9, 5, 0.68);
  border: 1px solid rgba(201, 162, 39, 0.25);
  color: var(--muted);
  font-size: 0.67rem;
  backdrop-filter: blur(6px);
}
.map-legend span { display: flex; align-items: center; gap: 0.25rem; }
.map-legend i { width: 7px; height: 7px; border-radius: 50%; display: block; }
.map-legend .legend-icon {
  width: 17px;
  height: 17px;
  object-fit: contain;
  margin: -5px 0;
  filter: drop-shadow(0 1px 2px #000);
}
.map-legend .legend-icon.bandit { filter: drop-shadow(0 0 3px rgba(231, 98, 32, 0.78)); }
.map-legend .legend-icon.mutiny { filter: drop-shadow(0 0 3px rgba(192, 61, 44, 0.72)); }
.legend-army { background: #b79548; }
.legend-site { background: transparent; border: 1px solid #d3bc7c; }

.site-label,
.power-label {
  pointer-events: auto;
  min-width: 0;
  padding: 2px 5px;
  border: 1px solid rgba(201, 162, 39, 0.32);
  background: rgba(14, 8, 4, 0.78);
  color: #e7d5ad;
  font-family: "Songti SC", "Noto Serif SC", serif;
  font-size: 10px;
  letter-spacing: 0.04em;
  text-shadow: 0 1px 3px #000;
  white-space: nowrap;
  filter: none;
}
.site-label:hover,
.power-label:hover { color: #ffe6a3; border-color: rgba(235, 196, 91, 0.9); filter: none; }
.site-label.fort { border-left: 3px solid #b08a3a; }
.site-label.crisis { border-left: 3px solid #a8422d; }
.site-label.foreign { border-left: 3px solid #6c7c78; }
.site-label.trade { border-left: 3px solid #8a9152; }
.power-label { font-size: 11px; border-color: rgba(108, 143, 137, 0.58); }
.power-label.hostile { color: #ffad92; border-color: rgba(184, 72, 51, 0.72); }
.power-label.friendly { color: #e7dea0; border-color: rgba(158, 159, 88, 0.72); }
.force-label {
  padding: 2px 5px;
  color: #f0dfb6;
  background: rgba(12, 8, 4, 0.74);
  border: 1px solid rgba(201, 162, 39, 0.35);
  font-size: 10px;
  white-space: nowrap;
  text-shadow: 0 1px 3px #000;
}
.force-label.army { pointer-events: auto; cursor: pointer; }
.force-label.army:hover { color: #ffe6a3; border-color: rgba(235, 196, 91, 0.9); }
.force-label.army.unpaid { color: #f0b58d; border-color: rgba(211, 107, 68, 0.62); }
.force-label.bandit { color: #ffac8d; border-color: rgba(190, 68, 43, 0.72); }
.force-label.jin { color: #ffb29a; border-color: rgba(151, 54, 44, 0.72); }

.prov-label {
  font-family: "Songti SC", "Noto Serif SC", serif;
  font-size: 11px;
  color: #f3e4c4;
  text-shadow: 0 1px 3px #000, 0 0 8px #000;
  letter-spacing: 0.08em;
  pointer-events: auto;
  cursor: pointer;
  appearance: none;
  white-space: nowrap;
  padding: 1px 5px;
  background: rgba(12, 8, 4, 0.55);
  border: 1px solid rgba(201, 162, 39, 0.25);
}
.prov-label:hover, .prov-label:focus-visible { color: #ffe6a3; border-color: rgba(235, 196, 91, 0.9); outline: none; }

.objective-result {
  display: flex;
  justify-content: space-between;
  gap: 0.5rem;
  margin: 0.42rem 0 0.55rem;
  padding: 0.35rem 0.45rem;
  border: 1px solid rgba(201, 162, 39, 0.42);
  background: rgba(201, 162, 39, 0.08);
  font-size: 0.72rem;
}
.objective-result strong { color: #f1d37f; }
.objective-result.failed { border-color: rgba(198, 82, 54, 0.58); }
.objective-result.failed strong { color: #efaa8f; }
.prov-label.hot { color: #ffc4b0; border-color: rgba(224, 112, 64, 0.45); }
.prov-label.sel {
  color: #ffe38a;
  font-size: 12px;
  border-color: rgba(201, 162, 39, 0.7);
}
.prov-alert-icon {
  width: 28px;
  height: 28px;
  margin: -8px -2px -8px 4px;
  object-fit: contain;
  vertical-align: middle;
  filter: drop-shadow(0 1px 2px #000);
}
.prov-alert-icon[data-kind="locust"] { filter: drop-shadow(0 1px 2px #000) drop-shadow(0 0 4px rgba(203, 151, 55, 0.78)); }
.prov-alert-icon[data-kind="mutiny"] { filter: drop-shadow(0 1px 2px #000) drop-shadow(0 0 4px rgba(198, 61, 43, 0.78)); }
.prov-alert-icon[data-kind="bandit"] { filter: drop-shadow(0 1px 2px #000) drop-shadow(0 0 4px rgba(235, 101, 27, 0.84)); }
.prov-alert-icon[hidden] { display: none; }
.map-label-collided { visibility: hidden !important; pointer-events: none !important; }

#viewport[data-map-view="sandbox"] .site-label,
#viewport[data-map-view="sandbox"] .force-label { font-size: 9px; }
#viewport[data-map-view="sandbox"] .power-label,
#viewport[data-map-view="sandbox"] .prov-label { font-size: 10px; }
#viewport[data-map-view="sandbox"] .prov-label.sel { font-size: 11px; }
#viewport[data-map-view="sandbox"] .prov-alert-icon { width: 24px; height: 24px; }

#inspect-body { margin: 0; color: var(--muted); font-size: 0.88rem; line-height: 1.5; }
.bars { margin-top: 0.45rem; display: grid; gap: 0.28rem; }
.bar {
  display: grid;
  grid-template-columns: 2.4rem 1fr 2rem;
  gap: 0.35rem;
  align-items: center;
  font-size: 0.75rem;
  color: var(--muted);
}
.bar i {
  display: block;
  height: 6px;
  background: #3a2a1c;
  border: 1px solid #6a5030;
}
.bar i em {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, #8b4a1e, #d4a24a);
}
.bar.bad i em { background: linear-gradient(90deg, #7a1e1e, #e07040); }

@media (max-width: 900px) {
  .stats { grid-template-columns: 1fr 1fr; width: calc(100% - 2rem); }
  .court, .inspect { display: none; }
  .dossier {
    left: 0.6rem; right: 0.6rem; width: auto; top: 0.6rem;
    max-height: calc(100% - 1.2rem);
    z-index: 30;
    background: rgba(18, 11, 6, 0.97);
    box-shadow: 0 18px 46px rgba(0, 0, 0, 0.62);
  }
  body.dossier-open #hud::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 29;
    pointer-events: auto;
    background: rgba(8, 5, 3, 0.72);
    backdrop-filter: blur(3px);
  }
  .dock { right: 1rem; }
  .dock.collapsed { right: auto; }
  .document-dock-head { grid-template-columns: 1fr auto; }
  .document-dock-head > div:first-child { display: none; }
  .document-reader { inset: 0.5rem; }
  .document-reader-head { grid-template-columns: 1fr auto; gap: 0.55rem; }
  .document-reader-head > div:first-child { grid-column: 1 / -1; }
  .document-reader-head p { display: none; }
  .document-reader-layout { grid-template-columns: minmax(11rem, 34%) minmax(0, 1fr); }
  .document-sheet { padding: 1.2rem; }
  .era { font-size: 1.15rem; }
  .map-camera { top: auto; bottom: 3.8rem; left: 0.6rem; }
  body.dock-open #hud > .map-camera { opacity: 0; pointer-events: none; }
}

@media (max-width: 620px) {
  .dossier-hero { grid-template-columns: 76px minmax(0, 1fr); }
  .dossier-hero img,
  .dossier-monogram { width: 76px; height: 94px; }
  .dossier-actions { grid-template-columns: 1fr; }
  .dossier-actions button:last-child:nth-child(odd) { grid-column: auto; }
  .dock-bar-copy strong { display: none; }
  .document-filter { padding: 0.25rem 0.38rem; }
  .document-filter b { display: none; }
  .document-expand { padding-inline: 0.5rem; }
  .document-reader-layout { grid-template-columns: 1fr; grid-template-rows: minmax(7rem, 28%) minmax(0, 1fr); }
  .document-list { border-right: 0; border-bottom: 1px solid rgba(201, 162, 39, 0.28); }
}
