/* ============================================================================
   PALMSTAT_NAVV2_V1 — module rail + contextual sidebar.
   Additive + reversible. Everything is gated behind body.nv2-on (added by
   js/nav-v2.js only after it successfully builds the rail). If the script is
   absent or errors, none of this applies and the classic sidebar shows.
   ========================================================================== */

/* Signature icon animations. Declared BEFORE .nv2-ico so the animation
   shorthand's implicit play-state:running is overridden by the paused rule
   that follows; hover / active re-enable it via higher-specificity selectors. */
@keyframes nv2Pulse  {0%,100%{transform:scale(1)}      50%{transform:scale(1.13)}}
@keyframes nv2Bob    {0%,100%{transform:translateY(0)} 50%{transform:translateY(-3px)}}
@keyframes nv2Swing  {0%,100%{transform:rotate(-9deg)} 50%{transform:rotate(9deg)}}
@keyframes nv2Tick   {0%,100%{transform:rotate(0)}     50%{transform:rotate(18deg)}}
@keyframes nv2Bounce {0%,100%{transform:translateY(0)} 30%{transform:translateY(-4px)} 60%{transform:translateY(0)}}
@keyframes nv2Drive  {0%,100%{transform:translateX(-2px)} 50%{transform:translateX(3px)}}
@keyframes nv2Spin   {to{transform:rotate(360deg)}}
@keyframes nv2Fade   {from{opacity:0;transform:translateY(4px)} to{opacity:1;transform:none}}
.nv2-a-pulse {animation:nv2Pulse 2.6s ease-in-out infinite}
.nv2-a-bob   {animation:nv2Bob   2.4s ease-in-out infinite}
.nv2-a-swing {animation:nv2Swing 2.8s ease-in-out infinite;transform-origin:50% 70%}
.nv2-a-tick  {animation:nv2Tick  2.2s ease-in-out infinite;transform-origin:50% 60%}
.nv2-a-bounce{animation:nv2Bounce 2.4s ease-in-out infinite}
.nv2-a-drive {animation:nv2Drive 2.2s ease-in-out infinite}
.nv2-a-spin  {animation:nv2Spin  6s   linear      infinite;transform-origin:50% 50%}

/* #nav becomes a two-column host: rail | contextual panel */
body.nv2-on #nav{display:flex;flex-direction:row;padding:0;overflow:hidden}

.nv2-rail{
  flex:0 0 84px;width:84px;display:flex;flex-direction:column;gap:2px;
  padding:8px 0;overflow-y:auto;scrollbar-width:thin;
  border-right:1px solid var(--border-subtle);
}
.nv2-mod{
  position:relative;display:flex;flex-direction:column;align-items:center;gap:4px;
  margin:0 6px;padding:9px 3px;border:0;border-radius:10px;background:transparent;
  color:var(--fg-secondary);cursor:pointer;font-family:inherit;white-space:nowrap;
  transition:background var(--t-fast) var(--ease),color var(--t-fast) var(--ease);
}
.nv2-mod:hover{background:var(--bg-hover);color:var(--fg-primary)}
.nv2-mod.is-active{background:var(--brand-bg-soft);color:var(--brand-fg)}
.nv2-mod.is-active::before{
  content:'';position:absolute;left:-6px;top:50%;transform:translateY(-50%);
  width:3px;height:60%;border-radius:0 3px 3px 0;background:var(--brand-500);
  box-shadow:0 0 8px rgba(63,166,111,.6);
}
.nv2-ico{width:24px;height:24px;display:grid;place-items:center;will-change:transform}
.nv2-ico svg{width:23px;height:23px;stroke:currentColor;fill:none}
/* Every rail icon animates continuously. Negative delays stagger them so the
   rail looks alive and organic instead of pulsing in unison. */
