/* The home page's base: its self-hosted faces (OFL, Latin subsets, licences beside them), the fixed 3D stage behind
   the page, and the rule that page sections let clicks through to the HiMen except on their own text and controls. */
@font-face { font-family: "Boldonse"; src: url(fonts/Boldonse-Regular.woff2) format("woff2"); font-display: swap; }
@font-face { font-family: "Italiana"; src: url(fonts/Italiana-Regular.woff2) format("woff2"); font-display: swap; }
@font-face { font-family: "Jura"; src: url(fonts/Jura-Light.woff2) format("woff2"); font-weight: 300; font-display: swap; }
@font-face { font-family: "Work Sans"; src: url(fonts/WorkSans-Regular.woff2) format("woff2"); font-weight: 400; font-display: swap; }

*, *::before, *::after { box-sizing: border-box; }
html { background: #000; color-scheme: dark; -webkit-text-size-adjust: 100%; }
body { margin: 0; background: #000; overflow-x: hidden; -webkit-font-smoothing: antialiased; }
#canvas-container { position: fixed; inset: 0; z-index: 0; }
#canvas-container canvas { display: block; width: 100% !important; height: 100% !important; }
#loading { position: fixed; inset: 0; display: grid; place-items: center; z-index: 0; color: #6b6e75; font: 400 14px/1 system-ui, sans-serif; }
main, header.top, footer.foot { position: relative; z-index: 2; }
[data-sec] { pointer-events: none; }
[data-sec] :is(a, button, h1, h2, h3, p, li, dt, dd, summary, input, label) { pointer-events: auto; }
a { color: inherit; }
img, svg { display: block; }
.skip { position: absolute; left: -999px; top: 8px; z-index: 20; padding: 8px 12px; background: #fff; color: #000; }
.skip:focus { left: 16px; }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { transition-duration: 1ms !important; animation-duration: 1ms !important; animation-iteration-count: 1 !important; } }