/* Storm Track: a compact chapter rail for the long-form experience. */
.storm-track { position: fixed; z-index: 34; right: 23px; top: 50%; display: grid; gap: 17px; padding: 16px 9px; border: 1px solid rgba(98, 231, 242, .2); border-radius: 4px; background: rgba(4, 18, 37, .68); box-shadow: 0 16px 40px rgba(0, 0, 0, .25); backdrop-filter: blur(13px); opacity: 0; transform: translate(25px, -50%); pointer-events: none; transition: opacity .35s ease, transform .35s ease; }
.storm-track.is-visible { opacity: 1; transform: translate(0, -50%); pointer-events: auto; }.storm-track-line { position: absolute; z-index: -1; top: 23px; bottom: 23px; left: 13px; width: 1px; background: rgba(105, 221, 237, .16); }.storm-track-line i { display: block; width: 100%; height: 100%; background: linear-gradient(var(--cyan), #808cff); box-shadow: 0 0 9px var(--cyan); transform: scaleY(var(--track-progress, 0)); transform-origin: top; transition: transform .2s linear; }.storm-track a { position: relative; display: flex; align-items: center; gap: 10px; color: #7795ad; text-decoration: none; font: 8px var(--mono); letter-spacing: .1em; text-transform: uppercase; }.storm-track a > i { width: 8px; height: 8px; border: 1px solid rgba(134, 235, 244, .42); border-radius: 50%; background: #081a31; transition: background .22s, box-shadow .22s, transform .22s; }.storm-track a span { position: absolute; right: 20px; padding: 5px 7px; white-space: nowrap; border: 1px solid rgba(95, 224, 237, .19); background: rgba(4, 18, 36, .88); opacity: 0; transform: translateX(7px); transition: opacity .2s, transform .2s; }.storm-track a:hover span, .storm-track a:focus-visible span { opacity: 1; transform: none; }.storm-track a.is-active > i { background: var(--cyan); box-shadow: 0 0 0 5px rgba(42, 229, 241, .1), 0 0 14px var(--cyan); transform: scale(1.2); }

/* Signal jump transition used by the rail and console navigation. */
.jump-flash { position: fixed; z-index: 70; inset: 0; overflow: hidden; pointer-events: none; visibility: hidden; }.jump-flash::before { content: ""; position: absolute; inset: 0; opacity: 0; background: radial-gradient(circle at 50% 50%, rgba(102, 249, 255, .22), transparent 42%); }.jump-flash i { position: absolute; top: -20%; bottom: -20%; left: -35%; width: 36%; background: linear-gradient(90deg, transparent, rgba(121, 252, 255, .28), rgba(225, 255, 255, .78), transparent); filter: blur(5px); transform: skewX(-15deg); }.jump-flash.is-active { visibility: visible; }.jump-flash.is-active::before { animation: jump-glow .62s ease both; }.jump-flash.is-active i { animation: jump-sweep .62s cubic-bezier(.3, .75, .25, 1) both; }

/* Persisted full/calm control inside the Storm Console. */
.console-motion-setting { position: absolute; right: 34px; bottom: 20px; display: flex; align-items: center; gap: 12px; color: #88a8bb; font: 8px var(--mono); letter-spacing: .1em; text-transform: uppercase; }.console-motion-setting > span { display: flex; align-items: center; gap: 7px; }.console-motion-setting > span i { width: 5px; height: 5px; border-radius: 50%; background: #4cf4ae; box-shadow: 0 0 9px #4cf4ae; }.motion-mode-toggle { position: relative; display: grid; grid-template-columns: 1fr 1fr; gap: 0; width: 94px; height: 27px; padding: 2px; border: 1px solid rgba(102, 224, 237, .25); color: #8faec0; background: rgba(5, 25, 46, .8); cursor: pointer; font: 7px var(--mono); }.motion-mode-toggle::before { content: ""; position: absolute; top: 2px; bottom: 2px; left: 2px; width: calc(50% - 2px); background: rgba(45, 222, 235, .18); box-shadow: inset 0 0 0 1px rgba(105, 243, 250, .23); transition: transform .25s ease; }.motion-mode-toggle[aria-checked="true"]::before { transform: translateX(100%); }.motion-mode-toggle b, .motion-mode-toggle em { position: relative; z-index: 1; display: grid; place-items: center; font: inherit; font-style: normal; }.motion-mode-toggle b { color: #d8ffff; }.motion-mode-toggle[aria-checked="true"] b { color: #7897a9; }.motion-mode-toggle[aria-checked="true"] em { color: #d8ffff; }

html.motion-calm { scroll-behavior: auto; } html.motion-calm *, html.motion-calm *::before, html.motion-calm *::after { animation-duration: .001ms!important; animation-iteration-count: 1!important; }
html.motion-calm .rain-field, html.motion-calm .lightning-flash, html.motion-calm .storm-network, html.motion-calm .cursor-aura { display: none!important; }
html.motion-calm .hero-aurora, html.motion-calm .free-hologram { opacity: .28; }

@keyframes jump-glow { 0%, 100% { opacity: 0; } 42% { opacity: 1; } } @keyframes jump-sweep { from { transform: translateX(0) skewX(-15deg); } to { transform: translateX(470%) skewX(-15deg); } }
@media (max-width: 900px) { .storm-track { display: none; }.console-motion-setting { right: 20px; } }
@media (max-width: 620px) { .console-motion-setting { right: 20px; bottom: 44px; }.console-hint { max-width: 230px; }.motion-mode-toggle { width: 84px; } }
@media (prefers-reduced-motion: reduce) { .storm-track { display: none; }.jump-flash { display: none; }.motion-mode-toggle { display: none; }.console-motion-setting > span { display: none; } }