/* ============================================================
   PREMIUM SYSTEM PASS — 2026-08-03
   One hierarchy, one readable control language, both lighting modes.
   ============================================================ */
:root {
  --gn-control-height: 46px;
  --gn-radius-sm: 8px;
  --gn-radius-md: 12px;
  --gn-space-1: 6px;
  --gn-space-2: 10px;
  --gn-space-3: 14px;
  --gn-space-4: 18px;
  --gn-motion-fast: 140ms;
  --gn-motion-base: 220ms;
}

/* First-run dashboard: one mission dominates until the first valid SHOT. */
.gn-dashboard-mission[hidden] { display: none !important; }
.gn-dashboard-mission {
  display: grid;
  justify-items: start;
  gap: 9px;
  margin: 2px 0 16px;
  padding: 20px 18px;
  border: 1px solid rgba(0, 212, 255, .46);
  border-top: 3px solid #00d4ff;
  border-radius: var(--gn-radius-md);
  background: linear-gradient(145deg, rgba(0, 212, 255, .12), rgba(6, 12, 19, .96) 62%);
  box-shadow: 0 18px 42px rgba(0, 0, 0, .28), inset 0 1px rgba(255, 255, 255, .04);
}
.gn-dashboard-mission-kicker {
  color: #83eaf5;
  font: 700 .68rem/1.2 var(--font-m, monospace);
  letter-spacing: .08em;
}
.gn-dashboard-mission h2 {
  max-width: 23ch;
  margin: 0;
  color: #f3fbff;
  font: 900 clamp(1.08rem, 4.7vw, 1.4rem)/1.18 var(--font-d, monospace);
  letter-spacing: .025em;
}
.gn-dashboard-mission p {
  max-width: 42ch;
  margin: 0;
  color: #b9cbd2;
  font: 600 .86rem/1.5 var(--font-b, system-ui);
}
.gn-dashboard-mission button {
  width: 100%;
  min-height: 50px;
  margin-top: 4px;
  border: 1px solid #FF5B5B;
  border-radius: var(--gn-radius-sm);
  background: linear-gradient(135deg, #FF3B3B, #a80f31);
  color: #fff;
  box-shadow: 0 10px 24px rgba(255, 45, 85, .26);
  font: 800 .76rem var(--font-d, monospace);
  letter-spacing: .08em;
  cursor: pointer;
}
#pageDash[data-activation="pending"] > :not(.page-hdr):not(#gnWandaDashboard):not(.gn-empty-hero) {
  opacity: .5;
  filter: saturate(.45);
  transition: opacity var(--gn-motion-base) ease, filter var(--gn-motion-base) ease;
}
#pageDash[data-activation="pending"] #gnWandaDashboard > :not(#gnFirstShotMission) {
  opacity: .48;
  filter: saturate(.45);
  transition: opacity var(--gn-motion-base) ease, filter var(--gn-motion-base) ease;
}
#pageDash[data-activation="active"] > *,
#pageDash[data-activation="active"] #gnWandaDashboard > * {
  opacity: 1;
  filter: none;
}
html[data-theme="light"] .gn-dashboard-mission {
  border-color: rgba(0, 111, 130, .48);
  border-top-color: #006f82;
  background: linear-gradient(145deg, rgba(0, 111, 130, .12), #f8f5ed 66%);
  box-shadow: 0 16px 36px rgba(55, 48, 40, .14), inset 0 1px #fff;
}
html[data-theme="light"] .gn-dashboard-mission-kicker { color: #006f82; }
html[data-theme="light"] .gn-dashboard-mission h2 { color: #18272d; }
html[data-theme="light"] .gn-dashboard-mission p { color: #33484f; }

/* CLARITY PASS (P3): empty dashboard = three starting actions, one primary.
   The placeholder wanda grid + duplicate action row hide while empty. */
.gn-mission-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  width: 100%;
  margin-top: 6px;
}
.gn-mission-actions .gn-mission-primary { grid-column: 1 / -1; margin-top: 0; }
.gn-dashboard-mission button.gn-mission-secondary {
  margin-top: 0;
  min-height: 48px;
  background: rgba(0, 212, 255, .07);
  border: 1px solid rgba(0, 212, 255, .42);
  color: #dff6ff;
  box-shadow: none;
}
html[data-theme="light"] .gn-dashboard-mission button.gn-mission-secondary {
  background: rgba(0, 111, 130, .07);
  border-color: rgba(0, 111, 130, .45);
  color: #14343c;
}
#gnWandaDashboard.gn-wanda-empty .gn-wanda-grid,
#gnWandaDashboard.gn-wanda-empty .gn-wanda-actions,
#gnWandaDashboard.gn-wanda-empty .gn-streak-card { display: none !important; }
/* Sync status shrinks to a status line: tighter card, one-line title. */
.gn-dashboard-mission[data-mode="syncing"] { padding: 14px 18px; gap: 7px; }
.gn-dashboard-mission .gn-mission-sync-title {
  font-size: 1rem;
  max-width: none;
  letter-spacing: .04em;
}

/* Functional copy: decorative telemetry may stay small; controls and guidance may not. */
.form-label,
.cp-group-label,
.cp-group-minimized,
.cp-option,
.gn-custom-picker-option,
.gn-custom-date-day,
.gn-shot-date-helper,
.gn-shot-time-helper,
.results-card-sub,
.phase-readout-label,
.gn-foundation-tile small,
.gn-record-row small,
.gn-ledger-copy,
.gn-research-disclaimer,
.gn-research-context {
  font-size: max(.72rem, 12px) !important;
  line-height: 1.45 !important;
  letter-spacing: .035em !important;
}
/* Phase Engine source readout: label/value rows. (The class shipped with no
   rules, so labels and values rendered jammed together.) */
.phase-source-grid { display: grid; gap: 10px; margin-top: 12px; }
.phase-source-grid > div { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.phase-source-grid > div > span { font: 700 .62rem var(--font-d, monospace); letter-spacing: 1.6px; color: var(--text-label); white-space: nowrap; }
.phase-source-grid > div > b { font: 700 .8rem var(--font-b, system-ui); color: var(--text-primary); text-align: right; }
.cp-option,
.gn-custom-picker-option { min-height: var(--gn-control-height) !important; padding: 11px 12px !important; }
.form-input,
.gn-record-form input,
.gn-record-form select,
.gn-record-form textarea { min-height: var(--gn-control-height); }

/* Shared menu family: selected, hover and keyboard focus are explicit. */
.cp-option,
.gn-custom-picker-option,
.gn-custom-date-day {
  border-bottom: 1px solid rgba(255, 255, 255, .08) !important;
}
.cp-option:hover,
.cp-option.selected,
.cp-option[aria-selected="true"],
.gn-custom-picker-option:hover,
.gn-custom-picker-option:focus-visible,
.gn-custom-picker-option[aria-selected="true"] {
  background: rgba(0, 212, 255, .12) !important;
  color: #eafbff !important;
}
html[data-theme="light"] .cp-dropdown,
html[data-theme="light"] .gn-custom-picker-menu,
html[data-theme="light"] .gn-custom-date-popover,
html[data-theme="light"] .gn-record-form select {
  color-scheme: light !important;
  background: #fff !important;
  color: #17272e !important;
  border-color: rgba(30, 64, 73, .32) !important;
  box-shadow: 0 18px 42px rgba(42, 48, 50, .2) !important;
}
html[data-theme="light"] .cp-option,
html[data-theme="light"] .gn-custom-picker-option,
html[data-theme="light"] .gn-custom-date-day,
html[data-theme="light"] select option {
  background: #fff !important;
  color: #17272e !important;
  border-bottom-color: rgba(30, 64, 73, .14) !important;
}
html[data-theme="light"] .cp-group-label,
html[data-theme="light"] .cp-group-minimized,
html[data-theme="light"] .gn-custom-date-head strong {
  background: #eef4f4 !important;
  color: #24464f !important;
}
html[data-theme="light"] .cp-option:hover,
html[data-theme="light"] .cp-option.selected,
html[data-theme="light"] .cp-option[aria-selected="true"],
html[data-theme="light"] .gn-custom-picker-option:hover,
html[data-theme="light"] .gn-custom-picker-option:focus-visible,
html[data-theme="light"] .gn-custom-picker-option[aria-selected="true"] {
  background: #dceff1 !important;
  color: #003f4d !important;
}

/* DAY OPS is a complete light system, including focused LAB destinations. */
/* Focused tools are true destinations, not translucent sheets over LAB. */
.gn-lab-tool-overlay {
  z-index: 2147483001 !important;
  background: #02070b !important;
  isolation: isolate;
}
html[data-theme="light"] .gn-lab-tool-overlay { background: #ebe8df !important; }
html[data-theme="light"] #gnLabToolOverlay { background: #ebe8df !important; }
.gn-lab-tool-shell { background: #080b10 !important; }
html[data-theme="light"] .gn-lab-tool-shell,
html[data-theme="light"] #gnLabToolHost,
html[data-theme="light"] #gnLabToolHost .gn-foundation-section,
html[data-theme="light"] #gnLabToolHost .card,
html[data-theme="light"] #gnLabToolHost .gn-research-group,
html[data-theme="light"] #gnLabToolHost .gn-record-row {
  background: #f8f5ed !important;
  color: #1b2a30 !important;
  border-color: rgba(30, 64, 73, .24) !important;
}
body.gn-lab-tool-open .topbar,
body.gn-lab-tool-open .bottom-nav,
body.gn-lab-tool-open .fab,
body.gn-fab-hidden-context .fab { visibility: hidden !important; pointer-events: none !important; }
html[data-theme="light"] #gnLabToolHost :is(h2, h3, b, label, summary span, .gn-record-state) { color: #1b2a30 !important; }
html[data-theme="light"] #gnLabToolHost :is(p, small, em, .gn-ledger-copy, .gn-research-context, .gn-research-disclaimer) { color: #344a52 !important; }
.gn-lab-tool-overlay.active .gn-lab-tool-shell { animation: gn-tool-arrive var(--gn-motion-base) cubic-bezier(.2,.75,.25,1) both; }@keyframes gn-tool-arrive{ from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; }}

/* The SHOT picker has a high-specificity HUD layout in the shell. DAY OPS
   keeps that placement but supplies a complete light modal/menu treatment. */
html[data-theme="light"] #logOv .modal,
html[data-theme="light"] #logOv .modal-hdr {
  background: #f8f5ed !important;
  color: #17272e !important;
  border-color: rgba(30, 64, 73, .2) !important;
  box-shadow: 0 12px 28px rgba(42, 48, 50, .14) !important;
}
html[data-theme="light"] #logOv #cpShotMedDrop.cp-dropdown {
  color-scheme: light !important;
  background: #fff !important;
  border-color: rgba(0, 111, 130, .45) !important;
  box-shadow: 0 24px 64px rgba(42, 48, 50, .28) !important;
}
html[data-theme="light"] #logOv #cpShotMedDrop .cp-group-label {
  color: #15505d !important;
  background: #e8f1f1 !important;
  border-bottom-color: rgba(30, 64, 73, .18) !important;
}
html[data-theme="light"] #logOv #cpShotMedDrop .cp-group-minimized-label {
  color: #103942 !important;
  font-size: max(.72rem, 12px) !important;
  font-weight: 700 !important;
  letter-spacing: .12em !important;
}
html[data-theme="light"] #logOv #cpShotMedDrop .cp-group-minimized-count {
  color: #003f4d !important;
  background: #dceff1 !important;
  font-size: .65rem !important;
  font-weight: 700 !important;
}
html[data-theme="light"] #logOv #cpShotMedDrop .cp-option {
  color: #17272e !important;
  background: #fff !important;
  border-bottom-color: rgba(30, 64, 73, .14) !important;
}
html[data-theme="light"] #logOv #cpShotMedDrop .cp-option:is(:hover, :focus-visible, .selected, [aria-selected="true"]) {
  color: #003f4d !important;
  background: #dceff1 !important;
}
html[data-theme="light"] body.gn-log-shot-picker-open #logOv::before { background: rgba(31, 43, 47, .28) !important; }

/* Landing correction: the product is the hero. The decorative phase-ring was
   competing with the real interface and made the first viewport feel like a
   low-resolution concept render. Keep the approved GRID//NODE typography and
   controls, but give the actual dashboard the visual authority. */
#landing .landing-phase-visual,
#landing .landing-node-mark { display: none !important; }

#landing {
  color-scheme: dark !important;
  --bg: #050508;
  --bg2: #080b10;
  --panel: #0a1016;
  --panel2: #0d151d;
  --surface: #080d13;
  --surface-elevated: #0d151d;
  --text: #f1f4f7;
  --text-primary: #f1f4f7;
  --text-mid: #b6cbd3;
  --text-secondary: #b6cbd3;
  --text-dim: #78909a;
  --border: rgba(0, 212, 255, .17);
}
html[data-theme="light"] #landing {
  color-scheme: light !important;
  --text: #17272e;
  --text-primary: #17272e;
  --text-mid: #38515a;
  --text-secondary: #38515a;
  --text-dim: #60777f;
  --border: rgba(0, 111, 130, .22);
  background-color: #f4f1e9 !important;
  /* VISUALS MAX 2 (Track C): Track B wired the daylight city art in
     css/daylight-nexus-pilot.css (live on #login), but it never surfaced
     on #landing because this !important paper-grid treatment loads later
     in the cascade and wins. The fix lives at the winning rule, not in a
     competing override: same paper grid on top, then a light wash, then
     the city. The wash keeps hero text AA over the brightest art
     (headline #17272e measures 14:1+ at every wash stop; see the
     track-c evidence harness). Dark theme is untouched by this block. */
  background-image:
    linear-gradient(rgba(16, 64, 75, .035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(16, 64, 75, .035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(247, 244, 237, .96) 0, rgba(247, 244, 237, .90) 34%, rgba(244, 241, 233, .82) 58%, rgba(238, 235, 226, .72) 100%),
    url('/assets/nexus-city-daylight-v1.webp') !important;
  background-size: 44px 44px, 44px 44px, auto, cover !important;
  background-position: center, center, center, center !important;
  background-attachment: scroll !important;
}
html[data-theme="light"] #landing::before {
  background: linear-gradient(115deg, transparent 0 72%, rgba(0, 111, 130, .045) 72.2% 72.5%, transparent 72.7%) !important;
}
html[data-theme="light"] #landing .landing-hero { background: transparent !important; }
html[data-theme="light"] #landing .landing-logo { filter: none !important; }
html[data-theme="light"] #landing .landing-kicker { color: #006f82 !important; }
html:not([data-theme="light"]) #landing .landing-kicker { text-shadow: 0 0 14px rgba(0, 212, 255, 0.35); }
html[data-theme="light"] #landing .landing-headline { color: #17272e !important; text-shadow: none !important; }
html[data-theme="light"] #landing .landing-copy,
html[data-theme="light"] #landing .landing-copy span { color: #38515a !important; }
html[data-theme="light"] #landing .landing-trust { color: #38515a !important; }
html[data-theme="light"] #landing .landing-trust strong { color: #17272e !important; }
html[data-theme="light"] #landing .landing-preview-caption { color: #49616a !important; }
html[data-theme="light"] #landing .landing-btn.primary {
  background: linear-gradient(135deg, #f32f55, #bd0f35) !important;
  color: #fff !important;
  box-shadow: 0 12px 28px rgba(143, 15, 40, .22) !important;
}
html[data-theme="light"] #landing .landing-btn.secondary {
  border-color: rgba(0, 111, 130, .42) !important;
  color: #005f73 !important;
  background: rgba(255, 255, 255, .56) !important;
}
#landing .landing-shell { width: min(1180px, 100%) !important; }
#landing .landing-hero {
  width: 100% !important;
  max-width: none !important;
  min-height: calc(100vh - 44px - var(--safe-top)) !important;
  margin: 0 !important;
  padding: clamp(78px, 9vh, 112px) 0 clamp(54px, 7vh, 84px) !important;
  display: grid !important;
  grid-template-columns: minmax(0, 520px) minmax(440px, 1fr) !important;
  grid-template-rows: repeat(6, auto) !important;
  align-content: center !important;
  align-items: start !important;
  column-gap: clamp(44px, 5vw, 78px) !important;
  row-gap: 17px !important;
}
#landing .landing-logo,
#landing .landing-kicker,
#landing .landing-headline,
#landing .landing-copy,
#landing .landing-cta-row,
#landing .landing-trust { grid-column: 1 !important; }
#landing .landing-logo { grid-row: 1; width: min(330px, 82%) !important; margin-bottom: 20px; }
#landing .landing-kicker { grid-row: 2; }
#landing .landing-headline {
  grid-row: 3;
  max-width: 9.5ch !important;
  font-size: clamp(3.35rem, 5vw, 4.65rem) !important;
  line-height: .98 !important;
}
#landing .landing-copy { grid-row: 4; max-width: 43ch !important; text-wrap: balance; }
#landing .landing-cta-row { grid-row: 5; width: 100%; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
#landing .landing-trust { grid-row: 6; }

#landing .landing-product-preview {
  grid-column: 2 !important;
  grid-row: 1 / span 6 !important;
  align-self: center !important;
  width: 100%;
  min-width: 0;
  display: grid;
  gap: 12px;
  position: relative;
}
#landing .landing-product-preview::before {
  content: "";
  position: absolute;
  inset: -22px -18px 28px;
  z-index: -1;
  background: radial-gradient(ellipse at 50% 48%, rgba(0, 212, 255, .13), transparent 68%);
  filter: blur(14px);
  pointer-events: none;
}
html[data-theme="light"] #landing .landing-preview-frame {
  background: linear-gradient(180deg, #fbf9f2, #f4f1e9);
  border-color: rgba(20, 60, 70, .28);
  border-top-color: #006f82;
  box-shadow: 0 34px 84px rgba(20, 60, 70, .15), 0 0 0 1px rgba(20, 60, 70, .04);
}
html[data-theme="light"] #landing .landing-preview-bar {
  border-bottom-color: rgba(20, 60, 70, .18);
  background: linear-gradient(180deg, #fbf9f2, #f4f1e9);
}
html[data-theme="light"] #landing .landing-preview-dot { background: rgba(20, 60, 70, .25); }
html[data-theme="light"] #landing .landing-preview-dot:first-child { background: #006f82; box-shadow: 0 0 10px rgba(0, 111, 130, .55); }
html[data-theme="light"] #landing .landing-preview-tag { color: #33525c; }
html[data-theme="light"] #landing .landing-preview-shot { background: #f4f1e9; }
html[data-theme="light"] #landing .landing-preview-caption { color: #49616a; }
#landing .landing-preview-frame {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  border: 1px solid rgba(0, 212, 255, .34);
  border-top: 2px solid #00d4ff;
  border-radius: 14px;
  background: #03070b;
  box-shadow:
    0 34px 84px rgba(0, 0, 0, .66),
    0 0 0 1px rgba(255, 255, 255, .035),
    0 0 42px rgba(0, 212, 255, .11),
    inset 0 1px 0 rgba(255, 255, 255, .06);
}
#landing .landing-preview-frame::after {
  content: "";
  position: absolute;
  inset: 42px 0 0;
  z-index: 2;
  pointer-events: none;
  background:
    linear-gradient(112deg, rgba(255, 255, 255, .055), transparent 18% 78%, rgba(0, 212, 255, .035)),
    linear-gradient(180deg, transparent 72%, rgba(0, 0, 0, .2));
}
#landing .landing-preview-bar {
  min-height: 42px;
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 0 14px;
  border-bottom: 1px solid rgba(0, 212, 255, .16);
  background: linear-gradient(180deg, rgba(12, 22, 29, .98), rgba(4, 9, 14, .98));
}
#landing .landing-preview-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #314751;
}
#landing .landing-preview-dot:first-child {
  background: #00d4ff;
  box-shadow: 0 0 10px rgba(0, 212, 255, .72);
}
#landing .landing-preview-tag {
  margin-left: auto;
  color: #9fc7d4;
  font: 700 .55rem var(--font-m);
  letter-spacing: 1.7px;
}
#landing .landing-preview-shot {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 10;
  object-fit: cover;
  object-position: top center;
  background: #020509;
}
#landing .landing-preview-caption {
  max-width: 62ch;
  color: #8fa9b3;
  font: 500 .66rem/1.55 var(--font-m);
  letter-spacing: .8px;
}
#landing .landing-btn:focus-visible,
#landing .landing-local-link:focus-visible,
#landing .landing-footer a:focus-visible {
  outline: 2px solid rgba(0, 212, 255, .92);
  outline-offset: 3px;
}
#landing .landing-btn.secondary:hover,
#landing .landing-btn.secondary:focus-visible {
  border-color: rgba(0, 212, 255, .72);
  background: rgba(0, 212, 255, .11);
  box-shadow: inset 0 0 24px rgba(0, 212, 255, .055), 0 0 18px rgba(0, 212, 255, .08);
}@media (prefers-reduced-motion: no-preference){
  #landing .landing-preview-dot:first-child { animation: gnLandingLive 2.8s ease-in-out infinite; }}@keyframes gnLandingLive{
  0%, 100% { opacity: .72; box-shadow: 0 0 6px rgba(0, 212, 255, .52); }
  50% { opacity: 1; box-shadow: 0 0 14px rgba(0, 212, 255, .9); }}@media (max-width: 960px){
  #landing .landing-hero {
    grid-template-columns: 1fr !important;
    grid-template-rows: repeat(7, auto) !important;
    max-width: 720px !important;
    margin: 0 auto !important;
    row-gap: 18px !important;
  }
  #landing .landing-logo,
  #landing .landing-kicker,
  #landing .landing-headline,
  #landing .landing-copy,
  #landing .landing-cta-row,
  #landing .landing-trust,
  #landing .landing-product-preview { grid-column: 1 !important; }
  #landing .landing-product-preview { grid-row: 7 !important; margin-top: 18px; }
  #landing .landing-product-preview::before { inset: -14px 0 24px; }}@media (max-width: 480px){
  #landing .landing-hero {
    padding-top: calc(env(safe-area-inset-top, 0px) + 58px) !important;
    padding-bottom: 38px !important;
    row-gap: 12px !important;
  }
  #landing .landing-logo { width: min(248px, 72%) !important; margin-bottom: 4px; }
  #landing .landing-kicker { font-size: .56rem; letter-spacing: 1.9px; }
  #landing .landing-headline {
    font-size: clamp(2.25rem, 11vw, 2.85rem) !important;
    line-height: .96 !important;
    max-width: 12ch !important;
    text-wrap: balance;
    text-shadow: 0 8px 34px rgba(0, 0, 0, .62);
  }
  #landing .landing-copy { font-size: 1rem !important; line-height: 1.48 !important; max-width: 36ch !important; }
  #landing .landing-cta-row {
    grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr) !important;
    gap: 8px !important;
    margin-top: 2px !important;
  }
  #landing .landing-btn {
    min-height: 52px;
    padding: 10px 8px;
    font-size: .62rem;
    line-height: 1.25;
    letter-spacing: 1.05px;
  }
  #landing .landing-product-preview { grid-row: 6 !important; margin-top: 6px; gap: 9px; }
  #landing .landing-trust {
    grid-row: 7 !important;
    margin-top: 3px;
    padding: 12px 13px;
    border-left: 2px solid rgba(0, 212, 255, .62);
    background: linear-gradient(90deg, rgba(0, 212, 255, .075), rgba(0, 0, 0, .16));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .025);
    font-size: .75rem;
    line-height: 1.5;
  }
  #landing .landing-trust strong { font-size: .8rem; }
  #landing .landing-local-link { min-height: 44px; font-size: .75rem; }
  #landing .landing-preview-frame { border-radius: 12px; box-shadow: 0 22px 54px rgba(0, 0, 0, .62), 0 0 26px rgba(0, 212, 255, .09); }
  #landing .landing-preview-bar { min-height: 34px; padding: 0 11px; }
  #landing .landing-preview-frame::after { inset: 34px 0 0; }
  #landing .landing-preview-shot { aspect-ratio: 16 / 9; }
  #landing .landing-preview-caption { font-size: .62rem; line-height: 1.45; }
  #landing .landing-footer a {
    display: flex;
    align-items: center;
    min-height: 44px;
    padding: 5px 0;
  }}

/* Narrow phones: stack the hero CTAs full-width so labels never wrap. */
@media (max-width: 420px){
  #landing .landing-cta-row { grid-template-columns: minmax(0, 1fr) !important; gap: 10px !important; }
  #landing .landing-btn { white-space: nowrap; }
}

