/* ────────────────────────────────────────────────────────── faces.css — ronbronson.dev: this site's faces, type slots and fallback colours for the Chromatic Editorial System. Load before core.css. palette.js overwrites the colour roles at load; the values here are the static "Snow" fallback for a JS-off render. ────────────────────────────────────────────────────────── */ @font-face { font-family: "Author"; src: url("fonts/author-extralight.woff") format("woff"); font-weight: 200; font-style: normal; font-display: swap; } @font-face { font-family: "Author"; src: url("fonts/author-extralight-italic.woff") format("woff"); font-weight: 200; font-style: italic; font-display: swap; } @font-face { font-family: "Author"; src: url("fonts/author-regular.woff") format("woff"); font-weight: 400; font-style: normal; font-display: swap; } @font-face { font-family: "Author"; src: url("fonts/author-italic.woff") format("woff"); font-weight: 400; font-style: italic; font-display: swap; } @font-face { font-family: "Author"; src: url("fonts/author-semibold.woff") format("woff"); font-weight: 600; font-style: normal; font-display: swap; } @font-face { font-family: "Author"; src: url("fonts/author-semibold-italic.woff") format("woff"); font-weight: 600; font-style: italic; font-display: swap; } @font-face { font-family: "Author"; src: url("fonts/author-bold.woff") format("woff"); font-weight: 700; font-style: normal; font-display: swap; } @font-face { font-family: "Author"; src: url("fonts/author-bold-italic.woff") format("woff"); font-weight: 700; font-style: italic; font-display: swap; } @font-face { font-family: "Switzer"; src: url("fonts/switzer-semibold.woff2") format("woff2"), url("fonts/switzer-semibold.woff") format("woff"); font-weight: 600; font-style: normal; font-display: swap; } @font-face { font-family: "Switzer"; src: url("fonts/switzer-semibold-italic.woff2") format("woff2"), url("fonts/switzer-semibold-italic.woff") format("woff"); font-weight: 600; font-style: italic; font-display: swap; } @font-face { font-family: "RX100"; src: url("fonts/rx100-regular.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; } :root { --bg: #fffbfa; --bg-deeper: #65e1fd; --ink: #252323; --ink-soft: #127463; --rule: #00bd9d; --accent: #cd795b; --field: var(--bg); --on-ink: var(--bg); --digression: var(--ink); --lead: #f78e69; --on-lead: #252323; --deep: #0f7f6c; --on-deep: #fffbfa; --display: "Author", "Times New Roman", Georgia, serif; --deck: "Hanken Grotesk", "Helvetica Neue", Helvetica, Arial, sans-serif; --text: "Hanken Grotesk", "Helvetica Neue", Helvetica, Arial, sans-serif; --sans: var(--text); --mono: "RX100", ui-monospace, SFMono-Regular, Menlo, monospace; --std: var(--deck); --ui: var(--mono); } code { font-family: var(--mono); color: var(--ink-soft); }