/* 셸로 컷오버된 실제 페이지들이 공유하는 최소 리셋 + 디자인 토큰.
   예전엔 각 tool html이 <style> 안에 이 블록을 통째로 복붙해서 갖고 있었다 —
   이제 셸 부트스트랩 페이지들은 이 파일 하나만 링크하고, 화면별 스타일은
   각 view 모듈이 자기 스코프(.xxx-root)로 직접 주입한다. */

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@400;500;700;900&display=swap');

:root {
  --orange: #FF6B2B;
  --orange-dark: #E05520;
  --steel: #1A1E2E;
  --steel-mid: #252A3D;
  --steel-light: #2E3450;
  --text: #F0F2FF;
  --text-dim: #8892B0;
  --give: #3BE88A;
  --border: rgba(255,255,255,0.08);
  --nav-btn-bg: #fff;
  --nav-btn-border: transparent;
  --header-bg: rgba(26, 30, 46, 0.8);
}

:root[data-theme="light"] {
  --orange: #FF6B2B;
  --orange-dark: #E05520;
  --steel: #F4F3F0;
  --steel-mid: #FFFFFF;
  --steel-light: #F0EFEA;
  --text: #1C1E27;
  --text-dim: #767A85;
  --give: #1E8E56;
  --border: rgba(0,0,0,0.08);
  --nav-btn-bg: #fff;
  --nav-btn-border: rgba(0,0,0,0.08);
  --header-bg: rgba(244, 243, 240, 0.8);
}

* { box-sizing: border-box; margin: 0; padding: 0; }

body {
  font-family: 'Noto Sans KR', sans-serif;
  background: var(--steel);
  color: var(--text);
  min-height: 100vh;
  padding: 20px 16px 40px;
  word-break: keep-all;
}

.route-loading { color: var(--text-dim); text-align: center; padding-top: 60px; }