.lupi-logo{display:block;height:28px;width:auto;overflow:visible}
.lupi-logo .lg-scan{opacity:0}

/* Draw-in: trace each glyph in green, fill it, then land the dot. */
.lupi-logo--anim .lg-stroke{stroke-dasharray:1;stroke-dashoffset:1;animation:lg-draw .9s cubic-bezier(.65,0,.35,1) forwards,lg-fade .5s ease-out forwards}
.lupi-logo--anim .lg-fill{opacity:0;animation:lg-show .45s ease-out forwards}
.lupi-logo--anim .lg-d1{animation-delay:0s,.95s}.lupi-logo--anim .lg-fill.lg-d1{animation-delay:.6s}
.lupi-logo--anim .lg-d2{animation-delay:.12s,1.07s}.lupi-logo--anim .lg-fill.lg-d2{animation-delay:.72s}
.lupi-logo--anim .lg-d3{animation-delay:.24s,1.19s}.lupi-logo--anim .lg-fill.lg-d3{animation-delay:.84s}
.lupi-logo--anim .lg-d4{animation-delay:.36s,1.31s}.lupi-logo--anim .lg-fill.lg-d4{animation-delay:.96s}
.lupi-logo--anim .lg-core,.lupi-logo--anim .lg-ping{transform-box:fill-box;transform-origin:center}
.lupi-logo--anim .lg-core{transform:scale(0);animation:lg-land .55s cubic-bezier(.34,1.56,.64,1) 1.1s forwards}
.lupi-logo--anim .lg-ping{opacity:0;animation:lg-ping 1.6s cubic-bezier(0,0,.2,1) 1.5s infinite}
.lupi-logo--anim .lg-scan{animation:lg-scan 2.4s cubic-bezier(.45,0,.2,1) 1.4s infinite}
.lupi-logo--intro .lg-ping{animation-iteration-count:2}
.lupi-logo--intro .lg-scan{animation-iteration-count:1}
@keyframes lg-draw{to{stroke-dashoffset:0}}
@keyframes lg-fade{to{opacity:0}}
@keyframes lg-show{to{opacity:1}}
@keyframes lg-land{to{transform:scale(1)}}
@keyframes lg-ping{0%{opacity:.8;transform:scale(1)}100%{opacity:0;transform:scale(2.8)}}
@keyframes lg-scan{0%{opacity:1;transform:translateX(0)}85%{opacity:1}100%{opacity:0;transform:translateX(780px)}}

/* Loading screen */
.lupi-loader{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;text-align:center;color:var(--ink,#142230);opacity:0;animation:lg-show .3s ease-out .12s forwards}
.lupi-loader--page{min-height:62vh;padding:40px 16px}
.lupi-loader--card{min-height:240px;padding:24px 0;gap:14px}
.ll-stage{position:relative;display:grid;place-items:center;padding:26px 36px}
.ll-stage::before{content:"";position:absolute;inset:0;background-image:radial-gradient(color-mix(in srgb,var(--muted,#5b6675) 45%,transparent) 1px,transparent 1.3px);background-size:12px 12px;-webkit-mask-image:radial-gradient(ellipse at center,#000 10%,transparent 70%);mask-image:radial-gradient(ellipse at center,#000 10%,transparent 70%);opacity:.55;animation:ll-grid 3s ease-in-out infinite alternate}
.ll-stage .lupi-logo{position:relative;height:64px}
.lupi-loader--card .ll-stage{padding:18px 28px}
.lupi-loader--card .ll-stage .lupi-logo{height:46px}
.ll-track{position:relative;width:168px;height:2px;border-radius:2px;overflow:hidden;background:var(--line,#dde2e8)}
.ll-track span{position:absolute;inset:0 auto 0 0;width:38%;border-radius:2px;background:linear-gradient(90deg,transparent,#00BF63);box-shadow:0 0 8px #00BF63;animation:ll-track 1.25s cubic-bezier(.65,0,.35,1) infinite}
.ll-status{margin:0;display:flex;align-items:center;gap:8px;font:500 12.5px/1.4 'IBM Plex Mono',ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--muted,#5b6675);letter-spacing:.02em;min-height:18px}
.ll-prompt{color:#00BF63;font-weight:600}
.ll-caret{display:inline-block;width:7px;height:14px;background:#00BF63;animation:ll-blink 1s steps(1) infinite}
.ll-meta{margin:0;font:500 10.5px/1 'IBM Plex Mono',ui-monospace,Menlo,monospace;letter-spacing:.16em;text-transform:uppercase;color:var(--muted,#5b6675);opacity:.7}
.lupi-loader--card .ll-meta{display:none}
@keyframes ll-track{0%{transform:translateX(-100%)}100%{transform:translateX(270%)}}
@keyframes ll-blink{50%{opacity:0}}
@keyframes ll-grid{to{opacity:.9}}

/* Small inline "working" mark: the dot with a ping, for waiting states next to text. */
.lupi-pulse{position:relative;display:inline-block;width:10px;height:10px;flex:none}
.lupi-pulse::before,.lupi-pulse::after{content:"";position:absolute;inset:0;border-radius:50%;background:#00BF63}
.lupi-pulse::after{animation:lg-ping 1.4s cubic-bezier(0,0,.2,1) infinite}

/* Theme switcher */
.lupi-theme{display:inline-flex;gap:2px;padding:2px;border:1px solid var(--line,#dde2e8);border-radius:999px;background:transparent}
.lupi-theme button{display:grid;place-items:center;width:30px;height:26px;padding:0;border:0;border-radius:999px;background:transparent;color:var(--muted,#5b6675);cursor:pointer}
.lupi-theme button:hover{color:var(--ink,#142230)}
.lupi-theme button[aria-pressed="true"]{background:color-mix(in srgb,#00BF63 16%,transparent);color:var(--ink,#142230)}
.lupi-theme button:focus-visible{outline:2px solid #00BF63;outline-offset:1px}
.lupi-theme svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}

@media (prefers-reduced-motion:reduce){
  .lupi-logo--anim .lg-stroke,.lupi-logo--anim .lg-scan,.lupi-logo--anim .lg-ping{display:none}
  .lupi-logo--anim .lg-fill{opacity:1;animation:none}
  .lupi-logo--anim .lg-core{transform:none;animation:none}
  .lupi-loader{opacity:1;animation:none}
  .ll-stage::before,.ll-caret{animation:none}
  .ll-track span{animation:ll-still 1.6s ease-in-out infinite alternate;transform:translateX(80%)}
  .lupi-pulse::after{animation:none}
  @keyframes ll-still{from{opacity:.35}to{opacity:1}}
}