:root {
  --ui-density-padding: 1;
}

html[data-ui-width='contained'] {
  --shell-width: 1240px;
  --shell-gutter: 28px;
}

html[data-ui-width='wide'] {
  --shell-width: 90%;
  --shell-gutter: 28px;
}

html[data-ui-width='full'] {
  --shell-width: 100%;
  --shell-gutter: 0px;
}

html[data-ui-radius='soft'] {
  --radius: 10px;
  --radius-sm: 8px;
  --radius-xs: 4px;
}

html[data-ui-radius='square'] {
  --radius: 0px;
  --radius-sm: 0px;
  --radius-xs: 0px;
}

html[data-ui-size='small'] {
  font-size: 15px;
}

html[data-ui-size='medium'] {
  font-size: 16px;
}

html[data-ui-size='large'] {
  font-size: 18px;
}

html[data-ui-density='compact'] {
  --ui-density-padding: 0.78;
}

html[data-ui-density='spacious'] {
  --ui-density-padding: 1.18;
}

html[data-ui-shadow='none'] {
  --shadow: none;
}

html[data-ui-shadow='strong'] {
  --shadow: 0 28px 80px color-mix(in srgb, var(--ink) 20%, transparent);
}

html[data-ui-border='none'] {
  --border: transparent;
}

html[data-ui-border='strong'] {
  --border: color-mix(in srgb, var(--ink) 28%, transparent);
}

html[data-ui-type='system'] {
  --display-font: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --body-font: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

html[data-ui-type='modern'] {
  --display-font: "Avenir Next", "Segoe UI", "Trebuchet MS", sans-serif;
  --body-font: "Avenir Next", "Segoe UI", "Trebuchet MS", sans-serif;
}

html[data-ui-type='editorial'] {
  --display-font: Georgia, "Iowan Old Style", "Palatino Linotype", serif;
  --body-font: "Avenir Next", "Segoe UI", "Trebuchet MS", sans-serif;
}

html[data-ui-type='technical'] {
  --display-font: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
  --body-font: "Segoe UI", system-ui, sans-serif;
}

html[data-ui-density='compact'] :is(.site-header, .site-footer, .hero, .archive-hero, .article, .card, .hero-panel, .feature-card, .admin-hero, .admin-card, .admin-table-card, .timeline-item, .timeline-pinned, .forum-post, .messages-panel, .profile-card) {
  padding-block: 16px;
}

html[data-ui-density='spacious'] :is(.site-header, .site-footer, .hero, .archive-hero, .article, .card, .hero-panel, .feature-card, .admin-hero, .admin-card, .admin-table-card, .timeline-item, .timeline-pinned, .forum-post, .messages-panel, .profile-card) {
  padding-block: 30px;
}

html[data-ui-radius='square'] :is(button, input, textarea, select, .site-header, .site-footer, .hero, .archive-hero, .article, .card, .hero-panel, .feature-card, .auth-button, .auth-status, .action-link, .admin-action, .admin-action-link, .admin-pill, .timeline-item, .timeline-pinned, .timeline-gate, .timeline-empty, .forum-post, .forum-table, .messages-panel, .messages-app__header, .messages-app__panel, .profile-card, .profile-container img) {
  border-radius: 0;
}

html[data-ui-header='compact'] .site-header,
html[data-ui-header='compact'] .site-footer {
  padding-block: 12px;
}

html[data-ui-header='compact'] .brand-mark {
  width: 38px;
  height: 38px;
}

html[data-ui-header='sticky'] .site-header {
  position: sticky;
  top: max(10px, env(safe-area-inset-top));
  z-index: 20;
}

html[data-ui-header='minimal'] .site-header {
  padding-inline: 0;
  background: transparent;
  border-top: 0;
  border-right: 0;
  border-left: 0;
  box-shadow: none;
  backdrop-filter: none;
}

html[data-ui-header='minimal'] .site-footer {
  background: transparent;
  border-right: 0;
  border-bottom: 0;
  border-left: 0;
  box-shadow: none;
}

html[data-ui-surface='flat'] :is(.site-header, .site-footer, .hero, .archive-hero, .article, .card, .hero-panel, .feature-card, .admin-hero, .admin-card, .admin-table-card, .timeline-item, .timeline-pinned, .timeline-gate, .timeline-empty, .forum-post, .forum-table, .messages-panel, .messages-app__header, .messages-app__panel, .profile-card) {
  box-shadow: none;
}

html[data-ui-surface='flat'] :is(.hero, .archive-hero, .article, .hero-panel, .admin-hero) {
  background: color-mix(in srgb, var(--surface) 84%, var(--bg) 16%);
}

html[data-ui-surface='bordered'] :is(.site-header, .site-footer, .hero, .archive-hero, .article, .card, .hero-panel, .feature-card, .admin-hero, .admin-card, .admin-table-card, .timeline-item, .timeline-pinned, .timeline-gate, .timeline-empty, .forum-post, .forum-table, .messages-panel, .messages-app__header, .messages-app__panel, .profile-card) {
  border-color: color-mix(in srgb, var(--ink) 30%, transparent);
  box-shadow: none;
}

html[data-ui-button='outline'] :is(.auth-button, .action-link, .admin-action) {
  border: 1px solid var(--accent-strong);
  background: transparent;
  color: var(--accent-strong);
}

html[data-ui-button='outline'] :is(.auth-button--secondary, .action-link--secondary, .admin-action.is-secondary) {
  border-color: var(--border);
  background: transparent;
  color: var(--ink);
}

html[data-ui-button='flat'] :is(.auth-button, .action-link, .admin-action) {
  border: 0;
  background: color-mix(in srgb, var(--accent) 16%, transparent);
  color: var(--accent-strong);
  box-shadow: none;
}

html[data-ui-button='flat'] :is(.auth-button--secondary, .action-link--secondary, .admin-action.is-secondary) {
  background: transparent;
}

html :is(button, input:not([type='checkbox']):not([type='radio']):not([type='hidden']), select, textarea, .auth-button, .auth-status, .action-link, .admin-action, .admin-action-link, .site-nav a, .footer-links a) {
  min-height: 44px;
}
