/* 共通の色・余白・書体。値はデジタル庁デザインシステム（DADS, @digital-go-jp/design-tokens）に合わせる。
   スマホ・本部 PC・資料で同じ値を使う */
:root {
  --font: "Gen Interface JP", "Noto Sans JP", sans-serif;
  --bg: #ffffff;
  --surface: #ffffff;
  --surface-2: #f2f2f2;       /* DADS gray-50: 押せる面・見出しの行 */
  --surface-3: #e6e6e6;       /* DADS gray-100: 押した面 */
  --text: #1a1a1a;            /* DADS gray-900 */
  --text-2: #666666;          /* DADS gray-600（補足。白地で 5.7:1） */
  --line: #e6e6e6;            /* 罫線（行の区切り） */
  --line-strong: #767676;     /* 入力欄の枠（3:1 以上） */
  --primary: #0017c1;         /* DADS blue-900 */
  --primary-hover: #00118f;   /* DADS blue-1000 */
  --primary-text: #ffffff;
  --primary-bg: #e8f1fe;      /* DADS blue-50 */
  --ok: #197a4b;              /* DADS green-800 */
  --warn: #ac3e00;            /* DADS orange-900（文字に使える濃さ） */
  --danger: #ce0000;          /* DADS red-900 */
  --ok-bg: #e6f5ec;
  --warn-bg: #ffeee2;
  --danger-bg: #fdeeee;
  --focus: #ffd43d;           /* DADS のフォーカスの黄色 */
  --shadow: 0 4px 16px 3px rgba(0, 0, 0, 0.1), 0 1px 6px 0 rgba(0, 0, 0, 0.3);   /* DADS elevation-3 */
  --r-sm: 4px;
  --r-md: 8px;
  --r-lg: 12px;
  --s1: 4px; --s2: 8px; --s3: 12px; --s4: 16px; --s5: 24px; --s6: 32px; --s7: 48px;
  color-scheme: light;
}
@media (prefers-color-scheme: dark) {
  :root {
    --bg: #121212;
    --surface: #121212;
    --surface-2: #262626;
    --surface-3: #333333;
    --text: #f2f2f2;
    --text-2: #b3b3b3;
    --line: #333333;
    --line-strong: #949494;
    --primary: #7096f8;         /* DADS blue-400 */
    --primary-hover: #9db7f9;
    --primary-text: #000060;
    --primary-bg: #000071;
    --ok: #5fd39a;
    --warn: #ffa066;
    --danger: #ff7b80;
    --ok-bg: #0f2e1f;
    --warn-bg: #3a2210;
    --danger-bg: #3a1414;
    --shadow: 0 4px 16px 3px rgba(0, 0, 0, 0.5), 0 1px 6px 0 rgba(0, 0, 0, 0.6);
    color-scheme: dark;
  }
}
* { box-sizing: border-box; }
html, body { margin: 0; }
body { font-family: var(--font); background: var(--bg); color: var(--text); font-size: 16px; line-height: 1.7; letter-spacing: 0.02em; }
button, input, select, textarea { font: inherit; color: inherit; letter-spacing: inherit; }
a { color: var(--primary); }
:focus-visible { outline: 4px solid var(--text); outline-offset: 2px; box-shadow: 0 0 0 2px var(--focus); }
.num { font-variant-numeric: tabular-nums; }
.nowrap { white-space: nowrap; }
.muted { color: var(--text-2); }
[hidden] { display: none !important; }
