@media (max-width: 700px) {
  #ga-attribution {
    position: static !important;
    right: auto !important;
    bottom: auto !important;
    width: max-content !important;
    max-width: calc(100vw - 16px) !important;
    margin: 16px auto max(16px, env(safe-area-inset-bottom)) !important;
    padding: 6px 9px !important;
    gap: 5px !important;
    border-radius: 999px !important;
    font-size: 10.5px !important;
    line-height: 1 !important;
    opacity: .68 !important;
    transform: none !important;
    transform-origin: center !important;
  }

  #ga-attribution:hover,
  #ga-attribution:focus-visible {
    opacity: .86 !important;
    transform: none !important;
  }
}

/* r68: the full attribution badge is safe only on genuinely wide canvases.
   Compact desktop keeps an edge label instead of covering product controls. */
@media (min-width: 701px) and (max-width: 1700px),
       (min-width: 701px) and (max-height: 860px) {
  #ga-attribution {
    right: 0 !important;
    top: 50% !important;
    bottom: auto !important;
    max-width: 24px !important;
    min-height: 104px !important;
    padding: 8px 5px !important;
    gap: 3px !important;
    overflow: hidden !important;
    border-radius: 12px 0 0 12px !important;
    font-size: 9px !important;
    line-height: 1 !important;
    letter-spacing: .04em !important;
    text-align: center !important;
    writing-mode: vertical-rl !important;
    opacity: .34 !important;
    transform: translateY(-50%) !important;
  }

  #ga-attribution:hover,
  #ga-attribution:focus-visible {
    max-width: 30px !important;
    opacity: .86 !important;
    transform: translateY(-50%) !important;
  }
}

/* r68: marketing hero scale and theatre containment. */
@media (min-width: 701px) {
  body:has(.hero-copy .grad):has(.hero-meta) .hero-copy {
    width: min(700px, 50vw) !important;
    max-width: min(700px, 50vw) !important;
  }

  body:has(.hero-copy .grad):has(.hero-meta) .hero-copy h1 {
    max-width: 10.6ch !important;
    font-size: clamp(4.4rem, 6vw, 6.3rem) !important;
    line-height: .95 !important;
    letter-spacing: -.045em !important;
    text-wrap: balance;
  }

  body:has(.local-time) .hero-copy {
    width: min(760px, 52vw) !important;
    max-width: min(760px, 52vw) !important;
    padding-left: clamp(68px, 7vw, 112px) !important;
    padding-top: clamp(132px, 15vh, 186px) !important;
  }

  body:has(.local-time) .hero-copy h1 {
    max-width: 10.2ch !important;
    font-size: clamp(4.2rem, 6.3vw, 6.4rem) !important;
    line-height: .95 !important;
    letter-spacing: -.035em !important;
    text-wrap: balance;
  }

  body:has(.console-title) .hero-inner {
    padding-right: clamp(500px, 40vw, 650px) !important;
  }

  body:has(.console-title) .hero h1 {
    max-width: 720px !important;
    font-size: clamp(4.4rem, 6.2vw, 6.5rem) !important;
    line-height: .92 !important;
    letter-spacing: -.045em !important;
  }

  body:has(.console-title) .hero-sub {
    max-width: 570px !important;
    padding: 12px 14px !important;
    color: #b7c4b5 !important;
    font-weight: 450 !important;
    background: rgba(5, 10, 8, .68) !important;
    border: 1px solid rgba(125, 255, 79, .14) !important;
    text-shadow: 0 1px 16px rgba(0, 0, 0, .72) !important;
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
  }

  body:has(.flavor-dock) .scene-fixed {
    transform: translate3d(9vw, 0, 0) scale(.92) !important;
    transform-origin: center center !important;
    clip-path: inset(0 0 0 48%);
  }
}

