:root {
  --intro-ink: #dff7f2;
  --intro-muted: #6f8580;
  --intro-line: rgba(191, 239, 230, .2);
  --intro-accent: #9be9dc;
  --intro-reveal-duration: 950ms;
}

html.intro-runtime,
html.intro-runtime body {
  width: 100%;
  min-height: 100%;
  overflow: hidden !important;
  overscroll-behavior: none;
  background: #000;
}

html.intro-runtime body > .preloader,
html.intro-runtime body > .skip-link {
  visibility: hidden !important;
  pointer-events: none !important;
}

.cinematic-gateway {
  position: fixed;
  inset: 0;
  z-index: 20000;
  overflow: hidden;
  isolation: isolate;
  background: #000;
  color: var(--intro-ink);
  font-family: var(--mono, "IBM Plex Mono", "Courier New", monospace);
  touch-action: manipulation;
}

.cinematic-gateway[hidden] { display: none; }

.cinematic-video-layer,
.cinematic-black,
.cinematic-entry {
  position: absolute;
  inset: 0;
}

.cinematic-video-layer {
  z-index: 3;
  overflow: hidden;
  background: #000;
  opacity: 0;
  visibility: hidden;
}

.cinematic-video-layer::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: radial-gradient(circle at 50% 48%, transparent 55%, rgba(0, 0, 0, .16) 100%);
}

.cinematic-video {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: 50% 50%;
  background: #000;
}

.cinematic-black {
  z-index: 2;
  background: #000;
  opacity: 1;
  pointer-events: none;
}

.cinematic-entry {
  z-index: 5;
  display: grid;
  place-items: center;
  padding: max(24px, env(safe-area-inset-top)) max(24px, env(safe-area-inset-right)) max(24px, env(safe-area-inset-bottom)) max(24px, env(safe-area-inset-left));
  background: #000;
  text-align: center;
}

.cinematic-entry-inner {
  width: min(430px, 100%);
  display: grid;
  justify-items: center;
}

.cinematic-mark {
  position: relative;
  width: 48px;
  height: 48px;
  margin-bottom: 29px;
  border: 1px solid rgba(211, 251, 243, .5);
  border-radius: 50%;
}

.cinematic-mark::before,
.cinematic-mark::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  background: var(--intro-accent);
  opacity: .22;
  transform: translate(-50%, -50%);
}

.cinematic-mark::before { width: 1px; height: 66px; }
.cinematic-mark::after { width: 66px; height: 1px; }
.cinematic-mark i { position: absolute; inset: 18px; border: 1px solid var(--intro-ink); border-radius: 50%; }

.cinematic-entry-label,
.cinematic-entry-status {
  margin: 0;
  text-transform: uppercase;
  letter-spacing: .2em;
}

.cinematic-entry-label {
  color: var(--intro-ink);
  font-size: clamp(10px, 1vw, 12px);
  line-height: 1.4;
}

.cinematic-entry-status {
  min-height: 1.4em;
  margin-top: 9px;
  color: var(--intro-muted);
  font-size: 7px;
  line-height: 1.5;
}

.cinematic-entry-actions {
  display: grid;
  justify-items: center;
  gap: 11px;
  margin-top: 29px;
}

.cinematic-enter,
.cinematic-alternate,
.cinematic-skip {
  border: 0;
  color: var(--intro-muted);
  font: 7px/1 var(--mono, "IBM Plex Mono", "Courier New", monospace);
  letter-spacing: .18em;
  text-transform: uppercase;
}

.cinematic-enter {
  min-width: 166px;
  padding: 13px 18px;
  border: 1px solid var(--intro-line);
  background: rgba(4, 12, 12, .44);
}

.cinematic-alternate {
  padding: 8px 10px;
  color: #52615e;
}

.cinematic-enter:hover,
.cinematic-alternate:hover,
.cinematic-skip:hover { color: var(--intro-ink); }

.cinematic-enter:focus-visible,
.cinematic-alternate:focus-visible,
.cinematic-skip:focus-visible {
  color: var(--intro-ink);
  outline: 1px solid var(--intro-accent);
  outline-offset: 4px;
}

