/* A stable text plane in front of illustrated depth and causal geometry. */
.dark-star-intro { --obs-paper:#f2e9d2; --obs-ink:#111e21; min-height:max(820px,100svh); background:#081316; }
.dark-star-intro__stage { background:#081316; }
.dark-star-intro__host canvas { touch-action:pan-y; }
[data-observatory="exploring"] .dark-star-intro__host canvas { touch-action:none; }
.observatory-world { position:absolute; inset:0; overflow:hidden; pointer-events:none; }
.observatory-world__sky { position:absolute; inset:0; background:radial-gradient(ellipse at 68% 34%,#233e43 0,#12282e 30%,#0b191f 65%,#080f13 100%); }
.observatory-world__layer { position:absolute; inset:-3%; transform:scale(1.06); transition:transform 1.4s cubic-bezier(.22,1,.36,1); }
.observatory-world__layer svg { width:100%; height:100%; }
.observatory-world__celestial { opacity:.65; }
.observatory-world__vault { opacity:.9; }
.observatory-world__floor { opacity:.85; }
.observatory-world__rail { opacity:.8; }
.observatory-world__mist { position:absolute; inset:0; background:radial-gradient(ellipse at 65% 64%,#81618d14 0,transparent 47%),linear-gradient(120deg,transparent 28%,#aecda309 35%,transparent 48%); }
[data-observatory="exploring"] .observatory-world__celestial { opacity:1; }
[data-observatory="exploring"] .observatory-world__mist { background:radial-gradient(ellipse at 66% 62%,#ac7ca21f 0,transparent 53%),linear-gradient(120deg,transparent 28%,#aecda314 35%,transparent 48%); }
.dark-star-intro__vignette { background:linear-gradient(180deg,#070e1266,transparent 20%,transparent 78%,#090e13 100%),linear-gradient(90deg,#07101444,transparent 30%,transparent 78%,#07101444); }
.dark-star-intro__grain { animation:none; opacity:.026; }
.dark-star-intro__copy { width:calc(100% - 128px); max-width:1500px; min-height:max(820px,100svh); padding:40px 0 104px; }
.dark-star-intro__kicker { color:#d8c398; font-size:10px; letter-spacing:.26em; }
html body .dark-star-intro .dark-star-intro__title { position:absolute; top:70px; left:0; margin:0; width:auto; max-width:80%; text-wrap:initial; text-shadow:0 2px 15px #071014; font:500 clamp(54px,6.3vw,102px)/.97 var(--dark-star-display); letter-spacing:-.055em; }
.dark-star-intro__title .dark-star-intro__line:first-child { overflow:visible; padding:0 0 8px; }
.dark-star-intro__title .dark-star-intro__line:nth-child(2) { font-size:clamp(20px,2.15vw,34px); letter-spacing:-.025em; font-weight:400; color:#eee6d2; }
.dark-star-intro__foot { margin-top:auto; align-items:center; background:linear-gradient(110deg,#152125,#121d21); border:1px solid #847550; border-bottom:3px solid #514732; padding:18px 24px; box-shadow:0 12px 35px #0007,inset 0 1px #ccbc8738; position:relative; }
.dark-star-intro__foot::before,.dark-star-intro__foot::after { content:'⊕'; position:absolute; top:8px; color:#9a8860; font-size:9px; }
.dark-star-intro__foot::before { left:6px; }.dark-star-intro__foot::after { right:6px; }
.dark-star-intro__truth { color:#f1eee0; font-size:11px; font-weight:500; line-height:1.6; letter-spacing:.025em; max-width:75ch; text-shadow:none; }
.dark-star-intro__truth [data-dark-star-status] { color:#f2d796; }
html[data-theme] .dark-star-intro__enter { color:#fff4d5!important; border-color:#ccb272; padding:12px 0 12px 24px; min-height:46px; }
.observatory-controls { position:absolute; z-index:5; bottom:36px; left:64px; right:64px; display:flex; gap:10px; align-items:center; pointer-events:none; }
.observatory-controls button { pointer-events:auto; }
.observatory-controls button { appearance:none; display:inline-flex; gap:10px; align-items:center; min-height:38px; padding:8px 12px; border:1px solid #8e87634d; background:#101c20ed; color:#e3dfcf; font:10px var(--dark-star-mono); letter-spacing:.08em; cursor:pointer; }
.observatory-controls button:hover,.observatory-controls button[aria-pressed=true] { border-color:#d4b76f; color:#ffe4ac; background:#243036; }
.observatory-controls button:focus-visible { outline:2px solid #fff0c1; outline-offset:4px; }
.observatory-controls__note { margin-left:auto; color:#a4b8b6; font:9px var(--dark-star-mono); letter-spacing:.13em; }
html[data-theme] .dark-star-intro__soundscape { background:#15252aea; color:#ffe7ae!important; border-color:#b6995b; }
.dark-star-intro .shape-root-network__button { background:#102027eb; border-color:#8c855d66; box-shadow:inset 0 0 0 4px #112027,0 8px 20px #0005; }
.dark-star-intro .shape-root-network__branches { opacity:.5; }
html body .dark-star-intro h1::after { display:none!important; }
html body .dark-star-intro .dark-star-intro__enter::after { content:''; width:7px; height:7px; border-right:1px solid currentColor; border-bottom:1px solid currentColor; transform:rotate(45deg); }
html body .dark-star-intro .shape-root-network__button { --root-accent:#c4ae77!important; border:0!important; border-top:1px solid #ad956066!important; border-bottom:1px solid #ad956066!important; background:#132329bb!important; box-shadow:none!important; color:#e1d7b9!important; }
html body .dark-star-intro .shape-root-network__button::before { display:none; }
html body .dark-star-intro .shape-root-network__button--triangle,html body .dark-star-intro .shape-root-network__button--gap { top:28%!important; }
html body .dark-star-intro .shape-root-network__button--dodecahedron,html body .dark-star-intro .shape-root-network__button--gomboc { top:60%!important; }
#cait-dark-star-intro .dark-star-intro__soundscape { translate:0 0; left:auto!important; right:64px!important; top:38px!important; color:#182122!important; background:#e6d6a6!important; border-color:#f5e8c3; font-size:11px; font-weight:700; letter-spacing:.08em; }
@media(max-width:700px) {
  .dark-star-intro,.dark-star-intro__copy { min-height:max(760px,100svh); }
  .dark-star-intro__copy { width:calc(100% - 56px); padding:26px 0 142px; }
  .dark-star-intro__kicker { font-size:7px; letter-spacing:.14em; }
  html body .dark-star-intro .dark-star-intro__title { top:55px; font-size:62px; max-width:100%; }
  .dark-star-intro__title .dark-star-intro__line:nth-child(2) { font-size:21px; }
  .dark-star-intro__foot { padding:16px; gap:12px; grid-template-columns:1fr; margin-bottom:0; }
  .dark-star-intro__truth { font-size:10px; max-width:none; }
  html[data-theme] .dark-star-intro__enter { font-size:9px; padding:8px 0 8px 12px; min-height:38px; }
  .observatory-controls { bottom:52px; left:28px; right:28px; flex-wrap:wrap; gap:8px; }
  .observatory-controls button { min-height:40px; font-size:9px; padding:8px 10px; }
  .observatory-controls__note { width:100%; margin:5px 0 0; font-size:8px; }
  .observatory-world__vault { opacity:.7; }
  #cait-dark-star-intro .dark-star-intro__soundscape { right:28px!important; top:169px!important; }
}
@media(max-height:480px) and (min-width:480px) {
  .dark-star-intro,.dark-star-intro__copy { min-height:363px; }
  .dark-star-intro__copy { width:calc(100% - 96px); padding:14px 0 58px; }
  html body .dark-star-intro .dark-star-intro__title { top:35px; left:0; font-size:38px; }
  .dark-star-intro__title .dark-star-intro__line:nth-child(2) { font-size:15px; }
  .dark-star-intro__foot { padding:8px 12px; display:grid; grid-template-columns:1fr auto; gap:10px; }
  .dark-star-intro__truth { font-size:8px; line-height:1.4; }
  html[data-theme] .dark-star-intro__enter { font-size:8px; padding:6px; }
  .observatory-controls { left:48px; right:48px; bottom:8px; }
  .observatory-controls__note { display:none; }
  #cait-dark-star-intro .dark-star-intro__soundscape { right:48px!important; top:14px!important; min-height:30px; }
}
@media(prefers-reduced-motion:reduce) {
  .observatory-world__layer { transition:none; transform:scale(1.06)!important; }
}