/**
 * CraftBelt ivory. Dark bench tokens stay on html[data-cbr="1"] alone.
 * Applies with data-cbr-theme="light" or data-theme="light".
 */

html[data-cbr='1'][data-cbr-theme='light'],
html[data-cbr='1'][data-theme='light'] {
  --bg-app: #f3ece3;
  --bg-surface: #fffaf4;
  --bg-surface-elevated: #efe6d8;
  --text-primary: #1c1612;
  --text-secondary: #5e554c;
  --text-muted: #756858;
  --border-subtle: rgba(62, 48, 28, 0.14);
  --border-strong: rgba(62, 48, 28, 0.22);
  --accent-orange: #ea580c;
  --accent-cyan: #0369a1;
  --accent-green: #15803d;
  --cbr-void: var(--bg-app, #f3ece3);
  --cbr-bench: #f7f1e7;
  --cbr-plank: var(--bg-surface, #fffaf4);
  --cbr-raised: var(--bg-surface-elevated, #efe6d8);
  --cbr-raised-hi: #e7dccb;
  --cbr-inset: #f6efe6;
  --cbr-ink: var(--text-primary, #1c1612);
  --cbr-ink-mute: var(--text-secondary, #5e554c);
  --cbr-ink-faint: var(--text-muted, #8a7d6e);
  --cbr-ok: var(--accent-green, #15803d);
  --cbr-plan: var(--accent-cyan, #0369a1);
  --cbr-shadow: 0 10px 24px rgba(62, 44, 22, 0.08);
  --cbr-shadow-sm: 0 2px 8px rgba(62, 44, 22, 0.06);
  --cbr-bevel-out:
    0 1px 0 rgba(255, 255, 255, 0.85) inset,
    0 1px 2px rgba(62, 44, 22, 0.08);
  --cbr-bevel-out-hi:
    0 1px 0 rgba(255, 255, 255, 0.9) inset,
    0 2px 6px rgba(62, 44, 22, 0.1);
  --cbr-bevel-in: 0 1px 3px rgba(62, 44, 22, 0.14) inset;
  --cbr-surface: var(--cbr-plank);
  --cbr-unapproved: #b45309;
  --cbr-te-unapproved: #b45309;
  --cbr-yellow-fill: #fef08a;
  --cbr-yellow-cell: #fde047;
  --cbr-yellow-border: #ca8a04;
  --cbr-yellow-ink: #713f12;
  color-scheme: light;
}

html[data-cbr='1'][data-cbr-theme='light'] body,
html[data-cbr='1'][data-theme='light'] body {
  background-color: #f3ece3;
  background-image:
    radial-gradient(1000px 480px at 15% -10%, rgba(240, 122, 40, 0.1), transparent 55%),
    radial-gradient(720px 420px at 100% 0%, rgba(180, 140, 80, 0.08), transparent 50%),
    linear-gradient(#f7f1e6, #efe4d2);
  background-size: auto;
  background-repeat: no-repeat;
  background-blend-mode: normal;
  color: var(--cbr-ink);
}

html[data-cbr='1'][data-cbr-theme='light'] .cbr-card,
html[data-cbr='1'][data-theme='light'] .cbr-card,
html[data-cbr='1'][data-cbr-theme='light'] input,
html[data-cbr='1'][data-theme='light'] input,
html[data-cbr='1'][data-cbr-theme='light'] textarea,
html[data-cbr='1'][data-theme='light'] textarea,
html[data-cbr='1'][data-cbr-theme='light'] select,
html[data-cbr='1'][data-theme='light'] select {
  border-color: rgba(62, 48, 28, 0.14);
}

html[data-cbr='1'][data-cbr-theme='light'] .cbr-btn--ghost,
html[data-cbr='1'][data-theme='light'] .cbr-btn--ghost {
  border-color: rgba(62, 48, 28, 0.18);
  color: var(--cbr-ink);
}

html[data-cbr='1'] .cbr-appearance {
  display: inline-flex;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 999px;
  overflow: hidden;
  background: var(--cbr-inset);
}

html[data-cbr='1'][data-cbr-theme='light'] .cbr-appearance,
html[data-cbr='1'][data-theme='light'] .cbr-appearance {
  border-color: rgba(62, 48, 28, 0.16);
}

html[data-cbr='1'] .cbr-appearance button {
  height: 40px;
  min-height: var(--cbr-tap);
  padding: 0 14px;
  border: 0;
  background: transparent;
  color: var(--cbr-ink-mute);
  font: inherit;
  font-size: 12px;
  font-weight: 700;
  box-shadow: none;
}

html[data-cbr='1'] .cbr-appearance button[aria-pressed='true'] {
  background: var(--cbr-orange);
  color: #1a0c02;
}