/* DreamHouse 브리핑 — 한국어 가독성 중심 커스텀 테마 (라이트/다크) */
:root {
  --bg: #f7f6f2;
  --surface: #ffffff;
  --surface-2: #f1efe9;
  --text: #1d2026;
  --text-2: #4a505b;
  --muted: #7a808c;
  --border: #e3e0d8;
  --link: #2459c9;
  --link-hover: #163f94;
  --accent: #e8590c;
  --code-bg: #f1efe9;
  --shadow: 0 1px 2px rgba(20, 20, 30, .05), 0 4px 16px rgba(20, 20, 30, .05);
  --c-it: #1c7ed6;
  --c-ai: #7048e8;
  --c-model: #2b8a3e;
  --c-engine: #e8590c;
  --c-github: #495057;
  --c-archive: #868e96;
  --radius: 14px;
  --measure: 46rem;
  --font: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "맑은 고딕", system-ui, sans-serif;
  --mono: ui-monospace, "SFMono-Regular", "JetBrains Mono", "D2Coding", Menlo, Consolas, monospace;
}
:root[data-theme="dark"] {
  --bg: #0f1116;
  --surface: #171a21;
  --surface-2: #1e222b;
  --text: #e7e9ee;
  --text-2: #b9bfca;
  --muted: #8a919e;
  --border: #2a2f3a;
  --link: #7cacff;
  --link-hover: #a9c8ff;
  --accent: #ff922b;
  --code-bg: #1e222b;
  --shadow: 0 1px 2px rgba(0, 0, 0, .3), 0 6px 20px rgba(0, 0, 0, .25);
  --c-it: #4dabf7;
  --c-ai: #9775fa;
  --c-model: #51cf66;
  --c-engine: #ff922b;
  --c-github: #ced4da;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #0f1116;
    --surface: #171a21;
    --surface-2: #1e222b;
    --text: #e7e9ee;
    --text-2: #b9bfca;
    --muted: #8a919e;
    --border: #2a2f3a;
    --link: #7cacff;
    --link-hover: #a9c8ff;
    --accent: #ff922b;
    --code-bg: #1e222b;
    --shadow: 0 1px 2px rgba(0, 0, 0, .3), 0 6px 20px rgba(0, 0, 0, .25);
    --c-it: #4dabf7;
    --c-ai: #9775fa;
    --c-model: #51cf66;
    --c-engine: #ff922b;
    --c-github: #ced4da;
  }
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: 5.5rem; }
body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font-family: var(--font);
  font-size: 17px;
  line-height: 1.8;
  letter-spacing: -0.01em;
  word-break: keep-all;          /* 한국어 어절 단위 줄바꿈 */
  overflow-wrap: break-word;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
a { color: var(--link); text-decoration: none; }
a:hover { color: var(--link-hover); text-decoration: underline; text-underline-offset: 3px; }
.muted { color: var(--muted); }
.wrap { max-width: 72rem; margin: 0 auto; padding: 0 1.25rem; }
.skip { position: absolute; left: -999px; }
.skip:focus { left: 1rem; top: 1rem; background: var(--surface); padding: .5rem 1rem; z-index: 100; }

