/* Mars47 v61 final presentation layer. Loaded after all compatibility CSS. */
.program-logo {
  overflow: hidden;
  padding: 0;
  border: 1px solid rgba(225,174,96,.45);
  background: #f7f3e9;
}
.program-logo img { width: 100%; height: 100%; object-fit: cover; transform: scale(1.16); }

.mission-cover {
  padding: 20px 20px 18px 38px;
  color: #14252b;
  background: linear-gradient(92deg, rgba(0,0,0,.07), transparent 9%), repeating-linear-gradient(0deg, rgba(65,54,41,.025) 0 1px, transparent 1px 5px), #f5f1e7;
  box-shadow: inset 10px 0 24px rgba(47,38,28,.08);
}
.mission-cover::before { inset: 10px 10px 10px 29px; border-color: rgba(68,55,38,.17); }
.mission-cover::after { right: -48px; bottom: -64px; border-color: rgba(26,76,85,.08); box-shadow: 0 0 0 18px rgba(26,76,85,.025), 0 0 0 40px rgba(26,76,85,.018); }
.mission-cover-kicker { color: #5b696b; }
.mission-cover-copy small, .mission-cover-copy span { color: #9b642c; }
.mission-cover-copy strong { color: #182b31; }
.mission-open { border-color: rgba(141,92,45,.32); background: rgba(147,97,46,.08); color: #74461f; }
.mission-open:hover { background: rgba(147,97,46,.14); border-color: rgba(141,92,45,.54); }
.mission-patch {
  width: 156px;
  height: 156px;
  margin-top: 12px;
  overflow: hidden;
  border: 1px solid rgba(118,86,48,.16);
  border-radius: 24px;
  background: #f7f3ea;
  filter: drop-shadow(0 12px 20px rgba(48,39,28,.18));
}
.mission-patch img { width: 100%; height: 100%; object-fit: cover; transform: scale(1.04); }

.mission-binder-spine {
  position: absolute;
  z-index: 3;
  inset: 0 auto 0 0;
  width: 26px;
  border-right: 1px solid rgba(55,46,34,.18);
  background: linear-gradient(90deg, #c9c2b5, #ebe6dc 58%, #bab2a4);
  box-shadow: 4px 0 10px rgba(36,30,24,.11);
}
.mission-binder-spine i { position: absolute; left: 7px; width: 11px; height: 11px; border: 2px solid #887f72; border-radius: 50%; background: #faf7ef; box-shadow: inset 0 1px 2px rgba(0,0,0,.2); }
.mission-binder-spine i:nth-child(1) { top: 52px; }
.mission-binder-spine i:nth-child(2) { top: 140px; }
.mission-binder-spine i:nth-child(3) { top: 228px; }
.mission-binder-spine i:nth-child(4) { top: 316px; }

.mission-page-art { width: 100%; height: 52px; margin: 0 0 10px; border: 1px solid rgba(213,169,101,.18); border-radius: 9px; background-position: center; background-size: cover; opacity: .68; box-shadow: inset 0 0 30px rgba(4,13,18,.68); }
.mission-page-art-coast { background-image: linear-gradient(90deg, rgba(5,17,23,.25), rgba(5,17,23,.72)), url('./branding/mars47-mark-coast-v61.png'); }
.mission-page-art-forge { background-image: linear-gradient(90deg, rgba(5,17,23,.25), rgba(5,17,23,.72)), url('./branding/mars47-mark-shield-v61.png'); }
.mission-page-art-haven { background-image: linear-gradient(90deg, rgba(5,17,23,.18), rgba(5,17,23,.78)), url('./research-energy-v3.jpg'); }

.mission-collapsed-summary { display: none; }
.mission.collapsed { width: 284px; min-height: 0; padding: 13px 42px 13px 14px; }
.mission.collapsed .mission-book { display: block !important; padding: 0; }
.mission.collapsed .mission-collapsed-summary { display: grid; gap: 5px; }
.mission.collapsed .mission-collapsed-summary small { color: #e2a65e; font: 700 8px/1.15 Barlow Condensed,sans-serif; letter-spacing: 1.25px; }
.mission.collapsed .mission-collapsed-summary strong { overflow: hidden; color: #e8f2ef; font: 700 14px/1.1 Barlow Condensed,sans-serif; text-overflow: ellipsis; white-space: nowrap; }
.mission.collapsed .mission-collapsed-summary > div { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 9px; }
.mission.collapsed .mission-collapsed-summary > div > span { height: 5px; overflow: hidden; border-radius: 999px; background: rgba(255,255,255,.1); }
.mission.collapsed .mission-collapsed-summary i { display: block; width: 0; height: 100%; border-radius: inherit; background: linear-gradient(90deg,#e9a85e,#69ddd5); box-shadow: 0 0 9px rgba(94,216,211,.26); transition: width .25s ease; }
.mission.collapsed .mission-collapsed-summary b { color: #84ded8; font: 700 9px/1 Barlow Condensed,sans-serif; }
.mission.collapsed .mission-chapter-tabs, .mission.collapsed .mission-book > section { display: none !important; }

.inspector { width: min(360px, calc(100vw - 36px)); max-height: calc(100vh - 205px); overflow: auto; padding: 17px; }
.inspector h2 { margin: 7px 58px 8px 0; font-size: clamp(20px,2.1vw,27px); line-height: 1.05; overflow-wrap: anywhere; }
.inspector p { font-size: 12px; line-height: 1.52; }
.inspector > #closeInspector { position: absolute; top: 8px; right: 10px; }
.inspector .inspector-actions button, .inspector .lab-upgrade { position: static; inset: auto; font-size: 9px; }

.cash-breakdown { top: 104px; left: 18px; width: min(390px,calc(100vw - 36px)); max-height: calc(100vh - 205px); padding: 16px; overflow: auto; transform: none; }
.cash-breakdown-head strong { font-size: 19px; }
.cash-balance-current b { font-size: 18px; }
.cash-ledger-row { min-height: 52px; }
.cash-ledger-row b { font-size: 13px; }
.cash-ledger-row small { font-size: 10px; }
.cash-ledger-row > strong { font-size: 15px; }
.cash-ledger-total b { font-size: 20px; }

.message-preview { z-index: 78; top: 104px; width: min(390px,calc(100vw - 36px)); min-height: 58px; padding: 11px 14px 11px 48px; }
html[data-active-panel-side="left"] .message-preview { left: 18px; right: auto; }
html[data-active-panel-side="right"] .message-preview { left: auto; right: 18px; }
html[data-notice-visible="true"] .side-panel:not(.hidden),
html[data-notice-visible="true"] .message-panel:not(.hidden),
html[data-notice-visible="true"] .progress-queue-panel:not(.hidden),
html[data-notice-visible="true"] .cash-breakdown:not(.hidden) { top: 174px; }
.research-success { display: none !important; }

@media (max-width: 720px) {
  .cash-breakdown, .message-preview, html[data-active-panel-side="left"] .message-preview, html[data-active-panel-side="right"] .message-preview { left: 8px; right: 8px; width: auto; }
  .cash-breakdown, .message-preview { top: calc(max(8px,env(safe-area-inset-top)) + 134px); }
  html[data-notice-visible="true"] .side-panel:not(.hidden),
  html[data-notice-visible="true"] .message-panel:not(.hidden),
  html[data-notice-visible="true"] .progress-queue-panel:not(.hidden),
  html[data-notice-visible="true"] .cash-breakdown:not(.hidden) { top: calc(max(8px,env(safe-area-inset-top)) + 204px); }
  .mission.collapsed { width: 252px; }
}