/* Compact header controls retain compact graphics inside full-size targets. */
#app .app-wordmark-b2b {
  min-height: 44px !important;
  display: flex !important;
  align-items: center !important;
}
.gn-language-control button,
.gn-theme-toggle .gn-theme-opt { min-width: 44px !important; min-height: 44px !important; }
.gn-language-control,
.gn-theme-toggle { min-height: 48px !important; }
.gn-wanda-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-top: 4px;
}
.gn-wanda-actions button {
  min-height: 48px !important;
  border-radius: 12px !important;
  font: 800 .72rem var(--font-d, monospace) !important;
  letter-spacing: 1.4px !important;
  transition: transform var(--dur-1) var(--ease-press), box-shadow var(--dur-2) var(--ease-out), filter var(--dur-2) var(--ease-out) !important;
}
/* LOG SHOT leads; LOG WEIGHT stays secondary cyan. */
html:not([data-theme="light"]) .gn-wanda-actions > button:first-child {
  border: 1px solid rgba(143, 15, 40, .55) !important;
  background: radial-gradient(130% 170% at 50% 0%, var(--lava-core-hi, #FF5B5B) 0%, var(--lava-core, #FF3B3B) 46%, var(--lava-edge, #8f0f28) 100%) !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  box-shadow: 0 8px 22px rgba(255, 45, 77, .36), inset 0 1px 0 rgba(255, 255, 255, .22) !important;
  text-shadow: 0 1px 2px rgba(60, 0, 12, .5) !important;
}
html:not([data-theme="light"]) .gn-wanda-actions > button:last-child {
  border: 1px solid rgba(0, 212, 255, .42) !important;
  background: rgba(0, 212, 255, .08) !important;
  color: #00d4ff !important;
  -webkit-text-fill-color: #00d4ff !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .04) !important;
}
.gn-wanda-actions button:active { transform: scale(.97); }/* At the two narrowest phone widths, keep all four segmented choices and the
   profile target at a true 44px hit area. The live NODE rail directly below
   retains product identity while the full wordmark yields the scarce row. */
@media (max-width: 360px){
  #app .app-wordmark-b2b { display: none !important; }
  #app .topbar-actions { width: 100%; justify-content: flex-end; }}

/* One focus treatment across navigation, forms, menu options and utilities. */
:is(button, [role="button"], input, select, textarea, summary):focus-visible {
  outline: 2px solid var(--focus-ring, #00d4ff) !important;
  outline-offset: 2px !important;
}@media (max-width: 430px){
  .gn-dashboard-mission { padding: 18px 16px; }
  .gn-dashboard-mission button { min-height: 52px; }
  .gn-lab-tool-head { align-items: center !important; }
  .gn-lab-tool-head .gn-foundation-signal { display: none; }
  .gn-lab-back { flex: 0 0 auto; }}@media (prefers-reduced-motion: reduce){
  .gn-lab-tool-overlay.active .gn-lab-tool-shell,
  #pageDash[data-activation] > *,
  #pageDash[data-activation] #gnWandaDashboard > * { animation: none !important; transition: none !important; }}

/* FINAL DAY OPS BINDING — intentionally last. The legacy stylesheet is long
   and contains later component literals, so every functional role terminates
   here at the shared semantic palette. */
html[data-theme="light"] {
  --text-primary: #15282f;
  --text-secondary: #304b55;
  --text-muted: #4b636b;
  /* Unified 2026-10-11: --text-dim lives in 08-design-tokens.css (#476169,
     the cascade winner); this block defers to the canonical layer. */
  --text-helper: #395861;
  --text-label: #203d47;
  --text-placeholder: #5b7077;
  --text-disabled: #68777c;
  --text-accent: #005f73;
  --text-success: #00643f;
  --text-warning: #744c00;
  --text-error: #a51d36;
  --text-on-dark: #f2fbfd;
  --text-on-light: #15282f;
  --text: var(--text-primary);
  --text-mid: var(--text-secondary);
  --cyan: var(--text-accent);
  --green: var(--text-success);
  --yellow: var(--text-warning);
  --red: var(--text-error);
}html[data-theme="light"] :is(.page-title, .card-title, .modal-title, .gn-auth-title, .gn-foundation-head h2, .gn-lab-tool-head h2, .gn-profile-row b, .gn-whatsnew-title, .gn-whatsnew-version, .gn-empty-state b, .results-title, .phase-name, .gn-record-row b){
  color: var(--text-primary) !important; opacity: 1 !important;
}html[data-theme="light"] :is(.card p, .card-copy, .gn-auth-copy, .gn-ledger-copy, .gn-profile-row small, .gn-empty-state span, .gn-whatsnew-body, .gn-whatsnew-body li, .mixing-text, .phase-transparency-block p, .phase-transparency-block li, .log-notes, .pib-text, .results-direction, .syr-math-helper, .gn-syr-formula, .gn-syr-helper p, .gn-syr-caution, .gn-record-row small){
  color: var(--text-secondary) !important; opacity: 1 !important; font-weight: 500 !important;
}
html[data-theme="light"] :is(.page-sub,.form-helper,.gn-shot-date-helper,.gn-auth-note,.gn-research-context,.gn-cloud-status,.gn-date-dow,.gn-calendar-detail,.gn-wanda-copy,.gn-dashboard-support,.phase-sphere-status,.gn-syr-meta,.syr-result-sub,.syr-scale-lbl,.gn-syr-forensic) {
  color: var(--text-helper) !important; opacity: 1 !important; font-weight: 500 !important;
}
html[data-theme="light"] :is(.form-label,.gn-form-grid label>span,.gn-record-form label>span,.gn-profile-section-label,.gn-stable-zone-title,.gn-auth-primary-label) {
  color: var(--text-label) !important; opacity: 1 !important; font-weight: 700 !important;
}
html[data-theme="light"] :is(input,textarea,select,.form-input,.form-textarea,.cp-select-trigger,.gn-select-trigger,.cp-option,.gn-select-option) {
  color: var(--text-primary) !important; -webkit-text-fill-color: var(--text-primary) !important; opacity: 1 !important; font-weight: 500 !important;
}
html[data-theme="light"] :is(input,textarea,.form-input,.form-textarea)::placeholder {
  color: var(--text-placeholder) !important; -webkit-text-fill-color: var(--text-placeholder) !important; opacity: 1 !important;
}
html[data-theme="light"] :is(.cp-dropdown,.gn-select-menu,select,.cp-option,.gn-select-option,option) { color: var(--text-primary) !important; background-color: #fffdf8 !important; }
html[data-theme="light"] :is(.cp-option,.gn-select-option):is(:hover,:focus-visible,.selected,[aria-selected="true"]) { color: #003f4d !important; background-color: #dceff1 !important; }
html[data-theme="light"] .cp-group-label { color: var(--text-label) !important; background: #e8eff0 !important; opacity: 1 !important; }
html[data-theme="light"] :is(button,input,textarea,select,[role="button"]):disabled,
html[data-theme="light"] :is(button,input,textarea,select,[role="button"])[aria-disabled="true"] { color: var(--text-disabled) !important; -webkit-text-fill-color: var(--text-disabled) !important; opacity: 1 !important; }
html[data-theme="light"] :is(.nav-item:not(.active) .nav-lbl,.nav-item:not(.active) .nav-ico) { color: var(--text-muted) !important; opacity: 1 !important; }
html[data-theme="light"] :is(.nav-item.active .nav-lbl,.nav-item.active .nav-ico,.page-title .a,.sec-title .a,.gn-profile-chevron,.gn-utility-chevron,.gn-lab-back,.gn-record-state) { color: var(--text-accent) !important; opacity: 1 !important; }
html[data-theme="light"] :is(.mixing-warn,.warning,.warn,.gn-syr-safety,.syr-safety-boundary) { color: var(--text-warning) !important; opacity: 1 !important; }
html[data-theme="light"] :is(.error,.err,.vault-date-error,.gn-delete-note,.gn-profile-danger-row b) { color: var(--text-error) !important; opacity: 1 !important; }
html[data-theme="light"] :is(.success,.ok) { color: var(--text-success) !important; opacity: 1 !important; }html[data-theme="light"] :is(.page-sub, .form-label, .form-helper, .gn-shot-date-helper, .gn-auth-copy, .gn-auth-message, .gn-auth-note, .gn-auth-privacy, .nav-lbl, .cp-group-label, .cp-option, .gn-select-option, .gn-profile-row small, .gn-profile-section-label, .gn-ledger-copy, .gn-empty-state, .gn-whatsnew-body, .gn-whatsnew-date, .gn-wanda-copy, .mixing-text, .mixing-warn, .phase-transparency-block p, .phase-transparency-block li, .syr-math-helper, .gn-syr-helper p, .gn-syr-formula, .gn-syr-caution, .gn-syr-safety){
  font-size: max(12px,.75rem) !important; line-height: 1.5 !important; letter-spacing: min(.06em,1px) !important;
}

/* Runtime connectivity/update state: below the safe area, above app chrome. */
.gn-runtime-banner {
  position: fixed;
  top: calc(env(safe-area-inset-top, 0px) + 8px);
  left: 50%;
  z-index: 1200;
  display: flex;
  align-items: center;
  gap: 8px;
  width: max-content;
  max-width: calc(100vw - 24px);
  min-height: 40px;
  padding: 7px 9px 7px 11px;
  border: 1px solid rgba(0,212,255,.36);
  border-radius: 999px;
  background: rgba(5,10,15,.96);
  color: var(--text-on-dark, #f2fbfd);
  box-shadow: 0 12px 34px rgba(0,0,0,.38);
  transform: translate(-50%, calc(-100% - 22px));
  opacity: 0;
  pointer-events: none;
  transition: transform .18s ease, opacity .18s ease;
}
.gn-runtime-banner.active { transform: translate(-50%, 0); opacity: 1; pointer-events: auto; }
.gn-runtime-dot { width: 7px; height: 7px; flex: 0 0 auto; border-radius: 50%; background: var(--brand-cyan); box-shadow: 0 0 10px currentColor; }
.gn-runtime-copy { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font: 700 11px/1.2 var(--font-m, monospace); letter-spacing: .6px; }
.gn-runtime-action { min-height: 32px !important; padding: 0 10px; border: 1px solid currentColor; border-radius: 999px; background: transparent; color: #7ff5ff; font: 800 11px var(--font-m, monospace); letter-spacing: .6px; }
.gn-runtime-banner[data-kind="offline"] { border-color: rgba(255,209,102,.56); }
.gn-runtime-banner[data-kind="offline"] .gn-runtime-dot { color: #ffd166; background: #ffd166; }
.gn-runtime-banner[data-kind="reminder"] { border-color: rgba(255,209,102,.66); }
.gn-runtime-banner[data-kind="reminder"] .gn-runtime-dot { color: #ffd166; background: #ffd166; animation: gn-runtime-pulse 1.6s ease-in-out infinite; }@keyframes gn-runtime-pulse{ 0%,100% { opacity: 1; } 50% { opacity: .35; }}@media (prefers-reduced-motion: reduce){ .gn-runtime-banner[data-kind="reminder"] .gn-runtime-dot { animation: none; }}
.gn-runtime-banner[data-kind="synced"] .gn-runtime-dot { color: #00ff88; background: #00ff88; }
.gn-runtime-banner[data-kind="update"] { border-color: rgba(0,212,255,.62); }
html[data-theme="light"] .gn-runtime-banner { background: #fffdf8; color: var(--text-primary); border-color: rgba(0,95,115,.45); box-shadow: 0 12px 34px rgba(43,58,62,.18); }
html[data-theme="light"] .gn-runtime-action { color: var(--text-accent); }

/* Release history remains a compact mobile sheet, not a desktop dialog. */
.gn-whatsnew-card > h2 { margin: 7px 0 14px; color: var(--text, #eef6f8); font: 800 1rem/1.25 var(--font-d, monospace); letter-spacing: 1.4px; }
.gn-wn-history { display: grid; gap: 14px; }
.gn-wn-release { padding-top: 14px; border-top: 1px solid rgba(255,255,255,.09); }
.gn-wn-release.current { padding: 14px; border: 1px solid rgba(0,212,255,.25); border-radius: 10px; background: rgba(0,212,255,.035); }
.gn-wn-release-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.gn-wn-release-head .gn-whatsnew-date { flex: 0 0 auto; margin: 0; text-align: right; line-height: 1.45; }
.gn-whatsnew-actions { position: sticky; bottom: -22px; display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 16px -2px -2px; padding: 10px 2px 2px; background: linear-gradient(transparent, var(--panel, #0e0e16) 30%); }
.gn-whatsnew-actions:has(.gn-whatsnew-close:only-child) { grid-template-columns: 1fr; }
.gn-whatsnew-history, .gn-whatsnew-close { min-height: 46px; border-radius: 8px; font: 800 .68rem var(--font-d, monospace); letter-spacing: 1.2px; }
.gn-whatsnew-history { border: 1px solid rgba(0,212,255,.4); background: transparent; color: #9fefff; }
.gn-whatsnew-close { margin: 0; background: linear-gradient(135deg,#FF3B3B,#D12424); color: #fff; }
html[data-theme="light"] .gn-whatsnew-card > h2 { color: var(--text-primary) !important; }
html[data-theme="light"] .gn-wn-release { border-color: rgba(32,61,71,.18); }
html[data-theme="light"] .gn-wn-release.current { border-color: rgba(0,95,115,.3); background: rgba(0,95,115,.045); }
html[data-theme="light"] .gn-whatsnew-actions { background: linear-gradient(transparent,#f4f1e9 30%); }
html[data-theme="light"] .gn-whatsnew-history { color: var(--text-accent); border-color: rgba(0,95,115,.42); }@media (max-width: 430px){
  .gn-whatsnew-overlay { place-items: end center; padding: env(safe-area-inset-top, 0px) 0 0; }
  .gn-whatsnew-card { width: 100%; max-height: 80vh; border-radius: 16px 16px 0 0; padding: 18px 16px calc(16px + env(safe-area-inset-bottom, 0px)); }
  .gn-whatsnew-actions { bottom: calc(-16px - env(safe-area-inset-bottom, 0px)); padding-bottom: calc(2px + env(safe-area-inset-bottom, 0px)); }}html[data-theme="light"] :is(#app, .overlay, .gn-delete-overlay, .gn-lab-tool-overlay, .gn-whatsnew-overlay) {
  --bg: #e8e4da;
  --bg2: #eeeae1;
  --panel: #f8f5ed;
  --panel2: #efebe2;
  --panel3: #e2ddd3;
  --surface: #f8f5ed;
  --surface-elevated: #fffdf8;
  --surface-muted: #e2ddd3;
  --border: rgba(32,61,71,.20);
  --border2: rgba(32,61,71,.34);
  --cyan-dim: rgba(0,95,115,.10);
}
html[data-theme="light"] #landing { --surface: #f7f4ed; --surface-elevated: #fffdf8; --panel: #f7f4ed; --panel2: #efebe2; }
html[data-theme="light"] :is(#landing,#login,#app,.overlay,.gn-lab-tool-overlay,.gn-whatsnew-overlay) :is(button,label,summary,input,textarea,select,option,small,p,li,th,td) { font-size: max(12px,.75rem) !important; opacity: 1 !important; }
/* MOBILE-FIRST: iOS Safari auto-zooms on inputs <16px. Keep text inputs at 16px in light theme. */
html[data-theme="light"] :is(#landing,#login,#app,.overlay) :is(input[type="text"],input[type="number"],input[type="email"],input[type="tel"],input[type="password"],input:not([type]),textarea) { font-size: 16px !important; }
/* TRACK5: kicker classes removed from this DAY OPS floor — the canonical
   .kicker (08-unify-fixes.css) governs kickers in both themes. */
html[data-theme="light"] :is(.landing-language-control span,.landing-note strong,.landing-note>span,.landing-local-link,.landing-preview-tag,.landing-preview-caption,.landing-footer-label,.gn-auth-primary-label,.gn-auth-message,.gn-auth-note,.gn-topbar-language-control button,#nodeHeaderPhase,.gn-wanda-label,.gn-wanda-note,.gn-instrument-code,.gn-data-quality,.gn-chart-state,.gn-target-empty,.gn-telemetry-summary,.gn-arc-empty,.scanner-source-tag,#scannerModeLabel,.scanner-status-helper,.shots-safety-note,.shot-history-toggle,#shotHistoryHelper,.gn-log-step,.gn-shot-time-helper,.gn-shot-date-helper,.gn-foundation-signal,.gn-lab-breadcrumb,.gn-dose-copy,.results-metric-label,.empty-subline,.s6-label,.phase-readout-label,.phase-readout-copy,.gn-measurements-copy,.gn-preferences-status,.gn-record-state,.cal-day-head,#calTitle,.gn-custom-picker-trigger,.gn-custom-date-trigger,.gn-stable-zone-title,.gn-stable-zone-btn,.gn-research-context,.gn-research-disclaimer,.gn-dose-output,.gn-profile-section-label,#gnProfileSync,#profEmail) {
  font-size: max(12px,.75rem) !important; line-height: 1.45 !important; letter-spacing: min(.055em,1px) !important; font-weight: 500 !important; opacity: 1 !important;
}
html[data-theme="light"] :is(.gn-foundation-kicker,.gn-foundation-signal,.gn-log-step,.scanner-source-tag,.phase-readout-label,.gn-wanda-label,.results-metric-label,.cal-day-head,.gn-profile-section-label) { font-weight: 700 !important; }
html[data-theme="light"] :is(.gn-custom-picker-trigger,.gn-custom-date-trigger,.se-check,#cpShotMedVal,#modalSelectedLocation,#gnDoseOutput,#profNameTxt,#profEmail,#gnProfileSync,#cpMedProfVal,#cpShotDayProfVal,#cpSexProfVal) { color: var(--text-primary) !important; opacity: 1 !important; }
html[data-theme="light"] :is(.gn-measurements-copy,.scanner-status-helper,.shots-safety-note,#shotHistoryHelper,.gn-dose-copy,.empty-subline,.phase-readout-copy,.gn-wanda-note) { color: var(--text-secondary) !important; }
html[data-theme="light"] :is(.gn-foundation-signal,.gn-lab-breadcrumb,.scanner-source-tag,#scannerModeLabel,.gn-log-step,.results-metric-label,.cal-day-head,#calTitle) { color: var(--text-label) !important; }
html[data-theme="light"] :is(.gn-topbar-language-control button,.landing-language-control button) { color: var(--text-muted) !important; }
html[data-theme="light"] :is(.gn-topbar-language-control button.active,.landing-language-control button.active) { color: var(--text-accent) !important; }
html[data-theme="light"] #pageDash[data-activation="pending"] > :not(.page-hdr):not(#gnWandaDashboard):not(.gn-empty-hero),
html[data-theme="light"] #pageDash[data-activation="pending"] #gnWandaDashboard > :not(#gnFirstShotMission) { opacity: .76 !important; filter: saturate(.35) contrast(.96) !important; }
html[data-theme="light"] :is(.cp-select-trigger,.gn-select-trigger,.gn-custom-picker-trigger,.gn-custom-date-trigger) {
  background: #fffdf8 !important; color: var(--text-primary) !important; border-color: rgba(32,61,71,.34) !important; -webkit-text-fill-color: var(--text-primary) !important;
}
html[data-theme="light"] :is(.gn-shot-date-helper,.gn-shot-time-helper) { color: var(--text-helper) !important; background: rgba(0,95,115,.055) !important; }
html[data-theme="light"] :is(.time-tab,.scanner-mode-btn,.shot-history-toggle):not(.active) { color: var(--text-muted) !important; background: #e4e9e7 !important; }
html[data-theme="light"] :is(.time-tab,.scanner-mode-btn,.shot-history-toggle).active { color: var(--text-on-dark) !important; background: #006579 !important; }
html[data-theme="light"] :is(.btn-primary,.landing-btn.primary,.gn-auth-primary,.gn-dashboard-mission button,.empty-cta,.gn-whatsnew-close) {
  color: #fff !important; -webkit-text-fill-color: #fff !important; background: linear-gradient(135deg,#b51536,#760b22) !important; border-color: #8e112e !important;
}
html[data-theme="light"] :is(.cal-wrap,.cal-header,.cal-grid,.cal-detail) { background: var(--panel) !important; border-color: var(--border) !important; }
html[data-theme="light"] :is(.cal-day,.cal-day-name) { background: transparent !important; border-color: var(--border) !important; color: var(--text-secondary) !important; }
html[data-theme="light"] .cal-day-num { color: var(--text-secondary) !important; }
html[data-theme="light"] .cal-day:is(:hover,.selected,.today) { background: rgba(0,95,115,.10) !important; }
html[data-theme="light"] .gn-shot-advanced-trigger { color: var(--text-label) !important; background: #e3e7e4 !important; border-color: rgba(32,61,71,.28) !important; }
html[data-theme="light"] .btn-secondary { color: var(--text-accent) !important; -webkit-text-fill-color: var(--text-accent) !important; border-color: rgba(0,95,115,.42) !important; background: rgba(255,253,248,.82) !important; }
html[data-theme="light"] .gn-language-control > span { font-size: 12px !important; color: var(--text-secondary) !important; opacity: 1 !important; }
html[data-theme="light"] :is(.scanner-selected-panel b,.results-signal-note b,.gn-reference-pending strong,.gn-foundation-tile b,.gn-research-group>span,.gn-research-notice strong,.gn-whatsnew-title) { font-size: 12px !important; opacity: 1 !important; }
html[data-theme="light"] :is(.results-signal-note,.results-signal-note span,.gn-reference-pending span,.gn-weekly-report p,.gn-research-notice span,.gn-research-disclaimer) { font-size: 13px !important; line-height: 1.5 !important; color: var(--text-secondary) !important; opacity: 1 !important; }
html[data-theme="light"] :is(.gn-syr-result .k,.gn-syr-result .v,#syrText,#syrML,#syrConcDisplay,.gn-syr-headroom,.gn-syr-pk-hud .k,.gn-syr-pk-hud .v) { font-size: 12px !important; opacity: 1 !important; }
html[data-theme="light"] .gn-syr-u100 { font-size: 12px !important; color: var(--text-warning) !important; opacity: 1 !important; }
html[data-theme="light"] #landing .landing-btn.primary { background: linear-gradient(135deg,#98132f,#65091d) !important; color: #fff !important; -webkit-text-fill-color: #fff !important; }
html[data-theme="light"] .scanner-selected-panel b { font-size: 12px !important; }
html[data-theme="light"] :is(.gn-ampm-btn,.time-tab):not(.active) { color: var(--text-primary) !important; -webkit-text-fill-color: var(--text-primary) !important; background: #dfe5e3 !important; border-color: rgba(32,61,71,.28) !important; }
html[data-theme="light"] :is(.gn-ampm-btn,.time-tab).active { color: #fff !important; -webkit-text-fill-color: #fff !important; background: #006579 !important; border-color: #005466 !important; }
html[data-theme="light"] #gnWeeklyTitle { color: var(--text-primary) !important; text-shadow: none !important; }
html[data-theme="light"] .gn-weekly-actions button:first-child { color: var(--text-error) !important; -webkit-text-fill-color: var(--text-error) !important; border-color: rgba(165,29,54,.48) !important; background: #fffdf8 !important; }
html[data-theme="light"] .gn-weekly-actions button:last-child { color: var(--text-accent) !important; -webkit-text-fill-color: var(--text-accent) !important; border-color: rgba(0,95,115,.48) !important; background: #fffdf8 !important; }
html[data-theme="light"] #gnLabFoundationTitle span { color: var(--text-warning) !important; }
html[data-theme="light"] #gnLabToolHost :is(.k,.gn-syr-headroom,#syrHeadroom) { font-size: 12px !important; opacity: 1 !important; }
html[data-theme="light"] #gnLabToolHost :is(.gn-syr-headroom,#syrHeadroom) { color: var(--text-success) !important; text-shadow: none !important; }
html[data-theme="light"] #gnLabToolHost .sec-title .a { font-size: 12px !important; color: var(--text-label) !important; }
html[data-theme="light"] #gnLabToolHost .mixing-warn,
html[data-theme="light"] #gnLabToolHost .mixing-warn span { color: var(--text-warning) !important; }
html[data-theme="light"] .asset-matrix-title b { font-size: 12px !important; }
html[data-theme="light"] #labSegTabs .time-tab:not(.active) { color: var(--text-primary) !important; -webkit-text-fill-color: var(--text-primary) !important; background: #dfe5e3 !important; background-image: none !important; }
html[data-theme="light"] #labSegTabs .time-tab.active { color: #fff !important; -webkit-text-fill-color: #fff !important; background: #006579 !important; background-image: none !important; }
html[data-theme="light"] #gnLabToolHost #labSegTabs .time-tab:not(.active) { color: #102229 !important; -webkit-text-fill-color: #102229 !important; background: #fffdf8 !important; background-image: none !important; }
html[data-theme="light"] #gnLabToolHost #labSegTabs .time-tab.active { color: #fff !important; -webkit-text-fill-color: #fff !important; background: #004252 !important; background-image: none !important; }
html[data-theme="light"] .gn-auth-google { color: var(--text-primary) !important; -webkit-text-fill-color: var(--text-primary) !important; background: #fffdf8 !important; }

/* REAL-DEVICE DAY OPS READABILITY GATE
   This is the final semantic binding for functional app copy. Decorative HUD
   metadata remains compact; instructions, labels, values and controls do not. */
html[data-theme="light"] {
  --text-primary-light: #10252d;
  --text-secondary-light: #294750;
  --text-helper-light: #36565e;
  --text-label-light: #173942;
  --text-muted-functional-light: #476169;
  --text-placeholder-light: #566c72;
  --text-disabled-light: #66757a;
  --text-accent-light: #00576a;
  --text-success-light: #00613d;
  --text-warning-light: #6e4700;
  --text-error-light: #9a1724;
  --text-on-dark: #f7fcfd;
  --text-on-light: var(--text-primary-light);
  --text-primary: var(--text-primary-light);
  --text-secondary: var(--text-secondary-light);
  --text-helper: var(--text-helper-light);
  --text-label: var(--text-label-light);
  --text-muted: var(--text-muted-functional-light);
  /* Unified 2026-10-11: --text-dim lives in 08-design-tokens.css (#476169,
     the cascade winner); this block defers to the canonical layer. */
  --text-placeholder: var(--text-placeholder-light);
  --text-disabled: var(--text-disabled-light);
  --text-accent: var(--text-accent-light);
  --text-success: var(--text-success-light);
  --text-warning: var(--text-warning-light);
  --text-error: var(--text-error-light);
  --lava-hot: #D12424;
  --lava-core: #FF3B3B;
  --lava-edge: #D12424;
  --lava-glow: rgba(255, 79, 34, .28);
}

html[data-theme="light"] :is(#app,.overlay,.gn-lab-tool-overlay,.gn-delete-overlay,.gn-whatsnew-overlay) {
  color: var(--text-primary-light) !important;
}
html[data-theme="light"] :is(
  .page-title,.modal-title,.card-title,.results-title,.phase-name,
  .gn-foundation-head h2,.gn-device-vault-head h3,.gn-profile-hub h2,
  .gn-preferences-card h3,.gn-dose-projection h2,.gn-lab-tool-head h2,
  .gn-weekly-report h3,.gn-reference-pending strong,.gn-empty-state b,
  .scanner-selected-panel b,.gn-record-row b,.gn-foundation-tile b
) {
  color: var(--text-primary-light) !important;
  -webkit-text-fill-color: var(--text-primary-light) !important;
  text-shadow: none !important;
  opacity: 1 !important;
}
html[data-theme="light"] :is(
  .page-sub,.card-copy,.card p,.results-copy,.results-empty,.empty-subline,
  .gn-ledger-copy,.gn-dose-copy,.gn-measurements-copy,.gn-profile-row small,
  .gn-record-row small,.gn-empty-state span,.gn-weekly-report p,
  .gn-reference-pending span,.phase-readout-copy,.phase-context-text,
  .phase-transparency-block p,.phase-transparency-block li,.phase-edu-note,
  .scanner-status-helper,.shots-safety-note,.gn-research-notice,
  .gn-research-context,.gn-research-disclaimer,.gn-dose-disclaimer,
  .mixing-text,.mixing-warn,.gn-syr-helper p,.gn-syr-formula,.gn-syr-caution,
  .results-weight-helper,.shot-history-helper,#shotHistoryHelper
) {
  color: var(--text-secondary-light) !important;
  -webkit-text-fill-color: var(--text-secondary-light) !important;
  opacity: 1 !important;
  font-weight: 500 !important;
  text-shadow: none !important;
}
html[data-theme="light"] :is(
  .form-label,.gn-form-grid label>span,.gn-record-form label>span,
  .gn-dose-grid label>span,.gn-measurements-grid label>span,
  .gn-preferences-grid label>span,.gn-profile-section-label,
  .gn-stable-zone-title,.results-metric-label,.phase-readout-label,
  .gn-shot-filter-grid label>span,.scanner-selected-panel small
) {
  color: var(--text-label-light) !important;
  -webkit-text-fill-color: var(--text-label-light) !important;
  opacity: 1 !important;
  font-weight: 700 !important;
}/* The browser screenshots are the acceptance floor: real instructions and
   values use mobile app sizing, not decorative terminal microtype. */
@media (max-width: 600px){
  html[data-theme="light"] :is(
    #app,.overlay,.gn-lab-tool-overlay,.gn-delete-overlay,.gn-whatsnew-overlay
  ) :is(input,textarea,select,.form-input,.form-textarea,.cp-select-trigger,
       .gn-select-trigger,.gn-custom-picker-trigger,.gn-custom-date-trigger,
       .gn-custom-picker-option,.cp-option,.gn-select-option,.btn-full) {
    font-size: 16px !important;
    line-height: 1.35 !important;
    font-weight: 550 !important;
    letter-spacing: 0 !important;
  }
  html[data-theme="light"] :is(
    .card-copy,.card p,.results-copy,.results-empty,.empty-subline,
    .gn-ledger-copy,.gn-dose-copy,.gn-measurements-copy,.gn-profile-row small,
    .gn-empty-state,.gn-weekly-report p,.gn-reference-pending span,
    .phase-readout-copy,.phase-context-text,.phase-transparency-block p,
    .phase-transparency-block li,.phase-edu-note,.scanner-status-helper,
    .shots-safety-note,.gn-research-notice,.gn-research-context,
    .gn-research-disclaimer,.gn-dose-disclaimer,.mixing-text,.mixing-warn,
    .gn-syr-helper p,.gn-syr-formula,.gn-syr-caution,.results-weight-helper,
    .shot-history-helper,#shotHistoryHelper
  ) {
    font-size: 16px !important;
    line-height: 1.55 !important;
    letter-spacing: 0 !important;
  }
  html[data-theme="light"] :is(
    .form-helper,.gn-shot-date-helper,.gn-shot-time-helper,.syr-math-helper,
    .syr-result-sub,.gn-syr-meta,.gn-syr-forensic,.gn-preferences-status,
    .gn-record-row small,.gn-measurements-grid small
  ) {
    font-size: 14px !important;
    line-height: 1.5 !important;
    letter-spacing: 0 !important;
  }
  html[data-theme="light"] :is(
    .form-label,.gn-form-grid label>span,.gn-record-form label>span,
    .gn-dose-grid label>span,.gn-measurements-grid label>span,
    .gn-preferences-grid label>span,.gn-profile-section-label,
    .gn-stable-zone-title,.results-metric-label,.phase-readout-label,
    .gn-shot-filter-grid label>span,.scanner-selected-panel small,
    .scanner-source-tag,.gn-foundation-signal,
    .gn-log-step,.asset-matrix-title b,#scannerModeLabel
  ) {
    font-size: 14px !important;
    line-height: 1.35 !important;
    letter-spacing: .035em !important;
  }
  html[data-theme="light"] :is(
    .gn-foundation-tile b,.scanner-selected-panel b,.gn-record-row b,
    .gn-record-state,.gn-dose-output,.gn-syr-result .v,#syrText,#syrML,
    #syrConcDisplay,.gn-profile-row b
  ) {
    font-size: 15px !important;
    line-height: 1.4 !important;
  }}

/* Native-feeling select family. The runtime bundle injects NIGHT GRID rules
   later, so these theme-scoped declarations intentionally carry !important. */
html[data-theme="light"] .gn-custom-picker-menu {
  overflow: auto !important;
  max-height: min(52dvh, 360px) !important;
  padding: 4px !important;
  border: 1px solid #6e8389 !important;
  border-radius: 10px !important;
  background: #fffdf8 !important;
  color: var(--text-primary-light) !important;
  box-shadow: 0 18px 42px rgba(29, 48, 54, .24) !important;
  color-scheme: light !important;
}
html[data-theme="light"] .gn-custom-picker-option {
  min-height: 48px !important;
  padding: 12px 13px !important;
  border: 0 !important;
  border-bottom: 1px solid #d2d9d8 !important;
  border-radius: 0 !important;
  background: #fffdf8 !important;
  color: var(--text-primary-light) !important;
  -webkit-text-fill-color: var(--text-primary-light) !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
  opacity: 1 !important;
}
html[data-theme="light"] .gn-custom-picker-option:last-child { border-bottom: 0 !important; }
html[data-theme="light"] .gn-custom-picker-option:is(:hover,:focus-visible) {
  background: #e5f0f1 !important;
  color: #003e4b !important;
  -webkit-text-fill-color: #003e4b !important;
  box-shadow: inset 3px 0 #00758a !important;
}
html[data-theme="light"] .gn-custom-picker-option[aria-selected="true"] {
  background: #d7eaed !important;
  color: #003845 !important;
  -webkit-text-fill-color: #003845 !important;
  box-shadow: inset 4px 0 #00576a !important;
}
html[data-theme="light"] .gn-custom-picker-option:disabled {
  background: #eceeea !important;
  color: var(--text-disabled-light) !important;
  -webkit-text-fill-color: var(--text-disabled-light) !important;
  text-decoration: line-through;
}@media (max-width: 600px){
  html[data-theme="light"] .gn-custom-picker-menu,
  html[data-theme="light"] .gn-custom-date-popover {
    position: fixed !important;
    inset: auto 12px calc(12px + env(safe-area-inset-bottom, 0px)) 12px !important;
    z-index: 1400 !important;
    width: auto !important;
    max-height: min(58dvh, 440px) !important;
    overscroll-behavior: contain;
  }
  html[data-theme="light"] .gn-custom-date-popover {
    padding: 14px !important;
    border-color: #6e8389 !important;
    background: #fffdf8 !important;
    box-shadow: 0 18px 42px rgba(29,48,54,.28) !important;
  }
  html[data-theme="light"] .gn-custom-date-day,
  html[data-theme="light"] .gn-custom-date-head button,
  html[data-theme="light"] .gn-custom-date-foot button { min-height: 44px !important; }}

/* Active, inactive and disabled must be distinguishable without color guessing. */
html[data-theme="light"] :is(.gn-ampm-btn,.time-tab,.scanner-mode-btn,.shot-history-toggle,.results-weight-unit):not(.active):not(:disabled) {
  border-color: #758b90 !important;
  background: #f7f7f1 !important;
  color: #173740 !important;
  -webkit-text-fill-color: #173740 !important;
  box-shadow: none !important;
}
html[data-theme="light"] :is(.gn-ampm-btn,.time-tab,.scanner-mode-btn,.shot-history-toggle,.results-weight-unit).active {
  border-color: #003f4d !important;
  background: #00586b !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.18) !important;
}
html[data-theme="light"] :is(.gn-ampm-btn,.time-tab,.scanner-mode-btn,.shot-history-toggle,.results-weight-unit):disabled {
  border-color: #aeb8b7 !important;
  background: #e2e4e1 !important;
  color: var(--text-disabled-light) !important;
  -webkit-text-fill-color: var(--text-disabled-light) !important;
  opacity: 1 !important;
}

/* Non-critical primary actions stay GRID cyan. Commit/destructive actions use
   a single lava-red system: hot center, crimson edge, no pink or purple. */
html[data-theme="light"] :is(#app,.overlay,.gn-lab-tool-overlay) .btn-primary {
  border-color: #004b5a !important;
  background: linear-gradient(180deg, #08788b, #005568) !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  box-shadow: inset 0 1px rgba(255,255,255,.2), 0 8px 18px rgba(0,87,106,.16) !important;
}
/* v0.15.44: .fab removed from the lava :is() lists below — the shot FAB is a
   targeting reticle owned by html/partials/01-head.html, not a lava button. */
html[data-theme="light"] :is(
  #logOv .btn-primary,#logOv .modal-btn.save,
  #wtOv .btn-primary,#wtOv .modal-btn.save,
  #gnResearchSave,#gnPreferencesSave,
  .future-confirm-save,.archive-confirm-delete,.gn-delete-confirm,
  .empty-cta,.gn-empty-cta
) {
  border-color: var(--lava-edge) !important;
  background: linear-gradient(180deg, var(--lava-hot) 0%, var(--lava-core) 52%, var(--lava-edge) 100%) !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  box-shadow: inset 0 1px rgba(255,190,128,.72), inset 0 -1px rgba(82,0,0,.42), 0 8px 20px var(--lava-glow) !important;
  text-shadow: 0 1px 1px rgba(70,0,0,.38) !important;
}
html[data-theme="light"] :is(
  #logOv .btn-primary,#logOv .modal-btn.save,
  #wtOv .btn-primary,#wtOv .modal-btn.save,
  #gnResearchSave,#gnPreferencesSave,
  .future-confirm-save,.archive-confirm-delete,.gn-delete-confirm,
  .empty-cta,.gn-empty-cta
):active {
  background: linear-gradient(180deg, #ed2d1c 0%, #c71112 55%, #87060d 100%) !important;
  transform: translateY(1px);
}

/* Light panels that inherited NIGHT text from the runtime enhancement bundle. */
html[data-theme="light"] :is(.gn-measurements-card,.gn-dose-projection,.gn-foundation-panel,.gn-profile-hub,.gn-preferences-card,.gn-device-vault) {
  background: var(--surface-elevated) !important;
  color: var(--text-primary-light) !important;
  border-color: rgba(23,57,66,.24) !important;
  box-shadow: 0 10px 28px rgba(34,53,58,.09) !important;
}
html[data-theme="light"] :is(.gn-dose-output,.gn-dose-disclaimer,.gn-research-notice,.phase-context-text) {
  background: #f1eee5 !important;
}
html[data-theme="light"] :is(.gn-dose-output,.gn-dose-disclaimer,.gn-dose-disclaimer strong,.gn-research-notice,.gn-research-notice strong,.phase-context-text) {
  color: var(--text-secondary-light) !important;
  -webkit-text-fill-color: var(--text-secondary-light) !important;
  text-shadow: none !important;
}

html:not([data-theme="light"]) .gn-custom-picker-menu {
  max-height: min(52dvh, 360px) !important;
  padding: 4px !important;
  border-color: rgba(0,212,255,.42) !important;
  background: #0b1118 !important;
}
html:not([data-theme="light"]) .gn-custom-picker-option {
  min-height: 48px !important;
  padding: 12px 13px !important;
  border-bottom: 1px solid rgba(160,220,230,.15) !important;
  background: #0b1118 !important;
  color: #d8eef2 !important;
  -webkit-text-fill-color: #d8eef2 !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
  opacity: 1 !important;
}
html:not([data-theme="light"]) .gn-custom-picker-option:is(:hover,:focus-visible,[aria-selected="true"]) {
  background: #12313a !important;
  color: #7ff5ff !important;
  -webkit-text-fill-color: #7ff5ff !important;
  box-shadow: inset 3px 0 #00d4ff !important;
}@media (max-width: 600px){
  html:not([data-theme="light"]) .gn-custom-picker-menu,
  html:not([data-theme="light"]) .gn-custom-date-popover {
    position: fixed !important;
    inset: auto 12px calc(12px + env(safe-area-inset-bottom, 0px)) 12px !important;
    z-index: 1400 !important;
    width: auto !important;
    max-height: min(58dvh, 440px) !important;
    overscroll-behavior: contain;
  }
  :is(.gn-custom-date-day,.gn-custom-date-head button,.gn-custom-date-foot button) { min-height: 44px !important; }
  :is(.gn-custom-date-dow,.gn-date-dow) { font-size: 12px !important; font-weight: 650 !important; opacity: 1 !important; }
  :is(.gn-custom-date-head strong,.gn-custom-date-foot button,.gn-date-picker-head strong) { font-size: 14px !important; }
  html:not([data-theme="light"]) :is(
    .card-copy,.card p,.results-copy,.results-empty,.empty-subline,
    .gn-ledger-copy,.gn-dose-copy,.gn-measurements-copy,.gn-profile-row small,
    .gn-empty-state,.gn-weekly-report p,.gn-reference-pending span,
    .phase-readout-copy,.phase-context-text,.phase-transparency-block p,
    .phase-transparency-block li,.phase-edu-note,.scanner-status-helper,
    .shots-safety-note,.gn-research-notice,.gn-research-context,
    .gn-research-disclaimer,.gn-dose-disclaimer,.mixing-text,.mixing-warn,
    .gn-syr-helper p,.gn-syr-formula,.gn-syr-caution,.results-weight-helper
  ) {
    font-size: 15px !important;
    line-height: 1.55 !important;
    letter-spacing: 0 !important;
    opacity: 1 !important;
  }
  html:not([data-theme="light"]) :is(
    .form-label,.gn-form-grid label>span,.gn-record-form label>span,
    .gn-dose-grid label>span,.gn-measurements-grid label>span,
    .gn-preferences-grid label>span,.gn-profile-section-label,
    .gn-stable-zone-title,.results-metric-label,.phase-readout-label,
    .scanner-selected-panel small,.scanner-source-tag,.gn-log-step
  ) {
    font-size: 14px !important;
    line-height: 1.35 !important;
    letter-spacing: .035em !important;
    opacity: 1 !important;
  }}:is(#landing, #login, #app, .overlay, .gn-lab-tool-overlay, .gn-whatsnew-overlay, .landing-note>span, .gn-auth-subtitle, .gn-auth-copy, .gn-auth-privacy span, .gn-auth-message, .gn-auth-note, .gn-dashboard-mission p, .gn-wanda-note, .asset-helper, .scanner-status-helper, .shots-safety-note, .gn-shot-date-helper, .gn-shot-time-helper, .results-signal-note span, #resultRange, #gnWeeklyCopy, .gn-weekly-report p, .gn-reference-pending span, .gn-foundation-tile small, .gn-research-notice span, .gn-research-context, .gn-research-disclaimer, .gn-dose-disclaimer, .gn-measurements-copy, .gn-preferences-grid label:has(input[type="checkbox"]), .gn-profile-signout small, .gn-ledger-copy, .gn-whatsnew-body li
){
  font-size: 15px !important;
  line-height: 1.5 !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
  opacity: 1 !important;
}:is(#landing, #login, #app, .overlay, .gn-lab-tool-overlay, .gn-whatsnew-overlay, .form-label, .gn-form-grid label>span, .gn-record-form label>span, .gn-dose-grid label>span, .gn-measurements-grid label>span, .gn-profile-section-label, .gn-auth-primary-label, .gn-wanda-label, .nav-lbl, .cp-group-minimized-label, .gn-research-group>span, .gn-whatsnew-title, .gn-whatsnew-history, .gn-whatsnew-close, .gn-profile-signout b
){
  font-size: 14px !important;
  line-height: 1.35 !important;
  font-weight: 650 !important;
  letter-spacing: .025em !important;
  opacity: 1 !important;
}

#pageLog .asset-hdr h2 {
  font-size: 18px !important;
  line-height: 1.25 !important;
  letter-spacing: .035em !important;
}

:is(#landing,#login,#app) .gn-language-control button {
  min-width: 44px !important;
  min-height: 44px !important;
  font-size: 14px !important;
}

.gn-auth-message[data-tone="status"] {
  color: var(--text-secondary, #b7c7d3) !important;
  -webkit-text-fill-color: var(--text-secondary, #b7c7d3) !important;
}
.gn-auth-message[data-tone="error"] {
  color: var(--text-error, #FF7B7B) !important;
  -webkit-text-fill-color: var(--text-error, #FF7B7B) !important;
}
html[data-theme="light"] .gn-auth-message[data-tone="status"] {
  color: var(--text-secondary-light, #294750) !important;
  -webkit-text-fill-color: var(--text-secondary-light, #294750) !important;
}
html[data-theme="light"] .gn-auth-message[data-tone="error"] {
  color: var(--text-error-light, #9a1724) !important;
  -webkit-text-fill-color: var(--text-error-light, #9a1724) !important;
}

/* Components mounted beside the app root and legacy high-specificity roles. */
html body .bottom-nav .nav-lbl {
  font-size: 14px !important;
  line-height: 1.15 !important;
  font-weight: 700 !important;
  letter-spacing: .015em !important;
  opacity: 1 !important;
}
.shots-scanner-head h2 {
  font-size: 18px !important;
  line-height: 1.25 !important;
  letter-spacing: .035em !important;
}
#app #pageLog .shots-scanner-head p,
#gnLabToolOverlay #gnInventoryForm label small,
#gnPreferencesCard .gn-preferences-grid .gn-pref-wide span,
#gnWhatsNewOverlay .gn-wn-release .gn-whatsnew-title {
  font-size: 15px !important;
  line-height: 1.5 !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
  opacity: 1 !important;
}
html[data-theme] #logOv .form-label,
html[data-theme] #wtOv .form-label {
  font-size: 15px !important;
  line-height: 1.4 !important;
  letter-spacing: .02em !important;
}
html[data-theme="light"] #logOv #cpShotMedDrop .cp-group-minimized-label {
  font-size: 14px !important;
  line-height: 1.35 !important;
  letter-spacing: .04em !important;
}

/* NIGHT GRID production gate — preserve the dark identity while ensuring
   functional status, navigation, safety copy and instrument labels remain
   usable at phone distance.
   Unified 2026-10-11: lava tokens are aliases to the canonical brand tokens
   (css/native/08-design-tokens.css); all :root lava blocks now agree. */
:root {
  --lava-core: var(--brand-red);
  --lava-core-hi: var(--brand-red-hi);
  --lava-edge: var(--brand-red-deep);
  --lava-hot: #CC2944;                 /* preserved dark cascade winner */
  --lava-glow: rgba(255, 79, 34, .28); /* preserved cascade winner */
}
:is(
  #logOv .btn-primary,#logOv .modal-btn.save,
  #wtOv .btn-primary,#wtOv .modal-btn.save,
  #gnResearchSave,#gnPreferencesSave,
  .future-confirm-save,.archive-confirm-delete,.gn-delete-confirm,
  .gn-dashboard-mission button,.gn-whatsnew-close,.landing-btn.primary
) {
  border-color: var(--lava-edge) !important;
  background: linear-gradient(180deg, var(--lava-hot) 0%, var(--lava-core) 52%, var(--lava-edge) 100%) !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  box-shadow: inset 0 1px rgba(255,190,128,.62), inset 0 -1px rgba(82,0,0,.42), 0 8px 20px var(--lava-glow) !important;
  text-shadow: 0 1px 1px rgba(70,0,0,.38) !important;
}
:is(
  #logOv .btn-primary,#logOv .modal-btn.save,
  #wtOv .btn-primary,#wtOv .modal-btn.save,
  #gnResearchSave,#gnPreferencesSave,
  .future-confirm-save,.archive-confirm-delete,.gn-delete-confirm,
  .gn-dashboard-mission button,.gn-whatsnew-close,.landing-btn.primary
):active {
  background: linear-gradient(180deg, #c91f12 0%, #b8180f 55%, #79050a 100%) !important;
}

/* B16 (2026-08-08): pending-dashboard dim REMOVED. The .74 opacity +
   saturate(.42) wash on the empty-state home was the "horrible wash out"
   in local mode. Pending home now renders at full strength — same polish
   as an active dashboard. The dim's original intent (de-emphasize
   inactive instruments) is served by the instrument cards' own subdued
   styling, not by washing the whole page. */
html:not([data-theme="light"]) #pageDash[data-activation="pending"] > :not(.page-hdr):not(#gnWandaDashboard):not(.gn-empty-hero),
html:not([data-theme="light"]) #pageDash[data-activation="pending"] #gnWandaDashboard > :not(#gnFirstShotMission) {
  opacity: 1 !important;
  filter: none !important;
}

:is(#landing,#login,#app,.overlay,.gn-lab-tool-overlay,.gn-whatsnew-overlay) :is(
  #nodeHeaderPhase,.page-sub,.landing-trust strong,.gn-auth-privacy strong,
  .gn-auth-options summary,.results-signal-note b,.gn-reference-pending strong,
  .gn-foundation-signal,.gn-lab-breadcrumb,.gn-foundation-tile b,
  .gn-research-notice strong,.gn-record-state,.gn-whatsnew-date,.gn-wn-cat-tag,
  .asset-matrix-title b,#scannerModeLabel
) {
  font-size: 14px !important;
  line-height: 1.35 !important;
  font-weight: 700 !important;
  letter-spacing: .035em !important;
  opacity: 1 !important;
}

:is(#landing,#login,#app,.overlay,.gn-lab-tool-overlay,.gn-whatsnew-overlay) :is(
  .results-card-sub,.gn-auth-note,#syrFormula
) {
  font-size: 15px !important;
  line-height: 1.5 !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
  opacity: 1 !important;
}

html[data-theme] body #logOv .modal .form-label,
html[data-theme] body #wtOv .modal .form-label {
  font-size: 15px !important;
}

#gnLabToolOverlay #gnLabToolHost :is(
  .k,.gn-syr-pk-hud .k,.gn-syr-result .k,.gn-syr-result .v,
  #syrText,#syrML,#syrConcDisplay,.gn-syr-u100,#syrHeadroom,
  .gn-syr-scale-bottom,.gn-syr-headroom
) {
  min-width: 0;
  font-size: 14px !important;
  line-height: 1.35 !important;
  letter-spacing: .02em !important;
  opacity: 1 !important;
}
html:not([data-theme="light"]) #gnLabToolOverlay #gnLabToolHost :is(.k,.gn-syr-pk-hud .k,.gn-syr-result .k) {
  color: #b7c7d3 !important;
  -webkit-text-fill-color: #b7c7d3 !important;
}
html:not([data-theme="light"]) .gn-auth-note {
  color: #a9bec7 !important;
  -webkit-text-fill-color: #a9bec7 !important;
}

.gn-404-screen{position:fixed;inset:0;z-index:99999;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:24px;text-align:center;background:#0e0e16;color:#e8e6df;font-family:inherit}
.gn-404-screen .gn-404-kicker{font-size:13px;letter-spacing:.35em;color:var(--brand-cyan);text-transform:uppercase}
.gn-404-screen .gn-404-title{font-size:22px;font-weight:700}
.gn-404-screen .gn-404-body{opacity:.72;font-size:14px;max-width:320px}
.gn-404-screen .gn-404-btn{margin-top:8px;padding:12px 22px;border-radius:var(--radius-nested);border:1px solid var(--brand-cyan);background:transparent;color:var(--brand-cyan);font-weight:600;cursor:pointer;letter-spacing:.08em}
.gn-404-screen .gn-404-btn:focus-visible{outline:2px solid var(--brand-cyan);outline-offset:3px}@media (prefers-reduced-motion: reduce){.gn-404-screen{transition:none}}

.gn-hub-close{display:inline-flex;align-items:center;justify-content:center;min-width:30px;height:30px;padding:0 8px;margin-left:8px;border:1px solid rgba(0,230,240,.35);border-radius:8px;background:rgba(0,230,240,.08);color:#9ceff4;font:700 .62rem var(--font-d);letter-spacing:1.2px;cursor:pointer;transition:border-color .18s ease,background .18s ease,color .18s ease}
.gn-hub-close:hover{border-color:rgba(0,230,240,.65);background:rgba(0,230,240,.16);color:#e8fcff}
.gn-hub-close:focus-visible{outline:2px solid rgba(0,230,240,.7);outline-offset:2px}

/* ── Batch A: brand strip + HUB label ── */
.gn-brand-strip { width: 100%; height: 2px; flex-shrink: 0; background: linear-gradient(90deg, transparent, #00d4ff 18%, #00d4ff 82%, transparent); opacity: .55; }
.topbar-hub-btn { display: inline-flex !important; align-items: center !important; gap: 4px !important; padding: 0 6px !important; }
.topbar-hub-label { font: 700 .58rem var(--font-d); letter-spacing: 1px; color: #9ceff4; white-space: nowrap; }

/* ── Batch B: empty-state hero + tip card + wanda info ── */
.gn-empty-hero { display: grid; gap: 12px; margin: 10px 0 16px; }
.gn-empty-hero h2 { margin: 0; font: 800 1.05rem var(--font-d); letter-spacing: 1.4px; color: #e8fcff; }
.gn-empty-hero p { margin: 0; font: .78rem/1.45 var(--font-b); color: #9ab3bc; max-width: 30rem; }
.gn-empty-hero .gn-empty-cta { width: 100%; }
.gn-empty-ghosts { display: grid; gap: 8px; grid-template-columns: repeat(3, 1fr); }
.gn-empty-ghost { min-height: 44px; border: 1px solid rgba(0, 230, 240, .32); border-radius: 10px; background: rgba(0, 230, 240, .06); color: #9ceff4; font: 700 .6rem var(--font-d); letter-spacing: 1.4px; cursor: pointer; transition: border-color .18s ease, background .18s ease, color .18s ease; }
.gn-empty-ghost:hover, .gn-empty-ghost:focus-visible { border-color: rgba(0, 230, 240, .65); background: rgba(0, 230, 240, .14); color: #e8fcff; outline: none; }
.gn-tip-card { margin-top: 4px; padding: 12px 14px; border: 1px solid rgba(0, 230, 240, .35); border-radius: 12px; background: linear-gradient(145deg, rgba(0, 230, 240, .08), rgba(8, 8, 14, .8)); }
.gn-tip-card .gn-tip-kicker { display: block; font: 700 .58rem var(--font-d); letter-spacing: 2.4px; color: var(--brand-cyan); margin-bottom: 4px; }
.gn-tip-card p { margin: 0; font: .74rem/1.45 var(--font-b); color: #c2d7de; }
.gn-wanda-card.info { border-left-color: #00d4ff; }
/* TRACK5: removed dead `.gn-wanda-card.info .gn-wanda-value { color: #eef6f8; }` —
   it never applied (00-base beats it with !important in both themes). */
/* v0.15.44: the shot FAB stays visible in the zero-shot state too (FAB lives on
   every tab except Vault). The Get-started hero CTA remains the primary prompt;
   the FAB is the quick action. */
/* v0.15.40 P0: progressive empty states. With zero shots logged, HOME is the
   Get-started hero + log CTA only: the Phase Engine card, Phase Sphere, and
   Phase Curve (all empty instruments pre-first-dose) stay hidden until the
   first dose arrives, then reveal via renderDashboard removing the class. */
body.gn-dashboard-empty #phaseEngineHdr,
body.gn-dashboard-empty #phaseCard,
body.gn-dashboard-empty #phaseSpherePanel,
body.gn-dashboard-empty #phaseCurveHdr,
body.gn-dashboard-empty #phaseCurveCard { display: none !important; }
/* v0.15.40 P0: TRENDS zero-data state. With no shots and no weights, the data
   cards collapse to the single "log to begin" state (the weekly report's own
   empty copy + DATA TRANSFER import path stay visible). */
body.gn-results-empty #pageResults .results-card.summary,
body.gn-results-empty #pageResults .results-card.weight,
body.gn-results-empty #pageResults .results-card.results-phase-source,
body.gn-results-empty #pageResults .results-card.appetite,
body.gn-results-empty #pageResults .results-card.energy,
body.gn-results-empty #pageResults .results-card.effects,
body.gn-results-empty #pageResults .results-card.continuity { display: none !important; }

/* ── Batch C: drawer dose form + undoable toast ── */
/* A4 2026-10-12: the Batch C bottom-sheet declarations (flex-end anchor,
   75vh cap, 18px top radius) are REMOVED — B11 below re-declared #logOv/#wtOv
   as CENTERED modals (align-items:center, 90vh cap, var(--radius-card)) and,
   being later with equal specificity + !important, already won every shared
   property. Only the width declaration was live, so only it remains. */
#logOv .modal, #wtOv .modal {
  width: 100% !important;
}
#logOv .modal { overflow-y: auto; -webkit-overflow-scrolling: touch; overscroll-behavior: contain; }
.gn-drawer-handle { width: 44px; height: 4px; border-radius: 2px; background: rgba(155, 180, 188, .5); margin: 8px auto 4px; flex-shrink: 0; }
.toast.undoable { border-color: #41e0c7 !important; border-left-color: #41e0c7 !important; background: rgba(10, 14, 20, .96) !important; color: #e8fcff !important; box-shadow: 0 6px 28px rgba(0, 0, 0, .5) !important; padding: 0 !important; overflow: hidden; }
.toast.undoable .gn-toast-body { display: flex; align-items: center; gap: 10px; padding: 12px 14px 10px; }
.toast.undoable .gn-toast-check { color: #41e0c7; font-size: 1.1rem; flex-shrink: 0; }
.toast.undoable .gn-toast-main { flex: 1; min-width: 0; }
.toast.undoable .gn-toast-title { font: 800 .86rem var(--font-d); letter-spacing: 1px; color: #e8fcff; }
.toast.undoable .gn-toast-detail { font: .72rem var(--font-b); color: #9ab3bc; margin-top: 2px; }
.toast.undoable .gn-toast-undo { flex-shrink: 0; border: 1px solid rgba(65, 224, 199, .55); border-radius: 8px; background: rgba(65, 224, 199, .1); color: #41e0c7; font: 700 .62rem var(--font-d); letter-spacing: 1.6px; padding: 8px 12px; cursor: pointer; transition: background .16s ease, border-color .16s ease; }
.toast.undoable .gn-toast-undo:hover, .toast.undoable .gn-toast-undo:focus-visible { background: rgba(65, 224, 199, .2); border-color: #41e0c7; outline: none; }
.toast.undoable .gn-toast-bar { height: 4px; background: rgba(65, 224, 199, .9); transform-origin: left center; animation: gnToastBar 5s linear forwards; }@keyframes gnToastBar{ from { transform: scaleX(1); } to { transform: scaleX(0); }}@media (prefers-reduced-motion: reduce){ .toast.undoable .gn-toast-bar { animation-duration: 5s; }}

/* ── Batch D: HUB danger + scanner hint + peptide custom distinction ── */
.gn-profile-danger-row { border-left: 3px solid rgba(255, 59, 59, .55) !important; background: rgba(255, 59, 59, .05) !important; }
.gn-profile-danger-row:hover, .gn-profile-danger-row:focus-visible { background: rgba(255, 59, 59, .12) !important; }
.gn-profile-danger-row b { color: var(--brand-red-hi) !important; }
.gn-zone-hint { animation: gnPulseHint 1.5s ease-in-out 3; }@keyframes gnPulseHint{ 0%, 100% { box-shadow: 0 0 0 0 rgba(0, 212, 255, .55); } 50% { box-shadow: 0 0 0 10px rgba(0, 212, 255, 0); }}
.gn-zone-hint-caption { text-align: center; font: 700 .6rem var(--font-d); letter-spacing: 2px; color: var(--brand-cyan); margin: 8px 0 2px; animation: gnPulseHint 1.5s ease-in-out 3; }
.gn-research-custom-group { border: 1px solid rgba(255, 209, 102, .4) !important; background: rgba(255, 209, 102, .05) !important; border-radius: var(--radius-nested); }
.gn-research-custom-group > span { color: var(--brand-amber) !important; }
.gn-custom-warning { margin: 10px 0 0; padding: 10px 12px; border: 1px solid rgba(255, 209, 102, .45); border-radius: var(--radius-nested); background: rgba(255, 209, 102, .07); color: var(--brand-amber); font: .6rem/1.5 var(--font-m); letter-spacing: .4px; }
.gn-research-preset-badge { display: inline-block; margin-left: 6px; padding: 1px 6px; border: 1px solid rgba(0, 212, 255, .5); border-radius: 6px; color: var(--brand-cyan); font: 700 .52rem var(--font-d); letter-spacing: 1.4px; vertical-align: middle; }

/* ── Project 2: peptide two-mode structure ── */
.gn-research-mode { margin: 10px 0 12px; }
.gn-research-mode-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 6px; }
.gn-research-chip { padding: 4px 10px; border: 1px solid rgba(0, 212, 255, .5); border-radius: var(--radius-pill); background: rgba(0, 212, 255, .08); color: var(--brand-cyan); font: 700 .56rem var(--font-d); letter-spacing: 1.2px; }
.gn-research-mode-custom { display: flex; align-items: center; justify-content: space-between; gap: 8px; flex-wrap: wrap; }
.gn-research-mode-custom .gn-research-mode-title { font: 800 .7rem var(--font-d); letter-spacing: 1.6px; color: var(--brand-amber); }
.gn-research-back { border: 0; background: transparent; color: #9ceff4; font: 700 .6rem var(--font-d); letter-spacing: 1.2px; cursor: pointer; padding: 4px 0; }
.gn-research-back:hover, .gn-research-back:focus-visible { color: #e8fcff; outline: none; }

.gn-research-custom-link { display: block; margin-top: 6px; border: 0; background: transparent; color: #9ceff4 !important; font: 700 .58rem var(--font-d); letter-spacing: 1px; cursor: pointer; text-align: left; padding: 4px 0; }
.gn-research-custom-link:hover, .gn-research-custom-link:focus-visible { color: #e8fcff; outline: none; }@media (max-width: 359px){ .topbar-hub-label { display: none !important; }}

/* ── v0.15.1 R2/R2.1: compact topbar + custom brand toggles ─────────── */
#app .topbar { min-height: 56px; max-height: 64px; padding-top: calc(6px + var(--safe-top)); padding-bottom: 6px; }
#app .topbar-actions { gap: 10px; }
#app .topbar .gn-theme-toggle { display: flex; gap: 4px; align-items: center; }
#app .gn-theme-opt {
  width: 32px; height: 32px; min-width: 32px; min-height: 32px;
  padding: 0; margin: 0; display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid rgba(125, 165, 180, .35); border-radius: 50%;
  background: rgba(0, 0, 0, .18); color: #8aa6b3; cursor: pointer; opacity: .7;
  transition: opacity .15s, border-color .15s, color .15s, background .15s;
}
html[data-theme="light"] #app .gn-theme-opt { border-color: rgba(20, 60, 70, .28); background: rgba(20, 60, 70, .06); color: #33525c; opacity: .85; }
#app .gn-theme-opt .gn-theme-svg { display: block; flex: 0 0 auto; }
#app .gn-theme-opt.active { opacity: 1; color: #00d4ff; border-color: rgba(0, 212, 255, .45); }
#app .gn-theme-opt:hover, #app .gn-theme-opt:focus-visible { opacity: 1; outline: none; border-color: rgba(0, 212, 255, .55); color: #00d4ff; }
#app .gn-theme-opt .gn-theme-svg-night rect[fill="#FF3B3B"] { fill: #FF3B3B; }
html[data-theme="light"] #app .gn-theme-opt { color: #4d6b75; }
html[data-theme="light"] #app .gn-theme-opt.active { color: #00718a; border-color: rgba(0, 111, 130, .5); }

/* Globe language control + dropdown */
#app .gn-lang-wrap { position: relative; display: flex; align-items: center; }
#app .gn-lang-globe {
  width: 44px; height: 44px; min-width: 44px; min-height: 44px;
  padding: 0; display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid rgba(125, 165, 180, .35); border-radius: 50%;
  background: rgba(0, 0, 0, .18); color: #8aa6b3; opacity: 1; cursor: pointer;
  transition: opacity .15s, border-color .15s, color .15s, background .15s;
}
html[data-theme="light"] #app .gn-lang-globe { border-color: rgba(20, 60, 70, .28); background: rgba(20, 60, 70, .06); color: #33525c; }
#app .gn-lang-globe:hover, #app .gn-lang-globe:focus-visible { opacity: 1; color: #00d4ff; outline: none; border-color: rgba(0, 212, 255, .55); }
#app .gn-lang-dropdown {
  position: absolute; top: calc(100% + 8px); right: 0; z-index: 120;
  display: none; min-width: 132px; padding: 6px;
  border: 1px solid rgba(0, 212, 255, .3); border-radius: 8px;
  background: #0a1016; box-shadow: 0 12px 32px rgba(0, 0, 0, .55);
}
#app .gn-lang-dropdown.open { display: block; }
#app .gn-lang-dropdown button {
  display: block; width: 100%; padding: 9px 12px; text-align: left;
  border: 0; border-radius: 6px; background: transparent; color: #9fc7d4;
  font: 600 .68rem var(--font-m, monospace); letter-spacing: .6px; cursor: pointer;
}
#app .gn-lang-dropdown button:hover, #app .gn-lang-dropdown button.active { background: rgba(0, 212, 255, .1); color: #fff; }
html[data-theme="light"] #app .gn-lang-dropdown { background: #f4f1e9; border-color: rgba(0, 111, 130, .35); }
html[data-theme="light"] #app .gn-lang-dropdown button { color: #33515c; }
html[data-theme="light"] #app .gn-lang-dropdown button:hover, html[data-theme="light"] #app .gn-lang-dropdown button.active { background: rgba(0, 111, 130, .1); color: #00384a; }

/* HUB: 32x32, V6 mark, top-right 16px */
#app .topbar-hub-btn { width: 32px; height: 32px; min-width: 32px; min-height: 32px; padding: 0; display: inline-flex; align-items: center; justify-content: center; border-radius: 50%; overflow: hidden; border: 1px solid rgba(0, 212, 255, .35); background: rgba(0, 212, 255, .06); }
#app .topbar-hub-btn img { width: 26px; height: 26px; object-fit: contain; }
#app .topbar-hub-label { display: none; }

/* Wordmark: never smaller than toggles */
#app .app-wordmark-b2b svg { height: 24px; width: auto; }/* Mobile 360: keep everything fitting (hit areas stay 44px; visuals shrink) */
@media (max-width: 380px){
  #app .topbar-actions { gap: 4px; }
  #app .gn-theme-opt, #app .gn-lang-globe { width: 44px; height: 44px; min-width: 44px; min-height: 44px; }}

/* Landing globe mount: keep it in the hero top-right area like the old pill.
   Hit area is 44px; the visible circle stays 32px (drawn on ::before).
   Overnight polish (2026-08-09): absolute so it floats top-right instead of
   auto-placing into an implicit grid row below the product preview — that
   implicit row created ~134px of dead space before the WHY section.
   Specificity must beat .landing-hero > *:not(.landing-phase-visual)
   (0,2,0) in index.html AND its re-injection in the bundle's runtime
   styles, hence the ID-qualified selector. */
#landing .landing-lang-wrap { position: absolute; top: 0; right: 0; z-index: 5; display: inline-flex; }
.landing-lang-wrap .gn-lang-globe {
  width: 44px; height: 44px; min-width: 44px; min-height: 44px;
  padding: 0; display: inline-flex; align-items: center; justify-content: center;
  position: relative; border: 0; background: transparent;
  color: #8ea6b0; cursor: pointer;
}
.landing-lang-wrap .gn-lang-globe::before {
  content: ''; position: absolute; inset: 6px;
  border: 1px solid rgba(0,212,255,.25); border-radius: 50%;
  background: rgba(5,10,16,.7);
}
.landing-lang-wrap .gn-lang-globe svg { position: relative; z-index: 1; }
.landing-lang-wrap .gn-lang-globe:hover, .landing-lang-wrap .gn-lang-globe:focus-visible { color: #00d4ff; outline: none; }
.landing-lang-wrap .gn-lang-globe:hover::before, .landing-lang-wrap .gn-lang-globe:focus-visible::before { border-color: rgba(0,212,255,.55); }
.landing-lang-wrap .gn-lang-dropdown { left: 0; right: auto; }

/* ── v0.15.1 B10: inline action errors (Mars Red, near the action) ──── */
.gn-inline-error {
  margin-top: 10px; padding: 9px 11px;
  border: 1px solid rgba(255, 59, 59, .5); border-left: 3px solid #FF3B3B;
  border-radius: 4px; background: rgba(255, 59, 59, .07);
  color: #FF5B5B; font: 600 .62rem/1.5 var(--font-m, monospace);
  letter-spacing: .4px; word-break: break-word; overflow-wrap: anywhere;
}
html[data-theme="light"] .gn-inline-error { background: rgba(255, 59, 59, .06); color: #c22b2b; border-color: rgba(209, 36, 36, .5); }

/* ─────────────────────────────────────────────────────────────────────
   Exquisite Eyes WCAG / audit fixes — 2026-08-07
   Verified by scripts/audit-served-day-ops.cjs (light + dark passes).
   ─────────────────────────────────────────────────────────────────────
   Unified 2026-10-11: lava tokens are aliases to the canonical brand tokens
   (css/native/08-design-tokens.css). The 2026-08-07 WCAG deepening is
   superseded by the 2026-08-08 founder Mars Red restoration below; the
   historical note is kept for context.
   (Historical: white text on the red-lava CTAs measured 3.04–3.54:1;
   deepened stops were #CC2944 / #C61F3A / #8F0F28.) */
:root {
  --lava-core: var(--brand-red);
  --lava-core-hi: var(--brand-red-hi);
  --lava-edge: var(--brand-red-deep);
  --lava-hot: #CC2944;                 /* preserved dark cascade winner */
  --lava-glow: rgba(255, 79, 34, .28); /* preserved cascade winner */
}
/* Light theme re-binds the lava vars in html[data-theme="light"] (line ~2151);
   re-deepen them there too so the audit's minimum-stop contrast passes. */
html[data-theme="light"] {
  --lava-hot: #CC2944;
  --lava-core: #C61F3A;
  --lava-edge: #8F0F28;
}
/* Calendar day numbers in night-grid: 3.03:1 → ~9:1.
   Night-grid is the default theme (no data-theme attribute); the
   light rule below (line ~650) keeps light-day styling. */
.gn-date-grid .cal-day,
.gn-custom-date [data-gn-date-day] { color: #DCEBF2 !important; }
html:not([data-theme="light"]) .cal-day-num,
html:not([data-theme="light"]) .cal-day,
html:not([data-theme="light"]) .cal-day span { color: #DCEBF2 !important; }
/* "YOUR DATA, YOUR RULES" link: 3.53:1 (night) → ~10:1 */
#gnVaultPolicyLink { color: #9FC3CF; }
/* Telemetry + empty-state copy floors (audit role floors: .P ≥ 15px, H3 ≥ 12px) */
.gn-telemetry-heading p { font-size: 15px !important; }
.gn-telemetry-instrument header h3 { font-size: 15px !important; }
.gn-telemetry-instrument header p { font-size: 15px !important; }
.gn-chart-state { font-size: .75rem !important; }
.gn-empty-hero p { font-size: 15px !important; }
em[data-i18n="research.organize"], em[data-i18n="lab.separateCalculators"] { font-size: .75rem !important; }
.gn-dose-disclaimer, .gn-research-disclaimer { font-size: 15px !important; }
/* LAB mixing reference note (audited at 12.8px vs 15px sentence floor) */
#app [data-i18n="lab.mixingWarn"], .mixing-warn, .mixing-warn span { font-size: 15px !important; }
html[data-theme="light"] #gnLabToolHost .mixing-warn,
html[data-theme="light"] .mixing-warn span { font-size: 15px !important; }
/* Narrow-width pill row: allow graceful two-row wrap, never clipped labels.
   Overnight polish (2026-08-09): ES labels ('Registrar peso', 'Escanear
   zona') need ~123px; minmax(104px,1fr) + nowrap clipped/overlapped them
   at 360/390/412px. Wrap is the graceful fallback. */
.gn-empty-ghosts { grid-template-columns: repeat(auto-fit, minmax(104px, 1fr)); }
.gn-empty-ghost { white-space: normal; padding: 10px 6px; line-height: 1.25; text-align: center; }
/* Passkey button is now a quiet text action in the OTP-first welcome view;
   the old Mars Red CTA treatment was removed 2026-09-24. */
/* es-419: Spanish sentence-length copy exceeds the audit's 34-char sentence
   threshold → 15px floor (EN equivalents pass at their HUD sizes). The
   :is(#landing,#login,...) :is(button,...) HUD rule forces 14px at
   (1,1,2) specificity — these overrides out-rank it. */
html[lang="es"] body #login #gnLocalBtn,
html[lang="es"] body #app .gn-chart-state,
html[lang="es"] body #gnLabToolOverlay #gnResearchSection strong[data-i18n="research.noticeTitle"] { font-size: 15px !important; }
/* Polish (Exquisite Eyes sweep): in night-grid the active nav item colors
   only its icon — color the label too so the state reads at a glance.
   Checkboxes get the system-cyan accent (UA accent is near-invisible). */
html:not([data-theme="light"]) .nav-item.active .nav-lbl { color: var(--brand-cyan) !important; }
input[type="checkbox"] { accent-color: var(--brand-cyan); }
/* es-419: left-align the research notice body — justified/centered Spanish
   text produces uneven word gaps at narrow widths. */
html[lang="es"] .gn-research-notice { text-align: start !important; }

/* es-419: long Spanish titles clip in the lab overlay/foundation headers —
   allow wrapping and tighten tracking so nothing is cut at the edge. */
html[lang="es"] .gn-lab-tool-head h2,
html[lang="es"] .gn-foundation-head h2 {
  font-size: .78rem !important;
  letter-spacing: .5px !important;
  white-space: normal !important;
  line-height: 1.3 !important;
}
/* Light theme caps body copy at 12px (density rule); the audited
   sentence-level copy is exempted so it meets the 15px floor. */
html[data-theme="light"] #app :is(.gn-empty-hero p, .gn-telemetry-heading p,
  .gn-telemetry-instrument header p, [data-i18n="lab.mixingWarn"]) {
  font-size: 15px !important;
}

/* ─────────────────────────────────────────────────────────────────────
   Mars Red CTA restoration — founder direction 2026-08-08
   The 2026-08-07 audit pass deepened the lava tokens (white-on-red
   4.5:1), which made the primary CTAs read as dark washed-out maroon.
   Founder locked Mars Red as THE CTA color: #FF3B3B -> #D12424 gradient
   with the AA text-shadow on the label (below). Contrast for the label
   is carried by the existing 0 1px 2px rgba(60,0,12,.45) text-shadow;
   the audit's other fixes (calendar days, text floors, passkey, links)
   remain untouched. Only CTA surfaces are restored.
   ─────────────────────────────────────────────────────────────────────
   Unified 2026-10-11: lava tokens are aliases to the canonical brand tokens
   (css/native/08-design-tokens.css); all :root lava blocks now agree. */
:root {
  --lava-core: var(--brand-red);       /* Mars Red primary */
  --lava-core-hi: var(--brand-red-hi); /* Mars Red hover/light */
  --lava-edge: var(--brand-red-deep);  /* Mars Red deep / pressed */
  --lava-hot: #CC2944;                 /* preserved dark cascade winner */
  --lava-glow: rgba(255, 79, 34, .28); /* preserved cascade winner */
}
html[data-theme="light"] {
  --lava-hot: #FF4B4B;
  --lava-core-hi: #FF5B5B;
  --lava-core: #FF3B3B;
  --lava-edge: #D12424;
}
/* .btn-primary radial + hover + light variants consume the tokens above. */

/* ─────────────────────────────────────────────────────────────────────
   R2.2 — 2077 kanji language icon (2026-08-08, rev)
   One kanji (電), single SVG, stroke currentColor stroke-width 2.
   Color = ACTIVE language via data-lang on parent wrap:
     EN = electric cyan #00d4ff, ES = Mars Red #FF3B3B.
   Blend: drop-shadow(0 0 3px currentColor). 8px padding, no box,
   no visible border. Hit area stays 44px (WCAG 2.5.8) but invisible.
   Theme toggle (R2.1 city/tower SVGs) is untouched.
   ───────────────────────────────────────────────────────────────────── */
.gn-lang-wrap { padding: 8px; }
.gn-lang-wrap[data-lang="en"] .gn-lang-globe { color: #00d4ff; }
.gn-lang-wrap[data-lang="es"] .gn-lang-globe { color: #FF3B3B; }
.gn-lang-kanji {
  width: 18px; height: 18px;
  filter: drop-shadow(0 0 3px currentColor);
  transition: color .18s ease, filter .18s ease;
}
#app .gn-lang-globe {
  width: 44px; height: 44px; min-width: 44px; min-height: 44px;
  padding: 0; display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid transparent; border-radius: 50%;
  background: transparent; opacity: 1; cursor: pointer;
  transition: opacity .15s;
}
#app .gn-lang-globe:hover, #app .gn-lang-globe:focus-visible { opacity: 1; outline: none; }
.gn-lang-wrap[data-lang="en"] .gn-lang-globe:hover, .gn-lang-wrap[data-lang="en"] .gn-lang-globe:focus-visible { color: #00d4ff; }
.gn-lang-wrap[data-lang="es"] .gn-lang-globe:hover, .gn-lang-wrap[data-lang="es"] .gn-lang-globe:focus-visible { color: #FF3B3B; }
/* ─────────────────────────────────────────────────────────────────────
   B13 — CRT rolling scanline (2026-08-08)
   A thin cyan line rolls top-to-bottom every 8s with a phosphor
   afterglow, like a real CRT refresh. Fixed overlay, pointer-events
   none; disabled under prefers-reduced-motion. The vertical sweep uses
   the compositor-only translate property so it never contributes CLS.
   ───────────────────────────────────────────────────────────────────── */
.gn-crt-scanline {
  position: fixed; top: 0; left: 0; width: 100vw; height: 100vh;
  pointer-events: none; z-index: 9998; overflow: hidden;
}
.gn-crt-scanline::before {
  content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 2px;
  background: rgba(0, 212, 255, .35);
  /* B13 rev 2: tighter phosphor halo, fainter — ambient, not a light bar */
  box-shadow: 0 0 6px rgba(0, 212, 255, .35), 0 5px 8px rgba(0, 212, 255, .16), 0 -5px 8px rgba(0, 212, 255, .12);
  will-change: translate;
  animation: gnCrtRoll 8s cubic-bezier(.55, .12, .6, .9) infinite, gnCrtJitter 30s steps(1) infinite;
}@keyframes gnCrtRoll{
  0% { translate: 0 -3vh; }
  55% { translate: 0 97vh; }
  100% { translate: 0 97vh; }}/* B13 rev: random 1-2px horizontal jitter every ~30s (30s cycle,
   steps() = hard snap, never smooth drift) */
@keyframes gnCrtJitter{
  0%, 96% { transform: translateX(0); }
  96.5% { transform: translateX(1px); }
  97% { transform: translateX(-2px); }
  97.5% { transform: translateX(1px); }
  98%, 100% { transform: translateX(0); }}@media (prefers-reduced-motion: reduce){
  .gn-crt-scanline { display: none !important; }}
html[data-theme="light"] .gn-crt-scanline::before {
  background: rgba(0, 111, 130, .28);
  box-shadow: 0 0 6px rgba(0, 111, 130, .25), 0 4px 8px rgba(0, 111, 130, .12), 0 -4px 8px rgba(0, 111, 130, .09);
}

/* ─────────────────────────────────────────────────────────────────────
   B14 — tab punch animation (2026-08-08)
   100ms scale 1 -> .92 -> 1 on the bottom-nav tabs (and FAB), fired on
   pointerdown alongside the 15ms haptic. Reduced-motion: no animation.
   ───────────────────────────────────────────────────────────────────── */
.nav-item.gn-punch, .fab.gn-punch {
  animation: gnPunch .1s ease-out;
}@keyframes gnPunch{
  0% { transform: scale(1); }
  50% { transform: scale(.92); }
  100% { transform: scale(1); }}@media (prefers-reduced-motion: reduce){
  .nav-item.gn-punch, .fab.gn-punch { animation: none !important; }}

/* ─────────────────────────────────────────────────────────────────────
   B15 — number ticker flash (2026-08-08)
   Brief Mars Red highlight on a stat when its value changes, fading
   out over 200ms. Reduced-motion: no animation (instant render).
   ───────────────────────────────────────────────────────────────────── */
.gn-ticker-flash {
  color: #FF5B5B !important;
  transition: color var(--dur-2) var(--ease-out) !important;
}@media (prefers-reduced-motion: reduce){
  .gn-ticker-flash { transition: none !important; }}

/* ─────────────────────────────────────────────────────────────────────
   B11 — layout fixes (2026-08-08)
   1) CALCULADORAS / foundation tiles: no text overflow on narrow Android
      — flex child min-width guard + word wrapping.
   2) Dose form (#logOv) opens CENTERED, not bottom-anchored partial
      sheet. Short form fits as a true modal; tall content scrolls.
   ───────────────────────────────────────────────────────────────────── */
.gn-foundation-tile {
  min-width: 0 !important;
  overflow-wrap: break-word !important;
  word-break: break-word !important;
}
.gn-foundation-tile small {
  min-width: 0 !important;
  overflow-wrap: break-word !important;
  word-break: break-word !important;
  max-width: 100% !important;
}
.gn-foundation-tile .gn-foundation-icon {
  flex: 0 0 auto !important;
  width: 24px !important;
  height: 24px !important;
  margin-right: 12px !important;
}
#logOv .modal, #wtOv .modal {
  border-radius: 16px !important;
  align-self: center !important;
  margin: auto !important;
  max-height: 90vh !important;
  /* v0.15.38: see above — track the live visual viewport, not raw vh. */
  max-height: calc(var(--gn-viewport-height, 100dvh) * 0.9) !important;
}
#logOv, #wtOv {
  align-items: center !important;
}

/* ─────────────────────────────────────────────────────────────────────
   B12 — peptide library flow (2026-08-08)
   Research notice collapsed to one compact line: "?" info toggle
   reveals the body on demand. No disclaimer wall at the top.
   ───────────────────────────────────────────────────────────────────── */
.gn-research-notice-compact {
  display: flex; align-items: flex-start; gap: 8px;
  padding: 8px 10px !important;
  margin: 10px 0 12px !important;
  border: 1px solid rgba(0, 212, 255, .18) !important;
  border-left: 2px solid #00d4ff !important;
  background: rgba(0, 212, 255, .04) !important;
}
.gn-research-info-toggle {
  flex: 0 0 auto; width: 22px; height: 22px; padding: 0;
  display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid rgba(0, 212, 255, .4); border-radius: 50%;
  background: transparent; color: #00d4ff;
  font: 800 .7rem var(--font-d, monospace); cursor: pointer; line-height: 1;
}
.gn-research-info-toggle:hover, .gn-research-info-toggle:focus-visible {
  background: rgba(0, 212, 255, .12); outline: none;
}
.gn-research-notice-compact strong {
  font: 700 .6rem var(--font-d, monospace); letter-spacing: 1.2px;
  color: #9fefff; line-height: 1.9;
}
.gn-research-notice-body {
  display: block; margin-top: 4px; width: 100%;
  color: #8295a0; font: .6rem/1.5 var(--font-m, monospace);
}
.gn-research-notice-body[hidden] { display: none; }
html[data-theme="light"] .gn-research-notice-compact {
  background: #f1eee5 !important; border-color: rgba(0, 111, 130, .3) !important;
}
html[data-theme="light"] .gn-research-notice-compact strong { color: #1c2b31; }
html[data-theme="light"] .gn-research-notice-body { color: #4d6b75; }

/* ─────────────────────────────────────────────────────────────────────
   B12 — Advanced expand (2026-08-08, rev)
   FUENTE + OBSERVACIONES collapse behind an "ADVANCED" disclosure so
   the peptide form fits 360px without scroll: NOMBRE + CATEGORÍA +
   FECHA + ESTADO visible, the rest one tap away.
   ───────────────────────────────────────────────────────────────────── */
.gn-advanced-fields {
  margin: 2px 0 0;
  border: 1px solid rgba(0, 212, 255, .16);
  border-radius: 8px;
  background: rgba(0, 212, 255, .03);
  overflow: hidden;
}
.gn-advanced-toggle {
  display: block; width: 100%; padding: 8px 10px;
  border: 0; background: transparent;
  color: #7fd8e6;
  font: 700 .56rem var(--font-d, monospace);
  letter-spacing: 1.6px;
  cursor: pointer;
  text-align: left;
  user-select: none;
}
.gn-advanced-toggle:hover, .gn-advanced-toggle:focus-visible {
  color: #00d4ff; outline: none; background: rgba(0, 212, 255, .06);
}
.gn-advanced-toggle::after {
  content: "+"; float: right; color: #5d94a1; font-weight: 800;
}
.gn-advanced-toggle.open::after { content: "−"; }
.gn-advanced-body { padding: 10px 10px 0; }
.gn-advanced-body > label:last-child { padding-bottom: 10px; }
.gn-advanced-body[hidden] { display: none; }
html[data-theme="light"] .gn-advanced-fields {
  background: #f1eee5; border-color: rgba(0, 111, 130, .25);
}
html[data-theme="light"] .gn-advanced-toggle { color: #2d5d6b; }
html[data-theme="light"] .gn-advanced-toggle:hover { background: rgba(0, 111, 130, .06); }

/* ─────────────────────────────────────────────────────────────────────
   B16 rev — contrast pass (2026-08-08)
   Ghost buttons ~50% presence (were ~30%): brighter border + fill.
   Theme icons: full cyan active, 40% opacity inactive (explicit).
   Tutorial spotlight: thicker ring + darker backdrop dim.
   ───────────────────────────────────────────────────────────────────── */
.gn-empty-ghost {
  border-color: rgba(0, 230, 240, .5) !important;
  background: rgba(0, 230, 240, .1) !important;
  color: #c6f4f8 !important;
}
.gn-empty-ghost:hover, .gn-empty-ghost:focus-visible {
  border-color: rgba(0, 230, 240, .8) !important;
  background: rgba(0, 230, 240, .18) !important;
  color: #e8fcff !important;
}
/* Overnight polish (2026-08-09): light-theme ghosts must stay readable —
   the dark !important values above leaked into DAY OPS and made the
   secondary actions nearly invisible on the pearl surface. */
html[data-theme="light"] .gn-empty-ghost {
  border-color: rgba(0, 111, 130, .45) !important;
  background: rgba(0, 111, 130, .08) !important;
  color: #005a70 !important;
}
html[data-theme="light"] .gn-empty-ghost:hover,
html[data-theme="light"] .gn-empty-ghost:focus-visible {
  border-color: #00677f !important;
  background: rgba(0, 111, 130, .14) !important;
  color: #003c4a !important;
}
:is(#app,#login,#landing) .gn-theme-toggle button.gn-theme-opt { color: #7fa3ad; opacity: .4 !important; }
:is(#app,#login,#landing) .gn-theme-toggle button.gn-theme-opt.active { color: #00d4ff; opacity: 1 !important; }
html[data-theme="light"] :is(#app,#login,#landing) .gn-theme-toggle button.gn-theme-opt { color: #4d6b75; opacity: .4 !important; }
html[data-theme="light"] :is(#app,#login,#landing) .gn-theme-toggle button.gn-theme-opt.active { color: #006f82; opacity: 1 !important; }


/* ─────────────────────────────────────────────────────────────────────
   R2.2 rev 2 (2026-08-08): kanji = THE language control.
   Bigger (22px), direct toggle (no dropdown, no grey tabs). Click flips
   EN<->ES; color follows: EN cyan, ES Mars Red. Auth shell uses the same
   kanji. Dropdown styles above are dead but harmless; these win.
   ───────────────────────────────────────────────────────────────────── */
.gn-lang-kanji {
  width: 22px !important; height: 22px !important;
  filter: drop-shadow(0 0 4px currentColor);
  transition: color .18s ease, filter .18s ease;
}
.gn-lang-wrap[data-lang="en"] .gn-lang-globe, .gn-auth-lang-kanji .gn-lang-globe:not([data-lang-choice="en"]) { color: #00d4ff; }
.gn-lang-wrap[data-lang="en"] .gn-lang-globe { color: #00d4ff; }
.gn-lang-wrap[data-lang="es"] .gn-lang-globe { color: #FF3B3B; }
.gn-auth-lang-kanji .gn-lang-globe[data-lang-choice="en"] { color: #FF3B3B; } /* ES active -> shows Mars Red, click goes to EN */
.gn-auth-lang-kanji .gn-lang-globe[data-lang-choice="es"] { color: #00d4ff; } /* EN active -> shows cyan, click goes to ES */
.gn-auth-card { position: relative; }
.gn-auth-lang-kanji { position: absolute; top: 14px; right: 14px; }
.gn-auth-lang-kanji .gn-lang-globe {
  width: 44px; height: 44px; min-width: 44px; min-height: 44px;
  padding: 0; display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid transparent; border-radius: 50%;
  background: transparent; cursor: pointer;
}
html[data-theme="light"] .gn-lang-wrap[data-lang="en"] .gn-lang-globe { color: #00d4ff; }
html[data-theme="light"] .gn-lang-wrap[data-lang="es"] .gn-lang-globe { color: #FF3B3B; }

/* ─────────────────────────────────────────────────────────────────────
   Landing kicker — CRT terminal glitch (2026-08-08, Pipe-approved)
   "// PERSONAL BIOTECH SYSTEM //" behaves like a real CRT signal:
   mostly clean with a faint permanent RGB fringe, then a ~350ms glitch
   burst every 7s (channel split + horizontal slice displacement).
   Both themes. Reduced-motion: fully disabled.
   NOTE: NIGHT is the DEFAULT theme — no data-theme attr on <html>.
   Dark-mode rules must use html:not([data-theme="light"]) to cover it.
   ───────────────────────────────────────────────────────────────────── */
#landing .landing-kicker {
  animation: gnKickerGlitch 7s steps(1) infinite;
  will-change: transform, clip-path;
}
html:not([data-theme="light"]) #landing .landing-kicker {
  text-shadow:
    0 0 14px rgba(0, 212, 255, 0.35),
    1px 0 rgba(255, 59, 59, 0.28),
    -1px 0 rgba(0, 212, 255, 0.28);
}
html[data-theme="light"] #landing .landing-kicker {
  animation-name: gnKickerGlitchLight;
  text-shadow:
    1px 0 rgba(255, 59, 59, 0.38),
    -1px 0 rgba(0, 111, 130, 0.38);
}@keyframes gnKickerGlitch{
  0%, 91% {
    transform: translate(0, 0);
    clip-path: none;
    text-shadow:
      0 0 14px rgba(0, 212, 255, 0.35),
      1px 0 rgba(255, 59, 59, 0.28),
      -1px 0 rgba(0, 212, 255, 0.28);
  }
  92% {
    transform: translate(2px, 0);
    clip-path: inset(0 0 58% 0);
    text-shadow:
      3px 0 rgba(255, 59, 59, 0.85),
      -3px 0 rgba(0, 212, 255, 0.85),
      0 0 18px rgba(0, 212, 255, 0.5);
  }
  93% {
    transform: translate(-2px, 1px);
    clip-path: inset(42% 0 0 0);
    text-shadow:
      -3px 0 rgba(255, 59, 59, 0.85),
      3px 0 rgba(0, 212, 255, 0.85);
  }
  94% {
    transform: translate(1px, -1px);
    clip-path: inset(12% 0 66% 0);
    text-shadow:
      2px 0 rgba(255, 59, 59, 0.9),
      -2px 0 rgba(0, 212, 255, 0.9);
  }
  95% {
    transform: translate(0, 1px);
    clip-path: inset(70% 0 0 0);
  }
  96%, 100% {
    transform: translate(0, 0);
    clip-path: none;
    text-shadow:
      0 0 14px rgba(0, 212, 255, 0.35),
      1px 0 rgba(255, 59, 59, 0.28),
      -1px 0 rgba(0, 212, 255, 0.28);
  }}/* Light-theme glitch uses the DAY OPS cyan (readable on light bg). */
@keyframes gnKickerGlitchLight{
  0%, 91% {
    transform: translate(0, 0);
    clip-path: none;
    text-shadow:
      1px 0 rgba(255, 59, 59, 0.38),
      -1px 0 rgba(0, 111, 130, 0.38);
  }
  92% {
    transform: translate(2px, 0);
    clip-path: inset(0 0 58% 0);
    text-shadow:
      3px 0 rgba(255, 59, 59, 0.8),
      -3px 0 rgba(0, 111, 130, 0.8);
  }
  93% {
    transform: translate(-2px, 1px);
    clip-path: inset(42% 0 0 0);
    text-shadow:
      -3px 0 rgba(255, 59, 59, 0.8),
      3px 0 rgba(0, 111, 130, 0.8);
  }
  94% {
    transform: translate(1px, -1px);
    clip-path: inset(12% 0 66% 0);
    text-shadow:
      2px 0 rgba(255, 59, 59, 0.85),
      -2px 0 rgba(0, 111, 130, 0.85);
  }
  95% {
    transform: translate(0, 1px);
    clip-path: inset(70% 0 0 0);
  }
  96%, 100% {
    transform: translate(0, 0);
    clip-path: none;
    text-shadow:
      1px 0 rgba(255, 59, 59, 0.38),
      -1px 0 rgba(0, 111, 130, 0.38);
  }}@media (prefers-reduced-motion: reduce){
  #landing .landing-kicker {
    animation: none !important;
  }}


/* ─────────────────────────────────────────────────────────────────────
   Auth title — subtle CRT terminal glitch (2026-08-08)
   "GRID//NODE" on the sign-in card: faint RGB convergence drift at
   rest, a brief low-key displacement burst every 9s. Much softer than
   the landing kicker — the title stays legible, just alive.
   Both themes. Reduced-motion: disabled.
   ───────────────────────────────────────────────────────────────────── */
#login .gn-auth-title {
  animation: gnTitleGlitch 9s steps(1) infinite;
  will-change: transform, clip-path;
}
html:not([data-theme="light"]) #login .gn-auth-title {
  text-shadow:
    1px 0 rgba(255, 59, 59, 0.22),
    -1px 0 rgba(0, 212, 255, 0.22);
}
html[data-theme="light"] #login .gn-auth-title {
  animation-name: gnTitleGlitchLight;
  text-shadow:
    1px 0 rgba(255, 59, 59, 0.25),
    -1px 0 rgba(0, 111, 130, 0.25);
}@keyframes gnTitleGlitch{
  0%, 93% {
    transform: translate(0, 0);
    clip-path: none;
    text-shadow:
      1px 0 rgba(255, 59, 59, 0.22),
      -1px 0 rgba(0, 212, 255, 0.22);
  }
  94% {
    transform: translate(1px, 0);
    clip-path: inset(0 0 64% 0);
    text-shadow:
      2px 0 rgba(255, 59, 59, 0.5),
      -2px 0 rgba(0, 212, 255, 0.5);
  }
  95% {
    transform: translate(-1px, 1px);
    clip-path: inset(36% 0 0 0);
    text-shadow:
      -2px 0 rgba(255, 59, 59, 0.5),
      2px 0 rgba(0, 212, 255, 0.5);
  }
  96%, 100% {
    transform: translate(0, 0);
    clip-path: none;
    text-shadow:
      1px 0 rgba(255, 59, 59, 0.22),
      -1px 0 rgba(0, 212, 255, 0.22);
  }}@keyframes gnTitleGlitchLight{
  0%, 93% {
    transform: translate(0, 0);
    clip-path: none;
    text-shadow:
      1px 0 rgba(255, 59, 59, 0.25),
      -1px 0 rgba(0, 111, 130, 0.25);
  }
  94% {
    transform: translate(1px, 0);
    clip-path: inset(0 0 64% 0);
    text-shadow:
      2px 0 rgba(255, 59, 59, 0.55),
      -2px 0 rgba(0, 111, 130, 0.55);
  }
  95% {
    transform: translate(-1px, 1px);
    clip-path: inset(36% 0 0 0);
    text-shadow:
      -2px 0 rgba(255, 59, 59, 0.55),
      2px 0 rgba(0, 111, 130, 0.55);
  }
  96%, 100% {
    transform: translate(0, 0);
    clip-path: none;
    text-shadow:
      1px 0 rgba(255, 59, 59, 0.25),
      -1px 0 rgba(0, 111, 130, 0.25);
  }}@media (prefers-reduced-motion: reduce){
  #login .gn-auth-title {
    animation: none !important;
  }}

/* WHAT'S NEW header — subtle CRT glitch (2026-08-08)
   "// SYSTEM UPDATE" + "WHAT'S NEW": faint RGB drift at rest, a brief
   low-key displacement burst every 9s. Same restraint as the auth
   title — header stays legible. Both themes. Reduced-motion off.
   ───────────────────────────────────────────────────────────────────── */
.gn-whatsnew-card .gn-whatsnew-kicker,
.gn-whatsnew-card h2#gnWhatsNewHeading {
  animation: gnWnGlitch 9s steps(1) infinite;
  will-change: transform, clip-path;
}
html:not([data-theme="light"]) .gn-whatsnew-card .gn-whatsnew-kicker,
html:not([data-theme="light"]) .gn-whatsnew-card h2#gnWhatsNewHeading {
  text-shadow:
    1px 0 rgba(255, 59, 59, 0.2),
    -1px 0 rgba(0, 212, 255, 0.2);
}
html[data-theme="light"] .gn-whatsnew-card .gn-whatsnew-kicker,
html[data-theme="light"] .gn-whatsnew-card h2#gnWhatsNewHeading {
  animation-name: gnWnGlitchLight;
  text-shadow:
    1px 0 rgba(255, 59, 59, 0.22),
    -1px 0 rgba(0, 111, 130, 0.22);
}@keyframes gnWnGlitch{
  0%, 93% {
    transform: translate(0, 0);
    clip-path: none;
    text-shadow:
      1px 0 rgba(255, 59, 59, 0.2),
      -1px 0 rgba(0, 212, 255, 0.2);
  }
  94% {
    transform: translate(1px, 0);
    clip-path: inset(0 0 64% 0);
    text-shadow:
      2px 0 rgba(255, 59, 59, 0.45),
      -2px 0 rgba(0, 212, 255, 0.45);
  }
  95% {
    transform: translate(-1px, 1px);
    clip-path: inset(36% 0 0 0);
    text-shadow:
      -2px 0 rgba(255, 59, 59, 0.45),
      2px 0 rgba(0, 212, 255, 0.45);
  }
  96%, 100% {
    transform: translate(0, 0);
    clip-path: none;
    text-shadow:
      1px 0 rgba(255, 59, 59, 0.2),
      -1px 0 rgba(0, 212, 255, 0.2);
  }}@keyframes gnWnGlitchLight{
  0%, 93% {
    transform: translate(0, 0);
    clip-path: none;
    text-shadow:
      1px 0 rgba(255, 59, 59, 0.22),
      -1px 0 rgba(0, 111, 130, 0.22);
  }
  94% {
    transform: translate(1px, 0);
    clip-path: inset(0 0 64% 0);
    text-shadow:
      2px 0 rgba(255, 59, 59, 0.5),
      -2px 0 rgba(0, 111, 130, 0.5);
  }
  95% {
    transform: translate(-1px, 1px);
    clip-path: inset(36% 0 0 0);
    text-shadow:
      -2px 0 rgba(255, 59, 59, 0.5),
      2px 0 rgba(0, 111, 130, 0.5);
  }
  96%, 100% {
    transform: translate(0, 0);
    clip-path: none;
    text-shadow:
      1px 0 rgba(255, 59, 59, 0.22),
      -1px 0 rgba(0, 111, 130, 0.22);
  }}@media (prefers-reduced-motion: reduce){
  .gn-whatsnew-card .gn-whatsnew-kicker,
  .gn-whatsnew-card h2#gnWhatsNewHeading {
    animation: none !important;
  }}

/* ─────────────────────────────────────────────────────────────────────
   B17 — Boot sequence: live terminal (2026-08-09)
   Typewriter reveal with a blinking block cursor on the active line,
   right-aligned status tags (▶ ACTIVE -> [ OK ]), kicker status cycling
   (INITIALIZING -> CALIBRATING -> SYNCING -> ONLINE), and a single
   cyan->Mars Red pulse on the emblem at completion.
   Reduced-motion: typing instant, no cursor, no pulse.
   ───────────────────────────────────────────────────────────────────── */
.boot-line { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; }
.boot-line-text { flex: 1 1 auto; min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.boot-line-tag {
  flex: 0 0 auto; font-size: .58rem !important; letter-spacing: .08em;
  white-space: nowrap; opacity: .9;
  color: var(--yellow, #ffd166);
}
.boot-line:not(.boot-typing) .boot-line-tag { color: var(--green, #77f2b5); }
.boot-cursor {
  display: inline-block; width: 7px; height: .95em; vertical-align: text-bottom;
  margin-left: 2px; background: var(--cyan, #00d4ff);
  box-shadow: 0 0 8px var(--cyan, #00d4ff);
  animation: bootCursorBlink 1s steps(1) infinite;
}@keyframes bootCursorBlink{ 0%,49% { opacity: 1; } 50%,100% { opacity: 0; }}
.boot-complete-pulse { animation: bootCompletePulse .5s ease; } /* v0.15.45: was .7s */
.boot-complete-pulse path { animation: bootCompleteFill .5s ease; } /* v0.15.45: was .7s */@keyframes bootCompletePulse{
  0% { filter: drop-shadow(0 0 4px rgba(0,212,255,.4)); }
  25% { filter: drop-shadow(0 0 26px #FF3B3B) drop-shadow(0 0 12px #FF3B3B); }
  100% { filter: drop-shadow(0 0 6px rgba(0,212,255,.4)); }}@keyframes bootCompleteFill{
  0%, 100% { fill: #00E6F0; }
  25% { fill: #FF3B3B; }
  60% { fill: #00E6F0; }}
/* v0.15.45: boot entrance choreography — deck rises in, each terminal line
   snaps in from the left as it spawns. Subtle, keeps the terminal feel. */
#boot.active .boot-command-deck { animation: bootDeckIn .45s cubic-bezier(.2,.75,.25,1) both; }
@keyframes bootDeckIn {
  from { opacity: 0; transform: translateY(14px); }
  to { opacity: 1; transform: none; }}
.boot-line { animation: bootLineIn .22s ease both; }
@keyframes bootLineIn {
  from { opacity: 0; transform: translateX(-10px); }
  to { opacity: 1; transform: none; }}
@media (prefers-reduced-motion: reduce){
  #boot.active .boot-command-deck { animation: none; }
  .boot-line { animation: none; }}@media (prefers-reduced-motion: reduce){
  .boot-cursor { display: none; }
  .boot-complete-pulse { animation: none; }
  .boot-complete-pulse path { animation: none; }}

/* DAY OPS evidence colors: keep every phase/evidence state distinct while
   translating neon-on-dark colors to AA-safe ink on warm paper. */
html[data-theme="light"] body #phasesOv .gn-phase-index { color: #b51f32 !important; }
html[data-theme="light"] body #phasesOv .gn-phase-row p { color: #4d5b61 !important; }
html[data-theme="light"] body #phasesOv .gn-phase-row:nth-child(1) b { color: #00677f !important; }
html[data-theme="light"] body #phasesOv .gn-phase-row:nth-child(2) b { color: #006b48 !important; }
html[data-theme="light"] body #phasesOv .gn-phase-row:nth-child(3) b { color: #765900 !important; }
html[data-theme="light"] body #phasesOv .gn-phase-row:nth-child(4) b { color: #945100 !important; }
html[data-theme="light"] body #phasesOv .gn-phase-row:nth-child(5) b { color: #b51f32 !important; }
html[data-theme="light"] body #phasesOv .gn-phase-row:nth-child(6) b { color: #4d5b61 !important; }

html[data-theme="light"] body :is(.gn-peptide-expand,.gn-peptide-overlay-kicker,.gn-peptide-block-label,.gn-peptide-lanes-head) { color: #00677f !important; }
html[data-theme="light"] body :is(.gn-peptide-summary,.gn-peptide-overlay-copy,.gn-peptide-dossier-line b) { color: #4d5b61 !important; }
html[data-theme="light"] body .gn-peptide-dossier-head { color: #006b48 !important; }
html[data-theme="light"] body .gn-peptide-dossier-sub { color: #765900 !important; }
html[data-theme="light"] body .gn-evidence-chip[data-state="pk"] { color: #006b48 !important; }
html[data-theme="light"] body .gn-evidence-chip[data-state="pd"] { color: #765900 !important; }
html[data-theme="light"] body .gn-evidence-chip[data-state="iv"] { color: #00623f !important; }
html[data-theme="light"] body .gn-evidence-chip[data-state="generic"] { color: #00677f !important; }
html[data-theme="light"] body .gn-peptide-dossier-src { color: #00623f !important; }
html[data-theme="light"] body .gn-peptide-animal-head { color: #945100 !important; }
html[data-theme="light"] body .gn-peptide-lane-summary { color: #4d5b61 !important; }
html[data-theme="light"] body .gn-peptide-next span { color: #00677f !important; }
html[data-theme="light"] body .gn-peptide-next.dim span { color: #4d5b61 !important; }

/* ═══ 2026 surface polish — identity-preserving ═══════════════════════════
   Depth, glass, hierarchy, and motion only. No redesign, no new palette,
   no Mars-red drift. Cyan leads; lava stays founder-locked on CTAs. */
:root {
  --gn-ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --gn-ease-press: cubic-bezier(0.2, 0.7, 0.3, 1);
  --gn-glass-night: rgba(8, 10, 16, 0.78);
  --gn-glass-day: rgba(248, 245, 237, 0.82);
  /* Track A: legacy --gn-elev-* now alias the canonical --elev-* scale in
     08-design-tokens.css (theme-scoped there), so every existing usage in
     this file renders the unified tiers in both themes. */
  --gn-elev-1: var(--elev-1);
  --gn-elev-2: var(--elev-2);
  --gn-elev-day-1: var(--elev-1);
  --gn-elev-day-2: var(--elev-2);
}

html[data-theme="light"] {
  --lava-hot: #d32349;
  --lava-core: #c51b3f;
  --lava-edge: #a91131;
}

#landing .landing-preview-caption {
  font-size: .94rem !important;
  line-height: 1.46;
}

.gn-tip-kicker {
  font-size: .75rem !important;
  letter-spacing: 1.4px;
}

/* Shell chrome: modern glass without washing the HUD. */
#app .topbar {
  position: relative;
  -webkit-backdrop-filter: blur(18px) saturate(1.15);
  backdrop-filter: blur(18px) saturate(1.15);
  -webkit-backdrop-filter: blur(18px) saturate(1.15);
  border-bottom-color: rgba(0, 212, 255, 0.12) !important;
}
#app .topbar::after {
  content: "";
  position: absolute;
  left: 12px;
  right: 12px;
  bottom: -1px;
  height: 1px;
  pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(0, 212, 255, .5), transparent);
  opacity: .72;
}
html[data-theme="light"] #app .topbar {
  background: var(--gn-glass-day) !important;
  border-bottom-color: rgba(0, 111, 130, 0.16) !important;
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.55);
}
html:not([data-theme="light"]) #app .topbar {
  background: linear-gradient(180deg, rgba(8, 10, 18, 0.92), rgba(5, 6, 12, 0.78)) !important;
  box-shadow: 0 12px 32px rgba(0, 0, 0, .24);
}

html:not([data-theme="light"]) #app .node-header-wrap {
  background: linear-gradient(180deg, rgba(5, 8, 13, .97), rgba(4, 6, 10, .93));
  border-bottom-color: rgba(0, 212, 255, .1);
}
#app .node-pill {
  min-height: 38px;
  font-size: max(11px, .68rem);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .035), inset 0 0 22px rgba(0, 212, 255, .035);
}
#app .node-pill-state { font-size: max(10px, .6rem); }

.bottom-nav {
  padding: 4px 6px calc(4px + env(safe-area-inset-bottom, 0px)) !important;
  -webkit-backdrop-filter: blur(22px) saturate(1.2);
  backdrop-filter: blur(22px) saturate(1.2);
  -webkit-backdrop-filter: blur(22px) saturate(1.2);
  border-top-color: rgba(0, 212, 255, 0.14) !important;
  box-shadow: 0 -10px 32px rgba(0, 0, 0, 0.28);
}
html:not([data-theme="light"]) .bottom-nav {
  background: linear-gradient(180deg, rgba(8, 10, 16, 0.72), rgba(5, 5, 10, 0.94)) !important;
}
html[data-theme="light"] .bottom-nav {
  background: var(--gn-glass-day) !important;
  border-top-color: rgba(0, 111, 130, 0.16) !important;
  box-shadow: 0 -8px 24px rgba(76, 61, 43, 0.08);
}

/* Nav items: clearer active state, quieter idle. */
.nav-item {
  border-radius: 12px;
  min-height: 58px;
  padding: 7px 4px 6px;
  transition: color 0.18s var(--gn-ease-press), background 0.18s var(--gn-ease-press), transform 0.1s var(--gn-ease-press);
}
.nav-item.active {
  background: radial-gradient(ellipse at 50% 0%, rgba(0, 212, 255, .18), rgba(0, 212, 255, .055) 68%);
  box-shadow: inset 0 0 0 1px rgba(0, 212, 255, 0.2), inset 0 10px 24px rgba(0, 212, 255, .035);
}
.nav-item.active::before { left: 30%; right: 30%; border-radius: 0 0 999px 999px; }
.nav-item.active .nav-ico { transform: translateY(-1px); }
.nav-lbl { font-size: max(11px, .68rem) !important; letter-spacing: 1px !important; }
html[data-theme="light"] .nav-item.active {
  background: rgba(0, 111, 130, 0.08);
  box-shadow: inset 0 0 0 1px rgba(0, 111, 130, 0.18);
}
.nav-item:focus-visible {
  outline: 2px solid var(--focus-ring, #00d4ff);
  outline-offset: 2px;
}

/* Cards: instrument depth + hover lift without layout shift. */
.stat-card, .s6-card, .gn-wanda-card, .card {
  border-radius: var(--radius-card) !important;
  transition: transform 0.22s var(--gn-ease-out), box-shadow 0.22s var(--gn-ease-out), border-color 0.22s ease;
}
html:not([data-theme="light"]) .stat-card,
html:not([data-theme="light"]) .s6-card,
html:not([data-theme="light"]) .gn-wanda-card,
html:not([data-theme="light"]) .card {
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), var(--gn-elev-1) !important;
  border-color: rgba(0, 212, 255, 0.1) !important;
}
html[data-theme="light"] .stat-card,
html[data-theme="light"] .s6-card,
html[data-theme="light"] .gn-wanda-card,
html[data-theme="light"] .card {
  box-shadow: var(--gn-elev-day-1) !important;
  border-color: rgba(0, 111, 130, 0.12) !important;
}@media (hover: hover) and (pointer: fine){
  .card:hover, .gn-wanda-card:hover, .s6-card:hover, .stat-card:hover {
    transform: translateY(-1px);
  }
  html:not([data-theme="light"]) .card:hover,
  html:not([data-theme="light"]) .gn-wanda-card:hover,
  html:not([data-theme="light"]) .s6-card:hover,
  html:not([data-theme="light"]) .stat-card:hover {
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.07), var(--gn-elev-2) !important;
    border-color: rgba(0, 212, 255, 0.22) !important;
  }
  html[data-theme="light"] .card:hover,
  html[data-theme="light"] .gn-wanda-card:hover,
  html[data-theme="light"] .s6-card:hover,
  html[data-theme="light"] .stat-card:hover {
    box-shadow: var(--gn-elev-day-2) !important;
    border-color: rgba(0, 111, 130, 0.22) !important;
  }}

/* v0.15.44 SHOT CONSOLE — FAB is a targeting reticle owned by
   html/partials/01-head.html. This layer keeps only the premium press feel. */
.fab {
  border: 2px solid rgba(255,77,77,.95) !important;
  /* Glow: single source is var(--elev-fab), bound by the .fab rule in the
     elevation section below (box-shadow: var(--elev-fab) !important). */
  transition: transform var(--dur-2) var(--ease-out) !important;
}
.fab:hover, .fab:focus-visible {
  transform: scale(1.06) !important;
  box-shadow:
    0 0 26px rgba(255,60,60,.75),
    0 0 60px rgba(255,60,60,.30),
    inset 0 0 18px rgba(255,60,60,.36) !important;
}
.fab:active { transform: scale(0.90) !important; }
.fab:focus-visible {
  outline: 2px solid rgba(255, 120, 140, 0.95) !important;
  outline-offset: 3px !important;
}

/* Primary CTAs: same lava system, slightly tighter 2026 finish. */
.btn-primary, .btn-full.btn-primary, .gn-auth-primary,
.landing-btn.primary, .future-confirm-save, .gn-whatsnew-close {
  border-radius: 12px !important;
  letter-spacing: 1.6px !important;
  transition: transform var(--dur-1) var(--ease-press), box-shadow var(--dur-2) var(--ease-out), filter var(--dur-2) var(--ease-out) !important;
}
.btn-primary:hover, .btn-full.btn-primary:hover, .gn-auth-primary:hover,
.landing-btn.primary:hover, .future-confirm-save:hover, .gn-whatsnew-close:hover {
  filter: brightness(1.04);
}

/* Sheets / dialogs: glass + depth. */
.overlay .modal,
.gn-whatsnew-card,
.gn-delete-panel,
.archive-confirm-panel,
.gn-peptide-overlay-card,
.gn-lab-tool-panel,
.gn-import-panel {
  -webkit-backdrop-filter: blur(16px) saturate(1.1);
  backdrop-filter: blur(16px) saturate(1.1);
  -webkit-backdrop-filter: blur(16px) saturate(1.1);
  border-radius: 16px !important;
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.45), 0 0 0 1px rgba(0, 212, 255, 0.12) !important;
}
html[data-theme="light"] .overlay .modal,
html[data-theme="light"] .gn-whatsnew-card,
html[data-theme="light"] .gn-delete-panel,
html[data-theme="light"] .archive-confirm-panel,
html[data-theme="light"] .gn-peptide-overlay-card,
html[data-theme="light"] .gn-lab-tool-panel,
html[data-theme="light"] .gn-import-panel {
  box-shadow: 0 22px 54px rgba(76, 61, 43, 0.18), 0 0 0 1px rgba(0, 111, 130, 0.14) !important;
}

/* Inputs: clearer focus, denser controls. */
.form-input, input[type="text"], input[type="number"], input[type="email"],
input[type="password"], input[type="search"], input[type="time"], textarea, select {
  border-radius: var(--radius-control) !important;
  transition: border-color var(--dur-2) var(--ease-out), box-shadow var(--dur-2) var(--ease-out), background var(--dur-2) var(--ease-out) !important;
}
.form-input:focus, input:focus, textarea:focus, select:focus {
  border-color: rgba(0, 212, 255, 0.55) !important;
  box-shadow: 0 0 0 3px rgba(0, 212, 255, 0.14) !important;
  outline: none !important;
}
html[data-theme="light"] .form-input:focus,
html[data-theme="light"] input:focus,
html[data-theme="light"] textarea:focus,
html[data-theme="light"] select:focus {
  border-color: rgba(0, 111, 130, 0.55) !important;
  box-shadow: 0 0 0 3px rgba(0, 111, 130, 0.12) !important;
}

/* Hierarchy: slightly stronger page titles, quieter support copy. */
.page-title {
  letter-spacing: 2.4px !important;
  text-wrap: balance;
}
.page-hdr {
  position: relative;
  padding-left: 13px;
}
.page-hdr::before {
  content: "";
  position: absolute;
  left: 0;
  top: 2px;
  bottom: 2px;
  width: 2px;
  border-radius: 999px;
  background: linear-gradient(180deg, var(--cyan, #00d4ff), rgba(0, 212, 255, .16));
  box-shadow: 0 0 12px rgba(0, 212, 255, .34);
}
.page-sub, .card-sub, .results-card-sub, .sec-act {
  letter-spacing: 0.4px;
  line-height: 1.45 !important;
}

/* Empty / loading states: calmer guidance surfaces. */
.gn-empty-state, .gn-loading-state, .empty-state {
  border-radius: 14px;
  border: 1px dashed rgba(0, 212, 255, 0.22);
  background: rgba(0, 212, 255, 0.03);
  padding: 18px 16px;
}
html[data-theme="light"] .gn-empty-state,
html[data-theme="light"] .gn-loading-state,
html[data-theme="light"] .empty-state {
  border-color: rgba(0, 111, 130, 0.22);
  background: rgba(0, 111, 130, 0.04);
}

/* First-run dashboard: one composed activation instrument, not loose parts. */
#pageDash .gn-empty-hero {
  position: relative;
  overflow: hidden;
  gap: 14px;
  margin: 8px 0 18px;
  padding: 20px 18px 18px;
  border: 1px solid rgba(0, 212, 255, .2);
  border-top-color: rgba(0, 212, 255, .56);
  border-radius: 16px;
  background:
    radial-gradient(circle at 82% 10%, rgba(0, 212, 255, .12), transparent 31%),
    linear-gradient(145deg, rgba(13, 20, 28, .96), rgba(5, 8, 13, .98));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .045), 0 18px 46px rgba(0, 0, 0, .32), 0 0 34px rgba(0, 212, 255, .045);
}
#pageDash .gn-empty-hero::before {
  content: "";
  position: absolute;
  top: 0;
  left: 16px;
  right: 16px;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(0, 212, 255, .82), transparent);
}
#pageDash .gn-empty-hero h2 { font-size: 1.12rem; letter-spacing: 1.7px; }
#pageDash .gn-empty-hero p { max-width: 34ch; color: #b6cbd3; }
#pageDash .gn-empty-hero .gn-empty-cta { min-height: 52px; }
#pageDash .gn-empty-ghost { min-height: 52px; background: rgba(0, 212, 255, .055); }
#pageDash .gn-tip-card {
  margin-top: 2px;
  padding: 13px 14px;
  background: linear-gradient(135deg, rgba(0, 212, 255, .09), rgba(4, 8, 13, .72));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .035);
}
html[data-theme="light"] #pageDash .gn-empty-hero {
  border-color: rgba(0, 111, 130, .24);
  border-top-color: rgba(0, 111, 130, .58);
  background: radial-gradient(circle at 82% 10%, rgba(0, 111, 130, .09), transparent 31%), linear-gradient(145deg, #fbf9f2, #eee9df);
  box-shadow: var(--gn-elev-day-1);
}
html[data-theme="light"] #pageDash .gn-empty-hero p { color: var(--text-secondary); }
html[data-theme="light"] #pageDash .gn-tip-card { background: rgba(0, 111, 130, .06); }@media (max-width: 430px){
  #app .topbar { min-height: 58px; max-height: none; padding-bottom: 5px !important; }
  #app .node-header-wrap { padding-top: 6px; padding-bottom: 7px; }
  #pageDash .gn-empty-hero { padding: 18px 15px 15px; }
  #pageDash .gn-empty-ghosts { gap: 7px; }
  #pageDash .gn-empty-ghost { padding-inline: 6px; font-size: max(10px, .6rem); letter-spacing: .8px; }}

/* Functional target floor: preserve compact visuals inside reliable hit areas. */
#landing .landing-footer a { display: inline-flex; align-items: center; min-height: 44px; }
.gn-custom-picker-trigger,
.gn-custom-date-trigger,
#gnShotFilterQuery,
.gn-weekly-actions button,
#pageProfile input:not([type="checkbox"]) { min-height: 44px !important; }
.gn-hub-close { min-width: 44px !important; min-height: 44px !important; height: 44px !important; }

/* Chips / pills: denser modern tags. */
.dose-pill, .time-tab, .gn-evidence-chip, .node-pill {
  border-radius: 999px !important;
  transition: background 0.16s ease, border-color 0.16s ease, color 0.16s ease, transform 0.1s ease;
}
.dose-pill:focus-visible, .time-tab:focus-visible {
  outline: 2px solid var(--focus-ring, #00d4ff);
  outline-offset: 2px;
}

/* Landing CTA row: one clear primary, quieter secondary. */
.landing-btn.secondary {
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border-radius: 12px !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06);
}
html[data-theme="light"] .landing-btn.secondary {
  background: rgba(255, 255, 255, 0.55) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7);
}

/* Scroll body: smoother momentum feel on mobile shells. */
#scrollBody, .scroll-body {
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
}/* Reduced motion: kill polish motion, keep structure. */
@media (prefers-reduced-motion: reduce){
  .card, .gn-wanda-card, .s6-card, .stat-card,
  .nav-item, .fab, .btn-primary, .landing-btn,
  .form-input, input, textarea, select {
    transition: none !important;
  }
  .card:hover, .gn-wanda-card:hover, .s6-card:hover, .stat-card:hover,
  .fab:hover, .fab:focus-visible {
    transform: none !important;
  }
  #scrollBody, .scroll-body { scroll-behavior: auto; }}/* Desktop density: more air, same instrument identity. */
@media (min-width: 1024px){
  #app .topbar { padding-left: 18px !important; padding-right: 18px !important; }
  .card, .gn-wanda-card, .s6-card, .stat-card { border-radius: 16px !important; }
  .page-title { font-size: 1.28rem !important; }}/* Very small phones: protect hierarchy without shrinking targets. */
@media (max-width: 360px){
  .page-title { letter-spacing: 1.6px !important; }
  .fab { right: 20px !important; }}

/* ═══ PREMIUM SCANNER 20260811 ═══════════════════════════════════════════
   Diagnostic mannequin framing + anatomically clear zone language.
   Identity preserved: cyan lead, instrument HUD, no AI-purple blobs. */
.shots-scanner-card {
  border: 1px solid rgba(0, 212, 255, .16);
  border-radius: 18px;
  background:
    radial-gradient(120% 80% at 50% 0%, rgba(0, 212, 255, .08), transparent 42%),
    linear-gradient(180deg, rgba(8, 12, 20, .96), rgba(4, 6, 12, .98));
  box-shadow: 0 18px 40px rgba(0, 0, 0, .28), inset 0 1px 0 rgba(255, 255, 255, .04);
  padding: 14px 14px 16px;
}
html[data-theme="light"] .shots-scanner-card {
  background:
    radial-gradient(120% 80% at 50% 0%, rgba(0, 111, 130, .08), transparent 45%),
    linear-gradient(180deg, #f7f4ec, #efebe1);
  border-color: rgba(0, 111, 130, .18);
  box-shadow: 0 14px 32px rgba(76, 61, 43, .1), inset 0 1px 0 #fff;
}
.shots-scanner-head h2 {
  letter-spacing: 1.4px !important;
  font-size: .78rem !important;
}
.shots-scanner-head p {
  font-size: .72rem !important;
  line-height: 1.4 !important;
  opacity: .92;
}
.scanner-mode-tabs { gap: 8px !important; margin: 12px 0 14px !important; }
.scanner-mode-btn {
  min-height: 48px !important;
  border-radius: 12px !important;
  font-weight: 800 !important;
  letter-spacing: 1.8px !important;
  transition: transform var(--dur-1) var(--ease-press), border-color var(--dur-2) var(--ease-out), background var(--dur-2) var(--ease-out), box-shadow var(--dur-2) var(--ease-out) !important;
}
.scanner-mode-btn:active { transform: scale(.97); }
.scanner-mode-btn.active {
  color: #e9fbff !important;
  border-color: rgba(0, 230, 240, .7) !important;
  background: linear-gradient(180deg, rgba(0, 212, 255, .2), rgba(0, 120, 150, .12)) !important;
  box-shadow: 0 0 0 1px rgba(0, 212, 255, .18), 0 8px 22px rgba(0, 212, 255, .12) !important;
}
html[data-theme="light"] .scanner-mode-btn.active {
  color: #00384a !important;
  border-color: rgba(0, 111, 130, .55) !important;
  background: linear-gradient(180deg, rgba(0, 111, 130, .14), rgba(0, 111, 130, .06)) !important;
}
.site-scanner {
  border-radius: 18px !important;
  padding: 12px !important;
  background:
    radial-gradient(circle at 50% 8%, rgba(0, 212, 255, .1), transparent 36%),
    linear-gradient(180deg, rgba(5, 10, 18, .96), rgba(2, 5, 10, .99)) !important;
}
html[data-theme="light"] .site-scanner {
  background:
    radial-gradient(circle at 50% 8%, rgba(0, 111, 130, .08), transparent 40%),
    linear-gradient(180deg, #f8f5ed, #eee9df) !important;
  border-color: rgba(0, 111, 130, .2) !important;
}
.asset-matrix-title b { font-size: .76rem !important; letter-spacing: 1px !important; }
.asset-helper {
  font-size: .84rem !important;
  line-height: 1.45 !important;
  color: #c5d4df !important;
}
html[data-theme="light"] .asset-helper { color: #33484f !important; background: rgba(0, 111, 130, .05) !important; }

/* Stage: focused diagnostic chamber */
.asset-scan-stage {
  position: relative !important;
  overflow: hidden !important;
  border-radius: 16px !important;
  width: min(100%, 340px) !important;
  aspect-ratio: 2 / 3 !important;
  background:
    radial-gradient(ellipse at 50% 42%, rgba(0, 40, 55, .55), rgba(2, 6, 12, .98) 70%) !important;
  border: 1px solid rgba(0, 212, 255, .22) !important;
  box-shadow:
    inset 0 0 40px rgba(0, 212, 255, .06),
    0 0 28px rgba(0, 212, 255, .08) !important;
  transition: aspect-ratio var(--dur-3) var(--ease-out) !important;
}
.asset-scan-stage.mode-upper { aspect-ratio: 3 / 4.1 !important; }
.scan-asset {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center 18% !important;
  filter: saturate(.75) contrast(1.08) brightness(.92) !important;
  transform: scale(1.08) !important;
  transform-origin: center 28% !important;
  transition: transform var(--dur-3) var(--ease-out), object-position var(--dur-3) var(--ease-out), filter var(--dur-2) var(--ease-out) !important;
}
/* Mode framing: three purposeful diagnostic crops */
.asset-scan-stage.mode-core .scan-asset {
  object-position: center 22% !important;
  transform: scale(1.42) translateY(2%) !important;
  transform-origin: center 30% !important;
}
.asset-scan-stage.mode-lower .scan-asset {
  object-position: center 62% !important;
  transform: scale(1.48) translateY(-6%) !important;
  transform-origin: center 58% !important;
}
.asset-scan-stage.mode-upper .scan-asset {
  object-position: center 12% !important;
  transform: scale(1.55) translateY(4%) !important;
  transform-origin: center 22% !important;
  filter: saturate(.7) contrast(1.1) brightness(.9) !important;
}
.gn-scanner-frame {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: 3;
  pointer-events: none;
}
.clean-zone-layer {
  z-index: 2 !important;
  background:
    radial-gradient(ellipse at 50% 40%, transparent 28%, rgba(2, 8, 14, .28) 72%, rgba(2, 6, 12, .55) 100%);
  mix-blend-mode: multiply;
  opacity: .55;
}
html[data-theme="light"] .clean-zone-layer {
  background: radial-gradient(ellipse at 50% 40%, transparent 30%, rgba(240, 236, 226, .2) 75%, rgba(230, 224, 210, .45) 100%);
  mix-blend-mode: multiply;
  opacity: .4;
}

/* Zone language: clear anatomical pads, not invisible squares */
.asset-scan-stage .track12-zone,
.asset-scan-stage .zone-overlay {
  opacity: 0 !important;
  pointer-events: none !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  filter: none !important;
  min-width: 44px;
  min-height: 44px;
  transition: opacity var(--dur-2) var(--ease-out), transform var(--dur-1) var(--ease-press), box-shadow var(--dur-2) var(--ease-out), background var(--dur-2) var(--ease-out) !important;
}
.asset-scan-stage.mode-core .track12-zone[data-mode="core"],
.asset-scan-stage.mode-lower .track12-zone[data-mode="lower"],
.asset-scan-stage.mode-upper .track12-zone[data-mode="upper"] {
  opacity: 1 !important;
  pointer-events: auto !important;
  z-index: 6 !important;
  border: 1.5px solid rgba(0, 230, 240, .42) !important;
  background: rgba(0, 212, 255, .07) !important;
  box-shadow:
    0 0 0 1px rgba(0, 0, 0, .25),
    inset 0 0 12px rgba(0, 212, 255, .08),
    0 0 14px rgba(0, 212, 255, .1) !important;
  -webkit-backdrop-filter: blur(0.5px);
  backdrop-filter: blur(0.5px);
}
.asset-scan-stage.mode-core .track12-zone[data-mode="core"]::before,
.asset-scan-stage.mode-lower .track12-zone[data-mode="lower"]::before,
.asset-scan-stage.mode-upper .track12-zone[data-mode="upper"]::before,
.asset-scan-stage.mode-core .track12-zone[data-mode="core"]::after,
.asset-scan-stage.mode-lower .track12-zone[data-mode="lower"]::after,
.asset-scan-stage.mode-upper .track12-zone[data-mode="upper"]::after {
  content: none !important;
  display: none !important;
}
.asset-scan-stage .track12-zone:hover,
.asset-scan-stage .track12-zone:focus-visible {
  border-color: rgba(0, 230, 240, .85) !important;
  background: rgba(0, 212, 255, .16) !important;
  box-shadow: 0 0 18px rgba(0, 212, 255, .28), inset 0 0 16px rgba(0, 212, 255, .12) !important;
  outline: none !important;
  transform: scale(1.03);
}
.asset-scan-stage .track12-zone:active { transform: scale(.97); }
.asset-scan-stage .track12-zone.selected,
.asset-scan-stage .track12-zone.selected-active {
  border-color: rgba(0, 245, 255, .95) !important;
  background: rgba(0, 212, 255, .22) !important;
  box-shadow:
    0 0 0 1px rgba(0, 245, 255, .45),
    0 0 24px rgba(0, 212, 255, .4),
    inset 0 0 20px rgba(0, 212, 255, .18) !important;
  filter: none !important;
}
/* recent / last without relying on color alone: dashed vs solid */
.asset-scan-stage .track12-zone.last:not(.selected) {
  border-style: dashed !important;
  border-color: rgba(255, 209, 102, .7) !important;
  background: rgba(255, 209, 102, .1) !important;
}
.asset-scan-stage .track12-zone.recent:not(.selected) {
  border-style: dotted !important;
  border-color: rgba(182, 104, 146, .75) !important;
  background: rgba(182, 104, 146, .1) !important;
}
.asset-scan-stage .track12-zone.ready:not(.selected) {
  border-color: rgba(0, 255, 136, .55) !important;
  background: rgba(0, 255, 136, .08) !important;
}

/* Anatomical zone geometry — CORE torso 2x2 */
.zone-core-lu { left: 28% !important; top: 34% !important; width: 20% !important; height: 12.5% !important; border-radius: 42% 28% 32% 48% / 48% 36% 42% 40% !important; }
.zone-core-ru { left: 52% !important; top: 34% !important; width: 20% !important; height: 12.5% !important; border-radius: 28% 42% 48% 32% / 36% 48% 40% 42% !important; }
.zone-core-ll { left: 28% !important; top: 47.5% !important; width: 20% !important; height: 12.5% !important; border-radius: 48% 34% 40% 46% / 40% 34% 50% 44% !important; }
.zone-core-rl { left: 52% !important; top: 47.5% !important; width: 20% !important; height: 12.5% !important; border-radius: 34% 48% 46% 40% / 34% 40% 44% 50% !important; }
/* LOWER thighs */
.zone-lower-lu { left: 27% !important; top: 40% !important; width: 19% !important; height: 18% !important; border-radius: 46% 34% 40% 52% / 30% 28% 58% 50% !important; }
.zone-lower-ru { left: 54% !important; top: 40% !important; width: 19% !important; height: 18% !important; border-radius: 34% 46% 52% 40% / 28% 30% 50% 58% !important; }
.zone-lower-ll { left: 27% !important; top: 59% !important; width: 19% !important; height: 18% !important; border-radius: 48% 36% 44% 54% / 34% 30% 55% 48% !important; }
.zone-lower-rl { left: 54% !important; top: 59% !important; width: 19% !important; height: 18% !important; border-radius: 36% 48% 54% 44% / 30% 34% 48% 55% !important; }
/* UPPER rear arms — elongated, rotated */
.zone-upper-lu { left: 14% !important; top: 26% !important; width: 18% !important; height: 16% !important; border-radius: 48% 40% 44% 52% / 42% 38% 48% 46% !important; transform: rotate(-14deg) !important; }
.zone-upper-ll { left: 16% !important; top: 42% !important; width: 17% !important; height: 15% !important; border-radius: 46% 38% 48% 50% / 40% 36% 50% 44% !important; transform: rotate(-10deg) !important; }
.zone-upper-ru { left: 68% !important; top: 26% !important; width: 18% !important; height: 16% !important; border-radius: 40% 48% 52% 44% / 38% 42% 46% 48% !important; transform: rotate(14deg) !important; }
.zone-upper-rl { left: 67% !important; top: 42% !important; width: 17% !important; height: 15% !important; border-radius: 38% 46% 50% 48% / 36% 40% 44% 50% !important; transform: rotate(10deg) !important; }

/* Mode-focused stage also reframes zone hit areas for touch comfort */
.asset-scan-stage.mode-core .zone-core-q { min-height: 48px; }
.asset-scan-stage.mode-lower .zone-lower-lu,
.asset-scan-stage.mode-lower .zone-lower-ll,
.asset-scan-stage.mode-lower .zone-lower-ru,
.asset-scan-stage.mode-lower .zone-lower-rl { min-height: 56px; }
.asset-scan-stage.mode-upper .zone-upper-lu,
.asset-scan-stage.mode-upper .zone-upper-ll,
.asset-scan-stage.mode-upper .zone-upper-ru,
.asset-scan-stage.mode-upper .zone-upper-rl { min-height: 52px; }

/* Hide decorative subdivision HUDs that add AI-grid noise */
.track12-subdivision-hud,
.core4-subdivision-hud { display: none !important; }

/* Zone list under scanner: denser, clearer primary control surface */
.gn-stable-zone-picker { display: grid !important; gap: 8px !important; margin-top: 12px !important; }
.gn-stable-zone-title {
  font: 800 .58rem/1.2 var(--font-m, monospace) !important;
  letter-spacing: 1.8px !important;
  color: #00d4ff !important;
}
html[data-theme="light"] .gn-stable-zone-title { color: #00677f !important; }
.gn-stable-zone-btn {
  min-height: 48px !important;
  border-radius: 12px !important;
  border: 1px solid rgba(0, 212, 255, .28) !important;
  background: rgba(0, 212, 255, .05) !important;
  color: #d7eef5 !important;
  font: 700 .72rem/1.25 var(--font-m, monospace) !important;
  letter-spacing: .4px !important;
  padding: 10px 12px !important;
  text-align: left !important;
  transition: transform var(--dur-1) var(--ease-press), border-color var(--dur-2) var(--ease-out), background var(--dur-2) var(--ease-out) !important;
}
.gn-stable-zone-btn:hover, .gn-stable-zone-btn:focus-visible {
  border-color: rgba(0, 230, 240, .7) !important;
  background: rgba(0, 212, 255, .12) !important;
  outline: none !important;
}
.gn-stable-zone-btn:active { transform: scale(.98); }
.gn-stable-zone-btn.selected {
  border-color: rgba(0, 245, 255, .85) !important;
  background: linear-gradient(135deg, rgba(0, 212, 255, .2), rgba(0, 120, 150, .12)) !important;
  color: #fff !important;
  box-shadow: 0 0 16px rgba(0, 212, 255, .18) !important;
}
html[data-theme="light"] .gn-stable-zone-btn {
  color: #1c2b31 !important;
  border-color: rgba(0, 111, 130, .28) !important;
  background: rgba(255, 255, 255, .65) !important;
}
html[data-theme="light"] .gn-stable-zone-btn.selected {
  color: #00384a !important;
  border-color: rgba(0, 111, 130, .55) !important;
  background: rgba(0, 111, 130, .12) !important;
}
.scanner-selected-panel b,
.scanner-selected-panel .history-value {
  font-size: .88rem !important;
  letter-spacing: .3px !important;
}
.scanner-selected-panel.gn-zone-confirmed {
  border-color: rgba(0, 255, 136, .45) !important;
  box-shadow: 0 0 18px rgba(0, 255, 136, .12) !important;
}

/* DAY OPS zone pads */
html[data-theme="light"] .asset-scan-stage.mode-core .track12-zone[data-mode="core"],
html[data-theme="light"] .asset-scan-stage.mode-lower .track12-zone[data-mode="lower"],
html[data-theme="light"] .asset-scan-stage.mode-upper .track12-zone[data-mode="upper"] {
  border-color: rgba(0, 111, 130, .5) !important;
  background: rgba(0, 111, 130, .1) !important;
  box-shadow: inset 0 0 10px rgba(0, 111, 130, .08) !important;
}
html[data-theme="light"] .asset-scan-stage .track12-zone.selected,
html[data-theme="light"] .asset-scan-stage .track12-zone.selected-active {
  border-color: #006f82 !important;
  background: rgba(0, 111, 130, .2) !important;
}

/* ── Language Kanji instrument ─────────────────────────────────────── */
.gn-lang-wrap { padding: 4px !important; }
.gn-lang-kanji {
  width: 20px !important;
  height: 20px !important;
  stroke-width: 1.75 !important;
  filter: drop-shadow(0 0 4px currentColor) drop-shadow(0 0 1px currentColor) !important;
  transition: color var(--dur-2) var(--ease-out), filter var(--dur-2) var(--ease-out), transform var(--dur-1) var(--ease-press) !important;
}
.gn-lang-globe,
#app .gn-lang-globe,
.landing-lang-wrap .gn-lang-globe {
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  min-height: 44px !important;
  border-radius: 50% !important;
  border: 1px solid transparent !important;
  background: transparent !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: border-color var(--dur-2) var(--ease-out), background var(--dur-2) var(--ease-out), box-shadow var(--dur-2) var(--ease-out), transform var(--dur-1) var(--ease-press) !important;
}
.gn-lang-wrap[data-lang="en"] .gn-lang-globe { color: #00d4ff !important; }
.gn-lang-wrap[data-lang="es"] .gn-lang-globe { color: #FF3B3B !important; }
.gn-lang-globe:hover, .gn-lang-globe:focus-visible {
  border-color: color-mix(in srgb, currentColor 45%, transparent) !important;
  background: color-mix(in srgb, currentColor 10%, transparent) !important;
  box-shadow: 0 0 14px color-mix(in srgb, currentColor 28%, transparent) !important;
  outline: none !important;
}
.gn-lang-globe:active { transform: scale(.94); }
.gn-lang-globe:active .gn-lang-kanji { transform: scale(1.06); }
html[data-theme="light"] .gn-lang-wrap[data-lang="en"] .gn-lang-globe { color: #006f82 !important; }
html[data-theme="light"] .gn-lang-wrap[data-lang="es"] .gn-lang-globe { color: #b51f32 !important; }

/* ── CRT / scanline restraint ──────────────────────────────────────── */
.gn-crt-scanline::before {
  height: 1px !important;
  background: rgba(0, 212, 255, .14) !important;
  box-shadow:
    0 0 4px rgba(0, 212, 255, .16),
    0 4px 6px rgba(0, 212, 255, .06),
    0 -4px 6px rgba(0, 212, 255, .05) !important;
  animation: gnCrtRoll 16s cubic-bezier(.55, .12, .6, .9) infinite !important;
}
html[data-theme="light"] .gn-crt-scanline::before {
  background: rgba(0, 111, 130, .07) !important;
  box-shadow: 0 0 3px rgba(0, 111, 130, .08), 0 3px 5px rgba(0, 111, 130, .04) !important;
  opacity: .55;
}
html[data-theme="light"] .scanlines { opacity: .28 !important; }
html[data-theme="light"] .scan-sweep { opacity: .12 !important; }
.scan-sweep { opacity: .4 !important; }@media (prefers-reduced-motion: reduce){
  .gn-crt-scanline, .scan-sweep { display: none !important; }
  .scan-asset, .scanner-mode-btn, .track12-zone, .gn-stable-zone-btn { transition: none !important; }}

/* Shared shell density polish */
.bottom-nav .nav-item { border-radius: 12px; }
.page-title { letter-spacing: 2px !important; }
.toast {
  border-radius: 12px !important;
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

/* v0.15.20 — locked GRID//NODE v2.0 brand asset (runtime reference for brand rollout) */
[data-gn-brand-asset='watermark']::before{content:'';display:none;background-image:url('/assets/brand/ui/watermark.svg');background-repeat:no-repeat;background-size:0 0;}

/* v0.15.24 — LAB research validation feedback (aria-describedby + aria-invalid) */
.gn-form-error { display: block; margin: -2px 0 8px; color: #ff8095; font: 600 .62rem/1.4 var(--font-m, monospace); letter-spacing: 1px; }
html[data-theme="light"] .gn-form-error { color: #8a0f2a !important; }
.gn-sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
input[aria-invalid="true"], textarea[aria-invalid="true"], select[aria-invalid="true"] { box-shadow: 0 0 0 1px #ff5a6e inset !important; }
html[data-theme="light"] input[aria-invalid="true"], html[data-theme="light"] textarea[aria-invalid="true"], html[data-theme="light"] select[aria-invalid="true"] { box-shadow: 0 0 0 1px #d32349 inset !important; }/* ──────────────────────────────────────────────────────────────────────────
   v0.15.30 — premium polish + tactile feedback (ADDITIVE)
   Every rule below is additive: no removals, no destructive overrides.
   Reduced-motion users get the static end state immediately.
   ────────────────────────────────────────────────────────────────────────── */

/* Lift the most-touched interactive controls slightly on hover. Stacks with
   existing :active scale feedback and respects reduced-motion (no transition). */
@media (prefers-reduced-motion: no-preference){
  .btn-primary, .btn-full.btn-primary, .gn-auth-primary, .gn-whatsnew-close,
  .future-confirm-save, .landing-btn.primary, .gn-foundation-tile,
  .nav-item, .cp-option, .modal-btn, .topbar-btn,
  .scanner-mode-btn, .gn-stable-zone-btn {
    transition: transform 180ms cubic-bezier(.2,.75,.25,1),
                box-shadow 180ms ease,
                background-position 320ms ease,
                filter 180ms ease;
  }}
.btn-primary:hover, .btn-full.btn-primary:hover, .gn-auth-primary:hover,
.gn-whatsnew-close:hover, .future-confirm-save:hover {
  transform: translateY(-1px);
  filter: saturate(1.05) brightness(1.04);
}
.landing-btn.primary:hover {
  transform: translateY(-1px);
  filter: saturate(1.04) brightness(1.06);
}
.gn-foundation-tile:hover, .nav-item:hover, .cp-option:hover,
.scanner-mode-btn:hover, .gn-stable-zone-btn:hover {
  transform: translateY(-1px);
  filter: brightness(1.08);
}

/* Unified, visible focus ring for every interactive control — 2px cyan core +
   3px cyan glow. Suppressed when the user is using a pointer, via
   :focus-visible only. */
.topbar-btn:focus-visible, .modal-btn:focus-visible,
.btn-primary:focus-visible, .btn-full.btn-primary:focus-visible,
.gn-auth-primary:focus-visible, .gn-whatsnew-close:focus-visible,
.future-confirm-save:focus-visible, .landing-btn:focus-visible,
.landing-btn.primary:focus-visible,
.nav-item:focus-visible,
.gn-foundation-tile:focus-visible, .cp-option:focus-visible,
.scanner-mode-btn:focus-visible,
.gn-stable-zone-btn:focus-visible, .gn-theme-opt:focus-visible {
  outline: 2px solid var(--cyan-core, #00d4ff) !important;
  outline-offset: 2px !important;
  box-shadow: 0 0 0 3px rgba(0, 212, 255, .14) !important;
}
html[data-theme="light"] .topbar-btn:focus-visible, html[data-theme="light"] .modal-btn:focus-visible,
html[data-theme="light"] .btn-primary:focus-visible, html[data-theme="light"] .btn-full.btn-primary:focus-visible,
html[data-theme="light"] .gn-auth-primary:focus-visible, html[data-theme="light"] .gn-whatsnew-close:focus-visible,
html[data-theme="light"] .future-confirm-save:focus-visible, html[data-theme="light"] .landing-btn:focus-visible,
html[data-theme="light"] .landing-btn.primary:focus-visible,
html[data-theme="light"] .nav-item:focus-visible,
html[data-theme="light"] .gn-foundation-tile:focus-visible, html[data-theme="light"] .cp-option:focus-visible,
html[data-theme="light"] .scanner-mode-btn:focus-visible,
html[data-theme="light"] .gn-stable-zone-btn:focus-visible, html[data-theme="light"] .gn-theme-opt:focus-visible {
  outline-color: #006f82 !important;
  box-shadow: 0 0 0 3px rgba(0, 111, 130, .14) !important;
}

/* Active bottom-nav item reads as a deliberate instrument read-out — stronger
   top-edge accent and slightly tighter glow.  */
.bottom-nav .nav-item.active {
  box-shadow: inset 0 2px 0 0 var(--cyan-core, #00d4ff), 0 0 12px rgba(0, 212, 255, .32) !important;
}
html[data-theme="light"] .bottom-nav .nav-item.active {
  box-shadow: inset 0 2px 0 0 #006f82, 0 0 10px rgba(0, 111, 130, .22) !important;
}

/* Instrument gauge: hairline cyan top-edge wash on data cards. Reads as a
   power-on glint, not extra chrome. */
.stat-card, .card, .s6-card, .gn-wanda-card {
  border-top-color: rgba(0, 212, 255, .35) !important;
}
html[data-theme="light"] .stat-card, html[data-theme="light"] .card,
html[data-theme="light"] .s6-card, html[data-theme="light"] .gn-wanda-card {
  border-top-color: rgba(0, 111, 130, .45) !important;
}/* Heading rhythm: technical headings get a tightened letter-spacing + a one-shot
   breath on first paint, so the page feels like it woke up.
   Reduced-motion users see the static end state immediately. */
@media (prefers-reduced-motion: no-preference){@keyframes gn-heading-breath{
    0%   { letter-spacing: 0.04em; opacity: 0.86; }
    60%  { letter-spacing: 0.08em; opacity: 1; }
    100% { letter-spacing: 0.04em; opacity: 1; }}
  .page-hdr h1, h1.landing-headline, .gn-tool-title, .gn-hub-title,
  .gn-foundation-head h2, .gn-lab-tool-head h2 {
    animation: gn-heading-breath 520ms cubic-bezier(.2,.75,.25,1) both;
  }}

/* Subtle ambient edge glow under the topbar (a faint instrument glow). */
#app .topbar::after {
  content: "";
  position: absolute;
  left: 8px; right: 8px; bottom: -6px;
  height: 1px;
  background: linear-gradient(90deg, transparent 0%, rgba(0, 212, 255, .32) 50%, transparent 100%);
  pointer-events: none;
  z-index: 0;
}
#app .topbar { position: relative; }

/* Node toast: a slightly faster, more decisive arrival so the confirmation feels
   tactile rather than decorative. Existing toast content is unchanged. */
.toast {
  transition: transform 220ms cubic-bezier(.34, 1.56, .64, 1), opacity 180ms ease;
}@media (prefers-reduced-motion: reduce){
  .toast { transition: none !important; }}/* Save buttons that successfully capture: 1-frame lava-glow halo. Already
   added by actionFeedback's existing class swap, but a tighter pulse feels
   right at this release. */
@keyframes gn-capture-pulse{
  0%   { box-shadow: 0 0 0 0 rgba(255, 90, 110, .55), 0 0 12px rgba(255, 45, 77, .35); }
  100% { box-shadow: 0 0 0 14px rgba(255, 90, 110, 0), 0 0 12px rgba(255, 45, 77, 0); }}@media (prefers-reduced-motion: no-preference){
  .btn-primary.gn-capture-pulse,
  .btn-full.btn-primary.gn-capture-pulse,
  .gn-auth-primary.gn-capture-pulse {
    animation: gn-capture-pulse 520ms cubic-bezier(.2,.75,.25,1) both;
  }}

/* Touch target floor for legacy controls (guarded, not over-riding existing
   44px rules; only additive for any control that might otherwise be too thin). */
.gn-foundation-tile { min-height: 44px; }

/* NODE / Profile hub row: tighter, more deliberate hover affordance. */
.gn-profile-row:hover, .gn-profile-section button:hover {
  filter: brightness(1.08);
}

/* ── ASSAY: batch lab-test log (fourth LAB segment) ── */
#gnAssayModalOv{z-index:2147483002}
.gn-assay-sub{font-size:.78rem;color:var(--text-dim,#8a93a0);line-height:1.5;margin:0 0 14px}
#gnAssayLogBtn{margin-bottom:14px;min-height:48px}
.gn-assay-filters{margin-bottom:12px}
.gn-assay-viewrow{display:flex;gap:8px;margin-top:10px}
.gn-assay-entry{cursor:pointer}
.gn-assay-row{display:flex;align-items:flex-start;gap:12px}
.gn-assay-main{flex:1;min-width:0}
.gn-assay-main b{display:block;font-size:.95rem;letter-spacing:.5px;color:var(--text,#e8ecf1)}
.gn-assay-meta{display:block;font-size:.72rem;color:var(--text-dim,#8a93a0);letter-spacing:.5px;margin-top:3px}
.gn-assay-chips{display:flex;flex-direction:column;gap:6px;align-items:flex-end;flex-shrink:0}
.gn-assay-chip{font-family:var(--font-b,system-ui);font-size:.72rem;font-weight:700;letter-spacing:1px;padding:4px 10px;border-radius:20px;border:1px solid var(--border2,rgba(255,255,255,.12));color:var(--text-mid,#aab4c0);white-space:nowrap}
.gn-assay-chip.green{color:var(--brand-green);border-color:rgba(0,255,136,.5);background:rgba(0,255,136,.08)}
.gn-assay-chip.amber{color:var(--brand-amber);border-color:rgba(255,209,102,.5);background:rgba(255,209,102,.08)}
.gn-assay-chip.red{color:var(--brand-red-hi);border-color:rgba(255,91,91,.5);background:rgba(255,91,91,.08)}
.gn-assay-chip.cyan{color:var(--brand-cyan);border-color:rgba(0,212,255,.5);background:rgba(0,212,255,.08)}
.gn-assay-detail{margin-top:12px;padding-top:12px;border-top:1px solid var(--border2,rgba(255,255,255,.08))}
.gn-assay-drow{display:flex;justify-content:space-between;gap:12px;padding:5px 0;font-size:.8rem}
.gn-assay-drow .k{color:var(--text-dim,#8a93a0);letter-spacing:1.5px;font-size:.68rem}
.gn-assay-drow .v{color:var(--text,#e8ecf1);font-weight:600;text-align:right}
.gn-assay-drow .v.green{color:var(--brand-green)}
.gn-assay-drow .v.red{color:var(--brand-red-hi)}
.gn-assay-notes{margin:10px 0;padding:10px 12px;background:var(--bg2,rgba(255,255,255,.03));border-left:3px solid var(--cyan,#00d4ff);font-size:.8rem;line-height:1.6;color:var(--text-mid,#aab4c0);border-radius:0 8px 8px 0}
.gn-assay-actions{display:flex;gap:8px;margin-top:12px}
.gn-assay-act{margin:0;min-height:44px;font-size:.75rem}
.gn-assay-act.confirming{border-color:var(--red,#ff3b3b);color:var(--brand-red-hi);animation:gnAssayPulse 1s ease-in-out infinite}@keyframes gnAssayPulse{0%,100%{opacity:1}50%{opacity:.55}}
.gn-assay-pills{display:flex;flex-wrap:wrap;gap:8px}
.gn-assay-varpreview{display:flex;align-items:center;min-height:48px;padding:0 14px;border:1px solid var(--border2,rgba(255,255,255,.12));border-radius:8px;font-family:var(--font-b,system-ui);font-weight:700;letter-spacing:1px;font-size:.9rem;color:var(--text-dim,#8a93a0)}
.gn-assay-varpreview.green{color:var(--brand-green);border-color:rgba(0,255,136,.5)}
.gn-assay-varpreview.amber{color:var(--brand-amber);border-color:rgba(255,209,102,.5)}
.gn-assay-varpreview.red{color:var(--brand-red-hi);border-color:rgba(255,91,91,.5)}
.gn-assay-err{margin:0 0 12px;padding:10px 12px;border:1px solid rgba(255,91,91,.5);border-radius:var(--radius-control);color:var(--brand-red-hi);font-size:.8rem;letter-spacing:.5px}
.gn-assay-empty-sub{display:block;margin-top:8px;font-size:.78rem;color:var(--text-dim,#8a93a0);line-height:1.5}@media (prefers-reduced-motion:reduce){.gn-assay-act.confirming{animation:none}}
/* A4: assay light-theme variants — brand brights above are dark-surface
   values; on DUSK paper they fail contrast. Values mirror the sanctioned
   light pill palette in 09-unified-components.css. */
html[data-theme="light"] .gn-assay-chip.cyan, html[data-theme="light"] .gn-assay-varpreview.cyan{color:#00677f;border-color:rgba(0,103,127,.5)}
html[data-theme="light"] .gn-assay-chip.green, html[data-theme="light"] .gn-assay-varpreview.green, html[data-theme="light"] .gn-assay-drow .v.green{color:#00794a;border-color:rgba(0,121,74,.5)}
html[data-theme="light"] .gn-assay-chip.amber, html[data-theme="light"] .gn-assay-varpreview.amber{color:#8a5b00;border-color:rgba(138,91,0,.5)}
html[data-theme="light"] .gn-assay-chip.red, html[data-theme="light"] .gn-assay-varpreview.red, html[data-theme="light"] .gn-assay-drow .v.red, html[data-theme="light"] .gn-assay-err{color:#c81e1e;border-color:rgba(200,30,30,.5)}

/* ─────────────────────────────────────────────────────────────────────
   Meet PREEM band (2026-09-20) — PREEM is the face of GRID//NODE.
   Portrait in a HUD frame beside the intro copy. Stacks on mobile.
   ───────────────────────────────────────────────────────────────────── */
#landing .landing-preem {
  display: grid;
  grid-template-columns: minmax(0, 400px) minmax(0, 1fr);
  gap: clamp(26px, 4vw, 60px);
  align-items: center;
  max-width: 1120px;
  margin: 0 auto;
  padding: clamp(40px, 6vw, 84px) clamp(20px, 4vw, 44px);
}
#landing .landing-preem-frame {
  position: relative;
  border: 1px solid rgba(0, 212, 255, .34);
  border-top: 2px solid #00d4ff;
  border-radius: 14px;
  overflow: hidden;
  background: #03070b;
  box-shadow:
    0 34px 84px rgba(0, 0, 0, .66),
    0 0 0 1px rgba(255, 255, 255, .035),
    0 0 42px rgba(0, 212, 255, .11),
    inset 0 1px 0 rgba(255, 255, 255, .06);
}
#landing .landing-preem-shot {
  display: block;
  width: 100%;
  height: auto;
}
#landing .landing-preem-copy .landing-kicker { margin: 0 0 14px; }
#landing .landing-preem-copy h2 {
  margin: 0 0 14px;
  font-size: clamp(1.9rem, 3.4vw, 2.7rem);
  letter-spacing: .5px;
  line-height: 1.05;
}
#landing .landing-preem-copy p { max-width: 46ch; }
html[data-theme="light"] #landing .landing-preem-frame {
  background: linear-gradient(180deg, #fbf9f2, #f4f1e9);
  border-color: rgba(20, 60, 70, .28);
  border-top-color: #006f82;
  box-shadow: 0 34px 84px rgba(20, 60, 70, .15), 0 0 0 1px rgba(20, 60, 70, .04);
}
@media (max-width: 860px) {
  #landing .landing-preem {
    grid-template-columns: 1fr;
    max-width: 560px;
  }
}

/* TRACK 3 (2026-10-11): missing component styles.
 * .results-view-btn — PROGRESS CHARTS/CALENDAR segmented toggle. Seg-tab look
 * (inactive border + dim text; active cyan), matching the .time-tab language
 * in the cyan PROGRESS context. */
.results-view-toggle{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:10px}
.results-view-btn{min-height:42px;border:1px solid var(--border);border-radius:var(--radius-nested);background:transparent;color:var(--text-dim);font-family:var(--font-d);font-size:.72rem;letter-spacing:1.8px;text-transform:uppercase;cursor:pointer;transition:all .2s}
.results-view-btn.active{border-color:var(--brand-cyan);color:var(--brand-cyan);background:var(--cyan-dim);box-shadow:0 0 12px rgba(0,212,255,.08)}
/* A4: light seg language matches 09 .seg-btn — solid teal fill + white text
   (tint bg + bright cyan text measured ~2:1 on DUSK paper). */
html[data-theme="light"] .results-view-btn.active{background:var(--brand-cyan);border-color:var(--brand-cyan);color:#fff;box-shadow:0 2px 10px rgba(0,103,127,.25)}
.results-view-btn:active{transform:translateY(1px)}

/* .gn-delete-overlay/.gn-delete-panel — destructive vault dialogs (JS-built in
 * 09-vault.js ensureDestructiveDialogs). Dialog backdrop + danger panel shell
 * modeled on .archive-confirm-overlay/.archive-confirm-panel.danger. */
.gn-delete-overlay{position:fixed;inset:0;z-index:520;background:rgba(0,0,0,.82);display:none;align-items:center;justify-content:center;padding:22px;backdrop-filter:blur(8px)}
.gn-delete-overlay.active{display:flex;animation:fadeIn .18s ease}
.gn-delete-panel{width:min(380px,100%);background:linear-gradient(180deg,rgba(18,18,28,.98),rgba(8,8,13,.98));border:1px solid rgba(255,59,59,.26);border-top:2px solid var(--red);border-radius:var(--radius-card);box-shadow:0 18px 50px rgba(0,0,0,.62),0 0 30px rgba(255,59,59,.10);padding:20px 18px;position:relative;overflow:hidden}
.gn-delete-panel::before{content:'';position:absolute;inset:0;background:linear-gradient(120deg,transparent,rgba(255,59,59,.045),transparent);pointer-events:none}
.gn-delete-kicker{font-family:var(--font-m);font-size:.56rem;letter-spacing:1.8px;color:rgba(255,209,102,.76);margin-bottom:10px}
.gn-delete-panel h2{font-family:var(--font-d);font-size:.95rem;letter-spacing:2px;color:var(--red);margin:0 0 10px}
.gn-delete-panel p{font-family:var(--font-b);font-size:1rem;line-height:1.42;color:#b7c8d2;margin:0 0 12px}
.gn-delete-note{font-size:.78rem !important;color:#8fa8b5 !important}
.gn-delete-panel label{display:block;font-family:var(--font-m);font-size:.6rem;letter-spacing:1.6px;color:#8fa8b5;margin-top:14px}
.gn-delete-panel label input{display:block;width:100%;margin-top:8px;background:var(--bg2);border:1px solid var(--border2);border-radius:var(--radius-control);color:var(--text);font-family:var(--font-b);font-size:1rem;padding:12px 14px;outline:none;letter-spacing:2px;text-transform:uppercase}
.gn-delete-actions{display:grid;gap:9px;margin-top:16px}

/* ═══ TRACK A · ELEVATION WIRING (canonical --elev-* tiers) ═══════════
   Surfaces this file owns are bound to the token scale in
   08-design-tokens.css. One tier per role, both themes via the tokens:
   mission/hero + scanner + empty-hero = raised (elev-2), sheets/modals =
   elev-3, FAB = elev-fab, bottom nav = elev-nav. Earlier per-surface
   shadows in this file are superseded by these bindings. */
.gn-dashboard-mission { box-shadow: var(--elev-2); }
html[data-theme="light"] .gn-dashboard-mission { box-shadow: var(--elev-2); }
#pageDash .gn-empty-hero { box-shadow: var(--elev-2); }
.shots-scanner-card { box-shadow: var(--elev-2); }
html[data-theme="light"] .shots-scanner-card { box-shadow: var(--elev-2); }
.bottom-nav { box-shadow: var(--elev-nav); }
html[data-theme="light"] .bottom-nav { box-shadow: var(--elev-nav); }
.fab { box-shadow: var(--elev-fab) !important; }
.overlay .modal,
.gn-whatsnew-card,
.gn-delete-panel,
.archive-confirm-panel,
.gn-peptide-overlay-card,
.gn-lab-tool-panel,
.gn-import-panel { box-shadow: var(--elev-3) !important; }
html[data-theme="light"] .overlay .modal,
html[data-theme="light"] .gn-whatsnew-card,
html[data-theme="light"] .gn-delete-panel,
html[data-theme="light"] .archive-confirm-panel,
html[data-theme="light"] .gn-peptide-overlay-card,
html[data-theme="light"] .gn-lab-tool-panel,
html[data-theme="light"] .gn-import-panel { box-shadow: var(--elev-3) !important; }
.gn-runtime-banner { box-shadow: var(--elev-2); }
#landing .landing-preview-frame { box-shadow: var(--elev-3); }

/* ══ TRANSMISSION — update experience (v1.1.1) ═══════════════════════════
 * The update-available banner and the What's New card become one surface:
 * a transmission. Presentation only — the SW announce/apply machinery
 * (gridnode-native.js) and the whatsnew ack/queue contract are untouched.
 * All choreography is transform/opacity/background-size, and every piece
 * of it is switched off under prefers-reduced-motion at the bottom of
 * this section (final state is the base state, so nothing can get stuck
 * invisible). Category colors follow the sanctioned tag palette:
 * NEW mars red, FIXED green, A11Y amber, the rest tinted to family. */

/* ── Banner: shared chrome additions ────────────────────────────────── */
.gn-runtime-glyph { display: none; width: 15px; height: 15px; flex: 0 0 auto; color: #7ff5ff; }
.gn-runtime-glyph svg { width: 100%; height: 100%; display: block; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.gn-runtime-action { display: inline-flex; align-items: center; gap: 6px; }
.gn-runtime-action-ico { display: none; width: 13px; height: 13px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.gn-runtime-dismiss { width: 26px; height: 26px; flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; margin-left: -3px; padding: 0; border: 0; border-radius: 50%; background: transparent; color: rgba(242,251,253,.55); cursor: pointer; }
.gn-runtime-dismiss svg { width: 11px; height: 11px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }
.gn-runtime-dismiss:hover { color: #f2fbfd; background: rgba(255,255,255,.08); }
.gn-runtime-dismiss[hidden] { display: none; }

/* ── Banner: the update state is a signal pill ──────────────────────── */
.gn-runtime-banner[data-kind="update"] { overflow: hidden; border-color: rgba(0,212,255,.68); box-shadow: 0 12px 34px rgba(0,0,0,.42), 0 0 22px rgba(0,212,255,.16); }
.gn-runtime-banner[data-kind="update"] .gn-runtime-glyph { display: inline-flex; }
.gn-runtime-banner[data-kind="update"] .gn-runtime-action-ico { display: block; }
.gn-runtime-banner[data-kind="update"] .gn-runtime-action { background: rgba(0,212,255,.14); border-color: rgba(0,212,255,.65); color: #aef7ff; }
.gn-runtime-banner[data-kind="update"] .gn-runtime-copy { color: #eafcff; }
.gn-runtime-banner[data-kind="update"] .gn-runtime-dot { color: var(--brand-cyan, #00d4ff); background: var(--brand-cyan, #00d4ff); animation: gnTxDotPulse 1.9s ease-out infinite; }
@keyframes gnTxDotPulse { 0% { box-shadow: 0 0 0 0 rgba(0,212,255,.45), 0 0 10px rgba(0,212,255,.6); } 70% { box-shadow: 0 0 0 8px rgba(0,212,255,0), 0 0 10px rgba(0,212,255,.6); } 100% { box-shadow: 0 0 0 0 rgba(0,212,255,0), 0 0 10px rgba(0,212,255,.6); } }
/* Light sweep: crosses the pill in the first stretch of a 5.4s cycle,
   then rests — a signal catching light, not a marquee. */
.gn-runtime-banner[data-kind="update"]::after { content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; background: linear-gradient(100deg, transparent 42%, rgba(127,245,255,.13) 50%, transparent 58%); transform: translateX(-130%); animation: gnTxSweep 5.4s ease-in-out infinite; }
@keyframes gnTxSweep { 0% { transform: translateX(-130%); } 32% { transform: translateX(130%); } 100% { transform: translateX(130%); } }
.gn-runtime-rel { opacity: .55; }
@media (max-width: 430px) { .gn-runtime-banner[data-kind="update"] .gn-runtime-rel { display: none; } }
.gn-runtime-banner.gn-runtime-tappable { cursor: pointer; }
.gn-runtime-banner.gn-runtime-tappable:hover { filter: brightness(1.14); }
.gn-runtime-banner.gn-runtime-tappable:active { filter: brightness(1.24); }
html[data-theme="light"] .gn-runtime-banner[data-kind="update"] { border-color: rgba(0,95,115,.6); box-shadow: 0 12px 34px rgba(43,58,62,.2), 0 0 18px rgba(0,95,115,.14); }
html[data-theme="light"] .gn-runtime-banner[data-kind="update"] .gn-runtime-glyph { color: var(--text-accent); }
html[data-theme="light"] .gn-runtime-banner[data-kind="update"] .gn-runtime-action { background: rgba(0,95,115,.1); border-color: rgba(0,95,115,.5); color: var(--text-accent); }
html[data-theme="light"] .gn-runtime-banner[data-kind="update"] .gn-runtime-copy { color: var(--text-primary); }
html[data-theme="light"] .gn-runtime-banner[data-kind="update"] .gn-runtime-dot { animation-name: gnTxDotPulseLight; }
@keyframes gnTxDotPulseLight { 0% { box-shadow: 0 0 0 0 rgba(0,95,115,.35), 0 0 8px rgba(0,95,115,.4); } 70% { box-shadow: 0 0 0 8px rgba(0,95,115,0), 0 0 8px rgba(0,95,115,.4); } 100% { box-shadow: 0 0 0 0 rgba(0,95,115,0), 0 0 8px rgba(0,95,115,.4); } }
html[data-theme="light"] .gn-runtime-banner[data-kind="update"]::after { background: linear-gradient(100deg, transparent 42%, rgba(0,95,115,.1) 50%, transparent 58%); }
html[data-theme="light"] .gn-runtime-dismiss { color: rgba(28,43,49,.5); }
html[data-theme="light"] .gn-runtime-dismiss:hover { color: var(--text-primary); background: rgba(0,95,115,.08); }

/* ── What's New card: scan-in + charged top line ────────────────────── */
#gnWhatsNewOverlay.gn-tx:not(.gn-tx-archive) .gn-whatsnew-card {
  border-top-color: transparent;
  background-image: linear-gradient(90deg, #00d4ff, rgba(0,212,255,.12));
  background-size: 100% 2px;
  background-position: top left;
  background-repeat: no-repeat;
  animation: gnTxCardIn .55s cubic-bezier(.22,1,.36,1) both, gnTxCharge .9s .1s ease-out both;
}
@keyframes gnTxCardIn { from { opacity: 0; transform: translateY(16px) scale(.985); } to { opacity: 1; transform: translateY(0) scale(1); } }
@keyframes gnTxCharge { from { background-size: 0% 2px; } to { background-size: 100% 2px; } }
/* One scan pass over the whole transmission as it lands. */
#gnWhatsNewOverlay.gn-tx:not(.gn-tx-archive)::before {
  content: ""; position: fixed; left: 0; right: 0; top: 0; height: 180px; z-index: 2; pointer-events: none;
  background: linear-gradient(180deg, transparent, rgba(0,212,255,.09) 55%, rgba(0,212,255,.22) 82%, rgba(127,245,255,.35) 100%);
  transform: translateY(-190px);
  animation: gnTxScan 1.05s .12s cubic-bezier(.4,0,.2,1) both;
}
@keyframes gnTxScan { from { transform: translateY(-190px); } to { transform: translateY(100vh); } }
html[data-theme="light"] #gnWhatsNewOverlay.gn-tx:not(.gn-tx-archive) .gn-whatsnew-card { background-image: linear-gradient(90deg, rgba(0,111,130,.9), rgba(0,111,130,.15)); }
html[data-theme="light"] #gnWhatsNewOverlay.gn-tx:not(.gn-tx-archive)::before { background: linear-gradient(180deg, transparent, rgba(0,111,130,.06) 55%, rgba(0,111,130,.14) 82%, rgba(0,111,130,.22) 100%); }

/* ── Hero: the version is the moment ────────────────────────────────── */
.gn-tx-hero { position: relative; padding: 16px !important; border-radius: 12px; }
.gn-tx-hero-top { display: flex; align-items: center; gap: 14px; margin-bottom: 14px; }
.gn-tx-medallion { position: relative; flex: 0 0 auto; width: 54px; height: 54px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid rgba(0,212,255,.4); border-radius: 50%; background: rgba(0,212,255,.06); color: #7ff5ff; box-shadow: inset 0 0 16px rgba(0,212,255,.07), 0 0 14px rgba(0,212,255,.1); }
.gn-tx-medallion svg { width: 27px; height: 27px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.gn-tx-medallion::after { content: ""; position: absolute; inset: -1px; border: 1px solid rgba(0,212,255,.45); border-radius: 50%; animation: gnTxRingPulse 3s ease-out infinite; }
@keyframes gnTxRingPulse { 0% { transform: scale(1); opacity: .55; } 70% { transform: scale(1.22); opacity: 0; } 100% { transform: scale(1.22); opacity: 0; } }
.gn-tx-hero-meta { min-width: 0; }
.gn-tx-version { margin: 0 !important; font-size: 2rem !important; line-height: 1.05; letter-spacing: .5px; text-shadow: 0 0 22px rgba(0,212,255,.28); }
.gn-tx-title { margin-top: 3px !important; font-size: .78rem !important; }
.gn-tx-hero-meta .gn-whatsnew-date { margin: 4px 0 0; }
html[data-theme="light"] .gn-tx-medallion { border-color: rgba(0,95,115,.4); background: rgba(0,95,115,.05); color: var(--text-accent); box-shadow: inset 0 0 16px rgba(0,95,115,.06), 0 0 12px rgba(0,95,115,.08); }
html[data-theme="light"] .gn-tx-medallion::after { border-color: rgba(0,95,115,.4); }
html[data-theme="light"] .gn-tx-version { text-shadow: none; }

/* ── Categories: glyph chip + sanctioned tag, staggered rise ────────── */
.gn-wn-cat-head { display: flex; align-items: center; gap: 8px; margin-bottom: 7px; }
.gn-wn-cat-chip { flex: 0 0 auto; width: 26px; height: 26px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid rgba(0,212,255,.4); border-radius: 8px; background: rgba(0,212,255,.07); color: #7ff5ff; }
.gn-wn-cat-chip svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.gn-wn-cat[data-cat="new"] .gn-wn-cat-chip { border-color: rgba(255,45,77,.45); background: rgba(255,45,77,.07); color: #FF5B5B; }
.gn-wn-cat[data-cat="fixed"] .gn-wn-cat-chip { border-color: rgba(0,255,136,.4); background: rgba(0,255,136,.06); color: #00ff88; }
.gn-wn-cat[data-cat="accessibility"] .gn-wn-cat-chip { border-color: rgba(255,209,102,.45); background: rgba(255,209,102,.06); color: #ffd166; }
.gn-wn-cat[data-cat="improved"] .gn-wn-cat-chip { border-color: rgba(183,139,255,.45); background: rgba(183,139,255,.07); color: #b78bff; }
.gn-wn-cat[data-cat="mobile"] .gn-wn-cat-chip { border-color: rgba(255,159,67,.45); background: rgba(255,159,67,.06); color: #ff9f43; }
.gn-wn-cat[data-cat="security"] .gn-wn-cat-chip { border-color: rgba(157,184,255,.45); background: rgba(157,184,255,.06); color: #9db8ff; }
.gn-wn-cat[data-cat="compatibility"] .gn-wn-cat-chip { border-color: rgba(127,178,201,.45); background: rgba(127,178,201,.06); color: #7fb2c9; }
.gn-wn-cat[data-cat="improved"] .gn-wn-cat-tag { color: #b78bff; }
.gn-wn-cat[data-cat="mobile"] .gn-wn-cat-tag { color: #ff9f43; }
.gn-wn-cat[data-cat="security"] .gn-wn-cat-tag { color: #9db8ff; }
.gn-wn-cat[data-cat="compatibility"] .gn-wn-cat-tag { color: #7fb2c9; }
html[data-theme="light"] .gn-wn-cat-chip { border-color: rgba(0,95,115,.4); background: rgba(0,95,115,.05); color: var(--text-accent); }
html[data-theme="light"] .gn-wn-cat[data-cat="new"] .gn-wn-cat-chip { border-color: rgba(163,15,46,.4); background: rgba(163,15,46,.05); color: #a30f2e; }
html[data-theme="light"] .gn-wn-cat[data-cat="fixed"] .gn-wn-cat-chip { border-color: rgba(0,107,66,.4); background: rgba(0,107,66,.05); color: #006b42; }
html[data-theme="light"] .gn-wn-cat[data-cat="accessibility"] .gn-wn-cat-chip { border-color: rgba(122,90,16,.45); background: rgba(122,90,16,.06); color: #7a5a10; }
html[data-theme="light"] .gn-wn-cat[data-cat="improved"] .gn-wn-cat-chip { border-color: rgba(109,40,184,.4); background: rgba(109,40,184,.05); color: #6d28b8; }
html[data-theme="light"] .gn-wn-cat[data-cat="mobile"] .gn-wn-cat-chip { border-color: rgba(154,91,0,.45); background: rgba(154,91,0,.05); color: #9a5b00; }
html[data-theme="light"] .gn-wn-cat[data-cat="security"] .gn-wn-cat-chip { border-color: rgba(47,75,158,.4); background: rgba(47,75,158,.05); color: #2f4b9e; }
html[data-theme="light"] .gn-wn-cat[data-cat="compatibility"] .gn-wn-cat-chip { border-color: rgba(64,103,124,.45); background: rgba(64,103,124,.05); color: #40677c; }
html[data-theme="light"] .gn-wn-cat[data-cat="improved"] .gn-wn-cat-tag { color: #6d28b8; }
html[data-theme="light"] .gn-wn-cat[data-cat="mobile"] .gn-wn-cat-tag { color: #9a5b00; }
html[data-theme="light"] .gn-wn-cat[data-cat="security"] .gn-wn-cat-tag { color: #2f4b9e; }
html[data-theme="light"] .gn-wn-cat[data-cat="compatibility"] .gn-wn-cat-tag { color: #40677c; }
#gnWhatsNewOverlay.gn-tx:not(.gn-tx-archive) .gn-wn-cat-head,
#gnWhatsNewOverlay.gn-tx:not(.gn-tx-archive) .gn-wn-cat li {
  animation: gnTxRise .45s cubic-bezier(.22,1,.36,1) both;
  animation-delay: min(calc(var(--i, 0) * 45ms), 500ms);
}
@keyframes gnTxRise { from { opacity: 0; transform: translateY(7px); } to { opacity: 1; transform: translateY(0); } }

/* ── History: past transmissions, same language, quieter ───────────── */
.gn-tx-past-title { margin: 1px 0 2px; }
#gnWhatsNewOverlay.gn-tx-archive .gn-wn-release { border-left: 2px solid rgba(0,212,255,.16); padding-left: 12px; }
#gnWhatsNewOverlay.gn-tx-archive .gn-wn-release.current { border-left: 1px solid rgba(0,212,255,.25); padding-left: 14px; }
html[data-theme="light"] #gnWhatsNewOverlay.gn-tx-archive .gn-wn-release { border-left-color: rgba(0,95,115,.22); }

/* ── Reduced motion: the transmission arrives, instantly, complete ──── */
@media (prefers-reduced-motion: reduce) {
  .gn-runtime-banner[data-kind="update"]::after,
  .gn-runtime-banner[data-kind="update"] .gn-runtime-dot { animation: none !important; }
  #gnWhatsNewOverlay.gn-tx .gn-whatsnew-card,
  #gnWhatsNewOverlay.gn-tx::before,
  #gnWhatsNewOverlay.gn-tx .gn-wn-cat-head,
  #gnWhatsNewOverlay.gn-tx .gn-wn-cat li,
  #gnWhatsNewOverlay.gn-tx .gn-tx-medallion::after { animation: none !important; }
}
html[data-theme="light"] #landing .landing-preview-frame { box-shadow: var(--elev-3); }
