/*
 * Cloud Console visual system
 * A fresh, airy interface designed specifically for renting and managing
 * cloud computers. Loaded last so it is the single source of visual truth.
 */

html[data-app-theme="macos"] body.sidebar-layout {
  --cloud-ink: #182230;
  --cloud-ink-soft: #475467;
  --cloud-muted: #667085;
  --cloud-faint: #98a2b3;
  --cloud-line: #e4e7ec;
  --cloud-line-strong: #d0d5dd;
  --cloud-canvas: #f5f7fa;
  --cloud-panel: #ffffff;
  --cloud-panel-soft: #f8fafc;
  --cloud-accent: #3978e9;
  --cloud-accent-dark: #245fce;
  --cloud-accent-soft: #edf4ff;
  --cloud-success: #168a5b;
  --cloud-success-soft: #eaf8f1;
  --cloud-warning: #b27632;
  --cloud-warning-soft: #fff5e8;
  --cloud-danger: #b84d51;
  --cloud-danger-soft: #fff0f0;
  --cloud-shadow: 0 10px 30px rgba(16, 24, 40, 0.055);
  color: var(--cloud-ink);
  background:
    radial-gradient(circle at 98% 0, rgba(84, 143, 255, 0.07), transparent 30rem),
    linear-gradient(180deg, #f8fafc 0%, var(--cloud-canvas) 100%);
  font-family:
    -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI Variable Text",
    "Noto Sans SC", "Microsoft YaHei", system-ui, sans-serif;
}

html[data-app-theme="macos"] .sidebar-layout .app-content {
  min-width: 0;
}

html[data-app-theme="macos"] .sidebar-layout .content-container {
  width: 100%;
  max-width: 1540px;
  margin-right: auto;
  margin-left: auto;
}

/* Sidebar */
html[data-app-theme="macos"] .sidebar-layout .app-sidebar {
  color: var(--cloud-ink);
  border-right: 1px solid var(--cloud-line) !important;
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 6px 0 24px rgba(16, 24, 40, 0.025);
  -webkit-backdrop-filter: blur(20px);
  backdrop-filter: blur(20px);
}

html[data-app-theme="macos"] .sidebar-layout :is(.sidebar-head, .sidebar-section-remote) {
  border-color: var(--cloud-line);
}

html[data-app-theme="macos"] .sidebar-layout .brand-mark {
  color: #fff;
  border-radius: 11px;
  background: var(--cloud-accent);
  box-shadow: 0 7px 17px rgba(57, 120, 233, 0.18);
}

html[data-app-theme="macos"] .sidebar-layout .sidebar-brand strong {
  color: var(--cloud-ink);
  font-size: 0.94rem;
  font-weight: 760;
  letter-spacing: -0.025em;
}

html[data-app-theme="macos"] .sidebar-layout :is(
  .sidebar-brand small,
  .sidebar-account small,
  .sidebar-label,
  .sidebar-link small
) {
  color: var(--cloud-muted);
}

html[data-app-theme="macos"] .sidebar-layout .sidebar-user-card {
  border: 1px solid var(--cloud-line);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 5px 18px rgba(16, 24, 40, 0.04);
}

html[data-app-theme="macos"] .sidebar-layout .sidebar-account strong {
  color: var(--cloud-ink);
}

html[data-app-theme="macos"] .sidebar-layout .sidebar-link {
  color: var(--cloud-ink-soft);
  border: 1px solid transparent;
  border-radius: 11px;
  transition:
    color 150ms ease,
    background 150ms ease,
    border-color 150ms ease;
}

html[data-app-theme="macos"] .sidebar-layout .sidebar-link:hover {
  color: var(--cloud-ink);
  border-color: transparent;
  background: #f7f9fc;
  transform: none;
}

html[data-app-theme="macos"] .sidebar-layout .sidebar-link.active {
  color: var(--cloud-accent-dark);
  border-color: #dbe7fb;
  background: var(--cloud-accent-soft);
  box-shadow: none;
}

html[data-app-theme="macos"] .sidebar-layout .sidebar-link.active > i {
  background: var(--cloud-accent);
  box-shadow: none;
}

html[data-app-theme="macos"] .sidebar-layout .sidebar-link-icon,
html[data-app-theme="macos"] .sidebar-layout .sidebar-link.active .sidebar-link-icon,
html[data-app-theme="macos"] .sidebar-layout .sidebar-section-remote .sidebar-link-icon {
  color: var(--cloud-accent);
  border-radius: 9px;
  background: transparent;
}

/* Common surfaces and controls */
html[data-app-theme="macos"] .sidebar-layout :is(
  .content-panel,
  .market-plan-card,
  .promotion-stat-card,
  .promotion-wallet-card,
  .promotion-ledger-panel,
  .promotion-share-panel,
  .account-panel,
  .account-stat,
  .patrol-page,
  .patrol-toolbar,
  .patrol-monitor,
  .support-workspace
) {
  color: var(--cloud-ink);
  border-color: var(--cloud-line);
  border-radius: 16px;
  background: var(--cloud-panel);
  box-shadow: var(--cloud-shadow);
}

html[data-app-theme="macos"] .sidebar-layout :is(
  h1, h2, h3, h4, h5, h6,
  .text-dark,
  .text-body
) {
  color: var(--cloud-ink) !important;
}

html[data-app-theme="macos"] .sidebar-layout :is(input, select, textarea, .form-control, .form-select) {
  color: var(--cloud-ink);
  border-color: var(--cloud-line);
  border-radius: 10px;
  background: #fff;
}

html[data-app-theme="macos"] .sidebar-layout :is(input, textarea)::placeholder {
  color: #a0aaad;
}

html[data-app-theme="macos"] .sidebar-layout :is(input, select, textarea):focus {
  border-color: #8eb0ef;
  box-shadow: 0 0 0 3px rgba(57, 120, 233, 0.11);
}

html[data-app-theme="macos"] .sidebar-layout :is(
  .btn-brand,
  .machine-connect-button,
  .account-phone-action,
  .account-application-action,
  .patrol-layout-button.active
) {
  color: #fff;
  border-color: var(--cloud-accent);
  border-radius: 10px;
  background: var(--cloud-accent);
  box-shadow: 0 7px 16px rgba(57, 120, 233, 0.16);
}

html[data-app-theme="macos"] .sidebar-layout :is(
  .btn-brand,
  .machine-connect-button,
  .account-phone-action,
  .account-application-action,
  .patrol-layout-button.active
):hover {
  color: #fff;
  border-color: var(--cloud-accent-dark);
  background: var(--cloud-accent-dark);
  box-shadow: 0 8px 18px rgba(36, 95, 206, 0.18);
  transform: none;
}

html[data-app-theme="macos"] .sidebar-layout :is(
  .btn-soft,
  .machine-more-button,
  .machine-batch-button,
  .patrol-tool-button,
  .mobile-menu-button
) {
  color: var(--cloud-ink-soft);
  border-color: var(--cloud-line);
  border-radius: 10px;
  background: #fff;
  box-shadow: none;
}

html[data-app-theme="macos"] .sidebar-layout :is(
  .btn-soft,
  .machine-more-button,
  .machine-batch-button,
  .patrol-tool-button,
  .mobile-menu-button
):hover {
  color: var(--cloud-ink);
  border-color: var(--cloud-line-strong);
  background: var(--cloud-panel-soft);
}

html[data-app-theme="macos"] .sidebar-layout .dropdown-menu {
  color: var(--cloud-ink);
  border-color: var(--cloud-line);
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 16px 40px rgba(16, 24, 40, 0.13);
}

html[data-app-theme="macos"] .sidebar-layout .dropdown-item {
  color: var(--cloud-ink-soft);
  border-radius: 8px;
}

html[data-app-theme="macos"] .sidebar-layout .dropdown-item:hover,
html[data-app-theme="macos"] .sidebar-layout .dropdown-item:focus {
  color: var(--cloud-ink);
  background: #f4f6f9;
}

/* Machine list */
html[data-app-theme="macos"] .sidebar-layout .content-panel:has(.machine-table-rows) {
  border: 0;
  background: transparent;
  box-shadow: none;
}

html[data-app-theme="macos"] .sidebar-layout .machine-filter-bar {
  border-color: var(--cloud-line);
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(16, 24, 40, 0.045);
}

html[data-app-theme="macos"] .sidebar-layout .machine-filter {
  color: var(--cloud-muted);
  border-radius: 9px;
}

html[data-app-theme="macos"] .sidebar-layout .machine-filter:hover {
  color: var(--cloud-ink-soft);
  background: #f4f6f9;
}

html[data-app-theme="macos"] .sidebar-layout .machine-filter.active {
  color: var(--cloud-accent-dark);
  border-color: transparent;
  background: var(--cloud-accent-soft);
  box-shadow: none;
}

html[data-app-theme="macos"] .sidebar-layout .machine-remote-selector {
  color: var(--cloud-muted);
  border-color: var(--cloud-line);
  background: #fff;
}

html[data-app-theme="macos"] .sidebar-layout .machine-batch-bar {
  border-color: var(--cloud-line);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.88);
}

html[data-app-theme="macos"] .sidebar-layout .machine-table-rows thead {
  color: var(--cloud-muted);
  background: transparent;
}

html[data-app-theme="macos"] .sidebar-layout .machine-table-rows tbody tr,
html[data-app-theme="macos"] .sidebar-layout .machine-card-row.is-offline {
  border-color: var(--cloud-line);
  border-radius: 13px;
  background: #fff;
  box-shadow: 0 6px 20px rgba(16, 24, 40, 0.05);
}

html[data-app-theme="macos"] .sidebar-layout .machine-table-rows tbody tr:hover,
html[data-app-theme="macos"] .sidebar-layout .machine-table-rows tbody tr.row-selected {
  border-color: #cbdcf8;
  background: #fbfdff;
  box-shadow: 0 10px 26px rgba(16, 24, 40, 0.075);
}

html[data-app-theme="macos"] .sidebar-layout .machine-card-symbol {
  color: var(--cloud-accent);
  border-color: #dbe6f8;
  background: var(--cloud-accent-soft);
}

html[data-app-theme="macos"] .sidebar-layout .machine-number {
  color: var(--cloud-ink);
  font-weight: 740;
}

html[data-app-theme="macos"] .sidebar-layout .machine-card-stat > small,
html[data-app-theme="macos"] .sidebar-layout .machine-card-field > small,
html[data-app-theme="macos"] .sidebar-layout .machine-card-actions-wrap > small {
  color: var(--cloud-faint);
}

html[data-app-theme="macos"] .sidebar-layout .machine-configuration,
html[data-app-theme="macos"] .sidebar-layout .remaining-time strong,
html[data-app-theme="macos"] .sidebar-layout .server-room-name {
  color: var(--cloud-ink-soft);
}

html[data-app-theme="macos"] .sidebar-layout .local-remark {
  border-color: var(--cloud-line);
  background: var(--cloud-panel-soft);
}

html[data-app-theme="macos"] .sidebar-layout .machine-support-button {
  color: var(--cloud-accent-dark);
  border-color: #d5e2f8;
  background: #f5f8ff;
  box-shadow: none;
}

html[data-app-theme="macos"] .sidebar-layout .machine-card-actions-wrap .machine-connect-button {
  min-width: 72px;
  height: 36px;
  gap: 0.38rem;
  padding: 0 0.78rem;
  color: var(--cloud-accent-dark) !important;
  border-color: #d5e2f8 !important;
  border-radius: 10px;
  background: #f5f8ff !important;
  box-shadow: none !important;
  font-size: 0.74rem;
  font-weight: 680;
  letter-spacing: 0.01em;
  transition:
    border-color 150ms ease,
    background-color 150ms ease,
    box-shadow 150ms ease,
    transform 150ms ease;
}

html[data-app-theme="macos"] .sidebar-layout .machine-card-actions-wrap .machine-connect-button:hover {
  color: var(--cloud-accent-dark) !important;
  border-color: #aac2ef !important;
  background: var(--cloud-accent-soft) !important;
  box-shadow: 0 2px 6px rgba(57, 120, 233, 0.08) !important;
  transform: none !important;
}

html[data-app-theme="macos"] .sidebar-layout .machine-card-actions-wrap .machine-connect-button:active {
  background: #e4eeff !important;
  box-shadow: none !important;
  transform: scale(0.98) !important;
}

html[data-app-theme="macos"] .sidebar-layout .machine-card-actions-wrap .machine-connect-button:focus-visible {
  outline: 3px solid rgba(57, 120, 233, 0.17);
  outline-offset: 2px;
}

html[data-app-theme="macos"] .sidebar-layout .machine-card-actions-wrap .machine-connect-button svg {
  width: 15px;
  height: 15px;
  flex: 0 0 15px;
  stroke-width: 1.9;
}

html[data-app-theme="macos"] .sidebar-layout .machine-support-button:hover {
  color: var(--cloud-accent-dark);
  border-color: #aac2ef;
  background: var(--cloud-accent-soft);
  box-shadow: none;
  transform: none;
}

html[data-app-theme="macos"] .sidebar-layout .machine-new-badge {
  color: var(--cloud-accent-dark);
  border-color: #d5e2f8;
  background: var(--cloud-accent-soft);
}

