/* Ash & brass · flat information, tactile edges. Loaded after layout/gameplay CSS.
 * Shared by every v3 menu; no fonts, images or services fetched remotely. */
:root {
  --ink: #1d2426;
  --paper: #f1e9d9;
  --gold: #d9b675;
  --line: #706856;
  --green: #afc9a0;
  --red: #e5a18b;
  --ui-surface: #252d2f;
  --ui-raised: #30393a;
  --ui-inset: #1d2527;
  --ui-muted: #bdbbaa;
  --ui-rule: #766a514f;
  --ui-edge: #a292715e;
  --ui-shadow: 0 18px 48px #080d10a3, inset 0 1px #f6e4b81c;
}

/* Material belongs to the container, never behind every piece of copy. */
.panel, dialog, .start-panel, .load-panel {
  background: var(--ui-surface);
  border: 1px solid var(--ui-edge);
  border-top-color: #b29a70b3;
  border-radius: 8px;
  box-shadow: var(--ui-shadow);
  color: var(--paper);
}
dialog::backdrop { background: #080e12bd; }
.panel-top { gap: 8px; }
.panel-top h2, dialog h2, .panel h2, .load-panel h2 {
  color: #f2dfb9;
  font-family: Georgia, serif;
  font-weight: 400;
  letter-spacing: -.025em;
}
.castle-panel > .panel-top {
  padding-bottom: 9px;
  border-bottom: 1px solid var(--ui-rule);
  margin-bottom: 12px;
}
.panel p, dialog p, .panel small, dialog small { color: var(--ui-muted); }
.panel h3, dialog h3 { color: var(--paper); }
.panel :is(.danger-note,.camp-danger), dialog :is(.danger-note,.camp-danger) { color: var(--red); }
.panel .forge-item-owner, dialog .forge-item-owner { color: var(--gold) !important; }
.tiny-link { color: var(--gold); }
:where(dialog,.panel,.inventory-list,.rpg-item,.kit-ledger,#help-content,.return-layout,.wreck-items,.loot-comparisons) {
  scrollbar-width: thin;
  scrollbar-color: #9b8864 #1d2527;
}

/* A single quiet bevel evokes metal; selection remains flat and unmistakable. */
button {
  background: var(--ui-raised);
  border-color: var(--ui-edge);
  border-radius: 5px;
  box-shadow: inset 0 1px #fff3d214, 0 1px 2px #0b11134d;
  transition: background-color .12s, border-color .12s;
}
button:hover:not(:disabled) { background: #414a48; border-color: #c4a978; }
button:active:not(:disabled) { box-shadow: inset 0 2px 4px #0005; }
button.gold, button.selected {
  color: #242b2a !important;
  background: #dbb77b !important;
  border-color: #f4d6a1 !important;
  box-shadow: inset 0 1px #fff1ca77, 0 2px 3px #0003;
}
button.selected :is(small,b,.icon) { color: #303a32 !important; }
button.gold:hover:not(:disabled) { background: #e9c78e !important; }
button:disabled { opacity: .43; box-shadow: none; }
button:focus-visible, select:focus-visible, [tabindex]:focus-visible {
  outline: 2px solid #f3d293;
  outline-offset: 2px;
}
:is(.forge-filters,.rpg-character,.gear-pages) select, select#forge-hero {
  background: var(--ui-inset);
  color: var(--paper);
  border: 1px solid var(--ui-edge);
  border-radius: 5px;
  box-shadow: inset 0 1px 3px #0004;
  min-height: 44px;
}
select option { background: var(--ui-inset); color: var(--paper); }

/* 01 · Start / archives. The illustration stays the hero. */
#start-menu::before { background: linear-gradient(90deg,#121b20d9,transparent 85%); }
.start-panel { background: #222b2df5; border-left: 3px solid var(--gold); }
.start-panel h1 { color: #f5e5c4; text-shadow: none; }
.menu-eyebrow { color: var(--gold); letter-spacing: .2em; }
.menu-subtitle, .menu-note, .save-row small { color: var(--ui-muted); }
.menu-full { background: var(--ui-surface); border-color: var(--ui-edge); }
.save-row > button:first-child { background: var(--ui-inset); }
.save-row > button:first-child:hover { background: var(--ui-raised); }
.save-tools { border-top: 1px solid var(--ui-rule); padding-top: 8px; }

/* 02 · Town. One cover-fit coordinate plane: art and hit masks crop together. */
body[data-screen=castle] #town-hotspots { background: var(--ink); }
body[data-screen=castle] #town-hotspots::before { content: none; }
.castle-art-plane {
  position: absolute;
  left: 50%; top: 50%;
  width: max(100%,calc(100dvh * 1672 / 941));
  aspect-ratio: 1672 / 941;
  margin: 0;
  transform: translate(-50%,-50%);
  box-shadow: none;
}
.castle-art { object-fit: fill; }
.town-marker {
  background: #242a2ce8;
  border-color: #d5b477;
  box-shadow: 0 2px 6px #12161699,inset 0 1px #ffe7b733;
}
body[data-screen=castle] .town-tooltip {
  bottom: max(8px,calc((100vw * 941 / 1672 - 100dvh) / 2 + 8px));
  position: absolute;
  background: #202829f5;
  border-color: var(--ui-edge);
  border-radius: 5px;
}
.castle-caption { left: max(12px,env(safe-area-inset-left)); bottom: 8px; }
body[data-screen=castle][data-castle-panel=open] .castle-art-plane { filter: brightness(.42) saturate(.7); }
body[data-screen=castle] #hint { bottom: 8px; }
.hud-right > button, .resources { background: #202a2dec; border-color: var(--ui-edge); border-radius: 5px; }
.brand { color: #f4e4c3; }
.resources { box-shadow: inset 0 1px 3px #0004; }

/* 03 · Hall / barracks / clinic / memorial / workshop. */
.mission-option { background: var(--ui-inset); border-color: var(--ui-edge); }
.mission-option small, .mission-brief { color: var(--ui-muted) !important; }
.mission-option.selected small { color: #303a32 !important; }
.hero-tile { background: var(--ui-inset); border-radius: 5px; }
.hero-tile img { background: #4a5149; border-radius: 4px; }
.hero-tile.selected { background: var(--ui-raised) !important; color: var(--paper) !important; border-color: var(--gold) !important; box-shadow: inset 0 -2px var(--gold); }
.hero-tile.selected :is(small,b,.icon) { color: var(--paper) !important; }
.party-readiness { border-color: var(--ui-rule); }
.castle-summary { border-top: 1px solid var(--ui-rule); padding-top: 8px; }
.section-label {
  font: 600 11px/1.4 system-ui,sans-serif !important;
  text-transform: uppercase;
  letter-spacing: .1em;
  color: var(--gold) !important;
  margin: 0 0 9px !important;
}
.recruit-choices { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 6px; }
.recruit-choices button { justify-content: flex-start; padding: 7px; font-size: 12px; }
.recruit-choices button > span:not(.icon) { flex: 1; text-align: left; }
.recruit-choices small { display: block; font-size: 10px; margin-top: 2px; }
.recruit-choices button > .icon:last-child { width: 16px; }
.recruit-choices button > .icon:last-child svg { width: 16px; }
.barracks-layout .recruit-note { margin: 0 0 9px; font-size: 11px; line-height: 1.4; }
.clinic-row, .clinic-summary, .building-card, .upgrade-grid article, .grave-list > span {
  background: var(--ui-inset);
  border-color: var(--ui-edge);
  border-radius: 5px;
  box-shadow: none;
}
.building-level, .upgrade-grid article > small { color: var(--gold); }
.grave-list { max-height: calc(100dvh - 180px); overflow: auto; }
.grave-list:has(>p) { justify-content: center; padding: 20px; }

/* 04 · Forge is an object workbench, not a second soldier selection menu. */
.castle-panel[data-facility=stash] { width: min(900px,100%); height: min(480px,calc(100dvh - 76px)); display: flex; flex-direction: column; overflow: hidden; }
.castle-panel[data-facility=stash] > .panel-top { flex: none; }
.forge-stock { flex: 1; height: auto; min-height: 0; gap: 9px; overflow: hidden; }
.forge-toolbar { display: flex; gap: 8px; flex: none; }
.forge-toolbar .forge-filters { flex: 1; gap: 8px; }
.forge-toolbar > button { padding: 7px 14px; font-size: 12px; color: var(--gold); }
.forge-stock .inventory-list { max-height: none; border-top: 1px solid var(--ui-rule); padding-top: 8px; }
.inventory-row { background: var(--ui-inset); border-radius: 5px; border-left-width: 3px; }
.inventory-row > .icon { color: var(--gold); }
.inventory-row .item-name { min-width: 0; font-size: 13px; }
.inventory-row small { line-height: 1.35; }
.forge-empty { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 7px; text-align: center; }
.forge-empty > .icon { color: var(--gold); }
.forge-empty h3 { font: 19px Georgia,serif; margin: 0; }
.forge-empty p { margin: 0; }
#forge-item-detail { width: min(640px,94vw); padding: 16px; max-height: calc(100dvh - 16px); }
#forge-item-detail .panel-top h2 { font-size: 22px; }
.forge-object { display: flex; gap: 16px; align-items: center; padding: 16px; background: var(--ui-inset); border: 1px solid var(--ui-rule); border-radius: 5px; }
.forge-object > section { flex: 1; min-width: 0; }
.forge-object .section-label { display: block; }
.forge-object .forge-item-owner { display: block; font-size: 11px; margin: 3px 0; }
.forge-object-icon { display: grid; place-items: center; width: 70px; height: 70px; border: 1px solid var(--ui-edge); border-radius: 5px; color: var(--gold); box-shadow: inset 0 2px 9px #0004; }
.forge-object-icon .icon, .forge-object-icon svg { width: 42px; height: 42px; }
.forge-object h3 { font-size: 15px; margin: 0; }
.forge-object p { margin: 6px 0; }
.forge-object-actions { display: flex; gap: 7px; margin-top: 12px; }
.forge-object-actions:empty { display: none; }
.forge-object-actions > button { flex: 1; font-size: 12px; }
.forge-object-actions small { display: block; font-size: 10px; margin-top: 3px; }
.forge-object-footer { display: flex; justify-content: flex-end; margin-top: 12px; }
.forge-object-footer button { font-size: 12px; }
.forge-recipient { display: flex; align-items: center; gap: 12px; margin: 0 0 9px; font-size: 12px; color: var(--ui-muted); }
.forge-recipient select { min-width: 0; flex: 1; padding: 6px; font: 12px system-ui; }
.forge-options button { font-size: 12px; }

/* Parchment receipts highlight the actual result; surrounding controls stay flat. */
.forge-receipt, .service-result {
  background: #e5d7b8;
  border: 1px solid #f4e6c8;
  border-radius: 4px;
  color: #343a33;
  box-shadow: inset 0 1px #fff5dc;
}
.service-result { padding: 8px; }
:is(.forge-receipt,.service-result) :is(h3,p,b,small) { color: #343a33 !important; }
.service-wallet { background: var(--ui-inset); border-color: var(--ui-edge); }
.service-price { color: var(--gold); }

/* 05 · Equipment / soldier / preparation. Preserve the spatial paper doll. */
.rpg-character { background: var(--ui-inset); border-color: var(--ui-edge); border-radius: 5px; }
.rpg-item, .stat-grid > div, .quick-stats > span { background: var(--ui-inset); border-color: var(--ui-edge); border-radius: 5px; }
.rpg-item { border-left: 3px solid var(--gold); }
.gear-slot, .soldier-amulet { background: var(--ui-raised); border-color: var(--ui-edge); border-radius: 5px; }
.rpg-doll > img { filter: drop-shadow(0 4px 6px #0007); }
.item-condition { background: #0c1518; }
.item-condition i { background: var(--gold); }
.soldier-heading > img { background: var(--ui-inset); border-radius: 5px; border-color: var(--ui-edge); }
.soldier-amulet small, .equipped-weapon small, .gear-location { color: var(--ui-muted); }
.kit-tools, .kit-footer { border-color: var(--ui-rule); }
.kit-slots > button { background: var(--ui-inset); border-color: var(--ui-edge); border-radius: 5px; }
.kit-short { color: var(--red); }

/* 06 · Journal / help / loot / route / combat decisions. One visual language. */
.dossier-columns > section, .mission-route, .local-chronicle, .road-card,
.target-detail, .support-detail, .order-current, .return-patients > div,
.loot-comparisons article, .wreck-items article {
  background: var(--ui-inset);
  border-color: var(--ui-edge);
  border-radius: 5px;
}
.journal-kicker, .dossier-title small, .road-bearing { color: var(--gold); }
.rules-section, .help-row, .quest-checklist > div { border-color: var(--ui-rule); }
.dossier-columns blockquote { border-left-color: var(--gold); color: var(--ui-muted); }
.mission-dossier .dossier-title { background: var(--ui-surface); }
#help:not(:has(.mission-dossier))[open] { display: flex; flex-direction: column; overflow: hidden; }
#help:not(:has(.mission-dossier)) #help-content { min-height: 0; overflow: auto; }
#help:not(:has(.mission-dossier)) > button { flex: none; margin-top: 8px; }
.story-choices .class-choice { background: #2c4143; border-color: #90ada5; }
.story-choices .class-choice b { color: #cde1d4; }
.target-list > button, .support-list > button { background: var(--ui-inset); border-color: var(--ui-edge); }
.target-actions, .support-actions, .order-actions, .return-footer, .retreat-actions { border-color: var(--ui-rule); }
.encounter-panel .encounter-actions > button.gold:last-child { min-width: 108px; }
.encounter-panel[data-encounter=trader] .encounter-actions { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); }
.encounter-panel[data-encounter=trader] [data-action=vendor-equipment] { grid-column: span 2; }
.encounter-panel[data-encounter=trader] [data-id=continue] { grid-column: 3; }
.report-ledger { border-color: var(--ui-rule); }
.camp-return > div { background: var(--ui-inset); border-color: var(--ui-edge); }
#road-plan .road-card { border-top: 2px solid var(--gold); }
.road-card.quest-road { border-color: var(--gold); }

@media (max-height:500px) and (orientation:landscape) {
  .castle-panel > .panel-top { padding-bottom: 6px; margin-bottom: 8px; }
  .forge-stock { gap: 6px; }
  .forge-stock .inventory-list { padding-top: 6px; }
  .forge-toolbar { gap: 6px; }
  .forge-toolbar > button { padding: 5px 8px; }
  .forge-recipient { margin-bottom: 6px; }
  #forge-preview { padding: 9px; max-height: calc(100dvh - 8px); }
  #forge-preview .forge-receipt { margin: 6px 0; }
  #forge-preview .forge-receipt p { line-height: 1.25; }
  .forge-warning:empty { display: none; }
  .section-label { margin-bottom: 5px !important; font-size: 10px !important; }
  .barracks-layout .recruit-note { font-size: 10px; margin-bottom: 6px; }
  .barracks-layout .hero-tile img { width: 38px; height: 38px; }
  .barracks-layout .hero-tile { padding: 4px; }
  .recruit-choices { gap: 5px; }
  .recruit-choices button { padding: 5px; font-size: 11px; }
  .recruit-choices small { margin-top: 0; }
  .castle-summary { padding-top: 5px; }
  #forge-item-detail { padding: 10px; }
  #forge-item-detail .panel-top { margin-bottom: 8px; }
  .forge-object { padding: 10px; gap: 12px; }
  .forge-object p { margin: 4px 0; font-size: 11px; line-height: 1.3; }
  .forge-object-actions small { font-size: 9px; line-height: 1.1; white-space: nowrap; }
  .forge-object-icon { width: 56px; height: 56px; }
  .forge-object-actions, .forge-object-footer { margin-top: 8px; }
  .save-tools { padding-top: 5px; }
}
@media (max-width:650px) {
  .forge-toolbar .forge-filters { gap: 4px; }
  .forge-toolbar > button .icon { display: none; }
  .forge-filters select { font-size: 10px; }
  .barracks-layout { grid-template-columns: minmax(0,1.05fr) minmax(0,1fr); }
  .recruit-choices button > .icon:last-child { display: none; }
}
@media (max-height:380px) and (orientation:landscape) {
  .castle-panel:has(.fresh-preparation) { padding: 6px 10px; }
  .castle-panel:has(.barracks-layout) { padding: 6px 10px; }
  .barracks-layout .hero-tile img { width: 30px; height: 30px; }
  .castle-panel:has(.fresh-preparation) > .panel-top { margin-bottom: 6px; padding-bottom: 4px; }
  .fresh-preparation .party-pages { margin-top: 3px; }
  .fresh-preparation .castle-summary { margin-top: 4px; padding-top: 4px; }
  .fresh-preparation .party-paged .hero-tile img { width: 30px; height: 30px; }
}
@media (prefers-reduced-motion:reduce) { button { transition: none; } }