/* * Editor canvas styles for Commander1024 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 { /* The canvas may be wide; theme.json constrains normal blocks to contentSize. */ max-width: var(--wp--style--global--wide-size, 1180px); padding: 2rem; margin: 0 auto; background: #f8f5f0; color: #1d1b19; } .editor-styles-wrapper, .editor-styles-wrapper .wp-block { font-family: "Crimson Pro", Georgia, serif; } /* * 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; } /* * theme.json supplies contentSize and wideSize to Gutenberg's root container. * Do not override block alignment geometry here: it also handles full-width blocks * in the editor sidebar and other constrained editor layouts. */ /* The post-title control sits outside Gutenberg's root block container. */ .editor-post-title, .editor-post-title__block { width: 100%; max-width: var(--wp--style--global--wide-size, 1180px) !important; margin-right: auto !important; margin-left: auto !important; } .editor-post-title__input { width: 100%; max-width: none !important; } .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;
}

/* Mirror the frontend rule: block-code text should not receive two relative reductions. */
.editor-styles-wrapper pre code,
.editor-styles-wrapper .wp-block-code code {
  font-size: inherit !important;
}

.editor-styles-wrapper pre,
.editor-styles-wrapper .wp-block-code {
  padding: 1rem 1.2rem;
  overflow: auto;
  border: 1px solid #d5d0c8;
  border-radius: 2px;
  background: #faf8f5;
  color: #272822;
}

.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,
.editor-styles-wrapper .wp-caption-text {
  color: #706a63;
  font-family: "Berkeley Mono", monospace;
  font-size: 1rem;
}

.editor-styles-wrapper hr,
.editor-styles-wrapper .wp-block-separator {
  border: 0;
  border-top: 1px solid #d8d0c6;
}

/* Match frontend previews for core blocks whose structure needs explicit editor styling. */
.editor-styles-wrapper .wp-block-button__link,
.editor-styles-wrapper .wp-element-button {
  border: 1px solid #c3480b;
  border-radius: 2px;
  background: #c3480b;
  color: #fff;
  font-family: "Berkeley Mono", monospace;
  font-size: 1rem;
  letter-spacing: 0.04em;
}

.editor-styles-wrapper .is-style-outline > .wp-block-button__link {
  background: transparent;
  color: #c3480b;
}

.editor-styles-wrapper .wp-block-table {
  overflow-x: auto;
  font-size: 0.85em;
}

.editor-styles-wrapper .wp-block-table table {
  width: 100%;
  border-collapse: collapse;
}

.editor-styles-wrapper .wp-block-table th,
.editor-styles-wrapper .wp-block-table td {
  padding: 0.55em 0.7em;
  border: 1px solid #d8d0c6;
  text-align: left;
}

.editor-styles-wrapper .wp-block-table th {
  font-family: "Berkeley Mono", monospace;
  font-size: 1em;
}

.editor-styles-wrapper .wp-block-quote__citation,
.editor-styles-wrapper .wp-block-pullquote__citation,
.editor-styles-wrapper .wp-block-quote cite,
.editor-styles-wrapper .wp-block-pullquote cite {
  color: #706a63;
  font-family: "Berkeley Mono", monospace !important;
  font-size: 1rem;
  font-style: normal;
}

.editor-styles-wrapper .wp-block-table th,
.editor-styles-wrapper .wp-block-table.is-style-stripes tbody tr:nth-child(odd) {
  background: #fffdf9;
}

.editor-styles-wrapper .wp-block-pullquote {
  padding: 2rem 0;
  border-top: 2px solid #c3480b;
  border-bottom: 2px solid #c3480b;
  text-align: left;
}

.editor-styles-wrapper .wp-block-pullquote blockquote {
  padding: 0;
  border: 0;
  max-width: var(--wp--style--global--content-size, 760px);
  margin: 0 auto;
  color: #1d1b19;
  font-family: "Alpha Lyrae", sans-serif;
  font-size: clamp(1.7rem, 1.3rem + 1.7vw, 2.75rem);
  font-style: normal;
}

.editor-styles-wrapper .wp-block-cover__inner-container {
  max-width: 760px;
}

.editor-styles-wrapper .wp-block-gallery .wp-element-caption {
  margin: 0.5rem 0 0;
}

.editor-styles-wrapper .wp-block-media-text {
  gap: clamp(1rem, 3vw, 2.5rem);
}

.editor-styles-wrapper .wp-block-group.has-background,
.editor-styles-wrapper .wp-block-columns.has-background {
  padding: clamp(1.25rem, 4vw, 3rem);
}