:root {
  color-scheme: light;
  --c-bg: #f6f2eb;
  --c-surface-1: #fffdf9;
  --c-surface-2: #ffffff;
  --c-surface-3: #f1ece3;
  --c-surface-hover: #fff3ed;
  --c-border-faint: #eee7de;
  --c-border-hairline: #e3dbd0;
  --c-border-strong: #cfc1b3;
  --c-border-bright: #bba999;
  --c-text: #262321;
  --c-text-mid: #625c56;
  --c-text-muted: #80776f;
  --c-text-faint: #a29890;
  --c-text-on-accent: #ffffff;
  --c-accent: #ff5a5f;
  --c-accent-hover: #f44950;
  --c-accent-press: #dc3840;
  --c-accent-muted: #ffd8d5;
  --c-accent-glow: rgba(255, 90, 95, .2);
  --c-accent-glow-soft: rgba(255, 90, 95, .08);
  --c-accent-glow-strong: rgba(255, 90, 95, .34);
  --c-accent-tint: rgba(255, 90, 95, .055);
  --c-brand: #ff5a5f;
  --c-brand-hover: #f44950;
  --c-brand-press: #dc3840;
  --c-success: #718364;
  --c-warning: #bd8551;
  --c-info: #617f83;
  --bg-vignette: linear-gradient(180deg, #fffdf9, #f5f0e8);
  --bg-vignette-hover: linear-gradient(180deg, #fffaf6, #f9ece4);
  --bg-topbar-band: #fffdf9;
  --gradient-surface-up: #ffffff;
  --gradient-surface-up-hover: #fff7f2;
  --gradient-accent: #ff5a5f;
  --gradient-accent-hover: #f44950;
  --gradient-recessed: #f4efe7;
  --gradient-summary-open: #fffdf9;
  --gradient-range-track: linear-gradient(90deg, #ff8a83 0%, #f1ece3 60%);
  --shadow-inset-soft: inset 0 1px 0 rgba(255,255,255,.9);
  --shadow-inset-press: inset 0 1px 2px rgba(94,74,61,.09);
  --shadow-panel: 0 1px 3px rgba(74,52,37,.08);
  --shadow-modal: 0 24px 64px rgba(74,52,37,.22);
  --f-display: Inter, ui-sans-serif, system-ui, sans-serif;
  --f-body: Inter, ui-sans-serif, system-ui, sans-serif;
}

html, body { background: var(--c-bg); }
.app-topbar { background: #fffdf9; box-shadow: 0 1px 0 rgba(83,65,52,.08); }
.app-brand { padding: 0; border: 0; background: transparent; }
.ikolori-brand-lockup { display: inline-flex; align-items: center; gap: 8px; text-align: left; }
.ikolori-brand-mark { display: grid; width: 34px; height: 34px; place-items: center; border-radius: 7px; background: #f3ede4; }
.ikolori-brand-mark img { width: 13px; height: 22px; }
.ikolori-brand-lockup strong { display: block; color: #ff5a5f; font-size: 22px; font-weight: 760; letter-spacing: 0; line-height: .9; }
.ikolori-brand-lockup small { display: block; margin-top: 3px; color: #847a71; font-size: 8px; line-height: 1; }
.app-topbar .cws-tab--launcher { background: #fff; border-color: #e6ddd4; color: #393431; }
.app-topbar .cws-tab--launcher:hover { background: #fff3ed; border-color: #ffb5b0; }
.app-topbar .cws-tab--floral-colors { background: #ff5a5f; color: #fff; border-color: #ff5a5f; }
.cws-main { gap: 10px; padding: 10px; }
.app-panel { box-shadow: 0 1px 3px rgba(74,52,37,.08); }
.panel-header, .panel-body, .insp-panel, .se-panel, .vp-shell { border-color: #e6ddd4; }
.cws-shell input, .cws-shell select { color: #2b2724; background: #fff; border-color: #ded4ca; }
.cws-shell button:focus-visible, .cws-shell input:focus-visible, .cws-shell select:focus-visible { outline-color: #ff5a5f; }
.cws-shell ::selection { background: #ffd8d5; color: #2b2724; }