/* ═══════════════════════════════════════════════════════════════════
   AETHER-Ω — GALACTIC OBSERVATORY
   A full galaxy, hand-drawn in GLSL. Overrides + new instruments.
   ═══════════════════════════════════════════════════════════════════ */

:root{
  --warm:#ffb86b;
  --warm-rgb:255,184,107;
  --cyan:#7ce7ff;
  --cyan-rgb:124,231,255;
  --gx-panel:rgba(6,8,14,.55);
  --gx-line:rgba(255,255,255,.09);
}

html{ background:#04050a; overflow-x:hidden; }
body{ background:#04050a; overflow-x:hidden; }

/* ── the galaxy canvas ─────────────────────────────────────────── */
#galaxy{
  position:fixed;
  inset:0;
  width:100%;
  height:100%;
  display:block;
  z-index:0;
  background:radial-gradient(ellipse 120% 90% at 50% 50%, #070a14 0%, #04050a 62%, #020307 100%);
  touch-action:none;
}
html.no-webgl #galaxy{ display:none; }

.gx-grain,.gx-scan{
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:1;
}
.gx-grain{
  opacity:.05;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E");
  mix-blend-mode:overlay;
}
.gx-scan{
  opacity:.25;
  background:repeating-linear-gradient(180deg, rgba(255,255,255,.028) 0 1px, transparent 1px 3px);
  mix-blend-mode:overlay;
}

main{ position:relative; z-index:2; }
main > *{ position:relative; }

/* ═══════════════════════════ HERO ═══════════════════════════ */
.hero.celestial{
  min-height:100svh;
  padding:calc(var(--navh) + 18px) var(--pad) 0;
  overflow:hidden;
}

.gx-scrim{
  z-index:0 !important;
  background:
    radial-gradient(ellipse 62% 70% at 18% 58%, rgba(4,5,10,.94) 0%, rgba(4,5,10,.66) 42%, rgba(4,5,10,0) 74%),
    linear-gradient(90deg, rgba(4,5,10,.86) 0%, rgba(4,5,10,.34) 34%, rgba(4,5,10,0) 58%),
    linear-gradient(0deg, rgba(4,5,10,.95) 0%, rgba(4,5,10,.42) 18%, transparent 42%),
    linear-gradient(180deg, rgba(4,5,10,.7) 0%, transparent 20%) !important;
}
.gx-grid{
  position:absolute;
  inset:0;
  z-index:0;
  opacity:.10;
  background-image:
    linear-gradient(rgba(255,255,255,.5) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.5) 1px, transparent 1px);
  background-size:88px 88px;
  mask-image:radial-gradient(ellipse 80% 70% at 30% 60%, #000 0%, transparent 72%);
  -webkit-mask-image:radial-gradient(ellipse 80% 70% at 30% 60%, #000 0%, transparent 72%);
}

/* hero entrance */
.gx-kicker,.gx-eyebrow,.gx-title,.gx-lede,.gx-actions{
  opacity:0;
  transform:translateY(22px);
  transition:opacity 1.05s var(--ease), transform 1.05s var(--ease);
}
.gx-kicker.is-in,.gx-eyebrow.is-in,.gx-title.is-in,.gx-lede.is-in,.gx-actions.is-in{
  opacity:1;
  transform:none;
}

/* ── hero content column ───────────────────────────────────────── */
.gx-hero{
  position:relative;
  z-index:5;
  flex:1;
  display:flex;
  align-items:flex-end;
  padding-bottom:clamp(20px,4vh,54px);
  min-height:0;
}
.gx-hero__main{
  width:min(58%,760px);
  min-width:0;
}

.gx-kicker{
  display:flex;
  align-items:center;
  gap:12px;
  font-family:var(--font-mono);
  font-size:8px;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:rgba(242,241,234,.46);
  margin-bottom:clamp(14px,2.4vh,26px);
}
.gx-kicker .mini-rule{ width:38px; height:1px; background:rgba(var(--accent-rgb),.6); box-shadow:0 0 10px rgba(var(--accent-rgb),.5); }

.gx-eyebrow{
  font-family:var(--font-mono);
  font-size:10px;
  letter-spacing:.26em;
  text-transform:uppercase;
  color:rgba(242,241,234,.5);
  margin-bottom:6px;
  display:flex;
  align-items:center;
  gap:10px;
}
.gx-eyebrow b{
  color:var(--accent);
  font-weight:400;
  font-size:13px;
  line-height:1;
  text-shadow:0 0 16px rgba(var(--accent-rgb),.7);
}

.gx-title{
  position:relative;
  display:block;
  margin:0 0 clamp(16px,2.6vh,30px);
  line-height:.86;
  font-weight:400;
}
.gx-title__cn{
  display:block;
  font-family:"Songti SC","Source Han Serif SC","Noto Serif CJK SC","STSong","SimSun",Georgia,serif;
  font-weight:600;
  font-size:clamp(62px, 10.8vw, 176px);
  letter-spacing:.055em;
  line-height:.94;
  background:linear-gradient(104deg,#ffffff 0%,#f2ffd4 24%,var(--accent) 48%,#b6a8ff 78%,var(--accent-2) 100%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  filter:drop-shadow(0 0 60px rgba(var(--accent-rgb),.14)) drop-shadow(0 6px 26px rgba(0,0,0,.6));
  transform:translateZ(0);
}
.gx-title__en{
  display:block;
  margin-top:-.06em;
  margin-left:.06em;
  font-family:var(--font-display);
  font-weight:400;
  font-size:clamp(22px, 3.4vw, 52px);
  letter-spacing:.42em;
  color:transparent;
  -webkit-text-stroke:1px rgba(255,255,255,.28);
  opacity:.9;
}
.gx-title__no{
  position:absolute;
  right:0;
  bottom:.1em;
  font-family:var(--font-mono);
  font-size:10px;
  letter-spacing:.2em;
  color:rgba(var(--accent-rgb),.7);
  writing-mode:vertical-rl;
}

.gx-lede{
  max-width:48ch;
  font-family:var(--font-body);
  font-size:clamp(12.5px,1.06vw,15px);
  line-height:1.85;
  color:rgba(242,241,234,.62);
  text-shadow:0 2px 22px rgba(0,0,0,.9);
  margin-bottom:clamp(18px,3vh,32px);
}
.gx-lede em{ font-style:normal; color:var(--accent); font-weight:600; }

.gx-actions{
  display:flex;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
}
.gx-privacy{
  display:inline-flex;
  align-items:center;
  gap:7px;
  font-family:var(--font-mono);
  font-size:7px;
  letter-spacing:.16em;
  color:rgba(255,255,255,.28);
  margin-left:4px;
}
.gx-privacy i{ width:4px; height:4px; border-radius:50%; background:var(--accent); box-shadow:0 0 8px var(--accent); animation:pulse 2.4s infinite; }

/* ═══════════════ PROJECTED ARM LABELS ═══════════════ */
.gx-labels{
  position:absolute;
  inset:0;
  z-index:4;
  pointer-events:none;
  overflow:hidden;
}
.gx-label{
  position:absolute;
  top:0;
  left:0;
  display:flex;
  align-items:center;
  gap:7px;
  transform:translate3d(-50%,-50%,0);
  font-family:var(--font-mono);
  font-size:7.5px;
  letter-spacing:.16em;
  color:rgba(242,241,234,.55);
  white-space:nowrap;
  padding:4px 7px 4px 5px;
  background:linear-gradient(90deg, rgba(4,6,12,.72), rgba(4,6,12,.12));
  border-left:1px solid rgba(var(--accent-rgb),.45);
  opacity:0;
  transition:opacity .5s var(--ease);
  will-change:transform,left,top;
}
html.is-loaded .gx-label{ opacity:1; }
.gx-label i{
  width:3px; height:3px;
  border-radius:50%;
  background:var(--accent);
  box-shadow:0 0 8px rgba(var(--accent-rgb),.9);
  flex:none;
}
.gx-label b{ font-weight:400; color:rgba(255,255,255,.82); }
.gx-label span{ color:rgba(255,255,255,.3); font-size:6.5px; }
.gx-label--core{
  border-left-color:rgba(var(--warm-rgb),.7);
  background:linear-gradient(90deg, rgba(10,6,4,.8), rgba(4,6,12,0));
}
.gx-label--core i{ background:var(--warm); box-shadow:0 0 10px rgba(var(--warm-rgb),.9); }
.gx-label--core b{ color:var(--warm); }
.gx-label--sun{
  border-left-color:rgba(var(--cyan-rgb),.6);
}
.gx-label--sun i{ background:var(--cyan); box-shadow:0 0 10px rgba(var(--cyan-rgb),.9); }
.gx-label--sun b{ color:var(--cyan); }

/* ═══════════════ TELEMETRY RAIL ═══════════════ */
.gx-telemetry{
  position:absolute;
  z-index:6;
  right:var(--pad);
  top:50%;
  transform:translateY(-50%);
  width:224px;
  padding:14px 14px 10px;
  background:linear-gradient(160deg, rgba(8,11,18,.72), rgba(5,6,12,.42));
  border:1px solid rgba(255,255,255,.08);
  backdrop-filter:blur(14px) saturate(1.2);
  -webkit-backdrop-filter:blur(14px) saturate(1.2);
  box-shadow:0 30px 80px rgba(0,0,0,.5), inset 0 1px 0 rgba(255,255,255,.05);
  opacity:0;
  transform:translateY(-50%) translateX(14px);
  transition:opacity 1.2s var(--ease) 1.5s, transform 1.2s var(--ease) 1.5s;
}
html.is-loaded .gx-telemetry{ opacity:1; transform:translateY(-50%); }
.gx-telemetry::before,.gx-telemetry::after{
  content:"";
  position:absolute;
  width:7px; height:7px;
  border:1px solid rgba(var(--accent-rgb),.55);
  pointer-events:none;
}
.gx-telemetry::before{ top:-1px; left:-1px; border-right:0; border-bottom:0; }
.gx-telemetry::after{ bottom:-1px; right:-1px; border-left:0; border-top:0; }

.gx-telemetry__head{
  display:flex;
  align-items:center;
  gap:7px;
  font-family:var(--font-mono);
  font-size:6.8px;
  letter-spacing:.2em;
  color:rgba(255,255,255,.4);
  padding-bottom:9px;
  border-bottom:1px solid rgba(255,255,255,.07);
  margin-bottom:9px;
}
.gx-telemetry__head i{
  width:4px;height:4px;border-radius:50%;
  background:var(--accent);
  box-shadow:0 0 8px var(--accent);
  animation:pulse 1.8s infinite;
}
.gx-telemetry__head b{
  margin-left:auto;
  font-weight:400;
  color:var(--accent);
  font-size:6.5px;
}

.gx-tel{
  display:grid;
  grid-template-columns:58px 1fr 52px;
  align-items:center;
  gap:7px;
  padding:3.5px 0;
  font-family:var(--font-mono);
  font-size:7px;
  letter-spacing:.12em;
}
.gx-tel span{ color:rgba(255,255,255,.3); }
.gx-tel em{
  display:block;
  height:2px;
  background:rgba(255,255,255,.07);
  overflow:hidden;
  font-style:normal;
}
.gx-tel em i{
  display:block;
  height:100%;
  width:0%;
  background:linear-gradient(90deg, rgba(var(--accent-rgb),.35), var(--accent));
  box-shadow:0 0 8px rgba(var(--accent-rgb),.7);
  transition:width .18s linear;
}
.gx-tel b{
  text-align:right;
  font-weight:400;
  color:rgba(242,241,234,.86);
  font-variant-numeric:tabular-nums;
  letter-spacing:.04em;
}
.gx-telemetry__spark{
  margin:9px 0 7px;
  border-top:1px solid rgba(255,255,255,.07);
  border-bottom:1px solid rgba(255,255,255,.07);
  padding:5px 0 2px;
}
.gx-telemetry__spark canvas{ display:block; width:100%; height:42px; }
.gx-telemetry__foot{
  display:flex;
  align-items:center;
  gap:6px;
  font-family:var(--font-mono);
  font-size:6.4px;
  letter-spacing:.14em;
  color:rgba(255,255,255,.26);
  padding-top:2px;
}
.gx-telemetry__foot b{ color:rgba(255,255,255,.66); font-weight:400; }
.gx-telemetry__foot span:nth-of-type(2){ margin-left:auto; }

/* ═══════════════════════════ CHAPTERS ═══════════════════════════ */
.chapter{
  position:relative;
  padding:clamp(90px,16vh,190px) var(--pad) clamp(90px,16vh,190px);
  isolation:isolate;
}
.chapter::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background:
    linear-gradient(90deg, rgba(4,5,10,.90) 0%, rgba(4,5,10,.78) 22%, rgba(4,5,10,.40) 44%, rgba(4,5,10,.06) 60%, transparent 72%),
    linear-gradient(0deg, rgba(4,5,10,.72) 0%, transparent 20%, transparent 80%, rgba(4,5,10,.72) 100%);
}
.chapter--core::before{ background:linear-gradient(90deg, rgba(4,5,10,.92), rgba(4,5,10,.80) 24%, rgba(4,5,10,.42) 46%, rgba(4,5,10,.08) 62%, transparent 74%), linear-gradient(0deg, rgba(4,5,10,.78), transparent 22%, transparent 78%, rgba(4,5,10,.78)); }
.chapter--arms::before{ background:linear-gradient(90deg, rgba(4,5,10,.92), rgba(4,5,10,.80) 24%, rgba(4,5,10,.42) 46%, rgba(4,5,10,.08) 62%, transparent 74%), linear-gradient(0deg, rgba(4,5,10,.78), transparent 22%, transparent 78%, rgba(4,5,10,.78)); }
.chapter--dust::before{ background:linear-gradient(90deg, rgba(4,5,10,.92), rgba(4,5,10,.80) 24%, rgba(4,5,10,.42) 46%, rgba(4,5,10,.08) 62%, transparent 74%), linear-gradient(0deg, rgba(4,5,10,.78), transparent 22%, transparent 78%, rgba(4,5,10,.78)); }
.chapter--system::before{ background:
    linear-gradient(0deg, rgba(4,5,10,.94), rgba(4,5,10,.72) 24%, rgba(4,5,10,.66) 76%, rgba(4,5,10,.94)),
    radial-gradient(ellipse 60% 50% at 50% 50%, transparent 30%, rgba(4,5,10,.3) 100%); }

.chapter__index{
  position:absolute;
  right:var(--pad);
  top:clamp(40px,8vh,110px);
  z-index:-1;
  font-family:var(--font-display);
  font-size:clamp(120px,22vw,340px);
  line-height:.72;
  letter-spacing:-.03em;
  color:transparent;
  -webkit-text-stroke:1px rgba(255,255,255,.055);
  pointer-events:none;
  user-select:none;
}
.chapter__inner{
  max-width:1420px;
  margin:0 auto;
  opacity:0;
  transform:translateY(34px);
  transition:opacity 1.1s var(--ease), transform 1.1s var(--ease);
}
.chapter.is-in .chapter__inner{ opacity:1; transform:none; }

.chapter__head{
  display:flex;
  align-items:center;
  gap:16px;
  font-family:var(--font-mono);
  font-size:8px;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:rgba(255,255,255,.36);
  margin-bottom:clamp(22px,4vh,44px);
}
.chapter__no{ color:var(--accent); }
.chapter__rule{ flex:1; height:1px; background:linear-gradient(90deg, rgba(var(--accent-rgb),.4), rgba(255,255,255,.08) 30%, transparent); }
.chapter__tag{ color:rgba(255,255,255,.28); }

.gx-split{
  display:grid;
  grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);
  gap:clamp(28px,5vw,90px);
  align-items:start;
}
.gx-split--arms{ grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr); }

.chapter h2{
  font-family:var(--font-body);
  font-weight:300;
  font-size:clamp(42px,5.4vw,88px);
  line-height:1.02;
  letter-spacing:-.015em;
  color:#f4f3ec;
  text-shadow:0 4px 40px rgba(0,0,0,.6);
  margin-bottom:clamp(18px,3vh,30px);
}
.chapter h2 em{
  font-style:normal;
  -webkit-text-stroke:1px rgba(255,255,255,.4);
  color:transparent;
  font-weight:300;
}
.gx-h2-wide{ max-width:14ch; }

.chapter__lede{
  max-width:56ch;
  font-size:clamp(12.5px,1vw,14.5px);
  line-height:1.95;
  color:rgba(242,241,234,.55);
}
.chapter__lede b{ color:var(--accent); font-weight:500; }
.chapter__lede sub{ font-size:.7em; }

/* ── data grid ─────────────────────────────────────────────── */
.data-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  margin-top:clamp(24px,4vh,40px);
  border-top:1px solid var(--gx-line);
}
.data-grid--tight{ grid-template-columns:repeat(2,minmax(0,1fr)); margin-top:22px; }
.data{
  padding:14px 12px 14px 0;
  border-bottom:1px solid rgba(255,255,255,.055);
  border-right:1px solid rgba(255,255,255,.045);
  display:flex;
  flex-direction:column;
  gap:5px;
}
.data:nth-child(4n){ border-right:0; }
.data-grid--tight .data:nth-child(2n){ border-right:0; }
.data span{
  font-family:var(--font-mono);
  font-size:6.5px;
  letter-spacing:.18em;
  color:rgba(255,255,255,.28);
  text-transform:uppercase;
}
.data b{
  font-family:var(--font-mono);
  font-size:clamp(15px,1.55vw,22px);
  font-weight:400;
  letter-spacing:-.01em;
  color:#f0efe8;
  font-variant-numeric:tabular-nums;
  line-height:1.1;
}
.data b i{
  font-style:normal;
  font-size:.46em;
  letter-spacing:.12em;
  color:var(--accent);
  margin-left:3px;
}
.data b sup{ font-size:.52em; }

