:root{
  /* Radii — the product rounds generously; status/action pills are full */
  --radius-xs:4px;--radius-sm:8px;--radius-md:10px;--radius-lg:12px;
  --radius-xl:14px;--radius-2xl:16px;--radius-3xl:20px;--radius-pill:999px;
  --radius-dot:50%;
  --radius-sheet:22px;    /* bottom sheets, top corners only */
  --radius-avatar:50%;

  --border-hairline:1px solid var(--color-border);
  --border-rule:1px solid var(--color-rule);
  --border-rule-strong:1px solid var(--color-rule-strong);
  --border-selected:2px solid var(--color-text);

  /* Elevation: the app leans on soft, low shadows — not borders */
  --shadow-none:none;
  --shadow-card:0 1px 2px rgba(8,12,24,0.04),0 4px 14px rgba(8,12,24,0.05);
  --shadow-raised:0 6px 20px rgba(8,12,24,0.10);
  --shadow-sheet:0 -8px 34px rgba(8,12,24,0.18);
  --shadow-modal:0 24px 60px rgba(8,12,24,0.28);
  --shadow-brand:0 0 0 1px var(--color-brand),0 14px 30px rgba(216,142,18,0.16);
  --ring-focus:0 0 0 3px rgba(243,180,59,0.35);
  --ring-action:0 0 0 3px rgba(24,116,208,0.22);

  --gradient-hero:linear-gradient(135deg,#11162A 0%,#080C18 70%); /* @kind other */
  --gradient-gold:linear-gradient(135deg,#F7C45A,#D8920F); /* @kind other */
  --gradient-protect:linear-gradient(180deg,rgba(8,12,24,0) 0%,rgba(8,12,24,0.85) 100%); /* @kind other */
}