/* Purchase */
html[data-app-theme="macos"] .sidebar-layout .purchase-page-intro {
  min-height: 112px;
  border-color: var(--cloud-line);
  border-radius: 18px;
  background:
    linear-gradient(112deg, #ffffff 0 68%, #f3f7ff 100%);
  box-shadow: var(--cloud-shadow);
}

html[data-app-theme="macos"] .sidebar-layout .purchase-page-intro::after {
  border-color: rgba(57, 120, 233, 0.045);
}

html[data-app-theme="macos"] .sidebar-layout .purchase-intro-eyebrow {
  color: var(--cloud-accent) !important;
}

html[data-app-theme="macos"] .sidebar-layout .purchase-intro-eyebrow i {
  background: var(--cloud-accent);
  box-shadow: 0 0 0 5px rgba(57, 120, 233, 0.1);
}

html[data-app-theme="macos"] .sidebar-layout .purchase-intro-copy h1 {
  color: var(--cloud-ink);
  font-weight: 760;
}

html[data-app-theme="macos"] .sidebar-layout .purchase-intro-copy p {
  color: var(--cloud-muted);
}

html[data-app-theme="macos"] .sidebar-layout .purchase-progress li > span {
  color: var(--cloud-muted);
  border-color: var(--cloud-line);
  background: #fff;
  box-shadow: none;
}

html[data-app-theme="macos"] .sidebar-layout .purchase-progress li.active > span {
  color: #fff;
  border-color: var(--cloud-accent);
  background: var(--cloud-accent);
}

html[data-app-theme="macos"] .sidebar-layout .purchase-room-picker {
  border-color: var(--cloud-line);
  border-radius: 18px;
  background: #fff;
  box-shadow: var(--cloud-shadow);
}

html[data-app-theme="macos"] .sidebar-layout :is(
  .purchase-section-title > span,
  .purchase-catalog-title > span
) {
  color: var(--cloud-accent-dark) !important;
  border-color: #dbe6f8;
  background: var(--cloud-accent-soft);
}

html[data-app-theme="macos"] .sidebar-layout .purchase-room-total {
  color: var(--cloud-accent-dark) !important;
  border-color: #dbe6f8 !important;
  background: var(--cloud-accent-soft) !important;
}

html[data-app-theme="macos"] .sidebar-layout .purchase-room-total b {
  color: var(--cloud-accent-dark) !important;
}

html[data-app-theme="macos"] .sidebar-layout .purchase-room-picker .purchase-room-track .server-room-option {
  border-color: var(--cloud-line);
  border-radius: 14px;
  background: #fff;
  box-shadow: none;
}

html[data-app-theme="macos"] .sidebar-layout .purchase-room-picker .purchase-room-track .server-room-option:hover {
  border-color: var(--cloud-line-strong);
  background: var(--cloud-panel-soft);
  box-shadow: none;
  transform: translateY(-1px);
}

html[data-app-theme="macos"] .sidebar-layout .purchase-room-picker .purchase-room-track .server-room-option.active {
  border-color: #9fbbef;
  background: #f9fbff;
  box-shadow: inset 0 0 0 1px rgba(57, 120, 233, 0.08);
}

html[data-app-theme="macos"] .sidebar-layout .purchase-room-selected {
  color: var(--cloud-accent-dark) !important;
  border-color: #d7e3f8 !important;
  background: var(--cloud-accent-soft) !important;
}

html[data-app-theme="macos"] .sidebar-layout .purchase-room-machine-prefix b {
  color: var(--cloud-ink-soft) !important;
  border-color: var(--cloud-line) !important;
  background: #f2f4f7 !important;
}

html[data-app-theme="macos"] .sidebar-layout .market-catalog-heading {
  border-color: var(--cloud-line);
  border-radius: 13px;
  background: rgba(255, 255, 255, 0.84);
}

html[data-app-theme="macos"] .sidebar-layout .market-available-total.has-stock {
  color: var(--cloud-success) !important;
  border-color: #cce4d8 !important;
  background: var(--cloud-success-soft) !important;
}

html[data-app-theme="macos"] .sidebar-layout .market-available-total.has-stock b {
  color: #206d4d !important;
}

html[data-app-theme="macos"] .sidebar-layout .market-plan-card {
  overflow: hidden;
  padding: 0;
  border-color: var(--cloud-line);
  border-radius: 16px;
  background: #fff;
  box-shadow: var(--cloud-shadow);
}

html[data-app-theme="macos"] .sidebar-layout .market-plan-card:hover,
html[data-app-theme="macos"] .sidebar-layout .market-plan-card.market-plan-featured {
  border-color: #d5dfef;
  background: #fff;
  box-shadow: 0 15px 38px rgba(16, 24, 40, 0.085);
  transform: none;
}

html[data-app-theme="macos"] .sidebar-layout .market-plan-top {
  padding: 1.08rem 1.15rem 0.88rem;
}

html[data-app-theme="macos"] .sidebar-layout .purchase-plan-icon {
  color: var(--cloud-accent) !important;
  border-color: #dbe6f8 !important;
  background: var(--cloud-accent-soft) !important;
}

html[data-app-theme="macos"] .sidebar-layout .market-plan-identity h2 {
  color: var(--cloud-ink);
  font-size: 1.08rem;
  font-weight: 740;
}

html[data-app-theme="macos"] .sidebar-layout .market-plan-identity > small {
  color: var(--cloud-muted);
}

html[data-app-theme="macos"] .sidebar-layout .market-recommend {
  color: var(--cloud-warning);
  border-color: #ecd9c7;
  background: var(--cloud-warning-soft);
}

html[data-app-theme="macos"] .sidebar-layout .market-spec-grid.hardware-list {
  margin: 0 1.15rem;
  border: 0;
  border-radius: 11px;
  background: #f7f9fc;
}

html[data-app-theme="macos"] .sidebar-layout .market-spec-grid.hardware-list > div {
  border-color: var(--cloud-line);
}

html[data-app-theme="macos"] .sidebar-layout .hardware-mark {
  color: var(--cloud-muted) !important;
  border: 0 !important;
  background: #edf1f5 !important;
}

html[data-app-theme="macos"] .sidebar-layout .market-plan-footer {
  gap: 1rem;
  margin: 0;
  padding: 1rem 1.15rem 1.12rem;
  border-top: 0;
  background: #fff;
}

html[data-app-theme="macos"] .sidebar-layout .market-pricing-title strong {
  color: var(--cloud-ink-soft);
}

html[data-app-theme="macos"] .sidebar-layout .market-pricing-title small {
  color: var(--cloud-faint);
}

html[data-app-theme="macos"] .sidebar-layout .market-duration-area .duration-selector {
  gap: 6px;
  padding: 6px;
  border: 1px solid var(--cloud-line);
  border-radius: 13px;
  background: #f5f7fa;
}

html[data-app-theme="macos"] .sidebar-layout .market-duration-area .duration-option {
  min-height: 70px;
  border: 1px solid #e1e6ee;
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 1px 2px rgba(16, 24, 40, 0.025);
}

html[data-app-theme="macos"] .sidebar-layout .market-duration-area .duration-option:hover {
  border-color: #b9cdf3;
  background: #f9fbff;
}

html[data-app-theme="macos"] .sidebar-layout .market-duration-area .duration-option.active,
html[data-app-theme="macos"] .sidebar-layout .market-duration-area .duration-option.active:hover {
  border: 1px solid #8eace8 !important;
  background: var(--cloud-accent-soft) !important;
  box-shadow:
    0 0 0 1px rgba(57, 120, 233, 0.055),
    0 4px 10px rgba(57, 120, 233, 0.08);
}

html[data-app-theme="macos"] .sidebar-layout .market-duration-area .duration-option.active::after {
  background: var(--cloud-accent) !important;
}

html[data-app-theme="macos"] .sidebar-layout .market-duration-area .duration-option.active .duration-option-heading strong {
  color: var(--cloud-ink) !important;
}

html[data-app-theme="macos"] .sidebar-layout .market-duration-area .duration-option.active .duration-option-heading em {
  color: var(--cloud-accent-dark) !important;
  background: var(--cloud-accent-soft) !important;
}

html[data-app-theme="macos"] .sidebar-layout .duration-option-heading strong,
html[data-app-theme="macos"] .sidebar-layout .duration-option-amount b {
  color: var(--cloud-ink);
}

html[data-app-theme="macos"] .sidebar-layout .duration-option-heading em,
html[data-app-theme="macos"] .sidebar-layout .duration-option-amount :is(small, em) {
  color: var(--cloud-muted);
}

html[data-app-theme="macos"] .sidebar-layout .market-action-stock {
  color: var(--cloud-muted);
  border: 0;
  background: transparent;
}

html[data-app-theme="macos"] .sidebar-layout .market-action-stock strong,
html[data-app-theme="macos"] .sidebar-layout .market-action-stock b {
  color: var(--cloud-ink-soft);
}

html[data-app-theme="macos"] .sidebar-layout .market-select-button.purchase-now-button:not(:disabled) {
  position: relative;
  min-height: 60px;
  grid-template-columns: minmax(90px, 1fr) minmax(64px, auto) 28px;
  gap: 0.64rem;
  padding: 0.64rem 0.7rem 0.64rem 0.96rem;
  color: var(--cloud-ink);
  border-color: #b9cdf3;
  border-radius: 13px;
  background:
    radial-gradient(circle at 88% 0%, rgba(57, 120, 233, 0.16), transparent 46%),
    linear-gradient(135deg, #f8fbff 0%, #e8f0ff 100%);
  box-shadow:
    inset 4px 0 0 var(--cloud-accent),
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 8px 18px rgba(36, 95, 206, 0.11);
}

html[data-app-theme="macos"] .sidebar-layout .market-select-button.purchase-now-button:not(:disabled):hover {
  color: var(--cloud-ink);
  border-color: #8eace8;
  background:
    radial-gradient(circle at 88% 0%, rgba(57, 120, 233, 0.2), transparent 48%),
    linear-gradient(135deg, #f5f9ff 0%, #dfeaff 100%);
  box-shadow:
    inset 4px 0 0 var(--cloud-accent),
    inset 0 1px 0 rgba(255, 255, 255, 0.92),
    0 11px 23px rgba(36, 95, 206, 0.15);
  transform: translateY(-1px);
}

html[data-app-theme="macos"] .sidebar-layout .market-select-button.purchase-now-button:not(:disabled):active {
  box-shadow:
    inset 4px 0 0 var(--cloud-accent),
    0 3px 8px rgba(36, 95, 206, 0.09);
  transform: translateY(0) scale(0.99);
}

html[data-app-theme="macos"] .sidebar-layout .market-select-button.purchase-now-button .purchase-button-label {
  gap: 0.12rem;
  line-height: 1.2;
}

html[data-app-theme="macos"] .sidebar-layout .market-select-button.purchase-now-button .purchase-button-label strong {
  color: var(--cloud-ink);
  font-size: 0.94rem;
  font-weight: 740;
  letter-spacing: -0.01em;
}

html[data-app-theme="macos"] .sidebar-layout .market-select-button.purchase-now-button:not(:disabled) .purchase-button-price {
  min-width: 64px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  font-variant-numeric: tabular-nums;
  line-height: 1.15;
  text-align: right;
}

html[data-app-theme="macos"] .sidebar-layout .market-select-button.purchase-now-button:not(:disabled) :is(
  .purchase-button-label small,
  .purchase-button-price small
) {
  color: var(--cloud-muted);
  font-size: 0.66rem;
  font-weight: 560;
  line-height: 1.2;
}

html[data-app-theme="macos"] .sidebar-layout .market-select-button.purchase-now-button:not(:disabled) .purchase-button-price strong {
  color: var(--cloud-accent-dark);
  font-size: 0.8rem;
  font-weight: 680;
}

html[data-app-theme="macos"] .sidebar-layout .market-select-button.purchase-now-button:not(:disabled) .purchase-button-price strong b {
  font-size: 1.12rem;
  font-weight: 780;
}

html[data-app-theme="macos"] .sidebar-layout .market-select-button.purchase-now-button > svg {
  box-sizing: border-box;
  width: 28px;
  height: 28px;
  padding: 6px;
  color: #fff !important;
  border: 1px solid var(--cloud-accent) !important;
  border-radius: 50%;
  background: var(--cloud-accent) !important;
  box-shadow: 0 2px 5px rgba(57, 120, 233, 0.18);
  stroke: #fff !important;
  transition:
    background-color 150ms ease,
    transform 150ms ease;
}

html[data-app-theme="macos"] .sidebar-layout .market-select-button.purchase-now-button:not(:disabled) > svg {
  width: 28px;
  height: 28px;
  padding: 6px;
}

html[data-app-theme="macos"] .sidebar-layout .market-select-button.purchase-now-button:not(:disabled):hover > svg {
  background: var(--cloud-accent-dark) !important;
  transform: translateX(1px);
}

html[data-app-theme="macos"] .sidebar-layout .market-select-button.purchase-now-button:focus-visible {
  outline: 3px solid rgba(57, 120, 233, 0.18);
  outline-offset: 2px;
}

html[data-app-theme="macos"] .sidebar-layout .market-select-button.purchase-now-button:disabled {
  min-height: 60px;
  border-color: var(--cloud-line);
  border-radius: 13px;
  background: #f2f4f7;
  box-shadow: none;
}

html[data-app-theme="macos"] .sidebar-layout .market-select-button.purchase-now-button:disabled .purchase-button-price {
  padding: 0;
  border: 0;
  background: transparent;
}

html[data-app-theme="macos"] .sidebar-layout .market-select-button.purchase-now-button:disabled .purchase-button-label strong,
html[data-app-theme="macos"] .sidebar-layout .market-select-button.purchase-now-button:disabled .purchase-button-price strong {
  color: #667085;
}

html[data-app-theme="macos"] .sidebar-layout .market-select-button.purchase-now-button:disabled > svg {
  color: #98a2b3 !important;
  border-color: #d0d5dd !important;
  background: #eaecf0 !important;
  box-shadow: none;
  stroke: #98a2b3 !important;
}

/* Account center */
html[data-app-theme="macos"] .sidebar-layout .account-hero {
  overflow: hidden;
  border-color: var(--cloud-line);
  border-radius: 18px;
  background:
    linear-gradient(112deg, #ffffff 0 68%, #f3f7ff 100%);
  box-shadow: var(--cloud-shadow);
}

html[data-app-theme="macos"] .sidebar-layout .account-hero-orb {
  opacity: 0.24;
  filter: grayscale(1);
}

html[data-app-theme="macos"] body.sidebar-layout .account-hub .account-identity .account-identity-copy .account-kicker {
  color: var(--cloud-accent) !important;
}

html[data-app-theme="macos"] .sidebar-layout .account-identity-copy :is(h1, p) {
  color: var(--cloud-ink);
}

html[data-app-theme="macos"] .sidebar-layout .account-identity-copy p {
  color: var(--cloud-muted);
}

html[data-app-theme="macos"] .sidebar-layout .account-avatar {
  border-color: #dce4ef;
  box-shadow: 0 7px 18px rgba(16, 24, 40, 0.09);
}

html[data-app-theme="macos"] .sidebar-layout .account-badges > span {
  border-color: var(--cloud-line);
  background: #f6f8f8;
}

html[data-app-theme="macos"] .sidebar-layout .account-badges > .is-ready {
  color: var(--cloud-success);
  border-color: #cfe4da;
  background: var(--cloud-success-soft);
}

html[data-app-theme="macos"] .sidebar-layout .account-hero-actions > button {
  color: var(--cloud-ink-soft);
  border-color: var(--cloud-line);
  background: #fff;
}

html[data-app-theme="macos"] .sidebar-layout .account-hero-actions > button:hover {
  color: var(--cloud-accent-dark);
  border-color: #cbdaf5;
  background: var(--cloud-accent-soft);
}

html[data-app-theme="macos"] .sidebar-layout :is(
  .account-panel,
  .account-stat,
  .account-profile-group,
  .account-profile-row
) {
  border-color: var(--cloud-line);
  background: #fff;
  box-shadow: none;
}

html[data-app-theme="macos"] .sidebar-layout :is(
  .account-profile-group-icon,
  .account-orders-modal-icon,
  .account-stat-icon.is-violet
) {
  color: var(--cloud-accent);
  background: var(--cloud-accent-soft);
}

/* Promotion */
html[data-app-theme="macos"] .sidebar-layout .promotion-heading {
  color: var(--cloud-ink);
}

html[data-app-theme="macos"] .sidebar-layout .promotion-eyebrow {
  color: var(--cloud-accent);
}

html[data-app-theme="macos"] .sidebar-layout :is(
  .promotion-stat-card,
  .promotion-share-panel,
  .promotion-wallet-card,
  .promotion-rule-panel,
  .promotion-ledger-panel
) {
  border-color: var(--cloud-line);
  background: #fff;
  box-shadow: var(--cloud-shadow);
}

html[data-app-theme="macos"] .sidebar-layout :is(
  .promotion-stat-icon,
  .promotion-wallet-icon,
  .promotion-rule-icon
) {
  color: var(--cloud-accent);
  border-color: #dbe6f8;
  background: var(--cloud-accent-soft);
}

html[data-app-theme="macos"] .sidebar-layout .promotion-wallet-card {
  background:
    linear-gradient(112deg, #ffffff 0 68%, #f3f7ff 100%);
}

html[data-app-theme="macos"] .sidebar-layout :is(
  .promotion-balance-stat,
  .promotion-fee-summary,
  .promotion-heading-badges > *
) {
  border-color: var(--cloud-line);
  background: var(--cloud-panel-soft);
}

html[data-app-theme="macos"] .sidebar-layout .promotion-ledger-table thead {
  color: var(--cloud-muted);
  background: #f7f9fc;
}

html[data-app-theme="macos"] .sidebar-layout .promotion-withdraw-trigger {
  color: #fff;
  border-color: var(--cloud-accent);
  background: var(--cloud-accent);
  box-shadow: 0 7px 16px rgba(57, 120, 233, 0.16);
}

/* Patrol */
html[data-app-theme="macos"] .sidebar-layout .patrol-page {
  border: 0;
  background: transparent;
  box-shadow: none;
}

html[data-app-theme="macos"] .sidebar-layout .patrol-header {
  border-color: var(--cloud-line);
  border-radius: 18px;
  background:
    linear-gradient(112deg, #ffffff 0 68%, #f3f7ff 100%);
  box-shadow: var(--cloud-shadow);
}

html[data-app-theme="macos"] .sidebar-layout .patrol-title-icon {
  color: var(--cloud-accent) !important;
  border-color: #d7e3f8 !important;
  background: var(--cloud-accent-soft) !important;
}

html[data-app-theme="macos"] .sidebar-layout .patrol-title-group p,
html[data-app-theme="macos"] .sidebar-layout .patrol-summary {
  color: var(--cloud-muted);
}

html[data-app-theme="macos"] .sidebar-layout .patrol-toolbar {
  border-color: var(--cloud-line);
  background: #fff;
  box-shadow: none;
}

html[data-app-theme="macos"] .sidebar-layout .patrol-layout-switch {
  border-color: var(--cloud-line);
  background: #f0f3f8;
}

html[data-app-theme="macos"] .sidebar-layout .patrol-layout-button {
  color: var(--cloud-muted);
}

html[data-app-theme="macos"] .sidebar-layout .patrol-layout-button.active {
  color: var(--cloud-ink) !important;
  border-color: transparent !important;
  background: #fff !important;
  box-shadow: 0 2px 7px rgba(16, 24, 40, 0.1) !important;
}

html[data-app-theme="macos"] .sidebar-layout .patrol-monitor {
  overflow: hidden;
  border-color: var(--cloud-line);
  background: #fff;
  box-shadow: var(--cloud-shadow);
}

html[data-app-theme="macos"] .sidebar-layout .patrol-monitor-topbar {
  color: var(--cloud-ink-soft);
  border-color: var(--cloud-line);
  background: #f8fafc;
}

html[data-app-theme="macos"] .sidebar-layout .patrol-card {
  border-color: var(--cloud-line);
  border-radius: 12px;
  background: #fff;
  box-shadow: none;
}

html[data-app-theme="macos"] .sidebar-layout .patrol-card:hover {
  border-color: #cddbf2;
  box-shadow: 0 8px 22px rgba(16, 24, 40, 0.075);
  transform: none;
}

html[data-app-theme="macos"] .sidebar-layout .patrol-preview-header {
  border-color: var(--cloud-line);
  background: #f8fafc;
}

html[data-app-theme="macos"] .sidebar-layout .patrol-preview-close {
  color: var(--cloud-muted);
  border-color: var(--cloud-line);
  background: #fff;
}

/* Support */
html[data-app-theme="macos"] .sidebar-layout .support-page-heading {
  color: var(--cloud-ink);
}

html[data-app-theme="macos"] .sidebar-layout .support-heading-icon {
  color: var(--cloud-accent);
  border-color: #dbe6f8;
  background: var(--cloud-accent-soft);
}

html[data-app-theme="macos"] .sidebar-layout .support-heading-kicker {
  color: var(--cloud-accent);
}

html[data-app-theme="macos"] .sidebar-layout .service-center-tabs {
  border-color: var(--cloud-line);
  background: #fff;
  box-shadow: var(--cloud-shadow);
}

html[data-app-theme="macos"] .sidebar-layout .service-center-tabs > a.active {
  color: var(--cloud-accent);
  border-color: #dbe6f8;
  background: var(--cloud-accent-soft);
}

html[data-app-theme="macos"] .sidebar-layout .support-page-heading p {
  color: var(--cloud-muted);
}

html[data-app-theme="macos"] .sidebar-layout .support-customer-chip {
  border-color: var(--cloud-line);
  background: #fff;
}

html[data-app-theme="macos"] .sidebar-layout .support-workspace {
  overflow: hidden;
  border-color: var(--cloud-line);
  background: #fff;
  box-shadow: var(--cloud-shadow);
}

html[data-app-theme="macos"] .sidebar-layout .support-inbox {
  border-right-color: var(--cloud-line);
  background: #f8fafc;
}

html[data-app-theme="macos"] .sidebar-layout :is(.support-inbox-head, .support-chat-head) {
  border-color: var(--cloud-line);
  background: #fff;
}

html[data-app-theme="macos"] .sidebar-layout .support-new-button,
html[data-app-theme="macos"] .sidebar-layout .support-composer-box button[type="submit"] {
  color: #fff;
  border-color: var(--cloud-accent);
  background: var(--cloud-accent);
  box-shadow: 0 7px 16px rgba(57, 120, 233, 0.14);
}

html[data-app-theme="macos"] .sidebar-layout .support-complaint-entry {
  border-color: var(--cloud-line);
  background: #fff;
}

html[data-app-theme="macos"] .sidebar-layout .support-conversation-search {
  border-color: var(--cloud-line);
  background: #fff;
}

html[data-app-theme="macos"] .sidebar-layout .support-conversation:hover,
html[data-app-theme="macos"] .sidebar-layout .support-conversation.active {
  border-color: #d2def4;
  background: var(--cloud-accent-soft);
}

html[data-app-theme="macos"] .sidebar-layout .support-conversation.active {
  box-shadow: inset 3px 0 0 var(--cloud-accent);
}

html[data-app-theme="macos"] .sidebar-layout .support-chat-panel {
  background: #f7f9fc;
}

html[data-app-theme="macos"] .sidebar-layout :is(
  .support-room-avatar,
  .support-customer-avatar,
  .support-conversation-avatar
) {
  color: var(--cloud-accent-dark);
  border-color: #d9e4f7;
  background: var(--cloud-accent-soft);
}

html[data-app-theme="macos"] .sidebar-layout .support-composer {
  border-color: var(--cloud-line);
  background: #fff;
}

html[data-app-theme="macos"] .sidebar-layout .support-composer-box {
  border-color: var(--cloud-line);
  background: #f8fafc;
}

/* Dialogs, payment and order sheets */
html[data-app-theme="macos"] .sidebar-layout .modal-content,
html[data-app-theme="macos"] .sidebar-layout .custom-modal {
  color: var(--cloud-ink);
  border-color: var(--cloud-line);
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 28px 76px rgba(27, 45, 49, 0.2);
}

html[data-app-theme="macos"] .sidebar-layout :is(.modal-header, .modal-footer) {
  border-color: var(--cloud-line);
  background: #fff;
}

html[data-app-theme="macos"] .sidebar-layout .purchase-confirm-modal {
  border-color: var(--cloud-line);
  background: #fff;
}

html[data-app-theme="macos"] .sidebar-layout .purchase-confirm-modal > .modal-header {
  background: #f8fafa;
}

html[data-app-theme="macos"] .sidebar-layout :is(
  .confirm-plan-title,
  .purchase-count-field,
  .purchase-choice-summary
) {
  border-color: var(--cloud-line);
  background: #f6f8f8;
}

html[data-app-theme="macos"] .sidebar-layout .purchase-stepper button {
  color: var(--cloud-accent-dark);
  background: var(--cloud-accent-soft);
}

html[data-app-theme="macos"] .sidebar-layout .popup-payment-view h2.payment-scan-title {
  color: var(--cloud-accent-dark);
}

html[data-app-theme="macos"] .sidebar-layout .alipay-payment-qr {
  border-color: var(--cloud-line);
  background: #fff;
  box-shadow: 0 9px 24px rgba(16, 24, 40, 0.08);
}

html[data-app-theme="macos"] .sidebar-layout :is(
  .batch-renewal-table thead,
  .batch-refund-table thead,
  .promotion-ledger-table thead
) {
  color: var(--cloud-muted);
  background: #f7f9fc;
}

html[data-app-theme="macos"] .sidebar-layout .btn-close {
  opacity: 0.58;
}

/* Responsive polish */
@media (max-width: 991.98px) {
  html[data-app-theme="macos"] body.sidebar-layout {
    background: var(--cloud-canvas);
  }

  html[data-app-theme="macos"] .sidebar-layout .mobile-topbar {
    border-color: var(--cloud-line);
    background: rgba(255, 255, 255, 0.94);
    box-shadow: 0 7px 22px rgba(16, 24, 40, 0.07);
    -webkit-backdrop-filter: blur(18px);
    backdrop-filter: blur(18px);
  }
}

@media (max-width: 767.98px) {
  html[data-app-theme="macos"] .sidebar-layout :is(
    .purchase-page-intro,
    .account-hero,
    .patrol-header
  ) {
    border-radius: 14px;
    background: #fff;
  }

  html[data-app-theme="macos"] .sidebar-layout .market-plan-footer {
    padding: 0.9rem;
  }

  html[data-app-theme="macos"] .sidebar-layout .market-spec-grid.hardware-list {
    margin-right: 0.9rem;
    margin-left: 0.9rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  html[data-app-theme="macos"] .sidebar-layout *,
  html[data-app-theme="macos"] .sidebar-layout *::before,
  html[data-app-theme="macos"] .sidebar-layout *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
  }
}

/* Day / night switch */
.sidebar-theme-control {
  flex: 0 0 auto;
  padding: 0.72rem 0.78rem 0.82rem;
  border-top: 1px solid var(--cloud-line, var(--theme-border));
}

.app-theme-toggle {
  display: grid;
  width: 100%;
  min-height: 52px;
  grid-template-columns: 34px minmax(0, 1fr) 38px;
  align-items: center;
  gap: 0.68rem;
  padding: 0.5rem 0.58rem;
  color: var(--cloud-ink-soft, var(--theme-text));
  border: 1px solid var(--cloud-line, var(--theme-border));
  border-radius: 12px;
  background: var(--cloud-panel, var(--theme-panel));
  box-shadow: none;
  text-align: left;
  transition:
    color 150ms ease,
    border-color 150ms ease,
    background-color 150ms ease;
}

.app-theme-toggle:hover {
  color: var(--cloud-ink, var(--theme-text));
  border-color: var(--cloud-line-strong, var(--theme-border-strong));
  background: var(--cloud-panel-soft, var(--theme-soft));
}

.app-theme-toggle:focus-visible {
  outline: 3px solid rgba(85, 145, 244, 0.2);
  outline-offset: 2px;
}

.app-theme-toggle-icon {
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  color: var(--cloud-accent, var(--theme-primary));
  border-radius: 10px;
  background: var(--cloud-accent-soft, var(--theme-soft));
}

.app-theme-toggle-icon svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.8;
}

.app-theme-toggle-icon .theme-sun-icon {
  display: none;
}

.app-theme-toggle-copy {
  min-width: 0;
}

.app-theme-toggle-copy strong,
.app-theme-toggle-copy small {
  display: block;
}

.app-theme-toggle-copy strong {
  color: inherit;
  font-size: 0.76rem;
  font-weight: 720;
}

.app-theme-toggle-copy small {
  overflow: hidden;
  margin-top: 0.08rem;
  color: var(--cloud-muted, var(--theme-muted));
  font-size: 0.61rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.app-theme-toggle-track {
  position: relative;
  width: 36px;
  height: 21px;
  border: 1px solid var(--cloud-line-strong, var(--theme-border-strong));
  border-radius: 999px;
  background: #e9edf3;
  transition: background-color 170ms ease;
}

.app-theme-toggle-track i {
  position: absolute;
  top: 2px;
  left: 2px;
  width: 15px;
  height: 15px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 1px 4px rgba(16, 24, 40, 0.22);
  transition: transform 170ms ease;
}

/* Night mode: deep blue-grey surfaces, restrained accents, never pure black. */
html[data-app-theme="dark"] {
  --theme-primary: #77aaff;
  --theme-primary-strong: #a8c7ff;
  --theme-primary-rgb: 119, 170, 255;
  --theme-soft: #172a46;
  --theme-soft-strong: #1e3557;
  --theme-canvas: #0d131d;
  --theme-canvas-alt: #111923;
  --theme-panel: #151e2a;
  --theme-panel-translucent: rgba(21, 30, 42, 0.96);
  --theme-sidebar-top: #111923;
  --theme-sidebar-bottom: #0d141e;
  --theme-border: #273447;
  --theme-border-strong: #3d5f8f;
  --theme-text: #e8eef7;
  --theme-muted: #96a3b6;
  --theme-ambient-one: rgba(69, 111, 190, 0.12);
  --theme-ambient-two: rgba(73, 143, 180, 0.07);
  --theme-shadow: rgba(0, 0, 0, 0.28);
  --theme-accent: #64d29a;
  --theme-accent-soft: #17372b;
  --theme-warm: #efb56f;
  --theme-warm-soft: #3b2c1c;
}

html[data-app-theme="dark"] body.sidebar-layout {
  --cloud-ink: #e8eef7;
  --cloud-ink-soft: #c5cfdd;
  --cloud-muted: #96a3b6;
  --cloud-faint: #718096;
  --cloud-line: #273447;
  --cloud-line-strong: #3b4d65;
  --cloud-canvas: #0d131d;
  --cloud-panel: #151e2a;
  --cloud-panel-soft: #111923;
  --cloud-accent: #77aaff;
  --cloud-accent-dark: #a8c7ff;
  --cloud-accent-soft: #172a46;
  --cloud-success: #65d49c;
  --cloud-success-soft: #17372b;
  --cloud-warning: #efb56f;
  --cloud-warning-soft: #3b2c1c;
  --cloud-danger: #ff8c91;
  --cloud-danger-soft: #402328;
  --cloud-shadow: 0 14px 38px rgba(0, 0, 0, 0.26);
  color: var(--cloud-ink);
  background:
    radial-gradient(circle at 98% 0, rgba(75, 122, 214, 0.11), transparent 32rem),
    radial-gradient(circle at 10% 96%, rgba(52, 113, 152, 0.06), transparent 28rem),
    linear-gradient(180deg, #101722 0%, var(--cloud-canvas) 100%);
}

html[data-app-theme="dark"] .sidebar-layout .app-sidebar {
  color: var(--cloud-ink);
  border-right-color: var(--cloud-line) !important;
  background: rgba(15, 23, 34, 0.97);
  box-shadow: 8px 0 28px rgba(0, 0, 0, 0.2);
  -webkit-backdrop-filter: blur(20px);
  backdrop-filter: blur(20px);
}

html[data-app-theme="dark"] .sidebar-layout :is(.sidebar-head, .sidebar-section-remote),
html[data-app-theme="dark"] .sidebar-theme-control {
  border-color: var(--cloud-line);
}

html[data-app-theme="dark"] .sidebar-layout .brand-mark {
  color: #fff;
  background: #4d83e6;
  box-shadow: 0 7px 17px rgba(54, 103, 195, 0.24);
}

html[data-app-theme="dark"] .sidebar-layout :is(
  .sidebar-brand strong,
  .sidebar-account strong,
  .mobile-brand,
  .mobile-brand strong
) {
  color: var(--cloud-ink);
}

html[data-app-theme="dark"] .sidebar-layout :is(
  .sidebar-brand small,
  .sidebar-account small,
  .sidebar-label,
  .sidebar-link small
) {
  color: var(--cloud-muted);
}

html[data-app-theme="dark"] .sidebar-layout .sidebar-user-card {
  border-color: var(--cloud-line);
  background: #151e2a;
  box-shadow: 0 7px 20px rgba(0, 0, 0, 0.16);
}

html[data-app-theme="dark"] .sidebar-layout .sidebar-link {
  color: var(--cloud-ink-soft);
}

html[data-app-theme="dark"] .sidebar-layout .sidebar-link:hover {
  color: var(--cloud-ink);
  border-color: transparent;
  background: #172131;
}

html[data-app-theme="dark"] .sidebar-layout .sidebar-link.active {
  color: #c2d8ff;
  border-color: #29456d;
  background: #172a46;
  box-shadow: none;
}

html[data-app-theme="dark"] .sidebar-layout .sidebar-link.active > i {
  background: var(--cloud-accent);
}

html[data-app-theme="dark"] .sidebar-layout .sidebar-link-icon,
html[data-app-theme="dark"] .sidebar-layout .sidebar-link.active .sidebar-link-icon,
html[data-app-theme="dark"] .sidebar-layout .sidebar-section-remote .sidebar-link-icon {
  color: var(--cloud-accent);
  background: transparent;
}

html[data-app-theme="dark"] .sidebar-theme-control {
  background: #0f1722;
}

html[data-app-theme="dark"] .app-theme-toggle {
  color: var(--cloud-ink-soft);
  border-color: var(--cloud-line);
  background: #151e2a;
}

html[data-app-theme="dark"] .app-theme-toggle:hover {
  color: var(--cloud-ink);
  border-color: var(--cloud-line-strong);
  background: #192434;
}

html[data-app-theme="dark"] .app-theme-toggle-icon {
  color: #f2c876;
  background: #382f20;
}

html[data-app-theme="dark"] .app-theme-toggle-icon .theme-moon-icon {
  display: none;
}

html[data-app-theme="dark"] .app-theme-toggle-icon .theme-sun-icon {
  display: block;
}

html[data-app-theme="dark"] .app-theme-toggle-track {
  border-color: #5478ad;
  background: #3c6fbd;
}

html[data-app-theme="dark"] .app-theme-toggle-track i {
  transform: translateX(15px);
}

html[data-app-theme="dark"] .sidebar-layout :is(
  .content-panel,
  .market-plan-card,
  .promotion-stat-card,
  .promotion-wallet-card,
  .promotion-ledger-panel,
  .promotion-share-panel,
  .promotion-rule-panel,
  .account-panel,
  .account-stat,
  .patrol-toolbar,
  .patrol-monitor,
  .support-workspace,
  .notification-card,
  .notification-toolbar,
  .notification-empty
) {
  color: var(--cloud-ink);
  border-color: var(--cloud-line);
  background: var(--cloud-panel);
  box-shadow: var(--cloud-shadow);
}

html[data-app-theme="dark"] .sidebar-layout :is(
  h1, h2, h3, h4, h5, h6,
  dt, label, legend,
  .text-dark, .text-body
) {
  color: var(--cloud-ink) !important;
}

html[data-app-theme="dark"] .sidebar-layout :is(
  .text-muted,
  .form-text,
  .purchase-intro-copy p,
  .account-identity-copy p,
  .support-page-heading p,
  .patrol-title-group p,
  .patrol-summary,
  .notification-card-copy
) {
  color: var(--cloud-muted) !important;
}

html[data-app-theme="dark"] .sidebar-layout :is(input, select, textarea, .form-control, .form-select, .input-group-text) {
  color: var(--cloud-ink);
  border-color: var(--cloud-line-strong);
  background-color: #101824;
}

html[data-app-theme="dark"] .sidebar-layout :is(input, textarea)::placeholder {
  color: #6f7d91;
}

html[data-app-theme="dark"] .sidebar-layout :is(input, select, textarea):focus {
  border-color: #638fda;
  background-color: #121d2b;
  box-shadow: 0 0 0 3px rgba(119, 170, 255, 0.13);
}

html[data-app-theme="dark"] .sidebar-layout :is(
  .btn-soft,
  .machine-more-button,
  .machine-batch-button,
  .patrol-tool-button,
  .mobile-menu-button,
  .account-hero-actions > button
) {
  color: var(--cloud-ink-soft);
  border-color: var(--cloud-line-strong);
  background: #172131;
  box-shadow: none;
}

html[data-app-theme="dark"] .sidebar-layout :is(
  .btn-soft,
  .machine-more-button,
  .machine-batch-button,
  .patrol-tool-button,
  .mobile-menu-button,
  .account-hero-actions > button
):hover {
  color: var(--cloud-ink);
  border-color: #4a6383;
  background: #1b2839;
}

html[data-app-theme="dark"] .sidebar-layout .dropdown-menu {
  color: var(--cloud-ink);
  border-color: var(--cloud-line-strong);
  background: #17212d;
  box-shadow: 0 18px 44px rgba(0, 0, 0, 0.38);
}

html[data-app-theme="dark"] .sidebar-layout .dropdown-item {
  color: var(--cloud-ink-soft);
}

html[data-app-theme="dark"] .sidebar-layout .dropdown-item:hover,
html[data-app-theme="dark"] .sidebar-layout .dropdown-item:focus {
  color: var(--cloud-ink);
  background: #203047;
}

/* Night mode · machine list */
html[data-app-theme="dark"] .sidebar-layout .content-panel:has(.machine-table-rows) {
  border: 0;
  background: transparent;
  box-shadow: none;
}

html[data-app-theme="dark"] .sidebar-layout :is(.machine-filter-bar, .machine-batch-bar) {
  border-color: var(--cloud-line);
  background: rgba(21, 30, 42, 0.94);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.16);
}

html[data-app-theme="dark"] .sidebar-layout .machine-filter {
  color: var(--cloud-muted);
}

html[data-app-theme="dark"] .sidebar-layout .machine-filter:hover {
  color: var(--cloud-ink-soft);
  background: #1b2839;
}

html[data-app-theme="dark"] .sidebar-layout .machine-filter.active {
  color: #bdd5ff;
  border-color: transparent;
  background: var(--cloud-accent-soft);
  box-shadow: none;
}

html[data-app-theme="dark"] .sidebar-layout .machine-remote-selector {
  color: var(--cloud-muted);
  border-color: var(--cloud-line);
  background: var(--cloud-panel);
}

html[data-app-theme="dark"] .sidebar-layout .machine-table-rows thead {
  color: var(--cloud-muted);
  background: transparent;
}

html[data-app-theme="dark"] .sidebar-layout .machine-table-rows tbody tr,
html[data-app-theme="dark"] .sidebar-layout .machine-card-row.is-offline {
  border-color: var(--cloud-line);
  background: var(--cloud-panel);
  box-shadow: 0 7px 22px rgba(0, 0, 0, 0.2);
}

html[data-app-theme="dark"] .sidebar-layout .machine-table-rows tbody tr:hover,
html[data-app-theme="dark"] .sidebar-layout .machine-table-rows tbody tr.row-selected {
  border-color: #3a5681;
  background: #182436;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.26);
}

html[data-app-theme="dark"] .sidebar-layout .machine-card-symbol {
  color: var(--cloud-accent);
  border-color: #29456d;
  background: var(--cloud-accent-soft);
}

html[data-app-theme="dark"] .sidebar-layout .machine-number,
html[data-app-theme="dark"] .sidebar-layout :is(
  .machine-configuration,
  .remaining-time strong,
  .server-room-name
) {
  color: var(--cloud-ink);
}

html[data-app-theme="dark"] .sidebar-layout .local-remark {
  color: var(--cloud-ink-soft);
  border-color: var(--cloud-line);
  background: #101824;
}

html[data-app-theme="dark"] .sidebar-layout .machine-support-button,
html[data-app-theme="dark"] .sidebar-layout .machine-card-actions-wrap .machine-connect-button {
  color: #b8d1ff !important;
  border-color: #314c75 !important;
  background: #17263d !important;
  box-shadow: none !important;
}

html[data-app-theme="dark"] .sidebar-layout .machine-support-button:hover,
html[data-app-theme="dark"] .sidebar-layout .machine-card-actions-wrap .machine-connect-button:hover {
  color: #d7e6ff !important;
  border-color: #4b6f9f !important;
  background: #1d3150 !important;
}

html[data-app-theme="dark"] .sidebar-layout .machine-new-badge {
  color: #bdd5ff;
  border-color: #34547e;
  background: #172a46;
}

/* Night mode · purchase */
html[data-app-theme="dark"] .sidebar-layout :is(
  .purchase-page-intro,
  .account-hero,
  .patrol-header,
  .promotion-wallet-card,
  .notification-hero
) {
  color: var(--cloud-ink);
  border-color: var(--cloud-line);
  background:
    radial-gradient(circle at 91% -10%, rgba(84, 137, 231, 0.14), transparent 45%),
    linear-gradient(120deg, #151e2a 0 70%, #17243a 100%);
  box-shadow: var(--cloud-shadow);
}

html[data-app-theme="dark"] .sidebar-layout .purchase-intro-eyebrow,
html[data-app-theme="dark"] .sidebar-layout .promotion-eyebrow,
html[data-app-theme="dark"] .sidebar-layout .account-kicker,
html[data-app-theme="dark"] .sidebar-layout .notification-kicker {
  color: var(--cloud-accent) !important;
}

html[data-app-theme="dark"] .sidebar-layout .purchase-intro-eyebrow i {
  background: var(--cloud-accent);
  box-shadow: 0 0 0 5px rgba(119, 170, 255, 0.12);
}

html[data-app-theme="dark"] .sidebar-layout .purchase-progress li > span {
  color: var(--cloud-muted);
  border-color: var(--cloud-line-strong);
  background: #151e2a;
}

html[data-app-theme="dark"] .sidebar-layout .purchase-progress li.active > span {
  color: #fff;
  border-color: #578cdf;
  background: #4d83e6;
}

html[data-app-theme="dark"] .sidebar-layout .purchase-room-picker {
  border-color: var(--cloud-line);
  background: var(--cloud-panel);
  box-shadow: var(--cloud-shadow);
}

html[data-app-theme="dark"] .sidebar-layout :is(
  .purchase-section-title > span,
  .purchase-catalog-title > span,
  .purchase-room-total,
  .purchase-room-selected
) {
  color: #bdd5ff !important;
  border-color: #29456d !important;
  background: var(--cloud-accent-soft) !important;
}

html[data-app-theme="dark"] .sidebar-layout .purchase-room-total b {
  color: #d3e3ff !important;
}

html[data-app-theme="dark"] .sidebar-layout .purchase-room-picker .purchase-room-track .server-room-option {
  color: var(--cloud-ink-soft) !important;
  border-color: var(--cloud-line);
  background: #121b27;
  box-shadow: none;
}

html[data-app-theme="dark"] .sidebar-layout .purchase-room-picker .purchase-room-track .server-room-option:hover {
  border-color: #405675;
  background: #172334;
}

html[data-app-theme="dark"] .sidebar-layout .purchase-room-picker .purchase-room-track .server-room-option.active {
  color: var(--cloud-ink) !important;
  border-color: #5477aa;
  background: #172a46;
  box-shadow: inset 0 0 0 1px rgba(119, 170, 255, 0.07);
}

html[data-app-theme="dark"] .sidebar-layout .purchase-room-picker .server-room-option :is(
  strong,
  b,
  .market-room-card-identity strong
) {
  color: var(--cloud-ink) !important;
}

html[data-app-theme="dark"] .sidebar-layout .purchase-room-picker .server-room-option :is(
  small,
  p,
  .market-room-card-description
) {
  color: var(--cloud-muted) !important;
}

html[data-app-theme="dark"] .sidebar-layout .purchase-room-machine-prefix b {
  color: var(--cloud-ink-soft) !important;
  border-color: var(--cloud-line) !important;
  background: #101824 !important;
}

html[data-app-theme="dark"] .sidebar-layout .market-catalog-heading {
  color: var(--cloud-ink) !important;
  border-color: var(--cloud-line) !important;
  background: rgba(21, 30, 42, 0.88) !important;
}

html[data-app-theme="dark"] .sidebar-layout .market-available-total.has-stock {
  color: #87dfb0 !important;
  border-color: #285840 !important;
  background: var(--cloud-success-soft) !important;
}

html[data-app-theme="dark"] .sidebar-layout .market-plan-card {
  border-color: var(--cloud-line);
  background: var(--cloud-panel);
  box-shadow: var(--cloud-shadow);
}

html[data-app-theme="dark"] .sidebar-layout .market-plan-card:hover,
html[data-app-theme="dark"] .sidebar-layout .market-plan-card.market-plan-featured {
  border-color: #3d506a;
  background: #172230;
  box-shadow: 0 17px 42px rgba(0, 0, 0, 0.32);
}

html[data-app-theme="dark"] .sidebar-layout .purchase-plan-icon {
  color: var(--cloud-accent) !important;
  border-color: #29456d !important;
  background: var(--cloud-accent-soft) !important;
}

html[data-app-theme="dark"] .sidebar-layout .market-plan-identity h2,
html[data-app-theme="dark"] .sidebar-layout :is(
  .duration-option-heading strong,
  .duration-option-amount b,
  .market-action-stock strong,
  .market-action-stock b
) {
  color: var(--cloud-ink);
}

html[data-app-theme="dark"] .sidebar-layout .market-plan-identity > small,
html[data-app-theme="dark"] .sidebar-layout .market-pricing-title small,
html[data-app-theme="dark"] .sidebar-layout .duration-option-heading em,
html[data-app-theme="dark"] .sidebar-layout .duration-option-amount :is(small, em),
html[data-app-theme="dark"] .sidebar-layout .market-action-stock {
  color: var(--cloud-muted);
}

html[data-app-theme="dark"] .sidebar-layout .market-recommend {
  color: #f4c68c;
  border-color: #5b4228;
  background: var(--cloud-warning-soft);
}

html[data-app-theme="dark"] .sidebar-layout .market-spec-grid.hardware-list {
  border: 0;
  background: #101824;
}

html[data-app-theme="dark"] .sidebar-layout .market-spec-grid.hardware-list > div {
  border-color: var(--cloud-line);
}

html[data-app-theme="dark"] .sidebar-layout .hardware-mark {
  color: var(--cloud-muted) !important;
  border: 0 !important;
  background: #1b2634 !important;
}

html[data-app-theme="dark"] .sidebar-layout .market-plan-footer {
  border-color: var(--cloud-line);
  background: var(--cloud-panel);
}

html[data-app-theme="dark"] .sidebar-layout .market-duration-area .duration-selector {
  border-color: var(--cloud-line);
  background: #101824;
}

html[data-app-theme="dark"] .sidebar-layout .market-duration-area .duration-option {
  color: var(--cloud-ink);
  border-color: #29374a;
  background: #151e2a;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.16);
}

html[data-app-theme="dark"] .sidebar-layout .market-duration-area .duration-option:hover {
  border-color: #45618a;
  background: #18263a;
}

html[data-app-theme="dark"] .sidebar-layout .market-duration-area .duration-option.active,
html[data-app-theme="dark"] .sidebar-layout .market-duration-area .duration-option.active:hover {
  border-color: #5c82ba !important;
  background: #172a46 !important;
  box-shadow: 0 5px 14px rgba(0, 0, 0, 0.22);
}

html[data-app-theme="dark"] .sidebar-layout .market-duration-area .duration-option.active::after {
  background: var(--cloud-accent) !important;
}

html[data-app-theme="dark"] .sidebar-layout .market-duration-area .duration-option.active .duration-option-heading strong {
  color: #e9f1ff !important;
}

html[data-app-theme="dark"] .sidebar-layout .market-duration-area .duration-option.active .duration-option-heading em {
  color: #bdd5ff !important;
  background: #1a3559 !important;
}

html[data-app-theme="dark"] .sidebar-layout .market-select-button.purchase-now-button:not(:disabled) {
  color: var(--cloud-ink);
  border-color: #476b9e;
  background:
    radial-gradient(circle at 88% 0%, rgba(119, 170, 255, 0.2), transparent 46%),
    linear-gradient(135deg, #17283f 0%, #1b3353 100%);
  box-shadow:
    inset 4px 0 0 var(--cloud-accent),
    inset 0 1px 0 rgba(255, 255, 255, 0.05),
    0 9px 22px rgba(0, 0, 0, 0.26);
}

html[data-app-theme="dark"] .sidebar-layout .market-select-button.purchase-now-button:not(:disabled):hover {
  color: #fff;
  border-color: #6288bd;
  background:
    radial-gradient(circle at 88% 0%, rgba(119, 170, 255, 0.25), transparent 48%),
    linear-gradient(135deg, #1a2e49 0%, #20406a 100%);
  box-shadow:
    inset 4px 0 0 #91baff,
    0 12px 26px rgba(0, 0, 0, 0.3);
}

html[data-app-theme="dark"] .sidebar-layout .market-select-button.purchase-now-button .purchase-button-label strong {
  color: var(--cloud-ink);
}

html[data-app-theme="dark"] .sidebar-layout .market-select-button.purchase-now-button:not(:disabled) :is(
  .purchase-button-label small,
  .purchase-button-price small
) {
  color: #9dafc5;
}

html[data-app-theme="dark"] .sidebar-layout .market-select-button.purchase-now-button:not(:disabled) .purchase-button-price {
  border: 0;
  background: transparent;
}

html[data-app-theme="dark"] .sidebar-layout .market-select-button.purchase-now-button:not(:disabled) .purchase-button-price strong {
  color: #bcd4ff;
}

html[data-app-theme="dark"] .sidebar-layout .market-select-button.purchase-now-button > svg {
  color: #fff !important;
  border-color: #77aaff !important;
  background: #5d8fe7 !important;
  stroke: #fff !important;
}

html[data-app-theme="dark"] .sidebar-layout .market-select-button.purchase-now-button:disabled {
  border-color: var(--cloud-line);
  background: #121a25;
}

/* Night mode · account, promotion, patrol, support and notifications */
html[data-app-theme="dark"] .sidebar-layout :is(
  .account-profile-group,
  .account-profile-row,
  .promotion-balance-stat,
  .promotion-fee-summary,
  .promotion-heading-badges > *,
  .account-badges > span,
  .account-application-item
) {
  color: var(--cloud-ink);
  border-color: var(--cloud-line);
  background: #111a26;
}

html[data-app-theme="dark"] .sidebar-layout .account-badges > .is-ready {
  color: #82dda9;
  border-color: #285840;
  background: var(--cloud-success-soft);
}

html[data-app-theme="dark"] .sidebar-layout :is(
  .account-profile-group-icon,
  .account-orders-modal-icon,
  .account-stat-icon.is-violet,
  .promotion-stat-icon,
  .promotion-wallet-icon,
  .promotion-rule-icon,
  .patrol-title-icon,
  .support-heading-icon,
  .notification-type-icon
) {
  color: var(--cloud-accent) !important;
  border-color: #29456d !important;
  background: var(--cloud-accent-soft) !important;
}

html[data-app-theme="dark"] .sidebar-layout :is(
  .promotion-ledger-table,
  .batch-renewal-table,
  .batch-refund-table,
  .table
) {
  --bs-table-color: var(--cloud-ink-soft);
  --bs-table-bg: transparent;
  --bs-table-border-color: var(--cloud-line);
  --bs-table-hover-color: var(--cloud-ink);
  --bs-table-hover-bg: #182436;
  color: var(--cloud-ink-soft);
}

html[data-app-theme="dark"] .sidebar-layout :is(
  .promotion-ledger-table thead,
  .batch-renewal-table thead,
  .batch-refund-table thead
) {
  color: var(--cloud-muted);
  background: #111923;
}

html[data-app-theme="dark"] .sidebar-layout :is(
  .patrol-layout-switch,
  .patrol-monitor-topbar,
  .patrol-preview-header
) {
  color: var(--cloud-ink-soft);
  border-color: var(--cloud-line);
  background: #111923;
}

html[data-app-theme="dark"] .sidebar-layout .patrol-layout-button {
  color: var(--cloud-muted);
}

html[data-app-theme="dark"] .sidebar-layout .patrol-layout-button.active {
  color: var(--cloud-ink) !important;
  border-color: #354a68 !important;
  background: #1b2c45 !important;
  box-shadow: none !important;
}

html[data-app-theme="dark"] .sidebar-layout .patrol-card {
  border-color: var(--cloud-line);
  background: var(--cloud-panel);
  box-shadow: 0 7px 22px rgba(0, 0, 0, 0.22);
}

html[data-app-theme="dark"] .sidebar-layout .patrol-card:hover {
  border-color: #405675;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.3);
}

html[data-app-theme="dark"] .sidebar-layout .support-workspace {
  background: var(--cloud-panel);
}

html[data-app-theme="dark"] .sidebar-layout :is(
  .support-inbox,
  .support-chat-panel,
  .support-composer,
  .support-complaint-entry,
  .support-conversation-search
) {
  border-color: var(--cloud-line);
  background: #111923;
}

html[data-app-theme="dark"] .sidebar-layout .support-chat-panel {
  background: #0f1722;
}

html[data-app-theme="dark"] .sidebar-layout .support-conversation:hover,
html[data-app-theme="dark"] .sidebar-layout .support-conversation.active {
  border-color: #354f76;
  background: var(--cloud-accent-soft);
}

html[data-app-theme="dark"] .sidebar-layout .support-conversation.active {
  box-shadow: inset 3px 0 0 var(--cloud-accent);
}

html[data-app-theme="dark"] .sidebar-layout .support-composer-box {
  border-color: var(--cloud-line);
  background: #101824;
}

html[data-app-theme="dark"] .sidebar-layout .notification-card.is-unread {
  border-color: #38577f;
  background: #17243a;
}

html[data-app-theme="dark"] .sidebar-layout .notification-filters {
  border-color: var(--cloud-line);
  background: #111923;
}

/* Night mode · dialogs, payment and order sheets */
html[data-app-theme="dark"] .sidebar-layout :is(
  .modal-content,
  .custom-modal,
  .purchase-confirm-modal,
  .renewal-dialog,
  .batch-renewal-dialog,
  .refund-dialog,
  .batch-refund-dialog,
  .batch-remark-dialog,
  .machine-command-dialog,
  .account-orders-dialog,
  .account-applications-dialog
) {
  color: var(--cloud-ink);
  border-color: var(--cloud-line-strong);
  background: #151e2a;
  box-shadow: 0 28px 78px rgba(0, 0, 0, 0.48);
}

html[data-app-theme="dark"] .sidebar-layout :is(.modal-header, .modal-footer),
html[data-app-theme="dark"] .sidebar-layout .purchase-confirm-modal > .modal-header {
  border-color: var(--cloud-line);
  background: #111923;
}

html[data-app-theme="dark"] .sidebar-layout :is(
  .confirm-plan-title,
  .purchase-count-field,
  .purchase-choice-summary,
  .batch-renewal-table-wrap,
  .batch-refund-table-wrap,
  .batch-refund-result-table-wrap,
  .batch-renewal-total-panel,
  .batch-refund-overview,
  .batch-refund-manual-form,
  .refund-summary,
  .refund-calculation,
  .payment-order-summary
) {
  color: var(--cloud-ink);
  border-color: var(--cloud-line);
  background: #101824;
}

html[data-app-theme="dark"] .sidebar-layout .purchase-stepper button {
  color: #bdd5ff;
  background: var(--cloud-accent-soft);
}

html[data-app-theme="dark"] .sidebar-layout .popup-payment-view h2.payment-scan-title {
  color: #bcd4ff;
}

html[data-app-theme="dark"] .sidebar-layout .alipay-payment-qr {
  border-color: #536174;
  background: #fff;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.32);
}

html[data-app-theme="dark"] .sidebar-layout .btn-close {
  filter: invert(1) grayscale(1);
  opacity: 0.72;
}

html[data-app-theme="dark"] .sidebar-layout .app-footer {
  color: var(--cloud-muted);
  border-color: var(--cloud-line);
}

@media (max-width: 991.98px) {
  html[data-app-theme="dark"] .sidebar-layout .mobile-topbar {
    color: var(--cloud-ink);
    border-color: var(--cloud-line);
    background: rgba(15, 23, 34, 0.96);
    box-shadow: 0 7px 22px rgba(0, 0, 0, 0.28);
    -webkit-backdrop-filter: blur(18px);
    backdrop-filter: blur(18px);
  }
}

@media (prefers-reduced-motion: reduce) {
  .sidebar-layout *,
  .sidebar-layout *::before,
  .sidebar-layout *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
  }
}

/*
 * Night mode detailed page pass
 * Legacy pages use a number of high-specificity white surfaces. Keep the
 * visual hierarchy and status colours, but move every surrounding surface
 * into the same blue-grey night palette.
 */
html[data-app-theme="dark"] body.sidebar-layout {
  color-scheme: dark;
  scrollbar-color: #3b4c64 transparent;
}

html[data-app-theme="dark"] body.sidebar-layout ::-webkit-scrollbar-track {
  background: transparent;
}

html[data-app-theme="dark"] body.sidebar-layout ::-webkit-scrollbar-thumb {
  border: 2px solid transparent;
  border-radius: 999px;
  background: #3b4c64;
  background-clip: padding-box;
}

html[data-app-theme="dark"] body.sidebar-layout .app-footer {
  color: var(--cloud-muted) !important;
  border-top: 1px solid var(--cloud-line) !important;
  background: #0f1722 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .sidebar-logout {
  color: #c7d1de !important;
  border-color: var(--cloud-line) !important;
  background: #172131 !important;
  box-shadow: none !important;
}

html[data-app-theme="dark"] body.sidebar-layout .sidebar-logout:hover {
  color: #fff !important;
  border-color: #4a6383 !important;
  background: #1c2a3c !important;
}

html[data-app-theme="dark"] body.sidebar-layout .account-avatar-unbound {
  color: #a7b4c5 !important;
  border-color: #334158 !important;
  background: #1a2534 !important;
}

/* Machine list */
html[data-app-theme="dark"] body.sidebar-layout .machine-search {
  color: var(--cloud-ink-soft) !important;
  border-color: var(--cloud-line) !important;
  background: #101824 !important;
  box-shadow: none !important;
}

html[data-app-theme="dark"] body.sidebar-layout .machine-search:focus-within {
  border-color: #5278ad !important;
  background: #121d2b !important;
  box-shadow: 0 0 0 3px rgba(119, 170, 255, 0.1) !important;
}

html[data-app-theme="dark"] body.sidebar-layout .machine-search :is(svg, kbd) {
  color: var(--cloud-muted) !important;
}

html[data-app-theme="dark"] body.sidebar-layout .machine-search kbd {
  border-color: var(--cloud-line) !important;
  background: #1a2636 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .empty-state {
  color: var(--cloud-muted);
  border-color: var(--cloud-line);
  background: var(--cloud-panel);
}

html[data-app-theme="dark"] body.sidebar-layout .empty-state .btn-brand {
  color: #d8e7ff;
  border-color: #416392;
  background: #1a3151;
  box-shadow: none;
}

html[data-app-theme="dark"] body.sidebar-layout :is(
  .machine-table-rows th,
  .machine-table-rows td,
  .machine-card-row,
  .machine-card-main
) {
  border-color: var(--cloud-line);
}

html[data-app-theme="dark"] body.sidebar-layout :is(
  .machine-package-tag,
  .machine-room-badge,
  .machine-status-badge,
  .remaining-time-badge
) {
  border-color: #34455d;
  background: #192536;
}

/* Purchase catalogue and purchase gate */
html[data-app-theme="dark"] body.sidebar-layout .market-duration-area .duration-option .duration-option-heading em {
  color: #aab8cb !important;
  border-color: #324158 !important;
  background: #1b2737 !important;
}

html[data-app-theme="dark"] body.sidebar-layout :is(
  .market-action-stock,
  .purchase-help-strip
) {
  color: var(--cloud-muted) !important;
  border-color: var(--cloud-line) !important;
  background: #111923 !important;
  box-shadow: none !important;
}

html[data-app-theme="dark"] body.sidebar-layout .purchase-help-strip :is(strong, h2) {
  color: var(--cloud-ink) !important;
}

html[data-app-theme="dark"] body.sidebar-layout .purchase-help-strip :is(small, p) {
  color: var(--cloud-muted) !important;
}

html[data-app-theme="dark"] body.sidebar-layout .purchase-help-icon {
  color: #bcd4ff !important;
  border-color: #2e4c74 !important;
  background: #172a46 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .phone-binding-modal {
  color: var(--cloud-ink);
  border: 1px solid var(--cloud-line-strong);
  background: var(--cloud-panel);
}

html[data-app-theme="dark"] body.sidebar-layout .phone-binding-modal .modal-header {
  border-color: var(--cloud-line) !important;
  background:
    radial-gradient(circle at 90% 0, rgba(89, 137, 223, 0.12), transparent 42%),
    #151e2a !important;
}

html[data-app-theme="dark"] body.sidebar-layout .phone-modal-heading :is(h2, p),
html[data-app-theme="dark"] body.sidebar-layout .phone-field-label {
  color: var(--cloud-ink) !important;
}

html[data-app-theme="dark"] body.sidebar-layout .phone-modal-heading p,
html[data-app-theme="dark"] body.sidebar-layout .phone-security-note {
  color: var(--cloud-muted) !important;
}

html[data-app-theme="dark"] body.sidebar-layout :is(.phone-input-shell, .phone-code-row) {
  border-color: var(--cloud-line-strong) !important;
  background: #101824 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .phone-input-shell > span {
  color: var(--cloud-muted) !important;
  border-color: var(--cloud-line) !important;
  background: #172131 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .phone-code-row button {
  color: #bdd5ff !important;
  background: #1a2c47 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .phone-code-row button:disabled {
  color: #718096 !important;
  background: #182230 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .phone-modal-cancel {
  color: var(--cloud-ink-soft) !important;
  border-color: var(--cloud-line-strong) !important;
  background: #172131 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .purchase-gate-progress {
  color: var(--cloud-muted) !important;
  border-color: var(--cloud-line) !important;
  background:
    radial-gradient(circle at 12% 0, rgba(119, 170, 255, 0.1), transparent 38%),
    #111923 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .purchase-gate-progress > span > b {
  color: #aab8cb !important;
  border-color: #3a4d67 !important;
  background: #1b2737 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .purchase-gate-progress > i {
  background: #35445a !important;
}

/* Profile and account details */
html[data-app-theme="dark"] body.sidebar-layout .account-stats article {
  color: var(--cloud-ink);
  border-color: var(--cloud-line) !important;
  background: var(--cloud-panel) !important;
  box-shadow: var(--cloud-shadow) !important;
}

html[data-app-theme="dark"] body.sidebar-layout .account-stats :is(strong, small, em) {
  color: var(--cloud-ink) !important;
}

html[data-app-theme="dark"] body.sidebar-layout .account-stats :is(small, em) {
  color: var(--cloud-muted) !important;
}

html[data-app-theme="dark"] body.sidebar-layout .account-stat-icon {
  color: #a9c7ff !important;
  background: #1a2b46 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .account-stat-icon.is-green {
  color: #7ed9a6 !important;
  background: #17372b !important;
}

html[data-app-theme="dark"] body.sidebar-layout :is(
  .account-profile-layout,
  .account-profile-group,
  .account-profile-row,
  .account-info-grid > article
) {
  color: var(--cloud-ink) !important;
  border-color: var(--cloud-line) !important;
  background: #111923 !important;
}

html[data-app-theme="dark"] body.sidebar-layout :is(
  .account-profile-group-heading,
  .account-panel-heading
) {
  color: var(--cloud-ink) !important;
  border-color: var(--cloud-line) !important;
  background: #151e2a !important;
}

html[data-app-theme="dark"] body.sidebar-layout :is(
  .account-profile-row strong,
  .account-profile-row b,
  .account-profile-group-heading strong,
  .account-info-grid article > strong,
  .account-panel-heading h2
) {
  color: var(--cloud-ink) !important;
}

html[data-app-theme="dark"] body.sidebar-layout :is(
  .account-profile-row small,
  .account-profile-row span,
  .account-profile-group-heading small,
  .account-info-grid article > span,
  .account-info-grid article > small,
  .account-panel-heading p
) {
  color: var(--cloud-muted) !important;
}

html[data-app-theme="dark"] body.sidebar-layout .account-online-pill {
  color: #82dda9 !important;
  border-color: #285840 !important;
  background: #17372b !important;
}

html[data-app-theme="dark"] body.sidebar-layout .account-wechat-action {
  color: #bcd4ff !important;
  border-color: #39577e !important;
  background: #172a46 !important;
}

/* My orders and applications */
html[data-app-theme="dark"] body.sidebar-layout :is(
  .account-orders-modal,
  .account-applications-modal
) {
  color: var(--cloud-ink) !important;
  border-color: var(--cloud-line-strong) !important;
  background: #0f1722 !important;
}

html[data-app-theme="dark"] body.sidebar-layout :is(
  .account-orders-modal-header,
  .account-applications-header
) {
  color: var(--cloud-ink) !important;
  border-color: var(--cloud-line) !important;
  background:
    radial-gradient(circle at 100% 0, rgba(119, 170, 255, 0.1), transparent 40%),
    #151e2a !important;
}

html[data-app-theme="dark"] body.sidebar-layout :is(
  .account-orders-modal-title h2,
  .account-applications-header h2
) {
  color: var(--cloud-ink) !important;
}

html[data-app-theme="dark"] body.sidebar-layout :is(
  .account-orders-modal-title p,
  .account-applications-header p,
  .account-orders-limit-note
) {
  color: var(--cloud-muted) !important;
}

html[data-app-theme="dark"] body.sidebar-layout .account-orders-close {
  color: var(--cloud-ink-soft) !important;
  border-color: var(--cloud-line-strong) !important;
  background: #1a2636 !important;
}

html[data-app-theme="dark"] body.sidebar-layout :is(
  .account-orders-modal-body,
  .account-applications-body
) {
  background: #0f1722 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .account-order-filters {
  border-color: var(--cloud-line) !important;
  background: #111923 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .account-order-filters a {
  color: var(--cloud-muted) !important;
  border-color: transparent !important;
  background: transparent !important;
}

html[data-app-theme="dark"] body.sidebar-layout .account-order-filters a:hover {
  color: var(--cloud-ink-soft) !important;
  background: #1b2839 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .account-order-filters a.active {
  color: #c8dcff !important;
  border-color: #35517a !important;
  background: #172a46 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .order-center-item {
  color: var(--cloud-ink);
  border-color: var(--cloud-line) !important;
  background: #151e2a !important;
  box-shadow: 0 7px 22px rgba(0, 0, 0, 0.22) !important;
}

html[data-app-theme="dark"] body.sidebar-layout :is(
  .order-center-item-header,
  .order-center-item-footer,
  .order-center-refund-parts-heading
) {
  border-color: var(--cloud-line) !important;
  background: #111923 !important;
}

html[data-app-theme="dark"] body.sidebar-layout :is(
  .order-center-kind strong,
  .order-center-number strong,
  .order-center-title strong,
  .order-center-refund-summary strong,
  .order-center-metrics strong,
  .order-center-expiry strong,
  .order-center-refund-parts-heading strong,
  .order-center-refund-parts-list article > div strong
) {
  color: var(--cloud-ink) !important;
}

html[data-app-theme="dark"] body.sidebar-layout :is(
  .order-center-kind time,
  .order-center-number > span,
  .order-center-title small,
  .order-center-title span,
  .order-center-refund-summary small,
  .order-center-refund-summary span,
  .order-center-metrics span,
  .order-center-expiry span,
  .order-center-item-footer > span
) {
  color: var(--cloud-muted) !important;
}

html[data-app-theme="dark"] body.sidebar-layout :is(
  .order-center-metrics > div,
  .order-center-machines,
  .order-center-expiry,
  .order-center-refund-parts,
  .order-center-refund-parts-list article,
  .account-orders-modal-title p i
) {
  color: var(--cloud-ink-soft) !important;
  border-color: var(--cloud-line) !important;
  background: #101824 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .order-center-calculation {
  color: #9eddbb !important;
  border-color: #285840 !important;
  background: #132a23 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .order-center-calculation :is(span, p) {
  color: #9eddbb !important;
}

html[data-app-theme="dark"] body.sidebar-layout :is(
  .order-center-item-footer a,
  .order-center-pagination a
) {
  color: var(--cloud-ink-soft) !important;
  border-color: var(--cloud-line-strong) !important;
  background: #172131 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .order-center-item-footer a.is-support {
  color: #bdd5ff !important;
  border-color: #35517a !important;
  background: #172a46 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .account-application-item {
  border-color: var(--cloud-line) !important;
  background: #151e2a !important;
}

html[data-app-theme="dark"] body.sidebar-layout .account-application-empty :is(strong, h3) {
  color: var(--cloud-ink) !important;
}

html[data-app-theme="dark"] body.sidebar-layout .account-application-empty :is(span, p) {
  color: var(--cloud-muted) !important;
}

/* Promotion */
html[data-app-theme="dark"] body.sidebar-layout .promotion-heading {
  color: var(--cloud-ink) !important;
  border-color: var(--cloud-line) !important;
  background:
    radial-gradient(circle at 92% 0, rgba(119, 170, 255, 0.12), transparent 42%),
    linear-gradient(135deg, #151e2a, #17243a) !important;
  box-shadow: var(--cloud-shadow) !important;
}

html[data-app-theme="dark"] body.sidebar-layout .promotion-heading :is(h1, p) {
  color: var(--cloud-ink) !important;
}

html[data-app-theme="dark"] body.sidebar-layout .promotion-heading p {
  color: var(--cloud-muted) !important;
}

html[data-app-theme="dark"] body.sidebar-layout :is(
  .promotion-rule-heading,
  .promotion-ledger-heading,
  .promotion-room-heading
) {
  color: var(--cloud-ink) !important;
  border-color: var(--cloud-line) !important;
  background: #111923 !important;
}

html[data-app-theme="dark"] body.sidebar-layout :is(
  .promotion-stat-copy strong,
  .promotion-stat-copy b,
  .promotion-stat-copy h2,
  .promotion-ledger-heading h2,
  .promotion-link-column h2,
  .promotion-qr-column > strong
) {
  color: var(--cloud-ink) !important;
}

html[data-app-theme="dark"] body.sidebar-layout :is(
  .promotion-stat-copy small,
  .promotion-stat-copy span,
  .promotion-ledger-heading p,
  .promotion-link-column > p,
  .promotion-qr-column > p
) {
  color: var(--cloud-muted) !important;
}

html[data-app-theme="dark"] body.sidebar-layout :is(
  .promotion-payout-empty,
  .promotion-withdrawal-overview,
  .promotion-withdrawal-empty,
  .promotion-ledger-empty,
  .promotion-settlement-note
) {
  color: var(--cloud-muted) !important;
  border-color: var(--cloud-line) !important;
  background: #111923 !important;
}

html[data-app-theme="dark"] body.sidebar-layout :is(
  .promotion-payout-empty strong,
  .promotion-withdrawal-empty strong,
  .promotion-ledger-empty strong
) {
  color: var(--cloud-ink) !important;
}

html[data-app-theme="dark"] body.sidebar-layout :is(
  .promotion-record-entry,
  .promotion-withdrawal-history,
  .promotion-room-card
) {
  color: var(--cloud-ink) !important;
  border-color: var(--cloud-line) !important;
  background: #151e2a !important;
  box-shadow: none !important;
}

html[data-app-theme="dark"] body.sidebar-layout .promotion-record-entry-icon,
html[data-app-theme="dark"] body.sidebar-layout .promotion-record-entry > i {
  color: #bcd4ff !important;
  border-color: #2f4c72 !important;
  background: #172a46 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .promotion-share-panel {
  border-color: var(--cloud-line) !important;
  background: var(--cloud-panel) !important;
}

html[data-app-theme="dark"] body.sidebar-layout .promotion-qr-column {
  border-color: var(--cloud-line) !important;
  background: #111923 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .promotion-qr-frame {
  border-color: #667386 !important;
  background: #fff !important;
}

html[data-app-theme="dark"] body.sidebar-layout .promotion-download-button {
  color: #bdd5ff !important;
  border-color: #3a587f !important;
  background: #172a46 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .promotion-url-box {
  border-color: var(--cloud-line-strong) !important;
  background: #101824 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .promotion-url-box input {
  color: var(--cloud-ink-soft) !important;
  background: transparent !important;
}

html[data-app-theme="dark"] body.sidebar-layout :is(
  .promotion-ledger-table th,
  .promotion-pagination,
  .promotion-record-pagination
) {
  border-color: var(--cloud-line) !important;
  background: #111923 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .promotion-ledger-table td {
  color: var(--cloud-ink-soft) !important;
  border-color: var(--cloud-line) !important;
}

html[data-app-theme="dark"] body.sidebar-layout .promotion-ledger-table tbody tr:hover {
  background: #182436 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .promotion-pagination :is(a, span:not(.promotion-pagination-ellipsis)),
html[data-app-theme="dark"] body.sidebar-layout .promotion-record-pagination button {
  color: var(--cloud-ink-soft) !important;
  border-color: var(--cloud-line) !important;
  background: #172131 !important;
}

/* Promotion dialogs and record browser */
html[data-app-theme="dark"] body.sidebar-layout .promotion-modal-card {
  color: var(--cloud-ink) !important;
  border-color: var(--cloud-line-strong) !important;
  background: #151e2a !important;
  box-shadow: 0 28px 80px rgba(0, 0, 0, 0.5) !important;
}

html[data-app-theme="dark"] body.sidebar-layout .promotion-modal-close {
  color: var(--cloud-ink-soft) !important;
  border-color: var(--cloud-line-strong) !important;
  background: #1a2636 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .promotion-modal-card > h2,
html[data-app-theme="dark"] body.sidebar-layout .promotion-modal-card label > span {
  color: var(--cloud-ink) !important;
}

html[data-app-theme="dark"] body.sidebar-layout .promotion-modal-card > p,
html[data-app-theme="dark"] body.sidebar-layout .promotion-modal-card label > small {
  color: var(--cloud-muted) !important;
}

html[data-app-theme="dark"] body.sidebar-layout :is(
  .promotion-modal-balance,
  .promotion-modal-recipient,
  .promotion-fee-summary,
  .promotion-customer-search,
  .promotion-record-item,
  .promotion-withdrawal-detail-summary,
  .promotion-withdrawal-detail-section
) {
  color: var(--cloud-ink) !important;
  border-color: var(--cloud-line) !important;
  background: #101824 !important;
}

html[data-app-theme="dark"] body.sidebar-layout :is(
  .promotion-record-modal-header,
  .promotion-withdrawal-detail-header,
  .promotion-customer-filter
) {
  color: var(--cloud-ink) !important;
  border-color: var(--cloud-line) !important;
  background: #111923 !important;
}

html[data-app-theme="dark"] body.sidebar-layout :is(
  .promotion-record-modal-body,
  .promotion-withdrawal-detail-content
) {
  background: #0f1722 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .promotion-customer-filter :is(select, button) {
  color: var(--cloud-ink-soft) !important;
  border-color: var(--cloud-line-strong) !important;
  background: #172131 !important;
}

html[data-app-theme="dark"] body.sidebar-layout :is(
  .promotion-record-meta > span,
  .promotion-customer-consumption-grid > span,
  .promotion-record-note
) {
  color: var(--cloud-muted) !important;
  border-color: var(--cloud-line) !important;
  background: #111923 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .promotion-withdrawal-note {
  color: #eac58e !important;
  background: #302719 !important;
}

/* Customer support */
html[data-app-theme="dark"] body.sidebar-layout .support-page-heading {
  color: var(--cloud-ink) !important;
  border-color: var(--cloud-line) !important;
  background:
    radial-gradient(circle at 92% 0, rgba(119, 170, 255, 0.12), transparent 42%),
    linear-gradient(135deg, #151e2a, #17243a) !important;
  box-shadow: var(--cloud-shadow) !important;
}

html[data-app-theme="dark"] body.sidebar-layout .support-page-heading h1 {
  color: var(--cloud-ink) !important;
}

html[data-app-theme="dark"] body.sidebar-layout .service-center-tabs {
  border-color: var(--cloud-line) !important;
  background: #111923 !important;
  box-shadow: var(--cloud-shadow) !important;
}

html[data-app-theme="dark"] body.sidebar-layout .service-center-tabs > a {
  color: var(--cloud-muted) !important;
}

html[data-app-theme="dark"] body.sidebar-layout .service-center-tabs > a.active {
  color: #bcd4ff !important;
  border-color: #2e4b72 !important;
  background: #172a46 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .service-center-tabs small {
  color: var(--cloud-muted) !important;
}

html[data-app-theme="dark"] body.sidebar-layout .service-center-tab-icon {
  background: #1b2737 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .support-customer-chip {
  color: var(--cloud-ink) !important;
  border-color: var(--cloud-line) !important;
  background: #111923 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .support-customer-chip :is(strong, small) {
  color: var(--cloud-ink-soft) !important;
}

html[data-app-theme="dark"] body.sidebar-layout :is(
  .support-new-button,
  .support-copy-machine,
  .support-refresh-button,
  .support-quick-topics > button
) {
  color: var(--cloud-ink-soft) !important;
  border-color: var(--cloud-line-strong) !important;
  background: #172131 !important;
  box-shadow: none !important;
}

html[data-app-theme="dark"] body.sidebar-layout .support-complaint-entry {
  color: #edc58c !important;
  border-color: #574326 !important;
  background: #2d2519 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .support-empty-visual > span {
  color: #bcd4ff !important;
  border-color: #2e4b72 !important;
  background: #172a46 !important;
}

html[data-app-theme="dark"] body.sidebar-layout :is(
  .support-room-card,
  .support-room-card span,
  .support-room-card em,
  .support-room-card b
) {
  border-color: var(--cloud-line) !important;
  background: #151e2a !important;
}

html[data-app-theme="dark"] body.sidebar-layout .support-room-card small {
  color: var(--cloud-muted) !important;
  border-color: var(--cloud-line) !important;
  background: #1b2737 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .support-room-card.support-room-complaint {
  color: #edc58c !important;
  border-color: #574326 !important;
  background: #2b2419 !important;
}

html[data-app-theme="dark"] body.sidebar-layout :is(
  .support-complaint-entry-icon,
  .support-complaint-entry em,
  .support-room-complaint small
) {
  color: #edc58c !important;
  border-color: #634b29 !important;
  background: #3b2c1c !important;
}

html[data-app-theme="dark"] body.sidebar-layout .support-inbox-empty > span {
  color: #bdd5ff !important;
  border-color: #2e4c74 !important;
  background: #172a46 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .support-chat-head {
  color: var(--cloud-ink);
  border-color: var(--cloud-line) !important;
  background: #111923 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .support-message-bubble {
  color: var(--cloud-ink-soft) !important;
  border-color: var(--cloud-line) !important;
  background: #192434 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .support-message-row.own .support-message-bubble {
  color: #dce9ff !important;
  border-color: #34547e !important;
  background: #172a46 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .support-image-preview {
  border-color: var(--cloud-line) !important;
  background: #101824 !important;
}

/* Device patrol */
html[data-app-theme="dark"] body.sidebar-layout .patrol-summary {
  color: var(--cloud-muted) !important;
  border-color: var(--cloud-line) !important;
  background: #111923 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .patrol-summary strong {
  color: var(--cloud-ink) !important;
}

html[data-app-theme="dark"] body.sidebar-layout .patrol-empty {
  color: var(--cloud-muted) !important;
  border-color: var(--cloud-line) !important;
  background:
    radial-gradient(circle at 50% 0, rgba(119, 170, 255, 0.08), transparent 35%),
    #111923 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .patrol-empty > span {
  color: #bdd5ff !important;
  border-color: #2e4c74 !important;
  background: #172a46 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .patrol-empty h2 {
  color: var(--cloud-ink) !important;
}

html[data-app-theme="dark"] body.sidebar-layout .patrol-empty p {
  color: var(--cloud-muted) !important;
}

html[data-app-theme="dark"] body.sidebar-layout :is(
  .patrol-card-header,
  .patrol-grid.layout-all .patrol-card-header,
  .patrol-pagination,
  .patrol-configuration-note
) {
  color: var(--cloud-ink-soft) !important;
  border-color: var(--cloud-line) !important;
  background: #111923 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .patrol-machine-copy :is(strong, b) {
  color: var(--cloud-ink) !important;
}

html[data-app-theme="dark"] body.sidebar-layout .patrol-machine-copy :is(small, span) {
  color: var(--cloud-muted) !important;
}

html[data-app-theme="dark"] body.sidebar-layout .patrol-screen {
  border-color: var(--cloud-line) !important;
  background: #0b111a !important;
}

html[data-app-theme="dark"] body.sidebar-layout .patrol-monitor-actions > button {
  color: var(--cloud-ink-soft) !important;
  border-color: var(--cloud-line-strong) !important;
  background: #172131 !important;
}

html[data-app-theme="dark"] body.sidebar-layout dialog.patrol-preview-dialog {
  border-color: var(--cloud-line) !important;
  background: #111923 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .patrol-preview-header {
  border-color: var(--cloud-line) !important;
  background: #111923 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .patrol-preview-header strong {
  color: var(--cloud-ink) !important;
}

html[data-app-theme="dark"] body.sidebar-layout .patrol-preview-header small {
  color: var(--cloud-muted) !important;
}

html[data-app-theme="dark"] body.sidebar-layout .patrol-preview-close {
  color: var(--cloud-ink-soft) !important;
  border-color: var(--cloud-line-strong) !important;
  background: #172131 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .patrol-preview-body {
  background: #0b111a !important;
}

/* Notifications */
html[data-app-theme="dark"] body.sidebar-layout .notification-summary > span {
  color: var(--cloud-ink-soft) !important;
  border-color: var(--cloud-line) !important;
  background: #111923 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .notification-summary :is(strong, small) {
  color: inherit !important;
}

/* Remote plug-in binding */
html[data-app-theme="dark"] body.sidebar-layout .remote-agent-modal {
  color: var(--cloud-ink);
  border: 1px solid var(--cloud-line-strong) !important;
  background: #151e2a !important;
}

html[data-app-theme="dark"] body.sidebar-layout .remote-agent-hero {
  border-color: var(--cloud-line) !important;
  background:
    radial-gradient(circle at 90% 0, rgba(101, 212, 156, 0.1), transparent 42%),
    #111923 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .remote-agent-hero :is(h2, p) {
  color: var(--cloud-ink) !important;
}

html[data-app-theme="dark"] body.sidebar-layout .remote-agent-hero p {
  color: var(--cloud-muted) !important;
}

html[data-app-theme="dark"] body.sidebar-layout .remote-agent-close {
  color: var(--cloud-ink-soft) !important;
  border-color: var(--cloud-line-strong) !important;
  background: #1a2636 !important;
  box-shadow: none !important;
}

html[data-app-theme="dark"] body.sidebar-layout :is(
  .remote-agent-current > div,
  .remote-agent-steps,
  .remote-agent-token-field > div
) {
  color: var(--cloud-ink) !important;
  border-color: var(--cloud-line) !important;
  background: #101824 !important;
}

html[data-app-theme="dark"] body.sidebar-layout :is(
  .remote-agent-current code,
  #remoteAgentModalStatus,
  .remote-agent-step strong,
  .remote-agent-token-field > label strong
) {
  color: var(--cloud-ink) !important;
}

html[data-app-theme="dark"] body.sidebar-layout .remote-agent-dismiss {
  color: var(--cloud-ink-soft) !important;
  border-color: var(--cloud-line-strong) !important;
  background: #172131 !important;
  box-shadow: none !important;
}

/* Renewal and refund sheets */
html[data-app-theme="dark"] body.sidebar-layout :is(
  .renewal-modal-close,
  .refund-modal-close
) {
  color: var(--cloud-ink-soft) !important;
  border-color: var(--cloud-line-strong) !important;
  background: #1a2636 !important;
  box-shadow: none !important;
}

html[data-app-theme="dark"] body.sidebar-layout .batch-renewal-overview {
  color: var(--cloud-ink) !important;
  border-color: var(--cloud-line) !important;
  background: #111923 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .batch-renewal-overview-icon {
  color: #bdd5ff !important;
  border-color: #2e4c74 !important;
  background: #172a46 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .renewal-plan-option.batch-renewal-plan-option {
  color: var(--cloud-ink) !important;
  border-color: var(--cloud-line-strong) !important;
  background: #151e2a !important;
}

html[data-app-theme="dark"] body.sidebar-layout .renewal-plan-option.batch-renewal-plan-option:hover,
html[data-app-theme="dark"] body.sidebar-layout .renewal-plan-option.batch-renewal-plan-option.active {
  border-color: #5278ad !important;
  background: #172a46 !important;
}

html[data-app-theme="dark"] body.sidebar-layout :is(
  .batch-renewal-table th,
  .batch-renewal-period,
  .batch-renewal-grand-total
) {
  color: var(--cloud-ink-soft) !important;
  border-color: var(--cloud-line) !important;
  background: #111923 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .batch-renewal-stepper button {
  color: #c4d9ff !important;
  border-color: #35517a !important;
  background: #172a46 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .refund-remaining-badge {
  color: #bdd5ff !important;
  border-color: #35517a !important;
  background: #172a46 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .refund-calculation-row.is-formula {
  color: #d8e7ff !important;
  border-color: #35517a !important;
  background: #17263d !important;
}

html[data-app-theme="dark"] body.sidebar-layout :is(
  .refund-calculation-note,
  .refund-success-receipt,
  .refund-success-receipt dl,
  .refund-success-receipt dl > div
) {
  color: var(--cloud-ink-soft) !important;
  border-color: var(--cloud-line) !important;
  background: #111923 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .refund-success-receipt {
  border-color: #285840 !important;
  background: #132a23 !important;
}

/* Payment result */
html[data-app-theme="dark"] body.sidebar-layout .payment-state-card {
  color: var(--cloud-ink) !important;
  border-color: var(--cloud-line-strong) !important;
  background: #151e2a !important;
  box-shadow: var(--cloud-shadow) !important;
}

html[data-app-theme="dark"] body.sidebar-layout .payment-state-card :is(h1, h2, h3) {
  color: var(--cloud-ink) !important;
}

html[data-app-theme="dark"] body.sidebar-layout .payment-state-card > p {
  color: var(--cloud-muted) !important;
}

html[data-app-theme="dark"] body.sidebar-layout :is(
  .payment-result-detail,
  .purchase-power-on-notice,
  .purchase-power-on-time,
  .purchased-machine-card
) {
  color: var(--cloud-ink-soft) !important;
  border-color: var(--cloud-line) !important;
  background: #101824 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .payment-result-detail > div {
  border-color: var(--cloud-line) !important;
}

html[data-app-theme="dark"] body.sidebar-layout .payment-result-detail :is(dt, dd),
html[data-app-theme="dark"] body.sidebar-layout .purchased-machine-card :is(strong, b) {
  color: var(--cloud-ink) !important;
}

html[data-app-theme="dark"] body.sidebar-layout .purchase-power-on-icon {
  color: #82dda9 !important;
  border-color: #285840 !important;
  background: #17372b !important;
}

/* Night mode final contrast details */
html[data-app-theme="dark"] body.sidebar-layout .account-hero-actions :is(a, button).is-primary {
  color: #dce9ff !important;
  border-color: #45658f !important;
  background: rgba(23, 42, 70, 0.9) !important;
  box-shadow: none !important;
}

html[data-app-theme="dark"] body.sidebar-layout .order-center-kind-icon {
  color: #bcd4ff !important;
  background: #172a46 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .is-renewal .order-center-kind-icon {
  color: #d5c1ff !important;
  background: #2b2142 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .is-refund .order-center-kind-icon {
  color: #91dfb5 !important;
  background: #17372b !important;
}

html[data-app-theme="dark"] body.sidebar-layout :is(
  .order-center-number button,
  .order-center-refund-summary button
) {
  color: #c5d9ff !important;
  background: #1b3150 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .profile-order-status.is-success {
  color: #8be0b1 !important;
  border-color: #285840 !important;
  background: #17372b !important;
}

html[data-app-theme="dark"] body.sidebar-layout .account-order-filters :is(b, span, em) {
  color: inherit !important;
  border-color: var(--cloud-line) !important;
  background: #1b2737 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .patrol-empty .btn-brand {
  color: #d8e7ff !important;
  border-color: #416392 !important;
  background: #1a3151 !important;
  box-shadow: none !important;
}

html[data-app-theme="dark"] body.sidebar-layout .patrol-empty .btn-brand:hover {
  border-color: #547aad !important;
  background: #203b61 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .remote-agent-hero-icon {
  color: #82dda9 !important;
  border-color: #285840 !important;
  background: #17372b !important;
}

html[data-app-theme="dark"] body.sidebar-layout .remote-agent-current-icon {
  color: var(--cloud-muted) !important;
  background: #1b2737 !important;
}

html[data-app-theme="dark"] body.sidebar-layout :is(
  .renewal-title-mark,
  .renewal-section-heading > div > span
) {
  color: #bdd5ff !important;
  border-color: #2e4c74 !important;
  background: #172a46 !important;
  box-shadow: none !important;
}

html[data-app-theme="dark"] body.sidebar-layout .batch-renewal-overview > span {
  color: #bdd5ff !important;
  background: #172a46 !important;
}

html[data-app-theme="dark"] body.sidebar-layout :is(
  .renewal-section-heading strong,
  .renewal-plan-option strong,
  .renewal-stepper strong,
  .renewal-duration-result strong,
  .batch-renewal-overview strong,
  .batch-renewal-period strong,
  .batch-renewal-total-meta strong
) {
  color: var(--cloud-ink) !important;
}

html[data-app-theme="dark"] body.sidebar-layout :is(
  .renewal-section-heading small,
  .renewal-plan-option small,
  .renewal-duration-result small,
  .batch-renewal-overview small,
  .batch-renewal-period small,
  .batch-renewal-total-meta small
) {
  color: var(--cloud-muted) !important;
}

html[data-app-theme="dark"] body.sidebar-layout .renewal-plan-option.batch-renewal-plan-option.is-selected {
  border-color: #5c82ba !important;
  background: #172a46 !important;
  box-shadow: inset 0 0 0 1px rgba(119, 170, 255, 0.08) !important;
}

html[data-app-theme="dark"] body.sidebar-layout .batch-renewal-table td {
  color: var(--cloud-ink-soft) !important;
  border-color: var(--cloud-line) !important;
}

html[data-app-theme="dark"] body.sidebar-layout .batch-renewal-table td :is(strong, b) {
  color: var(--cloud-ink) !important;
}

html[data-app-theme="dark"] body.sidebar-layout .batch-renewal-table td small {
  color: var(--cloud-muted) !important;
}

html[data-app-theme="dark"] body.sidebar-layout .batch-renewal-table tbody tr:hover {
  background: #182436 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .batch-renewal-total-panel {
  color: var(--cloud-ink) !important;
  border-color: var(--cloud-line) !important;
  background:
    radial-gradient(circle at 100% 0, rgba(119, 170, 255, 0.1), transparent 38%),
    #111923 !important;
  box-shadow: none !important;
}

html[data-app-theme="dark"] body.sidebar-layout .batch-renewal-total-meta > span {
  border-color: var(--cloud-line) !important;
}

html[data-app-theme="dark"] body.sidebar-layout .batch-renewal-grand-total strong {
  color: #bcd4ff !important;
}

html[data-app-theme="dark"] body.sidebar-layout .refund-machine-summary {
  color: var(--cloud-ink);
  border-color: var(--cloud-line) !important;
  background: #101824 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .refund-machine-summary :is(strong, b) {
  color: var(--cloud-ink) !important;
}

html[data-app-theme="dark"] body.sidebar-layout .refund-machine-summary :is(span, small) {
  color: var(--cloud-muted) !important;
}

html[data-app-theme="dark"] body.sidebar-layout .refund-amount-preview {
  color: #a0dfbd !important;
  border-color: #285840 !important;
  background:
    radial-gradient(circle at 92% 12%, rgba(101, 212, 156, 0.1), transparent 36%),
    #132a23 !important;
  box-shadow: none !important;
}

html[data-app-theme="dark"] body.sidebar-layout .refund-amount-preview :is(span, small) {
  color: #9bbbad !important;
}

html[data-app-theme="dark"] body.sidebar-layout .refund-amount-preview strong {
  color: #82dda9 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .refund-calculation :is(dt, dd) {
  color: var(--cloud-ink-soft) !important;
}

html[data-app-theme="dark"] body.sidebar-layout .refund-calculation dl > div {
  border-color: var(--cloud-line) !important;
}

html[data-app-theme="dark"] body.sidebar-layout .refund-calculation p {
  color: var(--cloud-muted) !important;
  border-color: #426d5a !important;
  background: #13251f !important;
}

html[data-app-theme="dark"] body.sidebar-layout .refund-success-receipt-copy > span {
  color: #82dda9 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .refund-success-receipt-copy > strong {
  color: #b5e9cd !important;
}

html[data-app-theme="dark"] body.sidebar-layout .refund-success-receipt-copy > p,
html[data-app-theme="dark"] body.sidebar-layout .refund-success-receipt dt {
  color: #91b3a2 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .refund-success-receipt dd {
  color: #c4ead6 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .purchase-power-on-notice {
  background: linear-gradient(135deg, #132a23, #14261f) !important;
}

html[data-app-theme="dark"] body.sidebar-layout .purchase-power-on-notice :is(strong, p) {
  color: #9fd9b9 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .purchased-machine-card dl {
  border-color: var(--cloud-line) !important;
}

html[data-app-theme="dark"] body.sidebar-layout .purchased-machine-card :is(
  dt,
  .purchased-machine-primary small
) {
  color: var(--cloud-muted) !important;
}

html[data-app-theme="dark"] body.sidebar-layout .purchased-machine-card :is(
  .purchased-machine-primary strong,
  dd
) {
  color: var(--cloud-ink-soft) !important;
}

html[data-app-theme="dark"] body.sidebar-layout .purchased-machine-card .purchased-machine-remaining {
  color: #9eddbb !important;
  border-color: #285840 !important;
  background: #132a23 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .purchased-machine-card .purchased-machine-remaining :is(dt, dd) {
  color: #9eddbb !important;
}

html[data-app-theme="dark"] body.sidebar-layout .purchased-machine-card .purchased-machine-remaining dt svg {
  color: #82dda9 !important;
  stroke: #82dda9 !important;
}

/*
 * Night mode · deep redesign for the two highest-frequency pages.
 * These rules intentionally sit last because the machine list has several
 * later visual iterations in site.css.
 */

/* My machines: compact management console with clear row hierarchy */
html[data-app-theme="dark"] body.sidebar-layout .content-panel:has(.machine-table-rows) {
  overflow: hidden;
  color: var(--cloud-ink);
  border: 0;
  border-radius: 17px;
  background: #0f1722;
  box-shadow: 0 16px 38px rgba(0, 0, 0, 0.24);
}

html[data-app-theme="dark"] body.sidebar-layout .panel-heading-machines {
  min-height: 72px;
  color: var(--cloud-ink);
  border-bottom: 1px solid var(--cloud-line);
  background:
    radial-gradient(circle at 96% -45%, rgba(119, 170, 255, 0.13), transparent 35%),
    #151e2a !important;
}

html[data-app-theme="dark"] body.sidebar-layout .panel-heading-machines h2 {
  color: var(--cloud-ink) !important;
  font-size: 0.96rem;
  letter-spacing: -0.01em;
}

html[data-app-theme="dark"] body.sidebar-layout .machine-filter-bar {
  min-height: 65px;
  padding: 0.68rem 0.85rem;
  border: 0;
  border-bottom: 1px solid var(--cloud-line);
  border-radius: 0;
  background: #111923 !important;
  box-shadow: none !important;
}

html[data-app-theme="dark"] body.sidebar-layout .machine-filters {
  padding: 0.24rem;
  border: 1px solid #253348;
  border-radius: 11px;
  background: #0e1621 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .machine-filter {
  min-height: 34px;
  color: #8f9db0 !important;
  border: 1px solid transparent !important;
  border-radius: 8px;
  background: transparent !important;
}

html[data-app-theme="dark"] body.sidebar-layout .machine-filter > span {
  min-width: 22px;
  padding: 0.12rem 0.35rem;
  color: #9eadc0;
  border-radius: 999px;
  background: #1c2838;
  font-variant-numeric: tabular-nums;
}

html[data-app-theme="dark"] body.sidebar-layout .machine-filter:hover {
  color: #d2dbe7 !important;
  background: #182333 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .machine-filter.active {
  color: #dce9ff !important;
  border-color: #35527c !important;
  background: #1a2d49 !important;
  box-shadow: 0 4px 11px rgba(0, 0, 0, 0.14) !important;
}

html[data-app-theme="dark"] body.sidebar-layout .machine-filter.active > span {
  color: #deebff;
  background: #29476f;
}

html[data-app-theme="dark"] body.sidebar-layout .machine-remote-selector {
  min-height: 39px;
  color: #9eadc0 !important;
  border-color: #2e3d52 !important;
  border-radius: 10px;
  background: #101824 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .machine-remote-selector select {
  color: #e3ebf6 !important;
  background: transparent !important;
}

html[data-app-theme="dark"] body.sidebar-layout .machine-batch-bar {
  min-height: 55px;
  padding: 0.55rem 0.85rem;
  border: 0;
  border-bottom: 1px solid var(--cloud-line);
  border-radius: 0;
  background: #0f1722 !important;
  box-shadow: none !important;
}

html[data-app-theme="dark"] body.sidebar-layout :is(
  .machine-select-all,
  .machine-selected-count
) {
  color: #8f9db0 !important;
}

html[data-app-theme="dark"] body.sidebar-layout :is(
  .machine-select-all input,
  .machine-select-input
) {
  accent-color: #6799ed;
}

html[data-app-theme="dark"] body.sidebar-layout .machine-batch-button {
  min-height: 38px;
  color: #c5cfdd !important;
  border-color: #34465e !important;
  background: #172131 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .machine-table-wrap:has(.machine-table-rows) {
  border: 0;
  background:
    radial-gradient(circle at 100% 0, rgba(74, 119, 197, 0.06), transparent 28%),
    #0c131d !important;
  scrollbar-color: #40536d transparent;
}

html[data-app-theme="dark"] body.sidebar-layout .machine-table-rows {
  --machine-card-columns:
    minmax(180px, 1.04fr)
    minmax(150px, 0.88fr)
    minmax(85px, 0.5fr)
    minmax(130px, 0.76fr)
    minmax(70px, 0.42fr)
    minmax(260px, 1.32fr);
  min-width: 900px;
}

html[data-app-theme="dark"] body.sidebar-layout .machine-table-rows thead {
  padding: 0 0.72rem;
  border-bottom: 1px solid #253247;
  background: rgba(15, 23, 34, 0.97) !important;
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.18);
}

html[data-app-theme="dark"] body.sidebar-layout .machine-table-rows thead th {
  height: 42px;
  color: #7f8da1 !important;
  border: 0 !important;
  box-shadow: none !important;
  font-size: 0.61rem;
}

html[data-app-theme="dark"] body.sidebar-layout .machine-table-sort-button:hover,
html[data-app-theme="dark"] body.sidebar-layout .machine-table-sort-button:focus-visible {
  color: #d7e1ef;
  background: #1d2a3d;
}

html[data-app-theme="dark"] body.sidebar-layout .machine-table-sort-button.active {
  color: #9dbcf0;
}

html[data-app-theme="dark"] body.sidebar-layout .machine-table-rows tbody {
  gap: 9px;
  padding: 0.72rem;
}

html[data-app-theme="dark"] body.sidebar-layout .machine-table-rows tbody tr,
html[data-app-theme="dark"] body.sidebar-layout .machine-table-rows tbody tr.machine-card-row.is-offline {
  min-height: 84px;
  color: var(--cloud-ink);
  border: 0 !important;
  border-radius: 14px;
  background: #151e2a !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.025),
    0 5px 16px rgba(0, 0, 0, 0.2) !important;
}

html[data-app-theme="dark"] body.sidebar-layout .machine-table-rows tbody tr::before {
  background:
    radial-gradient(circle at 0 0, rgba(119, 170, 255, 0.065), transparent 31%),
    linear-gradient(110deg, rgba(255, 255, 255, 0.018), transparent 42%) !important;
}

html[data-app-theme="dark"] body.sidebar-layout .machine-table-rows tbody tr::after {
  background: #6f9eea !important;
  box-shadow: 0 0 14px rgba(111, 158, 234, 0.3) !important;
}

html[data-app-theme="dark"] body.sidebar-layout .machine-table-rows tbody tr:hover {
  border-color: transparent !important;
  background: #182436 !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.035),
    0 10px 24px rgba(0, 0, 0, 0.26) !important;
  transform: translateY(-1px);
}

html[data-app-theme="dark"] body.sidebar-layout .machine-table-rows tbody tr.row-selected {
  border-color: transparent !important;
  background:
    radial-gradient(circle at 0 0, rgba(119, 170, 255, 0.1), transparent 33%),
    #18283e !important;
  box-shadow:
    inset 3px 0 0 #77aaff,
    0 9px 22px rgba(0, 0, 0, 0.24) !important;
}

html[data-app-theme="dark"] body.sidebar-layout .machine-table-rows tbody td,
html[data-app-theme="dark"] body.sidebar-layout .machine-table-rows tbody td:first-child,
html[data-app-theme="dark"] body.sidebar-layout .machine-table-rows tbody td:last-child {
  padding: 0.55rem 0.48rem;
}

html[data-app-theme="dark"] body.sidebar-layout .machine-primary {
  grid-template-columns: 18px minmax(0, 1fr);
  gap: 0.55rem;
}

html[data-app-theme="dark"] body.sidebar-layout .machine-primary-line {
  gap: 0.45rem;
}

html[data-app-theme="dark"] body.sidebar-layout .machine-primary .status-badge {
  min-width: 47px;
  padding: 0.24rem 0.42rem;
  border: 1px solid transparent;
  box-shadow: none;
}

html[data-app-theme="dark"] body.sidebar-layout .machine-primary .status-success {
  color: #84dcab !important;
  border-color: #285840 !important;
  background: #17372b !important;
}

html[data-app-theme="dark"] body.sidebar-layout .machine-primary .status-danger {
  color: #ff999c !important;
  border-color: #61343a !important;
  background: #402328 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .machine-table-rows .machine-number,
html[data-app-theme="dark"] body.sidebar-layout .machine-card-row.is-offline .machine-number {
  color: #eef3fa !important;
  font-size: 0.83rem;
  font-weight: 780;
}

html[data-app-theme="dark"] body.sidebar-layout :is(
  .machine-card-stat,
  .machine-card-field,
  .machine-card-actions-wrap,
  .machine-card-stat-configuration,
  .machine-card-stat-remaining,
  .machine-card-stat-remaining.is-expired,
  .machine-card-stat-room
) {
  min-height: 40px;
  padding: 0.2rem 0.3rem;
  border: 0 !important;
  border-radius: 0;
  background: transparent !important;
  box-shadow: none !important;
}

html[data-app-theme="dark"] body.sidebar-layout :is(
  .machine-card-stat > small,
  .machine-card-field > small,
  .machine-card-actions-wrap > small
) {
  color: #728197 !important;
  font-size: 0.58rem;
  font-weight: 670;
}

html[data-app-theme="dark"] body.sidebar-layout .machine-table-rows .machine-configuration,
html[data-app-theme="dark"] body.sidebar-layout .machine-table-rows .server-room-name {
  color: #cbd5e2 !important;
  font-size: 0.7rem;
}

html[data-app-theme="dark"] body.sidebar-layout .machine-card-stat-remaining .remaining-time strong {
  color: #82dda9 !important;
  font-size: 0.73rem;
}

html[data-app-theme="dark"] body.sidebar-layout .machine-card-stat-remaining.is-expired {
  border: 0 !important;
  background: transparent !important;
}

html[data-app-theme="dark"] body.sidebar-layout .machine-card-stat-remaining.is-expired .remaining-time strong {
  color: #ff9599 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .machine-card-field .local-remark {
  min-height: 32px;
  border-color: #2c3b50 !important;
  background: transparent !important;
}

html[data-app-theme="dark"] body.sidebar-layout .machine-card-field .local-remark:hover,
html[data-app-theme="dark"] body.sidebar-layout .machine-card-field .local-remark:focus-within {
  border-color: #455a77 !important;
  background: rgba(255, 255, 255, 0.018) !important;
}

html[data-app-theme="dark"] body.sidebar-layout .machine-card-field .local-remark-input {
  color: #d7e0ec !important;
  background: transparent !important;
}

html[data-app-theme="dark"] body.sidebar-layout .machine-card-actions-wrap .machine-actions {
  gap: 0.35rem;
  grid-template-columns: minmax(65px, 0.82fr) minmax(88px, 1.06fr) minmax(92px, 1.1fr);
}

html[data-app-theme="dark"] body.sidebar-layout .machine-card-actions-wrap :is(
  .machine-connect-button,
  .machine-support-button,
  .machine-more-button
) {
  height: 34px;
  color: #c9d3e0 !important;
  border-color: #34455c !important;
  border-radius: 8px;
  background: #172131 !important;
  box-shadow: none !important;
}

html[data-app-theme="dark"] body.sidebar-layout .machine-card-actions-wrap .machine-connect-button {
  color: #c9dcff !important;
  border-color: #36547e !important;
  background: #17263d !important;
}

html[data-app-theme="dark"] body.sidebar-layout .machine-card-actions-wrap .machine-support-button {
  color: #a2ddbd !important;
  border-color: #2d5745 !important;
  background: #172a23 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .machine-card-actions-wrap :is(
  .machine-connect-button,
  .machine-support-button,
  .machine-more-button
):hover {
  color: #fff !important;
  border-color: #536d90 !important;
  background: #203047 !important;
  transform: translateY(-1px);
}

/* Promotion: finance dashboard rather than a stack of uniformly dark boxes */
html[data-app-theme="dark"] body.sidebar-layout .promotion-heading {
  min-height: 110px;
  padding: 1.2rem 1.35rem;
  border-color: #2c3c52 !important;
  background:
    radial-gradient(circle at 88% 5%, rgba(119, 170, 255, 0.16), transparent 31%),
    linear-gradient(128deg, #172131 0%, #182438 68%, #1a2a43 100%) !important;
  box-shadow: 0 15px 36px rgba(0, 0, 0, 0.24) !important;
}

html[data-app-theme="dark"] body.sidebar-layout .promotion-heading::after {
  border-color: rgba(119, 170, 255, 0.07);
}

html[data-app-theme="dark"] body.sidebar-layout .promotion-heading h1 {
  font-size: 1.34rem;
  letter-spacing: -0.025em;
}

html[data-app-theme="dark"] body.sidebar-layout .promotion-heading-badges > * {
  color: #aebdd1 !important;
  border-color: #334761 !important;
  background: rgba(13, 21, 32, 0.68) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.025);
}

html[data-app-theme="dark"] body.sidebar-layout .promotion-heading-badges strong {
  color: #bdd5ff !important;
}

html[data-app-theme="dark"] body.sidebar-layout .promotion-rate-badge strong {
  color: #8bdfb2 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .promotion-rule-panel {
  border-color: var(--cloud-line);
  background: #151e2a;
  box-shadow: 0 10px 26px rgba(0, 0, 0, 0.18);
}

html[data-app-theme="dark"] body.sidebar-layout .promotion-rule-grid {
  gap: 0.62rem;
  padding: 0.82rem 0.9rem 0.68rem;
}

html[data-app-theme="dark"] body.sidebar-layout .promotion-rule-grid article {
  min-height: 105px;
  padding: 0.72rem;
  border: 1px solid #263449;
  border-radius: 11px;
  background: #101824;
}

html[data-app-theme="dark"] body.sidebar-layout .promotion-rule-grid article > b {
  color: #bdd5ff;
  background: #1a2c47;
}

html[data-app-theme="dark"] body.sidebar-layout .promotion-rule-grid strong {
  color: #e8eef7 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .promotion-rule-grid small {
  color: #9aa8ba !important;
}

html[data-app-theme="dark"] body.sidebar-layout .promotion-rule-footnote {
  margin: 0 0.9rem 0.82rem;
  color: #9eacbd !important;
  border: 1px solid #263449;
  background: #0f1722 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .promotion-stat-card {
  min-height: 118px;
  border-color: #29384d;
  background:
    radial-gradient(circle at 100% 0, rgba(119, 170, 255, 0.07), transparent 44%),
    #151e2a !important;
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.18);
}

html[data-app-theme="dark"] body.sidebar-layout .promotion-stat-card:hover {
  border-color: #3d5575;
  background:
    radial-gradient(circle at 100% 0, rgba(119, 170, 255, 0.1), transparent 45%),
    #182333 !important;
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.25);
}

html[data-app-theme="dark"] body.sidebar-layout .promotion-balance-stat {
  border-color: #365783 !important;
  background:
    radial-gradient(circle at 100% 0, rgba(119, 170, 255, 0.14), transparent 45%),
    linear-gradient(135deg, #172237, #192943) !important;
}

html[data-app-theme="dark"] body.sidebar-layout .promotion-balance-stat .promotion-stat-copy > strong {
  color: #c2d8ff !important;
}

html[data-app-theme="dark"] body.sidebar-layout .promotion-today-stat .promotion-stat-icon {
  color: #82dda9 !important;
  border-color: #285840 !important;
  background: #17372b !important;
}

html[data-app-theme="dark"] body.sidebar-layout .promotion-pending-stat .promotion-stat-icon {
  color: #efbf7d !important;
  border-color: #5a4226 !important;
  background: #3b2c1c !important;
}

html[data-app-theme="dark"] body.sidebar-layout .promotion-invite-stat .promotion-stat-icon {
  color: #bdd5ff !important;
  border-color: #2e4c74 !important;
  background: #172a46 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .promotion-withdraw-trigger {
  color: #dce9ff;
  border-color: #4970a5;
  background: #284f84;
  box-shadow: 0 5px 14px rgba(0, 0, 0, 0.18);
}

html[data-app-theme="dark"] body.sidebar-layout .promotion-withdraw-trigger:hover {
  background: #3264a8;
}

html[data-app-theme="dark"] body.sidebar-layout .promotion-wallet-card {
  border-color: #29384d;
  background:
    radial-gradient(circle at 100% 0, rgba(119, 170, 255, 0.065), transparent 42%),
    #151e2a !important;
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.18);
}

html[data-app-theme="dark"] body.sidebar-layout .promotion-wallet-card :is(h2, strong) {
  color: #e5ebf4 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .promotion-wallet-card :is(p, small, span) {
  color: #8f9caf;
}

html[data-app-theme="dark"] body.sidebar-layout .promotion-wallet-icon.is-withdrawal {
  color: #82dda9 !important;
  background: #17372b !important;
}

html[data-app-theme="dark"] body.sidebar-layout .promotion-wallet-icon.is-history {
  color: #efbf7d !important;
  background: #3b2c1c !important;
}

html[data-app-theme="dark"] body.sidebar-layout :is(
  .promotion-payout-account,
  .promotion-withdrawal-overview,
  .promotion-withdrawal-row
) {
  color: var(--cloud-ink-soft) !important;
  border-color: #263449 !important;
  background: #101824 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .promotion-withdrawal-overview > i {
  background: #2b394c !important;
}

html[data-app-theme="dark"] body.sidebar-layout .promotion-wallet-action {
  color: #cbd5e2 !important;
  border-color: #35465d !important;
  background: #172131 !important;
  box-shadow: none !important;
}

html[data-app-theme="dark"] body.sidebar-layout .promotion-wallet-action.is-primary {
  color: #dce9ff !important;
  border-color: #456b9d !important;
  background: #254d82 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .promotion-wallet-action:hover {
  color: #fff !important;
  border-color: #5377a7 !important;
  background: #203047 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .promotion-record-entry {
  border-color: #2b3a4f !important;
  background: #151e2a !important;
}

html[data-app-theme="dark"] body.sidebar-layout .promotion-record-entry:hover {
  border-color: #466184 !important;
  background: #182436 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .promotion-share-panel {
  border-color: #2b3a4f !important;
  background: #151e2a !important;
  box-shadow: 0 10px 26px rgba(0, 0, 0, 0.2) !important;
}

html[data-app-theme="dark"] body.sidebar-layout .promotion-rule-list i {
  color: #bdd5ff !important;
  border: 1px solid #2e4c74;
  border-radius: 50%;
  background: #172a46 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .promotion-url-box button {
  color: #dce9ff !important;
  background: #254d82 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .promotion-url-box button:hover {
  background: #3264a8 !important;
}

@media (max-width: 1199.98px) and (min-width: 992px) {
  html[data-app-theme="dark"] body.sidebar-layout .machine-table-rows {
    --machine-card-columns:
      minmax(175px, 1.02fr)
      minmax(145px, 0.86fr)
      minmax(82px, 0.5fr)
      minmax(125px, 0.74fr)
      minmax(68px, 0.4fr)
      minmax(255px, 1.28fr);
    min-width: 880px;
  }
}

/* Device patrol · layout and screen-wall controls */
html[data-app-theme="dark"] body.sidebar-layout .patrol-toolbar {
  border-color: var(--cloud-line) !important;
  background: #151e2a !important;
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.18) !important;
}

html[data-app-theme="dark"] body.sidebar-layout .patrol-layout-switch {
  padding: 0.24rem;
  border: 1px solid #2a394d !important;
  border-radius: 11px;
  background: #0e1621 !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.02);
}

html[data-app-theme="dark"] body.sidebar-layout .patrol-layout-button {
  min-width: 54px;
  min-height: 34px;
  color: #91a0b4 !important;
  border: 1px solid transparent !important;
  border-radius: 8px !important;
  background: transparent !important;
  box-shadow: none !important;
}

html[data-app-theme="dark"] body.sidebar-layout .patrol-layout-button:hover {
  color: #d4deea !important;
  border-color: #2d4058 !important;
  background: #182436 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .patrol-layout-button.active {
  color: #dce9ff !important;
  border-color: #3f6291 !important;
  background:
    linear-gradient(145deg, #1d3557, #1a2c47) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.04),
    0 4px 11px rgba(0, 0, 0, 0.18) !important;
}

html[data-app-theme="dark"] body.sidebar-layout .patrol-remote-selector {
  min-height: 40px;
  color: #9dacc0 !important;
  border-color: #34465e !important;
  border-radius: 10px;
  background: #101824 !important;
  box-shadow: none !important;
}

html[data-app-theme="dark"] body.sidebar-layout .patrol-remote-selector select {
  color: #e0e8f3 !important;
  background: transparent !important;
}

html[data-app-theme="dark"] body.sidebar-layout .patrol-tool-button {
  min-height: 40px;
  color: #c6d0dd !important;
  border-color: #34465e !important;
  border-radius: 10px;
  background: #172131 !important;
  box-shadow: none !important;
}

html[data-app-theme="dark"] body.sidebar-layout .patrol-tool-button:hover {
  color: #eef3f9 !important;
  border-color: #4b6689 !important;
  background: #1d2c40 !important;
  transform: translateY(-1px);
}

html[data-app-theme="dark"] body.sidebar-layout .patrol-tool-button:active {
  transform: translateY(0);
}

html[data-app-theme="dark"] body.sidebar-layout .patrol-tool-button :is(svg, i) {
  color: #9fbced !important;
}

html[data-app-theme="dark"] body.sidebar-layout .patrol-pagination {
  min-height: 36px;
  padding: 0.2rem 0.28rem;
  color: #8d9cb0 !important;
  border: 1px solid #28374b !important;
  border-radius: 10px;
  background: #0f1722 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .patrol-pagination button {
  display: inline-grid;
  width: 28px;
  height: 28px;
  place-items: center;
  color: #a9b7c8 !important;
  border: 0 !important;
  border-radius: 7px;
  background: transparent !important;
}

html[data-app-theme="dark"] body.sidebar-layout .patrol-pagination button:hover:not(:disabled) {
  color: #dce9ff !important;
  background: #1a2c47 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .patrol-pagination button:disabled {
  color: #4f5e71 !important;
  background: transparent !important;
  opacity: 0.62;
}

html[data-app-theme="dark"] body.sidebar-layout .patrol-pagination :is(span, strong) {
  color: #8f9db0 !important;
}

/* My machines · let the rows sit directly on the page canvas */
html[data-app-theme="macos"] body.sidebar-layout .content-panel:has(.machine-table-rows),
html[data-app-theme="dark"] body.sidebar-layout .content-panel:has(.machine-table-rows) {
  background: transparent !important;
  box-shadow: none !important;
}

html[data-app-theme="macos"] body.sidebar-layout .machine-table-wrap:has(.machine-table-rows),
html[data-app-theme="dark"] body.sidebar-layout .machine-table-wrap:has(.machine-table-rows) {
  border-top-color: transparent !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* Customer support · complaint and suggestion entry */
html[data-app-theme="dark"] body.sidebar-layout .support-room-card.support-room-complaint {
  position: relative;
  min-height: 88px;
  overflow: hidden;
  padding: 0.78rem 0.9rem;
  color: #e8edf4 !important;
  border: 1px solid #4a4338 !important;
  border-radius: 15px;
  background:
    radial-gradient(circle at 92% 0, rgba(222, 175, 105, 0.11), transparent 42%),
    linear-gradient(135deg, #171e29, #1b2029) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.025),
    0 7px 20px rgba(0, 0, 0, 0.17) !important;
}

html[data-app-theme="dark"] body.sidebar-layout .support-room-card.support-room-complaint :is(
  .support-room-card-copy,
  .support-room-card-copy > span
) {
  color: inherit !important;
  border: 0 !important;
  background: transparent !important;
}

html[data-app-theme="dark"] body.sidebar-layout .support-room-card.support-room-complaint .support-room-card-icon {
  color: #e7c58f !important;
  border: 1px solid #54452f !important;
  border-radius: 12px;
  background: rgba(180, 132, 70, 0.13) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.035);
}

html[data-app-theme="dark"] body.sidebar-layout .support-room-card.support-room-complaint .support-room-card-copy strong {
  color: #f0e7d8 !important;
  font-size: 0.82rem;
}

html[data-app-theme="dark"] body.sidebar-layout .support-room-card.support-room-complaint .support-room-card-copy em {
  color: #9da9b8 !important;
  border: 0 !important;
  background: transparent !important;
}

html[data-app-theme="dark"] body.sidebar-layout .support-room-card.support-room-complaint .support-room-card-copy small {
  padding: 0.13rem 0.4rem;
  color: #ddbd88 !important;
  border: 1px solid #57472f !important;
  border-radius: 6px;
  background: rgba(177, 128, 63, 0.11) !important;
}

html[data-app-theme="dark"] body.sidebar-layout .support-room-card.support-room-complaint .support-room-card-arrow {
  display: grid;
  width: 26px;
  height: 26px;
  place-items: center;
  color: #cdb181 !important;
  border: 1px solid #4d4435 !important;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.025) !important;
  transition: transform 160ms ease, border-color 160ms ease, background 160ms ease;
}

html[data-app-theme="dark"] body.sidebar-layout .support-room-card.support-room-complaint:hover {
  border-color: #6b5940 !important;
  background:
    radial-gradient(circle at 92% 0, rgba(222, 175, 105, 0.16), transparent 44%),
    linear-gradient(135deg, #1a222e, #20242c) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.035),
    0 11px 25px rgba(0, 0, 0, 0.22) !important;
}

html[data-app-theme="dark"] body.sidebar-layout .support-room-card.support-room-complaint:hover .support-room-card-arrow {
  border-color: #6b5940 !important;
  background: rgba(196, 148, 83, 0.1) !important;
  transform: translateX(2px);
}

html[data-app-theme="dark"] body.sidebar-layout .support-complaint-entry {
  color: #e8edf4 !important;
  border-color: #443d33 !important;
  background: #171e28 !important;
  box-shadow: none !important;
}

html[data-app-theme="dark"] body.sidebar-layout .support-complaint-entry:hover {
  border-color: #67563e !important;
  background: #1b222c !important;
}

html[data-app-theme="dark"] body.sidebar-layout .support-complaint-entry strong {
  color: #eee4d4 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .support-complaint-entry small {
  color: #9da7b4 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .support-complaint-entry-icon {
  color: #dfbd86 !important;
  border: 1px solid #51442f !important;
  background: rgba(177, 128, 63, 0.12) !important;
}

html[data-app-theme="dark"] body.sidebar-layout .support-complaint-entry em,
html[data-app-theme="dark"] body.sidebar-layout .support-conversation-context.complaint {
  color: #dbbb86 !important;
  border: 1px solid #52442f !important;
  background: rgba(177, 128, 63, 0.11) !important;
}

/* Tencent Cloud EID verification */
html[data-app-theme="dark"] body.sidebar-layout .real-name-identity-intro {
  border-color: #2a3b55 !important;
  background: rgba(24, 37, 55, 0.8) !important;
}

html[data-app-theme="dark"] body.sidebar-layout .real-name-identity-intro strong,
html[data-app-theme="dark"] body.sidebar-layout .real-name-field > span {
  color: #dbe5f2 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .real-name-identity-intro span,
html[data-app-theme="dark"] body.sidebar-layout .real-name-identity-privacy {
  color: #93a2b6 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .real-name-field input {
  color: #e8eef7 !important;
  border-color: #314158 !important;
  background: #121c2a !important;
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.18) !important;
}

html[data-app-theme="dark"] body.sidebar-layout .real-name-field input::placeholder {
  color: #718096 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .real-name-field input:focus {
  border-color: #658fcf !important;
  background: #152132 !important;
  box-shadow: 0 0 0 4px rgba(83, 142, 226, 0.13) !important;
}

html[data-app-theme="dark"] body.sidebar-layout .real-name-identity-message.is-error {
  color: #e5a2a7 !important;
  border-color: #60363b !important;
  background: #2b1b20 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .real-name-channel-options {
  border-color: #2a394e !important;
  background: rgba(19, 29, 43, 0.82) !important;
}

html[data-app-theme="dark"] body.sidebar-layout .real-name-channel-options em {
  color: #8796aa !important;
}

html[data-app-theme="dark"] body.sidebar-layout
  .real-name-channel-options .is-alipay.is-recommended {
  border-color: rgba(102, 157, 232, 0.28) !important;
  background: linear-gradient(145deg, rgba(35, 56, 84, 0.94), rgba(26, 41, 61, 0.92)) !important;
  box-shadow: 0 6px 15px rgba(0, 0, 0, 0.16) !important;
}

html[data-app-theme="dark"] body.sidebar-layout
  .real-name-channel-options .is-recommended small {
  border-color: #1a293d !important;
}

html[data-app-theme="dark"] body.sidebar-layout .real-name-channel-options > i {
  background: #334158 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .real-name-qr-loading {
  color: #93a2b6 !important;
  background: rgba(16, 24, 36, 0.97) !important;
}

html[data-app-theme="dark"] body.sidebar-layout .real-name-qr-loading > i {
  border-color: rgba(119, 170, 255, 0.17);
  border-top-color: #77aaff;
}

html[data-app-theme="dark"] body.sidebar-layout .real-name-qr-expiry {
  color: #9eacbf !important;
  border-color: #2b3a4f !important;
  background: #101824 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .real-name-qr-expiry.is-expired {
  color: #e3a0a5 !important;
  border-color: #5e3439 !important;
  background: #2b1b20 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .real-name-qr-status.is-success {
  color: #9eddbb !important;
  border-color: #285840 !important;
  background: #132a23 !important;
}

html[data-app-theme="dark"] body.sidebar-layout :is(
  .real-name-qr-status.is-processing,
  .real-name-qr-status.is-warning
) {
  color: #e8c58e !important;
  border-color: #574326 !important;
  background: #2d2519 !important;
}

html[data-app-theme="dark"] body.sidebar-layout .real-name-qr-status.is-error {
  color: #e5a2a7 !important;
  border-color: #60363b !important;
  background: #2b1b20 !important;
}