@media (min-width: 701px) and (max-height: 850px) {
  body:has(.hero-copy .grad):has(.hero-meta) .hero-copy {
    padding-top: 112px !important;
    padding-bottom: 54px !important;
  }

  body:has(.hero-copy .grad):has(.hero-meta) .hero-copy h1 {
    font-size: clamp(4rem, 5.4vw, 5.5rem) !important;
  }

  body:has(.hero-copy .grad):has(.hero-meta) .hero-meta {
    margin-top: 30px !important;
  }

  body:has(.local-time) .hero-copy {
    padding-top: 110px !important;
  }

  body:has(.local-time) .hero-copy h1 {
    margin-bottom: 14px !important;
    font-size: clamp(3.9rem, 5.6vw, 5.5rem) !important;
  }

  body:has(.local-time) .lede {
    margin-bottom: 18px !important;
    padding: 10px 13px !important;
    font-size: .98rem !important;
    line-height: 1.45 !important;
  }

  body:has(.local-time) .scroll-hint {
    margin-top: 22px !important;
  }

  body:has(.console-title) .hero-inner {
    padding-top: 72px !important;
    padding-bottom: 34px !important;
  }

  body:has(.console-title) .hero h1 {
    font-size: clamp(4rem, 5.6vw, 5.6rem) !important;
  }

  body:has(.console-title) .hero-sub {
    margin: 14px 0 18px !important;
    font-size: .98rem !important;
    line-height: 1.45 !important;
  }

  body:has(.console-title) .hero-stats {
    margin-top: 18px !important;
  }

  body:has(.marquee-note) .hero-copy {
    padding-top: 104px !important;
    padding-bottom: 52px !important;
  }

  body:has(.marquee-note) .hero-copy h1 {
    font-size: clamp(3.8rem, 5.8vw, 4.9rem) !important;
  }

  body:has(.marquee-note) .marquee-note {
    margin-top: 34px !important;
  }
}

@media (max-width: 700px) {
  body:has(.hero-ticker) .hero-inner {
    margin: 108px 16px 70px !important;
    padding: 20px 18px 22px !important;
    border: 1px solid rgba(78, 232, 255, .16) !important;
    border-radius: 22px !important;
    background: linear-gradient(145deg, rgba(3, 8, 12, .9), rgba(3, 8, 12, .66)) !important;
    box-shadow: 0 24px 70px rgba(0, 0, 0, .28) !important;
    -webkit-backdrop-filter: blur(14px);
    backdrop-filter: blur(14px);
  }

  body:has(.hero-ticker) .hero-sub {
    color: rgba(226, 239, 240, .78) !important;
    font-weight: 400 !important;
    text-shadow: 0 1px 18px rgba(0, 0, 0, .8) !important;
  }

  body:has(.flavor-dock) .scene-fixed {
    display: none !important;
  }

  body:has(.flavor-dock) .hero-content {
    isolation: isolate;
    background: linear-gradient(90deg, color-mix(in srgb, var(--bg) 97%, transparent) 0 74%, color-mix(in srgb, var(--bg) 84%, transparent) 88%, transparent 100%);
  }

  body:has(.eeg-fixed) .hero {
    padding-bottom: 86px !important;
  }

  body:has(.eeg-fixed) .eeg-fixed {
    position: absolute !important;
    top: calc(100svh - 72px) !important;
    bottom: auto !important;
  }

  body:has(.eeg-fixed) .hero-stats {
    margin-bottom: 18px !important;
  }
}

/* r68: minimum readable product-interface type. The route families stay intact;
   density is preserved with wrapping and local scrolling instead of 6–9px type. */
body:has(.task-rail) :is(.diff, .console, .file-summary pre) {
  font-size: 11px !important;
  line-height: 1.55 !important;
}

body:has(.task-rail) :is(.checkout-step, .field-error, .secure, .metric-card small, .data-row span, .empty-state p) {
  font-size: 11px !important;
  line-height: 1.35 !important;
}

body:has(.task-rail) :is(.metric-card span, .data-row b, .phase, .task-summary p, .preview label) {
  font-size: 12px !important;
}

body:has(.task-rail) .workflow,
body:has(.asset-rail) .tabs {
  position: relative;
  scrollbar-width: thin;
  overscroll-behavior-inline: contain;
}

