:root {
  --qb-ease: cubic-bezier(.22, 1, .36, 1);
  --qb-ease-soft: cubic-bezier(.4, 0, .2, 1);
  --qb-cyan: #A9E4FF;
  --qb-violet: #C4B5FD;
  --qb-magenta: #F0ABFC;
}

html { scroll-behavior: smooth; }
.qb-page-nav { display:flex; flex-wrap:wrap; gap:12px 22px; padding:16px 0; margin-bottom:30px; border-bottom:1px solid #ffffff1f; font-size:12px; }
.qb-page-nav a { color:#A9E4FF; text-decoration:none; padding:8px 0; }
.qb-page-nav a[aria-current] { color:#fff; }

/* Ambient motion is decorative; the arrival ripple requires a new pulse ID. */
.liquid-aura {
  position: absolute; inset: -24px; pointer-events: none;
  background: conic-gradient(from 40deg, #A9E4FF44, #C4B5FD12, #F0ABFC44, #A9E4FF18, #A9E4FF44);
  border-radius: 44% 56% 61% 39% / 54% 43% 57% 46%;
  filter: blur(21px); opacity: .65;
  animation: qbLiquid 16s ease-in-out infinite alternate;
}
@keyframes qbLiquid {
  to { transform: rotate(95deg) scale(1.07); border-radius: 59% 41% 43% 57% / 40% 59% 41% 60%; opacity: .9; }
}
.pulse-arrival { position:absolute; inset:-8px; border-radius:50%; border:1px solid #A9E4FF; opacity:0; pointer-events:none; }
.qb-new-pulse .pulse-arrival { animation: qbArrival 1.6s ease-out both; }
.qb-new-pulse #ring-value { animation: qbValue .9s ease-out; }
@keyframes qbArrival { from {opacity:.65;transform:scale(.96)} to {opacity:0;transform:scale(1.38)} }
@keyframes qbValue { from {opacity:.3;filter:blur(3px)} to {opacity:1;filter:blur(0)} }
.ring-inner { background: radial-gradient(ellipse at 28% 20%, #A9E4FF0d, transparent 65%), #030508 !important; }
a:focus-visible, button:focus-visible { outline:2px solid #A9E4FF; outline-offset:5px; }
.feed-error .liquid-aura { opacity:.18; animation-play-state:paused; }
html.qb-hidden *, html.qb-hidden *::before, html.qb-hidden *::after { animation-play-state:paused !important; }
@media (prefers-reduced-motion: reduce) {
  .liquid-aura, .qb-new-pulse .pulse-arrival, .qb-new-pulse #ring-value { animation:none !important; }
  .liquid-aura { opacity:.4; }
}

@view-transition { navigation: auto; }
::view-transition-old(root) { animation: qbViewOut .35s var(--qb-ease-soft) both; }
::view-transition-new(root) { animation: qbViewIn .6s var(--qb-ease) both; }
@keyframes qbViewOut { to { opacity: 0; filter: blur(6px); transform: scale(.985); } }
@keyframes qbViewIn { from { opacity: 0; filter: blur(8px); transform: scale(1.012); } }

html.qb-js body { animation: qbPageIn .7s var(--qb-ease) both; }
@keyframes qbPageIn { from { opacity: 0; } to { opacity: 1; } }

html.qb-js .qb-reveal {
  opacity: 0;
  transform: translate3d(0, 28px, 0) scale(.985);
  filter: blur(6px);
  transition:
    opacity .9s var(--qb-ease) var(--qb-delay, 0ms),
    transform 1s var(--qb-ease) var(--qb-delay, 0ms),
    filter .9s var(--qb-ease) var(--qb-delay, 0ms);
  will-change: opacity, transform, filter;
}
html.qb-js .qb-reveal.qb-in { opacity: 1; transform: none; filter: none; }
html.qb-js .qb-reveal.qb-done { will-change: auto; }

#qb-progress {
  position: fixed; top: 0; left: 0; right: 0; height: 2px; z-index: 9999;
  transform-origin: 0 50%; transform: scaleX(0);
  background: linear-gradient(90deg, var(--qb-cyan), var(--qb-violet), var(--qb-magenta));
  box-shadow: 0 0 12px rgba(169, 228, 255, .55);
  pointer-events: none;
}

.qb-lift {
  transition: transform .5s var(--qb-ease), box-shadow .5s var(--qb-ease), border-color .5s var(--qb-ease);
}
.qb-lift:hover {
  transform: translate3d(0, -4px, 0);
  box-shadow: 0 18px 50px -18px rgba(169, 228, 255, .35), 0 0 0 1px rgba(196, 181, 253, .18);
}
.qb-spot {
  position: absolute; inset: 0; border-radius: inherit; pointer-events: none;
  background: radial-gradient(420px circle at var(--qb-mx, 50%) var(--qb-my, 50%),
              rgba(169, 228, 255, .10), rgba(196, 181, 253, .06) 35%, transparent 60%);
  opacity: 0; transition: opacity .45s var(--qb-ease);
}
.qb-lift:hover > .qb-spot { opacity: 1; }

hr.section-divider { position: relative; overflow: visible; }
hr.section-divider::after {
  content: ""; position: absolute; top: -1px; left: 0; height: 3px; width: 22%;
  background: linear-gradient(90deg, transparent, rgba(169, 228, 255, .7), rgba(240, 171, 252, .5), transparent);
  filter: blur(1px);
  animation: qbSweep 7s var(--qb-ease-soft) infinite;
}
@keyframes qbSweep {
  0% { transform: translateX(-30%); opacity: 0; }
  15% { opacity: 1; }
  85% { opacity: 1; }
  100% { transform: translateX(480%); opacity: 0; }
}

a, button { transition-property: color, background-color, border-color, box-shadow, transform, opacity; transition-duration: .35s; transition-timing-function: var(--qb-ease); }
button:active, .btn:active { transform: scale(.98); }

@keyframes qbFadeIn { from { opacity: 0; } }
@keyframes qbFadeOut { to { opacity: 0; } }

/* Reduced motion: keep the polish, drop the movement. Fades, glow, the
   spotlight and the progress line stay; slides, zoom, blur, lift and the
   continuous divider sweep go. */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  ::view-transition-old(root) { animation: qbFadeOut .2s ease both; }
  ::view-transition-new(root) { animation: qbFadeIn .3s ease both; }
  html.qb-js body { animation-duration: .35s; }
  html.qb-js .qb-reveal {
    transform: none; filter: none;
    transition: opacity .6s ease var(--qb-delay, 0ms);
  }
  .qb-lift:hover { transform: none; }
  hr.section-divider::after { animation: none; display: none; }
}