/* ============================================================
   Epiktetos — Editor CSS
   Mirrors the ThoughtStream reading experience inside the
   block editor so authoring matches the rendered frontend.
   ============================================================ */

:root {
	--ts-primary: #78716C;
	--ts-tertiary: #1C1917;
	--ts-background: #FAFAF9;
	--ts-surface: #F5F5F4;
	--ts-text-primary: #1C1917;
	--ts-text-secondary: #57534E;
	--ts-text-tertiary: #A8A29E;
	--ts-border-subtle: #E7E5E4;
	--ts-border-strong: #A8A29E;
	--ts-font-display: "Libre Baskerville", Georgia, "Times New Roman", serif;
	--ts-font-body: Inter, -apple-system, "Segoe UI", Helvetica, sans-serif;
	--ts-font-mono: "Source Code Pro", "Fira Code", Consolas, monospace;
	--ts-space-1: 12px;
	--ts-space-2: 24px;
	--ts-space-3: 36px;
	--ts-content-width: 680px;
}

.editor-styles-wrapper {
	background-color: var(--ts-background);
	color: var(--ts-text-primary);
	font-family: var(--ts-font-body);
	font-size: 17px;
	line-height: 1.8;
}

.editor-styles-wrapper h1,
.editor-styles-wrapper h2,
.editor-styles-wrapper h3,
.editor-styles-wrapper h4,
.editor-styles-wrapper h5,
.editor-styles-wrapper h6 {
	font-family: var(--ts-font-display);
	color: var(--ts-text-primary);
	font-weight: 700;
}

.editor-styles-wrapper h1 { font-size: 40px; line-height: 1.2; letter-spacing: -0.02em; }
.editor-styles-wrapper h2 { font-size: 30px; line-height: 1.3; letter-spacing: -0.015em; }
.editor-styles-wrapper h3 { font-size: 22px; line-height: 1.4; letter-spacing: -0.01em; font-weight: 400; }

.editor-styles-wrapper p { line-height: 1.8; }

.editor-styles-wrapper a {
	color: var(--ts-primary);
	text-decoration: underline;
	text-underline-offset: 0.18em;
}

.editor-styles-wrapper blockquote {
	border-left: 2px solid var(--ts-border-strong);
	padding-left: var(--ts-space-2);
	font-family: var(--ts-font-display);
	font-style: italic;
	color: var(--ts-text-secondary);
}

.editor-styles-wrapper code,
.editor-styles-wrapper pre {
	font-family: var(--ts-font-mono);
	background-color: var(--ts-surface);
	border: 1px solid var(--ts-border-subtle);
}

.editor-styles-wrapper pre { padding: var(--ts-space-2); }

.editor-styles-wrapper .alignwide {
	max-width: min(960px, 100%);
}

.editor-styles-wrapper .alignfull {
	max-width: none;
}

.editor-styles-wrapper .wp-block-image img,
.editor-styles-wrapper .wp-block-gallery img {
	max-width: 100%;
	height: auto;
}

.editor-styles-wrapper .wp-block-gallery {
	gap: var(--ts-space-1);
}

.editor-styles-wrapper .wp-block-quote,
.editor-styles-wrapper .wp-block-pullquote {
	border-color: var(--ts-border-strong);
}

.editor-styles-wrapper .wp-block-pullquote {
	padding: var(--ts-space-2) 0;
	color: var(--ts-text-secondary);
}

.editor-styles-wrapper .wp-block-embed iframe {
	max-width: 100%;
}

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

.editor-styles-wrapper .wp-block-table th,
.editor-styles-wrapper .wp-block-table td {
	border: 1px solid var(--ts-border-subtle);
	padding: 10px 12px;
}

.editor-styles-wrapper .wp-block-button__link {
	border-radius: 0;
	background-color: var(--ts-primary);
	color: var(--ts-background);
	font-family: var(--ts-font-body);
	font-weight: 600;
	text-decoration: none;
}
