:root{
  /* corners: the brand is square. Pills exist only for controls and chips. */
  --radius-none:0px;
  --radius-xs:2px;
  --radius-sm:4px;
  --radius-pill:999px;
  --radius-control:var(--radius-pill);
  --radius-card:var(--radius-none);
  --radius-image:var(--radius-none);

  --border-w:1px; /* @kind spacing */
  --border-w-strong:1.5px; /* @kind spacing */
  --hairline:var(--border-w) solid var(--border-subtle);
  --hairline-strong:var(--border-w) solid var(--border-strong);

  /* elevation is deliberately near-absent; only floating layers cast light */
  --shadow-none:none;
  --shadow-hover:0 1px 0 var(--ink-0);
  --shadow-raised:0 1px 2px rgba(20,16,13,.04);
  --shadow-overlay:0 24px 60px -12px rgba(20,16,13,.22);
  --shadow-inset-image:inset 0 0 0 1px rgba(20,16,13,.04);

  --blur-scrim:saturate(120%) blur(14px); /* @kind other */
  --protection-gradient:linear-gradient(180deg,rgba(20,16,13,.38) 0%,rgba(20,16,13,0) 62%); /* @kind other */
  --protection-gradient-bottom:linear-gradient(0deg,rgba(20,16,13,.45) 0%,rgba(20,16,13,0) 58%); /* @kind other */

  --z-base:0; /* @kind other */
  --z-sticky:100; /* @kind other */
  --z-nav:200; /* @kind other */
  --z-overlay:300; /* @kind other */
  --z-dialog:400; /* @kind other */
  --z-toast:500; /* @kind other */
}