/* ---------- header ---------- */
.site-header {
  position: sticky; top: 0; z-index: 50;
  background: color-mix(in srgb, var(--bg) 85%, transparent);
  backdrop-filter: saturate(1.6) blur(10px);
  -webkit-backdrop-filter: saturate(1.6) blur(10px);
  border-bottom: 1px solid var(--border);
}
.header-inner { display: flex; align-items: center; gap: 1rem; min-height: 3.6rem; }
/* safe-area (viewport-fit=cover: iPad 홈 화면 웹앱·가로 모드 노치) */
.site-header { padding-top: env(safe-area-inset-top, 0px); }
.site-header .wrap, .brief-bar .wrap, .update-banner { padding-left: max(1.25rem, env(safe-area-inset-left, 0px)); padding-right: max(1.25rem, env(safe-area-inset-right, 0px)); }
.site-footer { padding-bottom: env(safe-area-inset-bottom, 0px); }
/* '←' 뒤로 버튼 (site.js 0) — 터치 영역 44px 이상 */
.back-btn {
  display: inline-flex; align-items: center; justify-content: center; flex: none;
  min-width: 44px; min-height: 44px; margin-left: -.5rem; margin-right: -.6rem; border-radius: 50%;
  color: var(--text-2); font-size: 1.3rem; font-weight: 600; line-height: 1;
  -webkit-tap-highlight-color: transparent;
}
.back-btn[hidden] { display: none; }
.back-btn:hover, .back-btn:focus-visible { text-decoration: none; color: var(--text); background: var(--surface-2); }
.back-btn:active { background: var(--border); }
.back-btn:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; }
.brand { display: inline-flex; align-items: center; gap: .5rem; color: var(--text); font-size: 1.05rem; white-space: nowrap; }
.brand:hover { text-decoration: none; color: var(--text); }
.brand b { font-weight: 800; }
.brand-mark { font-size: 1.25rem; }
.main-nav { display: flex; gap: .15rem; margin-left: auto; overflow-x: auto; scrollbar-width: none; }
.main-nav::-webkit-scrollbar { display: none; }
.main-nav a {
  color: var(--text-2); padding: .35rem .7rem; border-radius: 999px; font-size: .92rem; font-weight: 600; white-space: nowrap;
}
.main-nav a:hover { background: var(--surface-2); text-decoration: none; color: var(--text); }
.main-nav a.active { background: var(--surface); color: var(--text); box-shadow: inset 0 0 0 1px var(--border); }
.main-nav a.nav-it.active { color: var(--c-it); }
.main-nav a.nav-ai.active { color: var(--c-ai); }
.main-nav a.nav-model.active { color: var(--c-model); }
.main-nav a.nav-engine.active { color: var(--c-engine); }
.theme-toggle {
  border: 1px solid var(--border); background: var(--surface); color: var(--text);
  width: 2.2rem; height: 2.2rem; border-radius: 50%; cursor: pointer; font-size: 1rem; flex: none;
}
.theme-toggle:hover { background: var(--surface-2); }
.header-actions { display: flex; align-items: center; gap: .35rem; flex: none; }
.visitors-today {
  font-size: .78rem; font-weight: 600; color: var(--text-2); white-space: nowrap; font-variant-numeric: tabular-nums;
  padding: .2rem .6rem; border: 1px solid var(--border); border-radius: 999px; background: var(--surface-2);
}
.visitors-today[hidden] { display: none; }
.refresh-btn {
  border: 1px solid transparent; background: transparent; color: var(--muted);
  width: 44px; height: 44px; border-radius: 50%; cursor: pointer; font-size: 1.05rem; line-height: 1; flex: none;
}
.refresh-btn:hover, .refresh-btn:focus-visible { color: var(--text); background: var(--surface-2); border-color: var(--border); }
.refresh-btn.is-spinning { animation: dh-spin .8s linear infinite; }
@keyframes dh-spin { to { transform: rotate(360deg); } }
.update-banner {
  position: sticky; top: 0; z-index: 50; display: flex; justify-content: center; align-items: center; gap: .4rem;
  padding: .4rem .75rem; background: color-mix(in srgb, var(--link) 12%, var(--surface));
  border-bottom: 1px solid color-mix(in srgb, var(--link) 35%, var(--border));
}
.update-banner .ub-go {
  border: 1px solid var(--link); background: var(--surface); color: var(--link); cursor: pointer;
  font: inherit; font-size: .9rem; font-weight: 650; padding: .3rem .9rem; border-radius: 999px;
}
.update-banner .ub-go:hover, .update-banner .ub-go:focus-visible { background: var(--link); color: var(--surface); }
.update-banner .ub-close {
  border: 0; background: transparent; color: var(--muted); cursor: pointer; font-size: .95rem; width: 2rem; height: 2rem; border-radius: 50%;
}
.update-banner .ub-close:hover { color: var(--text); background: var(--surface-2); }

