/* xeno-materia のトークンから機械生成。手で編集しない。
   生成元: src/style.css  の @theme（DESIGN.md が宣言する Single Source of Truth）
   生成スクリプト: tools/gen_materia_css.py */
:root{
  --black-100:#000000;
  --white-100:#ffffff;
  --gray-100:#f5f5f5;
  --gray-200:#f0f0f0;
  --gray-300:#edecea;
  --gray-400:#d1d0cf;
  --gray-500:#bababa;
  --gray-600:#ababab;
  --gray-700:#868686;
  --gray-800:#67635f;
  --gray-900:#4b4845;
  --gray-1000:#403c38;
  --gray-1100:#33302d;
  --gray-1200:#292725;
  --gray-1300:#22201e;
  --gold-100:#edca85;
  --gold-200:#d1b06b;
  --gold-300:#b99245;
  --gold-400:#9c782c;
  --red-100:#d88c8c;
  --red-200:#cb7a7a;
  --red-300:#c06a6a;
  --red-400:#b15555;
  --red-500:#a84848;
  --blue-100:#94c1dc;
  --blue-200:#7eb1d1;
  --blue-300:#6ca3c4;
  --blue-400:#5992b6;
  --blue-500:#4c88ad;
  --white-80:#ffffffcc;
  --white-60:#ffffff99;
  --white-40:#ffffff66;
  --white-20:#ffffff33;
  --white-0:#ffffff00;
  --black-80:#000000cc;
  --black-60:#00000099;
  --black-40:#00000066;
  --black-20:#00000033;
  --black-0:#00000000;
  --transparent:#ffffff00;
  --text-default:var(--gray-1300);
  --text-secondary:var(--gray-900);
  --text-tertiary:var(--gray-700);
  --text-quaternary:var(--gray-500);
  --text-inverse:var(--white-100);
  --primary-light-default:var(--gold-100);
  --primary-light-hover:var(--gold-200);
  --primary-dark-default:var(--gold-300);
  --primary-dark-hover:var(--gold-400);
  --negative-default:var(--red-500);
  --negative-hover:var(--red-300);
  --positive-default:var(--blue-500);
  --positive-hover:var(--blue-300);
  --chart-1:#9c782c;
  --chart-2:#af8d4f;
  --chart-3:#c0a370;
  --chart-4:#d1b993;
  --chart-5:#e1d0b6;
  --chart-6:#f1e7da;
  --chart-7:#dbd8d4;
  --chart-8:#b8b2ab;
  --chart-9:#968d83;
  --chart-10:#756a5e;
  --chart-11:#554a3a;
  --chart-12:#372b1a;
  --spacing-table:6px;
  --container-page:1440px;
  --container-data:1280px;
  --container-article:1058px;
  --control-sm:36px;
  --control-md:44px;
  --control-lg:52px;
  --radius-base:2px;
  --radius:var(--radius-base);
  --opacity-disabled:0.4;
  --opacity-chart-area:0.2;
  --font-sans:"Noto Sans JP", ui-sans-serif, system-ui, sans-serif;
  --font-serif:"Noto Serif JP", "Noto Sans JP", sans-serif;
  --font-number:"Inter", ui-sans-serif, system-ui, sans-serif;
  --text-xs:0.625rem;
  --text-sm:0.75rem;
  --text-md:0.875rem;
  --text-lg:1rem;
  --text-xl:1.125rem;
  --text-2xl:1.25rem;
  --text-3xl:1.5rem;
  --font-weight-regular:400;
  --font-weight-medium:500;
  --font-weight-semibold:600;
  --font-weight-bold:700;
  --leading-100:1;
  --leading-150:1.5;
  --leading-170:1.7;
  --text-icon-xs:0.875rem;
  --text-icon-sm:1rem;
  --text-icon-md:1.25rem;
  --text-icon-lg:1.5rem;
  --text-icon-xl:1.75rem;
  --z-sticky:10;
  --z-dropdown:50;
  --z-tooltip:60;
  --z-modal:100;
  --z-toast:110;
  --shadow-sm:0 1px 2px rgba(0, 0, 0, 0.15);
  --shadow-md:0 4px 4px rgba(0, 0, 0, 0.25);
  --shadow-lg:0 8px 16px rgba(0, 0, 0, 0.2);
  --duration-fast:150ms;
  --duration-normal:250ms;
  --duration-slow:400ms;
  --ease-default:cubic-bezier(0.0, 0.0, 0.2, 1);
  --duration-loop:1s;
  --animate-spinner:spinner-rotate var(--duration-loop) linear infinite;
  /* --- spacing: Tailwind 標準 4px グリッド（DESIGN.md Spacing） --- */
  --space-1:4px;
  --space-2:8px;
  --space-3:12px;
  --space-4:16px;
  --space-5:20px;
  --space-6:24px;
  --space-7:28px;
  --space-8:32px;
  --space-9:36px;
  --space-10:40px;
  --space-11:44px;
  --space-12:48px;
  --space-13:52px;
  --space-14:56px;
}

/* ===== base（xeno-materia src/style.css の @layer base 相当） ===== */
*{box-sizing:border-box;margin:0;padding:0;}
html{font-family:var(--font-sans);color:var(--text-default);}
body{background:var(--white-100);font-size:var(--text-md);line-height:var(--leading-170);
  -webkit-font-smoothing:antialiased;font-feature-settings:'palt' 1;}
/* 見出しはタグだけで決まる（h1〜h5 に color/700/leading-150 を一括適用） */
h1,h2,h3,h4,h5{color:var(--text-default);font-weight:var(--font-weight-bold);line-height:var(--leading-150);}
h1{font-size:var(--text-3xl);}
h2{font-size:var(--text-2xl);}
h3{font-size:var(--text-xl);}
h4{font-size:var(--text-lg);}
h5{font-size:var(--text-md);}
/* フォーカスリング（キーボード操作時のみ） */
:focus-visible{outline:2px solid var(--primary-dark-default);outline-offset:2px;}
.focus-on-dark :focus-visible,.focus-on-dark:focus-visible{outline-color:var(--primary-light-default);}
/* 数値は等幅の Inter（DESIGN.md「数字は特別扱い」） */
.font-number{font-family:var(--font-number);font-feature-settings:"tnum";}
/* Material Icons のサイズトークン（style.css 末尾の .material-icons.text-icon-* と同じ） */
i.material-icons{line-height:1;}
.material-icons.text-icon-xs{font-size:var(--text-icon-xs);}
.material-icons.text-icon-sm{font-size:var(--text-icon-sm);}
.material-icons.text-icon-md{font-size:var(--text-icon-md);}
.material-icons.text-icon-lg{font-size:var(--text-icon-lg);}
.material-icons.text-icon-xl{font-size:var(--text-icon-xl);}
[hidden]{display:none !important;}
