/* The Nexus logo (_nx_logo.html) and mark (_nx_mark.html): loaded by base.html AND the
   standalone War Room. Ink is the page's --text; accent and "pop" are the brand file's
   light / dark values (nexus-final-animated.html). */
.nxl,.nx{--nx-ink:var(--text);--nx-acc:#f0b861;--nx-pop:#e59a80;--nx-bg:var(--surface)}
[data-theme="light"] .nxl,[data-theme="light"] .nx,
[data-theme="warm"] .nxl,[data-theme="warm"] .nx{--nx-acc:#e49c45;--nx-pop:#7f311c}
.nxl{display:block;width:min(300px,100%);height:auto}
.nxl-ink{fill:var(--nx-ink)}.nxl-ink-s{stroke:var(--nx-ink)}.nxl-acc{fill:var(--nx-acc)}.nxl-acc-s{stroke:var(--nx-acc)}
.nxl-bg{fill:var(--nx-bg)}.nxl-pop{fill:var(--nx-pop)}
.nxl-bar,.nxl-dot,.nxl-swing,.nxl-twk,.nxl-turn{transform-box:fill-box}

/* Sign-in and splash: builds once; then the badge's tools keep working and the spark loops. */
.nxl-bar{transform-origin:50% 100%;animation:nxl-bar .9s cubic-bezier(.2,.8,.2,1) both}
.nxl-diag{stroke-dasharray:100;animation:nxl-diag .7s ease-out .3s both}
.nxl-dot{transform-origin:50% 50%;animation:nxl-dot .45s ease-out .85s both}
.nxl-ltr{animation:nxl-t .3s ease-out both}
.nxl-d1{animation-delay:1.25s}.nxl-d2{animation-delay:1.45s}.nxl-d3{animation-delay:1.65s}.nxl-d4{animation-delay:1.85s}
.nxl-pill{animation:nxl-pill .7s ease-out 2.1s both}
.nxl-swing{transform-origin:15% 100%;animation:nxl-sw 1.4s ease-in-out infinite alternate}
.nxl-twk{transform-origin:50% 50%;animation:nxl-tw 1.2s ease-in-out infinite alternate}
.nxl-turn{transform-origin:50% 85%;animation:nxl-tn 1.5s ease-in-out infinite alternate}
.nxl-fall{animation:nxl-fl 1.4s ease-in infinite}
@keyframes nxl-bar{from{transform:scaleY(0)}to{transform:scaleY(1)}}
@keyframes nxl-diag{from{stroke-dashoffset:100}to{stroke-dashoffset:0}}
@keyframes nxl-dot{0%{transform:scale(0)}70%{transform:scale(1.25)}100%{transform:scale(1)}}
@keyframes nxl-t{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@keyframes nxl-pill{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes nxl-sw{from{transform:rotate(-18deg)}to{transform:rotate(22deg)}}
@keyframes nxl-tw{from{transform:scale(.55);opacity:.5}to{transform:scale(1.15);opacity:1}}
@keyframes nxl-tn{from{transform:rotate(-14deg)}to{transform:rotate(14deg)}}
@keyframes nxl-fl{0%{transform:translateY(0);opacity:0}15%{opacity:1}100%{transform:translateY(9px);opacity:0}}
@media(prefers-reduced-motion:reduce){.nxl *{animation:none!important}.nxl-trav,.nxl-rip{display:none}}

/* In the sidebar the logo is still: built once per session (and on hover), never looping. */
.nxl-brand{width:min(176px,100%);--nx-bg:var(--bg-2,var(--bg))}   /* the War Room has no --bg-2 */
.nxl-brand *{animation:none !important}
.nxl-brand .nxl-trav,.nxl-brand .nxl-rip{display:none}
.nxl-brand.play .nxl-bar{animation:nxl-bar .7s cubic-bezier(.2,.8,.2,1) both !important}
.nxl-brand.play .nxl-diag{animation:nxl-diag .6s ease-out .25s both !important}
.nxl-brand.play .nxl-dot{animation:nxl-dot .45s ease-out .7s both !important}
.nxl-brand.play .nxl-ltr{animation:nxl-t .35s ease-out both !important}
.nxl-brand.play .nxl-d1{animation-delay:.55s !important}.nxl-brand.play .nxl-d2{animation-delay:.65s !important}
.nxl-brand.play .nxl-d3{animation-delay:.75s !important}.nxl-brand.play .nxl-d4{animation-delay:.85s !important}
.nxl-brand.play .nxl-pill{animation:nxl-pill .5s ease-out 1s both !important}
@media(prefers-reduced-motion:reduce){.nxl-brand.play *{animation:none !important}}

/* The mark alone (collapsed sidebar); its build animation is in app.css (.nx.play). */
.nx-bar{fill:var(--nx-ink)}.nx-diag{stroke:var(--nx-acc)}.nx-dot{fill:var(--nx-acc)}