/* ---------- briefing bar (같은 날짜 탭) ---------- */
.brief-bar { border-bottom: 1px solid var(--border); background: var(--surface); }
.brief-bar .wrap { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1.25rem; padding-top: .6rem; padding-bottom: .6rem; }
.crumbs { font-size: .9rem; color: var(--muted); }
.crumbs a { color: var(--text-2); font-weight: 600; }
.crumbs span { margin: 0 .3rem; }
.tabs { display: flex; flex-wrap: wrap; gap: .35rem; }
.tab {
  font-size: .88rem; font-weight: 600; padding: .25rem .75rem; border-radius: 999px;
  color: var(--text-2); border: 1px solid var(--border); background: var(--bg);
}
.tab:hover { text-decoration: none; color: var(--text); border-color: var(--muted); }
.tab.active { color: #fff; border-color: transparent; }
.tab-it.active { background: var(--c-it); }
.tab-ai.active { background: var(--c-ai); }
.tab-model.active { background: var(--c-model); }
.tab-engine.active { background: var(--c-engine); }
.tab-github.active { background: var(--c-github); }
:root[data-theme="dark"] .tab.active { color: #0f1116; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .tab.active { color: #0f1116; } }

/* ---------- layout ---------- */
.main { padding-top: 2rem; padding-bottom: 3rem; }
.article-grid { display: grid; grid-template-columns: minmax(0, var(--measure)) 15rem; gap: 3rem; justify-content: center; }
.article-grid:not(:has(.toc:not([hidden]))) { grid-template-columns: minmax(0, var(--measure)); }
@media (max-width: 64rem) {
  .article-grid { grid-template-columns: minmax(0, var(--measure)); }
  .toc { display: none; }
}
.toc { position: relative; }
.toc-inner { position: sticky; top: 5.5rem; max-height: calc(100vh - 7rem); overflow: auto; font-size: .85rem; line-height: 1.5; border-left: 2px solid var(--border); padding-left: 1rem; }
.toc-title { margin: 0 0 .5rem; font-weight: 700; color: var(--muted); font-size: .78rem; letter-spacing: .06em; }
.toc ol { list-style: none; margin: 0; padding: 0; }
.toc li { margin: .35rem 0; }
.toc a { color: var(--text-2); display: block; }
.toc a.active { color: var(--accent); font-weight: 700; }

/* ---------- prose (마크다운 본문) ---------- */
.prose { min-width: 0; }
.prose > :first-child { margin-top: 0; }
.prose h1 { font-size: clamp(1.6rem, 3.2vw, 2.15rem); line-height: 1.35; letter-spacing: -0.03em; font-weight: 800; margin: 0 0 1.25rem; }
.prose h2 {
  font-size: 1.38rem; line-height: 1.45; letter-spacing: -0.02em; font-weight: 750;
  margin: 2.75rem 0 1rem; padding-top: .25rem;
}
.prose h3 { font-size: 1.12rem; font-weight: 700; margin: 2rem 0 .6rem; color: var(--text); }
.prose h4 { font-size: 1rem; margin: 1.5rem 0 .5rem; }
.prose p { margin: 0 0 1.1em; }
.prose strong { font-weight: 700; color: var(--text); }
.prose ul, .prose ol { padding-left: 1.4em; margin: 0 0 1.2em; }
.prose li { margin: .35em 0; }
.prose li::marker { color: var(--muted); }
.prose hr { border: 0; height: 1px; background: var(--border); margin: 2.5rem 0; }
.prose blockquote {
  margin: 0 0 1.75rem; padding: .9rem 1.15rem; border-radius: 10px;
  background: var(--surface-2); border-left: 4px solid var(--accent); color: var(--text-2); font-size: .95rem;
}
.prose blockquote p:last-child, .prose blockquote ul:last-child { margin-bottom: 0; }
.prose a { overflow-wrap: anywhere; word-break: break-all; }
.prose li > a:only-child, .prose td a { word-break: normal; }
.prose code {
  font-family: var(--mono); font-size: .86em; background: var(--code-bg);
  padding: .12em .4em; border-radius: 6px; word-break: break-all;
}
.prose pre {
  background: var(--code-bg); border: 1px solid var(--border); border-radius: 10px;
  padding: 1rem 1.1rem; overflow-x: auto; line-height: 1.55; font-size: .88rem;
}
.prose pre code { background: none; padding: 0; font-size: inherit; word-break: normal; }
.table-wrap { overflow-x: auto; margin: 0 0 1.5rem; border: 1px solid var(--border); border-radius: 10px; background: var(--surface); }
.prose table { border-collapse: collapse; width: 100%; font-size: .92rem; line-height: 1.55; }
.prose th, .prose td { padding: .55rem .8rem; border-bottom: 1px solid var(--border); text-align: left; vertical-align: top; }
.prose th { background: var(--surface-2); font-weight: 700; white-space: nowrap; }
.prose tr:last-child td { border-bottom: 0; }
.prose tbody tr:hover { background: var(--surface-2); }

/* 브리핑 본문: 각 항목(h2)을 카드처럼 */
.is-brief .prose h2 {
  border-top: 1px solid var(--border); padding-top: 2rem;
}
.is-brief .prose h1 + blockquote + hr + h2,
.is-brief .prose hr + h2 { border-top: 0; padding-top: .25rem; }
.is-brief .prose h2 + ul { /* 원문·분야·날짜 메타 */
  list-style: none; padding: .8rem 1rem; margin-bottom: 1.4rem;
  background: var(--surface); border: 1px solid var(--border); border-radius: 10px; font-size: .9rem; line-height: 1.65;
}
.is-brief .prose h2 + ul li { margin: .15rem 0; }
.is-brief .prose h2 + ul strong { color: var(--muted); font-weight: 600; }

/* 브리핑 미디어 — 원문 og:image / 대표 이미지 핫링크 (### 미디어) */
.is-brief .prose img,
.is-brief .prose video,
.is-brief .prose .media img,
.is-brief .prose figure img {
  display: block; max-width: 100%; height: auto;
  border-radius: 12px; border: 1px solid var(--border);
  margin: .75rem 0 .35rem; background: var(--surface-2);
  box-shadow: 0 1px 2px rgba(0,0,0,.05), 0 6px 18px rgba(0,0,0,.06);
}
.is-brief .prose figure, .is-brief .prose .media { margin: .75rem 0 .35rem; max-width: 100%; }
.is-brief .prose figure img, .is-brief .prose .media img { margin: 0; }
.is-brief .prose figcaption { font-size: .82rem; color: var(--muted); margin-top: .35rem; }
.is-brief .prose p:has(> img), .is-brief .prose p:has(> a > img) { margin: 0 0 .35rem; }
.is-brief .prose a:has(> img) { display: block; width: fit-content; max-width: 100%; word-break: normal; }
.is-brief .prose a:has(> img):hover img { border-color: var(--muted); }
/* 이미지 바로 아래 '> 출처:' 줄은 작고 흐린 캡션처럼 */
.is-brief .prose p:has(> img) + blockquote,
.is-brief .prose p:has(> a > img) + blockquote,
.is-brief .prose figure + blockquote,
.is-brief .prose .media + blockquote {
  margin: 0 0 1.5rem; padding: 0; border: 0; border-radius: 0; background: none;
  color: var(--muted); font-size: .82rem; line-height: 1.5;
}
.is-brief .prose p:has(> img) + blockquote p,
.is-brief .prose p:has(> a > img) + blockquote p { margin: 0; }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .is-brief .prose img,
  :root:not([data-theme="light"]) .is-brief .prose video { box-shadow: none; }
}
:root[data-theme="dark"] .is-brief .prose img, :root[data-theme="dark"] .is-brief .prose video { box-shadow: none; }

/* 논조·다른 시각 (### 논조·다른 시각 → site.js 가 .stance 부여) */
.is-brief .prose h3.stance-head { font-size: 1rem; color: var(--text-2); margin-top: 1.6rem; }
.is-brief .prose ul.stance {
  list-style: none; padding: .75rem 1rem; margin: 0 0 1.3rem;
  background: var(--surface-2); border: 1px solid var(--border); border-left: 4px solid var(--muted);
  border-radius: 10px; font-size: .93rem; line-height: 1.65;
}
.is-brief .prose ul.stance > li { margin: .4rem 0; }
.is-brief .prose ul.stance ul { padding-left: 1.1em; margin: .2rem 0 0; list-style: disc; }
.is-brief .prose ul.stance ul li { margin: .25rem 0; }

/* 뉴스 항목별 '🔍 리서치 요청' 버튼 (site.js 4-2) + '심층 리서치' 링크 */
.is-brief .prose li.research-req { margin: .55rem 0 .1rem; padding-top: .55rem; border-top: 1px dashed var(--border); }
.research-btn {
  display: inline-flex; align-items: center; gap: .3rem;
  font-size: .84rem; font-weight: 650; line-height: 1.4; white-space: nowrap; word-break: keep-all !important;
  padding: .28rem .8rem; border-radius: 999px;
  color: var(--text-2); background: var(--bg); border: 1px solid var(--border);
  transition: color .15s ease, border-color .15s ease, background .15s ease;
}
.research-btn:hover, .research-btn:focus-visible {
  text-decoration: none; color: var(--accent); border-color: var(--accent);
  background: color-mix(in srgb, var(--accent) 8%, var(--surface));
}
.research-btn:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
/* 버튼 상태: 📄 리서치 보기(.is-done, 초록 채움) / ⏳ 진행 중(.is-progress, 노랑 점선) / 🔍 요청(기본, 회색 테두리) */
.research-btn.is-done {
  color: var(--c-model); border-color: var(--c-model);
  background: color-mix(in srgb, var(--c-model) 12%, var(--surface));
}
.research-btn.is-done:hover, .research-btn.is-done:focus-visible {
  color: var(--surface); background: var(--c-model); border-color: var(--c-model);
}
.research-btn.is-done:focus-visible { outline-color: var(--c-model); }
.research-btn.is-progress {
  --rp: #9c6500;
  color: var(--rp); border: 1px dashed var(--rp);
  background: color-mix(in srgb, var(--rp) 10%, var(--surface));
}
:root[data-theme="dark"] .research-btn.is-progress { --rp: #fcc419; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .research-btn.is-progress { --rp: #fcc419; } }
.research-btn.is-progress:hover, .research-btn.is-progress:focus-visible {
  color: var(--rp); border-style: solid; border-color: var(--rp);
  background: color-mix(in srgb, var(--rp) 18%, var(--surface));
}
.research-btn.is-progress:focus-visible { outline-color: var(--rp); }
.is-brief .prose li.research-done a { font-weight: 650; }
.is-brief .prose li.research-done strong { color: var(--accent); }
.research-list .rl-meta { color: var(--muted); font-size: .85rem; }
@media print { .research-btn, .research-req { display: none !important; } }

.pager { max-width: calc(var(--measure) + 18rem); margin: 3rem auto 0; display: flex; justify-content: space-between; gap: 1rem; }
.pager a { padding: .6rem 1rem; border: 1px solid var(--border); border-radius: 10px; background: var(--surface); font-weight: 600; }

/* ---------- home ---------- */
.hero { padding: 1rem 0 1.5rem; }
.hero .eyebrow { margin: 0; color: var(--accent); font-weight: 700; font-size: .9rem; letter-spacing: .02em; }
.hero h1 { font-size: clamp(1.8rem, 4.5vw, 2.6rem); line-height: 1.25; letter-spacing: -0.035em; margin: .3rem 0 .6rem; font-weight: 850; }
.hero p.lead { color: var(--text-2); margin: 0; max-width: 42rem; }
.section-title { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; margin: 2.5rem 0 1rem; }
.section-title h2 { font-size: 1.3rem; margin: 0; letter-spacing: -0.02em; }
.section-title a { font-size: .9rem; font-weight: 600; }
.cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 20rem), 1fr)); gap: 1rem; }
.card {
  position: relative; display: flex; flex-direction: column; gap: .4rem;
  background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius);
  padding: 1.15rem 1.25rem 1.2rem; box-shadow: var(--shadow); color: var(--text);
  border-top: 4px solid var(--card-c, var(--accent));
  transition: transform .15s ease, box-shadow .15s ease;
}
a.card:hover { text-decoration: none; transform: translateY(-2px); color: var(--text); }
.card .card-head { display: flex; align-items: center; gap: .5rem; font-weight: 800; font-size: 1.08rem; }
.card .card-head .go { margin-left: auto; color: var(--muted); font-weight: 400; }
.card .card-desc { color: var(--muted); font-size: .82rem; margin: 0; }
.card .card-hl { margin: .2rem 0 0; font-size: .93rem; line-height: 1.7; color: var(--text-2); }
.card-it { --card-c: var(--c-it); }
.card-ai { --card-c: var(--c-ai); }
.card-model { --card-c: var(--c-model); }
.card-engine { --card-c: var(--c-engine); }
.card-github { --card-c: var(--c-github); }
.card.missing { opacity: .55; box-shadow: none; }
.cat-nav { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 12.5rem), 1fr)); gap: .75rem; }
.cat-nav a {
  display: flex; flex-direction: column; padding: .8rem 1rem; border-radius: 12px; background: var(--surface);
  border: 1px solid var(--border); color: var(--text); border-left: 4px solid var(--card-c);
}
.cat-nav a:hover { text-decoration: none; background: var(--surface-2); }
.cat-nav b { font-size: 1rem; }
.cat-nav small { color: var(--muted); font-size: .8rem; }

