body,
body * {
  font-style: normal !important;
}

img[data-wuwa-webp-fallback-installed] {
  transition: opacity 320ms cubic-bezier(0.16, 1, 0.3, 1);
}

img[data-wuwa-webp-state="loading-fallback"] {
  opacity: 0.52;
}

.wuwa-copy-refresh {
  animation: wuwa-copy-refresh 340ms cubic-bezier(0.16, 1, 0.3, 1) both;
}

@keyframes wuwa-copy-refresh {
  from {
    opacity: 0.38;
  }
  to {
    opacity: 1;
  }
}

@media (prefers-reduced-motion: reduce) {
  .wuwa-copy-refresh {
    animation-duration: 1ms !important;
  }
}

html,
body,
html.index-page,
.index-page body {
  background-color: var(--color-bg, #201f1d) !important;
}

body:has(.wuwa-drift-wall) {
  isolation: isolate;
}

.footer-copyright > span:nth-of-type(3) {
  display: none;
}

.wuwa-page-transition {
  background: var(--color-bg, #201f1d);
  display: block;
  inset: 0;
  opacity: 0;
  pointer-events: none;
  position: fixed;
  transform: scale(1.015);
  transition:
    opacity 220ms cubic-bezier(0.4, 0, 0.2, 1),
    transform 360ms cubic-bezier(0.16, 1, 0.3, 1),
    visibility 0s linear 360ms;
  visibility: hidden;
  will-change: opacity, transform;
  z-index: 2147483000;
}

.wuwa-page-transition.is-active {
  opacity: 1;
  pointer-events: auto;
  transform: scale(1);
  transition:
    opacity 180ms cubic-bezier(0.4, 0, 1, 1),
    transform 260ms cubic-bezier(0.4, 0, 0.2, 1),
    visibility 0s linear 0s;
  visibility: visible;
}

.wuwa-page-transition.is-committed {
  opacity: 1 !important;
  pointer-events: auto !important;
  transform: scale(1) !important;
  transition: none !important;
  visibility: visible !important;
}

/* The persistent custom surface owns every transition. Keeping Serenity's
   native layer hidden prevents two independent GIF timelines from overlapping. */
html[data-wuwa-page-transition] #page-transition {
  opacity: 0 !important;
  pointer-events: none !important;
  visibility: hidden !important;
}

/* Pack details are assembled behind the shared gate. Hold every structural
   entrance while waiting, then let the ready state start the /archives motion. */
body:has([data-wuwa-emoji-feed][data-wuwa-ready="waiting"]) :is(
  .post-hero,
  .post-main,
  .post-content,
  .wuwa-pack-hero-footer,
  .wuwa-pack-hero-excerpt,
  .wuwa-video-intro,
  .post-sidebar,
  .post-sidebar .sidebar-widget
) {
  animation: none !important;
  opacity: 1 !important;
  transform: none !important;
}

/* The initialization/transition surface owns the page reveal. Keep the mounted
   detail structure settled so data readiness cannot start a second entrance. */
body:has([data-wuwa-emoji-feed][data-wuwa-mounted="true"]) :is(
  .post-hero,
  .post-main,
  .post-content,
  .wuwa-pack-hero-footer,
  .wuwa-pack-hero-excerpt,
  .wuwa-video-intro,
  .post-sidebar,
  .post-sidebar > .sidebar-widget
) {
  animation: none !important;
  opacity: 1 !important;
  transform: none !important;
}

@keyframes wuwa-archive-section-enter {
  from {
    opacity: 0;
    transform: translate3d(0, 100px, 0);
  }
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

/* Match the article column's native inset instead of letting the sidebar touch
   the hero's top and right edges. Opposing inline margins preserve its width. */
@media (min-width: 1025px) {
  body:has([data-wuwa-emoji-feed][data-wuwa-mounted="true"]) .post-layout > .post-sidebar {
    margin: 0.75rem 1.5rem 0 -1.5rem;
  }
}

#wuwa-page-transition:is(.is-active, .is-committed) {
  display: block;
}

#wuwa-page-transition:is(.is-active, .is-committed) .wuwa-infinite-gallery-transition-gif {
  display: block;
  max-height: 120px;
  max-width: 120px;
  object-fit: contain;
}

html:not([data-wuwa-archive-state="ready"]) body:has(.archive-layout .archive-list) #pjax-main {
  min-height: 400vh;
  opacity: 0 !important;
  pointer-events: none;
  visibility: visible;
}

html[data-wuwa-archive-state] {
  overflow-anchor: none;
}

/* Native entrance transforms must not move the browser's restored viewport. */
html:has(.about-hero),
html:has(.links-hero),
html:has([data-wuwa-character-atlas-page="true"]),
html:has(#wuwa-character-atlas) {
  overflow-anchor: none;
}

html[data-wuwa-archive-state] #wuwa-page-transition {
  display: block;
}

html[data-wuwa-archive-state] #wuwa-page-transition .wuwa-infinite-gallery-transition-gif {
  display: block;
  max-height: 120px;
  max-width: 120px;
  object-fit: contain;
}

.wuwa-archive-loading-status {
  align-items: center;
  color: var(--color-text-secondary, #aaa5b5);
  display: flex;
  flex-direction: column;
  font-size: 0.86rem;
  font-weight: 700;
  gap: 0.75rem;
  left: 50%;
  letter-spacing: 0.04em;
  max-width: calc(100vw - 2rem);
  position: absolute;
  text-align: center;
  top: calc(50% + 4rem);
  transform: translateX(-50%);
  width: max-content;
}

.wuwa-archive-loading-status button {
  background: color-mix(in srgb, var(--color-accent, #b79b55) 14%, transparent);
  border: 1px solid color-mix(in srgb, var(--color-accent, #b79b55) 56%, transparent);
  border-radius: 999px;
  color: var(--color-text, #f3f0f5);
  cursor: pointer;
  font: inherit;
  padding: 0.5rem 1.1rem;
  transition:
    background-color 240ms cubic-bezier(0.16, 1, 0.3, 1),
    border-color 240ms cubic-bezier(0.16, 1, 0.3, 1),
    transform 360ms cubic-bezier(0.16, 1, 0.3, 1);
}

.wuwa-archive-loading-status button:is(:hover, :focus-visible) {
  background: color-mix(in srgb, var(--color-accent, #b79b55) 24%, transparent);
  border-color: var(--color-accent, #b79b55);
  outline: none;
  transform: translateY(-0.1rem) scale(1.025);
}

#wuwa-page-transition .wuwa-infinite-gallery-transition-gif {
  display: none;
  /* One containing block and one center throughout PJAX route handoff. */
  inset: 50% auto auto 50%;
  margin: 0;
  position: absolute;
  transform: translate(-50%, -50%);
}

html[data-wuwa-gallery-loading="true"] #wuwa-page-transition {
  display: block;
}

html[data-wuwa-gallery-loading="true"] #wuwa-page-transition .wuwa-infinite-gallery-transition-gif {
  display: block;
  max-height: 120px;
  max-width: 120px;
  object-fit: contain;
}

html[data-wuwa-page-ready-gates~="character-atlas"] #wuwa-page-transition {
  display: block;
}

html[data-wuwa-page-ready-gates~="character-atlas"] #wuwa-page-transition .wuwa-infinite-gallery-transition-gif {
  display: block;
  max-height: 120px;
  max-width: 120px;
  object-fit: contain;
}

html[data-wuwa-page-transition="leaving"] #pjax-main {
  opacity: 0;
  transform: translateY(-0.2rem) scale(0.998);
}

#pjax-main {
  transition:
    opacity 180ms cubic-bezier(0.4, 0, 1, 1),
    transform 240ms cubic-bezier(0.4, 0, 0.2, 1);
}

/* The home template initially contains Serenity inside its typewriter span.
   Gate only the home hero title until the loader installs the stable copy. */
#pjax-main:has(.hero-background) .hero .hero-name:not([data-wuwa-stable-title="true"]) {
  opacity: 0 !important;
  visibility: hidden;
}

#pjax-main:has(.hero-background) .hero .hero-name[data-wuwa-stable-title="true"] {
  animation: wuwa-home-title-enter 420ms cubic-bezier(0.16, 1, 0.3, 1) both;
  visibility: visible;
}

#pjax-main:has(.hero-background) .hero .hero-name[data-wuwa-title-replay] {
  animation: none !important;
  opacity: 1 !important;
  transform: none !important;
  visibility: visible !important;
}

@keyframes wuwa-home-title-enter {
  from {
    opacity: 0;
    transform: translateY(0.35rem);
  }
  to {
    opacity: 1;
    transform: none;
  }
}

/* Dim the complete page below the search layer without blurring its content. */
.search-modal .search-modal-overlay {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  background: rgb(5 7 12 / 0%) !important;
  transition: background-color 300ms cubic-bezier(0.16, 1, 0.3, 1);
}

.search-modal {
  transition:
    opacity 300ms cubic-bezier(0.4, 0, 0.2, 1),
    visibility 0s linear 460ms !important;
}

.search-modal.active {
  transition:
    opacity 300ms cubic-bezier(0.16, 1, 0.3, 1),
    visibility 0s linear 0s !important;
}

.search-modal.active .search-modal-overlay {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  background: rgb(5 7 12 / 48%) !important;
}

.search-modal[data-wuwa-search-blur="clear"] {
  opacity: 0 !important;
  pointer-events: none !important;
  transition: none !important;
  visibility: hidden !important;
}

.search-modal[data-wuwa-search-blur="clear"] .search-modal-overlay {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  background: transparent !important;
  transition: none !important;
}

.search-modal .search-modal-content,
[data-theme="light"] .search-modal .search-modal-content {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

.search-modal .search-modal-content {
  background: rgb(20 22 29 / 88%);
  transition: transform 360ms cubic-bezier(0.16, 1, 0.3, 1);
}

[data-theme="light"] .search-modal .search-modal-content {
  background: rgb(236 240 245 / 94%);
}

#search-results[data-wuwa-search-enhanced="true"] {
  display: grid;
  gap: 0.55rem;
  padding: 0.7rem;
}

#search-results[data-wuwa-search-enhanced="true"] .wuwa-search-card {
  align-items: center;
  animation: wuwa-search-card-enter 420ms cubic-bezier(0.16, 1, 0.3, 1) both;
  background: color-mix(in srgb, var(--color-bg-soft, #171820) 92%, transparent);
  border: 1px solid color-mix(in srgb, var(--color-accent, #b79b55) 20%, transparent);
  border-radius: var(--radius-lg, 0.8rem);
  box-sizing: border-box;
  display: grid;
  gap: 0.8rem;
  grid-template-columns: 74px minmax(0, 1fr);
  margin: 0;
  min-height: 92px;
  padding: 0.5rem;
  transform: translateY(0) scale(1);
  transition:
    background-color 260ms cubic-bezier(0.16, 1, 0.3, 1),
    border-color 260ms cubic-bezier(0.16, 1, 0.3, 1),
    box-shadow 360ms cubic-bezier(0.16, 1, 0.3, 1),
    transform 360ms cubic-bezier(0.16, 1, 0.3, 1);
}

#search-results[data-wuwa-search-enhanced="true"] .wuwa-search-card:is(:hover, :focus-visible) {
  background: color-mix(in srgb, var(--color-bg-soft, #171820) 84%, var(--color-accent, #b79b55) 16%);
  border-color: color-mix(in srgb, var(--color-accent, #b79b55) 56%, transparent);
  box-shadow: 0 0.75rem 1.6rem rgb(0 0 0 / 18%);
  outline: none;
  transform: translateY(-2px) scale(1.008);
}

#search-results[data-wuwa-search-enhanced="true"] .wuwa-search-card:focus-visible {
  box-shadow:
    0 0 0 2px color-mix(in srgb, var(--color-accent, #b79b55) 76%, white),
    0 0.75rem 1.6rem rgb(0 0 0 / 18%);
}

#search-results[data-wuwa-search-enhanced="true"] .wuwa-search-card-cover {
  align-items: center;
  aspect-ratio: 1;
  background: color-mix(in srgb, var(--color-bg-soft, #171820) 82%, transparent);
  border-radius: 0.72rem;
  display: flex;
  grid-column: 1;
  height: 74px;
  inset: auto;
  justify-content: center;
  overflow: hidden;
  padding: 0.28rem;
  position: relative;
  width: 74px;
}

#search-results[data-wuwa-search-enhanced="true"] .wuwa-search-card-cover img {
  height: 100%;
  object-fit: contain;
  transition: transform 420ms cubic-bezier(0.16, 1, 0.3, 1);
  width: 100%;
}

#search-results[data-wuwa-search-enhanced="true"] .wuwa-search-card:is(:hover, :focus-visible) .wuwa-search-card-cover img {
  transform: scale(1.055) rotate(-0.6deg);
}

#search-results[data-wuwa-search-enhanced="true"] .wuwa-search-card-content {
  display: block;
  grid-column: 2;
  margin: 0;
  min-width: 0;
  padding: 0;
}

#search-results[data-wuwa-search-enhanced="true"] .wuwa-search-card-title {
  color: var(--color-text, #fff);
  display: block;
  font-size: 0.98rem;
  font-weight: 700;
  line-height: 1.35;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#search-results[data-wuwa-search-enhanced="true"] .wuwa-search-card-desc {
  color: var(--color-text-muted, rgb(255 255 255 / 66%));
  display: -webkit-box;
  font-size: 0.78rem;
  line-height: 1.45;
  margin-top: 0.2rem;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
}

#search-results[data-wuwa-search-enhanced="true"] .wuwa-search-card-meta,
#search-results[data-wuwa-search-enhanced="true"] .wuwa-search-card-chips {
  align-items: center;
  display: flex;
  gap: 0.3rem;
  min-width: 0;
}

#search-results[data-wuwa-search-enhanced="true"] .wuwa-search-card-meta {
  justify-content: space-between;
  margin-top: 0.4rem;
}

#search-results[data-wuwa-search-enhanced="true"] .wuwa-search-card-chips {
  overflow: hidden;
}

#search-results[data-wuwa-search-enhanced="true"] :is(.archive-category, .archive-tag) {
  align-items: center;
  background: color-mix(in srgb, var(--color-accent, #b79b55) 9%, transparent);
  border: 1px solid color-mix(in srgb, var(--color-accent, #b79b55) 22%, transparent);
  border-radius: 999px;
  display: inline-flex;
  flex: 0 0 auto;
  font-size: 0.68rem;
  gap: 0.2rem;
  line-height: 1;
  padding: 0.23rem 0.38rem;
}

#search-results[data-wuwa-search-enhanced="true"] .wuwa-search-card-statistics,
#search-results[data-wuwa-search-enhanced="true"] .wuwa-search-card-favorites,
#search-results[data-wuwa-search-enhanced="true"] .wuwa-search-card-downloads {
  align-items: center;
  display: inline-flex;
  flex: 0 0 auto;
  font-size: 0.72rem;
  font-variant-numeric: tabular-nums;
  font-weight: 700;
  gap: 0.22rem;
}

#search-results[data-wuwa-search-enhanced="true"] .wuwa-search-card-statistics {
  gap: 0.48rem;
}

#search-results[data-wuwa-search-enhanced="true"] .wuwa-search-card-favorites {
  color: color-mix(in srgb, #ff6685 82%, currentColor);
}

#search-results[data-wuwa-search-enhanced="true"] .wuwa-search-card-downloads {
  color: color-mix(in srgb, #d9b85f 88%, currentColor);
}

#search-results[data-wuwa-search-enhanced="true"] .wuwa-search-card[data-statistics-state="unknown"] .wuwa-search-card-statistics {
  opacity: 0.52;
}

@keyframes wuwa-search-card-enter {
  from {
    opacity: 0;
    transform: translateY(0.65rem) scale(0.975);
  }
}

@media (max-width: 520px) {
  #search-results[data-wuwa-search-enhanced="true"] .wuwa-search-card {
    gap: 0.62rem;
    grid-template-columns: 72px minmax(0, 1fr);
  }

  #search-results[data-wuwa-search-enhanced="true"] .wuwa-search-card-cover {
    height: 72px;
    width: 72px;
  }

  #search-results[data-wuwa-search-enhanced="true"] .wuwa-search-card-chips .archive-tag:nth-of-type(n + 2) {
    display: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  #search-results[data-wuwa-search-enhanced="true"] .wuwa-search-card,
  #search-results[data-wuwa-search-enhanced="true"] .wuwa-search-card-cover img {
    animation: none !important;
    transition: none !important;
  }
}

html[data-theme] .page-transition,
html[data-theme] .page-transition.is-initial-loading,
html[data-theme] .welcome-overlay {
  background: var(--color-bg, #201f1d) !important;
}

html[data-wuwa-initial-resources="waiting"] .welcome-overlay {
  display: flex !important;
  opacity: 1 !important;
  pointer-events: auto !important;
  visibility: visible !important;
}

/* Keep the mascot float and ripple rings on one faster 1.5 s rhythm. */
.welcome-logo{animation-duration:1.5s!important}
.wuwa-welcome-ripples{position:absolute;inset:0;pointer-events:none}
.wuwa-welcome-ripples::before,.wuwa-welcome-ripples::after{content:"";position:absolute;inset:0;box-sizing:border-box;border:2px solid var(--color-accent,#bea151);border-radius:50%;animation:wuwa-welcome-ripple 1.5s cubic-bezier(.22,.61,.36,1) infinite}
.wuwa-welcome-ripples::after{animation-delay:.75s}
@media(prefers-reduced-motion:reduce){.wuwa-welcome-ripples{display:none}}
@keyframes wuwa-welcome-ripple{
  0%{transform:scale(1);opacity:.46}
  50%{transform:scale(1.42);opacity:.18}
  100%{transform:scale(1.82);opacity:0}
}

/* Keep archive secondary content in the right rail or hide it as one unit. */
@media (max-width: 900px) {
  .archive-layout > .archive-sidebar {
    display: none !important;
  }
}

html[data-wuwa-archive-state="ready"] body:has(.archive-layout .archive-list) .archive-layout > .archive-main,
html[data-wuwa-archive-state="ready"] body:has(.archive-layout .archive-list) .archive-layout > .archive-sidebar,
.wuwa-infinite-gallery-page:not([data-wuwa-gallery-gate="waiting"])[data-wuwa-gallery-gate] .archive-layout[data-wuwa-gallery-sidebar-state="ready"] > .archive-sidebar {
  animation: wuwa-archive-section-enter 800ms cubic-bezier(0.25, 0.46, 0.45, 0.94) 100ms both !important;
}

html[data-wuwa-archive-state="ready"] body:has(.archive-layout .archive-list) .archive-layout > .archive-sidebar > .sidebar-widget,
.wuwa-infinite-gallery-page:not([data-wuwa-gallery-gate="waiting"])[data-wuwa-gallery-gate] .archive-layout[data-wuwa-gallery-sidebar-state="ready"] > .archive-sidebar > .sidebar-widget {
  animation: none !important;
  opacity: 1 !important;
  transform: none !important;
}

.logo-avatar,
.hero-avatar img,
.welcome-logo {
  background-color: #000;
}

.header button#theme-toggle {
  display: none !important;
}

/* Collapse the header before its six labels and search copy can wrap. */
@media (max-width: 1030px) {
  .header .header-inner {
    gap: var(--space-1);
    min-width: 0;
    padding-inline: var(--space-3);
  }

  .header .header-left,
  .header .header-right,
  .header .header-left .logo,
  .header .logo-avatar {
    flex-shrink: 0;
  }

  .header .header-left {
    min-width: 0;
  }

  .header .header-left > nav#nav {
    min-width: 0;
  }

  .header .logo-avatar {
    aspect-ratio: 1;
    flex-basis: 32px;
    height: 32px;
    width: 32px;
  }

  .header .nav-left,
  .header .nav-right {
    gap: var(--space-1);
  }

  .header .nav-btn,
  .header .nav-btn-with-icon,
  .header .theme-toggle {
    height: 28px;
    width: 28px;
  }

  .header .nav-btn-with-icon {
    align-items: center;
    display: flex;
    justify-content: center;
    padding: 0;
    transition:
      background-color 220ms cubic-bezier(0.16, 1, 0.3, 1),
      color 220ms cubic-bezier(0.16, 1, 0.3, 1),
      box-shadow 320ms cubic-bezier(0.16, 1, 0.3, 1),
      transform 320ms cubic-bezier(0.16, 1, 0.3, 1),
      width 320ms cubic-bezier(0.16, 1, 0.3, 1);
  }

  .header .nav-btn-with-icon:is(:hover, :focus-visible) {
    transform: translateY(-1px) scale(1.04);
  }

  .header .nav-btn-with-icon:active {
    transform: scale(0.94);
  }

  .header .nav-btn-text-label {
    display: none;
  }

  .header .search-box {
    display: flex !important;
    flex: 0 0 28px;
    justify-content: center;
    min-height: 28px;
    min-width: 28px;
    padding: 0;
    transition:
      background-color 220ms cubic-bezier(0.16, 1, 0.3, 1),
      border-color 220ms cubic-bezier(0.16, 1, 0.3, 1),
      box-shadow 320ms cubic-bezier(0.16, 1, 0.3, 1),
      transform 320ms cubic-bezier(0.16, 1, 0.3, 1);
    width: 28px;
  }

  .header .search-box:is(:hover, :focus-visible) {
    box-shadow: 0 0.4rem 1rem color-mix(in srgb, var(--color-accent) 12%, transparent);
    outline: none;
    transform: translateY(-1px) scale(1.04);
  }

  .header .search-box:active {
    transform: scale(0.94);
  }

  .header .search-box-text,
  .header .search-box-kbd {
    display: none;
  }
}

@media (max-width: 768px) {
  #nav-music {
    bottom: max(12px, env(safe-area-inset-bottom)) !important;
    display: flex !important;
    left: max(12px, env(safe-area-inset-left)) !important;
    max-width: calc(100vw - 24px);
  }

  #music-panel.active {
    bottom: max(64px, calc(env(safe-area-inset-bottom) + 52px)) !important;
    display: block !important;
    left: max(12px, env(safe-area-inset-left)) !important;
    max-width: calc(100vw - 24px);
  }
}

