/* ============================================================ WindowsNews.AI — Tweak-driven overrides Controlled by data-* attributes + CSS vars set on ============================================================ */ /* Brand identity mark always stays in the grotesk, regardless of headline voice */ .brand-name { font-family: 'Archivo', system-ui, sans-serif !important; } /* ---- Reading size (article prose) ---- */ .prose { font-size: var(--prose-size, 19.5px); } /* ============ HEADLINE VOICE ============ */ [data-display="serif"] { --font-display: 'Newsreader', Georgia, serif; } [data-display="serif"] .hero-lead h1, [data-display="serif"] .art-title, [data-display="serif"] .footer-cta h3, [data-display="serif"] .cat-hero h1, [data-display="serif"] .splitfeat-main h3 { font-weight: 600; letter-spacing: -0.018em; } [data-display="serif"] .card h3, [data-display="serif"] .river-body h3, [data-display="serif"] .hero-sec h3, [data-display="serif"] .section-title, [data-display="serif"] .prose h2, [data-display="serif"] .prose h3, [data-display="serif"] .rail-head .t, [data-display="serif"] .sf-item h4 { font-weight: 600; } [data-display="serif"] .prose > p:first-of-type::first-letter { font-family: 'Newsreader', Georgia, serif; font-weight: 700; } /* ============ DENSITY ============ */ [data-density="compact"] { --gap: 18px; } [data-density="compact"] .hero { padding: 22px 0 6px; } [data-density="compact"] .hero-lead { min-height: 420px; } [data-density="compact"] .hero-lead-body { padding: 26px; } [data-density="compact"] .river-item { padding: 14px 0; } [data-density="compact"] .river-body h3 { font-size: 17px; } [data-density="compact"] .river-body .dek { -webkit-line-clamp: 1; margin-top: 5px; } [data-density="compact"] .card-body { padding: 12px 13px 14px; } [data-density="compact"] .card h3 { font-size: 16px; } [data-density="compact"] .card .dek { -webkit-line-clamp: 1; } [data-density="compact"] .band { padding: 26px 0; } [data-density="compact"] .feed { padding: 22px 0 40px; } [data-density="compact"] .sidebar { gap: 18px; } [data-density="compact"] .status-cell { padding: 12px 15px; } [data-density="compact"] .rail-item { padding: 10px 16px; } [data-density="comfy"] { --gap: 38px; } [data-density="comfy"] .hero { padding: 42px 0 10px; } [data-density="comfy"] .hero-lead { min-height: 540px; } [data-density="comfy"] .hero-lead-body { padding: 42px; } [data-density="comfy"] .river-item { padding: 30px 0; } [data-density="comfy"] .river-body .dek { -webkit-line-clamp: 3; } [data-density="comfy"] .card-body { padding: 20px 20px 22px; } [data-density="comfy"] .card .dek { -webkit-line-clamp: 3; } [data-density="comfy"] .band { padding: 52px 0; } [data-density="comfy"] .feed { padding: 42px 0 60px; } [data-density="comfy"] .sidebar { gap: 32px; } /* ============ CORNERS ============ */ [data-corners="sharp"] { --r-xs: 0px; --r-sm: 1px; --r-md: 2px; --r-lg: 2px; --r-xl: 4px; } [data-corners="sharp"] .cat-chip { border-radius: 0; } [data-corners="round"] { --r-xs: 6px; --r-sm: 11px; --r-md: 16px; --r-lg: 22px; --r-xl: 30px; } /* ============ GLASS MATERIAL ============ */ [data-glass="subtle"] { --glass-blur: blur(8px) saturate(115%); --glass-bg: rgba(255,255,255,0.93); --glass-bg-2: rgba(247,249,252,0.92); --glass-line: var(--line); } [data-theme="dark"][data-glass="subtle"] { --glass-bg: rgba(12,17,30,0.95); --glass-bg-2: rgba(9,13,24,0.93); --glass-line: var(--line); } [data-glass="bold"] { --glass-blur: blur(32px) saturate(200%); --glass-bg: rgba(255,255,255,0.52); --glass-bg-2: rgba(247,249,252,0.42); } [data-theme="dark"][data-glass="bold"] { --glass-bg: rgba(14,20,34,0.46); --glass-bg-2: rgba(10,15,28,0.38); --glass-line: rgba(130,150,190,0.2); } /* ============ COLOR SYSTEM ============ */ /* Monochrome: category accents collapse to the brand color (vars set inline on ) */ [data-colorsystem="mono"] .cat-chip::before { opacity: .9; }