/* The systems become visible. Motion is optional; the editorial content is not. */
:root{--ed-signal:#8bdee2;--ed-signal-dim:#456e76;--ed-metal:#233e47;--ed-motion-ease:cubic-bezier(.2,.7,.25,1)}
.ed-cover{position:relative;isolation:isolate;background:#0c2028;border-top-color:var(--ed-signal);box-shadow:inset 0 0 0 1px #8bdee21c;grid-template-columns:minmax(0,1fr) minmax(0,1.22fr)}
.ed-cover::after{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background-image:linear-gradient(#8bdee207 1px,transparent 1px),linear-gradient(90deg,#8bdee207 1px,transparent 1px);background-size:34px 34px;mask-image:linear-gradient(90deg,transparent 28%,#000 100%)}
.ed-cover .ed-kicker{color:#9cd8d9}
.ed-cover .ed-kicker::before{content:'';display:inline-block;width:5px;height:5px;margin-right:9px;vertical-align:2px;background:var(--ed-signal)}
.ed-cover-art{grid-column:2;grid-row:1;margin:0;align-self:center;min-width:0}
.ed-cover-signal{position:relative;aspect-ratio:8/5;width:100%;overflow:hidden;background:radial-gradient(ellipse at 55% 48%,#183d48,#0b2029 72%);border:0;border-radius:3px;touch-action:pan-y;isolation:isolate}
.ed-cover-signal::before,.ed-cover-signal::after{content:'';position:absolute;width:12px;height:12px;border-color:var(--ed-signal);border-style:solid;pointer-events:none;z-index:1}
.ed-cover-signal::before{top:-1px;left:-1px;border-width:1px 0 0 1px}
.ed-cover-signal::after{bottom:-1px;right:-1px;border-width:0 1px 1px 0}
.hero-fallback,.hero-canvas{display:block;width:100%;height:100%;position:absolute;inset:0;pointer-events:none}
.hero-fallback{object-fit:contain}
.hero-canvas{opacity:0}
.is-scene-ready .hero-canvas{opacity:1}
.is-scene-ready .hero-fallback{visibility:hidden}
.ed-cover-signal[role=button]{cursor:pointer;-webkit-tap-highlight-color:transparent}
.ed-cover-signal:focus-visible{outline:2px solid #9ee6e4;outline-offset:5px}
.ed-motion-toggle{display:inline-flex;align-items:center;gap:8px;min-width:44px;min-height:44px;cursor:pointer}
.ed-cover .ed-motion-toggle{font:400 11px/1.5 var(--ed-sans);color:#b6ced0;border:0;border-bottom:1px solid #8bdee22e;background:transparent;padding:0;margin-top:14px}
.ed-cover .ed-motion-toggle:hover{color:#f3f7ef;border-color:var(--ed-signal)}
.ed-motion-toggle svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.5}
.ed-motion-toggle[aria-pressed=true] .motion-play,.ed-motion-toggle[aria-pressed=false] .motion-pause{display:none}
.ed-motion-toggle[aria-disabled=true]{cursor:default;color:#95aeb2}
.ed-motion-toggle:focus-visible{outline:2px solid var(--ed-signal);outline-offset:5px}
.ed-footer .ed-motion-toggle[hidden],.ed-cover .ed-motion-toggle[hidden]{display:none}

/* Signals travel through the illustration; no invented telemetry or readings. */
.signal-route-highlight{animation:signal-travel 3.6s linear infinite;animation-play-state:paused}
.signal-data .signal-route-highlight{animation-duration:2.8s}
.signal-power .signal-route-highlight{animation-duration:4.2s}
.signal-cooling .signal-route-highlight{animation-duration:5.2s}
.signal-status circle{animation:signal-breathe 4.4s ease-in-out infinite;animation-play-state:paused}
.signal-status circle:nth-child(2n){animation-delay:-1.6s}
.signal-status circle:nth-child(3n){animation-delay:-3s}
.signal-processor{animation:signal-core-light 5.6s ease-in-out infinite;animation-play-state:paused}
html[data-motion=on] .ed-motion-scene[data-active=true] :is(.signal-route-highlight,.signal-status circle,.signal-processor){animation-play-state:running}
#main svg.ed-scene .s-flow{animation:ed-flow 2.8s linear infinite;animation-play-state:paused;stroke-dasharray:9 10}
html[data-motion=on] #main svg.ed-scene.ed-motion-scene[data-active=true] .s-flow{animation-play-state:running}
@keyframes signal-travel{to{stroke-dashoffset:-162}}
@keyframes signal-breathe{0%,100%{opacity:.55}50%{opacity:1}}
@keyframes signal-core-light{0%,100%{filter:brightness(1)}50%{filter:brightness(1.2)}}

/* A technical frame joins the film and Lab sections to the opening visual. */
.ed-cinema,.ed-instrument,.ed-watch{background-color:#10252d}
.ed-cinema .ed-section-head,.ed-instrument .ed-section-head{border-top-color:#8bdee248}
.ed-cinema .ed-section-head .ed-kicker,.ed-instrument .ed-section-head .ed-kicker{color:var(--ed-signal)}
.ed-lab-tile a{position:relative}
.ed-lab-tile a::after{content:'';position:absolute;left:0;top:0;width:20px;height:1px;background:var(--ed-signal);opacity:.65;pointer-events:none}
.ed-lab-tiles.is-index .ed-lab-tile a{border-color:#8bdee22e}
.ed-lab-tiles.is-index .ed-lab-tile:first-child a{border-top-color:var(--ed-signal)}
.ed-reading-progress{background:linear-gradient(90deg,#a64c31,#2d8a98)}
.ed-play::after{content:'';position:absolute;inset:-6px;border:1px solid #d8f2ee85;border-radius:50%;opacity:0;pointer-events:none}

@media(hover:hover) and (prefers-reduced-motion:no-preference){
  html[data-motion=on] #main .ed-pic-frame img{transition:transform 800ms var(--ed-motion-ease),opacity 220ms ease;will-change:auto}
  html[data-motion=on] #main :is(.ed-story-picture,.collection-picture,.ed-card-picture,.ed-film):hover .ed-pic-frame img{transform:scale(1.035)}
  html[data-motion=on] #main .ed-lab-tile>a{transition:background-color 250ms,border-color 250ms,transform 400ms var(--ed-motion-ease)}
  html[data-motion=on] #main .ed-lab-tile>a:hover{transform:translateY(-4px);border-color:#8bdee27a;background:#173740}
  html[data-motion=on] #main .ed-film:hover .ed-play::after{animation:kinetic-play-ring 1.8s ease-out infinite}
  html[data-motion=on] .ed-issue-spread{transition:transform 650ms var(--ed-motion-ease),box-shadow 650ms}
  html[data-motion=on] .ed-issue-spread:hover{transform:translateY(-5px) rotate(-.5deg);box-shadow:0 23px 50px -25px #10232988}
}
@keyframes kinetic-play-ring{0%{opacity:.6;transform:scale(.94)}85%,100%{opacity:0;transform:scale(1.2)}}

html[data-motion=off] #main :is(.ed-pic-frame img,.ed-lab-tile>a,.ed-issue-spread){transition:none}
html[data-motion=off] .ed-play::after{animation:none}
@media(max-width:760px){
  .ed-cover{grid-template-columns:1fr}
  .ed-cover-art{grid-column:1;grid-row:2;width:100%;margin-top:4px}
  .ed-cover-signal{aspect-ratio:8/5}
  .ed-cover-copy{padding-bottom:14px}
  .ed-cover .ed-motion-toggle{margin-top:8px}
}
@media(max-width:400px){.ed-cover-signal .signal-node text{font-size:32px}}
@media(max-width:360px){
  .ed-header .ed-brand img{width:138px}
  .ed-header .primary-nav{gap:14px}
  .ed-cover-signal .signal-node text{font-size:34px}
}
@media(orientation:landscape) and (max-height:520px){.ed-cover{grid-template-columns:1fr 1fr}.ed-cover-art{grid-column:2;grid-row:1;align-self:center}.ed-cover-signal{max-height:250px}}
@media(prefers-reduced-motion:reduce){
  .signal-route-highlight,.signal-status circle,.signal-processor,#main svg.ed-scene .s-flow{animation:none!important}
  #main :is(.ed-pic-frame img,.ed-lab-tile>a,.ed-issue-spread){transition:none!important;transform:none!important}
  .ed-play::after{animation:none!important}
}
