/* ===========================================================================
   销售 AI · Spacing & sizing tokens
   A loosely 2px-based scale. Mobile screens use generous 24–30px gutters;
   the marketing page steps up to 64–72px.
   =========================================================================== */
:root {
  /* ---- Space scale ------------------------------------------------------ */
  --space-1: 4px;
  --space-2: 6px;
  --space-3: 8px;
  --space-4: 10px;
  --space-5: 12px;
  --space-6: 14px;
  --space-7: 16px;
  --space-8: 18px;
  --space-9: 20px;
  --space-10: 22px;
  --space-11: 24px;
  --space-12: 26px;
  --space-14: 30px;
  --space-16: 34px;
  --space-20: 44px;
  --space-24: 56px;
  --space-28: 64px;
  --space-32: 72px;

  /* ---- Semantic gutters ------------------------------------------------- */
  --gutter-screen: 26px;     /* default mobile screen side padding          */
  --gutter-card: 22px;       /* inside cards / sheets                       */
  --gutter-page: 72px;       /* desktop marketing page                      */

  /* ---- Control heights -------------------------------------------------- */
  --control-primary: 58px;   /* primary CTA button                          */
  --control-secondary: 50px; /* secondary / outline button                  */
  --control-compact: 44px;   /* min touch target                           */
  --icon-chip: 38px;         /* nav / header icon button                    */
  --record-button: 78px;     /* main record control                         */

  /* ---- Device frame ----------------------------------------------------- */
  --phone-w: 380px;
  --phone-h: 800px;
  --phone-bezel: 7px;
  --notch-w: 116px;
  --notch-h: 30px;
}