/* Shared dark palette. Layout loads this conditionally for Automatic,
   unconditionally for Dark, and omits it for Light. */
:root {
  color-scheme: dark;
  --bg: #0d0d0c;
  --surface: #161615;
  --surface-2: #1b1b1a;
  --sunken: #0a0a09;
  --field: #121211;
  --ink: #f3f2ec;
  --ink-2: #cfcec7;
  --muted: #97968e;
  --faint: #64635d;
  --line: rgb(243 242 236 / 8%);
  --line-strong: rgb(243 242 236 / 15%);
  --accent: #ff6436;
  --accent-ink: #ffffff;
  --accent-soft: rgb(255 100 54 / 18%);
  --accent-text: #ff8a63;
  --accent-strong: #ff6436;
  --on-accent: #0d0d0c;
  --focus: #ff6436;
  --live: #4cc685;
  --live-soft: rgb(76 198 133 / 14%);
  --warn: #f0b04a;
  --warn-soft: rgb(240 176 74 / 14%);
  --danger: #ff7a66;
  --danger-soft: rgb(255 122 102 / 12%);
  --shadow-sm: 0 1px 2px rgb(0 0 0 / 40%);
  --shadow-md: 0 2px 4px rgb(0 0 0 / 30%), 0 12px 32px -8px rgb(0 0 0 / 60%);
  --shadow-lg: 0 4px 8px rgb(0 0 0 / 30%), 0 32px 80px -12px rgb(0 0 0 / 70%);
  --tile-image: #3b2619;
  --tile-image-ink: #f2a679;
  --tile-video: #2c2445;
  --tile-video-ink: #b9a4f2;
  --tile-audio: #1a3427;
  --tile-audio-ink: #82d3a8;
  --tile-document: #1c2b46;
  --tile-document-ink: #93b8e8;
  --tile-design: #3c1b31;
  --tile-design-ink: #f09bbb;
  --tile-archive: #352d18;
  --tile-archive-ink: #dfc27a;
  --tile-font: #292926;
  --tile-font-ink: #cfcec7;
  --tile-code: #202934;
  --tile-code-ink: #a7bdd4;
  --tile-other: #252523;
  --tile-other-ink: #a3a29a;
  --tile-edge: rgb(255 255 255 / 14%);
}

.auth-glow {
  --glow: rgb(255 100 54 / 26%);
  --glow-rose: rgb(255 61 110 / 13%);
}

.brand-vermilion {
  --accent: #ffac91;
  --accent-text: #ffac91;
  --focus: #ffac91;
}
.brand-blue {
  --accent: #a2c4ff;
  --accent-text: #a2c4ff;
  --focus: #a2c4ff;
}
.brand-forest {
  --accent: #94d9ad;
  --accent-text: #94d9ad;
  --focus: #94d9ad;
}
.brand-violet {
  --accent: #cfb2f7;
  --accent-text: #cfb2f7;
  --focus: #cfb2f7;
}
.brand-rose {
  --accent: #ffabc9;
  --accent-text: #ffabc9;
  --focus: #ffabc9;
}
.brand-slate {
  --accent: #bdcce0;
  --accent-text: #bdcce0;
  --focus: #bdcce0;
}
body[class*="brand-"] {
  --accent-ink: #141413;
  --accent-strong: var(--accent);
  --on-accent: #141413;
}
