html.sakura-performance-mode {
  --sakura-minimal-bg: #eef7f1;
  --sakura-minimal-bg-soft: #fff4ea;
  --sakura-minimal-surface: rgba(255, 255, 252, 0.94);
  --sakura-minimal-surface-strong: rgba(255, 255, 255, 0.97);
  --sakura-minimal-border: rgba(54, 78, 92, 0.16);
  --sakura-minimal-topbar: rgba(255, 255, 252, 0.94);
  --sakura-minimal-topbar-control: rgba(238, 247, 241, 0.88);
  --sakura-minimal-topbar-control-hover: rgba(226, 241, 232, 0.96);
  --sakura-minimal-primary: #176f64;
  --sakura-anime-bg-layer: linear-gradient(180deg, rgba(255, 255, 255, 0.18), rgba(255, 255, 255, 0.34)), url("/assets/sakura-anime-bg-20260517.svg?v=2026051701");
  --sakura-minimal-bg-image: none;
}

html.sakura-performance-mode,
html.sakura-performance-mode body {
  background-color: var(--sakura-minimal-bg) !important;
  background-image: none !important;
}

html.sakura-performance-mode body {
  min-height: 100%;
  position: relative;
}

html.sakura-performance-mode body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background-image: var(--sakura-anime-bg-layer);
  background-position: center top;
  background-repeat: no-repeat;
  background-size: cover;
  transform: translateZ(0);
}

html.sakura-performance-mode #root {
  position: relative;
  z-index: 1;
}

html.sakura-performance-mode #root,
html.sakura-performance-mode .app-layout,
html.sakura-performance-mode .app-shell,
html.sakura-performance-mode .app-content-shell,
html.sakura-performance-mode .semi-layout,
html.sakura-performance-mode .semi-layout-content {
  background-color: transparent !important;
  background-image: none !important;
}

html.sakura-performance-mode .semi-card:not(.sakura-super800-plan-card):not(.sakura-new-user-plan-card),
html.sakura-performance-mode .semi-modal-content,
html.sakura-performance-mode .semi-sidesheet-content {
  background: var(--sakura-minimal-surface) !important;
  backdrop-filter: none !important;
  box-shadow: 0 10px 30px rgba(31, 47, 57, 0.08) !important;
}

html.sakura-performance-mode .app-topbar-inner > div {
  background: var(--sakura-minimal-topbar) !important;
  backdrop-filter: none !important;
}

html.sakura-performance-mode .blur-ball {
  display: none !important;
}

html.sakura-performance-mode.sakura-console-route {
  --sakura-minimal-bg: #eef7f1;
  --sakura-anime-bg-layer: none;
}

html.sakura-performance-mode.sakura-console-route body::before {
  display: none !important;
  background-image: none !important;
}

html.sakura-performance-mode.sakura-console-route,
html.sakura-performance-mode.sakura-console-route body,
html.sakura-performance-mode.sakura-console-route #root,
html.sakura-performance-mode.sakura-console-route .app-layout,
html.sakura-performance-mode.sakura-console-route .app-shell,
html.sakura-performance-mode.sakura-console-route .app-content-shell,
html.sakura-performance-mode.sakura-console-route .semi-layout,
html.sakura-performance-mode.sakura-console-route .semi-layout-content {
  background-color: var(--sakura-minimal-bg) !important;
  background-image: none !important;
}

html.dark.sakura-performance-mode {
  --sakura-minimal-bg: #101814;
  --sakura-anime-bg-layer: linear-gradient(180deg, rgba(16, 24, 20, 0.72), rgba(16, 24, 20, 0.84)), url("/assets/sakura-anime-bg-20260517.svg?v=2026051701");
  --sakura-minimal-bg-image: none;
}

html.dark.sakura-performance-mode.sakura-console-route,
html.dark.sakura-performance-mode.sakura-console-route body,
html.dark.sakura-performance-mode.sakura-console-route #root,
html.dark.sakura-performance-mode.sakura-console-route .app-layout,
html.dark.sakura-performance-mode.sakura-console-route .app-shell,
html.dark.sakura-performance-mode.sakura-console-route .app-content-shell,
html.dark.sakura-performance-mode.sakura-console-route .semi-layout,
html.dark.sakura-performance-mode.sakura-console-route .semi-layout-content {
  background-color: #101814 !important;
  background-image: none !important;
}

@media (max-width: 767px) {
  html.sakura-performance-mode {
    --sakura-anime-bg-layer: linear-gradient(180deg, rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.38)), url("/assets/sakura-anime-bg-20260517.svg?v=2026051701");
  }

  html.sakura-performance-mode body::before {
    background-position: 52% top !important;
  }
}