/* Website foundations; palette values mirror the app DesignSystem. */
/* Strata palette: light defaults and explicit/automatic dark resolution. */
:root {
  --ds-colour-bg-light: #f7f5f1;
  --ds-colour-surface-light: #fffcf8;
  --ds-colour-mist-light: #e6eaf0;
  --ds-colour-steel: #5b6d8a;
  --ds-colour-bronze-light: #8e7a67;
  --ds-colour-ink-light: #141821;
  --ds-colour-bg-dark: #141821;
  --ds-colour-surface-dark: #2b3442;
  --ds-colour-mist-dark: #3e4d62;
  --ds-colour-bronze-dark: #a6917d;
  --ds-colour-paper-dark: #fffcf8;
  --ds-colour-slate-soft: #556580;
  /* StrataBrandMarkSpec: logo fills are distinct from UI accent colours. */
  --c-brand-bar-1: rgba(255, 252, 248, 0.98);
  --c-brand-bar-2: var(--ds-colour-surface-light);
  --c-brand-bar-3: var(--ds-colour-mist-light);
  --c-brand-bronze: var(--ds-colour-bronze-light);
  --c-hub-title: var(--ds-colour-mist-dark);
  --c-method-surface: var(--ds-colour-mist-light);
  --c-colour-bg: var(--ds-colour-bg-light);
  --c-colour-bg-secondary: var(--ds-colour-surface-light);
  --c-colour-bg-tertiary: var(--ds-colour-mist-light);
  --c-colour-border: rgba(85, 101, 128, 0.22);
  --c-colour-border-medium: rgba(85, 101, 128, 0.34);
  --c-colour-border-strong: rgba(62, 77, 98, 0.46);
  --c-colour-accent: var(--ds-colour-steel);
  --c-colour-accent-soft: rgba(91, 109, 138, 0.13);
  --c-colour-bronze: var(--ds-colour-bronze-light);
  --c-colour-bronze-soft: rgba(142, 122, 103, 0.12);
  --c-colour-text: var(--ds-colour-ink-light);
  --c-colour-text-secondary: rgba(43, 52, 66, 0.88);
  --c-colour-text-tertiary: rgba(62, 77, 98, 0.76);
  --c-colour-visual-line: rgba(91, 109, 138, 0.92);
  --c-colour-visual-line-soft: rgba(91, 109, 138, 0.28);
  --c-colour-visual-bronze: rgba(142, 122, 103, 0.82);
}
html[data-resolved-theme="dark"] {
  --c-brand-bar-1: var(--ds-colour-surface-dark);
  --c-brand-bar-2: var(--ds-colour-mist-dark);
  --c-brand-bar-3: var(--ds-colour-slate-soft);
  --c-hub-title: var(--ds-colour-mist-light);
  --c-method-surface: var(--ds-colour-mist-dark);
  --c-colour-bg: var(--ds-colour-bg-dark);
  --c-colour-bg-secondary: var(--ds-colour-surface-dark);
  --c-colour-bg-tertiary: var(--ds-colour-mist-dark);
  --c-colour-border: rgba(85, 101, 128, 0.42);
  --c-colour-border-medium: rgba(85, 101, 128, 0.58);
  --c-colour-border-strong: rgba(230, 234, 240, 0.24);
  --c-colour-accent: var(--ds-colour-steel);
  --c-colour-accent-soft: rgba(91, 109, 138, 0.26);
  --c-colour-bronze: var(--ds-colour-bronze-dark);
  --c-colour-bronze-soft: rgba(166, 145, 125, 0.18);
  --c-colour-text: var(--ds-colour-paper-dark);
  --c-colour-text-secondary: rgba(230, 234, 240, 0.84);
  --c-colour-text-tertiary: rgba(230, 234, 240, 0.66);
  --c-colour-visual-line: rgba(230, 234, 240, 0.82);
  --c-colour-visual-line-soft: rgba(230, 234, 240, 0.18);
  --c-colour-visual-bronze: rgba(166, 145, 125, 0.80);
}
@media (prefers-color-scheme: dark) {
html:not([data-theme="warm"]):not([data-theme="dark"]) {
  --c-brand-bar-1: var(--ds-colour-surface-dark);
  --c-brand-bar-2: var(--ds-colour-mist-dark);
  --c-brand-bar-3: var(--ds-colour-slate-soft);
  --c-hub-title: var(--ds-colour-mist-light);
  --c-method-surface: var(--ds-colour-mist-dark);
  --c-colour-bg: var(--ds-colour-bg-dark);
  --c-colour-bg-secondary: var(--ds-colour-surface-dark);
  --c-colour-bg-tertiary: var(--ds-colour-mist-dark);
  --c-colour-border: rgba(85, 101, 128, 0.42);
  --c-colour-border-medium: rgba(85, 101, 128, 0.58);
  --c-colour-border-strong: rgba(230, 234, 240, 0.24);
  --c-colour-accent: var(--ds-colour-steel);
  --c-colour-accent-soft: rgba(91, 109, 138, 0.26);
  --c-colour-bronze: var(--ds-colour-bronze-dark);
  --c-colour-bronze-soft: rgba(166, 145, 125, 0.18);
  --c-colour-text: var(--ds-colour-paper-dark);
  --c-colour-text-secondary: rgba(230, 234, 240, 0.84);
  --c-colour-text-tertiary: rgba(230, 234, 240, 0.66);
  --c-colour-visual-line: rgba(230, 234, 240, 0.82);
  --c-colour-visual-line-soft: rgba(230, 234, 240, 0.18);
  --c-colour-visual-bronze: rgba(166, 145, 125, 0.80);
}
}

