/* 10thly App — Visual Token（唯一の置き場）
   出発点：VISUAL_DIRECTION.md §11 / VISUAL_PROTOTYPE_REVIEW.md §7
   純黒 #000000・黄・赤・緑は UI に使わない。地（--paper）と印（--accent 系）は Theme で差し替える。
   Theme は html[data-theme] で切り替える（lib/theme.js）。既定＝Near White × Lavender。 */
:root {
  /* 基調（画面の 90%） */
  --paper: #FBFBFC;        /* 地：Near White */
  --paper-2: #F5F5F7;      /* 一段沈んだ地（Nav・列の地） */
  --ink: #343238;          /* 本文・見出し */
  --gray: #707070;         /* 補助文・ラベル・数字の % */
  --gray-2: #9A9A9E;       /* さらに薄い補助（placeholder・打消し） */
  --line: #E4E4E8;         /* ヘアライン */
  --line-soft: #EEEEF1;    /* 行の区切り */
  --hover: rgba(52, 50, 56, .04);
  --shadow: 0 2px 12px rgba(52, 50, 56, .08);

  /* 印（画面の 10%） */
  --accent: #C3B5D9;       /* 主ボタンの線・選択・今日の印 */
  --accent-deep: #766294;  /* 主ボタンの文字・リンク・フォーカス */
  --accent-pale: #F4F0F8;  /* 選択状態の地・Review の地 */
  --accent-soft: #E4DDEF;
  --review-bg: color-mix(in srgb, var(--accent-pale) 22%, var(--paper));   /* Review／List 画面の全面の地（g62・g62b で 40%→22%）＝地（--paper）にテーマの accent-pale がごく薄く乗る程度。テーマ連動のまま本文・Ring・入力欄が読める濃さ。特定色を直書きしない */
  --input-bg: var(--paper);   /* 入力欄の地（g62）＝neutral。テーマ色の地の上でも入力欄にはテーマ色を塗らない（border／focus だけ accent に追従） */
  --pink: #E8C6C0;         /* 日曜・祝日の印にだけ */
  --blue: #B0C4DE;         /* 土曜・予定の点にだけ */
  /* 旧名（既存 CSS 互換） */
  --lav: var(--accent); --lav-deep: var(--accent-deep); --lav-pale: var(--accent-pale);

  /* Kaname Ring（Ring 以外に使わない） */
  --ring-1: #8352AE;   /* 既定＝A1（g43〜）。起動時に lib/ringtheme.js が端末の Ring Color と --accent 系を上書きする（旧 Theme の data-theme より inline が優先） */   /* Kaname Ring の標準＝g32 までの 3 階調（既定テーマでは #766294／#C3B5D9／#E4DDEF）。lib/ringtheme.js は候補を持つだけで、標準は変えない */
  --ring-2: #C3B5D9;
  --ring-3: #F0E6FF;
  --ring-line: rgba(0, 0, 0, .55);   /* Ring の区画境界・外周の細線（色があるとき） */
  --ring-hairline: var(--line);
  --ring-empty-fill: var(--paper);   /* 未設定 Ring の白抜き（g56 追加確認）：Review の accent-pale 地でも輪郭だけにならず「白抜きの円」が見える */
  --ring-dot: #707070;
  --ring-gap: var(--paper);
  --ring-shadow: rgba(52, 50, 56, 0.10);   /* 未使用（g39 で Ring の影を撤去。値は互換のため残す） */

  /* 書体（外部 CDN に依存しない。iOS / macOS 内蔵書体） */
  --sans: "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Noto Sans JP", system-ui, sans-serif;
  --mincho: "Hiragino Mincho ProN", "Hiragino Mincho Pro", "Yu Mincho", "Noto Serif JP", serif;
  --en: "Baskerville", "Cormorant Garamond", "Georgia", serif;

  /* 級数 */
  --fs-body: 14px;
  --fs-small: 12px;
  --fs-head: 20px;         /* 明朝の俯瞰見出し */
  --fs-pct: 28px;
  --lh-body: 1.6;
  --lh-log: 1.9;

  /* Big Words（B2）。本文比 */
  --big-kaname: 2.15;
  --big-today: 1.35;

  /* 余白・角丸・動き */
  --gutter: 20px;
  --radius: 4px;
  --radius-sheet: 8px;
  --ease-out: cubic-bezier(.2,.7,.2,1);
  --t-fade: 180ms;
  --t-ring-fill: 700ms;

  /* 3ペインの幅 */
  --nav-w: 232px;
  --aside-w: 300px;
  --tabbar-h: 45px;        /* モバイルの固定タブバー（safe-area を除く・実測 45px＝タブ 44px＋罫線 1px） */
  --quickadd-h: 64px;

  /* Ring の直径 */
  --ring-today: 17vw;
  --ring-kaname: 58vw;
  --ring-max: 300px;
  --ring-editor: 56vw;
  --ring-review: 62vw;

  /* 端末のセーフエリア */
  --safe-b: env(safe-area-inset-bottom, 0px);
  --safe-t: env(safe-area-inset-top, 0px);
}

/* ---------- Theme（地 × 印） ---------- */
:root[data-theme="white-lav"]  { --paper: #FFFFFF; --paper-2: #F6F6F8; }
:root[data-theme="paper-lav"]  { --paper: #FCFBF8; --paper-2: #F5F3EE; --line: #E8E8E8; --line-soft: #F0F0F0; }
:root[data-theme="white-pink"] { --paper: #FFFFFF; --paper-2: #F8F5F5; --accent: #E8C6C0; --accent-deep: #A8706A; --accent-pale: #FAF2F0; --accent-soft: #F3E1DD; }
:root[data-theme="white-blue"] { --paper: #FFFFFF; --paper-2: #F4F6F9; --accent: #B0C4DE; --accent-deep: #5C7A9E; --accent-pale: #EFF3F8; --accent-soft: #D9E3EF; }
/* 背景（Ring の色と独立・lib/theme.js の BACKGROUNDS）。旧 Theme の地より優先 */
:root[data-bg="nearwhite"] { --paper: #FBFBFC; --paper-2: #F5F5F7; --line: #E4E4E8; --line-soft: #EEEEF1; }
:root[data-bg="white"]     { --paper: #FFFFFF; --paper-2: #F6F6F8; --line: #E4E4E8; --line-soft: #EEEEF1; }
:root[data-bg="paper"]     { --paper: #FCFBF8; --paper-2: #F5F3EE; --line: #E8E8E8; --line-soft: #F0F0F0; }