/* ScamProfiler — Spacing, radius, borders, motion, effects
   Space is an active design element. Understanding requires distance.
   The grid is generous; nothing should ever feel crowded. */

:root {
  /* ── Spacing scale (8px base; 4px half-steps) ── */
  --space-0:   0;
  --space-1:   0.25rem;   /* 4 */
  --space-2:   0.5rem;    /* 8 */
  --space-3:   0.75rem;   /* 12 */
  --space-4:   1rem;      /* 16 */
  --space-5:   1.5rem;    /* 24 */
  --space-6:   2rem;      /* 32 */
  --space-7:   3rem;      /* 48 */
  --space-8:   4rem;      /* 64 */
  --space-9:   6rem;      /* 96 */
  --space-10:  8rem;      /* 128 — post / hero margins */

  /* Frame inset — distance of the red corner brackets from the edge. */
  --frame-inset: 4.5%;
  --frame-arm:   2.25rem;   /* length of each bracket arm */
  --frame-weight: 2px;      /* bracket / line stroke */

  /* ── Radius ── Corners are mostly hard. The brand is precise, not soft.
     Pills exist only for tags and the occasional control. */
  --radius-none:  0;
  --radius-xs:    2px;
  --radius-sm:    4px;
  --radius-md:    6px;
  --radius-pill:  999px;

  /* ── Borders ── */
  --border-width-hair: 1px;
  --border-width-bold: 2px;

  /* ── Motion ── Subtle. Reveal, shift, unfold. Never bounce. ──
     Custom easing: a calm, slightly-decelerated curve that "settles". */
  --ease-reveal:  cubic-bezier(0.22, 0.61, 0.36, 1); /* @kind other */
  --ease-shift:   cubic-bezier(0.4, 0, 0.2, 1); /* @kind other */
  --dur-fast:     140ms; /* @kind other */
  --dur-base:     240ms; /* @kind other */
  --dur-slow:     480ms; /* @kind other */
  --dur-reveal:   720ms; /* @kind other */  /* slow unfold of text / lines */

  /* ── Shadows & glows ──
     No soft "card" shadows on dark. Depth comes from the red glow only. */
  --shadow-none: none;
  --glow-signal:   0 0 24px -2px var(--sp-red-dim);
  --glow-signal-strong: 0 0 40px 0 var(--sp-red-dim), 0 0 12px 0 var(--sp-red-dim);
  --focus-ring:    0 0 0 2px var(--sp-black), 0 0 0 4px var(--sp-red);

  /* ── Layout ── */
  --container-narrow: 42rem;
  --container-base:   64rem;
  --container-wide:   80rem;
  --post-size:        clamp(320px, 92vmin, 1080px); /* square social canvas */
}