/*
 * Schusei design tokens — the single source of truth for the visual system.
 *
 * Colour values mirror theme.json. Never hardcode a hex value in a component;
 * reference a token. Layout / spacing / type tokens are theme-only (theme.json
 * is kept lean and is not turned into a full block theme).
 *
 * Introduced in Phase 3A. Groups: colour, spacing, font family, type scale,
 * line-height, tracking, measure, layout widths, header, motion, z-index.
 */

:root {
	color-scheme: dark;

	/* ---------------------------------------------------------------- colour */
	--sch-bg: #090909;
	--sch-bg-raised: #0d0d0d;
	--sch-bg-elevated: #111111;

	--sch-text: #e8e8e8;
	--sch-text-secondary: #8a8a8a;   /* 5.8:1 on --sch-bg — WCAG AA for any text */
	--sch-text-muted: #555555;       /* 2.7:1 — decorative / non-essential only, never body-legible text */

	--sch-border: #252525;

	--sch-accent-warm: #b7b1a3;

	/* ------------------------------------------------------- spacing scale */
	/* A small, coherent scale. Fixed at the small end, fluid at the large end
	   so desktop feels spacious without wasting space on mobile. */
	--sch-space-3xs: 0.25rem;
	--sch-space-2xs: 0.5rem;
	--sch-space-xs: 0.75rem;
	--sch-space-sm: 1rem;
	--sch-space-md: 1.5rem;
	--sch-space-lg: clamp(2rem, 1.6rem + 2vw, 3rem);
	--sch-space-xl: clamp(3rem, 2.4rem + 3vw, 5rem);
	--sch-space-2xl: clamp(4.5rem, 3.4rem + 5.5vw, 8rem);
	--sch-space-3xl: clamp(6rem, 4.4rem + 8vw, 12rem);

	/* ------------------------------------------------------- font family */
	/* IBM Plex Sans, self-hosted (see base.css @font-face + theme.json).
	   "IBM Plex Sans Fallback" is a metric-matched Arial that holds the
	   line box + advance width steady during the swap. Everything after it
	   is the pre-existing system chain — it also carries Japanese glyphs
	   through to the platform CJK font, since Plex has no kana/kanji. */
	--sch-font-sans: "IBM Plex Sans", "IBM Plex Sans Fallback", system-ui,
		-apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;

	/* ------------------------------------------------ fluid type scale */
	/* Restrained. Ordinary headings stay modest; only the hero placeholder
	   is large. */
	--sch-text-micro: 0.6875rem;                                  /* 11px — metadata / labels */
	--sch-text-small: 0.8125rem;                                  /* 13px — captions, footer */
	--sch-text-body: clamp(1rem, 0.97rem + 0.14vw, 1.0625rem);    /* ~16–17px prose */
	--sch-text-nav: 0.75rem;                                      /* 12px — uppercase nav */
	--sch-text-wordmark: 0.8125rem;                               /* 13px — site identity only, deliberately a step above nav */
	--sch-text-heading: clamp(1.0625rem, 0.99rem + 0.35vw, 1.3125rem);  /* section heading */
	--sch-text-title: clamp(1.375rem, 1.15rem + 1.1vw, 2rem);     /* work title */
	--sch-text-display: clamp(2.25rem, 1.6rem + 3.2vw, 4rem);     /* hero / display placeholder */

	/* ---------------------------------------------------- line-height */
	--sch-leading-tight: 1.12;
	--sch-leading-snug: 1.32;
	--sch-leading-normal: 1.6;

	/* ------------------------------------------------ letter-spacing */
	--sch-tracking-wide: 0.08em;
	--sch-tracking-wider: 0.16em;
	/* Wordmark only — deliberately the widest tracking in the system, paired
	   with Medium (500) and a size step above nav, so SCHUSEI reads as a
	   quiet auteur/production mark ("S C H U S E I") rather than another
	   uppercase UI label. Wider than --sch-tracking-wider on purpose: this
	   is the one place maximal-for-the-system tracking is the right call. */
	--sch-tracking-wordmark: 0.20em;

	/* --------------------------------------------- prose line length */
	--sch-measure: 68ch;

	/* --------------------------------------------------- layout widths */
	--sch-width-text: 46rem;      /* prose / editorial text column   (~736px) */
	--sch-width-content: 72rem;   /* normal visual content           (~1152px) */
	--sch-width-wide: 90rem;      /* wide visual content             (~1440px) */
	--sch-width-full: 120rem;     /* near-full-bleed cap             (~1920px) */
	--sch-gutter: clamp(1.25rem, 0.85rem + 2vw, 3rem);

	/* --------------------------------------------------------- header */
	--sch-header-height: clamp(3.5rem, 3.1rem + 1.8vw, 4.5rem);
	--sch-header-gutter: var(--sch-gutter);

	/* --------------------------------------------------------- motion */
	--sch-ease: cubic-bezier(0.4, 0, 0.2, 1);
	--sch-duration-fast: 150ms;
	--sch-duration-base: 300ms;
	--sch-duration-slow: 600ms;
	--sch-transition-fade: color var(--sch-duration-base) var(--sch-ease);

	/* -------------------------------------------------------- z-index */
	--sch-z-header: 100;
	--sch-z-skip-link: 200;
}