/* UI glyphs share a square canvas and a consistent visible stroke. */
:root {
  --ui-icon-size: 20px;
  --ui-icon-stroke: 1.65;
}

svg.lucide {
  display: block;
  width: var(--ui-icon-size);
  height: var(--ui-icon-size);
  flex: 0 0 auto;
  stroke-width: var(--ui-icon-stroke);
  vertical-align: middle;
}

svg.lucide > * {
  vector-effect: non-scaling-stroke;
}

/* Dock controls use one size, including the account and space-edit icons. */
.dock-action-btn,
.space-dock-btn,
.space-edit-btn {
  --ui-icon-size: 20px;
  line-height: 1;
}

.group-action-btn {
  --ui-icon-size: 16px;
}

.fold-icon,
.custom-select-trigger-global > svg,
.space-tab-hint {
  --ui-icon-size: 14px;
}

.settings-nav-btn,
.settings-close-btn,
.space-icon-btn,
.select-option-icon {
  --ui-icon-size: 18px;
}

.stepper-btn,
.context-menu-item {
  --ui-icon-size: 16px;
}

.store-circle-check {
  --ui-icon-size: 12px;
}

.sync-choice {
  --ui-icon-size: 22px;
}

.sync-choice svg {
  margin-top: 0;
}

/* Raster favicons keep their own size settings and sit on the same baseline. */
.site-btn img,
.collapsed-icon-link img,
.search-result-item img,
.store-icon,
.search-engine-identity img,
.selected-content img,
.custom-option-global img {
  display: block;
  flex-shrink: 0;
  object-fit: contain;
}

.store-icon {
  width: 18px;
  height: 18px;
}

/* Keep option glyphs, closing controls and settings navigation on one baseline. */
.settings-nav-btn > svg.lucide,
.settings-close-btn > svg.lucide,
.space-icon-btn > svg.lucide,
svg.lucide.select-option-icon {
  width: 18px;
  height: 18px;
}

.custom-select-trigger-global > svg.lucide {
  width: 14px;
  height: 14px;
}

.context-menu-item > svg.lucide,
.stepper-btn > svg.lucide {
  width: 16px;
  height: 16px;
}

.welcome-mark { display: grid; place-items: center; }
.welcome-mark > svg.lucide { width: 40px; height: 40px; }

/* Info-page status colors follow their semantic container or existing marker. */
.feature-item svg.lucide { margin-top: 2px; }
.callout-box svg.lucide { flex-shrink: 0; }