html.sakura-performance-mode {
  --sakura-minimal-bg: #edf6ec;
  --sakura-minimal-bg-soft: #f8f4e7;
  --sakura-minimal-surface: #fffdf4;
  --sakura-minimal-surface-strong: #fffef8;
  --sakura-minimal-border: rgba(66, 96, 73, 0.16);
  --sakura-minimal-topbar: rgba(250, 252, 247, 0.98);
  --sakura-minimal-topbar-text: #203028;
  --sakura-minimal-topbar-muted: #43544a;
  --sakura-minimal-topbar-control: #eef4ec;
  --sakura-minimal-topbar-control-hover: #e2ece0;
  --sakura-minimal-primary: #2f6f55;
  --sakura-minimal-bg-image: url("/assets/sakura-eye-comfort-bg-20260516.svg?v=202605162352");
}

html.sakura-performance-mode,
html.sakura-performance-mode body,
html.sakura-performance-mode #root {
  min-height: 100%;
  background-color: var(--sakura-minimal-bg) !important;
  background-image: var(--sakura-minimal-bg-image) !important;
  background-position: center top !important;
  background-repeat: no-repeat !important;
  background-size: cover !important;
}

html.sakura-performance-mode .boot-fallback,
html.sakura-performance-mode .app-layout,
html.sakura-performance-mode .app-shell,
html.sakura-performance-mode .app-content-shell,
html.sakura-performance-mode .app-footer-shell,
html.sakura-performance-mode .semi-layout,
html.sakura-performance-mode .semi-layout-content {
  background-color: transparent !important;
}

html.sakura-performance-mode .app-content-shell {
  background-color: var(--sakura-minimal-bg) !important;
  background-image: var(--sakura-minimal-bg-image) !important;
  background-position: center top !important;
  background-repeat: no-repeat !important;
  background-size: cover !important;
}

html.sakura-performance-mode .bg-gray-100,
html.sakura-performance-mode .bg-gray-50 {
  background-color: transparent !important;
}

html.sakura-performance-mode .app-topbar-inner > div {
  background: var(--sakura-minimal-topbar) !important;
  border-color: var(--sakura-minimal-border) !important;
  box-shadow: 0 1px 0 rgba(31, 72, 54, 0.1) !important;
}

html.sakura-performance-mode .app-topbar,
html.sakura-performance-mode .app-topbar a,
html.sakura-performance-mode .app-topbar nav a,
html.sakura-performance-mode .app-topbar nav span,
html.sakura-performance-mode .app-topbar .semi-typography {
  color: var(--sakura-minimal-topbar-text) !important;
  text-shadow: none !important;
}

html.sakura-performance-mode .app-topbar nav a:hover,
html.sakura-performance-mode .app-topbar nav a:focus-visible {
  background-color: var(--sakura-minimal-topbar-control-hover) !important;
  color: var(--sakura-minimal-topbar-text) !important;
}

html.sakura-performance-mode .app-topbar .semi-button-tertiary {
  background: var(--sakura-minimal-topbar-control) !important;
  border-color: var(--sakura-minimal-border) !important;
  color: var(--sakura-minimal-topbar-text) !important;
}

html.sakura-performance-mode .app-topbar .semi-button-tertiary:hover {
  background: var(--sakura-minimal-topbar-control-hover) !important;
  color: var(--sakura-minimal-topbar-text) !important;
}

html.sakura-performance-mode .app-topbar .semi-button-tertiary *,
html.sakura-performance-mode .app-topbar .semi-button-tertiary svg {
  color: var(--sakura-minimal-topbar-text) !important;
}

html.sakura-performance-mode .app-topbar .semi-button-primary {
  background: var(--sakura-minimal-primary) !important;
  border-color: var(--sakura-minimal-primary) !important;
  color: #ffffff !important;
}

html.sakura-performance-mode .app-topbar .semi-button-primary *,
html.sakura-performance-mode .app-topbar .semi-button-primary svg {
  color: #ffffff !important;
}

html.sakura-performance-mode .app-topbar .semi-badge-count {
  color: #ffffff !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-color: var(--sakura-minimal-surface) !important;
  border-color: var(--sakura-minimal-border) !important;
}

html.sakura-performance-mode .semi-card:not(.sakura-super800-plan-card):not(.sakura-new-user-plan-card) > .semi-card-body,
html.sakura-performance-mode .semi-card:not(.sakura-super800-plan-card):not(.sakura-new-user-plan-card) > .semi-card-header {
  background-color: transparent !important;
}

html.sakura-performance-mode .semi-table,
html.sakura-performance-mode .semi-table-container,
html.sakura-performance-mode .semi-table-body,
html.sakura-performance-mode .semi-table-thead > .semi-table-row > .semi-table-row-head {
  background-color: var(--sakura-minimal-surface) !important;
}

html.sakura-performance-mode .app-footer-shell footer {
  background-color: transparent !important;
}

html.sakura-performance-mode .app-footer-shell footer > div.absolute {
  display: none !important;
}

html.dark.sakura-performance-mode {
  --sakura-minimal-bg: #101814;
  --sakura-minimal-bg-soft: #131d18;
  --sakura-minimal-surface: #18231d;
  --sakura-minimal-surface-strong: #1f2c24;
  --sakura-minimal-border: rgba(148, 163, 184, 0.16);
  --sakura-minimal-topbar: rgba(8, 18, 14, 0.98);
  --sakura-minimal-topbar-text: #eef7f0;
  --sakura-minimal-topbar-muted: #b9c7bf;
  --sakura-minimal-topbar-control: #1d2a23;
  --sakura-minimal-topbar-control-hover: #25352c;
  --sakura-minimal-primary: #3f8f6d;
  --sakura-minimal-bg-image: none;
}