:root {
  color-scheme: dark;
  --bg: #121513;
  --panel: #181c19;
  --panel-2: #1e231f;
  --panel-3: #242a25;
  --sidebar: #101310;
  --line: #313832;
  --line-strong: #485149;
  --text: #edf0ec;
  --muted: #9da79f;
  --subtle: #7c877f;
  --accent: #8fb9a4;
  --accent-strong: #a4c9b6;
  --accent-ink: #102018;
  --danger: #e18f8a;
  --warning: #d0ad70;
  --success: #a7c892;
  --field: #121713;
  --selected: #28352e;
  --hover: #202621;
  --shadow: rgba(0, 0, 0, .32);
  --font-sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-mono: ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", monospace;
  --radius-control: 3px;
  --radius-panel: 4px;
  --ui-size: 13px;
  --row-height: 58px;
  --control-height: 30px;
  --appbar-height: 44px;
  --dialog-header-height: 43px;
  --ui-scale-factor: 1;
  --density-factor: 1;
  --icon-size: 18px;
  --button-pad-x: 10px;
  --button-pad-y: 5px;
  --field-pad-x: 8px;
  --field-pad-y: 5px;
}

html[data-theme="light"] {
  color-scheme: light;
  --bg: #f2f4f1;
  --panel: #ffffff;
  --panel-2: #f7f8f6;
  --panel-3: #edf1ec;
  --sidebar: #e9eee9;
  --line: #cbd2cb;
  --line-strong: #aeb8af;
  --text: #202622;
  --muted: #647068;
  --subtle: #7a847d;
  --accent: #507b67;
  --accent-strong: #416b58;
  --accent-ink: #ffffff;
  --danger: #a94c48;
  --warning: #8a6930;
  --success: #587a49;
  --field: #ffffff;
  --selected: #dce8e0;
  --hover: #e8ede8;
  --shadow: rgba(31, 39, 33, .16);
}

:root {
  --folder-pane-width: 228px;
  --message-pane-width: 420px;
}

html[data-color-preset="blue"] {
  --accent: #6f96c9;
  --accent-strong: #86a9d5;
  --selected: color-mix(in srgb, var(--accent) 20%, var(--panel));
}

html[data-color-preset="slate"] {
  --accent: #8e9aa8;
  --accent-strong: #aab4bf;
  --selected: color-mix(in srgb, var(--accent) 20%, var(--panel));
}

html[data-color-preset="amber"] {
  --accent: #c69a55;
  --accent-strong: #d7ad6b;
  --selected: color-mix(in srgb, var(--accent) 20%, var(--panel));
}

html[data-color-preset="violet"] {
  --accent: #9b88c9;
  --accent-strong: #ad9bd5;
  --selected: color-mix(in srgb, var(--accent) 20%, var(--panel));
}

html[data-color-preset="rose"] {
  --accent: #c98591;
  --accent-strong: #d79aa5;
  --selected: color-mix(in srgb, var(--accent) 20%, var(--panel));
}

