/* Cairn tokens — common.css :root 이관 + signal 편입 (Apollo R1 §4-1, 2026-05-29) */
:root {
  --bg:#0F1511; --text:#EDE6D6; --accent:#6B7A5A;
  --line:rgba(107,122,90,0.22); --muted:rgba(237,230,214,0.55);
  --paper-tint: rgba(237, 230, 214, 0.07);
  --hairline: rgba(237, 230, 214, 0.15);
  --serif: 'Cormorant Garamond', 'MaruBuri', Georgia, serif;
  --serif-kr: 'MaruBuri', Georgia, serif;
  --sans-kr: 'NanumSquareNeo', 'DM Sans', sans-serif;
  --mono: 'JetBrains Mono', 'SF Mono', Menlo, monospace;
  --grain-opacity: 0.03;
  --tr-instant: 150ms ease-out; --tr-subtle: 400ms ease-out;
  --tr-reveal: 480ms ease-out; --tr-stagger: 60ms;
  --radius: 2px;
  /* P0-F: signal 편입 (status.html:11-16 verbatim) */
  --signal-warn:#B86A4E; --signal-warn-tint:rgba(184,106,78,0.10); --signal-warn-line:rgba(184,106,78,0.42);
  --signal-ok:#7A9168; --signal-ok-tint:rgba(122,145,104,0.10); --signal-ok-line:rgba(122,145,104,0.42);
  /* spacing scale (common.css §4.5 verbatim 이관) */
  --space-1:4px; --space-2:8px; --space-3:12px; --space-4:16px; --space-6:24px;
  --space-7:28px; --space-8:32px; --space-12:48px; --space-14:56px; --space-16:64px;
  /* opacity·surface·fs scale (common.css §3.1·§3.3·§2.3 verbatim 이관) */
  --o-primary:1.0; --o-secondary:0.78; --o-tertiary:0.56; --o-quaternary:0.40;
  --surface-0:var(--bg); --surface-1:rgba(237,230,214,0.04); --surface-2:rgba(237,230,214,0.07);
  --fs-9:9px; --fs-11:11px; --fs-13:13px; --fs-15:15px; --fs-16:16px;
}
/* Cairn base — fonts·reset·body·chrome·foot-nav·typography·a11y (Apollo R1, 2026-05-29) */
/* common.css verbatim 이관 + status.html base 통합 + Apollo P0-A·B·C·D·E */

/* === @font-face (common.css:3-78 verbatim) === */
@font-face { font-family: 'Cormorant Garamond'; font-style: italic; font-weight: 400; font-display: swap; src: url('/fonts/CormorantGaramond-Italic.woff2') format('woff2'); }
@font-face { font-family: 'Cormorant Garamond'; font-style: normal; font-weight: 400; font-display: swap; src: url('/fonts/CormorantGaramond-Regular.woff2') format('woff2'); }
@font-face { font-family: 'Cormorant Garamond'; font-style: normal; font-weight: 600; font-display: swap; src: url('/fonts/CormorantGaramond-SemiBold.woff2') format('woff2'); }
@font-face { font-family: 'JetBrains Mono'; font-style: normal; font-weight: 400; font-display: swap; src: url('/fonts/JetBrainsMono-Regular.woff2') format('woff2'); }
@font-face { font-family: 'DM Sans'; font-style: normal; font-weight: 400; font-display: swap; src: url('/fonts/DMSans-Regular.woff2') format('woff2'); }
/* Cairn 5-stack — 한글 serif MaruBuri · 한글 sans NanumSquareNeo · self-host /fonts/ (CSP font-src 'self') */
@font-face { font-family: 'MaruBuri'; font-style: normal; font-weight: 300; font-display: swap; src: url('/fonts/MaruBuri-Light.woff2') format('woff2'); unicode-range: U+AC00-D7A3, U+1100-11FF, U+3130-318F, U+3000-303F, U+FF00-FFEF; }
@font-face { font-family: 'MaruBuri'; font-style: normal; font-weight: 400; font-display: swap; src: url('/fonts/MaruBuri-Regular.woff2') format('woff2'); unicode-range: U+AC00-D7A3, U+1100-11FF, U+3130-318F, U+3000-303F, U+FF00-FFEF; }
@font-face { font-family: 'MaruBuri'; font-style: normal; font-weight: 700; font-display: swap; src: url('/fonts/MaruBuri-Bold.woff2') format('woff2'); unicode-range: U+AC00-D7A3, U+1100-11FF, U+3130-318F, U+3000-303F, U+FF00-FFEF; }
@font-face { font-family: 'NanumSquareNeo'; font-style: normal; font-weight: 400; font-display: swap; src: url('/fonts/NanumSquareNeo-Regular.woff2') format('woff2'); unicode-range: U+AC00-D7A3, U+1100-11FF, U+3130-318F, U+3000-303F, U+FF00-FFEF; }
@font-face { font-family: 'NanumSquareNeo'; font-style: normal; font-weight: 700; font-display: swap; src: url('/fonts/NanumSquareNeo-Bold.woff2') format('woff2'); unicode-range: U+AC00-D7A3, U+1100-11FF, U+3130-318F, U+3000-303F, U+FF00-FFEF; }

