/* Declan brand tokens — web mode (Brand Guidelines v2.0.0 as approved 29 Oct 2026, BA-1/BA-11).
   Hex values are the locked v1.0.1 primitives; only their roles on the web change:
   white is the page, bone is the band, panels take the opposite paper to their band. */
:root {
  color-scheme: light;

  /* primitives */
  --c-white: #FFFFFF;
  --c-bone: #F5F2EC;
  --c-bone-deep: #ECE8E0;
  --c-rule: #DAD5CB;
  --c-rule-strong: #C4BFB4;
  --c-ink: #17181D;
  --c-ink-surface: #23252C;
  --c-ink-rule: #33363F;
  --c-ink-2: #3B3F4A;
  --c-ink-3: #676C78;
  --c-ink-text-2: #A6A9B3;
  --c-ink-muted: #8C909A;
  --c-cobalt: #2447E8;
  --c-cobalt-deep: #1A38C7;
  --c-cobalt-lift: #6B86FF;
  --c-verified: #1F8A5B;
  --c-verified-deep: #166A45;
  --c-verified-tint: #E3F3EA;
  --c-verified-lift: #3DBE7A;
  --c-attention: #C98A14;
  --c-attention-deep: #8F6008;
  --c-unresolved: #C63C3C;
  --c-unresolved-deep: #A32E2E;
  --c-unresolved-tint: #F9E3E3;

  /* semantic: web mode */
  --bg-page: var(--c-white);
  --bg-band: var(--c-bone);
  --bg-raised: var(--c-bone-deep);
  --bg-evidence: var(--c-ink);
  --border: var(--c-rule);
  --border-strong: var(--c-rule-strong);
  --text: var(--c-ink);
  --text-2: var(--c-ink-2);
  --text-3: var(--c-ink-3);
  --control: var(--c-cobalt);
  --control-hover: var(--c-cobalt-deep);
  --focus: var(--c-cobalt);
  --node-declan: var(--c-cobalt);

  /* type */
  --font-sans: "Archivo", "Helvetica Neue", Arial, sans-serif;
  --font-serif: "Newsreader", Georgia, "Times New Roman", serif;
  --font-mono: "IBM Plex Mono", Menlo, Consolas, monospace;

  --fs-display1: clamp(2.5rem, 1.55rem + 3.1vw, 4.25rem);
  --fs-display2: clamp(1.875rem, 1.35rem + 1.75vw, 3rem);
  --fs-h2: 1.375rem;
  --fs-h3: 1.125rem;
  --fs-body: 1.0625rem;
  --fs-record: 0.9375rem;
  --fs-small: 0.875rem;
  --fs-label: 0.75rem;
  --fs-data: 0.8125rem;
  --fs-owner: 1.25rem;

  /* space */
  --gutter: 32px;
  --section-pad: 128px;
  --content-max: 1120px;
  --text-max: 40rem;

  --radius-chip: 3px;
  --radius-control: 4px;
  --radius-panel: 6px;

  --motion-micro: 120ms;
  --motion-component: 160ms;
  --ease-out: cubic-bezier(0.2, 0, 0, 1);
}

@media (max-width: 767px) {
  :root { --gutter: 20px; --section-pad: 72px; }
}