/* Theme Âmbar (sunset): tokens only. Material: frosted. */
@layer themes {
/* Component tokens: the theme values of hooks that base rules read. */
html[data-theme="sunset"],
html[data-theme="sunset"] body {
  --comp-chat-bg-orbs-filter: hue-rotate(85deg);
  --comp-login-bg-orbs-filter: hue-rotate(85deg);
  --comp-chat-bg-orbs-opacity: 0.4;
  --comp-login-bg-orbs-opacity: 0.4;
}
/* ─── 5. Âmbar (Terracota & Dourado Suave) ─── */
html[data-theme="sunset"] {
  --sys-bg-base: #160c08;
  --comp-panel-on-accent: var(--sys-bg-base);
  --sys-bg-raised: #20120c;
  --sys-bg-high: #2b1810;
  --sys-bg-overlay: rgba(36, 20, 14, 0.82);
  --sys-border: rgba(251, 146, 60, 0.16);
  --sys-border-strong: rgba(245, 158, 11, 0.34);
  --sys-surface-shell: linear-gradient(135deg, rgba(38, 21, 15, 0.78), rgba(24, 13, 9, 0.72));
  --sys-surface-plate: linear-gradient(145deg, rgba(45, 25, 18, 0.92), rgba(28, 16, 11, 0.88));
  --sys-surface-control: rgba(52, 29, 21, 0.65);
  --sys-accent: #f59e0b;
  --sys-accent-strong: #d97706;
  --sys-accent-alt: #f97316;
  --sys-accent-gradient: linear-gradient(135deg, #d97706, #f97316);
  --sys-accent-gradient-hover: linear-gradient(135deg, #b45309, #ea580c);
  --sys-on-surface: #fff7ed;
  --sys-on-surface-variant: #fed7aa;
  --sys-on-surface-muted: #fdba74;
  --comp-bubble-own-bg: linear-gradient(135deg, rgba(217, 119, 6, 0.28), rgba(249, 115, 22, 0.18));
  --comp-bubble-own-border: rgba(251, 146, 60, 0.38);
  --comp-bubble-other-bg: linear-gradient(135deg, rgba(45, 25, 18, 0.72), rgba(32, 18, 12, 0.62));
  --comp-bubble-other-border: rgba(251, 146, 60, 0.16);
}
}