/* 데모 사이트 공통 색·글꼴 토큰 — 전역 팔레트 Graphite & Safety Yellow */
:root {
  --accent: #F5B800;
  --ink: #151515;
  --primary: #1F1F1F;
  --footer: #0E0E0E;
  --muted: #5F5C55;
  --surface: #F4F3EF;
  --alt: #E8E6E0;
  --line: #D3D0C8;
  --white: #FFFFFF;
  --radius: 14px;
  --shadow: 0 10px 30px rgba(21, 21, 21, .08);
  --font: 'Noto Sans KR', system-ui, -apple-system, 'Segoe UI', sans-serif;
}
* { box-sizing: border-box; }
body { margin: 0; background: var(--surface); color: var(--ink); font-family: var(--font); line-height: 1.6; -webkit-font-smoothing: antialiased; word-break: keep-all; overflow-wrap: break-word; }
a { color: inherit; }
[hidden] { display: none !important; }
.icon svg { width: 1em; height: 1em; stroke: currentColor; fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; vertical-align: -0.125em; }
/* 밝은 배경 강조 — 노란 글자 대신 노란 밑줄 */
.hl { background: linear-gradient(transparent 62%, var(--accent) 62%); }
.btn { display: inline-flex; align-items: center; gap: .5em; padding: .8em 1.3em; border: 0; border-radius: 999px; background: var(--accent); color: var(--ink); font: inherit; font-weight: 700; text-decoration: none; cursor: pointer; }
.btn--ghost { background: var(--white); border: 1.5px solid var(--line); }