/* NelsonStack motion layer. Loaded after command.css on authenticated pages.
   Every effect is progressive: without JS or with reduced motion the page is static and complete. */
:root{--glow:rgba(141,185,255,.16);--jade:#57d39b;--ease-out:cubic-bezier(.16,1,.3,1);--ease-spring:cubic-bezier(.34,1.56,.64,1)}
@property --sweep{syntax:'<angle>';inherits:false;initial-value:0deg}

/* Cross-document page transitions (Chromium, Safari 18+); other browsers navigate normally. */
@view-transition{navigation:auto}
::view-transition-old(root){animation:vt-out .22s var(--ease-out) both}
::view-transition-new(root){animation:vt-in .42s var(--ease-out) both}
@keyframes vt-out{to{opacity:0;transform:translateY(-6px);filter:blur(3px)}}
@keyframes vt-in{from{opacity:0;transform:translateY(10px);filter:blur(4px)}}
.command-nav{view-transition-name:rail}

/* Ambient signal field, painted by motion.js behind the page. */
.signal-field{position:fixed;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;opacity:0;transition:opacity 1.2s ease}
.signal-field.on{opacity:1}
body.command .shell{position:relative;z-index:1}
body.command .command-nav{z-index:30}
.visually-hidden{position:absolute!important;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}

/* Navigation glider */
.command-nav{isolation:isolate}
.nav-glider{position:absolute;z-index:-1;left:0;top:0;border-radius:9px;background:#253147;box-shadow:inset 2px 0 var(--signal),0 0 24px -6px rgba(141,185,255,.45);transition:transform .45s var(--ease-spring),width .45s var(--ease-spring),height .45s var(--ease-spring),opacity .2s;pointer-events:none}
.command-nav.has-glider>a[aria-current]{background:none;box-shadow:none}
.command-nav.has-glider>a:hover{background:none}
.command-nav>a>span{transition:transform .35s var(--ease-spring)}
.command-nav>a:hover>span{transform:translateY(-2px) scale(1.08)}
@media(max-width:760px){.nav-glider{box-shadow:inset 0 2px var(--signal)}}

/* Hero */
.hero{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:40px;margin:4px 0 38px}
.hero-kicker{display:flex;align-items:center;gap:10px;margin:0;text-transform:uppercase}
.hero-kicker span:last-child{color:var(--ink-soft);letter-spacing:.08em}
.pulse-dot{position:relative;width:7px;height:7px;border-radius:50%;background:var(--jade);flex:none}
.pulse-dot::after{content:"";position:absolute;inset:-5px;border-radius:50%;border:1px solid var(--jade);animation:pulse-ring 2.4s var(--ease-out) infinite}
@keyframes pulse-ring{from{transform:scale(.4);opacity:.9}to{transform:scale(1.8);opacity:0}}
.hero-title{font-family:var(--serif);font-weight:400;font-size:clamp(3.4rem,7.2vw,6.6rem);letter-spacing:-.06em;line-height:.98;margin:18px 0 18px}
.hero-title .ch{display:inline-block;will-change:transform}
html.motion .hero-title .ch{animation:ch-rise 1s var(--ease-out) both;animation-delay:calc(var(--i) * 55ms + 120ms)}
@keyframes ch-rise{from{opacity:0;transform:translateY(.55em) rotate(4deg);filter:blur(10px)}}
.hero-title .ch-dot{color:var(--signal)}
.hero .hero-copy{max-width:none;font-size:inherit;color:inherit;margin:0}
.hero-lede{color:var(--ink-soft);font-size:1rem;line-height:1.65;max-width:520px;margin:0 0 28px}
html.motion .hero-lede,html.motion .hero-kicker{animation:fade-up .9s var(--ease-out) both .5s}
html.motion .hero-kicker{animation-delay:0s}
@keyframes fade-up{from{opacity:0;transform:translateY(12px)}}
.hero-stats{display:flex;flex-wrap:wrap;gap:10px}
.hero-stat{display:flex;align-items:baseline;gap:9px;padding:11px 16px 11px 14px;min-height:44px;border:1px solid var(--line);border-radius:999px;background:rgba(26,28,34,.72);backdrop-filter:blur(8px);text-decoration:none;color:var(--muted);font-size:.74rem;transition:border-color .3s,transform .4s var(--ease-spring),background .3s}
.hero-stat strong{color:var(--ink);font-size:1.15rem;font-weight:500;letter-spacing:-.04em;font-variant-numeric:tabular-nums}
.hero-stat:hover{border-color:#4d6a96;background:rgba(37,49,71,.8);transform:translateY(-2px)}
html.motion .hero-stat{animation:fade-up .8s var(--ease-out) both;animation-delay:calc(var(--i,0) * 90ms + .7s)}

/* Orbit clock */
.orbit{position:relative;width:236px;aspect-ratio:1;margin:0;flex:none}
.orbit svg{width:100%;height:100%;overflow:visible;transform:rotate(-90deg)}
.orbit-halo{fill:rgba(20,24,32,.6);stroke:#2a3140;stroke-width:1}
.orbit-ticks line{stroke:#46506a;stroke-width:1.2;stroke-linecap:round}
.orbit-track{fill:none;stroke:#252a35;stroke-width:6}
.orbit-day{fill:none;stroke:url(#orbit-day);stroke-width:6;stroke-linecap:round;transition:stroke-dashoffset 2.2s var(--ease-out)}
.orbit-habits{fill:none;stroke:#6f9ee8;stroke-width:6;stroke-linecap:round;opacity:.75;transition:stroke-dashoffset 1.8s var(--ease-out) .4s}
.orbit-habits.complete{stroke:var(--jade);opacity:1}
.orbit-comet{fill:#e6efff;filter:drop-shadow(0 0 6px #8db9ff) drop-shadow(0 0 2px #fff);transform-origin:110px 110px;transition:transform 2.2s var(--ease-out)}
.orbit-dash{fill:none;stroke:#39425a;stroke-width:1;stroke-dasharray:2 5;transform-origin:110px 110px;animation:spin 90s linear infinite}
.orbit-sweep{transform-origin:110px 110px;animation:spin 60s linear infinite;animation-delay:var(--sweep-delay,0s)}
.orbit-sweep line{stroke:rgba(141,185,255,.5);stroke-width:1}
.orbit-sweep circle{fill:var(--signal)}
@keyframes spin{to{transform:rotate(360deg)}}
.orbit figcaption{position:absolute;inset:0;display:grid;place-content:center;text-align:center;gap:2px;pointer-events:none}
.orbit figcaption strong{font-family:var(--serif);font-weight:400;font-size:2.35rem;letter-spacing:-.04em;line-height:1;font-variant-numeric:tabular-nums}
.orbit figcaption span{font-size:.6rem;letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}
.orbit figcaption small{font-size:.62rem;color:#8ea6cc;margin-top:6px}
html.motion .orbit{animation:orbit-in 1.4s var(--ease-out) both .15s}
@keyframes orbit-in{from{opacity:0;transform:scale(.86) rotate(-25deg)}}

/* Scroll reveals (hidden state only exists once motion.js has opted in). */
html.motion .reveal,html.motion .reveal-group>*{opacity:0;transform:translateY(22px);transition:opacity .8s var(--ease-out),transform .9s var(--ease-out);transition-delay:calc(var(--i,0) * 80ms)}
html.motion .reveal.in,html.motion .reveal-group>.in{opacity:1;transform:none}
html.motion .reveal:not(.in),html.motion .reveal-group>:not(.in){animation:reveal-failsafe 0s 3.5s forwards}
@keyframes reveal-failsafe{to{opacity:1;transform:none}}

/* Pointer spotlight + tilt */
[data-spotlight]{position:relative;isolation:isolate;transition:transform .5s var(--ease-out),border-color .3s}
[data-spotlight]::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;background:radial-gradient(420px circle at var(--mx,50%) var(--my,-40%),var(--glow),transparent 60%);opacity:0;transition:opacity .4s;pointer-events:none}
[data-spotlight]:hover::before{opacity:1}
[data-spotlight]:hover{border-color:#46526a}
.card[data-spotlight]{overflow:hidden}

/* Focus panel: rotating conic edge and a slow scanline */
.focus-panel{position:relative;border-color:transparent;background:linear-gradient(#1b2535,#1a2231) padding-box,conic-gradient(from var(--sweep),#364863 0deg,#364863 250deg,#8db9ff 300deg,#364863 350deg) border-box;border:1px solid transparent;animation:sweep 7s linear infinite}
@keyframes sweep{to{--sweep:360deg}}
.focus-scan{position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(180deg,transparent,rgba(141,185,255,.07) 48%,transparent 52%);background-size:100% 240%;animation:scan 9s ease-in-out infinite}
@keyframes scan{0%,100%{background-position:0 110%}50%{background-position:0 -10%}}
.focus-panel h2{transition:letter-spacing .6s var(--ease-out)}
.habit-meter{display:flex;gap:4px;align-items:center}
.habit-meter i{width:14px;height:4px;border-radius:2px;background:#33415a;transform-origin:left}
.habit-meter i.on{background:var(--jade)}
html.motion .habit-meter i.on{animation:meter .7s var(--ease-spring) both;animation-delay:calc(var(--i,0) * 110ms + .9s)}
@keyframes meter{from{transform:scaleX(0)}}

/* Buttons */
.btn[data-magnetic]{transition:transform .35s var(--ease-spring),filter .2s,box-shadow .3s}
.btn[data-magnetic]:hover{box-shadow:0 8px 26px -10px rgba(141,185,255,.7)}
.btn[data-magnetic] span{display:inline-block;transition:transform .35s var(--ease-spring)}
.btn[data-magnetic]:hover span{transform:translateX(4px)}

/* Vitals: sparkline draw, trailing pulse, count-up */
.sparkline polyline{stroke-dasharray:var(--len,0);stroke-dashoffset:0}
html.motion .sparkline.draw polyline{animation:draw 1.6s var(--ease-out) both;animation-delay:calc(var(--i,0) * 140ms)}
@keyframes draw{from{stroke-dashoffset:var(--len,0)}}
.sparkline .area{stroke:none}
html.motion .sparkline.draw .area{animation:fade-in 1.4s ease both .6s}
@keyframes fade-in{from{opacity:0}}
.spark-head{fill:#dfeaff;filter:drop-shadow(0 0 5px #8db9ff)}
.spark-ring{fill:none;stroke:#8db9ff;stroke-width:1.2;transform-box:fill-box;transform-origin:center;animation:spark-ping 2.2s var(--ease-out) infinite}
@keyframes spark-ping{from{transform:scale(1);opacity:.9}to{transform:scale(4);opacity:0}}
.vital-card{transition:transform .5s var(--ease-out)}
html.motion [data-health] .vital-card{animation:fade-up .8s var(--ease-out) both;animation-delay:calc(var(--i,0) * 110ms)}

/* Odometer digits */
.odo{display:inline-flex;overflow:hidden;height:1.15em;line-height:1.15em;vertical-align:bottom}
.odo-col{display:flex;flex-direction:column;transition:transform 1.6s var(--ease-out);transition-delay:calc(var(--i,0) * 120ms)}
.odo-col span{height:1.15em}
.momentum-strip a{position:relative;transition:background .3s}
.momentum-strip a::after{content:"";position:absolute;left:20px;right:20px;bottom:0;height:2px;border-radius:2px;background:var(--signal);transform:scaleX(0);transform-origin:left;transition:transform .5s var(--ease-out)}
.momentum-strip a:hover{background:#1c2029}
.momentum-strip a:hover::after{transform:scaleX(1)}

/* Loading shimmer and widget arrival */
.loading{background:linear-gradient(90deg,var(--muted) 0 40%,#e6eeff 50%,var(--muted) 60% 100%) 0 0/300% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:shimmer 1.8s linear infinite}
@keyframes shimmer{from{background-position:100% 0}to{background-position:-50% 0}}
.arrived>*{animation:fade-up .7s var(--ease-out) both}
.arrived>*:nth-child(2){animation-delay:.06s}.arrived>*:nth-child(3){animation-delay:.12s}.arrived>*:nth-child(4){animation-delay:.18s}
.arrived .timeline li{animation:fade-up .6s var(--ease-out) both;animation-delay:calc(var(--i,0) * 70ms + .15s)}
.app-shortcut{transition:background .25s,padding .35s var(--ease-out)}
.app-shortcut:hover{padding-left:6px}
.app-shortcut span[aria-hidden]{display:inline-block;transition:transform .35s var(--ease-spring)}
.app-shortcut:hover span[aria-hidden]{transform:translate(3px,-3px)}
.compact-work>a strong{transition:color .25s}
.compact-work>a:hover strong{color:#c2d9ff}

@media(max-width:1100px){.orbit{width:200px}.hero{gap:24px}}
@media(max-width:760px){
 .hero{grid-template-columns:minmax(0,1fr) 116px;gap:14px;margin:0 0 26px;align-items:start}
 .hero-copy{display:contents}
 .hero-kicker{grid-column:1/-1;font-size:.6rem}.kicker-label{display:none}
 .hero-title{grid-column:1;grid-row:2;font-size:clamp(3rem,15vw,4.2rem);margin:6px 0 0;align-self:center}
 .orbit{grid-column:2;grid-row:2;width:116px}
 .orbit figcaption strong{font-size:1.25rem}.orbit figcaption span{font-size:.48rem;letter-spacing:.14em}.orbit figcaption small{display:none}
 .hero-lede{grid-column:1/-1;font-size:.86rem;margin:0}
 .hero-stats{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
 .hero-stat{flex-direction:column;gap:2px;border-radius:12px;padding:10px 12px;font-size:.62rem;line-height:1.35}
}
@media(prefers-reduced-motion:reduce){.focus-scan,.orbit-sweep,.orbit-dash,.pulse-dot::after,.spark-ring{display:none}.loading{color:var(--muted);background:none}}
.momentum-strip strong span{font-size:1em;color:inherit}
