/* Archory geometry. AGENTS.md is the contract; change shared roles here, not per page. */
:root {
  --ui-space-1: 4px;
  --ui-space-2: 8px;
  --ui-space-3: 12px;
  --ui-space-4: 16px;
  --ui-space-6: 24px;
  --ui-space-8: 32px;
  --ui-page-inset: var(--ui-space-6);
  --page-gutter: var(--ui-page-inset);
  --ui-section-gap: var(--ui-space-6);
  --ui-content-gap: var(--ui-space-4);
  --ui-control-gap: var(--ui-space-2);
  --ui-control-height: 36px;
  --ui-control-radius: 8px;
  --ui-control-inset: var(--ui-space-3);
  --ui-help-width: 360px;
  --ui-form-dialog-width: 640px;
  --ui-settings-card-min-width: 280px;
  --ui-settings-content-width: 720px;
  --ui-confirm-dialog-width: 480px;
  --ui-guide-width: 1040px;
  --ui-guide-height: 650px;
  --ui-guide-brand-width: 42%;
  --ui-guide-art-size: calc(var(--ui-guide-height) * 1.4);
  --ui-guide-inset: var(--ui-space-8);
  --ui-avatar-preview-size: 128px;
  --ui-avatar-editor-column: 160px;
  --ui-info-glyph-size: 20px;
  --ui-card-inset: var(--ui-space-4);
  --ui-leaf-radius: 12px;
  --ui-card-radius: calc(var(--ui-card-inset) + var(--ui-control-radius));
  --ui-surface-radius: calc(var(--ui-page-inset) + var(--ui-control-radius));
  --ui-dialog-radius: var(--ui-surface-radius);
  --ui-sidebar-inset: var(--ui-space-3);
  --ui-sidebar-radius: var(--ui-surface-radius);
  --ui-sidebar-control-radius: calc(var(--ui-sidebar-radius) - var(--ui-sidebar-inset));
  --ui-page-footer-height: 48px;
  --ui-sidebar-project-height: 56px;
  --ui-dialog-gutter: var(--ui-page-inset);
  --ui-dialog-chrome-compact-inset: var(--ui-space-2);
  --ui-dialog-title-description-gap: var(--ui-space-2);
  --ui-dialog-section-gap: var(--ui-space-4);
  --ui-field-content-gap: var(--ui-space-2);
  --ui-action-gap: var(--ui-control-gap);
  --ui-action-control-height: var(--ui-control-height);
  --ui-action-footer-height: calc(var(--ui-control-height) + var(--ui-dialog-gutter) + var(--ui-dialog-chrome-compact-inset));
  --ui-directory-card-height: 72px;
  --ui-navigation-min-height: 40px;
  --ui-resource-row-min-height: 48px;
  --ui-directory-width: 240px;
  --ui-file-directory-min-width: var(--ui-directory-width);
  --ui-file-directory-stack-height: 200px;
  --ui-file-document-height: 65vh;
  --ui-directory-card-radius: var(--ui-leaf-radius);
  --ui-directory-card-gap: var(--ui-space-3);
  --ui-idea-editor-height: 160px;
  --ui-directory-card-padding: var(--ui-space-3);
  --ui-directory-selected-bg: #f0f4ff;
  --ui-directory-selected-border: #a9bee9;
}
@media (max-width: 760px) {
  :root { --ui-page-inset: var(--ui-space-4); }
}