@media (max-width: 900px) {
  body:has(.task-rail) .workflow.has-inline-overflow::after,
  body:has(.asset-rail) .tabs.has-inline-overflow::after {
    content: "Scroll →";
    position: absolute;
    z-index: 4;
    top: 50%;
    right: 8px;
    transform: translateY(-50%);
    padding: 6px 8px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .92);
    color: #516078;
    font-size: 11px;
    font-weight: 750;
    box-shadow: -12px 0 20px rgba(255, 255, 255, .94);
    pointer-events: none;
  }
}

body:has(.asset-rail) :is(.asset-item p, .machine-label span, .fact span, .threshold, .oee-card span, .shift-block) {
  font-size: 11px !important;
  line-height: 1.35 !important;
}

body:has(.asset-rail) :is(.rel-node .node-type, .rel-node small) {
  font-size: 11px !important;
}

body:has(.asset-rail) .rel-node strong {
  font-size: 12px !important;
}

body:has(.asset-rail) .tabs button {
  font-size: 11px !important;
}

body:has(.hardware-head) :is(.gauge span, .rail small, .vital small, .quick span, .zone p) {
  font-size: 11px !important;
  line-height: 1.3 !important;
}

body:has(.hardware-head) :is(.eyebrow, .title span, .vital span, .head p) {
  font-size: 12px !important;
  line-height: 1.35 !important;
}

body:has(.hardware-head) :is(.surface, .view) {
  min-height: 0;
}

body:has(.hardware-head) .clock {
  flex: 0 0 auto;
  white-space: nowrap;
}

body:has(.overview-dashboard) :is(.capacity-metric span, .map-unit, .map-legend, .compact-task small) {
  font-size: 11px !important;
  line-height: 1.3 !important;
}

body:has(.energy-world) :is(.node span, .metric span, .bottom-nav button, .energy-chart-svg text, .timeline-legend) {
  font-size: 11px !important;
  line-height: 1.25 !important;
}

body:has(.home-select) :is(.device-reading span, .scene-chip small, .bar span, .status-tag, .device-card p) {
  font-size: 11px !important;
  line-height: 1.3 !important;
}

body:has(.home-select) .device-list {
  min-height: 0 !important;
  overflow-y: auto !important;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  scrollbar-color: color-mix(in srgb, var(--green) 58%, transparent) transparent;
  padding-right: 3px;
}

body:has(.cockpit .wheel-remote) :is(.gauge-copy span, .gauge-copy small, .route-callout span, .route-alts button small, .map-card small, .eta) {
  font-size: 11px !important;
  line-height: 1.3 !important;
}

body:has(.hero-down.intro-4) .hero-sub {
  font-size: 1rem !important;
  font-weight: 400 !important;
  line-height: 1.6 !important;
}

@media (max-width: 700px) {
  body:has(.task-rail) :is(.diff, .console, .file-summary pre),
  body:has(.task-rail) :is(.checkout-step, .field-error, .secure, .metric-card small, .data-row span, .empty-state p),
  body:has(.asset-rail) :is(.asset-item p, .machine-label span, .fact span, .threshold, .oee-card span, .shift-block, .rel-node .node-type, .rel-node small),
  body:has(.hardware-head) :is(.gauge span, .rail small, .vital small, .quick span, .zone p),
  body:has(.overview-dashboard) :is(.capacity-metric span, .map-unit, .map-legend, .compact-task small),
  body:has(.energy-world) :is(.node span, .metric span, .bottom-nav button, .timeline-legend),
  body:has(.home-select) :is(.device-reading span, .scene-chip small, .bar span, .status-tag, .device-card p),
  body:has(.cockpit .wheel-remote) :is(.gauge-copy span, .gauge-copy small, .route-callout span, .route-alts button small, .map-card small, .eta) {
    font-size: 12px !important;
  }
}

/* r68: keep authorship available without covering product controls at any desktop width. */
@media (min-width: 701px) {
  #ga-attribution {
    top: 50% !important;
    right: 0 !important;
    bottom: auto !important;
    width: 24px !important;
    max-width: 24px !important;
    min-height: 154px !important;
    padding: 9px 5px !important;
    justify-content: center !important;
    overflow: hidden !important;
    border-radius: 12px 0 0 12px !important;
    writing-mode: vertical-rl !important;
    text-orientation: mixed !important;
    transform: translateY(-50%) !important;
    white-space: nowrap !important;
  }

  /* Aphelion's mission-stage rail owns the right edge. Use its empty left
     gutter so authorship never covers a stage destination. */
  body:has(.mission-tag) #ga-attribution {
    right: auto !important;
    left: 0 !important;
    border-radius: 0 12px 12px 0 !important;
  }
}

