/*
 * 집 안의 작은 서버 — 컨셉 스타일
 * WordPress.com 전역 스타일(사용자 레이어)과 같은 값을 정적 사이트에 적용한다.
 * 테마 기본값(:root :where(...))보다 우선하도록 html:root / :root 접두를 쓴다.
 */

/* ---------- 토큰 ---------- */
html:root {
  --wp--preset--color--theme-1: #fff9f0; /* Paper */
  --wp--preset--color--theme-2: #f6e9dc; /* Sand */
  --wp--preset--color--theme-3: #ecdfd1; /* Line */
  --wp--preset--color--theme-4: #42352e; /* Ink */
  --wp--preset--color--theme-5: #533725; /* Deep */
  --wp--preset--color--accent: #af5635;
  --wp--preset--color--muted: #74645a;
  --wp--preset--color--card: #fffdf9;
  --wp--preset--color--line-soft: #f3eae0;

  --lb-font: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, system-ui,
    "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", sans-serif;
  --lb-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, "D2Coding", monospace;
  --wp--preset--font-family--inter: var(--lb-font);
  --wp--preset--font-family--pretendard: var(--lb-font);
  --wp--preset--font-family--mono: var(--lb-mono);

  --wp--preset--font-size--small: 15px;
  --wp--preset--font-size--medium: clamp(17px, 1.0625rem + 0.25vw, 19px);
  --wp--preset--font-size--large: clamp(22px, 1.375rem + 0.5vw, 26px);
  --wp--preset--font-size--x-large: clamp(28px, 1.75rem + 1vw, 36px);
  --wp--preset--font-size--xx-large: clamp(34px, 2.125rem + 1.75vw, 48px);
  --wp--preset--font-size--xxx-large: clamp(40px, 2.5rem + 3vw, 64px);

  --wp--style--global--content-size: 700px;
  --wp--style--global--wide-size: 1080px;
}

/* ---------- 프리셋 클래스 (전역 스타일 CSS가 빠진 정적 렌더링 보정) ---------- */
.has-theme-1-color { color: var(--wp--preset--color--theme-1) !important; }
.has-theme-2-color { color: var(--wp--preset--color--theme-2) !important; }
.has-theme-3-color { color: var(--wp--preset--color--theme-3) !important; }
.has-theme-4-color { color: var(--wp--preset--color--theme-4) !important; }
.has-theme-5-color { color: var(--wp--preset--color--theme-5) !important; }
.has-accent-color { color: var(--wp--preset--color--accent) !important; }
.has-muted-color { color: var(--wp--preset--color--muted) !important; }
.has-card-color { color: var(--wp--preset--color--card) !important; }
.has-line-soft-color { color: var(--wp--preset--color--line-soft) !important; }

.has-theme-1-background-color { background-color: var(--wp--preset--color--theme-1) !important; }
.has-theme-2-background-color { background-color: var(--wp--preset--color--theme-2) !important; }
.has-theme-3-background-color { background-color: var(--wp--preset--color--theme-3) !important; }
.has-theme-4-background-color { background-color: var(--wp--preset--color--theme-4) !important; }
.has-theme-5-background-color { background-color: var(--wp--preset--color--theme-5) !important; }
.has-accent-background-color { background-color: var(--wp--preset--color--accent) !important; }
.has-muted-background-color { background-color: var(--wp--preset--color--muted) !important; }
.has-card-background-color { background-color: var(--wp--preset--color--card) !important; }
.has-line-soft-background-color { background-color: var(--wp--preset--color--line-soft) !important; }

.has-theme-3-border-color { border-color: var(--wp--preset--color--theme-3) !important; }
.has-line-soft-border-color { border-color: var(--wp--preset--color--line-soft) !important; }
.has-accent-border-color { border-color: var(--wp--preset--color--accent) !important; }

.has-small-font-size { font-size: var(--wp--preset--font-size--small) !important; }
.has-medium-font-size { font-size: var(--wp--preset--font-size--medium) !important; }
.has-large-font-size { font-size: var(--wp--preset--font-size--large) !important; }
.has-x-large-font-size { font-size: var(--wp--preset--font-size--x-large) !important; }
.has-xx-large-font-size { font-size: var(--wp--preset--font-size--xx-large) !important; }

/* 섹션 스타일: 안내·목차 상자 */
:root .is-style-section-1 {
  background-color: var(--wp--preset--color--theme-2);
  color: var(--wp--preset--color--theme-4);
}

/* ---------- 본문 ---------- */
:root body {
  background-color: var(--wp--preset--color--theme-1);
  color: var(--wp--preset--color--theme-4);
  font-family: var(--lb-font);
  font-size: 17px;
  line-height: 1.8;
  letter-spacing: -0.01em;
  word-break: keep-all;
  overflow-wrap: break-word;
  -webkit-font-smoothing: antialiased;
}

