/* valentine (default) */
:root {
  --canvas: #F3F1EC;
  --surface: #F8F6F3;
  --raised: #F9F8F6;
  --band: #E9E5DC;
  --image-ground: #ECEAE5;
  --ink: #1C1A17;
  --secondary: #5F5D59;
  --muted: #73716D;
  --border: #D6D3CE;
  --control-border: #888681;
  --accent: #B8312A;
  --on-accent: #FFFFFF;
  --accent-hover: #A71D1A;
  --accent-pressed: #950007;
  --focus: #A71D1A;
  --success: #177B5A;
  --warning: #98610E;
  --error: #9E000D;
}
[data-mode="dark"] {
  --canvas: #1D1A1A;
  --surface: #252222;
  --raised: #2E2B2B;
  --band: #232020;
  --image-ground: #292626;
  --ink: #EBE7E7;
  --secondary: #AEAAAA;
  --muted: #898585;
  --border: #333030;
  --control-border: #747070;
  --accent: #E76E62;
  --on-accent: #1D1A1A;
  --accent-hover: #F57B6E;
  --accent-pressed: #FE8B7E;
  --focus: #E76E62;
  --success: #5BC99E;
  --warning: #F7C15F;
  --error: #E66E6A;
}
[data-mode="contrast"] {
  --canvas: #F3F1EC;
  --surface: #F8F6F3;
  --raised: #F9F8F6;
  --band: #E9E5DC;
  --image-ground: #ECEAE5;
  --ink: #110F0C;
  --secondary: #494843;
  --muted: #706E6A;
  --border: #BFBDB7;
  --control-border: #706E6A;
  --accent: #AB231F;
  --on-accent: #FFFFFF;
  --accent-hover: #9A080D;
  --accent-pressed: #810B0C;
  --focus: #A71D1A;
  --success: #005A4F;
  --warning: #72480A;
  --error: #76031B;
}
[data-mode="contrast-dark"] {
  --canvas: #1D1A1A;
  --surface: #252222;
  --raised: #2E2B2B;
  --band: #232020;
  --image-ground: #292626;
  --ink: #F5F0F0;
  --secondary: #C1BCBC;
  --muted: #898585;
  --border: #454242;
  --control-border: #8C8888;
  --accent: #FC8174;
  --on-accent: #1D1A1A;
  --accent-hover: #FC8174;
  --accent-pressed: #FE8B7E;
  --focus: #FC8174;
  --success: #4ACAAD;
  --warning: #F7C15F;
  --error: #FF9781;
}
:root { --job-available: #2B733D; }
[data-mode="dark"] { --job-available: #83CB90; }
:root { --job-info: #2E5E8C; }
[data-mode="dark"] { --job-info: #8ABCF0; }

/* archive: add data-palette="archive" to the root element */
[data-palette="archive"] {
  --canvas: #F1EFE8;
  --surface: #F5F4F0;
  --raised: #F7F6F3;
  --band: #E7E3D8;
  --image-ground: #EAE8E1;
  --ink: #1C1B16;
  --secondary: #5F5E58;
  --muted: #73716B;
  --border: #D4D1C9;
  --control-border: #888680;
  --accent: #26262A;
  --on-accent: #FFFFFF;
  --accent-hover: #1A1A1E;
  --accent-pressed: #0F0F13;
  --focus: #1A1A1E;
  --success: #177B5A;
  --warning: #98610E;
  --error: #9E000D;
}
[data-palette="archive"][data-mode="dark"] {
  --canvas: #1C1B19;
  --surface: #242321;
  --raised: #2D2C2A;
  --band: #22211E;
  --image-ground: #282725;
  --ink: #E9E8E5;
  --secondary: #ACABA8;
  --muted: #878683;
  --border: #32312F;
  --control-border: #73716F;
  --accent: #98989C;
  --on-accent: #1C1B19;
  --accent-hover: #A4A4A8;
  --accent-pressed: #B1B1B5;
  --focus: #98989C;
  --success: #5BC99E;
  --warning: #F7C15F;
  --error: #E66E6A;
}
[data-palette="archive"][data-mode="contrast"] {
  --canvas: #F1EFE8;
  --surface: #F5F4F0;
  --raised: #F7F6F3;
  --band: #E7E3D8;
  --image-ground: #EAE8E1;
  --ink: #110F0B;
  --secondary: #494842;
  --muted: #6D6C66;
  --border: #BDBBB3;
  --control-border: #6E6C66;
  --accent: #26262A;
  --on-accent: #FFFFFF;
  --accent-hover: #1A1A1E;
  --accent-pressed: #0F0F13;
  --focus: #1A1A1E;
  --success: #085A4B;
  --warning: #6C4301;
  --error: #6D0613;
}
[data-palette="archive"][data-mode="contrast-dark"] {
  --canvas: #1C1B19;
  --surface: #242321;
  --raised: #2D2C2A;
  --band: #22211E;
  --image-ground: #282725;
  --ink: #F3F2EF;
  --secondary: #BFBDBB;
  --muted: #878683;
  --border: #444341;
  --control-border: #8B8A87;
  --accent: #A6A6AA;
  --on-accent: #1C1B19;
  --accent-hover: #A5A5A9;
  --accent-pressed: #B1B1B5;
  --focus: #A6A6AA;
  --success: #4ACAAD;
  --warning: #F7C15F;
  --error: #FF9781;
}
[data-palette="archive"] { --job-available: #3D7859; }
[data-palette="archive"][data-mode="dark"] { --job-available: #8BC8A4; }
[data-palette="archive"] { --job-info: #445B7B; }
[data-palette="archive"][data-mode="dark"] { --job-info: #9FB9DE; }
[data-palette="archive"] { --job-notice: #B8312A; }
[data-palette="archive"][data-mode="dark"] { --job-notice: #FB998C; }

:root {
  --t-xs: 12px;
  --t-sm: 14px;
  --t-base: 16px;
  --t-lg: 21px;
  --t-xl: 28px;
  --t-2xl: 38px;
  --t-3xl: 56px;
  --space-0: 4px;
  --space-1: 8px;
  --space-2: 12px;
  --space-3: 16px;
  --space-4: 24px;
  --space-5: 32px;
  --space-6: 48px;
  --space-7: 64px;
  --space-8: 96px;
  --space-9: 128px;
  --control-h: 44px;
  --radius: 4px;
  --grid-unit: 16px;
  --container-reading: 928px;
  --container-wide: 1160px;
  --motion: 150ms ease-out;
}