/* XOPアセットケア v2 — 「感じる」ための設計
 * v1の失敗: 全部が同じ濃度帯（L*46-63）に収まり、光も影も無かった。
 * v2の方針: 明度に幅を持たせる。明るい紙 ⇄ 深い暗部 を交互に置く。 */
:root{
  /* 紙側（暖色・呼吸する明るさ） */
  --paper:        oklch(97.2% 0.006 85);    /* #F8F6F1 暖かい紙 */
  --paper-lift:   oklch(99.4% 0.003 85);    /* #FDFCFA 浮かせる面 */
  --paper-sink:   oklch(93.5% 0.008 85);    /* #EFEBE3 沈める面 */

  /* 暗部側（深く、青緑に寄せた黒。ページに「夜」をつくる） */
  --deep:         oklch(21% 0.018 178);     /* #10201F */
  --on-deep:      oklch(93% 0.010 85);      /* 暗部の文字＝暖色のオフホワイト */
  --on-deep-mute: oklch(80% 0.012 85);

  /* 文字 */
  --ink:          oklch(24% 0.014 172);     /* #16211F */
  --ink-mute:     oklch(48% 0.012 172);

  /* アクセント：生きた緑 */
  --accent:       oklch(52% 0.093 160);
  --accent-on-deep: oklch(80% 0.095 158);   /* 暗部の上ではこちら。彩度は sRGB 域内に収める */
  --accent-strong: oklch(44% 0.10 160);     /* 紙の上 6.8:1。小さい文字用 */
  --rule:         oklch(48% 0.012 172 / 0.45);
  --rule-strong:  oklch(48% 0.012 172 / 0.75);

  --font-display:"Shippori Mincho","Yu Mincho",YuMincho,serif;
  --font-body:"Zen Kaku Gothic New","Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif;
  --font-mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,monospace;

  /* 大きく、少なく */
  --t-hero:  clamp(2.2rem, 1.2rem + 4.2vw, 4.1rem);
  --t-huge:  clamp(1.8rem, 1.1rem + 2.9vw, 3rem);
  --t-h2:    clamp(1.6rem, 1.2rem + 1.7vw, 2.5rem);
  --t-lede:  clamp(1.05rem, 0.98rem + 0.35vw, 1.22rem);
  --t-body:  1.0625rem;
  --t-small: 0.9rem;
  --t-label: 0.87rem;   /* 日本語を読ませるので11.5px→14px */

  --measure: 30em;
  --wide: 74rem;

  --s-2xs:.5rem; --s-xs:.75rem; --s-sm:1rem; --s-md:1.5rem;
  --s-lg:2.5rem; --s-xl:4rem; --s-2xl:6.5rem; --s-3xl:10rem;

  --ease-out:cubic-bezier(.16,1,.3,1);
  --dur:.5s;
}