:root :is(h1, h2, h3, h4, h5, h6, .wp-block-heading, .wp-block-post-title, .wp-block-site-title) {
  font-family: var(--lb-font);
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--wp--preset--color--theme-5);
}
:root h1 { font-size: var(--wp--preset--font-size--x-large); line-height: 1.3; }
:root h2 { font-size: var(--wp--preset--font-size--large); line-height: 1.4; margin-top: 2.6em; margin-bottom: 0.6em; }
:root h3 { font-size: 20px; line-height: 1.45; margin-top: 2em; margin-bottom: 0.5em; }
:root h4 { font-size: 18px; line-height: 1.5; }
/* 크기 클래스가 붙은 제목은 클래스 크기를 따른다 */
:root :is(h1, h2, h3).has-xx-large-font-size { font-size: var(--wp--preset--font-size--xx-large) !important; }
:root :is(h1, h2, h3).has-x-large-font-size { font-size: var(--wp--preset--font-size--x-large) !important; }
:root :is(h1, h2, h3).has-large-font-size { font-size: var(--wp--preset--font-size--large) !important; }

:root a { color: var(--wp--preset--color--accent); text-decoration: underline; text-underline-offset: 0.18em; }
:root a:hover { color: var(--wp--preset--color--theme-5); }
:root :is(h1, h2, h3) a { text-decoration: none; color: inherit; }
:root :is(h1, h2, h3) a:hover { color: var(--wp--preset--color--accent); }

:root :is(.wp-element-button, .wp-block-button__link) {
  background-color: var(--wp--preset--color--accent);
  color: #fff;
  border-radius: 999px;
  font-family: var(--lb-font);
  font-weight: 600;
  font-size: 15px;
  padding: 12px 22px;
}
:root :is(.wp-element-button, .wp-block-button__link):hover { background-color: var(--wp--preset--color--theme-5); color: #fff; }

:root :is(figcaption, .wp-element-caption) {
  color: var(--wp--preset--color--muted);
  font-size: 14px;
  line-height: 1.6;
}

:root .wp-block-image img { border-radius: 12px; }

:root .wp-block-code {
  background-color: var(--wp--preset--color--card);
  color: var(--wp--preset--color--theme-4);
  border: 1px solid var(--wp--preset--color--theme-3);
  border-radius: 12px;
  padding: 18px 20px;
  font-family: var(--lb-mono);
  font-size: 13.5px;
  line-height: 1.65;
  letter-spacing: 0;
  overflow-x: auto;
}
:root :not(pre) > code {
  font-family: var(--lb-mono);
  font-size: 0.9em;
  background: var(--wp--preset--color--line-soft);
  border-radius: 6px;
  padding: 0.1em 0.35em;
  letter-spacing: 0;
}

:root .wp-block-quote {
  border-left: 3px solid var(--wp--preset--color--accent);
  padding-left: 20px;
  font-size: var(--wp--preset--font-size--medium);
}
:root .wp-block-quote cite { color: var(--wp--preset--color--muted); font-size: 14px; font-style: normal; }

:root .wp-block-separator { color: var(--wp--preset--color--theme-3); border-top-width: 1px; }

:root .wp-block-details {
  color: var(--wp--preset--color--muted);
  font-size: 15px;
  line-height: 1.75;
  margin-top: 14px;
}
:root .wp-block-details summary {
  cursor: pointer;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.06em;
  color: var(--wp--preset--color--accent);
}

:root .wp-block-list { padding-left: 1.2em; }

/* ---------- 헤더·푸터·글 정보 ---------- */
:root .wp-block-site-title { font-size: 18px; }
:root .wp-block-site-title a { color: var(--wp--preset--color--theme-5); text-decoration: none; }
:root .wp-block-site-tagline { color: var(--wp--preset--color--muted); font-size: 13px; }
:root .wp-block-navigation { font-size: 15px; font-weight: 500; }
:root .wp-block-navigation a { text-decoration: none; color: var(--wp--preset--color--theme-4); }
:root .wp-block-navigation a:hover { color: var(--wp--preset--color--accent); }

:root .wp-block-post-title { line-height: 1.35; }
:root .wp-block-post-title a { text-decoration: none; color: var(--wp--preset--color--theme-5); }
:root .wp-block-post-date { color: var(--wp--preset--color--muted); font-size: 14px; }
:root .wp-block-post-terms { font-size: 14px; font-weight: 600; }
:root .wp-block-post-terms a { text-decoration: none; }
:root .wp-block-post-excerpt { color: var(--wp--preset--color--muted); font-size: 15px; line-height: 1.7; }

/* 공개되지 않은 글로 가던 링크를 풀어 둔 자리 */
:root .lb-unpublished { color: var(--wp--preset--color--muted); }
:root .lb-unpublished::after { content: " · 공개 예정"; font-size: 0.85em; }
