/* Origin Financial — radii, borders, the single shadow, the two gradients, blur. */
:root {
  --radius-lg: 8px;
  --radius-xl: 12px;
  --radius-2xl: 16px;
  --radius-3xl: 24px;
  --radius-3xl-2: 30px;
  --radius-full: 1440px;
  --radius-full-2: 9999px;

  /* Named radii — use these, not the raw steps */
  --radius-buttons: 8px;
  --radius-inputs: 8px;
  --radius-navitems: 8px;
  --radius-cards: 16px;
  --radius-statblocks: 16px;
  --radius-featurecards: 30px;
  --radius-categorytiles: 30px;
  --radius-pillbuttons: 9999px;

  /* Borders — hairline only, always white alpha on dark */
  --border-hairline: 1px solid rgba(255, 255, 255, 0.1); /* @kind other */
  --border-glass: 1px solid rgba(255, 255, 255, 0.15); /* @kind other */
  --border-solid-white: 1px solid #ffffff; /* @kind other */

  /* Elevation: the system has exactly one shadow, used on a single button.
     Depth is otherwise expressed by surface color steps. */
  --shadow-lg: rgba(0, 0, 0, 0.2) 0px 18px 20px 0px;

  /* The only two legitimate gradients */
  --gradient-dark-chrome: linear-gradient(135deg, rgb(43, 43, 44), rgb(19, 19, 19)); /* @kind other */
  --gradient-sky-atmosphere: linear-gradient(rgb(15, 16, 17), rgb(19, 29, 39) 18%, rgb(26, 71, 136) 37%, rgb(64, 138, 193) 69%, rgb(64, 138, 193) 102%); /* @kind other */

  /* Glassmorphism — nav bar only */
  --blur-nav: blur(24px); /* @kind other */
}