/* ── mass readout ──────────────────────────────────────────── */
.gx-mass{
  display:flex;
  align-items:baseline;
  gap:14px;
  margin:clamp(22px,3.4vh,34px) 0 0;
  padding-bottom:6px;
}
.gx-mass b{
  font-family:var(--font-display);
  font-weight:300;
  font-size:clamp(46px,6.2vw,96px);
  line-height:.86;
  letter-spacing:-.02em;
  background:linear-gradient(92deg,#fff 0%,var(--warm) 62%,#ff7a5c 100%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  filter:drop-shadow(0 0 34px rgba(var(--warm-rgb),.22));
}
.gx-mass b sup{ font-size:.4em; letter-spacing:0; }
.gx-mass span{
  font-family:var(--font-mono);
  font-size:7px;
  letter-spacing:.18em;
  color:rgba(255,255,255,.34);
  line-height:1.6;
}

/* ── photon ring diagram ───────────────────────────────────── */
.photon{
  position:relative;
  aspect-ratio:1;
  width:100%;
  max-width:420px;
  margin:0 auto;
  display:grid;
  place-items:center;
}
.photon__ring,.photon__ring--b{
  position:absolute;
  inset:8%;
  border-radius:50%;
  border:1px solid rgba(var(--warm-rgb),.28);
  box-shadow:0 0 60px rgba(var(--warm-rgb),.10), inset 0 0 60px rgba(var(--warm-rgb),.06);
  animation:spin 42s linear infinite;
}
.photon__ring::after{
  content:"";
  position:absolute;
  top:-2px; left:50%;
  width:4px;height:4px;
  border-radius:50%;
  background:var(--warm);
  box-shadow:0 0 14px var(--warm);
}
.photon__ring--b{
  inset:2%;
  border-style:dashed;
  border-color:rgba(255,255,255,.10);
  animation-direction:reverse;
  animation-duration:66s;
}
.photon__ring--b::after{ display:none; }
.photon__core{
  position:absolute;
  width:26%;
  aspect-ratio:1;
  border-radius:50%;
  background:radial-gradient(circle, #000 36%, rgba(0,0,0,.9) 52%, rgba(var(--warm-rgb),.32) 62%, rgba(var(--warm-rgb),.06) 74%, transparent 82%);
  box-shadow:0 0 80px 12px rgba(var(--warm-rgb),.14), inset 0 0 40px 10px rgba(0,0,0,1);
  animation:breathe 6s ease-in-out infinite;
}
.photon__tick{
  position:absolute;
  inset:0;
  border-radius:50%;
  background:conic-gradient(from 0deg, transparent 0 8%, rgba(var(--warm-rgb),.18) 8.4%, transparent 9% 100%);
  mask-image:radial-gradient(circle, transparent 44%, #000 46%, #000 48%, transparent 50%);
  -webkit-mask-image:radial-gradient(circle, transparent 44%, #000 46%, #000 48%, transparent 50%);
}
.photon__label{
  position:absolute;
  bottom:14%;
  font-family:var(--font-mono);
  font-size:6.5px;
  letter-spacing:.2em;
  color:rgba(var(--warm-rgb),.5);
}
.gx-caption{
  display:block;
  text-align:center;
  margin-top:14px;
  font-family:var(--font-mono);
  font-size:6.5px;
  letter-spacing:.18em;
  color:rgba(255,255,255,.24);
}

@keyframes spin{ to{ transform:rotate(360deg); } }
@keyframes breathe{ 0%,100%{ transform:scale(1); opacity:.95; } 50%{ transform:scale(1.06); opacity:1; } }

/* ── arm list ──────────────────────────────────────────────── */
.arm-list{
  margin-top:clamp(22px,3.6vh,36px);
  border-top:1px solid var(--gx-line);
}
.arm-row{
  display:grid;
  grid-template-columns:26px minmax(0,1fr) 84px 76px 92px;
  align-items:center;
  gap:10px;
  width:100%;
  padding:13px 10px 13px 2px;
  background:none;
  border:0;
  border-bottom:1px solid rgba(255,255,255,.055);
  text-align:left;
  cursor:pointer;
  color:inherit;
  font:inherit;
  position:relative;
  transition:background .35s var(--ease), padding .35s var(--ease);
}
.arm-row::before{
  content:"";
  position:absolute;
  left:0; top:0; bottom:0;
  width:1px;
  background:var(--accent);
  transform:scaleY(0);
  transform-origin:top;
  transition:transform .4s var(--ease);
  box-shadow:0 0 14px rgba(var(--accent-rgb),.8);
}
.arm-row:hover,.arm-row.is-active{ background:linear-gradient(90deg, rgba(var(--accent-rgb),.055), transparent 62%); padding-left:10px; }
.arm-row:hover::before,.arm-row.is-active::before{ transform:scaleY(1); }
.arm-row__no{
  font-family:var(--font-mono);
  font-size:7px;
  color:rgba(255,255,255,.24);
  letter-spacing:.1em;
}
.arm-row.is-active .arm-row__no{ color:var(--accent); }
.arm-row__name{
  font-size:clamp(13px,1.15vw,16px);
  letter-spacing:.04em;
  color:rgba(242,241,234,.82);
  display:flex;
  align-items:baseline;
  gap:9px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.arm-row__name i{
  font-style:normal;
  font-size:10px;
  color:rgba(255,255,255,.26);
  letter-spacing:.06em;
}
.arm-row.is-active .arm-row__name{ color:#fff; }
.arm-row__meta{
  font-family:var(--font-mono);
  font-size:6.5px;
  letter-spacing:.1em;
  color:rgba(255,255,255,.28);
  white-space:nowrap;
}
.arm-row__bar{
  display:block;
  height:2px;
  background:rgba(255,255,255,.07);
  overflow:hidden;
}
.arm-row__bar i{
  display:block;
  height:100%;
  width:calc(var(--w) * 100%);
  background:linear-gradient(90deg, rgba(var(--accent-rgb),.3), var(--accent));
  transform-origin:left;
  transform:scaleX(.2);
  opacity:.5;
  transition:transform .5s var(--ease), opacity .4s;
}
.arm-row.is-active .arm-row__bar i,.arm-row:hover .arm-row__bar i{ transform:scaleX(1); opacity:1; }

/* ── spiral diagram ────────────────────────────────────────── */
.spiral{ position:relative; width:100%; max-width:420px; margin:0 auto; }
.spiral svg{ display:block; width:100%; height:auto; overflow:visible; }
.spiral__sol text{
  font-family:var(--font-mono);
  font-size:8px;
  fill:rgba(var(--accent-rgb),.75);
  letter-spacing:.12em;
}
.spiral__tag{
  display:block;
  text-align:center;
  margin-top:10px;
  font-family:var(--font-mono);
  font-size:6.5px;
  letter-spacing:.18em;
  color:rgba(var(--accent-rgb),.6);
}
#spiralPaths path{
  transition:stroke-opacity .4s, stroke-width .4s, filter .4s;
  stroke:rgba(255,255,255,.3);
  stroke-width:2.2;
  stroke-opacity:.5;
}
#spiralPaths path.is-hot{
  stroke:var(--accent);
  stroke-opacity:1;
  stroke-width:3.6;
  filter:drop-shadow(0 0 6px rgba(var(--accent-rgb),.85));
}

/* ── dust slider ───────────────────────────────────────────── */
.gx-slider{ margin-top:clamp(22px,3.4vh,34px); }
.gx-slider__head{
  display:flex;
  justify-content:space-between;
  align-items:baseline;
  font-family:var(--font-mono);
  font-size:7px;
  letter-spacing:.2em;
  color:rgba(255,255,255,.36);
  margin-bottom:10px;
}
.gx-slider__head b{ color:var(--accent); font-weight:400; font-variant-numeric:tabular-nums; }
.gx-slider input[type=range]{
  -webkit-appearance:none;
  appearance:none;
  width:100%;
  height:26px;
  background:none;
  cursor:ew-resize;
  display:block;
}
.gx-slider input[type=range]::-webkit-slider-runnable-track{
  height:1px;
  background:linear-gradient(90deg, rgba(var(--accent-rgb),.55), rgba(255,255,255,.12));
}
.gx-slider input[type=range]::-webkit-slider-thumb{
  -webkit-appearance:none;
  width:11px; height:11px;
  margin-top:-5px;
  background:var(--accent);
  border-radius:1px;
  box-shadow:0 0 16px rgba(var(--accent-rgb),.8);
  transition:transform .2s;
}
.gx-slider input[type=range]:active::-webkit-slider-thumb{ transform:scale(1.35); }
.gx-slider input[type=range]::-moz-range-track{ height:1px; background:rgba(255,255,255,.2); }
.gx-slider input[type=range]::-moz-range-thumb{ width:11px;height:11px;border:0;border-radius:1px;background:var(--accent); }
.gx-slider__scale{
  display:flex;
  justify-content:space-between;
  font-family:var(--font-mono);
  font-size:6px;
  letter-spacing:.16em;
  color:rgba(255,255,255,.22);
  margin-top:2px;
}

/* ── band table ────────────────────────────────────────────── */
.bands{ margin-top:clamp(20px,3vh,30px); border-top:1px solid var(--gx-line); }
.band{
  display:grid;
  grid-template-columns:70px 1fr 62px;
  align-items:center;
  gap:12px;
  padding:9px 0;
  border-bottom:1px solid rgba(255,255,255,.05);
  font-family:var(--font-mono);
  font-size:6.8px;
  letter-spacing:.16em;
  color:rgba(255,255,255,.34);
}
.band em{ display:block; height:2px; background:rgba(255,255,255,.06); overflow:hidden; }
.band em i{
  display:block; height:100%;
  width:calc(var(--w) * 100%);
  background:linear-gradient(90deg, rgba(var(--accent-rgb),.3), rgba(var(--accent-rgb),.9));
}
.band b{ text-align:right; font-weight:400; color:rgba(255,255,255,.5); font-size:6px; }
.band.is-blocked b{ color:#ff8a6b; }
.band.is-blocked em i{ background:linear-gradient(90deg, rgba(255,138,107,.2), rgba(255,138,107,.75)); }

/* ── quote ─────────────────────────────────────────────────── */
.gx-quote{ margin-top:26px; padding-left:16px; border-left:1px solid rgba(var(--accent-2-rgb),.4); }
.gx-quote p{
  font-size:clamp(13px,1.15vw,16px);
  line-height:1.8;
  color:rgba(242,241,234,.6);
  font-family:"Songti SC","Source Han Serif SC",Georgia,serif;
}
.gx-quote span{
  display:block;
  margin-top:8px;
  font-family:var(--font-mono);
  font-size:6.5px;
  letter-spacing:.18em;
  color:rgba(255,255,255,.24);
}

/* ── system / manifest ─────────────────────────────────────── */
.manifest{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:1px;
  margin:clamp(26px,4.4vh,48px) 0 clamp(26px,4.4vh,44px);
  background:rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.07);
}
.manifest__cell{
  background:rgba(5,7,12,.82);
  padding:20px 18px 18px;
  display:flex;
  flex-direction:column;
  gap:8px;
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
}
.manifest__cell span{
  font-family:var(--font-mono);
  font-size:6.5px;
  letter-spacing:.2em;
  color:rgba(255,255,255,.28);
}
.manifest__cell b{
  font-family:var(--font-display);
  font-weight:300;
  font-size:clamp(30px,3.2vw,46px);
  line-height:1;
  letter-spacing:-.01em;
  color:#f2f1ea;
  font-variant-numeric:tabular-nums;
}
.manifest__cell b i{ font-style:normal; font-size:.4em; color:var(--accent); margin-left:3px; letter-spacing:.1em; }
.manifest__cell b.manifest__sm{ font-size:clamp(13px,1.3vw,18px); font-family:var(--font-mono); letter-spacing:.02em; }
.manifest__cell i{
  font-style:normal;
  font-family:var(--font-mono);
  font-size:6.4px;
  line-height:1.7;
  letter-spacing:.08em;
  color:rgba(255,255,255,.26);
}

.pipeline{
  margin-top:10px;
  border-top:1px solid var(--gx-line);
}
.pipeline__head{
  display:block;
  padding:14px 0 10px;
  font-family:var(--font-mono);
  font-size:6.5px;
  letter-spacing:.24em;
  color:rgba(var(--accent-rgb),.6);
}
.pipeline ol{ list-style:none; }
.pipeline li{
  display:grid;
  grid-template-columns:34px 190px 1fr;
  align-items:baseline;
  gap:16px;
  padding:11px 0;
  border-bottom:1px solid rgba(255,255,255,.05);
}
.pipeline li b{ font-family:var(--font-mono); font-size:7px; font-weight:400; color:rgba(255,255,255,.22); }
.pipeline li span{ font-family:var(--font-mono); font-size:8px; letter-spacing:.18em; color:rgba(242,241,234,.8); }
.pipeline li em{ font-style:normal; font-size:clamp(11px,.95vw,13px); color:rgba(255,255,255,.36); line-height:1.6; }

.system__foot{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  flex-wrap:wrap;
  margin-top:clamp(28px,4vh,44px);
  font-family:var(--font-mono);
  font-size:7px;
  letter-spacing:.18em;
  color:rgba(255,255,255,.28);
}

/* ═══════════════════════════ FOOTER ═══════════════════════════ */
.footer{
  position:relative;
  z-index:2;
  padding:clamp(80px,14vh,170px) var(--pad) 36px;
  background:linear-gradient(0deg, rgba(3,4,8,.98) 0%, rgba(3,4,8,.9) 44%, rgba(3,4,8,.3) 100%);
}
.footer__top{ display:block; max-width:900px; }
.footer__kicker{
  font-family:var(--font-mono);
  font-size:7px;
  letter-spacing:.24em;
  color:rgba(var(--accent-rgb),.6);
  margin-bottom:20px;
}
.footer__title{
  font-size:clamp(40px,6.4vw,104px);
  font-weight:300;
  line-height:1.02;
  letter-spacing:-.02em;
  margin-bottom:34px;
}
.footer__title em{ font-style:normal; -webkit-text-stroke:1px rgba(255,255,255,.4); color:transparent; }
.footer__row{ display:flex; gap:12px; flex-wrap:wrap; margin-bottom:clamp(50px,8vh,90px); }
.footer__grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:1px;
  background:rgba(255,255,255,.07);
  border-top:1px solid rgba(255,255,255,.07);
  border-bottom:1px solid rgba(255,255,255,.07);
}
.footer__grid div{ padding:18px 14px; display:flex; flex-direction:column; gap:7px; background:#04050a; }
.footer__grid span{ font-family:var(--font-mono); font-size:6.5px; letter-spacing:.2em; color:rgba(255,255,255,.25); }
.footer__grid b{ font-family:var(--font-mono); font-size:11px; font-weight:400; color:rgba(242,241,234,.8); letter-spacing:.04em; }
.footer__bottom{
  display:flex;
  align-items:center;
  gap:26px;
  flex-wrap:wrap;
  margin-top:26px;
  font-family:var(--font-mono);
  font-size:6.5px;
  letter-spacing:.16em;
  color:rgba(255,255,255,.22);
}
.footer__clock{ margin-left:auto; color:rgba(var(--accent-rgb),.5); }

/* mini-body chip is replaced by the telemetry rail — keep it out of the way */
#miniBody{ display:none !important; }

/* ═══════════════════════ RESPONSIVE ═══════════════════════ */
@media (max-width:1180px){
  .gx-telemetry{ width:196px; }
  .gx-hero__main{ width:min(64%,640px); }
}
@media (max-width:1024px){
  .gx-telemetry{ display:none; }
  .gx-hero__main{ width:min(88%,720px); }
  .gx-split,.gx-split--arms{ grid-template-columns:1fr; gap:36px; }
  .data-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .data:nth-child(4n){ border-right:1px solid rgba(255,255,255,.045); }
  .data:nth-child(2n){ border-right:0; }
  .manifest{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .footer__grid{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .chapter__index{ font-size:clamp(90px,26vw,180px); }
}
@media (max-width:760px){
  .gx-hero{ align-items:flex-end; padding-bottom:12px; }
  .gx-hero__main{ width:100%; }
  .gx-lede{ font-size:12.5px; line-height:1.75; }
  .gx-title__cn{ font-size:clamp(52px,16vw,92px); letter-spacing:.03em; }
  .gx-title__en{ font-size:clamp(15px,4.6vw,24px); letter-spacing:.3em; }
  .gx-title__no{ display:none; }
  .gx-label{ font-size:6px; padding:3px 5px; }
  .gx-label span{ display:none; }
  .gx-labels{ display:none; }
  .arm-row{ grid-template-columns:22px minmax(0,1fr) 66px 64px; gap:8px; }
  .arm-row__bar{ display:none; }
  .arm-row__name i{ display:none; }
  .pipeline li{ grid-template-columns:26px 1fr; gap:6px 10px; }
  .pipeline li em{ grid-column:2; }
  .manifest__cell b{ font-size:30px; }
  .system__foot{ font-size:6px; }
  .chapter{ padding-top:80px; padding-bottom:80px; }
  .footer__bottom{ font-size:6px; gap:12px; }
  .footer__clock{ margin-left:0; }
}
@media (max-width:520px){
  .data-grid{ grid-template-columns:1fr 1fr; }
  .manifest{ grid-template-columns:1fr; }
  .footer__grid{ grid-template-columns:1fr; }
  .gx-kicker{ font-size:6.5px; letter-spacing:.14em; }
  .gx-actions .btn{ flex:1 1 100%; justify-content:center; }
  .gx-privacy{ width:100%; }
}

@media (prefers-reduced-motion:reduce){
  .photon__ring,.photon__ring--b,.photon__core{ animation:none; }
  .chapter__inner{ transition:none; }
}