.cinematic-skip {
  position: absolute;
  z-index: 6;
  right: max(22px, env(safe-area-inset-right));
  bottom: max(20px, env(safe-area-inset-bottom));
  padding: 10px;
  opacity: 0;
  visibility: hidden;
  transition: opacity .5s ease;
}

.cinematic-gateway.skip-available .cinematic-skip {
  opacity: .66;
  visibility: visible;
}

.cinematic-gateway[data-state="CINEMATIC_PLAYING"] .cinematic-video-layer,
.cinematic-gateway[data-state="HANDOFF_PREPARING"] .cinematic-video-layer,
.cinematic-gateway[data-state="BLACKOUT"] .cinematic-video-layer {
  opacity: 1;
  visibility: visible;
}

.cinematic-gateway[data-state="CINEMATIC_PLAYING"] .cinematic-entry,
.cinematic-gateway[data-state="HANDOFF_PREPARING"] .cinematic-entry,
.cinematic-gateway[data-state="BLACKOUT"] .cinematic-entry,
.cinematic-gateway[data-state="ARCHIVE_REVEAL"] .cinematic-entry,
.cinematic-gateway[data-state="ARCHIVE_ACTIVE"] .cinematic-entry {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

.cinematic-gateway.is-paused .cinematic-entry {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  background: rgba(0, 0, 0, .92);
}

.cinematic-gateway[data-state="HANDOFF_PREPARING"] .cinematic-black,
.cinematic-gateway[data-state="BLACKOUT"] .cinematic-black,
.cinematic-gateway[data-state="ARCHIVE_REVEAL"] .cinematic-black {
  z-index: 4;
}

.cinematic-gateway.is-skip-fading .cinematic-black {
  opacity: 0;
  transition: opacity 450ms ease;
}

.cinematic-gateway.is-skip-fading.black-visible .cinematic-black { opacity: 1; }

.cinematic-gateway[data-state="ARCHIVE_REVEAL"] .cinematic-black {
  opacity: 0;
  transition: opacity var(--intro-reveal-duration) cubic-bezier(.33, 1, .68, 1);
}

.cinematic-gateway[data-state="ARCHIVE_REVEAL"] .cinematic-video-layer,
.cinematic-gateway[data-state="ARCHIVE_ACTIVE"] .cinematic-video-layer {
  opacity: 0;
  visibility: hidden;
}

.cinematic-gateway ::cue {
  color: #e5f4f0;
  background: rgba(0, 4, 5, .78);
  font: 13px/1.45 var(--mono, monospace);
}

body.intro-pending .archive-workspace,
body.intro-pending .archive-directory,
body.intro-pending .system-bar,
body.intro-pending .os-window {
  animation-play-state: paused !important;
}

body.intro-pending .online-announcement { display: none !important; }

@media (max-width: 760px) and (orientation: portrait) {
  .cinematic-video { object-position: 50% 50%; }
  .cinematic-video-layer::after { background: rgba(0, 0, 0, .08); }
  .cinematic-skip { right: 50%; transform: translateX(50%); }
}

@media (prefers-reduced-motion: reduce) {
  .cinematic-skip { transition-duration: .01ms; }
  .cinematic-gateway.is-skip-fading .cinematic-black { transition-duration: 120ms; }
  .cinematic-gateway[data-state="ARCHIVE_REVEAL"] .cinematic-black { transition-duration: 120ms; }
}


/* ===== ENTRY THRESHOLD =====================================================
   The front door. Status rails, the access notice, and real counts pulled from
   the archive — a threshold you cross, rather than a button you press. */
.cinematic-entry .entry-field{position:absolute;inset:0;width:100%;height:100%;display:block;z-index:0;pointer-events:none}
.cinematic-entry-inner{position:relative;z-index:1;width:100%;max-width:none;height:100%;display:grid;
  grid-template-columns:minmax(120px,1fr) minmax(0,660px) minmax(120px,1fr);align-items:center;gap:clamp(16px,4vw,70px);
  padding:clamp(22px,4vh,54px) clamp(20px,5vw,90px)}
.entry-core{grid-column:2;display:grid;justify-items:center;text-align:center;gap:0}

.cinematic-mark{width:74px;height:74px;margin-bottom:20px;opacity:.9}
.cinematic-mark svg{width:100%;height:100%;fill:none;stroke:var(--intro-ink);stroke-width:1.1;opacity:.82}
.cinematic-mark svg circle:last-of-type{fill:var(--intro-ink);opacity:.55}

.entry-title{margin:0;color:#f2f6fa;font:300 clamp(26px,3.4vw,40px)/1 var(--mono);letter-spacing:.34em;text-indent:.34em}
.entry-sub{margin:14px 0 0;color:#9fb0b8;font:11px var(--mono);letter-spacing:.3em}
.entry-tagline{margin:26px 0 0;padding-top:22px;border-top:1px solid rgba(191,239,230,.14);width:100%;
  color:#8fa2ab;font:10px/1.7 var(--mono);letter-spacing:.16em}
.entry-copy{margin-top:22px;display:grid;gap:15px;max-width:52ch}
.entry-copy p{margin:0;color:#7e9098;font:11px/1.85 var(--mono);letter-spacing:.05em}

.entry-notice{width:100%;max-width:430px;margin-top:30px;padding:17px 19px;border:1px solid rgba(191,239,230,.17);
  background:rgba(6,10,12,.5);text-align:left}
.entry-notice header{display:flex;align-items:center;gap:10px;padding-bottom:11px;border-bottom:1px solid rgba(191,239,230,.13)}
.entry-notice svg{width:19px;height:19px;flex:0 0 auto;fill:none;stroke:#c9b98a;stroke-width:1.4;opacity:.85}
.entry-notice h2{margin:0;color:#c2d2d8;font:10px var(--mono);letter-spacing:.24em;font-weight:400}
.entry-notice p{margin:12px 0 0;color:#7b8d95;font:10.5px/1.75 var(--mono);letter-spacing:.03em}
.entry-notice footer{margin-top:14px;padding-top:11px;border-top:1px solid rgba(191,239,230,.13);
  color:#8a9ba2;font:9px var(--mono);letter-spacing:.18em}

.cinematic-entry-actions{width:100%;max-width:430px;margin-top:26px}
.cinematic-enter{width:100%;padding:17px 20px;border:1px solid rgba(200,238,232,.4);background:rgba(9,14,16,.6);
  color:#e6f2f4;font:11px var(--mono);letter-spacing:.3em;cursor:pointer;transition:background .25s,border-color .25s,color .25s}
.cinematic-enter:hover,.cinematic-enter:focus-visible{background:rgba(24,36,40,.85);border-color:#9be9dc;color:#fff;outline:none}
.cinematic-entry-status{margin-top:14px;color:#5d6f76;font:8px var(--mono);letter-spacing:.16em}

.entry-secondary{display:flex;justify-content:center;gap:clamp(18px,4vw,50px);margin-top:20px}
.entry-secondary button{padding:6px 2px;border:0;background:0;color:#6f838b;font:9px var(--mono);letter-spacing:.18em;cursor:pointer}
.entry-secondary button:hover,.entry-secondary button:focus-visible{color:#cfe3e6;outline:none}

.entry-rail{display:grid;gap:clamp(18px,4vh,42px);align-content:center}
.entry-rail-left{grid-column:1;justify-items:start;text-align:left}
.entry-rail-right{grid-column:3;justify-items:end;text-align:right}
.entry-rail span{display:block;padding-bottom:6px;border-bottom:1px solid rgba(191,239,230,.13);
  color:#5f7178;font:8px var(--mono);letter-spacing:.19em;min-width:96px}
.entry-rail b{display:block;margin-top:8px;color:#a8bcc2;font:11px/1.5 var(--mono);font-weight:400;letter-spacing:.08em}

.entry-badge{position:absolute;bottom:clamp(20px,5vh,58px);display:grid;justify-items:center;gap:9px;opacity:.72}
.entry-badge-left{left:clamp(20px,5vw,88px)}
.entry-badge-right{right:clamp(20px,5vw,88px)}
.entry-badge i{width:34px;height:34px;display:grid;place-items:center;border:1px solid rgba(191,239,230,.2);border-radius:50%;color:#9fb4ba}
.entry-badge svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.2}
.entry-badge span{color:#5f7178;font:7.5px/1.5 var(--mono);letter-spacing:.14em;text-align:center}

.entry-epigraph{position:absolute;left:50%;bottom:clamp(16px,3.6vh,40px);transform:translateX(-50%);width:max-content;
  color:#5c6e75;font:italic 10px/1.75 var(--mono);letter-spacing:.05em;text-align:center}
.entry-epigraph em{display:inline-block;margin-top:8px;font-style:normal;letter-spacing:.3em}

@media (max-width:1080px){
  .cinematic-entry-inner{grid-template-columns:minmax(0,1fr);gap:0}
  .entry-core{grid-column:1}
  .entry-rail,.entry-badge{display:none}
  .entry-epigraph{position:static;transform:none;margin:26px auto 0}
}
@media (max-height:720px){
  .entry-copy,.entry-epigraph{display:none}
  .entry-notice{margin-top:20px}
  .cinematic-mark{width:54px;height:54px;margin-bottom:12px}
}
.entry-notice-flash{animation:entryNoticeFlash 1.4s ease-out}
@keyframes entryNoticeFlash{0%,100%{border-color:rgba(191,239,230,.17)}30%{border-color:#c9b98a;background:rgba(201,185,138,.07)}}
.entry-rail b{white-space:pre-line}

/* Terms of Access — a real panel, opened from the entry threshold. */
.entry-terms{position:fixed;inset:0;z-index:40;display:grid;place-items:center;padding:clamp(16px,4vh,54px);
  background:rgba(2,4,6,.86);backdrop-filter:blur(3px);
  /* a definite row, or the article's max-height:100% resolves against an auto track,
     the panel overflows the viewport and its own footer button becomes unreachable */
  grid-template-rows:minmax(0,1fr);grid-template-columns:minmax(0,1fr)}
.entry-terms[hidden]{display:none!important}
.entry-terms article{justify-self:center;align-self:center;width:min(720px,100%);max-height:100%;display:grid;grid-template-rows:auto minmax(0,1fr) auto;
  border:1px solid rgba(191,239,230,.22);background:#070a0c;text-align:left}
.entry-terms header{position:relative;padding:20px 24px 16px;border-bottom:1px solid rgba(191,239,230,.14)}
.entry-terms header h2{margin:6px 0 0;color:#e6f2f4;font:300 24px/1.15 var(--mono);letter-spacing:.06em}
.entry-terms header .record-eyebrow{color:#5f7178;font:8px var(--mono);letter-spacing:.22em}
.entry-terms header button{position:absolute;right:18px;top:20px;padding:6px 11px;border:1px solid rgba(191,239,230,.2);
  background:0;color:#8fa2ab;font:8px var(--mono);letter-spacing:.16em;cursor:pointer}
.entry-terms header button:hover{color:#fff;border-color:#9be9dc}
.entry-terms-body{overflow-y:auto;overscroll-behavior:contain;padding:6px 24px 20px}
.entry-terms-body section{padding:18px 0;border-bottom:1px solid rgba(191,239,230,.09)}
.entry-terms-body section:last-child{border-bottom:0}
.entry-terms-body h3{margin:0 0 9px;color:#a8bcc2;font:10px var(--mono);letter-spacing:.2em;font-weight:400}
.entry-terms-body p{margin:0 0 10px;color:#84969e;font:12px/1.75 var(--sans);max-width:66ch}
.entry-terms-body p:last-child{margin-bottom:0}
.entry-terms-body b{color:#cfe3e6;font-weight:400}
.entry-terms footer{padding:14px 24px;border-top:1px solid rgba(191,239,230,.14)}
.entry-terms-accept{width:100%;padding:13px;border:1px solid rgba(200,238,232,.34);background:rgba(9,14,16,.7);
  color:#e6f2f4;font:10px var(--mono);letter-spacing:.24em;cursor:pointer}
.entry-terms-accept:hover{background:rgba(24,36,40,.9);border-color:#9be9dc;color:#fff}