/* AXPI 센터데이 공통 토큰
   원칙(insight-hub 핸드오버 2026-10-02): 강조 1색(숲 초록)은 버튼과 진행 상태에만, 보조 1색(주황)은 경고와 마감에만.
   그라디언트, 크림 배경, 알약 버튼, 이탤릭 강조, 고정폭 라벨을 쓰지 않는다. 움직임은 즉시 반응 위주. */
@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/variable/pretendardvariable-dynamic-subset.min.css");
:root {
  --bg: #F3F4F6; --surface: #FEFEFE; --sunk: #E9EBEF; --ink: #121417; --sub: #4A515C; --muted: #5E6672; --line: #DCDFE5;
  --accent: #1E6B4F; --accent-ink: #FEFEFE; --accent-soft: #E3EFEA;
  --hot: #C2410C; --hot-soft: #FBEAE2;
  --r: 12px; --r-sm: 8px;
  --f: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, "Apple SD Gothic Neo", "Noto Sans KR", system-ui, sans-serif;
  --safe-b: env(safe-area-inset-bottom, 0px); --safe-t: env(safe-area-inset-top, 0px);
  color-scheme: light;
}
* { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body { margin: 0; background: var(--bg); color: var(--ink); font-family: var(--f); font-size: 16px; line-height: 1.5; word-break: keep-all; overflow-wrap: anywhere; overflow-x: clip; }
h1, h2, h3 { margin: 0; text-wrap: balance; letter-spacing: -0.01em; }
p { margin: 0; }
button, input, select, textarea { font: inherit; color: inherit; }
img { display: block; max-width: 100%; }
.num { font-variant-numeric: tabular-nums; }
.muted { color: var(--muted); }
:focus-visible { outline: 3px solid var(--accent); outline-offset: 2px; }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation: none !important; transition: none !important; } }
@page { size: A4; margin: 12mm; }

/* 버튼: 사각에 가까운 둥근 모서리. 강조색은 기본 버튼에만 */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; width: 100%; min-height: 52px; padding: 0 20px; border: 1px solid var(--accent); border-radius: var(--r); background: var(--accent); color: var(--accent-ink); font-size: 16px; font-weight: 600; cursor: pointer; text-decoration: none; touch-action: manipulation; }
.btn:active { filter: brightness(0.92); }
.btn:disabled { background: var(--sunk); border-color: var(--sunk); color: var(--muted); cursor: not-allowed; }
.btn.ghost { background: var(--surface); color: var(--ink); border-color: var(--line); }
.btn.hot { background: var(--hot); border-color: var(--hot); }
.btn.sm { width: auto; min-height: 44px; font-size: 15px; padding: 0 16px; }
.btn.xl { min-height: 72px; font-size: 20px; }
.btn.loading { opacity: 0.6; pointer-events: none; }
.field { width: 100%; min-height: 52px; padding: 0 14px; border: 1px solid var(--line); border-radius: var(--r); background: var(--surface); font-size: 17px; }
.field:focus { border-color: var(--accent); outline: none; box-shadow: 0 0 0 3px var(--accent-soft); }
.tag { display: inline-block; font-size: 12px; font-weight: 600; line-height: 1; padding: 4px 6px; border-radius: 4px; background: var(--accent-soft); color: var(--accent); vertical-align: 2px; }
.tag.soft { background: var(--sunk); color: var(--sub); }
.toast { position: fixed; left: 16px; right: 16px; bottom: calc(88px + var(--safe-b)); z-index: 50; max-width: 480px; margin: 0 auto; padding: 14px 16px; border-radius: var(--r); background: var(--ink); color: var(--surface); font-size: 15px; text-align: center; opacity: 0; transform: translateY(8px); transition: opacity .15s, transform .15s; pointer-events: none; }
.toast.show { opacity: 1; transform: none; }
.toast.bad { background: var(--hot); }