html[data-color-preset="custom"] {
  --bg: var(--user-bg, #121513);
  --panel: var(--user-panel, #181c19);
  --panel-2: color-mix(in srgb, var(--panel) 88%, var(--text));
  --panel-3: color-mix(in srgb, var(--panel) 80%, var(--text));
  --sidebar: color-mix(in srgb, var(--bg) 88%, black);
  --text: var(--user-text, #edf0ec);
  --muted: color-mix(in srgb, var(--text) 66%, var(--panel));
  --subtle: color-mix(in srgb, var(--text) 52%, var(--panel));
  --field: color-mix(in srgb, var(--bg) 82%, var(--panel));
  --line: color-mix(in srgb, var(--text) 18%, var(--panel));
  --line-strong: color-mix(in srgb, var(--text) 30%, var(--panel));
  --hover: color-mix(in srgb, var(--text) 8%, var(--panel));
  --accent: var(--user-accent, #6f9c86);
  --accent-strong: color-mix(in srgb, var(--accent) 82%, white);
  --selected: color-mix(in srgb, var(--accent) 22%, var(--panel));
}

html[data-font-family="inter"] {
  --font-sans: Inter, ui-sans-serif, system-ui, sans-serif;
}

html[data-font-family="humanist"] {
  --font-sans: "Segoe UI", Candara, Calibri, ui-sans-serif, system-ui, sans-serif;
}

html[data-font-family="mono"] {
  --font-sans: ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", monospace;
}

html[data-contrast="soft"] {
  --line: color-mix(in srgb, var(--line) 70%, transparent);
  --line-strong: color-mix(in srgb, var(--line-strong) 78%, transparent);
}

html[data-contrast="high"] {
  --line: color-mix(in srgb, var(--text) 28%, var(--panel));
  --line-strong: color-mix(in srgb, var(--text) 48%, var(--panel));
  --muted: color-mix(in srgb, var(--text) 74%, var(--panel));
}

html[data-hide-avatars="true"] .avatar {
  display: none !important;
}

html[data-hide-attachments="true"] .message-attachment,
html[data-hide-attachments="true"] .attachment-indicator {
  display: none !important;
}

html[data-hide-flags="true"] .message-flag,
html[data-hide-flags="true"] .flag-indicator {
  display: none !important;
}

html[data-reduce-motion="true"] * {
  scroll-behavior: auto !important;
  transition: none !important;
  animation: none !important;
}

html[data-color-preset="teal"] {
  --accent: #4f9d93;
  --accent-strong: #68b0a5;
  --selected: color-mix(in srgb, var(--accent) 20%, var(--panel));
}

html[data-color-preset="cyan"] {
  --accent: #4c9fba;
  --accent-strong: #68b4cb;
  --selected: color-mix(in srgb, var(--accent) 20%, var(--panel));
}

html[data-color-preset="indigo"] {
  --accent: #7184c5;
  --accent-strong: #8b9bd2;
  --selected: color-mix(in srgb, var(--accent) 20%, var(--panel));
}

html[data-color-preset="graphite"] {
  --accent: #9aa19c;
  --accent-strong: #b0b6b2;
  --selected: color-mix(in srgb, var(--accent) 18%, var(--panel));
}

html[data-color-preset="orange"] {
  --accent: #c9824e;
  --accent-strong: #d69a6d;
  --selected: color-mix(in srgb, var(--accent) 20%, var(--panel));
}

html[data-color-preset="red"] {
  --accent: #bd6662;
  --accent-strong: #cf7e7a;
  --selected: color-mix(in srgb, var(--accent) 20%, var(--panel));
}


:root {
  --toolbar-density-factor: 1;
  --sidebar-item-height: 29px;
  --reader-max-width: none;
  --composer-width: 900px;
  --unread-font-weight: 730;
  --folder-bg: var(--sidebar);
  --message-bg: var(--panel);
  --reader-bg: var(--panel);
}

html[data-monochrome="true"] {
  --accent: #929a95;
  --accent-strong: #aeb4b0;
  --danger: #9f7775;
  --warning: #9b8e75;
  --success: #879482;
}

html[data-scrollbar-density="normal"] * {
  scrollbar-width: auto;
}

html[data-scrollbar-density="thin"] * {
  scrollbar-width: thin;
}

html[data-scrollbar-density="hidden"] * {
  scrollbar-width: none;
}

html[data-scrollbar-density="hidden"] *::-webkit-scrollbar {
  width: 0;
  height: 0;
}

html[data-show-borders="false"] .folder-pane,
html[data-show-borders="false"] .message-pane,
html[data-show-borders="false"] .pane-toolbar,
html[data-show-borders="false"] .reader-toolbar,
html[data-show-borders="false"] .message-header,
html[data-show-borders="false"] .thread-section,
html[data-show-borders="false"] .attachment-list,
html[data-show-borders="false"] .message-row {
  border-color: transparent !important;
}