/* FOUR tiers, plus capsule.

   Pick by WHAT THE SURFACE IS, not by size:
     chip     a small label or tag sitting on top of something
     panel    an inner surface — an image, a field, a sub-section of a card
     card     the outer container that holds other things
     capsule  anything pill-shaped: buttons, badges, tabs, the toolbar */
:root{
  --radius-chip:6px;
  --radius-panel:12px;
  --radius-card:16px;
  --radius-capsule:999px;
}