/* Forge already owns an attribution slot in its repository rail. Keep that
   authorship link in the rail flow instead of turning it into an edge overlay. */
body:has(.task-rail) #ga-attribution {
  position: static !important;
  inset: auto !important;
  display: block !important;
  width: auto !important;
  max-width: none !important;
  min-height: 0 !important;
  margin: 12px 7px 0 !important;
  padding: 11px 0 0 !important;
  border-radius: 0 !important;
  writing-mode: horizontal-tb !important;
  text-orientation: mixed !important;
  white-space: normal !important;
  opacity: .72 !important;
  transform: none !important;
}

/* r61: reveal items are not keyboard-reachable until their visual state is active. */
.reveal:not(.is-revealed):not(.is-visible):not(.in):not(.reveal-in) {
  visibility: hidden;
}

.reveal.is-revealed,
.reveal.is-visible,
.reveal.in,
.reveal.reveal-in {
  visibility: visible;
  opacity: 1 !important;
}

@media (prefers-reduced-motion: reduce) {
  .reveal {
    transform: none !important;
    transition-duration: 120ms !important;
    transition-delay: 0s !important;
  }
}

/* Scroll-state copy/scene separation. These pages intentionally keep a 3D
   object in view while the narrative advances; the object must remain a
   supporting layer instead of becoming a low-contrast mask over the copy. */
@media (min-width: 901px) {
  body:has(.doctrine-stage) .doctrine-stage::before {
    content: "";
    position: absolute;
    inset: 0 38% 0 0;
    z-index: 2;
    pointer-events: none;
    background: linear-gradient(90deg, rgba(13, 12, 16, 0.98) 0%, rgba(13, 12, 16, 0.9) 64%, transparent 100%);
  }

  body:has(.sw-pin) .sw-pin::before {
    content: "";
    position: absolute;
    inset: 0 39% 0 0;
    z-index: 1;
    pointer-events: none;
    background: linear-gradient(90deg, rgba(10, 5, 18, 0.97) 0%, rgba(10, 5, 18, 0.84) 68%, transparent 100%);
  }

  body:has(.sw-pin) .sw-pin .wrap {
    position: relative;
    z-index: 2;
  }

  body:has(.eeg-fixed) .pipe-step p {
    max-width: 52ch;
  }

  body:has(.flavor-chip) .ing,
  body:has(.flavor-chip) .map-frame,
  body:has(.flavor-chip) .map-legend {
    background-color: color-mix(in srgb, var(--bg) 94%, #13031a);
  }

  body:has(.flavor-chip) .map-legend {
    border: 3px solid var(--line);
    border-radius: 26px;
    padding: 20px;
  }

  body:has(.flavor-chip) #prototype-workflow {
    position: relative;
    z-index: 3;
    isolation: isolate;
  }
}

@media (min-width: 760px) and (prefers-reduced-motion: no-preference) {
  body:has(.hproc-track) .hproc-track {
    transform: translate3d(var(--prototype-hproc-x, 0px), 0, 0) !important;
  }
}

/* r60: shared visual-composition guards for restored cinematic prototypes. */
body:has(.mission-tag) .hero-copy,
body:has(.eeg-fixed) .hero-content,
body:has(.hero-meta .item) .hero-content,
body:has(.grav-flip) .hero-inner {
  isolation: isolate;
}

