/* H1 production pass. Shared H1/H2 layers retain their registration at TR-01. */
.brand { width: 300px; aspect-ratio: 980 / 150; }
.brand > svg { width: 100%; height: 100%; }
.entry-access, .scroll-cue { letter-spacing: 0; }
.entry-access {
  color: #737b83;
  min-height: 44px;
  min-width: 64px;
  display: grid;
  align-items: center;
  justify-content: flex-end;
  top: calc(5.4svh + 1px);
  border: 0;
  padding: 0;
  background: transparent;
  font-family: inherit;
  font-weight: inherit;
  line-height: inherit;
  text-align: right;
  cursor: pointer;
}
.entry-access:hover, .entry-access:focus-visible { color: #cfd4d8; }
.entry-access > span { grid-area: 1 / 1; }
.entry-access-hover { visibility: hidden; }
.entry-access:hover .entry-access-default, .entry-access:focus-visible .entry-access-default { visibility: hidden; }
.entry-access:hover .entry-access-hover, .entry-access:focus-visible .entry-access-hover { visibility: visible; }
.entry-access:focus-visible { outline: 1px solid #737b83; outline-offset: 5px; }
.entry-ui { bottom: max(5.8svh, calc(env(safe-area-inset-bottom) + 24px)); }
.entry-ui .gauge { min-width: 0; }
.entry-ui, .brand { isolation: isolate; transform: translateZ(0); }
.entry-ui { overflow: hidden; }
.scroll-cue { padding-left: 1px; }
#h1 { background: transparent; z-index: 2; }
#h2 > .stage { position: fixed; z-index: 1; }
html:not(.static-mode) #h1 .flow-stage > .dna-art,
html:not(.static-mode) #h1 .flow-stage > .brand,
html:not(.static-mode) #h1 .flow-stage > .entry-ui { display: none; }
#h2[data-entry="true"] .copy-tag { display: none; }
#fallback > .entry-fallback {
  position: relative;
  display: block;
  padding: 0;
  height: 100svh;
  min-height: 100svh;
  overflow: hidden;
  background: #000;
}
.entry-fallback .flow-stage { height: 100svh; isolation: isolate; }
.entry-fallback .brand > svg { display: block; }
@media (max-width: 1100px) and (min-width: 701px) {
  .brand { width: 240px; }
}
@media (max-width: 700px) {
  .brand { width: 200px; top: max(36px, calc(env(safe-area-inset-top) + 16px)); }
  .entry-access { top: max(104px, calc(env(safe-area-inset-top) + 88px)); white-space: nowrap; }
  .entry-ui { bottom: max(44px, calc(env(safe-area-inset-bottom) + 24px)); }
}
@media (max-width: 359px) {
  .brand { width: 180px; }
  .entry-access { min-width: 56px; }
  .entry-ui { gap: 20px; }
}

@media(max-width:380px){.entry-access{top:104px;white-space:nowrap}}

/* Keep H1 access registered with the pinned H2 visual. */
html:not(.static-mode) #h1 .entry-access{position:fixed}
