/* Shared brand contract for home, articles, discoveries and learning stations.
   System fonts require no external font service or download. */
:root {
  color-scheme: dark;
  --ocean-font-body: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --ocean-font-display: Georgia, 'Times New Roman', serif;
  --ocean-font-label: ui-monospace, 'SF Mono', Menlo, Consolas, monospace;
  --ocean-bg: #03090e;
  --ocean-surface: #0a1b25;
  --ocean-raised: #122d37;
  --ocean-ink: #f3f7f6;
  --ocean-muted: #b4c6ce;
  --ocean-accent: #83dacf;
  --ocean-primary: #e0efeb;
  --ocean-primary-ink: #203c3d;
  --ocean-line: #39535d;
  --ocean-radius: 4px;
  --ocean-space: 24px;
  --home-bg: var(--ocean-bg);
  --home-ink: var(--ocean-ink);
  --home-muted: var(--ocean-muted);
  --home-accent: var(--ocean-accent);
  --home-line: var(--ocean-line);
}
[hidden] { display: none !important; }
body { font-family: var(--ocean-font-body); }
:where(button, select, input) { font-family: var(--ocean-font-body); }
:where(a,button,input,select,summary,canvas):focus-visible { outline: 2px solid var(--ocean-accent); outline-offset: 4px; }
:where(button,select,input[type=range],summary) { touch-action: manipulation; }
:where(button):disabled { cursor: default; opacity: .5; }
:where(h1,h2,h3,h4) { text-wrap: balance; }