.nv2-mod:nth-of-type(1) .nv2-ico{animation-delay:-.10s}
.nv2-mod:nth-of-type(2) .nv2-ico{animation-delay:-.70s}
.nv2-mod:nth-of-type(3) .nv2-ico{animation-delay:-1.30s}
.nv2-mod:nth-of-type(4) .nv2-ico{animation-delay:-.40s}
.nv2-mod:nth-of-type(5) .nv2-ico{animation-delay:-1.00s}
.nv2-mod:nth-of-type(6) .nv2-ico{animation-delay:-1.60s}
.nv2-mod:nth-of-type(7) .nv2-ico{animation-delay:-.55s}
.nv2-mod:nth-of-type(8) .nv2-ico{animation-delay:-1.15s}
.nv2-mod:nth-of-type(9) .nv2-ico{animation-delay:-.85s}
.nv2-mod__lbl{font-size:.74rem;font-weight:700;letter-spacing:.01em;line-height:1.15;color:var(--fg-primary)}
/* vibrant labels — full-contrast in light, electric white (soft glow) in dark */
[data-theme="dark"] .nv2-mod__lbl{color:#fff;text-shadow:0 0 8px rgba(170,255,214,.5)}
@media (prefers-color-scheme:dark){:root:not([data-theme]) .nv2-mod__lbl{color:#fff;text-shadow:0 0 8px rgba(170,255,214,.5)}}

.nv2-panel{flex:1;min-width:0;overflow-y:auto;padding:6px 6px 12px;scrollbar-width:thin}
.nv2-modblock{display:none}
.nv2-modblock.is-shown{display:block;animation:nv2Fade .22s var(--ease)}
.nv2-panel__head{
  display:flex;align-items:center;gap:8px;
  font-size:.95rem;font-weight:700;letter-spacing:-.01em;color:var(--fg-primary);
  padding:12px 10px 8px;
}
.nv2-h-ico{width:18px;height:18px;display:grid;place-items:center;color:var(--brand-fg)}
.nv2-h-ico svg{width:18px;height:18px;stroke:currentColor;fill:none}
.nv2-sec{padding:2px 0 6px}
.nv2-sec__label{
  font-size:.6rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  color:var(--fg-tertiary);padding:10px 10px 4px;
}
/* rows are the original .nav-item anchors, moved in — they keep their styling */
.nv2-panel .nav-item{font-size:.84rem;margin:1px 0}

/* footer controls live in the sidebar, just above the user block */
.nv2-foot{
  display:flex;align-items:center;justify-content:space-between;gap:8px;
  padding:8px 12px;border-top:1px solid var(--border-subtle);
}
.nv2-motion{
  border:1px solid var(--border);background:var(--bg-input);color:var(--fg-secondary);
  font-family:inherit;font-size:.6rem;font-weight:700;letter-spacing:.02em;
  padding:4px 9px;border-radius:var(--r-pill);cursor:pointer;white-space:nowrap;
  transition:border-color var(--t-fast) var(--ease),color var(--t-fast) var(--ease);
}
.nv2-motion:hover{border-color:var(--brand-400);color:var(--fg-primary)}
.nv2-classic{
  border:0;background:transparent;color:var(--fg-tertiary);font-family:inherit;
  font-size:.62rem;cursor:pointer;text-decoration:underline;white-space:nowrap;
}
.nv2-classic:hover{color:var(--fg-primary)}

/* motion intensity (Balanced = default, no class). The mo-* class lives on #nav
   so it governs the rail icons AND the contextual panel's header icon. */
.mo-calm   .nv2-ico,.mo-calm   .nv2-h-ico{animation-duration:3.6s!important}
.mo-lively .nv2-ico,.mo-lively .nv2-h-ico{animation-duration:1.2s!important}
.mo-calm   .nv2-a-spin{animation-duration:9s!important}
.mo-lively .nv2-a-spin{animation-duration:3s!important}

@media (prefers-reduced-motion:reduce){.nv2-ico{animation:none!important}}
@media (max-width:980px){.nv2-rail{flex-basis:84px;width:84px}}