/* Игровая сцена выставки: CSS/SVG, реальные стадии и ограниченное число частиц. */
.exhibition { position: relative; isolation: isolate; }
.spacefield { position: fixed; inset: 0; z-index: -1; overflow: hidden; pointer-events: none; }
.space-nebula { position: absolute; width: 72vw; height: 80vh; border-radius: 50%; opacity: .5; animation: nebula-drift 32s ease-in-out infinite alternate; }
.space-nebula--gold { left: -38%; top: 12%; background: radial-gradient(ellipse, #a86b3b22, transparent 67%); }
.space-nebula--violet { right: -20%; top: -10%; background: radial-gradient(ellipse, #7258bc32, transparent 67%); animation-delay: -13s; }
.space-stars { position: absolute; inset: 0; width: 100%; height: 100%; }
.space-stars circle { fill: #e7dcfa; opacity: .45; animation: star-breathe 7s ease-in-out var(--star-delay) infinite; }
.space-orbit { position: absolute; border: 1px solid #b9a6f50b; border-radius: 50%; width: 90vw; height: 36vw; transform: rotate(-28deg); }
.space-orbit--one { left: 28%; top: 25%; }.space-orbit--two { left: 21%; top: 22%; transform: rotate(30deg); }
.masthead, main, footer { position: relative; }
.screen-stage { animation: screen-dock .68s cubic-bezier(.16,1,.3,1) both; }
.sector-jump { position: fixed; inset: 0; z-index: 30; pointer-events: none; overflow: hidden; opacity: 0; animation: sector-gate .8s ease-out both; }
.sector-jump[data-jump=welcome] { animation-duration: 1.1s; }
.jump-lens { position: absolute; inset: 0; background: radial-gradient(ellipse at 50% 44%, transparent 16%, #b9a6f51c 35%, #06071a66 67%, transparent 90%); }
.jump-ring { position: absolute; left: 50%; top: 45%; width: 36vmin; height: 36vmin; margin: -18vmin; border: 1px solid #e9c27a99; border-radius: 50%; box-shadow: 0 0 50px #e9c27a26, inset 0 0 30px #b9a6f526; animation: gate-open .85s cubic-bezier(.2,.65,.25,1) both; }
.jump-ring--two { border-color: #b9a6f577; animation-delay: .07s; }
.jump-streaks { position: absolute; left: 50%; top: 45%; width: 1px; height: 1px; }
.jump-streaks i { position: absolute; width: 70px; height: 1px; transform-origin: 0 0; background: linear-gradient(90deg, transparent, #e9c27acc); animation: jump-flight .72s var(--jump-delay) ease-out both; }
.mission-rail { margin: 24px auto 0; max-width: 840px; }
.mission-rail ol { display: flex; gap: 0; padding: 0; list-style: none; margin: 0; }
.mission-rail li { position: relative; flex: 1; display: flex; align-items: center; gap: 9px; padding: 10px 14px 10px 0; font: 10px/1.4 var(--mono); letter-spacing: .02em; color: var(--dim); }
.mission-rail li:not(:last-child)::after { content: ""; position: absolute; left: 38px; right: 12px; bottom: 0; height: 1px; background: linear-gradient(90deg, #b9a6f533, transparent); }
.mission-number { position: relative; width: 28px; height: 28px; display: grid; place-items: center; flex-shrink: 0; border: 1px solid #b9a6f52b; border-radius: 50%; background: #0b0c22; }
.mission-rail li.active { color: var(--gold-hi); }.mission-rail li.active .mission-number { color: #171125; background: var(--gold); border-color: var(--gold); box-shadow: 0 0 23px #e9c27a33; }
.mission-rail li.active .mission-number::after { content: ""; position: absolute; inset: -5px; border: 1px solid #e9c27a55; border-radius: 50%; animation: marker-pulse 3s ease-out infinite; }
.mission-rail li.past { color: #b9a6f5aa; }.mission-rail li.past .mission-number { border-color: #b9a6f566; }
.journey-building.flight-deck { max-width: 1250px; margin: 36px auto 24px; text-align: left; }
.flight-heading { display: flex; align-items: center; justify-content: space-between; gap: 25px; padding: 0 8px 24px; }
.flight-heading .eyebrow { font-size: 10px; margin: 0 0 12px; color: var(--gold); }
.flight-heading h1 { max-width: 820px; font-size: clamp(28px, 3.1vw, 42px); margin: 0; line-height: 1.18; }
.flight-clock { display: flex; flex-direction: column; gap: 6px; align-items: flex-end; flex-shrink: 0; }
.flight-clock span { color: var(--dim); font: 9px/1.6 var(--mono); text-transform: uppercase; letter-spacing: .1em; }
.flight-clock strong { color: var(--gold-hi); font: 26px/1.2 var(--mono); font-variant-numeric: tabular-nums; }
.flight-console { position: relative; display: grid; grid-template-columns: 220px minmax(0,1fr) 245px; align-items: stretch; border: 1px solid #b9a6f547; border-radius: 26px; padding: 20px; gap: 14px; background: linear-gradient(145deg, #15142bd9, #09091ae6 55%, #171228cc); box-shadow: inset 0 1px #eee0ff15, 0 30px 70px #0005, 0 0 80px #b9a6f50a; }
.flight-console::before, .flight-console::after { content: ""; position: absolute; width: 44px; height: 44px; pointer-events: none; border: 1px solid #e9c27a99; }
.flight-console::before { left: -1px; top: -1px; border-right: 0; border-bottom: 0; border-radius: 26px 0 0; }
.flight-console::after { right: -1px; bottom: -1px; border-left: 0; border-top: 0; border-radius: 0 0 26px; }
.flight-panel { position: relative; min-width: 0; padding: 20px 15px; border: 1px solid #b9a6f529; border-radius: 17px; background: linear-gradient(160deg, #24213a77, #0b0c2244); align-self: center; }
.flight-panel>.eyebrow { font: 9px/1.5 var(--mono); margin: 0 0 18px; letter-spacing: .12em; color: var(--lavender); }
.flight-systems .quest-stages { display: flex; flex-direction: column; gap: 12px; margin: 0; }
.flight-systems .quest-stages li { position: relative; border-radius: 12px; padding: 15px 11px; gap: 11px; background: #08091a80; font-size: 13px; min-height: 84px; }
.flight-systems .quest-stages li>div { min-width: 0; }
.flight-systems .quest-stages small { display: block; color: var(--dim); font-size: 10px; margin-top: 7px; line-height: 1.5; }
.flight-systems .quest-stage-number { width: 27px; height: 27px; font-size: 9px; }
.flight-systems .quest-stages li.current { border-color: #e9c27a80; box-shadow: -3px 0 #e9c27a, 0 0 25px #e9c27a09; background: linear-gradient(110deg, #e9c27a13, #0b0c2299); }
.flight-systems .quest-stages li.current::after { content: ""; position: absolute; inset: 0; border-radius: inherit; background: linear-gradient(100deg, transparent 10%, #e9c27a08 45%, transparent 80%); background-size: 250% 100%; animation: panel-signal 3.4s linear infinite; pointer-events: none; }
.flight-wave { height: 42px; display: flex; align-items: center; gap: 4px; margin-top: 30px; overflow: hidden; }
.flight-wave i { width: 5px; flex: 1; height: var(--wave-height); background: linear-gradient(0deg,#b9a6f522,#b9a6f5b3); border-radius: 2px; transform-origin: center; animation: signal-wave 3s ease-in-out var(--wave-delay) infinite; }
.flight-caption { font: 9px/1.65 var(--mono); color: var(--dim); margin: 10px 0 0; }
.flight-viewport { position: relative; display: flex; flex-direction: column; justify-content: center; min-width: 0; border-radius: 20px; overflow: hidden; background: radial-gradient(ellipse at 50% 45%, #3b2b5619, transparent 66%); }
.navigation-core { position: relative; width: 100%; aspect-ratio: 1; max-height: 500px; margin: auto; overflow: hidden; }
.nav-aura { position: absolute; inset: 14%; border-radius: 50%; background: radial-gradient(circle, #e9c27a16, #b9a6f50d 40%, transparent 70%); animation: reactor-breathe 7s ease-in-out infinite; }
.nav-floor { position: absolute; width: 78%; height: 28%; left: 11%; bottom: 7%; border: 1px solid #b9a6f525; border-radius: 50%; background: repeating-radial-gradient(ellipse, transparent 0 18px, #b9a6f50a 19px 20px); transform: perspective(400px) rotateX(55deg); box-shadow: 0 0 40px #b9a6f50a; }
.nav-sphere { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.nav-globe { filter: drop-shadow(0 0 20px #b9a6f51a); }
.nav-bearing, .nav-graticule, .nav-orbit, .nav-scan { transform-origin: 300px 300px; }
.nav-bearing { animation: bearing-turn 90s linear infinite; }
.nav-graticule { animation: globe-turn 36s linear infinite; }
.nav-orbit { stroke-width: 1.3; opacity: .85; animation: bearing-turn 20s linear infinite; }
.nav-orbit--two { animation-duration: 28s; animation-direction: reverse; opacity: .5; }
.nav-satellite { filter: drop-shadow(0 0 6px currentColor); }
.nav-probes { stroke-width: 1.2; stroke-dasharray: 5 12; opacity: .7; animation: probe-travel 4s linear infinite; }
.nav-waypoints g { animation: beacon-light 3.6s ease-in-out var(--beacon-delay) infinite; }
.nav-scan { stroke-linecap: round; opacity: .65; animation: bearing-turn 10s linear infinite; }
.nav-center { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 16px; pointer-events: none; }
.nav-reactor { position: relative; width: 29%; aspect-ratio: 1; display: grid; place-items: center; border-radius: 50%; background: radial-gradient(circle,#392e46,#131026 65%,#13102600 72%); box-shadow: 0 0 35px #e9c27a18; }
.nav-reactor::before, .nav-reactor::after { content: ""; position: absolute; inset: -8px; border: 1px solid #e9c27a40; border-radius: 50%; animation: reactor-ring 5s ease-in-out infinite; }
.nav-reactor::after { inset: -17px; border-color: #b9a6f529; animation-delay: -2.5s; }
.nav-reactor .brand-glyph { width: 68%; height: 68%; color: var(--gold); filter: drop-shadow(0 0 10px #e9c27a55); }
.nav-center>span { position: absolute; top: 65%; color: var(--gold-hi); font: 9px/1.5 var(--mono); letter-spacing: .16em; text-align: center; }
.nav-coordinate { position: absolute; font: 9px/1.5 var(--mono); letter-spacing: .14em; color: #b9a6f580; }
.nav-coordinate--one { left: 9%; top: 16%; }.nav-coordinate--two { right: 8%; bottom: 17%; color: #e9c27a80; }
.nav-sweep { position: absolute; inset: 0; background: linear-gradient(180deg, transparent 43%, #e9c27a04 48%, #e9c27a14 50%, transparent 54%); transform: translateY(-100%); animation: viewport-scan 8s linear infinite; pointer-events: none; }
.flight-live.quest-live { padding: 4px 8px 16px; min-height: 65px; font-size: 12px; line-height: 1.7; text-align: center; color: var(--gold-hi); }
.flight-brief .quest-goal { font-size: 17px; line-height: 1.7; color: var(--text); margin: 0; max-height: 175px; overflow: auto; scrollbar-width: thin; }
.flight-target-symbol { width: 42px; height: 42px; display: grid; place-items: center; font-size: 27px; color: var(--gold); border: 1px solid #e9c27a44; border-radius: 50%; margin: 20px 0; box-shadow: 0 0 20px #e9c27a0a; }
.flight-conditions { border-top: 1px solid #b9a6f526; padding-top: 18px; }
.flight-conditions .eyebrow { font-size: 9px; margin-bottom: 12px; color: var(--lavender); }
.flight-conditions p:not(.eyebrow) { font-size: 12px; line-height: 1.7; color: var(--muted); margin: 0; }
.flight-conditions dl { margin: 0; }.flight-conditions dl>div { display: flex; align-items: center; justify-content: space-between; gap: 15px; padding: 10px 0; }
.flight-conditions dt { font-size: 11px; color: var(--muted); }.flight-conditions dd { margin: 0; font: 23px/1.2 var(--mono); color: var(--gold-hi); }
.flight-vector { margin-top: 25px; padding-top: 18px; border-top: 1px solid #b9a6f522; }
.flight-vector svg { width: 100%; height: 65px; fill: #b9a6f5; stroke: #b9a6f5; stroke-width: 1; }.flight-vector path { fill: none; stroke-dasharray: 6 7; animation: probe-travel 6s linear infinite; }
.flight-footer { display: flex; align-items: center; justify-content: space-between; gap: 30px; padding: 24px 8px 0; }
.flight-footer p { font-size: 13px; color: var(--muted); margin: 0; line-height: 1.65; max-width: 710px; }.flight-footer p span { display: block; font: 10px/1.8 var(--mono); color: var(--dim); margin-top: 5px; }
.flight-cancel { display: inline-flex; align-items: center; gap: 12px; flex-shrink: 0; font-size: 13px; padding: 15px 20px; }.flight-cancel>span { font-size: 23px; line-height: 1; color: var(--gold); }
.flight-deck[data-phase=validate] .nav-scan { stroke: var(--gold); animation-duration: 16s; }.flight-deck[data-phase=validate] .nav-probes { stroke-dasharray: 2 4; opacity: 1; }
.flight-deck[data-phase=understand] .nav-graticule { stroke-opacity: .25; }.flight-deck[data-phase=generate] .nav-scan { animation-duration: 7s; }
.form-page:not(.operator), .finish-page, .export-page { position: relative; padding: 30px 36px; border: 1px solid #b9a6f52b; border-radius: 24px; background: linear-gradient(145deg,#20203d77,#0b0c2266); box-shadow: inset 0 1px #fff3d60c,0 24px 65px #0003; margin-top: 35px; }
.form-page:not(.operator)::before, .finish-page::before, .export-page::before { content: ""; position: absolute; top: 0; left: 32px; right: 32px; height: 1px; background: linear-gradient(90deg,transparent,#e9c27a88,transparent); }
.form-page textarea:focus { box-shadow: 0 0 0 3px #e9c27a09,0 0 35px #e9c27a09; }
.primary { position: relative; overflow: hidden; transition: background .25s, box-shadow .25s, transform .25s; }
.primary::after { content: ""; position: absolute; inset: -60% -30%; background: linear-gradient(110deg,transparent 35%,#fff7d233 49%,transparent 63%); transform: translateX(-140%); transition: transform .8s; pointer-events: none; }
.primary:hover::after, .primary:focus-visible::after { transform: translateX(140%); }.primary:hover:not(:disabled) { box-shadow: 0 0 36px #e9c27a24; transform: translateY(-2px); }
.primary:active:not(:disabled) { transform: translateY(1px) scale(.98); }
.welcome-art { position: relative; }.welcome-art::before { content: ""; position: absolute; inset: 15%; border-radius: 50%; background: radial-gradient(circle,#e9c27a15,#b9a6f50b 45%,transparent 70%); animation: reactor-breathe 9s ease-in-out infinite; }
.sphere-stars { animation: star-breathe 7s ease-in-out infinite; }.sphere-orbits { animation: sphere-orbit 18s ease-in-out infinite; }
.sample-grid button { position: relative; transition: transform .35s cubic-bezier(.16,1,.3,1),border-color .3s,box-shadow .3s; }
.sample-grid button:hover { transform: translateY(-5px); box-shadow: inset 0 1px #fff3d619,0 20px 35px #0005,0 0 28px #e9c27a0b; }.sample-grid button:hover .sample-icon { transform: rotate(-8deg) scale(1.1); }.sample-icon { transition: transform .35s; }
.graph-scroll { position: relative; box-shadow: inset 0 0 80px #06071a88,0 12px 36px #0002; }
.graph-world::after { content: ""; position: absolute; inset: 10px; pointer-events: none; border-radius: 40%; border: 1px solid #b9a6f51a; transform: rotate(7deg); }
.graph-edges>path { stroke-dasharray: 6 8; animation: probe-travel 18s linear infinite; }.graph-edges>path.lit { animation-duration: 5s; }.graph-edges>path.route-first { animation-duration: 9s; }
.graph-node { transition: border-color .25s, box-shadow .25s, background .25s; }
.graph-node[data-destination=true]::after { content: ""; position: absolute; right: 10px; top: 9px; width: 8px; height: 8px; background: var(--lavender); border-radius: 50%; box-shadow: 0 0 13px #b9a6f580; animation: star-breathe 4s ease-in-out infinite; pointer-events: none; }
.quest-summary { position: relative; overflow: hidden; }.quest-summary::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: var(--gold); box-shadow: 0 0 24px #e9c27a55; }
.quest-summary-icon { position: relative; }.quest-summary-icon::after { content: ""; position: absolute; inset: -6px; border: 1px solid #e9c27a26; border-radius: 50%; animation: marker-pulse 4s ease-out infinite; }
.drawer { animation: drawer-dock .35s cubic-bezier(.16,1,.3,1) both; border-color: #e9c27a55; }.drawer::before { content: ""; position: absolute; top: 0; left: 24px; width: 70px; height: 2px; background: var(--gold); box-shadow: 0 0 22px #e9c27a44; }
.first-step { position: relative; overflow: hidden; }.first-step::after { content: "✦"; position: absolute; right: 20px; top: 16px; font-size: 45px; color: #e9c27a22; pointer-events: none; animation: reactor-breathe 7s ease-in-out infinite; }
.export-preview { border-color: #e9c27a40; }.export-preview ol { counter-reset: preview; }.export-preview li { position: relative; }.share-link { border: 1px solid #86e3cb55; border-radius: 14px; padding: 18px; background: #86e3cb08; animation: drawer-dock .4s ease-out both; }
.guard-emblem { box-shadow: 0 0 0 8px #f8c98c04,0 0 40px #f8c98c0b; }
@keyframes screen-dock { from { opacity: .35; transform: translateY(24px) scale(.985); } to { opacity: 1; transform: none; } }
@keyframes sector-gate { 0% { opacity: 0; } 18% { opacity: .9; } 100% { opacity: 0; } }
@keyframes gate-open { from { transform: scale(.3); opacity: .1; } 25% { opacity: .7; } to { transform: scale(5); opacity: 0; } }
@keyframes jump-flight { from { transform: rotate(var(--bearing)) translateX(70px) scaleX(.2); opacity: 0; } 20% { opacity: .75; } to { transform: rotate(var(--bearing)) translateX(70vmax) scaleX(3); opacity: 0; } }
@keyframes nebula-drift { to { transform: translate(8%,-5%) scale(1.15); } }
@keyframes star-breathe { 50% { opacity: .2; } }
@keyframes marker-pulse { to { transform: scale(1.22); opacity: .2; } }
@keyframes bearing-turn { to { transform: rotate(360deg); } }
@keyframes globe-turn { to { transform: rotate(-360deg); } }
@keyframes probe-travel { to { stroke-dashoffset: -136; } }
@keyframes beacon-light { 50% { opacity: .25; } }
@keyframes reactor-breathe { 50% { opacity: .6; transform: scale(.97); } }
@keyframes reactor-ring { 50% { transform: scale(1.12); opacity: .4; } }
@keyframes viewport-scan { to { transform: translateY(100%); } }
@keyframes signal-wave { 50% { transform: scaleY(.35); opacity: .5; } }
@keyframes panel-signal { to { background-position: -250% 0; } }
@keyframes drawer-dock { from { opacity: .4; transform: translateX(18px); } to { opacity: 1; transform: none; } }
@media(max-width:1100px) { .flight-console { grid-template-columns: 185px minmax(0,1fr) 210px; padding: 15px; gap: 10px; }.flight-panel { padding: 17px 12px; }.flight-heading h1 { font-size: 32px; }.flight-systems .quest-stages li { padding: 13px 8px; font-size: 12px; gap: 8px; }.flight-brief .quest-goal { font-size: 14px; }.flight-console .eyebrow { letter-spacing: .06em; }.flight-clock strong { font-size: 23px; } }
@media(max-width:800px) { .flight-console { grid-template-columns: minmax(0,1fr) 220px; }.flight-systems { grid-column: 1/-1; grid-row: 2; }.flight-systems .quest-stages { display: grid; grid-template-columns: repeat(3,1fr); }.flight-systems .quest-stages li { min-height: 70px; }.flight-wave,.flight-caption { display: none; }.flight-viewport { min-height: 300px; }.flight-heading h1 { font-size: 29px; } }
@media(max-width:700px) { .screen-stage { animation-duration: .5s; }.mission-rail { margin-top: 17px; }.mission-rail li { flex-direction: column; align-items: center; text-align: center; gap: 7px; font-size: 8px; padding: 8px 2px 10px; }.mission-rail li:not(:last-child)::after { left: 35px; right: -12px; top: 22px; bottom: auto; }.mission-number { width: 25px; height: 25px; font-size: 9px; }.journey-building.flight-deck { margin-top: 24px; }.flight-heading { align-items: flex-start; gap: 15px; padding: 0 0 18px; }.flight-heading h1 { font-size: 24px; }.flight-clock span { max-width: 75px; text-align: right; font-size: 8px; }.flight-clock strong { font-size: 20px; }.flight-console { grid-template-columns: minmax(0,1fr); padding: 13px; border-radius: 21px; gap: 14px; }.flight-viewport { grid-row: 1; min-height: 0; }.navigation-core { max-width: 390px; }.flight-live.quest-live { font-size: 12px; min-height: 54px; padding-bottom: 8px; }.flight-systems { grid-row: 2; padding: 14px 10px; }.flight-panel>.eyebrow { margin-bottom: 12px; }.flight-systems .quest-stages { gap: 7px; }.flight-systems .quest-stages li { align-items: flex-start; flex-direction: column; padding: 10px 7px; font-size: 10px; gap: 8px; }.flight-systems .quest-stages small { font-size: 9px; line-height: 1.55; }.flight-systems .quest-stage-number { width: 24px; height: 24px; }.flight-brief { grid-row: 3; padding: 17px; }.flight-brief .quest-goal { max-height: 105px; font-size: 14px; }.flight-target-symbol,.flight-vector { display: none; }.flight-conditions { margin-top: 14px; padding-top: 14px; }.flight-conditions dl { display: flex; gap: 22px; }.flight-conditions dl>div { flex: 1; gap: 8px; padding: 3px 0; }.flight-conditions dt { font-size: 10px; }.flight-conditions dd { font-size: 20px; }.flight-footer { flex-direction: column-reverse; align-items: stretch; padding: 18px 0 0; gap: 18px; }.flight-cancel { justify-content: center; width: 100%; }.flight-footer p { font-size: 12px; }.form-page:not(.operator),.finish-page,.export-page { padding: 25px 19px; border-radius: 19px; margin-top: 25px; }.form-page h1,.finish-page h1,.export-page h1 { font-size: 29px; }.form-grid { grid-template-columns: minmax(0,1fr); }.primary:hover:not(:disabled),.sample-grid button:hover { transform: none; }.drawer { animation-name: drawer-dock; }.share-link { padding: 14px; }.jump-streaks i { width: 40px; } }
@media(min-width:801px) and (max-height:950px) { .journey-building.flight-deck { margin-top:24px; }.mission-rail { margin-top:14px; }.flight-heading { padding-bottom:18px; }.flight-heading h1 { font-size:32px; }.navigation-core { max-height:360px; }.flight-panel { padding-top:16px; padding-bottom:16px; }.flight-panel>.eyebrow { margin-bottom:12px; }.flight-systems .quest-stages li { min-height:70px; padding-top:11px; padding-bottom:11px; }.flight-wave { height:25px; margin-top:18px; }.flight-footer { padding-top:18px; } }
@media(prefers-reduced-motion:reduce) { .exhibition *, .exhibition *::before, .exhibition *::after { animation: none !important; transition: none !important; }.sector-jump { display: none; }.screen-stage { opacity: 1; transform: none; } }
html[data-space-paused=true] .exhibition *, html[data-space-paused=true] .exhibition *::before, html[data-space-paused=true] .exhibition *::after { animation-play-state: paused !important; }
