/* ============================================================
   SPACING, RADIUS, ELEVATION, SLIDE CANVAS
   The guidebook's visualization discipline applied to general
   technical slides. Canvas is 1920×1080 (16:9); content sits on
   a 12-column grid with generous margins. Spacing is an 8px system.
   ============================================================ */

:root {
  /* ---- Spacing scale (8px base; 4px half-step) ---- */
  --space-0:  0;
  --space-1:  4px;
  --space-2:  8px;
  --space-3:  12px;
  --space-4:  16px;
  --space-5:  20px;
  --space-6:  24px;
  --space-8:  32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;
  --space-20: 80px;

  /* ---- Radius ---- (restrained; government / data context) */
  --radius-none: 0;
  --radius-sm:   4px;   /* chips, inputs, small controls */
  --radius-md:   8px;   /* cards, panels */
  --radius-lg:   12px;  /* large surfaces */
  --radius-pill: 999px; /* tags, toggles */

  /* ---- Borders ---- */
  --border-width: 1px;        /* @kind spacing */
  --border-width-strong: 2px; /* @kind spacing */

  /* ---- Elevation ---- (subtle; no rich drop shadows per Do/Don't 4.5) */
  --shadow-none: none;
  --shadow-sm:  0 1px 2px rgba(16, 24, 64, 0.06);
  --shadow-md:  0 1px 3px rgba(16, 24, 64, 0.08), 0 1px 2px rgba(16, 24, 64, 0.04);
  --shadow-card: 0 1px 2px rgba(16, 24, 64, 0.06), 0 4px 12px rgba(16, 24, 64, 0.05);
  --shadow-pop: 0 8px 24px rgba(16, 24, 64, 0.12);

  /* ---- Focus ---- */
  --focus-width: 2px;  /* @kind spacing */
  --focus-offset: 2px; /* @kind spacing */

  /* ---- Slide canvas / grid ---- */
  --slide-w: 1920px; /* @kind other */
  --slide-h: 1080px; /* @kind other */
  --slide-cols: 12; /* @kind other */
  --slide-gap: var(--space-6);       /* @kind spacing */
  --slide-margin-x: 120px;           /* @kind spacing */
  --slide-margin-y: 90px;            /* @kind spacing */
  --slide-title-size: 64px;          /* @kind other */

  /* ---- Motion ---- (quiet; fades, no bounce; "待たせ過ぎない") */
  --ease-standard: cubic-bezier(0.2, 0, 0, 1); /* @kind other */
  --ease-out: cubic-bezier(0, 0, 0.2, 1);      /* @kind other */
  --dur-fast: 120ms; /* @kind other */
  --dur-base: 200ms; /* @kind other */
  --dur-slow: 320ms; /* @kind other */
}
