/* ==========================================================================
   Adult OT — Design tokens
   Source of truth: design/adultot-vis-0.5-handoff/adultot-vis-0.5/styles/theme-tokens.css
   Do not invent shades here. If a new token is genuinely needed, derive it
   from an approved one and document it in docs/design/visual-identity.md.
   ========================================================================== */

:root {
	/* ---- Approved VIS-0.5 palette (verbatim) ---- */
	--aot-bg: #0E1012;
	--aot-surface: #171A1E;
	--aot-surface-raised: #20242A;
	--aot-border: #2C3137;
	--aot-border-accent: #55402A;
	--aot-text: #E8E2D6;
	--aot-text-secondary: #B2ADA3;
	--aot-text-muted: #7E7B75;
	--aot-bronze: #A77B46;
	--aot-crimson: #8B1F2E;
	--aot-wine: #4A121B;
	--aot-success: #3F6B4A;
	--aot-warning: #C89A3C;
	--aot-danger: #8B2C2C;

	--aot-radius-xs: 2px;
	--aot-radius-sm: 4px;
	--aot-radius-md: 6px;
	--aot-radius-lg: 8px;

	--aot-shadow-sm: 0 2px 6px rgba(0, 0, 0, .40);
	--aot-shadow-md: 0 8px 20px rgba(0, 0, 0, .60);
	--aot-shadow-lg: 0 20px 50px rgba(0, 0, 0, .70);

	--aot-font-display: "Cinzel", "EB Garamond", Georgia, serif;
	--aot-font-ui: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;

	/* ---- Derived tokens (WEB-1) ----
	   Every value below is derived from the approved palette above:
	   an alpha variant, a tint/shade of an approved hex, or a layout
	   constant. No new hue is introduced. */

	/* bronze at reduced presence, for borders/hover/focus rings */
	--aot-bronze-subtle: rgba(167, 123, 70, .18);
	--aot-bronze-muted: rgba(167, 123, 70, .34);
	--aot-bronze-strong: rgba(167, 123, 70, .62);
	--aot-bronze-hi: #C79A5E;   /* lighter bronze, matches logo.svg gradient stop */
	--aot-bronze-lo: #72502D;   /* darker bronze, matches logo.svg gradient stop */

	--aot-crimson-subtle: rgba(139, 31, 46, .16);

	/* Text-safe variants of the semantic colours.
	   The approved --aot-danger (#8B2C2C) and --aot-success (#3F6B4A) are
	   correct as fills, borders and indicator dots, but as TEXT on Charcoal
	   they measure 2.07:1 and 2.84:1 — both below WCAG AA. These are lighter
	   tints of the same hues, used only where the colour carries words:
	     danger text  #CF7B7B -> 5.63:1 on Charcoal, 5.03:1 on Stone
	     success text #6FA37E -> 6.00:1 on Charcoal, 5.36:1 on Stone
	   --aot-warning (#C89A3C) already measures 6.77:1 and needs no variant.
	   VIS-0.5 section 11 forbids improvising new palettes; these introduce no
	   new hue, only the lightness required for legibility. */
	--aot-danger-text: #CF7B7B;
	--aot-success-text: #6FA37E;

	/* translucent obsidian, for overlays on top of environmental art */
	--aot-veil-soft: rgba(14, 16, 18, .62);
	--aot-veil: rgba(14, 16, 18, .82);
	--aot-veil-strong: rgba(14, 16, 18, .94);

	/* surface tint used for table striping / hover */
	--aot-row-alt: rgba(255, 255, 255, .022);
	--aot-row-hover: rgba(167, 123, 70, .09);

	/* ---- Typography scale (VIS-0.5 section 4) ---- */
	--aot-h1: 42px;
	--aot-h2: 30px;
	--aot-h3: 24px;
	--aot-h4: 18px;
	--aot-body: 15px;
	--aot-small: 13px;
	--aot-caption: 12px;
	--aot-line: 1.55;

	/* ---- Layout constants ---- */
	--aot-shell-max: 1180px;
	--aot-gutter: 20px;
	--aot-header-h: 76px;
	--aot-space-1: 4px;
	--aot-space-2: 8px;
	--aot-space-3: 12px;
	--aot-space-4: 16px;
	--aot-space-5: 24px;
	--aot-space-6: 32px;
	--aot-space-7: 48px;
}

@media (max-width: 860px) {
	:root {
		--aot-h1: 30px;
		--aot-h2: 24px;
		--aot-h3: 20px;
		--aot-gutter: 14px;
	}
}