/* === reset (status.html:19-20 통합 — common.css는 reset 부재였음) === */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html, body { height: 100%; }

/* === body typography (status.html:21 verbatim) === */
body {
  background: var(--bg); color: var(--text); font-family: var(--sans-kr);
  min-height: 100dvh; -webkit-tap-highlight-color: transparent; -webkit-text-size-adjust: 100%;
  word-break: keep-all; overflow-wrap: anywhere; line-height: 1.75; letter-spacing: -0.005em;
}
body.embedded .foot-nav, body.embedded .corner, body.embedded .gutter-line, body.embedded .catalog-footer, body.embedded .logout-btn { display: none; }
body.embedded main { padding-top: 32px; padding-bottom: 48px; }

/* === main SSOT (Apollo P0-E · status.html:24·63 verbatim) === */
main { padding: 96px 28px 160px; max-width: 1100px; margin: 0 auto; position: relative; }
@media (max-width: 479px) { main { padding: 64px 16px 160px; } }

/* === grain overlay (status.html:69 verbatim) === */
.grain-overlay { position: fixed; inset: 0; pointer-events: none; opacity: var(--grain-opacity); filter: url(#grain-svg); background: var(--text); z-index: 0; }

/* === chrome: gutter·corner-serif (common.css:151-152 verbatim) === */
.gutter-line { position: fixed; top: 0; left: 28px; width: 1px; height: 100dvh; background: var(--text); opacity: 0.1; z-index: 1; pointer-events: none; }
.corner-serif { position: fixed; top: 28px; left: 28px; font-family: var(--serif); font-style: italic; font-size: 13px; letter-spacing: 0.02em; color: var(--text); opacity: 0.7; z-index: 20; pointer-events: none; }

/* === corner labels (common.css:96-106) === */
.corner { position: fixed; font-family: var(--mono); font-size: 11px; letter-spacing: 0.35em; color: var(--text); opacity: 0.5; z-index: 5; text-transform: uppercase; }
.top-left { top: 32px; left: 32px; }

/* === logout button (admin SSOT — LogoutButton.astro · 기존 페이지별 .logout/.chip 통합) === */
.logout-btn { position: fixed; top: 28px; right: 28px; z-index: 30; font-family: var(--mono); font-size: 10px; letter-spacing: 0.28em; text-transform: uppercase; color: var(--accent); text-decoration: none; border: 1px solid rgba(107,122,90,0.4); padding: 10px 18px; border-radius: var(--radius); transition: border-color var(--tr-instant), color var(--tr-instant); display: inline-flex; align-items: center; min-height: 32px; }
.logout-btn:hover { border-color: var(--text); color: var(--text); }
@media (max-width: 768px) { .logout-btn { top: 16px; right: 16px; font-size: 9px; letter-spacing: 0.2em; padding: 8px 12px; } }

/* === foot-nav (common.css:108-148 verbatim — morven 기준 nav) === */
.foot-nav {
  position: fixed; bottom: 0; left: 0; right: 0; z-index: 50;
  display: flex; flex-wrap: wrap; gap: 14px;
  font-family: var(--mono); font-size: 12px; letter-spacing: 0.1em; text-transform: uppercase;
  align-items: center; padding: 14px 28px calc(14px + env(safe-area-inset-bottom));
  background: rgba(237, 230, 214, 0.08);
  backdrop-filter: blur(16px) saturate(1.2); -webkit-backdrop-filter: blur(16px) saturate(1.2);
  border-top: 1px solid rgba(107, 122, 90, 0.28);
}
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) { .foot-nav { background: rgba(15, 21, 17, 0.92); } }
.foot-nav a { color: #6B7A5A; text-decoration: none; opacity: 0.82; padding: 6px 2px; min-height: 32px; display: inline-flex; align-items: center; }
.foot-nav a:hover { color: #EDE6D6; opacity: 1; }
.foot-nav a.active { color: #EDE6D6; opacity: 1; pointer-events: none; }
.foot-nav .sep { color: rgba(107, 122, 90, 0.4); font-size: 9px; letter-spacing: 0.4em; }

/* === section rhythm (common.css §1.1 verbatim) === */
.section { margin-bottom: 48px; }
.section[data-bucket="today"]     { margin-bottom: 56px; }
.section[data-bucket="yesterday"] { margin-bottom: 48px; }
.section[data-bucket="past7"]     { margin-bottom: 44px; }
.section[data-bucket="past30"]    { margin-bottom: 40px; }
.section[data-bucket="archive"]   { margin-bottom: 32px; }

/* === page hero global SSOT (Apollo P0-A·B·C·D) === */
/* P0-A: page-title 라이브 회귀 0 — common.css:428-437 verbatim 유지 (PLAN 40-64px 폐기) */
h1.page-title, .page-title {
  font-family: var(--serif); font-style: italic; font-weight: 400;
  font-size: clamp(72px, 11vw, 144px); line-height: 0.9;
  letter-spacing: -0.015em; color: var(--text); margin: 0;
}
@media (max-width: 768px) { h1.page-title, .page-title { font-size: clamp(56px, 13vw, 96px); } }
.eyebrow, .hero-eyebrow {
  font-family: var(--mono); font-size: 11px; font-weight: 400;
  letter-spacing: 0.2em; text-transform: uppercase;
  color: var(--accent); margin: 0 0 18px 0; display: block;
}
/* P0-C: hero-sub serif italic → sans-kr non-italic (한글 italic 위반 해소, 9 admin 동시 개선) */
.hero-sub {
  font-family: var(--sans-kr); font-style: normal; font-weight: 400;
  font-size: clamp(15px, 1.4vw, 18px); line-height: 1.75;
  letter-spacing: 0.01em; color: var(--text); opacity: 0.82;
  margin: 18px 0 0 0; max-width: 60ch;
}
/* P0-D: page-hero margin lock 72/56 (4px grid) */
.page-hero { margin-bottom: 72px; padding-left: 4px; }
@media (max-width: 768px) { .page-hero { margin-bottom: 56px; } }

/* === catalog footer (common.css:198-199 verbatim) === */
.catalog-footer { padding: 0 28px 48px; text-align: left; }
.catalog-footer p { font-family: var(--serif); font-style: italic; font-size: 13px; color: var(--text); opacity: 0.5; letter-spacing: 0.01em; }

/* === a11y: focus-visible (common.css:303-316 verbatim) === */
:where(button, a, input, [tabindex]):focus-visible { outline: 1.5px solid var(--accent); outline-offset: 2px; border-radius: var(--radius); transition: outline-offset var(--tr-instant); }

/* === reduced-motion (common.css:319-329 verbatim) === */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important; }
}

/* === tap feedback (common.css:394-409, foot-nav만 status 사용) === */
.foot-nav a:active { transform: translateY(0.5px); opacity: 0.75; }
.foot-nav a { transition: color var(--tr-instant), transform 80ms ease-out, opacity var(--tr-instant); }

/* === sr-only (common.css:332-342 verbatim) === */
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }

/* === mobile overrides (common.css:201-212 verbatim — source order 끝 = override 보장) === */
@media (max-width: 479px) {
  .gutter-line { left: 16px; }
  .corner-serif { top: 16px; left: 16px; }
  .corner { font-size: 10px; }
  .top-left { top: 20px; left: 20px; }
  .foot-nav { font-size: 10.5px; gap: 8px 10px; padding: 10px 16px calc(10px + env(safe-area-inset-bottom)); }
}

/* === lang toggle (common.css:241-251 verbatim 이관 — bilingual 페이지 공통) === */
html[data-lang="en"] .lang-fixed a[data-lang-btn="en"],
html[data-lang="ko"] .lang-fixed a[data-lang-btn="ko"] { opacity: 1; }
html[data-lang="en"] [data-l="ko"] { display: none; }
html[data-lang="ko"] [data-l="en"] { display: none; }

/* === lang-fixed 본체 (common.css:215-240 verbatim 이관 — bilingual 공개 페이지 lang switcher) === */
.lang-fixed {
  position: fixed; top: 32px; right: 32px; z-index: 6;
  display: flex; gap: 8px;
  font-family: var(--mono); font-size: 11px; letter-spacing: 0.35em; text-transform: uppercase;
  align-items: baseline;
}
.lang-fixed a { color: var(--text); opacity: 0.5; text-decoration: none; cursor: pointer; transition: opacity 0.2s, color 0.2s; }
.lang-fixed a:hover { opacity: 1; }
.lang-fixed .sep { color: rgba(107, 122, 90, 0.35); font-size: 9px; user-select: none; }
@media (max-width: 600px) { .lang-fixed { top: 20px; right: 20px; font-size: 10px; letter-spacing: 0.28em; } }

/* === public site-nav (common.css:483-535 verbatim 이관 — 공개 페이지 nav SSOT, site-nav.js가 #site-nav에 inject) === */
.site-nav {
  position: fixed; bottom: 8%; right: 8%; z-index: 50;
  display: flex; flex-direction: column; align-items: flex-end; gap: 14px;
}
.site-nav .nav-row { display: flex; flex-direction: row; gap: 18px; align-items: baseline; }
.site-nav .sep { color: rgba(107, 122, 90, 0.35); font-size: 9px; letter-spacing: 0.4em; user-select: none; }
.site-nav a {
  font-family: var(--mono); font-size: 11px; letter-spacing: 0.15em; text-transform: uppercase;
  text-decoration: none; position: relative; padding-bottom: 2px;
}
.site-nav .nav-row.primary a { color: var(--text); opacity: 0.82; }
.site-nav .nav-row.primary a:hover { opacity: 1; }
.site-nav .nav-row.primary a.active { opacity: 1; pointer-events: none; cursor: default; }
.site-nav .nav-row.secondary a { color: var(--accent); opacity: 0.78; font-size: 10px; letter-spacing: 0.22em; }
.site-nav .nav-row.secondary a:hover { color: var(--text); opacity: 1; }
.site-nav a::after {
  content: ''; position: absolute; bottom: -1px; right: 0; width: 0; height: 1px;
  background-color: currentColor; opacity: 0.8; transition: width 220ms ease-out, left 0s 220ms;
}
.site-nav a:hover::after { width: 100%; left: 0; right: auto; transition: width 220ms ease-out; }

/* === anim-text fade-in (common.css:537-541 verbatim) === */
.anim-text { opacity: 0; transform: translateY(10px); animation: fadeInUp 600ms ease-out forwards; }
@keyframes fadeInUp { to { opacity: 1; transform: translateY(0); } }
.anim-text.delay-5 { animation-delay: 400ms; }
@media (prefers-reduced-motion: reduce) { .anim-text { animation: none !important; opacity: 1 !important; transform: none !important; } }

/* === site-nav 모바일 (common.css:543-567 verbatim — 하단 고정·투명·스크롤 auto-hide) === */
@media (max-width: 600px) {
  .site-nav {
    position: fixed; bottom: 0; left: 0; right: auto; width: 100%;
    align-items: flex-start; gap: 10px; margin-top: 0;
    padding: 16px 24px calc(16px + env(safe-area-inset-bottom));
    background: none; transition: transform 280ms ease, opacity 280ms ease;
  }
  .site-nav.nav-hidden { transform: translateY(130%); opacity: 0; pointer-events: none; }
  .site-nav .nav-row { flex-wrap: wrap; gap: 14px 16px; width: 100%; }
  .site-nav .sep { display: none; }
}
/* Cairn glass — Glass V3 (toolbar·toast) (common.css:153-154·186 verbatim, 2026-05-29) */
/* status는 미사용이나 SSOT 보존 — Phase 4 catalog/toolbar 페이지에서 사용 */

.toolbar {
  position: sticky; top: 0; z-index: 10;
  background: rgba(237, 230, 214, 0.08);
  backdrop-filter: blur(16px) saturate(1.2); -webkit-backdrop-filter: blur(16px) saturate(1.2);
  padding: 56px 28px 10px; border-bottom: 1px solid var(--line);
}
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) { .toolbar { background: var(--bg); } }

.toast {
  position: fixed; bottom: calc(24px + env(safe-area-inset-bottom)); left: 50%; transform: translateX(-50%);
  background: var(--paper-tint); border: 1px solid var(--line); color: var(--text);
  font-family: var(--serif); font-style: italic; font-size: 13px;
  padding: 8px 16px; border-radius: var(--radius); pointer-events: none; opacity: 0; z-index: 100; transition: none;
  backdrop-filter: blur(8px) saturate(1.2); -webkit-backdrop-filter: blur(8px) saturate(1.2);
}