.hero-background[data-wuwa-drift-mounted="true"] {
  background: var(--color-bg, #201f1d) !important;
  overflow: hidden;
}

.wuwa-drift-wall {
  background: var(--color-bg, #201f1d);
  inset: 0;
  opacity: 0;
  overflow: hidden;
  perspective: 900px;
  pointer-events: none;
  position: absolute;
  transform: scale(1.018);
  transform-style: preserve-3d;
  transition:
    background 640ms cubic-bezier(0.16, 1, 0.3, 1),
    opacity 920ms cubic-bezier(0.22, 1, 0.36, 1),
    transform 1200ms cubic-bezier(0.16, 1, 0.3, 1);
}

.wuwa-drift-wall::before,
.wuwa-drift-wall::after {
  content: "";
  inset: 0;
  pointer-events: none;
  position: absolute;
  z-index: 200;
}

.wuwa-drift-wall::before {
  background:
    radial-gradient(ellipse, transparent 30%, rgb(0 0 0 / 72%) 90%);
  inset: -20%;
}

.wuwa-drift-wall::after {
  display: none;
}

.wuwa-drift-wall.is-ready {
  opacity: 1;
  transform: scale(1);
}

.wuwa-drift-track {
  height: 18vh;
  left: 50%;
  position: absolute;
  top: 50%;
  transform:
    translate(-50%, -50%)
    translateY(var(--wuwa-track-y))
    translateZ(var(--wuwa-track-z))
    scale(var(--wuwa-track-scale));
  transform-style: preserve-3d;
  opacity: var(--wuwa-track-opacity);
  transition: opacity 520ms cubic-bezier(0.16, 1, 0.3, 1);
  width: 112vw;
  z-index: 1;
}

.wuwa-drift-track-inner {
  align-items: center;
  animation: wuwa-drift var(--wuwa-track-duration) linear var(--wuwa-track-delay) infinite;
  display: flex;
  height: 100%;
  width: 200%;
  will-change: transform;
}

.wuwa-drift-segment {
  align-items: center;
  display: grid;
  flex: 0 0 50%;
  grid-template-columns: repeat(var(--wuwa-item-count), minmax(0, 1fr));
  height: 100%;
  justify-items: center;
  width: 50%;
}

.wuwa-drift-track.reverse .wuwa-drift-track-inner {
  animation-name: wuwa-drift-reverse;
}

.wuwa-drift-wall:is([data-mode="static"], .is-suspended) .wuwa-drift-track-inner {
  animation-play-state: paused;
}

.wuwa-drift-wall[data-mode="static"] .wuwa-drift-track-inner {
  animation: none;
  width: 100%;
  will-change: auto;
}

.wuwa-drift-wall[data-mode="static"] .wuwa-drift-segment {
  flex-basis: 100%;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  width: 100%;
}

.wuwa-drift-emoji {
  -webkit-mask-image: linear-gradient(to right, transparent, #000 6%, #000 94%, transparent), linear-gradient(to bottom, transparent, #000 6%, #000 94%, transparent);
  mask-image: linear-gradient(to right, transparent, #000 6%, #000 94%, transparent), linear-gradient(to bottom, transparent, #000 6%, #000 94%, transparent);
  -webkit-mask-composite: source-in;
  mask-composite: intersect;
  animation: wuwa-drift-appear 900ms ease var(--wuwa-appear-delay) forwards;
  display: block;
  height: var(--wuwa-emoji-size);
  filter: drop-shadow(0 0 12px rgb(160 120 255 / 35%));
  flex: 0 0 auto;
  object-fit: contain;
  opacity: 0;
  transition: filter 520ms cubic-bezier(0.16, 1, 0.3, 1);
  user-select: none;
  width: var(--wuwa-emoji-size);
}

.wuwa-drift-track.near .wuwa-drift-emoji {
  filter: drop-shadow(0 0 18px rgb(200 150 255 / 60%));
}

.wuwa-drift-track.far .wuwa-drift-emoji {
  filter: blur(1px);
}

@keyframes wuwa-drift-appear {
  from {
    opacity: 0;
    transform: scale(0.8);
  }
  to {
    opacity: var(--wuwa-alpha, 1);
    transform: scale(1);
  }
}

@keyframes wuwa-drift {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}

@keyframes wuwa-drift-reverse {
  from { transform: translateX(-50%); }
  to { transform: translateX(0); }
}

.hero[data-wuwa-drift-hero="true"] {
  min-height: 100svh;
}

.hero[data-wuwa-drift-hero="true"] .hero-profile {
  align-items: center;
  display: grid;
  gap: clamp(24px, 4vw, 58px);
  grid-template-columns: clamp(116px, 14vw, 190px) minmax(0, 1fr);
  max-width: none;
  transform: translateY(-1vh) !important;
  width: min(980px, 87vw);
}

.hero[data-wuwa-drift-hero="true"] .hero-avatar-wrapper {
  align-items: center;
  display: grid;
  justify-items: center;
  width: 100%;
}

.hero[data-wuwa-drift-hero="true"] .hero-avatar {
  aspect-ratio: 1;
  background: rgb(8 10 16 / 75%);
  border: clamp(5px, 0.65vw, 9px) solid rgb(219 238 255 / 80%);
  border-radius: 50%;
  box-shadow:
    0 20px 70px rgb(0 0 0 / 65%),
    0 0 0 1px rgb(255 255 255 / 28%) inset,
    0 0 35px rgb(131 227 225 / 20%);
  height: auto;
  outline: 3px solid rgb(118 214 218 / 46%);
  outline-offset: 3px;
  overflow: hidden;
  width: 100%;
}

.hero[data-wuwa-drift-hero="true"] .hero-avatar img {
  height: 100%;
  object-fit: contain;
  transform: none;
  width: 100%;
}

.hero[data-wuwa-drift-hero="true"] .hero-info {
  align-items: flex-start;
  max-width: none;
  text-align: left;
  text-shadow: 0 4px 32px rgb(0 0 0 / 95%);
  transition: text-shadow 520ms cubic-bezier(0.16, 1, 0.3, 1);
  width: 100%;
}

.wuwa-hero-eyebrow {
  color: #a9a1bd;
  font-size: clamp(11px, 1.15vw, 15px);
  font-weight: 740;
  letter-spacing: 0.3em;
  margin: 0 0 12px;
  text-transform: uppercase;
  transition: color 520ms cubic-bezier(0.16, 1, 0.3, 1);
}

.hero[data-wuwa-drift-hero="true"] .hero-name {
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background: linear-gradient(180deg, #fff5ca 0%, #e1c77f 58%, #af8847 100%) !important;
  background-clip: text !important;
  filter: drop-shadow(0 8px 28px rgb(0 0 0 / 82%));
  font-size: clamp(38px, 6.1vw, 86px);
  font-weight: 820;
  letter-spacing: 0.04em;
  line-height: 0.98;
  margin: 0;
  text-wrap: balance;
  transition: filter 520ms cubic-bezier(0.16, 1, 0.3, 1);
}

.hero[data-wuwa-drift-hero="true"] .hero-tagline {
  color: #f6f4fb !important;
  font-size: clamp(18px, 2vw, 28px);
  font-weight: 760;
  margin: 20px 0 0;
  transition: color 520ms cubic-bezier(0.16, 1, 0.3, 1);
}

.hero[data-wuwa-drift-hero="true"] .hero-bio {
  color: #aaa5b5 !important;
  font-size: clamp(13px, 1.15vw, 17px);
  font-weight: 560;
  line-height: 1.75;
  margin: 14px 0 0;
  max-width: 560px;
  transition: color 520ms cubic-bezier(0.16, 1, 0.3, 1);
}

/* Keep the light theme airy without washing out the animated emoji wall. */
html[data-theme="light"] .hero-background[data-wuwa-drift-mounted="true"] {
  background: #dfe6e7 !important;
}

html[data-theme="light"] .wuwa-drift-wall {
  background:
    radial-gradient(
      circle at 50% 42%,
      rgb(255 255 255 / 48%) 0 18%,
      rgb(230 236 237 / 72%) 58%,
      rgb(198 208 211 / 92%) 100%
    ),
    #d2dcde;
}

html[data-theme="light"] .wuwa-drift-wall::before {
  background: radial-gradient(ellipse, transparent 24%, rgb(55 70 78 / 24%) 100%);
}

html[data-theme="light"] .wuwa-drift-track {
  opacity: min(1, calc(var(--wuwa-track-opacity) + 0.22));
}

html[data-theme="light"] .wuwa-drift-emoji {
  filter:
    saturate(1.22)
    contrast(1.15)
    drop-shadow(0 5px 14px rgb(39 59 67 / 22%));
}

html[data-theme="light"] .wuwa-drift-track.near .wuwa-drift-emoji {
  filter:
    saturate(1.26)
    contrast(1.18)
    drop-shadow(0 7px 18px rgb(39 59 67 / 28%));
}

html[data-theme="light"] .wuwa-drift-track.far .wuwa-drift-emoji {
  filter:
    blur(0.55px)
    saturate(1.14)
    contrast(1.1)
    drop-shadow(0 4px 12px rgb(39 59 67 / 18%));
}

html[data-theme="light"] .hero[data-wuwa-drift-hero="true"] .hero-info {
  text-shadow: 0 2px 18px rgb(255 255 255 / 82%);
}

html[data-theme="light"] .wuwa-hero-eyebrow {
  color: #514568;
}

html[data-theme="light"] .hero[data-wuwa-drift-hero="true"] .hero-name {
  -webkit-background-clip: text !important;
  background: linear-gradient(180deg, #7c5b18 0%, #614514 58%, #412d0b 100%) !important;
  background-clip: text !important;
  filter: drop-shadow(0 6px 18px rgb(63 47 18 / 24%));
}

html[data-theme="light"] .hero[data-wuwa-drift-hero="true"] .hero-tagline {
  color: #292430 !important;
}

html[data-theme="light"] .hero[data-wuwa-drift-hero="true"] .hero-bio {
  color: #48414f !important;
}

.hero[data-wuwa-drift-hero="true"] .hero-social {
  display: none;
}

.wuwa-character-filter {
  align-items: center;
  background: color-mix(in srgb, var(--color-bg-soft, #171820) 88%, transparent);
  border: 1px solid color-mix(in srgb, var(--color-accent, #b8a5e3) 20%, transparent);
  border-radius: 1rem;
  display: flex;
  flex-wrap: wrap;
  gap: 0.9rem;
  justify-content: flex-start;
  margin-bottom: 1rem;
  padding: 0.7rem;
  position: relative;
}

.wuwa-archive-filter-field {
  align-items: center;
  display: inline-flex;
  gap: 0.55rem;
  min-width: 0;
}

.wuwa-filter-panel-trigger {
  align-items: center;
  appearance: none;
  background: color-mix(in srgb, var(--color-bg, #0c0d12) 76%, transparent);
  border: 1px solid color-mix(in srgb, var(--color-accent, #b8a5e3) 28%, transparent);
  border-radius: 0.78rem;
  color: var(--color-text, #f3f0f5);
  cursor: pointer;
  display: inline-flex;
  font: inherit;
  font-size: 0.9rem;
  font-weight: 760;
  gap: 0.55rem;
  min-height: 2.75rem;
  padding: 0.58rem 0.85rem;
  transition:
    background-color 260ms cubic-bezier(0.16, 1, 0.3, 1),
    border-color 260ms cubic-bezier(0.16, 1, 0.3, 1),
    box-shadow 380ms cubic-bezier(0.16, 1, 0.3, 1),
    transform 380ms cubic-bezier(0.16, 1, 0.3, 1);
}

.wuwa-filter-panel-trigger:is(:hover, :focus-visible),
.wuwa-filter-panel-trigger.has-active-filters {
  background: color-mix(in srgb, var(--color-accent, #b8a5e3) 11%, var(--color-bg, #0c0d12));
  border-color: color-mix(in srgb, var(--color-accent, #b8a5e3) 62%, transparent);
  box-shadow: 0 0.8rem 2rem color-mix(in srgb, var(--color-accent, #b8a5e3) 11%, transparent);
  outline: none;
  transform: translateY(-0.1rem);
}

.wuwa-filter-panel-count {
  align-items: center;
  background: var(--color-accent, #b8a5e3);
  border-radius: 999px;
  color: var(--color-bg, #111218);
  display: inline-flex;
  font-size: 0.68rem;
  height: 1.25rem;
  justify-content: center;
  min-width: 1.25rem;
  padding-inline: 0.28rem;
  transition: transform 360ms cubic-bezier(0.16, 1, 0.3, 1);
}

.wuwa-filter-panel-count[hidden] {
  display: none !important;
}

.wuwa-filter-panel-trigger:is(:hover, :focus-visible) .wuwa-filter-panel-count {
  transform: rotate(-8deg) scale(1.08);
}

.wuwa-filter-sort-control {
  align-items: center;
  display: inline-flex;
  gap: 0.5rem;
  margin-left: auto;
  min-width: 0;
}

.wuwa-filter-sort-control > span {
  color: var(--color-text-secondary, #aaa5b5);
  font-size: 0.75rem;
  font-weight: 760;
}

.archive-layout .wuwa-character-filter:has(> [data-filter-panel-open]) {
  flex-wrap: nowrap;
}

.archive-layout .wuwa-character-filter > [data-filter-panel-open],
.archive-layout .wuwa-character-filter:has(> [data-filter-panel-open]) > .wuwa-filter-sort-control {
  flex: 0 0 auto;
  white-space: nowrap;
}

@media (max-width: 720px) {
  .archive-layout .wuwa-character-filter:has(> [data-filter-panel-open]) {
    gap: 0.5rem;
    padding: 0.5rem;
  }

  .archive-layout .wuwa-character-filter .wuwa-archive-control-label {
    display: none;
  }

  .archive-layout .wuwa-character-filter > [data-filter-panel-open],
  .archive-layout .wuwa-filter-sort-control > [data-archive-refresh] {
    min-width: 2.75rem;
    min-height: 2.75rem;
    padding-inline: 0.5rem;
  }

  .archive-layout .wuwa-character-filter:has(> [data-filter-panel-open]) .wuwa-archive-sort-picker {
    flex-basis: 4.5rem;
    width: 4.5rem;
  }

  .archive-layout [data-archive-sort-open] {
    min-width: 0;
    width: 100%;
    column-gap: 0.4rem;
    padding-inline: 0.5rem;
  }
}

.wuwa-filter-sort-control select,
.wuwa-filter-panel-field select {
  appearance: none;
  background:
    linear-gradient(45deg, transparent 50%, currentColor 50%) calc(100% - 0.9rem) 52% / 0.32rem 0.32rem no-repeat,
    linear-gradient(135deg, currentColor 50%, transparent 50%) calc(100% - 0.58rem) 52% / 0.32rem 0.32rem no-repeat,
    color-mix(in srgb, var(--color-bg, #0c0d12) 82%, transparent);
  border: 1px solid color-mix(in srgb, var(--color-accent, #b8a5e3) 28%, transparent);
  border-radius: 0.68rem;
  color: var(--color-text, #f3f0f5);
  cursor: pointer;
  font: inherit;
  font-size: 0.82rem;
  min-height: 2.5rem;
  padding: 0.48rem 1.55rem 0.48rem 0.72rem;
  transition:
    background-color 240ms cubic-bezier(0.16, 1, 0.3, 1),
    border-color 240ms cubic-bezier(0.16, 1, 0.3, 1),
    box-shadow 360ms cubic-bezier(0.16, 1, 0.3, 1),
    transform 360ms cubic-bezier(0.16, 1, 0.3, 1);
}

.wuwa-filter-sort-control select:is(:hover, :focus-visible),
.wuwa-filter-panel-field select:is(:hover, :focus-visible) {
  border-color: color-mix(in srgb, var(--color-accent, #b8a5e3) 62%, transparent);
  box-shadow: 0 0.6rem 1.4rem color-mix(in srgb, var(--color-accent, #b8a5e3) 10%, transparent);
  outline: none;
  transform: translateY(-0.06rem);
}

.wuwa-character-filter-trigger,
.wuwa-archive-sort-trigger {
  align-items: center;
  background: color-mix(in srgb, var(--color-bg, #0c0d12) 72%, transparent);
  border: 1px solid color-mix(in srgb, var(--color-accent, #b8a5e3) 22%, transparent);
  border-radius: 0.75rem;
  color: var(--color-text, #f3f0f5);
  column-gap: 0.72rem;
  display: inline-grid;
  grid-template-columns: minmax(0, 1fr) 0.45rem;
  max-width: 100%;
  min-height: 2.75rem;
  min-width: 6.75rem;
  padding: 0.55rem 0.75rem;
  text-align: center;
  transition:
    background-color 260ms cubic-bezier(0.16, 1, 0.3, 1),
    border-color 260ms cubic-bezier(0.16, 1, 0.3, 1),
    box-shadow 360ms cubic-bezier(0.16, 1, 0.3, 1),
    transform 360ms cubic-bezier(0.16, 1, 0.3, 1);
  width: 6.75rem;
}

.wuwa-character-filter-trigger:is(:hover, :focus-visible),
.wuwa-archive-sort-trigger:is(:hover, :focus-visible) {
  background: color-mix(in srgb, var(--color-accent, #b8a5e3) 8%, var(--color-bg, #0c0d12));
  border-color: color-mix(in srgb, var(--color-accent, #b8a5e3) 58%, transparent);
  box-shadow: 0 0.7rem 1.8rem color-mix(in srgb, var(--color-accent, #b8a5e3) 10%, transparent);
  outline: none;
  transform: translateY(-0.1rem);
}

.wuwa-character-filter-title {
  align-items: center;
  color: var(--color-text-secondary, #aaa5b5);
  display: inline-flex;
  font-size: 0.78rem;
  font-weight: 760;
  letter-spacing: 0.08em;
  line-height: 1.2;
  min-height: 1.2rem;
}

.wuwa-character-filter-value {
  align-items: center;
  display: inline-flex;
  font-size: 0.96rem;
  font-weight: 760;
  justify-content: center;
  line-height: 1.2;
  min-height: 1.2rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%;
}

.post-content .wuwa-pack-sort-picker .wuwa-character-filter-value {
  background: none;
}

.wuwa-character-filter-trigger::after,
.wuwa-archive-sort-trigger::after {
  border-bottom: 2px solid currentColor;
  border-right: 2px solid currentColor;
  content: "";
  height: 0.45rem;
  margin-top: -0.2rem;
  opacity: 0.72;
  transform: rotate(45deg);
  transition: transform 360ms cubic-bezier(0.16, 1, 0.3, 1);
  width: 0.45rem;
}

.wuwa-character-filter-trigger[aria-expanded="true"]::after,
.wuwa-archive-sort-trigger[aria-expanded="true"]::after {
  transform: translateY(0.2rem) rotate(225deg);
}

.wuwa-archive-sort-picker {
  flex: 0 0 6.75rem;
  position: relative;
  width: 6.75rem;
}

.wuwa-archive-sort-menu[hidden] {
  display: none !important;
}

.wuwa-archive-sort-menu {
  background: color-mix(in srgb, var(--color-bg-soft, #171820) 97%, transparent);
  border: 1px solid color-mix(in srgb, var(--color-accent, #b8a5e3) 28%, transparent);
  border-radius: 0.75rem;
  box-sizing: border-box;
  box-shadow: 0 1rem 2.2rem rgb(0 0 0 / 24%);
  display: grid;
  gap: 0.25rem;
  left: 0;
  opacity: 0;
  padding: 0.35rem;
  pointer-events: none;
  position: absolute;
  top: calc(100% + 0.42rem);
  transform: translateY(-0.4rem) scale(0.96);
  transform-origin: center top;
  transition:
    opacity 180ms ease,
    transform 280ms cubic-bezier(0.16, 1, 0.3, 1);
  width: 100%;
  z-index: 40;
}

.wuwa-archive-sort-menu.is-open {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0) scale(1);
}

.wuwa-archive-sort-option {
  align-items: center;
  background: transparent;
  border: 0;
  border-radius: 0.5rem;
  color: var(--color-text-secondary, #aaa5b5);
  column-gap: 0.72rem;
  cursor: pointer;
  display: grid;
  font-size: 0.86rem;
  font-weight: 680;
  grid-template-columns: minmax(0, 1fr) 0.45rem;
  min-height: 2.2rem;
  padding: 0.45rem 0.75rem;
  text-align: center;
  transition:
    background-color 180ms ease,
    color 180ms ease,
    transform 240ms cubic-bezier(0.16, 1, 0.3, 1);
}

.wuwa-archive-sort-option:is(:hover, :focus-visible),
.wuwa-archive-sort-option.is-active {
  background: color-mix(in srgb, var(--color-accent, #b8a5e3) 13%, transparent);
  color: var(--color-text, #f3f0f5);
  outline: none;
  transform: translateY(-0.04rem) scale(1.015);
}

.wuwa-archive-sort-option.is-active::after {
  content: "✓";
  justify-self: center;
  opacity: 0.78;
}

.wuwa-character-filter-result,
.wuwa-character-filter-loading,
.wuwa-character-filter-error {
  color: var(--color-text-secondary, #aaa5b5);
  font-size: 0.76rem;
  margin-left: auto;
}

.wuwa-character-picker-dialog[hidden] {
  display: none !important;
}

.wuwa-filter-panel-back[hidden],
.wuwa-filter-panel-home[hidden],
.wuwa-character-picker-grid[hidden] {
  display: none !important;
}

.wuwa-character-picker-dialog {
  left: 0.7rem;
  opacity: 0;
  pointer-events: none;
  position: absolute;
  top: calc(100% + 0.5rem);
  transform: translateY(-0.55rem) scale(0.985);
  transform-origin: left top;
  transition:
    opacity 220ms cubic-bezier(0.16, 1, 0.3, 1),
    transform 320ms cubic-bezier(0.16, 1, 0.3, 1),
    visibility 0s linear 320ms;
  visibility: hidden;
  width: min(32rem, calc(100% - 1.4rem));
  z-index: 120;
}

.wuwa-character-picker-dialog.is-open {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0) scale(1);
  transition:
    opacity 220ms cubic-bezier(0.16, 1, 0.3, 1),
    transform 360ms cubic-bezier(0.16, 1, 0.3, 1),
    visibility 0s linear 0s;
  visibility: visible;
}

.wuwa-filter-panel-compact {
  max-width: calc(100% - 1.4rem);
  width: max-content;
}

.wuwa-filter-panel-compact > .wuwa-filter-panel-card {
  max-width: 100%;
  width: max-content;
}

body.wuwa-character-picker-open {
  overflow: hidden;
}

.wuwa-filter-option-dialog {
  display: grid;
  inset: 0;
  left: 0;
  opacity: 1;
  padding: clamp(0.8rem, 4vh, 2rem) clamp(0.7rem, 4vw, 2rem);
  place-items: center;
  pointer-events: none;
  position: fixed;
  top: 0;
  transform: none;
  transition: none;
  visibility: visible;
  width: 100%;
  z-index: 1260;
}

.wuwa-filter-option-dialog.is-open {
  pointer-events: auto;
  transform: none;
}

.wuwa-character-picker-backdrop {
  backdrop-filter: blur(0) saturate(1);
  background: rgb(2 4 8 / 0%);
  border: 0;
  inset: 0;
  position: absolute;
  transition:
    background 560ms cubic-bezier(0.16, 1, 0.3, 1),
    backdrop-filter 720ms cubic-bezier(0.16, 1, 0.3, 1);
}

.wuwa-filter-option-dialog.is-open .wuwa-character-picker-backdrop {
  backdrop-filter: blur(18px) saturate(0.82);
  background: rgb(2 4 8 / 72%);
}

.wuwa-filter-option-dialog .wuwa-character-picker-card {
  box-shadow: 0 1.6rem 5rem rgb(0 0 0 / 52%);
  grid-template-rows: auto minmax(0, 1fr) auto;
  max-height: min(43rem, calc(100dvh - 2rem));
  opacity: 0;
  overflow: hidden;
  transform: translateY(1.15rem) scale(0.982);
  transition:
    opacity 460ms cubic-bezier(0.16, 1, 0.3, 1),
    transform 540ms cubic-bezier(0.16, 1, 0.3, 1);
  width: min(51rem, calc(100vw - 1.5rem));
  z-index: 1;
}

.wuwa-filter-option-dialog.is-open .wuwa-character-picker-card {
  opacity: 1;
  transform: translateY(0) scale(1);
}

.wuwa-filter-option-dialog .wuwa-character-picker-body {
  -webkit-overflow-scrolling: touch;
  overflow: auto;
  overscroll-behavior: contain;
  padding: 1rem 1.2rem;
  touch-action: pan-y;
}

.wuwa-character-picker-card {
  background:
    linear-gradient(145deg, color-mix(in srgb, var(--color-accent, #b8a5e3) 7%, transparent), transparent 42%),
    color-mix(in srgb, var(--color-bg, #0d0e13) 97%, #111927);
  border: 1px solid color-mix(in srgb, var(--color-accent, #b8a5e3) 26%, transparent);
  border-radius: 0.85rem;
  box-shadow: 0 1.2rem 3.4rem rgb(0 0 0 / 36%);
  color: var(--color-text, #f4f1f6);
  display: grid;
  grid-template-rows: minmax(0, auto) auto;
  overflow: visible;
  position: relative;
  width: 100%;
}

.wuwa-character-picker-head,
.wuwa-character-picker-actions {
  align-items: center;
  display: flex;
  justify-content: space-between;
  padding: 1rem 1.2rem;
}

.wuwa-character-picker-head {
  border-bottom: 1px solid color-mix(in srgb, var(--color-accent, #b8a5e3) 13%, transparent);
}

.wuwa-filter-panel-card .wuwa-character-picker-head {
  display: grid;
  gap: 0.8rem;
  grid-template-columns: 2.5rem minmax(0, 1fr) auto;
}

.wuwa-filter-panel-back {
  align-items: center;
  background: color-mix(in srgb, var(--color-bg-soft, #171820) 86%, transparent);
  border: 1px solid color-mix(in srgb, var(--color-accent, #b8a5e3) 20%, transparent);
  border-radius: 0.6rem;
  color: inherit;
  cursor: pointer;
  display: inline-flex;
  height: 2.5rem;
  justify-content: center;
  transition:
    background-color 220ms cubic-bezier(0.16, 1, 0.3, 1),
    border-color 220ms cubic-bezier(0.16, 1, 0.3, 1),
    transform 360ms cubic-bezier(0.16, 1, 0.3, 1);
  width: 2.5rem;
}

.wuwa-filter-panel-back:is(:hover, :focus-visible) {
  border-color: color-mix(in srgb, var(--color-accent, #b8a5e3) 64%, transparent);
  outline: none;
  transform: translateX(-0.12rem) scale(1.04);
}

.wuwa-character-picker-head span {
  color: var(--color-accent, #b8a5e3);
  display: block;
  font-size: 0.72rem;
  font-weight: 760;
  letter-spacing: 0.08em;
  margin-bottom: 0.2rem;
}

.wuwa-character-picker-head h3 {
  font-size: 1.3rem;
  margin: 0;
}

.wuwa-character-picker-close,
.wuwa-character-picker-clear,
.wuwa-character-picker-done {
  border: 1px solid color-mix(in srgb, var(--color-accent, #b8a5e3) 20%, transparent);
  border-radius: 0.6rem;
  color: inherit;
  font-weight: 720;
  min-height: 2.5rem;
  padding: 0.55rem 0.9rem;
  transition:
    background-color 220ms cubic-bezier(0.16, 1, 0.3, 1),
    border-color 220ms cubic-bezier(0.16, 1, 0.3, 1),
    transform 320ms cubic-bezier(0.16, 1, 0.3, 1);
}

.wuwa-character-picker-clear {
  background: color-mix(in srgb, var(--color-bg-soft, #171820) 86%, transparent);
}

.wuwa-character-picker-close {
  background: color-mix(in srgb, #ff6685 8%, var(--color-bg-soft, #171820));
  border-color: color-mix(in srgb, #ff6685 42%, transparent);
  color: color-mix(in srgb, #ff8299 88%, currentColor);
}

.wuwa-character-picker-done {
  background: var(--color-accent, #b8a5e3);
  border-color: transparent;
  color: var(--color-bg, #111218);
}

.wuwa-character-picker-close:is(:hover, :focus-visible),
.wuwa-character-picker-clear:is(:hover, :focus-visible),
.wuwa-character-picker-done:is(:hover, :focus-visible) {
  border-color: color-mix(in srgb, var(--color-accent, #b8a5e3) 64%, transparent);
  outline: none;
  transform: translateY(-0.1rem);
}

.wuwa-character-picker-close:is(:hover, :focus-visible) {
  background: color-mix(in srgb, #ff6685 14%, var(--color-bg-soft, #171820));
  border-color: color-mix(in srgb, #ff6685 72%, transparent);
  box-shadow: 0 0.65rem 1.5rem color-mix(in srgb, #ff6685 10%, transparent);
}

.wuwa-character-picker-clear.is-active {
  background: color-mix(in srgb, var(--color-accent, #b8a5e3) 14%, var(--color-bg-soft, #171820));
  border-color: color-mix(in srgb, var(--color-accent, #b8a5e3) 72%, transparent);
  box-shadow: 0 0.8rem 2rem color-mix(in srgb, var(--color-accent, #b8a5e3) 12%, transparent);
}

.wuwa-character-picker-body {
  min-height: 0;
  overflow: visible;
  padding: 0.7rem;
}

.wuwa-filter-panel-home {
  display: grid;
  gap: 0.55rem;
  grid-template-columns: max-content max-content minmax(1.25rem, 1fr);
  width: 100%;
}

.wuwa-filter-panel-field {
  background: color-mix(in srgb, var(--color-bg-soft, #171820) 84%, transparent);
  border: 1px solid color-mix(in srgb, var(--color-accent, #b8a5e3) 13%, transparent);
  border-radius: 0.68rem;
  display: grid;
  gap: 0.32rem;
  min-width: 0;
  padding: 0.48rem;
}

.wuwa-filter-panel-field > span {
  color: var(--color-text-secondary, #aaa5b5);
  font-size: 0.7rem;
  font-weight: 760;
  letter-spacing: 0.06em;
  padding-inline: 0.15rem;
}

.wuwa-filter-panel-field select {
  max-width: 100%;
  min-height: 2.25rem;
  width: 100%;
}

.wuwa-filter-panel-row {
  align-items: center;
  appearance: none;
  background: color-mix(in srgb, var(--color-bg-soft, #171820) 84%, transparent);
  border: 1px solid color-mix(in srgb, var(--color-accent, #b8a5e3) 13%, transparent);
  border-radius: 0.72rem;
  color: inherit;
  cursor: pointer;
  display: grid;
  font: inherit;
  gap: 0;
  grid-column: 1 / -1;
  grid-template-columns: subgrid;
  min-height: 3.45rem;
  padding: 0.65rem 0.55rem;
  text-align: left;
  transition:
    background-color 240ms cubic-bezier(0.16, 1, 0.3, 1),
    border-color 240ms cubic-bezier(0.16, 1, 0.3, 1),
    box-shadow 360ms cubic-bezier(0.16, 1, 0.3, 1),
    transform 360ms cubic-bezier(0.16, 1, 0.3, 1);
}

.wuwa-filter-panel-row > span {
  align-items: center;
  color: var(--color-text-secondary, #aaa5b5);
  display: flex;
  font-size: 0.78rem;
  font-weight: 760;
  letter-spacing: 0.08em;
  min-height: 1.35rem;
  padding-inline: 1em;
}

.wuwa-filter-panel-row > strong {
  align-items: center;
  display: flex;
  min-height: 1.35rem;
  min-width: 0;
  overflow: hidden;
  padding-inline: 1em;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.wuwa-filter-panel-row > i {
  color: var(--color-accent, #b8a5e3);
  justify-self: end;
  transition: transform 360ms cubic-bezier(0.16, 1, 0.3, 1);
}

.wuwa-filter-panel-row:is(:hover, :focus-visible) {
  background: color-mix(in srgb, var(--color-accent, #b8a5e3) 10%, var(--color-bg-soft, #171820));
  border-color: color-mix(in srgb, var(--color-accent, #b8a5e3) 52%, transparent);
  box-shadow: 0 0.8rem 2rem rgb(0 0 0 / 13%);
  outline: none;
  transform: translateY(-0.1rem) scale(1.006);
}

.wuwa-filter-panel-row:is(:hover, :focus-visible) > i {
  transform: translateX(0.18rem);
}

.wuwa-character-picker-grid {
  display: grid;
  gap: 0.65rem;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 11.25rem), 1fr));
}

.wuwa-character-picker-option {
  align-items: center;
  background: color-mix(in srgb, var(--color-bg-soft, #171820) 84%, transparent);
  border: 1px solid color-mix(in srgb, var(--color-accent, #b8a5e3) 13%, transparent);
  border-radius: 0.65rem;
  color: inherit;
  display: grid;
  gap: 0.65rem;
  grid-template-columns: 3.25rem minmax(0, 1fr);
  min-height: 4.15rem;
  padding: 0.45rem;
  text-align: left;
  touch-action: pan-y;
  transition:
    background-color 240ms cubic-bezier(0.16, 1, 0.3, 1),
    border-color 240ms cubic-bezier(0.16, 1, 0.3, 1),
    box-shadow 360ms cubic-bezier(0.16, 1, 0.3, 1),
    transform 360ms cubic-bezier(0.16, 1, 0.3, 1);
}

.wuwa-character-picker-option:is(:hover, :focus-visible) {
  border-color: color-mix(in srgb, var(--color-accent, #b8a5e3) 48%, transparent);
  outline: none;
  transform: translateY(-0.12rem) scale(1.008);
}

.wuwa-character-picker-option.is-active {
  background: color-mix(in srgb, var(--color-accent, #b8a5e3) 14%, var(--color-bg-soft, #171820));
  border-color: color-mix(in srgb, var(--color-accent, #b8a5e3) 72%, transparent);
  box-shadow: 0 0.8rem 2rem color-mix(in srgb, var(--color-accent, #b8a5e3) 12%, transparent);
}

.wuwa-character-picker-media {
  align-items: center;
  aspect-ratio: 1;
  background: color-mix(in srgb, var(--color-accent, #b8a5e3) 12%, var(--color-bg, #0c0d12));
  border-radius: 0.5rem;
  display: flex;
  justify-content: center;
  overflow: hidden;
  pointer-events: none;
  position: relative;
  touch-action: pan-y;
}

.wuwa-character-picker-grid:has(> .wuwa-character-version-group) {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.wuwa-character-version-group {
  display: grid;
  gap: 0.55rem;
  min-width: 0;
  animation: wuwa-character-version-enter 460ms cubic-bezier(0.16, 1, 0.3, 1) both;
}

.wuwa-character-version-heading {
  border-bottom: 1px solid color-mix(in srgb, var(--color-accent, #b8a5e3) 14%, transparent);
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0 0.15rem 0.38rem;
}

.wuwa-character-version-heading strong {
  font-size: 0.9rem;
}

.wuwa-character-version-heading small {
  color: var(--halo-text-color-secondary, #7c8491);
  font-size: 0.75rem;
}

.wuwa-character-version-options {
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 11.25rem), 1fr));
  width: 100%;
}

@keyframes wuwa-character-version-enter {
  from { opacity: 0; transform: translateY(0.35rem); }
  to { opacity: 1; transform: none; }
}

.wuwa-character-picker-media img {
  -webkit-user-drag: none;
  height: 100%;
  object-fit: contain;
  opacity: 0;
  pointer-events: none;
  position: absolute;
  inset: 0;
  touch-action: pan-y;
  user-select: none;
  width: 100%;
  transition:
    opacity 320ms cubic-bezier(0.16, 1, 0.3, 1),
    transform 420ms cubic-bezier(0.16, 1, 0.3, 1);
  transform: scale(0.94);
}

.wuwa-character-version-options .wuwa-character-picker-media img {
  object-fit: cover;
  object-position: 50% 33%;
}

.wuwa-character-picker-media.is-ready img {
  opacity: 1;
  transform: scale(1);
}

.wuwa-character-picker-media.is-placeholder {
  color: var(--color-accent, #b8a5e3);
  font-size: 1.05rem;
  font-weight: 800;
}

.wuwa-character-picker-copy {
  display: grid;
  gap: 0.2rem;
  min-width: 0;
}

.wuwa-character-picker-copy strong,
.wuwa-character-picker-copy small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.wuwa-character-picker-copy strong {
  font-size: 0.96rem;
}

.wuwa-character-picker-copy small {
  color: var(--color-text-secondary, #aaa5b5);
  font-size: 0.72rem;
}

.wuwa-character-picker-actions {
  border-top: 1px solid color-mix(in srgb, var(--color-accent, #b8a5e3) 13%, transparent);
  gap: 0.5rem;
  justify-content: flex-end;
  padding: 0.62rem 0.7rem;
}

@media (max-width: 720px) {
  .wuwa-character-filter {
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
  }

  .wuwa-character-filter-trigger {
    max-width: 100%;
    min-width: 0;
  }

  .wuwa-character-filter-result {
    margin: 0 0.15rem 0 auto;
    white-space: nowrap;
  }

  .wuwa-character-picker-dialog {
    left: 0.55rem;
    width: calc(100% - 1.1rem);
  }

  .wuwa-filter-option-dialog {
    inset: 0;
    left: 0;
    padding: 0.55rem;
    width: 100%;
  }

  .wuwa-filter-option-dialog .wuwa-character-picker-card {
    max-height: min(42rem, calc(100dvh - 1.1rem));
    width: 100%;
  }

  .wuwa-character-picker-card {
    border-radius: 0.9rem;
    width: 100%;
  }

  .wuwa-character-picker-head,
  .wuwa-character-picker-actions {
    padding: 0.85rem;
  }

  .wuwa-character-picker-body {
    padding: 0.62rem;
  }

  .wuwa-character-picker-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .wuwa-filter-panel-trigger {
    min-width: 0;
  }

  .wuwa-filter-sort-control {
    margin-left: auto;
  }
}

@media (max-width: 430px) {
  .wuwa-character-picker-grid {
    grid-template-columns: 1fr;
  }
}

@media (prefers-reduced-motion: reduce) {
  .wuwa-character-filter-trigger,
  .wuwa-filter-panel-trigger,
  .wuwa-filter-panel-count,
  .wuwa-filter-sort-control select,
  .wuwa-filter-panel-field select,
  .wuwa-filter-panel-back,
  .wuwa-filter-panel-row,
  .wuwa-archive-sort-trigger,
  .wuwa-archive-sort-menu,
  .wuwa-archive-sort-option,
  .wuwa-character-picker-dialog,
  .wuwa-character-picker-backdrop,
  .wuwa-character-picker-card,
  .wuwa-character-picker-option,
  .wuwa-character-picker-close,
  .wuwa-character-picker-clear,
  .wuwa-character-picker-done {
    transition-duration: 1ms !important;
  }

  .wuwa-character-version-group {
    animation: none !important;
  }
}

.archive-card[data-wuwa-pack-card="true"] {
  align-items: center;
  background: color-mix(in srgb, var(--color-bg-soft, #171820) 94%, transparent);
  border-color: color-mix(in srgb, var(--color-accent, #b79b55) 22%, transparent);
  box-sizing: border-box;
  display: grid;
  gap: clamp(0.9rem, 2.2vw, 1.35rem);
  grid-template-columns: clamp(96px, 11vw, 112px) minmax(0, 1fr);
  min-height: 128px;
  overflow: hidden;
  padding: 0.75rem;
  scale: 1;
  transition:
    opacity 240ms cubic-bezier(0.16, 1, 0.3, 1),
    transform 360ms cubic-bezier(0.16, 1, 0.3, 1),
    translate 360ms cubic-bezier(0.16, 1, 0.3, 1),
    scale 360ms cubic-bezier(0.16, 1, 0.3, 1),
    box-shadow 360ms cubic-bezier(0.16, 1, 0.3, 1),
    border-color 280ms cubic-bezier(0.16, 1, 0.3, 1),
    background-color 280ms cubic-bezier(0.16, 1, 0.3, 1);
  translate: 0 0;
}

.archive-card[data-wuwa-pack-card="true"]:is(:hover, :focus-visible) {
  background: color-mix(in srgb, var(--color-bg-soft, #171820) 88%, var(--color-accent, #b79b55) 12%);
  border-color: color-mix(in srgb, var(--color-accent, #b79b55) 52%, transparent);
  box-shadow: 0 0.8rem 2rem rgb(0 0 0 / 16%);
  scale: 1.004;
  translate: 0 -3px;
}

.archive-card[data-wuwa-pack-card="true"]:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--color-accent, #b79b55) 72%, white);
  outline-offset: 3px;
}

.archive-card[data-wuwa-pack-card="true"][hidden] {
  display: none !important;
}

.archive-card[data-wuwa-pack-card="true"][data-wuwa-filter-entering="true"] {
  opacity: 0;
  transform: translateY(0.7rem) scale(0.985);
}

.archive-card[data-wuwa-pack-card="true"] .archive-card-cover {
  align-items: center;
  align-self: center;
  background: color-mix(in srgb, var(--color-bg-soft, #171820) 84%, transparent);
  box-sizing: border-box;
  display: grid;
  aspect-ratio: 1;
  border-radius: clamp(0.75rem, 1.5vw, 1rem);
  grid-column: 1;
  height: auto;
  inset: auto;
  place-items: center;
  overflow: hidden;
  padding: clamp(0.4rem, 0.8vw, 0.65rem);
  position: relative;
  width: 100%;
}

.archive-card[data-wuwa-pack-card="true"] .archive-card-content {
  align-self: center;
  box-sizing: border-box;
  grid-column: 2;
  margin: 0;
  min-width: 0;
  padding: 0 clamp(0.5rem, 1.5vw, 1rem) 0 0;
}

.archive-card[data-wuwa-pack-card="true"] .archive-card-title {
  align-items: center;
  display: flex;
  font-size: clamp(1rem, 1.4vw, 1.18rem);
  gap: clamp(0.42rem, 1vw, 0.68rem);
  line-height: 1.35;
  margin-bottom: 0.35rem;
  min-width: 0;
}

.archive-card[data-wuwa-pack-card="true"] .wuwa-archive-card-title-text {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.archive-card[data-wuwa-pack-card="true"] .wuwa-archive-card-statistics {
  align-items: center;
  display: inline-flex;
  flex: 0 0 auto;
  gap: clamp(0.36rem, 0.8vw, 0.55rem);
  opacity: 1;
  transform: translateY(0) scale(1);
  transform-origin: left center;
  transition:
    opacity 280ms cubic-bezier(0.16, 1, 0.3, 1),
    transform 380ms cubic-bezier(0.16, 1, 0.3, 1);
}

.archive-card[data-wuwa-pack-card="true"] .wuwa-archive-card-statistics[data-state="loading"],
.archive-card[data-wuwa-pack-card="true"] .wuwa-archive-card-statistics[data-state="error"] {
  opacity: 0.46;
}

.archive-card[data-wuwa-pack-card="true"] .wuwa-archive-card-statistics[data-state="updating"] {
  opacity: 0.28;
  transform: translateY(0.22rem) scale(0.94);
}

.archive-card[data-wuwa-pack-card="true"] .wuwa-archive-card-stat {
  align-items: center;
  display: inline-flex;
  font-size: clamp(0.72rem, 1vw, 0.82rem);
  font-variant-numeric: tabular-nums;
  font-weight: 700;
  gap: 0.22rem;
  line-height: 1;
  white-space: nowrap;
}

.archive-card[data-wuwa-pack-card="true"] .wuwa-archive-card-favorites {
  color: color-mix(in srgb, #ff6685 82%, currentColor);
}

.archive-card[data-wuwa-pack-card="true"] .wuwa-archive-card-downloads {
  color: color-mix(in srgb, #d9b85f 88%, currentColor);
}

.archive-card[data-wuwa-pack-card="true"] .archive-card-desc {
  display: -webkit-box;
  line-height: 1.55;
  margin-bottom: 0.65rem;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
}

.archive-card[data-wuwa-pack-card="true"] .archive-card-meta,
.archive-card[data-wuwa-pack-card="true"] .archive-card-categories,
.archive-card[data-wuwa-pack-card="true"] .archive-card-tags {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
}

.archive-card[data-wuwa-pack-card="true"] :is(.archive-category, .archive-tag) {
  align-items: center;
  background: color-mix(in srgb, var(--color-accent, #b79b55) 8%, transparent);
  border: 1px solid color-mix(in srgb, var(--color-accent, #b79b55) 20%, transparent);
  border-radius: 999px;
  display: inline-flex;
  gap: 0.28rem;
  line-height: 1.2;
  padding: 0.28rem 0.5rem;
}

.archive-list .archive-card-date,
.archive-list .archive-card-month {
  display: none !important;
}

.archive-card[data-wuwa-pack-card="true"] .archive-card-cover img {
  grid-area: 1 / 1;
  height: 100%;
  object-fit: contain;
  object-position: 50% 50%;
  transition:
    opacity 320ms cubic-bezier(0.16, 1, 0.3, 1),
    transform 420ms cubic-bezier(0.16, 1, 0.3, 1);
  width: 100%;
}

.archive-card[data-wuwa-pack-card="true"] .archive-card-cover .wuwa-archive-random-sample {
  opacity: 0;
  transform: scale(0.94);
}

.archive-card[data-wuwa-pack-card="true"] .archive-card-cover[data-wuwa-sample-state="ready"] .wuwa-archive-random-sample {
  opacity: 1;
  transform: scale(1);
}

.archive-card[data-wuwa-pack-card="true"]:is(:hover, :focus-visible) .archive-card-cover img {
  transform: scale(1.055) rotate(-1deg);
}

.post-hero[data-wuwa-pack-hero="true"] {
  --wuwa-pack-hero-sample-size: clamp(132px, 14vw, 156px);
  --wuwa-pack-hero-tag-row-gap: 0.75rem;

  margin-bottom: 0;
  min-height: clamp(232px, 22vw, 268px);
}

article.post:has([data-wuwa-emoji-feed][data-wuwa-mounted="true"]) {
  padding-top: 0 !important;
}

.wuwa-archive-sample-placeholder {
  background:
    linear-gradient(110deg, transparent 25%, rgb(255 255 255 / 8%) 45%, transparent 65%),
    color-mix(in srgb, var(--color-accent, #b79b55) 11%, var(--color-bg, #0c0d12));
  background-size: 220% 100%;
  border-radius: 0.7rem;
  grid-area: 1 / 1;
  height: 100%;
  width: 100%;
  animation: wuwa-archive-sample-shimmer 1.7s cubic-bezier(0.45, 0, 0.55, 1) infinite;
}

@keyframes wuwa-archive-sample-shimmer {
  from { background-position: 120% 0; }
  to { background-position: -120% 0; }
}

article.post .post-share[hidden] {
  display: none !important;
}

.post-hero[data-wuwa-pack-hero="true"] .post-hero-bg {
  align-items: flex-start;
  background:
    radial-gradient(circle at 76% 42%, color-mix(in srgb, var(--color-accent, #b8a5e3) 20%, transparent), transparent 40%),
    color-mix(in srgb, var(--color-bg-soft, #171820) 92%, transparent);
  display: flex;
  justify-content: flex-end;
  padding: clamp(1rem, 3vw, 2.2rem) clamp(1.25rem, 5vw, 4rem);
}

.post-hero[data-wuwa-pack-hero="true"] .post-hero-bg img {
  background: color-mix(in srgb, var(--color-bg-soft, #171820) 78%, transparent);
  border: 2px solid color-mix(in srgb, var(--color-accent, #b8a5e3) 68%, transparent);
  border-radius: 1rem;
  box-shadow:
    0 0 0 3px color-mix(in srgb, var(--color-accent, #b8a5e3) 10%, transparent),
    0 0.8rem 1.6rem rgb(0 0 0 / 28%);
  box-sizing: border-box;
  filter: drop-shadow(0 0.8rem 1.6rem rgb(0 0 0 / 28%));
  height: var(--wuwa-pack-hero-sample-size);
  object-fit: contain;
  padding: 0.3rem;
  transform: none;
  transition:
    border-color 320ms ease,
    box-shadow 420ms cubic-bezier(0.16, 1, 0.3, 1),
    opacity 260ms ease,
    transform 480ms cubic-bezier(0.16, 1, 0.3, 1);
  width: var(--wuwa-pack-hero-sample-size);
}

.post-hero[data-wuwa-pack-hero="true"] .post-hero-bg img[data-wuwa-hero-sample-state="entering"] {
  opacity: 0.42;
  transform: translateY(0.35rem) scale(0.94);
}

.post-hero[data-wuwa-pack-hero="true"] .post-hero-bg img[data-wuwa-hero-sample-state="ready"] {
  opacity: 1;
}

.post-hero[data-wuwa-pack-hero="true"]:hover .post-hero-bg img {
  transform: translateY(-0.2rem) scale(1.035);
}

.wuwa-pack-title-row {
  align-items: center;
  display: flex;
  gap: 0.65rem;
  min-width: 0;
}

.post-hero[data-wuwa-pack-hero="true"] .post-hero-content {
  box-sizing: border-box;
  min-width: 0;
  width: 100%;
}

.post-hero[data-wuwa-pack-hero="true"] .wuwa-pack-hero-excerpt {
  animation: wuwa-pack-hero-detail-enter 460ms cubic-bezier(0.16, 1, 0.3, 1) both;
  color: var(--color-text-secondary, #aaa5b5);
  font-size: clamp(0.78rem, 1.25vw, 0.92rem);
  line-height: 1.65;
  margin: 0.5rem 0 0;
  max-width: min(100%, 46rem);
  overflow-wrap: anywhere;
}

.post-hero[data-wuwa-pack-hero="true"] .wuwa-pack-hero-footer {
  align-items: stretch;
  display: grid;
  gap: clamp(1rem, 2.4vw, 2rem);
  grid-template-columns: minmax(19rem, 0.85fr) minmax(0, 1.15fr);
  margin: 0;
  min-width: 0;
  width: 100%;
  animation: wuwa-pack-hero-detail-enter 520ms 45ms cubic-bezier(0.16, 1, 0.3, 1) both;
}

.post-hero[data-wuwa-pack-hero="true"] .wuwa-pack-hero-primary,
.post-hero[data-wuwa-pack-hero="true"] .wuwa-pack-hero-secondary {
  box-sizing: border-box;
  min-width: 0;
}

.post-hero[data-wuwa-pack-hero="true"] .wuwa-pack-hero-primary {
  align-items: flex-start;
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
  justify-content: flex-end;
}

.post-hero[data-wuwa-pack-hero="true"] .wuwa-pack-hero-secondary {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding-top: calc(var(--wuwa-pack-hero-sample-size) + 1.35rem);
}

.post-hero[data-wuwa-pack-hero="true"] .wuwa-pack-hero-primary .wuwa-pack-hero-excerpt {
  animation: none;
  margin: 0;
}

@keyframes wuwa-pack-hero-detail-enter {
  from {
    opacity: 0;
    transform: translateY(0.38rem);
  }
}

.post-hero[data-wuwa-pack-hero="true"] .wuwa-pack-hero-footer .post-hero-meta,
.post-hero[data-wuwa-pack-hero="true"] .wuwa-pack-hero-footer .post-hero-tags {
  bottom: auto !important;
  box-sizing: border-box;
  flex-wrap: wrap;
  flex: none;
  inset: auto !important;
  margin: 0;
  min-width: 0;
  padding: 0;
  position: static !important;
  transform: none !important;
}

.post-hero[data-wuwa-pack-hero="true"] .wuwa-pack-hero-footer .post-hero-meta {
  justify-content: flex-start;
}

.post-hero[data-wuwa-pack-hero="true"] .wuwa-pack-hero-footer .post-hero-tags {
  justify-content: flex-end;
  max-height: var(--wuwa-pack-tags-collapsed-height, 3.75rem);
  overflow: hidden;
  row-gap: var(--wuwa-pack-hero-tag-row-gap);
  transition: max-height 420ms cubic-bezier(0.16, 1, 0.3, 1);
  width: 100%;
}

.post-hero[data-wuwa-pack-hero="true"] .wuwa-pack-hero-tags-shell {
  display: grid;
  gap: var(--wuwa-pack-hero-tag-row-gap);
  justify-items: end;
  min-width: 0;
  width: 100%;
}

.post-hero[data-wuwa-pack-hero="true"] .wuwa-pack-hero-tags-shell[data-wuwa-tags-expanded="true"] .post-hero-tags {
  max-height: var(--wuwa-pack-tags-expanded-height, 20rem);
}

.post-hero[data-wuwa-pack-hero="true"] .wuwa-pack-hero-tags-shell[data-wuwa-tags-overflow="false"] .post-hero-tags {
  max-height: none;
}

.post-hero[data-wuwa-pack-hero="true"] .wuwa-pack-hero-tags-toggle {
  background: transparent;
  border: 0;
  color: var(--color-accent, #b8a05a);
  cursor: pointer;
  font: inherit;
  font-size: 0.75rem;
  font-weight: 700;
  line-height: 1.35;
  padding: 0.05rem 0;
  text-decoration: underline;
  text-underline-offset: 0.2em;
  transition:
    color 240ms cubic-bezier(0.16, 1, 0.3, 1),
    opacity 240ms cubic-bezier(0.16, 1, 0.3, 1),
    transform 320ms cubic-bezier(0.16, 1, 0.3, 1);
}

.post-hero[data-wuwa-pack-hero="true"] .wuwa-pack-hero-tags-toggle[hidden] {
  display: none !important;
}

.post-hero[data-wuwa-pack-hero="true"] .wuwa-pack-hero-tags-toggle:is(:hover, :focus-visible) {
  color: color-mix(in srgb, var(--color-accent, #b8a05a) 72%, var(--color-text, #f2f0f6));
  outline: none;
  transform: translateY(-0.08rem);
}

.post-hero[data-wuwa-pack-hero="true"] .wuwa-pack-hero-tags-toggle:active {
  opacity: 0.72;
  transform: scale(0.94);
}

.post-hero[data-wuwa-pack-hero="true"] .wuwa-pack-title-row .post-hero-title {
  margin: 0;
  min-width: 0;
  order: 0;
}

.post-hero[data-wuwa-pack-hero="true"] .wuwa-pack-title-copy {
  align-items: center;
  background: color-mix(in srgb, var(--color-bg-soft, #171820) 78%, transparent);
  border: 1px solid color-mix(in srgb, var(--color-accent, #b8a5e3) 28%, transparent);
  border-radius: 0.65rem;
  color: var(--color-text-secondary, #aaa5b5);
  display: inline-flex;
  flex: 0 0 2.15rem;
  height: 2.15rem;
  justify-content: center;
  margin: 0;
  order: 1;
  padding: 0;
  position: relative;
  transition:
    background-color 240ms cubic-bezier(0.16, 1, 0.3, 1),
    border-color 240ms cubic-bezier(0.16, 1, 0.3, 1),
    color 240ms cubic-bezier(0.16, 1, 0.3, 1),
    transform 360ms cubic-bezier(0.16, 1, 0.3, 1);
  width: 2.15rem;
}

.post-hero[data-wuwa-pack-hero="true"] .wuwa-pack-title-copy svg {
  height: 1rem;
  width: 1rem;
}

.post-hero[data-wuwa-pack-hero="true"] .wuwa-pack-title-copy:is(:hover, :focus-visible) {
  background: color-mix(in srgb, var(--color-accent, #b8a5e3) 13%, var(--color-bg-soft, #171820));
  border-color: color-mix(in srgb, var(--color-accent, #b8a5e3) 62%, transparent);
  color: var(--color-accent, #b8a5e3);
  outline: none;
  transform: translateY(-0.12rem) scale(1.04);
}

.post-hero[data-wuwa-pack-hero="true"] .wuwa-pack-title-copy:active {
  transform: scale(0.92);
}

.post-hero[data-wuwa-pack-hero="true"] .wuwa-pack-title-copy.is-copied {
  background: color-mix(in srgb, #4fcf8c 18%, var(--color-bg-soft, #171820));
  border-color: color-mix(in srgb, #4fcf8c 68%, transparent);
  color: #7ae7aa;
  transform: scale(1.06);
}

.post-hero[data-wuwa-pack-hero="true"] .wuwa-pack-title-copy .share-copy-bubble {
  bottom: auto;
  left: 50%;
  right: auto;
  top: calc(100% + 0.45rem);
  transform: translate(-50%, -0.3rem) scale(0.96);
}

.post-hero[data-wuwa-pack-hero="true"] .wuwa-pack-title-copy .share-copy-bubble::after {
  bottom: auto;
  top: -5px;
}

.post-hero[data-wuwa-pack-hero="true"] .wuwa-pack-title-copy.is-copied .share-copy-bubble {
  opacity: 1;
  transform: translate(-50%, 0) scale(1);
  visibility: visible;
}

.wuwa-pack-actions,
.wuwa-download-retry-panel {
  align-items: center;
  background: color-mix(in srgb, var(--color-bg-soft, #171820) 90%, transparent);
  border: 1px solid color-mix(in srgb, var(--color-accent, #b8a5e3) 20%, transparent);
  border-radius: 1rem;
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem 1rem;
  justify-content: space-between;
  margin: 0.75rem 0 1rem;
  padding: 0.85rem 1rem;
}

.wuwa-pack-actions-leading {
  align-items: center;
  display: flex;
  gap: 0.8rem;
  min-width: 0;
}

.wuwa-pack-sort-field {
  align-items: center;
  display: inline-flex;
  flex: 0 0 auto;
  gap: 0.45rem;
}

.wuwa-pack-sort-label {
  color: var(--color-text-secondary, #aaa5b5);
  font-size: 0.78rem;
  font-weight: 700;
  white-space: nowrap;
}

.wuwa-pack-actions-copy {
  align-items: center;
  display: flex;
  min-width: 0;
}

.wuwa-pack-actions-summary {
  color: var(--color-text-secondary, #aaa5b5);
  font-size: 0.78rem;
  white-space: nowrap;
}

.wuwa-pack-actions-notice {
  color: var(--color-text-secondary, #aaa5b5);
  flex: 1 1 100%;
  font-size: 0.74rem;
  order: 4;
}

.wuwa-pack-actions > .wuwa-pack-heading-toggle {
  display: none !important;
}

.wuwa-pack-actions-buttons {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}

.wuwa-pack-sort-picker {
  flex-basis: 6.75rem;
  z-index: 2;
}

.wuwa-pack-action,
.wuwa-selection-action,
.wuwa-download-dialog-actions button,
.wuwa-download-retry-close,
.wuwa-download-retry-link {
  align-items: center;
  background: color-mix(in srgb, var(--color-bg, #0c0d12) 78%, transparent);
  border: 1px solid color-mix(in srgb, var(--color-accent, #b8a5e3) 24%, transparent);
  border-radius: 0.72rem;
  color: var(--color-text, #f2f0f6);
  display: inline-flex;
  justify-content: center;
  min-height: 2.6rem;
  padding: 0.5rem 0.85rem;
  text-decoration: none;
  transition:
    background-color 200ms ease,
    border-color 200ms ease,
    opacity 200ms ease,
    transform 320ms cubic-bezier(0.16, 1, 0.3, 1);
}

.wuwa-pack-action-primary,
.wuwa-download-dialog-actions .is-confirm {
  background: var(--color-accent, #b8a5e3);
  border-color: transparent;
  color: var(--color-bg, #111218);
}

.wuwa-download-dialog-actions .is-danger {
  background: color-mix(in srgb, #e25562 88%, var(--color-bg, #111218));
  border-color: color-mix(in srgb, #ff7380 74%, transparent);
  color: #fff7f8;
}

.wuwa-pack-action:is(:hover, :focus-visible),
.wuwa-selection-action:is(:hover, :focus-visible),
.wuwa-download-dialog-actions button:is(:hover, :focus-visible),
.wuwa-download-retry-link:is(:hover, :focus-visible) {
  outline: none;
  transform: translateY(-0.1rem) scale(1.018);
}

.wuwa-pack-action:disabled,
.wuwa-selection-action:disabled {
  cursor: not-allowed !important;
  opacity: 0.44;
  transform: none;
}

.wuwa-pack-actions-notice.is-alerting {
  animation: wuwa-notice-pop 480ms cubic-bezier(0.16, 1, 0.3, 1);
}

.wuwa-selection-marker {
  align-items: center;
  background: var(--color-accent, #b8a5e3);
  border: 2px solid color-mix(in srgb, var(--color-bg, #111218) 88%, transparent);
  border-radius: 50%;
  color: var(--color-bg, #111218);
  display: flex;
  font-size: 0.72rem;
  font-weight: 900;
  height: 1.45rem;
  justify-content: center;
  opacity: 0;
  position: absolute;
  right: 0.38rem;
  top: 0.38rem;
  transform: scale(0.65) rotate(-12deg);
  transition:
    opacity 180ms ease,
    transform 320ms cubic-bezier(0.16, 1, 0.3, 1);
  width: 1.45rem;
  z-index: 3;
}

[data-wuwa-selection-mode="true"] .wuwa-emote-card {
  cursor: pointer;
}

[data-wuwa-selection-mode="true"] .wuwa-emote-card.is-selected {
  box-shadow: 0 0 0 2px var(--color-accent, #b8a5e3) inset;
  transform: translateY(-0.14rem) scale(0.985);
}

[data-wuwa-selection-mode="true"] .wuwa-emote-card.is-selected .wuwa-selection-marker {
  opacity: 1;
  transform: scale(1) rotate(0);
}

.wuwa-selection-bar {
  align-items: center;
  backdrop-filter: blur(18px) saturate(1.22);
  background: color-mix(in srgb, var(--color-bg, #0c0d12) 88%, transparent);
  border: 1px solid color-mix(in srgb, var(--color-accent, #b8a5e3) 26%, transparent);
  border-radius: 1rem;
  bottom: calc(0.75rem + env(safe-area-inset-bottom));
  box-shadow: 0 1rem 3rem rgb(0 0 0 / 34%);
  display: flex;
  gap: 0.45rem;
  left: 50%;
  max-width: min(94vw, 920px);
  opacity: 0;
  overflow-x: auto;
  padding: 0.55rem;
  position: fixed;
  transform: translate(-50%, 1.2rem) scale(0.97);
  transition:
    opacity 220ms ease,
    transform 420ms cubic-bezier(0.16, 1, 0.3, 1);
  width: max-content;
  z-index: 1600;
}

.wuwa-selection-bar.is-visible {
  opacity: 1;
  transform: translate(-50%, 0) scale(1);
}

.wuwa-selection-count {
  align-items: center;
  color: var(--color-text, #f2f0f6);
  display: flex;
  font-size: 0.8rem;
  padding-inline: 0.55rem;
  white-space: nowrap;
}

html[data-wuwa-selection-open="true"] body {
  padding-bottom: calc(5.4rem + env(safe-area-inset-bottom));
}

.wuwa-download-dialog-layer {
  align-items: center;
  background: rgb(0 0 0 / 58%);
  display: flex;
  inset: 0;
  justify-content: center;
  opacity: 0;
  padding: 1rem;
  position: fixed;
  transition: opacity 200ms ease;
  z-index: 1900;
}

.wuwa-download-dialog-layer.is-visible {
  opacity: 1;
}

.wuwa-download-dialog {
  background: var(--color-bg, #111218);
  border: 1px solid color-mix(in srgb, var(--color-accent, #b8a5e3) 26%, transparent);
  border-radius: 1.05rem;
  box-shadow: 0 1.5rem 5rem rgb(0 0 0 / 48%);
  color: var(--color-text, #f2f0f6);
  max-width: 28rem;
  padding: 1.25rem;
  transform: translateY(1rem) scale(0.96);
  transition: transform 400ms cubic-bezier(0.16, 1, 0.3, 1);
  width: 100%;
}

.wuwa-download-dialog-layer.is-visible .wuwa-download-dialog {
  transform: translateY(0) scale(1);
}

.wuwa-download-dialog h2 {
  font-size: 1.05rem;
  margin: 0 0 0.85rem;
}

.wuwa-download-dialog p {
  color: var(--color-text-secondary, #aaa5b5);
  font-size: 0.86rem;
  line-height: 1.6;
  margin: 0.35rem 0;
}

.wuwa-download-dialog-copy {
  min-height: 2.75rem;
  transition: color 180ms ease;
}

.wuwa-download-dialog-actions {
  display: flex;
  gap: 0.55rem;
  justify-content: flex-end;
  margin-top: 1rem;
}

.wuwa-download-retry-panel {
  display: grid;
  opacity: 0;
  transform: translateY(-0.45rem) scale(0.99);
  transition:
    opacity 200ms ease,
    transform 360ms cubic-bezier(0.16, 1, 0.3, 1);
}

.wuwa-download-retry-panel.is-visible {
  opacity: 1;
  transform: none;
}

.wuwa-download-retry-list {
  display: flex;
  flex: 1 1 100%;
  flex-wrap: wrap;
  gap: 0.4rem;
  max-height: 10rem;
  overflow: auto;
  width: 100%;
}

.wuwa-download-retry-link {
  font-size: 0.74rem;
  max-width: min(100%, 20rem);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

@keyframes wuwa-notice-pop {
  0% { opacity: 0.45; transform: translateY(0.3rem); }
  100% { opacity: 1; transform: none; }
}

.wuwa-emote-feed {
  --wuwa-gap: clamp(0.55rem, 1.6vw, 0.9rem);
  margin: 0.75rem 0 1.5rem;
}

.post-content .wuwa-crowdfunding-section {
  contain: layout paint style;
  isolation: isolate;
  width: 100%;
}

html[data-wuwa-pack-navigation-follow="true"] {
  overflow-anchor: none;
}

.wuwa-emote-batch[data-wuwa-navigation-shell="true"] .wuwa-emote-card {
  animation: wuwa-navigation-shell-enter 320ms cubic-bezier(0.16, 1, 0.3, 1) both;
}

@keyframes wuwa-navigation-shell-enter {
  from {
    opacity: 0.76;
    transform: translateY(0.4rem) scale(0.992);
  }
}

.post-content h2.wuwa-crowdfunding-heading {
  align-items: baseline;
  display: flex;
  gap: 0.75rem;
  justify-content: space-between;
}

.post-content h2.wuwa-crowdfunding-heading::after {
  content: none;
  display: none;
}

.post-content .wuwa-crowdfunding-toggle {
  align-items: center;
  align-self: auto;
  background: transparent;
  border: 0;
  color: var(--color-accent, #b8a05a);
  cursor: pointer;
  display: inline-flex;
  flex: 0 0 auto;
  font: inherit;
  font-size: 0.78rem;
  font-weight: 700;
  gap: 0.42rem;
  line-height: 1;
  padding: 0;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.2em;
  transition:
    color 240ms cubic-bezier(0.16, 1, 0.3, 1),
    opacity 240ms cubic-bezier(0.16, 1, 0.3, 1);
}

.post-content .wuwa-crowdfunding-toggle:is(:hover, :focus-visible) {
  color: color-mix(in srgb, var(--color-accent, #b8a05a) 72%, var(--color-text, #f2f0f6));
  outline: none;
}

.post-content .wuwa-crowdfunding-toggle:active {
  opacity: 0.72;
}

.post-content .wuwa-crowdfunding-toggle-icon {
  border-bottom: 2px solid currentColor;
  border-right: 2px solid currentColor;
  display: block;
  height: 0.42rem;
  transform: translateY(-0.12rem) rotate(45deg);
  transition: transform 360ms cubic-bezier(0.16, 1, 0.3, 1);
  width: 0.42rem;
}

.post-content .wuwa-crowdfunding-toggle[aria-expanded="true"] .wuwa-crowdfunding-toggle-icon {
  transform: translateY(0.12rem) rotate(225deg);
}

.post-content .wuwa-crowdfunding-section .table-scroll {
  display: grid;
  grid-template-rows: 0fr;
  max-width: none;
  opacity: 0;
  overflow: clip;
  transform: translateY(-0.35rem);
  transition:
    grid-template-rows 460ms cubic-bezier(0.16, 1, 0.3, 1),
    opacity 260ms cubic-bezier(0.4, 0, 1, 1),
    transform 420ms cubic-bezier(0.16, 1, 0.3, 1);
  width: 100%;
}

.post-content .wuwa-crowdfunding-section .wuwa-crowdfunding-body {
  display: grid;
  gap: clamp(0.75rem, 1.8vw, 1.1rem);
  min-height: 0;
  min-width: 0;
  max-width: none;
  overflow: hidden;
  width: 100%;
}

.post-content .wuwa-crowdfunding-section .wuwa-crowdfunding-content-inner {
  max-width: none;
  min-width: 0;
  width: 100%;
}

.post-content .wuwa-crowdfunding-section.is-expanded .table-scroll {
  grid-template-rows: 1fr;
  opacity: 1;
  transform: none;
}

.post-content .wuwa-crowdfunding-section .wuwa-concert-crowdfunding-gallery {
  display: grid;
  gap: clamp(0.7rem, 1.8vw, 1rem);
  margin: 0 auto;
  max-width: 46rem;
  min-width: 0;
  width: 100%;
}

.post-content .wuwa-crowdfunding-section .wuwa-concert-crowdfunding-gallery figure {
  background: transparent;
  border: 0;
  border-radius: 0.78rem;
  box-shadow: none;
  line-height: 0;
  margin: 0;
  overflow: hidden;
  padding: 0;
}

.post-content .wuwa-crowdfunding-section .wuwa-concert-crowdfunding-gallery img {
  border: 0;
  border-radius: 0;
  box-shadow: none;
  display: block;
  height: auto;
  margin: 0 !important;
  max-width: none;
  padding: 0;
  transform: none;
  width: 100%;
}

.post-content .wuwa-crowdfunding-section table {
  border: 0;
  border-collapse: separate;
  border-spacing: 0;
  display: block;
  margin: 0;
  max-width: none;
  min-height: 0;
  overflow: hidden;
  table-layout: fixed;
  width: 100%;
}

.post-content .wuwa-crowdfunding-section thead,
.post-content .wuwa-crowdfunding-section thead tr,
.post-content .wuwa-crowdfunding-section thead th {
  box-sizing: border-box;
  display: flex;
  width: 100%;
}

.post-content .wuwa-crowdfunding-section thead th {
  align-items: center;
  background: color-mix(in srgb, var(--color-accent, #b8a05a) 38%, transparent);
  border: 1px solid color-mix(in srgb, var(--color-accent, #b8a05a) 58%, transparent);
  border-radius: 0.85rem;
  box-sizing: border-box;
  display: flex;
  font-weight: 700;
  justify-content: center;
  min-height: 3.15rem;
  padding: 0.75rem 1rem;
  text-align: center;
  width: 100%;
}

.post-content .wuwa-crowdfunding-section tbody {
  display: grid;
  gap: clamp(0.4rem, 1vw, 0.65rem);
  grid-template-columns: repeat(auto-fit, minmax(min(9.5rem, 100%), 1fr));
  margin-top: 0.35rem;
  padding-top: 0.3rem;
  width: 100%;
}

.post-content .wuwa-crowdfunding-section tbody tr {
  display: flex;
  min-width: 0;
}

.post-content .wuwa-crowdfunding-section tbody td {
  align-items: center;
  animation: wuwa-crowdfunding-cell-enter 420ms cubic-bezier(0.16, 1, 0.3, 1) backwards;
  background: color-mix(in srgb, var(--color-bg, #111218) 82%, white 5%);
  border: 1px solid color-mix(in srgb, var(--color-text, #f2f0f6) 12%, transparent);
  border-radius: 0.78rem;
  box-sizing: border-box;
  display: flex;
  justify-content: center;
  min-height: 3.2rem;
  min-width: 0;
  overflow-wrap: anywhere;
  padding: 0.68rem 0.8rem;
  text-align: center;
  width: 100%;
}

@keyframes wuwa-crowdfunding-cell-enter {
  from { opacity: 0; transform: translateY(0.45rem) scale(0.985); }
  to { opacity: 1; transform: none; }
}

.wuwa-download-format-grid {
  display: grid;
  gap: 0.65rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-top: 1rem;
}

.wuwa-download-format {
  align-items: flex-start;
  background: color-mix(in srgb, var(--color-bg, #111218) 78%, white 6%);
  border: 1px solid color-mix(in srgb, var(--color-text, #f2f0f6) 18%, transparent);
  border-radius: 0.85rem;
  color: var(--color-text, #f2f0f6);
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
  min-height: 5rem;
  padding: 0.9rem;
  text-align: left;
  transition:
    border-color 180ms ease,
    box-shadow 280ms cubic-bezier(0.16, 1, 0.3, 1),
    transform 280ms cubic-bezier(0.16, 1, 0.3, 1);
}

.wuwa-download-format span {
  color: var(--color-text-secondary, #aaa5b5);
  font-size: 0.76rem;
}

.wuwa-download-format .wuwa-download-format-meta {
  color: var(--color-text, #f2f0f6);
  font-size: 0.8rem;
  font-weight: 720;
  margin-top: auto;
  padding-top: 0.45rem;
}

.wuwa-download-format[aria-busy="true"] .wuwa-download-format-meta {
  animation: wuwa-download-meta-pulse 1.15s ease-in-out infinite alternate;
}

.wuwa-download-format.is-recommended {
  border-color: color-mix(in srgb, var(--color-accent, #b8a5e3) 58%, transparent);
}

.wuwa-download-format:not(:disabled):is(:hover, :focus-visible) {
  border-color: var(--color-accent, #b8a5e3);
  box-shadow: 0 0.75rem 1.8rem rgb(0 0 0 / 20%);
  transform: translateY(-0.16rem) scale(1.01);
}

.wuwa-download-format:disabled {
  cursor: not-allowed;
  opacity: 0.42;
}

.wuwa-download-format[aria-busy="true"] {
  opacity: 0.68;
}

@keyframes wuwa-download-meta-pulse {
  from { opacity: 0.45; }
  to { opacity: 1; }
}

@media (max-width: 430px) {
  .wuwa-download-format-grid {
    grid-template-columns: 1fr;
  }
}

.wuwa-pack-actions-copy {
  align-items: center;
  display: flex;
  flex-wrap: nowrap;
  gap: 0;
}

.wuwa-pack-favorite-count,
.wuwa-pack-download-count {
  align-items: center;
  display: inline-flex;
  gap: 0.22rem;
  font-size: 0.82rem;
  font-weight: 700;
  transform-origin: center;
  white-space: nowrap;
}

.wuwa-pack-favorite-count {
  color: color-mix(in srgb, #ff6685 82%, currentColor);
}

.wuwa-pack-download-count {
  color: color-mix(in srgb, #d9b85f 88%, currentColor);
}

.wuwa-pack-favorite-count::before,
.wuwa-pack-download-count::before {
  color: var(--color-text-secondary, #aaa5b5);
  content: "·";
  margin: 0 0.45rem;
}

.post-content .wuwa-video-intro {
  margin: var(--wuwa-gap) auto;
  max-width: 44rem;
  min-width: 0;
  width: min(100%, 44rem);
}

.post-content .wuwa-video-intro-heading {
  display: none;
}

.wuwa-video-card {
  background: color-mix(in srgb, var(--color-bg-soft, #171820) 94%, transparent);
  border: 1px solid color-mix(in srgb, #fb7299 28%, transparent);
  border-radius: 1rem;
  box-shadow: 0 0.65rem 1.8rem rgb(0 0 0 / 12%);
  color: var(--color-text, #f2f0f6);
  display: grid;
  gap: clamp(0.8rem, 2.2vw, 1.15rem);
  grid-template-columns: minmax(12rem, 15rem) minmax(0, 1fr);
  min-width: 0;
  overflow: hidden;
  padding: 0.72rem;
  text-decoration: none !important;
  transform: translateY(0) scale(1);
  transition:
    background-color 280ms ease,
    border-color 280ms ease,
    box-shadow 440ms cubic-bezier(0.16, 1, 0.3, 1),
    transform 440ms cubic-bezier(0.16, 1, 0.3, 1);
}

.wuwa-video-card:is(:hover, :focus-visible) {
  background: color-mix(in srgb, var(--color-bg-soft, #171820) 92%, #fb7299 8%);
  border-color: color-mix(in srgb, #fb7299 68%, transparent);
  box-shadow: 0 1rem 2.5rem color-mix(in srgb, #fb7299 15%, rgb(0 0 0 / 18%));
  outline: none;
  transform: translateY(-0.22rem) scale(1.008);
}

.wuwa-video-card:active {
  transform: translateY(-0.06rem) scale(0.992);
}

.wuwa-video-card-media {
  aspect-ratio: 16 / 9;
  background:
    linear-gradient(135deg, color-mix(in srgb, #fb7299 28%, transparent), transparent 62%),
    color-mix(in srgb, var(--color-bg, #0c0d12) 86%, #fb7299 14%);
  border-radius: 0.72rem;
  display: grid;
  min-width: 0;
  overflow: hidden;
  place-items: center;
  position: relative;
}

.wuwa-video-card-media::before {
  color: color-mix(in srgb, currentColor 68%, transparent);
  content: "视频封面";
  font-size: 0.75rem;
  font-weight: 720;
  letter-spacing: 0.08em;
}

.wuwa-video-card-cover {
  display: block;
  height: 100%;
  inset: 50% auto auto 50%;
  max-height: 100%;
  max-width: 100%;
  object-fit: contain;
  position: absolute;
  transform: translate(-50%, -50%);
  transition: transform 680ms cubic-bezier(0.16, 1, 0.3, 1);
  width: auto;
  z-index: 1;
}

.wuwa-opus-card-media[hidden] {
  display: none !important;
}

.post-content .wuwa-video-card .wuwa-video-card-cover,
.post-content .wuwa-video-card .wuwa-video-card-owner-avatar {
  border-style: solid;
  box-shadow: none;
  margin: 0 !important;
  max-width: none;
  padding: 0;
}

.post-content .wuwa-video-card .wuwa-video-card-cover {
  border: 0;
  height: 100% !important;
  max-height: 100%;
  max-width: 100%;
  width: auto !important;
}

.wuwa-video-card:hover .wuwa-video-card-cover,
.wuwa-video-card:focus-visible .wuwa-video-card-cover {
  transform: translate(-50%, -50%) scale(1.045);
}

.wuwa-video-card-cover[hidden],
.wuwa-video-card-owner-avatar[hidden] {
  display: none;
}

.wuwa-video-card-duration {
  background: rgb(0 0 0 / 72%);
  border-radius: 0.38rem;
  bottom: 0.45rem;
  color: #fff;
  font-size: 0.7rem;
  font-variant-numeric: tabular-nums;
  font-weight: 760;
  line-height: 1;
  padding: 0.3rem 0.38rem;
  position: absolute;
  right: 0.45rem;
  z-index: 2;
}

.wuwa-video-card-body {
  align-content: center;
  display: grid;
  gap: 0.5rem;
  min-width: 0;
  padding: 0.22rem 0.35rem 0.22rem 0;
}

.wuwa-video-card-kicker {
  color: #fb7299;
  font-size: 0.7rem;
  font-weight: 760;
  letter-spacing: 0.05em;
}

.wuwa-video-card-title {
  display: -webkit-box;
  font-size: clamp(0.95rem, 1.7vw, 1.1rem);
  line-height: 1.45;
  min-width: 0;
  overflow: hidden;
  overflow-wrap: anywhere;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.wuwa-video-card-meta {
  align-items: center;
  color: var(--color-text-secondary, #aaa5b5);
  display: flex;
  flex-wrap: wrap;
  font-size: 0.7rem;
  font-variant-numeric: tabular-nums;
  gap: 0.3rem 0.55rem;
  line-height: 1.4;
  min-width: 0;
}

.wuwa-video-card-bvid,
.wuwa-video-card-published {
  min-width: 0;
  overflow-wrap: anywhere;
}

.wuwa-video-card-bvid {
  color: color-mix(in srgb, var(--color-text, #f2f0f6) 82%, #fb7299 18%);
  font-weight: 720;
}

.wuwa-video-card-owner {
  align-items: center;
  color: var(--color-text-secondary, #aaa5b5);
  display: flex;
  font-size: 0.76rem;
  gap: 0.48rem;
  min-width: 0;
}

.wuwa-video-card-owner-avatar,
.wuwa-video-card-owner.has-image-error::before {
  background: color-mix(in srgb, #fb7299 24%, var(--color-bg, #0c0d12));
  border: 1px solid color-mix(in srgb, #fb7299 28%, transparent);
  border-radius: 50%;
  flex: 0 0 1.65rem;
  height: 1.65rem;
  object-fit: cover;
  width: 1.65rem;
}

.wuwa-video-card-owner.has-image-error::before {
  align-items: center;
  color: #fb7299;
  content: "UP";
  display: inline-flex;
  font-size: 0.52rem;
  font-weight: 800;
  justify-content: center;
}

.wuwa-video-card-owner-name {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

@media (max-width: 720px) {
  .post-content .wuwa-video-intro {
    max-width: 100%;
    width: 100%;
  }

  .wuwa-video-card {
    gap: clamp(0.52rem, 2vw, 0.72rem);
    grid-template-columns: minmax(7rem, 38%) minmax(0, 1fr);
    max-width: 100%;
    padding: 0.5rem;
  }

  .wuwa-video-card-body {
    gap: 0.32rem;
    padding: 0.08rem 0.08rem 0.08rem 0;
  }

  .wuwa-video-card-kicker {
    font-size: 0.62rem;
  }

  .wuwa-video-card-title {
    font-size: clamp(0.78rem, 3.3vw, 0.92rem);
    line-height: 1.32;
  }

  .wuwa-video-card-meta {
    font-size: 0.61rem;
    gap: 0.18rem 0.38rem;
  }

  .wuwa-video-card-owner {
    font-size: 0.68rem;
    gap: 0.36rem;
  }

  .wuwa-video-card-owner-avatar,
  .wuwa-video-card-owner.has-image-error::before {
    flex-basis: 1.35rem;
    height: 1.35rem;
    width: 1.35rem;
  }
}

.wuwa-favorite-section {
  background: color-mix(in srgb, var(--card-bg, #181b24) 76%, transparent);
  border: 1px solid color-mix(in srgb, #ff6685 22%, transparent);
  border-radius: 1rem;
  margin: 0.8rem 0 var(--wuwa-gap);
  opacity: 0;
  padding: clamp(0.7rem, 2vw, 1rem);
  transform: translateY(0.45rem) scale(0.99);
  transition: opacity 260ms ease, transform 420ms cubic-bezier(0.16, 1, 0.3, 1);
}

.wuwa-favorite-section.is-updating {
  opacity: 1;
  transform: none;
}

.wuwa-favorite-heading {
  align-items: center;
  color: color-mix(in srgb, #ff6685 82%, currentColor);
  display: flex;
  gap: 0.45rem;
  margin-bottom: 0.65rem;
}

.wuwa-favorite-actions {
  align-items: center;
  display: flex;
  gap: 0.45rem;
  margin-left: auto;
}

.wuwa-favorite-action {
  align-items: center;
  background: color-mix(in srgb, var(--color-bg, #0c0d12) 74%, transparent);
  border: 1px solid color-mix(in srgb, var(--color-accent, #b8a5e3) 28%, transparent);
  border-radius: 0.68rem;
  color: var(--color-text, #f2f0f6);
  display: inline-flex;
  font-size: 0.76rem;
  font-weight: 720;
  gap: 0.35rem;
  justify-content: center;
  min-height: 2.75rem;
  padding: 0.42rem 0.72rem;
  transition:
    background-color 220ms ease,
    border-color 220ms ease,
    box-shadow 360ms cubic-bezier(0.16, 1, 0.3, 1),
    color 220ms ease,
    opacity 220ms ease,
    transform 360ms cubic-bezier(0.16, 1, 0.3, 1);
}

.wuwa-favorite-download {
  background: color-mix(in srgb, var(--color-accent, #b8a5e3) 16%, var(--color-bg, #0c0d12));
  border-color: color-mix(in srgb, var(--color-accent, #b8a5e3) 48%, transparent);
}

.wuwa-favorite-clear {
  border-color: color-mix(in srgb, #ff6685 42%, transparent);
  color: color-mix(in srgb, #ff8299 88%, currentColor);
}

.wuwa-favorite-action:not(:disabled):is(:hover, :focus-visible) {
  box-shadow: 0 0.65rem 1.5rem color-mix(in srgb, currentColor 10%, transparent);
  outline: none;
  transform: translateY(-0.12rem) scale(1.018);
}

.wuwa-favorite-clear:not(:disabled):is(:hover, :focus-visible) {
  background: color-mix(in srgb, #ff6685 14%, var(--color-bg, #0c0d12));
  border-color: color-mix(in srgb, #ff6685 72%, transparent);
}

.wuwa-favorite-action:disabled {
  cursor: not-allowed;
  opacity: 0.42;
  transform: none;
}

.post-content .wuwa-favorite-heading h2 {
  font-size: 0.95rem;
  margin: 0;
}

.wuwa-favorite-grid {
  display: grid;
  gap: var(--wuwa-gap);
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.wuwa-emote-grid {
  display: block;
}

.wuwa-emote-batch {
  display: grid;
  gap: var(--wuwa-gap);
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-bottom: var(--wuwa-gap);
}

.wuwa-emote-card {
  appearance: none;
  background: color-mix(in srgb, var(--card-bg, #181b24) 92%, transparent);
  border: 1px solid color-mix(in srgb, currentColor 12%, transparent);
  border-radius: 0.9rem;
  box-shadow: 0 0.45rem 1.4rem rgb(0 0 0 / 10%);
  color: inherit;
  cursor: zoom-in;
  display: block;
  min-width: 0;
  overflow: hidden;
  padding: 0;
  position: relative;
  scale: 1;
  transition:
    border-color 280ms cubic-bezier(0.16, 1, 0.3, 1),
    box-shadow 360ms cubic-bezier(0.16, 1, 0.3, 1),
    scale 360ms cubic-bezier(0.16, 1, 0.3, 1),
    translate 360ms cubic-bezier(0.16, 1, 0.3, 1);
  translate: 0 0;
  width: 100%;
}

.wuwa-emote-card:hover,
.wuwa-emote-card:focus-within {
  border-color: color-mix(in srgb, var(--primary-color, #78d7ff) 52%, transparent);
  box-shadow: 0 0.8rem 2rem rgb(0 0 0 / 18%);
  outline: none;
  scale: 1.004;
  translate: 0 -3px;
}

.wuwa-emote-media {
  appearance: none;
  align-items: center;
  aspect-ratio: 1;
  background: transparent;
  border: 0;
  color: inherit;
  cursor: zoom-in;
  display: flex;
  justify-content: center;
  overflow: hidden;
  position: relative;
  width: 100%;
}

.wuwa-emote-media:focus-visible {
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--primary-color, #78d7ff) 62%, transparent) inset;
  outline: none;
}

.wuwa-emote-card-actions {
  backdrop-filter: blur(16px) saturate(1.08);
  background: color-mix(in srgb, var(--card-bg, #181b24) 91%, transparent);
  border: 1px solid color-mix(in srgb, var(--text-color, #f2efe8) 13%, transparent);
  border-radius: 0.82rem;
  box-shadow:
    0 0.45rem 1.1rem rgb(0 0 0 / 18%),
    0 1px 0 rgb(255 255 255 / 5%) inset;
  display: grid;
  gap: 0.22rem;
  grid-template-columns: 1fr 1fr;
  margin: -0.12rem 0.38rem 0.38rem;
  padding: 0.2rem;
  position: relative;
  z-index: 2;
}

.wuwa-emote-card-action {
  align-items: center;
  appearance: none;
  background: color-mix(in srgb, var(--text-color, #f2efe8) 3%, transparent);
  border: 1px solid transparent;
  border-radius: 0.62rem;
  color: color-mix(in srgb, var(--text-color, #f2efe8) 76%, transparent);
  cursor: pointer;
  display: flex;
  font: inherit;
  font-size: clamp(0.68rem, 0.82vw, 0.78rem);
  font-weight: 720;
  gap: 0.32rem;
  justify-content: center;
  letter-spacing: 0.02em;
  min-height: 44px;
  min-width: 44px;
  padding: 0.35rem 0.28rem;
  transition:
    background 260ms cubic-bezier(0.16, 1, 0.3, 1),
    border-color 260ms cubic-bezier(0.16, 1, 0.3, 1),
    box-shadow 360ms cubic-bezier(0.16, 1, 0.3, 1),
    color 260ms cubic-bezier(0.16, 1, 0.3, 1),
    transform 360ms cubic-bezier(0.16, 1, 0.3, 1);
}

.wuwa-emote-action-count {
  font-variant-numeric: tabular-nums;
  min-width: 1ch;
  transform-origin: center;
}

.wuwa-emote-card-action:is(:hover, :focus-visible) {
  outline: none;
  transform: translateY(-2px) scale(1.025);
}

.wuwa-emote-favorite:is(:hover, :focus-visible),
.wuwa-emote-favorite.is-active {
  background: color-mix(in srgb, #ff6685 16%, transparent);
  border-color: color-mix(in srgb, #ff6685 48%, transparent);
  box-shadow: 0 0.45rem 1.1rem color-mix(in srgb, #ff6685 13%, transparent);
  color: #ff86a0;
}

.wuwa-emote-download:is(:hover, :focus-visible) {
  background: color-mix(in srgb, #d9b85f 16%, transparent);
  border-color: color-mix(in srgb, #d9b85f 52%, transparent);
  box-shadow: 0 0.45rem 1.1rem color-mix(in srgb, #d9b85f 13%, transparent);
  color: #e6c971;
}

.wuwa-emote-card-action:focus-visible {
  box-shadow:
    0 0 0 2px color-mix(in srgb, var(--card-bg, #181b24) 92%, transparent),
    0 0 0 4px color-mix(in srgb, currentColor 56%, transparent);
}

.wuwa-emote-card-action:active { transform: translateY(0) scale(0.95); }
.wuwa-emote-card-action:disabled { cursor: not-allowed; opacity: 0.42; transform: none; }
.wuwa-emote-favorite.is-active .wuwa-emote-action-icon { animation: wuwa-heart-pop 420ms cubic-bezier(0.16, 1, 0.3, 1); }

.wuwa-emote-action-icon {
  flex: 0 0 auto;
  font-size: 0.92rem;
  line-height: 1;
}

.wuwa-emote-action-label {
  line-height: 1;
  white-space: nowrap;
}

@keyframes wuwa-heart-pop {
  0% { transform: scale(0.65) rotate(-12deg); }
  55% { transform: scale(1.28) rotate(7deg); }
  100% { transform: none; }
}

.wuwa-emote-media img {
  -webkit-user-drag: none;
  height: 100%;
  object-fit: contain;
  opacity: 0;
  pointer-events: none;
  transform: scale(0.985);
  transition:
    opacity 280ms ease,
    transform 420ms cubic-bezier(0.16, 1, 0.3, 1);
  user-select: none;
  width: 100%;
}

.wuwa-emote-card[data-state="loaded"] img {
  opacity: 1;
  transform: scale(1);
}

.wuwa-emote-placeholder {
  background:
    linear-gradient(110deg, transparent 25%, rgb(255 255 255 / 10%) 45%, transparent 65%),
    color-mix(in srgb, currentColor 7%, transparent);
  background-size: 220% 100%;
  inset: 0;
  position: absolute;
}

.wuwa-emote-card[data-state="queued"] .wuwa-emote-placeholder,
.wuwa-emote-card[data-state="loading"] .wuwa-emote-placeholder {
  animation: wuwa-emote-shimmer 1.35s ease-in-out infinite;
}

.wuwa-emote-card[data-state="loaded"] .wuwa-emote-placeholder {
  opacity: 0;
  pointer-events: none;
  transition: opacity 240ms ease;
}

.wuwa-emote-retry {
  background: color-mix(in srgb, var(--primary-color, #78d7ff) 18%, #111 82%);
  border: 1px solid color-mix(in srgb, var(--primary-color, #78d7ff) 55%, transparent);
  border-radius: 999px;
  color: inherit;
  cursor: inherit;
  font: inherit;
  left: 50%;
  padding: 0.45rem 0.8rem;
  position: absolute;
  pointer-events: none;
  top: 50%;
  transform: translate(-50%, -50%);
}

.wuwa-emote-status {
  align-items: center;
  color: color-mix(in srgb, currentColor 62%, transparent);
  display: flex;
  font-size: 0.86rem;
  justify-content: center;
  min-height: 3.5rem;
  text-align: center;
}

.wuwa-emote-sentinel {
  height: 1px;
  pointer-events: none;
}

@keyframes wuwa-emote-shimmer {
  from { background-position: 100% 0; }
  to { background-position: -100% 0; }
}

.lg-backdrop {
  background:
    radial-gradient(circle at 50% 42%, rgb(41 54 70 / 42%), transparent 42%),
    rgb(5 9 14 / 94%) !important;
  backdrop-filter: none;
  transition: opacity 180ms cubic-bezier(0.4, 0, 0.2, 1);
}

.lg-backdrop.wuwa-lg-closing {
  backdrop-filter: blur(0) saturate(100%);
  opacity: 0 !important;
  transition-duration: 180ms !important;
  transition-timing-function:
    cubic-bezier(0.4, 0, 0.2, 1),
    cubic-bezier(0.4, 0, 0.2, 1) !important;
}

html[data-wuwa-gallery-opening="true"] .lg-outer:not(.wuwa-lg-ready) {
  opacity: 0 !important;
  pointer-events: none !important;
  visibility: hidden !important;
}

.lg-outer.wuwa-lg-modern {
  --wuwa-lg-safe-bottom: max(1rem, env(safe-area-inset-bottom));
  background: transparent;
  opacity: 0;
  transition: opacity 300ms cubic-bezier(0.4, 0, 0.2, 1);
}

.lg-outer.wuwa-lg-modern.wuwa-lg-ready {
  opacity: 1 !important;
}

.lg-outer.wuwa-lg-modern.wuwa-lg-closing {
  opacity: 0 !important;
  pointer-events: none !important;
  visibility: visible !important;
  transition-duration: 180ms;
}

.lg-outer.wuwa-lg-modern .lg {
  background: transparent;
}

.lg-outer.wuwa-lg-modern .lg-inner {
  bottom: calc(8.75rem + env(safe-area-inset-bottom));
}

.lg-outer.wuwa-lg-modern .lg-item,
.lg-outer.wuwa-lg-modern .lg-img-wrap {
  padding: clamp(0.75rem, 2.5vw, 2rem);
  touch-action: none;
}

.lg-outer.wuwa-lg-modern .lg-image {
  /* LightGallery declares width:auto !important; keep the intended preview size. */
  width: min(70vw, 480px) !important;
  height: auto;
  object-fit: contain;
  border-radius: clamp(0.8rem, 1.8vw, 1.35rem);
  filter: none;
  max-height: 100%;
  max-width: 100%;
  transition:
    opacity 300ms cubic-bezier(0.4, 0, 0.2, 1),
    transform 420ms cubic-bezier(0.16, 1, 0.3, 1);
}

.lg-outer.wuwa-lg-modern.wuwa-lg-closing .lg-image {
  filter: none;
  opacity: 0;
  transform: translateY(0.7rem) scale(0.96) !important;
  transition-duration: 180ms;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}

.lg-outer.wuwa-lg-modern .lg-toolbar {
  align-items: center;
  background:
    linear-gradient(145deg, rgb(31 40 53 / 88%), rgb(14 20 28 / 94%));
  border: 1px solid rgb(255 255 255 / 13%);
  border-radius: 1.15rem;
  bottom: var(--wuwa-lg-safe-bottom);
  box-shadow:
    0 1.25rem 3.2rem rgb(0 0 0 / 40%),
    inset 0 1px 0 rgb(255 255 255 / 9%);
  display: flex;
  float: none;
  gap: 0.22rem;
  height: auto;
  left: 50%;
  max-width: calc(100vw - 1.5rem);
  opacity: 0 !important;
  overflow: hidden;
  padding: 0.42rem;
  right: auto;
  top: auto;
  transform: translate(-50%, 1rem) scale(0.96);
  transition:
    opacity 240ms ease,
    transform 480ms cubic-bezier(0.16, 1, 0.3, 1);
  width: max-content;
}

.lg-outer.wuwa-lg-modern.wuwa-lg-ready .lg-toolbar {
  opacity: 1 !important;
  transform: translate(-50%, 0) scale(1);
}

.lg-outer.wuwa-lg-modern.wuwa-lg-closing .lg-toolbar {
  opacity: 0 !important;
  transform: translate(-50%, 0.85rem) scale(0.97);
  transition-duration: 280ms;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}

.lg-outer.wuwa-lg-modern .lg-actions {
  display: none;
}

.lg-outer.wuwa-lg-modern .lg-toolbar .lg-icon,
.lg-outer.wuwa-lg-modern .lg-toolbar .lg-prev,
.lg-outer.wuwa-lg-modern .lg-toolbar .lg-next {
  font-size: 20px;
  line-height: 1;
  align-items: center;
  background: transparent;
  border: 0;
  border-radius: 0.78rem;
  color: rgb(236 242 247 / 78%);
  display: inline-flex;
  float: none;
  height: 2.9rem;
  inset: auto;
  justify-content: center;
  margin: 0;
  opacity: 1;
  padding: 0;
  position: relative;
  transform: none;
  transition:
    background-color 180ms ease,
    color 180ms ease,
    transform 320ms cubic-bezier(0.16, 1, 0.3, 1);
  width: 2.9rem;
}

.lg-outer.wuwa-lg-modern .lg-toolbar .lg-icon:hover,
.lg-outer.wuwa-lg-modern .lg-toolbar .lg-icon:focus-visible,
.lg-outer.wuwa-lg-modern .lg-toolbar .lg-prev:hover,
.lg-outer.wuwa-lg-modern .lg-toolbar .lg-prev:focus-visible,
.lg-outer.wuwa-lg-modern .lg-toolbar .lg-next:hover,
.lg-outer.wuwa-lg-modern .lg-toolbar .lg-next:focus-visible {
  background: rgb(255 255 255 / 10%);
  color: #fff;
  outline: none;
  transform: translateY(-0.12rem) scale(1.04);
}

.lg-outer.wuwa-lg-modern .lg-toolbar .lg-prev::before,
.lg-outer.wuwa-lg-modern .lg-toolbar .lg-next::before {
  border-bottom: 0.14rem solid currentColor;
  border-left: 0.14rem solid currentColor;
  content: "" !important;
  display: block;
  height: 0.58rem;
  width: 0.58rem;
}

.lg-outer.wuwa-lg-modern .lg-toolbar .lg-prev::before {
  transform: rotate(45deg);
}

.lg-outer.wuwa-lg-modern .lg-toolbar .lg-next::before {
  transform: rotate(225deg);
}

.lg-outer.wuwa-lg-modern .lg-toolbar .lg-close {
  color: rgb(255 197 197 / 92%);
}

.lg-outer.wuwa-lg-modern .lg-toolbar #lg-download {
  color: rgb(177 227 218 / 95%);
}

.lg-outer.wuwa-lg-modern .wuwa-lg-toast {
  align-items: center;
  box-sizing: border-box;
  background: linear-gradient(145deg, rgb(35 48 56 / 96%), rgb(18 27 34 / 98%));
  border: 1px solid rgb(177 227 218 / 38%);
  border-radius: 999px;
  bottom: calc(var(--wuwa-lg-safe-bottom) + 4.25rem);
  box-shadow: 0 0.8rem 2rem rgb(0 0 0 / 34%);
  color: rgb(210 242 235 / 98%);
  display: flex;
  font-size: 0.82rem;
  font-weight: 700;
  left: 50%;
  letter-spacing: 0.04em;
  line-height: 1.6;
  max-width: calc(100vw - 2rem);
  min-height: 2.3rem;
  opacity: 0;
  padding: 0.15rem 1rem;
  pointer-events: none;
  position: fixed;
  text-align: center;
  transform: translate(-50%, 0.65rem) scale(0.94);
  transition:
    opacity 180ms ease,
    transform 420ms cubic-bezier(0.16, 1, 0.3, 1);
  z-index: 1082;
  width: max-content;
}

.lg-outer.wuwa-lg-modern .wuwa-lg-toast.is-visible {
  opacity: 1;
  transform: translate(-50%, 0) scale(1);
}

.lg-outer.wuwa-lg-modern .wuwa-lg-toast[hidden] {
  display: none;
}

.wuwa-emote-status[hidden] {
  display: none;
}

.lg-outer.wuwa-lg-modern .lg-toolbar #lg-actual-size::after,
.lg-outer.wuwa-lg-modern .lg-toolbar #lg-download::after {
  content: none !important;
}

.lg-outer.wuwa-lg-modern .lg-toolbar #wuwa-lg-favorite.is-active {
  color: rgb(255 153 181 / 96%);
  transform: scale(1.08);
}

.lg-outer.wuwa-lg-modern #lg-counter {
  align-items: center;
  align-self: stretch;
  background: rgb(255 255 255 / 7%);
  border-radius: 0.7rem;
  color: rgb(236 242 247 / 74%);
  display: inline-flex;
  font-size: 0.78rem;
  font-variant-numeric: tabular-nums;
  justify-content: center;
  min-width: 3.35rem;
  order: 4;
  padding: 0 0.55rem;
}

.lg-outer.wuwa-lg-modern .lg-sub-html {
  background: transparent;
  bottom: calc(5.25rem + env(safe-area-inset-bottom));
  color: rgb(238 243 248 / 74%);
  font-size: 0.86rem;
  padding: 0.35rem 1rem;
  pointer-events: none;
}

.lg-outer.wuwa-lg-modern .lg-sub-html p {
  margin: 0;
}

.lg-outer.wuwa-lg-modern .lg-prev { order: 1; }
.lg-outer.wuwa-lg-modern #lg-zoom-out { order: 2; }
.lg-outer.wuwa-lg-modern #lg-actual-size { order: 3; }
.lg-outer.wuwa-lg-modern #lg-zoom-in { order: 5; }
.lg-outer.wuwa-lg-modern #wuwa-lg-favorite { order: 6; }
.lg-outer.wuwa-lg-modern #lg-download { order: 7; }
.lg-outer.wuwa-lg-modern .lg-next { order: 8; }
.lg-outer.wuwa-lg-modern .lg-close { order: 9; }

@media (max-width: 720px) {
  .wuwa-character-filter {
    align-items: center;
  }

  .wuwa-character-filter-result {
    padding-top: 0;
  }

  .archive-card[data-wuwa-pack-card="true"] {
    align-items: center;
    gap: clamp(0.7rem, 3vw, 0.9rem);
    grid-template-columns: clamp(82px, 25vw, 100px) minmax(0, 1fr);
    min-height: 0;
    padding: clamp(0.65rem, 3vw, 0.8rem);
  }

  .archive-card[data-wuwa-pack-card="true"] .archive-card-cover {
    height: auto;
    margin: 0;
    width: 100%;
  }

  .archive-card[data-wuwa-pack-card="true"] .archive-card-content {
    padding: 0;
  }

  .archive-card[data-wuwa-pack-card="true"] .archive-card-title {
    font-size: 1rem;
    margin-bottom: 0.3rem;
  }

  .archive-card[data-wuwa-pack-card="true"] .archive-card-desc {
    font-size: 0.78rem;
    margin-bottom: 0.55rem;
    -webkit-line-clamp: 2;
  }

  .archive-card[data-wuwa-pack-card="true"] .archive-card-meta,
  .archive-card[data-wuwa-pack-card="true"] .archive-card-categories,
  .archive-card[data-wuwa-pack-card="true"] .archive-card-tags {
    gap: 0.3rem;
  }

  .archive-card[data-wuwa-pack-card="true"] :is(.archive-category, .archive-tag) {
    font-size: 0.68rem;
    padding: 0.24rem 0.4rem;
  }

  .wuwa-pack-actions {
    align-items: center;
  }

  .wuwa-pack-actions-leading {
    flex: 1 1 100%;
    flex-wrap: wrap;
    order: 1;
  }

  .wuwa-pack-actions > .wuwa-pack-heading-toggle {
    margin-left: auto !important;
    order: 2;
  }

  .wuwa-pack-actions-buttons,
  .wuwa-pack-actions-notice {
    flex: 1 1 100%;
  }

  .wuwa-pack-actions-buttons {
    order: 3;
  }

  .wuwa-pack-actions-buttons > .wuwa-pack-action {
    flex: 1 1 auto;
    min-width: max-content;
    padding-inline: 0.5rem;
    white-space: nowrap;
  }

  .wuwa-pack-sort-picker {
    flex: 1 1 6.75rem;
    width: auto;
  }

  .wuwa-pack-sort-picker .wuwa-archive-sort-trigger {
    width: 100%;
  }

  .wuwa-selection-bar {
    border-radius: 0.9rem;
    max-width: calc(100vw - 1rem);
    padding: 0.45rem;
  }

  .wuwa-selection-action {
    min-height: 2.75rem;
    white-space: nowrap;
  }

  .wuwa-drift-wall::after {
    background:
      radial-gradient(
        ellipse 68% 34% at 50% 50%,
        rgb(7 8 12 / 94%) 0%,
        rgb(7 8 12 / 82%) 40%,
        rgb(7 8 12 / 24%) 68%,
        transparent 88%
      );
  }

  .hero[data-wuwa-drift-hero="true"] {
    align-items: center;
    padding-top: 13vh;
  }

  .hero[data-wuwa-drift-hero="true"] > .container {
    margin-inline: auto;
    min-width: 0;
    width: 100%;
  }

  .hero[data-wuwa-drift-hero="true"] .hero-profile {
    gap: 24px;
    grid-template-columns: 1fr;
    justify-items: center;
    text-align: center;
    width: min(90vw, 100%);
  }

  .hero[data-wuwa-drift-hero="true"] .hero-avatar-wrapper {
    width: clamp(104px, 29vw, 142px);
  }

  .hero[data-wuwa-drift-hero="true"] .hero-info {
    align-items: center;
    max-width: 92vw;
    text-align: center;
  }

  .hero[data-wuwa-drift-hero="true"] .hero-bio {
    margin-inline: auto;
  }

  .wuwa-emote-batch {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .wuwa-favorite-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }

  .wuwa-emote-card {
    border-radius: 0.62rem;
  }

  .lg-outer.wuwa-lg-modern .lg-inner {
    bottom: calc(7.9rem + env(safe-area-inset-bottom));
  }

  .lg-outer.wuwa-lg-modern .lg-toolbar {
    border-radius: 0.95rem;
    gap: 0.02rem;
    padding: 0.2rem;
  }

  .lg-outer.wuwa-lg-modern #lg-zoom-out,
  .lg-outer.wuwa-lg-modern[data-wuwa-infinite-gallery-lightbox] #lg-actual-size,
  .lg-outer.wuwa-lg-modern #lg-zoom-in {
    display: none;
  }

  .lg-outer.wuwa-lg-modern .lg-toolbar .lg-icon,
  .lg-outer.wuwa-lg-modern .lg-toolbar .lg-prev,
  .lg-outer.wuwa-lg-modern .lg-toolbar .lg-next {
    border-radius: 0.68rem;
    box-sizing: border-box;
    flex: 0 0 2.75rem;
    height: 2.75rem;
    width: 2.75rem;
  }

  .lg-outer.wuwa-lg-modern #lg-counter {
    box-sizing: border-box;
    flex: 0 0 auto;
    min-width: 3.5rem;
    white-space: nowrap;
    padding-inline: 0.12rem;
  }

  .lg-outer.wuwa-lg-modern .lg-sub-html {
    bottom: calc(4.65rem + env(safe-area-inset-bottom));
  }
}

@media (max-width: 768px) {
  .post-hero[data-wuwa-pack-hero="true"] {
    --wuwa-pack-mobile-cover-size: clamp(104px, 18vw, 116px);
    --wuwa-pack-hero-sample-size: var(--wuwa-pack-mobile-cover-size);

    min-height: 0;
  }

  .post-hero[data-wuwa-pack-hero="true"] .post-hero-bg {
    align-items: flex-start;
    justify-content: center;
    opacity: 0.62;
    padding: 1rem;
  }

  .post-hero[data-wuwa-pack-hero="true"] .post-hero-bg img {
    height: var(--wuwa-pack-mobile-cover-size);
    width: var(--wuwa-pack-mobile-cover-size);
  }

  .post-hero[data-wuwa-pack-hero="true"] .post-hero-content {
    flex: 0 0 auto;
    justify-content: flex-start;
    padding: calc(var(--wuwa-pack-mobile-cover-size) + 2rem) 1rem 0.25rem;
    text-align: center;
  }

  .post-hero[data-wuwa-pack-hero="true"] .wuwa-pack-hero-excerpt {
    margin-inline: auto;
    max-width: 38rem;
  }

  .post-hero[data-wuwa-pack-hero="true"] .wuwa-pack-hero-footer {
    align-items: stretch;
    gap: 0.6rem;
    grid-template-columns: minmax(0, 1fr);
  }

  .post-hero[data-wuwa-pack-hero="true"] .wuwa-pack-hero-primary {
    align-items: center;
  }

  .post-hero[data-wuwa-pack-hero="true"] .wuwa-pack-hero-secondary {
    padding-top: 0;
  }

  .post-hero[data-wuwa-pack-hero="true"] .wuwa-pack-title-row {
    align-items: center;
    justify-content: center;
  }

  .post-hero[data-wuwa-pack-hero="true"] .wuwa-pack-hero-footer .post-hero-meta {
    flex: none;
    justify-content: center;
    width: 100%;
  }

  .post-hero[data-wuwa-pack-hero="true"] .wuwa-pack-hero-footer .post-hero-tags {
    align-self: auto;
    flex: none;
    justify-content: center;
    padding: 0;
    width: 100%;
  }

  .post-hero[data-wuwa-pack-hero="true"] .wuwa-pack-hero-tags-shell {
    box-sizing: border-box;
    justify-items: center;
    padding-inline: clamp(0.75rem, 3vw, 1.25rem);
  }
}

@media (max-width: 360px) {
  .wuwa-emote-batch,
  .wuwa-favorite-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-height: 650px) and (min-width: 721px) {
  .hero[data-wuwa-drift-hero="true"] .hero-profile {
    transform: translateY(-3vh) scale(0.88) !important;
  }
}

.header .header-left > nav#nav > [data-wuwa-gallery-nav="true"] {
  transform-origin: center;
  transition:
    color 220ms ease,
    opacity 220ms ease,
    transform 420ms cubic-bezier(0.16, 1, 0.3, 1);
}

.header .header-left > nav#nav > [data-wuwa-gallery-nav="true"]:is(:hover, :focus-visible),
.header .header-left > nav#nav > [data-wuwa-gallery-nav="true"].is-active {
  transform: translateY(-1px) scale(1.035);
}

#pjax-main .hero-compass .compass-title {
  font-size: clamp(1.75rem, 3vw, 2rem);
  line-height: 1.4;
}

#pjax-main .hero-compass .compass-subtitle {
  font-size: clamp(0.98rem, 1.7vw, 1.08rem);
  line-height: 1.7;
}

#pjax-main .hero-compass .compass-grid {
  gap: clamp(0.5rem, 1vw, 0.75rem);
}

#pjax-main .hero-compass .compass-item {
  flex: 1 1 9rem;
  font-size: clamp(0.96rem, 1.6vw, 1.08rem);
  max-width: 13rem;
  min-height: 3.5rem;
  padding: 0.78rem 1.25rem;
}

#pjax-main .hero-compass .compass-item .nav-custom-icon {
  font-size: clamp(1.25rem, 2vw, 1.5rem);
  height: 1.5rem;
  width: 1.5rem;
}

/* Serenity 的 AOS 三秒兜底会与欢迎层争抢状态。首页导航使用单一时钟，
   等欢迎层结束后再按固定顺序入场，避免项目暂时消失或只播放一部分。 */
#pjax-main .hero-compass :is(.compass-title, .compass-subtitle, .compass-item) {
  animation: none !important;
  opacity: 0;
  transform: translate3d(0, 1.4rem, 0);
}

html:not(.welcome-pending) #pjax-main .hero-compass .compass-title {
  animation: wuwa-home-compass-enter 800ms cubic-bezier(0.16, 1, 0.3, 1) both !important;
}

html:not(.welcome-pending) #pjax-main .hero-compass .compass-subtitle {
  animation: wuwa-home-compass-enter 800ms cubic-bezier(0.16, 1, 0.3, 1) 80ms both !important;
}

html:not(.welcome-pending) #pjax-main .hero-compass .compass-item:nth-child(1) {
  animation: wuwa-home-compass-enter 800ms cubic-bezier(0.16, 1, 0.3, 1) 140ms both !important;
}

html:not(.welcome-pending) #pjax-main .hero-compass .compass-item:nth-child(2) {
  animation: wuwa-home-compass-enter 800ms cubic-bezier(0.16, 1, 0.3, 1) 200ms both !important;
}

html:not(.welcome-pending) #pjax-main .hero-compass .compass-item:nth-child(3) {
  animation: wuwa-home-compass-enter 800ms cubic-bezier(0.16, 1, 0.3, 1) 260ms both !important;
}

html:not(.welcome-pending) #pjax-main .hero-compass .compass-item:nth-child(4) {
  animation: wuwa-home-compass-enter 800ms cubic-bezier(0.16, 1, 0.3, 1) 320ms both !important;
}

html:not(.welcome-pending) #pjax-main .hero-compass .compass-item:nth-child(n+5) {
  animation: wuwa-home-compass-enter 800ms cubic-bezier(0.16, 1, 0.3, 1) 380ms both !important;
}

@keyframes wuwa-home-compass-enter {
  from {
    opacity: 0;
    transform: translate3d(0, 1.4rem, 0);
  }
  to {
    opacity: 1;
    transform: none;
  }
}

@media (max-width: 480px) {
  #pjax-main .hero-compass .compass-title {
    font-size: 1.55rem;
  }

  #pjax-main .hero-compass .compass-subtitle {
    font-size: 0.92rem;
  }

  #pjax-main .hero-compass .compass-item {
    font-size: 0.95rem;
    min-height: 3.25rem;
    padding: 0.68rem 0.9rem;
  }
}

.wuwa-infinite-gallery-page {
  --wuwa-gallery-gap: clamp(0.62rem, 1.35vw, 1rem);
  box-sizing: border-box;
  margin: 0 auto;
  max-width: var(--max-width, 1200px);
  min-height: 70vh;
  padding: 0 var(--space-5) clamp(3rem, 8vw, 6rem);
  transition: opacity 380ms cubic-bezier(0.16, 1, 0.3, 1);
  width: 100%;
}

.wuwa-infinite-gallery-page .page-header {
  margin-bottom: var(--space-6);
  padding-top: calc(var(--header-height) + var(--space-8));
  text-align: center;
}

.wuwa-infinite-gallery-page:not([data-wuwa-gallery-gate="waiting"])[data-wuwa-gallery-gate] .page-header,
.wuwa-infinite-gallery-page:not([data-wuwa-gallery-gate="waiting"])[data-wuwa-gallery-gate] .archive-main {
  animation: wuwa-archive-section-enter 800ms cubic-bezier(0.25, 0.46, 0.45, 0.94) both;
}

.wuwa-infinite-gallery-page:not([data-wuwa-gallery-gate="waiting"])[data-wuwa-gallery-gate] .archive-main {
  animation-delay: 100ms;
}

.wuwa-infinite-gallery-page .archive-layout {
  max-width: 100%;
  width: 100%;
}

.wuwa-infinite-gallery-page .archive-layout:not([data-wuwa-gallery-sidebar-state="ready"]) {
  grid-template-columns: minmax(0, 1fr);
}

.wuwa-infinite-gallery-page .archive-layout:not([data-wuwa-gallery-sidebar-state="ready"]) > .archive-sidebar {
  display: none;
}

#pjax-main [data-wuwa-infinite-gallery-page="true"]:not([data-wuwa-infinite-gallery-mounted="true"]),
.wuwa-infinite-gallery-page[data-wuwa-gallery-gate="waiting"] {
  opacity: 0;
  pointer-events: none;
  visibility: hidden;
}

.wuwa-infinite-gallery-page .wuwa-infinite-gallery-controls {
  align-items: center;
  box-sizing: border-box;
  max-width: 100%;
  margin-bottom: 0.75rem;
  position: sticky;
  top: calc(var(--header-height, 72px) + 0.6rem);
  z-index: 20;
}

.wuwa-infinite-gallery-page .wuwa-filter-panel-trigger {
  flex: 0 1 auto;
}

.wuwa-infinite-gallery-page .wuwa-archive-filter-field {
  flex: 0 1 auto;
  max-width: 100%;
}

.wuwa-infinite-gallery-shuffle,
.wuwa-infinite-gallery-page .wuwa-infinite-gallery-my-favorites,
.wuwa-infinite-gallery-page .wuwa-infinite-gallery-retry-packs,
.wuwa-infinite-gallery-page .wuwa-infinite-gallery-retry {
  appearance: none;
  background: color-mix(in srgb, var(--card-bg, #181b24) 86%, var(--color-accent, #c5a85a) 6%);
  border: 1px solid color-mix(in srgb, var(--color-accent, #c5a85a) 30%, transparent);
  border-radius: 0.78rem;
  color: var(--color-text-primary, #f2efe8);
  font: inherit;
  font-size: 0.82rem;
  font-weight: 720;
  min-height: 44px;
  padding: 0.55rem 0.78rem;
  transition:
    background 260ms cubic-bezier(0.16, 1, 0.3, 1),
    border-color 260ms ease,
    box-shadow 420ms cubic-bezier(0.16, 1, 0.3, 1),
    color 260ms ease,
    transform 380ms cubic-bezier(0.16, 1, 0.3, 1);
}

.wuwa-infinite-gallery-shuffle,
.wuwa-infinite-gallery-page .wuwa-infinite-gallery-my-favorites,
.wuwa-infinite-gallery-page .wuwa-infinite-gallery-retry-packs,
.wuwa-infinite-gallery-page .wuwa-infinite-gallery-retry {
  align-items: center;
  cursor: pointer;
  display: inline-flex;
  gap: 0.42rem;
  justify-content: center;
}

.wuwa-infinite-gallery-page :is(
  .wuwa-infinite-gallery-shuffle,
  .wuwa-infinite-gallery-my-favorites,
  .wuwa-infinite-gallery-retry-packs,
  .wuwa-infinite-gallery-retry
):is(:hover, :focus-visible) {
  background: color-mix(in srgb, var(--card-bg, #181b24) 72%, var(--color-accent, #c5a85a) 13%);
  border-color: color-mix(in srgb, var(--color-accent, #c5a85a) 62%, transparent);
  outline: none;
  transform: translateY(-2px) scale(1.018);
}

.wuwa-infinite-gallery-page .wuwa-infinite-gallery-my-favorites {
  color: var(--color-text-secondary, #aaa5b5);
}

.wuwa-infinite-gallery-page .wuwa-infinite-gallery-my-favorites.is-active {
  background: color-mix(in srgb, var(--card-bg, #181b24) 68%, var(--color-accent, #c5a85a) 18%);
  border-color: color-mix(in srgb, var(--color-accent, #c5a85a) 78%, transparent);
  box-shadow:
    0 0 0 1px color-mix(in srgb, var(--color-accent, #c5a85a) 22%, transparent),
    0 0 1.15rem color-mix(in srgb, var(--color-accent, #c5a85a) 34%, transparent);
  color: var(--color-accent, #c5a85a);
  transform: translateY(-1px);
}

.wuwa-infinite-gallery-page .wuwa-infinite-gallery-result {
  color: var(--color-text-secondary, #aaa5b5);
  font-size: 0.82rem;
  margin-left: auto;
  padding: 0.7rem 0.35rem;
  white-space: nowrap;
}

.wuwa-infinite-gallery-page .wuwa-infinite-gallery-notice,
.wuwa-infinite-gallery-page .wuwa-infinite-gallery-status {
  color: var(--color-text-secondary, #aaa5b5);
  font-size: 0.78rem;
  min-height: 1.25rem;
  text-align: center;
}

.wuwa-infinite-gallery-page .wuwa-infinite-gallery-batch {
  display: grid;
  gap: var(--wuwa-gallery-gap);
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-bottom: var(--wuwa-gallery-gap);
}

.wuwa-infinite-gallery-page .wuwa-infinite-gallery-card {
  background: color-mix(in srgb, var(--card-bg, #181b24) 94%, transparent);
  border: 1px solid color-mix(in srgb, currentColor 12%, transparent);
  border-radius: 0.94rem;
  box-shadow: 0 0.45rem 1.35rem rgb(0 0 0 / 11%);
  min-width: 0;
  overflow: hidden;
  position: relative;
  scale: 1;
  transition:
    border-color 280ms cubic-bezier(0.16, 1, 0.3, 1),
    box-shadow 360ms cubic-bezier(0.16, 1, 0.3, 1),
    scale 360ms cubic-bezier(0.16, 1, 0.3, 1),
    translate 360ms cubic-bezier(0.16, 1, 0.3, 1);
  translate: 0 0;
}

.wuwa-infinite-gallery-page .wuwa-infinite-gallery-card:is(:hover, :focus-within) {
  border-color: color-mix(in srgb, var(--color-accent, #c5a85a) 48%, transparent);
  box-shadow: 0 0.9rem 2rem rgb(0 0 0 / 18%);
  scale: 1.004;
  translate: 0 -3px;
}

.wuwa-infinite-gallery-page .wuwa-infinite-gallery-media {
  align-items: center;
  appearance: none;
  aspect-ratio: 1;
  background: transparent;
  border: 0;
  cursor: zoom-in;
  display: flex;
  justify-content: center;
  overflow: hidden;
  padding: 0;
  position: relative;
  width: 100%;
}

.wuwa-infinite-gallery-page .wuwa-infinite-gallery-media img {
  height: 100%;
  object-fit: contain;
  opacity: 0;
  transform: scale(0.96);
  transition: opacity 260ms ease, transform 480ms cubic-bezier(0.16, 1, 0.3, 1);
  width: 100%;
}

.wuwa-infinite-gallery-page .wuwa-infinite-gallery-card[data-state="loaded"] .wuwa-infinite-gallery-media img {
  opacity: 1;
  transform: none;
}

.wuwa-infinite-gallery-page .wuwa-infinite-gallery-placeholder {
  background: linear-gradient(105deg, transparent 20%, color-mix(in srgb, currentColor 8%, transparent) 42%, transparent 64%);
  inset: 0;
  position: absolute;
  transform: translateX(-100%);
}

.wuwa-infinite-gallery-page .wuwa-infinite-gallery-card:is([data-state="queued"], [data-state="loading"]) .wuwa-infinite-gallery-placeholder {
  animation: wuwa-infinite-gallery-shimmer 1.25s ease-in-out infinite;
}

@keyframes wuwa-infinite-gallery-shimmer {
  to { transform: translateX(100%); }
}

.wuwa-infinite-gallery-page .wuwa-gallery-source {
  color: var(--color-text-secondary, #aaa5b5);
  display: block;
  font-size: 0.72rem;
  overflow: hidden;
  padding: 0.48rem 0.62rem 0.18rem;
  text-overflow: ellipsis;
  transition: color 220ms ease, transform 360ms cubic-bezier(0.16, 1, 0.3, 1);
  white-space: nowrap;
}

.wuwa-infinite-gallery-page .wuwa-gallery-source:is(:hover, :focus-visible) {
  color: var(--color-accent, #c5a85a);
  outline: none;
  transform: translateX(0.18rem);
}

.wuwa-infinite-gallery-page .wuwa-infinite-gallery-actions {
  display: grid;
  gap: 0.28rem;
  grid-template-columns: 1fr 1fr;
  padding: 0.3rem 0.42rem 0.44rem;
}

.wuwa-infinite-gallery-page .wuwa-infinite-gallery-action {
  align-items: center;
  appearance: none;
  background: color-mix(in srgb, currentColor 3%, transparent);
  border: 1px solid color-mix(in srgb, currentColor 10%, transparent);
  border-radius: 0.62rem;
  color: var(--color-text-secondary, #aaa5b5);
  cursor: pointer;
  display: flex;
  font: inherit;
  font-size: 0.74rem;
  gap: 0.32rem;
  justify-content: center;
  min-height: 44px;
  min-width: 44px;
  transition:
    background 260ms ease,
    border-color 260ms ease,
    color 260ms ease,
    transform 360ms cubic-bezier(0.16, 1, 0.3, 1);
}

.wuwa-infinite-gallery-page .wuwa-infinite-gallery-action:is(:hover, :focus-visible) {
  outline: none;
  transform: translateY(-2px) scale(1.025);
}

.wuwa-infinite-gallery-page .wuwa-infinite-gallery-favorite:is(:hover, :focus-visible),
.wuwa-infinite-gallery-page .wuwa-infinite-gallery-favorite.is-active {
  background: color-mix(in srgb, #ff6685 15%, transparent);
  border-color: color-mix(in srgb, #ff6685 44%, transparent);
  color: #ff86a0;
}

.wuwa-infinite-gallery-page .wuwa-infinite-gallery-download:is(:hover, :focus-visible) {
  background: color-mix(in srgb, #d9b85f 15%, transparent);
  border-color: color-mix(in srgb, #d9b85f 48%, transparent);
  color: #e6c971;
}

.wuwa-infinite-gallery-page .wuwa-infinite-gallery-media-retry {
  align-items: center;
  background: color-mix(in srgb, var(--card-bg, #181b24) 88%, transparent);
  color: var(--color-accent, #c5a85a);
  display: flex;
  font-size: 0.78rem;
  inset: 0;
  justify-content: center;
  pointer-events: none;
  position: absolute;
}

.wuwa-infinite-gallery-page .wuwa-infinite-gallery-sentinel {
  height: 2px;
}

.wuwa-infinite-gallery-page .wuwa-infinite-gallery-dialog-layer {
  align-items: center;
  background: rgb(0 0 0 / 62%);
  display: flex;
  inset: 0;
  justify-content: center;
  opacity: 0;
  padding: 1rem;
  position: fixed;
  transition: opacity 220ms ease;
  z-index: 10020;
}

html.wuwa-infinite-gallery-dialog-open,
body.wuwa-infinite-gallery-dialog-open {
  overflow: hidden;
  overscroll-behavior: none;
}

.wuwa-infinite-gallery-page .wuwa-infinite-gallery-dialog-layer.is-visible {
  opacity: 1;
}

.wuwa-infinite-gallery-page .wuwa-infinite-gallery-dialog {
  background: var(--card-bg, #181b24);
  border: 1px solid color-mix(in srgb, var(--color-accent, #c5a85a) 28%, transparent);
  border-radius: 1rem;
  box-shadow: 0 1.5rem 4rem rgb(0 0 0 / 35%);
  max-width: 28rem;
  padding: 1.1rem;
  transform: translateY(1rem) scale(0.96);
  transition: transform 460ms cubic-bezier(0.16, 1, 0.3, 1);
  width: 100%;
}

.wuwa-infinite-gallery-page .wuwa-infinite-gallery-dialog-layer.is-visible .wuwa-infinite-gallery-dialog {
  transform: none;
}

.wuwa-infinite-gallery-page .wuwa-infinite-gallery-dialog h2 {
  font-size: 1.05rem;
  margin: 0;
}

.wuwa-infinite-gallery-page .wuwa-infinite-gallery-dialog p {
  color: var(--color-text-secondary, #aaa5b5);
  font-size: 0.82rem;
  margin: 0.5rem 0 0.8rem;
}

.wuwa-infinite-gallery-page .wuwa-infinite-gallery-formats {
  display: grid;
  gap: 0.55rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-bottom: 0.7rem;
}

.wuwa-infinite-gallery-page .wuwa-infinite-gallery-formats button,
.wuwa-infinite-gallery-page .wuwa-infinite-gallery-dialog > button {
  background: color-mix(in srgb, var(--card-bg, #181b24) 86%, var(--color-accent, #c5a85a) 8%);
  border: 1px solid color-mix(in srgb, var(--color-accent, #c5a85a) 30%, transparent);
  border-radius: 0.7rem;
  color: inherit;
  cursor: pointer;
  min-height: 44px;
  padding: 0.55rem;
  transition: transform 360ms cubic-bezier(0.16, 1, 0.3, 1), border-color 220ms ease;
}

.wuwa-infinite-gallery-page .wuwa-infinite-gallery-formats button {
  display: grid;
  gap: 0.25rem;
}

.wuwa-infinite-gallery-page .wuwa-infinite-gallery-formats button span {
  color: var(--color-text-secondary, #aaa5b5);
  font-size: 0.7rem;
}

.wuwa-infinite-gallery-page .wuwa-infinite-gallery-formats button:not(:disabled):is(:hover, :focus-visible),
.wuwa-infinite-gallery-page .wuwa-infinite-gallery-dialog > button:is(:hover, :focus-visible) {
  border-color: color-mix(in srgb, var(--color-accent, #c5a85a) 66%, transparent);
  outline: none;
  transform: translateY(-2px) scale(1.02);
}

@media (max-width: 720px) {
  .wuwa-infinite-gallery-page .wuwa-infinite-gallery-controls {
    align-items: center;
    position: relative;
    top: auto;
  }

  .wuwa-infinite-gallery-page .wuwa-archive-filter-field {
    flex: 1 1 calc(50% - 0.45rem);
    min-width: 0;
  }

  .wuwa-infinite-gallery-page .wuwa-character-filter-trigger,
  .wuwa-infinite-gallery-page .wuwa-archive-sort-picker,
  .wuwa-infinite-gallery-page .wuwa-archive-sort-trigger {
    flex: 1 1 0;
    min-width: 0;
    width: auto;
  }

  .wuwa-infinite-gallery-page .wuwa-archive-sort-trigger {
    width: 100%;
  }

  .wuwa-infinite-gallery-page .wuwa-infinite-gallery-shuffle,
  .wuwa-infinite-gallery-page .wuwa-infinite-gallery-my-favorites,
  .wuwa-infinite-gallery-page .wuwa-infinite-gallery-retry-packs,
  .wuwa-infinite-gallery-page .wuwa-infinite-gallery-retry {
    flex: 1 1 8rem;
    min-width: 0;
  }

  .wuwa-infinite-gallery-page .wuwa-filter-panel-trigger {
    flex: 1 1 9rem;
    justify-content: center;
  }

  .wuwa-infinite-gallery-page .wuwa-infinite-gallery-result {
    flex: 0 0 auto;
    margin-left: auto;
    padding: 0.2rem;
    text-align: right;
  }

  .wuwa-infinite-gallery-page .wuwa-infinite-gallery-batch {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 360px) {
  .wuwa-infinite-gallery-page {
    overflow-x: clip;
  }

  .wuwa-infinite-gallery-page .wuwa-infinite-gallery-controls {
    gap: 0.62rem;
    padding-inline: 0.58rem;
  }

  .wuwa-infinite-gallery-page .wuwa-archive-filter-field {
    flex-basis: 100%;
  }

  .wuwa-infinite-gallery-page .wuwa-infinite-gallery-batch {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .wuwa-infinite-gallery-page .wuwa-gallery-source {
    font-size: 0.66rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .search-modal {
    transition: none !important;
  }

  .wuwa-page-transition,
  #pjax-main .hero-compass .compass-title,
  #pjax-main .hero-compass .compass-subtitle,
  #pjax-main .hero-compass .compass-item,
  html[data-wuwa-archive-state="ready"] body:has(.archive-layout .archive-list) .archive-layout > .archive-main,
  html[data-wuwa-archive-state="ready"] body:has(.archive-layout .archive-list) .archive-layout > .archive-sidebar,
  #pjax-main,
  #pjax-main:has(.hero-background) .hero .hero-name[data-wuwa-stable-title="true"],
  .search-modal .search-modal-overlay,
  .search-modal .search-modal-content,
  .wuwa-drift-wall,
  .wuwa-drift-track,
  .wuwa-drift-track-inner,
  .wuwa-drift-emoji,
  .hero[data-wuwa-drift-hero="true"] .hero-info,
  .wuwa-hero-eyebrow,
  .hero[data-wuwa-drift-hero="true"] .hero-name,
  .hero[data-wuwa-drift-hero="true"] .hero-tagline,
  .hero[data-wuwa-drift-hero="true"] .hero-bio,
  .wuwa-emote-card,
  .wuwa-emote-card-action,
  .wuwa-favorite-section,
  .wuwa-video-intro,
  .wuwa-video-card,
  .wuwa-video-card-cover,
  .wuwa-pack-hero-excerpt,
  .wuwa-pack-hero-footer,
  .wuwa-emote-media img,
  .wuwa-emote-placeholder,
  .wuwa-crowdfunding-section tbody td,
  .wuwa-crowdfunding-section .table-scroll,
  .wuwa-crowdfunding-toggle,
  .wuwa-crowdfunding-toggle-icon,
  .wuwa-character-filter-option,
  .archive-card[data-wuwa-pack-card="true"],
  .archive-card[data-wuwa-pack-card="true"] .archive-card-cover img,
  .post-hero[data-wuwa-pack-hero="true"] .post-hero-bg img,
  .wuwa-pack-action,
  .wuwa-favorite-action,
  .wuwa-selection-action,
  .wuwa-selection-bar,
  .wuwa-download-dialog-layer,
  .wuwa-download-dialog,
  .wuwa-download-format,
  .wuwa-download-retry-panel,
  .wuwa-infinite-gallery-page,
  .wuwa-infinite-gallery-page *,
  .lg-backdrop,
  .lg-outer.wuwa-lg-modern .lg-image,
  .lg-outer.wuwa-lg-modern,
  .lg-outer.wuwa-lg-modern .wuwa-lg-toast,
  .lg-outer.wuwa-lg-modern .lg-toolbar,
  .lg-outer.wuwa-lg-modern .lg-toolbar .lg-icon,
  .lg-outer.wuwa-lg-modern .lg-toolbar .lg-prev,
  .lg-outer.wuwa-lg-modern .lg-toolbar .lg-next {
    animation: none !important;
    transition-duration: 1ms !important;
  }

  .wuwa-drift-track-inner {
    animation: none !important;
  }
}
.post-sidebar #toc-nav[data-wuwa-pack-toc="true"] .toc-link {
  transition:
    color 260ms cubic-bezier(0.16, 1, 0.3, 1),
    transform 320ms cubic-bezier(0.16, 1, 0.3, 1);
}

.post-sidebar #toc-nav[data-wuwa-pack-toc="true"] .toc-link:is(:hover, :focus-visible) {
  transform: translateX(0.22rem);
}

@media (prefers-reduced-motion: reduce) {
  .post-sidebar #toc-nav[data-wuwa-pack-toc="true"] .toc-link {
    transition-duration: 1ms;
  }
}
/* Browsing quality shares the existing navigation surface. */
.wuwa-browse-quality { max-width:5.5rem; padding:.35rem .55rem; border:1px solid currentColor; border-radius:8px; color:inherit; background:transparent; font:inherit; cursor:pointer; opacity:.8; transition:opacity .22s cubic-bezier(.16,1,.3,1), background .22s cubic-bezier(.16,1,.3,1); }
.wuwa-browse-quality:hover,.wuwa-browse-quality:focus-visible { opacity:1; background:rgba(128,128,128,.12); }
.wuwa-browse-quality option { color:#222; background:#fff; }
@media(prefers-reduced-motion:reduce){.wuwa-browse-quality{transition:none;}}

.wuwa-loading-progress{position:absolute;top:calc(50% + 84px);left:50%;transform:translateX(-50%);width:min(96px,45vw);height:4px;border-radius:8px;background:color-mix(in srgb,var(--color-accent,#bea151) 18%,transparent);overflow:hidden}
.wuwa-loading-progress::after{content:"";display:block;width:100%;height:100%;background:var(--color-accent,#bea151);transform:scaleX(calc(var(--wuwa-progress,0)/100));transform-origin:left;border-radius:inherit}
.welcome-logo-wrapper .welcome-logo-ring{animation:none;opacity:1;transform:none;border:0;background:conic-gradient(var(--color-accent,#bea151) calc(var(--wuwa-progress,0)*1%),#ffffff20 0);mask:radial-gradient(farthest-side,transparent calc(100% - 6px),#000 0)}
.welcome-logo-wrapper .welcome-logo-ring-2{display:block;inset:11px;border:3px solid var(--color-accent,#bea151);opacity:.45;background:none;mask:none}
.welcome-logo-wrapper::before{content:"";position:absolute;inset:20px;border:2px dashed var(--color-accent,#bea151);border-radius:50%;opacity:.3;pointer-events:none}
.welcome-logo-wrapper > .welcome-logo{animation:none}
.wuwa-welcome-portrait{position:relative;z-index:2;width:calc(100% - 48px);height:calc(100% - 48px);overflow:hidden;border-radius:50%;border:3px solid #ffffff30;box-shadow:0 20px 60px #0005;background:#000}
.wuwa-welcome-portrait .welcome-logo{width:100%;height:100%;max-width:none;border:0;border-radius:0;box-shadow:none;transform:scale(1.14);animation:wuwa-welcome-image-float 3s cubic-bezier(.45,0,.55,1) infinite}
@keyframes wuwa-welcome-image-float{0%,100%{transform:translateY(4px) scale(1.14)}50%{transform:translateY(-4px) scale(1.14)}}
@media(prefers-reduced-motion:reduce){.wuwa-welcome-portrait .welcome-logo{animation:none;transform:scale(1.14)}}

[data-wuwa-nav-track]{transition:text-shadow .45s cubic-bezier(.2,.8,.3,1),box-shadow .45s cubic-bezier(.2,.8,.3,1),border-color .45s cubic-bezier(.2,.8,.3,1)}
.wuwa-nav-current-text{text-shadow:0 0 7px var(--color-accent,#b99d50),0 0 19px color-mix(in srgb,var(--color-accent,#b99d50) 65%,transparent)}
.wuwa-nav-current-icon{box-shadow:0 0 0 2px color-mix(in srgb,var(--color-accent,#b99d50) 75%,transparent),0 0 17px color-mix(in srgb,var(--color-accent,#b99d50) 45%,transparent);border-color:var(--color-accent,#b99d50)!important}
@media(prefers-reduced-motion:reduce){[data-wuwa-nav-track]{transition:none}}

.wuwa-search-card-cover.is-loading{background:linear-gradient(120deg,#ffffff08,#ffffff20,#ffffff08);backdrop-filter:blur(14px);animation:wuwa-download-meta-pulse 1.5s ease-in-out infinite alternate}.wuwa-search-card-cover img{transition:opacity .3s cubic-bezier(.16,1,.3,1)}.wuwa-search-card-cover.is-loading img{opacity:0}@media(prefers-reduced-motion:reduce){.wuwa-search-card-cover.is-loading{animation:none}.wuwa-search-card-cover img{transition:none}}
.wuwa-unified-download{position:fixed;inset:0;z-index:10030;background:#0009;display:grid;place-items:center;padding:16px;opacity:0;transition:opacity .22s ease}
.wuwa-unified-download.is-visible{opacity:1}
.wuwa-unified-download>section{width:min(100%,28rem);max-height:calc(100dvh - 32px);overflow:auto;box-sizing:border-box;background:var(--card-bg,#181b24);color:var(--color-text,#eee);border:1px solid color-mix(in srgb,var(--color-accent,#c5a85a) 30%,transparent);border-radius:1rem;padding:1.1rem;box-shadow:0 1.5rem 4rem #0006;transform:translateY(16px) scale(.96);transition:transform .46s cubic-bezier(.16,1,.3,1)}
.wuwa-unified-download.is-visible>section{transform:none}.wuwa-unified-download h2{font-size:1.1rem;margin:0}.wuwa-unified-download p{font-size:.82rem;color:var(--color-text-secondary,#aaa5b5);margin:.6rem 0 1rem}
.wuwa-four-formats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.65rem;margin-bottom:.8rem}
.wuwa-unified-download button{font:inherit;min-height:44px;padding:.6rem;border-radius:.7rem;border:1px solid color-mix(in srgb,var(--color-accent,#c5a85a) 30%,transparent);background:color-mix(in srgb,var(--card-bg,#181b24) 86%,var(--color-accent,#c5a85a) 8%);color:inherit;cursor:pointer;transition:transform .36s cubic-bezier(.16,1,.3,1),border-color .22s ease}
.wuwa-four-formats button{display:grid;gap:.25rem;text-align:center}.wuwa-four-formats strong{font-size:1.05rem}.wuwa-four-formats small,.wuwa-four-formats span{font-size:.72rem;color:var(--color-text-secondary,#aaa5b5)}.wuwa-unified-download button:disabled{opacity:.45;cursor:wait}.wuwa-unified-download button:not(:disabled):hover{border-color:var(--color-accent,#c5a85a);transform:translateY(-2px)}
@media(prefers-reduced-motion:reduce){.wuwa-unified-download,.wuwa-unified-download>section,.wuwa-unified-download button{transition:none}}
/* Dashboard: one layout, scoped independently from article and search typography. */
.main:has([data-wuwa-status]){padding-top:var(--header-height,64px)}
.post:has([data-wuwa-status]){overflow:visible}
.post:has([data-wuwa-status])>.post-header{display:none}
[data-wuwa-status]{
  --ws-accent:var(--color-accent,#b79f62);
  --ws-muted:var(--color-text-secondary,#aaa);
  --ws-rule:color-mix(in srgb,var(--color-text,#eee) 10%,transparent);
  --ws-ease:cubic-bezier(.16,1,.3,1);
  max-width:960px;margin:16px auto 32px;padding:0 clamp(12px,3vw,32px);
  color:var(--color-text,#eee);line-height:1.5;
}
[data-wuwa-status] *,[data-wuwa-status] *::before,[data-wuwa-status] *::after{box-sizing:border-box}
.post-content [data-wuwa-status] :is(h1,h2,h3){border:0;padding:0;background:none}
.post-content [data-wuwa-status] strong{background:none;box-shadow:none}
.post-content [data-wuwa-status] strong::before,.post-content [data-wuwa-status] strong::after{content:none}
.post-content [data-wuwa-status] a{text-decoration:none}
.post-content [data-wuwa-status] .ws-hero{
  display:flex;align-items:flex-end;justify-content:space-between;flex-wrap:wrap;
  gap:20px 28px;padding:16px 0 24px;background:none;border:0;
}
.post-content [data-wuwa-status] .ws-brand h1{
  margin:0 0 32px;font-size:clamp(30px,3.6vw,42px);font-weight:800;line-height:1.25;letter-spacing:.02em;
  color:transparent;-webkit-text-fill-color:transparent;-webkit-text-stroke:1.5px var(--ws-accent);
  transition:color .4s var(--ws-ease),-webkit-text-fill-color .4s var(--ws-ease),text-shadow .4s var(--ws-ease);
}
.post-content [data-wuwa-status] .ws-brand h1:hover{color:var(--ws-accent);-webkit-text-fill-color:var(--ws-accent);text-shadow:0 0 20px color-mix(in srgb,var(--ws-accent) 35%,transparent)}
.post-content [data-wuwa-status] .ws-brand p{margin:0;font-size:14px;line-height:1.6;letter-spacing:.15em;color:var(--ws-muted)}
[data-wuwa-status] .ws-eyebrow{font-size:12px;color:var(--ws-muted);padding-bottom:3px}
[data-wuwa-status] .footer-online-status{max-width:100%;gap:6px;flex-wrap:wrap;row-gap:3px;color:var(--ws-muted);font-size:inherit}
[data-wuwa-status] .footer-online-detail{min-width:0}
[data-wuwa-status] .footer-online-icon{display:block;margin:0;color:var(--ws-accent)}
[data-wuwa-status] .ws-live{display:flex;align-items:center;gap:8px;margin:0;font-size:12px;line-height:1.8;color:var(--ws-accent)}
[data-wuwa-status] .ws-live-dot{flex:0 0 9px;width:9px;height:9px;border-radius:50%;background:currentColor;animation:ws-dot-breathe 2.8s ease-in-out infinite}
@keyframes ws-dot-breathe{0%,100%{transform:scale(.75);opacity:.6}50%{transform:scale(1.15);opacity:1}}
#wuwa-verification-status+button{
  display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:11px 28px;
  color:var(--color-text-on-accent,#20201e);background:var(--color-accent,#b79f62);border:1px solid var(--color-accent,#b79f62);
  border-radius:12px;font:inherit;font-weight:600;cursor:pointer;
  box-shadow:0 4px 16px #0002;transition:transform .3s cubic-bezier(.16,1,.3,1),box-shadow .3s ease;
}
#wuwa-verification-status+button:hover{transform:translateY(-2px);box-shadow:0 6px 22px #0003}
#wuwa-verification-status+button:active{transform:scale(.97)}
#wuwa-verification-status+button:focus-visible{outline:2px solid var(--color-accent,#b79f62);outline-offset:4px}
@media(prefers-reduced-motion:reduce){
  [data-wuwa-status] .ws-live-dot,[data-wuwa-status] .page-title::before,[data-wuwa-status] .page-title::after{animation:none}
  #wuwa-verification-status+button,.post-content [data-wuwa-status] .ws-brand h1{transition:none}
}

/* Keep the measured pressure colors; use quiet marks instead of a neon glow. */
[data-wuwa-status] .ws-pressure{position:relative;margin:0 0 24px;padding:4px 0 12px;border-bottom:1px solid var(--ws-rule)}
[data-wuwa-status] .ws-pressure-track{display:flex;align-items:center;justify-content:flex-end;gap:3px;height:32px;overflow-x:auto;scrollbar-width:thin;touch-action:none;user-select:none}
[data-wuwa-status] .ws-pressure-line{
  position:relative;flex:0 0 9px;width:9px;height:28px;min-height:0;padding:0!important;
  border:0!important;border-radius:4px;background:transparent!important;box-shadow:none;cursor:pointer;
}
[data-wuwa-status] .ws-pressure-line::before{
  content:'';position:absolute;inset:6px 2px;border-radius:3px;background:var(--pressure-color);opacity:.78;
  transition:inset .32s var(--ws-ease),opacity .32s var(--ws-ease);
}
[data-wuwa-status] .ws-pressure-line:is(.is-active,:focus-visible)::before{inset:1px 1px;opacity:1}
[data-wuwa-status] .ws-pressure-line:focus-visible{outline:1px solid var(--ws-accent);outline-offset:1px}
[data-wuwa-status] .ws-pressure-tip{
  position:absolute;bottom:54px;z-index:20;max-width:calc(100% - 16px);white-space:pre-line;
  font-size:12px;line-height:1.8;padding:12px 16px;border:1px solid var(--ws-rule);border-radius:12px;
  color:var(--color-text,#eee);background:var(--color-bg-soft,#1b1b19);box-shadow:0 8px 30px #0003;pointer-events:none;
}

[data-wuwa-status] .ws-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:32px}
[data-wuwa-status] .ws-stat{
  display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-rows:auto auto;align-items:center;
  gap:5px 12px;min-width:0;padding:18px;border:1px solid var(--ws-rule);border-radius:14px;
  background:color-mix(in srgb,var(--ws-accent) 3%,transparent);
}
[data-wuwa-status] .ws-stat>span{grid-column:1;grid-row:1;color:var(--ws-accent);font-size:18px;line-height:1;opacity:.8}
[data-wuwa-status] .ws-stat>small{grid-column:1;grid-row:2;font-size:12px;white-space:nowrap;color:var(--ws-muted)}
[data-wuwa-status] .ws-stat>strong{
  grid-column:2;grid-row:1/3;justify-self:end;min-width:0;font-size:clamp(22px,2.5vw,30px);
  line-height:1.2;font-weight:500;letter-spacing:.015em;font-variant-numeric:tabular-nums;white-space:nowrap;
}
[data-wuwa-status] .ws-grid{display:block}
[data-wuwa-status] .ws-activity{
  --ws-api-color:#58a68f;--ws-download-color:#9b83c4;
  margin:0 0 32px;padding:22px 24px 16px;min-width:0;border:1px solid var(--ws-rule);border-radius:16px;
  background:linear-gradient(145deg,color-mix(in srgb,var(--ws-accent) 5%,transparent),transparent 65%);
}
[data-wuwa-status] .ws-activity .ws-heading{margin-bottom:14px}
[data-wuwa-status] .ws-activity-footer{font-size:11px;color:var(--ws-muted)}
[data-wuwa-status] .ws-activity-heading{justify-content:flex-start;gap:18px;min-height:40px}
[data-wuwa-status] .ws-activity-heading h2{flex:none;white-space:nowrap}
[data-wuwa-status] .ws-activity-heading .ws-activity-legend{flex:1}
[data-wuwa-status] .ws-activity-controls{display:flex;align-items:center;gap:8px;margin-left:auto;flex:none}
[data-wuwa-status] .ws-activity-window{appearance:none;min-height:40px;padding:8px 26px 8px 12px;border:1px solid var(--ws-rule);border-radius:9px;color:var(--ws-accent);font:inherit;font-size:12px;cursor:pointer;background:transparent url("data:image/svg+xml,%3Csvg xmlns='/__proxy/www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 16 16'%3E%3Cpath d='m4 6 4 4 4-4' fill='none' stroke='%239e905f'/%3E%3C/svg%3E") no-repeat right 8px center;transition:background-color .3s var(--ws-ease)}
[data-wuwa-status] .ws-activity-window:hover{background-color:color-mix(in srgb,var(--ws-accent) 8%,transparent)}
[data-wuwa-status] .ws-activity-window option{color:var(--color-text,#eee);background:var(--color-bg-soft,#1b1b19)}
[data-wuwa-status] .ws-activity-window:focus-visible{outline:2px solid var(--ws-accent);outline-offset:3px}
[data-wuwa-status] .ws-activity-legend{display:flex;align-items:center;flex-wrap:wrap;gap:8px 16px;font-size:12px;color:var(--ws-muted)}
[data-wuwa-status] .ws-activity-legend span{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
[data-wuwa-status] .ws-activity-legend i{width:6px;height:6px;border-radius:50%;background:var(--series-color);box-shadow:0 0 0 3px color-mix(in srgb,var(--series-color) 12%,transparent)}
[data-wuwa-status] .ws-activity-select{position:relative;flex:none;font-size:12px}
[data-wuwa-status] .ws-activity-select summary{list-style:none;display:flex;align-items:center;gap:8px;min-height:40px;padding:8px 12px;border:1px solid var(--ws-rule);border-radius:9px;cursor:pointer;color:var(--ws-accent);transition:background .3s var(--ws-ease)}
[data-wuwa-status] .ws-activity-select summary::-webkit-details-marker{display:none}
[data-wuwa-status] .ws-activity-select summary:hover,[data-wuwa-status] .ws-activity-select[open] summary{background:color-mix(in srgb,var(--ws-accent) 8%,transparent)}
[data-wuwa-status] .ws-activity-select summary svg{transition:transform .3s var(--ws-ease)}
[data-wuwa-status] .ws-activity-select[open] summary svg{transform:rotate(180deg)}
[data-wuwa-status] .ws-activity-options{position:absolute;right:0;top:calc(100% + 8px);z-index:25;min-width:170px;padding:6px;border:1px solid var(--ws-rule);border-radius:12px;background:var(--color-bg-soft,#1b1b19);box-shadow:0 12px 32px #0003;animation:ws-activity-menu .24s var(--ws-ease)}
[data-wuwa-status] .ws-activity-options label{display:flex;align-items:center;gap:10px;min-height:42px;padding:8px 10px;cursor:pointer;border-radius:7px;transition:background .2s ease}
[data-wuwa-status] .ws-activity-options label:hover{background:color-mix(in srgb,var(--ws-accent) 8%,transparent)}
[data-wuwa-status] .ws-activity-options input{appearance:auto;width:15px;height:15px;margin:0;accent-color:var(--ws-accent);cursor:pointer}
[data-wuwa-status] .ws-activity-plot{position:relative;height:218px;margin:10px -8px 8px;touch-action:none;user-select:none;cursor:crosshair;border-radius:8px}
[data-wuwa-status] .ws-activity-plot:focus-visible,[data-wuwa-status] .ws-activity-select summary:focus-visible{outline:2px solid var(--ws-accent);outline-offset:4px}
[data-wuwa-status] .ws-activity-plot>svg{display:block;width:100%;height:100%;overflow:visible}
[data-wuwa-status] .ws-activity-gridline{stroke:var(--ws-rule);stroke-width:1;stroke-dasharray:3 6}
[data-wuwa-status] .ws-activity-line{fill:none;stroke:var(--series-color);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
[data-wuwa-status] .ws-activity-guide{stroke:var(--ws-muted);stroke-width:1;stroke-dasharray:3 4;opacity:0;transition:x1 .12s ease-out,x2 .12s ease-out,opacity .2s ease}
[data-wuwa-status] .ws-activity-dot{fill:var(--series-color);stroke:var(--color-bg-soft,#1b1b19);stroke-width:2;transition:r .28s var(--ws-ease)}
[data-wuwa-status] .ws-activity-halo{fill:var(--series-color);opacity:0;transition:opacity .28s var(--ws-ease)}
[data-wuwa-status] .ws-activity-value{fill:var(--series-color);font-size:10px;font-variant-numeric:tabular-nums;paint-order:stroke;stroke:var(--color-bg-soft,#1b1b19);stroke-width:3px;stroke-linejoin:round;opacity:.7;transition:opacity .28s var(--ws-ease),font-size .28s var(--ws-ease)}
[data-wuwa-status] .ws-activity.is-dense .ws-activity-value{opacity:0}
[data-wuwa-status] .is-active>.ws-activity-dot{r:5}
[data-wuwa-status] .is-active>.ws-activity-halo{opacity:.15}
[data-wuwa-status] .ws-activity .is-active>.ws-activity-value{font-size:13px;font-weight:600;opacity:1}
[data-wuwa-status] .ws-activity-time{fill:var(--ws-muted);font-size:10px;font-variant-numeric:tabular-nums}
[data-wuwa-status] .ws-activity-empty{position:absolute;inset:0;display:grid;place-items:center;color:var(--ws-muted);font-size:13px;pointer-events:none}
[data-wuwa-status] .ws-activity-empty[hidden]{display:none}
[data-wuwa-status] .ws-activity-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;line-height:1.6;padding-top:14px;border-top:1px solid var(--ws-rule)}
[data-wuwa-status] .ws-activity-totals{display:flex;gap:14px 22px;flex-wrap:wrap}
[data-wuwa-status] .ws-activity-totals>span{display:inline-flex;align-items:baseline;gap:8px;white-space:nowrap}
[data-wuwa-status] .ws-activity-totals strong{color:var(--series-color);font-size:16px;font-weight:500;font-variant-numeric:tabular-nums;line-height:1.2}
@keyframes ws-activity-menu{from{opacity:0;transform:translateY(-5px) scale(.98)}to{opacity:1;transform:none}}
@media(max-width:700px){
  [data-wuwa-status] .ws-activity{padding:18px 14px 14px;margin-bottom:26px}
  [data-wuwa-status] .ws-activity .ws-activity-heading{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px 8px}
  .post-content [data-wuwa-status] .ws-activity .ws-activity-heading h2{font-size:18px}
  [data-wuwa-status] .ws-activity-heading .ws-activity-legend{grid-column:1/-1;grid-row:2}
  [data-wuwa-status] .ws-activity-controls{grid-column:2;grid-row:1;gap:6px}
  [data-wuwa-status] .ws-activity-totals{width:100%;justify-content:space-between;gap:10px}
  [data-wuwa-status] .ws-activity-totals>span{flex-direction:column;gap:4px}
  [data-wuwa-status] .ws-activity-totals strong{font-size:19px}
  [data-wuwa-status] .ws-activity-footer{gap:10px}
  [data-wuwa-status] .ws-activity-legend{gap:8px 12px;font-size:11px}
  [data-wuwa-status] .ws-activity-value{opacity:0}
  [data-wuwa-status] .ws-activity-plot{margin-left:-10px;margin-right:-10px}
}
@media(prefers-reduced-motion:reduce){
  [data-wuwa-status] .ws-activity *,[data-wuwa-status] .ws-activity *::before{animation:none!important;transition:none!important}
}
[data-wuwa-status] .ws-panel{min-width:0;padding:0;border:0;border-radius:0;background:none;box-shadow:none}
[data-wuwa-status] .ws-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:0 0 8px}
.post-content [data-wuwa-status] .ws-heading h2{margin:0;font-size:21px;line-height:1.4;font-weight:600}
[data-wuwa-status] .ws-heading button{
  display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:44px;padding:8px 12px;
  font:inherit;font-size:13px;line-height:1.4;color:var(--ws-accent);background:transparent;
  border:1px solid transparent;border-radius:10px;box-shadow:none;cursor:pointer;
  transition:background .3s var(--ws-ease),border-color .3s var(--ws-ease);
}
[data-wuwa-status] .ws-heading button:is(:hover,:focus-visible){background:color-mix(in srgb,var(--ws-accent) 8%,transparent);border-color:var(--ws-rule);transform:none}
[data-wuwa-status] .ws-heading button:focus-visible{outline:2px solid var(--ws-accent);outline-offset:2px}
[data-wuwa-status] .ws-popular{display:grid;gap:0;padding:0;margin:0}
[data-wuwa-status] .ws-popular .wuwa-search-card{
  display:grid;grid-template-columns:72px minmax(0,1fr);align-items:center;gap:18px;
  min-height:112px;margin:0;padding:18px 0;border:0;border-bottom:1px solid var(--ws-rule);border-radius:0;
  background:transparent;box-shadow:none;color:inherit;text-decoration:none;transform:none;
  animation:wuwa-search-card-enter .42s var(--ws-ease) both;
  transition:background .3s var(--ws-ease);
}
[data-wuwa-status] .ws-popular .wuwa-search-card:last-child{border-bottom:0}
[data-wuwa-status] .ws-popular .wuwa-search-card:is(:hover,:focus-visible){background:color-mix(in srgb,var(--ws-accent) 4%,transparent);box-shadow:none;transform:none}
[data-wuwa-status] .ws-popular .wuwa-search-card:focus-visible{outline:2px solid var(--ws-accent);outline-offset:4px;border-radius:8px}
[data-wuwa-status] .wuwa-search-card-cover{
  display:flex;align-items:center;justify-content:center;grid-column:1;position:relative;inset:auto;
  width:72px;height:72px;aspect-ratio:1;margin:0;padding:2px;border-radius:12px;overflow:hidden;
  background:color-mix(in srgb,var(--ws-accent) 4%,transparent);
}
[data-wuwa-status] .wuwa-search-card-cover img{display:block;width:100%;height:100%;margin:0;object-fit:contain;border-radius:10px;transition:transform .42s var(--ws-ease),opacity .3s var(--ws-ease)}
[data-wuwa-status] .wuwa-search-card:is(:hover,:focus-visible) .wuwa-search-card-cover img{transform:scale(1.045)}
[data-wuwa-status] .wuwa-search-card-content{display:block;grid-column:2;min-width:0;margin:0;padding:0}
[data-wuwa-status] .wuwa-search-card-title{display:block;font-size:17px;font-weight:600;line-height:1.45;color:var(--color-text,#eee);overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
[data-wuwa-status] .wuwa-search-card-desc{display:block;margin-top:4px;font-size:12px;line-height:1.6;color:var(--ws-muted);overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
[data-wuwa-status] .wuwa-search-card-meta{display:flex;align-items:center;justify-content:space-between;gap:8px;min-width:0;margin-top:8px}
[data-wuwa-status] .wuwa-search-card-chips{display:flex;align-items:center;gap:8px;min-width:0;overflow:hidden}
[data-wuwa-status] .ws-popular :is(.archive-category,.archive-tag){display:inline-flex;align-items:center;gap:4px;flex:0 0 auto;font-size:11px;line-height:1.4;color:var(--ws-muted);background:none;border:0;border-radius:0;padding:0}
[data-wuwa-status] .wuwa-search-card-statistics{display:inline-flex;align-items:center;gap:12px;flex:0 0 auto}
[data-wuwa-status] :is(.wuwa-search-card-favorites,.wuwa-search-card-downloads){display:inline-flex;align-items:center;gap:4px;flex:0 0 auto;font-size:12px;font-weight:400;font-variant-numeric:tabular-nums;color:var(--ws-muted)}
[data-wuwa-status] .wuwa-search-card-favorites i{color:#bd7d87;font-size:11px}
[data-wuwa-status] .wuwa-search-card-downloads i{color:var(--ws-accent);font-size:11px}
[data-wuwa-status] .ws-footnote{font-size:12px;color:var(--ws-muted);margin:18px 0}
.nav-btn [data-status-icon]{flex-shrink:0;display:inline-block;color:inherit}
.wuwa-filter-sort-control>.wuwa-infinite-gallery-shuffle{flex:0 0 auto;white-space:nowrap}
@media(max-width:700px){
  [data-wuwa-status]{margin:8px auto 20px}
  .post-content [data-wuwa-status] .ws-hero{gap:14px;padding:8px 0 22px}
  [data-wuwa-status] .ws-brand{width:100%;text-align:center}
  .post-content [data-wuwa-status] .ws-brand p{text-align:center}
  [data-wuwa-status] .ws-eyebrow{width:100%;font-size:11px;padding:0;text-align:center}
  [data-wuwa-status] .footer-online-status,[data-wuwa-status] .ws-live{justify-content:center}
  [data-wuwa-status] .ws-pressure{margin-bottom:20px}
  [data-wuwa-status] .ws-pressure-track{gap:2px}
  [data-wuwa-status] .ws-stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-bottom:26px}
  [data-wuwa-status] .ws-stat{padding:14px;gap:5px 8px}
  [data-wuwa-status] .ws-stat>strong{font-size:23px}
  [data-wuwa-status] .ws-heading button{padding-right:0}
  [data-wuwa-status] .ws-popular .wuwa-search-card{grid-template-columns:60px minmax(0,1fr);gap:14px;padding:16px 0;min-height:106px}
  [data-wuwa-status] .wuwa-search-card-cover{width:60px;height:60px;border-radius:10px}
  [data-wuwa-status] .wuwa-search-card-title{font-size:16px}
  [data-wuwa-status] .ws-popular .archive-tag{display:none}
  .wuwa-filter-sort-control{flex-wrap:nowrap;gap:8px}
  .wuwa-filter-sort-control>.wuwa-infinite-gallery-shuffle{padding:10px 12px}
}
@media(max-width:360px){
  [data-wuwa-status]{padding:0 8px}
  [data-wuwa-status] .ws-stat{padding:12px 10px}
  [data-wuwa-status] .ws-stat>strong{font-size:21px}
  [data-wuwa-status] .ws-popular .wuwa-search-card{gap:10px;grid-template-columns:52px minmax(0,1fr)}
  [data-wuwa-status] .wuwa-search-card-cover{width:52px;height:52px}
  [data-wuwa-status] .wuwa-search-card-statistics{gap:8px}
}
@media(prefers-reduced-motion:reduce){
  [data-wuwa-status] .footer-online-icon,[data-wuwa-status] .ws-popular .wuwa-search-card{animation:none}
  [data-wuwa-status] .ws-pressure-line::before,[data-wuwa-status] .ws-heading button,[data-wuwa-status] .ws-popular .wuwa-search-card,[data-wuwa-status] .wuwa-search-card-cover img{transition:none}
}

/* Archive and gallery refresh share the same button feedback. */
.wuwa-filter-sort-control > .wuwa-infinite-gallery-shuffle:is(:hover,:focus-visible){background:color-mix(in srgb,var(--card-bg,#181b24) 72%,var(--color-accent,#c5a85a) 13%);border-color:color-mix(in srgb,var(--color-accent,#c5a85a) 62%,transparent);transform:translateY(-2px) scale(1.018)}

/* Compact only when the complete row does not fit its available width. */
.wuwa-adaptive-controls{flex-wrap:nowrap!important;gap:8px!important}
.wuwa-adaptive-controls > *, .wuwa-adaptive-controls .wuwa-filter-sort-control{flex:0 0 auto!important;width:auto;white-space:nowrap}
.wuwa-adaptive-controls:not(.is-icon-controls) .wuwa-archive-control-label{display:inline}
.wuwa-adaptive-controls.is-measuring-controls > *{width:max-content!important;max-width:none!important}
.wuwa-adaptive-controls.is-icon-controls > button > span,
.wuwa-adaptive-controls.is-icon-controls .wuwa-filter-sort-control > span,
.wuwa-adaptive-controls.is-icon-controls .wuwa-filter-sort-control > button > span{display:none}
.wuwa-adaptive-controls.is-icon-controls > button,
.wuwa-adaptive-controls.is-icon-controls .wuwa-filter-sort-control > button{display:inline-flex;justify-content:center;align-items:center;min-width:44px;min-height:44px;padding-inline:10px;gap:0;position:relative}
.wuwa-adaptive-controls.is-icon-controls .wuwa-filter-panel-count{position:absolute;top:-5px;right:-5px;min-width:18px;height:18px;font-size:10px}
.wuwa-adaptive-controls.is-icon-controls .wuwa-filter-sort-control{gap:6px}
.wuwa-adaptive-controls.is-icon-controls .wuwa-archive-sort-picker{flex:0 0 auto;width:auto;min-width:64px}

[data-wuwa-status] .ws-eyebrow{display:flex;flex-direction:column;align-items:center;gap:16px}
[data-wuwa-status] .ws-mascot{width:132px;height:132px;object-fit:contain;padding:.3rem;box-sizing:border-box;border:2px solid color-mix(in srgb,var(--ws-accent) 68%,transparent);border-radius:1rem;background:color-mix(in srgb,var(--color-bg-soft,#171820) 78%,transparent);box-shadow:0 0 0 3px color-mix(in srgb,var(--ws-accent) 10%,transparent),0 .8rem 1.6rem #00000047;opacity:0;transform:translateY(6px) scale(.94);transition:opacity 260ms ease,transform 480ms cubic-bezier(.16,1,.3,1)}
[data-wuwa-status] .ws-mascot.is-ready{opacity:1;transform:none}
[data-wuwa-status] .ws-mascot:hover{transform:translateY(-3px) scale(1.035)}
@media(min-width:701px){
  .post-content [data-wuwa-status] .ws-hero{position:relative}
  [data-wuwa-status] .ws-eyebrow{position:absolute;right:0;top:16px;bottom:-21.6px;justify-content:space-between;gap:24px;padding:0;line-height:1.8}
  .post-content [data-wuwa-status] .ws-mascot{width:var(--ws-mascot-size,96px);height:var(--ws-mascot-size,96px);margin:0;padding:2px;border-width:1px;border-radius:12px}
}
@media(max-width:700px){[data-wuwa-status] .ws-mascot{display:none}}
@media(prefers-reduced-motion:reduce){[data-wuwa-status] .ws-mascot{transition:none;transform:none}}

/* API access reuses the dashboard shell and the quiet glass-card language from About. */
.post-content:has([data-wuwa-api]){overflow:visible}
[data-wuwa-api] .ws-content{display:grid;gap:18px}
[data-wuwa-api] .ws-api-intro{position:relative;min-height:88px;margin:34px 0 2px;padding:24px 24px 20px 118px;border:1px solid var(--ws-rule);border-radius:18px;background:color-mix(in srgb,var(--ws-accent) 4%,transparent)}
[data-wuwa-api] .ws-api-intro-mascot{position:absolute;left:18px;top:-34px;width:88px;height:88px;object-fit:contain;filter:drop-shadow(0 8px 18px #0005);animation:ws-api-mascot-enter .48s var(--ws-ease) both}
[data-wuwa-api] .ws-api-quote{margin:0;min-height:1.8em;color:var(--ws-muted);font-size:13px;line-height:1.8}
[data-wuwa-api] .ws-api-service{overflow:hidden;border:1px solid var(--ws-rule);border-radius:18px;background:color-mix(in srgb,var(--ws-accent) 3%,transparent)}
[data-wuwa-api] .ws-api-service-head{display:flex;align-items:center;gap:12px;padding:16px 18px}
[data-wuwa-api] .ws-api-title,[data-wuwa-api] .ws-api-token,[data-wuwa-api] .ws-api-token-dialog button{min-height:44px;border:0;border-radius:10px;font:inherit;cursor:pointer;transition:background .28s var(--ws-ease),transform .28s var(--ws-ease)}
[data-wuwa-api] .ws-api-title{display:flex;align-items:center;gap:9px;margin-right:auto;padding:7px 8px;color:var(--ws-accent);background:transparent;font-size:20px;font-weight:650;text-align:left}
[data-wuwa-api] .ws-api-title i{font-size:12px;transition:transform .34s var(--ws-ease)}
[data-wuwa-api] .ws-api-title[aria-expanded="true"] i{transform:rotate(180deg)}
[data-wuwa-api] .ws-api-token{padding:9px 14px;color:var(--color-text-on-accent,#20201e);background:var(--ws-accent);font-size:13px;font-weight:650}
[data-wuwa-api] .ws-api-title:hover,[data-wuwa-api] .ws-api-title:focus-visible{background:color-mix(in srgb,var(--ws-accent) 8%,transparent)}
[data-wuwa-api] .ws-api-token:hover,[data-wuwa-api] .ws-api-token:focus-visible{transform:translateY(-1px)}
[data-wuwa-api] .ws-api-title:focus-visible,[data-wuwa-api] .ws-api-token:focus-visible,[data-wuwa-api] .ws-api-token-dialog button:focus-visible{outline:2px solid var(--ws-accent);outline-offset:2px}
[data-wuwa-api] .ws-api-token:disabled{opacity:.6;cursor:wait;transform:none}
[data-wuwa-api] .ws-api-service-body{padding:0 26px 22px;border-top:1px solid var(--ws-rule);animation:ws-api-body-enter .34s var(--ws-ease) both}
[data-wuwa-api] .ws-api-service-body[hidden]{display:none}
[data-wuwa-api] .ws-api-service-body p{margin:16px 0 0;color:var(--ws-muted);font-size:13px;line-height:1.8}
[data-wuwa-api] .ws-api-service-body code{overflow-wrap:anywhere;color:var(--color-text,#eee);font-size:12px}
[data-wuwa-api] .ws-api-token-note{color:var(--ws-accent)!important}
[data-wuwa-api] .ws-api-token-modal{position:fixed;inset:0;z-index:2147483100;display:grid;place-items:center;padding:18px;background:#0009;backdrop-filter:blur(8px)}
[data-wuwa-api] .ws-api-token-modal[hidden]{display:none}
[data-wuwa-api] .ws-api-token-dialog{width:min(560px,100%);padding:24px;border:1px solid color-mix(in srgb,var(--ws-accent) 36%,transparent);border-radius:18px;background:var(--color-bg-soft,#1b1b19);box-shadow:0 24px 80px #0007;animation:ws-api-modal-enter .34s var(--ws-ease) both}
[data-wuwa-api] .ws-api-token-dialog>strong{display:block;margin-bottom:14px;font-size:17px}
[data-wuwa-api] .ws-api-token-dialog>code{display:block;max-height:120px;overflow:auto;padding:14px;border:1px solid var(--ws-rule);border-radius:10px;background:#0002;overflow-wrap:anywhere;word-break:break-all;font-size:12px;line-height:1.7}
[data-wuwa-api] .ws-api-token-dialog>div{display:flex;justify-content:flex-end;gap:10px;margin-top:16px}
[data-wuwa-api] .ws-api-token-dialog button{padding:9px 16px;color:var(--color-text,#eee);background:color-mix(in srgb,var(--ws-accent) 12%,transparent)}
@keyframes ws-api-mascot-enter{from{opacity:0;transform:translateY(8px) scale(.92)}to{opacity:1;transform:none}}
@keyframes ws-api-body-enter{from{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:none}}
@keyframes ws-api-modal-enter{from{opacity:0;transform:translateY(10px) scale(.98)}to{opacity:1;transform:none}}
@media(max-width:700px){
  [data-wuwa-api] .ws-api-intro{margin-top:26px;padding:56px 18px 18px}
  [data-wuwa-api] .ws-api-intro-mascot{left:18px;top:-26px;width:72px;height:72px}
  [data-wuwa-api] .ws-api-service-head{align-items:stretch;flex-direction:column}
  [data-wuwa-api] .ws-api-title{width:100%}
  [data-wuwa-api] .ws-api-token{width:100%}
}
@media(prefers-reduced-motion:reduce){
  .welcome-logo,.welcome-logo-ring,[data-wuwa-api] .ws-api-intro-mascot,[data-wuwa-api] .ws-api-service-body,[data-wuwa-api] .ws-api-token-dialog{animation:none!important}
  [data-wuwa-api] .ws-api-title i,[data-wuwa-api] .ws-api-title,[data-wuwa-api] .ws-api-token,[data-wuwa-api] .ws-api-token-dialog button{transition:none!important}
}

/* Keep archive navigation in one row; shrink explanatory text before controls. */
.wuwa-archive-pagination { container-type:inline-size; gap:16px; flex-wrap:nowrap; }
.wuwa-archive-pagination .pagination-info { white-space:nowrap; }
.wuwa-archive-pagination .pagination-controls { flex-wrap:nowrap; gap:8px; margin-left:auto; min-width:0; }
.wuwa-archive-pagination .pagination-arrow { flex:0 0 36px; }
.wuwa-page-jump,.wuwa-page-jump label { display:flex; align-items:center; gap:6px; white-space:nowrap; }
.wuwa-page-jump { margin:0; font-size:14px; }
.wuwa-page-jump input { width:3.2em; min-width:0; height:36px; padding:4px; border:1px solid var(--color-border); border-radius:9px; background:var(--color-bg-soft); color:var(--color-text); font:inherit; text-align:center; appearance:textfield; }
.wuwa-page-jump input::-webkit-inner-spin-button,.wuwa-page-jump input::-webkit-outer-spin-button { appearance:none; margin:0; }
.wuwa-page-jump button { display:flex; align-items:center; gap:4px; height:36px; padding:0 8px; border:0; border-radius:9px; background:var(--color-bg-soft); color:var(--color-accent); font:inherit; cursor:pointer; transition:background .2s cubic-bezier(.16,1,.3,1),transform .2s cubic-bezier(.16,1,.3,1); }
.wuwa-page-jump button svg { width:18px; height:18px; }
.wuwa-page-jump button:hover { background:var(--color-bg-mute); transform:translateY(-1px); }
.wuwa-page-jump :focus-visible { outline:2px solid var(--color-accent); outline-offset:2px; }
@container (max-width:620px) { .wuwa-archive-pagination .pagination-info { display:none; } .wuwa-archive-pagination .pagination-controls { margin-inline:auto; } }
@container (max-width:440px) { .wuwa-page-hint { display:none; } .wuwa-archive-pagination .pagination-controls { gap:6px; } }
@container (max-width:310px) { .wuwa-archive-pagination .pagination-arrow { flex-basis:30px; width:30px; } .wuwa-archive-pagination .pagination-controls { gap:4px; } }
@media(prefers-reduced-motion:reduce) { .wuwa-page-jump button { transition:none; } }

/* Match the story card: mascot and quote sit above the card on desktop only. */
[data-wuwa-api] .ws-api-service{position:relative;overflow:visible;margin-top:124px}
[data-wuwa-api] .ws-api-intro{position:absolute;inset:auto 0 100%;height:110px;min-height:0;margin:0;padding:0;border:0;background:none;pointer-events:none}
[data-wuwa-api] .ws-api-intro-mascot{display:block!important;left:20px;top:0;width:120px;height:120px;margin:0;clip-path:none}
[data-wuwa-api] .ws-api-quote{position:absolute;left:150px;right:20px;top:20px;margin:0;color:var(--ws-accent);font-size:14px;white-space:normal}
[data-wuwa-api] .ws-api-service-head{flex-direction:column;align-items:flex-start;gap:8px;padding:20px 24px}
[data-wuwa-api] .ws-api-title{width:auto;min-height:32px;padding:0;line-height:1.5}
[data-wuwa-api] .ws-api-title svg{flex:none}
[data-wuwa-api] .ws-api-token{width:auto;min-height:30px;padding:4px 10px;border:1px solid var(--ws-rule);border-radius:7px;font-size:12px;font-weight:500;color:var(--ws-accent);background:color-mix(in srgb,var(--ws-accent) 7%,transparent)}
@media(max-width:768px){
 [data-wuwa-api] .ws-api-service{margin-top:0}
 [data-wuwa-api] .ws-api-intro{display:none!important}
 [data-wuwa-api] .ws-api-service-head{padding:16px 18px}
}

/* Always-open API instructions, using the story page's loading animation. */
[data-wuwa-api] .ws-api-service{margin-top:100px}
[data-wuwa-api] .ws-api-intro{height:110px;overflow:visible}
[data-wuwa-api] .ws-api-intro-mascot{background:transparent!important;clip-path:none;overflow:visible;filter:drop-shadow(0 0 6px #ffffff80) drop-shadow(0 0 12px #ffffff4d)}
[data-wuwa-api] .ws-api-service-head{padding:18px 24px 0}
.post-content [data-wuwa-api] .ws-api-title{margin:0;font-size:20px;cursor:default}
[data-wuwa-api] .ws-api-title:hover{background:none}
[data-wuwa-api] .ws-api-service-body{padding:4px 24px 20px;border:0;text-align:left}
[data-wuwa-api] .ws-api-service-body p{margin:10px 0 0;line-height:1.7;text-align:left;letter-spacing:normal}
[data-wuwa-api] .ws-api-token{min-height:0;margin:8px 0 0;padding:0;border:0;border-radius:0;background:none;font-size:13px;line-height:1.8;font-weight:500;color:var(--ws-accent)}
[data-wuwa-api] .ws-api-url{display:block;margin-top:5px;padding:8px 10px;border-radius:6px;background:color-mix(in srgb,var(--ws-accent) 5%,transparent);white-space:normal;word-break:break-all;line-height:1.65;text-align:left}
[data-wuwa-api] .ws-api-token-note:empty{display:none}
@media(max-width:768px){[data-wuwa-api] .ws-api-service{margin-top:0}[data-wuwa-api] .ws-api-service-head{padding:16px 18px 0}[data-wuwa-api] .ws-api-service-body{padding:2px 18px 18px}}

[data-wuwa-api] .ws-api-url-row{display:flex;align-items:center;gap:4px;min-width:0;margin-top:5px;padding:4px 6px 4px 10px;border-radius:6px;background:color-mix(in srgb,var(--ws-accent) 5%,transparent)}
[data-wuwa-api] .ws-api-url-row .ws-api-url{flex:1;min-width:0;margin:0;padding:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;word-break:normal;background:none}
.post-content [data-wuwa-api] .ws-api-url-action{position:relative;flex:0 0 30px;display:grid;place-items:center;width:30px;height:30px;padding:0;border:0;border-radius:5px;color:var(--ws-accent);background:none;cursor:pointer;text-decoration:none;overflow:visible;transition:background .25s var(--ws-ease),transform .25s var(--ws-ease)}
[data-wuwa-api] .ws-api-url-action[data-copy-state]::after{content:attr(data-copy-state);position:absolute;right:50%;bottom:calc(100% + 6px);z-index:2;transform:translateX(50%);padding:4px 7px;border:1px solid var(--ws-rule);border-radius:6px;background:var(--color-bg-soft,#1b1b19);box-shadow:0 6px 18px #0003;color:var(--color-text,#eee);font-size:11px;line-height:1.4;white-space:nowrap;pointer-events:none;animation:ws-api-copy-tip .2s var(--ws-ease) both}
[data-wuwa-api] .ws-api-url-action:hover{background:color-mix(in srgb,var(--ws-accent) 12%,transparent);transform:translateY(-1px)}
[data-wuwa-api] .ws-api-url-action:focus-visible{outline:2px solid var(--ws-accent);outline-offset:2px}
@keyframes ws-api-copy-tip{from{opacity:0;transform:translate(50%,4px) scale(.96)}to{opacity:1;transform:translate(50%,0) scale(1)}}
@media(prefers-reduced-motion:reduce){[data-wuwa-api] .ws-api-url-action{transition:none}}

[data-wuwa-api] .ws-content{grid-template-columns:minmax(0,1fr)}
[data-wuwa-api] .ws-api-service{min-width:0}
.post-content [data-wuwa-api] .ws-api-url-row code.ws-api-url{white-space:nowrap!important;word-break:normal!important;overflow-wrap:normal!important;max-width:100%;text-overflow:ellipsis;overflow:hidden}