/* Rules this site needs after styles/site.css: values the old platform set from
   script at runtime, given static defaults here so pages render without it. */

/* The fixed header overlaps the page; the first section clears it. site.js
   replaces the default with the measured height. */
:root { --header-height: 84px; }
@media (min-width: 768px) { :root { --header-height: 69px; } }
#page .region > .page-section:first-child { padding-top: var(--header-height); }

/* Scroll-back header. */
#header { transition: transform 0.3s ease; }
#header.header--hidden { transform: translateY(-100%); }

/* Native video fills its 16:9 player box (the old player wrapped it in its own markup). */
.sqs-native-video .native-video-player { position: relative; overflow: hidden; }
.sqs-native-video .native-video-player > video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; background: #000; }

/* Text highlight overlays, drawn by site.js. */
.TextShape-node { position: absolute; pointer-events: none; }
.TextShape-node svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.TextShape-node path { fill: none; stroke: var(--stroke); stroke-linecap: round; stroke-linejoin: round; }

/* "View fullsize" overlay, opened by site.js. */
.local-lightbox { position: fixed; inset: 0; z-index: 10000; display: grid; place-items: center; background: rgba(0, 0, 0, 0.95); cursor: zoom-out; }
.local-lightbox img { max-width: 96vw; max-height: 96vh; width: auto; height: auto; }
.local-lightbox-close { position: absolute; top: 16px; right: 16px; width: 32px; height: 32px; border: 0; padding: 0; background: none; cursor: pointer; }
.local-lightbox-close::before, .local-lightbox-close::after { content: ''; position: absolute; left: 50%; top: 50%; width: 24px; height: 2px; background: #fff; }
.local-lightbox-close::before { transform: translate(-50%, -50%) rotate(45deg); }
.local-lightbox-close::after { transform: translate(-50%, -50%) rotate(-45deg); }