/* 1080 × 1350 geometry (4:5). Everything is a multiple of 24. */
:root {
  --space-1: 8px;
  --space-2: 16px;
  --space-3: 24px;
  --space-4: 36px;
  --space-5: 48px;
  --space-6: 72px;
  --space-7: 96px;
  --space-8: 144px;

  /* Frame + platform safe areas (4:5) */
  --frame-w: 1080px;
  --frame-h: 1350px;
  --safe-side: 96px;    /* both edges */
  --safe-top: 160px;    /* clears account handle / feed chrome */
  --safe-bottom: 300px; /* clears auto-captions, action rail, progress bar */

  /* Where each role lives vertically */
  --caption-band-bottom: 300px;  /* narration block sits on this line (y=1050) */
  --record-band-top: 184px;      /* metadata labels hang from here */
}