.compliance-notice {
  grid-column: 1 / -1;
  position: relative;
  display: flex;
  justify-content: center;
  margin-top: 2px;
  padding: 12px 16px;
  background:
    linear-gradient(135deg, rgba(255, 252, 245, 0.74), rgba(248, 241, 229, 0.48));
  border: 1px solid rgba(200, 146, 62, 0.16);
  border-radius: 14px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.62);
  color: rgba(74, 56, 33, 0.74);
  font-size: 12px;
  line-height: 1.55;
  font-weight: 500;
  text-align: center;
  backdrop-filter: blur(12px);
}

.compliance-notice__inner {
  width: min(1080px, 100%);
}

body.has-compliance-notice {
  padding-bottom: 0;
}

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

@supports (min-height: 100dvh) {
  body {
    min-height: 100dvh;
  }
}

@media (max-width: 768px) {
  body {
    overflow-x: hidden;
  }

  input, textarea, select {
    font-size: 16px !important;
  }

  .page-wrap {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0;
    padding-left: max(var(--mobile-page-gutter), env(safe-area-inset-left)) !important;
    padding-right: max(var(--mobile-page-gutter), env(safe-area-inset-right)) !important;
    padding-bottom: calc(48px + env(safe-area-inset-bottom)) !important;
    overflow-x: hidden;
  }

  .top-nav {
    min-width: 0;
    padding: 12px 0;
  }

  .card {
    max-width: 100%;
    min-width: 0;
    padding: 16px !important;
    margin-bottom: 14px;
  }

  .filter-row {
    flex-wrap: wrap;
  }

  .filter-tag {
    min-height: 38px;
    flex: 1 1 auto;
  }

  .earn-grid,
  .plan-grid {
    grid-template-columns: 1fr !important;
  }

  .stats-row,
  .share-row,
  .link-box,
  .code-box,
  .payment-methods,
  .custom-input-row {
    flex-direction: column;
    align-items: stretch;
  }

  .setting-row {
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
  }

  .radio-group {
    flex-wrap: wrap;
  }

  .code-val,
  .link-input {
    min-width: 0;
    word-break: break-all;
  }

  .btn,
  .copy-btn,
  .custom-btn,
  .btn-primary,
  .btn-outline,
  .share-btn {
    min-height: 44px;
  }

  .toast {
    width: max-content;
    max-width: calc(100vw - 32px);
    text-align: center;
  }

  table,
  .cost-table {
    max-width: 100%;
  }
}

@media (max-width: 640px) {
  .compliance-notice {
    padding: 10px 12px;
    font-size: 11px;
    line-height: 1.45;
  }

  body.has-compliance-notice {
    padding-bottom: 0;
  }
}

/* [主题迁移] css/compliance.css 旧版已完成的语义主题适配。 */
/* Semantic theme adapter: visual declarations only. */
html[data-theme="light"] body,
html[data-theme="dark"] body,
html[data-theme="light"] .page-wrap,
html[data-theme="dark"] .page-wrap {
  background-color: var(--theme-canvas);
  color: var(--theme-text-1);
}

html[data-theme="light"] .top-nav,
html[data-theme="dark"] .top-nav,
html[data-theme="light"] .navbar,
html[data-theme="dark"] .navbar,
html[data-theme="light"] .page-header,
html[data-theme="dark"] .page-header,
html[data-theme="light"] .app-header,
html[data-theme="dark"] .app-header {
  background-color: var(--theme-canvas-alt);
  border-color: var(--theme-line);
  color: var(--theme-text-1);
}

html[data-theme="light"] .card,
html[data-theme="dark"] .card,
html[data-theme="light"] .content-card,
html[data-theme="dark"] .content-card,
html[data-theme="light"] .settings-card,
html[data-theme="dark"] .settings-card,
html[data-theme="light"] .account-card,
html[data-theme="dark"] .account-card,
html[data-theme="light"] .legal-content,
html[data-theme="dark"] .legal-content,
html[data-theme="light"] .feedback-form,
html[data-theme="dark"] .feedback-form {
  background-color: var(--theme-surface);
  border-color: var(--theme-line);
  box-shadow: var(--theme-shadow);
  color: var(--theme-text-1);
}

html[data-theme="light"] input,
html[data-theme="dark"] input,
html[data-theme="light"] textarea,
html[data-theme="dark"] textarea,
html[data-theme="light"] select,
html[data-theme="dark"] select,
html[data-theme="light"] .link-input,
html[data-theme="dark"] .link-input,
html[data-theme="light"] .code-box,
html[data-theme="dark"] .code-box {
  background-color: var(--theme-surface-raised);
  border-color: var(--theme-line);
  caret-color: var(--theme-gold);
  color: var(--theme-text-1);
}

