:root{
  /* radii — paper is almost square; only tabs and stickers round */
  --radius-none:0;
  --radius-xs:2px;
  --radius-sm:4px;
  --radius-md:8px;
  --radius-tab:8px 8px 0 0;
  --radius-pill:999px;

  /* borders */
  --border-thin:1px solid var(--border-hairline); /* @kind other */
  --border-ruled:1px solid rgba(80,50,40,.14); /* @kind other */
  --border-ink-1:1px solid var(--border-ink); /* @kind other */
  --border-ink-2:2px solid var(--border-ink); /* @kind other */

  /* shadows — paper lifting off paper, never glassy UI shadows */
  --shadow-lift-1:0 1px 2px rgba(80,50,40,.10);
  --shadow-lift-2:0 3px 8px rgba(80,50,40,.14);
  --shadow-lift-3:0 10px 26px rgba(80,50,40,.18);
  --shadow-pressed:inset 0 1px 3px rgba(80,50,40,.22);
  --shadow-photo:0 2px 3px rgba(80,50,40,.18),0 12px 28px rgba(80,50,40,.16);

  /* textures */
  --grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)' opacity='.35'/%3E%3C/svg%3E"); /* @kind other */
  --grain-opacity:.06; /* @kind other */
  --ruled-lines:repeating-linear-gradient(to bottom,transparent 0,transparent 27px,rgba(80,50,40,.14) 27px,rgba(80,50,40,.14) 28px); /* @kind other */

  /* rotations — everything is pinned by hand, nothing is square to the grid */
  --tilt-a:-1.4deg; /* @kind other */
  --tilt-b:1.1deg; /* @kind other */
  --tilt-c:-.6deg; /* @kind other */
}