.archive { list-style: none; padding: 0; margin: 0; border: 1px solid var(--border); border-radius: var(--radius); background: var(--surface); overflow: hidden; }
.archive li { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1rem; padding: .8rem 1.1rem; border-bottom: 1px solid var(--border); }
.archive li:last-child { border-bottom: 0; }
.archive .d { font-weight: 750; font-variant-numeric: tabular-nums; min-width: 8.5rem; }
.archive .d .wd { color: var(--muted); font-weight: 500; }
.archive details { flex-basis: 100%; font-size: .9rem; color: var(--text-2); }
.archive details summary { cursor: pointer; color: var(--muted); font-size: .85rem; }
.archive details ul { margin: .4rem 0 0; padding-left: 1.2rem; line-height: 1.7; }
.chips { display: inline-flex; flex-wrap: wrap; gap: .35rem; }
.chip {
  font-size: .82rem; font-weight: 650; padding: .15rem .65rem; border-radius: 999px;
  border: 1px solid var(--border); color: var(--text-2); background: var(--bg);
}
.chip:hover { text-decoration: none; color: #fff; border-color: transparent; background: var(--chip-c); }
.chip-it { --chip-c: var(--c-it); } .chip-ai { --chip-c: var(--c-ai); } .chip-model { --chip-c: var(--c-model); }
.chip-engine { --chip-c: var(--c-engine); } .chip-github { --chip-c: var(--c-github); }

.date-list { list-style: none; padding: 0; margin: 0; }
.date-list li { padding: 1rem 1.15rem; margin-bottom: .75rem; background: var(--surface); border: 1px solid var(--border); border-radius: 12px; }
.date-list .date-link { font-weight: 750; font-size: 1.05rem; }
.date-list .wd { color: var(--muted); font-weight: 500; }
.date-list .hl { margin: .35rem 0 0; color: var(--text-2); font-size: .93rem; line-height: 1.7; }
.page-head { margin-bottom: 1.5rem; }
.page-head h1 { font-size: clamp(1.6rem, 3.5vw, 2.1rem); letter-spacing: -0.03em; margin: 0 0 .3rem; }
.page-head p { margin: 0; color: var(--text-2); }
.narrow { max-width: var(--measure); margin: 0 auto; }

/* ---------- footer ---------- */
.site-footer { border-top: 1px solid var(--border); padding: 1.75rem 0 2.5rem; font-size: .85rem; color: var(--text-2); }
.site-footer p { margin: .25rem 0; }

@media (max-width: 40rem) {
  body { font-size: 16px; line-height: 1.75; }
  .main { padding-top: 1.25rem; }
}
@media print {
  .site-header, .brief-bar, .toc, .pager, .theme-toggle, .refresh-btn, .update-banner, .back-btn, .visitors-today { display: none !important; }
  body { background: #fff; color: #000; }
}

/* 심층 리서치: 에세이형 본문 (research/*.md 의 .research-essay / .research-lead / .research-refs 만) */
.prose .research-lead { font-size: 1.08rem; line-height: 1.8; color: var(--text); margin: 0 0 1.6rem; }
.prose .research-credit { color: var(--muted); font-size: .82rem; margin-top: -.4rem; }
.prose .research-essay p { line-height: 1.95; margin: 0 0 1.45em; }
.prose .research-essay h2 { margin-top: 2.6rem; }
.prose .research-refs { margin: 1rem 0 0; }
.prose .research-refs > summary { cursor: pointer; font-weight: 700; color: var(--text-2); padding: .4rem 0; }
.prose .research-refs[open] > summary { margin-bottom: .6rem; }

/* ---------- 줄임말·전문용어 자동 풀이 (assets/js/glossary.js, 원본 _data/glossary.yml) ---------- */
.gl-x {
  /* 본문에 직접 쓴 풀이와 똑같이 보이도록 본문 글꼴·크기·색을 그대로 씀 */
  font: inherit; color: inherit; letter-spacing: inherit;
  overflow-wrap: anywhere;
}
@media print { .gl-x { color: #555; } }
/* ---------- 용어집 페이지 (/glossary/) ---------- */
.glossary-page .gl-index { display: flex; flex-wrap: wrap; gap: .3rem; margin: 0 0 1rem; padding: 0; list-style: none; }
.glossary-page .gl-index a { display: inline-block; min-width: 2rem; text-align: center; padding: .2rem .5rem; border-radius: 999px; border: 1px solid var(--border); font-weight: 700; font-size: .85rem; }
.glossary-page .gl-filter { width: 100%; max-width: 26rem; font: inherit; padding: .55rem .8rem; border-radius: 10px; border: 1px solid var(--border); background: var(--surface); color: var(--text); margin: 0 0 1rem; }
.glossary-page .gl-list { margin: 0 0 1.2rem; }
.glossary-page .gl-list dt { font-weight: 800; margin-top: .9rem; scroll-margin-top: 5rem; }
.glossary-page .gl-list dt .gl-full { font-weight: 500; color: var(--text-2); margin-left: .35rem; }
.glossary-page .gl-list dt .gl-off { font-size: .72rem; font-weight: 600; color: var(--muted); margin-left: .35rem; }
.glossary-page .gl-list dd { margin: .15rem 0 0; color: var(--text-2); }
.glossary-page h2[hidden], .glossary-page dl[hidden], .glossary-page dt[hidden], .glossary-page dd[hidden] { display: none; }
.gl-x.gl-in { margin-left: 0; }

/* ---------- 본문 이미지 폭 제한 (리서치 등 .is-brief 아닌 페이지 포함). 표(.table-wrap) 가로 스크롤은 유지 ---------- */
.prose img,
.prose video {
  max-width: 100%;
  height: auto;
}
.prose figure,
.prose a:has(> img) {
  max-width: 100%;
}

/* ---------- 아이패드(~820px)·폰: 헤더 = 로고 줄 + 메뉴 한 줄(넘치면 가로 스크롤, 줄바꿈 없음) ---------- */
@media (max-width: 56rem) {
  .header-inner { flex-wrap: wrap; min-height: 0; padding-top: 0; padding-bottom: 0; gap: 0 .4rem; }
  .brand { font-size: 1rem; min-height: 44px; }
  .header-actions { margin-left: auto; }
  .main-nav {
    order: 3; flex: 0 0 auto; width: calc(100% + .8rem); margin: 0 -.4rem; flex-wrap: nowrap; overflow-x: auto; overflow-y: hidden;
    gap: 0; -webkit-overflow-scrolling: touch; overscroll-behavior-x: contain; scroll-padding: 0 1.5rem;
    max-height: 48px; transition: max-height .2s ease, opacity .2s ease;
  }
  .brief-bar .tabs.fade-r { -webkit-mask-image: linear-gradient(90deg, #000 85%, transparent); mask-image: linear-gradient(90deg, #000 85%, transparent); }
  .brief-bar .tabs.fade-l { -webkit-mask-image: linear-gradient(90deg, transparent, #000 15%); mask-image: linear-gradient(90deg, transparent, #000 15%); }
  .brief-bar .tabs.fade-l.fade-r { -webkit-mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent); mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent); }
  .main-nav.fade-r { -webkit-mask-image: linear-gradient(90deg, #000 85%, transparent); mask-image: linear-gradient(90deg, #000 85%, transparent); }
  .main-nav.fade-l { -webkit-mask-image: linear-gradient(90deg, transparent, #000 15%); mask-image: linear-gradient(90deg, transparent, #000 15%); }
  .main-nav.fade-l.fade-r { -webkit-mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent); mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent); }
  .main-nav a { flex: none; font-size: .88rem; padding: 0 .62rem; min-height: 44px; display: inline-flex; align-items: center; }
  .site-header.nav-hidden .main-nav { max-height: 0; opacity: 0; pointer-events: none; }
  .theme-toggle, .refresh-btn { width: 40px; height: 40px; }
}

/* ===== GitHub 트렌드 카드 (github/YYYY-MM-DD.md, 형식: templates/github-item.md · WORKFLOW 3장 7번) ===== */
.prose .gh-note { font-size: .9rem; color: var(--text-2); }
.gh-flow { background: var(--surface-2); border: 1px solid var(--border); border-radius: var(--radius); padding: .2rem 1.2rem .6rem; margin: 1.2rem 0; }
.gh-flow h2 { margin-top: .9rem; }
.gh-flow p { line-height: 1.85; }
.gh-sec { --gc: var(--c-github); margin: 1.6rem 0; }
.gh-sec-ai { --gc: var(--c-ai); }
.gh-sec-dev { --gc: var(--c-it); }
.gh-sec-infra { --gc: #c92a2a; }
.gh-sec-web { --gc: #d6336c; }
.gh-sec-sys { --gc: var(--c-model); }
:root[data-theme="dark"] .gh-sec-infra { --gc: #ff6b6b; }
:root[data-theme="dark"] .gh-sec-web { --gc: #f783ac; }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .gh-sec-infra { --gc: #ff6b6b; }
  :root:not([data-theme="light"]) .gh-sec-web { --gc: #f783ac; }
}
.gh-sec > h2 { border-left: 5px solid var(--gc); padding-left: .6rem; }
.gh-card {
  background: var(--surface); border: 1px solid var(--border); border-top: 4px solid var(--gc);
  border-radius: var(--radius); box-shadow: var(--shadow);
  padding: .4rem 1.2rem 1rem; margin: 1.1rem 0; min-width: 0; overflow-wrap: anywhere;
}
.gh-card h3 { margin: .7rem 0 .4rem; font-size: 1.15rem; }
.gh-card h3 a { color: var(--text); text-decoration: none; }
.gh-card h3 a:hover { color: var(--gc); text-decoration: underline; }
.gh-badges { display: flex; flex-wrap: wrap; gap: .35rem; margin: .3rem 0 .6rem; }
.gb {
  display: inline-flex; align-items: center; gap: .2rem; font-size: .78rem; line-height: 1.3;
  padding: .18rem .55rem; border-radius: 999px; background: var(--surface-2);
  border: 1px solid var(--border); color: var(--text-2); white-space: nowrap;
}
.gb-lang { background: var(--gc); border-color: var(--gc); color: #fff; font-weight: 600; }
:root[data-theme="dark"] .gb-lang { color: #111; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .gb-lang { color: #111; } }
.gb-star { font-weight: 600; color: var(--text); }
.gb-up { color: var(--c-model); font-weight: 600; }
.gb-streak { color: var(--accent); }
.gb-new { background: var(--accent); border-color: var(--accent); color: #fff; font-weight: 700; }
.gh-actions { margin: .2rem 0 .7rem; }
.gh-card img.gh-img, .gh-card .gh-img img {
  display: block; width: 100%; max-width: 100%; height: auto; max-height: 300px; object-fit: cover;
  border-radius: 10px; border: 1px solid var(--border); background: var(--surface-2); margin: .3rem 0 .8rem;
}
.gh-card p { line-height: 1.8; }
.gh-card .gh-lead { font-size: 1.02rem; font-weight: 600; color: var(--text); border-left: 3px solid var(--gc); padding-left: .7rem; }
.gh-card .gh-warn { background: color-mix(in srgb, var(--accent) 9%, transparent); border-radius: 8px; padding: .55rem .75rem; }
.gh-card ul { padding-left: 1.1rem; }
.gh-card li.research-done { list-style: none; margin-left: -1.1rem; }
.prose .gh-h3 { margin-top: 1.4rem; }
@media (max-width: 900px) {
  .gh-card { padding: .3rem 1rem .9rem; }
}
@media (max-width: 480px) {
  .gh-card { padding: .2rem .8rem .8rem; border-radius: 10px; }
  .gh-card h3 { font-size: 1.02rem; }
  .gb { font-size: .72rem; padding: .15rem .45rem; white-space: normal; }
  .gh-flow { padding: .1rem .85rem .5rem; }
  .gh-card img.gh-img { max-height: 200px; }
}

/* ---------- 본문 끝: 다음 파트 + 파트 탭 ---------- */
.part-end { max-width: calc(var(--measure) + 18rem); margin: 3rem auto 0; padding-top: 1.5rem; border-top: 1px solid var(--border); display: flex; flex-direction: column; gap: .9rem; }
.next-part {
  display: flex; flex-direction: column; justify-content: center; min-height: 64px; padding: .8rem 1.2rem;
  border-radius: 14px; border: 1px solid var(--border); background: var(--surface); color: var(--text);
  border-left: 6px solid var(--accent);
}
.next-part:hover { text-decoration: none; border-color: var(--muted); }
.next-part small { color: var(--muted); font-size: .85rem; font-weight: 600; }
.next-part span { font-size: 1.2rem; font-weight: 800; }
.next-it { border-left-color: var(--c-it); } .next-ai { border-left-color: var(--c-ai); }
.next-model { border-left-color: var(--c-model); } .next-engine { border-left-color: var(--c-engine); }
.next-github { border-left-color: var(--c-github); }
.part-end .tabs { gap: .5rem; }
.part-end .tab { min-height: 44px; display: inline-flex; align-items: center; padding: .4rem 1rem; font-size: .95rem; }
.part-end + .pager { margin-top: 1.25rem; }
.pager a { min-height: 44px; display: inline-flex; align-items: center; }
@media (max-width: 40rem) {
  .part-end .tabs { display: grid; grid-template-columns: repeat(3, 1fr); }
  .part-end .tab { justify-content: center; padding: .4rem .5rem; }
}
@media print { .part-end { display: none !important; } }

/* ---------- 통계 페이지 (stats/) ---------- */
.stats-page { max-width: 52rem; margin: 0 auto; }
.stats-head h1 { margin: .2rem 0 .3rem; font-size: clamp(1.6rem, 4vw, 2.1rem); letter-spacing: -0.03em; }
.stats-head .lead { color: var(--text-2); margin: 0 0 1.25rem; }
.stats-cards { display: grid; grid-template-columns: repeat(4, 1fr); gap: .6rem; }
.stat-card { background: var(--surface); border: 1px solid var(--border); border-radius: 14px; padding: .8rem 1rem; }
.stat-card small { display: block; color: var(--muted); font-weight: 600; font-size: .85rem; }
.stat-card b { font-size: 1.7rem; font-weight: 850; letter-spacing: -0.02em; color: var(--text); }
.stats-page h2 { font-size: 1.15rem; margin: 1.8rem 0 .7rem; }
.stats-chart { background: var(--surface); border: 1px solid var(--border); border-radius: 14px; padding: 1rem .8rem .4rem; }
.stats-chart svg { width: 100%; height: 190px; display: block; overflow: visible; }
.stats-chart .bar { fill: var(--accent); opacity: .55; }
.stats-chart .bar.today { opacity: 1; }
.stats-chart text { fill: var(--text-2); font-size: 7px; font-weight: 700; }
.stats-chart text.ax { fill: var(--muted); font-weight: 500; }
.stats-chart .base { stroke: var(--border); stroke-width: 1; }
.stats-top { list-style: none; padding: 0; margin: 0; counter-reset: t; }
.stats-top li { counter-increment: t; display: grid; grid-template-columns: 1.6rem minmax(0, 1fr) 30% 2.5rem; align-items: center; gap: .6rem; min-height: 44px; border-bottom: 1px solid var(--border); }
.stats-top li::before { content: counter(t); color: var(--muted); font-weight: 700; text-align: right; }
.stats-top li.muted { display: block; }
.stats-top li.muted::before { content: none; }
.stats-top a { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 600; }
.stats-top .tb { height: 8px; background: var(--surface-2); border-radius: 99px; overflow: hidden; }
.stats-top .tb i { display: block; height: 100%; background: var(--accent); border-radius: 99px; }
.stats-top b { text-align: right; }
.stats-note { margin-top: 1.8rem; padding: 1rem 1.1rem; background: var(--surface); border: 1px solid var(--border); border-radius: 14px; font-size: .93rem; color: var(--text-2); }
.stats-note p { margin: .4rem 0; }
.stats-dash { display: inline-flex; align-items: center; min-height: 44px; font-weight: 700; }
@media (max-width: 40rem) {
  .stats-cards { grid-template-columns: repeat(2, 1fr); }
  .stats-chart svg { height: 160px; }
  .stats-top li { grid-template-columns: 1.4rem minmax(0, 1fr) 22% 2rem; gap: .45rem; }
}

/* ---------- 푸터 링크 줄 (용어·통계·문서) ---------- */
.footer-nav { display: flex; flex-wrap: wrap; gap: .5rem; margin: 0 0 1rem; }
.footer-nav a {
  display: inline-flex; align-items: center; min-height: 44px; padding: 0 1.1rem; border-radius: 999px;
  border: 1px solid var(--border); background: var(--surface); color: var(--text-2); font-weight: 650; font-size: .95rem;
}
.footer-nav a:hover { text-decoration: none; color: var(--text); border-color: var(--muted); }
.footer-nav a.active { background: var(--accent); border-color: transparent; color: #fff; }
:root[data-theme="dark"] .footer-nav a.active { color: #0f1116; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .footer-nav a.active { color: #0f1116; } }
.site-footer .muted a { display: inline-block; padding: .3rem 0; }
.site-footer { padding-left: env(safe-area-inset-left, 0px); padding-right: env(safe-area-inset-right, 0px); padding-bottom: max(2.5rem, env(safe-area-inset-bottom, 0px)); }

/* ---------- 폰 가독성: 넘침 방지 ---------- */
html, body { overflow-x: clip; }
.prose pre { overflow-x: auto; max-width: 100%; }
.table-wrap { overflow-x: auto; max-width: 100%; -webkit-overflow-scrolling: touch; }
.prose img, .prose video, .prose iframe, .prose svg { max-width: 100%; height: auto; }
.prose a.url-short { word-break: normal; }
.article-grid, .prose, .gh-card, .stat-card { min-width: 0; }
@media (max-width: 40rem) {
  .wrap { padding-left: max(1rem, env(safe-area-inset-left, 0px)); padding-right: max(1rem, env(safe-area-inset-right, 0px)); }
  .prose table { font-size: .85rem; }
  .gh-card { padding-left: .9rem; padding-right: .9rem; }
  .stats-top li { grid-template-columns: 1.4rem minmax(0, 1fr) 2rem; grid-template-areas: "n a c" "n b b"; row-gap: .2rem; padding: .5rem 0; }
  .stats-top li::before { grid-area: n; align-self: start; }
  .stats-top a { grid-area: a; white-space: normal; overflow: visible; line-height: 1.4; }
  .stats-top b { grid-area: c; align-self: start; }
  .stats-top .tb { grid-area: b; }
  .part-end .tabs { grid-template-columns: repeat(auto-fit, minmax(6.2rem, 1fr)); }
  .footer-nav a { flex: 1 1 0; justify-content: center; padding: 0 .6rem; }
}
.stats-top a { white-space: normal; }

/* 폰: 로고 줄 한 줄 유지 (← · 로고 · 배지·↻·테마) + 같은 날짜 탭도 한 줄 가로 스크롤 */
html { overflow-anchor: none; }
@media (max-width: 40rem) {
  .site-header .wrap { padding-left: max(.6rem, env(safe-area-inset-left, 0px)); padding-right: max(.6rem, env(safe-area-inset-right, 0px)); }
  .header-inner { flex-wrap: wrap; gap: 0 .25rem; }
  .back-btn { margin-left: -.25rem; margin-right: -.5rem; }
  .brand { font-size: .95rem; gap: .3rem; min-width: 0; }
  .brand-mark { font-size: 1.1rem; }
  .header-actions { gap: .15rem; }
  .visitors-today { font-size: .72rem; padding: .15rem .45rem; }
  .brief-bar .wrap { gap: .3rem; padding-top: .4rem; padding-bottom: .4rem; }
  .brief-bar .tabs { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; width: 100%; padding-bottom: 2px; }
  .brief-bar .tabs::-webkit-scrollbar { display: none; }
  .brief-bar .tab { flex: none; min-height: 44px; display: inline-flex; align-items: center; }
}

/* ── 주간 브리핑 매거진 스타일 (2026-10-18) ──
   weekly/*.md에서 쓰는 이미지 클래스. kramdown IAL: ![alt](url){: .weekly-img } */
.weekly-img {
  display: block;
  width: 100%;
  max-height: 26rem;
  object-fit: cover;
  border-radius: .75rem;
  margin: 1.25rem 0 .4rem;
  box-shadow: 0 2px 12px rgba(0,0,0,.10);
}
.weekly-hero {
  display: block;
  width: 100%;
  max-height: 30rem;
  object-fit: cover;
  border-radius: .9rem;
  margin: 1.5rem 0 .4rem;
  box-shadow: 0 4px 20px rgba(0,0,0,.14);
}
/* 이미지 바로 뒤 출처 캡션: "> 📷 출처: 매체명" */
p:has(> img.weekly-img),
p:has(> img.weekly-hero) { margin-bottom: .25rem; }
p:has(> img.weekly-img) + blockquote,
p:has(> img.weekly-hero) + blockquote {
  font-size: .82rem;
  color: var(--muted, #6b7280);
  border-left: none;
  padding-left: 0;
  margin-top: 0;
  text-align: right;
}
@media (max-width: 40rem) {
  .weekly-img, .weekly-hero { border-radius: .6rem; max-height: 18rem; }
}

/* Entry point for the standalone daily presentation. */
.day-promo { margin: 1.5rem 0; border-color: var(--c-model); }
.day-promo strong { display: block; font-size: 1.2rem; }
.day-promo span { display: block; margin-top: .4rem; color: var(--text-2); }