/* Sportivista — design tokens, reset, typography. The normative contract is DESIGN.md.
   One purpose: a quiet, scannable overview of the events you follow — when · what ·
   where. Apple-native baseline: the system font (tabular numerals where digits align),
   one accent (amber, used sparingly), flat rows on hairlines. No cards, no washes,
   no second colour. */

/* Token values are the DESIGN.md § Tokens table verbatim (Apple system colours + one
   amber accent). Amber is the ONLY accent and is used only for: the wordmark colon,
   day headers, the must-see dot, the clock, selected state. Live is systemGreen, sparse.
   Separators are the Apple hairline tokens. */
:root {
	/* Dark — the baseline default (true-black "page", system cell for depth) */
	--bg: #000000;
	--surface: #1C1C1E;                  /* cell — list/detail surface */
	--fg: #FFFFFF;                        /* label */
	--fg-2: rgba(235, 235, 245, 0.6);     /* secondaryLabel — dempet */
	--fg-3: rgba(235, 235, 245, 0.3);     /* tertiaryLabel — fainter, one step below dempet */
	--line: rgba(84, 84, 88, 0.6);        /* separator — hairline */
	--accent: #FFB000;                    /* amber — the ONLY accent */
	--accent-ink: #000000;                /* ink on an amber block */
	--live: #30D158;                      /* systemGreen (dark) — live, sparse */

	--font: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", Roboto, system-ui, sans-serif;
	--display: var(--font);
	--max-w: 640px;            /* one column, max 640 on large surfaces, centered */
	--time-col: 120px;         /* fixed time column so titles align + a date window fits one line */
}

:root[data-theme="light"] {
	/* Light — the Apple grouped-light sibling (never a plain inversion) */
	--bg: #F2F2F7;                        /* systemGroupedBackground */
	--surface: #FFFFFF;                   /* cell */
	--fg: #000000;                        /* label */
	--fg-2: rgba(60, 60, 67, 0.6);        /* secondaryLabel — dempet */
	--fg-3: rgba(60, 60, 67, 0.3);        /* tertiaryLabel — fainter */
	--line: #C6C6C8;                      /* separator */
	--accent: #9A6800;                    /* amber (light) — AA on paper */
	--accent-ink: #FFFFFF;                /* ink on an amber block */
	--live: #34C759;                      /* systemGreen (light) */
}

@media (prefers-color-scheme: light) {
	:root:not([data-theme="dark"]) {
		--bg: #F2F2F7;
		--surface: #FFFFFF;
		--fg: #000000;
		--fg-2: rgba(60, 60, 67, 0.6);
		--fg-3: rgba(60, 60, 67, 0.3);
		--line: #C6C6C8;
		--accent: #9A6800;
		--accent-ink: #FFFFFF;
		--live: #34C759;
	}
}

* { box-sizing: border-box; margin: 0; padding: 0; }
html { -webkit-text-size-adjust: 100%; }

body {
	background: var(--bg);
	color: var(--fg);
	font-family: var(--font);
	font-size: 15px;
	line-height: 1.5;
	font-weight: 400;
	/* Proportional numerals in prose (Apple baseline); tabular is opted into where
	   digits must line up (time column, clock, scores) via font-variant-numeric. */
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
	padding-bottom: env(safe-area-inset-bottom);
}

a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; background: none; border: none; cursor: pointer; }
[hidden] { display: none !important; }

::selection { background: var(--accent); color: var(--accent-ink); }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }