:root {
  color-scheme: dark;
  --ink: #f7edda;
  --muted: #b8ad9a;
  --background: #17140f;
  --surface: #242019;
  --surface-raised: #2d281f;
  --line: #494033;
  --gold: #f2b84b;
  --gold-bright: #ffd779;
  --green: #78c977;
  --red: #df6b5d;
  --blue: #70a6d8;
  --radius: 14px;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  min-width: 320px;
  min-height: 100vh;
  color: var(--ink);
  background:
    radial-gradient(circle at 14% 8%, rgba(242, 184, 75, 0.1), transparent 28rem),
    linear-gradient(150deg, #1a1711 0%, #100f0c 100%);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

button { font: inherit; }

.game-shell {
  width: min(1180px, 100%);
  margin: 0 auto;
  padding: clamp(16px, 3vw, 34px);
}

.topbar,
.topbar-actions,
.panel-heading,
.inventory-row,
.upgrade-row,
.purchase-card,
.footer-line {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}

.topbar { margin-bottom: 20px; }
.topbar-actions { align-items: stretch; }
.panel-heading-actions, .upgrade-category-heading { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.panel-heading-actions { flex-wrap: wrap; justify-content: flex-end; }
.session-controls { display: flex; gap: 6px; }
.settings-launch { min-width: 108px; }

.eyebrow,
.section-kicker {
  margin: 0 0 4px;
  color: var(--gold);
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.14em;
}

h1, h2, p { margin-top: 0; }
h1 { margin-bottom: 0; font-size: clamp(1.75rem, 4vw, 3rem); line-height: 1; }
h2 { margin-bottom: 0; font-size: 1.2rem; }

.money-card {
  min-width: 152px;
  padding: 9px 16px;
  border: 1px solid #6e5932;
  border-radius: 12px;
  background: rgba(242, 184, 75, 0.08);
  text-align: right;
}

.money-card span { display: block; color: var(--muted); font-size: 0.72rem; }
.money-card strong { color: var(--gold-bright); font-size: 1.45rem; font-variant-numeric: tabular-nums; }

.startup-status { padding: 40px 0; color: var(--muted); text-align: center; }
.dashboard { display: grid; grid-template-columns: minmax(0, 1fr) 270px; gap: 14px; min-width: 0; }
.callback-glow { box-shadow: 0 0 0 2px rgba(230, 190, 82, .45), 0 0 18px rgba(230, 190, 82, .25); }
.mentor-message { grid-column: 1 / -1; display: flex; align-items: center; gap: 14px; padding: 14px; }
.mentor-portrait-hook { width: 58px; height: 58px; flex: 0 0 58px; border: 1px dashed #806a9b; border-radius: 50%; }
.dashboard > #main-navigation, .dashboard > #sub-navigation, .dashboard > .navigation-feedback, .dashboard > .footer-line { grid-column: 1 / -1; }
.dashboard > .resource-tracker { grid-column: 2; grid-row: 4; align-self: start; position: sticky; top: 12px; }
.resource-tracker-list { display: grid; gap: 7px; }
.resource-tracker-list > div { padding: 8px; border: 1px solid #594d82; border-radius: 8px; background: rgba(0,0,0,.15); }
.resource-tracker-list span { display: block; color: var(--muted); font-size: .7rem; }
.resource-tracker-list strong { display: block; margin-top: 2px; color: #eeeaff; overflow-wrap: anywhere; }
.legacy-project-board { grid-column: 1 / -1; padding: 14px; border: 1px solid #594d82; border-radius: 10px; background: rgba(0,0,0,.14); }
.legacy-project-card { margin-top: 10px; padding: 12px; border: 1px solid #655887; border-radius: 9px; background: rgba(0,0,0,.14); }
.legacy-project-card h3, .legacy-project-card p { margin: 0 0 7px; }
.dashboard[hidden], [hidden] { display: none !important; }

.game-navigation { display: flex; max-width: 100%; overflow-x: auto; scrollbar-width: thin; }
.main-navigation { gap: 8px; padding: 6px; border: 1px solid #4d4335; border-radius: 12px; background: rgba(13, 12, 10, .72); }
.sub-navigation { gap: 4px; margin: 10px 0 16px; padding: 0 4px 8px; border-bottom: 1px solid #4d4335; }
.game-tab { flex: 0 0 auto; min-width: 130px; padding: 11px 18px; border: 1px solid transparent; border-radius: 8px; color: var(--muted); background: transparent; font: inherit; font-weight: 850; cursor: pointer; }
.main-navigation .game-tab { font-size: 1rem; }
.game-tab.active { border-color: #8a6a38; color: var(--gold-bright); background: rgba(242, 184, 75, .12); }
.sub-navigation .game-tab { min-width: 110px; padding: 8px 14px; font-size: .82rem; }
.navigation-feedback { margin: -6px 0 14px; padding: 10px 13px; border: 1px solid #477c49; border-radius: 8px; color: #d9f4d7; background: rgba(49, 80, 51, .55); font-size: .84rem; }
.play-views, .play-area { min-width: 0; }
.dumpster-grid { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr); gap: 16px; }
.area-hero { position: relative; display: flex; align-items: center; justify-content: space-between; gap: 20px; min-height: 118px; margin-bottom: 16px; overflow: hidden; padding: 20px 24px; border: 1px solid #4d4335; border-radius: var(--radius); }
.area-hero h2 { font-size: clamp(1.3rem, 3vw, 1.8rem); }
.area-hero p:last-child { margin: 7px 0 0; color: var(--muted); font-size: .86rem; }
.dumpster-hero { background: linear-gradient(115deg, rgba(49, 57, 40, .96), rgba(29, 30, 25, .96)); }
.employee-hero { background: linear-gradient(115deg, #513c27, #29231c); }
.crew-hero { background: linear-gradient(115deg, #344957, #222b30); }
.management-hero { background: linear-gradient(115deg, #4a4638, #292720); }
.operations-hero { background: linear-gradient(115deg, #303a47, #1c232d); }
.business-hero { border-color: #4d8067; background: linear-gradient(115deg, #24483c, #172d28); }
.area-icon { position: relative; flex: 0 0 105px; height: 74px; opacity: .9; }
.dumpster-icon { display: block; width: 105px; object-fit: contain; object-position: center; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
.sausage-icon::before, .sausage-icon::after { content: ""; position: absolute; top: 20px; width: 70px; height: 25px; border: 4px solid #5f311d; border-radius: 50px; background: #cc7446; }
.sausage-icon::before { left: 4px; transform: rotate(17deg); }.sausage-icon::after { right: 0; top: 38px; transform: rotate(-11deg); }
.sausage-icon span { position: absolute; inset: 7px 24px 10px; border-radius: 8px; background: repeating-linear-gradient(90deg,#b98b45 0 9px,#d9b766 9px 14px); transform: rotate(5deg); }
.crew-icon { display: flex; align-items: flex-end; justify-content: center; gap: 6px; }
.crew-icon i { position: relative; width: 28px; height: 40px; border-radius: 8px 8px 4px 4px; background: #6a9ab4; }.crew-icon i::before { content:""; position:absolute; top:-21px; left:3px; width:22px; height:22px; border-radius:50%; background:#d4a777; }.crew-icon i:nth-child(2){height:50px;background:#d6a34f}.crew-icon i:nth-child(3){background:#758c6b}
.clipboard-icon { width: 76px; height: 72px; margin-right: 12px; border: 4px solid #3d3527; border-radius: 6px; background: #d8c79e; }.clipboard-icon::before { content:""; position:absolute; top:-9px; left:20px; width:31px; height:14px; border-radius:4px; background:#8e7548; }.clipboard-icon span { position:absolute; inset:18px 12px; background:repeating-linear-gradient(#716344 0 3px,transparent 3px 12px); }
.network-icon i { position: absolute; bottom: 5px; width: 25px; border: 3px solid #18212b; background: #7090ab; }.network-icon i::after { content:""; position:absolute; left:4px; right:4px; top:8px; height:28px; background:repeating-linear-gradient(#b8d3e6 0 5px,transparent 5px 10px); }.network-icon i:nth-child(1){left:4px;height:48px}.network-icon i:nth-child(2){left:39px;height:68px}.network-icon i:nth-child(3){right:4px;height:56px}
.ownership-icon { border-bottom: 8px solid #13251f; }
.ownership-icon span { position: absolute; inset: 13px 8px 7px; border: 4px solid #13251f; background: #78aa8f; clip-path: polygon(0 28%, 23% 28%, 23% 10%, 46% 28%, 46% 10%, 70% 28%, 70% 0, 88% 0, 88% 28%, 100% 28%, 100% 100%, 0 100%); }
.ownership-icon i { position: absolute; z-index: 1; bottom: 17px; width: 12px; height: 24px; background: #d2e7d9; }.ownership-icon i:nth-of-type(1){left:27px}.ownership-icon i:nth-of-type(2){left:51px}
.interview-art { position: relative; height: 90px; margin: 14px 0; border-radius: 10px; background: linear-gradient(120deg, rgba(105, 80, 47, .2), rgba(0,0,0,.16)); }
.briefcase-icon { position: absolute; right: 11%; bottom: 14px; width: 86px; height: 51px; border: 4px solid #3b291b; border-radius: 5px; background: #93623b; }.briefcase-icon::before { content:""; position:absolute; left:24px; top:-17px; width:31px; height:17px; border:4px solid #3b291b; border-bottom:0; border-radius:5px 5px 0 0; }.briefcase-icon::after { content:""; position:absolute; left:36px; top:19px; width:10px; height:8px; background:#d1aa5b; }
.shirt-icon { position:absolute; left:13%; top:18px; display:grid; place-items:center; width:55px; height:59px; color:#71849b; background:#d9e1e8; clip-path:polygon(21% 0,40% 10%,60% 10%,79% 0,100% 22%,84% 37%,78% 100%,22% 100%,16% 37%,0 22%); }
.career-area { border-color: #625039; }
.factory-mount:empty { min-height: 1px; }

.panel {
  min-width: 0;
  padding: 20px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: linear-gradient(145deg, rgba(45, 40, 31, 0.96), rgba(31, 28, 22, 0.96));
  box-shadow: 0 16px 45px rgba(0, 0, 0, 0.18);
}

.dig-panel { grid-row: span 2; }
.upgrades-panel,
.automation-panel,
.beach-panel,
.employment-panel { grid-column: 1 / -1; }
.capacity-pill, .value-label, .open-sign { color: var(--muted); font-size: 0.78rem; white-space: nowrap; }
.open-sign { padding: 4px 8px; border: 1px solid #477c49; border-radius: 4px; color: var(--green); font-weight: 800; }

.dumpster-art { position: relative; display: grid; place-items: center; width: min(310px, 80%); height: 170px; margin: 28px auto 22px; }
.dumpster-art-image { display: block; width: 100%; height: 100%; object-fit: contain; object-position: center; }

.button {
  min-height: 42px;
  padding: 10px 15px;
  border: 1px solid transparent;
  border-radius: 9px;
  color: var(--ink);
  background: var(--surface-raised);
  cursor: pointer;
  font-weight: 750;
  transition: filter 120ms ease, opacity 120ms ease;
}

.button:hover:not(:disabled) { filter: brightness(1.1); }
.button:focus-visible { outline: 3px solid rgba(112, 166, 216, .8); outline-offset: 2px; }
.button:disabled { cursor: not-allowed; opacity: .43; }
.button-primary { width: 100%; color: #241908; background: linear-gradient(#ffd36d, #eaa83a); font-size: 1.05rem; }
.button-secondary { width: 100%; border-color: #4f8651; color: #d9f4d7; background: #315033; }
.button-quiet { border-color: var(--line); background: rgba(255,255,255,.03); }
.button-danger-quiet { border-color: #6f3d37; color: #e9a59c; background: rgba(104, 45, 39, .16); }
.button-danger { color: #fff3ef; background: #9b4035; }

.progress-track { height: 9px; margin-top: 12px; overflow: hidden; border-radius: 99px; background: #100f0c; }
.progress-fill { display: block; width: 0; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #d88d32, var(--gold-bright)); }
.progress-track-blue .progress-fill { background: linear-gradient(90deg, #4777a5, #83bce8); }
.progress-track-beach .progress-fill { background: linear-gradient(90deg, #4fa8a4, #99e0ca); }
.progress-track-employment .progress-fill { background: linear-gradient(90deg, #8e6c42, #dfb874); }
.action-status { min-height: 1.4em; margin: 12px 0 0; color: var(--muted); font-size: .88rem; }
.stat-note { margin: 5px 0 0; color: #7f7566; font-size: .75rem; }

.inventory-list, .upgrade-list { display: grid; gap: 8px; margin-top: 15px; }
.empty-state { padding: 22px 10px; border: 1px dashed var(--line); border-radius: 9px; color: #8f8575; text-align: center; font-size: .88rem; }
.inventory-row, .upgrade-row { padding: 10px; border: 1px solid #40392e; border-radius: 9px; background: rgba(0,0,0,.12); }
.item-main, .upgrade-copy { min-width: 0; }
.item-name, .upgrade-name { display: block; font-size: .9rem; font-weight: 750; }
.item-meta, .upgrade-effect { display: block; margin-top: 2px; color: var(--muted); font-size: .72rem; }
.rarity-common { color: #d4caba; } .rarity-uncommon { color: #7fcf83; } .rarity-rare { color: #75b8ea; } .rarity-legendary { color: #d895ef; }
.sell-one { min-height: 34px; padding: 6px 10px; color: var(--gold-bright); background: #443722; font-size: .75rem; white-space: nowrap; }
.inventory-list { grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-rows: repeat(3, minmax(0, 1fr)); }
.inventory-tile { display: grid; min-height: 0; padding: 0; border-color: #536b80; background: #162331; aspect-ratio: 1; }
.inventory-tile:hover:not(:disabled), .inventory-tile:focus-visible { border-color: var(--gold); }
.inventory-tile.is-empty { opacity: .3; }
.inventory-tile-art { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; border: 0; border-radius: inherit; opacity: .72; }
.inventory-tile-scrim { position: absolute; inset: 0; background: linear-gradient(145deg, rgba(10, 18, 25, .08), rgba(10, 18, 25, .68)); pointer-events: none; }
.inventory-tile-count { position: absolute; right: 6px; bottom: 4px; color: var(--gold-bright); font-size: clamp(.78rem, 1vw, 1.05rem); font-weight: 900; line-height: 1; text-shadow: 0 1px 3px #000; }

.shop-copy { margin: 14px 0; color: var(--muted); font-size: .88rem; }
.upgrade-row { align-items: stretch; }
.upgrade-copy { align-self: center; flex: 1; }
.upgrade-buy { align-self: center; width: 190px; min-width: 190px; font-size: .75rem; }
.upgrade-actions { display: flex; width: 220px; min-width: 220px; }
.upgrade-actions .upgrade-buy { width: 100%; min-width: 0; }
.buy-mode-selector { min-height: 34px; padding: 6px 10px; color: var(--gold-bright); font-size: .72rem; white-space: nowrap; }

.automation-grid,
.beach-layout {
  display: grid;
  grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr);
  gap: 18px;
  margin-top: 16px;
}

.operation-status,
.beach-action,
.beach-upgrades {
  min-width: 0;
  padding: 14px;
  border: 1px solid #40392e;
  border-radius: 10px;
  background: rgba(0, 0, 0, .12);
}

.crew-stat span { display: block; color: var(--muted); font-size: .72rem; }
.crew-stat strong { display: block; margin-top: 3px; color: #c7e4fb; font-size: .95rem; }
.progression-purchases { display: grid; gap: 8px; }
.purchase-card { min-width: 0; padding: 10px; border: 1px solid #40392e; border-radius: 9px; background: rgba(0,0,0,.12); }
.purchase-card > div { min-width: 0; }
.upgrade-section { margin-top: 18px; }
.subsection-title { margin-bottom: 8px; color: var(--muted); font-size: .78rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }

.beach-panel {
  border-color: #366b69;
  background:
    radial-gradient(circle at 82% 10%, rgba(246, 207, 94, .12), transparent 18rem),
    linear-gradient(145deg, rgba(36, 66, 66, .96), rgba(24, 43, 43, .96));
}
.beach-kicker { color: #8bd8d0; }
.beach-badge { padding: 5px 9px; border: 1px solid #508d88; border-radius: 99px; color: #a7e2d8; font-size: .7rem; font-weight: 800; }
.beach-layout { grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); }
.beach-art { position: relative; height: 105px; margin: -2px 0 12px; overflow: hidden; border-radius: 8px; background: linear-gradient(#6199b7 0 50%, #d7bd75 50% 100%); }
.sun { position: absolute; top: 12px; right: 18px; width: 30px; height: 30px; border-radius: 50%; background: #f6d56f; box-shadow: 0 0 24px rgba(246, 213, 111, .7); }
.wave { position: absolute; left: -5%; width: 110%; height: 18px; border-radius: 50%; background: rgba(207, 240, 235, .75); }
.wave-one { top: 46px; transform: rotate(-1deg); }
.wave-two { top: 55px; background: #468b9f; transform: rotate(2deg); }
.detector { position: absolute; right: 25%; bottom: 7px; width: 55px; height: 15px; border: 4px solid #34352f; border-radius: 50%; transform: rotate(-8deg); }
.detector::before { content: ""; position: absolute; left: 24px; bottom: 8px; width: 5px; height: 72px; border-radius: 4px; background: #34352f; transform: rotate(-18deg); transform-origin: bottom; }
.detector span { position: absolute; left: 1px; bottom: 63px; width: 27px; height: 14px; border-radius: 4px; background: #d39d3d; transform: rotate(-18deg); }
.button-beach { width: 100%; color: #102625; background: linear-gradient(#a8e7dc, #62b9b0); font-size: 1rem; }
.accessory-progress-card { margin-top: 12px; padding: 11px; border: 1px solid #508d88; border-radius: 8px; background: rgba(11, 43, 41, .32); }
.accessory-list { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.accessory-item { padding: 5px 8px; border: 1px solid #5a625c; border-radius: 99px; color: #9da9a2; background: rgba(0,0,0,.16); font-size: .72rem; }
.accessory-item.complete { border-color: #58a779; color: #d3f5df; background: rgba(69, 139, 96, .2); }

.offline-summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 16px;
  padding: 16px 18px;
  border: 1px solid #51799c;
  border-radius: var(--radius);
  background: linear-gradient(135deg, rgba(51, 83, 109, .9), rgba(34, 49, 62, .95));
}
.offline-summary[hidden] { display: none; }
.offline-summary h2 { margin-bottom: 5px; }
.offline-summary p:last-child { margin-bottom: 0; color: #c5d8e7; font-size: .86rem; }

.employment-panel {
  border-color: #6f5838;
  background:
    linear-gradient(90deg, rgba(176, 119, 49, .08) 1px, transparent 1px) 0 0 / 32px 32px,
    linear-gradient(145deg, rgba(55, 46, 35, .98), rgba(34, 30, 25, .98));
}
.employment-kicker { color: #dfb874; }
.job-badge { padding: 5px 9px; border: 1px solid #8d7048; border-radius: 4px; color: #e2bf84; font-size: .72rem; font-weight: 800; }
.employment-entry { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-top: 16px; }
.employment-entry .action-status { grid-column: 1 / -1; }
.outfit-checklist { grid-column: 1 / -1; padding: 12px; border: 1px solid #514535; border-radius: 10px; background: rgba(0,0,0,.12); }
.outfit-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.outfit-card.complete { border-color: #55714a; background: rgba(82, 121, 67, .12); }
.factory-work { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin-top: 18px; }
.factory-career-overview,
.employee-development { grid-column: 1 / -1; }
.factory-career-overview,
.factory-action,
.factory-packaging,
.factory-automation,
.employee-development { min-width: 0; padding: 14px; border: 1px solid #514535; border-radius: 10px; background: rgba(0,0,0,.14); }
.employment-stats,
.production-resources { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-bottom: 8px; }
.employment-stats div,
.production-resources div { padding: 8px; border-radius: 7px; background: rgba(255,255,255,.035); }
.employment-stats span { display: block; color: var(--muted); font-size: .68rem; }
.employment-stats strong,
.production-resources strong { display: block; margin-top: 2px; color: #edd3a9; font-size: .9rem; }
.production-resources span { display: block; color: var(--muted); font-size: .68rem; }
.button-employment { width: 100%; color: #271d0e; background: linear-gradient(#e4c28d, #bd8e4d); }
.package-grid { display: grid; gap: 8px; }
.package-card { display: grid; grid-template-columns: minmax(0, 1fr) repeat(2, auto); align-items: center; gap: 8px; padding: 10px; border: 1px solid #514535; border-radius: 8px; background: rgba(255,255,255,.025); }
.package-card .upgrade-effect { grid-column: 1 / -1; }
.package-card.locked { opacity: .55; }
.automation-status-list { display: grid; gap: 7px; }
.automation-status { display: flex; justify-content: space-between; gap: 10px; padding: 8px; border-radius: 7px; color: var(--muted); background: rgba(255,255,255,.025); font-size: .74rem; }
.automation-status strong { color: #8f8575; text-align: right; }
.automation-status.active strong { color: var(--green); }
.promotion-card { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 10px; padding: 10px; border: 1px solid #6b5639; border-radius: 9px; background: rgba(184, 134, 66, .08); }
.promotion-card > div { min-width: 0; }
.wardrobe-loadouts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin: 10px 0; }
.wardrobe-loadout { display: grid; grid-template-columns: 1fr auto auto; align-items: center; gap: 8px; padding: 9px; border: 1px solid var(--line); border-radius: 9px; background: rgba(255, 255, 255, .035); }
.wardrobe-loadout span { display: grid; gap: 2px; color: var(--muted); font-size: .82rem; }
.automation-work { display: grid; gap: 5px; margin: 8px 0; }
.automation-status > span { display: grid; flex: 1; gap: 4px; }
.automation-status small { color: var(--muted); }
.automation-status .progress-track { width: 100%; }
.future-marker { margin-top: 10px; padding: 12px; border: 1px solid #8d7048; border-radius: 8px; color: var(--gold-bright); background: rgba(242,184,75,.08); font-size: .82rem; }
.future-marker[hidden] { display: none; }

.business-area { border-color: #416e5a; background: linear-gradient(145deg, rgba(26, 54, 46, .98), rgba(20, 38, 34, .98)); }
.late-game-area { border-color: #65579a; background: linear-gradient(145deg, rgba(33, 28, 61, .98), rgba(18, 24, 44, .98)); }
.late-game-hero { border-color: #7866ad; background: linear-gradient(115deg, #352b61, #1b2946); }
.late-artwork-hook { min-height: 144px; margin: 14px 0; border: 1px solid rgba(153, 139, 207, .28); border-radius: 12px; background: rgba(10, 12, 25, .18); }
.late-resource-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin-bottom: 14px; }
.late-resource-grid > div, .late-action-card, .late-items, .late-coin-panel { padding: 13px; border: 1px solid #594d82; border-radius: 10px; background: rgba(0, 0, 0, .16); }
.late-resource-grid span { display: block; color: #b5a9dc; font-size: .7rem; }
.late-resource-grid strong { display: block; margin-top: 4px; color: #eeeaff; overflow-wrap: anywhere; }
.late-action-card { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 10px; }
.late-action-card .action-status { grid-column: 1 / -1; }
.late-items { display: flex; flex-wrap: wrap; gap: 8px; margin: 14px 0; }
.late-items span { padding: 6px 9px; border-radius: 999px; background: rgba(87, 73, 132, .35); color: #c9c1e8; }
.late-items span.complete { color: #c5f0d2; background: rgba(49, 105, 75, .42); }

/* Active sector commissioning replaces the six-sector catalog rather than
   growing the fixed stage pane beyond its established height. */
.late-items.sector-charter-items { display: block; padding: 8px 11px; margin: 8px 0; }
.sector-charter-content { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.sector-charter-content > strong { font-size: .82rem; }
.sector-charter-cargo { display: flex; align-items: center; flex-wrap: wrap; gap: 5px; }
.sector-charter-cargo .art-object { border-radius: 7px; font-size: .72rem; padding: 4px 7px; white-space: normal; }
.sector-charter-content > button { align-self: start; padding: 5px 10px; min-height: 28px; }
[data-game-composition="mobile"] .late-items.sector-charter-items { padding: 4px 6px; margin: 3px 0; }
[data-game-composition="mobile"] .sector-charter-content { gap: 3px; }
[data-game-composition="mobile"] .sector-charter-content > strong { font-size: .72rem; }
[data-game-composition="mobile"] .sector-charter-cargo { gap: 3px; }
[data-game-composition="mobile"] .sector-charter-cargo .art-object { font-size: .65rem; padding: 2px 4px; }
[data-game-composition="mobile"] .sector-charter-content > button { padding: 3px 6px; min-height: 26px; font-size: .7rem; }

.late-coin-panel { margin: 14px 0; border-color: #c7a947; text-align: center; background: linear-gradient(145deg, rgba(90, 69, 20, .45), rgba(31, 27, 17, .72)); }
.late-coin-panel h3 { color: #ffe48a; letter-spacing: .08em; }
.coin-web-area { display: flex; flex-direction: column; min-height: 0; border-color: #9d7d28; background: radial-gradient(circle at 50% 0, rgba(138,105,25,.24), transparent 42%), #171526; }
.coin-web-hero { border-color: #b8993b; background: linear-gradient(115deg, #5a4518, #262048); }
.coin-web-summary { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 8px; margin: 14px 0; }
.coin-web-summary > div { padding: 10px; border: 1px solid #755f2b; border-radius: 8px; background: rgba(0,0,0,.2); }
.coin-web-summary span { display: block; color: #c9b779; font-size: .68rem; }
.coin-web-summary strong { display: block; margin-top: 3px; color: #fff1ad; overflow-wrap: anywhere; }
.coin-web-summary .button { grid-column: span 6; }
.button-coin { color: #2b2108; background: linear-gradient(#ffe689, #c69b27); }
.coin-web-controls { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 10px; color: #bdb3d2; font-size: .75rem; }
.coin-web-controls label { display: flex; align-items: center; gap: 8px; }
.coin-web-controls select { padding: 7px; border: 1px solid #75622e; border-radius: 6px; color: #f8e9b0; background: #28213c; }
.coin-web-reserves { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 7px; margin-bottom: 10px; }
.coin-web-reserves label { display: grid; gap: 3px; color: #a99fbd; font-size: .62rem; }
.coin-web-reserves input { min-width: 0; padding: 6px; border: 1px solid #5b526d; border-radius: 5px; color: #eee9ff; background: #191626; }
.coin-web-viewport { position: relative; flex: 1 1 auto; min-height: 200px; overflow: hidden; border: 1px solid #66562f; border-radius: 12px; background: radial-gradient(circle, rgba(113,91,38,.13) 1px, transparent 1px) 0 0 / 26px 26px, #11101d; cursor: grab; overscroll-behavior: contain; touch-action: none; user-select: none; -webkit-user-select: none; }
.coin-web-viewport.is-panning { cursor: grabbing; }
.coin-web-viewport.is-panning .coin-web-node { cursor: grabbing; }
.coin-web-world { position: absolute; top: 0; left: 0; transform-origin: 0 0; will-change: transform; }
.coin-web-links { position: absolute; inset: 0; pointer-events: none; }
.coin-web-links line { stroke: #3e3857; stroke-width: 3; }
.coin-web-links line.owned { stroke: #d4b74d; filter: drop-shadow(0 0 4px rgba(255,220,92,.65)); }
.coin-web-node { position: absolute; z-index: 1; display: grid; gap: 3px; width: 240px; min-height: 172px; padding: 10px; border: 1px solid #514a68; border-radius: 13px; color: #d4cde5; text-align: left; background: #211e31; box-shadow: 0 8px 20px rgba(0,0,0,.3); user-select: none; -webkit-user-select: none; }
.coin-web-node > .art-slot { position: absolute; top: 7px; right: 7px; }
.coin-web-node > strong, .coin-web-node > span { padding-right: 34px; }
.coin-web-node strong { color: #eee9ff; font-size: .78rem; }
.coin-web-node span { color: #e3c65f; font-size: .68rem; }
.coin-web-node small { color: #9990ae; font-size: .61rem; line-height: 1.25; }
.coin-web-node em { color: #817992; font-size: .58rem; font-style: normal; }
.coin-web-node[aria-disabled="true"] { cursor: default; }
.coin-web-node.available { border-color: #c7a846; cursor: pointer; box-shadow: 0 0 18px rgba(215,183,69,.24); }
.coin-web-node.owned { border-color: #e3c55b; background: linear-gradient(145deg, #4f421d, #27213b); }
.coin-web-node.owned em { color: #ffe789; }
.coin-confirmation-card { border-color: #a4852d; }
.business-kicker { color: #89d6af; }
.business-acquisition, .business-owner-console { display: grid; gap: 14px; }
.acquisition-card { border-color: #4d8067; background: rgba(61, 116, 89, .13); }
.button-business { color: #10251b; background: linear-gradient(#a9e1c2, #64b88c); }
.business-financials { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.business-financials div, .business-action-card, .owner-draw-card, .business-upgrades { padding: 13px; border: 1px solid #416e5a; border-radius: 10px; background: rgba(0,0,0,.14); }
.business-financials span { display: block; color: #9fc4b1; font-size: .7rem; }
.business-financials strong { display: block; margin-top: 4px; color: #d7f2e4; font-size: .95rem; }
.business-action-card .button { width: 100%; }
.progress-track-business .progress-fill { background: linear-gradient(90deg, #5caf7f, #a5e1bf); }
.owner-draw-card { display: grid; grid-template-columns: minmax(0, 1fr) minmax(150px, .5fr) auto; align-items: end; gap: 10px; }
.owner-draw-card label { color: #b9d6c6; font-size: .78rem; }
.owner-draw-card input { min-width: 0; padding: 9px; border: 1px solid #4d8067; border-radius: 7px; color: var(--ink); background: #183128; }

.developer-badge { padding: 5px 9px; border: 1px solid #9368af; border-radius: 4px; color: #dbb7ef; font-size: .72rem; font-weight: 800; }
.developer-state { min-width: 0; max-height: 390px; margin: 0; overflow: auto; padding: 12px; border: 1px solid #655370; border-radius: 8px; color: #d9c6e4; background: rgba(0,0,0,.25); font: .72rem/1.45 ui-monospace, Consolas, monospace; white-space: pre-wrap; }
.developer-diagnostics-log { max-height: 420px; margin-top: 8px; }

.settings-overlay { position: fixed; inset: 0; z-index: 100; display: grid; place-items: center; padding: 18px; background: rgba(8, 7, 6, .8); }
.settings-overlay[hidden] { display: none; }
.settings-dialog { display: grid; grid-template-rows: auto auto minmax(0, 1fr); width: min(980px, 100%); max-height: min(860px, calc(100dvh - 36px)); overflow: hidden; border: 1px solid #665847; border-radius: 14px; background: #211c17; box-shadow: 0 28px 90px rgba(0,0,0,.65); }
.settings-header { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 18px 20px 12px; }
.settings-header h2 { margin: 2px 0 0; }
.settings-header-actions { display: flex; align-items: center; gap: 8px; }
.settings-tabs { display: flex; gap: 4px; overflow-x: auto; padding: 0 20px; border-bottom: 1px solid #514638; }
.settings-tab { min-width: 92px; padding: 11px 14px; border: 0; border-bottom: 3px solid transparent; color: var(--muted); background: transparent; font: inherit; font-weight: 800; cursor: pointer; }
.settings-tab.active { border-bottom-color: var(--accent); color: var(--text); }
.settings-content { min-height: 0; overflow: auto; padding: 20px; overscroll-behavior: contain; }
.settings-section[hidden] { display: none; }
.settings-info-grid, .stat-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.settings-info-grid > div, .stat-grid > div, .inspector-grid > div { display: grid; gap: 3px; padding: 10px 12px; border: 1px solid #4e4438; border-radius: 8px; background: rgba(255,255,255,.025); }
.settings-info-grid span, .stat-grid span, .inspector-grid span { color: var(--muted); font-size: .72rem; }
.settings-action-card { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 14px; padding: 14px; border: 1px solid #4e4438; border-radius: 9px; }
.settings-action-card h3, .settings-action-card p { margin: 0; }
.settings-action-card p { margin-top: 4px; color: var(--muted); }
.danger-zone { border-color: #704139; }
.statistics-group + .statistics-group, .developer-group + .developer-group { margin-top: 18px; }
.statistics-group h3, .developer-group h3 { margin: 0 0 8px; }
.diagnostic-actions { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0; }
.developer-settings { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.developer-group { min-width: 0; padding: 12px; border: 1px solid #655370; border-radius: 9px; background: rgba(67,45,80,.18); }
.developer-group label { display: grid; gap: 4px; margin-bottom: 8px; color: var(--muted); font-size: .76rem; }
.developer-group input, .developer-group select, #large-number-format { width: 100%; padding: 8px; border: 1px solid #655370; border-radius: 6px; color: var(--text); background: #211b26; }
.developer-button-row { display: flex; flex-wrap: wrap; gap: 6px; }
.developer-button-row .button { flex: 1 1 118px; }
.inspector-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; }
.developer-state-inspector { margin-top: 8px; }

.confirmation-backdrop {
  position: fixed;
  z-index: 20;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 18px;
  background: rgba(5, 5, 4, .76);
  backdrop-filter: blur(5px);
}
.confirmation-backdrop[hidden] { display: none; }
.confirmation-card { width: min(430px, 100%); padding: 22px; border: 1px solid #77453e; border-radius: var(--radius); background: #28211c; box-shadow: 0 24px 70px rgba(0,0,0,.55); }
.confirmation-card p:not(.section-kicker) { color: var(--muted); }
.confirmation-actions { display: flex; justify-content: flex-end; gap: 8px; }

.footer-line { margin-top: 16px; padding: 0 4px; color: #736b5e; font-size: .7rem; }

/* Shared presentation tokens. Composition-specific layout rules follow below. */
:root {
  --ink: #f5f8fb;
  --muted: #b7c3cf;
  --background: #0b1118;
  --surface: #15202b;
  --surface-raised: #1d2c3a;
  --line: #3d5163;
  --gold: #ffc857;
  --gold-bright: #ffe29a;
  --green: #75d6a2;
  --blue: #7fc7ff;
  --accent: #ffb84d;
  --text: var(--ink);
  --hud-height: clamp(50px, 8dvh, 72px);
}

html { min-height: 100%; background: var(--background); }
body {
  min-height: 100dvh;
  background:
    radial-gradient(circle at 18% 0%, rgba(42, 111, 135, .18), transparent 38rem),
    linear-gradient(150deg, #111b25 0%, #080d13 100%);
  font-size: clamp(.9rem, .35vw + .78rem, 1.05rem);
}
input, select { font-size: max(16px, 1em); }
.game-shell { width: min(1540px, 100%); padding: clamp(8px, 1.5vw, 22px) max(clamp(8px, 1.5vw, 22px), env(safe-area-inset-right)) max(clamp(12px, 2vw, 26px), env(safe-area-inset-bottom)) max(clamp(8px, 1.5vw, 22px), env(safe-area-inset-left)); }
.topbar { min-height: 0; margin-bottom: clamp(6px, 1dvh, 12px); }
.topbar h1 { font-size: clamp(1.25rem, 2.6vw, 2rem); }
.eyebrow, .section-kicker { font-size: clamp(.62rem, .2vw + .57rem, .74rem); }
.dashboard { display: grid; grid-template-columns: minmax(0, 1fr); gap: clamp(7px, 1.3dvh, 14px); }
.dashboard > #main-navigation, .dashboard > #sub-navigation, .dashboard > .navigation-feedback, .dashboard > .footer-line, .dashboard > .resource-hud { grid-column: 1; }
.play-views { display: grid; min-height: 0; }
.play-area { max-width: 100%; }
.panel { padding: clamp(12px, 1.5vw, 20px); background: linear-gradient(145deg, rgba(24, 38, 50, .97), rgba(15, 25, 34, .97)); box-shadow: 0 13px 38px rgba(0, 0, 0, .28); }
.dumpster-hero { border-color: #486477; background: linear-gradient(115deg, #20394a, #152632); }
.pawn-panel { border-color: #7d6846; background: linear-gradient(145deg, #273441, #182631); }
.button { min-height: clamp(42px, 6dvh, 50px); }
.button:disabled { border-color: #394957; color: #758390; background: #17212a; opacity: 1; cursor: not-allowed; }
.button:focus-visible, input:focus-visible, select:focus-visible { outline: 3px solid #8bd4ff; outline-offset: 2px; }
.progress-track { height: clamp(10px, 1.8dvh, 16px); background: #071019; border: 1px solid #41566a; }
.progress-fill { background: linear-gradient(90deg, #ffb445, #ffe185); }

.resource-hud {
  position: sticky;
  z-index: 15;
  top: max(0px, env(safe-area-inset-top));
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(110px, 1fr));
  align-items: stretch;
  gap: clamp(5px, .8vw, 9px);
  max-width: 100%;
  min-height: var(--hud-height);
  max-height: 23dvh;
  overflow-x: hidden;
  overflow-y: auto;
  padding: 6px;
  border: 1px solid #49667e;
  border-radius: 12px;
  background: rgba(9, 18, 26, .96);
  box-shadow: 0 8px 26px rgba(0,0,0,.36);
  scrollbar-width: thin;
  backdrop-filter: blur(12px);
}
.hud-resource, .resource-tracker-list > div { min-width: 0; padding: 6px 10px; border: 1px solid #3f586d; border-radius: 8px; background: #142331; }
.hud-resource span, .resource-tracker-list span { display: block; color: var(--muted); font-size: clamp(.62rem, .7vw, .72rem); }
.hud-resource strong, .resource-tracker-list strong { display: block; margin-top: 1px; color: #f6fbff; font-size: clamp(.86rem, 1.3vw, 1.06rem); font-variant-numeric: tabular-nums; }
.hud-money { border-color: #98723b; background: #2a251b; }
.hud-money strong { color: var(--gold-bright); }
.resource-tracker-list { display: contents; }
.hud-settings { min-width: 52px; min-height: 0; }

.game-navigation { max-width: 100%; overflow: visible; }
.main-navigation, .sub-navigation { display: flex; flex-wrap: wrap; align-items: center; }
.main-navigation { gap: 5px; padding: 5px; border-color: #40576b; background: rgba(10, 19, 27, .9); }
.sub-navigation { gap: 4px; margin: 0 0 4px; padding: 0 3px 6px; border-color: #40576b; }
.game-tab { flex: 1 1 112px; min-width: min(112px, 100%); min-height: 40px; padding: 8px 11px; font-size: clamp(.78rem, .25vw + .73rem, .95rem); }
.main-navigation .game-tab { font-size: clamp(.8rem, .35vw + .72rem, 1rem); }
.game-tab.active { border-color: #d69c43; color: #fff0bd; background: #3a2c17; }
@keyframes navigation-attention { 0%, 100% { box-shadow: 0 0 0 1px rgba(255,196,91,.2); } 50% { box-shadow: 0 0 0 3px rgba(255,196,91,.48), 0 0 14px rgba(255,196,91,.22); } }
.callback-glow { animation: navigation-attention 3.8s ease-in-out infinite; }
@media (prefers-reduced-motion: reduce) { .callback-glow { animation: none; box-shadow: 0 0 0 2px rgba(255,196,91,.55); } }

/* Attention remains inside existing tab dimensions and the fixed game canvas. */
@keyframes navigation-attention {
  0%, 100% { box-shadow: inset 0 0 0 2px #ffe89c, inset 0 0 15px rgba(255,206,61,.2); }
  45% { box-shadow: inset 0 0 0 3px #fff3bd, inset 0 0 27px rgba(255,215,78,.6); }
}
@keyframes navigation-sheen {
  0%, 7% { opacity: 0; transform: translateX(-135%) skewX(-25deg); }
  14% { opacity: .95; }
  36% { opacity: .95; transform: translateX(135%) skewX(-25deg); }
  39%, 100% { opacity: 0; transform: translateX(135%) skewX(-25deg); }
}
.callback-glow {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  border-color: #ffdc6c !important;
  color: #fff5c7 !important;
  background: #483211 !important;
  animation: navigation-attention 3.9s ease-in-out infinite;
}
.callback-glow::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background: linear-gradient(105deg, transparent 10%, rgba(255,248,197,.14) 29%, rgba(255,255,240,.95) 48%, rgba(255,237,117,.25) 63%, transparent 80%);
  transform: translateX(-135%) skewX(-25deg);
  animation: navigation-sheen 3.9s ease-in-out infinite;
}
.callback-glow::after {
  content: "";
  position: absolute;
  top: 5px;
  right: 5px;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #fff9d1;
  box-shadow: 0 0 0 2px #9d6611, 0 0 8px #fff1a2;
  pointer-events: none;
}
@media (prefers-reduced-motion: reduce) {
  .callback-glow { animation: none; box-shadow: inset 0 0 0 3px #ffec88, inset 0 0 20px rgba(255,222,67,.5); }
  .callback-glow::before { animation: none; opacity: 0; }
}

.buy-mode-selector { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 3px; min-width: min(100%, 490px); padding: 3px; border: 1px solid #4a6073; border-radius: 10px; background: #0d1821; }
.buy-mode-option { min-width: 0; min-height: 38px; padding: 6px 7px; border: 1px solid transparent; border-radius: 7px; color: #b8c7d4; background: #172633; font: inherit; font-size: clamp(.68rem, .2vw + .64rem, .8rem); font-weight: 800; cursor: pointer; }
.buy-mode-option.active { border-color: #db9f44; color: #1a1308; background: #ffc45c; }
.upgrade-category-heading, .panel-heading { flex-wrap: wrap; }
.upgrade-row, .purchase-card, .legacy-project-card, .clothing-card { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: clamp(8px, 1vw, 14px); }
.upgrade-copy, .item-main { min-width: 0; }

.art-slot { width: clamp(54px, 5vw, 74px); height: clamp(46px, 4.5vw, 64px); flex: 0 0 auto; border: 1px solid #536b80; border-radius: 9px; background: #162331; object-fit: cover; user-select: none; -webkit-user-drag: none; pointer-events: none; }
.art-slot-small { width: 30px; height: 26px; border-radius: 5px; }
.modal-art { width: min(180px, 46vw); height: auto; margin-bottom: 12px; }
.art-info-card { display: flex; align-items: center; gap: 12px; margin: 10px 0; padding: 10px; border: 1px solid #4b6072; border-radius: 9px; background: #12212d; }
.art-info-card p { margin: 0; color: var(--muted); }
.art-object { display: inline-flex !important; align-items: center; gap: 6px; }
.inventory-row { min-height: 62px; }
.accessory-item { display: inline-flex; align-items: center; gap: 5px; }

.job-layout { display: grid; grid-template-columns: minmax(280px, .82fr) minmax(280px, 1.18fr); gap: clamp(12px, 2vw, 22px); margin-top: 14px; }
.paper-doll { align-self: start; min-width: 0; padding: clamp(11px, 1.5vw, 18px); border: 1px solid #4b6680; border-radius: 12px; background: #101e29; }
.paper-doll-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; }
.paper-doll-heading h3, .buff-summary h4 { margin: 0; }
.paper-doll-slots { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; margin-top: 11px; }
.paper-doll-slot { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 7px; min-width: 0; padding: 7px; border: 1px solid #3f5669; border-radius: 8px; background: #172936; }
.paper-doll-slot > span { grid-column: 1 / -1; color: #9fb0bf; font-size: .65rem; font-weight: 800; text-transform: uppercase; }
.paper-doll-slot strong { overflow-wrap: anywhere; font-size: .78rem; }
.buff-summary { display: grid; align-content: start; gap: 7px; min-width: 0; padding: clamp(11px, 1.5vw, 18px); border: 1px solid #4b6680; border-radius: 12px; background: #101e29; }
.buff-summary span { color: #d7e4ee; font-size: .78rem; }
.buff-entry { display: grid; gap: 2px; padding: 7px 8px; border: 1px solid #49647a; border-radius: 7px; background: #172936; }
.buff-entry.inactive { border-color: #36434d; background: #171d22; opacity: .58; filter: grayscale(1); }
.buff-entry small { color: var(--muted); }
.employment-entry { grid-column: 1 / -1; }
.clothing-shop { grid-column: 1 / -1; margin-top: 12px; padding: clamp(10px, 1.3vw, 16px); border: 1px solid #94723e; border-radius: 11px; background: #20271f; }
.currency-badge { padding: 5px 8px; border: 1px solid #bb8e47; border-radius: 99px; color: #ffe3a2; font-size: .7rem; font-weight: 800; }
.clothing-shop-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 290px), 1fr)); gap: 8px; }
.clothing-card { padding: 9px; border: 1px solid #4e6256; border-radius: 9px; background: #17251f; }
.clothing-card.equipped { border-color: #d3a857; background: #2b2d1d; }
.clothing-card div { display: grid; gap: 2px; }
.clothing-card span, .clothing-card small { color: var(--muted); }
.clothing-variant { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 4px; }
.package-card { grid-template-columns: auto minmax(0, 1fr) auto; }
.package-card .upgrade-effect { grid-column: 2 / -1; }
.production-resources div { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 2px 7px; }
.production-resources div > span, .production-resources div > strong { grid-column: 2; }
.production-resources div > .art-slot { grid-column: 1; grid-row: 1 / span 2; }

.audio-settings { display: grid; gap: 12px; margin-top: 14px; padding: 14px; border: 1px solid #496075; border-radius: 9px; background: #111e29; }
.audio-settings h3, .audio-settings p { margin: 0; }
.audio-settings p { margin-top: 4px; color: var(--muted); }
.audio-control-grid { display: grid; gap: 8px; }
.audio-control-grid label { display: grid; grid-template-columns: 70px minmax(100px, 1fr) 86px; align-items: center; gap: 9px; }
.audio-control-grid input { width: 100%; }
.first-run-modal { z-index: 220; }
.confirmation-backdrop { z-index: 210; padding: max(14px, env(safe-area-inset-top)) max(14px, env(safe-area-inset-right)) max(14px, env(safe-area-inset-bottom)) max(14px, env(safe-area-inset-left)); }
.confirmation-card { max-height: calc(100dvh - 28px); overflow: auto; border-color: #60778c; background: #13222e; }

@container (max-width: 560px) {
  .upgrade-row, .purchase-card { grid-template-columns: auto minmax(0, 1fr); }
  .upgrade-actions, .purchase-card > .button, .purchase-card > .upgrade-actions { grid-column: 1 / -1; width: 100%; }
}
.panel, .employment-entry, .business-upgrades { container-type: inline-size; }

/* Platform composition layer. Desktop is always one fixed 1920x1080 game canvas. */
html, body { width: 100%; height: 100%; overflow: hidden; }
body { margin: 0; padding: 0; }
.game-stage {
  position: fixed;
  left: 50%;
  top: 50%;
  width: var(--frame-width, 1920px);
  height: var(--frame-height, 1080px);
  overflow: hidden;
  border-radius: 4px;
  background: #05090d;
  box-shadow: 0 0 0 1px #263746, 0 24px 90px rgba(0,0,0,.7);
  transform: translate(-50%, -50%) scale(var(--host-scale, 1));
  transform-origin: center;
}
.game-presentation {
  position: relative;
  width: var(--logical-width, 1920px);
  height: var(--logical-height, 1080px);
  overflow: hidden;
  transform: scale(var(--presentation-scale, 1));
  transform-origin: top left;
}

/* Structural shell rows never depend on the transient offline-return message.
   The summary is an overlay, so showing or dismissing it cannot move, resize,
   or steal height from any gameplay geometry. */
:is([data-game-composition="desktop"], [data-game-composition="mobile"]) .game-shell {
  position: relative;
}
:is([data-game-composition="desktop"], [data-game-composition="mobile"]) .game-shell > .topbar { grid-row: 1; }
:is([data-game-composition="desktop"], [data-game-composition="mobile"]) .game-shell > .startup-status { grid-row: 2; }
:is([data-game-composition="desktop"], [data-game-composition="mobile"]) .game-shell > .dashboard { grid-row: 3; }
:is([data-game-composition="desktop"], [data-game-composition="mobile"]) .game-shell > .footer-line { grid-row: 4; }

[data-game-composition="desktop"] body { font-size: 15px; }
[data-game-composition="desktop"] .game-shell {
  box-sizing: border-box;
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr) auto;
  width: 1920px;
  height: 1080px;
  max-width: none;
  margin: 0;
  padding: 16px 22px 12px;
}
[data-game-composition="desktop"] .topbar { min-height: 54px; margin-bottom: 6px; align-items: center; flex-direction: row; }
[data-game-composition="desktop"] .topbar h1 { font-size: 1.7rem; }
[data-game-composition="desktop"] .topbar .eyebrow { display: block; }
[data-game-composition="desktop"] .topbar-actions { width: auto; flex-direction: row; }
[data-game-composition="desktop"] .session-controls { flex: none; }
[data-game-composition="desktop"] .dashboard {
  position: relative;
  display: grid;
  grid-template-rows: 58px 43px 39px minmax(0, 1fr);
  grid-template-columns: minmax(0, 1fr);
  gap: 6px;
  min-height: 0;
  overflow: hidden;
}
[data-game-composition="desktop"] .navigation-feedback { position: absolute; z-index: 30; top: 145px; left: 50%; transform: translateX(-50%); }
[data-game-composition="desktop"] .legacy-project-board { position: absolute; z-index: 12; right: 12px; bottom: 12px; width: min(560px, 42%); max-height: 300px; overflow: auto; }
[data-game-composition="desktop"] .resource-hud {
  position: static;
  grid-template-columns: repeat(auto-fit, minmax(80px, 1fr));
  gap: 3px;
  min-height: 0;
  max-height: none;
  overflow: hidden;
  padding: 4px;
}
[data-game-composition="desktop"] .hud-resource,
[data-game-composition="desktop"] .resource-tracker-list > div { padding: 4px 8px; }
[data-game-composition="desktop"] .hud-resource span,
[data-game-composition="desktop"] .resource-tracker-list span { overflow: hidden; font-size: .56rem; white-space: nowrap; text-overflow: ellipsis; }
[data-game-composition="desktop"] .main-navigation,
[data-game-composition="desktop"] .sub-navigation {
  position: static;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  width: auto;
  max-height: none;
  overflow: hidden;
  padding: 3px;
  border-width: 1px;
  border-radius: 10px;
  box-shadow: none;
}
[data-game-composition="desktop"] .game-tab { flex: 1 1 0; min-width: 0; min-height: 34px; padding: 5px 8px; font-size: .82rem; }
[data-game-composition="desktop"] .play-views { min-height: 0; overflow: hidden; }
[data-game-composition="desktop"] .play-views > .play-area {
  box-sizing: border-box;
  width: 100%;
  height: 100%;
  max-height: none;
  overflow: hidden;
  padding: 12px;
}
[data-game-composition="desktop"] .panel { padding: 11px; }
[data-game-composition="desktop"] .area-hero { min-height: 68px; margin-bottom: 8px; padding: 8px 16px; }
[data-game-composition="desktop"] .area-icon { flex-basis: 100px; transform: scale(.68); }
[data-game-composition="desktop"] .button { min-height: 36px; padding: 7px 11px; }
[data-game-composition="desktop"] .art-slot { width: 48px; height: 42px; }
[data-game-composition="desktop"] .buy-mode-option { min-height: 32px; padding: 4px; }
[data-game-composition="desktop"] .upgrade-row,
[data-game-composition="desktop"] .purchase-card,
[data-game-composition="desktop"] .legacy-project-card,
[data-game-composition="desktop"] .clothing-card { grid-template-columns: auto minmax(0, 1fr) auto; gap: 7px; padding: 6px; }
[data-game-composition="desktop"] .upgrade-list { gap: 5px; }
[data-game-composition="desktop"] .package-card { grid-template-columns: auto minmax(0, 1fr) auto; }
[data-game-composition="desktop"] .dumpster-grid {
  grid-template-columns: 1.05fr .9fr 1.25fr;
  grid-template-rows: minmax(0, 1fr) auto;
  gap: 8px;
  height: calc(100% - 78px);
}
[data-game-composition="desktop"] .dig-panel { grid-column: 1; grid-row: 1; }
[data-game-composition="desktop"] .inventory-panel { display: grid; grid-column: 2; grid-row: 1 / span 2; grid-template-rows: auto minmax(0, 1fr); min-height: 0; overflow: hidden; }
[data-game-composition="desktop"] .inventory-panel .inventory-list { min-height: 0; margin-top: 8px; }
[data-game-composition="desktop"] .inventory-tile { width: 100%; height: 100%; aspect-ratio: auto; }
[data-game-composition="desktop"] .pawn-panel { grid-column: 1; grid-row: 2; padding-block: 8px; }
[data-game-composition="desktop"] .pawn-panel .shop-copy { margin: 6px 0; }
[data-game-composition="desktop"] .pawn-panel .action-status { margin-top: 6px; }
[data-game-composition="desktop"] .upgrades-panel { grid-column: 3; grid-row: 1; min-height: 0; overflow: hidden; }
[data-game-composition="desktop"] .automation-panel { grid-column: 3; grid-row: 2; min-height: 0; }
[data-game-composition="desktop"] .automation-grid { grid-template-columns: .8fr 1.2fr; gap: 8px; }
[data-game-composition="desktop"] .dumpster-art { height: 150px; margin: 8px 0; transform: scale(.82); }
[data-game-composition="desktop"] .beach-layout { grid-template-columns: .8fr 1.05fr .85fr; gap: 10px; }
[data-game-composition="desktop"] .job-layout { grid-template-columns: .62fr .62fr 1.76fr; gap: 9px; margin-top: 7px; }
[data-game-composition="desktop"] .employment-entry { grid-column: 3; }
[data-game-composition="desktop"] .clothing-shop { overflow: hidden; }
[data-game-composition="desktop"] .clothing-shop-filters { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 5px; margin: 8px 0; }
[data-game-composition="desktop"] .clothing-shop-filters .game-tab { text-transform: capitalize; }
[data-game-composition="desktop"] .clothing-shop-list { grid-template-columns: repeat(4, minmax(0, 1fr)); }
[data-game-composition="desktop"] .factory-work {
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 8px;
  margin-top: 6px;
}
[data-game-composition="desktop"] .factory-career-overview { grid-column: 1 / -1; display: grid; grid-template-columns: 1.35fr 1fr; gap: 8px; }
[data-game-composition="desktop"] .factory-work[data-career-area="employee"] .factory-action { grid-column: 1 / span 4; }
[data-game-composition="desktop"] .factory-work[data-career-area="employee"] .factory-packaging { grid-column: 5 / span 4; }
[data-game-composition="desktop"] .factory-work[data-career-area="employee"] .employee-development { grid-column: 9 / span 4; grid-row: 2; }
[data-game-composition="desktop"] .factory-work[data-career-area="crew"] .factory-automation { grid-column: 1 / span 4; }
[data-game-composition="desktop"] .factory-work[data-career-area="crew"] .employee-development { grid-column: 5 / span 8; grid-row: 2; }
[data-game-composition="desktop"] .factory-work[data-career-area="management"] .factory-packaging,
[data-game-composition="desktop"] .factory-work[data-career-area="operations"] .factory-packaging { grid-column: 1 / span 4; }
[data-game-composition="desktop"] .factory-work[data-career-area="management"] .factory-automation,
[data-game-composition="desktop"] .factory-work[data-career-area="operations"] .factory-automation { grid-column: 5 / span 8; }
[data-game-composition="desktop"] .factory-work[data-career-area="management"] .employee-development,
[data-game-composition="desktop"] .factory-work[data-career-area="operations"] .employee-development { grid-column: 1 / -1; grid-row: 3; }
[data-game-composition="desktop"] .factory-work[data-career-area="management"] .employee-development .upgrade-list,
[data-game-composition="desktop"] .factory-work[data-career-area="operations"] .employee-development .upgrade-list { grid-template-columns: repeat(4, minmax(0, 1fr)); }
[data-game-composition="desktop"] .employment-stats,
[data-game-composition="desktop"] .production-resources { grid-template-columns: repeat(auto-fit, minmax(112px, 1fr)); }
[data-game-composition="desktop"] .business-financials,
[data-game-composition="desktop"] .late-resource-grid,
[data-game-composition="desktop"] .coin-web-summary { grid-template-columns: repeat(4, minmax(0, 1fr)); }
[data-game-composition="desktop"] .developer-settings { grid-template-columns: repeat(3, minmax(0, 1fr)); }
[data-game-composition="desktop"] .inspector-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
[data-game-composition="desktop"] .outfit-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
[data-game-composition="desktop"] .package-grid { grid-template-columns: 1fr; }
[data-game-composition="desktop"] .recycling-panel .upgrade-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
[data-game-composition="desktop"] .recycling-control-grid { display: grid; grid-template-columns: 1.3fr 1fr; gap: 10px; align-items: center; }
[data-game-composition="desktop"] .late-game-area .business-upgrades { display: grid; grid-template-columns: 360px minmax(0, 1fr); gap: 10px; }
[data-game-composition="desktop"] .late-game-area .upgrade-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
[data-game-composition="desktop"] .late-game-area .area-hero { margin-bottom: 5px; }
[data-game-composition="desktop"] .footer-line { margin-top: 4px; }
[data-game-composition="desktop"] .settings-overlay,
[data-game-composition="desktop"] .confirmation-backdrop { position: absolute; }
[data-game-composition="desktop"] .settings-overlay { place-items: center; padding: 18px; }
[data-game-composition="desktop"] .settings-dialog { width: min(1180px, 100%); max-height: 1000px; border-radius: 14px; }
[data-game-composition="desktop"] .settings-info-grid,
[data-game-composition="desktop"] .stat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
[data-game-composition="desktop"] .settings-action-card,
[data-game-composition="desktop"] .promotion-card { align-items: center; flex-direction: row; }
[data-game-composition="desktop"] .factory-pane-tabs {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 5px;
  padding: 3px;
  border: 1px solid #40576b;
  border-radius: 9px;
  background: rgba(10, 19, 27, .9);
}
[data-game-composition="desktop"] .factory-pane-tabs .game-tab { min-height: 32px; padding: 4px 8px; }
[data-game-composition="desktop"] .factory-upgrade-tabs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px; margin: 5px 0; }
[data-game-composition="desktop"] .factory-upgrade-tabs .game-tab { min-height: 28px; padding: 3px 6px; font-size: .72rem; }

.automation-status { grid-template-columns: minmax(0, 1fr) auto; align-items: center; }
.automation-toggle { min-width: 86px; border-color: #596675; background: #202a33; }
.automation-toggle.active,
.automation-toggle[aria-pressed="true"] { border-color: #5cae7d; color: #dff8e8; background: #214934; }

/* Mobile is a separate touch-first composition, never a shrunken desktop canvas. */
[data-game-composition="mobile"] .game-presentation { font-size: 15px; }
[data-game-composition="mobile"] .game-shell {
  box-sizing: border-box;
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr) auto;
  width: var(--logical-width);
  height: var(--logical-height);
  margin: 0;
  padding:
    max(8px, var(--device-safe-top), env(safe-area-inset-top))
    max(8px, var(--device-safe-right), env(safe-area-inset-right))
    max(82px, calc(var(--device-safe-bottom) + 62px), calc(env(safe-area-inset-bottom) + 62px))
    max(8px, var(--device-safe-left), env(safe-area-inset-left));
  overflow: hidden;
}
[data-game-composition="mobile"] .topbar { min-height: 42px; margin-bottom: 5px; align-items: center; flex-direction: row; }
[data-game-composition="mobile"] .topbar h1 { font-size: 1.18rem; }
[data-game-composition="mobile"] .topbar .eyebrow { display: none; }
[data-game-composition="mobile"] .dashboard { position: relative; display: grid; grid-template-rows: auto auto minmax(0, 1fr); gap: 5px; min-height: 0; overflow: hidden; }
[data-game-composition="mobile"] .navigation-feedback { position: absolute; z-index: 30; top: 118px; left: 8px; right: 8px; }
[data-game-composition="mobile"] .legacy-project-board { position: absolute; z-index: 12; right: 8px; bottom: 8px; left: 8px; max-height: 42%; overflow: auto; }
[data-game-composition="mobile"] .resource-hud { position: static; grid-template-columns: repeat(2, minmax(0, 1fr)); max-height: 112px; overflow-y: auto; }
[data-game-composition="mobile"] .main-navigation {
  position: absolute;
  z-index: 40;
  right: max(0px, var(--device-safe-right), env(safe-area-inset-right));
  bottom: max(0px, var(--device-safe-bottom), env(safe-area-inset-bottom));
  left: max(0px, var(--device-safe-left), env(safe-area-inset-left));
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  max-height: 156px;
  overflow-y: auto;
  padding: 5px;
}
[data-game-composition="mobile"] .sub-navigation { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 0; padding: 2px; }
[data-game-composition="mobile"] .game-tab { min-width: 0; min-height: 44px; padding: 5px; }
[data-game-composition="mobile"] .play-views { min-height: 0; overflow: hidden; }
[data-game-composition="mobile"] .play-views > .play-area { box-sizing: border-box; height: 100%; max-height: none; overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; padding: 10px; }
[data-game-composition="mobile"] .panel { padding: 10px; }
[data-game-composition="mobile"] .area-hero { min-height: 66px; margin-bottom: 7px; padding: 9px; }
[data-game-composition="mobile"] .area-icon { display: none; }
[data-game-composition="mobile"] .dumpster-grid,
[data-game-composition="mobile"] .automation-grid,
[data-game-composition="mobile"] .beach-layout,
[data-game-composition="mobile"] .job-layout,
[data-game-composition="mobile"] .factory-work { grid-template-columns: 1fr; height: auto; }
[data-game-composition="mobile"] .factory-pane-tabs { grid-column: 1; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px; padding: 3px; border: 1px solid #40576b; border-radius: 9px; background: rgba(10, 19, 27, .9); }
[data-game-composition="mobile"] .factory-pane-tabs .game-tab { min-width: 0; }
[data-game-composition="mobile"] .factory-upgrade-tabs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px; margin: 5px 0; }
[data-game-composition="mobile"] .factory-upgrade-tabs .game-tab { min-width: 0; }
[data-game-composition="mobile"] .dig-panel,
[data-game-composition="mobile"] .inventory-panel,
[data-game-composition="mobile"] .pawn-panel,
[data-game-composition="mobile"] .upgrades-panel,
[data-game-composition="mobile"] .automation-panel,
[data-game-composition="mobile"] .factory-career-overview,
[data-game-composition="mobile"] .factory-action,
[data-game-composition="mobile"] .factory-packaging,
[data-game-composition="mobile"] .factory-automation,
[data-game-composition="mobile"] .employee-development,
[data-game-composition="mobile"] .employment-entry,
[data-game-composition="mobile"] .clothing-shop { grid-column: 1; grid-row: auto; }
[data-game-composition="mobile"] .buy-mode-selector { width: 100%; min-width: 0; }
[data-game-composition="mobile"] .clothing-shop-filters { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px; }
[data-game-composition="mobile"] .buy-mode-option { min-height: 44px; padding: 3px 1px; font-size: .64rem; }
[data-game-composition="mobile"] .upgrade-row,
[data-game-composition="mobile"] .purchase-card,
[data-game-composition="mobile"] .legacy-project-card,
[data-game-composition="mobile"] .clothing-card { grid-template-columns: auto minmax(0, 1fr); }
[data-game-composition="mobile"] .upgrade-actions,
[data-game-composition="mobile"] .purchase-card > .button,
[data-game-composition="mobile"] .purchase-card > .upgrade-actions,
[data-game-composition="mobile"] .clothing-card > .button { grid-column: 1 / -1; width: 100%; }
[data-game-composition="mobile"] .settings-overlay,
[data-game-composition="mobile"] .confirmation-backdrop { position: absolute; padding: max(8px, var(--device-safe-top)) max(8px, var(--device-safe-right)) max(8px, var(--device-safe-bottom)) max(8px, var(--device-safe-left)); }
[data-game-composition="mobile"] .settings-dialog { width: 100%; max-height: 100%; border-radius: 8px; }
[data-game-composition="mobile"] .settings-header,
[data-game-composition="mobile"] .settings-content { padding-inline: 10px; }
[data-game-composition="mobile"] .developer-settings,
[data-game-composition="mobile"] .inspector-grid { grid-template-columns: 1fr; }

/* Keep one genuine 118px landscape rail: the navigation is an absolute
   child of .dashboard, not an independent .game-shell grid item. Reserve
   that rail once in the shell and leave only the actual device safe inset. */
[data-game-composition="mobile"][data-game-orientation="landscape"] .game-shell {
  grid-template-columns: minmax(0, 1fr) 118px;
  grid-template-rows: auto auto minmax(0, 1fr) auto;
  padding-right: max(8px, var(--device-safe-right), env(safe-area-inset-right));
  padding-bottom: max(8px, var(--device-safe-bottom));
}
[data-game-composition="mobile"][data-game-orientation="landscape"] .topbar,
[data-game-composition="mobile"][data-game-orientation="landscape"] .startup-status,
[data-game-composition="mobile"][data-game-orientation="landscape"] .dashboard,
[data-game-composition="mobile"][data-game-orientation="landscape"] .footer-line { grid-column: 1; }
/* The dashboard owns this nav in the DOM, but the dashboard can be much
   shorter than the landscape device. Anchor the six-control side rail to
   the transformed full game presentation, not the dashboard's shortened
   vertical rectangle; the shell's second column reserves its full width. */
[data-game-composition="mobile"][data-game-orientation="landscape"] .dashboard {
  overflow: visible;
}
[data-game-composition="mobile"][data-game-orientation="landscape"] .main-navigation {
  position: fixed;
  top: max(0px, var(--device-safe-top), env(safe-area-inset-top));
  right: max(8px, var(--device-safe-right), env(safe-area-inset-right));
  bottom: max(0px, var(--device-safe-bottom), env(safe-area-inset-bottom));
  left: auto;
  width: 118px;
  max-height: none;
  grid-template-columns: 1fr;
}
[data-game-composition="mobile"][data-game-orientation="landscape"] .resource-hud { grid-template-columns: repeat(4, minmax(0, 1fr)); max-height: 72px; }
[data-game-composition="mobile"][data-game-orientation="landscape"] .play-views > .play-area { padding: 8px; }
[data-game-composition="mobile"][data-game-orientation="landscape"] .dumpster-grid,
[data-game-composition="mobile"][data-game-orientation="landscape"] .beach-layout,
[data-game-composition="mobile"][data-game-orientation="landscape"] .factory-work { grid-template-columns: repeat(2, minmax(0, 1fr)); }

/* Fixed desktop gameplay is a finite composition: cards spend width before height. */
.compact-upgrade-card { position: relative; display: grid; min-width: 0; min-height: 76px; overflow: hidden; padding: 10px 12px; border: 1px solid #5c513b; border-radius: 9px; color: var(--ink); background: #27231c; text-align: left; cursor: pointer; isolation: isolate; }
.compact-upgrade-card:focus-visible { outline: 2px solid var(--gold-bright); outline-offset: 2px; }
.compact-upgrade-card:hover, .compact-upgrade-card:focus-visible { border-color: var(--gold); }
.compact-upgrade-card.is-unavailable { opacity: .78; cursor: default; }
.compact-upgrade-art { position: absolute; z-index: 0; inset: 0; width: 100%; height: 100%; max-width: none; object-fit: cover; opacity: .19; pointer-events: none; }
.compact-upgrade-scrim { position: absolute; z-index: 1; inset: 0; pointer-events: none; background: linear-gradient(105deg, rgba(20,18,14,.94), rgba(20,18,14,.7)); }
.compact-upgrade-card:hover .compact-upgrade-art, .compact-upgrade-card:focus-visible .compact-upgrade-art { opacity: .31; }
.compact-upgrade-copy { position: relative; z-index: 2; display: grid; align-content: center; gap: 2px; min-width: 0; }
.compact-upgrade-copy strong, .compact-upgrade-copy small, .compact-upgrade-copy em { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.compact-upgrade-copy strong { font-size: .92rem; }
.compact-upgrade-copy small { color: var(--muted); font-size: .78rem; }
.compact-upgrade-copy em { color: var(--gold-bright); font-size: .82rem; font-style: normal; font-weight: 800; }
.upgrade-detail-surface { position: absolute; z-index: 100; box-sizing: border-box; max-width: calc(100% - 24px); padding: 12px; border: 1px solid var(--gold); border-radius: 9px; color: var(--ink); background: rgba(25,22,16,.98); box-shadow: 0 12px 28px rgba(0,0,0,.45); pointer-events: none; }
.upgrade-detail-surface p { margin: 6px 0 0; color: var(--muted); font-size: .82rem; }
.upgrade-detail-surface p:nth-last-child(-n + 2) { color: var(--ink); }

[data-game-composition="desktop"] .upgrade-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(175px, 1fr)); gap: 6px; }
[data-game-composition="desktop"] .compact-upgrade-card { min-height: 62px; padding: 7px 9px; }
[data-game-composition="desktop"] .compact-upgrade-copy strong { font-size: .83rem; }
[data-game-composition="desktop"] .compact-upgrade-copy small, [data-game-composition="desktop"] .compact-upgrade-copy em { font-size: .73rem; }
[data-game-composition="desktop"] .recycling-panel .upgrade-list, [data-game-composition="desktop"] .late-game-area .upgrade-list, [data-game-composition="desktop"] .factory-work .upgrade-list { grid-template-columns: repeat(3, minmax(0, 1fr)); }
[data-game-composition="desktop"] .business-upgrades .upgrade-list { grid-template-columns: repeat(4, minmax(0, 1fr)); }
[data-game-composition="desktop"] .recycling-panel, [data-game-composition="desktop"] .business-area, [data-game-composition="desktop"] .late-game-area, [data-game-composition="desktop"] .clothing-shop, [data-game-composition="desktop"] .employment-panel { align-content: start; }
[data-game-composition="desktop"] .recycling-panel > *, [data-game-composition="desktop"] .business-area > *, [data-game-composition="desktop"] .late-game-area > * { margin-top: 0; margin-bottom: 0; }

/* Real portfolio goods use one bounded producer page, never a growing list. */
.play-views > .materials-area { display: flex; flex-direction: column; gap: 9px; min-height: 0; overflow: hidden; }
.material-navigation { display: flex; align-items: center; justify-content: center; gap: 20px; min-width: 0; flex: 0 0 auto; }
.material-current { display: grid; gap: 8px; min-height: 0; }
.material-current > header { display: flex; flex-wrap: wrap; align-items: baseline; gap: 12px; }
.material-current h3, .material-current p { margin: 0; }
.material-detail-tabs { display: none; }
.material-production-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px; min-height: 0; }
.material-production-card { display: flex; flex-direction: column; justify-content: space-between; gap: 8px; min-width: 0; padding: 12px; border: 1px solid #66579c; border-radius: 10px; }
.material-production-card strong { overflow-wrap: anywhere; }
.material-production-card .button { width: 100%; white-space: normal; }
.material-production-footer { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-width: 0; flex: 0 0 auto; }
.material-production-footer p { margin: 0; font-size: .78rem; }
.material-production-footer .buy-mode-selector { flex: 0 0 auto; min-width: 340px; }
[data-game-composition="mobile"] .play-views > .materials-area { overflow: hidden; display: flex; padding: 6px; gap: 5px; }
[data-game-composition="mobile"] .materials-area .area-hero { min-height: 43px; max-height: 55px; padding: 5px; margin: 0; }
[data-game-composition="mobile"] .materials-area .area-hero p:last-child { display: none; }
[data-game-composition="mobile"] .material-navigation { gap: 5px; }
[data-game-composition="mobile"] .material-navigation .button { min-height: 28px; padding: 2px 8px; }
[data-game-composition="mobile"] .material-detail-tabs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px; }
[data-game-composition="mobile"] .material-detail-tabs .button { min-height: 25px; padding: 3px; font-size: .7rem; }
[data-game-composition="mobile"] .material-detail-tabs .active { border-color: #e7ba68; color: #fff0bd; }
[data-game-composition="mobile"] .material-current { gap: 4px; }
[data-game-composition="mobile"] .material-current > header { gap: 8px; font-size: .8rem; }
[data-game-composition="mobile"] .material-current > header h3 { font-size: 1rem; }
[data-game-composition="mobile"] .material-production-grid { display: block; min-height: 0; }
[data-game-composition="mobile"] .material-production-card { display: none; gap: 3px; padding: 7px; }
[data-game-composition="mobile"] .materials-area[data-material-view="stock"] [data-material-section="stock"],
[data-game-composition="mobile"] .materials-area[data-material-view="line"] [data-material-section="line"],
[data-game-composition="mobile"] .materials-area[data-material-view="warehouse"] [data-material-section="warehouse"] { display: flex; }
[data-game-composition="mobile"] .materials-area .material-production-card .button { min-height: 28px; }
[data-game-composition="mobile"] .material-production-footer { display: block; }
[data-game-composition="mobile"] .material-production-footer p { font-size: .68rem; margin-bottom: 3px; }
[data-game-composition="mobile"] .material-production-footer .buy-mode-selector { min-width: 0; width: 100%; }
[data-game-composition="mobile"][data-game-orientation="landscape"] .materials-area .area-hero,
[data-game-composition="mobile"][data-game-orientation="landscape"] .material-production-footer p { display: none; }

/* Competing portfolio investments occupy a tab inside Production, never an extra row. */
.production-section-tabs { display: flex; gap: 5px; flex: 0 0 auto; }
.production-section-tabs .button { flex: 1 1 0; min-height: 30px; padding: 5px; }
.production-section-tabs .active { border-color: #ffdc6c; color: #fff1bf; background: #473318; }
.production-pane { display: flex; flex-direction: column; min-width: 0; min-height: 0; gap: 8px; }
.production-pane[hidden] { display: none !important; }
.portfolio-project-card { display: grid; grid-template-rows: auto auto auto auto auto; gap: 10px; min-width: 0; padding: 13px; border: 1px solid #776096; border-radius: 10px; background: rgba(25,27,54,.72); }
.portfolio-project-card h3, .portfolio-project-card p, .investment-guidance { margin: 0; }
.portfolio-project-costs { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 7px; }
.portfolio-project-costs > div { display: grid; gap: 3px; min-width: 0; padding: 9px; border: 1px solid #80504b; border-radius: 7px; }
.portfolio-project-costs > div.investment-funded { border-color: #519768; }
.portfolio-project-costs span { color: var(--muted); font-size: .8rem; }
.portfolio-project-costs strong { overflow-wrap: anywhere; font-size: .9rem; }
.investment-benefit { color: #fce6a6; }
.investment-guidance { font-size: .8rem; }
[data-game-composition="mobile"] .production-pane { gap: 4px; }
[data-game-composition="mobile"] .production-section-tabs .button { min-height: 26px; padding: 3px; font-size: .76rem; }
[data-game-composition="mobile"] .portfolio-project-card { gap: 5px; padding: 7px; }
[data-game-composition="mobile"] .portfolio-project-card h3 { font-size: 1rem; }
[data-game-composition="mobile"] .portfolio-project-card p { font-size: .75rem; }
[data-game-composition="mobile"] .portfolio-project-costs { grid-template-columns: 1fr; gap: 3px; }
[data-game-composition="mobile"] .portfolio-project-costs > div { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 4px 7px; }
[data-game-composition="mobile"] .portfolio-project-card .button { min-height: 29px; }
[data-game-composition="mobile"] .investment-guidance { font-size: .7rem; }
[data-game-composition="mobile"][data-game-orientation="landscape"] .portfolio-project-costs { grid-template-columns: repeat(3,minmax(0,1fr)); }
[data-game-composition="mobile"][data-game-orientation="landscape"] .portfolio-project-costs > div { display: grid; gap: 2px; }
[data-game-composition="mobile"][data-game-orientation="landscape"] .portfolio-project-card { grid-template-columns: minmax(0,1fr) minmax(0,1fr); }
[data-game-composition="mobile"][data-game-orientation="landscape"] .portfolio-project-card h3 { grid-column: 1; }
[data-game-composition="mobile"][data-game-orientation="landscape"] .portfolio-project-card p { grid-column: 1; }
[data-game-composition="mobile"][data-game-orientation="landscape"] .portfolio-project-costs { grid-column: 2; grid-row: 1 / span 2; align-self: center; }
[data-game-composition="mobile"][data-game-orientation="landscape"] .portfolio-project-card .button { grid-column: 2; }

/* Factory contracts are an internal fixed production pane, never a scrolling list. */
.factory-contract-card { display: grid; grid-template-columns: minmax(0, 1fr); grid-template-rows: auto auto auto auto auto; align-content: start; gap: 8px; min-height: 0; padding: 11px; }
.factory-contract-card > header { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.factory-contract-card > header small { color: var(--muted); }
.factory-contract-goods { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; min-width: 0; }
.factory-contract-goods > div { display: grid; gap: 3px; min-width: 0; padding: 8px; border: 1px solid #80504b; border-radius: 8px; font-size: .83rem; }
.factory-contract-goods > div.contract-funded { border-color: #519768; }
.factory-contract-goods > div span { overflow-wrap: anywhere; }
.factory-contract-card [data-contract-feedback] { margin: 0; }
.factory-contract-card > .button { justify-self: start; min-width: min(100%, 280px); }
[data-game-composition="mobile"] .factory-contract-card { gap: 4px; padding: 6px; }
[data-game-composition="mobile"] .factory-contract-card > header { gap: 6px; }
[data-game-composition="mobile"] .factory-contract-card > header h3 { font-size: 1rem; }
[data-game-composition="mobile"] .factory-contract-card > header small { font-size: .65rem; }
[data-game-composition="mobile"] .factory-contract-card > p { font-size: .72rem; }
[data-game-composition="mobile"] .factory-contract-goods { grid-template-columns: minmax(0, 1fr); gap: 3px; }
[data-game-composition="mobile"] .factory-contract-goods > div { display: grid; grid-template-columns: 70px minmax(0, 1fr); gap: 1px 6px; padding: 3px 6px; font-size: .69rem; }
[data-game-composition="mobile"] .factory-contract-goods > div strong { grid-row: 1 / span 2; align-self: center; }
[data-game-composition="mobile"] .factory-contract-card > .button { min-height: 28px; justify-self: stretch; padding: 3px; font-size: .72rem; }
[data-game-composition="mobile"][data-game-orientation="landscape"] .factory-contract-card { gap: 3px; }
[data-game-composition="mobile"][data-game-orientation="landscape"] .factory-contract-card > p[data-contract-description] { display: none; }
[data-game-composition="mobile"][data-game-orientation="landscape"] .factory-contract-goods { grid-template-columns: repeat(3, minmax(0, 1fr)); }
[data-game-composition="mobile"][data-game-orientation="landscape"] .factory-contract-goods > div { display: flex; flex-direction: column; padding: 3px; font-size: .63rem; }

/* Sector manufacturing uses one producer and one bounded page, not a catalog. */
.play-views > .industrial-production-area { display: flex; flex-direction: column; gap: 8px; min-height: 0; overflow: hidden; }
.industrial-navigation { display: flex; justify-content: center; align-items: center; gap: 15px; min-width: 0; flex: 0 0 auto; }
.industrial-current { display: flex; justify-content: space-between; align-items: baseline; gap: 14px; flex: 0 0 auto; }
.industrial-current h3 { margin: 0; }
.industrial-current small { color: var(--muted); }
.industrial-detail-tabs { display: none; }
.industrial-detail-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px; min-height: 0; }
.industrial-detail-card { display: flex; flex-direction: column; align-items: stretch; justify-content: start; gap: 8px; min-width: 0; min-height: 0; padding: 13px; border: 1px solid #695f9b; border-radius: 10px; background: rgba(20,28,55,.65); }
.industrial-detail-card h3, .industrial-detail-card p { margin: 0; }
.industrial-detail-card > strong { overflow-wrap: anywhere; font-size: 1.12rem; }
.industrial-feedstock { display: grid; gap: 4px; margin-top: 8px; }
.industrial-feedstock > div { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; border-top: 1px solid #5b4d79; padding-top: 4px; font-size: .78rem; }
.industrial-feedstock strong, .industrial-feedstock span { overflow-wrap: anywhere; }
.industrial-investment { display: grid; grid-template-columns: minmax(0, 1fr); gap: 4px; padding: 7px 0; border-top: 1px solid #5b4d79; }
.industrial-investment strong, .industrial-investment span { font-size: .83rem; }
.industrial-investment button { white-space: normal; }
.industrial-route-actions { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 5px; }
.industrial-route-actions .button { min-width: 0; padding: 5px 3px; font-size: .82rem; }
.industrial-route-actions .active, .industrial-detail-tabs .active { border-color: #f5c76b; color: #fff1be; background: #473a1b; }
.industrial-detail-card > [data-industry-prioritize] { margin-top: auto; }
[data-game-composition="mobile"] .play-views > .industrial-production-area { display: flex; overflow: hidden; padding: 6px; gap: 5px; }
[data-game-composition="mobile"] .industrial-production-area > .area-hero { min-height: 40px; max-height: 56px; margin: 0; padding: 4px; }
[data-game-composition="mobile"] .industrial-production-area > .area-hero p:last-child { display: none; }
[data-game-composition="mobile"] .industrial-navigation { gap: 6px; }
[data-game-composition="mobile"] .industrial-navigation .button { min-height: 27px; padding: 3px; font-size: .73rem; }
[data-game-composition="mobile"] .industrial-navigation strong { font-size: .74rem; }
[data-game-composition="mobile"] .industrial-current h3 { font-size: 1rem; }
[data-game-composition="mobile"] .industrial-current small { font-size: .7rem; }
[data-game-composition="mobile"] .industrial-detail-tabs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 5px; flex: 0 0 auto; }
[data-game-composition="mobile"] .industrial-detail-tabs .button { min-height: 25px; padding: 3px; font-size: .73rem; }
[data-game-composition="mobile"] .industrial-detail-grid { display: block; min-height: 0; }
[data-game-composition="mobile"] .industrial-detail-card { display: none; gap: 4px; padding: 7px; }
[data-game-composition="mobile"] .industrial-production-area[data-industry-view="stock"] [data-industry-card="stock"],
[data-game-composition="mobile"] .industrial-production-area[data-industry-view="upgrades"] [data-industry-card="upgrades"],
[data-game-composition="mobile"] .industrial-production-area[data-industry-view="routing"] [data-industry-card="routing"] { display: flex; }
[data-game-composition="mobile"] .industrial-detail-card h3 { font-size: 1rem; }
[data-game-composition="mobile"] .industrial-detail-card > strong { font-size: .95rem; }
[data-game-composition="mobile"] .industrial-detail-card > p { font-size: .72rem; }
[data-game-composition="mobile"] .industrial-investment { padding: 4px 0; }
[data-game-composition="mobile"] .industrial-investment .button,
[data-game-composition="mobile"] .industrial-detail-card > .button { min-height: 29px; padding: 3px; font-size: .73rem; }
[data-game-composition="mobile"] .industrial-detail-card .buy-mode-selector { min-width: 0; width: 100%; }
[data-game-composition="mobile"][data-game-orientation="landscape"] .industrial-production-area > .area-hero { display: none; }
[data-game-composition="mobile"][data-game-orientation="landscape"] .industrial-current small { display: none; }
[data-game-composition="mobile"][data-game-orientation="landscape"] .industrial-detail-card { gap: 3px; padding: 4px; }
[data-game-composition="mobile"][data-game-orientation="landscape"] .industrial-feedstock { margin-top: 0; }
[data-game-composition="mobile"][data-game-orientation="landscape"] .industrial-detail-card > p:first-of-type { display: none; }

/* The existing Supply Chains item pane shows exactly one route at a time. */
.late-items.supply-route-items { display: block; margin: 8px 0; padding: 8px 11px; }
.supply-route-content { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.supply-route-navigation { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 7px; }
.supply-route-navigation strong { font-size: .8rem; }
.supply-route-navigation small { font-size: .7rem; color: #baaddb; }
.supply-route-navigation > button { padding: 2px 9px; min-height: 28px; }
.supply-route-cargo { display: flex; flex-wrap: wrap; align-items: center; gap: 5px; }
.supply-route-cargo .art-object { padding: 4px 8px; font-size: .72rem; border-radius: 7px; white-space: normal; }
.supply-route-benefit { padding: 0 !important; background: transparent !important; font-size: .75rem; color: #e2d6f9 !important; }
.supply-route-content > button { align-self: start; min-height: 28px; padding: 4px 12px; }
[data-game-composition="mobile"] .late-items.supply-route-items { padding: 4px 6px; margin: 3px 0; }
[data-game-composition="mobile"] .supply-route-content { gap: 3px; }
[data-game-composition="mobile"] .supply-route-navigation { gap: 3px; }
[data-game-composition="mobile"] .supply-route-navigation strong { font-size: .69rem; }
[data-game-composition="mobile"] .supply-route-navigation small { font-size: .61rem; }
[data-game-composition="mobile"] .supply-route-navigation > button { min-height: 24px; padding: 2px 5px; }
[data-game-composition="mobile"] .supply-route-cargo { gap: 3px; }
[data-game-composition="mobile"] .supply-route-cargo .art-object { font-size: .65rem; padding: 2px 4px; }
[data-game-composition="mobile"] .supply-route-benefit { font-size: .68rem; }
[data-game-composition="mobile"] .supply-route-content > button { min-height: 26px; padding: 3px 6px; font-size: .69rem; }

/* Vertical Integration uses one complex at a time. Facility investment,
   allocation and certification share a bounded pane; existing generic stage
   upgrade cards are placed behind its separate Upgrades view. */
.late-items.integration-items { display: block; min-height: 0; padding: 7px 9px; margin: 7px 0; }
.integration-content { display: grid; grid-template-columns: minmax(0,1fr); align-content: start; gap: 7px; min-width: 0; }
.integration-navigation { display: flex; gap: 10px; justify-content: space-between; align-items: center; }
.integration-navigation strong { flex: 1; font-size: .85rem; text-align: center; }
.integration-navigation .button { min-height: 27px; padding: 3px 11px; }
.integration-heading { display: flex; justify-content: space-between; align-items: baseline; flex-wrap: wrap; gap: 5px; font-size: .75rem; }
.integration-heading > small { color: #baaeda; }
.integration-heading > strong { color: #f5e9bf; }
.integration-view-tabs { display: flex; gap: 5px; }
.integration-view-tabs > .button { flex: 1; min-height: 27px; padding: 3px 8px; font-size: .77rem; }
.integration-view-tabs .active { color: #fff4bd; border-color: #efc16a; background: #4b361f; }
.integration-goods { display: flex; flex-wrap: wrap; gap: 4px; align-items: center; }
.integration-goods .art-object { font-size: .72rem; white-space: normal; border-radius: 6px; padding: 4px 7px; }
.integration-content > button { justify-self: start; min-height: 28px; padding: 4px 9px; }
.integration-operations { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 5px; align-items: center; min-width: 0; }
.integration-operations > span { border: 1px solid #63537f; background: rgba(26,22,49,.55); border-radius: 6px; padding: 5px; min-width: 0; overflow-wrap: anywhere; font-size: .73rem; }
.integration-operations > .button { min-height: 29px; padding: 3px 5px; font-size: .74rem; white-space: normal; }
[data-game-composition="mobile"] .late-items.integration-items { padding: 4px 5px; margin: 3px 0; }
[data-game-composition="mobile"] .integration-content { gap: 4px; }
[data-game-composition="mobile"] .integration-navigation { gap: 5px; }
[data-game-composition="mobile"] .integration-navigation strong { font-size: .7rem; }
[data-game-composition="mobile"] .integration-navigation .button { min-height: 24px; padding: 2px 6px; }
[data-game-composition="mobile"] .integration-heading { gap: 3px; font-size: .67rem; }
[data-game-composition="mobile"] .integration-view-tabs > .button { min-height: 25px; font-size: .68rem; padding: 2px; }
[data-game-composition="mobile"] .integration-goods .art-object { font-size: .61rem; padding: 2px 4px; }
[data-game-composition="mobile"] .integration-operations { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 3px; }
[data-game-composition="mobile"] .integration-operations > span,
[data-game-composition="mobile"] .integration-operations > .button { min-height: 23px; font-size: .63rem; padding: 2px 4px; }
[data-game-composition="mobile"] .integration-content > button { min-height: 26px; padding: 2px 6px; font-size: .67rem; }
[data-game-composition="mobile"][data-game-orientation="landscape"] .integration-heading > span { display: none; }
[data-game-composition="mobile"][data-game-orientation="landscape"] .integration-goods .art-object { font-size: .57rem; padding: 2px 3px; }

/* All stage panels use hidden toggles for exclusive views. Author display rules
   must never override them and accidentally add duplicate off-canvas panes. */
.late-game-area [hidden] { display: none !important; }

/* Market Control shows one competing, material-backed sale commitment. The
   alternative upgrade pane hides the demand details so neither can overflow
   the fixed gameplay area as more markets are established. */
.market-targets { display: block; min-width: 0; min-height: 0; padding: 8px 10px; margin: 7px 0; border: 1px solid #655486; border-radius: 10px; }
.market-contract-content { display: grid; align-content: start; gap: 7px; min-width: 0; }
.market-contract-heading { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.market-contract-heading > strong { flex: 1 1 auto; text-align: center; min-width: 0; font-size: .9rem; }
.market-contract-heading > small { color: #baaeda; font-size: .75rem; }
.market-contract-heading > .button { min-height: 27px; padding: 3px 10px; }
.market-contract-panes { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 6px; }
.market-contract-panes > .button { min-height: 28px; padding: 4px; font-size: .8rem; }
.market-contract-panes > .active { border-color: #f4d181; background: #483419; color: #fff1bf; }
.market-contract-body { display: grid; align-content: start; gap: 7px; min-width: 0; }
.market-contract-body > strong { font-size: .83rem; }
.market-contract-goods { display: flex; flex-wrap: wrap; gap: 5px; }
.market-contract-goods .art-object { padding: 4px 8px; border-radius: 7px; font-size: .76rem; white-space: normal; }
.market-contract-body > small { color: #c5b9dd; font-size: .74rem; }
.market-contract-body > .button { justify-self: start; padding: 5px 10px; min-height: 29px; }
[data-game-composition="mobile"] .market-targets { padding: 4px 5px; margin: 3px 0; }
[data-game-composition="mobile"] .market-contract-content, [data-game-composition="mobile"] .market-contract-body { gap: 4px; }
[data-game-composition="mobile"] .market-contract-heading { flex-wrap: wrap; gap: 4px; }
[data-game-composition="mobile"] .market-contract-heading > strong { font-size: .72rem; }
[data-game-composition="mobile"] .market-contract-heading > small { font-size: .65rem; }
[data-game-composition="mobile"] .market-contract-heading > .button { min-height: 24px; padding: 2px 5px; }
[data-game-composition="mobile"] .market-contract-panes > .button { min-height: 25px; padding: 2px; font-size: .71rem; }
[data-game-composition="mobile"] .market-contract-body > strong { font-size: .73rem; }
[data-game-composition="mobile"] .market-contract-goods { gap: 3px; }
[data-game-composition="mobile"] .market-contract-goods .art-object { font-size: .63rem; padding: 2px 4px; }
[data-game-composition="mobile"] .market-contract-body > small { font-size: .67rem; }
[data-game-composition="mobile"] .market-contract-body > .button { min-height: 25px; padding: 3px 6px; font-size: .69rem; }
[data-game-composition="mobile"][data-game-orientation="landscape"] .market-contract-body > small { display: none; }

/* Global Economy displays ONE megaproject and its material/proof chain at a
   time. Project controls and stage upgrades are mutually exclusive fixed panes,
   never a scrollable catalog or a clipped continuation. */
.global-megaprojects { display: block; min-width: 0; margin: 6px 0; padding: 8px 10px; border: 1px solid #84765c; border-radius: 10px; background: rgba(20,31,40,.42); }
.global-project-content, .global-project-body { display: grid; align-content: start; gap: 6px; min-width: 0; }
.global-project-navigation { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px; }
.global-project-navigation > strong { flex: 1; min-width: 0; text-align: center; font-size: .84rem; overflow-wrap: anywhere; }
.global-project-navigation > small { color: #e9d0a2; font-size: .72rem; }
.global-project-navigation > button { min-height: 27px; padding: 2px 10px; }
.global-project-panes { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 5px; }
.global-project-panes > button { min-height: 27px; padding: 3px 6px; font-size: .76rem; }
.global-project-panes > .active { border-color: #eed083; color: #fff0b7; background: #45361e; }
.global-project-body > strong { font-size: .78rem; }
.global-project-benefit { font-size: .74rem; color: #e5d9b9; }
.global-project-goods { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 5px; min-width: 0; }
.global-project-goods > .art-object { justify-content: center; min-width: 0; white-space: normal; overflow-wrap: anywhere; border-radius: 7px; font-size: .72rem; padding: 5px 6px; }
.global-project-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 5px; }
.global-project-actions > button { min-height: 28px; padding: 4px 9px; font-size: .74rem; }
.global-project-actions > small, .global-project-body > small { font-size: .7rem; }
[data-game-composition="mobile"] .global-megaprojects { padding: 4px 5px; margin: 3px 0; }
[data-game-composition="mobile"] .global-project-content, [data-game-composition="mobile"] .global-project-body { gap: 3px; }
[data-game-composition="mobile"] .global-project-navigation { gap: 3px; }
[data-game-composition="mobile"] .global-project-navigation > strong { font-size: .7rem; }
[data-game-composition="mobile"] .global-project-navigation > small { font-size: .61rem; }
[data-game-composition="mobile"] .global-project-navigation > button { min-height: 24px; padding: 2px 6px; }
[data-game-composition="mobile"] .global-project-panes > button { min-height: 24px; padding: 2px 3px; font-size: .68rem; }
[data-game-composition="mobile"] .global-project-body > strong { font-size: .68rem; }
[data-game-composition="mobile"] .global-project-benefit { font-size: .65rem; }
[data-game-composition="mobile"] .global-project-goods { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 3px; }
[data-game-composition="mobile"] .global-project-goods > .art-object { padding: 2px 4px; font-size: .63rem; }
[data-game-composition="mobile"] .global-project-actions { gap: 3px; }
[data-game-composition="mobile"] .global-project-actions > button { min-height: 25px; padding: 2px 5px; font-size: .66rem; }
[data-game-composition="mobile"] .global-project-actions > small,
[data-game-composition="mobile"] .global-project-body > small { font-size: .63rem; }
[data-game-composition="mobile"][data-game-orientation="landscape"] .global-project-goods { grid-template-columns: repeat(4,minmax(0,1fr)); }

/* Local Administration uses one selected district with only three current
   service budgets. Material commitments, civic initiative and stage upgrades
   occupy mutually exclusive finite panes; never a scrolling ward catalog. */
.civic-districts { min-width: 0; min-height: 0; display: block; margin: 5px 0; padding: 7px 9px; border: 1px solid #688774; border-radius: 10px; background: rgba(18,36,33,.42); }
.civic-district-content, .civic-district-body { display: grid; align-content: start; gap: 5px; min-width: 0; }
.civic-navigation { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 5px; }
.civic-navigation > strong { flex: 1 1 auto; min-width: 0; text-align: center; font-size: .8rem; overflow-wrap: anywhere; }
.civic-navigation > small { font-size: .68rem; color: #b4d1bd; }
.civic-navigation > button { min-height: 27px; padding: 2px 9px; }
.civic-navigation-tabs { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 5px; }
.civic-navigation-tabs > button { min-height: 27px; padding: 3px; font-size: .74rem; }
.civic-navigation-tabs > .active { border-color: #afd8b8; color: #e1ffe6; background: #1d4631; }
.civic-benefit { color: #bfebcb; font-size: .72rem; }
.civic-materials { display: flex; flex-wrap: wrap; gap: 5px; align-items: center; min-width: 0; }
.civic-materials > .art-object { padding: 4px 7px; border-radius: 6px; white-space: normal; font-size: .72rem; }
.civic-materials > small { font-size: .71rem; }
.civic-service-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 5px; min-width: 0; }
.civic-budget-line { display: grid; grid-template-columns: minmax(0,1fr); align-content: start; gap: 4px; min-width: 0; border: 1px solid #547565; border-radius: 7px; padding: 5px; }
.civic-budget-line span { display: grid; gap: 2px; min-width: 0; }
.civic-budget-line strong { font-size: .73rem; }
.civic-budget-line small { font-size: .66rem; overflow-wrap: anywhere; }
.civic-budget-line > button { min-height: 26px; padding: 3px; font-size: .7rem; }
.civic-district-actions { display: flex; flex-wrap: wrap; gap: 5px; }
.civic-district-actions > button { min-height: 28px; padding: 4px 8px; font-size: .74rem; }
[data-game-composition="mobile"] .civic-districts { margin: 3px 0; padding: 4px 5px; }
[data-game-composition="mobile"] .civic-district-content, [data-game-composition="mobile"] .civic-district-body { gap: 3px; }
[data-game-composition="mobile"] .civic-navigation { gap: 3px; }
[data-game-composition="mobile"] .civic-navigation > strong { font-size: .68rem; }
[data-game-composition="mobile"] .civic-navigation > small { font-size: .61rem; }
[data-game-composition="mobile"] .civic-navigation > button { min-height: 24px; padding: 2px 6px; }
[data-game-composition="mobile"] .civic-navigation-tabs > button { min-height: 24px; padding: 2px; font-size: .63rem; }
[data-game-composition="mobile"] .civic-benefit { font-size: .64rem; }
[data-game-composition="mobile"] .civic-materials { gap: 3px; }
[data-game-composition="mobile"] .civic-materials > .art-object { padding: 2px 4px; font-size: .6rem; }
[data-game-composition="mobile"] .civic-service-grid { grid-template-columns: 1fr; gap: 2px; }
[data-game-composition="mobile"] .civic-budget-line { grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: 3px; padding: 2px 4px; }
[data-game-composition="mobile"] .civic-budget-line strong { font-size: .64rem; }
[data-game-composition="mobile"] .civic-budget-line small { font-size: .59rem; }
[data-game-composition="mobile"] .civic-budget-line > button { min-height: 23px; padding: 2px 4px; font-size: .61rem; }
[data-game-composition="mobile"] .civic-district-actions > button { min-height: 24px; padding: 2px 5px; font-size: .64rem; }

/* Regional Administration presents one distinct cross-city route at a time,
   including service pair selections, provenance and new online proof. Stage
   upgrades live in a mutually exclusive pane, not a scrolling route list. */
.regional-routes { display:block; min-width:0; min-height:0; padding:7px 9px; margin:5px 0; border:1px solid #6b7e9b; border-radius:9px; background:rgba(24,36,56,.45); }
.regional-route-content,.regional-route-body { display:grid; align-content:start; gap:5px; min-width:0; }
.regional-route-nav { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:5px; }
.regional-route-nav > strong { flex:1; min-width:0; text-align:center; overflow-wrap:anywhere; font-size:.82rem; }
.regional-route-nav > small { color:#c4d6ed; font-size:.71rem; }
.regional-route-nav > button { min-height:27px; padding:3px 9px; }
.regional-route-tabs { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:5px; }
.regional-route-tabs > button { min-height:27px; padding:3px 7px; font-size:.75rem; }
.regional-route-tabs > .active { border-color:#b0d4ff; color:#e8f5ff; background:#23405e; }
.regional-route-body > small { color:#c6dbee; font-size:.72rem; }
.regional-city-pair { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px; }
.regional-choice { display:grid; gap:3px; min-width:0; font-size:.73rem; text-transform:capitalize; color:#dae7f5; }
.regional-choice > select { min-width:0; width:100%; border:1px solid #657d9a; border-radius:6px; padding:5px; color:#e9f7ff; background:#1a2b3e; }
.regional-cargo,.regional-proof { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:5px; min-width:0; }
.regional-cargo > .art-object,.regional-proof > .art-object { min-width:0; overflow-wrap:anywhere; white-space:normal; border-radius:7px; padding:4px 7px; font-size:.71rem; }
.regional-route-body > button { justify-self:start; min-height:28px; padding:4px 9px; font-size:.74rem; }
.regional-assignment { display:flex; justify-content:space-between; align-items:baseline; flex-wrap:wrap; gap:5px; font-size:.72rem; }
.regional-assignment > span { color:#c4d6ed; }
[data-game-composition="mobile"] .regional-routes { margin:3px 0; padding:4px 5px; }
[data-game-composition="mobile"] .regional-route-content,[data-game-composition="mobile"] .regional-route-body { gap:3px; }
[data-game-composition="mobile"] .regional-route-nav { gap:3px; }
[data-game-composition="mobile"] .regional-route-nav > strong { font-size:.7rem; }
[data-game-composition="mobile"] .regional-route-nav > small { font-size:.61rem; }
[data-game-composition="mobile"] .regional-route-nav > button { min-height:23px; padding:2px 5px; }
[data-game-composition="mobile"] .regional-route-tabs > button { min-height:23px; font-size:.65rem; padding:2px; }
[data-game-composition="mobile"] .regional-city-pair { gap:3px; }
[data-game-composition="mobile"] .regional-choice { font-size:.63rem; gap:2px; }
[data-game-composition="mobile"] .regional-choice > select { padding:3px; font-size:.63rem; }
[data-game-composition="mobile"] .regional-route-body > small { font-size:.63rem; }
[data-game-composition="mobile"] .regional-cargo,[data-game-composition="mobile"] .regional-proof { gap:3px; }
[data-game-composition="mobile"] .regional-cargo > .art-object,[data-game-composition="mobile"] .regional-proof > .art-object { font-size:.6rem; padding:2px 4px; }
[data-game-composition="mobile"] .regional-route-body > button { min-height:24px; padding:2px 5px; font-size:.65rem; }
[data-game-composition="mobile"] .regional-assignment { font-size:.61rem; gap:2px; }

/* National Government: ONE national infrastructure specialist line at a
   time. Its requirements, online proof and focused fabrication controls stay
   within a fixed pane; upgrade cards replace rather than extend the view. */
.national-programs { display:block; min-width:0; min-height:0; margin:5px 0; padding:7px 9px; border:1px solid #72877b; border-radius:9px; background:rgba(23,44,39,.36); }
.national-program-content,.national-program-body { display:grid; align-content:start; gap:6px; min-width:0; }
.national-program-nav { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:5px; }
.national-program-nav > strong { flex:1; min-width:0; text-align:center; font-size:.83rem; overflow-wrap:anywhere; }
.national-program-nav > small { font-size:.71rem; color:#c0dccc; }
.national-program-nav > button { min-height:27px; padding:3px 10px; }
.national-program-tabs { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:5px; }
.national-program-tabs > button { min-height:27px; padding:3px; font-size:.76rem; }
.national-program-tabs > .active { color:#e7fff3; background:#285343; border-color:#a2d1b8; }
.national-program-body > small { font-size:.73rem; color:#bfe4cc; }
.national-program-needs { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:5px; min-width:0; }
.national-program-needs > .art-object { min-width:0; border-radius:7px; padding:4px 7px; white-space:normal; overflow-wrap:anywhere; font-size:.71rem; }
.national-program-body > button { justify-self:start; min-height:28px; padding:4px 9px; font-size:.75rem; }
.national-production-proof { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:5px; min-width:0; }
.national-production-proof > span { min-width:0; border:1px solid #517666; border-radius:7px; padding:5px; font-size:.72rem; overflow-wrap:anywhere; }
.national-program-actions { display:flex; flex-wrap:wrap; gap:5px; align-items:center; }
.national-program-actions > button { min-height:28px; padding:4px 9px; font-size:.73rem; }
.national-certified { color:#a1edbb; font-size:.72rem; }
[data-game-composition="mobile"] .national-programs { margin:3px 0; padding:4px 5px; }
[data-game-composition="mobile"] .national-program-content,[data-game-composition="mobile"] .national-program-body { gap:3px; }
[data-game-composition="mobile"] .national-program-nav { gap:3px; }
[data-game-composition="mobile"] .national-program-nav > strong { font-size:.67rem; }
[data-game-composition="mobile"] .national-program-nav > small { font-size:.59rem; }
[data-game-composition="mobile"] .national-program-nav > button { min-height:23px; padding:2px 5px; }
[data-game-composition="mobile"] .national-program-tabs > button { min-height:23px; padding:2px; font-size:.65rem; }
[data-game-composition="mobile"] .national-program-body > small { font-size:.63rem; }
[data-game-composition="mobile"] .national-program-needs { gap:3px; }
[data-game-composition="mobile"] .national-program-needs > .art-object { padding:2px 4px; font-size:.6rem; }
[data-game-composition="mobile"] .national-production-proof { gap:3px; }
[data-game-composition="mobile"] .national-production-proof > span { padding:2px 4px; font-size:.61rem; }
[data-game-composition="mobile"] .national-program-body > button,
[data-game-composition="mobile"] .national-program-actions > button { min-height:24px; padding:2px 5px; font-size:.64rem; }
[data-game-composition="mobile"] .national-program-actions { gap:3px; }

/* Country Control renders one live export destination, exactly two cargo
   orders, and authorized controls within the existing fixed game composition.
   Upgrades replace the trade pane instead of expanding a scrolling catalog. */
.country-networks { display:block; min-width:0; min-height:0; margin:5px 0; padding:7px 9px; border:1px solid #8a758a; border-radius:9px; background:rgba(35,26,48,.42); }
.country-trade-content,.country-trade-body { display:grid; align-content:start; gap:5px; min-width:0; }
.country-trade-nav { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:5px; }
.country-trade-nav > strong { flex:1; min-width:0; text-align:center; font-size:.82rem; overflow-wrap:anywhere; }
.country-trade-nav > small { color:#e2cdea; font-size:.69rem; }
.country-trade-nav > button { min-height:27px; padding:3px 9px; }
.country-trade-tabs { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:5px; }
.country-trade-tabs > button { min-height:27px; padding:3px 6px; font-size:.75rem; }
.country-trade-tabs > .active { color:#f4e9ff; border-color:#c7a0de; background:#483056; }
.country-trade-body > small { color:#d9c6e6; font-size:.71rem; }
.country-precharter-cargo,.country-shipment-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:5px; min-width:0; }
.country-precharter-cargo > .art-object { min-width:0; border-radius:6px; padding:4px 7px; font-size:.72rem; white-space:normal; overflow-wrap:anywhere; }
.country-shipment-line { display:grid; grid-template-columns:minmax(0,1fr); align-content:start; gap:4px; border:1px solid #775f83; border-radius:7px; padding:5px; min-width:0; }
.country-shipment-line > span { display:grid; gap:2px; min-width:0; }
.country-shipment-line strong { font-size:.74rem; overflow-wrap:anywhere; }
.country-shipment-line small { font-size:.66rem; overflow-wrap:anywhere; }
.country-shipment-line > button { min-height:27px; font-size:.7rem; padding:3px 7px; }
.country-trade-controls { display:flex; flex-wrap:wrap; gap:5px; align-items:center; }
.country-trade-controls > button { min-height:27px; padding:3px 7px; font-size:.71rem; }
.country-trade-controls > small { font-size:.69rem; }
.country-completed { color:#a9e9b9; font-size:.78rem; }
[data-game-composition="mobile"] .country-networks { margin:3px 0; padding:4px 5px; }
[data-game-composition="mobile"] .country-trade-content,[data-game-composition="mobile"] .country-trade-body { gap:3px; }
[data-game-composition="mobile"] .country-trade-nav { gap:3px; }
[data-game-composition="mobile"] .country-trade-nav > strong { font-size:.68rem; }
[data-game-composition="mobile"] .country-trade-nav > small { font-size:.6rem; }
[data-game-composition="mobile"] .country-trade-nav > button { min-height:24px; padding:2px 5px; }
[data-game-composition="mobile"] .country-trade-tabs > button { min-height:24px; padding:2px; font-size:.65rem; }
[data-game-composition="mobile"] .country-trade-body > small { font-size:.62rem; }
[data-game-composition="mobile"] .country-shipment-grid { grid-template-columns:1fr; gap:3px; }
[data-game-composition="mobile"] .country-precharter-cargo { gap:3px; }
[data-game-composition="mobile"] .country-precharter-cargo > .art-object { padding:2px 4px; font-size:.61rem; }
[data-game-composition="mobile"] .country-shipment-line { grid-template-columns:minmax(0,1fr) auto; gap:4px; padding:3px; align-items:center; }
[data-game-composition="mobile"] .country-shipment-line strong { font-size:.64rem; }
[data-game-composition="mobile"] .country-shipment-line small { font-size:.6rem; }
[data-game-composition="mobile"] .country-shipment-line > button { min-height:24px; font-size:.61rem; padding:2px 4px; }
[data-game-composition="mobile"] .country-trade-controls { gap:3px; }
[data-game-composition="mobile"] .country-trade-controls > button { min-height:24px; padding:2px 5px; font-size:.64rem; }
[data-game-composition="mobile"] .country-trade-controls > small { font-size:.61rem; }

/* Multinational Blocs occupy one council and one delegate seat at a time;
   original Upgrades replace the council pane, never extend its fixed canvas. */
.bloc-councils { display:block; min-width:0; min-height:0; padding:7px 9px; margin:5px 0; border:1px solid #85795f; border-radius:9px; background:rgba(40,32,26,.42); }
.bloc-council-content,.bloc-council-body { display:grid; align-content:start; gap:6px; min-width:0; }
.bloc-council-nav,.bloc-seat-nav { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:6px; }
.bloc-council-nav > strong,.bloc-seat-nav > strong { flex:1; min-width:0; text-align:center; font-size:.78rem; overflow-wrap:anywhere; }
.bloc-council-nav > small { font-size:.69rem; color:#ddccac; }
.bloc-council-nav > button,.bloc-seat-nav > button { min-height:27px; padding:3px 9px; }
.bloc-council-tabs { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:5px; }
.bloc-council-tabs > button { min-height:27px; padding:3px 6px; font-size:.74rem; }
.bloc-council-tabs > .active { border-color:#dfc58e; color:#fff2ce; background:#4a3926; }
.bloc-council-body > small { font-size:.72rem; color:#e8d6b6; }
.bloc-delegate-choice { display:grid; gap:4px; min-width:0; color:#decaa4; font-size:.71rem; }
.bloc-delegate-choice > select { min-width:0; max-width:100%; border:1px solid #887757; border-radius:6px; padding:5px; color:#f8ebd5; background:#2b271f; }
.bloc-invitation,.bloc-proof { display:grid; align-content:start; gap:6px; min-width:0; }
.bloc-proof > strong { font-size:.78rem; }
.bloc-proof > small,.bloc-invitation > small { font-size:.72rem; }
.bloc-cargo { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:5px; min-width:0; }
.bloc-cargo > .art-object { min-width:0; padding:4px 6px; font-size:.71rem; border-radius:6px; white-space:normal; overflow-wrap:anywhere; }
.bloc-invitation > button,.bloc-proof > button { justify-self:start; min-height:27px; padding:3px 8px; font-size:.73rem; }
.bloc-council-actions { display:flex; flex-wrap:wrap; align-items:center; gap:5px; }
.bloc-council-actions > button { min-height:27px; padding:4px 8px; font-size:.72rem; }
.bloc-council-actions > small { font-size:.72rem; }
.bloc-signed { color:#bee9b9; font-size:.78rem; }
[data-game-composition="mobile"] .bloc-councils { padding:4px 5px; margin:3px 0; }
[data-game-composition="mobile"] .bloc-council-content,[data-game-composition="mobile"] .bloc-council-body { gap:3px; }
[data-game-composition="mobile"] .bloc-council-nav,[data-game-composition="mobile"] .bloc-seat-nav { gap:3px; }
[data-game-composition="mobile"] .bloc-council-nav > strong,[data-game-composition="mobile"] .bloc-seat-nav > strong { font-size:.65rem; }
[data-game-composition="mobile"] .bloc-council-nav > small { font-size:.59rem; }
[data-game-composition="mobile"] .bloc-council-nav > button,[data-game-composition="mobile"] .bloc-seat-nav > button { min-height:23px; padding:2px 5px; }
[data-game-composition="mobile"] .bloc-council-tabs > button { min-height:23px; padding:2px; font-size:.64rem; }
[data-game-composition="mobile"] .bloc-council-body > small { font-size:.62rem; }
[data-game-composition="mobile"] .bloc-delegate-choice { gap:2px; font-size:.61rem; }
[data-game-composition="mobile"] .bloc-delegate-choice > select { padding:3px; font-size:.62rem; }
[data-game-composition="mobile"] .bloc-cargo { gap:3px; }
[data-game-composition="mobile"] .bloc-cargo > .art-object { font-size:.59rem; padding:2px 4px; }
[data-game-composition="mobile"] .bloc-invitation,[data-game-composition="mobile"] .bloc-proof { gap:3px; }
[data-game-composition="mobile"] .bloc-invitation > button,[data-game-composition="mobile"] .bloc-proof > button,
[data-game-composition="mobile"] .bloc-council-actions > button { min-height:23px; padding:2px 5px; font-size:.63rem; }
[data-game-composition="mobile"] .bloc-council-actions { gap:3px; }
[data-game-composition="mobile"] .bloc-council-actions > small { font-size:.6rem; }

/* Continental Control shows ONE selected geographic frontier and only its
   present commitment/proof, never a seven-region scroll list. Separate
   Operations and Upgrades tabs replace the frontier controls in their panes. */
.continental-frontiers { display:block; min-width:0; min-height:0; padding:7px 9px; margin:5px 0; border:1px solid #8d8068; border-radius:9px; background:rgba(34,40,34,.43); }
.continent-front-content,.continent-front-body { display:grid; align-content:start; gap:6px; min-width:0; }
.continent-front-nav { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:5px; }
.continent-front-nav > strong { flex:1; min-width:0; text-align:center; font-size:.8rem; overflow-wrap:anywhere; }
.continent-front-nav > small { font-size:.69rem; color:#cfdbbb; }
.continent-front-nav > button { min-height:27px; padding:3px 10px; }
.continent-front-tabs { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:5px; }
.continent-front-tabs > button { min-height:27px; padding:3px 6px; font-size:.74rem; }
.continent-front-tabs > .active { color:#f1ffd9; border-color:#d8dca0; background:#3f5231; }
.continent-front-body > small { font-size:.72rem; color:#deebbd; }
.continent-materials { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:5px; min-width:0; }
.continent-materials > .art-object { min-width:0; border-radius:6px; padding:4px 6px; white-space:normal; overflow-wrap:anywhere; font-size:.7rem; }
.continent-origin { display:grid; gap:4px; font-size:.72rem; }
.continent-origin > select { min-width:0; max-width:100%; border:1px solid #80906a; border-radius:6px; padding:5px; color:#ebffdc; background:#242f20; }
.continent-front-actions { display:flex; flex-wrap:wrap; align-items:center; gap:5px; }
.continent-front-actions > small { color:#d7e5bf; font-size:.7rem; }
.continent-front-actions > button { min-height:27px; padding:4px 8px; font-size:.73rem; }
.continent-coverage { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:baseline; gap:5px; font-size:.74rem; }
.continent-proofs { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:5px; }
.continent-proofs > span { min-width:0; border:1px solid #667c62; border-radius:6px; padding:5px; font-size:.7rem; overflow-wrap:anywhere; }
.continent-linked { color:#baf6a4; font-size:.78rem; }
[data-game-composition="mobile"] .continental-frontiers { padding:4px 5px; margin:3px 0; }
[data-game-composition="mobile"] .continent-front-content,[data-game-composition="mobile"] .continent-front-body { gap:3px; }
[data-game-composition="mobile"] .continent-front-nav { gap:3px; }
[data-game-composition="mobile"] .continent-front-nav > strong { font-size:.65rem; }
[data-game-composition="mobile"] .continent-front-nav > small { font-size:.59rem; }
[data-game-composition="mobile"] .continent-front-nav > button { min-height:23px; padding:2px 5px; }
[data-game-composition="mobile"] .continent-front-tabs > button { min-height:23px; padding:2px; font-size:.61rem; }
[data-game-composition="mobile"] .continent-front-body > small { font-size:.61rem; }
[data-game-composition="mobile"] .continent-materials { grid-template-columns:1fr; gap:2px; }
[data-game-composition="mobile"] .continent-materials > .art-object { padding:2px 5px; font-size:.61rem; }
[data-game-composition="mobile"] .continent-origin { gap:2px; font-size:.62rem; }
[data-game-composition="mobile"] .continent-origin > select { padding:3px; font-size:.63rem; }
[data-game-composition="mobile"] .continent-front-actions { gap:3px; }
[data-game-composition="mobile"] .continent-front-actions > button { min-height:23px; padding:2px 5px; font-size:.63rem; }
[data-game-composition="mobile"] .continent-front-actions > small { font-size:.59rem; }
[data-game-composition="mobile"] .continent-coverage { gap:2px; font-size:.61rem; }
[data-game-composition="mobile"] .continent-proofs { grid-template-columns:1fr; gap:2px; }
[data-game-composition="mobile"] .continent-proofs > span { padding:2px 5px; font-size:.62rem; }

/* The ONE planetary world assembly has three competing physical dossiers
   and a separate final signature tab. Only one dossier displays at a time:
   no scroll catalog, dynamic hidden overflow, or future-stage navigation. */
.planetary-assembly { display:block; min-width:0; min-height:0; margin:6px 0; padding:9px 11px; border:1px solid #a58b55; border-radius:10px; background:rgba(42,32,19,.5); }
.planetary-content,.planetary-dossier,.planetary-charter { display:grid; align-content:start; gap:8px; min-width:0; }
.planetary-heading { display:flex; justify-content:space-between; flex-wrap:wrap; align-items:baseline; gap:7px; }
.planetary-heading > strong { font-size:.85rem; color:#ffebbd; }
.planetary-heading > small { font-size:.72rem; color:#d6c396; }
.planetary-tabs { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px; }
.planetary-tabs > button { min-height:28px; padding:4px 9px; font-size:.76rem; }
.planetary-tabs > .active { border-color:#f0cf7f; color:#fff0c9; background:#594024; }
.planetary-nav { display:flex; gap:7px; align-items:center; justify-content:space-between; min-width:0; }
.planetary-nav > strong { flex:1; min-width:0; text-align:center; font-size:.81rem; overflow-wrap:anywhere; }
.planetary-nav > button { min-height:27px; padding:3px 10px; }
.planetary-dossier > small { font-size:.74rem; color:#e5d5b3; }
.planetary-needs,.planetary-proofs { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:5px; min-width:0; }
.planetary-needs > .art-object { min-width:0; padding:5px 8px; border-radius:7px; font-size:.72rem; white-space:normal; overflow-wrap:anywhere; }
.planetary-proofs > span { min-width:0; padding:5px 8px; border:1px solid #9f8d69; border-radius:7px; font-size:.71rem; overflow-wrap:anywhere; }
.planetary-actions { display:flex; flex-wrap:wrap; align-items:center; gap:6px; }
.planetary-actions > small { color:#e8d4ad; font-size:.73rem; }
.planetary-actions > button,.planetary-dossier > button,.planetary-charter > button { justify-self:start; min-height:28px; padding:4px 10px; font-size:.75rem; }
.planetary-charter > strong { font-size:.82rem; }
.planetary-readiness { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:5px; min-width:0; }
.planetary-readiness > span { min-width:0; padding:5px 8px; border:1px solid #99845f; border-radius:7px; font-size:.72rem; overflow-wrap:anywhere; }
.planetary-approved { color:#c7f5b0; font-size:.8rem; }
[data-game-composition="mobile"] .planetary-assembly { margin:3px 0; padding:4px 5px; }
[data-game-composition="mobile"] .planetary-content,[data-game-composition="mobile"] .planetary-dossier,
[data-game-composition="mobile"] .planetary-charter { gap:4px; }
[data-game-composition="mobile"] .planetary-heading { gap:3px; }
[data-game-composition="mobile"] .planetary-heading > strong { font-size:.72rem; }
[data-game-composition="mobile"] .planetary-heading > small { font-size:.61rem; }
[data-game-composition="mobile"] .planetary-tabs { gap:3px; }
[data-game-composition="mobile"] .planetary-tabs > button { min-height:24px; padding:2px 4px; font-size:.65rem; }
[data-game-composition="mobile"] .planetary-nav { gap:3px; }
[data-game-composition="mobile"] .planetary-nav > strong { font-size:.68rem; }
[data-game-composition="mobile"] .planetary-nav > button { min-height:24px; padding:2px 5px; }
[data-game-composition="mobile"] .planetary-dossier > small { font-size:.63rem; }
[data-game-composition="mobile"] .planetary-needs,[data-game-composition="mobile"] .planetary-proofs { grid-template-columns:1fr; gap:2px; }
[data-game-composition="mobile"] .planetary-needs > .art-object,[data-game-composition="mobile"] .planetary-proofs > span { padding:2px 5px; font-size:.61rem; }
[data-game-composition="mobile"] .planetary-actions { gap:3px; }
[data-game-composition="mobile"] .planetary-actions > small { font-size:.61rem; }
[data-game-composition="mobile"] .planetary-actions > button,[data-game-composition="mobile"] .planetary-dossier > button,
[data-game-composition="mobile"] .planetary-charter > button { min-height:24px; padding:2px 5px; font-size:.64rem; }
[data-game-composition="mobile"] .planetary-readiness { grid-template-columns:1fr; gap:2px; }
[data-game-composition="mobile"] .planetary-readiness > span { padding:2px 5px; font-size:.62rem; }
[data-game-composition="mobile"] .planetary-approved { font-size:.7rem; }


/* Planetary Administration shows ONE selectable planetary producer at a time;
   operating income and stage upgrades live in EXCLUSIVE compact panes.
   This cannot be replaced with an overflowing scroll list. */
.planetary-sites[hidden] { display:none !important; }
.planetary-sites { display:block; min-width:0; min-height:0; margin:5px 0; padding:7px 9px; border:1px solid #637b98; border-radius:9px; background:rgba(21,33,50,.48); }
.space-site-content,.space-site-body { display:grid; align-content:start; gap:5px; min-width:0; }
.space-site-nav { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:5px; }
.space-site-nav > strong { flex:1; min-width:0; font-size:.79rem; overflow-wrap:anywhere; text-align:center; }
.space-site-nav > small { font-size:.69rem; color:#c6dcfc; }
.space-site-nav > button { min-height:27px; padding:3px 8px; }
.space-site-tabs { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:5px; }
.space-site-tabs > button { min-height:27px; padding:3px; font-size:.72rem; }
.space-site-tabs > button.active { border-color:#acd0f2; color:#e6f3ff; background:#293d5a; }
.space-site-body > small,.space-site-body > strong { font-size:.72rem; }
.space-site-needs { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:5px; min-width:0; }
.space-site-needs > .art-object { min-width:0; padding:4px 6px; font-size:.69rem; white-space:normal; overflow-wrap:anywhere; }
.space-site-ledger { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:5px; }
.space-site-ledger > span { min-width:0; padding:4px 5px; border:1px solid #61768e; border-radius:6px; font-size:.7rem; overflow-wrap:anywhere; }
.space-site-actions { display:flex; flex-wrap:wrap; align-items:center; gap:5px; }
.space-site-actions > button,.space-site-body > button { min-height:27px; padding:4px 7px; font-size:.71rem; justify-self:start; }
.space-site-certified { color:#c4e6bc; font-size:.73rem; }
[data-game-composition="mobile"] .planetary-sites { margin:3px 0; padding:4px 5px; }
[data-game-composition="mobile"] .space-site-content,[data-game-composition="mobile"] .space-site-body { gap:3px; }
[data-game-composition="mobile"] .space-site-nav { gap:3px; }
[data-game-composition="mobile"] .space-site-nav > strong { font-size:.65rem; }
[data-game-composition="mobile"] .space-site-nav > small { font-size:.58rem; }
[data-game-composition="mobile"] .space-site-nav > button { min-height:23px; padding:2px 5px; }
[data-game-composition="mobile"] .space-site-tabs { gap:3px; }
[data-game-composition="mobile"] .space-site-tabs > button { min-height:23px; padding:2px; font-size:.61rem; }
[data-game-composition="mobile"] .space-site-needs,[data-game-composition="mobile"] .space-site-ledger { grid-template-columns:1fr; gap:2px; }
[data-game-composition="mobile"] .space-site-needs > .art-object,[data-game-composition="mobile"] .space-site-ledger > span { padding:2px 4px; font-size:.61rem; }
[data-game-composition="mobile"] .space-site-body > small { font-size:.61rem; }
[data-game-composition="mobile"] .space-site-actions > button,[data-game-composition="mobile"] .space-site-body > button { min-height:23px; padding:2px 5px; font-size:.63rem; }


/* Space Program displays only CURRENTLY DISCOVERED missions and exactly one
   active flight dossier. Research, assembly, launch cargo, and operations are
   partitioned into finite panes; do not turn this into a scrollable catalog. */
.space-missions[hidden] { display:none !important; }
.space-missions { display:block; min-width:0; min-height:0; padding:7px 9px; margin:5px 0; border:1px solid #6e89a3; border-radius:9px; background:rgba(19,31,52,.5); }
.space-mission-content,.space-mission-body { display:grid; align-content:start; gap:6px; min-width:0; }
.space-mission-nav { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:5px; }
.space-mission-nav > strong { flex:1; min-width:0; font-size:.81rem; text-align:center; overflow-wrap:anywhere; }
.space-mission-nav > small { font-size:.7rem; color:#c4d9f4; }
.space-mission-nav > button { min-height:27px; padding:3px 8px; }
.space-mission-tabs { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:5px; }
.space-mission-tabs > button { min-height:27px; padding:3px; font-size:.74rem; }
.space-mission-tabs > .active { color:#e1edff; background:#293b5b; border-color:#a6c8fa; }
.space-mission-body > small { font-size:.7rem; }
.space-mission-supply,.mission-supply { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:5px; }
.mission-supply > span,.mission-progress > span { display:block; min-width:0; border:1px solid #687d9d; border-radius:6px; padding:4px 6px; font-size:.71rem; overflow-wrap:anywhere; }
.mission-inputs { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:5px; }
.mission-inputs > .art-object { min-width:0; padding:5px 7px; white-space:normal; font-size:.68rem; overflow-wrap:anywhere; }
.mission-progress { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:5px; }
.space-mission-body > button { justify-self:start; min-height:28px; padding:4px 9px; font-size:.73rem; }
.mission-launched { display:block; color:#b7edc6; font-size:.76rem; }
[data-game-composition="mobile"] .space-missions { margin:3px 0; padding:4px 5px; }
[data-game-composition="mobile"] .space-mission-content,[data-game-composition="mobile"] .space-mission-body { gap:3px; }
[data-game-composition="mobile"] .space-mission-nav { gap:3px; }
[data-game-composition="mobile"] .space-mission-nav > strong { font-size:.66rem; }
[data-game-composition="mobile"] .space-mission-nav > small { font-size:.59rem; }
[data-game-composition="mobile"] .space-mission-nav > button { min-height:23px; padding:2px 5px; }
[data-game-composition="mobile"] .space-mission-tabs { gap:3px; }
[data-game-composition="mobile"] .space-mission-tabs > button { min-height:23px; padding:2px; font-size:.61rem; }
[data-game-composition="mobile"] .space-mission-body > small { font-size:.6rem; }
[data-game-composition="mobile"] .mission-inputs,[data-game-composition="mobile"] .mission-progress,[data-game-composition="mobile"] .mission-supply { grid-template-columns:1fr; gap:2px; }
[data-game-composition="mobile"] .mission-inputs > .art-object,[data-game-composition="mobile"] .mission-progress > span,[data-game-composition="mobile"] .mission-supply > span { padding:2px 4px; font-size:.6rem; }
[data-game-composition="mobile"] .space-mission-body > button { min-height:23px; padding:2px 5px; font-size:.63rem; }
[data-game-composition="mobile"] .mission-launched { font-size:.63rem; }


/* Orbital Industry: one active zero-G factory, with three mutually exclusive
   panes. Keep real input/readiness buttons finite inside the playable canvas. */
.orbital-facilities[hidden] { display:none !important; }
.orbital-facilities { display:block; min-width:0; min-height:0; margin:5px 0; padding:7px 9px; border:1px solid #8489b4; border-radius:9px; background:rgba(28,27,49,.53); }
.orbital-content,.orbital-body { display:grid; align-content:start; min-width:0; gap:5px; }
.orbital-nav { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; min-width:0; gap:5px; }
.orbital-nav > strong { min-width:0; flex:1; text-align:center; font-size:.8rem; overflow-wrap:anywhere; }
.orbital-nav > small { font-size:.69rem; color:#d8c8f1; }
.orbital-nav > button { min-height:27px; padding:3px 8px; }
.orbital-tabs { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:5px; }
.orbital-tabs > button { min-height:27px; padding:3px; font-size:.74rem; }
.orbital-tabs > .active { border-color:#c5b3ff; color:#f3e9ff; background:#453462; }
.orbital-body > small { font-size:.71rem; }
.orbital-materials { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:5px; }
.orbital-materials > .art-object { min-width:0; padding:4px 7px; font-size:.69rem; white-space:normal; overflow-wrap:anywhere; }
.orbital-ledger { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:5px; }
.orbital-ledger > span { min-width:0; padding:5px 7px; font-size:.7rem; border:1px solid #78759c; border-radius:6px; overflow-wrap:anywhere; }
.orbital-actions { display:flex; flex-wrap:wrap; gap:5px; align-items:center; }
.orbital-actions > button,.orbital-body > button { min-height:27px; padding:4px 7px; font-size:.71rem; justify-self:start; }
.orbital-certified { color:#d6f6be; font-size:.71rem; }
[data-game-composition="mobile"] .orbital-facilities { padding:4px 5px; margin:3px 0; }
[data-game-composition="mobile"] .orbital-content,[data-game-composition="mobile"] .orbital-body { gap:3px; }
[data-game-composition="mobile"] .orbital-nav { gap:3px; }
[data-game-composition="mobile"] .orbital-nav > strong { font-size:.65rem; }
[data-game-composition="mobile"] .orbital-nav > small { font-size:.58rem; }
[data-game-composition="mobile"] .orbital-nav > button { min-height:23px; padding:2px 5px; }
[data-game-composition="mobile"] .orbital-tabs { gap:3px; }
[data-game-composition="mobile"] .orbital-tabs > button { min-height:23px; padding:2px; font-size:.61rem; }
[data-game-composition="mobile"] .orbital-body > small { font-size:.61rem; }
[data-game-composition="mobile"] .orbital-materials,[data-game-composition="mobile"] .orbital-ledger { grid-template-columns:1fr; gap:2px; }
[data-game-composition="mobile"] .orbital-materials > .art-object,[data-game-composition="mobile"] .orbital-ledger > span { font-size:.61rem; padding:2px 4px; }
[data-game-composition="mobile"] .orbital-actions { gap:3px; }
[data-game-composition="mobile"] .orbital-actions > button,[data-game-composition="mobile"] .orbital-body > button { min-height:23px; padding:2px 5px; font-size:.62rem; }
[data-game-composition="mobile"] .orbital-certified { font-size:.61rem; }


/* Planetary Network: show ONLY already discoverable planetary frontiers one
   at a time. Each of three panes replaces the others; never scroll the galaxy
   catalog or hide legitimate controls beyond the playable game rectangle. */
.planetary-frontiers[hidden] { display:none !important; }
.planetary-frontiers { display:block; min-width:0; min-height:0; margin:5px 0; padding:7px 9px; border:1px solid #728a91; border-radius:9px; background:rgba(24,36,49,.52); }
.planetary-front-content,.planetary-front-body { display:grid; align-content:start; gap:5px; min-width:0; }
.planetary-front-nav { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:5px; min-width:0; }
.planetary-front-nav > strong { flex:1; min-width:0; font-size:.8rem; text-align:center; overflow-wrap:anywhere; }
.planetary-front-nav > small { font-size:.68rem; color:#cee7e2; }
.planetary-front-nav > button { min-height:27px; padding:3px 8px; }
.planetary-front-tabs { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:5px; }
.planetary-front-tabs > button { min-height:27px; padding:3px; font-size:.73rem; }
.planetary-front-tabs > .active { color:#eeffff; background:#285057; border-color:#a3e5e9; }
.planetary-front-body > small { font-size:.71rem; }
.planetary-front-needs { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:5px; }
.planetary-front-needs > .art-object { min-width:0; white-space:normal; overflow-wrap:anywhere; padding:4px 7px; font-size:.7rem; }
.planetary-front-proof { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:5px; }
.planetary-front-proof > span { display:block; min-width:0; border:1px solid #7897a0; border-radius:6px; padding:4px 6px; font-size:.7rem; overflow-wrap:anywhere; }
.planetary-front-actions { display:flex; flex-wrap:wrap; align-items:center; gap:5px; }
.planetary-front-actions > small { font-size:.7rem; }
.planetary-front-actions > button { min-height:27px; padding:4px 7px; font-size:.72rem; }
.planetary-front-established { color:#baedc3; font-size:.76rem; }
[data-game-composition="mobile"] .planetary-frontiers { margin:3px 0; padding:4px 5px; }
[data-game-composition="mobile"] .planetary-front-content,[data-game-composition="mobile"] .planetary-front-body { gap:3px; }
[data-game-composition="mobile"] .planetary-front-nav { gap:3px; }
[data-game-composition="mobile"] .planetary-front-nav > strong { font-size:.66rem; }
[data-game-composition="mobile"] .planetary-front-nav > small { font-size:.59rem; }
[data-game-composition="mobile"] .planetary-front-nav > button { min-height:23px; padding:2px 5px; }
[data-game-composition="mobile"] .planetary-front-tabs { gap:3px; }
[data-game-composition="mobile"] .planetary-front-tabs > button { min-height:23px; padding:2px; font-size:.61rem; }
[data-game-composition="mobile"] .planetary-front-body > small { font-size:.61rem; }
[data-game-composition="mobile"] .planetary-front-needs,[data-game-composition="mobile"] .planetary-front-proof { grid-template-columns:1fr; gap:2px; }
[data-game-composition="mobile"] .planetary-front-needs > .art-object,[data-game-composition="mobile"] .planetary-front-proof > span { padding:2px 5px; font-size:.6rem; }
[data-game-composition="mobile"] .planetary-front-actions { gap:3px; }
[data-game-composition="mobile"] .planetary-front-actions > button { min-height:23px; padding:2px 4px; font-size:.62rem; }
[data-game-composition="mobile"] .planetary-front-actions > small { font-size:.6rem; }

/* Stellar Engineering exposes one of five sequential Dyson phases at a time.
   Phase/Operations/Upgrades are mutually exclusive finite views. */
.dyson-phases[hidden] { display:none !important; }
.dyson-phases { display:block; min-width:0; min-height:0; margin:5px 0; padding:7px 9px; border:1px solid #a48c51; border-radius:9px; background:rgba(47,35,18,.5); }
.dyson-content,.dyson-body { display:grid; align-content:start; gap:5px; min-width:0; }
.dyson-nav { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:5px; min-width:0; }
.dyson-nav > strong { flex:1; min-width:0; text-align:center; font-size:.8rem; overflow-wrap:anywhere; color:#ffe8a9; }
.dyson-nav > small { font-size:.68rem; color:#e6d3a1; }
.dyson-nav > button { min-height:27px; padding:3px 8px; }
.dyson-tabs { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:5px; }
.dyson-tabs > button { min-height:27px; padding:3px; font-size:.73rem; }
.dyson-tabs > .active { color:#fff2be; background:#5b431f; border-color:#efcd77; }
.dyson-body > small { font-size:.71rem; color:#ead9ad; }
.dyson-needs,.dyson-proof { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:5px; min-width:0; }
.dyson-needs > .art-object,.dyson-proof > span { min-width:0; white-space:normal; overflow-wrap:anywhere; padding:4px 7px; border:1px solid #8d7848; border-radius:6px; font-size:.69rem; }
.dyson-body > button { justify-self:start; min-height:27px; padding:4px 8px; font-size:.72rem; }
.dyson-complete { color:#c8f0a6; font-size:.77rem; }
[data-game-composition="mobile"] .dyson-phases { margin:3px 0; padding:4px 5px; }
[data-game-composition="mobile"] .dyson-content,[data-game-composition="mobile"] .dyson-body { gap:3px; }
[data-game-composition="mobile"] .dyson-nav { gap:3px; }
[data-game-composition="mobile"] .dyson-nav > strong { font-size:.65rem; }
[data-game-composition="mobile"] .dyson-nav > small { font-size:.59rem; }
[data-game-composition="mobile"] .dyson-nav > button { min-height:23px; padding:2px 5px; }
[data-game-composition="mobile"] .dyson-tabs { gap:3px; }
[data-game-composition="mobile"] .dyson-tabs > button { min-height:23px; padding:2px; font-size:.61rem; }
[data-game-composition="mobile"] .dyson-body > small { font-size:.61rem; }
[data-game-composition="mobile"] .dyson-needs,[data-game-composition="mobile"] .dyson-proof { grid-template-columns:1fr; gap:2px; }
[data-game-composition="mobile"] .dyson-needs > .art-object,[data-game-composition="mobile"] .dyson-proof > span { padding:2px 5px; font-size:.6rem; }
[data-game-composition="mobile"] .dyson-body > button { min-height:23px; padding:2px 5px; font-size:.62rem; }

/* Solar Systems: display only one already-discovered connected frontier at
   a time. Frontier / Operations / Upgrades replace each other; the ten-system
   network is never rendered as a scrolling catalog. */
.solar-frontiers[hidden] { display:none !important; }
.solar-frontiers { display:block; min-width:0; min-height:0; margin:5px 0; padding:7px 9px; border:1px solid #6d839d; border-radius:9px; background:rgba(20,30,46,.52); }
.solar-front-content,.solar-front-body { display:grid; align-content:start; gap:5px; min-width:0; }
.solar-front-nav { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:5px; min-width:0; }
.solar-front-nav > strong { flex:1; min-width:0; text-align:center; font-size:.8rem; overflow-wrap:anywhere; color:#dcecff; }
.solar-front-nav > small { font-size:.68rem; color:#bfd0e2; }
.solar-front-nav > button { min-height:27px; padding:3px 8px; }
.solar-front-tabs { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:5px; }
.solar-front-tabs > button { min-height:27px; padding:3px; font-size:.73rem; }
.solar-front-tabs > .active { color:#eef7ff; background:#274160; border-color:#8fbbe6; }
.solar-front-body > small { font-size:.71rem; color:#cfdeed; }
.solar-origin { display:grid; gap:3px; min-width:0; font-size:.7rem; }
.solar-origin > select { min-width:0; max-width:100%; border:1px solid #70869c; border-radius:6px; padding:4px; background:#1d2c3f; color:#e8f4ff; }
.solar-needs { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:5px; min-width:0; }
.solar-needs > .art-object { min-width:0; white-space:normal; overflow-wrap:anywhere; padding:4px 7px; font-size:.69rem; }
.solar-route { display:flex; flex-wrap:wrap; align-items:baseline; justify-content:space-between; gap:5px; min-width:0; }
.solar-route > strong { font-size:.73rem; overflow-wrap:anywhere; }
.solar-route > span { font-size:.68rem; color:#cadbeb; }
.solar-proof { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:5px; min-width:0; }
.solar-proof > span { min-width:0; border:1px solid #6d879f; border-radius:6px; padding:4px 6px; font-size:.69rem; overflow-wrap:anywhere; }
.solar-actions { display:flex; flex-wrap:wrap; align-items:center; gap:5px; }
.solar-actions > button,.solar-front-body > button { min-height:27px; padding:4px 7px; font-size:.71rem; }
.solar-established { color:#bbebc7; font-size:.76rem; }
[data-game-composition="mobile"] .solar-frontiers { margin:3px 0; padding:4px 5px; }
[data-game-composition="mobile"] .solar-front-content,[data-game-composition="mobile"] .solar-front-body { gap:3px; }
[data-game-composition="mobile"] .solar-front-nav { gap:3px; }
[data-game-composition="mobile"] .solar-front-nav > strong { font-size:.65rem; }
[data-game-composition="mobile"] .solar-front-nav > small { font-size:.59rem; }
[data-game-composition="mobile"] .solar-front-nav > button { min-height:23px; padding:2px 5px; }
[data-game-composition="mobile"] .solar-front-tabs { gap:3px; }
[data-game-composition="mobile"] .solar-front-tabs > button { min-height:23px; padding:2px; font-size:.61rem; }
[data-game-composition="mobile"] .solar-front-body > small,[data-game-composition="mobile"] .solar-origin { font-size:.6rem; }
[data-game-composition="mobile"] .solar-origin > select { padding:2px; font-size:.61rem; }
[data-game-composition="mobile"] .solar-needs,[data-game-composition="mobile"] .solar-proof { grid-template-columns:1fr; gap:2px; }
[data-game-composition="mobile"] .solar-needs > .art-object,[data-game-composition="mobile"] .solar-proof > span { padding:2px 5px; font-size:.59rem; }
[data-game-composition="mobile"] .solar-route { gap:2px; }
[data-game-composition="mobile"] .solar-route > strong,[data-game-composition="mobile"] .solar-route > span { font-size:.59rem; }
[data-game-composition="mobile"] .solar-actions { gap:3px; }
[data-game-composition="mobile"] .solar-actions > button,[data-game-composition="mobile"] .solar-front-body > button { min-height:23px; padding:2px 4px; font-size:.61rem; }

/* Star Clusters: one paired interstellar region at a time, with mutually
   exclusive Cluster Link / Operations / Upgrades views. */
.star-cluster-network[hidden] { display:none !important; }
.star-cluster-network { display:block; min-width:0; min-height:0; margin:5px 0; padding:7px 9px; border:1px solid #7669a3; border-radius:9px; background:rgba(31,24,51,.52); }
.star-cluster-content,.star-cluster-body { display:grid; align-content:start; gap:5px; min-width:0; }
.star-cluster-nav { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:5px; min-width:0; }
.star-cluster-nav > strong { flex:1; min-width:0; text-align:center; font-size:.8rem; overflow-wrap:anywhere; color:#e7dcff; }
.star-cluster-nav > small { font-size:.68rem; color:#cec3e8; }
.star-cluster-nav > button { min-height:27px; padding:3px 8px; }
.star-cluster-tabs { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:5px; }
.star-cluster-tabs > button { min-height:27px; padding:3px; font-size:.73rem; }
.star-cluster-tabs > .active { color:#f5edff; background:#49396e; border-color:#aa91dc; }
.star-cluster-body > small { font-size:.71rem; color:#d7cbed; }
.star-cluster-members,.star-cluster-needs,.star-cluster-proof { display:grid; gap:5px; min-width:0; }
.star-cluster-members,.star-cluster-needs { grid-template-columns:repeat(2,minmax(0,1fr)); }
.star-cluster-proof { grid-template-columns:repeat(3,minmax(0,1fr)); }
.star-cluster-members > .art-object,.star-cluster-needs > .art-object,.star-cluster-proof > span { min-width:0; white-space:normal; overflow-wrap:anywhere; padding:4px 7px; border-radius:6px; font-size:.69rem; }
.star-cluster-proof > span { border:1px solid #7669a3; }
.star-cluster-body > button { justify-self:start; min-height:27px; padding:4px 8px; font-size:.71rem; }
.star-cluster-complete { color:#c9efbd; font-size:.76rem; }
[data-game-composition="mobile"] .star-cluster-network { margin:3px 0; padding:4px 5px; }
[data-game-composition="mobile"] .star-cluster-content,[data-game-composition="mobile"] .star-cluster-body { gap:3px; }
[data-game-composition="mobile"] .star-cluster-nav { gap:3px; }
[data-game-composition="mobile"] .star-cluster-nav > strong { font-size:.65rem; }
[data-game-composition="mobile"] .star-cluster-nav > small { font-size:.59rem; }
[data-game-composition="mobile"] .star-cluster-nav > button { min-height:23px; padding:2px 5px; }
[data-game-composition="mobile"] .star-cluster-tabs { gap:3px; }
[data-game-composition="mobile"] .star-cluster-tabs > button { min-height:23px; padding:2px; font-size:.61rem; }
[data-game-composition="mobile"] .star-cluster-body > small { font-size:.6rem; }
[data-game-composition="mobile"] .star-cluster-members,[data-game-composition="mobile"] .star-cluster-needs,[data-game-composition="mobile"] .star-cluster-proof { grid-template-columns:1fr; gap:2px; }
[data-game-composition="mobile"] .star-cluster-members > .art-object,[data-game-composition="mobile"] .star-cluster-needs > .art-object,[data-game-composition="mobile"] .star-cluster-proof > span { padding:2px 5px; font-size:.59rem; }
[data-game-composition="mobile"] .star-cluster-body > button { min-height:23px; padding:2px 5px; font-size:.61rem; }

/* First Galaxy: one Milky Way sector OR its final charter, never a
   vertically scrolling catalog. Layout must stay within the game canvas. */
.first-galaxy-survey[hidden] { display:none !important; }
.first-galaxy-survey { display:block; margin:5px 0; padding:7px 9px; min-height:0; min-width:0; border:1px solid #597e94; border-radius:9px; background:rgba(12,29,46,.52); }
.galaxy-survey-content,.galaxy-survey-body { display:grid; align-content:start; gap:5px; min-width:0; }
.galaxy-survey-tabs { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:5px; }
.galaxy-survey-tabs>button { min-height:27px; padding:3px; font-size:.75rem; }
.galaxy-survey-tabs>.active { color:#f0faff; background:#24445f; border-color:#9bcae5; }
.galaxy-survey-nav { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:5px; min-width:0; }
.galaxy-survey-nav>strong { flex:1; min-width:0; text-align:center; font-size:.81rem; overflow-wrap:anywhere; }
.galaxy-survey-nav>small { font-size:.68rem; }
.galaxy-survey-nav>button { min-height:27px; padding:3px 8px; }
.galaxy-survey-supplies,.galaxy-survey-proof { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:5px; min-width:0; }
.galaxy-survey-proof { grid-template-columns:repeat(3,minmax(0,1fr)); }
.galaxy-survey-supplies>.art-object,.galaxy-survey-proof>span { min-width:0; overflow-wrap:anywhere; padding:4px 7px; border:1px solid #597e94; border-radius:6px; font-size:.71rem; }
.galaxy-survey-body>small { font-size:.7rem; }
.galaxy-survey-body>button,.galaxy-survey-actions>button { min-height:27px; justify-self:start; padding:4px 8px; font-size:.71rem; }
.galaxy-survey-actions { display:flex; flex-wrap:wrap; gap:5px; align-items:center; min-width:0; }
.galaxy-survey-actions>small { font-size:.7rem; }
.galaxy-survey-done { color:#c4eed0; font-size:.77rem; }
[data-game-composition="mobile"] .first-galaxy-survey { margin:3px 0; padding:4px 5px; }
[data-game-composition="mobile"] .galaxy-survey-content,[data-game-composition="mobile"] .galaxy-survey-body { gap:3px; }
[data-game-composition="mobile"] .galaxy-survey-nav { gap:3px; }
[data-game-composition="mobile"] .galaxy-survey-nav>strong { font-size:.66rem; }
[data-game-composition="mobile"] .galaxy-survey-nav>small { font-size:.58rem; }
[data-game-composition="mobile"] .galaxy-survey-nav>button { min-height:23px; padding:2px 5px; }
[data-game-composition="mobile"] .galaxy-survey-tabs>button { min-height:23px; padding:2px; font-size:.62rem; }
[data-game-composition="mobile"] .galaxy-survey-supplies,[data-game-composition="mobile"] .galaxy-survey-proof { grid-template-columns:1fr; gap:2px; }
[data-game-composition="mobile"] .galaxy-survey-supplies>.art-object,[data-game-composition="mobile"] .galaxy-survey-proof>span { padding:2px 5px; font-size:.59rem; }
[data-game-composition="mobile"] .galaxy-survey-body>small { font-size:.6rem; }
[data-game-composition="mobile"] .galaxy-survey-body>button,[data-game-composition="mobile"] .galaxy-survey-actions>button { min-height:23px; padding:2px 5px; font-size:.61rem; }

/* Ten physically funded Galactic freight lanes share one compact route viewport.
   Freight, Operations and Upgrades are mutually exclusive, never a long list. */
.galactic-freight[hidden] { display:none !important; }
.galactic-freight { display:block; margin:5px 0; padding:7px 9px; min-width:0; min-height:0; border:1px solid #598b89; border-radius:9px; background:rgba(15,38,40,.52); }
.freight-content,.freight-body { display:grid; align-content:start; gap:5px; min-width:0; }
.freight-nav { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; min-width:0; gap:5px; }
.freight-nav>strong { flex:1; text-align:center; font-size:.8rem; min-width:0; overflow-wrap:anywhere; color:#e2fff7; }
.freight-nav>small { font-size:.68rem; }
.freight-nav>button { min-height:27px; padding:3px 8px; }
.freight-tabs { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:5px; }
.freight-tabs>button { padding:3px; min-height:27px; font-size:.74rem; }
.freight-tabs>.active { border-color:#91d2c1; background:#234a47; color:#e3fff5; }
.freight-body>small { font-size:.7rem; color:#ccede1; }
.freight-supplies,.freight-proof { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:5px; min-width:0; }
.freight-supplies>.art-object,.freight-proof>span { min-width:0; padding:4px 7px; border:1px solid #648e88; border-radius:6px; font-size:.7rem; overflow-wrap:anywhere; white-space:normal; }
.freight-body>button,.freight-buttons>button,.freight-auto { min-height:27px; padding:4px 8px; font-size:.7rem; justify-self:start; }
.freight-buttons { display:flex; flex-wrap:wrap; gap:5px; min-width:0; }
.freight-complete { font-size:.77rem; color:#c3f4c9; }
[data-game-composition="mobile"] .galactic-freight { margin:3px 0; padding:4px 5px; }
[data-game-composition="mobile"] .freight-content,[data-game-composition="mobile"] .freight-body { gap:3px; }
[data-game-composition="mobile"] .freight-nav { gap:3px; }
[data-game-composition="mobile"] .freight-nav>strong { font-size:.66rem; }
[data-game-composition="mobile"] .freight-nav>small { font-size:.59rem; }
[data-game-composition="mobile"] .freight-nav>button { min-height:23px; padding:2px 5px; }
[data-game-composition="mobile"] .freight-tabs { gap:3px; }
[data-game-composition="mobile"] .freight-tabs>button { min-height:23px; padding:2px; font-size:.61rem; }
[data-game-composition="mobile"] .freight-supplies,[data-game-composition="mobile"] .freight-proof { grid-template-columns:1fr; gap:2px; }
[data-game-composition="mobile"] .freight-supplies>.art-object,[data-game-composition="mobile"] .freight-proof>span { padding:2px 5px; font-size:.59rem; }
[data-game-composition="mobile"] .freight-body>small { font-size:.59rem; }
[data-game-composition="mobile"] .freight-buttons { gap:3px; }
[data-game-composition="mobile"] .freight-body>button,[data-game-composition="mobile"] .freight-buttons>button,[data-game-composition="mobile"] .freight-auto { min-height:23px; padding:2px 5px; font-size:.61rem; }

/* Galaxy Groups are five different institutions, one shown at a time.
   Each multi-task institution shows ONE subtask; no scrollable task catalogs. */
.galaxy-federations[hidden] { display:none !important; }
.galaxy-federations { display:block; min-width:0; min-height:0; margin:5px 0; padding:7px 9px; border:1px solid #977cbb; border-radius:9px; background:rgba(34,24,52,.52); }
.federation-content,.federation-body { display:grid; align-content:start; gap:5px; min-width:0; }
.federation-nav,.federation-task-nav { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:5px; min-width:0; }
.federation-nav>strong,.federation-task-nav>strong { flex:1; min-width:0; font-size:.79rem; text-align:center; overflow-wrap:anywhere; color:#e9d8ff; }
.federation-nav>small { font-size:.68rem; }
.federation-nav>button,.federation-task-nav>button { min-height:27px; padding:3px 8px; }
.federation-tabs { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:5px; }
.federation-tabs>button { min-height:27px; padding:3px; font-size:.74rem; }
.federation-tabs>.active { border-color:#c39de6; color:#fff5ff; background:#4a316d; }
.federation-body>small,.federation-content>small { font-size:.7rem; color:#dacbed; }
.federation-supplies,.federation-proof { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:5px; min-width:0; }
.federation-proof { grid-template-columns:repeat(3,minmax(0,1fr)); }
.federation-supplies>.art-object,.federation-proof>span { min-width:0; overflow-wrap:anywhere; padding:4px 7px; font-size:.69rem; white-space:normal; border:1px solid #896bae; border-radius:6px; }
.federation-actions { display:flex; flex-wrap:wrap; align-items:center; gap:5px; min-width:0; }
.federation-body>button,.federation-actions>button { justify-self:start; min-height:27px; padding:4px 8px; font-size:.7rem; }
.federation-done { font-size:.76rem; color:#c9f2c8; }
[data-game-composition="mobile"] .galaxy-federations { margin:3px 0; padding:4px 5px; }
[data-game-composition="mobile"] .federation-content,[data-game-composition="mobile"] .federation-body { gap:3px; }
[data-game-composition="mobile"] .federation-nav,[data-game-composition="mobile"] .federation-task-nav { gap:3px; }
[data-game-composition="mobile"] .federation-nav>strong,[data-game-composition="mobile"] .federation-task-nav>strong { font-size:.64rem; }
[data-game-composition="mobile"] .federation-nav>small { font-size:.58rem; }
[data-game-composition="mobile"] .federation-nav>button,[data-game-composition="mobile"] .federation-task-nav>button { min-height:23px; padding:2px 5px; }
[data-game-composition="mobile"] .federation-tabs>button { min-height:23px; padding:2px; font-size:.61rem; }
[data-game-composition="mobile"] .federation-supplies,[data-game-composition="mobile"] .federation-proof { grid-template-columns:1fr; gap:2px; }
[data-game-composition="mobile"] .federation-supplies>.art-object,[data-game-composition="mobile"] .federation-proof>span { padding:2px 5px; font-size:.59rem; }
[data-game-composition="mobile"] .federation-body>small,[data-game-composition="mobile"] .federation-content>small { font-size:.59rem; }
[data-game-composition="mobile"] .federation-actions { gap:3px; }
[data-game-composition="mobile"] .federation-body>button,[data-game-composition="mobile"] .federation-actions>button { min-height:23px; padding:2px 5px; font-size:.6rem; }

/* Five-node physical Galaxy Cluster topology: show only one node and one
   mutually exclusive stage pane. No scrolling catalogue or clipped content. */
.galaxy-constellations[hidden]{display:none!important}
.galaxy-constellations{display:block;min-width:0;min-height:0;margin:5px 0;padding:7px 9px;border:1px solid #9184b1;border-radius:9px;background:rgba(29,23,50,.5)}
.constellation-content,.constellation-body{display:grid;align-content:start;gap:5px;min-width:0}
.constellation-nav{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:5px;min-width:0}
.constellation-nav>strong{flex:1;min-width:0;text-align:center;font-size:.8rem;color:#ecdcff;overflow-wrap:anywhere}
.constellation-nav>small{font-size:.68rem;color:#d3c8e8}
.constellation-nav>button{min-height:27px;padding:3px 8px}
.constellation-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px}
.constellation-tabs>button{min-height:27px;padding:3px;font-size:.73rem}
.constellation-tabs>.active{background:#473365;border-color:#baa0dc;color:#ffecff}
.constellation-body>small,.constellation-content>small{font-size:.71rem;color:#e4d5ee}
.constellation-items{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;min-width:0}
.constellation-items>.art-object{min-width:0;white-space:normal;overflow-wrap:anywhere;border:1px solid #8f7caf;border-radius:6px;padding:4px 6px;font-size:.69rem}
.constellation-body>button{justify-self:start;min-height:27px;padding:4px 8px;font-size:.71rem}
.constellation-complete{font-size:.77rem;color:#c3edb6}
[data-game-composition="mobile"] .galaxy-constellations{margin:3px 0;padding:4px 5px}
[data-game-composition="mobile"] .constellation-content,[data-game-composition="mobile"] .constellation-body{gap:3px}
[data-game-composition="mobile"] .constellation-nav{gap:3px}
[data-game-composition="mobile"] .constellation-nav>strong{font-size:.65rem}
[data-game-composition="mobile"] .constellation-nav>small{font-size:.59rem}
[data-game-composition="mobile"] .constellation-nav>button{min-height:23px;padding:2px 5px}
[data-game-composition="mobile"] .constellation-tabs{gap:3px}
[data-game-composition="mobile"] .constellation-tabs>button{min-height:23px;padding:2px;font-size:.61rem}
[data-game-composition="mobile"] .constellation-items{grid-template-columns:1fr;gap:2px}
[data-game-composition="mobile"] .constellation-items>.art-object{padding:2px 5px;font-size:.58rem}
[data-game-composition="mobile"] .constellation-body>small,[data-game-composition="mobile"] .constellation-content>small{font-size:.59rem}
[data-game-composition="mobile"] .constellation-body>button{min-height:23px;padding:2px 5px;font-size:.61rem}

/* Universe: only one cosmogenesis experiment OR one cosmology blueprint;
   no scrolling project catalogs or hidden clipped study results. */
.universe-genesis[hidden]{display:none!important}
.universe-genesis{display:block;min-width:0;min-height:0;margin:5px 0;padding:7px 9px;border:1px solid #6f94b6;border-radius:9px;background:rgba(20,36,58,.52)}
.genesis-content,.genesis-body{display:grid;align-content:start;gap:5px;min-width:0}
.genesis-tabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px}
.genesis-tabs>button{min-height:27px;padding:3px;font-size:.74rem}
.genesis-tabs>.active{border-color:#acd8f4;background:#2b5067;color:#e4faff}
.genesis-nav{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:5px;min-width:0}
.genesis-nav>strong{flex:1;min-width:0;text-align:center;overflow-wrap:anywhere;font-size:.8rem}
.genesis-nav>small{font-size:.68rem}
.genesis-nav>button{min-height:27px;padding:3px 8px}
.genesis-stock,.genesis-proof{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;min-width:0}
.genesis-stock>.art-object,.genesis-proof>.art-object{min-width:0;overflow-wrap:anywhere;white-space:normal;border-radius:6px;border:1px solid #729bb8;padding:4px 7px;font-size:.69rem}
.genesis-choice{display:grid;gap:3px;min-width:0;font-size:.71rem}
.genesis-choice>select{min-width:0;width:100%;max-width:100%;background:#1c3346;color:#e9f7ff;border:1px solid #729bb8;padding:4px;border-radius:6px}
.genesis-body>small{color:#d0e8f5;font-size:.7rem}
.genesis-body>button{min-height:27px;justify-self:start;padding:4px 7px;font-size:.7rem}
.genesis-done{color:#c2efbe;font-size:.77rem}
[data-game-composition="mobile"] .universe-genesis{margin:3px 0;padding:4px 5px}
[data-game-composition="mobile"] .genesis-content,[data-game-composition="mobile"] .genesis-body{gap:3px}
[data-game-composition="mobile"] .genesis-tabs>button{min-height:23px;padding:2px;font-size:.61rem}
[data-game-composition="mobile"] .genesis-nav{gap:3px}
[data-game-composition="mobile"] .genesis-nav>strong{font-size:.65rem}
[data-game-composition="mobile"] .genesis-nav>small{font-size:.59rem}
[data-game-composition="mobile"] .genesis-nav>button{min-height:23px;padding:2px 5px}
[data-game-composition="mobile"] .genesis-stock,[data-game-composition="mobile"] .genesis-proof{grid-template-columns:1fr;gap:2px}
[data-game-composition="mobile"] .genesis-stock>.art-object,[data-game-composition="mobile"] .genesis-proof>.art-object{padding:2px 5px;font-size:.59rem}
[data-game-composition="mobile"] .genesis-body>small,[data-game-composition="mobile"] .genesis-choice{font-size:.59rem}
[data-game-composition="mobile"] .genesis-choice>select{padding:2px;font-size:.61rem}
[data-game-composition="mobile"] .genesis-body>button{min-height:23px;padding:2px 5px;font-size:.61rem}

/* Cosmic Web: one discovered route at a time. Energy Route / Operations /
   Upgrades replace each other; never render the ten-link graph as a scroll list. */
.cosmic-web-routing[hidden]{display:none!important}
.cosmic-web-routing{display:block;min-width:0;min-height:0;margin:5px 0;padding:7px 9px;border:1px solid #5f95a3;border-radius:9px;background:rgba(17,39,48,.52)}
.cosmic-content,.cosmic-body{display:grid;align-content:start;gap:5px;min-width:0}
.cosmic-nav{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:5px;min-width:0}
.cosmic-nav>strong{flex:1;min-width:0;text-align:center;font-size:.8rem;color:#d7f4ff;overflow-wrap:anywhere}
.cosmic-nav>small{font-size:.68rem;color:#b9d7df}
.cosmic-nav>button{min-height:27px;padding:3px 8px}
.cosmic-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px}
.cosmic-tabs>button{min-height:27px;padding:3px;font-size:.73rem}
.cosmic-tabs>.active{background:#245061;border-color:#85c7d8;color:#e9fbff}
.cosmic-body>small,.cosmic-content>small{font-size:.7rem;color:#c9e4ea}
.cosmic-priors,.cosmic-needs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px;min-width:0}
.cosmic-priors>.art-object,.cosmic-needs>.art-object{min-width:0;white-space:normal;overflow-wrap:anywhere;padding:4px 6px;border-radius:6px;font-size:.68rem}
.cosmic-route-state{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:5px;min-width:0}
.cosmic-route-state>strong{font-size:.73rem;overflow-wrap:anywhere}
.cosmic-route-state>span{font-size:.67rem;color:#c8dfe5}
.cosmic-flux{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px}
.cosmic-flux>button{min-height:25px;padding:2px 5px;font-size:.68rem}
.cosmic-flux>.active{border-color:#85c7d8;color:#e9fbff;background:#245061}
.cosmic-actions{display:flex;flex-wrap:wrap;gap:5px;align-items:center}
.cosmic-actions>button,.cosmic-body>button{min-height:27px;padding:4px 7px;font-size:.7rem}
.cosmic-complete{color:#c5efc4;font-size:.76rem}
[data-game-composition="mobile"] .cosmic-web-routing{margin:3px 0;padding:4px 5px}
[data-game-composition="mobile"] .cosmic-content,[data-game-composition="mobile"] .cosmic-body{gap:3px}
[data-game-composition="mobile"] .cosmic-nav{gap:3px}
[data-game-composition="mobile"] .cosmic-nav>strong{font-size:.65rem}
[data-game-composition="mobile"] .cosmic-nav>small{font-size:.58rem}
[data-game-composition="mobile"] .cosmic-nav>button{min-height:23px;padding:2px 5px}
[data-game-composition="mobile"] .cosmic-tabs{gap:3px}
[data-game-composition="mobile"] .cosmic-tabs>button{min-height:23px;padding:2px;font-size:.6rem}
[data-game-composition="mobile"] .cosmic-body>small,[data-game-composition="mobile"] .cosmic-content>small{font-size:.59rem}
[data-game-composition="mobile"] .cosmic-priors,[data-game-composition="mobile"] .cosmic-needs{grid-template-columns:1fr;gap:2px}
[data-game-composition="mobile"] .cosmic-priors>.art-object,[data-game-composition="mobile"] .cosmic-needs>.art-object{padding:2px 5px;font-size:.58rem}
[data-game-composition="mobile"] .cosmic-route-state{gap:2px}
[data-game-composition="mobile"] .cosmic-route-state>strong,[data-game-composition="mobile"] .cosmic-route-state>span{font-size:.59rem}
[data-game-composition="mobile"] .cosmic-flux{gap:2px}
[data-game-composition="mobile"] .cosmic-flux>button{min-height:22px;padding:1px 3px;font-size:.58rem}
[data-game-composition="mobile"] .cosmic-actions{gap:3px}
[data-game-composition="mobile"] .cosmic-actions>button,[data-game-composition="mobile"] .cosmic-body>button{min-height:23px;padding:2px 4px;font-size:.6rem}

/* Multiverse: one discovered alternate Universe at a time. Universe Lab /
   Operations / Upgrades are mutually exclusive finite views. */
.multiverse-lab[hidden]{display:none!important}
.multiverse-lab{display:block;min-width:0;min-height:0;margin:5px 0;padding:7px 9px;border:1px solid #806aa8;border-radius:9px;background:rgba(35,25,55,.52)}
.multi-content,.multi-body{display:grid;align-content:start;gap:5px;min-width:0}
.multi-nav{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:5px;min-width:0}
.multi-nav>strong{flex:1;min-width:0;text-align:center;font-size:.8rem;color:#eee1ff;overflow-wrap:anywhere}
.multi-nav>small{font-size:.68rem;color:#d5c6e8}
.multi-nav>button{min-height:27px;padding:3px 8px}
.multi-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px}
.multi-tabs>button{min-height:27px;padding:3px;font-size:.73rem}
.multi-tabs>.active{background:#4b376e;border-color:#b29add;color:#f7efff}
.multi-body>small,.multi-content>small{font-size:.7rem;color:#dfd1ec}
.multi-seed-needs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;min-width:0}
.multi-seed-needs>.art-object{min-width:0;white-space:normal;overflow-wrap:anywhere;padding:4px 6px;border-radius:6px;font-size:.68rem}
.multi-axes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;min-width:0}
.multi-axis{display:grid;gap:4px;align-content:start;min-width:0;padding:5px;border:1px solid #756392;border-radius:7px}
.multi-axis.complete{border-color:#6ca36f}
.multi-axis>span{display:grid;gap:2px;min-width:0}
.multi-axis strong{font-size:.7rem;overflow-wrap:anywhere}
.multi-axis small{font-size:.64rem;overflow-wrap:anywhere}
.multi-axis>button{min-height:25px;padding:2px 4px;font-size:.65rem}
.multi-body>button{justify-self:start;min-height:27px;padding:4px 7px;font-size:.7rem}
.multi-complete{color:#c8efbc;font-size:.76rem}
[data-game-composition="mobile"] .multiverse-lab{margin:3px 0;padding:4px 5px}
[data-game-composition="mobile"] .multi-content,[data-game-composition="mobile"] .multi-body{gap:3px}
[data-game-composition="mobile"] .multi-nav{gap:3px}
[data-game-composition="mobile"] .multi-nav>strong{font-size:.65rem}
[data-game-composition="mobile"] .multi-nav>small{font-size:.58rem}
[data-game-composition="mobile"] .multi-nav>button{min-height:23px;padding:2px 5px}
[data-game-composition="mobile"] .multi-tabs{gap:3px}
[data-game-composition="mobile"] .multi-tabs>button{min-height:23px;padding:2px;font-size:.6rem}
[data-game-composition="mobile"] .multi-body>small,[data-game-composition="mobile"] .multi-content>small{font-size:.59rem}
[data-game-composition="mobile"] .multi-seed-needs,[data-game-composition="mobile"] .multi-axes{grid-template-columns:1fr;gap:2px}
[data-game-composition="mobile"] .multi-seed-needs>.art-object{padding:2px 5px;font-size:.58rem}
[data-game-composition="mobile"] .multi-axis{grid-template-columns:minmax(0,1fr) auto;align-items:center;padding:2px 4px;gap:3px}
[data-game-composition="mobile"] .multi-axis strong{font-size:.59rem}
[data-game-composition="mobile"] .multi-axis small{font-size:.56rem}
[data-game-composition="mobile"] .multi-axis>button{min-height:22px;padding:1px 3px;font-size:.57rem}
[data-game-composition="mobile"] .multi-body>button{min-height:23px;padding:2px 4px;font-size:.6rem}

/* Multiversal Network: one bridge at a time, with mutually exclusive
   Bridge / Operations / Upgrades views and no scrolling catalog. */
.multiversal-bridges[hidden]{display:none!important}
.multiversal-bridges{display:block;min-width:0;min-height:0;margin:5px 0;padding:7px 9px;border:1px solid #9a668f;border-radius:9px;background:rgba(47,24,45,.52)}
.bridge-content,.bridge-body{display:grid;align-content:start;gap:5px;min-width:0}
.bridge-nav{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:5px;min-width:0}
.bridge-nav>strong{flex:1;min-width:0;text-align:center;font-size:.8rem;color:#ffe0f6;overflow-wrap:anywhere}
.bridge-nav>small{font-size:.68rem;color:#e2bfd8}
.bridge-nav>button{min-height:27px;padding:3px 8px}
.bridge-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px}
.bridge-tabs>button{min-height:27px;padding:3px;font-size:.73rem}
.bridge-tabs>.active{background:#603858;border-color:#d493c5;color:#fff0fb}
.bridge-body>small,.bridge-content>small{font-size:.7rem;color:#e7cce0}
.bridge-needs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px;min-width:0}
.bridge-needs>.art-object{min-width:0;white-space:normal;overflow-wrap:anywhere;padding:4px 6px;border-radius:6px;font-size:.68rem}
.bridge-state{display:flex;flex-wrap:wrap;justify-content:space-between;gap:5px;min-width:0}
.bridge-state>strong{font-size:.73rem;overflow-wrap:anywhere}.bridge-state>span{font-size:.67rem;color:#dfc5d8}
.bridge-actions{display:flex;flex-wrap:wrap;gap:5px}.bridge-actions>button,.bridge-body>button{min-height:27px;padding:4px 7px;font-size:.7rem}
.bridge-complete{color:#caefc3;font-size:.76rem}
[data-game-composition="mobile"] .multiversal-bridges{margin:3px 0;padding:4px 5px}
[data-game-composition="mobile"] .bridge-content,[data-game-composition="mobile"] .bridge-body{gap:3px}
[data-game-composition="mobile"] .bridge-nav{gap:3px}
[data-game-composition="mobile"] .bridge-nav>strong{font-size:.65rem}.bridge-nav>small{font-size:.58rem}
[data-game-composition="mobile"] .bridge-nav>button{min-height:23px;padding:2px 5px}
[data-game-composition="mobile"] .bridge-tabs{gap:3px}.bridge-tabs>button{min-height:23px;padding:2px;font-size:.6rem}
[data-game-composition="mobile"] .bridge-body>small,[data-game-composition="mobile"] .bridge-content>small{font-size:.59rem}
[data-game-composition="mobile"] .bridge-needs{grid-template-columns:1fr;gap:2px}
[data-game-composition="mobile"] .bridge-needs>.art-object{padding:2px 5px;font-size:.58rem}
[data-game-composition="mobile"] .bridge-state{gap:2px}.bridge-state>strong,[data-game-composition="mobile"] .bridge-state>span{font-size:.59rem}
[data-game-composition="mobile"] .bridge-actions{gap:3px}.bridge-actions>button,[data-game-composition="mobile"] .bridge-body>button{min-height:23px;padding:2px 4px;font-size:.6rem}

/* Reality Infrastructure: ONE physical anchor per finite panel. Anchor /
   Operations / Upgrades are mutually exclusive, never a scrolling catalog. */
.reality-anchors[hidden]{display:none!important}
.reality-anchors{display:block;min-width:0;min-height:0;margin:5px 0;padding:7px 9px;border:1px solid #9581b8;border-radius:9px;background:rgba(33,23,46,.54)}
.reality-content,.reality-body{display:grid;align-content:start;gap:5px;min-width:0}
.reality-nav{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:5px;min-width:0}
.reality-nav>strong{flex:1;min-width:0;text-align:center;font-size:.79rem;color:#eedcff;overflow-wrap:anywhere}
.reality-nav>small{font-size:.66rem;color:#d7c4e9}
.reality-nav>button{min-height:27px;padding:3px 8px}
.reality-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px}
.reality-tabs>button{min-height:27px;padding:3px;font-size:.72rem}
.reality-tabs>.active{color:#f7eaff;background:#4a3262;border-color:#bf9be2}
.reality-body>small{font-size:.7rem;color:#dfceed}
.reality-needs,.reality-proof{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;min-width:0}
.reality-needs>.art-object,.reality-proof>span{min-width:0;white-space:normal;overflow-wrap:anywhere;padding:4px 6px;border-radius:6px;font-size:.67rem}
.reality-proof>span{border:1px solid #8b77a3}
.reality-actions{display:flex;flex-wrap:wrap;gap:5px}
.reality-body>button,.reality-actions>button{min-height:27px;padding:4px 8px;font-size:.71rem}
.reality-complete{font-size:.74rem;color:#cef0ba}
[data-game-composition="mobile"] .reality-anchors{padding:4px 5px;margin:3px 0}
[data-game-composition="mobile"] .reality-content,[data-game-composition="mobile"] .reality-body{gap:3px}
[data-game-composition="mobile"] .reality-nav{gap:3px}
[data-game-composition="mobile"] .reality-nav>strong{font-size:.65rem}
[data-game-composition="mobile"] .reality-nav>small{font-size:.58rem}
[data-game-composition="mobile"] .reality-nav>button{min-height:23px;padding:2px 5px}
[data-game-composition="mobile"] .reality-tabs{gap:3px}
[data-game-composition="mobile"] .reality-tabs>button{min-height:23px;padding:2px;font-size:.61rem}
[data-game-composition="mobile"] .reality-needs,[data-game-composition="mobile"] .reality-proof{grid-template-columns:1fr;gap:2px}
[data-game-composition="mobile"] .reality-needs>.art-object,[data-game-composition="mobile"] .reality-proof>span{padding:2px 4px;font-size:.59rem}
[data-game-composition="mobile"] .reality-body>small{font-size:.6rem}
[data-game-composition="mobile"] .reality-body>button,[data-game-composition="mobile"] .reality-actions>button{min-height:23px;padding:2px 4px;font-size:.61rem}

/* Shenaniverse Core: exactly one of five components is visible at once.
   Component and upgrade panes replace each other and never form a scrolling catalog. */
.shenaniverse-core-assembly[hidden] { display:none !important; }
.shenaniverse-core-assembly { display:block; min-width:0; min-height:0; margin:5px 0; padding:7px 9px; border:1px solid #a665ad; border-radius:9px; background:rgba(49,22,55,.56); }
.core-assembly-content,.core-assembly-body { display:grid; align-content:start; gap:5px; min-width:0; }
.core-assembly-nav { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:5px; min-width:0; }
.core-assembly-nav > strong { flex:1; min-width:0; text-align:center; font-size:.8rem; overflow-wrap:anywhere; color:#f4d9ff; }
.core-assembly-nav > small { font-size:.68rem; color:#d9b9df; }
.core-assembly-nav > button { min-height:27px; padding:3px 8px; }
.core-tabs { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:5px; }
.core-tabs > button { min-height:27px; padding:3px; font-size:.73rem; }
.core-tabs > .active { color:#fff0ff; background:#603568; border-color:#c88ed0; }
.core-assembly-body > small { font-size:.71rem; color:#e6c9eb; }
.core-prereqs,.core-inputs,.core-proof { display:grid; gap:5px; min-width:0; }
.core-prereqs,.core-inputs { grid-template-columns:repeat(3,minmax(0,1fr)); }
.core-proof { grid-template-columns:repeat(2,minmax(0,1fr)); }
.core-prereqs > .art-object,.core-inputs > .art-object,.core-proof > span { min-width:0; white-space:normal; overflow-wrap:anywhere; padding:4px 7px; border-radius:6px; font-size:.68rem; }
.core-proof > span { border:1px solid #895a91; }
.core-actions { display:flex; flex-wrap:wrap; gap:5px; align-items:center; }
.core-actions > button,.core-assembly-body > button { min-height:27px; padding:4px 8px; font-size:.71rem; }
.core-component-complete { color:#d4f6bc; font-size:.76rem; }
[data-game-composition="mobile"] .shenaniverse-core-assembly { margin:3px 0; padding:4px 5px; }
[data-game-composition="mobile"] .core-assembly-content,[data-game-composition="mobile"] .core-assembly-body { gap:3px; }
[data-game-composition="mobile"] .core-assembly-nav { gap:3px; }
[data-game-composition="mobile"] .core-assembly-nav > strong { font-size:.65rem; }
[data-game-composition="mobile"] .core-assembly-nav > small { font-size:.59rem; }
[data-game-composition="mobile"] .core-assembly-nav > button { min-height:23px; padding:2px 5px; }
[data-game-composition="mobile"] .core-tabs > button { min-height:23px; padding:2px; font-size:.61rem; }
[data-game-composition="mobile"] .core-assembly-body > small { font-size:.6rem; }
[data-game-composition="mobile"] .core-prereqs,[data-game-composition="mobile"] .core-inputs,[data-game-composition="mobile"] .core-proof { grid-template-columns:1fr; gap:2px; }
[data-game-composition="mobile"] .core-prereqs > .art-object,[data-game-composition="mobile"] .core-inputs > .art-object,[data-game-composition="mobile"] .core-proof > span { padding:2px 5px; font-size:.58rem; }
[data-game-composition="mobile"] .core-actions { gap:3px; }
[data-game-composition="mobile"] .core-actions > button,[data-game-composition="mobile"] .core-assembly-body > button { min-height:23px; padding:2px 5px; font-size:.61rem; }

/* Incorporation displays one founding resolution at a time. The three
   resolution choices remain inside the fixed play area and never form a list. */
.corporate-formation[hidden] { display:none !important; }
.corporate-formation { display:block; min-width:0; min-height:0; margin:5px 0; padding:7px 9px; border:1px solid #7d817d; border-radius:9px; background:rgba(27,31,32,.52); }
.formation-content { display:grid; align-content:start; gap:6px; min-width:0; }
.formation-nav { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:5px; min-width:0; }
.formation-nav > strong { flex:1; min-width:0; text-align:center; font-size:.8rem; overflow-wrap:anywhere; color:#edf2ef; }
.formation-nav > small { font-size:.68rem; color:#c4cdc8; }
.formation-nav > button { min-height:27px; padding:3px 8px; }
.formation-choices { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:5px; min-width:0; }
.formation-choice { display:grid; gap:2px; min-height:48px; padding:5px 6px; font-size:.7rem; white-space:normal; }
.formation-choice small { font-size:.62rem; color:#bac7c0; }
.formation-choice.active { border-color:#c3d5ca; background:#34443b; color:#f5fff9; }
.formation-content > small { font-size:.68rem; color:#c8d0cc; }
.formation-content > .button-business { justify-self:start; min-height:28px; padding:4px 8px; font-size:.72rem; }
.formation-complete { color:#c8f0ca; font-size:.74rem; }
[data-game-composition="mobile"] .corporate-formation { margin:3px 0; padding:4px 5px; }
[data-game-composition="mobile"] .formation-content { gap:3px; }
[data-game-composition="mobile"] .formation-nav { gap:3px; }
[data-game-composition="mobile"] .formation-nav > strong { font-size:.65rem; }
[data-game-composition="mobile"] .formation-nav > small { font-size:.58rem; }
[data-game-composition="mobile"] .formation-nav > button { min-height:23px; padding:2px 5px; }
[data-game-composition="mobile"] .formation-choices { grid-template-columns:1fr; gap:2px; }
[data-game-composition="mobile"] .formation-choice { grid-template-columns:minmax(0,1fr) auto; align-items:center; min-height:25px; padding:2px 4px; font-size:.61rem; }
[data-game-composition="mobile"] .formation-choice small { font-size:.56rem; }
[data-game-composition="mobile"] .formation-content > small { font-size:.58rem; }
[data-game-composition="mobile"] .formation-content > .button-business { min-height:23px; padding:2px 5px; font-size:.61rem; }

/* Corporate Divisions: one division at a time; charter and development
   views replace each other instead of adding another scrolling region. */
.corporate-divisions[hidden] { display:none !important; }
.corporate-divisions { display:block; min-width:0; min-height:0; margin:5px 0; padding:7px 9px; border:1px solid #647d8d; border-radius:9px; background:rgba(22,33,42,.54); }
.division-content,.division-body { display:grid; align-content:start; gap:5px; min-width:0; }
.division-nav { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:5px; min-width:0; }
.division-nav > strong { flex:1; min-width:0; text-align:center; font-size:.8rem; color:#dceefe; overflow-wrap:anywhere; }
.division-nav > small { font-size:.68rem; color:#bfd0da; }
.division-nav > button { min-height:27px; padding:3px 8px; }
.division-tabs { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:5px; }
.division-tabs > button { min-height:27px; padding:3px; font-size:.72rem; }
.division-tabs > .active { background:#314a5a; border-color:#8cb3ca; color:#f0faff; }
.division-inputs,.division-choices { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:5px; min-width:0; }
.division-inputs > .art-object { min-width:0; white-space:normal; overflow-wrap:anywhere; padding:4px 7px; font-size:.68rem; }
.division-responsibility { display:grid; gap:2px; min-height:45px; white-space:normal; font-size:.69rem; }
.division-responsibility small { font-size:.61rem; color:#bcd0dc; }
.division-responsibility.active { background:#36596b; border-color:#93bfd6; }
.division-body > small,.division-content > small { font-size:.67rem; color:#c7d7df; }
[data-game-composition="mobile"] .corporate-divisions { margin:3px 0; padding:4px 5px; }
[data-game-composition="mobile"] .division-content,[data-game-composition="mobile"] .division-body { gap:3px; }
[data-game-composition="mobile"] .division-nav { gap:3px; }
[data-game-composition="mobile"] .division-nav > strong { font-size:.65rem; }
[data-game-composition="mobile"] .division-nav > small { font-size:.58rem; }
[data-game-composition="mobile"] .division-nav > button { min-height:23px; padding:2px 5px; }
[data-game-composition="mobile"] .division-tabs > button { min-height:23px; padding:2px; font-size:.61rem; }
[data-game-composition="mobile"] .division-inputs,[data-game-composition="mobile"] .division-choices { grid-template-columns:1fr; gap:2px; }
[data-game-composition="mobile"] .division-inputs > .art-object { padding:2px 5px; font-size:.57rem; }
[data-game-composition="mobile"] .division-responsibility { grid-template-columns:minmax(0,1fr) auto; min-height:24px; padding:2px 4px; font-size:.6rem; }
[data-game-composition="mobile"] .division-responsibility small { font-size:.55rem; }
[data-game-composition="mobile"] .division-body > small,[data-game-composition="mobile"] .division-content > small { font-size:.57rem; }

/* Subsidiaries: one operating company at a time with only two specialization
   choices, keeping the ten-company network inside the fixed play area. */
.corporate-subsidiaries[hidden] { display:none !important; }
.corporate-subsidiaries { display:block; min-width:0; min-height:0; margin:5px 0; padding:7px 9px; border:1px solid #816e57; border-radius:9px; background:rgba(42,31,20,.52); }
.subsidiary-content,.subsidiary-body { display:grid; align-content:start; gap:5px; min-width:0; }
.subsidiary-nav { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:5px; min-width:0; }
.subsidiary-nav > strong { flex:1; min-width:0; text-align:center; font-size:.8rem; color:#f3e1cc; overflow-wrap:anywhere; }
.subsidiary-nav > small { font-size:.68rem; color:#dbc6ad; }
.subsidiary-nav > button { min-height:27px; padding:3px 8px; }
.subsidiary-tabs { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:5px; }
.subsidiary-tabs > button { min-height:27px; padding:3px; font-size:.72rem; }
.subsidiary-tabs > .active { background:#5b4932; border-color:#b99b78; color:#fff3e3; }
.subsidiary-inputs,.subsidiary-choices { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:5px; min-width:0; }
.subsidiary-inputs > .art-object { min-width:0; white-space:normal; overflow-wrap:anywhere; padding:4px 7px; font-size:.68rem; }
.subsidiary-specialization { display:grid; gap:2px; min-height:44px; white-space:normal; font-size:.69rem; }
.subsidiary-specialization small { font-size:.61rem; color:#d5c1a8; }
.subsidiary-specialization.active { background:#654d32; border-color:#c7a27b; }
.subsidiary-body > small,.subsidiary-content > small { font-size:.67rem; color:#dccab4; }
[data-game-composition="mobile"] .corporate-subsidiaries { margin:3px 0; padding:4px 5px; }
[data-game-composition="mobile"] .subsidiary-content,[data-game-composition="mobile"] .subsidiary-body { gap:3px; }
[data-game-composition="mobile"] .subsidiary-nav { gap:3px; }
[data-game-composition="mobile"] .subsidiary-nav > strong { font-size:.65rem; }
[data-game-composition="mobile"] .subsidiary-nav > small { font-size:.58rem; }
[data-game-composition="mobile"] .subsidiary-nav > button { min-height:23px; padding:2px 5px; }
[data-game-composition="mobile"] .subsidiary-tabs > button { min-height:23px; padding:2px; font-size:.61rem; }
[data-game-composition="mobile"] .subsidiary-inputs,[data-game-composition="mobile"] .subsidiary-choices { grid-template-columns:1fr; gap:2px; }
[data-game-composition="mobile"] .subsidiary-inputs > .art-object { padding:2px 5px; font-size:.57rem; }
[data-game-composition="mobile"] .subsidiary-specialization { grid-template-columns:minmax(0,1fr) auto; min-height:24px; padding:2px 4px; font-size:.6rem; }
[data-game-composition="mobile"] .subsidiary-specialization small { font-size:.55rem; }
[data-game-composition="mobile"] .subsidiary-body > small,[data-game-composition="mobile"] .subsidiary-content > small { font-size:.57rem; }

/* Holding Company: only one office and one of three small panes visible at
   once. No overflow-based concealment, scrollable catalog or off-canvas rows. */
.corporate-holding[hidden] { display:none !important; }
.corporate-holding { display:block; min-width:0; min-height:0; margin:5px 0; padding:7px 9px; border:1px solid #96805c; border-radius:9px; background:rgba(42,32,22,.52); }
.holding-content,.holding-body { display:grid; align-content:start; gap:5px; min-width:0; }
.holding-nav { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:5px; min-width:0; }
.holding-nav > strong { flex:1; min-width:0; text-align:center; font-size:.8rem; color:#f3e4c8; overflow-wrap:anywhere; }
.holding-nav > small { font-size:.68rem; color:#ddc8a4; }
.holding-nav > button { min-height:27px; padding:3px 8px; }
.holding-tabs { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:5px; }
.holding-tabs > button { min-height:27px; padding:3px; font-size:.72rem; }
.holding-tabs > .active { background:#5e4930; border-color:#ccaa71; color:#fff6e7; }
.holding-goods { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:5px; }
.holding-goods > .art-object { min-width:0; white-space:normal; overflow-wrap:anywhere; padding:4px 7px; font-size:.69rem; }
.holding-budgets { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:5px; min-width:0; }
.holding-budget { display:grid; gap:4px; align-content:start; min-width:0; border:1px solid #96805c; border-radius:6px; padding:5px; }
.holding-budget > span { display:grid; gap:3px; min-width:0; }
.holding-budget strong { font-size:.7rem; overflow-wrap:anywhere; }
.holding-budget small { font-size:.65rem; }
.holding-budget > button { min-height:26px; padding:3px; font-size:.67rem; }
.holding-mandates { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:5px; }
.holding-mandates > button { display:grid; min-width:0; white-space:normal; font-size:.67rem; padding:4px; }
.holding-mandates small { font-size:.59rem; color:#decaab; }
.holding-mandates .active { background:#594328; border-color:#d5a96d; }
.holding-body > small { font-size:.67rem; color:#e6d0b2; }
.holding-body > button { justify-self:start; min-height:26px; padding:3px 8px; font-size:.7rem; }
[data-game-composition="mobile"] .corporate-holding { margin:3px 0; padding:4px 5px; }
[data-game-composition="mobile"] .holding-content,[data-game-composition="mobile"] .holding-body { gap:3px; }
[data-game-composition="mobile"] .holding-nav { gap:3px; }
[data-game-composition="mobile"] .holding-nav > strong { font-size:.65rem; }
[data-game-composition="mobile"] .holding-nav > small { font-size:.58rem; }
[data-game-composition="mobile"] .holding-nav > button { min-height:23px; padding:2px 5px; }
[data-game-composition="mobile"] .holding-tabs { gap:3px; }
[data-game-composition="mobile"] .holding-tabs > button { min-height:23px; font-size:.61rem; padding:2px; }
[data-game-composition="mobile"] .holding-goods { grid-template-columns:1fr; gap:2px; }
[data-game-composition="mobile"] .holding-goods > .art-object { padding:2px 5px; font-size:.61rem; }
[data-game-composition="mobile"] .holding-budgets { grid-template-columns:1fr; gap:2px; }
[data-game-composition="mobile"] .holding-budget { grid-template-columns:minmax(0,1fr) auto; align-items:center; padding:2px 4px; gap:3px; }
[data-game-composition="mobile"] .holding-budget strong { font-size:.62rem; }
[data-game-composition="mobile"] .holding-budget small { font-size:.58rem; }
[data-game-composition="mobile"] .holding-budget > button { min-height:23px; font-size:.6rem; padding:2px 5px; }
[data-game-composition="mobile"] .holding-mandates { grid-template-columns:1fr; gap:2px; }
[data-game-composition="mobile"] .holding-mandates > button { padding:2px 5px; font-size:.6rem; }
[data-game-composition="mobile"] .holding-mandates small { font-size:.55rem; }
[data-game-composition="mobile"] .holding-body > small { font-size:.59rem; }
[data-game-composition="mobile"] .holding-body > button { min-height:23px; padding:2px 5px; font-size:.61rem; }

/* Shell Structures: only ONE internal route and one small pane at a time.
   Do not clip off-canvas details or create scrollable route catalogs. */
.corporate-shells[hidden] { display:none !important; }
.corporate-shells { display:block; min-width:0; min-height:0; margin:5px 0; padding:7px 9px; border:1px solid #6e8c84; border-radius:9px; background:rgba(24,42,37,.55); }
.shell-content,.shell-body { display:grid; align-content:start; gap:5px; min-width:0; }
.shell-nav { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:5px; min-width:0; }
.shell-nav > strong { flex:1; min-width:0; text-align:center; color:#d5f1e5; font-size:.8rem; overflow-wrap:anywhere; }
.shell-nav > small { font-size:.68rem; color:#bcdacc; }
.shell-nav > button { min-height:27px; padding:3px 8px; }
.shell-tabs { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:5px; }
.shell-tabs > button { min-height:27px; padding:3px; font-size:.72rem; }
.shell-tabs > .active { background:#29534a; border-color:#9bd9bb; color:#e9ffef; }
.shell-body > small { font-size:.67rem; color:#cae2d8; }
.shell-sources { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:5px; min-width:0; }
.shell-sources > button { min-width:0; display:grid; white-space:normal; gap:2px; padding:5px; font-size:.7rem; }
.shell-sources > button.active { background:#2f5947; border-color:#9bd9bb; }
.shell-sources small { font-size:.61rem; }
.shell-quote { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:5px; min-width:0; }
.shell-quote > .art-object { min-width:0; white-space:normal; overflow-wrap:anywhere; padding:4px 7px; font-size:.68rem; }
.shell-body > button,.shell-actions > button { min-height:27px; padding:4px 8px; font-size:.7rem; }
.shell-body > button { justify-self:start; }
.shell-actions { display:flex; flex-wrap:wrap; gap:5px; align-items:center; }
[data-game-composition="mobile"] .corporate-shells { margin:3px 0; padding:4px 5px; }
[data-game-composition="mobile"] .shell-content,[data-game-composition="mobile"] .shell-body { gap:3px; }
[data-game-composition="mobile"] .shell-nav { gap:3px; }
[data-game-composition="mobile"] .shell-nav > strong { font-size:.65rem; }
[data-game-composition="mobile"] .shell-nav > small { font-size:.58rem; }
[data-game-composition="mobile"] .shell-nav > button { min-height:23px; padding:2px 5px; }
[data-game-composition="mobile"] .shell-tabs { gap:3px; }
[data-game-composition="mobile"] .shell-tabs > button { min-height:23px; font-size:.6rem; padding:2px; }
[data-game-composition="mobile"] .shell-body > small { font-size:.58rem; }
[data-game-composition="mobile"] .shell-sources { gap:2px; }
[data-game-composition="mobile"] .shell-sources > button { padding:2px 4px; font-size:.59rem; }
[data-game-composition="mobile"] .shell-sources small { font-size:.54rem; }
[data-game-composition="mobile"] .shell-quote { grid-template-columns:1fr; gap:2px; }
[data-game-composition="mobile"] .shell-quote > .art-object { padding:2px 5px; font-size:.59rem; }
[data-game-composition="mobile"] .shell-actions { gap:3px; }
[data-game-composition="mobile"] .shell-body > button,[data-game-composition="mobile"] .shell-actions > button { min-height:23px; padding:2px 5px; font-size:.6rem; }

/* M&A: one independent acquisition and exactly one small workflow pane at a
   time. All controls remain within the playable game composition. */
.corporate-acquisitions[hidden] { display:none !important; }
.corporate-acquisitions { display:block; min-width:0; min-height:0; margin:5px 0; padding:7px 9px; border:1px solid #7d8870; border-radius:9px; background:rgba(29,42,31,.52); }
.acquisition-content,.acquisition-body { display:grid; align-content:start; gap:5px; min-width:0; }
.acquisition-nav { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:5px; min-width:0; }
.acquisition-nav > strong { flex:1; min-width:0; text-align:center; font-size:.8rem; color:#e0efd6; overflow-wrap:anywhere; }
.acquisition-nav > small { font-size:.68rem; color:#ccdcbf; }
.acquisition-nav > button { min-height:27px; padding:3px 8px; }
.acquisition-tabs { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:5px; }
.acquisition-tabs > button { min-height:27px; padding:3px; font-size:.72rem; }
.acquisition-tabs > .active { background:#3b5635; border-color:#9dcb85; color:#f3ffe9; }
.acquisition-body > small { font-size:.67rem; color:#cfdfca; }
.acquisition-body > strong { font-size:.73rem; color:#d2f8b6; }
.acquisition-goods,.acquisition-proof { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:5px; min-width:0; }
.acquisition-goods > .art-object,.acquisition-proof > span { min-width:0; white-space:normal; overflow-wrap:anywhere; padding:4px 7px; font-size:.68rem; }
.acquisition-proof > span { border:1px solid #667b5b; border-radius:6px; }
.acquisition-strategies { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:5px; }
.acquisition-strategies > button { display:grid; min-width:0; white-space:normal; padding:5px; gap:2px; font-size:.7rem; }
.acquisition-strategies > button.active { background:#445c32; border-color:#9dcb85; }
.acquisition-strategies small { font-size:.61rem; color:#cfe2c5; }
.acquisition-body > button { justify-self:start; min-height:27px; padding:4px 8px; font-size:.7rem; }
[data-game-composition="mobile"] .corporate-acquisitions { margin:3px 0; padding:4px 5px; }
[data-game-composition="mobile"] .acquisition-content,[data-game-composition="mobile"] .acquisition-body { gap:3px; }
[data-game-composition="mobile"] .acquisition-nav { gap:3px; }
[data-game-composition="mobile"] .acquisition-nav > strong { font-size:.64rem; }
[data-game-composition="mobile"] .acquisition-nav > small { font-size:.58rem; }
[data-game-composition="mobile"] .acquisition-nav > button { min-height:23px; padding:2px 5px; }
[data-game-composition="mobile"] .acquisition-tabs { gap:2px; }
[data-game-composition="mobile"] .acquisition-tabs > button { min-height:23px; font-size:.57rem; padding:2px; }
[data-game-composition="mobile"] .acquisition-goods,[data-game-composition="mobile"] .acquisition-proof { grid-template-columns:1fr; gap:2px; }
[data-game-composition="mobile"] .acquisition-goods > .art-object,[data-game-composition="mobile"] .acquisition-proof > span { padding:2px 5px; font-size:.59rem; }
[data-game-composition="mobile"] .acquisition-strategies { gap:2px; }
[data-game-composition="mobile"] .acquisition-strategies > button { padding:3px; font-size:.6rem; }
[data-game-composition="mobile"] .acquisition-strategies small { font-size:.54rem; }
[data-game-composition="mobile"] .acquisition-body > small { font-size:.59rem; }
[data-game-composition="mobile"] .acquisition-body > button { min-height:23px; padding:2px 5px; font-size:.6rem; }

/* Four familiar Business Group offices now require finite physical funding,
   and Group Directive / Upgrades replace rather than stack on the office pane. */
.business-group-structures[hidden] { display:none !important; }
.business-group-structures { display:block; min-width:0; min-height:0; margin:5px 0; padding:7px 9px; border:1px solid #927a4b; border-radius:9px; background:rgba(40,34,21,.5); }
.group-structure-content,.group-structure-body { display:grid; align-content:start; gap:5px; min-width:0; }
.group-tabs { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:5px; }
.group-tabs > button { min-height:27px; padding:3px; font-size:.71rem; }
.group-tabs > .active { background:#594624; border-color:#e1c479; color:#fff1bf; }
.group-structure-body > small { font-size:.69rem; color:#eddaae; }
.group-structure-body > strong { color:#f5e4bd; font-size:.76rem; }
.group-progress { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:4px; min-width:0; }
.group-progress > .art-object { min-width:0; white-space:normal; overflow-wrap:anywhere; padding:3px 6px; font-size:.67rem; }
.group-inputs { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:5px; min-width:0; }
.group-inputs > .art-object { min-width:0; white-space:normal; overflow-wrap:anywhere; padding:4px 7px; font-size:.68rem; }
.group-directives { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:5px; min-width:0; }
.group-directives > button { display:grid; align-content:start; gap:2px; min-width:0; white-space:normal; padding:4px; font-size:.7rem; }
.group-directives > button.active { background:#5e502e; border-color:#ead397; }
.group-directives small { font-size:.6rem; color:#e1cd9e; }
.group-structure-body > button { justify-self:start; min-height:26px; padding:3px 7px; font-size:.7rem; }
[data-game-composition="mobile"] .business-group-structures { margin:3px 0; padding:3px 5px; }
[data-game-composition="mobile"] .group-structure-content,[data-game-composition="mobile"] .group-structure-body { gap:2px; }
[data-game-composition="mobile"] .group-tabs { gap:2px; }
[data-game-composition="mobile"] .group-tabs > button { min-height:23px; padding:2px; font-size:.59rem; }
[data-game-composition="mobile"] .group-progress { gap:2px; }
[data-game-composition="mobile"] .group-progress > .art-object { padding:2px 4px; font-size:.57rem; }
[data-game-composition="mobile"] .group-structure-body > small { font-size:.59rem; }
[data-game-composition="mobile"] .group-structure-body > strong { font-size:.65rem; }
[data-game-composition="mobile"] .group-inputs { grid-template-columns:1fr; gap:2px; }
[data-game-composition="mobile"] .group-inputs > .art-object { padding:2px 5px; font-size:.59rem; }
[data-game-composition="mobile"] .group-directives { grid-template-columns:1fr; gap:2px; }
[data-game-composition="mobile"] .group-directives > button { padding:2px 5px; font-size:.6rem; }
[data-game-composition="mobile"] .group-directives small { font-size:.56rem; }
[data-game-composition="mobile"] .group-structure-body > button { min-height:23px; padding:2px 5px; font-size:.6rem; }

/* Optional real-provider ad offer is contained inside the scaled playable
   canvas. The offered panel is NONMODAL; only a requested actual SDK video
   blocks gameplay. Skip and Accept always have matching button prominence.
   We never render a fake video, scrollable ad pane, or offscreen CTA. */
.ad-opportunity-trigger { min-width:108px; min-height:28px; padding:4px 9px; font-size:.74rem; }
.ad-opportunity-overlay[hidden] { display:none !important; }
.ad-opportunity-overlay { position:absolute; inset:0; z-index:250; display:grid; place-items:center;
  pointer-events:none; padding:12px; min-width:0; min-height:0; }
.ad-opportunity-card { display:grid; align-content:center; gap:10px; pointer-events:auto;
  width:min(420px,100%); max-width:100%; max-height:calc(100% - 24px);
  padding:16px; border:1px solid #c8a86e; border-radius:12px;
  background:linear-gradient(150deg,#233044,#17212e); box-shadow:0 9px 30px rgba(0,0,0,.62);
  overflow-wrap:anywhere; }
.ad-opportunity-title { font-size:.95rem; color:#f9e2b1; }
.ad-opportunity-description { margin:0; color:#e2e8f2; font-size:.8rem; line-height:1.3; }
.ad-opportunity-status { font-size:.71rem; color:#bfd2e5; }
.ad-opportunity-options { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.ad-opportunity-options > button { min-width:0; min-height:34px; padding:5px 7px; white-space:normal; font-size:.75rem; }
.ad-opportunity-overlay.ad-provider-pending { pointer-events:auto; background:rgba(5,9,15,.6); }
[data-game-composition="mobile"] .ad-opportunity-trigger { min-width:0; min-height:23px; padding:2px 5px; font-size:.61rem; }
[data-game-composition="mobile"] .ad-opportunity-card { width:min(340px,100%); gap:5px; padding:9px; }
[data-game-composition="mobile"] .ad-opportunity-title { font-size:.77rem; }
[data-game-composition="mobile"] .ad-opportunity-description { font-size:.66rem; }
[data-game-composition="mobile"] .ad-opportunity-status { font-size:.61rem; }
[data-game-composition="mobile"] .ad-opportunity-options { gap:4px; }
[data-game-composition="mobile"] .ad-opportunity-options > button { min-height:25px; padding:3px; font-size:.62rem; }

/* Mobile game navigation: finite pages instead of hidden vertical/horizontal
   scrolling. Four main destinations plus two page controls fit a two-row
   portrait grid or a six-item landscape rail. Subtabs similarly show two
   destinations plus page controls and never clip unrevealed stages. */
[data-game-composition="mobile"] .main-navigation {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-template-rows: repeat(2, minmax(0, auto));
  align-content: end;
  max-height: none;
  overflow: visible;
}
[data-game-composition="mobile"] .sub-navigation {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-content: start;
  max-height: none;
  overflow: visible;
}
[data-game-composition="mobile"] .nav-page-control {
  flex: none;
  min-width: 0;
  min-height: 30px;
  padding: 2px 3px;
  border: 1px solid #74899b;
  color: #d5e4f1;
  background: #28384b;
  font-size: .65rem;
  white-space: normal;
  overflow-wrap: anywhere;
}
[data-game-composition="mobile"] .nav-page-control:disabled {
  opacity: .52;
}
/* Portrait already reserves a full bottom navigation dock inside the
   logical game shell. The nav lives under .dashboard in the DOM, so anchor
   it to the transformed game presentation (the fixed-position containing
   block), not the bottom of the dashboard where it covers live controls. */
[data-game-composition="mobile"]:not([data-game-orientation="landscape"]) .game-shell {
  padding-bottom: max(122px, calc(var(--device-safe-bottom) + 110px), calc(env(safe-area-inset-bottom) + 110px));
}
[data-game-composition="mobile"]:not([data-game-orientation="landscape"]) .main-navigation {
  position: fixed;
  right: max(0px, var(--device-safe-right), env(safe-area-inset-right));
  bottom: max(0px, var(--device-safe-bottom), env(safe-area-inset-bottom));
  left: max(0px, var(--device-safe-left), env(safe-area-inset-left));
}
[data-game-composition="mobile"][data-game-orientation="landscape"] .main-navigation {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: repeat(6, minmax(0, auto));
  align-content: center;
  overflow: visible;
  max-height: none;
}
[data-game-composition="mobile"][data-game-orientation="landscape"] .main-navigation .game-tab:not(.nav-page-control) {
  min-height: 36px;
  padding: 3px 4px;
  font-size: .67rem;
}
[data-game-composition="mobile"][data-game-orientation="landscape"] .main-navigation .nav-page-control {
  min-height: 27px;
  font-size: .6rem;
}

/* Mobile resource summary is finite and paginated: permanent Cash and HUD
   settings plus no more than two enabled resource cells per page. No scrolling
   or silent clipping of later-game currencies, including in landscape. */
[data-game-composition="mobile"] .resource-hud {
  position: static;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-auto-rows: minmax(0, auto);
  align-content: start;
  gap: 3px;
  min-width: 0;
  min-height: 0;
  max-height: none;
  height: auto;
  overflow: visible;
  padding: 3px;
}
[data-game-composition="mobile"] .resource-hud .hud-resource,
[data-game-composition="mobile"] .resource-hud .resource-tracker-list > div {
  min-width: 0;
  padding: 2px 4px;
  font-size: .67rem;
}
[data-game-composition="mobile"] .resource-hud span,
[data-game-composition="mobile"] .resource-hud .resource-tracker-list span {
  font-size: .55rem;
  line-height: 1.05;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
[data-game-composition="mobile"] .resource-hud strong,
[data-game-composition="mobile"] .resource-hud .resource-tracker-list strong {
  font-size: .7rem;
  line-height: 1.1;
  overflow-wrap: anywhere;
}
[data-game-composition="mobile"] .resource-hud .hud-settings,
[data-game-composition="mobile"] .resource-hud .hud-page-control {
  min-width: 0;
  min-height: 25px;
  padding: 2px 4px;
  font-size: .61rem;
}
[data-game-composition="mobile"] .resource-hud .hud-page-control {
  border-color: #6388a5;
  background: #21374a;
}
[data-game-composition="mobile"] .resource-hud .hud-page-control:disabled { opacity: .48; }
[data-game-composition="mobile"][data-game-orientation="landscape"] .resource-hud {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  max-height: none;
  overflow: visible;
}

/* Strategic (formerly internally labeled Legacy) Projects use ONE complete
   selectable project card. No project is stored in a scroll-hidden catalog.
   Mobile starts collapsed so an available investment cannot seize gameplay;
   opening occupies the existing bounded dashboard with a visible close action. */
.legacy-project-board { overflow: visible; }
.legacy-board-toolbar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 5px; min-width: 0; }
.legacy-board-toolbar h2 { margin: 0; font-size: .83rem; }
.legacy-board-pager { display: flex; align-items: center; justify-content: flex-end; gap: 5px; min-width: 0; }
.legacy-board-pager > span { font-size: .67rem; white-space: nowrap; }
.legacy-board-pager > button { min-width: 27px; min-height: 25px; padding: 2px 6px; font-size: .73rem; }
.legacy-project-board .legacy-project-card {
  margin-top: 5px;
  padding: 6px;
  gap: 5px;
  grid-template-columns: auto minmax(0, 1fr);
  font-size: .72rem;
}
.legacy-project-board .legacy-project-card > div { min-width: 0; }
.legacy-project-board .legacy-project-card h3 { font-size: .82rem; margin: 0 0 3px; }
.legacy-project-board .legacy-project-card p { font-size: .69rem; line-height: 1.18; margin: 0 0 3px; overflow-wrap: anywhere; }
.legacy-project-board .legacy-project-card .developer-button-row { display: flex; flex-wrap: wrap; gap: 4px; }
.legacy-project-board .legacy-project-card .button { min-height: 26px; padding: 3px 7px; font-size: .7rem; }
[data-game-composition="desktop"] .legacy-project-board { max-height: none; overflow: visible; }
[data-game-composition="mobile"] .legacy-project-board {
  position: absolute;
  inset: auto 4px 4px;
  z-index: 38;
  width: auto;
  max-height: none;
  overflow: visible;
  padding: 4px 5px;
  background: #141e2a;
}
[data-game-composition="mobile"] .legacy-board-toolbar h2 { font-size: .72rem; }
[data-game-composition="mobile"] .legacy-board-toolbar #legacy-board-toggle { min-height: 24px; padding: 2px 5px; font-size: .64rem; }
[data-game-composition="mobile"] .legacy-board-pager > span { font-size: .59rem; }
[data-game-composition="mobile"] .legacy-board-pager > button { min-width: 23px; min-height: 22px; padding: 2px 4px; }
[data-game-composition="mobile"] .legacy-project-board[data-collapsed="false"] {
  inset: 2px;
  z-index: 39;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  align-content: start;
  gap: 3px;
  border-color: #8ca9c8;
}
[data-game-composition="mobile"] .legacy-project-board[data-collapsed="false"] .legacy-project-card {
  grid-template-columns: minmax(0, 1fr);
  align-items: start;
  gap: 3px;
  padding: 3px 5px;
  margin: 0;
}
[data-game-composition="mobile"] .legacy-project-board .art-slot { display: none; }
[data-game-composition="mobile"] .legacy-project-board .legacy-project-card h3 { font-size: .73rem; }
[data-game-composition="mobile"] .legacy-project-board .legacy-project-card p { font-size: .62rem; line-height: 1.1; }
[data-game-composition="mobile"] .legacy-project-board .legacy-project-card .button { min-height: 23px; padding: 2px 4px; font-size: .63rem; }

/* The mobile Dumpster is five distinct finite activities. Never conceal
   a second panel behind an overflow scrollbar; player-selected tabs expose
   existing controls without resetting crew or inventory state. */
.dumpster-pane-tabs { display: none; }
[data-game-composition="mobile"] .dumpster-pane-tabs {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  align-items: stretch;
  gap: 2px;
  min-width: 0;
  margin: 2px 0 4px;
}
[data-game-composition="mobile"] .dumpster-pane-tabs > .button {
  min-width: 0;
  min-height: 26px;
  padding: 2px;
  font-size: .59rem;
  white-space: normal;
  overflow-wrap: anywhere;
}
[data-game-composition="mobile"] .dumpster-pane-tabs > .active {
  border-color: #ffda89; background: #49361d; color: #ffe6aa;
}
[data-game-composition="mobile"] .dumpster-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: minmax(0, 1fr);
  align-items: start;
  min-height: 0;
  height: auto;
  gap: 0;
}
[data-game-composition="mobile"] .dumpster-grid > .panel:not([hidden]) {
  display: grid;
  grid-column: 1;
  grid-row: 1;
  min-width: 0;
  min-height: 0;
  align-content: start;
  gap: 4px;
  padding: 5px;
}
[data-game-composition="mobile"] .dumpster-grid > .panel .panel-heading { gap: 4px; margin: 0; }
[data-game-composition="mobile"] .dumpster-grid > .panel .panel-heading h2 { font-size: .84rem; }
[data-game-composition="mobile"] .dumpster-grid > .panel .panel-heading .section-kicker { font-size: .58rem; }
[data-game-composition="mobile"] .dumpster-grid > .dig-panel .dumpster-art { height: 62px; margin: 0; }
[data-game-composition="mobile"] .dumpster-grid > .inventory-panel .inventory-list {
  display: grid; grid-template-columns: repeat(3,minmax(0,1fr));
  grid-template-rows: repeat(3,minmax(0,1fr));
  gap: 4px; min-height: 0; margin: 0;
}
[data-game-composition="mobile"] .dumpster-grid > .inventory-panel .inventory-tile {
  min-height: 0; height: min(16vw, 66px); aspect-ratio: auto;
}
[data-game-composition="mobile"][data-game-orientation="landscape"] .dumpster-grid {
  grid-template-columns: minmax(0,1fr);
}
[data-game-composition="mobile"][data-game-orientation="landscape"] .dumpster-grid > .inventory-panel .inventory-tile {
  height: 35px;
}

/* The touch Beach has three finite activities rather than a vertically
   stacked search, detector-shop and inventory catalog. */
.beach-pane-tabs { display:none; }
[data-game-composition="mobile"] .beach-pane-tabs {
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr));
  gap:3px; margin:2px 0 4px; min-width:0;
}
[data-game-composition="mobile"] .beach-pane-tabs > .button {
  min-width:0; min-height:26px; padding:2px;
  white-space:normal; overflow-wrap:anywhere; font-size:.62rem;
}
[data-game-composition="mobile"] .beach-pane-tabs > .active {
  border-color:#9aece1; color:#d2fff8; background:#195351;
}
[data-game-composition="mobile"] .beach-layout {
  display:grid; grid-template-columns:minmax(0,1fr);
  grid-template-rows:minmax(0,1fr); align-items:start;
  min-width:0; min-height:0; height:auto; gap:0;
}
[data-game-composition="mobile"] .beach-layout > :not([hidden]) {
  grid-column:1; grid-row:1; min-width:0; min-height:0;
}
[data-game-composition="mobile"] .beach-layout .beach-art { height:57px; margin:0 0 3px; }
[data-game-composition="mobile"] .beach-layout .accessory-progress-card { padding:4px; margin-top:4px; }
[data-game-composition="mobile"] .beach-layout .accessory-progress-card p { font-size:.62rem; margin:2px 0; }
[data-game-composition="mobile"] .beach-layout .beach-upgrades,
[data-game-composition="mobile"] .beach-layout .beach-inventory-panel { align-content:start; padding:5px; }
[data-game-composition="mobile"] .beach-layout .beach-inventory-panel .inventory-list {
  display:grid; grid-template-columns:repeat(2,minmax(0,1fr));
  gap:3px; margin:3px 0;
}
[data-game-composition="mobile"] .beach-layout .beach-inventory-panel .inventory-row {
  min-width:0; padding:3px; gap:3px;
}
[data-game-composition="mobile"] .beach-layout .beach-inventory-panel .art-slot { display:none; }
[data-game-composition="mobile"] .beach-layout .beach-inventory-panel .button { min-height:25px; padding:2px 4px; font-size:.62rem; }
[data-game-composition="mobile"][data-game-orientation="landscape"] .beach-layout {
  grid-template-columns:minmax(0,1fr);
}

/* Mobile Recycling Center uses one selected physical responsibility:
   routing/work, upgrades or production-line capacity. No stacked catalogs. */
.recycling-pane-tabs { display:none; }
.recycling-pane { min-width:0; }
[data-game-composition="mobile"] .recycling-pane-tabs {
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr));
  gap:3px; margin:2px 0 4px;
}
[data-game-composition="mobile"] .recycling-pane-tabs > .button {
  min-width:0; min-height:26px; padding:2px; font-size:.59rem;
  white-space:normal; overflow-wrap:anywhere;
}
[data-game-composition="mobile"] .recycling-pane-tabs > .active {
  border-color:#89d9b4; background:#184633; color:#d3ffe8;
}
[data-game-composition="mobile"] .recycling-pane:not([hidden]) {
  display:grid; grid-template-columns:minmax(0,1fr);
  align-content:start; gap:4px; min-height:0;
}
[data-game-composition="mobile"] .recycling-pane .recycling-control-grid { display:grid; grid-template-columns:minmax(0,1fr); gap:3px; }
[data-game-composition="mobile"] .recycling-pane .art-info-card { display:none; }
[data-game-composition="mobile"] .recycling-pane .developer-button-row { display:flex; flex-wrap:wrap; gap:3px; }
[data-game-composition="mobile"] .recycling-pane .developer-button-row > button { min-height:26px; padding:2px 4px; font-size:.65rem; }
[data-game-composition="mobile"] .recycling-pane .late-resource-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:3px; margin:0; }
[data-game-composition="mobile"] .recycling-pane .late-resource-grid > div { padding:3px; min-width:0; }
[data-game-composition="mobile"] .recycling-pane .late-resource-grid .art-slot { display:none; }
[data-game-composition="mobile"] .recycling-pane .late-resource-grid span { font-size:.57rem; }
[data-game-composition="mobile"] .recycling-pane .late-resource-grid strong { font-size:.65rem; }
[data-game-composition="mobile"] .recycling-pane .upgrade-list { margin:0; gap:4px; }
[data-game-composition="mobile"] .recycling-pane .automation-work { margin:2px 0; }

/* Interview Prep: actual sections remain intact, but the mobile player
   selects one responsibility per fixed view instead of scrolling past all
   character gear, benefits, seven purchases and final interview together. */
.interview-pane-tabs { display:none; }
[data-game-composition="mobile"] .interview-pane-tabs {
  display:grid; grid-template-columns:repeat(5,minmax(0,1fr));
  gap:2px; min-width:0; margin:2px 0 4px;
}
[data-game-composition="mobile"] .interview-pane-tabs > .button {
  min-width:0; min-height:26px; padding:2px; font-size:.57rem;
  white-space:normal; overflow-wrap:anywhere;
}
[data-game-composition="mobile"] .interview-pane-tabs > .active {
  color:#ffe4b5; border-color:#dfb77f; background:#4a351e;
}
[data-game-composition="mobile"] .employment-panel .job-layout {
  display:grid; grid-template-columns:minmax(0,1fr);
  grid-template-rows:minmax(0,1fr); align-content:start;
  gap:0; margin:0; min-height:0;
}
[data-game-composition="mobile"] .employment-panel .job-layout > :not([hidden]) {
  grid-column:1; grid-row:1; min-width:0; min-height:0;
}
[data-game-composition="mobile"] .employment-panel #employment-entry {
  display:grid; grid-template-columns:minmax(0,1fr); grid-template-rows:minmax(0,1fr);
  gap:0; min-width:0; min-height:0; margin:0;
}
[data-game-composition="mobile"] .employment-panel #employment-entry > :not([hidden]) {
  grid-column:1; grid-row:1; min-width:0;
}
[data-game-composition="mobile"] .employment-panel #paper-doll,
[data-game-composition="mobile"] .employment-panel #equipment-buff-summary,
[data-game-composition="mobile"] .employment-panel .outfit-checklist {
  padding:5px; gap:3px;
}
[data-game-composition="mobile"] .employment-panel .paper-doll-slots {
  display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:3px; margin-top:3px;
}
[data-game-composition="mobile"] .employment-panel .paper-doll-slot { padding:3px; gap:2px; }
[data-game-composition="mobile"] .employment-panel .outfit-list { gap:3px; }
[data-game-composition="mobile"] .employment-panel .outfit-list .purchase-card { padding:3px; gap:3px; }
[data-game-composition="mobile"] .employment-panel .outfit-list .art-slot { display:none; }
[data-game-composition="mobile"] .employment-panel .outfit-list .button { min-height:25px; padding:2px 4px; font-size:.64rem; }
[data-game-composition="mobile"] .employment-panel #interview-status { font-size:.68rem; }



/* Mobile clothing: a single fully accessible item or loadout view at a time.
   All seven slots and all items remain reachable through explicit finite pages. */
.clothing-mobile-tabs, .clothing-mobile-slot-page, .clothing-mobile-item-page { display:none; }
[data-game-composition="mobile"] .clothing-mobile-tabs {
  display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:4px; margin:3px 0;
}
[data-game-composition="mobile"] .clothing-mobile-tabs > button {
  min-width:0; min-height:25px; padding:3px; font-size:.68rem;
}
[data-game-composition="mobile"] .clothing-mobile-tabs > button.active {
  color:#ffe5b8; border-color:#cda36b; background:#493b28;
}
[data-game-composition="mobile"] .clothing-mobile-slot-page:not([hidden]),
[data-game-composition="mobile"] .clothing-mobile-item-page:not([hidden]) {
  display:grid; grid-template-columns:32px minmax(0,1fr) 32px; align-items:center;
  gap:5px; margin:3px 0; text-align:center;
}
[data-game-composition="mobile"] .clothing-mobile-slot-page strong,
[data-game-composition="mobile"] .clothing-mobile-item-page strong { font-size:.67rem; }
[data-game-composition="mobile"] .clothing-mobile-slot-page button,
[data-game-composition="mobile"] .clothing-mobile-item-page button {
  min-height:25px; padding:2px; font-size:.72rem;
}
[data-game-composition="mobile"] .clothing-shop-filters {
  grid-template-columns:repeat(4,minmax(0,1fr)); gap:3px; margin:3px 0;
}
[data-game-composition="mobile"] .clothing-shop-filters > [hidden] { display:none!important; }
[data-game-composition="mobile"] .clothing-shop-list { grid-template-columns:minmax(0,1fr); gap:3px; }
[data-game-composition="mobile"] .clothing-card {
  min-width:0; padding:5px; gap:5px;
  grid-template-columns:45px minmax(0,1fr) auto; align-items:center;
}
[data-game-composition="mobile"] .clothing-card > .art-slot { width:40px; height:40px; }
[data-game-composition="mobile"] .clothing-card > div { min-width:0; gap:2px; }
[data-game-composition="mobile"] .clothing-card strong { font-size:.71rem; }
[data-game-composition="mobile"] .clothing-card small, 
[data-game-composition="mobile"] .clothing-card span { font-size:.62rem; }
[data-game-composition="mobile"] .clothing-card > .button { grid-column:1/-1; min-height:25px; padding:2px; font-size:.66rem; }
[data-game-composition="mobile"] .wardrobe-loadouts { grid-template-columns:minmax(0,1fr); gap:4px; margin:4px 0; }
[data-game-composition="mobile"] .wardrobe-loadout { grid-template-columns:minmax(0,1fr) auto auto; gap:4px; padding:5px; }
[data-game-composition="mobile"] .wardrobe-loadout > span { font-size:.69rem; }
[data-game-composition="mobile"] .wardrobe-loadout > button { min-height:24px; padding:2px 5px; font-size:.64rem; }
[data-game-composition="mobile"] .clothing-shop > p { margin:2px 0; font-size:.64rem; }
[data-game-composition="mobile"] #clothing-shop-products[hidden],
[data-game-composition="mobile"] .wardrobe-loadouts[hidden] { display:none!important; }


/* Factory career: finite mobile responsibility views instead of a stacked work,
   stock, automation, upgrades and promotion catalog. All earlier work runs normally. */
.factory-mobile-resource-page, .factory-mobile-automation-page, .factory-mobile-upgrade-page { display:none; }
[data-game-composition="mobile"] .career-area .area-hero { min-height:48px; margin-bottom:4px; padding:5px 8px; }
[data-game-composition="mobile"] .career-area .area-hero p:last-child { font-size:.68rem; margin:0; }
[data-game-composition="mobile"] .career-area .factory-work {
  grid-template-columns:minmax(0,1fr); grid-auto-rows:min-content;
  gap:4px; margin-top:4px; min-height:0;
}
[data-game-composition="mobile"][data-game-orientation="landscape"] .career-area .factory-work {
  grid-template-columns:minmax(0,1fr);
}
[data-game-composition="mobile"] .career-area .factory-pane-tabs {
  grid-column:1; grid-template-columns:repeat(3,minmax(0,1fr)); gap:3px; padding:3px;
}
[data-game-composition="mobile"] .career-area .factory-pane-tabs .game-tab {
  min-width:0; min-height:26px; padding:2px 3px; font-size:.67rem; white-space:normal;
}
[data-game-composition="mobile"] .career-area .factory-work > [data-factory-pane]:not([hidden]) {
  grid-column:1; grid-row:auto; min-width:0; padding:6px; margin:0;
}
[data-game-composition="mobile"] .career-area .factory-work [data-factory-pane][hidden],
[data-game-composition="mobile"] .career-area .production-resources > [hidden],
[data-game-composition="mobile"] .career-area #employee-upgrade-list > [hidden],
[data-game-composition="mobile"] .career-area #factory-automation-status > [hidden] { display:none!important; }
[data-game-composition="mobile"] .career-area .factory-career-overview { gap:3px; }
[data-game-composition="mobile"] .career-area .employment-stats { grid-template-columns:repeat(2,minmax(0,1fr)); gap:3px; margin:0; }
[data-game-composition="mobile"] .career-area .production-resources { grid-template-columns:repeat(2,minmax(0,1fr)); gap:3px; margin:0; }
[data-game-composition="mobile"] .career-area .production-resources > div { padding:5px; }
[data-game-composition="mobile"] .career-area .production-resources .art-slot { width:35px; height:35px; }
[data-game-composition="mobile"] .career-area .factory-packaging,
[data-game-composition="mobile"] .career-area .factory-action,
[data-game-composition="mobile"] .career-area .factory-automation,
[data-game-composition="mobile"] .career-area .employee-development { align-content:start; gap:3px; }
[data-game-composition="mobile"] .career-area .package-grid { gap:3px; }
[data-game-composition="mobile"] .career-area .package-card { grid-template-columns:36px minmax(0,1fr); gap:4px; padding:5px; }
[data-game-composition="mobile"] .career-area .package-card .art-slot { width:36px; height:36px; }
[data-game-composition="mobile"] .career-area .package-card > .button,
[data-game-composition="mobile"] .career-area .package-card > .progress-track,
[data-game-composition="mobile"] .career-area .package-card .upgrade-effect { grid-column:1/-1; }
[data-game-composition="mobile"] .career-area .package-card > .button { min-height:26px; padding:3px; }
[data-game-composition="mobile"] .career-area .factory-automation .automation-status { padding:5px; }
[data-game-composition="mobile"] .career-area .factory-automation .automation-status-list { gap:3px; }
[data-game-composition="mobile"] .career-area .factory-upgrade-tabs { margin:2px 0; gap:3px; }
[data-game-composition="mobile"] .career-area .factory-upgrade-tabs .game-tab { min-height:26px; padding:2px; font-size:.64rem; }
[data-game-composition="mobile"] .career-area #employee-upgrade-list { grid-template-columns:minmax(0,1fr); gap:3px; }
[data-game-composition="mobile"] .career-area .upgrade-category-heading { gap:4px; }
[data-game-composition="mobile"] .career-area .upgrade-category-heading .subsection-title { font-size:.76rem; }
[data-game-composition="mobile"] .career-area .buy-mode-selector { min-width:0; }
[data-game-composition="mobile"] .career-area .promotion-card { display:flex; flex-wrap:wrap; gap:6px; margin:0; padding:7px; }
[data-game-composition="mobile"] .career-area .promotion-card > .button { min-height:28px; }
[data-game-composition="mobile"] .career-area .factory-work[data-factory-active-pane="promotion"] .employee-development > :not(.promotion-card) { display:none!important; }
[data-game-composition="mobile"] .career-area .factory-mobile-resource-page:not([hidden]),
[data-game-composition="mobile"] .career-area .factory-mobile-automation-page:not([hidden]),
[data-game-composition="mobile"] .career-area .factory-mobile-upgrade-page:not([hidden]) {
  display:grid; grid-template-columns:30px minmax(0,1fr) 30px; gap:4px; align-items:center;
  margin:2px 0; text-align:center;
}
[data-game-composition="mobile"] .career-area .factory-mobile-resource-page strong,
[data-game-composition="mobile"] .career-area .factory-mobile-automation-page strong,
[data-game-composition="mobile"] .career-area .factory-mobile-upgrade-page strong { font-size:.69rem; }
[data-game-composition="mobile"] .career-area .factory-mobile-resource-page button,
[data-game-composition="mobile"] .career-area .factory-mobile-automation-page button,
[data-game-composition="mobile"] .career-area .factory-mobile-upgrade-page button { min-height:25px; padding:2px; }


/* Factory Ownership: one complete mobile responsibility screen at a time. */
.business-mobile-views, .business-mobile-upgrade-page { display:none; }
[data-game-composition="mobile"] .business-area .area-hero { min-height:45px; margin-bottom:4px; padding:6px; }
[data-game-composition="mobile"] .business-area .area-hero p:last-child { font-size:.67rem; margin:0; }
[data-game-composition="mobile"] .business-area .business-owner-console { display:grid; grid-template-columns:minmax(0,1fr); gap:5px; }
[data-game-composition="mobile"] .business-area .business-mobile-views {
  display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:3px; margin:0;
}
[data-game-composition="mobile"] .business-area .business-mobile-views .button {
  min-width:0; min-height:30px; padding:3px 1px; font-size:.67rem;
  white-space:normal; overflow-wrap:anywhere;
}
[data-game-composition="mobile"] .business-area .business-mobile-views .active {
  color:#e1f3e7; border-color:#63b886; background:#244b37;
}
[data-game-composition="mobile"] .business-area [data-business-owner-pane][hidden],
[data-game-composition="mobile"] .business-area #business-upgrade-list > [hidden] { display:none!important; }
[data-game-composition="mobile"] .business-area [data-business-owner-pane]:not([hidden]) { margin:0; min-width:0; }
[data-game-composition="mobile"] .business-area .business-financials {
  grid-template-columns:repeat(2,minmax(0,1fr)); gap:4px;
}
[data-game-composition="mobile"] .business-area .business-financials > div { padding:7px; }
[data-game-composition="mobile"] .business-area .business-action-card,
[data-game-composition="mobile"] .business-area .owner-draw-card,
[data-game-composition="mobile"] .business-area .business-upgrades { padding:7px; }
[data-game-composition="mobile"] .business-area .business-action-card { display:grid; gap:5px; }
[data-game-composition="mobile"] .business-area .business-action-card p { margin:0; }
[data-game-composition="mobile"] .business-area .owner-draw-card {
  display:grid; grid-template-columns:minmax(0,1fr); gap:5px; align-items:start;
}
[data-game-composition="mobile"] .business-area .owner-draw-card .button { min-height:30px; }
[data-game-composition="mobile"] .business-area .business-upgrades {
  display:grid; grid-template-columns:minmax(0,1fr); gap:4px;
}
[data-game-composition="mobile"] .business-area .business-upgrades > p { margin:0; font-size:.68rem; }
[data-game-composition="mobile"] .business-area .business-upgrades .upgrade-category-heading { gap:4px; }
[data-game-composition="mobile"] .business-area #business-upgrade-list {
  display:grid; grid-template-columns:minmax(0,1fr); gap:4px;
}
[data-game-composition="mobile"] .business-area .business-mobile-upgrade-page:not([hidden]) {
  display:grid; grid-template-columns:30px minmax(0,1fr) 30px; align-items:center; gap:4px;
  margin:2px 0; text-align:center;
}
[data-game-composition="mobile"] .business-area .business-mobile-upgrade-page strong { font-size:.7rem; }
[data-game-composition="mobile"] .business-area .business-mobile-upgrade-page .button { min-height:27px; padding:2px; }


/* Early-stage mobile upgrades: explicit full-card pages instead of long
   stacked catalogs. Every unlocked purchase remains reachable. */
.early-mobile-upgrade-page { display:none; }
[data-game-composition="mobile"] .early-mobile-upgrade-page:not([hidden]) {
  display:grid; grid-template-columns:30px minmax(0,1fr) 30px; align-items:center;
  gap:4px; margin:3px 0; text-align:center;
}
[data-game-composition="mobile"] .early-mobile-upgrade-page > strong { min-width:0; font-size:.69rem; }
[data-game-composition="mobile"] .early-mobile-upgrade-page > .button { min-height:27px; padding:2px; }
[data-game-composition="mobile"] .upgrades-panel #upgrade-list,
[data-game-composition="mobile"] .automation-panel #crew-upgrade-list,
[data-game-composition="mobile"] .beach-upgrades #beach-upgrade-list,
[data-game-composition="mobile"] .recycling-pane #recycling-upgrade-list {
  display:grid; grid-template-columns:minmax(0,1fr); gap:3px; margin:0;
}
[data-game-composition="mobile"] #upgrade-list > [hidden],
[data-game-composition="mobile"] #crew-upgrade-list > [hidden],
[data-game-composition="mobile"] #beach-upgrade-list > [hidden],
[data-game-composition="mobile"] #recycling-upgrade-list > [hidden] { display:none!important; }
[data-game-composition="mobile"] .upgrades-panel .panel-heading,
[data-game-composition="mobile"] .automation-panel .upgrade-section,
[data-game-composition="mobile"] .beach-upgrades,
[data-game-composition="mobile"] .recycling-pane[data-recycling-section="upgrades"] { gap:4px; }
[data-game-composition="mobile"] .upgrades-panel .panel-heading,
[data-game-composition="mobile"] .beach-upgrades .upgrade-category-heading { margin-bottom:3px; }


/* Crew: make actual recruitment/equipment, live automation and earned training
   three finite mobile screens. Never clip a later equipment purchase. */
.crew-mobile-views, .crew-mobile-purchase-page { display:none; }
[data-game-composition="mobile"] .automation-panel .crew-mobile-views {
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:3px; margin:2px 0;
}
[data-game-composition="mobile"] .automation-panel .crew-mobile-views .button {
  min-width:0; min-height:28px; padding:2px 3px; font-size:.66rem;
  white-space:normal; overflow-wrap:anywhere;
}
[data-game-composition="mobile"] .automation-panel .crew-mobile-views .active {
  color:#e1efff; border-color:#80b0db; background:#253e5c;
}
[data-game-composition="mobile"] .automation-panel .automation-grid {
  display:grid; grid-template-columns:minmax(0,1fr); gap:0; margin:2px 0;
}
[data-game-composition="mobile"] .automation-panel[data-crew-active-view="training"] .automation-grid { display:none!important; }
[data-game-composition="mobile"] .automation-panel .automation-grid > [hidden],
[data-game-composition="mobile"] .automation-panel #crew-upgrade-section[hidden],
[data-game-composition="mobile"] .automation-panel .progression-purchases > .purchase-card[hidden] { display:none!important; }
[data-game-composition="mobile"] .automation-panel .operation-status {
  padding:6px; gap:4px; min-width:0;
}
[data-game-composition="mobile"] .automation-panel .operation-status .progress-track { margin-top:5px; }
[data-game-composition="mobile"] .automation-panel .operation-status .action-status { margin-top:4px; font-size:.73rem; }
[data-game-composition="mobile"] .automation-panel .progression-purchases { display:grid; gap:4px; min-width:0; }
[data-game-composition="mobile"] .automation-panel .progression-purchases .purchase-card {
  grid-template-columns:38px minmax(0,1fr); align-items:center; gap:5px; padding:6px;
}
[data-game-composition="mobile"] .automation-panel .progression-purchases .art-slot { width:38px; height:38px; }
[data-game-composition="mobile"] .automation-panel .progression-purchases .upgrade-actions,
[data-game-composition="mobile"] .automation-panel .progression-purchases .purchase-card > .button { grid-column:1/-1; }
[data-game-composition="mobile"] .automation-panel .progression-purchases .button { min-height:28px; padding:3px; }
[data-game-composition="mobile"] .automation-panel .crew-mobile-purchase-page:not([hidden]) {
  display:grid; grid-template-columns:30px minmax(0,1fr) 30px; gap:3px; align-items:center;
  margin:2px 0; text-align:center;
}
[data-game-composition="mobile"] .automation-panel .crew-mobile-purchase-page strong { font-size:.69rem; }
[data-game-composition="mobile"] .automation-panel .crew-mobile-purchase-page .button { min-height:25px; padding:2px; }
[data-game-composition="mobile"] .automation-panel #crew-upgrade-section { margin:2px 0; gap:4px; }


/* Complete finite mobile Interview Prep pagination: no stacked seven-slot
   outfit, paper-doll or all-run gear-buff catalog. All entries are reachable. */
.interview-mobile-list-page { display:none; }
[data-game-composition="mobile"] .employment-panel .interview-mobile-list-page:not([hidden]) {
  display:grid; grid-template-columns:30px minmax(0,1fr) 30px; gap:4px;
  align-items:center; margin:3px 0; text-align:center;
}
[data-game-composition="mobile"] .employment-panel .interview-mobile-list-page strong {
  min-width:0; font-size:.69rem;
}
[data-game-composition="mobile"] .employment-panel .interview-mobile-list-page .button { min-height:26px; padding:2px; }
[data-game-composition="mobile"] .employment-panel #paper-doll-slots {
  grid-template-columns:repeat(2,minmax(0,1fr)); gap:4px; margin-top:4px;
}
[data-game-composition="mobile"] .employment-panel #paper-doll-slots > [hidden],
[data-game-composition="mobile"] .employment-panel #equipment-buff-summary > [hidden],
[data-game-composition="mobile"] .employment-panel #outfit-list > [hidden] { display:none!important; }
[data-game-composition="mobile"] .employment-panel #equipment-buff-summary { gap:4px; }
[data-game-composition="mobile"] .employment-panel #equipment-buff-summary .buff-entry { gap:2px; padding:4px 5px; }
[data-game-composition="mobile"] .employment-panel #equipment-buff-summary .buff-entry strong,
[data-game-composition="mobile"] .employment-panel #equipment-buff-summary .buff-entry small { font-size:.68rem; }
[data-game-composition="mobile"] .employment-panel #outfit-list { grid-template-columns:minmax(0,1fr); gap:3px; }
[data-game-composition="mobile"] .employment-panel #outfit-list .purchase-card { min-width:0; }


/* Recycling mobile Operations: explicitly selected routing or actual live
   processing; never stack unrelated control and production panels. */
.recycling-mobile-operation-tabs { display:none; }
[data-game-composition="mobile"] .recycling-pane .recycling-mobile-operation-tabs {
  display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:4px; margin:2px 0 4px;
}
[data-game-composition="mobile"] .recycling-pane .recycling-mobile-operation-tabs > .button {
  min-width:0; min-height:28px; padding:3px; font-size:.69rem;
}
[data-game-composition="mobile"] .recycling-pane .recycling-mobile-operation-tabs > .active {
  color:#e0f5dc; border-color:#73b77b; background:#28523b;
}
[data-game-composition="mobile"] .recycling-pane [data-recycling-operation-part][hidden] { display:none!important; }
[data-game-composition="mobile"] .recycling-pane .recycling-control-grid { grid-template-columns:minmax(0,1fr); gap:5px; }
[data-game-composition="mobile"] .recycling-pane .recycling-control-grid .art-info-card { margin:2px 0; padding:5px; }
[data-game-composition="mobile"] .recycling-pane .recycling-control-grid .art-info-card .art-slot { display:none; }
[data-game-composition="mobile"] .recycling-pane .recycling-control-grid .art-info-card p { font-size:.7rem; }
[data-game-composition="mobile"] .recycling-pane .recycling-control-grid .developer-button-row { gap:3px; }
[data-game-composition="mobile"] .recycling-pane [data-recycling-operation-part="production"] { min-width:0; }


/* The live mobile statistics catalog is two independently finite navigators:
   one real category and up to two fully visible statistic rows per page. */
.statistics-mobile-group-page, .statistics-mobile-entry-page { display:none; }
[data-game-composition="mobile"] .statistics-mobile-group-page:not([hidden]),
[data-game-composition="mobile"] .statistics-mobile-entry-page:not([hidden]) {
  display:grid; grid-template-columns:30px minmax(0,1fr) 30px; align-items:center;
  gap:4px; margin:3px 0; text-align:center;
}
[data-game-composition="mobile"] .statistics-mobile-group-page strong,
[data-game-composition="mobile"] .statistics-mobile-entry-page strong {
  min-width:0; overflow-wrap:anywhere; font-size:.7rem;
}
[data-game-composition="mobile"] .statistics-mobile-group-page .button,
[data-game-composition="mobile"] .statistics-mobile-entry-page .button {
  min-height:27px; padding:2px;
}
[data-game-composition="mobile"] .statistics-content { min-width:0; }
[data-game-composition="mobile"] .statistics-content .statistics-group { margin:3px 0; }
[data-game-composition="mobile"] .statistics-content .statistics-group h3 { margin:3px 0; font-size:.83rem; }
[data-game-composition="mobile"] .statistics-content .stat-grid {
  display:grid; grid-template-columns:minmax(0,1fr); gap:4px;
}
[data-game-composition="mobile"] .statistics-content .stat-grid > div { min-width:0; padding:6px 8px; }
[data-game-composition="mobile"] .statistics-content .stat-grid strong { overflow-wrap:anywhere; font-size:.86rem; }


/* Mobile Game Settings show one complete existing purpose at a time:
   display, audio, saving, each discovered resource preference or reset. */
.game-settings-mobile-tabs, .resource-settings-mobile-page { display:none; }
[data-game-composition="mobile"] .game-settings-mobile-tabs {
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:3px; margin:2px 0 5px;
}
[data-game-composition="mobile"] .game-settings-mobile-tabs .button {
  min-width:0; min-height:27px; padding:2px 3px; font-size:.69rem;
}
[data-game-composition="mobile"] .game-settings-mobile-tabs .active {
  color:#fff0c7; border-color:#e8be62; background:#4c3b22;
}
[data-game-composition="mobile"] .game-settings-part[hidden] { display:none!important; }
[data-game-composition="mobile"] .game-settings-part { display:grid; gap:4px; min-width:0; }
[data-game-composition="mobile"] .game-settings-part .settings-info-grid {
  grid-template-columns:minmax(0,1fr); gap:4px;
}
[data-game-composition="mobile"] .game-settings-part .settings-info-grid > div { padding:6px; }
[data-game-composition="mobile"] .game-settings-part .settings-action-card {
  display:grid; grid-template-columns:minmax(0,1fr); gap:6px; margin:2px 0; padding:7px;
}
[data-game-composition="mobile"] .game-settings-part .settings-action-card .button { min-height:30px; }
[data-game-composition="mobile"] .game-settings-part .audio-settings { gap:5px; padding:7px; margin:2px 0; }
[data-game-composition="mobile"] .game-settings-part .audio-settings p { font-size:.69rem; }
[data-game-composition="mobile"] .game-settings-part .audio-control-grid { gap:5px; }
[data-game-composition="mobile"] .game-settings-part .audio-control-grid label {
  display:grid; grid-template-columns:42px minmax(0,1fr) 55px; gap:4px; min-width:0;
}
[data-game-composition="mobile"] .game-settings-part .audio-control-grid button { min-height:28px; padding:3px; font-size:.66rem; }
[data-game-composition="mobile"] .game-settings-part .resource-settings-mobile-page:not([hidden]) {
  display:grid; grid-template-columns:30px minmax(0,1fr) 30px; align-items:center; gap:4px; text-align:center;
}
[data-game-composition="mobile"] .game-settings-part .resource-settings-mobile-page strong { font-size:.7rem; }
[data-game-composition="mobile"] .game-settings-part .resource-settings-mobile-page button { min-height:26px; padding:2px; }
[data-game-composition="mobile"] .game-settings-part .settings-checklist { display:grid; grid-template-columns:minmax(0,1fr); gap:3px; }


/* Mobile diagnostics: live two-field status, one record at a time with fully
   reachable bounded text chunks, and separate complete copy/clear actions. */
.diagnostics-mobile-views, .diagnostics-mobile-page { display:none; }
[data-game-composition="mobile"] .diagnostics-mobile-views {
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:3px; margin:3px 0;
}
[data-game-composition="mobile"] .diagnostics-mobile-views > .button { min-width:0; min-height:27px; padding:2px; font-size:.68rem; }
[data-game-composition="mobile"] .diagnostics-mobile-views > .active {
  color:#e9d5fd; border-color:#ab79ce; background:#43304e;
}
[data-game-composition="mobile"] [data-diagnostics-part][hidden],
[data-game-composition="mobile"] #diagnostics-metadata > [hidden] { display:none!important; }
[data-game-composition="mobile"] .diagnostics-mobile-page:not([hidden]) {
  display:grid; grid-template-columns:30px minmax(0,1fr) 30px; gap:3px;
  align-items:center; margin:2px 0; text-align:center;
}
[data-game-composition="mobile"] .diagnostics-mobile-page strong { font-size:.68rem; }
[data-game-composition="mobile"] .diagnostics-mobile-page .button { min-height:26px; padding:2px; }
[data-game-composition="mobile"] #diagnostics-metadata { grid-template-columns:minmax(0,1fr); gap:4px; }
[data-game-composition="mobile"] #diagnostics-metadata > div { min-width:0; padding:5px 7px; overflow-wrap:anywhere; }
[data-game-composition="mobile"] .diagnostic-actions { display:grid; grid-template-columns:minmax(0,1fr); gap:5px; margin:4px 0; }
[data-game-composition="mobile"] .diagnostic-actions .button { min-height:30px; }
[data-game-composition="mobile"] #diagnostics-log {
  min-width:0; max-height:none; margin:4px 0; overflow:visible; padding:7px;
  overflow-wrap:anywhere; white-space:pre-wrap; font-size:.65rem; line-height:1.25;
}


/* Mobile Developer diagnostics: one real control group, two authored action
   buttons, or one unabridged state-inspector field on each finite screen. */
.developer-mobile-page { display:none; }
[data-game-composition="mobile"] .developer-mobile-page:not([hidden]) {
  display:grid; grid-template-columns:30px minmax(0,1fr) 30px; gap:4px;
  align-items:center; margin:3px 0; text-align:center;
}
[data-game-composition="mobile"] .developer-mobile-page strong { min-width:0; overflow-wrap:anywhere; font-size:.69rem; }
[data-game-composition="mobile"] .developer-mobile-page button { min-height:27px; padding:2px; }
[data-game-composition="mobile"] #developer-controls { grid-template-columns:minmax(0,1fr); gap:4px; }
[data-game-composition="mobile"] #developer-controls > [hidden],
[data-game-composition="mobile"] #developer-controls .developer-button-row > [hidden],
[data-game-composition="mobile"] #developer-inspector-section[hidden],
[data-game-composition="mobile"] #developer-state .inspector-grid > [hidden] { display:none!important; }
[data-game-composition="mobile"] #developer-controls .developer-group { padding:6px; min-width:0; }
[data-game-composition="mobile"] #developer-controls .developer-group h3 { font-size:.79rem; margin:2px 0 3px; }
[data-game-composition="mobile"] #developer-controls .developer-group label { gap:3px; margin:3px 0; font-size:.68rem; }
[data-game-composition="mobile"] #developer-controls .developer-group .developer-button-row { gap:4px; margin:3px 0; }
[data-game-composition="mobile"] #developer-controls .developer-group .developer-button-row .button {
  flex:1 1 100%; min-height:27px; padding:3px; font-size:.69rem;
}
[data-game-composition="mobile"] #developer-inspector-section { margin:2px 0; }
[data-game-composition="mobile"] #developer-inspector-section > h3 { margin:3px 0; font-size:.78rem; }
[data-game-composition="mobile"] #developer-state .inspector-grid { grid-template-columns:minmax(0,1fr); gap:4px; }
[data-game-composition="mobile"] #developer-state .inspector-grid > div { min-width:0; padding:6px; overflow-wrap:anywhere; font-size:.67rem; }


/* Settings section navigation is always finite on touch screens, including
   when the developer tab appears. No side-scrolling tab strip or lost tab. */
[data-game-composition="mobile"] .settings-header {
  min-width:0; gap:4px; padding:6px 7px 4px;
}
[data-game-composition="mobile"] .settings-header-actions { min-width:0; gap:4px; }
[data-game-composition="mobile"] .settings-header .developer-badge { font-size:.59rem; padding:2px 3px; }
[data-game-composition="mobile"] #settings-close { min-width:0; min-height:27px; padding:3px 6px; font-size:.72rem; }
[data-game-composition="mobile"] .settings-tabs {
  display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:2px;
  padding:0 3px; overflow:visible; min-width:0;
}
[data-game-composition="mobile"] .settings-tab {
  min-width:0; min-height:28px; padding:5px 1px; font-size:.65rem;
  white-space:normal; overflow-wrap:anywhere; text-align:center;
}
[data-game-composition="mobile"] .settings-tab[hidden] { display:none!important; }

/* Hosted bug reporting: a small self-contained dialog, not another desktop game scroll region. */
.report-bug-launch[hidden], #report-bug-button[hidden], .bug-report-overlay[hidden], .bug-report-preview[hidden] { display: none; }
.bug-report-overlay { position: fixed; inset: 0; z-index: 110; display: grid; place-items: center; padding: 16px; background: rgba(8,7,6,.85); }
.bug-report-dialog { display: grid; gap: 10px; width: min(700px, 100%); max-height: 92%; padding: 20px; border: 1px solid var(--gold); border-radius: 14px; background: var(--surface-raised); box-shadow: 0 18px 65px rgba(0,0,0,.65); }
.bug-report-heading, .bug-report-actions { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.bug-report-help, .bug-report-note { margin: 0; color: var(--muted); font-size: .84rem; line-height: 1.4; }
.bug-report-preview { text-align: center; min-height: 0; }
.bug-report-preview img { max-width: 100%; max-height: 170px; object-fit: contain; border: 1px solid var(--line); border-radius: 5px; }
.bug-report-label { font-weight: 700; }
.bug-report-dialog textarea { width: 100%; min-height: 110px; resize: none; padding: 10px; border-radius: 7px; border: 1px solid var(--line); background: var(--surface); color: var(--ink); font: inherit; }
.bug-report-dialog .button { min-width: 110px; }
[data-game-composition="desktop"] .bug-report-overlay { position: absolute; }
[data-game-composition="mobile"] .bug-report-overlay { position: absolute; padding: 8px; }
[data-game-composition="mobile"] .bug-report-dialog { padding: 12px; gap: 6px; max-height: 100%; overflow-y: auto; }
[data-game-composition="mobile"] .bug-report-preview img { max-height: 90px; }

/* Hosted bug reports: mobile evidence is a separately reachable complete
   screen, not a scroll container or overflow-clipped form. Desktop unchanged. */
.bug-report-mobile-pages { display: none; }
[data-game-composition="mobile"] .bug-report-dialog {
  width: 100%; min-width: 0; max-height: 100%; overflow: visible;
  padding: 7px; gap: 5px; align-content: start;
}
[data-game-composition="mobile"] .bug-report-heading { min-width: 0; gap: 5px; }
[data-game-composition="mobile"] .bug-report-heading h2 { margin: 0; font-size: .85rem; }
[data-game-composition="mobile"] .bug-report-heading .section-kicker { margin: 0; font-size: .58rem; }
[data-game-composition="mobile"] .bug-report-heading .button { min-width: 0; min-height: 27px; padding: 3px 7px; }
[data-game-composition="mobile"] .bug-report-mobile-pages {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px;
}
[data-game-composition="mobile"] .bug-report-mobile-pages .button {
  min-width: 0; min-height: 27px; padding: 3px; font-size: .68rem;
}
[data-game-composition="mobile"] .bug-report-mobile-pages .active {
  background: #445c73; border-color: #a7c9dd; color: #fff;
}
[data-game-composition="mobile"] .bug-report-dialog:not([data-bug-mobile-page="capture"]) > .bug-report-help,
[data-game-composition="mobile"] .bug-report-dialog:not([data-bug-mobile-page="capture"]) > .bug-report-preview,
[data-game-composition="mobile"] .bug-report-dialog:not([data-bug-mobile-page="capture"]) > #bug-report-capture-status,
[data-game-composition="mobile"] .bug-report-dialog[data-bug-mobile-page="capture"] > .bug-report-label,
[data-game-composition="mobile"] .bug-report-dialog[data-bug-mobile-page="capture"] > #bug-report-description,
[data-game-composition="mobile"] .bug-report-dialog[data-bug-mobile-page="capture"] > #bug-report-status,
[data-game-composition="mobile"] .bug-report-dialog[data-bug-mobile-page="capture"] > .bug-report-actions { display: none!important; }
[data-game-composition="mobile"] .bug-report-dialog textarea {
  box-sizing: border-box; min-height: 0; height: clamp(74px, 24dvh, 145px);
  padding: 6px; font-size: .78rem;
}
[data-game-composition="mobile"] .bug-report-dialog .bug-report-help,
[data-game-composition="mobile"] .bug-report-dialog .bug-report-note {
  font-size: .69rem; line-height: 1.22; overflow-wrap: anywhere;
}
[data-game-composition="mobile"] .bug-report-dialog .bug-report-label { font-size: .73rem; }
[data-game-composition="mobile"] .bug-report-dialog .bug-report-actions { gap: 5px; }
[data-game-composition="mobile"] .bug-report-dialog .bug-report-actions .button {
  min-width: 0; min-height: 28px; padding: 4px 7px; font-size: .68rem;
}
[data-game-composition="mobile"] .bug-report-preview img { max-height: min(90px, 19dvh); }

/* All one-step confirmations retain their complete actual actions inside
   the mobile presentation; never turn welcome, discovery, reset or Coin
   collection into a nested scrollbar. No text or confirmation is omitted. */
[data-game-composition="mobile"] .confirmation-backdrop {
  inset: 0; min-width: 0; min-height: 0; box-sizing: border-box;
  align-content: center; justify-items: center;
}
[data-game-composition="mobile"] .confirmation-card {
  box-sizing: border-box; width: min(430px, 100%); max-width: 100%;
  max-height: 100%; min-height: 0; overflow: visible;
  display: grid; align-content: center; justify-items: stretch; gap: 6px;
  padding: 9px; border-radius: 8px;
}
[data-game-composition="mobile"] .confirmation-card h2 {
  font-size: .9rem; line-height: 1.16; margin: 0; overflow-wrap: anywhere;
}
[data-game-composition="mobile"] .confirmation-card .section-kicker {
  margin: 0; font-size: .59rem;
}
[data-game-composition="mobile"] .confirmation-card p:not(.section-kicker) {
  margin: 0; font-size: .7rem; line-height: 1.24; overflow-wrap: anywhere;
}
[data-game-composition="mobile"] .confirmation-card .modal-art {
  display: block; justify-self: center; width: auto;
  max-width: min(80px, 20dvh); max-height: min(64px, 15dvh);
  height: auto; margin: 0;
}
[data-game-composition="mobile"] .confirmation-card > .button,
[data-game-composition="mobile"] .confirmation-actions .button {
  min-width: 0; min-height: 30px; padding: 5px 7px;
  font-size: .7rem; white-space: normal; overflow-wrap: anywhere;
}
[data-game-composition="mobile"] .confirmation-actions {
  display: grid; grid-template-columns: repeat(2, minmax(0,1fr));
  align-items: stretch; gap: 5px;
}
[data-game-composition="mobile"][data-game-orientation="landscape"] .confirmation-card {
  gap: 3px; padding: 6px 8px;
}
[data-game-composition="mobile"][data-game-orientation="landscape"] .confirmation-card .modal-art {
  max-height: 35px; max-width: 44px;
}

/* Every mobile Settings category is already partitioned into finite purpose,
   statistic, diagnostic and developer pages. Remove the old shared scroll
   viewport instead of requiring gestures to uncover those real controls. */
[data-game-composition="mobile"] .settings-dialog {
  box-sizing: border-box; grid-template-rows: auto auto auto;
  align-content: start; max-height: 100%; overflow: visible;
  padding: 0; min-width: 0;
}
[data-game-composition="mobile"] .settings-content {
  box-sizing: border-box; min-width: 0; min-height: 0;
  padding: 5px 8px 8px; overflow: visible; overscroll-behavior: auto;
}
[data-game-composition="mobile"] .settings-section { min-width: 0; }
[data-game-composition="mobile"] .settings-section > h3 {
  margin: 2px 0 4px; font-size: .8rem;
}
[data-game-composition="mobile"][data-game-orientation="landscape"] .settings-content {
  padding: 3px 7px 5px;
}

/* Mobile Beach loot is one complete item with its actual Sell control per page.
   Full desktop loot inventory remains visible as before; no items are clipped. */
.beach-inventory-pager { display: none; }
[data-game-composition="mobile"] .beach-inventory-pager:not([hidden]) {
  display: grid; grid-template-columns: 32px minmax(0,1fr) 32px;
  align-items: center; gap: 4px; margin: 2px 0;
}
[data-game-composition="mobile"] .beach-inventory-pager strong {
  min-width: 0; text-align: center; font-size: .7rem; overflow-wrap: anywhere;
}
[data-game-composition="mobile"] .beach-inventory-pager .button {
  min-width: 0; min-height: 25px; padding: 2px;
}
[data-game-composition="mobile"] .beach-layout .beach-inventory-panel .inventory-list {
  grid-template-columns: minmax(0,1fr); gap: 3px; margin: 3px 0;
}

/* The desktop-only compact Beach tile renderer injects a later #id grid.
   Match the ID on mobile so its lone selected fully labeled item row has
   a finite single-column layout regardless of stylesheet insertion order. */
[data-game-composition="mobile"] #beach-inventory-list {
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: auto;
  align-content: start;
  min-width: 0;
}
[data-game-composition="mobile"] #beach-inventory-list .inventory-row {
  min-width: 0; max-width: 100%; padding: 4px;
}

/* Every late-game stage keeps its existing upgrade family and independent
   Buy 1/5/10/Max selector. Mobile shows one entire genuine upgrade card
   and explicit page controls, not a clipped or vertically scrolling catalog. */
.late-mobile-upgrade-page { display: none; }
[data-game-composition="mobile"] .late-game-area [data-late-upgrade-pager]:not([hidden]) {
  display: grid; grid-template-columns: 30px minmax(0, 1fr) 30px;
  align-items: center; gap: 4px; margin: 3px 0;
}
[data-game-composition="mobile"] .late-game-area [data-late-upgrade-label] {
  min-width: 0; text-align: center; font-size: .67rem; overflow-wrap: anywhere;
}
[data-game-composition="mobile"] .late-game-area [data-late-upgrade-pager] .button {
  min-width: 0; min-height: 25px; padding: 2px;
}
[data-game-composition="mobile"] .late-game-area [data-late-upgrade-list] {
  display: grid; grid-template-columns: minmax(0, 1fr); gap: 3px;
  margin: 2px 0; min-width: 0;
}
[data-game-composition="mobile"] .late-game-area [data-late-upgrade-list] > [hidden] {
  display: none !important;
}

/* The fixed mobile stage header retains all four actual live indicators,
   partitioned into two direct compact summaries. Progress remains visible on
   the initial screen; production and its real automation toggle are one tap away. */
.late-mobile-summary-views { display: none; }
[data-game-composition="mobile"] .late-game-area .late-mobile-summary-views {
  display: grid; grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 3px; margin: 1px 0 3px;
}
[data-game-composition="mobile"] .late-game-area .late-mobile-summary-views .button {
  min-width: 0; min-height: 25px; padding: 2px 4px;
  font-size: .63rem; white-space: normal;
}
[data-game-composition="mobile"] .late-game-area .late-mobile-summary-views .active {
  border-color: #f3d089; color: #fff1ce; background: #4a3921;
}
[data-game-composition="mobile"] .late-game-area > .late-resource-grid {
  grid-template-columns: repeat(2, minmax(0,1fr));
  margin: 2px 0 4px; gap: 4px; min-width: 0;
}
[data-game-composition="mobile"] .late-game-area > .late-resource-grid > div {
  min-width: 0; padding: 5px 7px;
}
[data-game-composition="mobile"] .late-game-area > .late-resource-grid > [hidden] {
  display: none !important;
}

/* Beach Search and earned Fancy Accessory status are complete distinct mobile
   destinations. All existing real accessory finds and Beach actions remain
   untouched, without stacking both responsibilities into one tall viewport. */
[data-game-composition="mobile"] #beach-panel .beach-pane-tabs {
  grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2px;
}
[data-game-composition="mobile"] #beach-panel .beach-pane-tabs > .button {
  min-height: 24px; padding: 2px 3px; font-size: .6rem;
}
[data-game-composition="mobile"] #beach-panel[data-beach-active-pane="search"] .accessory-progress-card {
  display: none !important;
}
[data-game-composition="mobile"] #beach-panel[data-beach-active-pane="accessories"] .beach-action > :not(.accessory-progress-card) {
  display: none !important;
}
[data-game-composition="mobile"] #beach-panel[data-beach-active-pane="accessories"] .accessory-progress-card {
  margin: 0; padding: 6px; min-width: 0;
}
[data-game-composition="mobile"] #beach-panel[data-beach-active-pane="accessories"] .accessory-list {
  gap: 4px; margin-top: 4px;
}

/* The expanded mobile Strategic Project board presents one complete
   project-information purpose at a time. Costs, permanent effects,
   earned Planner shortfalls and real actions are each accessible explicitly. */
.strategic-mobile-views { display: none; }
[data-game-composition="mobile"] .legacy-project-board[data-collapsed="false"] {
  grid-template-rows: auto auto minmax(0, 1fr);
}
[data-game-composition="mobile"] .strategic-mobile-views:not([hidden]) {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 3px; min-width: 0;
}
[data-game-composition="mobile"] .strategic-mobile-views .button {
  min-width: 0; min-height: 23px; padding: 2px 3px; font-size: .63rem;
}
[data-game-composition="mobile"] .strategic-mobile-views .active {
  border-color: #9cc4ed; color: #e2f0ff; background: #263f61;
}
[data-game-composition="mobile"] .legacy-project-board .strategic-part {
  display: none !important; min-width: 0;
}
[data-game-composition="mobile"] .legacy-project-board[data-strategic-part="costs"] [data-strategic-part="costs"],
[data-game-composition="mobile"] .legacy-project-board[data-strategic-part="benefits"] [data-strategic-part="benefits"],
[data-game-composition="mobile"] .legacy-project-board[data-strategic-part="plan"] [data-strategic-part="plan"],
[data-game-composition="mobile"] .legacy-project-board[data-strategic-part="actions"] [data-strategic-part="actions"] {
  display: block !important;
}
[data-game-composition="mobile"] .legacy-project-board .strategic-part p {
  margin: 2px 0; overflow-wrap: anywhere;
}

/* Mobile late-game stage headers must spend the fixed frame on real player
   actions and project details, not the shared unfinished-art placeholder.
   Keep the original full stage description and its art asset available. */
[data-game-composition="mobile"] .late-game-area > .late-game-hero {
  box-sizing: border-box; min-height: 0; max-width: 100%;
  margin: 0 0 3px; padding: 5px 7px; align-items: start;
}
[data-game-composition="mobile"] .late-game-area > .late-game-hero h2 {
  font-size: .9rem; line-height: 1.12; margin: 1px 0;
  overflow-wrap: anywhere;
}
[data-game-composition="mobile"] .late-game-area > .late-game-hero p:last-child {
  margin: 2px 0 0; font-size: .65rem; line-height: 1.17;
  overflow-wrap: anywhere;
}
[data-game-composition="mobile"] .late-game-area > .late-artwork-hook {
  box-sizing: border-box; display: flex; justify-content: center;
  align-items: center; min-height: 0; height: 39px; padding: 2px;
  margin: 0 0 3px; border-radius: 6px; overflow: visible;
}
[data-game-composition="mobile"] .late-game-area > .late-artwork-hook .art-slot {
  box-sizing: border-box; width: auto; max-width: 33px;
  height: auto; max-height: 33px; object-fit: contain;
}
[data-game-composition="mobile"][data-game-orientation="landscape"]
.late-game-area > .late-artwork-hook {
  height: 28px; margin-bottom: 2px; padding: 1px;
}
[data-game-composition="mobile"][data-game-orientation="landscape"]
.late-game-area > .late-artwork-hook .art-slot {
  max-width: 23px; max-height: 23px;
}

/* The shared late-game action still shows its real controls and status.
   When two or three actual work meters coexist, mobile displays one complete
   selected meter with a direct tab for every other active timer. No work pauses. */
.late-mobile-work-views { display: none; }
[data-game-composition="mobile"] .late-game-area > .late-action-card {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  padding: 5px 6px; gap: 4px; min-width: 0;
}
[data-game-composition="mobile"] .late-game-area > .late-action-card > .button {
  min-width: 0; min-height: 27px; padding: 3px 5px;
  font-size: .65rem; white-space: normal; overflow-wrap: anywhere;
}
[data-game-composition="mobile"] .late-game-area > .late-action-card > .action-status {
  margin: 1px 0; font-size: .64rem; line-height: 1.19;
  overflow-wrap: anywhere;
}
[data-game-composition="mobile"] .late-mobile-work-views:not([hidden]) {
  display: grid; grid-template-columns: repeat(3, minmax(0,1fr));
  grid-column: 1 / -1; gap: 3px;
}
[data-game-composition="mobile"] .late-mobile-work-views .button {
  min-width: 0; min-height: 24px; padding: 2px 3px; font-size: .58rem;
}
[data-game-composition="mobile"] .late-mobile-work-views .active {
  color: #fff0c6; border-color: #dac28c; background: #534226;
}
[data-game-composition="mobile"] .late-game-area > .late-action-card
> [data-late-action-work],
[data-game-composition="mobile"] .late-game-area > .late-action-card
> [data-late-production-work],
[data-game-composition="mobile"] .late-game-area > .late-action-card
> [data-late-automation-work] {
  grid-column: 1 / -1; min-width: 0;
}
[data-game-composition="mobile"] .late-game-area > .late-action-card
> [data-mobile-work-concealed="true"] { display: none !important; }

/* All five real post-ignition Coin metrics remain readable. The mobile Core
   displays two complete live values per selected finite page instead of a
   growing combined grid; the stable pager retains focus during live updates. */
.late-coin-stat-pager { display: none; }
[data-game-composition="mobile"] .late-game-area > .late-coin-panel {
  padding: 6px; margin: 3px 0; min-width: 0;
}
[data-game-composition="mobile"] .late-game-area > .late-coin-panel > h3 {
  margin: 1px 0 3px; font-size: .8rem;
}
[data-game-composition="mobile"] .late-coin-stat-pager:not([hidden]) {
  display: grid; grid-template-columns: 30px minmax(0,1fr) 30px;
  gap: 3px; align-items: center; margin: 2px 0;
}
[data-game-composition="mobile"] .late-coin-stat-pager strong {
  font-size: .68rem; overflow-wrap: anywhere;
}
[data-game-composition="mobile"] .late-coin-stat-pager .button {
  min-width: 0; min-height: 25px; padding: 2px;
}
[data-game-composition="mobile"] .late-coin-panel > .late-resource-grid {
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 3px; margin: 2px 0;
}
[data-game-composition="mobile"] .late-coin-panel > .late-resource-grid > div {
  min-width: 0; padding: 5px; font-size: .68rem;
}
[data-game-composition="mobile"] .late-coin-panel > .late-resource-grid > [hidden] {
  display: none !important;
}

/* Multiple consequential Strategic Project effects are all reachable on
   mobile, one original effect per explicit page. Desktop keeps the exact
   existing combined effect description without extra navigation. */
.strategic-benefit-pager, .strategic-benefit-single { display: none; }
[data-game-composition="mobile"] .strategic-benefit-full { display: none; }
[data-game-composition="mobile"] .strategic-benefit-single { display: block; min-width: 0; }
[data-game-composition="mobile"] .strategic-benefit-single > [hidden] { display: none !important; }
[data-game-composition="mobile"] .strategic-benefit-pager:not([hidden]) {
  display: grid; grid-template-columns: 27px minmax(0,1fr) 27px;
  align-items: center; gap: 3px; min-width: 0;
}
[data-game-composition="mobile"] .strategic-benefit-pager strong {
  min-width: 0; font-size: .64rem; text-align: center;
}
[data-game-composition="mobile"] .strategic-benefit-pager .button {
  min-width: 0; min-height: 24px; padding: 2px;
}

/* The optional independent benefit pager adds a genuine fourth grid row:
   reserve the bounded flexible final row for the selected complete card. */
[data-game-composition="mobile"] .legacy-project-board[data-collapsed="false"][data-benefit-paged="true"] {
  grid-template-rows: auto auto auto minmax(0, 1fr);
}

/* Desktop progression stays discoverable at every stage without squeezing
   eleven era tabs or scrolling them off the fixed game canvas. */
[data-game-composition="desktop"] .main-navigation,
[data-game-composition="desktop"] .sub-navigation {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr)) repeat(2, minmax(0, .58fr));
  align-items: stretch;
  gap: 5px;
  min-width: 0;
  overflow: visible;
}
[data-game-composition="desktop"] .sub-navigation {
  grid-template-columns: repeat(4, minmax(0, 1fr)) repeat(2, minmax(0, .58fr));
}
[data-game-composition="desktop"] .main-navigation > .game-tab,
[data-game-composition="desktop"] .sub-navigation > .game-tab {
  min-width: 0; min-height: 30px; padding: 3px 6px;
  font-size: .77rem; white-space: normal; overflow-wrap: anywhere;
}
[data-game-composition="desktop"] .nav-page-control {
  min-width: 0; font-size: .67rem; border: 1px solid #74899b;
  background: #25384a; color: #e2ecf4;
}
[data-game-composition="desktop"] .nav-page-control:disabled { opacity: .5; }

/* Desktop HUD is one genuinely bounded resource page at every late-game scale.
   Cash and HUD settings remain fixed; the existing two-button pager exposes
   every additional enabled currency without hidden overflow or a scrollbar. */
[data-game-composition="desktop"] .resource-hud {
  grid-template-columns: minmax(150px, 1fr) repeat(5, minmax(0, 1fr)) repeat(2, minmax(0, .9fr)) minmax(80px, .6fr);
  grid-auto-rows: minmax(0, 1fr);
  align-items: stretch;
  overflow: visible;
}
[data-game-composition="desktop"] .resource-hud .hud-page-control {
  min-width: 0; min-height: 0; padding: 2px 4px;
  font-size: .68rem; line-height: 1.12; white-space: normal;
  border: 1px solid #6486a4; background: #213a4e;
}
[data-game-composition="desktop"] .resource-hud .hud-page-control:disabled { opacity: .48; }

/* Desktop statistics use the same complete finite live category/entry pager as
   mobile: no lifetime-catalog scrollbar or hidden historical measurements. */
[data-game-composition="desktop"] .statistics-mobile-group-page:not([hidden]),
[data-game-composition="desktop"] .statistics-mobile-entry-page:not([hidden]) {
  display:grid; grid-template-columns: 92px minmax(0,1fr) 92px;
  align-items:center; gap:10px; margin:6px 0; text-align:center;
}
[data-game-composition="desktop"] .statistics-mobile-group-page .button,
[data-game-composition="desktop"] .statistics-mobile-entry-page .button {
  min-height:32px; padding:4px 8px; font-size:.76rem;
}
[data-game-composition="desktop"] .statistics-mobile-group-page strong,
[data-game-composition="desktop"] .statistics-mobile-entry-page strong {
  min-width:0; overflow-wrap:anywhere; font-size:.87rem;
}
[data-game-composition="desktop"] .statistics-content .statistics-group {
  margin:5px 0;
}
[data-game-composition="desktop"] .statistics-content .stat-grid {
  display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px;
}
[data-game-composition="desktop"] .statistics-content .stat-grid > div { min-width:0; }

/* Desktop Game Settings also uses five separately complete finite views and
   one actual persisted HUD visibility checkbox per page. */
[data-game-composition="desktop"] .game-settings-mobile-tabs {
  display:grid; grid-template-columns: repeat(5, minmax(0,1fr));
  gap:7px; margin:4px 0 12px;
}
[data-game-composition="desktop"] .game-settings-mobile-tabs .button {
  min-width:0; min-height:32px; padding:5px 8px; font-size:.8rem;
}
[data-game-composition="desktop"] .game-settings-mobile-tabs .active {
  background:#384d63; border-color:#b2dbf2; color:#f3fbff;
}
[data-game-composition="desktop"] .resource-settings-mobile-page:not([hidden]) {
  display:grid; grid-template-columns: 70px minmax(0,1fr) 70px;
  align-items:center; text-align:center; gap:9px; margin:7px 0;
}
[data-game-composition="desktop"] .resource-settings-mobile-page .button {
  min-height:32px; padding:4px 8px; font-size:.77rem;
}
[data-game-composition="desktop"] .resource-settings-mobile-page strong {
  min-width:0; overflow-wrap:anywhere;
}
[data-game-composition="desktop"] .game-settings-part[hidden] { display:none!important; }
[data-game-composition="desktop"] .game-settings-part { min-width:0; }
[data-game-composition="desktop"] .game-settings-part .settings-checklist {
  display:grid; grid-template-columns:minmax(0,1fr); gap:5px;
}

/* Desktop Diagnostics shows complete source-backed system fields, individual
   bounded log entries, and retained real Export/Clear actions as finite screens. */
[data-game-composition="desktop"] .diagnostics-mobile-views {
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px; margin:5px 0 10px;
}
[data-game-composition="desktop"] .diagnostics-mobile-views > .button {
  min-width:0; min-height:33px; padding:5px 9px; font-size:.82rem;
}
[data-game-composition="desktop"] .diagnostics-mobile-views > .active {
  background:#384d63; border-color:#9dcbe6; color:#f0faff;
}
[data-game-composition="desktop"] [data-diagnostics-part][hidden],
[data-game-composition="desktop"] #diagnostics-metadata > [hidden] { display:none!important; }
[data-game-composition="desktop"] .diagnostics-mobile-page:not([hidden]) {
  display:grid; grid-template-columns:75px minmax(0,1fr) 75px;
  gap:9px; align-items:center; text-align:center; margin:5px 0;
}
[data-game-composition="desktop"] .diagnostics-mobile-page .button {
  min-height:32px; padding:4px 8px; font-size:.78rem;
}
[data-game-composition="desktop"] .diagnostics-mobile-page strong {
  min-width:0; overflow-wrap:anywhere;
}
[data-game-composition="desktop"] #diagnostics-metadata { grid-template-columns:repeat(2,minmax(0,1fr)); }
[data-game-composition="desktop"] #diagnostics-log {
  min-width:0; max-height:none; overflow:visible; overflow-wrap:anywhere;
  white-space:pre-wrap; font-size:.78rem; line-height:1.35;
}

/* Desktop local-only Developer controls share the finite already implemented
   group/action/inspector pagination rather than a hidden scrolling catalog. */
[data-game-composition="desktop"] .developer-settings {
  display:grid; grid-template-columns:minmax(0,1fr); gap:8px;
}
[data-game-composition="desktop"] .developer-mobile-page:not([hidden]) {
  display:grid; grid-template-columns:92px minmax(0,1fr) 92px;
  gap:9px; align-items:center; text-align:center; margin:6px 0;
}
[data-game-composition="desktop"] .developer-mobile-page strong {
  min-width:0; overflow-wrap:anywhere; font-size:.83rem;
}
[data-game-composition="desktop"] .developer-mobile-page button {
  min-width:0; min-height:32px; padding:4px 8px; font-size:.78rem;
}
[data-game-composition="desktop"] #developer-controls > [hidden],
[data-game-composition="desktop"] #developer-controls .developer-button-row > [hidden],
[data-game-composition="desktop"] #developer-inspector-section[hidden],
[data-game-composition="desktop"] #developer-state .inspector-grid > [hidden] { display:none!important; }
[data-game-composition="desktop"] #developer-controls .developer-group {
  min-width:0; padding:10px;
}
[data-game-composition="desktop"] #developer-controls .developer-group .developer-button-row {
  display:grid; grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px; margin:6px 0;
}
[data-game-composition="desktop"] #developer-state,
[data-game-composition="desktop"] #developer-state .inspector-grid {
  min-width:0; max-height:none; overflow:visible;
  display:grid; grid-template-columns:minmax(0,1fr);
}
[data-game-composition="desktop"] #developer-state .inspector-grid > div {
  min-width:0; overflow-wrap:anywhere;
}

/* Desktop Settings no longer needs the generic scrolling viewport after its
   real Game, Stats, Diagnostics and Developer contents were independently
   split into complete, reachable finite pages. Never hide surplus content
   behind overflow clipping as a substitute for full in-game composition. */
[data-game-composition="desktop"] .settings-dialog {
  box-sizing:border-box; display:grid;
  grid-template-rows:auto auto auto; align-content:start;
  width:min(1180px,100%); min-width:0; max-height:100%;
  overflow:visible; padding:0;
}
[data-game-composition="desktop"] .settings-content {
  box-sizing:border-box; min-width:0; min-height:0;
  overflow:visible; overscroll-behavior:auto; padding:12px 17px 17px;
}
[data-game-composition="desktop"] .settings-tabs {
  min-width:0; overflow:visible; flex-wrap:nowrap;
}
[data-game-composition="desktop"] .settings-tab {
  flex:1 1 0; min-width:0; min-height:37px; padding:7px;
}
[data-game-composition="desktop"] .settings-section { min-width:0; }

/* Desktop wardrobe: preserve every original item and Configuration Memory
   action, but never stack a late-game full shop catalog behind the frame. */
[data-game-composition="desktop"] .clothing-mobile-tabs {
  display:grid; grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px; margin:7px 0;
}
[data-game-composition="desktop"] .clothing-mobile-tabs .button {
  min-width:0; min-height:31px; padding:4px 8px; font-size:.8rem;
}
[data-game-composition="desktop"] .clothing-mobile-tabs .active {
  background:#405947; border-color:#99ceab; color:#f3fff5;
}
[data-game-composition="desktop"] .clothing-mobile-slot-page:not([hidden]),
[data-game-composition="desktop"] .clothing-mobile-item-page:not([hidden]) {
  display:grid; grid-template-columns:64px minmax(0,1fr) 64px;
  gap:8px; align-items:center; text-align:center; margin:5px 0;
}
[data-game-composition="desktop"] .clothing-mobile-slot-page strong,
[data-game-composition="desktop"] .clothing-mobile-item-page strong {
  min-width:0; overflow-wrap:anywhere; font-size:.84rem;
}
[data-game-composition="desktop"] .clothing-mobile-slot-page .button,
[data-game-composition="desktop"] .clothing-mobile-item-page .button {
  min-height:30px; padding:4px 7px; font-size:.78rem;
}
[data-game-composition="desktop"] .clothing-shop-filters {
  display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:6px;
}
[data-game-composition="desktop"] .clothing-shop-filters > [hidden] { display:none!important; }
[data-game-composition="desktop"] .clothing-shop-list {
  display:grid; grid-template-columns:minmax(0,1fr); gap:5px;
}
[data-game-composition="desktop"] .clothing-shop .wardrobe-loadouts[hidden] { display:none!important; }

/* Desktop Interview Prep uses the same complete functional screens and
   existing real per-item pages as mobile. Never render a growing combined
   clothing-buff and seven-purchase catalog within the bounded play area. */
[data-game-composition="desktop"] .employment-panel .interview-pane-tabs {
  display:grid; grid-template-columns:repeat(5,minmax(0,1fr));
  gap:8px; margin:7px 0;
}
[data-game-composition="desktop"] .employment-panel .interview-pane-tabs > .button {
  min-width:0; min-height:33px; padding:5px 8px; font-size:.79rem;
}
[data-game-composition="desktop"] .employment-panel .interview-pane-tabs > .active {
  background:#394c61; border-color:#97c7e3; color:#f2faff;
}
[data-game-composition="desktop"] .employment-panel .job-layout {
  display:grid; grid-template-columns:minmax(0,1fr);
  align-content:start; gap:7px; height:auto; margin-top:7px;
}
[data-game-composition="desktop"] .employment-panel .job-layout > :not([hidden]) {
  min-width:0; grid-column:1;
}
[data-game-composition="desktop"] .employment-panel #employment-entry {
  display:grid; grid-template-columns:minmax(0,1fr); gap:5px;
  margin:0; min-width:0;
}
[data-game-composition="desktop"] .employment-panel #employment-entry > [hidden] { display:none!important; }
[data-game-composition="desktop"] .employment-panel .interview-mobile-list-page:not([hidden]) {
  display:grid; grid-template-columns:65px minmax(0,1fr) 65px;
  gap:8px; align-items:center; text-align:center; margin:5px 0;
}
[data-game-composition="desktop"] .employment-panel .interview-mobile-list-page strong {
  min-width:0; font-size:.79rem; overflow-wrap:anywhere;
}
[data-game-composition="desktop"] .employment-panel .interview-mobile-list-page .button {
  min-height:30px; padding:4px 7px; font-size:.74rem;
}
[data-game-composition="desktop"] .employment-panel #paper-doll-slots > [hidden],
[data-game-composition="desktop"] .employment-panel #equipment-buff-summary > [hidden],
[data-game-composition="desktop"] .employment-panel #outfit-list > [hidden] { display:none!important; }
[data-game-composition="desktop"] .employment-panel #paper-doll-slots {
  display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px;
}
[data-game-composition="desktop"] .employment-panel #equipment-buff-summary {
  display:grid; grid-template-columns:minmax(0,1fr); gap:6px;
}
[data-game-composition="desktop"] .employment-panel #outfit-list {
  display:grid; grid-template-columns:minmax(0,1fr); gap:6px;
}

/* Desktop early upgrades use exactly the same real full-card pager as touch:
   no growing upgrade catalog is silently clipped by any fixed side panel. */
[data-game-composition="desktop"] .early-mobile-upgrade-page:not([hidden]) {
  display:grid; grid-template-columns:70px minmax(0,1fr) 70px;
  gap:7px; align-items:center; text-align:center; margin:6px 0;
}
[data-game-composition="desktop"] .early-mobile-upgrade-page > strong {
  min-width:0; font-size:.8rem; overflow-wrap:anywhere;
}
[data-game-composition="desktop"] .early-mobile-upgrade-page > .button {
  min-width:0; min-height:30px; padding:4px 7px; font-size:.73rem;
}
[data-game-composition="desktop"] .upgrades-panel #upgrade-list,
[data-game-composition="desktop"] .automation-panel #crew-upgrade-list,
[data-game-composition="desktop"] .beach-upgrades #beach-upgrade-list,
[data-game-composition="desktop"] .recycling-pane #recycling-upgrade-list {
  display:grid; grid-template-columns:minmax(0,1fr); gap:5px;
}
[data-game-composition="desktop"] #upgrade-list > [hidden],
[data-game-composition="desktop"] #crew-upgrade-list > [hidden],
[data-game-composition="desktop"] #beach-upgrade-list > [hidden],
[data-game-composition="desktop"] #recycling-upgrade-list > [hidden] { display:none!important; }

/* Desktop Dumpster's original five real activities are explicitly accessible
   as independent complete panes instead of a growing fixed multi-column grid. */
[data-game-composition="desktop"] .dumpster-pane-tabs {
  display:grid; grid-template-columns:repeat(5,minmax(0,1fr));
  gap:7px; margin:6px 0;
}
[data-game-composition="desktop"] .dumpster-pane-tabs > .button {
  min-width:0; min-height:32px; padding:5px 8px; font-size:.78rem;
}
[data-game-composition="desktop"] .dumpster-pane-tabs > .active {
  border-color:#f2c56a; background:#4d391e; color:#ffedc6;
}
[data-game-composition="desktop"] .dumpster-grid {
  display:grid; grid-template-columns:minmax(0,1fr);
  grid-template-rows:minmax(0,1fr); align-content:start;
  align-items:start; min-height:0; height:auto; gap:0;
}
[data-game-composition="desktop"] .dumpster-grid > .panel:not([hidden]) {
  grid-column:1; grid-row:1; min-width:0; min-height:0;
  display:grid; align-content:start; gap:6px; padding:8px;
}
[data-game-composition="desktop"] .dumpster-grid > .panel[hidden] { display:none!important; }
[data-game-composition="desktop"] .dumpster-grid > .inventory-panel {
  grid-template-rows:auto minmax(0,1fr); overflow:visible;
}
[data-game-composition="desktop"] .dumpster-grid > .inventory-panel .inventory-list {
  display:grid; grid-template-columns:repeat(4,minmax(0,1fr));
  gap:6px; min-width:0; min-height:0; margin:5px 0;
}
[data-game-composition="desktop"] .dumpster-grid > .inventory-panel .inventory-tile {
  min-width:0; min-height:0; height:105px;
}
[data-game-composition="desktop"] .automation-panel .crew-mobile-views {
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr));
  gap:7px; margin:5px 0;
}
[data-game-composition="desktop"] .automation-panel .crew-mobile-views .button {
  min-width:0; min-height:31px; padding:4px 8px; font-size:.78rem;
}
[data-game-composition="desktop"] .automation-panel .crew-mobile-views .active {
  background:#354e44; border-color:#93cbb3; color:#e8fff3;
}
[data-game-composition="desktop"] .automation-panel .automation-grid {
  display:grid; grid-template-columns:minmax(0,1fr); gap:6px;
}
[data-game-composition="desktop"] .automation-panel .automation-grid > [hidden],
[data-game-composition="desktop"] .automation-panel #crew-upgrade-section[hidden],
[data-game-composition="desktop"] .automation-panel .progression-purchases > .purchase-card[hidden] { display:none!important; }
[data-game-composition="desktop"] .automation-panel .progression-purchases {
  display:grid; grid-template-columns:minmax(0,1fr); gap:6px;
}
[data-game-composition="desktop"] .automation-panel .crew-mobile-purchase-page:not([hidden]) {
  display:grid; grid-template-columns:80px minmax(0,1fr) 80px;
  gap:8px; align-items:center; text-align:center;
}
[data-game-composition="desktop"] .automation-panel .crew-mobile-purchase-page strong {
  min-width:0; overflow-wrap:anywhere; font-size:.8rem;
}
[data-game-composition="desktop"] .automation-panel .crew-mobile-purchase-page .button {
  min-height:31px; padding:4px 7px;
}

/* Desktop Beach now offers all four original complete selectable activities;
   no full inventory, upgrades and search are stacked in the fixed frame. */
[data-game-composition="desktop"] #beach-panel .beach-pane-tabs {
  display:grid; grid-template-columns:repeat(4,minmax(0,1fr));
  gap:7px; margin:6px 0;
}
[data-game-composition="desktop"] #beach-panel .beach-pane-tabs > .button {
  min-width:0; min-height:32px; padding:4px 8px; font-size:.79rem;
}
[data-game-composition="desktop"] #beach-panel .beach-pane-tabs > .active {
  border-color:#8ddbd0; background:#1d4f4e; color:#e1fffa;
}
[data-game-composition="desktop"] #beach-panel .beach-layout {
  display:grid; grid-template-columns:minmax(0,1fr);
  grid-template-rows:minmax(0,1fr); align-items:start;
  min-width:0; min-height:0; height:auto; gap:0;
}
[data-game-composition="desktop"] #beach-panel .beach-layout > :not([hidden]) {
  grid-column:1; grid-row:1; min-width:0; min-height:0;
}
[data-game-composition="desktop"] #beach-panel .beach-art {
  height:110px; margin:3px auto 5px;
}
[data-game-composition="desktop"] #beach-panel[data-beach-active-pane="search"] .accessory-progress-card {
  display:none!important;
}
[data-game-composition="desktop"] #beach-panel[data-beach-active-pane="accessories"] .beach-action > :not(.accessory-progress-card) {
  display:none!important;
}
[data-game-composition="desktop"] #beach-panel[data-beach-active-pane="accessories"] .accessory-progress-card {
  padding:10px; margin:0;
}
[data-game-composition="desktop"] #beach-panel .beach-upgrades,
[data-game-composition="desktop"] #beach-panel .beach-inventory-panel {
  display:grid; grid-template-columns:minmax(0,1fr);
  align-content:start; gap:7px; padding:9px;
}
[data-game-composition="desktop"] #beach-panel .beach-layout > [hidden] { display:none!important; }
[data-game-composition="desktop"] #beach-inventory-pager:not([hidden]) {
  display:grid; grid-template-columns:74px minmax(0,1fr) 74px;
  gap:8px; align-items:center; margin:5px 0; text-align:center;
}
[data-game-composition="desktop"] #beach-inventory-pager strong {
  min-width:0; overflow-wrap:anywhere; font-size:.8rem;
}
[data-game-composition="desktop"] #beach-inventory-pager .button {
  min-height:31px; padding:4px 7px;
}
[data-game-composition="desktop"] #beach-inventory-list {
  display:grid; grid-template-columns:minmax(0,1fr);
  grid-template-rows:auto; align-content:start; gap:6px;
}

/* Desktop Recycling now selects one complete existing activity at a time,
   with separate Routing and Live Production views instead of stacked panels. */
[data-game-composition="desktop"] #recycling-center-panel .recycling-pane-tabs {
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:7px; margin:8px 0;
}
[data-game-composition="desktop"] #recycling-center-panel .recycling-pane-tabs .button {
  min-width:0; min-height:32px; padding:4px 8px; font-size:.8rem;
}
[data-game-composition="desktop"] #recycling-center-panel .recycling-pane-tabs .active {
  border-color:#9fdab5; background:#254e3d; color:#e5ffed;
}
[data-game-composition="desktop"] #recycling-center-panel .recycling-pane[hidden],
[data-game-composition="desktop"] #recycling-center-panel [data-recycling-operation-part][hidden] {
  display:none!important;
}
[data-game-composition="desktop"] #recycling-center-panel .recycling-pane:not([hidden]) {
  display:grid; grid-template-columns:minmax(0,1fr);
  min-width:0; min-height:0; gap:8px; align-content:start;
}
[data-game-composition="desktop"] #recycling-center-panel .recycling-mobile-operation-tabs {
  display:grid; grid-template-columns:repeat(2,minmax(0,1fr));
  gap:7px; margin:3px 0;
}
[data-game-composition="desktop"] #recycling-center-panel .recycling-mobile-operation-tabs .button {
  min-width:0; min-height:30px; padding:4px 8px; font-size:.78rem;
}
[data-game-composition="desktop"] #recycling-center-panel .recycling-mobile-operation-tabs .active {
  border-color:#92c6bb; background:#21493e; color:#e4fff6;
}
[data-game-composition="desktop"] #recycling-center-panel [data-recycling-operation-part="routing"]:not([hidden]) {
  display:grid; grid-template-columns:minmax(0,1fr); gap:7px;
}
[data-game-composition="desktop"] #recycling-center-panel [data-recycling-operation-part="production"]:not([hidden]) {
  min-width:0; margin:0;
}
[data-game-composition="desktop"] #recycling-center-panel #recycling-upgrade-list {
  display:grid; grid-template-columns:minmax(0,1fr); gap:6px;
}
[data-game-composition="desktop"] #recycling-center-panel .recycling-pane[data-recycling-section="lines"] {
  align-content:start;
}

/* Desktop Factory Ownership uses its four existing complete responsibility
   views and one real reinvestment card at a time, without scroll-clipping. */
[data-game-composition="desktop"] .business-area .business-owner-console {
  display:grid; grid-template-columns:minmax(0,1fr); gap:9px;
  min-width:0; min-height:0; align-content:start;
}
[data-game-composition="desktop"] .business-area .business-mobile-views {
  display:grid; grid-template-columns:repeat(4,minmax(0,1fr));
  gap:8px; margin:3px 0;
}
[data-game-composition="desktop"] .business-area .business-mobile-views .button {
  min-width:0; min-height:33px; padding:4px 8px; font-size:.8rem;
}
[data-game-composition="desktop"] .business-area .business-mobile-views .active {
  color:#e1f3e7; border-color:#63b886; background:#244b37;
}
[data-game-composition="desktop"] .business-area [data-business-owner-pane][hidden],
[data-game-composition="desktop"] .business-area #business-upgrade-list > [hidden] {
  display:none!important;
}
[data-game-composition="desktop"] .business-area [data-business-owner-pane]:not([hidden]) {
  margin:0; min-width:0;
}
[data-game-composition="desktop"] .business-area .business-financials {
  grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px;
}
[data-game-composition="desktop"] .business-area .business-action-card,
[data-game-composition="desktop"] .business-area .business-upgrades {
  display:grid; grid-template-columns:minmax(0,1fr);
  align-content:start; gap:8px;
}
[data-game-composition="desktop"] .business-area .business-upgrades > p { margin:0; }
[data-game-composition="desktop"] .business-area #business-upgrade-list {
  display:grid; grid-template-columns:minmax(0,1fr); gap:7px;
}
[data-game-composition="desktop"] .business-area .business-mobile-upgrade-page:not([hidden]) {
  display:grid; grid-template-columns:70px minmax(0,1fr) 70px;
  align-items:center; gap:8px; text-align:center;
}
[data-game-composition="desktop"] .business-area .business-mobile-upgrade-page strong {
  min-width:0; font-size:.81rem; overflow-wrap:anywhere;
}
[data-game-composition="desktop"] .business-area .business-mobile-upgrade-page .button {
  min-height:32px; padding:4px 7px;
}

/* Desktop factory career: each unlocked true responsibility is an independent
   full panel, including separate real promotion and correctly paged resources,
   automatic production and upgrade cards. No auto-work is suspended on switch. */
[data-game-composition="desktop"] .career-area .factory-work {
  display:grid; grid-template-columns:minmax(0,1fr); grid-auto-rows:min-content;
  align-content:start; gap:7px; margin-top:5px; min-width:0; min-height:0;
}
[data-game-composition="desktop"] .career-area .factory-pane-tabs {
  grid-column:1; grid-row:auto; grid-template-columns:repeat(3,minmax(0,1fr));
  gap:5px; margin:0; min-width:0;
}
[data-game-composition="desktop"] .career-area .factory-pane-tabs .game-tab {
  min-width:0; min-height:30px; padding:3px 7px;
  font-size:.74rem; white-space:normal; overflow-wrap:anywhere;
}
[data-game-composition="desktop"] .career-area .factory-work > [data-factory-pane]:not([hidden]) {
  grid-column:1; grid-row:auto; min-width:0; min-height:0;
  display:grid; align-content:start; gap:7px; margin:0; padding:8px;
}
[data-game-composition="desktop"] .career-area .factory-work [data-factory-pane][hidden],
[data-game-composition="desktop"] .career-area .production-resources > [hidden],
[data-game-composition="desktop"] .career-area #factory-automation-status > [hidden],
[data-game-composition="desktop"] .career-area #employee-upgrade-list > [hidden] {
  display:none!important;
}
[data-game-composition="desktop"] .career-area .factory-career-overview {
  grid-template-columns:minmax(0,1fr);
}
[data-game-composition="desktop"] .career-area .factory-career-overview .employment-stats {
  grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px;
}
[data-game-composition="desktop"] .career-area .factory-career-overview .production-resources {
  grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px;
}
[data-game-composition="desktop"] .career-area .factory-packaging .package-grid {
  display:grid; grid-template-columns:minmax(0,1fr); gap:5px;
}
[data-game-composition="desktop"] .career-area .factory-automation .automation-status-list,
[data-game-composition="desktop"] .career-area #employee-upgrade-list {
  display:grid; grid-template-columns:minmax(0,1fr); gap:5px;
}
[data-game-composition="desktop"] .career-area .factory-work[data-factory-active-pane="promotion"] .employee-development > :not(.promotion-card) {
  display:none!important;
}
[data-game-composition="desktop"] .career-area .factory-mobile-resource-page:not([hidden]),
[data-game-composition="desktop"] .career-area .factory-mobile-automation-page:not([hidden]),
[data-game-composition="desktop"] .career-area .factory-mobile-upgrade-page:not([hidden]) {
  display:grid; grid-template-columns:70px minmax(0,1fr) 70px;
  align-items:center; gap:7px; margin:3px 0; text-align:center;
}
[data-game-composition="desktop"] .career-area .factory-mobile-resource-page strong,
[data-game-composition="desktop"] .career-area .factory-mobile-automation-page strong,
[data-game-composition="desktop"] .career-area .factory-mobile-upgrade-page strong {
  min-width:0; overflow-wrap:anywhere; font-size:.8rem;
}
[data-game-composition="desktop"] .career-area .factory-mobile-resource-page .button,
[data-game-composition="desktop"] .career-area .factory-mobile-automation-page .button,
[data-game-composition="desktop"] .career-area .factory-mobile-upgrade-page .button {
  min-height:31px; padding:3px 7px;
}

/* Desktop strategic investments now use the same finite deliberate project
   dashboard as mobile: collapsed while playing; open exposes one original
   project and separately complete Cost, Benefit, Planner and Action pages. */
[data-game-composition="desktop"] .legacy-project-board {
  width:min(390px, 39%); max-width:100%; max-height:none;
  overflow:visible; z-index:38; padding:7px;
  background:#141e2a;
}
[data-game-composition="desktop"] .legacy-board-toolbar #legacy-board-toggle {
  min-width:0; min-height:28px; padding:3px 7px; font-size:.71rem;
}
[data-game-composition="desktop"] .legacy-project-board[data-collapsed="false"] {
  inset:8px; width:auto; max-height:none; z-index:39;
  display:grid; grid-template-rows:auto auto auto minmax(0,1fr);
  align-content:start; gap:6px;
}
[data-game-composition="desktop"] .legacy-project-board[data-collapsed="false"][data-benefit-paged="false"] {
  grid-template-rows:auto auto minmax(0,1fr);
}
[data-game-composition="desktop"] .strategic-mobile-views:not([hidden]) {
  display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:6px;
}
[data-game-composition="desktop"] .strategic-mobile-views .button {
  min-width:0; min-height:31px; padding:3px 7px; font-size:.76rem;
}
[data-game-composition="desktop"] .strategic-mobile-views .active {
  border-color:#9cc4ed; color:#e2f0ff; background:#263f61;
}
[data-game-composition="desktop"] .legacy-project-board .legacy-project-card {
  display:grid; grid-template-columns:auto minmax(0,1fr);
  gap:10px; align-items:start; width:100%; margin:0; padding:9px;
}
[data-game-composition="desktop"] .legacy-project-board .legacy-project-card .art-slot {
  width:55px; height:55px;
}
[data-game-composition="desktop"] .legacy-project-board .strategic-part { display:none!important; }
[data-game-composition="desktop"] .legacy-project-board[data-strategic-part="costs"] [data-strategic-part="costs"],
[data-game-composition="desktop"] .legacy-project-board[data-strategic-part="benefits"] [data-strategic-part="benefits"],
[data-game-composition="desktop"] .legacy-project-board[data-strategic-part="plan"] [data-strategic-part="plan"],
[data-game-composition="desktop"] .legacy-project-board[data-strategic-part="actions"] [data-strategic-part="actions"] {
  display:block!important; min-width:0;
}
[data-game-composition="desktop"] .legacy-project-board .strategic-part p {
  margin:4px 0; overflow-wrap:anywhere;
}
[data-game-composition="desktop"] .strategic-benefit-full { display:none; }
[data-game-composition="desktop"] .strategic-benefit-single { display:block; min-width:0; }
[data-game-composition="desktop"] .strategic-benefit-single > [hidden] { display:none!important; }
[data-game-composition="desktop"] .strategic-benefit-pager:not([hidden]) {
  display:grid; grid-template-columns:70px minmax(0,1fr) 70px;
  align-items:center; gap:8px; text-align:center;
}
[data-game-composition="desktop"] .strategic-benefit-pager .button {
  min-height:30px; padding:3px 6px;
}
[data-game-composition="desktop"] .strategic-benefit-pager strong {
  min-width:0; overflow-wrap:anywhere;
}

/* Desktop late-game upgrades retain their actual independent stage families
   and full original card, one real upgrade per explicit finite page. */
[data-game-composition="desktop"] .late-game-area [data-late-upgrade-pager]:not([hidden]) {
  display:grid; grid-template-columns:70px minmax(0,1fr) 70px;
  gap:8px; align-items:center; text-align:center; margin:4px 0;
}
[data-game-composition="desktop"] .late-game-area [data-late-upgrade-label] {
  min-width:0; font-size:.79rem; overflow-wrap:anywhere;
}
[data-game-composition="desktop"] .late-game-area [data-late-upgrade-pager] .button {
  min-width:0; min-height:31px; padding:3px 6px;
}
[data-game-composition="desktop"] .late-game-area [data-late-upgrade-list] {
  display:grid; grid-template-columns:minmax(0,1fr); gap:6px;
}
[data-game-composition="desktop"] .late-game-area [data-late-upgrade-list] > [hidden] {
  display:none!important;
}

/* Desktop late-game live indicators share the original complete mobile
   selection semantics: four stage metrics in two pairs, actual concurrent
   work progress in individually selected timer views, and all Coin values
   in reachable real two-stat pages. No timer or production is suspended. */
[data-game-composition="desktop"] .late-game-area .late-mobile-summary-views {
  display:grid; grid-template-columns:repeat(2,minmax(0,1fr));
  gap:7px; margin:3px 0 5px;
}
[data-game-composition="desktop"] .late-game-area .late-mobile-summary-views .button {
  min-width:0; min-height:31px; padding:3px 8px; font-size:.78rem;
}
[data-game-composition="desktop"] .late-game-area .late-mobile-summary-views .active {
  border-color:#f3d089; color:#fff1ce; background:#4a3921;
}
[data-game-composition="desktop"] .late-game-area > .late-resource-grid {
  display:grid; grid-template-columns:repeat(2,minmax(0,1fr));
  gap:6px; margin:3px 0;
}
[data-game-composition="desktop"] .late-game-area > .late-resource-grid > [hidden] {
  display:none!important;
}
[data-game-composition="desktop"] .late-game-area .late-mobile-work-views:not([hidden]) {
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr));
  grid-column:1/-1; gap:7px; margin:4px 0;
}
[data-game-composition="desktop"] .late-game-area .late-mobile-work-views .button {
  min-width:0; min-height:30px; padding:3px 7px; font-size:.76rem;
}
[data-game-composition="desktop"] .late-game-area .late-mobile-work-views .active {
  color:#fff0c6; border-color:#dac28c; background:#534226;
}
[data-game-composition="desktop"] .late-game-area > .late-action-card > [data-mobile-work-concealed="true"] {
  display:none!important;
}
[data-game-composition="desktop"] .late-game-area .late-coin-stat-pager:not([hidden]) {
  display:grid; grid-template-columns:70px minmax(0,1fr) 70px;
  align-items:center; gap:8px; margin:4px 0; text-align:center;
}
[data-game-composition="desktop"] .late-game-area .late-coin-stat-pager .button {
  min-width:0; min-height:30px; padding:3px 6px;
}
[data-game-composition="desktop"] .late-game-area .late-coin-stat-pager strong {
  min-width:0; overflow-wrap:anywhere; font-size:.79rem;
}
[data-game-composition="desktop"] .late-game-area > .late-coin-panel > .late-resource-grid {
  grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px;
}
[data-game-composition="desktop"] .late-game-area > .late-coin-panel > .late-resource-grid > [hidden] {
  display:none!important;
}

/* Established Industrial Production uses the same genuine selectable Inventory,
   Expansion and Feedstock Routing views on desktop as on mobile. No process
   stops when the operator chooses a different visible control surface. */
[data-game-composition="desktop"] .industrial-production-area .industrial-detail-tabs {
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr));
  flex:0 0 auto; gap:7px; margin:4px 0;
}
[data-game-composition="desktop"] .industrial-production-area .industrial-detail-tabs .button {
  min-width:0; min-height:32px; padding:4px 8px; font-size:.8rem;
}
[data-game-composition="desktop"] .industrial-production-area .industrial-detail-tabs .active {
  border-color:#f5c76b; color:#fff1be; background:#473a1b;
}
[data-game-composition="desktop"] .industrial-production-area .industrial-detail-grid {
  display:block; min-height:0; min-width:0;
}
[data-game-composition="desktop"] .industrial-production-area .industrial-detail-card {
  display:none; gap:8px; padding:10px;
}
[data-game-composition="desktop"] .industrial-production-area[data-industry-view="stock"] [data-industry-card="stock"],
[data-game-composition="desktop"] .industrial-production-area[data-industry-view="upgrades"] [data-industry-card="upgrades"],
[data-game-composition="desktop"] .industrial-production-area[data-industry-view="routing"] [data-industry-card="routing"] {
  display:flex;
}
[data-game-composition="desktop"] .industrial-production-area .industrial-feedstock {
  grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px; margin:4px 0;
}
[data-game-composition="desktop"] .industrial-production-area .industrial-route-actions {
  grid-template-columns:repeat(3,minmax(0,1fr)); gap:7px;
}
[data-game-composition="desktop"] .industrial-production-area .industrial-detail-card .buy-mode-selector {
  min-width:0; max-width:100%;
}

/* Desktop portfolio manufacturing retains one independently selected original
   producer and one complete production responsibility at a time, like mobile.
   All three actual original buttons and the real factory contract/project
   tabs remain available; no live producer is paused when changing detail. */
[data-game-composition="desktop"] .materials-area .material-detail-tabs {
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr));
  gap:7px; flex:0 0 auto; margin:3px 0;
}
[data-game-composition="desktop"] .materials-area .material-detail-tabs .button {
  min-width:0; min-height:32px; padding:4px 8px; font-size:.8rem;
}
[data-game-composition="desktop"] .materials-area .material-detail-tabs .active {
  border-color:#e7ba68; color:#fff0bd; background:#584123;
}
[data-game-composition="desktop"] .materials-area .material-production-grid {
  display:block; min-height:0; min-width:0;
}
[data-game-composition="desktop"] .materials-area .material-production-card {
  display:none; width:100%; min-width:0; gap:8px; padding:12px;
}
[data-game-composition="desktop"] .materials-area[data-material-view="stock"] [data-material-section="stock"],
[data-game-composition="desktop"] .materials-area[data-material-view="line"] [data-material-section="line"],
[data-game-composition="desktop"] .materials-area[data-material-view="warehouse"] [data-material-section="warehouse"] {
  display:flex;
}
[data-game-composition="desktop"] .materials-area .material-production-footer {
  display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap;
  gap:8px; min-width:0;
}
[data-game-composition="desktop"] .materials-area .material-production-footer .buy-mode-selector {
  min-width:0; max-width:100%;
}

/* Full desktop confirmation cards are complete bounded one-step decisions.
   Never place the reset, first-run discovery, or Coin collection confirmation
   behind the old generic scrollable modal viewport. */
[data-game-composition="desktop"] .confirmation-backdrop {
  inset:0; box-sizing:border-box; padding:18px;
  align-content:center; justify-items:center;
}
[data-game-composition="desktop"] .confirmation-card {
  box-sizing:border-box; display:grid; gap:12px;
  align-content:center; justify-items:stretch;
  width:min(560px,100%); min-width:0;
  max-height:100%; overflow:visible; padding:19px;
}
[data-game-composition="desktop"] .confirmation-card h2,
[data-game-composition="desktop"] .confirmation-card .section-kicker,
[data-game-composition="desktop"] .confirmation-card p {
  margin:0; overflow-wrap:anywhere;
}
[data-game-composition="desktop"] .confirmation-card .modal-art {
  display:block; justify-self:center; max-height:95px;
  width:auto; max-width:120px; margin:0;
}
[data-game-composition="desktop"] .confirmation-actions {
  display:grid; grid-template-columns:repeat(2,minmax(0,1fr));
  gap:9px;
}
[data-game-composition="desktop"] .confirmation-card .button {
  min-width:0; min-height:35px; padding:6px 10px;
  white-space:normal; overflow-wrap:anywhere;
}

/* Every major late-game stage now has true bounded top-level activity pages.
   The single currently selected page owns the fixed play area; later content
   is not clipped or put behind a scrollbar. All stage-specific project tabs,
   real goods and active timers continue regardless of the selected page. */
.late-game-area .late-stage-main-nav {
  display:grid; grid-template-columns:minmax(0,1fr); gap:5px;
  min-width:0; margin:0 0 5px;
}
.late-game-area .late-stage-main-nav > strong {
  font-size:.82rem; color:#f7e1b0; overflow-wrap:anywhere;
}
.late-game-area .late-stage-main-buttons {
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:4px;
  min-width:0;
}
.late-game-area .late-stage-main-buttons .button {
  min-width:0; min-height:28px; padding:3px 5px;
  font-size:.71rem; white-space:normal; overflow-wrap:anywhere;
}
.late-game-area .late-stage-main-buttons .active {
  border-color:#f3d089; color:#fff1ce; background:#4a3921;
}
.late-game-area[data-late-main-view]:not([data-late-main-view="overview"]) >
:is(.late-game-hero,.late-artwork-hook,.late-mobile-summary-views,.late-resource-grid) {
  display:none!important;
}
.late-game-area[data-late-main-view]:not([data-late-main-view="work"]) >
.late-action-card { display:none!important; }
.late-game-area[data-late-main-view]:not([data-late-main-view="projects"]):not([data-late-main-view="initiative"]) >
.late-stage-projects { display:none!important; }
.late-game-area[data-late-main-view="projects"] .late-stage-projects > [data-recycling-card] {
  display:none!important;
}
.late-game-area[data-late-main-view="initiative"] .late-stage-projects > :not([data-recycling-card]) {
  display:none!important;
}
.late-game-area[data-late-main-view]:not([data-late-main-view="upgrades"]) >
[data-late-upgrades] { display:none!important; }
.late-game-area[data-late-main-view]:not([data-late-main-view="coin"]) >
[data-late-coin] { display:none!important; }
[data-game-composition="mobile"] .late-game-area .late-stage-main-nav {
  gap:3px; margin:1px 0 4px;
}
[data-game-composition="mobile"] .late-game-area .late-stage-main-nav > strong {
  font-size:.7rem;
}
[data-game-composition="mobile"] .late-game-area .late-stage-main-buttons {
  gap:3px;
}
[data-game-composition="mobile"] .late-game-area .late-stage-main-buttons .button {
  min-height:24px; padding:2px 3px; font-size:.62rem;
}
[data-game-composition="mobile"][data-game-orientation="landscape"] .late-game-area .late-stage-main-nav > strong {
  display:none;
}
[data-game-composition="mobile"][data-game-orientation="landscape"] .late-game-area .late-stage-main-buttons .button {
  min-height:21px; font-size:.6rem;
}
[data-game-composition="desktop"] .late-game-area .late-stage-main-nav {
  grid-template-columns:minmax(130px,.27fr) minmax(0,1fr);
  align-items:center; gap:8px; margin:0 0 8px;
}
[data-game-composition="desktop"] .late-game-area .late-stage-main-buttons {
  grid-template-columns:repeat(6,minmax(0,1fr)); gap:6px;
}
[data-game-composition="desktop"] .late-game-area .late-stage-main-buttons .button {
  min-height:31px; font-size:.76rem;
}

/* The game now exposes every ordinary gameplay surface through finite explicit
   activity/item pages. Retire the old catch-all play-area scrolling/clipping
   fallback so an oversized control becomes a diagnostic violation instead of
   silently becoming reachable only by scrolling or disappearing behind a crop.
   Coin Web keeps its own deliberately bounded pan/zoom viewport. */
[data-game-composition="desktop"] .play-views,
[data-game-composition="mobile"] .play-views {
  overflow: visible;
}
[data-game-composition="desktop"] .play-views > .play-area,
[data-game-composition="mobile"] .play-views > .play-area {
  overflow: visible;
  overscroll-behavior: auto;
}
[data-game-composition="desktop"] .play-views > .materials-area,
[data-game-composition="mobile"] .play-views > .materials-area,
[data-game-composition="desktop"] .play-views > .industrial-production-area,
[data-game-composition="mobile"] .play-views > .industrial-production-area {
  overflow: visible;
}

/* Finite pages must not replace scrolling with truncated labels. Allow the
   selected real upgrade/resource names and values to wrap inside their bounded
   cards instead of ellipsizing player-facing information. Decorative artwork
   remains clipped by its own card boundary. */
.compact-upgrade-copy strong,
.compact-upgrade-copy small,
.compact-upgrade-copy em {
  overflow: visible;
  text-overflow: clip;
  white-space: normal;
  overflow-wrap: anywhere;
}
[data-game-composition="desktop"] .resource-hud span,
[data-game-composition="desktop"] .resource-hud .resource-tracker-list span,
[data-game-composition="mobile"] .resource-hud span,
[data-game-composition="mobile"] .resource-hud .resource-tracker-list span {
  overflow: visible;
  text-overflow: clip;
  white-space: normal;
  overflow-wrap: anywhere;
}

/* Desktop Settings uses the same finite controls that its renderer already
   applies to mobile. Do not leave hidden page selectors behind a legacy desktop
   overview/scroll container: every selected setting, statistic, diagnostic
   record and Developer control remains directly reachable without scrolling. */
[data-game-composition="desktop"] .settings-dialog {
  box-sizing:border-box; grid-template-rows:auto auto auto;
  align-content:start; max-height:100%; overflow:visible;
}
[data-game-composition="desktop"] .settings-tabs {
  display:grid; grid-template-columns:repeat(4,minmax(0,1fr));
  gap:4px; padding:0 12px; overflow:visible; min-width:0;
}
[data-game-composition="desktop"] .settings-tab {
  min-width:0; min-height:32px; padding:6px 8px;
}
[data-game-composition="desktop"] .settings-content {
  min-width:0; min-height:0; overflow:visible; padding:10px 14px 14px;
  overscroll-behavior:auto;
}
[data-game-composition="desktop"] .game-settings-mobile-tabs {
  display:grid; grid-template-columns:repeat(5,minmax(0,1fr));
  gap:5px; margin:3px 0 8px;
}
[data-game-composition="desktop"] .game-settings-mobile-tabs .button {
  min-width:0; min-height:31px; padding:4px 6px; font-size:.76rem;
}
[data-game-composition="desktop"] .game-settings-mobile-tabs .active {
  color:#fff0c7; border-color:#e8be62; background:#4c3b22;
}
[data-game-composition="desktop"] .game-settings-part[hidden] { display:none!important; }
[data-game-composition="desktop"] .game-settings-part { display:grid; gap:7px; min-width:0; }
[data-game-composition="desktop"] .resource-settings-mobile-page:not([hidden]),
[data-game-composition="desktop"] .statistics-mobile-group-page:not([hidden]),
[data-game-composition="desktop"] .statistics-mobile-entry-page:not([hidden]),
[data-game-composition="desktop"] .diagnostics-mobile-page:not([hidden]),
[data-game-composition="desktop"] .developer-mobile-page:not([hidden]) {
  display:grid; grid-template-columns:34px minmax(0,1fr) 34px;
  align-items:center; gap:5px; margin:3px 0; text-align:center;
}
[data-game-composition="desktop"] .statistics-mobile-group-page strong,
[data-game-composition="desktop"] .statistics-mobile-entry-page strong,
[data-game-composition="desktop"] .diagnostics-mobile-page strong,
[data-game-composition="desktop"] .developer-mobile-page strong {
  min-width:0; overflow-wrap:anywhere; font-size:.76rem;
}
[data-game-composition="desktop"] .resource-settings-mobile-page .button,
[data-game-composition="desktop"] .statistics-mobile-group-page .button,
[data-game-composition="desktop"] .statistics-mobile-entry-page .button,
[data-game-composition="desktop"] .diagnostics-mobile-page .button,
[data-game-composition="desktop"] .developer-mobile-page .button {
  min-height:29px; padding:3px;
}
[data-game-composition="desktop"] .diagnostics-mobile-views {
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr));
  gap:5px; margin:4px 0;
}
[data-game-composition="desktop"] .diagnostics-mobile-views > .button {
  min-width:0; min-height:31px; padding:4px 6px; font-size:.75rem;
}
[data-game-composition="desktop"] .diagnostics-mobile-views > .active {
  color:#e9d5fd; border-color:#ab79ce; background:#43304e;
}
[data-game-composition="desktop"] [data-diagnostics-part][hidden],
[data-game-composition="desktop"] #diagnostics-metadata > [hidden],
[data-game-composition="desktop"] #developer-controls > [hidden],
[data-game-composition="desktop"] #developer-controls .developer-button-row > [hidden],
[data-game-composition="desktop"] #developer-inspector-section[hidden],
[data-game-composition="desktop"] #developer-state .inspector-grid > [hidden] {
  display:none!important;
}
[data-game-composition="desktop"] #diagnostics-metadata {
  grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px;
}
[data-game-composition="desktop"] #diagnostics-log,
[data-game-composition="desktop"] .developer-state {
  min-width:0; max-height:none; overflow:visible; white-space:pre-wrap;
  overflow-wrap:anywhere;
}
[data-game-composition="desktop"] #developer-controls {
  grid-template-columns:minmax(0,1fr); gap:6px;
}
[data-game-composition="desktop"] #developer-state .inspector-grid {
  grid-template-columns:minmax(0,1fr); gap:6px;
}
[data-game-composition="desktop"] .confirmation-card {
  max-height:none; overflow:visible;
}

/* Final source-level no-scroll invariant for authored game content. These
   containers already use finite pages/pagers. Keep their complete current
   contents visible so an oversized layout is detectable instead of becoming
   silently scrollable or clipped. The fixed host frame, decorative artwork,
   progress bars and Coin Web camera remain intentional bounded surfaces. */
[data-game-composition="desktop"] .dashboard,
[data-game-composition="mobile"] .dashboard,
[data-game-composition="desktop"] .main-navigation,
[data-game-composition="mobile"] .main-navigation,
[data-game-composition="desktop"] .sub-navigation,
[data-game-composition="mobile"] .sub-navigation,
[data-game-composition="desktop"] .resource-hud,
[data-game-composition="mobile"] .resource-hud,
[data-game-composition="desktop"] .play-views,
[data-game-composition="mobile"] .play-views,
[data-game-composition="desktop"] .play-views > .play-area,
[data-game-composition="mobile"] .play-views > .play-area,
[data-game-composition="desktop"] .inventory-panel,
[data-game-composition="mobile"] .inventory-panel,
[data-game-composition="desktop"] .upgrades-panel,
[data-game-composition="mobile"] .upgrades-panel,
[data-game-composition="desktop"] .clothing-shop,
[data-game-composition="mobile"] .clothing-shop,
[data-game-composition="desktop"] .legacy-project-board,
[data-game-composition="mobile"] .legacy-project-board,
[data-game-composition="desktop"] .settings-dialog,
[data-game-composition="mobile"] .settings-dialog,
[data-game-composition="desktop"] .settings-tabs,
[data-game-composition="mobile"] .settings-tabs,
[data-game-composition="desktop"] .settings-content,
[data-game-composition="mobile"] .settings-content,
[data-game-composition="desktop"] .confirmation-card,
[data-game-composition="mobile"] .confirmation-card,
[data-game-composition="desktop"] .bug-report-dialog,
[data-game-composition="mobile"] .bug-report-dialog {
  overflow:visible;
}

/* Offline return information is a results summary: time away, real net
   resource gains, and the offline-production rate. Process trivia stays out. */
.offline-summary {
  display:grid;
  grid-template-rows:auto auto;
  align-items:start;
  gap:10px;
  min-width:0;
  margin:0;
  padding:14px 16px;
}
.offline-summary-copy { display:grid; gap:4px; min-width:0; }
.offline-summary-copy .section-kicker { margin:0; font-size:.66rem; }
.offline-summary-copy h2 { margin:0; font-size:1.08rem; }
.offline-earned-intro {
  margin:2px 0 0;
  color:#dce9f3;
  font-size:.78rem;
  font-weight:800;
}
.offline-details {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:6px;
  min-width:0;
  margin-top:2px;
}
.offline-detail {
  display:grid;
  gap:2px;
  min-width:0;
  margin:0;
  padding:8px 10px;
  border:1px solid rgba(120,164,198,.28);
  border-radius:7px;
  background:rgba(7,18,28,.24);
}
.offline-detail-label {
  color:#aebfcd;
  font-size:.66rem;
  font-weight:750;
  line-height:1.1;
  overflow-wrap:anywhere;
}
.offline-detail-value {
  color:#f5f8fb;
  font-size:.94rem;
  line-height:1.1;
  overflow-wrap:anywhere;
}
.offline-efficiency-note {
  margin:3px 0 0;
  color:#aebfcd;
  font-size:.68rem;
  line-height:1.18;
  overflow-wrap:anywhere;
}
.offline-summary-actions {
  display:flex;
  justify-content:flex-end;
  align-items:center;
}
#offline-dismiss {
  min-width:110px;
  min-height:30px;
  padding:4px 12px;
  font-size:.72rem;
}
[data-game-composition="mobile"] .offline-summary {
  gap:6px;
  padding:8px;
}
[data-game-composition="mobile"] .offline-summary-copy .section-kicker { font-size:.55rem; }
[data-game-composition="mobile"] .offline-summary-copy h2 { font-size:.78rem; }
[data-game-composition="mobile"] .offline-earned-intro { font-size:.61rem; }
[data-game-composition="mobile"] .offline-details {
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:3px;
  margin-top:1px;
}
[data-game-composition="mobile"] .offline-detail { padding:4px 5px; }
[data-game-composition="mobile"] .offline-detail-label { font-size:.51rem; }
[data-game-composition="mobile"] .offline-detail-value { font-size:.65rem; }
[data-game-composition="mobile"] .offline-efficiency-note {
  margin-top:1px;
  font-size:.53rem;
  line-height:1.08;
}
[data-game-composition="mobile"] #offline-dismiss {
  min-width:82px;
  min-height:24px;
  padding:2px 6px;
  font-size:.61rem;
}
[data-game-composition="mobile"][data-game-orientation="landscape"] .offline-details {
  grid-template-columns:repeat(4,minmax(0,1fr));
}

/* The first Coin's locked 0 stays visible next to Cash on every game tab,
   without adding another HUD grid cell or a scrolling currency strip. */
.resource-hud .hud-money .pre-coin-counter {
  display:block; min-width:0; margin-top:1px;
  color:#d2e4f2; font-size:.57rem; font-weight:750; line-height:1.07;
  white-space:normal; overflow:visible; text-overflow:clip; overflow-wrap:anywhere;
}
.resource-hud .hud-money .pre-coin-counter:focus-visible {
  outline:2px solid #ffda81; outline-offset:1px;
}
[data-game-composition="mobile"] .resource-hud .hud-money .pre-coin-counter {
  font-size:.54rem; line-height:1.04; margin-top:0;
}

/* Fixed-frame Coin Web sections: its seven wallet stats, eleven optional
   buyer reserves, and spatial drawing are three independently selected
   legitimate screens. Every undisplayed item has an explicit finite pager,
   never a clipped or nested-scroll catalog. The bounded camera remains the
   sole intentional spatial overflow exception. */
.coin-web-area { gap: 5px; }
.coin-web-section-nav {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
  flex: 0 0 auto; gap: 5px; min-width: 0;
}
.coin-web-section-nav > .button {
  min-width: 0; min-height: 30px; padding: 3px 6px; font-size: .8rem;
}
.coin-web-section-nav > .active {
  border-color: #e9c978; color: #fff1b1; background: #473918;
}
.coin-web-area > .coin-web-section[hidden] { display: none !important; }
.coin-web-section { min-width: 0; min-height: 0; flex: 1 1 0; }
.coin-web-section-web {
  display: flex; flex-direction: column; gap: 4px; min-height: 0;
}
.coin-web-section-web .coin-web-hero {
  flex: 0 0 auto; min-height: 0; margin: 0; padding: 8px 11px;
}
.coin-web-section-web .coin-web-hero h2 { margin: 0; font-size: 1rem; }
.coin-web-section-web .coin-web-hero p { margin: 2px 0; font-size: .68rem; line-height: 1.16; }
.coin-web-web-help { flex: 0 0 auto; margin: 0; font-size: .69rem; line-height: 1.17; overflow-wrap: anywhere; }
.coin-web-section-web > .coin-web-viewport {
  flex: 1 1 0; height: auto; min-height: 0; min-width: 0; margin: 0;
}
.coin-web-wallet, .coin-web-buyers {
  display: grid; grid-template-columns: minmax(0, 1fr);
  grid-auto-rows: max-content; align-content: start; gap: 5px;
}
.coin-web-wallet h3, .coin-web-buyers h3, .coin-web-reserves h4 {
  margin: 0; font-size: .85rem; overflow-wrap: anywhere;
}
.coin-web-wallet .coin-web-summary {
  display: grid; grid-template-columns: minmax(0, 1fr);
  gap: 6px; min-width: 0; margin: 0;
}
.coin-web-summary > .coin-web-summary-cells {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 5px; min-width: 0; border: 0; padding: 0; background: transparent;
}
.coin-web-summary-cells > div {
  display: grid; align-content: center; min-width: 0; padding: 6px;
  border: 1px solid #755f2b; border-radius: 8px; background: rgba(0,0,0,.2);
}
.coin-web-summary-cells > [hidden],
.coin-web-reserve-items > [hidden] { display: none !important; }
.coin-web-summary-cells span { font-size: .68rem; line-height: 1.14; }
.coin-web-summary-cells strong { font-size: .87rem; margin: 2px 0 0; line-height: 1.14; }
.coin-web-detail-pager {
  display: grid; grid-template-columns: 33px minmax(0, 1fr) 33px;
  gap: 6px; align-items: center; min-width: 0; max-width: 250px;
}
.coin-web-detail-pager > strong { text-align: center; font-size: .74rem; }
.coin-web-detail-pager > .button {
  min-width: 0; min-height: 29px; padding: 2px 4px; font-size: .7rem;
}
.coin-web-wallet .button-coin {
  grid-column: 1; min-width: 0; min-height: 34px; padding: 5px 8px;
  font-size: .79rem; white-space: normal; overflow-wrap: anywhere;
}
.coin-web-buyers .coin-web-controls {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 5px; margin: 0; min-width: 0;
}
.coin-web-buyers .coin-web-controls label {
  flex-wrap: wrap; min-width: 0; gap: 3px; font-size: .7rem;
}
.coin-web-buyers .coin-web-controls select {
  min-width: 0; max-width: 100%; padding: 4px; font-size: .74rem;
}
.coin-web-buyers .coin-web-reserves {
  display: grid; grid-template-columns: minmax(0, 1fr);
  gap: 5px; min-width: 0; margin: 0;
}
.coin-web-reserve-items {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 5px; min-width: 0;
}
.coin-web-reserve-items label {
  display: grid; gap: 3px; min-width: 0; padding: 5px;
  border: 1px solid #5b526d; border-radius: 6px;
  color: #d3c7e7; font-size: .72rem; overflow-wrap: anywhere;
}
.coin-web-reserve-items input { width: 100%; min-height: 30px; padding: 3px 5px; }
[data-game-composition="mobile"] .coin-web-section-nav { gap: 3px; }
[data-game-composition="mobile"] .coin-web-section-nav > .button {
  min-height: 25px; padding: 2px 3px; font-size: .68rem;
}
[data-game-composition="mobile"] .coin-web-section-web .coin-web-hero {
  padding: 4px 6px;
}
[data-game-composition="mobile"] .coin-web-section-web .coin-web-hero h2 { font-size: .8rem; }
[data-game-composition="mobile"] .coin-web-section-web .coin-web-hero p {
  margin: 1px 0; font-size: .59rem; line-height: 1.09;
}
[data-game-composition="mobile"] .coin-web-web-help {
  font-size: .6rem; line-height: 1.11;
}
[data-game-composition="mobile"] .coin-web-summary > .coin-web-summary-cells,
[data-game-composition="mobile"] .coin-web-reserve-items {
  grid-template-columns: minmax(0, 1fr);
}
[data-game-composition="mobile"] .coin-web-wallet h3,
[data-game-composition="mobile"] .coin-web-buyers h3,
[data-game-composition="mobile"] .coin-web-reserves h4 { font-size: .73rem; }
[data-game-composition="mobile"] .coin-web-summary-cells > div { padding: 4px; }
[data-game-composition="mobile"] .coin-web-summary-cells span { font-size: .64rem; }
[data-game-composition="mobile"] .coin-web-summary-cells strong { font-size: .77rem; }
[data-game-composition="mobile"] .coin-web-detail-pager { gap: 3px; max-width: 190px; grid-template-columns: 27px minmax(0,1fr) 27px; }
[data-game-composition="mobile"] .coin-web-detail-pager > .button { min-height: 25px; padding: 2px; }
[data-game-composition="mobile"] .coin-web-wallet .button-coin { min-height: 28px; padding: 3px 5px; font-size: .69rem; }
[data-game-composition="mobile"] .coin-web-buyers .coin-web-controls { grid-template-columns: minmax(0, 1fr); }
[data-game-composition="mobile"] .coin-web-reserve-items label { padding: 3px 5px; font-size: .65rem; }
[data-game-composition="mobile"][data-game-orientation="landscape"] .coin-web-area {
  gap: 3px; padding: 4px;
}
[data-game-composition="mobile"][data-game-orientation="landscape"] .coin-web-section-nav > .button {
  min-height: 22px; font-size: .62rem;
}
[data-game-composition="mobile"][data-game-orientation="landscape"] .coin-web-section-web .coin-web-hero {
  padding: 3px 5px;
}
[data-game-composition="mobile"][data-game-orientation="landscape"] .coin-web-section-web .coin-web-hero h2 { font-size: .72rem; }
[data-game-composition="mobile"][data-game-orientation="landscape"] .coin-web-section-web .coin-web-hero p { font-size: .56rem; }
[data-game-composition="mobile"][data-game-orientation="landscape"] .coin-web-web-help { font-size: .56rem; }
[data-game-composition="mobile"][data-game-orientation="landscape"] .coin-web-wallet,
[data-game-composition="mobile"][data-game-orientation="landscape"] .coin-web-buyers { gap: 3px; }

/* Original summary buttons spanned six columns; finite wallet page arrows
   live in their own THREE-column inner grid and must not inherit that span. */
.coin-web-wallet .coin-web-detail-pager > .button {
  grid-column: auto; min-width: 0;
}


/* Short mobile Buyer configuration: the purchased Policy and Reserves
   systems remain complete but occupy independent finite in-game pages. */
.coin-web-buyers .coin-web-buyer-tabs {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 5px; min-width: 0; max-width: 420px;
}
.coin-web-buyers .coin-web-buyer-tabs[hidden] { display: none !important; }
.coin-web-buyer-tabs > .button {
  min-width: 0; min-height: 28px; padding: 3px 5px; font-size: .73rem;
}
.coin-web-buyer-tabs > .active {
  border-color: #e9c978; color: #fff1b1; background: #473918;
}
.coin-web-buyers .coin-web-controls[hidden] { display: none !important; }
[data-game-composition="mobile"] .coin-web-buyer-tabs > .button {
  min-height: 24px; padding: 2px 3px; font-size: .66rem;
}
[data-game-composition="mobile"][data-game-orientation="landscape"] .coin-web-buyer-tabs > .button {
  min-height: 22px; font-size: .62rem;
}

/* A floating unlock notice must remain within the real dashboard/presentation
   rather than growing a long unbroken message beyond the fixed game frame. */
[data-game-composition="desktop"] .navigation-feedback,
[data-game-composition="mobile"] .navigation-feedback {
  box-sizing:border-box; min-width:0; max-width:calc(100% - 16px);
  overflow-wrap:anywhere; white-space:normal;
}
[data-game-composition="desktop"] .navigation-feedback {
  width:max-content; max-width:calc(100% - 32px);
}

/* The tooltip's complete original details remain inside the logical game. */
.upgrade-detail-surface { overflow-wrap:anywhere; white-space:normal; }
[data-game-composition="mobile"][data-game-orientation="landscape"] .upgrade-detail-surface { padding:6px 8px; font-size:.72rem; }
[data-game-composition="mobile"][data-game-orientation="landscape"] .upgrade-detail-surface p { margin:3px 0 0; font-size:.68rem; line-height:1.1; }

/* v0.1.209: Desktop's main early-game loop is ONE visible workspace again.
   Search, all nine illustrated stash tiles and real Sell All stay in sight
   alongside early upgrades and crew; secondary pages remain available only
   on compact touch screens. Never conceal main gameplay to satisfy fit. */
[data-game-composition="desktop"] .dumpster-pane-tabs { display:none; }
[data-game-composition="desktop"] .dumpster-grid {
  display:grid;
  grid-template-columns:minmax(0,1.05fr) minmax(0,.9fr) minmax(0,1.25fr);
  grid-template-rows:minmax(0,.8fr) minmax(0,1.15fr);
  align-content:stretch; align-items:stretch;
  height:calc(100% - 78px); min-height:0; gap:8px;
}
[data-game-composition="desktop"] .dumpster-grid > .panel:not([hidden]) {
  display:grid; align-content:start; min-width:0; min-height:0;
  gap:5px; padding:8px;
}
[data-game-composition="desktop"] .dumpster-grid > .dig-panel { grid-column:1; grid-row:1; }
[data-game-composition="desktop"] .dumpster-grid > .inventory-panel {
  grid-column:2; grid-row:1 / span 2; grid-template-rows:auto minmax(0,1fr);
}
[data-game-composition="desktop"] .dumpster-grid > .pawn-panel { grid-column:1; grid-row:2; }
[data-game-composition="desktop"] .dumpster-grid > .upgrades-panel { grid-column:3; grid-row:1; }
[data-game-composition="desktop"] .dumpster-grid > .automation-panel { grid-column:3; grid-row:2; }
[data-game-composition="desktop"] .dumpster-grid > .inventory-panel .inventory-list {
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr));
  grid-template-rows:repeat(3,minmax(0,1fr));
  align-content:start; gap:5px; height:min(100%,450px); margin:5px 0;
}
[data-game-composition="desktop"] .dumpster-grid > .inventory-panel .inventory-tile {
  min-width:0; min-height:0; width:100%; height:100%; max-height:145px; aspect-ratio:auto;
}
[data-game-composition="desktop"] .dumpster-grid > .upgrades-panel #upgrade-list {
  display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:5px;
}
[data-game-composition="desktop"] .dumpster-grid > .automation-panel .crew-mobile-views,
[data-game-composition="desktop"] .dumpster-grid > .automation-panel .crew-mobile-purchase-page,
[data-game-composition="desktop"] .dumpster-grid > .upgrades-panel .early-mobile-upgrade-page,
[data-game-composition="desktop"] .dumpster-grid > .automation-panel .early-mobile-upgrade-page {
  display:none!important;
}
[data-game-composition="desktop"] .dumpster-grid > .automation-panel .automation-grid {
  display:grid; grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr); gap:6px;
}
[data-game-composition="desktop"] .dumpster-grid > .automation-panel .progression-purchases {
  display:grid; grid-template-columns:minmax(0,1fr); gap:5px;
}
[data-game-composition="desktop"] .dumpster-grid > .automation-panel .progression-purchases > .purchase-card {
  min-height:0; padding:4px; gap:3px;
}
[data-game-composition="desktop"] .dumpster-grid > .automation-panel #crew-upgrade-list {
  display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:5px;
}

/* v0.1.210: connected settings and direct named Developer navigation.
   Full fixed-frame viewport remains authoritative. */
[data-game-composition="desktop"] .settings-dialog { width:min(1540px,calc(100% - 24px)); }
[data-game-composition="desktop"] [data-settings-section="game"]:not([hidden]) {
  display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); align-content:start; gap:10px;
}
[data-game-composition="desktop"] [data-settings-section="game"] > .game-settings-mobile-tabs { display:none!important; }
[data-game-composition="desktop"] [data-settings-section="game"] > .game-settings-part {
  display:grid; gap:5px; align-content:start; min-width:0;
}
[data-game-composition="desktop"] [data-settings-section="game"] .settings-action-card {
  margin:0; padding:9px 12px; gap:10px;
}
[data-game-composition="desktop"] [data-settings-section="game"] .audio-control-grid {
  grid-template-columns:repeat(3,minmax(0,1fr)); gap:7px;
}
[data-game-composition="desktop"] [data-settings-section="game"] [data-game-settings-part="resources"] {
  grid-column:1 / -1;
}
[data-game-composition="desktop"] [data-settings-section="developer"]:not([hidden]) {
  display:grid; grid-template-columns:235px minmax(0,1fr); gap:12px;
  min-width:0; min-height:0; align-items:start;
}
[data-game-composition="desktop"] #developer-group-navigation { grid-column:1; grid-row:1; }
[data-game-composition="desktop"] #developer-group-navigation .developer-group-buttons {
  display:grid; grid-template-columns:minmax(0,1fr); gap:5px;
}
[data-game-composition="desktop"] #developer-group-navigation .developer-group-buttons > .button {
  min-height:33px; padding:5px 8px; font-size:.77rem; text-align:left; white-space:normal;
}
#developer-group-navigation .developer-group-buttons > .active {
  border-color:#d2a2e9; background:#453255; color:#fff;
}
[data-game-composition="desktop"] #developer-controls,
[data-game-composition="desktop"] #developer-inspector-section {
  grid-column:2; grid-row:1; min-width:0; margin:0;
}
[data-game-composition="desktop"] #developer-controls .developer-group { margin:0; padding:10px; }
[data-game-composition="desktop"] #developer-controls .developer-button-row {
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:7px;
}
[data-game-composition="desktop"] #developer-inspector-section .inspector-grid {
  grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px;
}
#developer-group-navigation select,#developer-field-select,.developer-direct-action select {
  display:block; box-sizing:border-box; width:100%; min-width:0; padding:7px;
  border:1px solid #80708d; border-radius:6px; color:var(--ink); background:#251d2d;
}
[data-game-composition="desktop"] #developer-group-select,
[data-game-composition="desktop"] #developer-group-navigation > label { display:none; }
.developer-inspector-picker { display:grid; gap:5px; margin:5px 0 8px; color:var(--muted); }
[data-game-composition="mobile"] #developer-group-navigation {
  display:grid; grid-template-columns:1fr; gap:3px; min-width:0; margin:0 0 5px; font-size:.72rem;
}
[data-game-composition="mobile"] #developer-group-navigation .developer-group-buttons { display:none!important; }
[data-game-composition="mobile"] .developer-direct-action {
  display:grid; gap:5px; margin-top:7px; font-size:.75rem;
}
[data-game-composition="mobile"] .developer-group[data-direct-actions="true"] .developer-button-row { display:none!important; }
[data-game-composition="mobile"] #developer-inspector-section .developer-inspector-picker { font-size:.72rem; }
:is([data-game-composition="desktop"],[data-game-composition="mobile"]) .developer-mobile-page { display:none!important; }
[data-settings-section][hidden],#developer-inspector-section[hidden],#developer-controls > [hidden] {display:none!important;}

/* v0.1.211: Touch-first Dumpster starts with a CONNECTED search, actual stash
   and real cash-out control. Limited space earns secondary Upgrade/Crew views,
   never hiding the entire basic play loop behind speculative activity tabs. */
[data-game-composition="mobile"] .dumpster-pane-tabs {
  grid-template-columns:repeat(3,minmax(0,1fr)); gap:4px;
}
[data-game-composition="mobile"] .dumpster-pane-tabs > [data-dumpster-pane="stash"],
[data-game-composition="mobile"] .dumpster-pane-tabs > [data-dumpster-pane="sell"] {
  display:none!important;
}
[data-game-composition="mobile"] [data-dumpster-workspace="search"] .dumpster-grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  grid-template-rows:minmax(0,1.05fr) minmax(0,.95fr);
  align-content:stretch; align-items:stretch;
  min-height:0; height:calc(100% - 106px); gap:4px;
}
[data-game-composition="mobile"] [data-dumpster-workspace="search"]
 .dumpster-grid > .panel:not([hidden]) {
  display:grid; min-width:0; min-height:0; padding:4px;
  align-content:start; gap:2px;
}
[data-game-composition="mobile"] [data-dumpster-workspace="search"] .dumpster-grid > .dig-panel {
  grid-column:1 / -1; grid-row:1;
}
[data-game-composition="mobile"] [data-dumpster-workspace="search"] .dumpster-grid > .inventory-panel {
  grid-column:1; grid-row:2; grid-template-rows:auto minmax(0,1fr);
}
[data-game-composition="mobile"] [data-dumpster-workspace="search"] .dumpster-grid > .pawn-panel {
  grid-column:2; grid-row:2;
}
[data-game-composition="mobile"] [data-dumpster-workspace="search"] .dumpster-grid .panel-heading {
  gap:3px; margin:0;
}
[data-game-composition="mobile"] [data-dumpster-workspace="search"] .dumpster-grid .panel-heading h2 {
  font-size:.72rem; line-height:1.1;
}
[data-game-composition="mobile"] [data-dumpster-workspace="search"] .inventory-panel .inventory-list {
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr));
  grid-template-rows:repeat(3,minmax(0,1fr)); gap:2px; margin:1px 0;
}
[data-game-composition="mobile"] [data-dumpster-workspace="search"] .inventory-panel .inventory-tile {
  min-height:0; height:min(9vw,40px); aspect-ratio:auto;
}
[data-game-composition="mobile"] [data-dumpster-workspace="search"] .pawn-panel .shop-copy {
  margin:2px 0; font-size:.63rem;
}
[data-game-composition="mobile"] [data-dumpster-workspace="search"] .pawn-panel .action-status {
  margin:2px 0; font-size:.65rem; line-height:1.1;
}
[data-game-composition="mobile"] [data-dumpster-workspace="search"] .pawn-panel .button {
  min-height:29px; padding:3px 5px; font-size:.7rem;
}
[data-game-composition="mobile"][data-game-orientation="landscape"]
 [data-dumpster-workspace="search"] .dumpster-grid {
  grid-template-columns:minmax(0,1.15fr) minmax(0,.95fr) minmax(0,.9fr);
  grid-template-rows:minmax(0,1fr); height:calc(100% - 103px);
}
[data-game-composition="mobile"][data-game-orientation="landscape"]
 [data-dumpster-workspace="search"] .dumpster-grid > .dig-panel {
  grid-column:1; grid-row:1;
}
[data-game-composition="mobile"][data-game-orientation="landscape"]
 [data-dumpster-workspace="search"] .dumpster-grid > .inventory-panel {
  grid-column:2; grid-row:1;
}
[data-game-composition="mobile"][data-game-orientation="landscape"]
 [data-dumpster-workspace="search"] .dumpster-grid > .pawn-panel {
  grid-column:3; grid-row:1;
}
[data-game-composition="mobile"][data-game-orientation="landscape"]
 [data-dumpster-workspace="search"] .dig-panel .dumpster-art {
  display:none; /* presentation-only decoration; no gameplay or loot hidden */
}
[data-game-composition="mobile"][data-game-orientation="landscape"]
 [data-dumpster-workspace="search"] .inventory-panel .inventory-tile {
  height:28px; min-height:0;
}

/* v0.1.212: The desktop Beach makes search, legitimate accessory progress,
   real detector upgrades and actual inventory/Sell controls co-visible.
   Only genuinely unbounded held item TYPES retain a selected-item pager. */
[data-game-composition="desktop"] #beach-panel .beach-pane-tabs { display:none; }
[data-game-composition="desktop"] #beach-panel .beach-layout {
  display:grid; grid-template-columns:minmax(0,.85fr) minmax(0,1fr) minmax(0,1.15fr);
  grid-template-rows:minmax(0,1fr); height:calc(100% - 45px);
  min-height:0; align-items:start; gap:9px;
}
[data-game-composition="desktop"] #beach-panel .beach-layout > .beach-action {
  grid-column:1; grid-row:1; min-width:0; min-height:0;
  display:grid; align-content:start; gap:5px;
}
[data-game-composition="desktop"] #beach-panel .beach-layout > .beach-upgrades {
  grid-column:2; grid-row:1; min-width:0; min-height:0;
  display:grid; align-content:start; gap:6px;
}
[data-game-composition="desktop"] #beach-panel .beach-layout > .beach-inventory-panel {
  grid-column:3; grid-row:1; min-width:0; min-height:0;
  display:grid; align-content:start; gap:8px;
}
[data-game-composition="desktop"] #beach-panel .beach-art { height:96px; margin:2px auto 3px; }
[data-game-composition="desktop"] #beach-panel .accessory-progress-card {
  display:grid; gap:5px; padding:7px; margin:3px 0;
}
[data-game-composition="desktop"] #beach-panel #beach-upgrade-list {
  display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px;
}
[data-game-composition="desktop"] #beach-panel .early-mobile-upgrade-page { display:none!important; }
[data-game-composition="desktop"] #beach-panel #beach-inventory-pager:not([hidden]) {
  display:grid; grid-template-columns:44px minmax(0,1fr) 44px; gap:5px;
}

/* v0.1.213 connected middle-game desktop workspaces: preserve the relationship
   between current state, player action, necessary inventory and its upgrade. */
[data-game-composition="desktop"] #recycling-center-panel {
  display:grid; grid-template-columns:minmax(0,1.2fr) minmax(0,1.05fr) minmax(0,.8fr);
  grid-template-rows:auto auto minmax(0,1fr); gap:8px; align-content:stretch;
}
[data-game-composition="desktop"] #recycling-center-panel > .panel-heading,
[data-game-composition="desktop"] #recycling-center-panel > p {
  grid-column:1/-1; margin:0;
}
[data-game-composition="desktop"] #recycling-center-panel > .recycling-pane-tabs,
[data-game-composition="desktop"] #recycling-center-panel .recycling-mobile-operation-tabs {
  display:none!important;
}
[data-game-composition="desktop"] #recycling-center-panel > .recycling-pane:not([hidden]) {
  display:grid; align-content:start; min-width:0; min-height:0; gap:7px;
  margin:0; padding:9px; border:1px solid #49695c; border-radius:8px;
}
[data-game-composition="desktop"] #recycling-center-panel > [data-recycling-section="operations"] {
  grid-column:1; grid-row:3; grid-template-columns:minmax(0,1fr); gap:9px;
}
[data-game-composition="desktop"] #recycling-center-panel > [data-recycling-section="upgrades"] {
  grid-column:2; grid-row:3;
}
[data-game-composition="desktop"] #recycling-center-panel > [data-recycling-section="lines"] {
  grid-column:3; grid-row:3;
}
[data-game-composition="desktop"] #recycling-center-panel [data-recycling-operation-part="routing"] {
  display:grid; grid-template-columns:minmax(0,1fr); gap:8px;
}
[data-game-composition="desktop"] #recycling-center-panel .recycling-control-grid .art-info-card {
  margin:0; padding:6px;
}
[data-game-composition="desktop"] #recycling-center-panel .recycling-control-grid .developer-button-row {
  display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px;
}
[data-game-composition="desktop"] #recycling-center-panel .recycling-control-grid #auto-recycling-toggle {
  grid-column:1 / -1;
}
[data-game-composition="desktop"] #recycling-center-panel [data-recycling-operation-part="production"] {
  display:grid; margin:0;
}
[data-game-composition="desktop"] #recycling-center-panel [data-recycling-operation-part="production"] > div {
  padding:8px 5px; min-width:0;
}
[data-game-composition="desktop"] #recycling-center-panel #recycling-upgrade-list {
  display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px;
}
[data-game-composition="desktop"] #recycling-center-panel .early-mobile-upgrade-page {
  display:none!important;
}
[data-game-composition="desktop"] .employment-panel .interview-pane-tabs,
[data-game-composition="desktop"] .employment-panel .interview-mobile-list-page { display:none!important; }
[data-game-composition="desktop"] .employment-panel .job-layout {
  display:grid;
  grid-template-columns:minmax(0,.85fr) minmax(0,1.25fr) minmax(0,.85fr);
  grid-template-rows:minmax(0,1fr) minmax(0,1fr);
  align-content:stretch; align-items:start;
  height:calc(100% - 91px); min-height:0; gap:8px; margin:6px 0 0;
}
[data-game-composition="desktop"] .employment-panel .job-layout > #paper-doll {
  grid-column:1; grid-row:1;
  padding:7px; align-self:stretch;
}
[data-game-composition="desktop"] .employment-panel #paper-doll-slots {
  display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:4px; margin-top:5px;
}
[data-game-composition="desktop"] .employment-panel .paper-doll-slot {
  gap:3px; padding:5px;
}
[data-game-composition="desktop"] .employment-panel .job-layout > #equipment-buff-summary {
  grid-column:1; grid-row:2; align-self:stretch;
  display:grid; grid-template-columns:repeat(2,minmax(0,1fr));
  gap:4px; padding:7px;
}
[data-game-composition="desktop"] .employment-panel .job-layout > #employment-entry {
  grid-column:2 / span 2; grid-row:1 / span 2;
  display:grid; grid-template-columns:minmax(0,1.3fr) minmax(0,.9fr);
  grid-template-rows:minmax(0,1fr) auto auto;
  align-content:stretch; gap:8px; padding:7px;
  margin:0; min-width:0; min-height:0;
}
[data-game-composition="desktop"] .employment-panel #employment-entry > .outfit-checklist:not(.accessory-checklist) {
  grid-column:1; grid-row:1; min-width:0; min-height:0;
}
[data-game-composition="desktop"] .employment-panel #outfit-list {
  display:grid; grid-template-columns:repeat(2,minmax(0,1fr));
  gap:5px;
}
[data-game-composition="desktop"] .employment-panel .outfit-card {
  min-width:0; padding:6px; gap:4px;
}
[data-game-composition="desktop"] .employment-panel #employment-entry > .accessory-checklist {
  grid-column:2; grid-row:1; min-width:0;
}
[data-game-composition="desktop"] .employment-panel #employment-entry > .purchase-card {
  grid-column:1 / -1; grid-row:2;
}
[data-game-composition="desktop"] .employment-panel #employment-entry > #interview-status {
  grid-column:1 / -1; grid-row:3; margin:0;
}

/* v0.1.214 — connected desktop factory responsibility and owner dashboards */
[data-game-composition="desktop"] .career-area .factory-pane-tabs,
[data-game-composition="desktop"] .career-area .factory-mobile-resource-page,
[data-game-composition="desktop"] .career-area .factory-mobile-automation-page,
[data-game-composition="desktop"] .career-area .factory-mobile-upgrade-page,
[data-game-composition="desktop"] .business-area .business-mobile-views,
[data-game-composition="desktop"] .business-area .business-mobile-upgrade-page {display:none!important}
[data-game-composition="desktop"] .career-area .factory-work{
 display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1.17fr);
 grid-template-rows:auto minmax(0,1fr);gap:8px;align-items:start;
 min-width:0;min-height:0;height:calc(100% - 6px);margin:4px 0 0;
}
[data-game-composition="desktop"] .career-area .factory-work > .factory-career-overview{
 grid-column:1/-1;grid-row:1;display:grid;
 grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);
 gap:7px;padding:6px;margin:0;min-width:0;
}
[data-game-composition="desktop"] .career-area .factory-work .employment-stats{
 display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:3px;
}
[data-game-composition="desktop"] .career-area .factory-work .production-resources{
 display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:3px;
}
[data-game-composition="desktop"] .career-area .production-resources > div,
[data-game-composition="desktop"] .career-area .employment-stats > div{
 min-width:0;padding:4px 5px;
}
[data-game-composition="desktop"] .career-area .production-resources .art-slot{
 width:25px;height:25px;
}
[data-game-composition="desktop"] .career-area .factory-work > .factory-action{
 grid-column:1;grid-row:2;
}
[data-game-composition="desktop"] .career-area .factory-work > .factory-packaging{
 grid-column:1;grid-row:2;
}
[data-game-composition="desktop"] .career-area .factory-work[data-career-area="employee"] > .factory-packaging{
 grid-column:2;grid-row:2;
}
[data-game-composition="desktop"] .career-area .factory-work > .factory-automation{
 grid-column:2;grid-row:2;
}
[data-game-composition="desktop"] .career-area .factory-work[data-career-area="crew"] > .factory-automation{
 grid-column:1/span 2;grid-row:2;
}
[data-game-composition="desktop"] .career-area .factory-work > .employee-development{
 grid-column:3;grid-row:2;display:grid;gap:5px;align-content:start;
}
[data-game-composition="desktop"] .career-area .factory-work .factory-packaging .package-grid{
 display:grid;grid-template-columns:minmax(0,1fr);gap:4px;
}
[data-game-composition="desktop"] .career-area .factory-work .package-card{
 min-height:0;padding:5px;gap:4px;
}
[data-game-composition="desktop"] .career-area .factory-work #employee-upgrade-list{
 display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px;
}
[data-game-composition="desktop"] .career-area .factory-work .promotion-card{
 display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;
 gap:7px;padding:7px;
}
[data-game-composition="desktop"] .career-area .factory-work .promotion-card .button{
 min-width:140px;
}
[data-game-composition="desktop"] .business-area .business-owner-console{
 display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.8fr) minmax(0,1.3fr);
 grid-template-rows:auto minmax(0,1fr);gap:9px;min-width:0;
 height:calc(100% - 82px);align-content:stretch;
}
[data-game-composition="desktop"] .business-area .business-financials{
 grid-column:1/-1;grid-row:1;display:grid;
 grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;
}
[data-game-composition="desktop"] .business-area .business-action-card{
 grid-column:1;grid-row:2;display:grid;align-content:start;gap:8px;
}
[data-game-composition="desktop"] .business-area .owner-draw-card{
 grid-column:2;grid-row:2;display:grid;
 grid-template-columns:minmax(0,1fr);gap:8px;align-content:start;
}
[data-game-composition="desktop"] .business-area .business-upgrades{
 grid-column:3;grid-row:2;display:grid;
 grid-template-columns:minmax(0,1fr);gap:6px;align-content:start;
}
[data-game-composition="desktop"] .business-area #business-upgrade-list{
 display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;
}

/* v0.1.215: one connected desktop operations surface across EVERY late-game
   family. Genuine large upgrade/coin inventories remain separate, but retain
   the resource and work context needed to understand their effects. */
html[data-game-composition="desktop"] .late-game-area[data-late-main-view] {
  display:grid;
  grid-template-columns:minmax(350px,.36fr) minmax(0,1fr);
  grid-template-rows:auto auto auto minmax(0,1fr);
  align-content:stretch;align-items:start;gap:5px;
  min-width:0;min-height:0;height:100%;
}
html[data-game-composition="desktop"] .late-game-area > .late-stage-main-nav {
  grid-column:1/-1;grid-row:1;
  display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:8px;margin:0;
}
html[data-game-composition="desktop"] .late-game-area .late-stage-main-buttons {
  display:flex;align-items:stretch;justify-content:flex-end;gap:6px;
}
html[data-game-composition="desktop"] .late-game-area .late-stage-main-buttons > .button:not([hidden]) {
  flex:0 1 190px;min-width:130px;
}
html[data-game-composition="desktop"] .late-game-area[data-late-main-view] > .late-game-hero {
  grid-column:1/-1;grid-row:2;display:flex!important;
  min-height:0;margin:0;padding:5px 58px 5px 10px;
}
html[data-game-composition="desktop"] .late-game-area .late-game-hero h2 {
  font-size:1rem;line-height:1.15;margin:0 0 2px;
}
html[data-game-composition="desktop"] .late-game-area .late-game-hero p:last-child {
  font-size:.70rem;line-height:1.17;margin:0;
}
html[data-game-composition="desktop"] .late-game-area[data-late-main-view] > .late-artwork-hook {
  display:grid!important;grid-column:2;grid-row:2;z-index:1;
  width:39px;height:39px;min-height:0;margin:4px 9px 0 0;
  padding:1px;justify-self:end;align-self:start;overflow:visible;
}
html[data-game-composition="desktop"] .late-game-area > .late-artwork-hook .art-slot {
  width:30px;height:30px;object-fit:contain;
}
html[data-game-composition="desktop"] .late-game-area > .late-mobile-summary-views {
  display:none!important;
}
html[data-game-composition="desktop"] .late-game-area[data-late-main-view] > .late-resource-grid {
  grid-column:1/-1;grid-row:3;
  display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr));
  gap:5px;margin:0;
}
html[data-game-composition="desktop"] .late-game-area > .late-resource-grid > div {
  min-width:0;padding:5px 7px;
}
html[data-game-composition="desktop"] .late-game-area > .late-resource-grid span {
  font-size:.64rem;line-height:1.1;
}
html[data-game-composition="desktop"] .late-game-area > .late-resource-grid strong {
  font-size:.81rem;line-height:1.1;margin:2px 0 0;
}
html[data-game-composition="desktop"] .late-game-area[data-late-main-view="operations"] > .late-action-card,
html[data-game-composition="desktop"] .late-game-area[data-late-main-view="upgrades"] > .late-action-card,
html[data-game-composition="desktop"] .late-game-area[data-late-main-view="coin"] > .late-action-card,
html[data-game-composition="desktop"] .late-game-area[data-late-main-view="initiative"] > .late-action-card {
  grid-column:1;grid-row:4;display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr));gap:5px;
  align-content:start;min-height:0;min-width:0;padding:7px;
}
html[data-game-composition="desktop"] .late-game-area > .late-action-card > .button {
  min-width:0;min-height:34px;padding:4px 6px;font-size:.77rem;
  white-space:normal;overflow-wrap:anywhere;
}
html[data-game-composition="desktop"] .late-game-area > .late-action-card > .action-status,
html[data-game-composition="desktop"] .late-game-area > .late-action-card > [data-late-action-work],
html[data-game-composition="desktop"] .late-game-area > .late-action-card > [data-late-production-work],
html[data-game-composition="desktop"] .late-game-area > .late-action-card > [data-late-automation-work]{
  grid-column:1/-1;min-width:0;
}
html[data-game-composition="desktop"] .late-game-area > .late-action-card .late-mobile-work-views {
  display:none!important;
}
html[data-game-composition="desktop"] .late-game-area > .late-action-card .action-status {
  font-size:.71rem;line-height:1.2;margin:1px 0;
}
html[data-game-composition="desktop"] .late-game-area[data-late-main-view="operations"][data-late-has-projects="true"]
  > [data-late-stage-projects]{
  grid-column:2;grid-row:4;display:block!important;
  min-width:0;min-height:0;
}
html[data-game-composition="desktop"] .late-game-area[data-late-main-view="operations"][data-late-has-projects="false"]
  > [data-late-stage-projects] {display:none!important}
html[data-game-composition="desktop"] .late-game-area[data-late-main-view="operations"][data-late-has-projects="false"]
  > .late-action-card {grid-column:1/-1}
html[data-game-composition="desktop"] .late-game-area[data-late-main-view="initiative"]
  > [data-late-stage-projects]{
  grid-column:2;grid-row:4;display:block!important;min-width:0;
}
html[data-game-composition="desktop"] .late-game-area[data-late-main-view="upgrades"]
  > [data-late-upgrades]:not([hidden]){
  grid-column:2;grid-row:4;display:grid!important;
  grid-template-columns:minmax(0,1fr);gap:5px;
  align-content:start;min-width:0;min-height:0;
}
html[data-game-composition="desktop"] .late-game-area[data-late-main-view="upgrades"]
  [data-late-upgrade-pager] {display:none!important}
html[data-game-composition="desktop"] .late-game-area[data-late-main-view="upgrades"]
  [data-late-upgrade-list] {
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;
}
html[data-game-composition="desktop"] .late-game-area[data-late-main-view="coin"]
  > [data-late-coin]:not([hidden]){
  grid-column:2;grid-row:4;display:grid!important;
  grid-template-columns:minmax(0,1fr);align-content:start;min-width:0;
}
html[data-game-composition="desktop"] .late-game-area[data-late-main-view="coin"]
  > [data-late-coin] [data-coin-stat-grid]{
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;
}
html[data-game-composition="desktop"] .late-game-area .late-coin-stat-pager {
  display:none!important;
}

/* v0.1.216 compact mobile bridge: keep true stage resources and a genuine
   one-click manual-work connection beside the selected project and upgrades. */
.late-stage-bridge {display:none}
[data-game-composition="mobile"] .late-game-area[data-late-main-view]:not([data-late-main-view="overview"])
 > .late-stage-bridge {
  display:grid;grid-template-columns:minmax(0,1fr) auto;
  gap:4px;align-items:center;min-width:0;margin:2px 0 4px;
  padding:4px 6px;border:1px solid #685782;border-radius:7px;background:#202336;
}
[data-game-composition="mobile"] .late-game-area .late-stage-bridge-metrics{
  display:grid;grid-template-columns:minmax(0,1fr);gap:2px;min-width:0;
}
[data-game-composition="mobile"] .late-stage-bridge-metrics span{
  font-size:.62rem;line-height:1.12;overflow-wrap:anywhere;
}
[data-game-composition="mobile"] .late-stage-bridge > .button{
  min-width:108px;min-height:30px;padding:3px 6px;font-size:.67rem;
  white-space:normal;overflow-wrap:anywhere;
}
[data-game-composition="mobile"] .late-game-area[data-late-main-view="work"]
 > .late-stage-bridge > .button {display:none}
[data-game-composition="mobile"][data-game-orientation="landscape"]
 .late-game-area .late-stage-bridge-metrics{
  grid-template-columns:repeat(2,minmax(0,1fr));gap:5px;
}
[data-game-composition="mobile"][data-game-orientation="landscape"]
 .late-stage-bridge-metrics span{font-size:.59rem}
[data-game-composition="desktop"] .late-stage-bridge{display:none!important}

/* v0.1.217: producer stock, upgrades and routes are one desktop workspace.
   Touch preserves one secondary control at a time with persistent real stock. */
html[data-game-composition="desktop"] .materials-area .material-detail-tabs,
html[data-game-composition="desktop"] .industrial-production-area .industrial-detail-tabs {display:none!important}
html[data-game-composition="desktop"] .materials-area .material-production-grid,
html[data-game-composition="desktop"] .industrial-production-area .industrial-detail-grid{
 display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;
 min-width:0;min-height:0;align-items:stretch;
}
html[data-game-composition="desktop"] .materials-area .material-production-card,
html[data-game-composition="desktop"] .industrial-production-area .industrial-detail-card{
 display:flex!important;width:auto;min-width:0;min-height:0;padding:10px;gap:8px;
}
html[data-game-composition="desktop"] .industrial-production-area .industrial-detail-card .buy-mode-selector{
 min-width:0;width:100%;
}
html[data-game-composition="desktop"] .industrial-live-strip{display:none!important}
html[data-game-composition="mobile"] .materials-area .material-production-grid{
 display:grid;grid-template-columns:minmax(0,1fr);gap:4px;min-width:0;
}
html[data-game-composition="mobile"] .materials-area [data-material-section="stock"]{
 display:flex!important;gap:2px;padding:4px 6px;
}
html[data-game-composition="mobile"] .materials-area [data-material-section="stock"] span,
html[data-game-composition="mobile"] .materials-area [data-material-section="stock"] strong{
 font-size:.64rem;line-height:1.12;margin:0;
}
html[data-game-composition="mobile"][data-game-orientation="landscape"]
 .materials-area .material-production-grid{
 grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);
}
html[data-game-composition="mobile"] .industrial-production-area .industrial-live-strip{
 display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px;
 min-width:0;margin:2px 0;padding:3px 5px;border:1px solid #655b87;border-radius:7px;
}
html[data-game-composition="mobile"] .industrial-live-strip span{
 min-width:0;font-size:.68rem;line-height:1.15;overflow-wrap:anywhere;
}
html[data-game-composition="mobile"][data-game-orientation="landscape"]
 .industrial-live-strip span{font-size:.6rem}

/* v0.1.218: desktop era navigation must expose unlocked destinations
   directly rather than forcing blind multi-page navigation. */
html[data-game-composition="desktop"] .main-navigation,
html[data-game-composition="desktop"] .sub-navigation{
 display:flex;flex-direction:row;flex-wrap:nowrap;
 align-items:stretch;gap:4px;overflow:visible;
}
html[data-game-composition="desktop"] .main-navigation > .game-tab:not(.nav-page-control),
html[data-game-composition="desktop"] .sub-navigation > .game-tab:not(.nav-page-control){
 flex:1 1 0;min-width:0;min-height:33px;padding:3px 5px;
 font-size:.78rem;line-height:1.13;white-space:normal;overflow-wrap:normal;
}
/* One selected Strategic Project is already a deliberate full-screen
   project surface; its costs, effects, planner, and purchase/reserve action
   are inseparable details and belong in one visible comparison. */
html[data-game-composition="desktop"] .legacy-project-board[data-collapsed="false"]{
 display:grid;grid-template-rows:auto auto minmax(0,1fr);gap:6px;
}
html[data-game-composition="desktop"] .legacy-project-board #strategic-mobile-views,
html[data-game-composition="desktop"] .legacy-project-board .strategic-benefit-pager{
 display:none!important;
}
html[data-game-composition="desktop"] .legacy-project-board[data-collapsed="false"] .legacy-project-card{
 display:grid;grid-template-columns:auto minmax(0,1fr);
 align-items:start;gap:9px;
}
html[data-game-composition="desktop"] .legacy-project-board[data-collapsed="false"] .legacy-project-card > div{
 display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
 align-items:start;gap:9px;min-width:0;
}
html[data-game-composition="desktop"] .legacy-project-board[data-collapsed="false"] .legacy-project-card h3{
 grid-column:1/-1;margin:0;
}
html[data-game-composition="desktop"] .legacy-project-board[data-collapsed="false"] .legacy-project-card .strategic-part{
 display:block!important;min-width:0;padding:9px;
 border:1px solid #485a72;border-radius:8px;
 background:rgba(0,0,0,.14);
}
html[data-game-composition="desktop"] .legacy-project-board[data-collapsed="false"]
 .legacy-project-card [data-strategic-part="costs"] {grid-column:1;grid-row:2}
html[data-game-composition="desktop"] .legacy-project-board[data-collapsed="false"]
 .legacy-project-card [data-strategic-part="benefits"] {grid-column:2;grid-row:2}
html[data-game-composition="desktop"] .legacy-project-board[data-collapsed="false"]
 .legacy-project-card [data-strategic-part="plan"] {grid-column:1;grid-row:3}
html[data-game-composition="desktop"] .legacy-project-board[data-collapsed="false"]
 .legacy-project-card [data-strategic-part="actions"] {grid-column:2;grid-row:3}
html[data-game-composition="desktop"] .legacy-project-board[data-collapsed="false"]
 .legacy-project-card .strategic-benefit-full{display:block!important;line-height:1.3}
html[data-game-composition="desktop"] .legacy-project-board[data-collapsed="false"]
 .legacy-project-card .strategic-benefit-single{display:none!important}

/* v0.1.219: Keep real Beach results and both sale actions beside the sweep
   operation on touch screens; supplementary upgrades/accessory collection
   deserve separate screens only because they do not fit this primary loop. */
html[data-game-composition="mobile"] #beach-panel .beach-pane-tabs {
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:3px;
}
html[data-game-composition="mobile"] #beach-panel .beach-pane-tabs [data-beach-pane="inventory"] {
  display:none!important;
}
html[data-game-composition="mobile"] #beach-panel[data-beach-active-pane="search"] .beach-layout {
  display:grid;grid-template-columns:minmax(0,1fr);
  grid-template-rows:minmax(0,.9fr) minmax(0,1.1fr);
  min-width:0;min-height:0;height:calc(100% - 85px);
  align-items:start;align-content:stretch;gap:5px;
}
html[data-game-composition="mobile"] #beach-panel[data-beach-active-pane="search"]
 .beach-layout > .beach-action {
  grid-column:1;grid-row:1;display:grid;align-content:start;gap:2px;min-width:0;
}
html[data-game-composition="mobile"] #beach-panel[data-beach-active-pane="search"]
 .beach-layout > .beach-inventory-panel {
  grid-column:1;grid-row:2;display:grid;align-content:start;gap:3px;
  min-width:0;min-height:0;padding:4px;
}
html[data-game-composition="mobile"] #beach-panel[data-beach-active-pane="search"]
 .beach-inventory-panel .panel-heading {gap:4px;margin:0}
html[data-game-composition="mobile"] #beach-panel[data-beach-active-pane="search"]
 .beach-inventory-panel .panel-heading h3 {font-size:.78rem;line-height:1.08;margin:0}
html[data-game-composition="mobile"] #beach-panel[data-beach-active-pane="search"]
 .beach-inventory-panel .inventory-list{grid-template-columns:minmax(0,1fr);gap:3px;margin:0}
html[data-game-composition="mobile"] #beach-panel[data-beach-active-pane="search"]
 .beach-inventory-panel .inventory-row {
  display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px;
  align-items:center;min-height:0;
}
html[data-game-composition="mobile"] #beach-panel[data-beach-active-pane="search"]
 .beach-inventory-panel > h3 {font-size:.74rem;margin:1px 0}
html[data-game-composition="mobile"] #beach-panel[data-beach-active-pane="search"]
 .beach-inventory-panel > .action-status{font-size:.64rem;line-height:1.1;margin:1px 0}
html[data-game-composition="mobile"][data-game-orientation="landscape"]
 #beach-panel[data-beach-active-pane="search"] .beach-layout {
  grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);
  grid-template-rows:minmax(0,1fr);height:calc(100% - 85px);
}
html[data-game-composition="mobile"][data-game-orientation="landscape"]
 #beach-panel[data-beach-active-pane="search"] .beach-layout > .beach-action {
  grid-column:1;grid-row:1;
}
html[data-game-composition="mobile"][data-game-orientation="landscape"]
 #beach-panel[data-beach-active-pane="search"] .beach-layout > .beach-inventory-panel {
  grid-column:2;grid-row:1;
}
html[data-game-composition="mobile"][data-game-orientation="landscape"]
 #beach-panel[data-beach-active-pane="search"] .beach-art {
  display:none; /* only decoration; true sweep/progress controls remain */
}

/* v0.1.220: compact mobile Owner's Desk permanently joins its real
   financial outcome, generating work and retained-earnings draw. The
   independently long reinvestment catalog keeps the same live financial
   outcome above its selected legitimate upgrade. */
html[data-game-composition="mobile"] .business-area .business-mobile-views {
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px;
}
html[data-game-composition="mobile"] .business-area .business-mobile-views
 [data-business-owner-view="operations"],
html[data-game-composition="mobile"] .business-area .business-mobile-views
 [data-business-owner-view="draw"] {display:none!important}
html[data-game-composition="mobile"] .business-area .business-owner-console {
  display:grid;grid-template-columns:minmax(0,1fr);gap:5px;
  min-width:0;min-height:0;align-content:start;
}
html[data-game-composition="mobile"] .business-area .business-owner-console
 .business-financials:not([hidden]) {
  grid-column:1;grid-row:2;display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));gap:3px;
}
html[data-game-composition="mobile"] .business-area .business-owner-console
 .business-financials > div{padding:5px 6px;min-width:0}
html[data-game-composition="mobile"] .business-area .business-owner-console
 .business-financials span{font-size:.61rem;line-height:1.1}
html[data-game-composition="mobile"] .business-area .business-owner-console
 .business-financials strong{font-size:.74rem;line-height:1.14}
html[data-game-composition="mobile"] .business-area .business-owner-console[data-owner-view="desk"]
 .business-action-card:not([hidden]){
  grid-column:1;grid-row:3;min-width:0;
}
html[data-game-composition="mobile"] .business-area .business-owner-console[data-owner-view="desk"]
 .owner-draw-card:not([hidden]){
  grid-column:1;grid-row:4;min-width:0;
  display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  align-items:end;gap:4px;
}
html[data-game-composition="mobile"] .business-area .business-owner-console[data-owner-view="desk"]
 .owner-draw-card label{grid-column:1/-1}
html[data-game-composition="mobile"] .business-area .business-owner-console[data-owner-view="desk"]
 .owner-draw-card input{grid-column:1;min-width:0}
html[data-game-composition="mobile"] .business-area .business-owner-console[data-owner-view="desk"]
 .owner-draw-card button{grid-column:2;min-width:0;font-size:.67rem}
html[data-game-composition="mobile"] .business-area .business-owner-console[data-owner-view="upgrades"]
 .business-upgrades:not([hidden]){
  grid-column:1;grid-row:3;min-width:0;
}
html[data-game-composition="mobile"][data-game-orientation="landscape"]
 .business-area .business-owner-console[data-owner-view="desk"]{
  grid-template-columns:repeat(2,minmax(0,1fr));
}
html[data-game-composition="mobile"][data-game-orientation="landscape"]
 .business-area .business-owner-console .business-mobile-views{
  grid-column:1/-1;grid-row:1;
}
html[data-game-composition="mobile"][data-game-orientation="landscape"]
 .business-area .business-owner-console .business-financials:not([hidden]){
  grid-column:1/-1;grid-row:2;
  grid-template-columns:repeat(4,minmax(0,1fr));
}
html[data-game-composition="mobile"][data-game-orientation="landscape"]
 .business-area .business-owner-console[data-owner-view="desk"]
 .business-action-card:not([hidden]){
  grid-column:1;grid-row:3;
}
html[data-game-composition="mobile"][data-game-orientation="landscape"]
 .business-area .business-owner-console[data-owner-view="desk"]
 .owner-draw-card:not([hidden]){
  grid-column:2;grid-row:3;
}

/* v0.1.221: three meaningful compact Interview destinations instead of
   five disconnected fragments. Gear and its resulting real buffs share
   a view, while genuine outfit purchase, earned accessory requirement and
   actual milestone button remain visible together on the default screen. */
html[data-game-composition="mobile"] .employment-panel .interview-pane-tabs {
 display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:3px;
}
html[data-game-composition="mobile"] .employment-panel .interview-pane-tabs
 [data-interview-pane="buffs"],
html[data-game-composition="mobile"] .employment-panel .interview-pane-tabs
 [data-interview-pane="interview"]{display:none!important}
html[data-game-composition="mobile"] .employment-panel .interview-pane-tabs > .button{
 min-height:29px;padding:3px 4px;font-size:.67rem;line-height:1.1;
}
html[data-game-composition="mobile"] .employment-panel[data-interview-active-pane="look"]
 .job-layout{
 display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto;
 gap:4px;align-content:start;
}
html[data-game-composition="mobile"] .employment-panel[data-interview-active-pane="look"]
 .job-layout > #paper-doll{
 grid-column:1;grid-row:1;min-height:0;
}
html[data-game-composition="mobile"] .employment-panel[data-interview-active-pane="look"]
 .job-layout > #equipment-buff-summary{
 grid-column:1;grid-row:2;min-height:0;
}
html[data-game-composition="mobile"][data-game-orientation="landscape"]
 .employment-panel[data-interview-active-pane="look"] .job-layout {
 grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:auto;gap:4px;
}
html[data-game-composition="mobile"][data-game-orientation="landscape"]
 .employment-panel[data-interview-active-pane="look"] .job-layout > #paper-doll {
 grid-column:1;grid-row:1;
}
html[data-game-composition="mobile"][data-game-orientation="landscape"]
 .employment-panel[data-interview-active-pane="look"] .job-layout > #equipment-buff-summary{
 grid-column:2;grid-row:1;
}
html[data-game-composition="mobile"] .employment-panel[data-interview-active-pane="outfit"]
 #employment-entry{
 display:grid;grid-template-columns:minmax(0,1fr);
 grid-template-rows:auto auto auto auto;gap:4px;align-content:start;
}
html[data-game-composition="mobile"] .employment-panel[data-interview-active-pane="outfit"]
 #employment-entry > .outfit-checklist:not(.accessory-checklist){
 grid-column:1;grid-row:1;padding:5px;min-width:0;
}
html[data-game-composition="mobile"] .employment-panel[data-interview-active-pane="outfit"]
 #employment-entry > .accessory-checklist{
 grid-column:1;grid-row:2;min-width:0;padding:3px 5px;
}
html[data-game-composition="mobile"] .employment-panel[data-interview-active-pane="outfit"]
 #employment-entry > .accessory-checklist > :not(#interview-accessory-progress){
 display:none!important;
}
html[data-game-composition="mobile"] .employment-panel[data-interview-active-pane="outfit"]
 #interview-accessory-progress{font-size:.69rem;line-height:1.14;margin:1px 0}
html[data-game-composition="mobile"] .employment-panel[data-interview-active-pane="outfit"]
 #employment-entry > .purchase-card{
 grid-column:1;grid-row:3;padding:5px;gap:4px;min-width:0;
}
html[data-game-composition="mobile"] .employment-panel[data-interview-active-pane="outfit"]
 #employment-entry > #interview-status{
 grid-column:1;grid-row:4;min-width:0;margin:1px 0;font-size:.64rem;
}
html[data-game-composition="mobile"][data-game-orientation="landscape"]
 .employment-panel[data-interview-active-pane="outfit"] #employment-entry{
 grid-template-columns:repeat(2,minmax(0,1fr));
 grid-template-rows:auto auto auto;gap:4px;
}
html[data-game-composition="mobile"][data-game-orientation="landscape"]
 .employment-panel[data-interview-active-pane="outfit"]
 #employment-entry > .outfit-checklist:not(.accessory-checklist){
 grid-column:1;grid-row:1/span 3;
}
html[data-game-composition="mobile"][data-game-orientation="landscape"]
 .employment-panel[data-interview-active-pane="outfit"] #employment-entry > .accessory-checklist{
 grid-column:2;grid-row:1;
}
html[data-game-composition="mobile"][data-game-orientation="landscape"]
 .employment-panel[data-interview-active-pane="outfit"] #employment-entry > .purchase-card{
 grid-column:2;grid-row:2;
}
html[data-game-composition="mobile"][data-game-orientation="landscape"]
 .employment-panel[data-interview-active-pane="outfit"] #employment-entry > #interview-status{
 grid-column:2;grid-row:3;
}

/* v0.1.222: Mobile Recycling keeps the complete routing -> material -> live
   processing chain visible. Improvements may be selected, but never replace
   the real operation whose behavior they modify. */
[data-game-composition="mobile"] #recycling-center-panel {
  display:grid; grid-template-rows:auto auto auto minmax(0,1fr);
  align-content:start; gap:3px; min-width:0;
}
[data-game-composition="mobile"] #recycling-center-panel > p {
  margin:1px 0 2px; font-size:.64rem; line-height:1.1;
}
[data-game-composition="mobile"] #recycling-center-panel .recycling-pane-tabs {
  grid-template-columns:repeat(3,minmax(0,1fr)); margin:1px 0 3px;
}
[data-game-composition="mobile"] #recycling-center-panel .recycling-pane-tabs > [data-recycling-pane="operations"] {
  display:none;
}
[data-game-composition="mobile"] #recycling-center-panel .recycling-pane-tabs {
  grid-template-columns:repeat(2,minmax(0,1fr));
}
[data-game-composition="mobile"] #recycling-center-panel .recycling-pane-tabs > [data-recycling-pane="upgrades"]::after {
  content:"Improve";
  font-size:0;
}
[data-game-composition="mobile"] #recycling-center-panel .recycling-mobile-operation-tabs {
  display:none!important;
}
[data-game-composition="mobile"] #recycling-center-panel > [data-recycling-section="operations"] {
  display:grid!important;
  grid-template-columns:minmax(0,1fr);
  gap:3px; padding:4px; border:1px solid #355746; border-radius:7px;
  background:rgba(20,52,39,.24);
}
[data-game-composition="mobile"] #recycling-center-panel .recycling-control-grid {
  display:grid; grid-template-columns:minmax(0,1fr); gap:3px;
}
[data-game-composition="mobile"] #recycling-center-panel .recycling-control-grid .developer-button-row {
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:3px;
}
[data-game-composition="mobile"] #recycling-center-panel .recycling-control-grid .developer-button-row > button {
  min-width:0; min-height:25px; padding:2px; font-size:.58rem; line-height:1.08;
}
[data-game-composition="mobile"] #recycling-center-panel .late-resource-grid {
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:3px;
}
[data-game-composition="mobile"] #recycling-center-panel .automation-work {
  display:grid; gap:2px; margin:0; font-size:.62rem;
}
[data-game-composition="mobile"] #recycling-center-panel > [data-recycling-section="upgrades"]:not([hidden]),
[data-game-composition="mobile"] #recycling-center-panel > [data-recycling-section="lines"]:not([hidden]) {
  display:grid; align-content:start; gap:3px; min-width:0; padding:4px;
}
[data-game-composition="mobile"] #recycling-center-panel #recycling-upgrade-list {
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:3px;
}
[data-game-composition="mobile"] #recycling-center-panel #recycling-upgrade-list .compact-upgrade-card {
  min-height:54px; padding:4px;
}
[data-game-composition="mobile"] #recycling-center-panel #recycling-upgrade-list .compact-upgrade-copy strong,
[data-game-composition="mobile"] #recycling-center-panel #recycling-upgrade-list .compact-upgrade-copy small,
[data-game-composition="mobile"] #recycling-center-panel #recycling-upgrade-list .compact-upgrade-copy em {
  font-size:.58rem; line-height:1.08;
}
[data-game-composition="mobile"] #recycling-center-panel .early-mobile-upgrade-page {
  display:none!important;
}
[data-game-composition="mobile"][data-game-orientation="landscape"] #recycling-center-panel {
  grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);
  grid-template-rows:auto auto minmax(0,1fr);
}
[data-game-composition="mobile"][data-game-orientation="landscape"] #recycling-center-panel > .panel-heading,
[data-game-composition="mobile"][data-game-orientation="landscape"] #recycling-center-panel > p {
  grid-column:1 / -1;
}
[data-game-composition="mobile"][data-game-orientation="landscape"] #recycling-center-panel .recycling-pane-tabs {
  grid-column:2; grid-row:3; align-self:start;
}
[data-game-composition="mobile"][data-game-orientation="landscape"] #recycling-center-panel > [data-recycling-section="operations"] {
  grid-column:1; grid-row:3;
}
[data-game-composition="mobile"][data-game-orientation="landscape"] #recycling-center-panel > [data-recycling-section="upgrades"]:not([hidden]),
[data-game-composition="mobile"][data-game-orientation="landscape"] #recycling-center-panel > [data-recycling-section="lines"]:not([hidden]) {
  grid-column:2; grid-row:3; margin-top:34px;
}

/* v0.1.223: Compact Factory career = one real workstation plus Improve. */
[data-game-composition="mobile"] .career-area .factory-pane-tabs { grid-template-columns:repeat(2,minmax(0,1fr)); gap:4px; }
[data-game-composition="mobile"] .career-area .factory-career-overview:not([hidden]) { display:grid!important; padding:4px; gap:3px; }
[data-game-composition="mobile"] .career-area .factory-mobile-resource-page,
[data-game-composition="mobile"] .career-area .factory-mobile-automation-page { display:none!important; }
[data-game-composition="mobile"] .career-area .production-resources {
  display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:2px;
}
[data-game-composition="mobile"] .career-area .production-resources > div { min-width:0; padding:3px; text-align:center; }
[data-game-composition="mobile"] .career-area .production-resources .art-slot { display:none; }
[data-game-composition="mobile"] .career-area .production-resources span { font-size:.52rem; line-height:1.05; overflow-wrap:anywhere; }
[data-game-composition="mobile"] .career-area .production-resources strong { font-size:.65rem; }
[data-game-composition="mobile"] .career-area .employment-stats { grid-template-columns:repeat(2,minmax(0,1fr)); gap:2px; }
[data-game-composition="mobile"] .career-area .employment-stats > div { padding:3px; }
[data-game-composition="mobile"] .career-area .factory-work[data-factory-active-pane="production"] .employee-development {
  display:block!important; padding:3px; background:transparent; border:0;
}
[data-game-composition="mobile"] .career-area .factory-work[data-factory-active-pane="production"]
  .employee-development > :not(.promotion-card) { display:none!important; }
[data-game-composition="mobile"] .career-area .factory-work[data-factory-active-pane="upgrades"] .factory-action,
[data-game-composition="mobile"] .career-area .factory-work[data-factory-active-pane="upgrades"] .factory-packaging,
[data-game-composition="mobile"] .career-area .factory-work[data-factory-active-pane="upgrades"] .factory-automation { display:none!important; }
[data-game-composition="mobile"] .career-area #factory-automation-status {
  display:grid; grid-template-columns:minmax(0,1fr); gap:3px;
}
[data-game-composition="mobile"] .career-area #factory-automation-status > [data-factory-automation-row] { display:grid!important; min-width:0; }
[data-game-composition="mobile"] .career-area .factory-mobile-upgrade-page:not([hidden]) {
  display:grid; grid-template-columns:minmax(0,1fr); gap:3px;
}
[data-game-composition="mobile"] .career-area .factory-mobile-upgrade-page > button,
[data-game-composition="mobile"] .career-area .factory-mobile-upgrade-page > strong { display:none!important; }
[data-game-composition="mobile"] #factory-mobile-upgrade-select {
  display:block; box-sizing:border-box; width:100%; min-width:0; min-height:28px; padding:3px 5px;
  border:1px solid #586f86; border-radius:6px; color:var(--ink); background:#172330; font:inherit; font-size:.68rem;
}
[data-game-composition="mobile"] .career-area .promotion-card { padding:4px; gap:4px; font-size:.65rem; }
[data-game-composition="mobile"] .career-area .promotion-card .upgrade-effect { font-size:.6rem; line-height:1.08; }
[data-game-composition="mobile"][data-game-orientation="landscape"] .career-area .factory-work {
  grid-template-columns:minmax(0,.72fr) minmax(0,1.28fr); gap:4px;
}
[data-game-composition="mobile"][data-game-orientation="landscape"] .career-area .factory-pane-tabs,
[data-game-composition="mobile"][data-game-orientation="landscape"] .career-area .factory-career-overview { grid-column:1; }
[data-game-composition="mobile"][data-game-orientation="landscape"] .career-area .factory-action,
[data-game-composition="mobile"][data-game-orientation="landscape"] .career-area .factory-packaging,
[data-game-composition="mobile"][data-game-orientation="landscape"] .career-area .factory-automation,
[data-game-composition="mobile"][data-game-orientation="landscape"] .career-area .employee-development { grid-column:2; }

/* v0.1.224: Small finite early-game choices stay visible together. */
[data-game-composition="mobile"] .early-mobile-upgrade-page,
[data-game-composition="mobile"] .crew-mobile-views,
[data-game-composition="mobile"] .crew-mobile-purchase-page { display:none!important; }

[data-game-composition="mobile"] .upgrades-panel #upgrade-list {
  display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:4px;
}
[data-game-composition="mobile"] .automation-panel #crew-upgrade-list {
  display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:4px;
}
[data-game-composition="mobile"] .beach-upgrades #beach-upgrade-list,
[data-game-composition="mobile"] #recycling-center-panel #recycling-upgrade-list {
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:3px;
}
[data-game-composition="mobile"] :is(#upgrade-list,#crew-upgrade-list,#beach-upgrade-list,#recycling-upgrade-list)
  > [data-compact-upgrade-card] {
  display:grid!important; min-width:0; min-height:52px; padding:4px;
}
[data-game-composition="mobile"] :is(#upgrade-list,#crew-upgrade-list,#beach-upgrade-list,#recycling-upgrade-list)
  .compact-upgrade-copy strong {
  font-size:.62rem; line-height:1.05;
}
[data-game-composition="mobile"] :is(#upgrade-list,#crew-upgrade-list,#beach-upgrade-list,#recycling-upgrade-list)
  .compact-upgrade-copy small,
[data-game-composition="mobile"] :is(#upgrade-list,#crew-upgrade-list,#beach-upgrade-list,#recycling-upgrade-list)
  .compact-upgrade-copy em {
  font-size:.56rem; line-height:1.05;
}

[data-game-composition="mobile"] .automation-panel .automation-grid {
  display:grid; grid-template-columns:minmax(0,1fr); gap:4px; margin:2px 0;
}
[data-game-composition="mobile"] .automation-panel .operation-status {
  display:grid!important; padding:4px; gap:3px;
}
[data-game-composition="mobile"] .automation-panel .progression-purchases {
  display:grid!important; grid-template-columns:repeat(3,minmax(0,1fr)); gap:3px;
}
[data-game-composition="mobile"] .automation-panel .progression-purchases > .purchase-card {
  display:grid!important; grid-template-columns:minmax(0,1fr);
  align-content:start; gap:2px; min-width:0; padding:4px;
}
[data-game-composition="mobile"] .automation-panel .progression-purchases .art-slot { display:none; }
[data-game-composition="mobile"] .automation-panel .progression-purchases .upgrade-name { font-size:.61rem; }
[data-game-composition="mobile"] .automation-panel .progression-purchases .upgrade-effect {
  font-size:.55rem; line-height:1.05;
}
[data-game-composition="mobile"] .automation-panel .progression-purchases .upgrade-actions,
[data-game-composition="mobile"] .automation-panel .progression-purchases .purchase-card > .button {
  grid-column:1; width:100%; min-width:0; min-height:25px; padding:2px; font-size:.58rem;
}
[data-game-composition="mobile"] .automation-panel #crew-upgrade-section:not([hidden]) {
  display:grid; gap:3px; margin:2px 0;
}
[data-game-composition="mobile"][data-game-orientation="landscape"] .automation-panel .automation-grid {
  grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);
}
[data-game-composition="mobile"][data-game-orientation="landscape"] .automation-panel #crew-upgrade-section:not([hidden]) {
  grid-template-columns:auto minmax(0,1fr); align-items:start;
}

/* v0.1.225: Bounded catalogs stay bounded, but selection is direct and named. */
[data-game-composition="mobile"] .employment-panel .interview-mobile-list-page:not([hidden]) {
  display:grid; grid-template-columns:minmax(0,1fr); gap:3px;
}
[data-game-composition="mobile"] .employment-panel .interview-mobile-list-page > button,
[data-game-composition="mobile"] .employment-panel .interview-mobile-list-page > strong {
  display:none!important;
}
[data-game-composition="mobile"] .employment-panel [data-interview-list-select] {
  display:block; box-sizing:border-box; width:100%; min-width:0; min-height:27px; padding:3px 5px;
  border:1px solid #8a6c4c; border-radius:6px; color:var(--ink); background:#2a2118; font:inherit; font-size:.65rem;
}
[data-game-composition="mobile"] .clothing-mobile-slot-page { display:none!important; }
[data-game-composition="mobile"] .clothing-shop-filters {
  display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:3px;
}
[data-game-composition="mobile"] .clothing-shop-filters > [data-clothing-slot] {
  display:block!important; min-width:0; min-height:25px; padding:2px; font-size:.61rem;
}
[data-game-composition="mobile"] .clothing-mobile-item-page:not([hidden]) {
  display:grid; grid-template-columns:minmax(0,1fr); gap:3px;
}
[data-game-composition="mobile"] .clothing-mobile-item-page > button,
[data-game-composition="mobile"] .clothing-mobile-item-page > strong { display:none!important; }
[data-game-composition="mobile"] [data-clothing-item-select] {
  display:block; box-sizing:border-box; width:100%; min-width:0; min-height:28px; padding:3px 5px;
  border:1px solid #8b704d; border-radius:6px; color:var(--ink); background:#2b241a; font:inherit; font-size:.67rem;
}

/* v0.1.226: finite utility paging stays bounded but is directly addressable. */
:is([data-game-composition="desktop"],[data-game-composition="mobile"])
  :is(.statistics-mobile-group-page,.statistics-mobile-entry-page,.diagnostics-mobile-page,.resource-settings-mobile-page):not([hidden]) {
  display:grid; grid-template-columns:minmax(0,1fr); gap:4px;
}
:is([data-game-composition="desktop"],[data-game-composition="mobile"])
  :is(.statistics-mobile-group-page,.statistics-mobile-entry-page,.diagnostics-mobile-page,.resource-settings-mobile-page)
  > :is(button,strong) {
  display:none!important;
}
:is([data-game-composition="desktop"],[data-game-composition="mobile"])
  :is([data-statistics-group-select],[data-statistics-entry-select],[data-diagnostics-select],[data-resource-settings-select]) {
  display:block; box-sizing:border-box; width:100%; min-width:0; min-height:29px; padding:4px 6px;
  border:1px solid #657c92; border-radius:6px; color:var(--ink); background:#172431; font:inherit; font-size:.7rem;
}

/* v0.1.227: Strategic Projects remain one deliberate complete card at a time,
   but discovery is direct by name instead of Previous/Next hunting. */
.legacy-board-pager > #legacy-board-previous,
.legacy-board-pager > #legacy-board-next { display:none!important; }
[data-strategic-project-select],
[data-strategic-benefit-select] {
  box-sizing:border-box; width:min(330px,100%); min-width:0; min-height:27px; padding:3px 6px;
  border:1px solid #6f89a3; border-radius:6px; color:var(--ink); background:#172534; font:inherit; font-size:.67rem;
}
.legacy-board-pager {
  display:grid; grid-template-columns:minmax(0,1fr); gap:3px; justify-items:end;
}
.legacy-board-pager > span {
  max-width:330px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
[data-game-composition="mobile"] .legacy-board-pager { justify-items:stretch; }
[data-game-composition="mobile"] [data-strategic-project-select],
[data-game-composition="mobile"] [data-strategic-benefit-select] { width:100%; font-size:.62rem; }
[data-game-composition="mobile"] .strategic-benefit-pager:not([hidden]) {
  display:grid; grid-template-columns:minmax(0,1fr); gap:3px;
}
[data-game-composition="mobile"] .strategic-benefit-pager > :is(button,strong) { display:none!important; }

/* v0.1.228: Compact navigation keeps quick buttons but never hides unlocked
   eras/stages behind Previous/Next. Direct named jump controls expose all. */
[data-game-composition="mobile"] .nav-page-control { display:none!important; }
[data-game-composition="mobile"] .nav-direct-select {
  box-sizing:border-box; grid-column:1 / -1; width:100%; min-width:0;
  min-height:28px; padding:3px 6px; border:1px solid #6f8da7; border-radius:7px;
  color:#eef7ff; background:#172b3b; font:inherit; font-size:.66rem;
}
[data-game-composition="mobile"] .sub-navigation .nav-direct-select {
  border-color:#756c91; background:#252039;
}
[data-game-composition="mobile"][data-game-orientation="landscape"] .main-navigation .nav-direct-select {
  min-height:30px; font-size:.62rem;
}

/* v0.1.229: Physical producer and investment choices are directly named.
   The currently selected real stock, output, routing and purchase controls
   remain assembled as before; no new gameplay-specific activity pages. */
.direct-producer-picker {
  display:flex; flex:1 1 350px; gap:8px; align-items:center;
  min-width:0; font-size:.73rem; color:var(--muted);
}
.direct-producer-picker > select {
  box-sizing:border-box; flex:1 1 auto; min-width:0; min-height:34px;
  padding:5px 8px; border:1px solid #7a96af; border-radius:7px;
  color:var(--ink); background:#182b3a; font:inherit; font-weight:700;
}
.material-navigation,.industrial-navigation { gap:8px; justify-content:stretch; }
.material-navigation > [data-material-previous],
.material-navigation > [data-material-next],
.material-navigation > [data-investment-previous],
.material-navigation > [data-investment-next],
.industrial-navigation > [data-industry-previous],
.industrial-navigation > [data-industry-next] {display:none!important;}
.material-navigation > strong,.industrial-navigation > strong {
  flex:0 0 auto; font-size:.66rem; white-space:nowrap;
}
[data-game-composition="mobile"] .direct-producer-picker {
  flex:1 1 auto; gap:4px; font-size:.62rem;
}
[data-game-composition="mobile"] .direct-producer-picker > select {
  min-height:27px; padding:3px 5px; font-size:.67rem;
}

/* v0.1.230: All named fixed stage target sets use a visible direct picker.
   Keep the genuine per-target operations detail intact and fully selectable. */
.late-stage-target-picker {
  display:flex; gap:6px; align-items:center; min-width:0;
  color:#e6d7ff; font-size:.72rem;
}
.late-stage-target-picker > span { flex:0 0 auto; }
.late-stage-target-picker > select {
  flex:1 1 auto; box-sizing:border-box; min-width:0; width:100%;
  min-height:33px; padding:4px 7px; border:1px solid #8976ad; border-radius:7px;
  color:#f5edff; background:#222039; font:inherit; font-weight:650;
}
[data-game-composition="desktop"] .late-game-area > .late-stage-main-nav:has(.late-stage-target-picker) {
  display:grid; grid-template-columns:minmax(105px,.22fr) minmax(0,.43fr) minmax(0,.35fr);
  align-items:center; gap:8px;
}
[data-game-composition="desktop"] .late-game-area > .late-stage-main-nav:has(.late-stage-target-picker)
 > .late-stage-main-buttons {min-width:0;}
[data-game-composition="desktop"] .late-game-area > .late-stage-main-nav:has(.late-stage-target-picker)
 .late-stage-main-buttons > .button:not([hidden]) {min-width:0; flex:1 1 auto;}
[data-game-composition="mobile"] .late-stage-target-picker {gap:4px; font-size:.61rem;}
[data-game-composition="mobile"] .late-stage-target-picker > select {
  min-height:27px; padding:3px 5px; font-size:.65rem;
}

/* v0.1.231: A strategic investment is optional context, never an
   unavoidable full-screen overlay on the main desktop gameplay. */
html[data-game-composition="desktop"] .legacy-project-board[data-collapsed="true"] {
  top:auto; left:auto; right:10px; bottom:10px;
  width:min(310px,30%); height:auto; max-height:none;
  display:block; padding:6px 9px; z-index:19;
  border:1px solid #536d86; border-radius:9px;
}
html[data-game-composition="desktop"] .legacy-project-board[data-collapsed="true"]
 .legacy-board-toolbar {
  display:flex; align-items:center; gap:7px; justify-content:space-between;
}
html[data-game-composition="desktop"] .legacy-project-board[data-collapsed="true"]
 .legacy-board-toolbar h2 {margin:0; font-size:.72rem; line-height:1.08;}
html[data-game-composition="desktop"] .legacy-project-board[data-collapsed="true"]
 #legacy-board-toggle {
  min-height:29px; padding:4px 7px; font-size:.7rem; flex:0 0 auto;
}
html[data-game-composition="desktop"] .legacy-project-board[data-collapsed="false"] {
  z-index:45;
}
html[data-game-composition="desktop"] .legacy-project-board[data-collapsed="false"]
 #legacy-board-toggle {
  min-height:30px; padding:4px 10px; font-size:.77rem;
}

/* v0.1.232: Mobile investment decisions never hide the price from the buy
   action. Cost and Purchase/Reserve are a single primary interaction; only
   optional effect details or planner shortfalls occupy a secondary view. */
html[data-game-composition="mobile"] .legacy-project-board[data-collapsed="false"]
 #strategic-mobile-views {grid-template-columns:repeat(3,minmax(0,1fr)); gap:4px;}
html[data-game-composition="mobile"] .legacy-project-board[data-collapsed="false"]
 [data-strategic-part-select="actions"] {display:none!important;}
html[data-game-composition="mobile"] .legacy-project-board[data-collapsed="false"]
 .legacy-project-card > div {
  display:grid; grid-template-columns:minmax(0,1fr); gap:5px;
}
html[data-game-composition="mobile"] .legacy-project-board[data-collapsed="false"]
 .legacy-project-card .strategic-part[data-strategic-part="costs"],
html[data-game-composition="mobile"] .legacy-project-board[data-collapsed="false"]
 .legacy-project-card .strategic-part[data-strategic-part="actions"] {
  display:block!important; min-width:0; padding:4px 6px;
  border:1px solid #53687d; border-radius:7px;
}
html[data-game-composition="mobile"] .legacy-project-board[data-collapsed="false"]
 .legacy-project-card .strategic-part[data-strategic-part="costs"] {
  grid-row:2; margin:0;
}
html[data-game-composition="mobile"] .legacy-project-board[data-collapsed="false"]
 .legacy-project-card .strategic-part[data-strategic-part="actions"] {
  grid-row:3; margin:0; border-color:#796446;
}
html[data-game-composition="mobile"] .legacy-project-board[data-collapsed="false"]
 .legacy-project-card .strategic-part[data-strategic-part="benefits"],
html[data-game-composition="mobile"] .legacy-project-board[data-collapsed="false"]
 .legacy-project-card .strategic-part[data-strategic-part="plan"] {
  grid-row:4; margin:0; padding:4px 6px;
}
html[data-game-composition="mobile"] .legacy-project-board[data-collapsed="false"]
 .legacy-project-card h3 {grid-row:1; font-size:.78rem; line-height:1.08;}
html[data-game-composition="mobile"] .legacy-project-board[data-collapsed="false"]
 .legacy-project-card .strategic-part p {font-size:.65rem; line-height:1.13;}
html[data-game-composition="mobile"] .legacy-project-board[data-collapsed="false"]
 .legacy-project-card .strategic-part[data-strategic-part="actions"] .button {
  min-height:28px; padding:3px 6px; font-size:.67rem;
}

/* v0.1.233: The same directly selected REAL stage target now works through
   dynamic exploration/discovery (only known targets), not merely fixed
   old-world stages. Recover the space taken by redundant blind target arrows;
   keep nested non-target subtask/phase controls intact. */
html .late-game-area:has(.late-stage-target-picker)
 :is([data-supply-previous],[data-supply-next],[data-integration-previous],[data-integration-next],[data-market-previous],[data-market-next],[data-global-previous],[data-global-next],[data-civic-previous],[data-civic-next],[data-regional-prev],[data-regional-next],[data-national-prev],[data-national-next],[data-country-prev],[data-country-next],[data-bloc-prev],[data-bloc-next],[data-continent-prev],[data-continent-next],[data-planetary-prev],[data-planetary-next],[data-space-prev],[data-space-next],[data-orbital-prev],[data-orbital-next],[data-dyson-prev],[data-dyson-next],[data-solar-prev],[data-solar-next],[data-cluster-prev],[data-cluster-next],[data-galaxy-sector-prev],[data-galaxy-sector-next],[data-freight-prev],[data-freight-next],[data-federation-prev],[data-federation-next],[data-constellation-prev],[data-constellation-next],[data-universe-prev],[data-universe-next],[data-cosmic-prev],[data-cosmic-next],[data-multi-prev],[data-multi-next],[data-bridge-prev],[data-bridge-next],[data-reality-prev],[data-reality-next],[data-core-prev],[data-core-next],[data-formation-prev],[data-formation-next],[data-corp-division-prev],[data-corp-division-next],[data-subsidiary-prev],[data-subsidiary-next],[data-holding-prev],[data-holding-next],[data-shell-prev],[data-shell-next],[data-deal-prev],[data-deal-next]) {
  display:none!important;
}

/* v0.1.234: Every compact late-game family has ONE real operations
   workspace: actual resources and stage state, existing manual action, its
   live state and the actual selected project are connected in the same view.
   Large independent Upgrade, Coin and optional Initiative details remain
   explicitly separate; never multiply Overview/Work/Projects just to fit. */
html[data-game-composition="mobile"] .late-game-area[data-late-main-view="operations"]
 > .late-stage-projects {
  display:none!important;
}
html[data-game-composition="mobile"] .late-game-area[data-late-main-view="operations"]
 [data-late-stage-projects] [hidden] {display:none!important;}
html[data-game-composition="mobile"] .late-game-area[data-late-main-view="operations"]
 > .late-resource-grid,
html[data-game-composition="mobile"] .late-game-area[data-late-main-view="operations"]
 > .late-mobile-summary-views,
html[data-game-composition="mobile"] .late-game-area[data-late-main-view="operations"]
 > .late-artwork-hook {display:none!important;}
html[data-game-composition="mobile"] .late-game-area[data-late-main-view="operations"]
 > .late-game-hero {display:none!important;}
html[data-game-composition="mobile"] .late-game-area[data-late-main-view="operations"][data-late-has-projects="true"]
 > [data-late-stage-projects]:not([hidden]) {
  display:block!important; min-width:0; min-height:0; margin:1px 0;
}
html[data-game-composition="mobile"] .late-game-area[data-late-main-view="operations"][data-late-has-projects="true"]
 > .late-action-card {display:none!important;}
html[data-game-composition="mobile"] .late-game-area[data-late-main-view="operations"][data-late-has-projects="false"]
 > .late-action-card:not([hidden]) {
  display:grid!important; min-width:0; min-height:0; align-content:start;
}
html[data-game-composition="mobile"] .late-game-area[data-late-main-view="operations"]
 > .late-stage-bridge {
  display:grid!important; grid-template-columns:minmax(0,1fr) auto;
  gap:4px; padding:4px 5px; margin:2px 0 4px;
}
html[data-game-composition="mobile"] .late-game-area > .late-stage-bridge .late-stage-bridge-metrics {
  display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:2px 5px;
}
html[data-game-composition="mobile"] .late-stage-bridge-metrics span {
  min-width:0; font-size:.59rem; line-height:1.08; overflow-wrap:anywhere;
}
html[data-game-composition="mobile"] .late-game-area[data-late-main-view="operations"]
 > .late-stage-bridge[data-bridge-has-projects="false"] > .button {
  display:none!important;
}
html[data-game-composition="mobile"] .late-game-area .late-stage-main-buttons {
  grid-template-columns:repeat(3,minmax(0,1fr));
}
html[data-game-composition="mobile"][data-game-orientation="landscape"]
 .late-game-area > .late-stage-bridge .late-stage-bridge-metrics {
  grid-template-columns:repeat(4,minmax(0,1fr)); gap:4px;
}

/* v0.1.235: Small finite late-stage upgrade families are a single comparison,
   not one invisible upgrade per nested pager. The actual buy controls keep
   their original game handlers and share the existing per-stage Buy mode. */
html[data-game-composition="mobile"] .late-game-area [data-late-upgrade-pager] {
  display:none!important;
}
html[data-game-composition="mobile"] .late-game-area [data-late-upgrades]:not([hidden]) {
  display:grid; grid-template-columns:minmax(0,1fr); align-content:start;
  gap:4px; padding:6px; margin:0;
}
html[data-game-composition="mobile"] .late-game-area [data-late-upgrade-list] {
  display:grid; grid-template-columns:repeat(2,minmax(0,1fr));
  align-items:stretch; gap:5px; margin:0;
}
html[data-game-composition="mobile"] .late-game-area [data-late-upgrade-list] > [data-compact-upgrade-card] {
  display:grid!important; min-width:0; min-height:66px; padding:6px;
}
html[data-game-composition="mobile"] .late-game-area [data-late-upgrade-list]
 .compact-upgrade-copy :is(strong,small,em) {
  white-space:normal; overflow:visible; text-overflow:clip;
  overflow-wrap:anywhere; font-size:.64rem; line-height:1.12;
}
html[data-game-composition="mobile"] .late-game-area [data-late-upgrades]
 .upgrade-category-heading {gap:4px; margin:0;}
html[data-game-composition="mobile"] .late-game-area [data-late-upgrades]
 .buy-mode-option {min-height:25px; padding:2px 3px; font-size:.62rem;}
html[data-game-composition="mobile"][data-game-orientation="landscape"]
 .late-game-area [data-late-upgrade-list] {
  grid-template-columns:repeat(4,minmax(0,1fr)); gap:4px;
}
html[data-game-composition="mobile"][data-game-orientation="landscape"]
 .late-game-area [data-late-upgrade-list] > [data-compact-upgrade-card] {
  min-height:61px; padding:4px;
}

/* v0.1.236: A CSS multi-column desktop factory layout is meaningless if
   renderEmployment still marks all but one column [hidden] and hides the
   very tabs required to reach them. Mount every legitimately available
   responsibility action, stock, automation, upgrade and promotion together.
   Explicit grid coordinates beat obsolete more-specific single-pane rules. */
html[data-game-composition="desktop"] .career-area .factory-work {
  display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1.17fr);
  grid-template-rows:auto minmax(0,1fr); align-content:stretch;
  min-width:0; min-height:0; height:calc(100% - 6px); gap:8px;
}
html[data-game-composition="desktop"] .career-area .factory-work
 > .factory-career-overview[data-factory-pane]:not([hidden]) {
  grid-column:1 / -1; grid-row:1;
}
html[data-game-composition="desktop"] .career-area .factory-work
 > .factory-action[data-factory-pane]:not([hidden]) {
  grid-column:1; grid-row:2;
}
html[data-game-composition="desktop"] .career-area .factory-work
 > .factory-packaging[data-factory-pane]:not([hidden]) {
  grid-column:1; grid-row:2;
}
html[data-game-composition="desktop"] .career-area .factory-work[data-career-area="employee"]
 > .factory-packaging[data-factory-pane]:not([hidden]) {
  grid-column:2; grid-row:2;
}
html[data-game-composition="desktop"] .career-area .factory-work
 > .factory-automation[data-factory-pane]:not([hidden]) {
  grid-column:2; grid-row:2;
}
html[data-game-composition="desktop"] .career-area .factory-work[data-career-area="crew"]
 > .factory-automation[data-factory-pane]:not([hidden]) {
  grid-column:1 / span 2; grid-row:2;
}
html[data-game-composition="desktop"] .career-area .factory-work
 > .employee-development[data-factory-pane]:not([hidden]) {
  grid-column:3; grid-row:2;
}

/* v0.1.237: Factory contracts consume REAL portfolio manufacturing output,
   so desktop must show its supplier controls alongside the current live order.
   Keep genuinely independent optional Investments a separately selected
   physical project book; never hide supplier stock behind a Contracts tab. */
html[data-game-composition="desktop"] #portfolio-production-panel[data-production-workspace="connected"] {
  display:grid; grid-template-columns:minmax(0,1.17fr) minmax(0,.83fr);
  grid-template-rows:auto auto minmax(0,1fr);
  gap:8px; align-content:stretch; align-items:start; min-width:0; min-height:0;
}
html[data-game-composition="desktop"] #portfolio-production-panel[data-production-workspace="connected"]
 > .area-hero {
  grid-column:1/-1; grid-row:1; min-height:0; margin:0; padding:6px 10px;
}
html[data-game-composition="desktop"] #portfolio-production-panel[data-production-workspace="connected"]
 > .production-section-tabs {
  grid-column:1/-1; grid-row:2; display:flex; gap:6px;
  margin:0; padding:0;
}
html[data-game-composition="desktop"] #portfolio-production-panel[data-production-workspace="connected"]
 > [data-production-part="goods"]:not([hidden]) {
  grid-column:1; grid-row:3; display:grid; grid-template-columns:minmax(0,1fr);
  align-content:start; gap:8px; min-width:0; min-height:0; margin:0; padding:9px;
}
html[data-game-composition="desktop"] #portfolio-production-panel[data-production-workspace="connected"]
 > [data-production-part="contracts"]:not([hidden]) {
  grid-column:2; grid-row:3; display:grid; grid-template-columns:minmax(0,1fr);
  align-content:start; min-width:0; min-height:0; margin:0; padding:9px;
}
html[data-game-composition="desktop"] #portfolio-production-panel[data-production-workspace="connected"]
 .material-production-grid {
  grid-template-columns:repeat(3,minmax(0,1fr)); gap:5px;
}
html[data-game-composition="desktop"] #portfolio-production-panel[data-production-workspace="connected"]
 .material-production-card {padding:8px; gap:5px;}
html[data-game-composition="desktop"] #portfolio-production-panel[data-production-workspace="connected"]
 .material-production-footer {
  display:grid; grid-template-columns:minmax(0,1fr); gap:5px;
}
html[data-game-composition="desktop"] #portfolio-production-panel[data-production-workspace="connected"]
 .material-production-footer .buy-mode-selector {min-width:0; width:100%;}
html[data-game-composition="desktop"] #portfolio-production-panel[data-production-workspace="connected"]
 .factory-contract-card {min-width:0; margin:0; padding:9px; gap:7px;}
html[data-game-composition="desktop"] #portfolio-production-panel[data-production-workspace="connected"]
 .factory-contract-goods {display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:5px;}
html[data-game-composition="desktop"] #portfolio-production-panel[data-production-workspace="connected"]
 .factory-contract-goods > div {min-width:0; padding:5px; font-size:.71rem;}
html[data-game-composition="desktop"] #portfolio-production-panel[data-production-workspace="connected"]
 .factory-contract-card :is(p,small) {font-size:.72rem; line-height:1.17;}
html[data-game-composition="desktop"] #portfolio-production-panel[data-production-workspace="connected"]
 .factory-contract-card .button {min-height:31px; padding:5px;}
html[data-game-composition="desktop"] #portfolio-production-panel > [data-production-part][hidden] {display:none!important;}

/* v0.1.238: Touch producer / real factory-order continuity in ONE small
   persistent status strip. No extra activity pages, duplicate buttons or
   cosmetic progress. Both sides link to the actual existing work panels. */
html[data-game-composition="desktop"] #portfolio-production-panel > [data-portfolio-context] {
  display:none!important;
}
html[data-game-composition="mobile"] #portfolio-production-panel > [data-portfolio-context]:not([hidden]) {
  display:grid; grid-template-columns:minmax(0,1fr) auto;
  gap:5px; align-items:center; flex:0 0 auto;
  padding:4px 6px; margin:0;
  border:1px solid #657d8d; border-radius:7px; background:#1c303d;
}
html[data-game-composition="mobile"] #portfolio-production-panel [data-portfolio-context-status] {
  min-width:0; font-size:.65rem; line-height:1.1; color:#e7eff8;
  overflow-wrap:anywhere;
}
html[data-game-composition="mobile"] #portfolio-production-panel [data-portfolio-context-action] {
  min-width:0; min-height:29px; padding:4px 6px;
  font-size:.63rem; white-space:normal; max-width:138px;
}
html[data-game-composition="mobile"][data-game-orientation="landscape"]
 #portfolio-production-panel > [data-portfolio-context]:not([hidden]) {
  padding:2px 4px;
}


/* v0.1.239: Recompose the actual desktop Dumpster after independent Chromium
   inspection. Old one-pane selectors forced all five live panels into cell
   1/1 despite the later co-visible layout; explicitly defeat that cascade.
   Size the workspace from the available frame, not an assumed hero height. */
html[data-game-composition="desktop"] .play-views > .dumpster-area:not([hidden]) {
  display:flex; flex-direction:column; min-width:0; min-height:0;
}
html[data-game-composition="desktop"] .dumpster-area > .dumpster-hero {
  flex:0 0 auto; min-height:0; max-height:none;
  margin:0 0 7px; padding:7px 12px;
}
html[data-game-composition="desktop"] .dumpster-area > .dumpster-hero .area-icon {
  height:45px; flex-basis:86px; transform:scale(.57);
}
html[data-game-composition="desktop"] .dumpster-area > .dumpster-pane-tabs {display:none!important;}
html[data-game-composition="desktop"] .dumpster-area > .dumpster-grid {
  flex:1 1 auto; display:grid; width:100%; height:auto; min-height:0;
  grid-template-columns:minmax(0,1.05fr) minmax(0,.9fr) minmax(0,1.25fr);
  grid-template-rows:minmax(0,.87fr) minmax(0,1fr);
  gap:7px; align-content:stretch; align-items:stretch;
}
html[data-game-composition="desktop"] .dumpster-area > .dumpster-grid > .panel:not([hidden]) {
  min-width:0; min-height:0; display:grid; align-content:start;
  margin:0; padding:7px; gap:4px;
}
html[data-game-composition="desktop"] .dumpster-area > .dumpster-grid > .panel:not([hidden]).dig-panel {
  grid-column:1; grid-row:1;
}
html[data-game-composition="desktop"] .dumpster-area > .dumpster-grid > .panel:not([hidden]).inventory-panel {
  grid-column:2; grid-row:1 / span 2;
  grid-template-rows:auto minmax(0,1fr);
}
html[data-game-composition="desktop"] .dumpster-area > .dumpster-grid > .panel:not([hidden]).pawn-panel {
  grid-column:1; grid-row:2;
}
html[data-game-composition="desktop"] .dumpster-area > .dumpster-grid > .panel:not([hidden]).upgrades-panel {
  grid-column:3; grid-row:1;
}
html[data-game-composition="desktop"] .dumpster-area > .dumpster-grid > .panel:not([hidden]).automation-panel {
  grid-column:3; grid-row:2;
}
html[data-game-composition="desktop"] .dumpster-area .dig-panel .dumpster-art {
  width:min(240px,70%); height:90px; max-height:90px; margin:3px auto;
  transform:none;
}
html[data-game-composition="desktop"] .dumpster-area .inventory-panel .inventory-list {
  grid-template-columns:repeat(3,minmax(0,1fr));
  grid-template-rows:repeat(3,minmax(0,1fr));
  align-content:stretch; height:100%; min-height:0;
}
html[data-game-composition="desktop"] .dumpster-area .inventory-panel .inventory-tile {
  height:100%; max-height:none; min-height:0;
}
/* Audited Settings: don't force a 100px slider into three narrow audio cards
   and thereby push the third SFX mute button past the dialog's right edge. */
html[data-game-composition="desktop"] [data-settings-section="game"] .audio-settings,
html[data-game-composition="desktop"] [data-settings-section="game"] .audio-control-grid {
  min-width:0;
}
html[data-game-composition="desktop"] [data-settings-section="game"] .audio-control-grid label {
  display:grid;
  grid-template-columns:minmax(34px,max-content) minmax(0,1fr) 66px;
  align-items:center; gap:5px; min-width:0;
}
html[data-game-composition="desktop"] [data-settings-section="game"] .audio-control-grid label > :is(input,button) {
  box-sizing:border-box; min-width:0; max-width:100%;
}
html[data-game-composition="desktop"] [data-settings-section="game"] .audio-control-grid label > button {
  width:100%; min-height:28px; padding:3px 4px;
  font-size:.7rem; white-space:normal;
}


/* v0.1.240: Portrait's connected live Dumpster workspace now consumes exactly
   the height left by its real header and nav; no hardcoded hero subtraction. */
html[data-game-composition="mobile"] .play-views > .dumpster-area:not([hidden]){
 display:flex;flex-direction:column;min-width:0;min-height:0;padding:5px;
}
html[data-game-composition="mobile"] .dumpster-area > .dumpster-hero {
 box-sizing:border-box;flex:0 0 auto;min-height:0;max-height:none;padding:4px 7px;margin:0 0 3px;
}
html[data-game-composition="mobile"] .dumpster-area > .dumpster-hero h2{font-size:1rem;line-height:1.1;margin:0;}
html[data-game-composition="mobile"] .dumpster-area > .dumpster-hero .section-kicker{font-size:.55rem;line-height:1.05;margin:0 0 1px;}
html[data-game-composition="mobile"] .dumpster-area > .dumpster-hero p:last-child{font-size:.65rem;line-height:1.1;margin:2px 0 0;}
html[data-game-composition="mobile"] .dumpster-area > .dumpster-pane-tabs{flex:0 0 auto;min-width:0;margin:0 0 3px;gap:4px;}
html[data-game-composition="mobile"] .dumpster-area > .dumpster-pane-tabs > .button{min-height:25px;padding:2px 4px;}
html[data-game-composition="mobile"] .dumpster-area > .dumpster-grid{
 flex:1 1 auto;width:100%;height:auto;min-height:0;align-content:stretch;align-items:stretch;gap:3px;
}
html[data-game-composition="mobile"] .dumpster-area[data-dumpster-workspace="search"] > .dumpster-grid {
 grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:minmax(0,.9fr) minmax(0,1.1fr);
}
html[data-game-composition="mobile"] .dumpster-area > .dumpster-grid > .panel:not([hidden]){
 box-sizing:border-box;min-width:0;min-height:0;padding:3px;gap:2px;align-content:start;
}
html[data-game-composition="mobile"] .dumpster-area > .dumpster-grid > .panel .panel-heading{min-height:0;gap:2px;margin:0;}
html[data-game-composition="mobile"] .dumpster-area > .dumpster-grid > .panel .panel-heading .section-kicker{font-size:.5rem;line-height:1;margin:0;}
html[data-game-composition="mobile"] .dumpster-area > .dumpster-grid > .panel .panel-heading h2{font-size:.68rem;line-height:1.08;margin:0;}
html[data-game-composition="mobile"] .dumpster-area .dig-panel .button{min-height:31px;padding:3px 5px;font-size:.76rem;}
html[data-game-composition="mobile"] .dumpster-area .dig-panel .progress-track{height:7px;min-height:7px;margin:1px 0;}
html[data-game-composition="mobile"] .dumpster-area .dig-panel :is(.action-status,.stat-note){margin:1px 0;font-size:.61rem;line-height:1.09;}
html[data-game-composition="mobile"] .dumpster-area .inventory-panel .inventory-list{
 grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(3,minmax(0,1fr));
 height:100%;min-height:0;gap:2px;margin:1px 0 0;
}
html[data-game-composition="mobile"] .dumpster-area .inventory-panel .inventory-tile{min-height:0;height:100%;max-height:none;aspect-ratio:auto;}
html[data-game-composition="mobile"] .dumpster-area .inventory-panel .inventory-tile-count{right:1px;bottom:1px;font-size:.61rem;}
html[data-game-composition="mobile"] .dumpster-area .pawn-panel :is(.shop-copy,.action-status){font-size:.59rem;line-height:1.08;margin:1px 0;}
html[data-game-composition="mobile"] .dumpster-area .pawn-panel .button{min-height:26px;padding:3px;font-size:.66rem;}
/* Draw a real mini dumpster inside its own 33px box. Scaling the original
   170px absolute-positioned art had obscured the actual Dig button. */
html[data-game-composition="mobile"] .dumpster-area .dig-panel .dumpster-art{
 box-sizing:border-box;width:min(190px,62%);height:33px;max-height:33px;overflow:hidden;transform:none;margin:1px auto;
}
html[data-game-composition="mobile"] .dumpster-area .dig-panel .dumpster-art .dumpster-lid{top:2px;left:7px;width:calc(100% - 14px);height:12px;border-width:2px;}
html[data-game-composition="mobile"] .dumpster-area .dig-panel .dumpster-art .dumpster-body{
 inset:12px 12px 0;border-width:2px;border-radius:3px 3px 5px 5px;box-shadow:none;
}
html[data-game-composition="mobile"] .dumpster-area .dig-panel .dumpster-art .dumpster-body span{padding:0 3px;border-width:1px;font-size:.44rem;line-height:1.05;}
html[data-game-composition="mobile"] .dumpster-area .dig-panel .dumpster-art .trash-bag{display:none;}


/* v0.1.241: Physical-height-aware landscape Dumpster. The 96px hero and
   stale implicit 220px grid could never fit the actual 174px landscape game
   area. Retain its real route/instruction while giving the live loop space. */
html[data-game-composition="mobile"][data-game-orientation="landscape"] .dumpster-area > .dumpster-hero {
  flex:0 0 31px; height:31px; max-height:31px;
  padding:2px 5px; margin:0 0 2px;
}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .dumpster-area > .dumpster-hero .section-kicker {display:none;}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .dumpster-area > .dumpster-hero h2 {font-size:.78rem;line-height:1.05;}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .dumpster-area > .dumpster-hero p:last-child {
  font-size:.54rem;line-height:1;margin:0;
}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .dumpster-area > .dumpster-pane-tabs {margin:0 0 2px;}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .dumpster-area > .dumpster-pane-tabs > .button {
  min-height:22px;padding:1px 3px;font-size:.59rem;
}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .dumpster-area[data-dumpster-workspace="search"] > .dumpster-grid {
  grid-template-columns:minmax(0,1.15fr) minmax(0,.95fr) minmax(0,.9fr);
  grid-template-rows:minmax(0,1fr);
}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .dumpster-area .dig-panel .dumpster-art {display:none;}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .dumpster-area .dig-panel .button {
  min-height:27px;padding:2px;font-size:.65rem;
}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .dumpster-area .inventory-panel .inventory-list {gap:1px;}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .dumpster-area .pawn-panel .shop-copy {margin:0;}


/* v0.1.242: Landscape's independent upgrades and Crew need an actual
   one-column panel shell, not the old desktop two-column card layout.
   Their own headings make the Search introduction redundant here. */
html[data-game-composition="mobile"][data-game-orientation="landscape"] .dumpster-area:not([data-dumpster-workspace="search"]) > .dumpster-hero{display:none!important;}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .dumpster-area[data-dumpster-workspace="upgrades"] .upgrades-panel:not([hidden]){
 display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr);min-width:0;min-height:0;align-content:start;
}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .dumpster-area[data-dumpster-workspace="upgrades"] .upgrades-panel .panel-heading{
 grid-column:1;grid-row:1;display:flex;flex-wrap:nowrap;gap:5px;align-items:center;
}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .dumpster-area[data-dumpster-workspace="upgrades"] .upgrades-panel .buy-mode-selector{
 width:auto;min-width:300px;flex:0 1 330px;
}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .dumpster-area[data-dumpster-workspace="upgrades"] .upgrades-panel #upgrade-list{
 grid-column:1;grid-row:2;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));
 align-content:start;gap:3px;margin:1px 0 0;min-width:0;min-height:0;
}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .dumpster-area[data-dumpster-workspace="crew"] .automation-panel:not([hidden]){
 display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr) auto;
 min-width:0;min-height:0;align-content:start;
}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .dumpster-area[data-dumpster-workspace="crew"] .automation-panel > .panel-heading{
 grid-column:1;grid-row:1;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2.4fr);
 gap:5px;align-items:center;
}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .dumpster-area[data-dumpster-workspace="crew"] .automation-panel .panel-heading-actions{
 display:grid;grid-template-columns:auto minmax(0,1fr);gap:3px;align-items:center;
}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .dumpster-area[data-dumpster-workspace="crew"] .automation-panel .buy-mode-selector{
 width:auto;min-width:0;
}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .dumpster-area[data-dumpster-workspace="crew"] .automation-panel > .automation-grid{
 grid-column:1;grid-row:2;display:grid;grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr);
 gap:4px;align-items:start;min-width:0;min-height:0;margin:0;
}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .dumpster-area[data-dumpster-workspace="crew"] .automation-panel .operation-status{
 padding:3px;gap:2px;
}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .dumpster-area[data-dumpster-workspace="crew"] .automation-panel .crew-stat strong{
 font-size:.7rem;line-height:1.05;
}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .dumpster-area[data-dumpster-workspace="crew"] .automation-panel .operation-status .action-status{
 margin:1px 0;font-size:.58rem;line-height:1.05;
}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .dumpster-area[data-dumpster-workspace="crew"] .automation-panel .progression-purchases{
 grid-template-columns:repeat(3,minmax(0,1fr));gap:3px;
}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .dumpster-area[data-dumpster-workspace="crew"] .automation-panel .progression-purchases > .purchase-card{
 padding:3px;gap:2px;
}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .dumpster-area[data-dumpster-workspace="crew"] .automation-panel > #crew-upgrade-section:not([hidden]){
 grid-column:1;grid-row:3;
}
/* Portrait's 44px Buy selector buttons needn't eat nearly half the tiny
   landscape crew pane. Keep the same four direct options at usable sizes. */
html[data-game-composition="mobile"][data-game-orientation="landscape"] .dumpster-area:not([data-dumpster-workspace="search"]) .buy-mode-option{
 min-height:27px;padding:2px 3px;font-size:.63rem;
}


/* v0.1.243: Once a scavenger exists, Crew Efficiency is real live content.
   Keep it in the same desktop Crew workspace without stacking it beneath the
   entire two-column operation and pushing its controls below the footer. */
html[data-game-composition="desktop"] .dumpster-area .automation-panel:not([hidden]) {
  grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);
  grid-template-rows:auto minmax(0,1fr);
  align-content:stretch;
}
html[data-game-composition="desktop"] .dumpster-area .automation-panel > .panel-heading {
  grid-column:1/-1; grid-row:1;
}
html[data-game-composition="desktop"] .dumpster-area .automation-panel > .automation-grid {
  display:contents;
}
html[data-game-composition="desktop"] .dumpster-area .automation-panel .operation-status {
  grid-column:1; grid-row:2; min-width:0; min-height:0;
}
html[data-game-composition="desktop"] .dumpster-area .automation-panel .progression-purchases {
  grid-column:2; grid-row:2 / span 2; min-width:0; min-height:0; align-content:start;
}
html[data-game-composition="desktop"] .dumpster-area .automation-panel > #crew-upgrade-section:not([hidden]) {
  grid-column:1; grid-row:3; min-width:0; min-height:0; margin:3px 0 0; gap:3px;
}
html[data-game-composition="desktop"] .dumpster-area .automation-panel > #crew-upgrade-section:not([hidden]) .subsection-title {
  margin:0; font-size:.68rem;
}
html[data-game-composition="desktop"] .dumpster-area .automation-panel > #crew-upgrade-section:not([hidden]) #crew-upgrade-list {
  grid-template-columns:repeat(2,minmax(0,1fr)); gap:3px;
}
html[data-game-composition="desktop"] .dumpster-area .automation-panel > #crew-upgrade-section:not([hidden]) .compact-upgrade-card {
  min-height:0; padding:4px;
}


/* v0.1.244: Short mobile landscape must spend its scarce height on gameplay.
   Compact shared shell chrome and use width to keep real late-stage context
   visible instead of stacking the same information vertically. */
html[data-game-composition="mobile"][data-game-orientation="landscape"] .topbar {
  min-height:32px; height:32px; margin-bottom:2px; gap:6px;
}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .topbar h1 {font-size:.98rem; line-height:1;}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .topbar-actions {height:32px; gap:4px;}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .topbar-actions .button {
  min-height:32px; height:32px; padding:3px 7px; font-size:.64rem; border-radius:6px;
}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .resource-hud {
  grid-template-columns:minmax(108px,1.25fr) repeat(2,minmax(78px,1fr)) minmax(72px,.78fr) minmax(72px,.78fr) 48px;
  grid-auto-rows:minmax(0,auto); gap:2px; padding:2px;
}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .resource-hud .hud-resource,
html[data-game-composition="mobile"][data-game-orientation="landscape"] .resource-hud .resource-tracker-list > div {
  padding:1px 3px; min-height:29px;
}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .resource-hud span,
html[data-game-composition="mobile"][data-game-orientation="landscape"] .resource-hud .resource-tracker-list span {font-size:.5rem; line-height:1;}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .resource-hud strong,
html[data-game-composition="mobile"][data-game-orientation="landscape"] .resource-hud .resource-tracker-list strong {font-size:.63rem; line-height:1; margin-top:0;}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .resource-hud .hud-money .pre-coin-counter {font-size:.47rem; line-height:1;}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .resource-hud .hud-settings,
html[data-game-composition="mobile"][data-game-orientation="landscape"] .resource-hud .hud-page-control {
  min-height:29px; height:29px; padding:1px 3px; font-size:.53rem; border-radius:5px;
}
html[data-game-composition="mobile"][data-game-orientation="landscape"]:has(#late-game-panel:not([hidden])) .sub-navigation {
  min-height:0; margin:0; padding:1px; gap:2px;
}
html[data-game-composition="mobile"][data-game-orientation="landscape"]:has(#late-game-panel:not([hidden])) .sub-navigation > .game-tab {
  min-height:27px; height:27px; padding:2px 4px; font-size:.61rem;
}
html[data-game-composition="mobile"][data-game-orientation="landscape"]:has(#late-game-panel:not([hidden])) .sub-navigation:has(> .nav-direct-select) > .game-tab {
  display:none!important;
}
html[data-game-composition="mobile"][data-game-orientation="landscape"]:has(#late-game-panel:not([hidden])) .sub-navigation > .nav-direct-select {
  min-height:27px; height:27px; padding:2px 5px; font-size:.59rem;
}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .late-game-area {
  padding:3px!important;
}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .late-game-area .late-stage-main-nav {
  display:grid; grid-template-columns:minmax(300px,1.12fr) minmax(210px,.88fr);
  align-items:stretch; gap:4px; margin:0 0 2px;
}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .late-game-area .late-stage-target-picker {
  min-width:0; height:27px; max-height:27px; gap:4px; font-size:.56rem;
}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .late-game-area .late-stage-target-picker select {
  min-width:0; min-height:25px; height:25px; padding:1px 4px; font-size:.58rem;
}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .late-game-area .late-stage-main-buttons {
  grid-template-columns:repeat(3,minmax(0,1fr)); align-items:stretch; gap:2px;
}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .late-game-area .late-stage-main-buttons .button {
  min-height:25px; height:25px; padding:1px 3px; font-size:.55rem; line-height:1.02;
}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .late-game-area > .late-stage-bridge {
  min-height:0; gap:3px; padding:2px 3px!important; margin:1px 0 2px!important;
}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .late-game-area > .late-stage-bridge .late-stage-bridge-metrics {gap:2px!important;}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .late-game-area .late-stage-bridge-metrics span {font-size:.52rem; line-height:1;}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .late-game-area > .late-stage-bridge > .button {
  min-width:88px; min-height:25px; height:25px; padding:1px 3px; font-size:.54rem;
}
/* Landscape has enough width to restore requirement groups that portrait
   deliberately stacks, without hiding any requirement or project control. */
html[data-game-composition="mobile"][data-game-orientation="landscape"] :is(
  .group-inputs,.division-inputs,.subsidiary-inputs,.holding-goods,
  .country-precharter-cargo,.star-cluster-members,.star-cluster-needs,
  .galaxy-survey-supplies,.freight-supplies,.federation-supplies,
  .cosmic-needs,.bridge-needs
) {grid-template-columns:repeat(2,minmax(0,1fr));gap:2px 4px;}
html[data-game-composition="mobile"][data-game-orientation="landscape"] :is(
  .shell-quote,.acquisition-goods,.acquisition-proof,.continent-materials,
  .space-site-needs,.orbital-materials,.planetary-front-needs,.dyson-needs,
  .solar-needs,.star-cluster-proof,.constellation-items,.genesis-stock,.genesis-proof,
  .multi-seed-needs,.reality-needs,.reality-proof,.core-prereqs,.core-inputs,.core-proof
) {grid-template-columns:repeat(3,minmax(0,1fr));gap:2px 3px;}
html[data-game-composition="mobile"][data-game-orientation="landscape"] :is(
  .group-progress,.regional-cargo,.regional-proof,.national-program-needs,.national-production-proof
) {grid-template-columns:repeat(4,minmax(0,1fr));gap:2px 3px;}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .solar-origin {
  grid-template-columns:auto minmax(0,1fr); align-items:center; gap:4px;
}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .solar-origin > select {
  min-height:22px; height:22px; padding:1px 3px;
}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .dashboard {gap:2px;}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .footer-line {font-size:.49rem; line-height:1; min-height:10px; height:10px;}
/* Blocs & Empires has a genuine selector, requirement readout and action.
   Place those side-by-side on short landscape rather than stacking them. */
html[data-game-composition="mobile"][data-game-orientation="landscape"] .bloc-invitation {
  grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);
  grid-template-rows:auto auto; gap:2px 5px; align-items:stretch;
}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .bloc-invitation > .bloc-delegate-choice {
  grid-column:1; grid-row:1 / span 2; align-content:start;
}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .bloc-invitation > .bloc-cargo {
  grid-column:2; grid-row:1;
}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .bloc-invitation > .button {
  grid-column:2; grid-row:2; justify-self:stretch; width:100%;
}
/* Portrait density fixes for the four independently observed holdouts.
   Keep every real item/selector while using the available width. */
html[data-game-composition="mobile"][data-game-orientation="portrait"] .late-game-area {padding:8px!important;}
html[data-game-composition="mobile"][data-game-orientation="portrait"] .late-game-area > .late-stage-projects > .late-items:not(.sector-charter-items):not(.supply-route-items):not(.integration-items) {
  display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:4px; margin:3px 0; padding:5px;
}
html[data-game-composition="mobile"][data-game-orientation="portrait"] .late-game-area > .late-stage-projects > .late-items:not(.sector-charter-items):not(.supply-route-items):not(.integration-items) > .art-object {
  box-sizing:border-box; min-width:0; width:100%; margin:0; border-radius:7px; padding:3px 5px; justify-content:flex-start;
}
html[data-game-composition="mobile"][data-game-orientation="portrait"] .bloc-invitation {
  grid-template-columns:minmax(0,.88fr) minmax(0,1.12fr); grid-template-rows:auto auto;
  gap:3px 4px; align-items:stretch;
}
html[data-game-composition="mobile"][data-game-orientation="portrait"] .bloc-invitation > .bloc-delegate-choice {
  grid-column:1; grid-row:1 / span 2; align-content:start;
}
html[data-game-composition="mobile"][data-game-orientation="portrait"] .bloc-invitation > .bloc-cargo {grid-column:2; grid-row:1;}
html[data-game-composition="mobile"][data-game-orientation="portrait"] .bloc-invitation > .button {
  grid-column:2; grid-row:2; justify-self:stretch; width:100%; white-space:normal;
}
html[data-game-composition="mobile"][data-game-orientation="portrait"] .solar-needs {
  grid-template-columns:repeat(2,minmax(0,1fr)); gap:2px 3px;
}
html[data-game-composition="mobile"][data-game-orientation="portrait"] .solar-origin {
  grid-template-columns:auto minmax(0,1fr); align-items:center; gap:4px;
}
html[data-game-composition="mobile"][data-game-orientation="portrait"] .solar-origin > select {min-width:0; width:100%;}
html[data-game-composition="mobile"][data-game-orientation="portrait"] :is(.bloc-councils,.solar-frontiers) {
  margin:1px 0; padding:3px 5px;
}
html[data-game-composition="mobile"][data-game-orientation="portrait"] .solar-frontiers {margin:0; padding:2px 5px;}
/* Unlock notices must not float over legitimate mobile navigation or project
   controls. Share the navigation row temporarily without adding another row. */
html[data-game-composition="mobile"] .dashboard:has(> .navigation-feedback:not([hidden])) {
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  grid-template-rows:auto auto minmax(0,1fr);
}
html[data-game-composition="mobile"] .dashboard:has(> .navigation-feedback:not([hidden])) > .resource-hud {
  grid-column:1 / -1; grid-row:1;
}
html[data-game-composition="mobile"] .dashboard:has(> .navigation-feedback:not([hidden])) > .sub-navigation {
  grid-column:1; grid-row:2; min-width:0;
}
html[data-game-composition="mobile"] .dashboard:has(> .navigation-feedback:not([hidden])) > .navigation-feedback {
  position:static; grid-column:2; grid-row:2; align-self:stretch;
  inset:auto; transform:none; box-sizing:border-box; width:auto; max-width:none;
  min-width:0; min-height:0; margin:0; padding:3px 5px;
  display:flex; align-items:center; justify-content:center;
  border-radius:6px; font-size:.56rem; line-height:1.06; text-align:center;
}
html[data-game-composition="mobile"] .dashboard:has(> .navigation-feedback:not([hidden])) > .play-views {
  grid-column:1 / -1; grid-row:3;
}

/* v0.1.245 exact 0.1.244 nested landscape audit */

html[data-game-composition="mobile"][data-game-orientation="landscape"] .late-game-area [data-late-upgrades]:not([hidden]){gap:2px;padding:3px}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .late-game-area [data-late-upgrades] .upgrade-category-heading{display:flex;flex-wrap:nowrap;align-items:center;gap:3px;min-width:0;min-height:24px}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .late-game-area [data-late-upgrades] .upgrade-category-heading .subsection-title{flex:0 1 170px;min-width:90px;margin:0;font-size:.58rem;line-height:1.02;white-space:normal}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .late-game-area [data-late-upgrades] .upgrade-category-heading .buy-mode-selector{flex:1 1 300px;width:auto;min-width:0;min-height:24px;padding:1px;gap:2px}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .late-game-area [data-late-upgrades] .upgrade-category-heading .buy-mode-option{min-height:21px;padding:1px 2px;font-size:.56rem}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .late-game-area [data-late-upgrade-list]{gap:2px;align-content:start}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .late-game-area [data-late-upgrade-list]>[data-compact-upgrade-card]{min-height:49px;height:49px;padding:2px}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .late-game-area [data-late-upgrade-list] .compact-upgrade-copy{padding:2px 3px;gap:0;line-height:1}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .late-game-area [data-late-upgrade-list] .compact-upgrade-copy :is(strong,small,em){font-size:.56rem;line-height:1.02}
html[data-game-composition="mobile"][data-game-orientation="landscape"] :is(.group-directives,.holding-mandates){grid-template-columns:repeat(3,minmax(0,1fr));gap:3px}
html[data-game-composition="mobile"][data-game-orientation="landscape"] :is(.group-directives,.holding-mandates)>button{padding:3px;font-size:.57rem;min-height:48px}
html[data-game-composition="mobile"][data-game-orientation="landscape"] :is(.group-directives,.holding-mandates) small{font-size:.51rem;line-height:1.03}
html[data-game-composition="mobile"][data-game-orientation="landscape"] [data-recycling-card]:not([hidden]){margin:0;padding:3px 5px;gap:4px;grid-template-columns:46px minmax(0,1fr)}
html[data-game-composition="mobile"][data-game-orientation="landscape"] [data-recycling-card]:not([hidden])>.art-slot{width:46px;height:46px;min-width:46px}
html[data-game-composition="mobile"][data-game-orientation="landscape"] [data-recycling-card]:not([hidden])>div{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-rows:auto auto;gap:1px 5px;align-items:center;min-width:0}
html[data-game-composition="mobile"][data-game-orientation="landscape"] [data-recycling-card]:not([hidden]) h3{grid-column:1;grid-row:1;margin:0;font-size:.68rem;line-height:1.05}
html[data-game-composition="mobile"][data-game-orientation="landscape"] [data-recycling-card]:not([hidden]) p{grid-column:1;grid-row:2;margin:0;font-size:.56rem;line-height:1.05}
html[data-game-composition="mobile"][data-game-orientation="landscape"] [data-recycling-card]:not([hidden]) .button{grid-column:2;grid-row:1/span 2;align-self:center;min-height:27px;padding:2px 5px;font-size:.58rem}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .civic-districts{margin:2px 0;padding:2px 4px}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .civic-district-content{gap:1px}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .civic-navigation{gap:2px}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .civic-navigation>strong{font-size:.59rem}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .civic-navigation>small{font-size:.52rem}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .civic-navigation-tabs{gap:2px}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .civic-navigation-tabs>button{min-height:21px;padding:1px 2px;font-size:.55rem}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .civic-district-body>small{font-size:.53rem;line-height:1.02}


/* v0.1.246: exact 0.1.245 visual audit — finish the remaining bounded
   desktop and mobile holdouts without reintroducing blind paging. */
html[data-game-composition="desktop"] .dashboard{
  grid-template-rows:58px 43px 40px minmax(0,1fr);
}
html[data-game-composition="mobile"][data-game-orientation="portrait"] .sub-navigation>.game-tab{
  white-space:normal;overflow-wrap:anywhere;font-size:.64rem;line-height:1.03;
}
html[data-game-composition="mobile"][data-game-orientation="portrait"] .automation-panel #crew-upgrade-section:not([hidden]){gap:1px;margin:0}
html[data-game-composition="mobile"][data-game-orientation="portrait"] .automation-panel #crew-upgrade-section:not([hidden]) .subsection-title{margin:0;font-size:.58rem;line-height:1}
html[data-game-composition="mobile"][data-game-orientation="portrait"] .automation-panel #crew-upgrade-list{gap:2px}
html[data-game-composition="mobile"][data-game-orientation="portrait"] .automation-panel #crew-upgrade-list>[data-compact-upgrade-card]{min-height:44px;height:44px;padding:2px}
html[data-game-composition="mobile"][data-game-orientation="portrait"] .automation-panel #crew-upgrade-list .compact-upgrade-copy{padding:2px;gap:0;line-height:1}
html[data-game-composition="mobile"][data-game-orientation="portrait"] .late-game-area [data-late-upgrades]:not([hidden]){gap:2px;padding:3px}
html[data-game-composition="mobile"][data-game-orientation="portrait"] .late-game-area [data-late-upgrades] .upgrade-category-heading{display:grid;grid-template-columns:minmax(0,1fr);gap:2px;margin:0}
html[data-game-composition="mobile"][data-game-orientation="portrait"] .late-game-area [data-late-upgrades] .upgrade-category-heading .subsection-title{margin:0;font-size:.58rem;line-height:1.02}
html[data-game-composition="mobile"][data-game-orientation="portrait"] .late-game-area [data-late-upgrades] .buy-mode-selector{min-height:22px;padding:1px;gap:2px}
html[data-game-composition="mobile"][data-game-orientation="portrait"] .late-game-area [data-late-upgrades] .buy-mode-option{min-height:20px;padding:1px 2px;font-size:.54rem}
html[data-game-composition="mobile"][data-game-orientation="portrait"] .late-game-area [data-late-upgrade-list]{grid-template-columns:repeat(3,minmax(0,1fr));gap:3px;align-content:start}
html[data-game-composition="mobile"][data-game-orientation="portrait"] .late-game-area [data-late-upgrade-list]>[data-compact-upgrade-card]{min-height:55px;height:55px;padding:2px}
html[data-game-composition="mobile"][data-game-orientation="portrait"] .late-game-area [data-late-upgrade-list] .compact-upgrade-copy{padding:2px;gap:0;line-height:1}
html[data-game-composition="mobile"][data-game-orientation="portrait"] .late-game-area [data-late-upgrade-list] .compact-upgrade-copy :is(strong,small,em){font-size:.53rem;line-height:1.02}
html[data-game-composition="mobile"][data-game-orientation="portrait"] :is(.group-directives,.holding-mandates){grid-template-columns:repeat(3,minmax(0,1fr));gap:3px}
html[data-game-composition="mobile"][data-game-orientation="portrait"] :is(.group-directives,.holding-mandates)>button{min-height:58px;padding:3px;font-size:.55rem;line-height:1.03}
html[data-game-composition="mobile"][data-game-orientation="portrait"] :is(.group-directives,.holding-mandates) small{font-size:.49rem;line-height:1.02}
html[data-game-composition="mobile"][data-game-orientation="portrait"] [data-recycling-card]:not([hidden]){margin:0;padding:3px 5px;gap:4px;grid-template-columns:42px minmax(0,1fr)}
html[data-game-composition="mobile"][data-game-orientation="portrait"] [data-recycling-card]:not([hidden])>.art-slot{width:42px;height:42px;min-width:42px}
html[data-game-composition="mobile"][data-game-orientation="portrait"] [data-recycling-card]:not([hidden])>div{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-rows:auto auto;gap:1px 4px;align-items:center;min-width:0}
html[data-game-composition="mobile"][data-game-orientation="portrait"] [data-recycling-card]:not([hidden]) h3{grid-column:1;grid-row:1;margin:0;font-size:.64rem;line-height:1.03}
html[data-game-composition="mobile"][data-game-orientation="portrait"] [data-recycling-card]:not([hidden]) p{grid-column:1;grid-row:2;margin:0;font-size:.53rem;line-height:1.03}
html[data-game-composition="mobile"][data-game-orientation="portrait"] [data-recycling-card]:not([hidden]) .button{grid-column:2;grid-row:1/span 2;align-self:center;min-height:25px;padding:2px 4px;font-size:.55rem}
html[data-game-composition="mobile"][data-game-orientation="portrait"] .civic-districts{margin:1px 0;padding:2px 4px}
html[data-game-composition="mobile"][data-game-orientation="portrait"] .civic-district-content{gap:1px}
html[data-game-composition="mobile"][data-game-orientation="portrait"] .civic-navigation{gap:2px}
html[data-game-composition="mobile"][data-game-orientation="portrait"] .civic-navigation-tabs{gap:2px}
html[data-game-composition="mobile"][data-game-orientation="portrait"] .civic-navigation-tabs>button{min-height:21px;padding:1px 2px;font-size:.54rem}
html[data-game-composition="mobile"][data-game-orientation="portrait"] .civic-district-body>small{font-size:.52rem;line-height:1.02}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .holding-budgets{grid-template-columns:repeat(3,minmax(0,1fr));gap:3px}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .holding-budget{grid-template-columns:minmax(0,1fr);padding:2px;gap:1px}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .holding-budget>span{gap:1px}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .holding-budget>button{min-height:21px;padding:1px 2px;font-size:.55rem}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .planetary-charter{gap:2px}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .planetary-readiness{grid-template-columns:repeat(2,minmax(0,1fr));gap:2px 3px}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .planetary-readiness>span{padding:2px 4px;font-size:.55rem;line-height:1.02}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .planetary-charter>strong{font-size:.62rem;line-height:1.03}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .planetary-charter>button{min-height:22px;padding:1px 4px;font-size:.56rem}


/* v0.1.247: exact 0.1.246 transient audit — landscape Settings has ample
   horizontal room for all five direct Game-settings destinations, so keep
   them in one row and return the second row's height to actual settings. */
html[data-game-composition="mobile"][data-game-orientation="landscape"] .game-settings-mobile-tabs{
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:3px;
  margin:2px 0 4px;
}
html[data-game-composition="mobile"][data-game-orientation="landscape"] .game-settings-mobile-tabs .button{
  min-height:27px;
  padding:2px 3px;
  font-size:.64rem;
}


/* v0.1.248: final blind-navigation audit. The direct named late-stage target
   picker already owns these selections; suppress the four old arrow pairs
   whose data attributes missed the original v0.1.233 selector list. */
html .late-game-area:has(.late-stage-target-picker)
 :is([data-network-prev],[data-network-next],[data-space-mission-prev],[data-space-mission-next],
     [data-space-site-prev],[data-space-site-next],[data-star-cluster-prev],[data-star-cluster-next]) {
  display:none!important;
}
/* The three treaty delegate seats are a real nested choice, but not a reason
   to make the player hunt with arrows. Keep all three directly named. */
.bloc-seat-nav > label {
  display:grid; grid-template-columns:auto minmax(0,1fr); align-items:center;
  gap:7px; width:100%; min-width:0;
}
.bloc-seat-nav > label > span {font-size:.75rem; font-weight:800; white-space:nowrap;}
.bloc-seat-nav > label > select {min-width:0; width:100%; min-height:27px; padding:3px 7px;}
html[data-game-composition="mobile"] .bloc-seat-nav > label {gap:4px;}
html[data-game-composition="mobile"] .bloc-seat-nav > label > span {font-size:.62rem;}
html[data-game-composition="mobile"] .bloc-seat-nav > label > select {
  min-height:23px; padding:2px 4px; font-size:.62rem;
}


/* 0.2.2: Beach uses the established Dumpster-style tile inventory.
   Desktop gives that grid its own full right column and moves GSG Pawn & Loan
   below the finite detector upgrades in the middle column. */
.beach-inventory-pager { display:none!important; }

html[data-game-composition="desktop"] #beach-panel .beach-layout {
  display:grid;
  grid-template-columns:minmax(0,.8fr) minmax(0,.85fr) minmax(0,1.35fr);
  grid-template-rows:auto minmax(0,1fr);
  height:calc(100% - 45px);
  min-height:0;
  align-items:stretch;
  gap:9px;
}
html[data-game-composition="desktop"] #beach-panel .beach-layout > .beach-action {
  grid-column:1;
  grid-row:1 / span 2;
  min-width:0;
  min-height:0;
}
html[data-game-composition="desktop"] #beach-panel .beach-layout > .beach-upgrades {
  grid-column:2;
  grid-row:1;
  min-width:0;
  min-height:0;
}
html[data-game-composition="desktop"] #beach-panel .beach-layout > .beach-pawn-panel {
  grid-column:2;
  grid-row:2;
  align-self:start;
  min-width:0;
  min-height:0;
  display:grid;
  align-content:start;
  gap:7px;
  padding:9px;
}
html[data-game-composition="desktop"] #beach-panel .beach-layout > .beach-pawn-panel h3 {
  margin:0;
}
html[data-game-composition="desktop"] #beach-panel .beach-layout > .beach-pawn-panel .action-status {
  margin:0;
}
html[data-game-composition="desktop"] #beach-panel .beach-layout > .beach-inventory-panel {
  grid-column:3;
  grid-row:1 / span 2;
  align-self:stretch;
  min-width:0;
  min-height:0;
  display:grid;
  grid-template-rows:auto minmax(0,1fr);
  align-content:stretch;
  gap:8px;
  padding:9px;
}
html[data-game-composition="desktop"] #beach-inventory-list {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  grid-template-rows:repeat(3,minmax(0,1fr));
  gap:7px;
  min-width:0;
  min-height:0;
  margin:0;
  align-content:stretch;
}
html[data-game-composition="desktop"] #beach-inventory-list .beach-inventory-tile {
  min-width:0;
  min-height:0;
  width:100%;
  height:100%;
  aspect-ratio:1;
}

html[data-game-composition="mobile"] #beach-inventory-list {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  grid-template-rows:repeat(3,minmax(0,1fr));
  gap:2px;
  min-width:0;
  min-height:0;
  margin:0;
}
html[data-game-composition="mobile"] #beach-inventory-list .beach-inventory-tile {
  min-width:0;
  min-height:0;
  height:min(13vw,54px);
  aspect-ratio:auto;
  padding:0;
}
html[data-game-composition="mobile"] #beach-inventory-list .beach-inventory-tile .inventory-tile-art {
  display:block!important;
}
html[data-game-composition="mobile"] #beach-panel[data-beach-active-pane="search"] .beach-inventory-panel {
  padding-bottom:58px!important;
}
html[data-game-composition="mobile"] #beach-panel[data-beach-active-pane="search"] .beach-layout > .beach-pawn-panel {
  grid-column:1;
  grid-row:2;
  align-self:end;
  z-index:2;
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:2px;
  margin:4px;
  padding:4px;
  min-width:0;
}
html[data-game-composition="mobile"] #beach-panel[data-beach-active-pane="search"] .beach-pawn-panel h3,
html[data-game-composition="mobile"] #beach-panel[data-beach-active-pane="search"] .beach-pawn-panel .action-status {
  margin:0;
  font-size:.6rem;
  line-height:1.05;
}
html[data-game-composition="mobile"] #beach-panel[data-beach-active-pane="search"] .beach-pawn-panel .button {
  min-height:23px;
  padding:2px 4px;
  font-size:.58rem;
}
html[data-game-composition="mobile"][data-game-orientation="landscape"] #beach-inventory-list .beach-inventory-tile {
  height:34px;
}
html[data-game-composition="mobile"][data-game-orientation="landscape"]
 #beach-panel[data-beach-active-pane="search"] .beach-layout > .beach-pawn-panel {
  grid-column:2;
  grid-row:1;
}
html[data-game-composition="mobile"] #beach-panel[data-beach-active-pane="inventory"] .beach-layout {
  display:grid;
  grid-template-columns:minmax(0,1fr);
  grid-template-rows:minmax(0,1fr) auto;
  gap:4px;
}
html[data-game-composition="mobile"] #beach-panel[data-beach-active-pane="inventory"] .beach-layout > .beach-inventory-panel {
  grid-column:1;
  grid-row:1;
  padding:4px;
}
html[data-game-composition="mobile"] #beach-panel[data-beach-active-pane="inventory"] .beach-layout > .beach-pawn-panel {
  grid-column:1;
  grid-row:2;
  display:grid;
  gap:3px;
  padding:4px;
}


/* 0.2.4: "While you were away" is centered transient overlay chrome.
   It may cover gameplay until dismissed, but never changes game geometry. */
:is([data-game-composition="desktop"], [data-game-composition="mobile"])
 .game-shell > .offline-summary:not([hidden]) {
  position:absolute;
  z-index:85;
  grid-row:auto;
  margin:0;
  box-shadow:0 18px 48px rgba(0,0,0,.62);
  backdrop-filter:blur(10px);
}
[data-game-composition="desktop"] .game-shell > .offline-summary:not([hidden]) {
  top:50%;
  left:50%;
  width:min(1180px,calc(100% - 88px));
  max-width:1180px;
  transform:translate(-50%,-50%);
}
[data-game-composition="mobile"] .game-shell > .offline-summary:not([hidden]) {
  top:50%;
  left:max(8px,var(--device-safe-left),env(safe-area-inset-left));
  right:max(8px,var(--device-safe-right),env(safe-area-inset-right));
  width:auto;
  max-width:none;
  transform:translateY(-50%);
}
[data-game-composition="mobile"][data-game-orientation="landscape"]
 .game-shell > .offline-summary:not([hidden]) {
  right:max(
    126px,
    calc(126px + var(--device-safe-right)),
    calc(126px + env(safe-area-inset-right))
  );
}


/* 0.2.6: Scavenger live status is bounded operation text, never a sale ticker. */
.automation-panel .operation-status,
.automation-panel .crew-stat,
#crew-status {
  min-width: 0;
  max-width: 100%;
}
#crew-status {
  white-space: normal;
  overflow-wrap: anywhere;
}


/* 0.2.8: startup is an explicit loading surface, not an empty alley frame. */
.game-shell > .startup-status:not([hidden]) {
  position: absolute;
  inset: 0;
  z-index: 70;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 12px;
  box-sizing: border-box;
  margin: 0;
  padding: 24px;
  color: #e6eef5;
  font-size: 1rem;
  font-weight: 850;
  letter-spacing: .04em;
  text-align: center;
  text-shadow: 0 2px 10px rgba(0,0,0,.75);
  pointer-events: none;
}
.game-shell > .startup-status:not([hidden])::before {
  content: "";
  width: 28px;
  height: 28px;
  box-sizing: border-box;
  border: 3px solid rgba(230,238,245,.28);
  border-top-color: #e6eef5;
  border-radius: 50%;
  animation: shenaniverse-loading-spin .85s linear infinite;
}
@keyframes shenaniverse-loading-spin {
  to { transform: rotate(360deg); }
}
@media (prefers-reduced-motion: reduce) {
  .game-shell > .startup-status:not([hidden])::before { animation: none; }
}


/* v0.2.11: Dumpster artwork presentation uses the available fixed desktop space. */
html[data-game-composition="desktop"] .dumpster-area > .dumpster-hero .dumpster-icon {
  flex:0 0 120px;
  width:120px;
  height:74px;
  transform:none;
}

html[data-game-composition="desktop"] .dumpster-area .dig-panel {
  position:relative;
  overflow:hidden;
}
html[data-game-composition="desktop"] .dumpster-area .dig-panel > :not(.dumpster-art) {
  position:relative;
  z-index:2;
}
html[data-game-composition="desktop"] .dumpster-area .dig-panel .dumpster-art {
  z-index:1;
  width:min(330px,88%);
  height:132px;
  max-height:132px;
  margin:-5px auto -34px;
  transform:none;
  pointer-events:none;
}
html[data-game-composition="desktop"] .dumpster-area .dig-panel .dumpster-art-image {
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center;
}

html[data-game-composition="desktop"] .dumpster-area .upgrades-panel:not([hidden]) {
  grid-template-rows:auto minmax(0,1fr);
  align-content:stretch;
}
html[data-game-composition="desktop"] .dumpster-area .upgrades-panel #upgrade-list {
  height:100%;
  min-height:0;
  grid-template-columns:repeat(2,minmax(0,1fr));
  grid-template-rows:repeat(2,minmax(0,1fr));
  align-content:stretch;
}
html[data-game-composition="desktop"] .dumpster-area .upgrades-panel #upgrade-list > .compact-upgrade-card {
  min-height:0;
  height:100%;
  padding:8px 10px;
}

html[data-game-composition="desktop"] .dumpster-area .compact-upgrade-art {
  inset:0 0 0 auto;
  width:48%;
  height:100%;
  max-width:none;
  border:0;
  border-radius:0;
  background:transparent;
  object-fit:contain;
  object-position:center;
  opacity:.72;
}
html[data-game-composition="desktop"] .dumpster-area .compact-upgrade-card:hover .compact-upgrade-art,
html[data-game-composition="desktop"] .dumpster-area .compact-upgrade-card:focus-visible .compact-upgrade-art {
  opacity:.86;
}
html[data-game-composition="desktop"] .dumpster-area .compact-upgrade-scrim {
  background:linear-gradient(90deg,rgba(20,18,14,.98) 0%,rgba(20,18,14,.94) 46%,rgba(20,18,14,.55) 67%,rgba(20,18,14,.12) 100%);
}
html[data-game-composition="desktop"] .dumpster-area .compact-upgrade-copy {
  width:68%;
  max-width:68%;
}

html[data-game-composition="desktop"] .dumpster-area .automation-panel .progression-purchases {
  grid-template-rows:repeat(3,minmax(0,1fr));
  align-content:stretch;
}
html[data-game-composition="desktop"] .dumpster-area .automation-panel .progression-purchases > .purchase-card {
  height:100%;
  min-height:0;
  grid-template-columns:80px minmax(0,1fr) minmax(108px,.72fr);
  align-items:center;
  padding:6px 7px;
  gap:7px;
}
html[data-game-composition="desktop"] .dumpster-area .automation-panel .progression-purchases .art-slot {
  width:80px;
  height:60px;
  max-width:80px;
  border-color:#526a78;
  background:#121d26;
  object-fit:contain;
}
html[data-game-composition="desktop"] .dumpster-area .automation-panel .progression-purchases .upgrade-actions,
html[data-game-composition="desktop"] .dumpster-area .automation-panel .progression-purchases > .purchase-card > .button {
  min-width:0;
  width:100%;
}
html[data-game-composition="desktop"] .dumpster-area .automation-panel > #crew-upgrade-section:not([hidden]) .compact-upgrade-card {
  min-height:58px;
  height:58px;
  padding:5px 7px;
}


/* v0.2.12: tighten Dumpster panel chrome and spend the recovered room on useful art/details. */
html[data-game-composition="desktop"] .dumpster-area .upgrades-panel > .panel-heading {
  min-height:0;
  margin:-3px 0 2px;
  gap:5px;
  align-items:flex-start;
}
html[data-game-composition="desktop"] .dumpster-area .upgrades-panel > .panel-heading .section-kicker {
  margin-bottom:1px;
  line-height:1;
}
html[data-game-composition="desktop"] .dumpster-area .upgrades-panel > .panel-heading h2 {
  line-height:1.05;
}
html[data-game-composition="desktop"] .dumpster-area .upgrades-panel > .panel-heading .buy-mode-selector {
  min-height:27px;
  padding:2px;
  gap:2px;
}
html[data-game-composition="desktop"] .dumpster-area .upgrades-panel > .panel-heading .buy-mode-option {
  min-height:25px;
  padding:2px 4px;
  font-size:.68rem;
}
html[data-game-composition="desktop"] .dumpster-area .upgrades-panel #upgrade-list {
  margin-top:0;
}

html[data-game-composition="desktop"] .dumpster-area .automation-panel:not([hidden]) {
  grid-template-rows:auto auto minmax(72px,1fr);
}
html[data-game-composition="desktop"] .dumpster-area .automation-panel .operation-status {
  align-self:start;
  padding:7px 8px;
  gap:3px;
}
html[data-game-composition="desktop"] .dumpster-area .automation-panel .crew-stat span {
  font-size:.64rem;
  line-height:1;
}
html[data-game-composition="desktop"] .dumpster-area .automation-panel .crew-stat strong {
  margin-top:1px;
  font-size:.79rem;
  line-height:1.02;
}
html[data-game-composition="desktop"] .dumpster-area .automation-panel .operation-status .progress-track {
  height:9px;
  min-height:9px;
  margin:3px 0 2px;
}
html[data-game-composition="desktop"] .dumpster-area .automation-panel #crew-status {
  margin:2px 0 0;
  font-size:.64rem;
  line-height:1.06;
}
html[data-game-composition="desktop"] .dumpster-area .automation-panel > #crew-upgrade-section:not([hidden]) {
  align-self:stretch;
  grid-template-rows:auto minmax(0,1fr);
}
html[data-game-composition="desktop"] .dumpster-area .automation-panel > #crew-upgrade-section:not([hidden]) #crew-upgrade-list {
  height:100%;
  min-height:0;
  align-content:stretch;
}
html[data-game-composition="desktop"] .dumpster-area .automation-panel > #crew-upgrade-section:not([hidden]) .compact-upgrade-card {
  min-height:68px;
  height:100%;
  padding:5px 7px;
}
html[data-game-composition="desktop"] .dumpster-area .automation-panel > #crew-upgrade-section:not([hidden]) .compact-upgrade-copy {
  gap:1px;
}
html[data-game-composition="desktop"] .dumpster-area .automation-panel > #crew-upgrade-section:not([hidden]) .compact-upgrade-copy strong {
  font-size:.72rem;
  line-height:1.05;
}
html[data-game-composition="desktop"] .dumpster-area .automation-panel > #crew-upgrade-section:not([hidden]) .compact-upgrade-copy small,
html[data-game-composition="desktop"] .dumpster-area .automation-panel > #crew-upgrade-section:not([hidden]) .compact-upgrade-copy em {
  font-size:.64rem;
  line-height:1.05;
}

html[data-game-composition="desktop"] .dumpster-area .pawn-panel {
  position:relative;
  isolation:isolate;
  overflow:hidden;
}
html[data-game-composition="desktop"] .dumpster-area .pawn-panel::before {
  content:"";
  position:absolute;
  z-index:0;
  inset:0;
  background:
    linear-gradient(90deg,rgba(19,31,40,.97) 0%,rgba(19,31,40,.91) 43%,rgba(19,31,40,.38) 100%),
    url("assets/scavenging/dumpster/akillgore-scrapyard.png") right 55% / 62% auto no-repeat;
  opacity:.92;
  pointer-events:none;
}
html[data-game-composition="desktop"] .dumpster-area .pawn-panel > * {
  position:relative;
  z-index:1;
}


/* v0.2.15: Crew Efficiency cards keep natural proportions and never break upgrade names mid-word. */
html[data-game-composition="desktop"] .dumpster-area .automation-panel > #crew-upgrade-section:not([hidden]) {
  align-self:start;
  grid-template-rows:auto auto;
}
html[data-game-composition="desktop"] .dumpster-area .automation-panel > #crew-upgrade-section:not([hidden]) #crew-upgrade-list {
  height:auto;
  min-height:0;
  grid-template-columns:minmax(0,1fr);
  grid-auto-rows:62px;
  align-content:start;
  gap:4px;
}
html[data-game-composition="desktop"] .dumpster-area .automation-panel > #crew-upgrade-section:not([hidden]) .compact-upgrade-card {
  min-height:62px;
  height:62px;
  padding:5px 8px;
}
html[data-game-composition="desktop"] .dumpster-area .automation-panel > #crew-upgrade-section:not([hidden]) .compact-upgrade-art {
  width:38%;
  height:100%;
  object-fit:contain;
}
html[data-game-composition="desktop"] .dumpster-area .automation-panel > #crew-upgrade-section:not([hidden]) .compact-upgrade-copy {
  width:76%;
  max-width:76%;
  gap:1px;
}
html[data-game-composition="desktop"] .dumpster-area .automation-panel > #crew-upgrade-section:not([hidden]) .compact-upgrade-copy strong {
  overflow:visible;
  text-overflow:clip;
  white-space:normal;
  overflow-wrap:normal;
  word-break:normal;
  font-size:.76rem;
  line-height:1.04;
}
html[data-game-composition="desktop"] .dumpster-area .automation-panel > #crew-upgrade-section:not([hidden]) .compact-upgrade-copy small,
html[data-game-composition="desktop"] .dumpster-area .automation-panel > #crew-upgrade-section:not([hidden]) .compact-upgrade-copy em {
  overflow:visible;
  text-overflow:clip;
  white-space:nowrap;
  overflow-wrap:normal;
  word-break:normal;
  font-size:.66rem;
  line-height:1.04;
}

html[data-game-composition="desktop"] .dumpster-area .automation-panel > .panel-heading .buy-mode-selector {
  width:268px;
  min-width:268px;
  max-width:268px;
  min-height:27px;
  padding:2px;
  gap:2px;
}
html[data-game-composition="desktop"] .dumpster-area .automation-panel > .panel-heading .buy-mode-option {
  min-height:25px;
  padding:2px 4px;
  font-size:.67rem;
}

html[data-game-composition="desktop"] .dumpster-area .automation-panel .progression-purchases > .purchase-card {
  grid-template-columns:72px minmax(0,1fr) 104px;
}
html[data-game-composition="desktop"] .dumpster-area .automation-panel .progression-purchases .art-slot {
  width:72px;
  height:54px;
  max-width:72px;
}
html[data-game-composition="desktop"] .dumpster-area .automation-panel .progression-purchases .upgrade-actions,
html[data-game-composition="desktop"] .dumpster-area .automation-panel .progression-purchases > .purchase-card > .button {
  width:104px;
  max-width:104px;
  justify-self:end;
}
html[data-game-composition="desktop"] .dumpster-area .automation-panel .progression-purchases .upgrade-buy,
html[data-game-composition="desktop"] .dumpster-area .automation-panel .progression-purchases .upgrade-actions .upgrade-buy {
  width:104px;
  min-width:0;
  max-width:104px;
  padding-inline:6px;
}


/* v0.2.16: Offline return overlay sizes to its information instead of spanning the desktop. */
[data-game-composition="desktop"] .game-shell > .offline-summary:not([hidden]) {
  width:min(620px,calc(100% - 88px));
  max-width:620px;
}
[data-game-composition="desktop"] .game-shell > .offline-summary:not([hidden]) .offline-details {
  grid-template-columns:repeat(auto-fit,minmax(132px,1fr));
}
[data-game-composition="desktop"] .game-shell > .offline-summary:not([hidden]) .offline-summary-actions {
  justify-content:center;
}
[data-game-composition="desktop"] .game-shell > .offline-summary:not([hidden]) #offline-dismiss {
  width:112px;
  min-width:112px;
}


/* v0.2.17: Beach artwork batch presentation. */
#beach-panel .beach-art {
  display:grid;
  place-items:center;
  background:transparent;
}
#beach-panel .beach-art-image {
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center;
  pointer-events:none;
  user-select:none;
  -webkit-user-drag:none;
}
#beach-panel .beach-pawn-panel {
  position:relative;
  isolation:isolate;
  overflow:hidden;
}
#beach-panel .beach-pawn-panel::before {
  content:"";
  position:absolute;
  z-index:0;
  inset:0;
  background:
    linear-gradient(90deg,rgba(15,27,34,.96) 0%,rgba(15,27,34,.78) 52%,rgba(15,27,34,.38) 100%),
    url("assets/scavenging/beach/gsg-pawn-loan.png") center / cover no-repeat;
  opacity:.9;
  pointer-events:none;
}
#beach-panel .beach-pawn-panel > * {
  position:relative;
  z-index:1;
}
#beach-panel .accessory-item .art-slot {
  object-fit:contain;
  background:rgba(13,28,35,.72);
}


/* v0.2.18: Beach artwork uses the available desktop space instead of thumbnailing the new assets. */
html[data-game-composition="desktop"] #beach-panel .beach-layout {
  grid-template-rows:minmax(0,1.12fr) minmax(0,.88fr);
}

html[data-game-composition="desktop"] #beach-panel .beach-layout > .beach-action {
  display:grid;
  align-content:start;
  gap:7px;
}
html[data-game-composition="desktop"] #beach-panel .beach-art {
  width:100%;
  height:210px;
  margin:0 auto 4px;
  overflow:visible;
}
html[data-game-composition="desktop"] #beach-panel .beach-art-image {
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center;
}

html[data-game-composition="desktop"] #beach-panel .accessory-progress-card {
  padding:10px;
  gap:7px;
}
html[data-game-composition="desktop"] #beach-panel .accessory-list {
  gap:8px;
}
html[data-game-composition="desktop"] #beach-panel .accessory-item {
  min-height:52px;
  padding:6px 10px 6px 7px;
  gap:8px;
  font-size:.78rem;
}
html[data-game-composition="desktop"] #beach-panel .accessory-item .art-slot {
  width:46px;
  height:42px;
  flex:0 0 46px;
  border-radius:7px;
}

html[data-game-composition="desktop"] #beach-panel .beach-layout > .beach-upgrades {
  display:grid;
  grid-template-rows:auto minmax(0,1fr);
  align-content:stretch;
  min-height:0;
  padding:9px;
}
html[data-game-composition="desktop"] #beach-panel .beach-upgrades #beach-upgrade-list {
  height:100%;
  min-height:0;
  display:grid;
  grid-template-columns:minmax(0,1fr);
  grid-template-rows:repeat(3,minmax(0,1fr));
  align-content:stretch;
  gap:7px;
}
html[data-game-composition="desktop"] #beach-panel .beach-upgrades #beach-upgrade-list > .compact-upgrade-card {
  min-height:0;
  height:100%;
  padding:8px 10px;
}
html[data-game-composition="desktop"] #beach-panel .beach-upgrades .compact-upgrade-art {
  inset:0 0 0 auto;
  width:46%;
  height:100%;
  max-width:none;
  border:0;
  border-radius:0;
  background:transparent;
  object-fit:contain;
  object-position:center;
  opacity:.82;
}
html[data-game-composition="desktop"] #beach-panel .beach-upgrades .compact-upgrade-card:hover .compact-upgrade-art,
html[data-game-composition="desktop"] #beach-panel .beach-upgrades .compact-upgrade-card:focus-visible .compact-upgrade-art {
  opacity:.94;
}
html[data-game-composition="desktop"] #beach-panel .beach-upgrades .compact-upgrade-scrim {
  background:linear-gradient(90deg,rgba(25,22,17,.98) 0%,rgba(25,22,17,.93) 47%,rgba(25,22,17,.50) 68%,rgba(25,22,17,.08) 100%);
}
html[data-game-composition="desktop"] #beach-panel .beach-upgrades .compact-upgrade-copy {
  width:64%;
  max-width:64%;
}
html[data-game-composition="desktop"] #beach-panel .beach-upgrades .compact-upgrade-copy strong {
  font-size:.88rem;
}
html[data-game-composition="desktop"] #beach-panel .beach-upgrades .compact-upgrade-copy small,
html[data-game-composition="desktop"] #beach-panel .beach-upgrades .compact-upgrade-copy em {
  font-size:.75rem;
}

html[data-game-composition="desktop"] #beach-panel .beach-layout > .beach-pawn-panel {
  align-self:stretch;
  min-height:0;
  padding:11px;
  gap:9px;
}
html[data-game-composition="desktop"] #beach-panel .beach-pawn-panel::before {
  background:
    linear-gradient(90deg,rgba(15,27,34,.91) 0%,rgba(15,27,34,.68) 48%,rgba(15,27,34,.22) 100%),
    url("assets/scavenging/beach/gsg-pawn-loan.png") center / cover no-repeat;
  opacity:1;
}


/* v0.2.19: Search the Beach art is a true background layer behind the search controls. */
html[data-game-composition="desktop"] #beach-panel .beach-layout > .beach-action {
  position:relative;
  isolation:isolate;
  align-content:start;
  padding-top:155px;
}
html[data-game-composition="desktop"] #beach-panel .beach-art {
  position:absolute;
  z-index:0;
  top:8px;
  left:10px;
  right:10px;
  width:auto;
  height:245px;
  margin:0;
  overflow:visible;
  pointer-events:none;
}
html[data-game-composition="desktop"] #beach-panel .beach-art-image {
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center top;
  opacity:.94;
}
html[data-game-composition="desktop"] #beach-panel .beach-action > :not(.beach-art) {
  position:relative;
  z-index:1;
}
html[data-game-composition="desktop"] #beach-panel .button-beach {
  box-shadow:0 2px 10px rgba(7,21,25,.42);
}
html[data-game-composition="desktop"] #beach-panel .progress-track-beach {
  background:rgba(8,24,31,.82);
}
html[data-game-composition="desktop"] #beach-panel .beach-action > .action-status,
html[data-game-composition="desktop"] #beach-panel .beach-action > .stat-note {
  text-shadow:0 1px 3px rgba(0,0,0,.9);
}


/* v0.2.20: Beach status copy gets its own readable shadow surface while the art uses the empty headroom. */
html[data-game-composition="desktop"] #beach-panel .beach-layout > .beach-action {
  padding-top:168px;
}
html[data-game-composition="desktop"] #beach-panel .beach-art {
  top:-26px;
  left:8px;
  right:8px;
  height:270px;
}
html[data-game-composition="desktop"] #beach-panel .beach-art-image {
  object-position:center top;
}

html[data-game-composition="desktop"] #beach-panel .beach-action > .action-status {
  width:fit-content;
  max-width:calc(100% - 12px);
  min-height:0;
  margin:18px 6px 0;
  padding:5px 9px;
  border:1px solid rgba(97,142,154,.28);
  border-radius:7px;
  color:#d9e5ea;
  background:rgba(7,19,25,.70);
  box-shadow:0 4px 14px rgba(0,0,0,.30);
  text-shadow:0 1px 2px rgba(0,0,0,.95);
  backdrop-filter:blur(2px);
}
html[data-game-composition="desktop"] #beach-panel .beach-action > .stat-note {
  width:fit-content;
  max-width:calc(100% - 12px);
  margin:4px 6px 0;
  padding:4px 8px;
  border-radius:6px;
  color:#c7b997;
  background:rgba(7,19,25,.62);
  box-shadow:0 3px 10px rgba(0,0,0,.22);
  text-shadow:0 1px 2px rgba(0,0,0,.95);
  backdrop-filter:blur(2px);
}

html[data-game-composition="desktop"] #beach-panel .accessory-progress-card {
  margin-top:34px;
}
