@layer foundation {
  *, *::before, *::after { box-sizing: border-box; }
  html { color-scheme: dark; scrollbar-color: var(--balaur-border-default) var(--balaur-surface-page); }
  html, body { width: 100%; height: 100%; margin: 0; overflow: hidden; }
  body {
    background: var(--balaur-surface-page);
    color: var(--balaur-content-on-dark);
    font: var(--balaur-text-sm)/1.45 var(--balaur-font-body);
    -webkit-font-smoothing: antialiased;
  }
  button, input, textarea, select { font: inherit; accent-color: var(--balaur-action-primary); }
  button { color: inherit; }
  :focus-visible { outline: 2px solid var(--balaur-border-focus); outline-offset: 2px; }
  ::selection { background: var(--balaur-action-primary); color: var(--balaur-content-on-paper); }

  @media (prefers-reduced-transparency: reduce) {
    :where(.topbar, .sidebar, .inspector, .today-view, .ai-panel) {
      background-image: none;
      backdrop-filter: none;
    }
  }
  @media (prefers-contrast: more) {
    :where(button, input, textarea, select, .canvas-node, .today-section, .settings-dialog, .ai-panel) {
      border-width: 2px;
    }
  }
  @media (forced-colors: active) {
    :focus-visible { outline-color: Highlight; }
    :where(.topbar, .sidebar, .inspector, .today-view, .ai-panel) { background-image: none; }
    :where(.canvas-node, .settings-dialog, .ai-panel, .today-section) {
      border-color: CanvasText;
      background: Canvas;
      color: CanvasText;
    }
    :where(.canvas-node.selected, .connection-handle, .task-check) { border-color: Highlight; }
    .nav-item.active::before { background: Highlight; box-shadow: none; }
    :where(.storage-state i, .save-state i) { background: CanvasText; box-shadow: none; }
    .edge.selected .edge-line { stroke: Highlight; }
    .selection-bearing { border: 2px solid Highlight; }
    .selection-bearing i { display: none; }
  }
}