:root {
  /* Quiet: 1px hairline, 12px radius, no shadow. That's 90% of every screen. */
  --radius: 12px;
  --radius-sm: 8px;
  --radius-pill: 999px;
  --border-quiet: 1px solid var(--border-hairline);

  /* Loud: thick ink border. One such object per screen. */
  --border-loud: 2px solid var(--border-ink);
  --border-loud-thick: 3px solid var(--border-ink);
  --border-ig: 6px solid var(--border-ink);

  /* Sticker headline outline width, web vs Instagram. */
  --outline-sticker: 2px;
  --outline-sticker-ig: 6px;

  /* The only tilted things in the system: chip and photo. A degree and a half. */
  --tilt-chip: -1.5deg; /* @kind other */
  --tilt-photo: 1.5deg; /* @kind other */
}
