/*
 * Typography spacing presets (文字の余白).
 *
 * body.tiptop-spacing-{normal|wide|xwide} が余白トークンを3段で再定義する。
 * 連動は2経路（どちらも normal で既定と一致＝見た目を変えない）：
 *  (a) 意味トークンを使う箇所 … var(--tt-leading-base/-loose/-tight) / var(--tt-letter-heading/-label/-body)
 *  (b) 固有値を持つ箇所 … 既定値を保ったまま calc で連動させる：
 *        letter-spacing: calc(<固有値> + var(--tt-letter-add));   （add: normal 0）
 *        line-height:    calc(<固有値> * var(--tt-leading-scale)); （scale: normal 1）
 * (b)は元の値を残すので normal は完全に元のまま、wide/xwide で全体が比例して広がる。
 */

:root {
	--tt-letter-body: 0;
	--tt-letter-add: 0em;
	--tt-leading-scale: 1;
}

body.tiptop-spacing-normal {
	--tt-leading-tight: 1.35;
	--tt-leading-base: 1.95;
	--tt-leading-loose: 2.05;
	--tt-letter-body: 0;
	--tt-letter-heading: 0.08em;
	--tt-letter-label: 0.12em;
	--tt-letter-add: 0em;
	--tt-leading-scale: 1;
}

body.tiptop-spacing-wide {
	--tt-leading-tight: 1.45;
	--tt-leading-base: 2.1;
	--tt-leading-loose: 2.2;
	--tt-letter-body: 0.06em;
	--tt-letter-heading: 0.14em;
	--tt-letter-label: 0.16em;
	--tt-letter-add: 0.04em;
	--tt-leading-scale: 1.08;
}

body.tiptop-spacing-xwide {
	--tt-leading-tight: 1.55;
	--tt-leading-base: 2.3;
	--tt-leading-loose: 2.4;
	--tt-letter-body: 0.14em;
	--tt-letter-heading: 0.24em;
	--tt-letter-label: 0.22em;
	--tt-letter-add: 0.08em;
	--tt-leading-scale: 1.18;
}

body {
	line-height: var(--tt-leading-base);
	letter-spacing: var(--tt-letter-body);
}

body :where(p, li, dd, blockquote, figcaption, .entry-content, .archive-description, .site-main--front .tiptop-front-content) {
	letter-spacing: var(--tt-letter-body);
}
