/* ΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉ
TENET5 THEME ΓÇö css/press-theme.css (SINGLE SOURCE OF TRUTH)
Ground truth: Screenshot 2026-07-10 042513 ΓÇö The record, read backwards.
Every public page loads ONLY this file (+ Fraunces/IBM fonts).
Changing this file changes the whole site. WordPress-style.
ΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉ */
/* CRITICAL: without :root, var(--void) is invalid → browser paints WHITE.
PRISM site duty fails visual acuity if these tokens are missing. */
:root{
--void:#050708;--ink:#0b0e10;
--ivory:#ece7dc;--ivory-dim:#a89f90;--ivory-faint:#827a6d;
--hair:#26221c;--hair-lit:#3a342b;
--ice:#9adbe8;--ice-deep:#3f7c8c;
--red:#c8102e;--red-deep:#8f0f24;--gold:#d3a625;
--accent:var(--ice);
--serif:'Fraunces',Georgia,serif;--mono:'IBM Plex Mono',Consolas,monospace;
/* ── Visual media template (source: homepage index.html · Quantanium ice-lake) ── */
--media-radius:8px;
--media-border:1px solid rgba(154,219,232,.16);
--media-border-hot:1px solid rgba(154,219,232,.3);
--media-glint:linear-gradient(115deg,rgba(255,255,255,.10),transparent 32%);
--media-pane:linear-gradient(160deg,rgba(154,219,232,.08),rgba(154,219,232,.02) 45%,rgba(5,7,8,.4));
--media-blur:blur(16px) saturate(1.15);
--media-shadow:inset 0 1px 0 rgba(255,255,255,.09),inset 0 -1px 0 rgba(0,0,0,.45),0 34px 60px -30px rgba(0,0,0,.9);
--media-shadow-hot:inset 0 1px 0 rgba(255,255,255,.12),0 48px 76px -32px rgba(0,0,0,.95);
--media-img-filter:grayscale(.12) brightness(.9) contrast(1.05);
--media-img-filter-hot:grayscale(0) brightness(.95) contrast(1.06);
--media-gap:20px;
--media-aspect-still:16/10;
--media-aspect-cine:16/9;
--theme-source:"index.html · press-theme.css · QUANTANIUM pristine-ice-lake";
--theme-ver:"215";
}
/* ΓòÉΓòÉΓòÉ LEGACY COMPONENT HEAL ΓÇö restored 2026-07-10 ΓòÉΓòÉΓòÉ
Restores the component styling the theme strip deleted (359/394
pages had lost their layout). Press rules appear later in this
file and win all specificity ties; palette is mapped to press
tokens so interiors match the home theme exactly.
ΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉΓòÉ */
/* ΓÇö base token contract ΓÇö */
:root {
--slate-bg: var(--void) !important;
--slate-raised: var(--ink) !important;
--slate-sunken: var(--void) !important;
--slate-overlay: rgba(5,7,8,0.7) !important;
--slate-table: rgba(11,14,16,0.55) !important;
--slate-evidence-tint: rgba(154,219,232,0.035) !important;
--slate-ice-skin: rgba(154,219,232,0.045) !important;
--slate-ice-edge: rgba(154,219,232,0.16) !important;
--slate-depth-glow: rgba(154,219,232,0.06) !important;
--slate-abyss: var(--void) !important;
--slate-glass-blur: blur(24px) saturate(150%) !important;
/* WCAG / Quantanium: body ink = ivory on void — gold is severity only */
--slate-ink: var(--ivory) !important;
--slate-ink-strong: var(--ivory) !important;
--slate-ink-dim: var(--ivory-dim) !important;
--slate-ink-muted: var(--ivory-faint) !important;
--slate-ink-faint: var(--hair-lit) !important;
--slate-accent: var(--ice) !important;
--slate-accent-warm: var(--ivory) !important;
--slate-accent-deep: var(--ice-deep) !important;
--slate-accent-glow: rgba(154,219,232,0.09) !important;
--slate-link: var(--ice) !important;
--slate-link-hover: var(--ivory) !important;
--slate-brass: var(--gold) !important;
--slate-critical: var(--red) !important;
--slate-verified: var(--ice) !important;
--slate-warning: var(--gold) !important;
--slate-info: var(--ice) !important;
--slate-quantum: var(--ice) !important;
--slate-border: var(--hair) !important;
--slate-border-hot: var(--hair-lit) !important;
--slate-border-accent: rgba(154,219,232,0.28) !important;
--slate-font-sans: "Fraunces", Georgia, serif !important;
--slate-font-mono: "IBM Plex Mono", ui-monospace, monospace !important;
--slate-font-serif: "Fraunces", Georgia, serif !important;
--slate-font-display: "Fraunces", Georgia, serif !important;
--slate-font-accessible:"Fraunces", Georgia, serif !important;
--slate-text-6xl: clamp(2.5rem, 5vw, 10rem) !important;
--slate-text-5xl: clamp(2rem, 4vw, 8rem) !important;
--slate-text-4xl: clamp(1.75rem, 3.5vw, 6rem) !important;
--slate-text-3xl: clamp(1.5rem, 3vw, 4rem) !important;
--slate-text-2xl: clamp(1.25rem, 2vw, 3rem) !important;
--slate-text-xl: 1.25rem !important;
--slate-text-lg: 1.125rem !important;
--slate-text-base: 1.0625rem !important;
--slate-text-sm: 0.875rem !important;
--slate-text-xs: 0.75rem !important;
--slate-pad-2xs: 4px !important;
--slate-pad-xs: 8px !important;
--slate-pad-sm: 12px !important;
--slate-pad-md: 20px !important;
--slate-pad-lg: 32px !important;
--slate-pad-xl: 48px !important;
--slate-pad-2xl: 72px !important;
--slate-s-2xs: clamp(4px, 0.4vw, 6px) !important;
--slate-s-xs: clamp(8px, 0.8vw, 12px) !important;
--slate-s-sm: clamp(12px, 1.2vw, 20px) !important;
--slate-s-md: clamp(20px, 2.5vw, 36px) !important;
--slate-s-lg: clamp(36px, 4.5vw, 64px) !important;
--slate-s-xl: clamp(56px, 7vw, 100px) !important;
--slate-s-2xl: clamp(80px, 10vw, 140px) !important;
--slate-radius-xs: 2px !important;
--slate-radius-sm: 4px !important;
--slate-radius-md: 8px !important;
--slate-radius-lg: 12px !important;
--slate-radius-xl: 16px !important;
--slate-radius-pill: 999px !important;
--slate-shadow-sm: 0 2px 4px rgba(11,14,16,0.3) !important;
--slate-shadow-md: 0 4px 12px rgba(11,14,16,0.5) !important;
--slate-shadow-lg: 0 12px 32px rgba(11,14,16,0.6) !important;
--slate-shadow-xl: 0 24px 64px rgba(11,14,16,0.8) !important;
--slate-shadow-glass: 0 16px 48px rgba(5,7,8,0.65),
inset 0 1px 0 rgba(255, 255, 255, 0.18),
inset 0 0 0 1px rgba(255, 255, 255, 0.06) !important;
--slate-ease-out: cubic-bezier(0.22, 0.61, 0.36, 1) !important;
--slate-ease-in-out: cubic-bezier(0.65, 0.05, 0.35, 1) !important;
--slate-ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1) !important;
--slate-ease-cinema: cubic-bezier(0.16, 1, 0.3, 1) !important;
--slate-duration-fast: 120ms !important;
--slate-duration-base: 220ms !important;
--slate-duration-slow: 420ms !important;
--slate-duration-cinema: 700ms !important;
--slate-stagger-step: 80ms !important;
--slate-max-content: 780px !important;
--slate-max-data: 960px !important;
--slate-max-wide: clamp(1200px, 80vw, 3200px) !important;
--slate-nav-h: 56px !important;
--slate-z-base: 1 !important;
--slate-z-raised: 10 !important;
--slate-z-nav: 100 !important;
--slate-z-dropdown: 200 !important;
--slate-z-overlay: 500 !important;
--slate-z-walkthrough: 900 !important;
--slate-z-toast: 1000 !important;
--slate-z-modal: 1100 !important;
--slate-tokens-rev: "1.6.0-2026-07-11-art-science-uiux";
color-scheme: dark !important;
}
:root {
--bg: var(--slate-bg);
--bg-elev: var(--slate-raised);
--bg-elevated: var(--slate-raised);
--bg-card: var(--slate-raised);
--bg-card-h: var(--slate-raised);
--bg-surface: var(--slate-raised);
--bg-darker: var(--slate-overlay);
--bg-dark: var(--slate-overlay);
--bg-table: var(--slate-table);
--bg-evidence: var(--slate-evidence-tint);
--bg-handoff: var(--slate-evidence-tint);
--section-bg: var(--slate-bg);
--hero-bg: var(--slate-overlay);
--card-bg: var(--slate-raised);
--surface: var(--slate-raised);
--text: var(--slate-ink);
--text-primary: var(--slate-ink);
--text-secondary: var(--slate-ink-dim);
--text-tertiary: var(--slate-ink-muted);
--text-quaternary: var(--slate-ink-faint);
--text-light: var(--slate-ink-strong);
--text-light-muted: var(--slate-ink-muted);
--text-muted: var(--slate-ink-dim);
--text-dim: var(--slate-ink-muted);
--on-surface: var(--slate-ink);
--accent-bright: var(--slate-accent-warm);
--accent-glow: var(--slate-accent-glow);
--accent-soft: var(--slate-accent-glow);
--accent-med: var(--slate-accent-glow);
--accent-gold: var(--slate-accent);
--primary: var(--slate-accent);
--primary-light: var(--slate-accent-warm);
--secondary: var(--slate-raised);
--color-gold: var(--slate-accent);
--color-royal-gold: var(--slate-accent);
--color-royal-gold-light: var(--slate-accent-warm);
--color-royal-gold-dark: var(--slate-accent-deep);
--color-critical: var(--slate-critical);
--color-warning: var(--slate-warning);
--color-verified: var(--slate-verified);
--color-info: var(--slate-info);
--color-green: var(--slate-verified);
--color-blue: var(--slate-info);
--color-purple: var(--slate-quantum);
--color-quantum: var(--slate-quantum);
--color-abcxyz: var(--slate-accent);
--color-ensign-red: var(--slate-critical);
--color-ensign-navy: var(--slate-overlay);
--color-royal-cream: var(--slate-ink);
--hud-cyan: var(--slate-info);
--hud-teal: var(--slate-info);
--hud-green: var(--slate-verified);
--hud-amber: var(--slate-accent);
--hud-glow-cyan: var(--slate-accent-glow);
--hud-glow-teal: var(--slate-accent-glow);
--hud-border: var(--slate-border);
--hud-border-accent: var(--slate-border-accent);
--border-handoff: var(--slate-border-accent);
--border: var(--slate-border);
--border-hover: var(--slate-border-hot);
--border-hot: var(--slate-border-hot);
--border-accent: var(--slate-border-accent);
--liril-ensign-red: var(--slate-accent);
--liril-ensign-red-deep: var(--slate-accent-deep);
--liril-gold: var(--slate-accent);
--liril-gold-bright: var(--slate-accent-warm);
--liril-navy: var(--slate-bg);
--liril-navy-deep: var(--slate-overlay);
--liril-navy-raised: var(--slate-raised);
--liril-navy-border: var(--slate-border);
--liril-text-primary: var(--slate-ink);
--liril-text-secondary: var(--slate-ink-dim);
--liril-text-dim: var(--slate-ink-muted);
--liril-text-accent: var(--slate-accent);
--liril-ai-cyan: var(--slate-info);
--liril-ai-quantum: var(--slate-quantum);
--liril-ai-amber: var(--slate-accent);
--liril-ai-emerald: var(--slate-verified);
--liril-radius-sm: var(--slate-radius-sm);
--liril-radius-md: var(--slate-radius-md);
--liril-radius-lg: var(--slate-radius-lg);
--liril-radius-pill: var(--slate-radius-pill);
--liril-pad-xs: var(--slate-pad-2xs);
--liril-pad-sm: var(--slate-pad-xs);
--liril-pad-md: var(--slate-pad-sm);
--liril-pad-lg: var(--slate-pad-md);
--liril-pad-xl: var(--slate-pad-lg);
--liril-shadow-sm: var(--slate-shadow-sm);
--liril-shadow-md: var(--slate-shadow-md);
--liril-shadow-lg: var(--slate-shadow-lg);
--liril-shadow-glow: var(--slate-shadow-glass);
--liril-ease-out: var(--slate-ease-out);
--liril-ease-in-out: var(--slate-ease-in-out);
--liril-duration-fast: var(--slate-duration-fast);
--liril-duration-base: var(--slate-duration-base);
--liril-duration-slow: var(--slate-duration-slow);
--liril-z-nav: var(--slate-z-nav);
--liril-z-overlay: var(--slate-z-overlay);
--liril-z-walkthrough: var(--slate-z-walkthrough);
--liril-z-toast: var(--slate-z-toast);
--liril-font-sans: var(--slate-font-sans);
--liril-font-mono: var(--slate-font-mono);
--liril-font-serif: var(--slate-font-serif);
--font-sans: var(--slate-font-sans);
--font-mono: var(--slate-font-mono);
--font-headline: var(--slate-font-display);
--font-body: var(--slate-font-sans);
--font-hud: var(--slate-font-display);
--text-xs: var(--slate-text-xs);
--text-sm: var(--slate-text-sm);
--text-base: var(--slate-text-base);
--text-lg: var(--slate-text-lg);
--text-xl: var(--slate-text-xl);
--text-2xl: var(--slate-text-2xl);
--text-3xl: var(--slate-text-3xl);
--text-4xl: var(--slate-text-4xl);
--text-5xl: var(--slate-text-5xl);
--text-6xl: var(--slate-text-6xl);
--s-2xs: var(--slate-s-2xs);
--s-xs: var(--slate-s-xs);
--s-sm: var(--slate-s-sm);
--s-md: var(--slate-s-md);
--s-lg: var(--slate-s-lg);
--s-xl: var(--slate-s-xl);
--s-2xl: var(--slate-s-2xl);
--r-sm: var(--slate-radius-sm);
--r-md: var(--slate-radius-md);
--r-lg: var(--slate-radius-lg);
--r-xl: var(--slate-radius-xl);
--shadow-sm: var(--slate-shadow-sm);
--shadow-md: var(--slate-shadow-md);
--shadow-lg: var(--slate-shadow-lg);
--shadow-glass: var(--slate-shadow-glass);
--shadow-glass-h: var(--slate-shadow-glass);
--backdrop-card: blur(12px) saturate(160%);
--ease: var(--slate-ease-out);
--ease-spring: var(--slate-ease-spring);
--dur-fast: var(--slate-duration-fast);
--dur: var(--slate-duration-base);
--dur-slow: var(--slate-duration-slow);
--max-content: var(--slate-max-content);
--max-data: var(--slate-max-data);
--max-wide: var(--slate-max-wide);
--nav-h: var(--slate-nav-h);
--tnt-tick-ms: 7830;
--tnt-loom-cell: var(--slate-radius-sm);
}
body.topo,
body.topo::before {
background-image:
radial-gradient(ellipse 140% 70% at 50% -15%,
rgba(154,219,232,0.055) 0%,
transparent 55%),
linear-gradient(180deg, var(--ink) 0%, var(--void) 40%, var(--void) 100%) !important;
background-color: var(--slate-bg) !important;
}
.ice-panel,
.glass-card,
.liril-glass,
.liril-glass-strong {
/* Glass optics: white top-glint (specular) + translucent stack — no cyan rim */
background:
linear-gradient(180deg,
rgba(255, 255, 255, 0.09) 0%,
rgba(255, 255, 255, 0.02) 22%,
transparent 48%),
linear-gradient(165deg,
rgba(154, 219, 232, 0.05) 0%,
rgba(5, 7, 8, 0.55) 100%) !important;
border: 1px solid rgba(154, 219, 232, 0.14) !important;
border-radius: var(--slate-radius-md) !important;
box-shadow:
0 12px 40px rgba(5, 7, 8, 0.45),
inset 0 1px 0 rgba(255, 255, 255, 0.12),
inset 0 0 0 1px rgba(255, 255, 255, 0.04) !important;
backdrop-filter: var(--slate-glass-blur);
-webkit-backdrop-filter: var(--slate-glass-blur);
transition: transform var(--slate-duration-base) var(--slate-ease-out),
border-color var(--slate-duration-base) var(--slate-ease-out),
box-shadow var(--slate-duration-base) var(--slate-ease-out) !important;
}
.ice-panel:hover,
.glass-card:hover,
.liril-glass:hover {
transform: translateY(-2px) !important;
border-color: var(--slate-border-hot) !important;
box-shadow: 0 20px 56px rgba(5,7,8,0.75), inset 0 1px 0 rgba(255, 255, 255, 0.22), inset 0 0 0 1px rgba(255, 255, 255, 0.08) !important;
}
.ice-panel::before,
.glass-card::before {
content: "";
pointer-events: none;
position: absolute;
inset: 0 0 auto 0;
height: 1px;
background: linear-gradient(90deg,
transparent 0%,
var(--slate-ice-edge) 20%,
var(--slate-ice-edge) 80%,
transparent 100%);
opacity: 0.9;
}
.ice-panel,
.glass-card { position: relative; overflow: hidden; }
::selection {
background: rgba(154,219,232,0.28);
color: var(--ivory);
}
p a[href], li a[href], dd a[href], td a[href],
.prose a[href], .tnt-body a[href], .content a[href] {
text-decoration: underline !important;
text-decoration-thickness: 1px !important;
text-underline-offset: 2px !important;
text-decoration-color: var(--slate-border-hot) !important;
}
p a[href]:hover, li a[href]:hover, dd a[href]:hover, td a[href]:hover,
.prose a[href]:hover, .tnt-body a[href]:hover, .content a[href]:hover {
color: var(--slate-link-hover) !important;
text-decoration-color: var(--slate-ink) !important;
}
:root {
--quantanium-engine-color: var(--slate-quantum) !important;
--quantanium-engine-glow: rgba(154,219,232,0.16) !important;
--quantanium-engine-bg: rgba(154,219,232,0.06) !important;
--quantanium-engine-border: rgba(154,219,232,0.28) !important;
--quantanium-pvnp-solvable: var(--slate-verified) !important;
--quantanium-pvnp-np-exposed: var(--slate-warning) !important;
--quantanium-pvnp-loom-break: var(--slate-critical) !important;
--quantanium-pvnp-unknown: var(--slate-ink-muted) !important;
--quantanium-decoder-pulse: rgba(154,219,232,0.4) !important;
--quantanium-decoder-trail: rgba(154,219,232,0.1) !important;
--quantanium-tick-ms: 220ms !important;
--quantanium-tick-fast: 90ms !important;
--quantanium-tick-slow: 420ms !important;
--quantanium-bench-accuracy: var(--slate-verified) !important;
--quantanium-bench-efficiency: var(--slate-info) !important;
--quantanium-bench-speed: var(--slate-warning) !important;
--quantanium-bench-artistic: var(--slate-quantum) !important;
}
0,700;1,400;1,700&family=IBM+Plex+Mono:wght@400;500;600;700&display=swap');
html[data-reading="accessible"],
html[data-reading="accessible"] body {
font-family: var(--slate-font-accessible) !important;
letter-spacing: 0.01em !important;
line-height: 1.75 !important;
}
html[data-reading="accessible"] h1,
html[data-reading="accessible"] h2,
html[data-reading="accessible"] h3,
html[data-reading="accessible"] h4,
html[data-reading="accessible"] h5,
html[data-reading="accessible"] h6 {
font-family: var(--slate-font-accessible) !important;
letter-spacing: 0.005em !important;
}
html[data-reading="accessible"] p,
html[data-reading="accessible"] li,
html[data-reading="accessible"] td,
html[data-reading="accessible"] dd {
font-size: 1.0625rem !important;
line-height: 1.85 !important;
word-spacing: 0.05em !important;
}
@media (prefers-reduced-motion: reduce) {
html[data-reading="accessible"] * { transition: none !important; }
}
.reading-mode-toggle {
position: fixed;
bottom: var(--slate-pad-md);
right: var(--slate-pad-md);
z-index: var(--slate-z-toast);
display: inline-flex;
align-items: center;
gap: var(--slate-pad-xs);
padding: var(--slate-pad-xs) var(--slate-pad-sm);
background: var(--slate-raised);
border: 1px solid var(--slate-border);
border-radius: var(--slate-radius-pill);
color: var(--slate-ink-dim);
font-family: var(--slate-font-mono);
font-size: var(--slate-text-xs);
cursor: pointer;
transition: background var(--slate-duration-base) var(--slate-ease-out),
border-color var(--slate-duration-base) var(--slate-ease-out);
}
.reading-mode-toggle:hover,
.reading-mode-toggle:focus-visible {
background: var(--slate-bg);
border-color: var(--slate-accent);
color: var(--slate-ink);
outline: none;
}
html[data-reading="accessible"] .reading-mode-toggle {
border-color: var(--slate-accent);
color: var(--slate-accent);
}
.reading-mode-toggle::before {
content: "Aa";
font-weight: 700;
font-size: 0.95em;
letter-spacing: -0.04em;
}
/* ΓÇö utility pack ΓÇö */
@supports (text-wrap: balance) {
.u-balance { text-wrap: balance; }
}
@supports (text-wrap: pretty) {
.u-pretty { text-wrap: pretty; }
}
@supports (scrollbar-gutter: stable) {
.u-gutter { scrollbar-gutter: stable; }
}
@supports (container-type: inline-size) {
.u-container { container-type: inline-size; }
}
/* ΓÇö sprite pack ΓÇö */
.q-icon {
display: inline-block;
width: 1em;
height: 1em;
vertical-align: middle;
fill: currentColor;
stroke: currentColor;
flex-shrink: 0;
}
.q-icon use { fill: inherit; stroke: inherit; }
.q-icon-sm { width: 0.875em; height: 0.875em; }
.q-icon-md { width: 1em; height: 1em; }
.q-icon-lg { width: 1.5em; height: 1.5em; }
.q-icon-xl { width: 2em; height: 2em; }
.q-icon-2xl { width: 3em; height: 3em; }
.q-tone-default { color: var(--slate-ink); }
.q-tone-dim { color: var(--slate-ink-dim); }
.q-tone-muted { color: var(--slate-ink-muted); }
.q-tone-accent { color: var(--slate-accent); }
.q-tone-verified { color: var(--slate-verified); }
.q-tone-critical { color: var(--slate-critical); }
.q-tone-warning { color: var(--slate-warning); }
.q-tone-info { color: var(--slate-info); }
.q-tone-quantum { color: var(--slate-quantum); }
.q-icon.q-anim-pulse use {
transform-origin: center;
animation: q-anim-pulse-scale 1.6s ease-out infinite;
}
@keyframes q-anim-pulse-scale {
0% { opacity: 1; transform: scale(0.95); }
60% { opacity: 0.6; transform: scale(1.05); }
100% { opacity: 1; transform: scale(0.95); }
}
.q-icon.q-anim-spin use {
transform-origin: center;
animation: q-anim-spin-rotate 3.2s linear infinite;
}
@keyframes q-anim-spin-rotate {
from { transform: rotate(0); }
to { transform: rotate(360deg); }
}
.q-icon.q-anim-orbit ellipse {
transform-origin: center;
animation: q-anim-orbit-precess 12s linear infinite;
}
@keyframes q-anim-orbit-precess {
from { transform: rotate(0); }
to { transform: rotate(360deg); }
}
@media (prefers-reduced-motion: reduce) {
.q-icon.q-anim-pulse use,
.q-icon.q-anim-spin use,
.q-icon.q-anim-orbit ellipse { animation: none !important; }
}
.q-tier-dot { display: inline-block; line-height: 0; }
.q-tier-dot.q-pvnp-solvable { color: var(--quantanium-pvnp-solvable); }
.q-tier-dot.q-pvnp-np-exposed { color: var(--quantanium-pvnp-np-exposed); }
.q-tier-dot.q-pvnp-loom-break { color: var(--quantanium-pvnp-loom-break); }
.q-tier-dot.q-pvnp-unknown { color: var(--quantanium-pvnp-unknown); }
.q-video-slot {
position: relative;
display: block;
background: var(--slate-overlay);
border: 1px solid var(--slate-border);
border-radius: var(--slate-radius-md);
overflow: hidden;
aspect-ratio: 16 / 9;
color: var(--slate-ink-muted);
}
.q-video-slot:not(:has(video, img, picture, iframe))::before {
content: "";
position: absolute; inset: 0;
background: radial-gradient(
ellipse at center,
var(--slate-raised) 0%,
var(--slate-overlay) 70%);
}
.q-video-slot:not(:has(video, img, picture, iframe))::after {
content: attr(data-label, "Media pending");
position: absolute; inset: 0;
display: flex; align-items: center; justify-content: center;
font-family: var(--slate-font-mono);
font-size: var(--slate-text-sm);
letter-spacing: 0.18em;
text-transform: uppercase;
color: var(--slate-ink-muted);
}
.q-video-slot > video,
.q-video-slot > img,
.q-video-slot > picture,
.q-video-slot > iframe {
position: absolute; inset: 0;
width: 100%; height: 100%;
object-fit: cover;
display: block;
background: var(--slate-overlay);
}
.q-video-slot.q-aspect-21x9 { aspect-ratio: 21 / 9; }
.q-video-slot.q-aspect-square { aspect-ratio: 1 / 1; }
.q-video-slot.q-aspect-portrait { aspect-ratio: 3 / 4; }
.q-scene-btn {
display: inline-flex;
align-items: center;
justify-content: center;
width: 40px; height: 40px;
background: var(--slate-raised);
border: 1px solid var(--slate-border);
color: var(--slate-ink-dim);
border-radius: var(--slate-radius-pill);
cursor: pointer;
transition: background var(--slate-duration-base) var(--slate-ease-out),
color var(--slate-duration-base) var(--slate-ease-out),
border-color var(--slate-duration-base) var(--slate-ease-out);
}
.q-scene-btn:hover,
.q-scene-btn:focus-visible {
background: var(--slate-bg);
border-color: var(--slate-accent);
color: var(--slate-accent);
outline: none;
}
.q-scene-btn .q-icon { width: 1.25em; height: 1.25em; }
.q-video-slot.q-anim-scan::before {
background: linear-gradient(
180deg,
transparent 0%,
rgba(255,255,255,0.06) 50%,
transparent 100%);
background-size: 100% 200%;
animation: q-scan-line 3.6s ease-in-out infinite;
}
@keyframes q-scan-line {
0%, 100% { background-position: 0 -100%; }
50% { background-position: 0 100%; }
}
.q-video-slot.q-anim-noise::before {
background:
radial-gradient(circle at 20% 30%, rgba(255,255,255,0.05) 0%, transparent 1%),
radial-gradient(circle at 70% 60%, rgba(255,255,255,0.04) 0%, transparent 1%),
radial-gradient(circle at 40% 80%, rgba(255,255,255,0.03) 0%, transparent 1%),
var(--slate-overlay);
background-size: 7px 7px, 11px 11px, 5px 5px, 100% 100%;
animation: q-noise-shift 0.6s steps(4) infinite;
}
@keyframes q-noise-shift {
0% { background-position: 0 0, 0 0, 0 0, 0 0; }
25% { background-position: 7px -7px, -11px 11px, 5px 0, 0 0; }
50% { background-position: -7px 7px, 11px -11px, 0 -5px, 0 0; }
75% { background-position: 7px 7px, -11px -11px, -5px 5px, 0 0; }
100% { background-position: 0 0, 0 0, 0 0, 0 0; }
}
@media (prefers-reduced-motion: reduce) {
.q-video-slot.q-anim-scan::before,
.q-video-slot.q-anim-noise::before { animation: none !important; }
}
/* ΓÇö agent theme pack ΓÇö */
:root {
--liril-phase: 0.08;
--liril-hue: 220;
--liril-saturation: 4%;
--liril-warmth: 0.0;
--liril-bg-l: calc(8% + (var(--liril-phase) * 87%));
--liril-panel-l: calc(12% + (var(--liril-phase) * 80%));
--liril-text-l: calc(92% - (var(--liril-phase) * 80%));
--liril-dim-l: calc(68% - (var(--liril-phase) * 40%));
--liril-border-l: calc(22% + (var(--liril-phase) * 60%));
--liril-accent-l: calc(50% + (var(--liril-phase) * 8%));
--liril-glass-a: 1.0;
--liril-glass-border-a: 1.0;
--liril-bg: var(--slate-bg, var(--void));
--liril-bg-2: var(--slate-sunken, var(--ink));
--liril-panel: var(--slate-raised, var(--ink));
--liril-panel-solid: var(--slate-raised, var(--ink));
--liril-text: var(--slate-ink, var(--ice));
--liril-dim: var(--slate-ink-dim, var(--ice));
--liril-border: var(--slate-border, var(--hair));
--liril-border-solid: var(--slate-border, var(--hair));
--liril-accent: var(--slate-accent, var(--ice));
--liril-accent-dim: var(--slate-accent-deep, var(--ice));
--liril-blur: blur(16px) saturate(140%);
--liril-blur-strong: blur(24px) saturate(150%);
--liril-shadow: var(--slate-shadow-glass, 0 12px 40px rgba(5,7,8,0.55));
}
body, html.topo body, body.topo {
background: var(--liril-bg);
color: var(--liril-text);
transition: background 0.6s cubic-bezier(0.4, 0, 0.2, 1),
color 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}
.liril-glass {
background:
linear-gradient(180deg, rgba(255,255,255,0.04) 0%, rgba(255,255,255,0.01) 100%),
var(--liril-panel);
border: 1px solid var(--liril-border);
border-radius: 2px;
box-shadow: var(--liril-shadow);
backdrop-filter: var(--liril-blur);
-webkit-backdrop-filter: var(--liril-blur);
transition: background 0.4s, border-color 0.4s, box-shadow 0.4s;
}
.liril-glass-strong {
background:
linear-gradient(180deg, rgba(255,255,255,0.06) 0%, rgba(255,255,255,0.02) 100%),
var(--liril-panel);
border: 1px solid var(--liril-border);
border-radius: 2px;
box-shadow: var(--liril-shadow);
backdrop-filter: var(--liril-blur-strong);
-webkit-backdrop-filter: var(--liril-blur-strong);
}
a, .liril-accent-fg { color: var(--liril-accent); }
.liril-accent-bg { background: var(--liril-accent); color: var(--liril-bg); }
.liril-accent-border { border-color: var(--liril-accent); }
.liril-theme-slider-shell {
display: none !important;
}
.liril-slider-edge-trigger {
display: none !important;
}
.liril-theme-slider-mount {
display: inline-flex; align-items: center;
}
.liril-theme-slider-shell.liril-slider-mounted {
position: static !important;
transform: none !important;
opacity: 1 !important;
pointer-events: auto !important;
padding: 6px 12px;
display: inline-flex; align-items: center; gap: 10px;
background: transparent !important;
backdrop-filter: none !important;
-webkit-backdrop-filter: none !important;
border: 0 !important;
box-shadow: none !important;
border-radius: 14px;
font-size: 11px;
letter-spacing: 0.05em;
text-transform: uppercase;
color: var(--liril-dim);
}
.liril-theme-slider-shell.liril-slider-mounted label {
color: var(--liril-dim); font-size: 10px;
letter-spacing: 0.14em;
}
.liril-theme-slider-shell.liril-slider-mounted input[type=range] {
width: 120px;
}
.liril-theme-slider-shell.liril-slider-mounted .liril-slider-readout {
font-size: 10px; min-width: 58px;
}
.liril-theme-slider-shell.liril-slider-mounted .liril-hue-chip {
width: 14px; height: 14px;
}
@media (max-width: 768px) {
.liril-theme-slider-shell.liril-slider-mounted input[type=range] {
width: 80px;
}
.liril-theme-slider-shell.liril-slider-mounted .liril-slider-readout {
display: none;
}
.liril-theme-slider-shell.liril-slider-mounted label {
display: none;
}
}
.hero-section, .accountability-hero {
background: var(--liril-panel-solid) !important;
color: var(--liril-text) !important;
border-bottom: 1px solid var(--liril-border) !important;
}
.hero-hook { color: var(--liril-text) !important; }
.cta-button {
background: var(--liril-accent) !important;
color: var(--liril-bg) !important;
backdrop-filter: blur(6px);
transition: transform 0.25s var(--slate-ease-out), background 0.25s var(--slate-ease-out), box-shadow 0.25s var(--slate-ease-out) !important;
}
.cta-button:hover {
background: var(--liril-accent-dim) !important;
transform: translateY(-2px) !important;
box-shadow: var(--slate-shadow-md) !important;
}
:focus-visible {
outline: 2px solid var(--liril-accent);
outline-offset: 2px;
border-radius: 4px;
}
@media (prefers-reduced-motion: reduce) {
body, * { transition: none !important; animation: none !important; }
}
/* ΓÇö standard pack ΓÇö */
html:not([data-product="1"]) main,
html:not([data-product="1"]) article,
html:not([data-product="1"]) .content,
html:not([data-product="1"]) .page-content,
html:not([data-product="1"]) [role="main"] {
max-width: var(--slate-max-wide, 1200px) !important;
margin-inline: auto !important;
padding-inline: clamp(18px, 4vw, 44px) !important;
box-sizing: border-box;
}
html:not([data-product="1"]) main p,
html:not([data-product="1"]) main li,
html:not([data-product="1"]) main dd,
html:not([data-product="1"]) main blockquote,
html:not([data-product="1"]) .content p,
html:not([data-product="1"]) article p {
max-width: 74ch;
line-height: 1.72 !important;
}
html:not([data-product="1"]) a,
html:not([data-product="1"]) code,
html:not([data-product="1"]) pre {
overflow-wrap: anywhere;
word-break: break-word;
}
html:not([data-product="1"]) body {
font-family: var(--slate-font-sans, "Atkinson Hyperlegible", system-ui, sans-serif) !important;
}
html:not([data-product="1"]) td,
html:not([data-product="1"]) .metric-value,
html:not([data-product="1"]) .stat-value,
html:not([data-product="1"]) .count,
html:not([data-product="1"]) .num {
font-variant-numeric: tabular-nums !important;
}
html:not([data-product="1"]) main > section,
html:not([data-product="1"]) .content > section,
html:not([data-product="1"]) article > section {
margin-block: clamp(34px, 6vw, 72px) !important;
}
@media (max-width: 640px) {
html:not([data-product="1"]) main,
html:not([data-product="1"]) article,
html:not([data-product="1"]) .content {
padding-inline: 16px !important;
}
}
/* ΓÇö component pack ΓÇö */
:root {
--ease-out-expo: cubic-bezier(.16, 1, .3, 1);
--ease-out-quart: cubic-bezier(.25, 1, .5, 1);
--ease-inout: cubic-bezier(.65, 0, .35, 1);
--dur-1: 120ms; --dur-2: 240ms; --dur-3: 480ms; --dur-4: 800ms;
--step--1: clamp(.8333rem, .81rem + .12vw, .9rem);
--step-0: clamp(1rem, .96rem + .18vw, 1.125rem);
--step-1: clamp(1.2rem, 1.11rem + .43vw, 1.5rem);
--step-2: clamp(1.44rem, 1.28rem + .8vw, 2rem);
--step-3: clamp(1.7281rem, 1.46rem + 1.33vw, 2.6663rem);
--step-4: clamp(2.0738rem, 1.65rem + 2.11vw, 3.5525rem);
--step-5: clamp(2.4881rem, 1.85rem + 3.2vw, 4.7331rem);
--display: clamp(3rem, 1.86rem + 5.71vw, 7rem);
--display-stat: clamp(4rem, 2rem + 10vw, 11rem);
--ch-ground: var(--void);
--ch-grid: rgba(154,219,232,0.08);
--ch-domain: rgba(154,219,232,0.22);
--ch-tick: rgba(154,219,232,0.55);
--ch-label: var(--ice);
--ch-context: rgba(154,219,232,0.14);
--ch-s1: hsl(205 52% 68%);
--ch-s2: hsl(28 60% 66%);
--ch-s3: hsl(350 48% 66%);
--ch-s4: hsl(150 38% 62%);
--ch-up: var(--ch-s4); --ch-down: var(--ch-s3);
}
@media (prefers-reduced-motion: reduce) {
*, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}
.display {
font-family: var(--slate-font-display, var(--serif), sans-serif);
font-size: var(--display); line-height: .98; letter-spacing: -.02em;
font-weight: 700; text-wrap: balance; color: var(--slate-ink-strong, var(--ivory));
}
section.chapter, .content > section, main > section { counter-increment: sec; }
.eyebrow, .q-eyebrow {
display: flex; align-items: center; gap: .75rem;
font: 500 .75rem/1 "IBM Plex Mono", monospace;
letter-spacing: .12em; text-transform: uppercase;
color: var(--slate-ink-dim, var(--ice));
}
.q-eyebrow::before {
content: counter(sec, decimal-leading-zero) " /";
color: var(--slate-ink-muted, var(--ice-deep));
}
.eyebrow::after, .q-eyebrow::after {
content: ""; flex: 1; height: 1px; background: rgba(154,219,232,0.14);
}
.article {
display: grid; row-gap: var(--flow, 1.5rem);
grid-template-columns:
[full-start] minmax(clamp(1.25rem, 5vw, 6rem), 1fr)
[wide-start] minmax(0, 1fr)
[content-start] min(66ch, 100% - 2*clamp(1.25rem, 5vw, 6rem)) [content-end]
minmax(0, 2fr) [wide-end]
minmax(clamp(1.25rem, 5vw, 6rem), 1fr) [full-end];
}
.article > * { grid-column: content; }
.article > .breakout { grid-column: wide; }
.article > .full-bleed { grid-column: full; }
.chapter { padding-block: clamp(5rem, 4rem + 8vw, 11rem); }
.reveal { overflow: clip; }
.reveal .line {
display: block; transform: translateY(110%);
transition: transform var(--dur-4) var(--ease-out-expo);
}
.reveal.is-inview .line { transform: none; }
.reveal .line:nth-child(2) { transition-delay: 80ms; }
.reveal .line:nth-child(3) { transition-delay: 160ms; }
.q-rise { opacity: 0; transform: translateY(14px);
transition: opacity var(--dur-4) var(--ease-out-expo), transform var(--dur-4) var(--ease-out-expo); }
.q-rise.is-inview { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
.reveal .line, .q-rise { transform: none !important; opacity: 1 !important; }
}
.plate {
counter-increment: fig; position: relative;
border: 1px solid rgba(154,219,232,0.14); padding: 1rem;
background: rgba(154,219,232,0.02);
}
.plate::before, .plate::after {
content: ""; position: absolute; width: 9px; height: 9px;
border: 0 solid rgba(154,219,232,0.45);
}
.plate::before { top: -5px; left: -5px; border-width: 1px 0 0 1px; }
.plate::after { bottom: -5px; right: -5px; border-width: 0 1px 1px 0; }
.plate figcaption {
margin-top: .75rem; font: 500 .6875rem/1.5 "IBM Plex Mono", monospace;
letter-spacing: .12em; text-transform: uppercase; color: var(--slate-ink-dim, var(--ice));
}
.plate figcaption::before { content: "FIG. " counter(fig, decimal-leading-zero) " \2014 "; }
.redact {
background: var(--slate-accent, var(--ice)); color: transparent;
box-decoration-break: clone; -webkit-box-decoration-break: clone;
padding-inline: .15em;
transition: background-color var(--dur-3) var(--ease-out-quart), color var(--dur-3) var(--ease-out-quart);
}
.redact:hover, .redact:focus-visible, .redact.is-revealed {
background: transparent; color: inherit;
}
.q-link {
text-decoration: none; color: inherit;
background-image: linear-gradient(currentColor, currentColor);
background-size: 0% 1px; background-position: 100% 100%; background-repeat: no-repeat;
transition: background-size .35s var(--ease-out-quart);
}
.q-link:hover, .q-link:focus-visible { background-size: 100% 1px; background-position: 0% 100%; }
.q-link:focus-visible { outline: 1px solid var(--slate-accent, var(--ice)); outline-offset: 3px; }
.fig-duotone { position: relative; background: var(--hair); overflow: clip; border-radius: 10px; }
.fig-duotone img {
display: block; width: 100%;
filter: grayscale(1) contrast(1.08) brightness(.92);
mix-blend-mode: luminosity;
}
.fig-duotone::after {
content: ""; position: absolute; inset: 0; pointer-events: none;
background: linear-gradient(180deg, rgba(63,124,140,0.16), rgba(5,7,8,0.5));
mix-blend-mode: multiply;
}
figure.stat { margin: clamp(2rem, 5vw, 4rem) auto; text-align: center; }
.stat__claim {
font-size: 1rem; letter-spacing: .08em; text-transform: uppercase;
color: rgba(154,219,232,0.62); margin-bottom: .5rem;
}
.stat__num {
font-family:var(--mono); font-variant-numeric: tabular-nums;
font-size: var(--display-stat); line-height: 1;
color: var(--slate-accent, var(--ice)); letter-spacing: -.02em; margin: 0;
}
.stat__src {
font-family:var(--mono); font-size: .72rem;
color: rgba(154,219,232,0.45); margin-top: .6rem;
}
.tbl-wrap { max-height: 70vh; overflow: auto; border: 1px solid rgba(154,219,232,0.08); border-radius: 8px; }
table.evidence { border-collapse: collapse; width: 100%; font-size: .875rem; }
.evidence th {
position: sticky; top: 0; z-index: 2; background: var(--void);
text-align: left; font: 600 .72rem/1 "IBM Plex Mono", monospace;
letter-spacing: .08em; text-transform: uppercase; color: rgba(154,219,232,0.6);
padding: .65rem .75rem; box-shadow: 0 1px 0 rgba(154,219,232,0.14);
}
.evidence td { padding: .55rem .75rem; border-top: 1px solid rgba(154,219,232,0.06); color: var(--ice); }
.evidence td.num { text-align: right; font-family:var(--mono); font-variant-numeric: tabular-nums; }
.evidence td.bar { background: linear-gradient(to right, rgba(154,219,232,0.22) calc(var(--v) * 100%), transparent 0); }
.evidence .src-chip {
opacity: 0; transition: opacity .15s;
font: .68rem "IBM Plex Mono", monospace; color: rgba(154,219,232,0.55);
border: 1px solid rgba(154,219,232,0.18); border-radius: 999px; padding: .1rem .5rem;
}
.evidence tr:hover .src-chip, .evidence tr:focus-within .src-chip { opacity: 1; }
.bars { display: grid; gap: .45rem; padding: 0; margin: 1.2rem 0; }
.bars li { display: grid; grid-template-columns: 12ch 1fr 8ch; align-items: center; gap: .75rem; list-style: none; }
.bars__lbl { font-size: .8rem; color: rgba(154,219,232,0.75); }
.bars__bar { height: .9rem; border-radius: 2px; background: var(--ch-s1); transform-origin: left; transform: scaleX(var(--v)); opacity: .85; }
.bars__val { font: 400 .8rem "IBM Plex Mono", monospace; font-variant-numeric: tabular-nums; text-align: right; color: var(--ice); }
@media (prefers-reduced-motion: no-preference) {
.bars__bar { animation: q-grow .6s var(--ease-out-expo) both; }
@keyframes q-grow { from { transform: scaleX(0); } to { transform: scaleX(var(--v)); } }
}
.spark { width: 9ch; height: 1.1em; color: rgba(154,219,232,0.7); vertical-align: -0.15em; }
.chart text { font: .72rem "IBM Plex Mono", monospace; fill: var(--ch-tick); }
.chart .annot text { font: 600 .8rem "Atkinson Hyperlegible", sans-serif; fill: var(--ch-label); }
.chart .annot line { stroke: var(--ch-tick); stroke-dasharray: 2 3; }
.chart .grid line { stroke: var(--ch-grid); shape-rendering: crispEdges; }
.chart .domain { stroke: var(--ch-domain); }
.chart .projection { stroke-dasharray: 5 4; }
@supports (animation-timeline: scroll()) {
.q-progress {
position: fixed; inset: 0 0 auto 0; height: 2px; z-index: 900;
background: var(--slate-accent, var(--ice)); transform-origin: left;
transform: scaleX(0); animation: q-progress linear both;
animation-timeline: scroll(root);
}
@keyframes q-progress { to { transform: scaleX(1); } }
}
body.pres-active { scroll-behavior: auto !important; }
body.pres-active .q-rise, body.pres-active .reveal .line {
opacity: 1 !important; transform: none !important; transition: none !important;
}
.card:not(.glass), .panel:not(.glass), .data-card:not(.glass), .evidence-box:not(.glass), .finding-card:not(.glass), .info-box:not(.glass),
.metric-card:not(.glass), .stat-card:not(.glass), .evidence-entry:not(.glass), .ts-card:not(.glass), .ice-panel:not(.glass),
.glass-card:not(.glass), .liril-glass:not(.glass), .sm-cat:not(.glass), section[style*="gradient"]:not(.glass) {
-webkit-backdrop-filter: none !important;
backdrop-filter: none !important;
}
.scrolly { display: grid; grid-template-columns: minmax(28ch, 38ch) 1fr; gap: 3rem; }
.scrolly__graphic {
position: sticky; top: var(--header-h, 0px);
height: calc(100vh - var(--header-h, 0px));
grid-column: 2; grid-row: 1; display: flex; align-items: center;
}
.scrolly__steps { grid-column: 1; grid-row: 1; }
.scrolly__steps section { min-height: 85vh; opacity: .35; transition: opacity .4s ease-out; }
.scrolly__steps section.is-active { opacity: 1; }
.scrolly__steps section:last-child { margin-bottom: 40vh; }
.annot { opacity: 0; transform: translateY(4px); transition: opacity .35s ease-out, transform .35s ease-out; }
[data-state="1"] .annot[data-reveal="1"],
[data-state="2"] .annot[data-reveal="1"],
[data-state="2"] .annot[data-reveal="2"],
[data-state="3"] .annot { opacity: 1; transform: none; }
@media (max-width: 700px) {
.scrolly { grid-template-columns: 1fr; }
.scrolly__graphic { position: relative; height: auto; grid-column: 1; }
.scrolly__steps { grid-column: 1; grid-row: auto; }
.scrolly__steps section { min-height: 0; opacity: 1; }
}
body.pres-active {
scroll-behavior: auto !important;
scroll-snap-type: none !important;
scroll-snap-align: none !important;
background-attachment: scroll !important;
overscroll-behavior: none !important;
}
body.pres-active .q-rise,
body.pres-active .reveal,
body.pres-active .reveal .line {
opacity: 1 !important;
transform: none !important;
transition: none !important;
}
/* ΓòÉΓòÉΓòÉ END LEGACY COMPONENT HEAL ΓòÉΓòÉΓòÉ */
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--void)}
body{background:var(--void);color:var(--ivory);font-family:var(--serif);
font-weight:300;line-height:1.6;-webkit-font-smoothing:antialiased;position:relative}
body::after{content:"";position:fixed;inset:0;z-index:200;pointer-events:none;opacity:.05;
background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E")}
body::before{content:"";position:fixed;inset:0;z-index:0;pointer-events:none;
background:radial-gradient(120% 90% at 50% 8%,transparent 55%,rgba(0,0,0,.55) 100%)}
a{color:inherit;text-decoration:none}a:hover{color:var(--ice)}
::selection{background:var(--ice);color:var(--void)}
.js .rv{opacity:0;transform:translateY(26px);transition:opacity 1s ease,transform 1s ease}
.js .rv.in{opacity:1;transform:none}
.brand-crest,.nav-crest,img[src*="crest"],img[src*="royal_crest"]{display:none!important}
/* glass system ΓÇö every card is a pane over an aurora field */
.glass{position:relative;border-radius:8px;border:1px solid rgba(154,219,232,.16);
background:linear-gradient(160deg,rgba(154,219,232,.08),rgba(154,219,232,.02) 45%,rgba(5,7,8,.4));
backdrop-filter:blur(16px) saturate(1.15);-webkit-backdrop-filter:blur(16px) saturate(1.15);
box-shadow:inset 0 1px 0 rgba(255,255,255,.09),inset 0 -1px 0 rgba(0,0,0,.45),
0 34px 60px -30px rgba(0,0,0,.9);
transition:opacity 1s ease,transform .3s ease,box-shadow .3s ease,border-color .3s ease}
/* Do NOT hide bare .glass ΓÇö fetch-injected cards (daily briefing etc.) never get
the first-pass IntersectionObserver. Scroll-in is for .rv only. Optional:
.glass.rv still participates via .js .rv rules above. */
.glass::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
background:linear-gradient(115deg,rgba(255,255,255,.10),transparent 32%)}
.glass:hover{transform:translateY(-4px);border-color:rgba(154,219,232,.3);
box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 48px 76px -32px rgba(0,0,0,.95)}
.field{position:relative}
.field::before{content:"";position:absolute;inset:-4vh 0;pointer-events:none;z-index:0;
background:
radial-gradient(700px 380px at 12% 20%,rgba(63,124,140,.15),transparent 65%),
radial-gradient(560px 320px at 88% 70%,rgba(200,16,46,.06),transparent 62%),
radial-gradient(420px 260px at 60% 10%,rgba(211,166,37,.045),transparent 60%)}
.field>*{position:relative;z-index:1}
.wrapx{max-width:var(--slate-max-wide, 1200px);margin:0 auto;padding:0 clamp(20px,4vw,56px)}
@media(min-width:901px){.wrapx{padding-right:clamp(110px,10vw,150px)}}
.kick{font-family:var(--mono);font-size:10px;font-weight:500;letter-spacing:.26em;
text-transform:uppercase;color:var(--ice)}
.kick.red{color:var(--red)}
.meta{font-family:var(--mono);font-size:10.5px;color:var(--ivory-faint);letter-spacing:.06em}
.meta a{color:var(--ivory-dim);border-bottom:1px solid var(--hair-lit)}
.meta a:hover{color:var(--ice);border-color:var(--ice)}
/* cover */
.cover{min-height:100vh;display:flex;flex-direction:column;position:relative;
border-bottom:1px solid var(--hair);overflow:hidden;
background:
radial-gradient(1300px 560px at 72% -12%,rgba(63,124,140,.26),transparent 62%),
radial-gradient(900px 480px at 6% 112%,rgba(154,219,232,.09),transparent 60%),var(--void)}
.ghost5{position:absolute;right:1vw;bottom:-14vh;font-family:var(--serif);font-style:italic;
font-weight:300;font-size:56vh;line-height:1;color:transparent;
-webkit-text-stroke:1px rgba(154,219,232,.12);pointer-events:none;user-select:none}
.cover-bar{display:flex;justify-content:space-between;align-items:center;gap:18px;
padding:20px clamp(28px,4.4vw,64px);font-family:var(--mono);font-size:10.5px;
letter-spacing:.22em;color:var(--ivory-faint);text-transform:uppercase;
border-bottom:1px solid rgba(154,219,232,.12);position:relative;z-index:3;
background:linear-gradient(180deg,rgba(255,255,255,.05) 0%,transparent 70%);
box-shadow:inset 0 1px 0 rgba(255,255,255,.06)}
.brand{display:flex;align-items:center;gap:14px;text-transform:none}
.brand img{display:none!important}
.brand .wm{font-family:var(--serif);font-weight:600;font-size:18px;letter-spacing:.04em;color:var(--ivory)}
.brand .wm sup{font-size:.5em;color:var(--ice);position:relative;top:-.65em;vertical-align:baseline}
.cover-core{flex:1;display:flex;flex-direction:column;justify-content:center;
padding:6vh clamp(28px,4.4vw,64px);max-width:var(--slate-max-wide, 1200px);width:100%;margin:0 auto;position:relative;z-index:3}
.cover-kick{font-family:var(--mono);font-size:11px;letter-spacing:.34em;
text-transform:uppercase;color:var(--ice);margin-bottom:3vh}
.cover h1{font-weight:300;font-size:clamp(52px,8.4vw,124px);line-height:1.02;letter-spacing:-.02em}
.cover h1 em{font-style:italic;font-weight:400;color:var(--ice);text-shadow:0 0 16px rgba(154,219,232,.4)}
.cover .fr{margin-top:2vh;font-style:italic;font-weight:300;font-size:clamp(14px,1.6vw,18px);
color:var(--ivory-faint)}
.cover .fr::before{content:"";display:inline-block;width:34px;height:1px;background:var(--ice);
vertical-align:middle;margin-right:14px;box-shadow:0 0 10px rgba(154,219,232,.5)}
.cover .stand{margin-top:3.5vh;max-width:clamp(520px, 40vw, 1200px);font-size:clamp(15px, 1.6vw, 32px);color:var(--ivory-dim)}
.cover .stand b{color:var(--ivory);font-weight:600}
.cover-foot{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;
padding:0 clamp(28px,4.4vw,64px) 5vh;max-width:var(--slate-max-wide, 1200px);width:100%;margin:0 auto;
position:relative;z-index:3;flex-wrap:wrap}
.liril-intro{max-width:460px;border-left:1px solid var(--ice-deep);padding:6px 0 6px 22px}
.liril-intro .who{font-family:var(--mono);font-size:10px;letter-spacing:.3em;color:var(--ice);
text-transform:uppercase;margin-bottom:8px}
.liril-intro p{font-style:italic;font-size:15.5px;color:var(--ivory-dim)}
.begin{font-family:var(--mono);font-size:11px;letter-spacing:.26em;text-transform:uppercase;
color:var(--ivory);display:flex;flex-direction:column;align-items:center;gap:14px}
.begin .arrow{width:1px;height:56px;background:linear-gradient(180deg,var(--ivory-faint),var(--ice));
animation:drop 2.4s ease infinite}
@keyframes drop{0%{transform:scaleY(.2);transform-origin:top;opacity:0}
40%{transform:scaleY(1);opacity:1}100%{transform:scaleY(1);opacity:0}}
/* thesis */
.thesis{border-bottom:1px solid var(--hair);padding:10vh 0}
.thesis-grid{display:grid;grid-template-columns:1fr 1fr;gap:26px;margin-top:5vh}
@media(max-width:860px){.thesis-grid{grid-template-columns:1fr}}
.thesis .panel{padding:34px 36px}
.thesis .panel h4{font-family:var(--mono);font-size:10.5px;letter-spacing:.3em;
text-transform:uppercase;margin-bottom:18px}
.thesis .panel.dx h4{color:var(--red)}
.thesis .panel.rx h4{color:var(--ice)}
.thesis .panel p{font-size:15.5px;color:var(--ivory-dim);line-height:1.7}
.thesis .panel p b{color:var(--ivory);font-weight:600}
.thesis .links{margin-top:26px;font-family:var(--mono);font-size:10.5px;letter-spacing:.18em;
text-transform:uppercase;color:var(--ivory-faint)}
.thesis .links a{color:var(--ivory-dim);border-bottom:1px solid var(--hair-lit);margin-right:22px}
.thesis .links a:hover{color:var(--ice);border-color:var(--ice)}
.thesis-title{font-weight:300;font-size:clamp(30px,4.6vw,56px);line-height:1.05;letter-spacing:-.02em}
.thesis-title em{font-style:italic;color:var(--red);font-weight:400}
/* chapters */
.ch{position:relative;padding:0 0 10vh}
.ch::after{content:"";position:absolute;inset:auto 0 0 0;height:1px;background:linear-gradient(90deg,transparent,rgba(154,219,232,.15) 50%,transparent);pointer-events:none}
.ch:nth-of-type(even){background:linear-gradient(180deg,#090c0e,#07090b 30%,#07090b 70%,#05070a);
box-shadow:inset 0 1px 0 rgba(255,255,255,.03),inset 0 -1px 0 rgba(0,0,0,.6)}
.ch-head{max-width:var(--slate-max-wide, 1200px);margin:0 auto;padding:9vh clamp(20px,4vw,56px) 6vh;
display:grid;grid-template-columns:auto 1fr;gap:clamp(20px,4vw,64px);align-items:baseline;position:relative}
@media(min-width:901px){.ch-head{padding-right:clamp(110px,10vw,150px)}}
.ch-head .ghost{position:absolute;top:-4vh;right:clamp(0px,2vw,30px);font-style:italic;
font-weight:300;font-size:clamp(160px,24vw,340px);line-height:1;color:transparent;
-webkit-text-stroke:1px rgba(236,231,220,.05);pointer-events:none;user-select:none;z-index:0}
.ch-head>*{position:relative;z-index:1}
.ch-no{font-family:var(--mono);font-size:11px;letter-spacing:.3em;color:var(--ivory-faint);
text-transform:uppercase;white-space:nowrap}
.ch-no .roman{display:block;font-family:var(--serif);font-size:clamp(40px,5vw,64px);
font-weight:300;color:var(--ivory);letter-spacing:0;line-height:1;margin-top:10px}
.ch-title{font-weight:300;font-size:clamp(34px,5.4vw,72px);line-height:1.04;letter-spacing:-.02em}
.ch-title em{font-style:italic;color:var(--ice);font-weight:400}
.ch-when{grid-column:2;font-family:var(--mono);font-size:11px;letter-spacing:.22em;
color:var(--ivory-faint);text-transform:uppercase;margin-top:14px}
@media(max-width:700px){.ch-head{grid-template-columns:1fr}.ch-when{grid-column:1}}
/* wire */
.wire{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
@media(max-width:1000px){.wire{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.wire{grid-template-columns:1fr}}
.wire .glass{padding:26px 28px;display:flex;flex-direction:column;gap:10px}
.wire .glass.lead-card{grid-column:span 2}
@media(max-width:640px){.wire .glass.lead-card{grid-column:auto}}
.wire time{font-family:var(--mono);font-size:10px;letter-spacing:.18em;color:var(--ice-deep);
text-transform:uppercase}
.wire h3{font-weight:600;font-size:18px;line-height:1.32}
.wire .lead-card h3{font-weight:400;font-size:clamp(22px,2.4vw,30px);line-height:1.16}
.wire p{font-size:13.5px;color:var(--ivory-dim)}
.wire .lead-card p{font-size:15px}
.wire .lead-card p::first-letter{font-size:3.2em;font-weight:600;float:left;line-height:.82;
padding:4px 10px 0 0;color:var(--ice)}
.wire .meta{margin-top:auto;padding-top:10px;border-top:1px solid rgba(154,219,232,.1)}
/* feature */
.feature{display:grid;grid-template-columns:1.5fr 1fr;gap:clamp(24px,4vw,56px)}
@media(max-width:900px){.feature{grid-template-columns:1fr}}
.feature .main{padding:38px 42px}
.feature .main h3{font-weight:400;font-size:clamp(26px,3.4vw,40px);line-height:1.12;margin:14px 0 20px}
.feature .lede{font-size:clamp(16px,1.8vw,20px);color:var(--ivory);line-height:1.65}
.feature .lede::first-letter{font-size:3.6em;font-weight:600;float:left;line-height:.8;
padding:6px 12px 0 0;color:var(--ice)}
.feature .body-t{margin-top:20px;font-size:15px;color:var(--ivory-dim)}
.pull{padding:30px 34px;margin-bottom:18px;position:relative}
.pull::after{content:"\201C";position:absolute;top:-26px;left:6px;font-size:130px;line-height:1;
color:rgba(154,219,232,.10);font-style:italic;pointer-events:none}
.pull p{font-style:italic;font-weight:300;font-size:clamp(20px,2.3vw,27px);line-height:1.32;position:relative}
.pull p b{color:var(--ice);font-weight:400}
.side .glass{padding:20px 24px;margin-bottom:14px}
.side h4{font-weight:600;font-size:16px;line-height:1.35;margin:8px 0 4px}
.side p{font-size:13px;color:var(--ivory-dim)}
/* exhibits */
.exhibits{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}
@media(max-width:820px){.exhibits{grid-template-columns:1fr}}
.exhibit{padding:32px 34px}
.exhibit .tag{position:absolute;top:-9px;left:24px;background:linear-gradient(180deg,var(--void),rgba(9,13,16,.9));padding:2px 10px;
font-family:var(--mono);font-size:9.5px;letter-spacing:.26em;color:var(--ivory-faint);
text-transform:uppercase;border:1px solid rgba(154,219,232,.2);border-radius:2px;z-index:2;box-shadow:0 4px 10px rgba(0,0,0,0.5)}
.exhibit .claim-q{font-style:italic;font-weight:300;font-size:19px;line-height:1.4;
margin-bottom:16px;padding-right:118px}
@media(max-width:700px){
.exhibit{padding-top:52px}
.exhibit .claim-q{padding-right:0}
}
.exhibit .finding{font-size:13.5px;color:var(--ivory-dim);border-top:1px solid rgba(154,219,232,.12);
padding-top:14px}
.exhibit .finding b{color:var(--ivory);font-weight:600}
.stamp{position:absolute;top:24px;right:24px;font-family:var(--mono);font-size:.6rem;font-weight:600;
letter-spacing:.14em;text-transform:uppercase;padding:4px 10px;border:1px solid;border-radius:2px;z-index:2;
backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
.stamp.bad{color:var(--red);border-color:var(--red);background:rgba(200,16,46,.15);box-shadow:0 0 15px rgba(200,16,46,.25),inset 0 1px 0 rgba(255,255,255,.15)}
.stamp.ok{color:#7fbf9a;border-color:#7fbf9a;background:rgba(127,191,154,.15);box-shadow:0 0 15px rgba(127,191,154,.25),inset 0 1px 0 rgba(255,255,255,.15)}
.stamp.warn{color:var(--gold);border-color:var(--gold);background:rgba(224,196,122,.15);box-shadow:0 0 15px rgba(224,196,122,.25),inset 0 1px 0 rgba(255,255,255,.15)}
/* dossiers */
.dossier{display:grid;grid-template-columns:96px 1fr auto;gap:clamp(16px,3vw,44px);
align-items:center;padding:28px 32px;margin-bottom:16px;
background:linear-gradient(135deg, rgba(154,219,232,.04), rgba(5,7,8,.4));
border:1px solid rgba(154,219,232,.1);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
box-shadow:inset 0 1px 0 rgba(255,255,255,.05);transition:all .3s ease;text-decoration:none}
.dossier:hover{transform:translateY(-2px);box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 20px 40px rgba(0,0,0,.5),0 0 20px rgba(154,219,232,.1);border-color:rgba(154,219,232,.3)}
.dossier .no{font-family:var(--mono);font-weight:700;font-size:34px;color:rgba(154,219,232,.3);letter-spacing:.05em}
.dossier h3{font-family:var(--serif);font-weight:300;font-size:clamp(20px,2.4vw,27px);color:var(--ice);line-height:1.2;margin-bottom:8px;text-shadow:0 0 10px rgba(154,219,232,.2)}
.dossier p{font-size:14px;color:var(--ivory-dim);max-width:620px}
.dossier .meta{font-family:var(--mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--ivory-faint);white-space:nowrap}
@media(max-width:700px){.dossier{grid-template-columns:1fr}.dossier .no{font-size:26px}}
/* era */
.era{max-width:var(--slate-max-wide, 1200px);margin:0 auto;padding:0 clamp(20px,4vw,56px);text-align:center}
.era h3{font-weight:300;font-size:clamp(38px,6vw,84px);line-height:1.05;letter-spacing:-.02em;margin:3vh 0}
.era h3 em{font-style:italic;font-weight:400;color:var(--ice)}
.era p{max-width:560px;margin:0 auto;color:var(--ivory-dim);font-size:16px}
.era .stats{font-family:var(--mono);font-size:11px;letter-spacing:.2em;color:var(--ivory-faint);
text-transform:uppercase;margin-top:4vh}
.era .go-film{display:inline-block;margin-top:4.5vh;font-family:var(--mono);font-size:11px;
font-weight:600;letter-spacing:.26em;text-transform:uppercase;color:var(--void);
background:var(--ice);padding:16px 38px;border-radius:3px;transition:all .25s ease;
box-shadow:0 16px 44px -12px rgba(154,219,232,.38)}
.era .go-film:hover{background:var(--ivory);transform:translateY(-2px);
box-shadow:0 22px 54px -12px rgba(154,219,232,.5)}
.era .alt{display:block;margin-top:18px;font-family:var(--mono);font-size:10px;
letter-spacing:.2em;color:var(--ivory-faint);text-transform:uppercase}
.era .alt a{color:var(--ivory-dim);border-bottom:1px solid var(--hair-lit)}
.era .alt a:hover{color:var(--ice);border-color:var(--ice)}
/* rail + dock */
.rail{position:fixed;right:clamp(10px,2.4vw,34px);top:50%;transform:translateY(-50%);z-index:90;
display:flex;flex-direction:column;align-items:flex-end}
.rail .seg{display:flex;align-items:center;gap:12px;padding:11px 0}
.rail .lbl{font-family:var(--mono);font-size:9px;letter-spacing:.24em;color:var(--ivory-faint);
text-transform:uppercase;opacity:0;transform:translateX(6px);transition:all .4s ease}
.rail .dot{width:8px;height:8px;border-radius:50%;border:1px solid var(--ivory-faint);
background:var(--void);transition:all .4s ease}
.rail .seg:hover .lbl{opacity:1;transform:none}
.rail .seg.on .dot{background:var(--ice);border-color:var(--ice);box-shadow:0 0 10px rgba(238,246,250,.4)}
.rail .seg.on .lbl{opacity:1;transform:none;color:var(--ivory)}
@media(max-width:900px){.rail{display:none}}
/* LIRIL guide dock ΓÇö always visible on home (guide chrome, not a footer afterthought) */
.dock{position:fixed;left:0;right:0;bottom:0;z-index:95;
/* Quantanium dock: white top-glint + ice border, soft void shadow (not cyan bloom) */
background:
linear-gradient(180deg,rgba(255,255,255,.07) 0%,transparent 18%),
linear-gradient(180deg,rgba(9,13,16,.55),rgba(5,7,8,.96) 42%,rgba(5,7,8,.99));
border-top:1px solid rgba(154,219,232,.22);backdrop-filter:blur(22px) saturate(130%);
-webkit-backdrop-filter:blur(22px) saturate(130%);
box-shadow:0 -20px 40px -16px rgba(0,0,0,.88),inset 0 1px 0 rgba(255,255,255,.1);
transform:none;transition:transform .6s var(--ease-out-expo, cubic-bezier(0.16, 1, 0.3, 1)), box-shadow .4s ease}
.dock.speaking{
border-top-color:rgba(154,219,232,.4);
box-shadow:0 -22px 48px -16px rgba(0,0,0,.92),inset 0 1px 0 rgba(255,255,255,.14)}
.dock:not(.up):not(.guide-ready){transform:translateY(110%)}
.dock.up,.dock.guide-ready{transform:none}
.dock-in{max-width:var(--slate-max-wide, 1200px);margin:0 auto;display:flex;align-items:center;gap:14px;
padding:12px clamp(20px,4vw,56px);flex-wrap:wrap}
.dock .eq{display:flex;align-items:flex-end;gap:2.5px;height:18px;flex-shrink:0;opacity:.4;transition:opacity .3s}
.dock.speaking .eq{opacity:1}
.dock .eq i{display:block;width:3px;background:var(--ice);border-radius:1px;height:30%;box-shadow:0 0 4px rgba(154,219,232,.28)}
.dock.speaking .eq i{animation:eq 1s ease-in-out infinite}
/* Page-matched VO scroll focus — ice glint only, no neon */
.liril-voice-focus{
outline:1px solid rgba(154,219,232,.35);
outline-offset:6px;
box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 0 0 1px rgba(154,219,232,.12);
transition:outline-color .35s ease,box-shadow .35s ease}
@media (prefers-reduced-motion: reduce){
.dock.speaking .eq i{animation:none}
.liril-voice-focus{transition:none}
}
.dock .eq i:nth-child(2){height:70%;animation-delay:.12s}
.dock .eq i:nth-child(3){height:45%;animation-delay:.24s}
.dock .eq i:nth-child(4){height:90%;animation-delay:.36s}
.dock .eq i:nth-child(5){height:55%;animation-delay:.48s}
@keyframes eq{0%,100%{transform:scaleY(.4)}50%{transform:scaleY(1)}}
.dock .say{flex:1;min-width:min(100%,220px);font-style:italic;font-size:14px;color:var(--ivory-dim);
white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dock .say b{color:var(--ice);font-style:normal;font-family:var(--mono);font-size:10px;
letter-spacing:.24em;text-transform:uppercase;margin-right:12px}
.dock .liril-status{width:100%;order:5;font-family:var(--mono);font-size:10px;letter-spacing:.12em;
text-transform:uppercase;color:var(--ivory-faint);margin-top:2px}
.dock button{font-family:var(--mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;
background:rgba(255,255,255,0.03);border:1px solid rgba(154,219,232,.15);color:var(--ivory-dim);padding:7px 14px;
border-radius:2px;cursor:pointer;flex-shrink:0;transition:all .3s ease}
.dock button:hover{border-color:rgba(154,219,232,.4);color:var(--ice);box-shadow:inset 0 1px 0 rgba(255,255,255,.08)}
.dock button:focus-visible{outline:1px solid var(--ice);outline-offset:2px}
.dock button.on{
background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(154,219,232,.06) 50%,rgba(9,13,16,.7));
color:var(--ice);border-color:rgba(154,219,232,.42);
box-shadow:0 8px 24px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,255,255,.16)}
.dock #liril-guide-btn{border-color:rgba(154,219,232,.15);color:var(--ivory-dim)}
.dock #liril-guide-btn.on{
background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(154,219,232,.06) 50%,rgba(9,13,16,.7));
color:var(--ice);border-color:rgba(154,219,232,.42);
box-shadow:0 8px 24px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,255,255,.16)}
/* Cover guide CTA */
.liril-intro .guide-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}
.liril-intro .guide-cta{
font-family:var(--mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;
background:var(--ice);color:var(--void);border:1px solid var(--ice);padding:10px 16px;
border-radius:2px;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center}
.liril-intro .guide-cta:hover{filter:brightness(1.06);color:var(--void)}
body{padding-bottom:140px} /* room for LIRIL dock */
@media(max-width:640px){
.dock .say{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.dock-in{padding:10px 14px}
}
/* evidence shelf */
.shelf-controls{display:flex;gap:14px;margin:4vh 0;flex-wrap:wrap}
.shelf-controls input,.shelf-controls select{font-family:var(--mono);font-size:12px;
background:rgba(154,219,232,.05);border:1px solid var(--hair-lit);color:var(--ivory);
padding:11px 16px;border-radius:3px;min-width:220px}
.shelf-controls input:focus,.shelf-controls select:focus{outline:none;border-color:var(--ice-deep)}
.shelf-cat{font-family:var(--mono);font-size:10.5px;letter-spacing:.3em;color:var(--ice);
text-transform:uppercase;margin:6vh 0 3vh;display:flex;align-items:center;gap:18px}
.shelf-cat::after{content:"";flex:1;height:1px;background:var(--hair)}
.src-card{padding:26px 30px;margin-bottom:16px;display:grid;
grid-template-columns:1fr auto;gap:8px 26px;align-items:baseline}
@media(max-width:700px){.src-card{grid-template-columns:1fr}}
.src-card h3{font-weight:400;font-size:21px;line-height:1.25}
.src-card .what{grid-column:1;font-size:13.5px;color:var(--ivory-dim);margin-top:4px}
.src-card .attr{grid-column:1;font-family:var(--mono);font-size:10.5px;color:var(--ivory-faint);
letter-spacing:.06em;margin-top:10px;border-top:1px solid rgba(154,219,232,.1);padding-top:10px}
.src-card .attr a{color:var(--ice-deep);border-bottom:1px solid transparent}
.src-card .attr a:hover{color:var(--ice);border-color:var(--ice)}
.src-card .badges{grid-column:2;grid-row:1 / span 3;display:flex;flex-direction:column;
gap:8px;align-items:flex-end}
.vbadge{font-family:var(--mono);font-size:9px;font-weight:600;letter-spacing:.2em;
text-transform:uppercase;padding:4px 10px;border:1px solid;border-radius:2px}
.vbadge.v{color:#7fbf9a;border-color:rgba(127,191,154,.55)}
.vbadge.sv{color:var(--gold);border-color:rgba(211,166,37,.55)}
.vbadge.data{color:var(--ivory-faint);border-color:var(--hair-lit)}
.vbadge.data:hover{color:var(--ice);border-color:var(--ice);transform:translateY(-1px);box-shadow:0 2px 6px rgba(154,219,232,0.15)}
.note{font-size:12px;color:var(--gold);font-style:italic;margin-top:8px;grid-column:1}
/* article */
.article{max-width:760px;margin:0 auto;padding:10vh clamp(20px,4vw,56px)}
.article h1{font-weight:300;font-size:clamp(34px,5vw,58px);line-height:1.08;letter-spacing:-.02em;
margin:16px 0 24px}
.article .dek{font-size:19px;color:var(--ivory-dim);font-style:italic;margin-bottom:5vh}
.article .bodyp{font-size:16.5px;color:var(--ivory);margin-bottom:26px;line-height:1.75}
.article .bodyp:first-of-type::first-letter{font-size:3.6em;font-weight:600;float:left;
line-height:.8;padding:6px 12px 0 0;color:var(--ice)}
.article .srcs{margin-top:6vh;padding:26px 30px}
.article .srcs h4{font-family:var(--mono);font-size:10px;letter-spacing:.3em;color:var(--ice);
text-transform:uppercase;margin-bottom:14px}
/* briefing */
.threat{display:inline-flex;align-items:center;gap:8px;font-family:var(--mono);font-size:.68rem;
letter-spacing:.16em;text-transform:uppercase;padding:6px 12px;border:1px solid;border-radius:2px}
.threat::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.threat.AMBER{color:var(--slate-warning);border-color:rgba(201,164,76,.4)}
.threat.RED{color:var(--slate-critical);border-color:rgba(176,84,74,.4)}
.threat.GREEN{color:var(--slate-verified);border-color:rgba(110,143,104,.4)}
.read-brief{display:inline-flex;align-items:center;gap:12px;margin-top:3vh;
font-family:var(--mono);font-size:11px;font-weight:600;letter-spacing:.24em;
text-transform:uppercase;color:var(--void);background:var(--ice);padding:14px 30px;
border-radius:3px;cursor:pointer;border:none;
box-shadow:0 16px 44px -12px rgba(154,219,232,.38);transition:all .25s ease}
.read-brief:hover{background:var(--ivory);transform:translateY(-2px)}
.brief-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:22px}
@media(max-width:860px){.brief-grid{grid-template-columns:1fr}}
.brief-item{padding:26px 30px;display:flex;flex-direction:column;gap:10px}
.brief-item h3{font-weight:600;font-size:19px;line-height:1.3}
.brief-item p{font-size:13.5px;color:var(--ivory-dim)}
.tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
@media(max-width:900px){.tiles{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.tiles{grid-template-columns:1fr}}
.tile{padding:24px 26px}
.tile .v{font-family:var(--serif);font-weight:400;font-size:clamp(24px,2.6vw,34px);
letter-spacing:-.01em;line-height:1.1}
.tile.high .v{color:var(--red)}
.tile.watch .v{color:var(--gold)}
.tile.ok .v,.tile .v{color:var(--ice)}
.tile .l{font-family:var(--mono);font-size:10px;letter-spacing:.2em;color:var(--ivory-faint);
text-transform:uppercase;margin-top:8px}
.tile .n{font-size:12px;color:var(--ivory-dim);margin-top:8px;font-style:italic}
.horizon{display:grid;grid-template-columns:1fr 1fr;gap:26px}
@media(max-width:860px){.horizon{grid-template-columns:1fr}}
.h-col h3{font-family:var(--mono);font-size:10.5px;letter-spacing:.3em;
text-transform:uppercase;margin-bottom:18px}
.h-col.stated h3{color:var(--ice)}
.h-col.inferred h3{color:var(--gold)}
.h-col .glass{padding:22px 26px;margin-bottom:14px}
.h-col.inferred .glass{border-style:dashed;border-color:rgba(211,166,37,.35)}
.h-col h4{font-weight:600;font-size:16px;line-height:1.35;margin-bottom:6px}
.h-col p{font-size:13px;color:var(--ivory-dim)}
.conf{font-family:var(--mono);font-size:9px;letter-spacing:.18em;text-transform:uppercase;
color:var(--ivory-faint);display:block;margin-bottom:8px}
.contract{padding:26px 30px;font-family:var(--mono);font-size:12px;color:var(--ivory-dim);
line-height:2}
.contract b{color:var(--ice);letter-spacing:.2em;text-transform:uppercase;font-size:10px;
display:block;margin-bottom:10px}
.brief-err{font-family:var(--mono);font-size:12px;color:var(--gold);padding:20px 0}
/* network board — readable labels (was 1.15px viewBox garbage) */
.board-wrap{display:grid;grid-template-columns:1fr 320px;gap:22px}
@media(max-width:980px){.board-wrap{grid-template-columns:1fr}}
.board{padding:12px;overflow:hidden;border-radius:12px}
.board svg{display:block;width:100%;height:auto;min-height:360px}
.board .edge{stroke:rgba(154,219,232,.22);transition:stroke .25s ease}
.board .edge.hot{stroke:rgba(154,219,232,.72)}
.board .node{cursor:pointer}
.board .node circle{stroke:rgba(5,7,8,.85);stroke-width:1.2;transition:all .25s ease}
.board .node text{font-family:var(--mono);font-size:11px;fill:var(--ivory-dim);
pointer-events:none;paint-order:stroke;stroke:rgba(5,7,8,.75);stroke-width:3px}
.board .node:hover text,.board .node.sel text{fill:var(--ivory)}
.board .node:hover circle,.board .node.sel circle{stroke:var(--ice)}
.board .node.dim{opacity:.12;pointer-events:none}
.board .edge.dim{opacity:.06}
.detail{padding:26px 28px;align-self:start;position:sticky;top:20px}
.detail .kick{margin-bottom:10px;display:block}
.detail h3{font-weight:400;font-size:22px;line-height:1.2;margin-bottom:6px}
.detail .sub{font-family:var(--mono);font-size:10.5px;color:var(--ivory-faint);
letter-spacing:.1em;text-transform:uppercase;margin-bottom:14px}
.detail p{font-size:13.5px;color:var(--ivory-dim)}
.detail .cons{margin-top:16px;border-top:1px solid rgba(154,219,232,.12);padding-top:12px}
.detail .cons div{font-family:var(--mono);font-size:11px;color:var(--ivory-dim);padding:4px 0}
.detail .cons b{color:var(--ice);font-weight:500}
.detail a.open{display:inline-block;margin-top:16px;font-family:var(--mono);font-size:10px;
font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--ice);
border-bottom:1px solid var(--ice-deep)}
.chips{display:flex;gap:10px;flex-wrap:wrap;margin:3vh 0}
.chip{font-family:var(--mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;
padding:7px 14px;border:1px solid var(--hair-lit);border-radius:2px;color:var(--ivory-dim);
cursor:pointer;background:none;transition:all .2s ease}
.chip:hover{border-color:var(--ice);color:var(--ice)}
.chip.on{background:var(--ice);color:var(--void);border-color:var(--ice)}
.guide{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:5vh}
@media(max-width:860px){.guide{grid-template-columns:1fr}}
.guide .glass{padding:20px 24px;font-size:13px;color:var(--ivory-dim)}
.guide b{color:var(--ivory);font-weight:600;display:block;margin-bottom:6px;
font-family:var(--mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase}
/* footer */
footer{padding:8vh clamp(20px,4vw,56px) 14vh;max-width:var(--slate-max-wide, 1200px);margin:0 auto;
color:var(--ivory-faint);font-size:12.5px;position:relative;z-index:1}
footer .rowf{display:flex;justify-content:space-between;gap:40px;flex-wrap:wrap;
font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase}
footer .rowf a{color:var(--ivory-dim);margin-right:26px}
footer .fm{font-family:var(--serif);font-size:22px;font-weight:600;color:var(--ivory);
text-transform:none;letter-spacing:.02em}
footer .fm sup{font-size:.5em;color:var(--ice);position:relative;top:-.65em;vertical-align:baseline}
footer .origin{margin-top:5vh;border-top:1px solid rgba(154,219,232,.1);padding-top:22px;
font-family:var(--mono);font-size:10px;letter-spacing:.05em;line-height:1.9;position:relative}
footer .origin::before{content:"";position:absolute;top:-1px;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(154,219,232,.2) 50%,transparent)}
/* — SITEWIDE CHROME (same theme, every page) — */
.press-bar{
display:flex;justify-content:space-between;align-items:center;gap:18px;flex-wrap:wrap;
padding:16px clamp(20px,4.4vw,64px);
font-family:var(--mono);font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;
color:var(--ivory-faint);
border-bottom:1px solid rgba(154,219,232,.1);
background:linear-gradient(180deg,rgba(255,255,255,.04) 0%,rgba(5,7,8,.94) 40%);
backdrop-filter:blur(16px) saturate(1.08);
-webkit-backdrop-filter:blur(16px) saturate(1.08);
box-shadow:inset 0 1px 0 rgba(255,255,255,.06);
position:sticky;top:0;z-index:100;
}
.press-bar .wm{
font-family:var(--serif);font-weight:600;font-size:18px;letter-spacing:.04em;
color:var(--ivory);text-transform:none;text-decoration:none;
}
.press-bar .wm sup{font-size:.5em;color:var(--ice);position:relative;top:-.65em}
.press-bar nav{display:flex;flex-wrap:wrap;gap:4px 4px;align-items:center}
.press-bar nav a{color:var(--ivory-dim);text-decoration:none;padding:6px 10px}
.press-bar nav a:hover,.press-bar nav a.is-on{color:var(--ice)}
.press-main{
max-width:920px;margin:0 auto;
padding:clamp(40px,7vw,80px) clamp(20px,4vw,48px) 96px;
color:var(--ivory-dim);font-family:var(--serif);font-weight:300;line-height:1.65;
position:relative;z-index:1;
}
/* Type science: modular scale + optical tracking on display sizes */
.press-main h1,.press-main h2,.press-main h3{color:var(--ivory);font-weight:400;letter-spacing:-.02em;text-wrap:balance}
.press-main h1{font-size:clamp(2.1rem,4.8vw,3.4rem);line-height:1.08;margin:0 0 .45em}
.press-main h2{font-size:clamp(1.35rem,2.4vw,1.85rem);margin:1.6em 0 .5em;line-height:1.2}
.press-main a{color:var(--ice)}
.press-main a:hover{color:var(--ivory)}
.press-main p,.press-main li{max-width:68ch}
.press-main > .stand,.press-main > .dek{max-width:62ch;color:var(--ivory-dim)}
.press-main .inv-stat,.press-main .finding-box,.press-main .country-card,
.press-main .panel,.press-main .p-card,.press-main .unified-main .card,
.press-main article,.press-main .timeline-section{
background:
linear-gradient(180deg,rgba(255,255,255,.06) 0%,transparent 28%),
linear-gradient(160deg,rgba(154,219,232,.06),rgba(5,7,8,.42));
border:1px solid rgba(154,219,232,.14);border-radius:10px;
box-shadow:inset 0 1px 0 rgba(255,255,255,.07);
}
.press-foot{
max-width:920px;margin:0 auto;padding:22px clamp(20px,4vw,48px) 56px;
border-top:1px solid rgba(154,219,232,.1);font-family:var(--mono);font-size:10.5px;
letter-spacing:.08em;color:var(--ivory-faint);display:flex;flex-wrap:wrap;gap:10px 18px;
position:relative;z-index:1;
background:linear-gradient(0deg,rgba(255,255,255,.02) 0%,transparent 70%);
}
.press-foot::before{content:"";position:absolute;top:-1px;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.35) 50%,transparent)}
.press-foot a{color:var(--ivory-dim);text-decoration:none}
.press-foot a:hover{color:var(--ice)}
.press-foot a:focus-visible{outline:1px solid var(--ice);outline-offset:3px}
/* kill injected soup chrome everywhere */
.tnt-pillar-nav,.tnt-breadcrumb,.theme-slider,#theme-slider,.brand-crest,
.nav-crest,img[src*="crest"],img[src*="royal_crest"],.ambient-glow,
.grain-overlay,.vignette,#site-header-frame,#site-footer-frame,
body.product .p-top:not(.cover-bar){display:none!important}
/* — INTERIOR CONTENT (legacy product markup → press look) — */
body.press-interior{background:var(--void);color:var(--ivory-dim);min-height:100vh}
body.press-interior .content,
body.press-interior .tnt-style-130,
body.press-interior [class^="tnt-style"]{max-width:none}
body.press-interior .page-hero,
body.press-interior .ts-slate,
body.press-interior section{margin:0 0 2.2em}
body.press-interior .hero-tag,
body.press-interior .kick,
body.press-interior .ts-fact{
font-family:var(--mono);font-size:11px;letter-spacing:.22em;text-transform:uppercase;
color:var(--ice);margin:0 0 1em
}
body.press-interior .ts-fact,
body.press-interior .hero-sub,
body.press-interior p{
font-family:var(--serif);font-weight:300;font-size:1.05rem;line-height:1.7;color:var(--ivory-dim)
}
body.press-interior h1,body.press-interior h2,body.press-interior h3,
body.press-interior [class*="tnt-style-134"],
body.press-interior [class*="tnt-style-140"]{
font-family:var(--serif);font-weight:400;color:var(--ivory);letter-spacing:-.02em
}
body.press-interior .inv-stat-grid{
display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px;margin:1.5em 0 2em
}
body.press-interior .inv-stat{
padding:16px 14px;background:linear-gradient(160deg,rgba(154,219,232,.08),rgba(5,7,8,.45));
border:1px solid rgba(154,219,232,.16);border-radius:8px
}
body.press-interior .inv-stat .num,
body.press-interior .inv-stat .num-red,
body.press-interior .inv-stat .num-gold,
body.press-interior .inv-stat .num-blue,
body.press-interior .inv-stat .num-purple{
display:block;font-family:var(--serif);font-size:1.75rem;font-weight:400;color:var(--ice);line-height:1.1
}
body.press-interior .inv-stat .num-red{color:var(--red)}
body.press-interior .inv-stat .num-gold{color:var(--gold)}
body.press-interior .inv-stat .num-blue,
body.press-interior .inv-stat .num-purple{color:var(--ice)} /* no cyber rainbow */
body.press-interior .inv-stat .lbl{
display:block;margin-top:8px;font-family:var(--mono);font-size:10px;letter-spacing:.14em;
text-transform:uppercase;color:var(--ivory-faint)
}
body.press-interior .tnt-style-138,
body.press-interior .tnt-style-139{
display:grid;gap:14px;margin:1.2em 0
}
body.press-interior .tnt-style-139{
padding:18px 20px;border:1px solid rgba(154,219,232,.14);border-radius:8px;
background:linear-gradient(160deg,rgba(154,219,232,.06),rgba(5,7,8,.4))
}
body.press-interior a{color:var(--ice)}
body.press-interior a:hover{color:var(--ivory)}
/* neutralize leftover product footers if any slip through */
body.press-interior footer.p-foot{display:none!important}
/* film player mount — restrained, not HUD cosplay */
#liril-film-app{min-height:48vh;margin:1.5em 0 2em;padding:18px;
border:1px solid rgba(154,219,232,.16);border-radius:8px;
background:linear-gradient(160deg,rgba(154,219,232,.05),rgba(5,7,8,.5))}
#liril-film-app.hidden-until-start,[hidden].hidden-until-start{display:none!important}
body.is-playing .press-main > .stand{opacity:.85}
.press-main em{font-style:italic;color:var(--ice);font-weight:400}
.press-main .stand b{color:var(--ivory);font-weight:600}
.press-main .guide-cta{
font-family:var(--mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;
padding:12px 18px;border:none;border-radius:3px;cursor:pointer;
background:var(--ice);color:var(--void);font-weight:600
}
.press-main .guide-cta:hover{filter:brightness(1.06)}
.press-main .shelf-controls{display:flex;flex-wrap:wrap;gap:12px;margin:1.5em 0}
.press-main .shelf-controls input,
.press-main .shelf-controls select{
font-family:var(--mono);font-size:12px;padding:10px 12px;
background:rgba(5,7,8,.6);border:1px solid var(--hair-lit);color:var(--ivory);border-radius:4px
}
.press-main .src-card{padding:16px 18px;margin:0 0 12px}
.press-main .shelf-cat{
font-family:var(--mono);font-size:11px;letter-spacing:.22em;text-transform:uppercase;
color:var(--ice);margin:2em 0 .8em
}
/* TIMELINE SYSTEM (Chronology of Genocide) */
.timeline-grid {
position: relative;
max-width: 900px;
margin: 40px auto;
padding-left: 30px;
display: flex;
flex-direction: column;
gap: 32px;
}
.timeline-grid::before {
content: '';
position: absolute;
top: 0; bottom: 0; left: 10px;
width: 1px;
background: var(--slate-ice-edge, rgba(154,219,232,0.16));
}
.timeline-node {
position: relative;
}
.timeline-marker {
position: absolute;
left: -24px;
top: 14px;
width: 9px;
height: 9px;
border-radius: 50%;
background: var(--ice, #9adbe8);
/* Science: soft specular, not neon bloom */
box-shadow: 0 0 0 1px rgba(5,7,8,.55), 0 0 8px rgba(154,219,232,.22);
z-index: 2;
}
.timeline-marker.critical {
background: var(--red, #c8102e);
box-shadow: 0 0 0 1px rgba(5,7,8,.55), 0 0 8px rgba(200,16,46,.28);
}
.timeline-date {
font-family: var(--mono, 'IBM Plex Mono', monospace);
font-size: 14px;
letter-spacing: 0.1em;
color: var(--slate-ice, #9adbe8);
display: block;
margin-bottom: 8px;
}
.timeline-date.critical {
color: var(--slate-red, #c8102e);
}
.timeline-content {
padding: 24px;
}
/* MERGED PRODUCT.CSS */
/* ————————————————————————————————————————————————————————————————————————————
TENET5 PRODUCT SURFACE — CANONICAL (locked to live index.html 2026-07-10)
Load: tokens.css → product.css → (optional layout-only page CSS)
Theme source of truth: https://tenet-5.github.io/index.html
Ice lake #05080d / chrome #eef6fa · Atkinson + IBM Plex Mono
BANNED: liril-theme, tnt-override, quantanium, Cap# pillar, neon, crest
———————————————————————————————————————————————————————————————————————————— */
:root {
--p-bg: var(--slate-bg, #05080d);
--p-panel: var(--slate-raised, #0c1219);
--p-line: var(--slate-border, rgba(168, 188, 200, 0.14));
--p-ink: var(--slate-ink, #f5fafc);
--p-dim: var(--slate-ink-dim, #a8bcc8);
--p-muted: var(--slate-ink-muted, #6a7f8c);
--p-accent: var(--slate-accent, #eef6fa);
--p-crit: var(--slate-critical, #b0544a);
--p-ok: var(--slate-verified, #6e8f68);
--p-warn: var(--slate-warning, #c9a44c);
--p-sans: var(--slate-font-sans, "Atkinson Hyperlegible", system-ui, sans-serif);
--p-mono: var(--slate-font-mono, "IBM Plex Mono", ui-monospace, monospace);
--p-max: min(1120px, 94vw);
--p-wide: min(1280px, 94vw);
--p-ease: cubic-bezier(0.16, 1, 0.3, 1);
--p-dur: 240ms;
}
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body.product,
body[data-product="1"],
html[data-product="1"] body {
margin: 0;
min-height: 100vh;
background: var(--p-bg) !important;
color: var(--p-ink) !important;
font-family: var(--p-sans) !important;
font-size: 1.0625rem;
line-height: 1.6;
-webkit-font-smoothing: antialiased;
}
html[data-product="1"] #site-header-frame,
html[data-product="1"] #site-footer-frame,
html[data-product="1"] .liril-doc-start,
html[data-product="1"] #liril-doc-start,
html[data-product="1"] .tnt-pillar-nav,
html[data-product="1"] .tnt-breadcrumb,
html[data-product="1"] .theme-slider,
html[data-product="1"] #theme-slider,
html[data-product="1"] .liril-masthead,
html[data-product="1"] .liril-related,
html[data-product="1"] .grain-overlay,
html[data-product="1"] .vignette,
html[data-product="1"] .ambient-glow,
html[data-product="1"] .cap263-alert-card {
display: none !important;
}
.brand-crest,
.nav-crest,
.heraldic-crest,
img[src*="crest"],
img[src*="royal_crest"],
img[src*="heraldic"],
svg.brand-crest {
display: none !important;
visibility: hidden !important;
width: 0 !important;
height: 0 !important;
overflow: hidden !important;
position: absolute !important;
pointer-events: none !important;
}
.p-top {
position: sticky; top: 0; z-index: 100;
display: flex; align-items: center; gap: 14px; flex-wrap: wrap;
padding: 14px clamp(16px, 3vw, 28px);
background: rgba(5, 8, 13, 0.92);
backdrop-filter: blur(18px) saturate(140%);
-webkit-backdrop-filter: blur(18px) saturate(140%);
border-bottom: 1px solid rgba(168, 188, 200, 0.1);
}
.p-logo {
font-family: var(--p-mono); font-size: 0.72rem; font-weight: 700;
letter-spacing: 0.2em; color: var(--p-accent); text-decoration: none;
text-transform: uppercase;
}
.p-logo sup { font-size: 0.55em; letter-spacing: 0.08em; }
.p-nav { margin-left: auto; display: flex; flex-wrap: wrap; gap: 4px 16px; align-items: center; }
.p-nav a {
font-family: var(--p-mono); font-size: 0.62rem; letter-spacing: 0.14em;
text-transform: uppercase; color: var(--p-muted); text-decoration: none;
padding: 6px 0; border-bottom: 1px solid transparent;
transition: color var(--p-dur), border-color var(--p-dur);
}
.p-nav a:hover { color: var(--p-accent); border-bottom-color: rgba(238,246,250,0.25); }
.p-nav a.is-on { color: var(--p-accent); border-bottom-color: var(--p-accent); }
.p-wrap {
max-width: var(--p-max);
margin: 0 auto;
padding: clamp(40px, 7vw, 88px) clamp(16px, 3vw, 28px) clamp(56px, 8vw, 96px);
}
.p-wrap.wide { max-width: var(--p-wide); }
.p-kicker {
font-family: var(--p-mono);
font-size: 0.68rem; font-weight: 600;
letter-spacing: 0.24em; text-transform: uppercase;
color: var(--p-muted); margin: 0 0 16px;
}
.p-wrap > h1,
.p-title,
.p-display {
font-family: var(--p-sans);
font-size: clamp(2.5rem, 7vw, 4.75rem);
font-weight: 800;
letter-spacing: -0.04em;
line-height: 0.96;
color: #fff;
margin: 0 0 0.4em;
max-width: 13ch;
}
.p-lede {
font-size: clamp(1.05rem, 1.6vw, 1.22rem);
line-height: 1.65;
color: var(--p-dim);
max-width: 56ch;
margin: 0 0 28px;
}
.p-btn {
display: inline-flex; align-items: center; justify-content: center;
font-family: var(--p-mono); font-size: 0.68rem; letter-spacing: 0.12em;
text-transform: uppercase; text-decoration: none; font-weight: 600;
padding: 14px 20px;
border-radius: 2px;
border: 1px solid rgba(238, 246, 250, 0.28);
color: var(--p-ink); background: transparent;
cursor: pointer;
transition: border-color var(--p-dur), background var(--p-dur), color var(--p-dur);
}
.p-btn:hover { border-color: #fff; color: #fff; }
.p-btn.primary {
background: var(--p-accent);
color: #020408;
border-color: var(--p-accent);
}
.p-btn.primary:hover { filter: brightness(1.05); color: #020408; }
.p-row {
display: flex; flex-wrap: wrap; gap: 12px;
margin: 0 0 clamp(32px, 5vw, 48px);
}
.p-card {
background: rgba(12, 18, 25, 0.55);
border: 1px solid rgba(168, 188, 200, 0.12);
border-radius: 2px;
padding: clamp(18px, 2.5vw, 24px);
backdrop-filter: blur(12px);
}
.p-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
gap: 14px;
}
.p-grid a.p-card {
display: flex; flex-direction: column; gap: 10px;
min-height: 200px; text-decoration: none; color: inherit;
transition: border-color 0.2s var(--p-ease), transform 0.25s var(--p-ease);
}
.p-grid a.p-card:hover {
border-color: rgba(238, 246, 250, 0.35);
transform: translateY(-2px);
}
.p-grid .ord {
font-family: var(--p-mono); font-size: 0.62rem; letter-spacing: 0.18em;
text-transform: uppercase; color: var(--p-muted);
}
.p-grid h2 {
font-size: clamp(1.15rem, 2vw, 1.35rem);
font-weight: 700; letter-spacing: -0.02em;
margin: 0; color: #fff; line-height: 1.15;
}
.p-grid p {
color: var(--p-dim); font-size: 0.95rem; line-height: 1.55;
flex: 1; margin: 0;
}
.p-grid .go {
font-family: var(--p-mono); font-size: 0.62rem; letter-spacing: 0.14em;
text-transform: uppercase; color: var(--p-accent);
}
.p-metrics {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
gap: 12px;
margin: 0 0 clamp(36px, 5vw, 56px);
}
.p-metrics .m {
border: 1px solid rgba(168, 188, 200, 0.12);
border-radius: 2px;
padding: 16px;
background: rgba(12, 18, 25, 0.45);
}
.p-metrics .l {
display: block; font-family: var(--p-mono); font-size: 0.58rem;
letter-spacing: 0.16em; text-transform: uppercase; color: var(--p-muted);
}
.p-metrics strong {
display: block; margin-top: 8px;
font-size: clamp(1.2rem, 2.2vw, 1.55rem);
color: var(--p-accent); font-weight: 700; letter-spacing: -0.02em;
font-variant-numeric: tabular-nums;
}
.p-metrics .s {
display: block; margin-top: 4px; font-size: 0.78rem; color: var(--p-muted);
}
.p-note {
border-left: 2px solid rgba(238, 246, 250, 0.28);
padding: 14px 16px;
color: var(--p-muted);
font-size: 0.92rem;
line-height: 1.55;
max-width: 64ch;
margin: 0 0 clamp(28px, 4vw, 40px);
background: rgba(12, 18, 25, 0.35);
}
.p-foot {
max-width: var(--p-max); margin: 0 auto;
padding: 20px clamp(16px, 3vw, 28px) 48px;
border-top: 1px solid rgba(168, 188, 200, 0.1);
font-family: var(--p-mono); font-size: 0.68rem;
letter-spacing: 0.06em; color: var(--p-muted);
display: flex; flex-wrap: wrap; gap: 10px 18px;
}
.p-foot.wide { max-width: var(--p-wide); }
.p-foot a { color: var(--p-dim); text-decoration: none; }
.p-foot a:hover { color: var(--p-accent); }
.p-section {
max-width: var(--p-max);
margin: 0 auto;
padding: clamp(40px, 6vw, 72px) clamp(16px, 3vw, 28px);
border-top: 1px solid rgba(168, 188, 200, 0.08);
}
.p-section.wide { max-width: var(--p-wide); }
.p-section h2 {
font-size: clamp(1.35rem, 2.4vw, 1.75rem);
font-weight: 700; letter-spacing: -0.025em;
color: #fff; margin: 0 0 8px; line-height: 1.15;
}
.p-section .p-sub {
color: var(--p-dim); font-size: 0.98rem; max-width: 60ch; margin: 0 0 24px;
}
/* Investigation prose inside product shell */
html[data-product="1"] .unified-main,
html[data-product="1"] main.article,
html[data-product="1"] main.content {
max-width: var(--p-wide);
margin: 0 auto;
padding: clamp(28px, 5vw, 56px) clamp(16px, 3vw, 28px) clamp(56px, 8vw, 96px);
width: 100%;
flex: 1;
}
html[data-product="1"] .unified-main h1,
html[data-product="1"] main.article h1 {
font-size: clamp(1.8rem, 4vw, 2.75rem);
font-weight: 800;
letter-spacing: -0.03em;
color: #fff;
line-height: 1.1;
max-width: 22ch;
}
html[data-product="1"] .unified-main p,
html[data-product="1"] main.article p {
color: var(--p-dim);
max-width: 70ch;
line-height: 1.7;
}
html[data-product="1"] .unified-main a,
html[data-product="1"] main.article a {
color: var(--p-accent);
}
html[data-product="1"] .cap263-text-cyan,
html[data-product="1"] .cap263-text-blue,
html[data-product="1"] .cap263-text-violet,
html[data-product="1"] .cap263-text-purple,
html[data-product="1"] .num-blue,
html[data-product="1"] .num-purple {
color: var(--p-dim) !important;
}
html[data-product="1"] .cap263-text-gold,
html[data-product="1"] .num-gold {
color: var(--p-warn) !important;
}
html[data-product="1"] .cap263-text-red,
html[data-product="1"] .num-red {
color: var(--p-crit) !important;
}
@media (max-width: 640px) {
.p-nav { width: 100%; margin-left: 0; }
.p-wrap > h1, .p-title, .p-display { max-width: none; }
}
/* MERGED QUANTANIUM.CSS */
/* ————————————————————————————————————————————————————————————————————————————
QUANTANIUM.CSS — v1.5 editorial/data layer (2026-07-10)
————————————————————————————————————————————————————————————————————————————
The award-calibre craft layer from the QUANTANIUM 1.5 design contract
(docs/QUANTANIUM-1.5.md). Loads after tokens.css + standard.css.
Sections: type scale · eyebrows · article grid · reveals · plates ·
redaction · links · grain · duotone · stat lede · evidence tables ·
bar rows · chart tokens · progress rail.
Rules: ice-lake palette only; colour = data semantics; zero animation
under prefers-reduced-motion; content readable with JS off.
———————————————————————————————————————————————————————————————————————————— */
/* — MOTION + TYPE + CHART TOKENS (1.5 additions) ———————————————————————————— */
:root {
--ease-out-expo: cubic-bezier(.16, 1, .3, 1);
--ease-out-quart: cubic-bezier(.25, 1, .5, 1);
--ease-inout: cubic-bezier(.65, 0, .35, 1);
--dur-1: 120ms; --dur-2: 240ms; --dur-3: 480ms; --dur-4: 800ms;
/* Utopia two-slope fluid scale (1.2 @320 → 1.333 @1440) */
--step--1: clamp(.8333rem, .81rem + .12vw, .9rem);
--step-0: clamp(1rem, .96rem + .18vw, 1.125rem);
--step-1: clamp(1.2rem, 1.11rem + .43vw, 1.5rem);
--step-2: clamp(1.44rem, 1.28rem + .8vw, 2rem);
--step-3: clamp(1.7281rem, 1.46rem + 1.33vw, 2.6663rem);
--step-4: clamp(2.0738rem, 1.65rem + 2.11vw, 3.5525rem);
--step-5: clamp(2.4881rem, 1.85rem + 3.2vw, 4.7331rem);
--display: clamp(3rem, 1.86rem + 5.71vw, 7rem);
--display-stat: clamp(4rem, 2rem + 10vw, 11rem);
/* chart tokens — every chart obeys these */
--ch-ground: #05080d;
--ch-grid: rgba(238, 246, 250, .08);
--ch-domain: rgba(238, 246, 250, .22);
--ch-tick: rgba(238, 246, 250, .55);
--ch-label: #eef6fa;
--ch-context: rgba(238, 246, 250, .14);
--ch-s1: hsl(205 52% 68%); /* glacial blue — primary series */
--ch-s2: hsl(28 60% 66%); /* amber — comparison */
--ch-s3: hsl(350 48% 66%); /* muted red — deaths/deficit */
--ch-s4: hsl(150 38% 62%); /* sage — surplus/ok */
--ch-up: var(--ch-s4); --ch-down: var(--ch-s3);
}
html { font-synthesis: none; }
@media (prefers-reduced-motion: reduce) {
*, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}
/* — DISPLAY TYPE ———————————————————————————————————————————————————————————— */
.display {
font-family: var(--slate-font-display, var(--serif), sans-serif);
font-size: var(--display); line-height: .98; letter-spacing: -.02em;
font-weight: 700; text-wrap: balance; color: var(--slate-ink-strong, #fff);
}
h1 { font-size: var(--step-5); }
h2 { font-size: var(--step-3); }
h3 { font-size: var(--step-1); }
h1, h2, h3 { text-wrap: balance; }
/* — MONO EYEBROW / INDEX LAYER — auto-numbered section metadata ——————————— */
body { counter-reset: sec fig; }
section.chapter, .content > section, main > section { counter-increment: sec; }
.eyebrow, .q-eyebrow {
display: flex; align-items: center; gap: .75rem;
font: 500 .75rem/1 "IBM Plex Mono", monospace;
letter-spacing: .12em; text-transform: uppercase;
color: var(--slate-ink-dim, #a8bcc8);
}
.q-eyebrow::before {
content: counter(sec, decimal-leading-zero) " /";
color: var(--slate-ink-muted, #6a7f8c);
}
.eyebrow::after, .q-eyebrow::after {
content: ""; flex: 1; height: 1px; background: rgba(238, 246, 250, .14);
}
/* — NAMED-LINES EDITORIAL GRID — opt-in via .article —————————————————————— */
.article {
display: grid; row-gap: var(--flow, 1.5rem);
grid-template-columns:
[full-start] minmax(clamp(1.25rem, 5vw, 6rem), 1fr)
[wide-start] minmax(0, 1fr)
[content-start] min(66ch, 100% - 2*clamp(1.25rem, 5vw, 6rem)) [content-end]
minmax(0, 2fr) [wide-end]
minmax(clamp(1.25rem, 5vw, 6rem), 1fr) [full-end];
}
.article > * { grid-column: content; }
.article > .breakout { grid-column: wide; }
.article > .full-bleed { grid-column: full; }
.chapter { padding-block: clamp(5rem, 4rem + 8vw, 11rem); }
/* — A3 · MASKED LINE-REVEAL (scroll) — js/quantanium.js adds .is-inview — */
.reveal { overflow: clip; }
.reveal .line {
display: block; transform: translateY(110%);
transition: transform var(--dur-4) var(--ease-out-expo);
}
.reveal.is-inview .line { transform: none; }
.reveal .line:nth-child(2) { transition-delay: 80ms; }
.reveal .line:nth-child(3) { transition-delay: 160ms; }
/* generic fade-rise for cards/figures marked .q-rise */
.q-rise { opacity: 0; transform: translateY(14px);
transition: opacity var(--dur-4) var(--ease-out-expo), transform var(--dur-4) var(--ease-out-expo); }
.q-rise.is-inview { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
.reveal .line, .q-rise { transform: none !important; opacity: 1 !important; }
}
/* — ARCHIVE PLATE — every chart/scan/table framed as a numbered plate — */
.plate {
counter-increment: fig; position: relative;
border: 1px solid rgba(238, 246, 250, .14); padding: 1rem;
background: rgba(200, 230, 245, .02);
}
.plate::before, .plate::after {
content: ""; position: absolute; width: 9px; height: 9px;
border: 0 solid rgba(238, 246, 250, .45);
}
.plate::before { top: -5px; left: -5px; border-width: 1px 0 0 1px; }
.plate::after { bottom: -5px; right: -5px; border-width: 0 1px 1px 0; }
.plate figcaption {
margin-top: .75rem; font: 500 .6875rem/1.5 "IBM Plex Mono", monospace;
letter-spacing: .12em; text-transform: uppercase; color: var(--slate-ink-dim, #a8bcc8);
}
.plate figcaption::before { content: "FIG. " counter(fig, decimal-leading-zero) " — "; }
/* — REDACTION-REVEAL — 1-2 per page max; hover/focus/scroll reveals — */
.redact {
background: var(--slate-accent, #eef6fa); color: transparent;
box-decoration-break: clone; -webkit-box-decoration-break: clone;
padding-inline: .15em;
transition: background-color var(--dur-3) var(--ease-out-quart), color var(--dur-3) var(--ease-out-quart);
}
.redact:hover, .redact:focus-visible, .redact.is-revealed {
background: transparent; color: inherit;
}
/* — DIRECTIONAL UNDERLINE-DRAW LINKS — opt-in .link / nav usage — */
.q-link {
text-decoration: none; color: inherit;
background-image: linear-gradient(currentColor, currentColor);
background-size: 0% 1px; background-position: 100% 100%; background-repeat: no-repeat;
transition: background-size .35s var(--ease-out-quart);
}
.q-link:hover, .q-link:focus-visible { background-size: 100% 1px; background-position: 0% 100%; }
.q-link:focus-visible { outline: 1px solid var(--slate-accent, #eef6fa); outline-offset: 3px; }
/* — FILM GRAIN — ONE static fixed layer, never animated —
PERF (2026-07-10 shake fix): NO mix-blend-mode here. A blend on a fixed
full-viewport layer defeats layerization and re-rasterizes the entire
page every frame (measured ~1fps). Plain low-opacity grain composites
as its own cached GPU layer at ~zero cost. */
body::after {
content: ""; position: fixed; inset: 0; z-index: 60; pointer-events: none;
opacity: .05;
transform: translateZ(0); /* own compositor layer */
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
/* — ICE DUOTONE IMAGERY — no image imports foreign colour — */
.fig-duotone { position: relative; background: #0d1826; overflow: clip; border-radius: 10px; }
.fig-duotone img {
display: block; width: 100%;
filter: grayscale(1) contrast(1.08) brightness(.92);
mix-blend-mode: luminosity;
}
.fig-duotone::after {
content: ""; position: absolute; inset: 0; pointer-events: none;
background: linear-gradient(180deg, rgba(93, 138, 168, .16), rgba(5, 8, 13, .5));
mix-blend-mode: multiply;
}
/* — STAT LEDE — one number, huge; one per chapter max — */
figure.stat { margin: clamp(2rem, 5vw, 4rem) auto; text-align: center; }
.stat__claim {
font-size: 1rem; letter-spacing: .08em; text-transform: uppercase;
color: rgba(238, 246, 250, .62); margin-bottom: .5rem;
}
.stat__num {
font-family: "IBM Plex Mono", monospace; font-variant-numeric: tabular-nums;
font-size: var(--display-stat); line-height: 1;
color: var(--slate-accent, #eef6fa); letter-spacing: -.02em; margin: 0;
}
.stat__src {
font-family: "IBM Plex Mono", monospace; font-size: .72rem;
color: rgba(238, 246, 250, .45); margin-top: .6rem;
}
/* — EVIDENCE TABLE — sticky header, tabular numerals, inline bars — */
.tbl-wrap { max-height: 70vh; overflow: auto; border: 1px solid rgba(238, 246, 250, .08); border-radius: 8px; }
table.evidence { border-collapse: collapse; width: 100%; font-size: .875rem; }
.evidence th {
position: sticky; top: 0; z-index: 2; background: #05080d;
text-align: left; font: 600 .72rem/1 "IBM Plex Mono", monospace;
letter-spacing: .08em; text-transform: uppercase; color: rgba(238, 246, 250, .6);
padding: .65rem .75rem; box-shadow: 0 1px 0 rgba(238, 246, 250, .14);
}
.evidence td { padding: .55rem .75rem; border-top: 1px solid rgba(238, 246, 250, .06); color: #eef6fa; }
.evidence td.num { text-align: right; font-family: "IBM Plex Mono", monospace; font-variant-numeric: tabular-nums; }
.evidence td.bar { background: linear-gradient(to right, rgba(122, 168, 204, .22) calc(var(--v) * 100%), transparent 0); }
.evidence .src-chip {
opacity: 0; transition: opacity .15s;
font: .68rem "IBM Plex Mono", monospace; color: rgba(238, 246, 250, .55);
border: 1px solid rgba(238, 246, 250, .18); border-radius: 999px; padding: .1rem .5rem;
}
.evidence tr:hover .src-chip, .evidence tr:focus-within .src-chip { opacity: 1; }
/* — CSS BAR ROWS — chart-less magnitude comparison, zero JS — */
.bars { display: grid; gap: .45rem; padding: 0; margin: 1.2rem 0; }
.bars li { display: grid; grid-template-columns: 12ch 1fr 8ch; align-items: center; gap: .75rem; list-style: none; }
.bars__lbl { font-size: .8rem; color: rgba(238, 246, 250, .75); }
.bars__bar { height: .9rem; border-radius: 2px; background: var(--ch-s1); transform-origin: left; transform: scaleX(var(--v)); opacity: .85; }
.bars__val { font: 400 .8rem "IBM Plex Mono", monospace; font-variant-numeric: tabular-nums; text-align: right; color: #eef6fa; }
@media (prefers-reduced-motion: no-preference) {
.bars__bar { animation: q-grow .6s var(--ease-out-expo) both; }
@keyframes q-grow { from { transform: scaleX(0); } to { transform: scaleX(var(--v)); } }
}
/* — SPARKLINES ————————————————————————————————————————————————————————————— */
.spark { width: 9ch; height: 1.1em; color: rgba(238, 246, 250, .7); vertical-align: -0.15em; }
/* — CHART BASE — generated SVGs obey the tokens ———————————————————————————— */
.chart text { font: .72rem "IBM Plex Mono", monospace; fill: var(--ch-tick); }
.chart .annot text { font: 600 .8rem "Atkinson Hyperlegible", sans-serif; fill: var(--ch-label); }
.chart .annot line { stroke: var(--ch-tick); stroke-dasharray: 2 3; }
.chart .grid line { stroke: var(--ch-grid); shape-rendering: crispEdges; }
.chart .domain { stroke: var(--ch-domain); }
/* solid = established fact · dashed = projection/allegation (house rule) */
.chart .projection { stroke-dasharray: 5 4; }
/* — READING PROGRESS RAIL (CSS scroll-driven; graceful without) ————————————— */
@supports (animation-timeline: scroll()) {
.q-progress {
position: fixed; inset: 0 0 auto 0; height: 2px; z-index: 900;
background: var(--slate-accent, #eef6fa); transform-origin: left;
transform: scaleX(0); animation: q-progress linear both;
animation-timeline: scroll(root);
}
@keyframes q-progress { to { transform: scaleX(1); } }
}
/* — PERFORMANCE GUARDS (2026-07-10 shake fix) ——————————————————————————————
Measured on live pages: rAF ~1fps with an idle main thread = GPU raster
storm. Three causes, all killed here (this file loads last, so these
overrides win the cascade):
1. background-attachment:fixed on repaints the full page every
scroll frame on Windows — force scroll.
2. backdrop-filter on EVERY card multiplies blur surfaces; the glass
look survives via translucent gradient fills. Blur stays ONLY on
small fixed chrome (nav/footer/tour bar).
3. iframe/canvas must never get height:auto — JS owns canvas sizing;
the shell owns iframe sizing (prevents resize feedback loops). */
body { background-attachment: scroll !important; }
/* 4. SHAKE FIX — presentation pages use scroll-snap (body.pres-active in
css/presentation.css). Animated reveal transforms MOVE snap targets
while the snap engine is settling — viewport oscillation ("shake").
On snap pages: reveals render final-state instantly, and CSS-level
smooth scrolling is disabled (cinema.js still passes smooth per
scrollIntoView call, so slide navigation stays smooth). */
body.pres-active { scroll-behavior: auto !important; }
body.pres-active .q-rise, body.pres-active .reveal .line {
opacity: 1 !important; transform: none !important; transition: none !important;
}
.card:not(.glass), .panel:not(.glass), .data-card:not(.glass), .evidence-box:not(.glass), .finding-card:not(.glass), .info-box:not(.glass),
.metric-card:not(.glass), .stat-card:not(.glass), .evidence-entry:not(.glass), .ts-card:not(.glass), .ice-panel:not(.glass),
.glass-card:not(.glass), .liril-glass:not(.glass), .sm-cat:not(.glass), section[style*="gradient"]:not(.glass) {
-webkit-backdrop-filter: none !important;
backdrop-filter: none !important;
}
canvas, iframe { height: revert-layer; }
canvas { max-width: 100%; }
/* — SCROLLY SCENES (canonical engine hooks; js adds .is-active) ———————————— */
.scrolly { display: grid; grid-template-columns: minmax(28ch, 38ch) 1fr; gap: 3rem; }
.scrolly__graphic {
position: sticky; top: var(--header-h, 0px);
height: calc(100vh - var(--header-h, 0px));
grid-column: 2; grid-row: 1; display: flex; align-items: center;
}
.scrolly__steps { grid-column: 1; grid-row: 1; }
.scrolly__steps section { min-height: 85vh; opacity: .35; transition: opacity .4s ease-out; }
.scrolly__steps section.is-active { opacity: 1; }
.scrolly__steps section:last-child { margin-bottom: 40vh; }
.annot { opacity: 0; transform: translateY(4px); transition: opacity .35s ease-out, transform .35s ease-out; }
[data-state="1"] .annot[data-reveal="1"],
[data-state="2"] .annot[data-reveal="1"],
[data-state="2"] .annot[data-reveal="2"],
[data-state="3"] .annot { opacity: 1; transform: none; }
@media (max-width: 700px) {
.scrolly { grid-template-columns: 1fr; }
.scrolly__graphic { position: relative; height: auto; grid-column: 1; }
.scrolly__steps { grid-column: 1; grid-row: auto; }
.scrolly__steps section { min-height: 0; opacity: 1; }
}
/* ————————————————————————————————————————————————————————————————————————————
→ STABILIZE (2026-07-10) — DEAD-STILL GUARANTEE
————————————————————————————————————————————————————————————————————————————
Loaded on every page (last in the quantanium layer). Neutralizes EVERY
mechanism that can make the viewport oscillate ("shake"), regardless of
which legacy stylesheet or script tries to reintroduce it. Owner directive:
the page must not move by itself. Hover transitions are kept (they can't
auto-oscillate); everything scroll-linked / auto-animating is killed.
———————————————————————————————————————————————————————————————————————————— */
/* 1. Prevent scroll oscillation specifically on snap pages */
body.pres-active {
scroll-behavior: auto !important;
scroll-snap-type: none !important;
scroll-snap-align: none !important;
background-attachment: scroll !important;
overscroll-behavior: none !important;
}
body.pres-active .q-rise,
body.pres-active .reveal,
body.pres-active .reveal .line {
opacity: 1 !important;
transform: none !important;
transition: none !important;
}
/* 2. Global width stability */
html { overflow-x: clip; scrollbar-gutter: stable; }
body { overflow-x: clip; max-width: 100%; }
/* MERGED QUANTANIUM-SPEC.CSS */
/* PRESS THEME — screenshot 2026-07-10 042513 */
:root{
--void:#050708;--ink:#0b0e10;
--ivory:#ece7dc;--ivory-dim:#a89f90;--ivory-faint:#827a6d;
--hair:#26221c;--hair-lit:#3a342b;
--ice:#9adbe8;--ice-deep:#3f7c8c;
--red:#c8102e;--red-deep:#8f0f24;--gold:#d3a625;
--serif:'Fraunces',Georgia,serif;--mono:'IBM Plex Mono',Consolas,monospace;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--void);color:var(--ivory);font-family:var(--serif);
font-weight:300;line-height:1.6;-webkit-font-smoothing:antialiased;position:relative}
body::after{content:"";position:fixed;inset:0;z-index:200;pointer-events:none;opacity:.05;
background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E")}
body::before{content:"";position:fixed;inset:0;z-index:0;pointer-events:none;
background:radial-gradient(120% 90% at 50% 8%,transparent 55%,rgba(0,0,0,.55) 100%)}
a{color:inherit;text-decoration:none}a:hover{color:var(--ice)}
::selection{background:var(--ice);color:var(--void)}
.js .rv{opacity:0;transform:translateY(26px);transition:opacity 1s ease,transform 1s ease}
.js .rv.in{opacity:1;transform:none}
.brand-crest,.nav-crest,img[src*="crest"],img[src*="royal_crest"]{display:none!important}
/* glass system — every card is a pane over an aurora field */
.glass{position:relative;border-radius:8px;border:1px solid rgba(154,219,232,.16);
background:linear-gradient(160deg,rgba(154,219,232,.08),rgba(154,219,232,.02) 45%,rgba(5,7,8,.4));
backdrop-filter:blur(16px) saturate(1.15);-webkit-backdrop-filter:blur(16px) saturate(1.15);
box-shadow:inset 0 1px 0 rgba(255,255,255,.09),inset 0 -1px 0 rgba(0,0,0,.45),
0 34px 60px -30px rgba(0,0,0,.9);
transition:opacity 1s ease,transform .3s ease,box-shadow .3s ease,border-color .3s ease}
/* bare .glass must stay visible — see primary glass block */
.glass::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
background:linear-gradient(115deg,rgba(255,255,255,.10),transparent 32%)}
.glass:hover{transform:translateY(-4px);border-color:rgba(154,219,232,.3);
box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 48px 76px -32px rgba(0,0,0,.95)}
.field{position:relative}
.field::before{content:"";position:absolute;inset:-4vh 0;pointer-events:none;z-index:0;
background:
radial-gradient(700px 380px at 12% 20%,rgba(63,124,140,.15),transparent 65%),
radial-gradient(560px 320px at 88% 70%,rgba(200,16,46,.06),transparent 62%),
radial-gradient(420px 260px at 60% 10%,rgba(211,166,37,.045),transparent 60%)}
.field>*{position:relative;z-index:1}
.wrapx{max-width:var(--slate-max-wide, 1200px);margin:0 auto;padding:0 clamp(20px,4vw,56px)}
@media(min-width:901px){.wrapx{padding-right:clamp(110px,10vw,150px)}}
.kick{font-family:var(--mono);font-size:10px;font-weight:500;letter-spacing:.26em;
text-transform:uppercase;color:var(--ice)}
.kick.red{color:var(--red)}
.meta{font-family:var(--mono);font-size:10.5px;color:var(--ivory-faint);letter-spacing:.06em}
.meta a{color:var(--ivory-dim);border-bottom:1px solid var(--hair-lit)}
.meta a:hover{color:var(--ice);border-color:var(--ice)}
/* cover */
.cover{min-height:100vh;display:flex;flex-direction:column;position:relative;
border-bottom:1px solid var(--hair);overflow:hidden;
background:
radial-gradient(1300px 560px at 72% -12%,rgba(63,124,140,.26),transparent 62%),
radial-gradient(900px 480px at 6% 112%,rgba(154,219,232,.09),transparent 60%),var(--void)}
.ghost5{position:absolute;right:1vw;bottom:-14vh;font-family:var(--serif);font-style:italic;
font-weight:300;font-size:56vh;line-height:1;color:transparent;
-webkit-text-stroke:1px rgba(154,219,232,.12);pointer-events:none;user-select:none}
.cover-bar{display:flex;justify-content:space-between;align-items:center;gap:18px;
padding:20px clamp(28px,4.4vw,64px);font-family:var(--mono);font-size:10.5px;
letter-spacing:.22em;color:var(--ivory-faint);text-transform:uppercase;
border-bottom:1px solid var(--hair);position:relative;z-index:3}
.brand{display:flex;align-items:center;gap:14px;text-transform:none}
.brand img{display:none!important}
.brand .wm{font-family:var(--serif);font-weight:600;font-size:18px;letter-spacing:.04em;color:var(--ivory)}
.brand .wm sup{font-size:.5em;color:var(--ice);position:relative;top:-.65em;vertical-align:baseline}
.cover-core{flex:1;display:flex;flex-direction:column;justify-content:center;
padding:6vh clamp(28px,4.4vw,64px);max-width:var(--slate-max-wide, 1200px);width:100%;margin:0 auto;position:relative;z-index:3}
.cover-kick{font-family:var(--mono);font-size:11px;letter-spacing:.34em;
text-transform:uppercase;color:var(--ice);margin-bottom:3vh}
.cover h1{font-weight:300;font-size:clamp(52px,8.4vw,124px);line-height:1.02;letter-spacing:-.02em}
.cover h1 em{font-style:italic;font-weight:400;color:var(--ice);text-shadow:0 0 16px rgba(154,219,232,.4)}
.cover .fr{margin-top:2vh;font-style:italic;font-weight:300;font-size:clamp(14px,1.6vw,18px);
color:var(--ivory-faint)}
.cover .fr::before{content:"";display:inline-block;width:34px;height:1px;background:var(--ice);
vertical-align:middle;margin-right:14px;box-shadow:0 0 10px rgba(154,219,232,.5)}
.cover .stand{margin-top:3.5vh;max-width:clamp(520px, 40vw, 1200px);font-size:clamp(15px, 1.6vw, 32px);color:var(--ivory-dim)}
.cover .stand b{color:var(--ivory);font-weight:600}
.cover-foot{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;
padding:0 clamp(28px,4.4vw,64px) 5vh;max-width:var(--slate-max-wide, 1200px);width:100%;margin:0 auto;
position:relative;z-index:3;flex-wrap:wrap}
.liril-intro{max-width:460px;border-left:1px solid var(--ice-deep);padding:6px 0 6px 22px}
.liril-intro .who{font-family:var(--mono);font-size:10px;letter-spacing:.3em;color:var(--ice);
text-transform:uppercase;margin-bottom:8px}
.liril-intro p{font-style:italic;font-size:15.5px;color:var(--ivory-dim)}
.begin{font-family:var(--mono);font-size:11px;letter-spacing:.26em;text-transform:uppercase;
color:var(--ivory);display:flex;flex-direction:column;align-items:center;gap:14px}
.begin .arrow{width:1px;height:56px;background:linear-gradient(180deg,var(--ivory-faint),var(--ice));
animation:drop 2.4s ease infinite}
@keyframes drop{0%{transform:scaleY(.2);transform-origin:top;opacity:0}
40%{transform:scaleY(1);opacity:1}100%{transform:scaleY(1);opacity:0}}
/* thesis */
.thesis{border-bottom:1px solid var(--hair);padding:10vh 0}
.thesis-grid{display:grid;grid-template-columns:1fr 1fr;gap:26px;margin-top:5vh}
@media(max-width:860px){.thesis-grid{grid-template-columns:1fr}}
.thesis .panel{padding:34px 36px}
.thesis .panel h4{font-family:var(--mono);font-size:10.5px;letter-spacing:.3em;
text-transform:uppercase;margin-bottom:18px}
.thesis .panel.dx h4{color:var(--red)}
.thesis .panel.rx h4{color:var(--ice)}
.thesis .panel p{font-size:15.5px;color:var(--ivory-dim);line-height:1.7}
.thesis .panel p b{color:var(--ivory);font-weight:600}
.thesis .links{margin-top:26px;font-family:var(--mono);font-size:10.5px;letter-spacing:.18em;
text-transform:uppercase;color:var(--ivory-faint)}
.thesis .links a{color:var(--ivory-dim);border-bottom:1px solid var(--hair-lit);margin-right:22px}
.thesis .links a:hover{color:var(--ice);border-color:var(--ice)}
.thesis-title{font-weight:300;font-size:clamp(30px,4.6vw,56px);line-height:1.05;letter-spacing:-.02em}
.thesis-title em{font-style:italic;color:var(--red);font-weight:400}
/* chapters */
.ch{border-bottom:1px solid var(--hair);padding:0 0 10vh}
.ch:nth-of-type(even){background:linear-gradient(180deg,#090c0e,#07090b 30%,#07090b 70%,#05070a);
box-shadow:inset 0 1px 0 rgba(255,255,255,.03),inset 0 -1px 0 rgba(0,0,0,.6)}
.ch-head{max-width:var(--slate-max-wide, 1200px);margin:0 auto;padding:9vh clamp(20px,4vw,56px) 6vh;
display:grid;grid-template-columns:auto 1fr;gap:clamp(20px,4vw,64px);align-items:baseline;position:relative}
@media(min-width:901px){.ch-head{padding-right:clamp(110px,10vw,150px)}}
.ch-head .ghost{position:absolute;top:-4vh;right:clamp(0px,2vw,30px);font-style:italic;
font-weight:300;font-size:clamp(160px,24vw,340px);line-height:1;color:transparent;
-webkit-text-stroke:1px rgba(236,231,220,.05);pointer-events:none;user-select:none;z-index:0}
.ch-head>*{position:relative;z-index:1}
.ch-no{font-family:var(--mono);font-size:11px;letter-spacing:.3em;color:var(--ivory-faint);
text-transform:uppercase;white-space:nowrap}
.ch-no .roman{display:block;font-family:var(--serif);font-size:clamp(40px,5vw,64px);
font-weight:300;color:var(--ivory);letter-spacing:0;line-height:1;margin-top:10px}
.ch-title{font-weight:300;font-size:clamp(34px,5.4vw,72px);line-height:1.04;letter-spacing:-.02em}
.ch-title em{font-style:italic;color:var(--ice);font-weight:400;text-shadow:0 0 16px rgba(154,219,232,.4)}
.ch-when{grid-column:2;font-family:var(--mono);font-size:11px;letter-spacing:.22em;
color:var(--ivory-faint);text-transform:uppercase;margin-top:14px}
@media(max-width:700px){.ch-head{grid-template-columns:1fr}.ch-when{grid-column:1}}
/* wire */
.wire{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
@media(max-width:1000px){.wire{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.wire{grid-template-columns:1fr}}
.wire .glass{padding:26px 28px;display:flex;flex-direction:column;gap:10px}
.wire .glass.lead-card{grid-column:span 2}
@media(max-width:640px){.wire .glass.lead-card{grid-column:auto}}
.wire time{font-family:var(--mono);font-size:10px;letter-spacing:.18em;color:var(--ice-deep);
text-transform:uppercase}
.wire h3{font-weight:600;font-size:18px;line-height:1.32}
.wire .lead-card h3{font-weight:400;font-size:clamp(22px,2.4vw,30px);line-height:1.16}
.wire p{font-size:13.5px;color:var(--ivory-dim)}
.wire .lead-card p{font-size:15px}
.wire .lead-card p::first-letter{font-size:3.2em;font-weight:600;float:left;line-height:.82;
padding:4px 10px 0 0;color:var(--ice)}
.wire .meta{margin-top:auto;padding-top:10px;border-top:1px solid rgba(154,219,232,.1)}
/* feature */
.feature{display:grid;grid-template-columns:1.5fr 1fr;gap:clamp(24px,4vw,56px)}
@media(max-width:900px){.feature{grid-template-columns:1fr}}
.feature .main{padding:38px 42px}
.feature .main h3{font-weight:400;font-size:clamp(26px,3.4vw,40px);line-height:1.12;margin:14px 0 20px}
.feature .lede{font-size:clamp(16px,1.8vw,20px);color:var(--ivory);line-height:1.65}
.feature .lede::first-letter{font-size:3.6em;font-weight:600;float:left;line-height:.8;
padding:6px 12px 0 0;color:var(--ice)}
.feature .body-t{margin-top:20px;font-size:15px;color:var(--ivory-dim)}
.pull{padding:30px 34px;margin-bottom:18px;position:relative}
.pull::after{content:"\201C";position:absolute;top:-26px;left:6px;font-size:130px;line-height:1;
color:rgba(154,219,232,.10);font-style:italic;pointer-events:none}
.pull p{font-style:italic;font-weight:300;font-size:clamp(20px,2.3vw,27px);line-height:1.32;position:relative}
.pull p b{color:var(--ice);font-weight:400}
.side .glass{padding:20px 24px;margin-bottom:14px}
.side h4{font-weight:600;font-size:16px;line-height:1.35;margin:8px 0 4px}
.side p{font-size:13px;color:var(--ivory-dim)}
/* exhibits */
.exhibits{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}
@media(max-width:820px){.exhibits{grid-template-columns:1fr}}
.exhibit{padding:32px 34px}
.exhibit .tag{position:absolute;top:-9px;left:24px;background:linear-gradient(180deg,var(--void),rgba(9,13,16,.9));padding:2px 10px;
font-family:var(--mono);font-size:9.5px;letter-spacing:.26em;color:var(--ivory-faint);
text-transform:uppercase;border:1px solid rgba(154,219,232,.2);border-radius:2px;z-index:2;box-shadow:0 4px 10px rgba(0,0,0,0.5)}
.exhibit .claim-q{font-style:italic;font-weight:300;font-size:19px;line-height:1.4;
margin-bottom:16px;padding-right:118px}
@media(max-width:700px){
.exhibit{padding-top:52px}
.exhibit .claim-q{padding-right:0}
}
.exhibit .finding{font-size:13.5px;color:var(--ivory-dim);border-top:1px solid rgba(154,219,232,.12);
padding-top:14px}
.exhibit .finding b{color:var(--ivory);font-weight:600}
.stamp{position:absolute;top:24px;right:24px;font-family:var(--mono);font-size:.6rem;font-weight:600;
letter-spacing:.14em;text-transform:uppercase;padding:4px 10px;border:1px solid;border-radius:2px;z-index:2;
backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
.stamp.bad{color:var(--red);border-color:var(--red);background:rgba(200,16,46,.15);box-shadow:0 0 15px rgba(200,16,46,.25),inset 0 1px 0 rgba(255,255,255,.15)}
.stamp.ok{color:#7fbf9a;border-color:#7fbf9a;background:rgba(127,191,154,.15);box-shadow:0 0 15px rgba(127,191,154,.25),inset 0 1px 0 rgba(255,255,255,.15)}
.stamp.warn{color:var(--gold);border-color:var(--gold);background:rgba(224,196,122,.15);box-shadow:0 0 15px rgba(224,196,122,.25),inset 0 1px 0 rgba(255,255,255,.15)}
/* dossiers */
.dossier{display:grid;grid-template-columns:96px 1fr auto;gap:clamp(16px,3vw,44px);
align-items:center;padding:28px 32px;margin-bottom:16px;
background:linear-gradient(135deg, rgba(154,219,232,.04), rgba(5,7,8,.4));
border:1px solid rgba(154,219,232,.1);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
box-shadow:inset 0 1px 0 rgba(255,255,255,.05);transition:all .3s ease;text-decoration:none}
.dossier:hover{transform:translateY(-2px);box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 20px 40px rgba(0,0,0,.5),0 0 20px rgba(154,219,232,.1);border-color:rgba(154,219,232,.3)}
.dossier .no{font-family:var(--mono);font-weight:700;font-size:34px;color:rgba(154,219,232,.3);letter-spacing:.05em}
.dossier h3{font-family:var(--serif);font-weight:300;font-size:clamp(20px,2.4vw,27px);color:var(--ice);line-height:1.2;margin-bottom:8px;text-shadow:0 0 10px rgba(154,219,232,.2)}
.dossier p{font-size:14px;color:var(--ivory-dim);max-width:620px}
.dossier .meta{font-family:var(--mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--ivory-faint);white-space:nowrap}
@media(max-width:700px){.dossier{grid-template-columns:1fr}.dossier .no{font-size:26px}}
/* era */
.era{max-width:var(--slate-max-wide, 1200px);margin:0 auto;padding:0 clamp(20px,4vw,56px);text-align:center}
.era h3{font-weight:300;font-size:clamp(38px,6vw,84px);line-height:1.05;letter-spacing:-.02em;margin:3vh 0}
.era h3 em{font-style:italic;font-weight:400;color:var(--ice);text-shadow:0 0 20px rgba(154,219,232,.5)}
.era p{max-width:560px;margin:0 auto;color:var(--ivory-dim);font-size:16px}
.era .stats{font-family:var(--mono);font-size:11px;letter-spacing:.2em;color:var(--ivory-faint);
text-transform:uppercase;margin-top:4vh}
.era .go-film{display:inline-block;margin-top:4.5vh;font-family:var(--mono);font-size:11px;
font-weight:600;letter-spacing:.26em;text-transform:uppercase;color:var(--void);
background:var(--ice);padding:16px 38px;border-radius:3px;transition:all .25s ease;
box-shadow:0 16px 44px -12px rgba(154,219,232,.38)}
.era .go-film:hover{background:var(--ivory);transform:translateY(-2px);
box-shadow:0 22px 54px -12px rgba(154,219,232,.5)}
.era .alt{display:block;margin-top:18px;font-family:var(--mono);font-size:10px;
letter-spacing:.2em;color:var(--ivory-faint);text-transform:uppercase}
.era .alt a{color:var(--ivory-dim);border-bottom:1px solid var(--hair-lit)}
.era .alt a:hover{color:var(--ice);border-color:var(--ice)}
/* rail + dock */
.rail{position:fixed;right:clamp(10px,2.4vw,34px);top:50%;transform:translateY(-50%);z-index:90;
display:flex;flex-direction:column;align-items:flex-end}
.rail .seg{display:flex;align-items:center;gap:12px;padding:11px 0}
.rail .lbl{font-family:var(--mono);font-size:9px;letter-spacing:.24em;color:var(--ivory-faint);
text-transform:uppercase;opacity:0;transform:translateX(6px);transition:all .4s ease}
.rail .dot{width:8px;height:8px;border-radius:50%;border:1px solid var(--ivory-faint);
background:var(--void);transition:all .4s ease}
.rail .seg:hover .lbl{opacity:1;transform:none}
.rail .seg.on .dot{background:var(--ice);border-color:var(--ice);box-shadow:0 0 10px rgba(238,246,250,.4)}
.rail .seg.on .lbl{opacity:1;transform:none;color:var(--ivory)}
@media(max-width:900px){.rail{display:none}}
.dock{position:fixed;left:0;right:0;bottom:0;z-index:95;
background:linear-gradient(180deg,rgba(9,13,16,.4),rgba(5,7,8,.95) 40%,rgba(5,7,8,.98));
border-top:1px solid rgba(154,219,232,.3);backdrop-filter:blur(24px) saturate(140%);
-webkit-backdrop-filter:blur(24px) saturate(140%);
box-shadow:0 -24px 48px -18px rgba(0,0,0,.9),0 -1px 24px rgba(154,219,232,.15),inset 0 1px 0 rgba(255,255,255,.05);
transform:translateY(110%);transition:transform .6s cubic-bezier(0.16, 1, 0.3, 1), box-shadow .4s ease}
.dock.speaking{
border-top:1px solid rgba(154,219,232,.6);
box-shadow:0 -24px 60px -18px rgba(0,0,0,.95),0 -1px 30px rgba(154,219,232,.3),inset 0 1px 0 rgba(255,255,255,.1)}
.dock.up{transform:none}
.dock-in{max-width:var(--slate-max-wide, 1200px);margin:0 auto;display:flex;align-items:center;gap:18px;
padding:12px clamp(20px,4vw,56px)}
.dock .eq{display:flex;align-items:flex-end;gap:2.5px;height:18px;flex-shrink:0;opacity:.4;transition:opacity .3s}
.dock.speaking .eq{opacity:1}
.dock .eq i{display:block;width:3px;background:var(--ice);border-radius:1px;height:30%;box-shadow:0 0 8px rgba(154,219,232,.6)}
.dock.speaking .eq i{animation:eq 1s ease-in-out infinite}
.dock .eq i:nth-child(2){height:70%;animation-delay:.12s}
.dock .eq i:nth-child(3){height:45%;animation-delay:.24s}
.dock .eq i:nth-child(4){height:90%;animation-delay:.36s}
.dock .eq i:nth-child(5){height:55%;animation-delay:.48s}
@keyframes eq{0%,100%{transform:scaleY(.4)}50%{transform:scaleY(1)}}
.dock .say{flex:1;font-style:italic;font-size:14px;color:var(--ivory-dim);
white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dock .say b{color:var(--ice);font-style:normal;font-family:var(--mono);font-size:10px;
letter-spacing:.24em;text-transform:uppercase;margin-right:12px;text-shadow:0 0 12px rgba(154,219,232,.5)}
.dock button{font-family:var(--mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;
background:rgba(255,255,255,0.03);border:1px solid rgba(154,219,232,.15);color:var(--ivory-dim);padding:7px 14px;
border-radius:2px;cursor:pointer;flex-shrink:0;transition:all .3s ease}
.dock button:hover{border-color:rgba(154,219,232,.4);color:var(--ice);box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 0 15px rgba(154,219,232,.1)}
.dock button.on{
background:linear-gradient(180deg,rgba(154,219,232,.18),rgba(154,219,232,.04) 45%,rgba(154,219,232,.08)),rgba(9,13,16,.65);
color:var(--ice);border-color:rgba(154,219,232,.5);
box-shadow:0 10px 30px rgba(0,0,0,.5),inset 0 1px 0 rgba(255,255,255,.15),0 0 20px rgba(154,219,232,.25);
text-shadow:0 0 10px rgba(154,219,232,.4)}
/* timeline toggle */
.timeline-toggle{display:inline-flex;align-items:center;background:rgba(5,7,8,.8);border-radius:4px;
padding:4px;border:1px solid rgba(154,219,232,.15);backdrop-filter:blur(8px)}
.toggle-btn{font-family:var(--mono);font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;
color:var(--ivory-dim);background:transparent;border:none;padding:6px 14px;border-radius:2px;
cursor:pointer;transition:all .3s ease}
.toggle-btn:hover{color:var(--ice)}
.toggle-btn.active{background:var(--ice);color:var(--void)}
/* liril film structural overrides */
.lf-landing{max-width:800px;margin:10vh auto;text-align:left}
.lf-landing h1{font-weight:300;font-size:clamp(40px,6vw,72px);line-height:1.05;letter-spacing:-.02em;color:var(--ivory)}
.lf-landing p{font-size:16px;color:var(--ivory-dim);line-height:1.6}
.lf-landing .begin{font-family:var(--mono);font-size:11px;font-weight:600;letter-spacing:.26em;
text-transform:uppercase;border-radius:3px;transition:all .25s ease;display:inline-block}
.lf-landing .begin.primary{background:var(--ice);color:var(--void);border:none;padding:14px 30px}
.lf-landing .begin.primary:hover{background:var(--ivory);transform:translateY(-2px)}
.lf-landing .begin.secondary{background:transparent;color:var(--ivory);border:1px solid var(--ice);padding:13px 29px}
.lf-landing .begin.secondary:hover{background:rgba(154,219,232,.1);color:var(--ice)}
/* evidence shelf */
.shelf-controls{display:flex;gap:14px;margin:4vh 0;flex-wrap:wrap}
.shelf-controls input,.shelf-controls select{font-family:var(--mono);font-size:12px;
background:rgba(154,219,232,.05);border:1px solid var(--hair-lit);color:var(--ivory);
padding:11px 16px;border-radius:3px;min-width:220px}
.shelf-controls input:focus,.shelf-controls select:focus{outline:none;border-color:var(--ice-deep)}
.shelf-cat{font-family:var(--mono);font-size:10.5px;letter-spacing:.3em;color:var(--ice);
text-transform:uppercase;margin:6vh 0 3vh;display:flex;align-items:center;gap:18px}
.shelf-cat::after{content:"";flex:1;height:1px;background:var(--hair)}
.src-card{padding:26px 30px;margin-bottom:16px;display:grid;
grid-template-columns:1fr auto;gap:8px 26px;align-items:baseline}
@media(max-width:700px){.src-card{grid-template-columns:1fr}}
.src-card h3{font-weight:400;font-size:21px;line-height:1.25}
.src-card .what{grid-column:1;font-size:13.5px;color:var(--ivory-dim);margin-top:4px}
.src-card .attr{grid-column:1;font-family:var(--mono);font-size:10.5px;color:var(--ivory-faint);
letter-spacing:.06em;margin-top:10px;border-top:1px solid rgba(154,219,232,.1);padding-top:10px}
.src-card .attr a{color:var(--ice-deep);border-bottom:1px solid transparent}
.src-card .attr a:hover{color:var(--ice);border-color:var(--ice)}
.src-card .badges{grid-column:2;grid-row:1 / span 3;display:flex;flex-direction:column;
gap:8px;align-items:flex-end}
.vbadge{font-family:var(--mono);font-size:9px;font-weight:600;letter-spacing:.2em;
text-transform:uppercase;padding:4px 10px;border:1px solid;border-radius:2px}
.vbadge.v{color:#7fbf9a;border-color:rgba(127,191,154,.55)}
.vbadge.sv{color:var(--gold);border-color:rgba(211,166,37,.55)}
.vbadge.data{color:var(--ivory-faint);border-color:var(--hair-lit)}
.vbadge.data:hover{color:var(--ice);border-color:var(--ice);transform:translateY(-1px);box-shadow:0 2px 6px rgba(154,219,232,0.15)}
.note{font-size:12px;color:var(--gold);font-style:italic;margin-top:8px;grid-column:1}
/* article */
.article{max-width:760px;margin:0 auto;padding:10vh clamp(20px,4vw,56px)}
.article h1{font-weight:300;font-size:clamp(34px,5vw,58px);line-height:1.08;letter-spacing:-.02em;
margin:16px 0 24px}
.article .dek{font-size:19px;color:var(--ivory-dim);font-style:italic;margin-bottom:5vh}
.article .bodyp{font-size:16.5px;color:var(--ivory);margin-bottom:26px;line-height:1.75}
.article .bodyp:first-of-type::first-letter{font-size:3.6em;font-weight:600;float:left;
line-height:.8;padding:6px 12px 0 0;color:var(--ice)}
.article .srcs{margin-top:6vh;padding:26px 30px}
.article .srcs h4{font-family:var(--mono);font-size:10px;letter-spacing:.3em;color:var(--ice);
text-transform:uppercase;margin-bottom:14px}
/* briefing */
.threat{display:inline-flex;align-items:center;gap:8px;font-family:var(--mono);font-size:.68rem;
letter-spacing:.16em;text-transform:uppercase;padding:6px 12px;border:1px solid;border-radius:2px}
.threat::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.threat.AMBER{color:var(--slate-warning);border-color:rgba(201,164,76,.4)}
.threat.RED{color:var(--slate-critical);border-color:rgba(176,84,74,.4)}
.threat.GREEN{color:var(--slate-verified);border-color:rgba(110,143,104,.4)}
.read-brief{display:inline-flex;align-items:center;gap:12px;margin-top:3vh;
font-family:var(--mono);font-size:11px;font-weight:600;letter-spacing:.24em;
text-transform:uppercase;color:var(--void);background:var(--ice);padding:14px 30px;
border-radius:3px;cursor:pointer;border:none;
box-shadow:0 16px 44px -12px rgba(154,219,232,.38);transition:all .25s ease}
.read-brief:hover{background:var(--ivory);transform:translateY(-2px)}
.brief-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:22px}
@media(max-width:860px){.brief-grid{grid-template-columns:1fr}}
.brief-item{padding:26px 30px;display:flex;flex-direction:column;gap:10px}
.brief-item h3{font-weight:600;font-size:19px;line-height:1.3}
.brief-item p{font-size:13.5px;color:var(--ivory-dim)}
.tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
@media(max-width:900px){.tiles{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.tiles{grid-template-columns:1fr}}
.tile{padding:24px 26px}
.tile .v{font-family:var(--serif);font-weight:400;font-size:clamp(24px,2.6vw,34px);
letter-spacing:-.01em;line-height:1.1}
.tile.high .v{color:var(--ice)}
.tile.watch .v{color:var(--gold)}
.tile.ok .v,.tile .v{color:var(--ice)}
.tile .l{font-family:var(--mono);font-size:10px;letter-spacing:.2em;color:var(--ivory-faint);
text-transform:uppercase;margin-top:8px}
.tile .n{font-size:12px;color:var(--ivory-dim);margin-top:8px;font-style:italic}
.horizon{display:grid;grid-template-columns:1fr 1fr;gap:26px}
@media(max-width:860px){.horizon{grid-template-columns:1fr}}
.h-col h3{font-family:var(--mono);font-size:10.5px;letter-spacing:.3em;
text-transform:uppercase;margin-bottom:18px}
.h-col.stated h3{color:var(--ice)}
.h-col.inferred h3{color:var(--gold)}
.h-col .glass{padding:22px 26px;margin-bottom:14px}
.h-col.inferred .glass{border-style:dashed;border-color:rgba(211,166,37,.35)}
.h-col h4{font-weight:600;font-size:16px;line-height:1.35;margin-bottom:6px}
.h-col p{font-size:13px;color:var(--ivory-dim)}
.conf{font-family:var(--mono);font-size:9px;letter-spacing:.18em;text-transform:uppercase;
color:var(--ivory-faint);display:block;margin-bottom:8px}
.contract{padding:26px 30px;font-family:var(--mono);font-size:12px;color:var(--ivory-dim);
line-height:2}
.contract b{color:var(--ice);letter-spacing:.2em;text-transform:uppercase;font-size:10px;
display:block;margin-bottom:10px}
.brief-err{font-family:var(--mono);font-size:12px;color:var(--gold);padding:20px 0}
/* network board — readable labels */
.board-wrap{display:grid;grid-template-columns:1fr 320px;gap:22px}
@media(max-width:980px){.board-wrap{grid-template-columns:1fr}}
.board{padding:12px;overflow:hidden;border-radius:12px}
.board svg{display:block;width:100%;height:auto;min-height:360px}
.board .edge{stroke:rgba(154,219,232,.22);transition:stroke .25s ease}
.board .edge.hot{stroke:rgba(154,219,232,.72)}
.board .node{cursor:pointer}
.board .node circle{stroke:rgba(5,7,8,.85);stroke-width:1.2;transition:all .25s ease}
.board .node text{font-family:var(--mono);font-size:11px;fill:var(--ivory-dim);
pointer-events:none;paint-order:stroke;stroke:rgba(5,7,8,.75);stroke-width:3px}
.board .node:hover text,.board .node.sel text{fill:var(--ivory)}
.board .node:hover circle,.board .node.sel circle{stroke:var(--ice)}
.board .node.dim{opacity:.12;pointer-events:none}
.board .edge.dim{opacity:.06}
.detail{padding:26px 28px;align-self:start;position:sticky;top:20px}
.detail .kick{margin-bottom:10px;display:block}
.detail h3{font-weight:400;font-size:22px;line-height:1.2;margin-bottom:6px}
.detail .sub{font-family:var(--mono);font-size:10.5px;color:var(--ivory-faint);
letter-spacing:.1em;text-transform:uppercase;margin-bottom:14px}
.detail p{font-size:13.5px;color:var(--ivory-dim)}
.detail .cons{margin-top:16px;border-top:1px solid rgba(154,219,232,.12);padding-top:12px}
.detail .cons div{font-family:var(--mono);font-size:11px;color:var(--ivory-dim);padding:4px 0}
.detail .cons b{color:var(--ice);font-weight:500}
.detail a.open{display:inline-block;margin-top:16px;font-family:var(--mono);font-size:10px;
font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--ice);
border-bottom:1px solid var(--ice-deep)}
.chips{display:flex;gap:10px;flex-wrap:wrap;margin:3vh 0}
.chip{font-family:var(--mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;
padding:7px 14px;border:1px solid var(--hair-lit);border-radius:2px;color:var(--ivory-dim);
cursor:pointer;background:none;transition:all .2s ease}
.chip:hover{border-color:var(--ice);color:var(--ice)}
.chip.on{background:var(--ice);color:var(--void);border-color:var(--ice)}
.guide{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:5vh}
@media(max-width:860px){.guide{grid-template-columns:1fr}}
.guide .glass{padding:20px 24px;font-size:13px;color:var(--ivory-dim)}
.guide b{color:var(--ivory);font-weight:600;display:block;margin-bottom:6px;
font-family:var(--mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase}
/* footer */
footer{padding:8vh clamp(20px,4vw,56px) 14vh;max-width:var(--slate-max-wide, 1200px);margin:0 auto;
color:var(--ivory-faint);font-size:12.5px;position:relative;z-index:1}
footer .rowf{display:flex;justify-content:space-between;gap:40px;flex-wrap:wrap;
font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase}
footer .rowf a{color:var(--ivory-dim);margin-right:26px}
footer .fm{font-family:var(--serif);font-size:22px;font-weight:600;color:var(--ivory);
text-transform:none;letter-spacing:.02em}
footer .fm sup{font-size:.5em;color:var(--ice);position:relative;top:-.65em;vertical-align:baseline}
footer .origin{margin-top:5vh;border-top:1px solid var(--hair);padding-top:22px;
font-family:var(--mono);font-size:10px;letter-spacing:.05em;line-height:1.9}
/* ── INVESTIGATION INTERIORS (Cap224 body soup → press layout) ───────── */
:root{--accent:var(--ice)}
body.press-interior .content{max-width:none;margin:0;padding:0}
body.press-interior .page-hero{margin:0 0 1.8em;padding:0 0 1.4em;border-bottom:1px solid var(--hair)}
body.press-interior .hero-tag{font-family:var(--mono);font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--red);margin:0 0 .85em;display:block}
body.press-interior .page-hero h1{font-family:var(--serif);font-weight:300;font-size:clamp(2rem,4.8vw,3.2rem);line-height:1.08;letter-spacing:-.02em;color:var(--ivory);margin:0 0 .5em}
body.press-interior .hero-sub{font-size:clamp(1.05rem,1.6vw,1.2rem);line-height:1.65;color:var(--ivory-dim);max-width:68ch;margin:0;font-weight:300}
body.press-interior .ts-fact,body.press-interior .finding-box,body.press-interior .testimony-card,body.press-interior .person-card,body.press-interior .human-scale,body.press-interior .impact-number{margin:1.25em 0;padding:18px 20px;border-radius:8px;border:1px solid rgba(154,219,232,.16);background:linear-gradient(160deg,rgba(154,219,232,.07),rgba(5,7,8,.45))}
body.press-interior .ts-cite,body.press-interior .quote-author,body.press-interior .the-source,body.press-interior .comparison-source,body.press-interior .source-cite,body.press-interior .role{font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--ice-deep);display:block;margin:.6em 0 0}
body.press-interior .ts-fact p,body.press-interior .finding-box p,body.press-interior .quote-text,body.press-interior .the-context,body.press-interior .comparison,body.press-interior .person-card p{margin:.55em 0 0;color:var(--ivory-dim);line-height:1.7}
body.press-interior .finding-box h4,body.press-interior .person-card h4{font-family:var(--serif);font-weight:400;color:var(--ivory);margin:0 0 .35em;font-size:1.15rem}
body.press-interior .the-number{font-family:var(--serif);font-weight:300;line-height:1.05;color:var(--ice)!important;font-size:clamp(2rem,6vw,3.6rem)!important;margin:0 0 .35em}
body.press-interior .inv-stat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px;margin:1.6em 0 2em}
body.press-interior .inv-stat{padding:16px 14px;border-radius:8px;border:1px solid rgba(154,219,232,.16);background:linear-gradient(160deg,rgba(154,219,232,.08),rgba(5,7,8,.5))}
body.press-interior .inv-stat .num,body.press-interior .inv-stat .num-red,body.press-interior .inv-stat .num-gold,body.press-interior .inv-stat .num-blue,body.press-interior .inv-stat .num-purple{display:block;font-family:var(--serif);font-size:1.65rem;font-weight:400;color:var(--ice);line-height:1.1}
body.press-interior .inv-stat .num-red{color:var(--red)}
body.press-interior .inv-stat .num-gold{color:var(--gold)}
body.press-interior .inv-stat .num-blue,body.press-interior .inv-stat .num-purple{color:var(--ice)}
body.press-interior .inv-stat .lbl{display:block;margin-top:8px;font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--ivory-faint)}
body.press-interior .timeline-section{margin:2.4em 0}
body.press-interior .timeline-section h2,body.press-interior [class*="tnt-style-642"]{font-family:var(--serif);font-weight:400;font-size:clamp(1.35rem,2.4vw,1.85rem);color:var(--ivory);margin:0 0 .55em}
body.press-interior .timeline-section p,body.press-interior [class*="tnt-style-643"]{color:var(--ivory-dim);line-height:1.7;max-width:68ch}
body.press-interior ul{margin:.6em 0 1em 1.2em;color:var(--ivory-dim)}
body.press-interior li{margin:.35em 0;max-width:68ch}
body.press-interior table.cost-table,body.press-interior table{width:100%;border-collapse:collapse;margin:1.2em 0 1.6em;font-size:.95rem}
body.press-interior table th,body.press-interior table td{text-align:left;padding:10px 12px;border-bottom:1px solid var(--hair);vertical-align:top}
body.press-interior table th,body.press-interior table td{text-align:left;padding:10px 12px;border-bottom:1px solid rgba(154,219,232,.2);vertical-align:top}
body.press-interior table th{font-family:var(--mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--ice);font-weight:500}
body.press-interior table td{color:var(--ivory-dim)}
body.press-interior table td.amt,body.press-interior table .amt{color:var(--ivory);font-family:var(--mono);white-space:nowrap}
body.press-interior .reveal{opacity:1;transform:none}
/* catalog — the whole book, A to Z (home) */
.catalog{position:relative;padding:9vh 0}
.catalog::before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(154,219,232,.15) 50%,transparent)}
.catalog .cat-layout { margin-top: 4vh; }
.catalog .cat-section-title { font-family: 'Outfit', sans-serif; font-size: 24px; color: var(--ivory); border-bottom: 1px solid var(--glass-border); padding-bottom: 8px; margin-top: 48px; margin-bottom: 24px; font-weight: 600; letter-spacing: 0.5px; }
.catalog .cat-group { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px 38px; }
@media(max-width:1000px) { .catalog .cat-group { grid-template-columns: repeat(2, 1fr); } }
@media(max-width:680px) { .catalog .cat-group { grid-template-columns: 1fr; } }
.cat-letter{font-family:var(--mono);font-size:11px;letter-spacing:.3em;color:var(--ice);
margin:20px 0 6px;break-inside:avoid}
a.cat-item{display:block;break-inside:avoid;padding:16px;border:1px solid rgba(154,219,232,.1);border-radius:4px;
background:linear-gradient(135deg, rgba(154,219,232,.03), rgba(5,7,8,.3));
backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
box-shadow:inset 0 1px 0 rgba(255,255,255,.05);margin-bottom:16px;transition:all 0.3s cubic-bezier(0.25, 1, 0.5, 1)}
a.cat-item .t{display:block;color:var(--ivory);font-size:14.5px;line-height:1.35;transition:all 0.2s}
a.cat-item .d{display:block;color:var(--ivory-faint);font-size:11.5px;line-height:1.5;margin-top:6px}
a.cat-item:hover{background:linear-gradient(135deg, rgba(154,219,232,.06), rgba(5,7,8,.5));
border-color:rgba(154,219,232,.3);transform:translateY(-2px);
box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 12px 24px rgba(0,0,0,.5),0 0 15px rgba(154,219,232,.1)}
a.cat-item:hover .t{color:var(--ice);text-shadow:0 0 10px rgba(154,219,232,.3)}
/* ΓòÉΓòÉΓòÉ PRESS CONSISTENCY LAYER ΓÇö one design language on every interior ΓòÉΓòÉΓòÉ
Appended last so it wins ties: canonical masthead, legacy hero containers
stripped bare, component primitives converged on the press card. */
[data-press-interior] .press-hero{padding:7vh 0 3.5vh;border-bottom:1px solid var(--hair);margin:0 0 4.5vh}
[data-press-interior] .press-hero .kick{display:block;font-family:var(--mono);font-size:10.5px;
letter-spacing:.3em;text-transform:uppercase;color:var(--ice);margin-bottom:2.2vh}
[data-press-interior] .press-hero h1{font-family:var(--serif);font-weight:300;
font-size:clamp(32px,4.6vw,54px);line-height:1.06;letter-spacing:-.02em;color:var(--ivory);margin:0}
[data-press-interior] .press-hero h1 em{font-style:italic;color:var(--ice)}
[data-press-interior] .press-hero .dek{margin:2.2vh 0 0;max-width:760px;color:var(--ivory-dim);
font-size:16px;line-height:1.7}
[data-press-interior] section[class*="-hero"]:not(.press-hero),
[data-press-interior] section[class^="hero-"],
[data-press-interior] section[class*=" hero-"],
[data-press-interior] div[class*="-hero"]:not(.press-hero),
[data-press-interior] div.hero-section,
[data-press-interior] section.hero {
background:none!important; border:0!important; padding:0!important; margin:0!important; text-align:left!important;
}
[data-press-interior] [class*="card"]:not(.cat-item):not(.dossier),[data-press-interior] [class*="tile"],
[data-press-interior] [class*="panel"],[data-press-interior] .inv-stat{
position:relative;overflow:hidden;
/* CRYSTAL CLEAR: crisp thin border, near-flat surface, NO blur/murky gradient/heavy shadow.
The only highlight is white and delicate (top hairline + hover). Elegance by subtraction. */
border:1px solid rgba(255,255,255,.09);border-radius:10px;
background:rgba(255,255,255,.018);
box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;
transition:border-color .18s ease, background .18s ease}
[data-press-interior] [class*="card"]:not(.cat-item):not(.dossier):hover,
[data-press-interior] [class*="tile"]:hover,[data-press-interior] [class*="panel"]:hover{
border-color:rgba(255,255,255,.24);background:rgba(255,255,255,.032)}
/* white top-glint across every glass panel (the highlight Daniel loves) */
[data-press-interior] [class*="card"]:not(.cat-item):not(.dossier)::before,
[data-press-interior] [class*="tile"]::before,
[data-press-interior] [class*="panel"]::before,
[data-press-interior] .inv-stat::before{
content:"";position:absolute;inset:0 0 auto 0;height:2px;pointer-events:none;z-index:1;
background:linear-gradient(90deg,transparent 0%,rgba(255,255,255,.85) 20%,rgba(255,255,255,.9) 50%,rgba(255,255,255,.85) 80%,transparent 100%);
opacity:.9;filter:blur(.3px)}
[data-press-interior] h2{font-family:var(--serif);font-weight:300;letter-spacing:-.01em;color:var(--ivory)}
[data-press-interior] h3{font-family:var(--serif);font-weight:400;color:var(--ivory)}
[data-press-interior] .press-main>section,[data-press-interior] main>section{margin-bottom:6vh}
/* Mobile: the LIRIL walkthrough button was pinned at top:84px, which lands on the
second row of the wrapped nav on phones ΓÇö pin it bottom-right instead. */
@media(max-width:700px){
body .liril-start-btn{top:auto!important;bottom:18px!important;right:14px!important}
}
/* Interior pages now carry the LIRIL dock (home parity); the dock's "Guide me"
drives the walkthrough, so the floating start button is redundant there.
Kept in the DOM (display:none still clickable) so the dock can trigger it. */
body:has(#dock) .liril-start-btn{display:none!important}
/* ΓòÉΓòÉΓòÉ QUANTANIUM GLASS UPGRADE ΓÇö 2026-07-11 (Daniel: more glass, white highlights, cold ice) ΓòÉΓòÉΓòÉ */
/* Spacing — the section number must not jam into the title (was "05The Office…") */
.section-num{
display:inline-block; margin-right:.5em;
color:var(--ice); font-variant-numeric:tabular-nums;
letter-spacing:.04em; opacity:.85;
}
/* Full cold-ice glass for content panels ΓÇö refined, with a white top-glint */
body.press-interior .tl-event,
body.press-interior .finding-box,
body.press-interior .ts-fact,
body.press-interior .testimony-card,
body.press-interior .person-card,
body.press-interior .human-scale,
body.press-interior .impact-number,
body.press-interior .stat-callout,
body.press-interior .inv-stat,
body.press-interior .country-card{
position:relative;
background:
linear-gradient(180deg, rgba(255,255,255,.055) 0%, rgba(255,255,255,.012) 42%, rgba(154,219,232,.03) 100%),
rgba(9,13,16,.5) !important;
border:1px solid rgba(154,219,232,.18) !important;
border-radius:12px !important;
box-shadow:0 12px 40px rgba(3,6,10,.5), inset 0 1px 0 rgba(255,255,255,.06) !important;
backdrop-filter:blur(18px) saturate(140%);
-webkit-backdrop-filter:blur(18px) saturate(140%);
overflow:hidden;
}
/* the white glint Daniel loves ΓÇö a bright hairline across the top edge */
body.press-interior .tl-event::before,
body.press-interior .finding-box::before,
body.press-interior .ts-fact::before,
body.press-interior .testimony-card::before,
body.press-interior .stat-callout::before,
body.press-interior .inv-stat::before,
body.press-interior .country-card::before{
content:"";position:absolute;inset:0 0 auto 0;height:1px;pointer-events:none;
background:linear-gradient(90deg, transparent 0%, rgba(255,255,255,.55) 22%, rgba(255,255,255,.55) 78%, transparent 100%);
opacity:.7;
}
/* SVG Data Visualization */
.glass-chart {
display: block;
width: 100%;
height: auto;
min-height: 280px;
}
.glass-chart-axis {
stroke: var(--slate-ice-edge) !important;
stroke-width: 1px !important;
}
.glass-chart-line {
fill: none;
stroke: var(--ice) !important;
stroke-width: 2px !important;
stroke-linecap: round;
filter: drop-shadow(0 2px 6px rgba(154,219,232,0.45));
}
.glass-chart-warn {
stroke: var(--gold) !important;
filter: drop-shadow(0 2px 6px rgba(211,166,37,0.45));
}
.glass-chart-fill {
fill: rgba(154,219,232,0.08) !important;
}
.glass-chart-fill-warn {
fill: rgba(211,166,37,0.08) !important;
}
.glass-chart-text {
fill: var(--ivory-dim) !important;
font-family: var(--mono) !important;
font-size: 11px !important;
}
.glass-chart-grid {
stroke: rgba(154,219,232,0.05) !important;
stroke-dasharray: 4 4 !important;
}
.slate-chart-axis {
stroke: var(--slate-border-hot) !important;
stroke-width: 1px !important;
}
.slate-chart-line {
fill: none;
stroke: var(--slate-accent) !important;
stroke-width: 2px !important;
stroke-linecap: round;
}
.slate-chart-warn {
stroke: var(--slate-warning) !important;
}
.slate-chart-fill {
fill: var(--slate-accent-glow) !important;
}
.liril-start-btn{display:none !important}
/* Share bars are retired (owner directive 2026-07-11: "we don't care about shares"). */
.share-bar,[id="share-bar"],[class*="share-btn"]{display:none !important}
/* ΓòÉΓòÉΓòÉ ARTIST-EYE PASS 2026-07-11 ΓÇö colour science + refinement ΓòÉΓòÉΓòÉ */
/* Interior hero blocks authored with off-palette gradient fills (red/gold slabs)
ΓÇö neutralize to the cold-ice standard. The methodology page is the reference. */
body.press-interior [class^="hero-"]:not(.hero-sub):not(.hero-tag),
body.press-interior [class*=" hero-"]:not(.hero-sub):not(.hero-tag){
background:
radial-gradient(120% 90% at 50% 0%, rgba(154,219,232,.07), transparent 60%),
linear-gradient(180deg, rgba(255,255,255,.02), transparent 40%),
var(--void) !important;
color:var(--ivory) !important;
}
/* Card-anchors are surfaces, not prose links ΓÇö no underline noise inside them. */
[data-press-interior] a[class*="card"][href],
[data-press-interior] a[class*="card"][href] *,
[data-press-interior] a.cat-item, [data-press-interior] a.cat-item *{
text-decoration:none !important;
}
/* Emoji icons read as clip-art against the refined register ΓÇö retire them. */
.sov-icon, [class$="-icon"]:not(.lf-icon):not([class*="svg"]) { display:none }
/* Kicker labels inside cards stay ice, small, spaced (status chips) */
.sov-status{font-family:var(--mono);font-size:10px;letter-spacing:.22em;color:var(--ice);opacity:.9}
/* Film-page ambient b-roll (director spec: behind narration, low opacity, never competes
with text; muted/loop; reduced-motion users get stillness). Generated LTX documentary reel. */
.film-broll{position:fixed;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;
opacity:.52;pointer-events:none;
/* delicate projection: readable motion; light defocus */
filter:grayscale(.2) brightness(.68) contrast(1.06) blur(.4px);
-webkit-mask-image:radial-gradient(135% 95% at 50% 26%, #000 38%, rgba(0,0,0,.35) 70%, transparent 100%);
mask-image:radial-gradient(135% 95% at 50% 26%, #000 38%, rgba(0,0,0,.35) 70%, transparent 100%)}
/* faint gate-flicker so it reads as PROJECTED light, not a flat loop ΓÇö barely perceptible */
@keyframes broll-flicker{0%,100%{opacity:.52}47%{opacity:.48}62%{opacity:.55}}
.film-broll{animation:broll-flicker 5.5s ease-in-out infinite}
/* the veil now only protects the reading text at the bottom ΓÇö projection lives in the hero */
.film-broll-veil{position:fixed;inset:0;z-index:0;pointer-events:none;
background:linear-gradient(180deg,transparent 0%,rgba(5,7,8,.35) 42%,rgba(5,7,8,.9) 70%,var(--void) 100%)}
@media(prefers-reduced-motion:reduce){.film-broll{animation:none}}
body.press-interior .press-main{position:relative;z-index:1}
/* ===== DESIGN LANGUAGE (KISS, one element = one meaning) ΓÇö 2026-07-11 =====
The site teaches the reader ONE vocabulary. No colour is decorative; each means one thing.
ICE = the label/interactive/LIRIL signal (kickers, category tags, AI/dock).
RED = CRITICAL only (the charge, an alert) ΓÇö never a decorative category colour.
IVORY = content text (ivory / -dim / -faint = primary / secondary / tertiary).
GLASS panel = a sourced record card. GOLD is retired from labels (was decorative mixing). */
[data-press-interior] .cap263-tag,
[data-press-interior] [class*="cap263-tag--"],
[data-press-interior] [class$="-status"]:not(.liril-status){
color:var(--ice) !important;
font-family:var(--mono) !important; font-size:10px !important; font-weight:500 !important;
letter-spacing:.2em !important; text-transform:uppercase !important;
background:none !important; border:0 !important; padding:0 !important;
}
/* RED stays meaningful: only the explicit critical label keeps it. */
[data-press-interior] .kick.red, [data-press-interior] .cap263-headline-red{ color:var(--red) !important; }
/* ══════════════════════════════════════════════════════════════════════════
MONOCHROME + MAGAZINE ENFORCEMENT (THEME_VER 86 · owner directive 2026-07-11)
Kill colour gaud → crystal-clear monochrome · ban share/social · refine buttons.
Palette law: ivory=content, ice=label/link, red=CRITICAL-only. Gold RETIRED.
══════════════════════════════════════════════════════════════════════════ */
/* 1 · Collapse decorative accents to monochrome (gold retired; stat colours neutralised) */
[data-press-interior], body.press-interior {
--gold: var(--ivory-dim);
--slate-brass: var(--ivory-dim); --slate-brass-hi: var(--ivory);
--slate-warning: var(--ivory-dim); --slate-warn: var(--ivory-dim);
--slate-success: var(--ivory); --slate-ok: var(--ivory); --slate-positive: var(--ivory);
--slate-good: var(--ivory); --slate-danger: var(--ivory);
--blue: var(--ivory-dim); --crimson: var(--red);
}
/* Stat cards: inline red/green/gold numbers → monochrome (genuine critical keeps --red via .kick.red) */
[data-press-interior] .cap263-card > div { color: var(--ivory) !important; }
[data-press-interior] .cap263-card > div:not(:first-child) { color: var(--ivory-dim) !important; }
/* 2 · Stat numbers → one ivory (no red/gold/blue/purple rainbow) */
[data-press-interior] .num-red, [data-press-interior] .num-gold,
[data-press-interior] .num-blue, [data-press-interior] .num-purple,
body.press-interior .inv-stat .num, body.press-interior .inv-stat .num-red,
body.press-interior .inv-stat .num-gold, body.press-interior .inv-stat .num-blue,
body.press-interior .inv-stat .num-purple,
[data-press-interior] .stat__num, [data-press-interior] .stat-value,
[data-press-interior] .pr-stat-value, [data-press-interior] .pr-stat .num {
color: var(--ivory) !important;
}
/* 3 · Status / dept / outcome badges + tags → ONE quiet mono label, no colour fills */
[data-press-interior] .pr-outcome-badge, [data-press-interior] .pr-dept-badge,
[data-press-interior] [class*="badge-"], [data-press-interior] .cap263-tag,
[data-press-interior] .cap263-tag--red, [data-press-interior] .cap263-tag--gold {
background: transparent !important; color: var(--ivory-dim) !important;
border: 1px solid rgba(255,255,255,.10) !important; border-radius: 3px !important;
font-family: var(--mono) !important; font-size: 9.5px !important; font-weight: 500 !important;
letter-spacing: .16em !important; text-transform: uppercase !important;
padding: 2px 7px !important; box-shadow: none !important;
}
/* 4 · Horizon: dashed-gold "inference" border → clean hairline (meaning kept via label) */
[data-press-interior] .h-col.inferred .glass, body.press-interior .h-col.inferred .glass {
border-style: solid !important; border-color: rgba(255,255,255,.09) !important;
}
[data-press-interior] .h-col.inferred h3, body.press-interior .h-col.inferred h3,
[data-press-interior] .h-col.stated h3 { color: var(--ivory-dim) !important; }
/* 5 · Buttons: NO gaudy filled/glowing pills — refined white-hairline controls only */
.cta-button, [data-press-interior] .cta, [data-press-interior] .cta-secondary,
[data-press-interior] .report-cta, [data-press-interior] .hub-cta,
[data-press-interior] .cta-box {
background: transparent !important; color: var(--ivory) !important;
border: 1px solid rgba(255,255,255,.22) !important; border-radius: 4px !important;
box-shadow: none !important; backdrop-filter: none !important;
padding: .68em 1.4em !important; font-family: var(--mono) !important;
font-size: 12px !important; letter-spacing: .14em !important; text-transform: uppercase !important;
transition: border-color .18s ease, background .18s ease !important;
}
.cta-button:hover, [data-press-interior] .cta:hover, [data-press-interior] .cta-secondary:hover {
background: rgba(255,255,255,.04) !important; border-color: rgba(255,255,255,.5) !important;
color: var(--ivory) !important; transform: none !important; box-shadow: none !important;
}
/* 6 · BAN share + social entirely (owner directive 2026-07-11 — "we don't care about shares") */
.share-card, .share-grid, .share-banner, .share-visual,
.cat-social, .ev-cat.cat-social, .share-bar, [id="share-bar"],
[class*="share-btn"], [class*="social-share"], [class*="share-cta"] {
display: none !important;
}
/* � CINEMATIC VIDEO EMBEDS (p256 video generation) � */
.cinema-embed {
position: relative;
width: 100%;
margin: 3.5em 0;
aspect-ratio: 2.35 / 1;
background: var(--void);
border: 1px solid rgba(154,219,232,.2);
border-radius: 4px;
overflow: hidden;
box-shadow: 0 15px 50px -10px rgba(0,0,0,.7);
}
.cinema-embed > video,
.cinema-embed > img,
.cinema-embed > iframe {
width: 100%; height: 100%;
object-fit: cover;
opacity: .75;
filter: contrast(1.1) saturate(1.1);
}
.cinema-ui {
position: absolute;
inset: 0;
pointer-events: none;
z-index: 10;
box-shadow: inset 0 0 120px rgba(0,0,0,.8);
border: 1px solid rgba(154,219,232,.05);
}
.cinema-ui::before {
content: "";
position: absolute;
top: 20px; left: 24px;
width: 6px; height: 6px;
border-radius: 50%;
background: var(--ice);
box-shadow: 0 0 12px var(--ice);
animation: pulse-rec 3s infinite;
}
.cinema-ui::after {
content: attr(data-status);
position: absolute;
top: 16px; left: 42px;
font-family: var(--mono);
font-size: 11px;
letter-spacing: .22em;
color: var(--ice);
text-transform: uppercase;
}
.cinema-timecode {
position: absolute;
bottom: 18px; right: 24px;
font-family: var(--mono);
font-size: 11.5px;
letter-spacing: .15em;
color: var(--ice);
}
.cinema-tag {
position: absolute;
bottom: 18px; left: 24px;
font-family: var(--mono);
font-size: 11px;
letter-spacing: .25em;
color: var(--ivory-dim);
text-transform: uppercase;
}
.cinema-overlay-lines {
position: absolute;
inset: 0;
background: linear-gradient(rgba(154,219,232,.03) 1px, transparent 1px);
background-size: 100% 4px;
pointer-events: none;
z-index: 11;
mix-blend-mode: overlay;
}
@keyframes pulse-rec { 0%, 100% { opacity: 1; } 50% { opacity: .2; } }
/* ══════════════════════════════════════════════════════════════════════════
CRYSTAL-CLEAR HARD ENFORCEMENT (v95 · owner 2026-07-11)
The auto-loop's "Quantanium" glass / glow / gradient is BANNED. Flat monochrome.
══════════════════════════════════════════════════════════════════════════ */
/* No glass blur, no text glow anywhere in the interior */
[data-press-interior] *, [data-press-interior] *::before, [data-press-interior] *::after {
backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
text-shadow: none !important;
}
/* Kill coloured glows + gaudy gradient fills on chrome/cards/panels — flat crystal-clear */
[data-press-interior] .press-bar, [data-press-interior] .summary-banner,
[data-press-interior] .glass, [data-press-interior] [class*="card"], [data-press-interior] [class*="panel"],
[data-press-interior] [class*="tile"], [data-press-interior] .exhibit, [data-press-interior] .dossier,
[data-press-interior] .cat-item, [data-press-interior] .inflection, [data-press-interior] .stamp,
[data-press-interior] .vis-timeline, [data-press-interior] .t5r-pill, [data-press-interior] .cta-button {
box-shadow: none !important; background-image: none !important;
}
/* Hairline-white borders (kill cyan-tinted borders the loop added) */
[data-press-interior] .cat-item, [data-press-interior] .exhibit, [data-press-interior] .dossier,
[data-press-interior] .inflection, [data-press-interior] [class*="card"], [data-press-interior] [class*="panel"],
[data-press-interior] [class*="tile"] { border-color: rgba(255,255,255,.09) !important; }
/* Meter / timeline fills: single monochrome, never red→cyan gaud */
[data-press-interior] [class*="-fill"], [data-press-interior] [class*="meter"], [data-press-interior] .vis-timeline-fill {
background: rgba(255,255,255,.16) !important; box-shadow: none !important;
}
/* Stamps / status chips → quiet mono labels (no glow, no colour fill) */
[data-press-interior] .stamp, [data-press-interior] .stamp.bad,
[data-press-interior] .stamp.ok, [data-press-interior] .stamp.warn {
background: transparent !important; color: var(--ivory-dim) !important;
border-color: rgba(255,255,255,.14) !important; box-shadow: none !important;
}
/* Related / connected-intelligence card titles → ivory, hairline (not cyan gaud) */
[data-press-interior] .ci-card, [data-press-interior] [class*="related"] a,
[data-press-interior] [class*="connect"] a { color: var(--ivory) !important; }
/* ══════════════════════════════════════════════════════════════════════════
HOMEPAGE BEAUTY PARITY (THEME_VER 96 · 2026-07-11)
Source of truth: index.html .glass / .wire / .cover / .kick / .stand
Crystal-clear v95 stripped interior blur; Daniel wants Quantanium glass:
cold ice + void + translucent panes + white top-glint (home language).
Mono palette law still holds (no gold labels, no cyan bloom, no text glow).
══════════════════════════════════════════════════════════════════════════ */
/* Re-enable home .glass optics on record cards */
body.press-interior .glass,
body.press-interior .brief-item,
body.press-interior .tile,
body.press-interior .h-col .glass,
body.press-interior .contract,
body.press-interior .press-main article.glass,
[data-press-interior] .glass,
[data-press-interior] .brief-item,
[data-press-interior] .tile {
position: relative !important;
overflow: hidden !important;
border-radius: 8px !important;
border: 1px solid rgba(154,219,232,.16) !important;
background:
linear-gradient(160deg, rgba(154,219,232,.08), rgba(154,219,232,.02) 45%, rgba(5,7,8,.4)) !important;
backdrop-filter: blur(16px) saturate(1.15) !important;
-webkit-backdrop-filter: blur(16px) saturate(1.15) !important;
box-shadow:
inset 0 1px 0 rgba(255,255,255,.09),
inset 0 -1px 0 rgba(0,0,0,.45),
0 34px 60px -30px rgba(0,0,0,.9) !important;
transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease !important;
text-shadow: none !important;
filter: none !important;
}
/* White top-glint specular — matches home .glass::before */
body.press-interior .glass::before,
body.press-interior .brief-item::before,
body.press-interior .tile::before,
[data-press-interior] .glass::before,
[data-press-interior] .brief-item::before,
[data-press-interior] .tile::before {
content: "" !important;
position: absolute !important;
inset: 0 !important;
height: auto !important;
border-radius: inherit !important;
pointer-events: none !important;
background: linear-gradient(115deg, rgba(255,255,255,.10), transparent 32%) !important;
opacity: 1 !important;
filter: none !important;
z-index: 0 !important;
box-shadow: none !important;
}
body.press-interior .glass:hover,
body.press-interior .brief-item:hover,
body.press-interior .tile:hover,
[data-press-interior] .glass:hover,
[data-press-interior] .brief-item:hover,
[data-press-interior] .tile:hover {
transform: translateY(-4px) !important;
border-color: rgba(154,219,232,.3) !important;
box-shadow:
inset 0 1px 0 rgba(255,255,255,.12),
0 48px 76px -32px rgba(0,0,0,.95) !important;
}
/* Press chrome = home cover-bar glass strip */
body.press-interior .press-bar,
[data-press-interior] .press-bar {
background: linear-gradient(180deg, rgba(255,255,255,.04) 0%, rgba(5,7,8,.94) 40%) !important;
backdrop-filter: blur(16px) saturate(1.08) !important;
-webkit-backdrop-filter: blur(16px) saturate(1.08) !important;
box-shadow: inset 0 1px 0 rgba(255,255,255,.06) !important;
border-bottom: 1px solid rgba(154,219,232,.1) !important;
background-image: linear-gradient(180deg, rgba(255,255,255,.04) 0%, rgba(5,7,8,.94) 40%) !important;
}
/* Kick / stand type parity with home cover + wire */
body.press-interior .kick,
body.press-interior .press-main > .kick {
font-family: var(--mono) !important;
font-size: 10px !important;
font-weight: 500 !important;
letter-spacing: .26em !important;
text-transform: uppercase !important;
color: var(--ice) !important;
}
body.press-interior .press-main > .stand {
max-width: 62ch !important;
color: var(--ivory-dim) !important;
font-size: clamp(15px, 1.6vw, 18px) !important;
line-height: 1.65 !important;
}
body.press-interior .press-main > .stand b {
color: var(--ivory) !important;
font-weight: 600 !important;
}
/* Briefing grid = home .wire rhythm (2-col panes, 22px gap) */
body.press-interior .brief-grid {
display: grid !important;
grid-template-columns: repeat(2, 1fr) !important;
gap: 22px !important;
}
@media (max-width: 860px) {
body.press-interior .brief-grid { grid-template-columns: 1fr !important; }
}
body.press-interior .brief-item {
padding: 26px 30px !important;
display: flex !important;
flex-direction: column !important;
gap: 10px !important;
}
body.press-interior .brief-item h3 {
font-weight: 600 !important;
font-size: 19px !important;
line-height: 1.3 !important;
color: var(--ivory) !important;
position: relative !important;
z-index: 1 !important;
}
body.press-interior .brief-item p {
font-size: 13.5px !important;
color: var(--ivory-dim) !important;
position: relative !important;
z-index: 1 !important;
}
body.press-interior .tiles { gap: 18px !important; }
body.press-interior .tile {
padding: 24px 26px !important;
}
body.press-interior .tile .v,
body.press-interior .tile .l,
body.press-interior .tile .n {
position: relative !important;
z-index: 1 !important;
}
/* Network chrome — same pane language as home glass */
body.press-interior .net-chrome,
body.press-interior .board,
body.press-interior .detail {
position: relative !important;
overflow: hidden !important;
border: 1px solid rgba(154,219,232,.16) !important;
border-radius: 12px !important;
background:
linear-gradient(160deg, rgba(154,219,232,.08), rgba(154,219,232,.02) 45%, rgba(5,7,8,.4)) !important;
backdrop-filter: blur(16px) saturate(1.15) !important;
-webkit-backdrop-filter: blur(16px) saturate(1.15) !important;
box-shadow:
inset 0 1px 0 rgba(255,255,255,.09),
inset 0 -1px 0 rgba(0,0,0,.45),
0 24px 48px -28px rgba(0,0,0,.85) !important;
background-image:
linear-gradient(160deg, rgba(154,219,232,.08), rgba(154,219,232,.02) 45%, rgba(5,7,8,.4)) !important;
}
body.press-interior .net-chrome::before,
body.press-interior .board::before,
body.press-interior .detail::before {
content: "" !important;
position: absolute !important;
inset: 0 !important;
height: auto !important;
border-radius: inherit !important;
pointer-events: none !important;
background: linear-gradient(115deg, rgba(255,255,255,.10), transparent 32%) !important;
z-index: 0 !important;
opacity: 1 !important;
filter: none !important;
}
body.press-interior .net-chrome > *,
body.press-interior .board > *,
body.press-interior .detail > * {
position: relative !important;
z-index: 1 !important;
}
/* Foot white hairline — home press-foot */
body.press-interior .press-foot {
position: relative !important;
background: linear-gradient(0deg, rgba(255,255,255,.02) 0%, transparent 70%) !important;
background-image: linear-gradient(0deg, rgba(255,255,255,.02) 0%, transparent 70%) !important;
box-shadow: none !important;
}
body.press-interior .press-foot::before {
content: "" !important;
position: absolute !important;
top: -1px !important;
left: 0 !important;
right: 0 !important;
height: 1px !important;
background: linear-gradient(90deg, transparent, rgba(255,255,255,.35) 50%, transparent) !important;
opacity: 1 !important;
filter: none !important;
}
/* Shelf category labels = home chapter kickers */
body.press-interior .shelf-cat {
font-family: var(--mono) !important;
font-size: 10.5px !important;
letter-spacing: .28em !important;
text-transform: uppercase !important;
color: var(--ice) !important;
margin: 0 0 1.1rem !important;
}
/* Horizon columns — common region with glass children (Gestalt proximity) */
body.press-interior .horizon {
gap: 26px !important;
}
body.press-interior .h-col h3 {
font-family: var(--mono) !important;
font-size: 10.5px !important;
letter-spacing: .3em !important;
text-transform: uppercase !important;
margin-bottom: 18px !important;
}
body.press-interior .h-col.stated h3 { color: var(--ice) !important; }
body.press-interior .h-col.inferred h3 { color: var(--ivory-dim) !important; }
body.press-interior .h-col.inferred .glass {
border-style: dashed !important;
border-color: rgba(154,219,232,.28) !important;
}
/* Dock / radio indicators: kill cyan glow, keep the dock's black separator (crystal-clear) */
[data-press-interior] .dock { box-shadow: 0 -24px 48px -18px rgba(0,0,0,.9) !important; }
[data-press-interior] .eq i, [data-press-interior] .t5r-dot, [data-press-interior] .t5r-pill,
[data-press-interior] .dock .on, [data-press-interior] [class*="dot"] { box-shadow: none !important; }
/* ══════════════════════════════════════════════════════════════════════════
HOMEPAGE BEAUTY PARITY v97 · 2026-07-11
Extend home glass to dossiers / exhibits / shelf cards; kill cyan text-glow
on dossier titles; shelf-cat hairline like home chapter labels.
══════════════════════════════════════════════════════════════════════════ */
/* Dossier + exhibit + evidence shelf cards = home .glass panes */
body.press-interior .dossier,
body.press-interior .exhibit,
body.press-interior .src-card,
body.press-interior a.cat-item,
[data-press-interior] .dossier,
[data-press-interior] .exhibit,
[data-press-interior] .src-card,
[data-press-interior] a.cat-item {
position: relative !important;
overflow: hidden !important;
border-radius: 8px !important;
border: 1px solid rgba(154,219,232,.16) !important;
background:
linear-gradient(160deg, rgba(154,219,232,.08), rgba(154,219,232,.02) 45%, rgba(5,7,8,.4)) !important;
background-image:
linear-gradient(160deg, rgba(154,219,232,.08), rgba(154,219,232,.02) 45%, rgba(5,7,8,.4)) !important;
backdrop-filter: blur(16px) saturate(1.15) !important;
-webkit-backdrop-filter: blur(16px) saturate(1.15) !important;
box-shadow:
inset 0 1px 0 rgba(255,255,255,.09),
inset 0 -1px 0 rgba(0,0,0,.45),
0 34px 60px -30px rgba(0,0,0,.9) !important;
text-shadow: none !important;
filter: none !important;
transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease !important;
}
body.press-interior .dossier::before,
body.press-interior .exhibit::before,
body.press-interior .src-card::before,
body.press-interior a.cat-item::before,
[data-press-interior] .dossier::before,
[data-press-interior] .exhibit::before,
[data-press-interior] .src-card::before,
[data-press-interior] a.cat-item::before {
content: "" !important;
position: absolute !important;
inset: 0 !important;
height: auto !important;
border-radius: inherit !important;
pointer-events: none !important;
background: linear-gradient(115deg, rgba(255,255,255,.10), transparent 32%) !important;
opacity: 1 !important;
filter: none !important;
z-index: 0 !important;
box-shadow: none !important;
}
body.press-interior .dossier:hover,
body.press-interior .exhibit:hover,
body.press-interior .src-card:hover,
body.press-interior a.cat-item:hover,
[data-press-interior] .dossier:hover,
[data-press-interior] .exhibit:hover,
[data-press-interior] .src-card:hover,
[data-press-interior] a.cat-item:hover {
transform: translateY(-4px) !important;
border-color: rgba(154,219,232,.3) !important;
box-shadow:
inset 0 1px 0 rgba(255,255,255,.12),
0 48px 76px -32px rgba(0,0,0,.95) !important;
background-image:
linear-gradient(160deg, rgba(154,219,232,.1), rgba(154,219,232,.03) 45%, rgba(5,7,8,.45)) !important;
}
/* Dossier title: ice label, no cyan bloom (home h3 language) */
body.press-interior .dossier h3,
[data-press-interior] .dossier h3 {
color: var(--ivory) !important;
text-shadow: none !important;
position: relative !important;
z-index: 1 !important;
}
body.press-interior .dossier .no,
[data-press-interior] .dossier .no {
color: rgba(154,219,232,.28) !important;
text-shadow: none !important;
position: relative !important;
z-index: 1 !important;
}
body.press-interior .dossier p,
body.press-interior .dossier .meta,
body.press-interior .exhibit .claim-q,
body.press-interior .exhibit .finding,
body.press-interior .src-card h3,
body.press-interior .src-card .what,
body.press-interior a.cat-item .t,
body.press-interior a.cat-item .d {
position: relative !important;
z-index: 1 !important;
}
/* Shelf category = home chapter kicker + hairline */
body.press-interior .shelf-cat {
display: flex !important;
align-items: center !important;
gap: 18px !important;
margin: 6vh 0 3vh !important;
letter-spacing: .3em !important;
}
body.press-interior .shelf-cat::after {
content: "" !important;
flex: 1 !important;
height: 1px !important;
background: linear-gradient(90deg, rgba(154,219,232,.22), transparent 85%) !important;
opacity: 1 !important;
filter: none !important;
position: static !important;
inset: auto !important;
}
/* Guide CTA = home ice solid (begin / guide-me) */
body.press-interior .guide-cta,
body.press-interior .press-main .guide-cta {
font-family: var(--mono) !important;
font-size: 11px !important;
font-weight: 600 !important;
letter-spacing: .24em !important;
text-transform: uppercase !important;
color: var(--void) !important;
background: var(--ice) !important;
border: none !important;
border-radius: 3px !important;
padding: 14px 28px !important;
box-shadow: 0 16px 44px -12px rgba(154,219,232,.38) !important;
transition: transform .25s ease, background .25s ease !important;
}
body.press-interior .guide-cta:hover,
body.press-interior .press-main .guide-cta:hover {
background: var(--ivory) !important;
color: var(--void) !important;
transform: translateY(-2px) !important;
filter: none !important;
}
/* Soft field aurora behind press-main content (home .field whisper only) */
body.press-interior .press-main {
background:
radial-gradient(700px 380px at 12% 8%, rgba(63,124,140,.08), transparent 65%),
radial-gradient(420px 260px at 88% 40%, rgba(154,219,232,.04), transparent 60%) !important;
}
/* Stamps stay severity chips — hairline only, no glow fill */
body.press-interior .stamp.bad {
color: var(--red) !important;
border-color: rgba(200,16,46,.45) !important;
background: rgba(200,16,46,.08) !important;
box-shadow: inset 0 1px 0 rgba(255,255,255,.08) !important;
}
body.press-interior .stamp.ok {
color: var(--ice) !important;
border-color: rgba(154,219,232,.35) !important;
background: rgba(154,219,232,.06) !important;
box-shadow: inset 0 1px 0 rgba(255,255,255,.08) !important;
}
body.press-interior .stamp.warn {
color: var(--ivory-dim) !important;
border-color: rgba(255,255,255,.2) !important;
background: rgba(255,255,255,.03) !important;
box-shadow: inset 0 1px 0 rgba(255,255,255,.06) !important;
}
/* ══════════════════════════════════════════════════════════════════════════
HOME LANDING EXPANSION (THEME_VER 202 · 2026-07-11)
LTX film broll + Flux stills + enter portals + cinema + dossier thumbs.
Memorial ice-lake only — no cyber HUD, no crest, no internals.
Homepage is NOT press-interior — design-lock glass ban does not apply here.
══════════════════════════════════════════════════════════════════════════ */
/* Cover LTX projection — sits under cover chrome, never competes with type */
.cover{isolation:isolate}
.cover .home-broll{
position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
z-index:0;pointer-events:none;opacity:.72;
filter:grayscale(.08) brightness(.82) contrast(1.06) saturate(.95);
}
.cover .home-broll-veil{
position:absolute;inset:0;z-index:1;pointer-events:none;
background:
linear-gradient(180deg,rgba(5,7,8,.32) 0%,rgba(5,7,8,.22) 35%,rgba(5,7,8,.62) 78%,var(--void) 100%),
radial-gradient(90% 70% at 70% 20%,rgba(63,124,140,.12),transparent 60%);
}
.cover > .ghost5,.cover > .cover-bar,.cover > .cover-core,.cover > .cover-foot{position:relative;z-index:3}
/* Enter portals — four doors into the book */
.enter{padding:8vh 0 6vh;border-bottom:1px solid var(--hair)}
.enter-grid{
display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:4vh
}
@media(max-width:1100px){.enter-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.enter-grid{grid-template-columns:1fr}}
a.enter-card{
display:flex;flex-direction:column;gap:12px;padding:0 0 22px;
text-decoration:none;color:inherit;overflow:hidden;
min-height:100%;
}
a.enter-card .enter-media{
position:relative;aspect-ratio:16/10;overflow:hidden;
border-bottom:1px solid rgba(154,219,232,.12);
background:var(--ink);
}
a.enter-card .enter-media img,
a.enter-card .enter-media video{
position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;
filter:grayscale(.15) brightness(.88) contrast(1.05);
transition:transform .5s ease,filter .4s ease;
}
a.enter-card:hover .enter-media img,
a.enter-card:hover .enter-media video{
transform:scale(1.04);filter:grayscale(0) brightness(.95) contrast(1.08)
}
a.enter-card .enter-body{padding:4px 22px 0;display:flex;flex-direction:column;gap:8px;position:relative;z-index:1}
a.enter-card h3{
font-family:var(--serif);font-weight:400;font-size:clamp(18px,1.8vw,22px);
line-height:1.2;color:var(--ivory);letter-spacing:-.01em
}
a.enter-card p{font-size:13.5px;color:var(--ivory-dim);line-height:1.55;max-width:36ch}
a.enter-card .meta{margin-top:auto;padding-top:10px;border-top:1px solid rgba(154,219,232,.1);
font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--ivory-faint)}
/* Flux stills + chart ledger */
.stills{padding:8vh 0;border-bottom:1px solid var(--hair)}
.stills-grid{
display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:3.5vh
}
.stills-grid-5{grid-template-columns:repeat(3,1fr)}
.stills-grid-5 .still-card:nth-child(4),
.stills-grid-5 .still-card:nth-child(5){grid-column:span 1}
/* Slate-spec dense visual ledger (9 stills) */
.stills-grid-9{grid-template-columns:repeat(3,1fr);gap:var(--media-gap,16px)}
.slate-spec .still-frame img,
.slate-spec .chart-frame img,
.slate-spec .media-frame img{
filter:var(--media-img-filter);width:100%;height:100%;object-fit:cover;display:block
}
.slate-spec .still-card:hover .still-frame img,
.slate-spec .media-card:hover .media-frame img{
filter:var(--media-img-filter-hot)
}
.newsdesk-grid-visual .newsdesk-card.has-thumb{
display:flex;flex-direction:column;padding:0;overflow:hidden
}
.newsdesk-grid-visual .newsdesk-thumb{
aspect-ratio:16/9;overflow:hidden;border-bottom:1px solid rgba(154,219,232,.12);
position:relative;background:#05080d;min-height:140px
}
.newsdesk-grid-visual .newsdesk-thumb img,
.newsdesk-grid-visual .newsdesk-thumb video{
width:100%;height:100%;object-fit:cover;display:block;
filter:var(--media-img-filter);transition:filter .35s ease,transform .5s ease,opacity .35s ease
}
.newsdesk-grid-visual .newsdesk-thumb video{
position:absolute;inset:0;z-index:1;opacity:1;
filter:var(--media-img-filter) saturate(.82) brightness(.92)
}
.newsdesk-grid-visual .newsdesk-thumb.is-cine img{
position:absolute;inset:0;z-index:0;opacity:1;transition:opacity .4s ease
}
.newsdesk-grid-visual .newsdesk-thumb.is-cine video.playing,
.newsdesk-grid-visual .newsdesk-thumb.is-cine:has(video:not([paused])) img{opacity:0}
.enter-media.is-cine img{
position:absolute;inset:0;z-index:0;width:100%;height:100%;object-fit:cover;transition:opacity .4s ease
}
.enter-media.is-cine video{position:absolute;inset:0;z-index:1}
.doc-stage.home-doc{
min-height:min(52vh,520px);
margin:clamp(1.5rem,4vw,2.8rem) auto;
padding:0 clamp(12px,2vw,24px)
}
.cover .home-broll{opacity:.82;z-index:0}
.newsdesk-grid-visual .newsdesk-card:hover .newsdesk-thumb img,
.newsdesk-grid-visual .newsdesk-card:hover .newsdesk-thumb video{
filter:var(--media-img-filter-hot);transform:scale(1.03)
}
/* Seamless cinema + glass: enter cards, thesis still */
.enter-media.is-cine,
.still-frame.is-cine{
position:relative;overflow:hidden;aspect-ratio:16/10;background:#05080d
}
.enter-media.is-cine video,
.still-frame.is-cine video{
width:100%;height:100%;object-fit:cover;display:block;
filter:saturate(.8) contrast(1.05) brightness(.9)
}
.enter-card:hover .enter-media.is-cine video,
.thesis-cine:hover .still-frame.is-cine video{filter:saturate(.88) contrast(1.08) brightness(.95)}
.cover .home-broll{
filter:saturate(.78) contrast(1.06) brightness(.88)
}
.newsdesk-grid-visual .newsdesk-card.has-thumb .kick,
.newsdesk-grid-visual .newsdesk-card.has-thumb h3,
.newsdesk-grid-visual .newsdesk-card.has-thumb p,
.newsdesk-grid-visual .newsdesk-card.has-thumb .meta{padding-left:18px;padding-right:18px}
.newsdesk-grid-visual .newsdesk-card.has-thumb .kick{margin-top:14px}
.newsdesk-grid-visual .newsdesk-card.has-thumb .meta{padding-bottom:16px}
.charts-row-8{grid-template-columns:repeat(4,1fr)}
@media(max-width:1100px){.charts-row-8{grid-template-columns:repeat(3,1fr)}}
@media(max-width:900px){
.stills-grid-9{grid-template-columns:1fr 1fr}
.charts-row-8{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:560px){
.stills-grid-9{grid-template-columns:1fr}
.charts-row-8{grid-template-columns:1fr}
}
.cinema-grid-6{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--media-gap,16px)}
@media(max-width:900px){.cinema-grid-6{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.cinema-grid-6{grid-template-columns:1fr}}
.slate-board-grid{margin-top:1em}
.slate-board-grid .media-body{padding:14px 16px 16px}
.slate-board-grid .media-body h3{margin:.35em 0 .2em;font-size:1.05rem}
@media(min-width:901px){
.stills-grid-5{grid-template-columns:repeat(6,1fr)}
.stills-grid-5 .still-card:nth-child(1),
.stills-grid-5 .still-card:nth-child(2),
.stills-grid-5 .still-card:nth-child(3){grid-column:span 2}
.stills-grid-5 .still-card:nth-child(4),
.stills-grid-5 .still-card:nth-child(5){grid-column:span 3}
}
@media(max-width:900px){.stills-grid,.stills-grid-5{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.stills-grid,.stills-grid-5{grid-template-columns:1fr}}
figure.still-card figcaption a{color:var(--ice);border-bottom:1px solid rgba(154,219,232,.25)}
figure.still-card figcaption a:hover{color:var(--ivory);border-color:var(--ice)}
/* Cover secondary path — quieter than Begin */
.cover .begin.begin-quiet{
opacity:.75;letter-spacing:.18em;margin-top:8px
}
.cover .begin.begin-quiet:hover{opacity:1;color:var(--ice)}
.cover .guide-actions{display:flex;flex-wrap:wrap;gap:14px 22px;align-items:flex-end}
figure.still-card{
margin:0;padding:0;overflow:hidden;display:flex;flex-direction:column
}
figure.still-card .still-frame{
position:relative;aspect-ratio:16/10;overflow:hidden;background:var(--ink)
}
figure.still-card img{
width:100%;height:100%;object-fit:cover;display:block;
filter:grayscale(.12) brightness(.9) contrast(1.06)
}
figure.still-card figcaption{
padding:16px 20px 20px;font-family:var(--mono);font-size:10.5px;
letter-spacing:.08em;line-height:1.55;color:var(--ivory-faint);position:relative;z-index:1
}
figure.still-card figcaption b{
display:block;color:var(--ice);font-weight:500;letter-spacing:.18em;
text-transform:uppercase;margin-bottom:6px;font-size:10px
}
.charts-row{
display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:22px
}
@media(max-width:900px){.charts-row{grid-template-columns:repeat(2,1fr)}}
@media(max-width:480px){.charts-row{grid-template-columns:1fr}}
a.chart-tile{
display:block;overflow:hidden;padding:0;text-decoration:none;color:inherit
}
a.chart-tile .chart-frame{
overflow:hidden;background:transparent;border-bottom:1px solid rgba(154,219,232,.1)
}
a.chart-tile img{
width:100%;height:auto;display:block;
filter:grayscale(.2) brightness(.92) contrast(1.05);
transition:transform .4s ease
}
a.chart-tile:hover img{transform:scale(1.03)}
a.chart-tile .lbl{
display:block;padding:12px 14px;font-family:var(--mono);font-size:10px;
letter-spacing:.16em;text-transform:uppercase;color:var(--ivory-faint);position:relative;z-index:1
}
/* LTX cinema strip */
.cinema{padding:8vh 0;border-bottom:1px solid var(--hair)}
.cinema-grid{
display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:3.5vh
}
.cinema-grid-4{grid-template-columns:repeat(4,1fr)}
@media(max-width:1100px){.cinema-grid-4{grid-template-columns:repeat(2,1fr)}}
@media(max-width:900px){.cinema-grid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.cinema-grid,.cinema-grid-4{grid-template-columns:1fr}}
figure.cinema-cell{
margin:0;padding:0;overflow:hidden;display:flex;flex-direction:column
}
figure.cinema-cell .cine-frame{
position:relative;aspect-ratio:16/9;overflow:hidden;background:var(--ink)
}
figure.cinema-cell video{
position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;
filter:grayscale(.12) brightness(.82) contrast(1.06)
}
figure.cinema-cell .cine-tag{
position:absolute;top:12px;left:12px;z-index:2;
font-family:var(--mono);font-size:9px;letter-spacing:.2em;text-transform:uppercase;
color:var(--ice);padding:5px 10px;border:1px solid rgba(154,219,232,.25);
background:rgba(5,7,8,.55);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)
}
figure.cinema-cell figcaption{
padding:14px 18px 18px;font-family:var(--mono);font-size:10.5px;
letter-spacing:.06em;color:var(--ivory-faint);line-height:1.5;position:relative;z-index:1
}
figure.cinema-cell figcaption b{
display:block;color:var(--ivory);font-weight:500;margin-bottom:4px;letter-spacing:.12em;text-transform:uppercase;font-size:10px
}
.cinema-cta{margin-top:3.5vh;display:flex;flex-wrap:wrap;gap:14px;align-items:center}
.cinema-cta .go-film{margin-top:0}
/* Thesis + visual still */
.thesis-hero{
display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(22px,4vw,40px);
align-items:start;margin-top:1vh
}
@media(max-width:900px){.thesis-hero{grid-template-columns:1fr}}
.thesis-still{margin:0;padding:0;overflow:hidden}
.thesis-still .still-frame{aspect-ratio:16/10;overflow:hidden;background:var(--ink)}
.thesis-still img{width:100%;height:100%;object-fit:cover;display:block;
filter:grayscale(.15) brightness(.9) contrast(1.05)}
.thesis-still figcaption{
padding:14px 18px 16px;font-family:var(--mono);font-size:10.5px;
letter-spacing:.06em;color:var(--ivory-faint);line-height:1.5;position:relative;z-index:1
}
.thesis-still figcaption b{
display:block;color:var(--ice);font-weight:500;letter-spacing:.16em;
text-transform:uppercase;margin-bottom:4px;font-size:10px
}
/* Scale of the record */
.scale{padding:6vh 0 7vh;border-bottom:1px solid var(--hair)}
.scale-grid{
display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:3vh
}
@media(max-width:900px){.scale-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:480px){.scale-grid{grid-template-columns:1fr}}
.scale-tile{
padding:26px 24px;display:flex;flex-direction:column;gap:8px
}
.scale-tile .v{
font-family:var(--serif);font-weight:300;font-size:clamp(28px,3.2vw,40px);
color:var(--ice);letter-spacing:-.02em;line-height:1;position:relative;z-index:1
}
.scale-tile .l{
font-family:var(--mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;
color:var(--ivory);position:relative;z-index:1
}
.scale-tile .n{
font-size:13px;color:var(--ivory-dim);line-height:1.45;position:relative;z-index:1
}
/* Year dossiers with Flux/LTX still thumbs */
.dossier-stack{display:flex;flex-direction:column;gap:14px}
a.dossier.dossier-media{
display:grid;grid-template-columns:minmax(120px,160px) 72px 1fr auto;
gap:clamp(14px,2.5vw,28px);align-items:center;padding:0 28px 0 0;overflow:hidden
}
a.dossier.dossier-media .dossier-thumb{
position:relative;align-self:stretch;min-height:100px;overflow:hidden;
background:var(--ink);border-right:1px solid rgba(154,219,232,.1)
}
a.dossier.dossier-media .dossier-thumb img{
width:100%;height:100%;object-fit:cover;display:block;min-height:108px;
filter:grayscale(.12) brightness(.9) contrast(1.05);
transition:transform .45s ease,filter .35s ease
}
a.dossier.dossier-media:hover .dossier-thumb img{
transform:scale(1.05);filter:grayscale(0) brightness(.95)
}
a.dossier.dossier-media .no,
a.dossier.dossier-media h3,
a.dossier.dossier-media p,
a.dossier.dossier-media .meta{position:relative;z-index:1}
a.dossier.dossier-media h3{text-shadow:none;color:var(--ivory)}
@media(max-width:700px){
a.dossier.dossier-media{
grid-template-columns:1fr;padding:0 0 18px
}
a.dossier.dossier-media .dossier-thumb{
aspect-ratio:16/9;border-right:0;border-bottom:1px solid rgba(154,219,232,.1)
}
a.dossier.dossier-media .no,
a.dossier.dossier-media > div,
a.dossier.dossier-media .meta{padding-left:20px;padding-right:20px}
a.dossier.dossier-media .no{padding-top:14px}
}
/* ── OWNER-APPROVED ACCENT GLOW (2026-07-11) — technical-artist rule ──────────
Intentional cinematic cyan glow on HERO / heading emphasis ONLY. This is the
"correct effect" the owner endorsed. The crystal-clear rules still kill the
GAUDY overuse (card glass-blur, stamp/badge colour-glows, cyan gradient fills).
──────────────────────────────────────────────────────────────────────────── */
[data-press-interior] .press-hero h1 em, [data-press-interior] .ch-title em,
[data-press-interior] .era h3 em, [data-press-interior] h1 em, [data-press-interior] h2 em {
text-shadow: 0 0 18px rgba(154,219,232,.42) !important;
}
/* ══════════════════════════════════════════════════════════════════════════
VISUAL MEDIA TEMPLATE · THEME_VER 202 · sitewide token base
Source of truth: homepage (index.html) ice-lake glass + Flux/LTX stills.
Use these classes on every investigation board / chart page instead of
page-local soup. Interior pages respect design-lock (flat mono glass).
Home (no press-interior) keeps full blur + white glint.
HTML skeleton:
══════════════════════════════════════════════════════════════════════════ */
/* Grids */
.media-grid{
display:grid;gap:var(--media-gap);margin:2.2em 0 2.8em
}
.media-grid-1{grid-template-columns:1fr}
.media-grid-2{grid-template-columns:1fr 1fr}
.media-grid-3{grid-template-columns:repeat(3,1fr)}
.media-grid-4{grid-template-columns:repeat(4,1fr)}
@media(max-width:1100px){
.media-grid-4{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:900px){
.media-grid-3{grid-template-columns:1fr 1fr}
}
@media(max-width:820px){
.media-grid-2,.media-grid-3,.media-grid-4{grid-template-columns:1fr}
}
/* Card shell — home .glass language */
.media-card,
article.media-card,
figure.media-card{
margin:0;padding:0;overflow:hidden;display:flex;flex-direction:column;
position:relative;border-radius:var(--media-radius);
border:var(--media-border);
background:var(--media-pane);
box-shadow:var(--media-shadow);
transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease;
text-decoration:none;color:inherit
}
/* Home-only full optics (homepage is not press-interior) */
html:not([data-press-interior]) .media-card.glass,
body:not(.press-interior) .media-card.glass{
backdrop-filter:var(--media-blur);-webkit-backdrop-filter:var(--media-blur)
}
html:not([data-press-interior]) .media-card.glass::before,
body:not(.press-interior) .media-card.glass::before{
content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:0;
background:var(--media-glint)
}
.media-card:hover{
transform:translateY(-3px);border:var(--media-border-hot);
box-shadow:var(--media-shadow-hot)
}
/* Interiors: design-lock flattens glass; keep structure, quiet lift */
body.press-interior .media-card,
[data-press-interior] .media-card{
background:rgba(255,255,255,.02);
box-shadow:none;border-color:rgba(255,255,255,.1)
}
body.press-interior .media-card:hover,
[data-press-interior] .media-card:hover{
background:rgba(255,255,255,.035);border-color:rgba(255,255,255,.22);
box-shadow:none;transform:translateY(-2px)
}
/* Frame (image / video) */
.media-frame{
position:relative;overflow:hidden;background:var(--ink);
border-bottom:1px solid rgba(154,219,232,.1);line-height:0;aspect-ratio:var(--media-aspect-still);
min-height:180px
}
.media-frame.is-cine,
.media-card.is-cine .media-frame{aspect-ratio:var(--media-aspect-cine)}
/* Absolute fill — % height on