:root{
/* Corners are square. The only round things in this brand are drawn by hand. */
--radius-none:0px;
--radius-pill:999px;

/* Borders are 1px hairline rules, ink on light / white on dark. */
--border-width:1px;
--border-none:var(--border-width) solid transparent;  /* holds a control's size when it has no rule */
--border-hairline:var(--border-width) solid var(--line-ink);
--border-soft:var(--border-width) solid var(--line-hairline);
--border-on-dark:var(--border-width) solid var(--line-on-dark);
--border-on-dark-soft:var(--border-width) solid var(--line-on-dark-soft);

/* A mask stencil, not a brand colour: in a mask, opaque means "keep this pixel". */
--mask-keep:#000;

/* Focus ring geometry — see --focus-ring / --focus-ring-halo in colors.css. */
--focus-ring-width:2px;

/* --- interaction opacity ---
   One value for "this is being hovered", one for "this is not available". Four
   different numbers used to be spread across the components; a fifth component
   would have invented a fifth. If a hover needs a tint rather than a dimming,
   use --state-hover-* from colors.css instead. */
--opacity-full:1;
--opacity-hover:.72;
--opacity-disabled:.35;

/* No drop shadows anywhere in the brand. Elevation is done with flat panels. */
--shadow-none:none;

/* Unused, and deliberately so. Do not reach for this to darken the sky band: it was
   tried and it leaves a hard horizontal edge where the band ends and the sky carries
   on. Read the note on .band--sky in components.css before using it anywhere. */
--overlay-photo-scrim:linear-gradient(180deg,rgba(35,31,32,0) 0%,rgba(35,31,32,.35) 100%);

/* Motion: slow, plain fades. Nothing bounces. */
--ease-brand:cubic-bezier(.4,0,.2,1);
--ease-linear:linear;
--dur-fast:120ms;
--dur-base:220ms;
--dur-slow:600ms;
--dur-tick:1000ms;   /* one second of playback on the progress rail */
--dur-rotate:24s;    /* Heartakreis mark, one full rotation */

/* The standing photograph is a position:fixed layer, not background-attachment:fixed
   — iOS Safari ignores that property. See #backdrop in css/base.css. */
}
