:root {
  --control-capsule-radius: 999px;
  --control-surface-radius: 1.5rem;
  --control-min-target: 44px;
  --control-focus-colour: #d9f99d;
  --control-focus-width: 2px;
}

/* Compact navigation and action controls. */
:where(
  .skip-link,
  button,
  .site-header nav > a[href="/about/"],
  .site-header nav .nav-contact,
  .site-header .nav-garden,
  .site-search button,
  .site-search-close,
  .nav-garden-toggle,
  .site-header .nav-garden-children a,
  .post-actions .text-link,
  .story-trail .story-trail-technical,
  .button,
  .lab-crumbs a,
  .lab-jump a,
  .software-chooser a,
  .software-download,
  .scaffold-software-links a,
  .module-quick-nav a,
  .outcome-jump a,
  .reading-route a,
  .paper-tags a,
  .profile-links a,
  .kb-jump a,
  .hub-route-main,
  .year-navigation a,
  .site-search-results a
) {
  min-width: var(--control-min-target) !important;
  min-height: var(--control-min-target) !important;
  border-radius: var(--control-capsule-radius) !important;
}

/* Multi-line CTA surfaces keep their hierarchy while gaining pill-box corners. */
:where(
  .collection-nav a,
  .technical-note-card,
  .story-card-link,
  .garden-link,
  .theme-methods,
  .thesis-jump-nav a,
  .resource-grid > a,
  .method-note-links a,
  .n85-jump-nav a,
  .phase-links a,
  .official-links a,
  .hub-link-list li > a,
  .hub-desk-card,
  .first-contact-cta > a,
  .manual-bridge > a,
  .onramp-steps a,
  .manual-path a,
  .route-map a,
  .route-book,
  .lab-page .scaffold-next,
  .lab-nav a,
  .journey-stage > a,
  summary,
  .self-check-list summary,
  .stage-self-check summary,
  .go-deeper > summary,
  .software-block > summary,
  .optional-models > summary
) {
  min-height: var(--control-min-target) !important;
  border-radius: var(--control-surface-radius) !important;
}

/* Supporting wrappers only where a clickable surface fills the box. */
:where(
  .story-card,
  .self-check-list details,
  details.stage-self-check,
  .stage-self-check details,
  details.go-deeper,
  details.software-block,
  details.optional-models
) {
  border-radius: var(--control-surface-radius);
}

.story-card {
  overflow: hidden;
}

/* Give formerly partitioned controls enough air for their rounded shape. */
:where(
  .collection-nav,
  .thesis-jump-nav,
  .n85-jump-nav,
  .phase-links,
  .official-links,
  .year-navigation,
  .route-map,
  .module-quick-nav,
  .onramp-steps,
  .technical-note-grid
) {
  gap: 0.4rem;
  background: transparent;
}

.site-search {
  gap: 0.35rem;
}

.site-search input {
  min-height: var(--control-min-target);
  border-radius: var(--control-capsule-radius);
}

.nav-garden-arrow,
.nav-garden-toggle {
  width: var(--control-min-target);
  height: var(--control-min-target);
}

.site-header .nav-garden-children {
  gap: 0.25rem;
}

.site-header .nav-garden-children a {
  border-bottom: 0;
}

.maplibregl-ctrl-group button,
.maplibregl-ctrl-attrib-button {
  min-width: var(--control-min-target);
  min-height: var(--control-min-target);
  border-radius: var(--control-capsule-radius) !important;
}

:where(
  .skip-link,
  button,
  .site-header .nav-garden,
  .site-header nav > a[href="/about/"],
  .site-header nav .nav-contact,
  .site-search button,
  .site-search-close,
  .nav-garden-toggle,
  .site-header .nav-garden-children a,
  .post-actions .text-link,
  .story-trail .story-trail-technical,
  .button,
  .collection-nav a,
  .technical-note-card,
  .story-card-link,
  .garden-link,
  .theme-methods,
  .thesis-jump-nav a,
  .resource-grid > a,
  .method-note-links a,
  .n85-jump-nav a,
  .phase-links a,
  .official-links a,
  .hub-link-list li > a,
  .hub-desk-card,
  .first-contact-cta > a,
  .manual-bridge > a,
  .lab-crumbs a,
  .lab-jump a,
  .software-chooser a,
  .software-download,
  .scaffold-software-links a,
  .module-quick-nav a,
  .outcome-jump a,
  .reading-route a,
  .paper-tags a,
  .profile-links a,
  .kb-jump a,
  .hub-route-main,
  .year-navigation a,
  .onramp-steps a,
  .manual-path a,
  .route-map a,
  .route-book,
  .lab-page .scaffold-next,
  .lab-nav a,
  .journey-stage > a,
  summary,
  .site-search-results a,
  .self-check-list summary,
  .stage-self-check summary,
  .go-deeper > summary,
  .software-block > summary,
  .optional-models > summary,
  .maplibregl-ctrl-group button,
  .maplibregl-ctrl-attrib-button
):focus-visible {
  outline: var(--control-focus-width) solid var(--control-focus-colour) !important;
  outline-offset: 3px;
}

@media (max-width: 780px) {
  .site-header nav > a[href="/about/"],
  .site-header nav .nav-contact,
  .site-search button {
    width: 4.75rem;
    min-height: var(--control-min-target);
  }
}