/* Shared semantic tokens layered on top of base.css.
   Page CSS may consume these values but must not redefine the app palette. */

:root {
  --app-content-wide: 1240px;
  --app-content-reading: 920px;
  --app-topbar-fixed-height: 68px;
  --app-topbar-height: var(--app-topbar-fixed-height);
  --app-topbar-min-height: var(--app-topbar-fixed-height);
  --app-page-gutter: clamp(16px, 3vw, 36px);
  --app-section-gap: var(--space-4);
  --surface-raised: var(--surface);
  --surface-subtle: var(--surface-alt);
  --surface-selected: var(--primary-soft);
  --border-default: var(--line);
  --border-emphasis: var(--line-strong);
  --text-secondary: var(--text-muted);
  --text-tertiary: var(--text-faint);
}