/* Landing-only art direction. Shared controls/flight effects remain in app.css. */
.landing { background: #020306; min-height: 100svh; overflow-x: clip; }
.landing .aurora { z-index: 0; background: radial-gradient(ellipse at 65% 35%, #17234d, #07081a 72%); }
.landing .aurora::before, .landing .aurora::after { content: none; }
.landing .space-stars { position: absolute; inset: 0; width: 100%; height: 100%; }
.landing .aurora-particles { opacity: 0.035; }
.landing .site-header { z-index: 5; position: absolute; inset: 0 0 auto; justify-content: flex-end; }
.landing .site-header .brand { display: none; }
.landing .site-nav .btn { color: #d2d6dc; border-color: #ffffff24; background: #080c1280; box-shadow: none; }
.landing .hero { position: relative; z-index: 1; padding: 0; min-height: 100svh; }
.landing .hero-inner { width: 100%; max-width: none; }
.landing .space-map { width: 100%; height: 100svh; min-height: 540px; margin: 0; }
.landing .space-target { display: flex; flex-direction: column; gap: 0; padding: 0; text-align: center; cursor: pointer; transform: none; filter: none; border-radius: 8px; }
.landing .target-projects { left: 8%; top: 32%; }
.landing .target-contact { right: 9%; top: 16%; }
.landing .space-target:hover { transform: none; filter: none; }
.landing .space-target:focus-visible { transform: none; filter: none; outline: 1px solid #c8d8e4; outline-offset: 8px; }
.landing .celestial { width: clamp(210px, 25vw, 330px); height: clamp(210px, 25vw, 330px); filter: none; animation: none; }
.landing .celestial-planet { filter: drop-shadow(0 0 18px #53ddff88) drop-shadow(0 0 42px #2464ff44); animation: none; }
.landing .celestial-planet::after { content: ''; position: absolute; inset: 14%; border-radius: 50%; pointer-events: none; box-shadow: 0 0 22px 5px #65ecff66, inset 8px 0 12px #bdfaff44; animation: planet-glow 3.2s ease-in-out infinite; }
.landing .celestial-blackhole .space-render { animation: none; transform: none; filter: drop-shadow(0 0 10px #ffbb7755); }
.landing .space-render { position: absolute; inset: 0; width: 100%; height: 100%; }
.landing .space-target-copy { padding: 10px 18px; min-height: 44px; color: #bec5cf; }
.landing .target-projects .space-target-copy { margin-top: -22%; }
.landing .target-contact .space-target-copy { margin-top: -12%; }
.landing .space-target-copy strong { font-size: 12px; font-weight: 600; letter-spacing: 0.16em; text-shadow: 0 2px 10px #000; }
.landing .space-target:hover .space-target-copy { color: #fff; }
.celestial-warp {
    position: fixed;
    inset: -20vmax;
    z-index: 20;
    pointer-events: none;
    opacity: 0;
    background:
        repeating-conic-gradient(from 0deg at var(--celestial-x) var(--celestial-y), transparent 0deg 1.8deg, rgba(202, 236, 255, 0.34) 2.1deg 2.35deg, transparent 2.8deg 6deg),
        radial-gradient(circle at var(--celestial-x) var(--celestial-y), rgba(255,255,255,0.52), rgba(122,218,255,0.18) 5%, rgba(5,9,35,0.07) 22%, transparent 46%);
    filter: blur(1px);
    transform: scale(0.08);
    transform-origin: var(--celestial-x) var(--celestial-y);
}
.landing.is-celestial-transition .celestial-warp { animation: celestial-warp 820ms cubic-bezier(0.12, 0.72, 0.24, 1) forwards; }
.landing.is-celestial-transition .space-map > :not(.is-celestial-zoom-target),
.landing.is-celestial-transition .site-header,
.landing.is-celestial-transition .hero-spaceship,
.landing.is-celestial-transition .space-stars {
    opacity: 0;
    filter: blur(12px);
    transition: opacity 260ms ease, filter 520ms ease;
}
.landing.is-celestial-transition .is-celestial-zoom-target {
    position: fixed;
    left: var(--celestial-x);
    top: var(--celestial-y);
    z-index: 21;
    margin: 0;
    transform: translate(-50%, -50%);
    transform-origin: center;
    pointer-events: none;
    animation: celestial-approach 820ms cubic-bezier(0.12, 0.72, 0.24, 1) forwards;
}
.landing.is-celestial-transition .is-celestial-zoom-target .space-target-copy { opacity: 0; transition: opacity 100ms ease; }
.landing.is-celestial-transition .is-celestial-zoom-target .celestial { animation: none; }
@keyframes celestial-approach {
    0% { transform: translate(-50%, -50%) scale(1); filter: blur(0); }
    35% { filter: blur(0.5px); }
    100% { transform: translate(calc(-50% + var(--celestial-shift-x)), calc(-50% + var(--celestial-shift-y))) scale(9); filter: blur(7px); }
}
@keyframes celestial-warp {
    0% { opacity: 0; transform: scale(0.08); filter: blur(0); }
    22% { opacity: 0.26; }
    100% { opacity: 0.94; transform: scale(1.25); filter: blur(5px); }
}
.landing .hero-actions { position: absolute; left: 50%; top: 76%; width: 0; min-height: 0; margin: 0; }
.landing .hero-spaceship { width: 50px; height: 60px; filter: none; }
.landing .hero-spaceship.is-boosting { filter: none; }
.landing .hero-spaceship.is-cursor-driven { z-index: 8; }
/* Broad material planes read at 50px; fine seams support close-up inspection.
    Shared craft details also style cloned enemies, without replacing their red livery. */
.landing :is(.hero-spaceship, .enemy-ship) :is(.fighter-wing, .fighter-body, .fighter-canopy, .fighter-cannon) { filter: none; }
.landing .hero-spaceship .fighter-wing { fill: url(#fighter-wing-metal); stroke: #9ba3aa; stroke-width: 0.65; }
.landing .hero-spaceship .fighter-body { fill: url(#fighter-metal); stroke: #aab1b7; stroke-width: 0.65; }
.landing .hero-spaceship .fighter-canopy { fill: url(#fighter-canopy-glass); stroke: #7d8d99; stroke-width: 0.7; }
.landing .hero-spaceship .fighter-engine { fill: url(#fighter-nacelle-metal); stroke: #707c88; stroke-width: 0.65; }
.landing .hero-spaceship .fighter-cannon { stroke: #687783; stroke-width: 3; }
.landing :is(.hero-spaceship, .enemy-ship) .fighter-canopy-shine { stroke: #dbe4e7; stroke-width: 0.8; opacity: 0.85; }
.landing .craft-frame { fill: #151d28; stroke: #56616d; stroke-width: 0.7; stroke-linejoin: bevel; }
.landing .craft-facet-light { fill: #e4e2d9; opacity: 0.48; }
.landing .craft-facet-dark { fill: #111a27; opacity: 0.55; }
.landing .craft-recess { fill: #0a111c; stroke: #4b5866; stroke-width: 0.65; }
.landing .craft-edge { fill: none; stroke: #d3d6d5; stroke-width: 0.75; }
.landing .craft-gun-mount { fill: url(#fighter-nacelle-metal); stroke: #26313e; stroke-width: 0.7; }
.landing .craft-barrel-edge { fill: none; stroke: #d3d7d7; stroke-width: 0.65; }
.landing .craft-muzzle { fill: none; stroke: #151d27; stroke-width: 1.5; }
.landing .craft-root-shadow { fill: #050b13; opacity: 0.85; }
.landing .craft-nose-plane { fill: #bbc1c6; stroke: #e1e0da; stroke-width: 0.45; }
.landing .craft-spine { fill: #83909d; }
.landing .craft-intake-lip { fill: none; stroke: #b9c2c8; stroke-width: 1; }
.landing .craft-engine-cowl { fill: url(#fighter-nacelle-metal); stroke: #444f5c; stroke-width: 0.6; }
.landing .craft-panel-seam { fill: none; stroke: #202b38; stroke-width: 0.8; stroke-linejoin: bevel; }
.landing .craft-nozzle { fill: #141d28; stroke: #7b8791; stroke-width: 0.7; }
.landing .craft-nozzle-ribs { fill: none; stroke: #697987; stroke-width: 0.7; }
.landing .craft-canopy-seat { fill: #0a1019; stroke: #79848f; stroke-width: 0.8; }
.landing .craft-glass-reflection { fill: #c4d7df; opacity: 0.29; }
.landing .craft-glass-frame { fill: none; stroke: #172735; stroke-width: 0.8; }
.landing .craft-fasteners { fill: none; stroke: #d0d1cb; stroke-width: 0.8; }
.landing .craft-service-mark { fill: none; stroke: #bba888; stroke-width: 1.2; }
.landing .enemy-ship :is(.craft-engine-cowl, .craft-gun-mount) { fill: #482731; }
.landing .enemy-ship .craft-service-mark { stroke: #ff8790; }
/* Only exhaust receives emitted light; flight/boost animation remains shared. */
.landing .hero-spaceship.is-thrusting .fighter-thrust { filter: drop-shadow(0 0 2px #278ac7); }
.landing .hero-spaceship.is-thrusting .fighter-thrust-core { filter: drop-shadow(0 0 1px #d9efff); }
/* CSS-only fallback: the same real object links survive unavailable canvas/JS. */
.landing .celestial:not(.is-rendered)::before { content: ''; position: absolute; border-radius: 50%; }
.landing .celestial-planet:not(.is-rendered)::before { inset: 25%; background: radial-gradient(circle at 25% 26%, #aab5b1, #3a4d52 42%, #070b12 73%); box-shadow: -1px -1px 2px #acc4d154; }
.landing .celestial-blackhole:not(.is-rendered)::before { inset: 38%; background: #000; box-shadow: 0 0 2px 2px #e1bc89, 0 0 15px #b4774544; }
.landing .celestial-blackhole:not(.is-rendered)::after { content: ''; position: absolute; inset: 42% 8%; border: 3px solid #bb9768; border-radius: 50%; transform: rotate(-12deg); }
@keyframes planet-glow { 0%, 100% { opacity: 0.48; transform: scale(0.96); } 50% { opacity: 0.9; transform: scale(1.04); } }
@media (max-width: 760px) {
    .landing .space-map { min-height: 650px; }
    .landing .celestial { width: clamp(190px, 54vw, 260px); height: clamp(190px, 54vw, 260px); }
    .landing .target-projects { left: 1%; top: 12%; }
    .landing .target-contact { right: 1%; top: 52%; }
    .landing .hero-spaceship { width: 45px; height: 54px; }
    .landing .space-target-copy { padding-top: 0; }
}
@media (max-height: 550px) and (min-width: 600px) {
    .landing .space-map { min-height: 390px; }
    .landing .celestial { width: 220px; height: 220px; }
    .landing .target-projects { top: 20%; left: 10%; }
    .landing .target-contact { top: 13%; right: 10%; }
}
@media (prefers-reduced-motion: reduce) {
    .landing *, .landing *::before, .landing *::after { animation: none !important; transition: none !important; }
    .landing .enemy-ship, .landing .aurora-particles { display: none; }
    .landing .celestial-planet::after { animation: planet-glow 10s ease-in-out infinite !important; }
}

/* ========================================================================== 
   Solar-system navigation — the canvas owns the artwork; links are hotspots
   ========================================================================== */
.solar-system .solar-system-render { position: absolute; inset: 0; width: 100%; height: 100%; }
.solar-system .aurora-particles { display: none; }
.solar-system .hero-actions { display: none; }
.solar-system .space-target { position: absolute; z-index: 3; display: block; width: 130px; height: 130px; padding: 0; }
.solar-system .target-projects { left: calc(27% - 65px); top: calc(64% - 65px); }
.solar-system .target-contact { right: auto; left: calc(75% - 65px); top: calc(28% - 65px); }
.solar-system .celestial { display: block; width: 100%; height: 100%; }
.solar-system .celestial::before, .solar-system .celestial::after { content: none; }
.solar-system.is-celestial-transition .solar-system-render {
    position: fixed;
    inset: 0;
    z-index: 19;
    transform-origin: var(--celestial-x) var(--celestial-y);
    animation: solar-camera-approach 820ms cubic-bezier(0.12, 0.72, 0.24, 1) forwards;
}
.solar-system .space-target-copy {
    position: absolute;
    left: 50%; bottom: -25px;
    width: max-content; min-height: 0; padding: 0.35rem 0.6rem;
    color: #eef7ff; background: rgba(3, 8, 22, 0.58); border: 1px solid rgba(175, 220, 255, 0.24);
    border-radius: 3px; opacity: 0; transform: translateX(-50%) translateY(4px);
    transition: opacity 160ms ease, transform 160ms ease;
}
.solar-system .space-target:hover .space-target-copy,
.solar-system .space-target:focus-visible .space-target-copy { opacity: 1; transform: translateX(-50%) translateY(0); }
.solar-system .space-target:focus-visible { outline: 1px solid #b9eaff; outline-offset: 7px; }
.solar-system.is-celestial-transition .is-celestial-zoom-target .celestial { width: 100%; height: 100%; }
@keyframes solar-camera-approach {
    0% { transform: translate3d(0, 0, 0) scale(1); filter: blur(0); }
    100% { transform: translate3d(var(--celestial-shift-x), var(--celestial-shift-y), 0) scale(9); filter: blur(5px); }
}
@media (max-width: 760px) {
    .solar-system .space-target { width: 96px; height: 96px; }
    .solar-system .target-projects { left: calc(23% - 48px); top: calc(63% - 48px); }
    .solar-system .target-contact { left: calc(75% - 48px); top: calc(32% - 48px); }
}