/* The public decks. Shared station tokens keep all three skins in character. */
.footer-station { margin-bottom: 24px; }
.breadcrumbs { display: flex; flex-wrap: wrap; gap: 8px; font: 13px var(--mono); color: var(--muted); margin-bottom: 28px; }
.station-heading { max-width: 850px; margin-bottom: 28px; }
.station-heading h1 { font-size: clamp(30px, 5vw, 56px); text-transform: uppercase; margin-top: 12px; }
.station-heading .lead { max-width: 45em; }
.deck-nav { display: flex; flex-wrap: wrap; gap: 6px; border-block: 1px solid var(--line); padding-block: 12px; margin-bottom: 32px; }
.deck-nav a { display: flex; align-items: center; padding: 10px 12px; min-height: 44px; font: 13px var(--mono); color: var(--muted); border: 1px solid transparent; border-radius: var(--radius); }
.deck-nav a[aria-current] { border-color: var(--accent); color: var(--fg); background: var(--panel); }
.area-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.area-card, .document-card, .intent-card, .mission-card { position: relative; min-width: 0; border: 1px solid var(--line); border-radius: var(--radius); padding: 24px; background: var(--panel-grad); color: var(--fg); overflow-wrap: anywhere; }
.area-card { padding: 20px; }
.area-card h3 { font-size: 20px; margin-top: 12px; }
.area-card p, .document-card p, .intent-card p { color: var(--muted); }
.area-card:hover, a.document-card:hover { text-decoration: none; border-color: var(--accent); }
.area-arrow { display: block; color: var(--accent); font-size: 24px; }
.station-grid, .mission-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.station-grid h2, .mission-grid h2, .briefing h2, .mission-passport h2 { font-size: 24px; }
.document-card h2, .mission-card h2 { margin-top: 12px; }
.section-intro { max-width: 70ch; margin: 0 0 24px; }
.welcome-strip, .registry-strip { padding: 20px 24px; border-left: 3px solid var(--accent); background: var(--panel); margin-bottom: 24px; }
.welcome-strip p { margin-bottom: 0; }
.registry-strip { display: flex; gap: 12px 32px; flex-wrap: wrap; font: 15px var(--mono); }
.briefing { min-width: 0; padding: 24px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--panel); margin-block: 24px; overflow-wrap: anywhere; }
.briefing p { max-width: 70ch; }
.briefing .connection { margin-bottom: 18px; }
.manual-prose { max-width: 72ch; margin: 24px 0; }
/* Field manual: prose left, the channel briefing as a sticky panel on the right. */
.manual-layout { display: grid; grid-template-columns: minmax(0, 72ch) minmax(280px, 1fr); gap: 36px; align-items: start; }
.manual-layout .manual-prose { margin: 0; }
.manual-side { position: sticky; top: calc(84px + env(safe-area-inset-top, 0px)); display: grid; gap: 18px; min-width: 0; }
.manual-side .briefing { margin-block: 0; }
.manual-side:empty { display: none; }
.manual-prose h2 { scroll-margin-top: 100px; }
.manual-search { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; margin-bottom: 24px; }
.manual-search input { flex: 1; min-width: min(100%, 220px); }
.manual-search input, #guestbook-form input, #guestbook-form textarea { font: 16px var(--body-face); background: var(--bg); color: var(--fg); border: 1px solid var(--line); border-radius: var(--radius); padding: 12px; min-height: 44px; width: 100%; max-width: 100%; }
.manual-search input { width: auto; }
.engineering-top, .guestbook-layout, .deck-lounge { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 24px; align-items: start; }
.engineering-top { margin-bottom: 40px; }
.engineering-top .briefing, .guestbook-layout .briefing, .deck-lounge .briefing { margin-block: 0; }
.incident-list { display: grid; gap: 18px; }
.incident { padding: 24px; border: 1px solid var(--line); border-left: 3px solid var(--accent); background: var(--panel); border-radius: var(--radius); scroll-margin-top: 20px; }
.incident[data-incident-state="investigating"], .incident[data-incident-state="monitoring"] { border-left-color: var(--warn); }
.incident h3 { font-size: 24px; margin-block: 12px; }
.incident p { max-width: 80ch; }
.record-meta { display: flex; justify-content: space-between; align-items: baseline; flex-wrap: wrap; gap: 12px; color: var(--muted); font: 13px var(--mono); }
.record-state { color: var(--accent); text-transform: uppercase; }
.incident-updates { border-left: 1px solid var(--line); margin-block: 24px; padding-left: 24px; list-style: none; }
.incident-updates time { font: 13px var(--mono); color: var(--muted); }
.incident-updates p { margin-top: 6px; }
.android-note { color: var(--muted); font-size: 14px; border-top: 1px dashed var(--line); padding-top: 16px; }
.mission-passport { display: flex; justify-content: space-between; gap: 24px; align-items: center; padding: 24px; margin-bottom: 24px; border: 1px solid var(--accent); background: var(--panel); }
.mission-passport p { margin-bottom: 0; max-width: 65ch; }
#mission-progress { color: var(--accent); font: 18px var(--mono); }
.mission-requirements { color: var(--muted); }
.mission-card li { margin-bottom: 8px; }
.mission-actions { display: flex; flex-wrap: wrap; gap: 16px; align-items: center; margin-block: 20px; }
.mission-stamp { display: flex; gap: 8px; align-items: center; min-height: 44px; font: 14px var(--mono); cursor: pointer; }
.mission-stamp input { flex: none; }
.mission-card.completed { border-color: var(--ok); }
.mission-card.completed .mission-stamp { color: var(--ok); }
.empty-state { border: 1px dashed var(--line); padding: 24px; margin-top: 20px; color: var(--muted); }
.empty-state h3 { color: var(--fg); font-size: 22px; }
.guest-entry { border-bottom: 1px solid var(--line); padding-block: 24px; overflow-wrap: anywhere; }
.guest-entry h3 { font-size: 20px; }
.guest-entry p { white-space: pre-wrap; }
#guestbook-form { display: grid; gap: 10px; margin-top: 24px; }
#guestbook-form label { font: 14px var(--mono); }
#guestbook-form textarea { resize: vertical; }
#guestbook-form .btn { justify-self: start; }
#guest-draft { border-top: 1px solid var(--line); padding-top: 24px; margin-top: 12px; }
#guest-draft textarea { display: block; margin-block: 10px 16px; }
#guest-draft .btn { margin-bottom: 8px; }
#guest-feedback { color: var(--accent); }
.observation-window { position: relative; overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius); background: #05080e; }
.observation-window svg { display: block; width: 100%; height: auto; color: var(--accent); }
.window-stars { fill: #c4d4e7; }
.passing-ship { fill: currentColor; animation: transit 100s linear infinite; }
@keyframes transit { from { transform: translateX(-280px); } to { transform: translateX(850px); } }
.window-caption { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; padding: 12px 16px; border-top: 1px solid var(--line); font: 12px var(--mono); color: var(--muted); background: var(--bg2); }
.deck-clocks { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-block: 20px; }
.deck-clocks div { padding: 16px; border: 1px solid var(--line); font: 13px var(--mono); color: var(--muted); }
.deck-clocks time { display: block; font-size: clamp(17px, 3vw, 28px); margin-top: 8px; color: var(--accent); font-variant-numeric: tabular-nums; }
.observation-controls { display: flex; gap: 16px; align-items: center; flex-wrap: wrap; margin-bottom: 24px; }
#deck-motion-note { font: 13px var(--mono); color: var(--muted); }
.fleet-roll { display: flex; flex-wrap: wrap; gap: 12px 24px; }
.observation-paused .passing-ship { animation-play-state: paused; }
.quiet .passing-ship { animation: none; }
@media (prefers-reduced-motion: reduce) { .passing-ship { animation: none; } }
@media (max-width: 960px) {
  .manual-layout { grid-template-columns: minmax(0, 1fr); }
  .manual-side { position: static; order: -1; }
  .area-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .engineering-top, .guestbook-layout { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 620px) {
  .station-grid, .mission-grid, .deck-lounge { grid-template-columns: minmax(0, 1fr); }
  .area-card, .document-card, .intent-card, .mission-card, .briefing, .incident { padding: 18px; }
  .area-grid { grid-template-columns: minmax(0, 1fr); }
  .station-heading { margin-bottom: 20px; }
  .deck-nav { gap: 4px; }
  .deck-nav a { font-size: 12px; padding-inline: 8px; }
  .mission-passport { flex-direction: column; align-items: start; padding: 18px; }
  .deck-clocks { gap: 6px; }
  .deck-clocks div { padding: 10px 6px; font-size: 11px; }
  .window-caption { font-size: 11px; }
}