@media (min-width: 701px) {
  body:has(.mission-tag) .hero-copy,
  body:has(.eeg-fixed) .hero-content,
  body:has(.hero-meta .item) .hero-content,
  body:has(.grav-flip) .hero-inner {
    width: min(620px, 44vw) !important;
    max-width: min(620px, 44vw) !important;
    margin-left: clamp(34px, 7vw, 118px) !important;
    padding: clamp(24px, 3vw, 42px) !important;
    border: 1px solid rgba(255, 255, 255, .13) !important;
    border-radius: 30px !important;
    background:
      linear-gradient(135deg, rgba(7, 10, 14, .8), rgba(7, 10, 14, .46)),
      radial-gradient(420px 240px at 12% 10%, rgba(255, 255, 255, .12), transparent 70%) !important;
    box-shadow: 0 28px 84px rgba(0, 0, 0, .26) !important;
    -webkit-backdrop-filter: blur(18px) saturate(1.1);
    backdrop-filter: blur(18px) saturate(1.1);
  }

  body:has(.mission-tag) .scene-mount,
  body:has(.eeg-fixed) .scene-fixed,
  body:has(.hero-meta .item) .stage,
  body:has(.grav-flip) .scene-mount {
    opacity: .54 !important;
    filter: saturate(.92) contrast(.96) brightness(.76) !important;
  }

  body:has(.eeg-fixed) .scene-fixed,
  body:has(.hero-meta .item) .stage,
  body:has(.grav-flip) .scene-mount {
    transform: translate3d(16vw, -2vh, 0) scale(.88) !important;
    transform-origin: center center !important;
  }

  body:has(.mission-tag) .hero-copy h1,
  body:has(.eeg-fixed) .hero-content h1,
  body:has(.hero-meta .item) .hero-content h1,
  body:has(.grav-flip) .hero h1 {
    max-width: 9.8ch !important;
    letter-spacing: -.035em !important;
  }

  body:has(.mission-tag) .hero-copy p,
  body:has(.eeg-fixed) .hero-content p,
  body:has(.hero-meta .item) .hero-content p,
  body:has(.grav-flip) .hero p {
    max-width: 34rem !important;
    text-shadow: 0 1px 18px rgba(0, 0, 0, .36) !important;
  }
}

@media (max-width: 700px) {
  body:has(.mission-tag) .hero-copy,
  body:has(.eeg-fixed) .hero-content,
  body:has(.hero-meta .item) .hero-content,
  body:has(.grav-flip) .hero-inner {
    width: auto !important;
    max-width: none !important;
    margin: 112px 18px 0 !important;
    padding: 22px 20px !important;
    border: 1px solid rgba(255, 255, 255, .13) !important;
    border-radius: 24px !important;
    background:
      linear-gradient(145deg, rgba(6, 8, 13, .84), rgba(6, 8, 13, .55)),
      radial-gradient(260px 160px at 15% 10%, rgba(255, 255, 255, .12), transparent 72%) !important;
    box-shadow: 0 24px 70px rgba(0, 0, 0, .25) !important;
    -webkit-backdrop-filter: blur(16px) saturate(1.05);
    backdrop-filter: blur(16px) saturate(1.05);
  }

  body:has(.mission-tag) .scene-mount,
  body:has(.eeg-fixed) .scene-fixed,
  body:has(.hero-meta .item) .stage,
  body:has(.grav-flip) .scene-mount {
    opacity: .38 !important;
    filter: saturate(.86) contrast(.92) brightness(.7) !important;
  }

  body:has(.eeg-fixed) .scene-fixed,
  body:has(.hero-meta .item) .stage,
  body:has(.grav-flip) .scene-mount {
    transform: translate3d(18vw, -5svh, 0) scale(.72) !important;
    transform-origin: center top !important;
  }

  body:has(.mission-tag) .hero-copy h1,
  body:has(.eeg-fixed) .hero-content h1,
  body:has(.hero-meta .item) .hero-content h1,
  body:has(.grav-flip) .hero h1 {
    max-width: 10ch !important;
    font-size: clamp(2.6rem, 12vw, 4rem) !important;
    line-height: .98 !important;
  }

  body:has(.mission-tag) .hero-copy p,
  body:has(.eeg-fixed) .hero-content p,
  body:has(.hero-meta .item) .hero-content p,
  body:has(.grav-flip) .hero p {
    max-width: 30ch !important;
    font-size: 1rem !important;
    line-height: 1.55 !important;
  }
}