/* Mobile Square — Radius tokens
   The brand is "Square": geometry is confidently squared-off — moderate radii,
   never full pills except for chips/avatars. Sharp enough to feel engineered,
   soft enough to feel modern. */
:root {
  --radius-none: 0px;
  --radius-xs:  4px;
  --radius-sm:  8px;
  --radius-md:  12px;   /* buttons, inputs */
  --radius-lg:  16px;   /* small cards, chips-as-buttons */
  --radius-xl:  20px;   /* cards */
  --radius-2xl: 26px;   /* feature cards, media */
  --radius-3xl: 34px;   /* hero panels */
  --radius-full: 999px; /* chips, avatars, dots */

  /* Signature chamfer: clipped top-right corner echoing the logo's angular cuts.
     Apply as clip-path on hero panels / badges for the "Mobile Square" edge. */
  --chamfer-sm: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, 0 100%); /* @kind other */
  --chamfer-md: polygon(0 0, calc(100% - 18px) 0, 100% 18px, 100% 100%, 0 100%); /* @kind other */
  --chamfer-lg: polygon(0 0, calc(100% - 28px) 0, 100% 28px, 100% 100%, 0 100%); /* @kind other */

  --border-width: 1.5px; /* @kind other */
  --border-width-strong: 2px; /* @kind other */
}