/* The emblem is layered: static ribbon X, rear/front ring, and three moving bodies. */
.orbit-navigation{position:relative;width:100%;max-width:560px;margin:0 auto;color:var(--text);isolation:isolate}.orbit-surface{position:relative;width:100%;height:196px}.orbit-brand{position:absolute;left:50%;top:50%;width:200px;height:200px;transform:translate(-50%,-50%) scale(.7);pointer-events:none}.emblem-canvas{position:relative;width:200px;height:200px;isolation:isolate}.emblem-x{position:absolute;inset:0;width:200px;height:200px;z-index:2}.emblem-ring{position:absolute;inset:0;width:200px;height:200px;pointer-events:none}.emblem-ring path{fill:none;stroke:#bc9ad3;stroke-width:2.4;stroke-linecap:round}.emblem-ring-back{z-index:0;opacity:.65}.emblem-ring-front{z-index:3}.emblem-ring-front path{stroke:#b99ace}
.logo-planet,.emblem-green-motion{position:absolute;left:0;top:0;offset-path:path('M180.999 63.623A85.327 19.936 -25 0 1 26.337 135.739A85.327 19.936 -25 0 1 180.999 63.623');offset-rotate:0deg;offset-anchor:50% 50%;animation:emblem-path var(--period) linear infinite,emblem-depth var(--period) step-end infinite;animation-delay:var(--delay);z-index:4}.emblem-purple{--period:30s;--delay:-4s;width:22px;height:22px;border-radius:50%;background-color:#9f80b4;background-image:url('/assets/xalorin-orbital-v2.png');background-size:200px 200px;background-position:-154px -80px;box-shadow:inset -1px -2px 3px #49385d66,inset 1px 1px 2px #ecddf633}.emblem-green-motion{--period:30s;--delay:-19s;width:16px;height:16px;isolation:isolate}.green-sphere{position:absolute;inset:0;border-radius:50%;background:radial-gradient(circle at 28% 24%,#9bb579,#617744 48%,#324b24 83%);box-shadow:inset -1px -1px 2px #213217aa;z-index:2}.green-moon-ring{position:absolute;left:-5px;top:3px;width:26px;height:9px;border:1px solid #c4a1d7;border-radius:50%;transform:rotate(-25deg);pointer-events:none}.moon-ring-back{z-index:0;clip-path:inset(0 0 50%)}.moon-ring-front{z-index:3;clip-path:inset(50% 0 0)}.logo-moon{position:absolute;left:0;top:0;width:4px;height:4px;border-radius:50%;background:radial-gradient(circle at 28% 25%,#fcf2d7,#cfc3a2);offset-path:path('M18.876 2.928A12 4 -25 0 1 -2.876 13.072A12 4 -25 0 1 18.876 2.928');offset-rotate:0deg;offset-anchor:50% 50%;animation:emblem-path 9s linear infinite,emblem-depth 9s step-end infinite;animation-delay:-3s;z-index:4}
.project-orbits{position:absolute;inset:0;margin:0 10px;border:0;pointer-events:none}.project-orbits::before{content:'';position:absolute;inset:7% 6%;border:1px solid rgba(187,155,223,.16);border-radius:50%;pointer-events:none}.orbit-project{pointer-events:auto;position:absolute;left:0;top:0;offset-path:ellipse(44% 43% at 50% 50%);offset-distance:var(--phase);offset-rotate:0deg;animation:project-path 84s linear infinite;animation-delay:var(--delay);width:46px;height:46px;min-height:46px;border:1px solid #736283!important;border-radius:50%!important;background:var(--bg,#171619)!important;color:var(--violet,#c6afd8)!important;display:flex!important;align-items:center;justify-content:center;padding:0!important;font:500 10px/1 var(--sans,system-ui)!important;letter-spacing:0;text-decoration:none;z-index:5;transition:border-color .2s,box-shadow .2s}.orbit-project.orbit-0{color:var(--moss)!important;border-color:#8e9e6a!important}.orbit-project.orbit-1{color:var(--blue)!important}.orbit-project.orbit-2{color:var(--amber)!important}.orbit-project:hover,.orbit-project:focus-visible{outline:2px solid currentColor;outline-offset:4px;box-shadow:0 0 16px #b997dc22}.orbit-control{position:absolute;right:0;bottom:-20px;display:flex;align-items:center;gap:6px;font:400 10px var(--sans,system-ui);color:var(--soft);min-height:44px;cursor:pointer}.orbit-control input{width:12px!important;min-height:12px!important;margin:0!important;padding:0!important;accent-color:var(--violet)}.orbit-caption{text-align:center;margin:0;padding:12px 110px 0;color:var(--soft);font:400 9px/1.7 var(--sans,system-ui);letter-spacing:.1em;text-transform:uppercase;pointer-events:none}.orbit-navigation:hover .orbit-project,.orbit-navigation:focus-within .orbit-project,.orbit-navigation:has(.orbit-pause:checked) *{animation-play-state:paused!important}
@keyframes emblem-path{from{offset-distance:0%}to{offset-distance:100%}}@keyframes project-path{from{offset-distance:0%}to{offset-distance:100%}}@keyframes emblem-depth{0%,49.999%{z-index:4}50%,100%{z-index:1}}
.hub .hub-title #dashboard-orbit .orbit-surface{height:196px}.hub .orbit-navigation .orbit-brand,.public-orbit .orbit-brand{transform:translate(-50%,-50%) scale(.7)}
@media(max-width:780px){.orbit-navigation{max-width:390px;margin-bottom:18px}.orbit-surface,.hub .hub-title #dashboard-orbit .orbit-surface{height:196px}.project-orbits{margin:0 6px}.orbit-project{width:44px;height:44px;min-height:44px;font-size:9px!important}.hub .orbit-navigation .orbit-brand,.public-orbit .orbit-brand{transform:translate(-50%,-50%) scale(.65)}.orbit-caption{padding:12px 80px 0;font-size:7px;letter-spacing:.07em}.orbit-control{font-size:9px;bottom:-22px}.orbit-control input{width:11px!important}}
.hub .orbit-navigation .orbit-control,.public-orbit .orbit-control{position:relative;inset:auto;margin:16px 0 0;justify-content:center;min-height:44px}.hub .orbit-navigation .orbit-caption,.public-orbit .orbit-caption{padding:0 0 6px}
@media(hover:none){.orbit-project{animation:none;offset-distance:var(--phase)}}
@media(prefers-reduced-motion:reduce){.orbit-navigation *,.orbit-navigation *::before,.orbit-navigation *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.orbit-project{offset-distance:var(--phase)}.emblem-purple{offset-distance:13.333%;z-index:4}.emblem-green-motion{offset-distance:63.333%;z-index:4}.logo-moon{offset-distance:33.333%;z-index:4}.orbit-control{display:none}}
/* v9 planets: shaded bodies with a label, depth along the orbit (front = bottom of the ellipse). */
.orbit-project{width:48px;height:48px;min-height:48px;border:0!important;background:transparent!important;flex-direction:column;gap:3px;animation:project-path 84s linear infinite,project-depth 84s linear infinite,project-layer 84s step-end infinite!important;animation-delay:var(--delay),var(--delay),var(--delay)!important;transform-origin:50% 50%}
.planet-body{position:relative;display:block;width:22px;height:22px;border-radius:50%;flex:none;
 background:radial-gradient(circle at 34% 30%,color-mix(in srgb,var(--planet) 55%,#fff) 0,var(--planet) 38%,color-mix(in srgb,var(--planet) 45%,#120f16) 78%,#0d0b10 100%);
 box-shadow:inset -3px -3px 6px #0b0a0e99,inset 1px 1px 2px #ffffff26,0 0 12px color-mix(in srgb,var(--planet) 35%,transparent);transition:transform .2s}
.planet-body::before{content:'';position:absolute;inset:0;border-radius:50%;background:repeating-linear-gradient(-28deg,transparent 0 5px,color-mix(in srgb,var(--planet) 70%,#000) 5px 6px);opacity:.18;mix-blend-mode:multiply}
.planet-body.has-ring::after{content:'';position:absolute;left:-8px;top:7px;width:36px;height:8px;border:1.5px solid color-mix(in srgb,var(--planet) 60%,#efe6d4);border-radius:50%;transform:rotate(-18deg);clip-path:polygon(0 45%,100% 45%,100% 100%,0 100%);opacity:.9}
.planet-label{font:600 8.5px/1 var(--sans,system-ui);letter-spacing:.06em;color:color-mix(in srgb,var(--planet) 75%,#f1ece4);text-shadow:0 1px 2px #000a;white-space:nowrap}
.orbit-project:hover .planet-body,.orbit-project:focus-visible .planet-body{transform:scale(1.18)}
.orbit-project:hover,.orbit-project:focus-visible{outline:none!important;box-shadow:none!important}
.orbit-project:focus-visible .planet-body{outline:2px solid var(--planet);outline-offset:3px}
.orbit-project.orbit-0,.orbit-project.orbit-1,.orbit-project.orbit-2{border-color:transparent!important}
/* ellipse() offset-path: 0% = right, 25% = bottom (front), 50% = left, 75% = top (back) */
/* `transform` is applied after the offset-path translation; the `scale` property is applied before it and would drag the planet off the ring. */
@keyframes project-depth{0%{transform:scale(.9);opacity:1}25%{transform:scale(1.08);opacity:1}50%{transform:scale(.9);opacity:1}75%{transform:scale(.8);opacity:.72}100%{transform:scale(.9);opacity:1}}
@keyframes project-layer{0%{z-index:5}50%{z-index:-1}}
.project-orbits::before{border-color:rgba(187,155,223,.12)}
@media(max-width:780px){.orbit-project{width:46px;height:46px;min-height:46px}.planet-body{width:20px;height:20px}.planet-label{font-size:8px}}
@media(hover:none){.orbit-project{animation:none!important;offset-distance:var(--phase);transform:none;opacity:1;z-index:5}}
@media(prefers-reduced-motion:reduce){.orbit-project{animation:none!important;offset-distance:var(--phase);transform:none;opacity:1;z-index:5}}
/* Keep the planet body exactly on the orbit ring: the body sits at the box centre (the offset anchor) and the label hangs below it. */
.orbit-project{justify-content:center;gap:0}
.orbit-project .planet-label{position:absolute;left:50%;top:calc(50% + 14px);transform:translateX(-50%)}
/* Room for the label of the planet at the front of the orbit. */
.project-orbits::before{inset:10% 6%}
.orbit-project{offset-path:ellipse(44% 40% at 50% 50%)}