/* One typography scale, including the older expedition cards. */
body :is(#hud,#descent-ui,#ocean-navigation,#ocean-discovery,.read-aloud) {
  font-family: var(--ocean-font-body);
  color: var(--ocean-ink);
}
body #hud { --cyan: var(--ocean-accent); --mint: var(--ocean-accent); --amber: var(--ocean-accent); --line: var(--ocean-line); }
body :is(#hud-card-title,#hud-settings h2,#hud-log h3,#descent-notes h2,#descent-encounter h2,#ocean-discovery h2) {
  font: 400 clamp(26px,3vw,34px)/1.15 var(--ocean-font-display);
  letter-spacing: -.025em;
  color: var(--ocean-ink);
}
body :is(.ocean-research-book h3,.research-journey h4,.observation-notes h3) {
  font: 400 26px/1.25 var(--ocean-font-display); color: var(--ocean-ink);
}
body :is(#descent-notes p,#hud-card-fact,#hud-card-expert,.ocean-research-book p) {
  font: 400 16px/1.75 var(--ocean-font-body); color: var(--ocean-muted);
}
body :is(.descent-eyebrow,.encounter-kind,.ocean-dialog-heading>div>p) {
  font-family: var(--ocean-font-label); color: var(--ocean-accent); letter-spacing: .12em;
}
body :is(#ocean-discovery,#descent-notes,#hud .hud-panel) {
  background: var(--ocean-surface); border: 1px solid var(--ocean-line);
  border-radius: var(--ocean-radius); box-shadow: 0 16px 60px #0006;
}
body :is(.research-journey,.ocean-results a,.observation-question) {
  background: var(--ocean-raised); border-color: var(--ocean-line); border-radius: var(--ocean-radius);
}
body #ocean-discovery .ocean-dialog-heading { background: var(--ocean-surface); }
body #ocean-discovery .ocean-results strong { font-size: 16px; font-weight: 500; }
body #ocean-discovery .ocean-results small { font-size: 13px; color: var(--ocean-muted); }
body :is(#descent-notes .note-meta,.discovery-illustration figcaption,#hud-card-source,#ocean-discovery label,.ocean-result-count) {
  font-size: 13px; line-height: 1.6; color: var(--ocean-muted);
}
body :is(#hud-card-images,.hud-card-figure,.discovery-illustration img) { border-radius: var(--ocean-radius); }

/* The same secondary, selected and primary controls in every activity. */
body :is(#ocean-discovery button,#descent-ui button,#expedition-controls button,#hud button,.read-aloud button,.read-aloud select,#expedition-view) {
  font-family: var(--ocean-font-body); font-weight: 500; letter-spacing: 0;
  border-radius: var(--ocean-radius); border-color: var(--ocean-line);
  color: var(--ocean-ink); background: var(--ocean-surface); min-height: 44px;
}
body :is(#ocean-discovery button,#expedition-controls button,#hud button,.read-aloud button,.read-aloud select) { font-size: 14px; }
body :is(#ocean-discovery button,#descent-ui button,#expedition-controls button,#hud button):hover:not(:disabled) {
  background: var(--ocean-raised); border-color: var(--ocean-accent);
}
body :is(#ocean-discovery button,#descent-ui button,#expedition-controls button)[aria-pressed=true] {
  background: var(--ocean-raised); border-color: var(--ocean-accent); color: var(--ocean-accent);
}
body :is(#ocean-discovery input,#destination-query) {
  font: 16px/1.5 var(--ocean-font-body); border-radius: var(--ocean-radius);
  background: var(--ocean-bg); border-color: var(--ocean-line); color: var(--ocean-ink);
}
body :is(#ocean-discovery,#descent-ui,#hud,#expedition-controls) :focus-visible {
  outline: 2px solid var(--ocean-accent); outline-offset: 4px;
}
body .research-journey>a { background: var(--ocean-primary); color: var(--ocean-primary-ink); border-radius: var(--ocean-radius); font-size: 14px; }
body .read-aloud { font-size: 14px; line-height: 1.5; }
body .read-aloud button,body .read-aloud select { min-height: 44px; }
body .read-aloud label { font-size: 12px; }
body #hud .hud-intro-title { font-family: var(--ocean-font-display); font-weight: 400; text-transform: none; letter-spacing: -.035em; line-height: 1.1; }
body #hud-card-points { font-size: 14px; font-weight: 500; }
body #ocean-navigation { background: var(--ocean-surface); }
body .site-header { background: var(--ocean-bg); }
body #ocean-navigation .ocean-tools a,body #ocean-navigation .ocean-tools button { font: 400 13px/1.5 var(--ocean-font-body); border-radius: var(--ocean-radius); }
body #ocean-navigation #ocean-search { background: var(--ocean-raised); border-color: var(--ocean-line); }
body #ocean-navigation .ocean-location { font-size: 12px; color: var(--ocean-muted); }
body #ocean-navigation :focus-visible { outline-color: var(--ocean-accent); }
body .site-footer { background: var(--ocean-bg); color: var(--ocean-muted); border-color: var(--ocean-line); font-family: var(--ocean-font-label); }
body .site-footer a { color: var(--ocean-muted); }
body .site-footer .site-language,body .site-footer .site-projects a { border-radius: var(--ocean-radius); border-color: var(--ocean-line); }
body .site-footer a:hover { color: var(--ocean-accent); }
@media(max-width:760px) {
  body #ocean-navigation .ocean-tools a,body #ocean-navigation .ocean-tools button { font-size: 12px; }
  body #ocean-navigation .ocean-location { font-size: 11px; }
  body #ocean-discovery { padding: 22px; }
  body #ocean-discovery .ocean-results { grid-template-columns: 1fr; }
}
@media(prefers-reduced-motion:reduce) {
  :where(button,a) { transition: none; }
}
body #hud .hud-panel :is(h1,h2,h3) { font-family: var(--ocean-font-display); font-weight: 400; color: var(--ocean-ink); letter-spacing: -.025em; }
body #hud-mission-title { font-family: var(--ocean-font-body); font-weight: 600; }
/* Reading takes priority over swimming controls while a mobile card is open. */
@media(max-width:700px) {
  body.ocean-unified #descent-notes:not([data-search]) { bottom: 12px; max-height: calc(100dvh - var(--ocean-header-height,195px) - var(--ocean-footer-height,180px) - 24px); }
  body #descent-notes .discovery-illustration img { max-height: min(170px,20dvh); }
}
body #descent-ui #descent-close { position: sticky; top: 0; z-index: 2; background: var(--ocean-surface)!important; }
body.ocean-unified #hud #hud-card {
  bottom: calc(var(--ocean-footer-height,80px) + 12px);
  max-height: calc(100dvh - var(--ocean-header-height,178px) - var(--ocean-footer-height,80px) - 24px);
  background: var(--ocean-surface);
}