/* 配色とフォント。色の数値は docs/plan.md の配色の表どおり */

@font-face {
  font-family: 'Klee One';
  src: url('../fonts/KleeOne-Regular.woff2') format('woff2');
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: 'Klee One';
  src: url('../fonts/KleeOne-SemiBold.woff2') format('woff2');
  font-weight: 600;
  font-display: swap;
}

/* ライト(夕方のレトロ) */
:root,
:root[data-theme='light'] {
  --bg: #FBF3E6;
  --card: #FFFBF4;          /* カード・注文票 */
  --input: #FDF7EE;
  --input-line: #E8D3B6;
  --text: #4A3222;
  --text-sub: #6B4A33;      /* 補足の文字 */
  --btn: #7A4E2E;           /* メインボタン */
  --btn-text: #FFFFFF;
  --accent: #D6EEF0;        /* 差し色(お題など) */
  --accent-text: #1F5A5F;

  /* ここから下は表にない補助の色(えんぴつ線・光・仮の図形) */
  --line: #5E4A3A;
  --glow: rgba(255, 210, 130, 0.85);
  --wall: #F3E3CA;
  --floor: #E2C9A3;
  --wood: #C49A6C;
  --wood-light: #DDBB90;
  --glass: #E3F0EC;
  --window-glass: #F7F4EC;
  --sky: #D6E7E8;
  --hill: #C7DCAE;
  --path: #E7D4AE;
  --sea: #9FCFD8;
  --sand: #EEDDB8;
  --forest: #CFE0C4;
  --tree: #A9CF94;
  --tree-dark: #7FAE7A;
  --grain-opacity: 0.45;
  --grain-blend: multiply;
  color-scheme: light;
}

/* ダーク(夜の灯り) */
:root[data-theme='dark'] {
  --bg: #1F2A44;
  --card: #2A3757;
  --input: #23304D;
  --input-line: #41557F;
  --text: #F3EEDF;
  --text-sub: #CFC9BA;
  --btn: #F2C46D;
  --btn-text: #1F2A44;
  --accent: #8FD3D8;
  --accent-text: #13343A;

  --line: #CFC9BA;
  --glow: rgba(242, 196, 109, 0.6);
  --wall: #26335A;
  --floor: #1A2440;
  --wood: #5E4B3E;
  --wood-light: #74604F;
  --glass: #3A5670;
  --window-glass: #33476E;
  --sky: #24335A;
  --hill: #2C4A45;
  --path: #4A4A55;
  --sea: #2E4F78;
  --sand: #4B4A5A;
  --forest: #1E3340;
  --tree: #3D5E50;
  --tree-dark: #2F4E44;
  --grain-opacity: 0.35;
  --grain-blend: overlay;
  color-scheme: dark;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

html,
body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font-family: 'Klee One', 'Hiragino Maru Gothic ProN', 'Yu Gothic', sans-serif;
  font-weight: 400;
  line-height: 1.7;
  letter-spacing: 0.04em;
  -webkit-text-size-adjust: 100%;
  -webkit-tap-highlight-color: transparent;
}

h1,
h2,
h3 {
  font-weight: 600;
  margin: 0;
}

button {
  font: inherit;
  color: inherit;
}