html[data-theme="light"] input:focus-visible,
html[data-theme="dark"] input:focus-visible,
html[data-theme="light"] textarea:focus-visible,
html[data-theme="dark"] textarea:focus-visible,
html[data-theme="light"] select:focus-visible,
html[data-theme="dark"] select:focus-visible {
  border-color: var(--theme-gold);
  outline-color: var(--theme-gold);
  box-shadow: 0 0 0 3px var(--theme-gold-soft);
}

html[data-theme="light"] .btn,
html[data-theme="dark"] .btn,
html[data-theme="light"] .copy-btn,
html[data-theme="dark"] .copy-btn,
html[data-theme="light"] .custom-btn,
html[data-theme="dark"] .custom-btn,
html[data-theme="light"] .btn-primary,
html[data-theme="dark"] .btn-primary,
html[data-theme="light"] .share-btn,
html[data-theme="dark"] .share-btn {
  background-color: var(--theme-gold-soft);
  border-color: var(--theme-gold);
  color: var(--theme-text-1);
}

html[data-theme="light"] .btn-outline,
html[data-theme="dark"] .btn-outline {
  background-color: var(--theme-surface-soft);
  border-color: var(--theme-line-strong);
  color: var(--theme-text-2);
}

html[data-theme="light"] .btn:hover,
html[data-theme="dark"] .btn:hover,
html[data-theme="light"] .copy-btn:hover,
html[data-theme="dark"] .copy-btn:hover,
html[data-theme="light"] .share-btn:hover,
html[data-theme="dark"] .share-btn:hover {
  background-color: var(--theme-surface-soft);
  border-color: var(--theme-gold);
  color: var(--theme-gold);
  box-shadow: var(--theme-shadow);
}

html[data-theme="light"] .btn:disabled,
html[data-theme="dark"] .btn:disabled,
html[data-theme="light"] button:disabled,
html[data-theme="dark"] button:disabled,
html[data-theme="light"] input:disabled,
html[data-theme="dark"] input:disabled {
  background-color: var(--theme-surface-soft);
  border-color: var(--theme-line);
  color: var(--theme-text-disabled);
  opacity: .62;
}

html[data-theme="light"] .filter-tag,
html[data-theme="dark"] .filter-tag,
html[data-theme="light"] .tag,
html[data-theme="dark"] .tag,
html[data-theme="light"] .badge,
html[data-theme="dark"] .badge,
html[data-theme="light"] .status-tag,
html[data-theme="dark"] .status-tag {
  background-color: var(--theme-pine-soft);
  border-color: var(--theme-pine);
  color: var(--theme-pine);
}

html[data-theme="light"] h1,
html[data-theme="dark"] h1,
html[data-theme="light"] h2,
html[data-theme="dark"] h2,
html[data-theme="light"] h3,
html[data-theme="dark"] h3,
html[data-theme="light"] label,
html[data-theme="dark"] label {
  color: var(--theme-text-1);
}

html[data-theme="light"] .muted,
html[data-theme="dark"] .muted,
html[data-theme="light"] .hint,
html[data-theme="dark"] .hint,
html[data-theme="light"] .help-text,
html[data-theme="dark"] .help-text,
html[data-theme="light"] .update-date,
html[data-theme="dark"] .update-date {
  color: var(--theme-text-3);
}

html[data-theme="light"] table,
html[data-theme="dark"] table,
html[data-theme="light"] th,
html[data-theme="dark"] th,
html[data-theme="light"] td,
html[data-theme="dark"] td,
html[data-theme="light"] .setting-row,
html[data-theme="dark"] .setting-row {
  background-color: var(--theme-surface);
  border-color: var(--theme-line);
  color: var(--theme-text-1);
}

html[data-theme="light"] .compliance-notice,
html[data-theme="dark"] .compliance-notice {
  background: var(--theme-gold-soft);
  border-color: var(--theme-gold);
  box-shadow: var(--theme-shadow);
  color: var(--theme-text-2);
}

html[data-theme="light"] .toast,
html[data-theme="dark"] .toast {
  background-color: var(--theme-surface-raised);
  border-color: var(--theme-line-strong);
  box-shadow: var(--theme-shadow);
  color: var(--theme-text-1);
}

html[data-theme="light"] .footer,
html[data-theme="dark"] .footer,
html[data-theme="light"] footer,
html[data-theme="dark"] footer {
  background-color: var(--theme-canvas-alt);
  border-color: var(--theme-line);
  color: var(--theme-text-2);
}