/* Source of truth: ../../design-system/goblog-cinematic/MASTER.md */
:root {
  color-scheme: dark;
  --color-reading-bg: #111b1d;
  --color-reading-text: #ccd5d1;
  --color-reading-highlight: rgba(158, 216, 189, .065);
  --color-bg: #090b0f;
  --color-surface: #121c21;
  --color-panel: rgba(12, 21, 25, .92);
  --color-text: #f3f6f5;
  --color-muted: #b4c3be;
  --color-accent: #9ed8bd;
  --color-on-accent: #10261d;
  --color-border: #62786e;
  --color-line: rgba(180, 195, 190, .22);
  --color-error: #ffb4ab;
  --color-focus: #c7f7de;
  --text: var(--color-text);
  --muted: var(--color-muted);
  --panel: var(--color-panel);
  --panel-strong: var(--color-surface);
  --stroke: var(--color-line);
  --font-sans: 'Noto Sans SC', 'PingFang SC', 'Microsoft YaHei', system-ui, sans-serif;
  --font-display: 'Noto Serif SC', 'Songti SC', 'STSong', 'SimSun', serif;
  --font-mono: 'SFMono-Regular', Consolas, monospace;
  --text-xs: .75rem;
  --text-sm: .875rem;
  --text-base: 1rem;
  --text-lg: 1.125rem;
  --text-card: 1.375rem;
  --text-section: clamp(2rem, 4.5vw, 3.5rem);
  --text-hero: clamp(2.25rem, 5vw, 4.5rem);
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-6: 24px;
  --space-8: 32px;
  --space-12: 48px;
  --space-16: 64px;
  --space-24: 96px;
  --page-gutter: 64px;
  --radius-control: 12px;
  --radius-card: 24px;
  --radius-pill: 999px;
  --shadow-panel: 0 20px 60px rgba(0, 0, 0, .3);
  --duration-fast: 160ms;
  --duration-normal: 240ms;
  --duration-scene: 640ms;
  --ease-cinema: cubic-bezier(.7, 0, .16, 1);
  --transition-ms: var(--duration-scene);
  --z-nav: 30;
  --z-overlay: 80;
  --z-intro: 100;
}
@media (min-width: 1440px) { :root { --page-gutter: max(64px, calc((100vw - 1312px) / 2)); } }
@media (max-width: 1023px) { :root { --page-gutter: 32px; } }
@media (max-width: 639px) { :root { --page-gutter: 16px; } }