.campaign-hub { max-width: 920px; margin: 0 auto; }
.campaign-hub > header { display: block; height: auto; min-height: 0; padding: 0 0 10px; background: transparent; }
.campaign-hub h2 { font-size: clamp(1.5rem, 4vw, 2.1rem); letter-spacing: .08em; }
.campaign-hub header > small { color: #a2c5c3; letter-spacing: .16em; }
.campaign-deadline { color: #ffe0a6; font-weight: 700; padding: 10px 12px; background: #29383b; border-left: 3px solid #edbe79; }
.campaign-rooms { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 6px; margin: 18px 0; }
.campaign-rooms button { padding: 10px 4px; min-width: 0; }
.campaign-hub button[aria-pressed="true"] { border-color: #8bc7bd; background: #314d4b; color: #e4fff4; }
.campaign-hub button:focus-visible { outline: 3px solid #ffc970; outline-offset: 3px; }
.campaign-room { display: grid; grid-template-columns: minmax(130px, 1fr) minmax(0, 3fr); border: 1px solid #53645e; background: #17292d; min-height: 260px; }
.campaign-room-backdrop { display: grid; place-items: center; background: linear-gradient(145deg, #304b4b, #142328); border-right: 1px solid #425c59; overflow: hidden; }
.campaign-room-backdrop span { display: grid; place-items: center; width: 90px; height: 110px; border: 2px solid #76998b; border-radius: 46px 46px 12px 12px; font-size: 42px; color: #bed4bd; box-shadow: 0 0 0 14px #0f222a44; }
.room-medical .campaign-room-backdrop { background: linear-gradient(145deg, #486561, #142328); }
.room-laboratory .campaign-room-backdrop { background: linear-gradient(145deg, #3d466b, #142328); }
.room-warehouse .campaign-room-backdrop { background: linear-gradient(145deg, #665641, #142328); }
.campaign-conversation { padding: 20px; min-width: 0; }
.campaign-conversation > small { color: #95b5b4; font-size: 10px; letter-spacing: .12em; }
.campaign-conversation h3 { margin: 8px 0 12px; }
.campaign-speaker { color: #dfc796; font-weight: 700; }
.campaign-speech { line-height: 1.8; min-height: 5.4em; background: #101d24; padding: 14px 16px; border-radius: 3px; }
.campaign-topics, .campaign-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.campaign-topics button { text-align: left; }
.campaign-actions { margin: 18px 0 10px; }
.campaign-development-note { font-size: 12px; line-height: 1.7; }
.campaign-strategy h3 { margin: 20px 0 10px; }
.campaign-map { position: relative; min-height: 290px; overflow: hidden; border: 1px solid #587778; background: radial-gradient(ellipse at 45% 70%, #385953 0, transparent 42%), repeating-linear-gradient(0deg, transparent 0 39px, #c7dfcc0c 39px 40px), repeating-linear-gradient(90deg, transparent 0 39px, #c7dfcc0c 39px 40px), #14282e; }
.campaign-map::before { content: ''; position: absolute; left: 8%; right: 8%; top: 47%; height: 2px; background: #7c92864a; transform: rotate(-14deg); }
.campaign-map-point { position: absolute; left: var(--site-x); top: var(--site-y); transform: translate(-50%, -50%); color: #d9ebd9; font-size: 12px; font-weight: 700; text-align: center; white-space: nowrap; text-shadow: 0 2px 3px #000; }
.campaign-map-point > span { display: block; margin: 0 auto 4px; font-size: 20px; color: #97d2bf; }
.campaign-map-point.finale { color: #eec28c; }
.campaign-map-point.finale > span { font-size: 32px; color: #d59983; }
.campaign-map-point.defense > span { font-size: 29px; }
.campaign-site-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin: 12px 0; }
.campaign-site { border: 1px solid #405956; background: #192c30; padding: 14px; display: flex; flex-direction: column; min-width: 0; }
.campaign-site h4 { margin: 0 0 6px; font-size: 16px; }
.campaign-site p { margin: 6px 0; font-size: 13px; line-height: 1.6; }
.campaign-site small { color: #b8cec0; letter-spacing: .03em; }
.campaign-site button { margin-top: auto; width: 100%; white-space: normal; }
.campaign-site.finale { border-color: #886c57; background: #302d2c; }
.campaign-lock { color: #e2b58c; }
@media (max-width: 650px) {
  .campaign-rooms { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .campaign-room { grid-template-columns: 64px minmax(0, 1fr); }
  .campaign-room-backdrop span { font-size: 24px; width: 42px; height: 65px; }
  .campaign-conversation { padding: 12px; }
  .campaign-speech { padding: 10px; }
  .campaign-site-list { grid-template-columns: 1fr; }
  .campaign-map { min-height: 245px; }
  .campaign-map-point { font-size: 10px; }
  .campaign-actions > button { flex: 1 1 160px; }
}
.campaign-stock { margin: 14px 0; padding: 12px 16px; border: 1px solid #53695e; background: #20332f; }
.campaign-stock p { margin: 6px 0; }
.campaign-stock small { color: #b8cec0; letter-spacing: .03em; }

.expedition-transport { margin: .6rem 0; padding: .5rem; background: #12242d; border: 1px solid #31515c; border-radius: 6px; font-size: .85rem; }
.expedition-transport canvas { float: left; width: 120px; height: 64px; }
.expedition-transport small { display: block; clear: both; }