/* * Editor canvas styles for Commander 1024 2026. * These font URLs are relative to this stylesheet in the theme root. */ @font-face { font-family: "Alpha Lyrae"; src: url("fonts/AlphaLyrae-Medium.woff2") format("woff2"); font-weight: 500; font-style: normal; font-display: swap; } @font-face { font-family: "Crimson Pro"; src: url("fonts/crimson-pro-latin-wght-normal.woff2") format("woff2"); font-weight: 200 900; font-style: normal; font-display: swap; } @font-face { font-family: "Crimson Pro"; src: url("fonts/crimson-pro-latin-wght-italic.woff2") format("woff2"); font-weight: 200 900; font-style: italic; font-display: swap; } @font-face { font-family: "Berkeley Mono"; src: url("fonts/BerkeleyMono-Regular.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; } @font-face { font-family: "Berkeley Mono"; src: url("fonts/BerkeleyMono-Bold.woff2") format("woff2"); font-weight: 700; font-style: normal; font-display: swap; } /* Match the frontend's light canvas. The admin chrome is intentionally untouched. */ body.editor-styles-wrapper { max-width: 760px; padding: 2rem; margin: 0 auto; background: #f8f5f0; color: #1d1b19; font-family: "Crimson Pro", Georgia, serif; font-size: clamp(1.25rem, 1.1rem + 0.4vw, 1.5rem); font-weight: 400; line-height: 1.55; } .editor-styles-wrapper, .editor-styles-wrapper .wp-block { font-family: "Crimson Pro", Georgia, serif; } .editor-styles-wrapper .wp-block { max-width: 760px; } /* * Gutenberg's visual editor uses this wrapper (rather than ) as its canvas. * Apply the frontend reading scale here so blocks do not inherit the admin's 16px UI size. */ .editor-styles-wrapper { color: #1d1b19; font-family: "Crimson Pro", Georgia, serif !important; font-size: clamp(1.25rem, 1.1rem + 0.4vw, 1.5rem) !important; font-weight: 400; line-height: 1.55 !important; } /* Core block controls may set an admin UI face and size instead of inheriting from the canvas. */ .editor-styles-wrapper .wp-block-paragraph, .editor-styles-wrapper .wp-block-paragraph .block-editor-rich-text__editable, .editor-styles-wrapper .wp-block-list, .editor-styles-wrapper .wp-block-list .block-editor-rich-text__editable { font-family: "Crimson Pro", Georgia, serif !important; font-size: inherit !important; line-height: inherit !important; } .editor-styles-wrapper .wp-block[data-align="wide"] { max-width: 1180px; } .editor-styles-wrapper .wp-block[data-align="full"] { max-width: none; } .editor-styles-wrapper a { color: #c3480b; text-decoration-thickness: 0.08em; text-underline-offset: 0.14em; } .editor-styles-wrapper a:hover, .editor-styles-wrapper a:focus { color: #8f3508; } .editor-styles-wrapper h1, .editor-styles-wrapper h2, .editor-styles-wrapper h3, .editor-styles-wrapper h4, .editor-styles-wrapper .editor-post-title__input, .editor-post-title__input, .editor-post-title .editor-post-title__input, .editor-styles-wrapper .wp-block-heading .block-editor-rich-text__editable, .editor-styles-wrapper .wp-block-heading [contenteditable="true"] { /* Gutenberg assigns editor UI font families to these controls unless overridden. */ font-family: "Alpha Lyrae", sans-serif !important; font-weight: 500; line-height: 1.16; letter-spacing: 0.025em; } .editor-styles-wrapper h1 { font-size: clamp(2.25rem, 1.5rem + 3vw, 4rem); } .editor-styles-wrapper h2 { margin-top: 2em; font-size: 1.55em; } .editor-styles-wrapper h3 { margin-top: 1.8em; font-size: 1.25em; } .editor-styles-wrapper p, .editor-styles-wrapper ul, .editor-styles-wrapper ol, .editor-styles-wrapper figure { margin-top: 0; margin-bottom: 1.3em; } .editor-styles-wrapper ul, .editor-styles-wrapper ol { padding-left: 1.3em; } .editor-styles-wrapper blockquote { padding: 0.35rem 1.25rem; border-left: 4px solid #c3480b; margin-left: 0; color: #706a63; font-style: italic; } .editor-styles-wrapper code, .editor-styles-wrapper pre, .editor-styles-wrapper .wp-block-code textarea, .editor-styles-wrapper .wp-block-code .block-editor-rich-text__editable, .editor-styles-wrapper .wp-block-code .block-editor-plain-text, .editor-styles-wrapper .wp-block-preformatted .block-editor-rich-text__editable { /* Code blocks use editable controls rather than a rendered element. */ font-family: "Berkeley Mono", monospace !important; font-size: 0.8em; } .editor-styles-wrapper pre, .editor-styles-wrapper .wp-block-code { padding: 1rem 1.2rem; overflow: auto; border-radius: 2px; background: #282623; color: #f5eee5; } .editor-styles-wrapper :not(pre) > code { padding: 0.1em 0.3em; border: 1px solid #d8d0c6; border-radius: 2px; background: #fffdf9; } .editor-styles-wrapper .wp-element-caption { color: #706a63; font-family: "Berkeley Mono", monospace; font-size: 0.68rem; } .editor-styles-wrapper hr, .editor-styles-wrapper .wp-block-separator { border: 0; border-top: 1px solid #d8d0c6; }