:root {
  --ink: #141821; --slate-deep: #2b3442; --slate-mid: #3e4d62; --slate-soft: #556580;
  --bronze: #8e7a67; --paper: #f7f5f1; --warm-surface: #fffcf8; --mist: #e6eaf0; --steel: #5b6d8a;
  --site-bg: var(--c-colour-bg); --site-surface: var(--c-colour-bg-secondary); --site-surface-alt: var(--c-colour-bg-tertiary);
  --site-text: var(--c-colour-text); --site-secondary: var(--c-colour-text-secondary); --site-muted: var(--c-colour-text-tertiary);
  --site-border: var(--c-colour-border-medium); --site-focus: var(--c-colour-text);
  --site-bronze-wash: var(--c-colour-bronze-soft); --site-slate-wash: var(--c-colour-accent-soft);
  --text-dark: var(--site-text); --text-mid: var(--site-secondary); --text-light: var(--site-secondary); --text-faint: var(--site-muted);
  --border-dark: var(--site-border); --border-light: var(--site-border); --shadow-soft: none; --shadow-deep: none;
  --radius-card: 20px; --radius-pill: 12px; --content-width: 1160px;
  --font-sans: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', 'Microsoft YaHei', sans-serif;
  --font-display: 'Plus Jakarta Sans', var(--font-sans);
  --site-control-height: 44px; --site-space-small: 8px; --site-space-medium: 24px; --site-space-section: 64px;
}
html { color-scheme: light dark; }
html[data-resolved-theme="warm"] { color-scheme: light; }
html[data-resolved-theme="dark"] { color-scheme: dark; }
:lang(zh-Hans) { line-break: auto; word-break: normal; }
.theme-control-slot { margin-left: auto; flex: none; }
.theme-segment { display: inline-grid; grid-template-columns: repeat(3,minmax(44px,auto)); }
.theme-segment-button { min-width: 44px; min-height: 44px; padding: 0 4px; border: 0; border-radius: 0; background: transparent; font: 500 .75rem var(--font-sans); color: var(--site-secondary); cursor: pointer; }
.theme-segment-button.is-active { box-shadow: inset 0 -2px var(--c-colour-bronze); color: var(--site-text); font-weight: 600; }
.theme-segment-button:hover { background: var(--site-slate-wash); }
.theme-segment-button:focus-visible { outline: 2px solid var(--site-focus); outline-offset: 3px; }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; } }

@media (prefers-color-scheme: dark) {
html:not([data-resolved-theme]) {
  --c-brand-bar-1: var(--ds-colour-surface-dark);
  --c-brand-bar-2: var(--ds-colour-mist-dark);
  --c-brand-bar-3: var(--ds-colour-slate-soft);
  --c-hub-title: var(--ds-colour-mist-light);
  --c-method-surface: var(--ds-colour-mist-dark);
  --c-colour-bg: var(--ds-colour-bg-dark);
  --c-colour-bg-secondary: var(--ds-colour-surface-dark);
  --c-colour-bg-tertiary: var(--ds-colour-mist-dark);
  --c-colour-border: rgba(85, 101, 128, 0.42);
  --c-colour-border-medium: rgba(85, 101, 128, 0.58);
  --c-colour-border-strong: rgba(230, 234, 240, 0.24);
  --c-colour-accent: var(--ds-colour-steel);
  --c-colour-accent-soft: rgba(91, 109, 138, 0.26);
  --c-colour-bronze: var(--ds-colour-bronze-dark);
  --c-colour-bronze-soft: rgba(166, 145, 125, 0.18);
  --c-colour-text: var(--ds-colour-paper-dark);
  --c-colour-text-secondary: rgba(230, 234, 240, 0.84);
  --c-colour-text-tertiary: rgba(230, 234, 240, 0.66);
  --c-colour-visual-line: rgba(230, 234, 240, 0.82);
  --c-colour-visual-line-soft: rgba(230, 234, 240, 0.18);
  --c-colour-visual-bronze: rgba(166, 145, 125, 0.80);
}
}

[hidden] { display: none !important; }
button:disabled, input:disabled { cursor: default; }
.language-links { display: flex; flex-wrap: wrap; gap: 8px 16px; }
.language-links a { display: inline-flex; align-items: center; min-height: 44px; }