/* RiskyEats section theme tokens — 4-section IA (operator 2026-06-21). Each top-level section sets data-section on ; components read the --section-* custom properties so one component set themes per section. */ :root { --section-accent: #b91c1c; /* default = FRI/TSE */ --section-accent-soft: #fef2f2; --section-accent-border: #fecaca; --section-bg: #ffffff; --section-ink: #1f2937; --section-label: "FRI"; --riskyeats-paper: #ffffff; --riskyeats-ink: #111111; --riskyeats-muted: #555555; --riskyeats-rule: #d6d6d6; --riskyeats-red: #a11515; --riskyeats-navy: #1a3d6d; --riskyeats-font-body: "Atkinson Hyperlegible", "Verdana", "Tahoma", system-ui, sans-serif; --riskyeats-font-display: "Bricolage Grotesque", "Helvetica Neue", "Arial", system-ui, sans-serif; } [data-section="fri"] { --section-accent:#b91c1c; --section-accent-soft:#fef2f2; --section-accent-border:#fecaca; --section-bg:#ffffff; --section-label:"FRI · TSE"; } [data-section="data"] { --section-accent:#475569; --section-accent-soft:#f1f5f9; --section-accent-border:#cbd5e1; --section-bg:#ffffff; --section-label:"Data Browser"; } [data-section="news"] { --section-accent:#1f2937; --section-accent-soft:#faf7f0; --section-accent-border:#e7e0d2; --section-bg:#ffffff; --section-label:"News"; } [data-section="cuisine"]{ --section-accent:#c2410c; --section-accent-soft:#fff7ed; --section-accent-border:#fed7aa; --section-bg:#fffdf8; --section-label:"Cuisine Guides"; } /* Shared interaction contract across Data, FRI, and News. Surface-specific layouts keep their own density, but keyboard focus must never change color, thickness, or offset as a reader moves between sections. */ [data-section] { color: var(--riskyeats-ink); background: var(--riskyeats-paper); font-family: var(--riskyeats-font-body); font-size: 1.125rem; line-height: 1.6; text-rendering: optimizeLegibility; } [data-section] :is(h1, h2, h3, h4, h5, h6) { color: var(--riskyeats-ink); font-family: var(--riskyeats-font-display); line-height: 1.15; letter-spacing: -.005em; text-wrap: balance; } [data-section] :is(a, button, input, select, summary):focus-visible { outline: none; box-shadow: 0 0 0 3px var(--riskyeats-paper), 0 0 0 6px var(--riskyeats-navy); } /* Shared section nav (top-level switcher). */ .section-nav { display:flex; gap:4px; flex-wrap:wrap; padding:8px 0; border-bottom:1px solid var(--section-accent-border); } .section-nav a { font-weight:700; font-size:.92rem; text-decoration:none; color:#475569; padding:6px 12px; border-radius:999px; } .section-nav a[aria-current="page"] { background:var(--section-accent-soft); color:var(--section-accent); border:1px solid var(--section-accent-border); } .section-nav a:hover { background:var(--section-accent-soft); }