/* ============================================================================
   PHC 2026 — the public sub-pages inside the GLOBAÏA Layout.
   Linked by PhcShell.astro on /phc2026/… only, never by the gated PIK demo, and
   everything is scoped under body.phc-in-site, which only PhcShell sets.

   The figure pages were written as standalone documents. Inside the Layout three
   things change under them:
     1. the site header is fixed and 80px tall at every width;
     2. <body> wears Tailwind's bg-black / text-gray-100 / font-alcyone, which
        beat each page's own `body {}` rule on specificity;
     3. the site header is transparent at the top of the page, which is right on
        a dark page and leaves white type on white in the figures' light theme.
   ========================================================================== */

/* ── 2. The page's own surface and type, in both themes ────────────────────── */
body.phc-in-site {
  background: var(--fig-bg, var(--phc-bg, #08090c));
  color: var(--fig-ink, var(--phc-text, #f0f1f3));
  font-family: var(--phc-font, "Alcyone", system-ui, sans-serif);
  font-size: 16px;
  line-height: 1.55;
}

/* ── 1. Clear the fixed header ─────────────────────────────────────────────── */
body.phc-in-site #main-content { padding-top: 80px; }

/* ── 3. The site chrome stays dark over a light figure ─────────────────────────
   Same decision as the /phc2026/ page itself (phc-public.css): light is the
   figure's reading theme, not a site theme. */
html[data-theme="light"] body.phc-in-site #site-header {
  background-color: rgba(6, 10, 18, 0.92) !important;
  border-bottom-color: rgba(255, 255, 255, 0.1) !important;
}
html[data-theme="light"] body.phc-in-site #site-footer.site-footer-glass {
  background-color: #070b12;
  border-top-color: rgba(255, 255, 255, 0.1);
}

/* ── Deep time to deep future: a full-screen canvas ────────────────────────────
   The canvas still fills the viewport and runs under the header (the header is
   see-through over it). Only the pieces that must be read or clicked move down:
   the title, which the engine measures to place the plot, and the Info panel,
   whose close button would otherwise sit under the header. */
body.phc-in-site:has(#h3k-app) { background: #0c0e12; color: #e9e9ec; }
body.phc-in-site:has(#h3k-app) #main-content { padding-top: 0; }
/* The page is one fixed viewport with nothing in the flow, so the footer would
   land at the top, under the header, over the stripes. The joint credit sits
   in the corner (and in the Info panel on phones) instead. */
body.phc-in-site:has(#h3k-app) #site-footer { display: none; }
body.phc-in-site .h3k-title { top: 94px; }
body.phc-in-site .h3k-info-panel { top: 80px; height: calc(100% - 80px); }
@media (orientation: landscape) and (max-height: 500px) {
  body.phc-in-site .h3k-title { top: 88px; }
}