/* ============================================================
   銀星創意 — Spacing, radius, shadow & layout tokens
   4px base unit. Restrained radii: buttons/fields 8px, cards
   12px, shell 20px. Soft two-layer shadows, silver-cool tint.
   ============================================================ */

:root {
  /* ---- Spacing scale (4px base) ---- */
  --space-1:  4px;
  --space-2:  8px;
  --space-3:  12px;
  --space-4:  16px;
  --space-5:  20px;   /* default gap between dashboard blocks */
  --space-6:  24px;   /* card padding */
  --space-7:  28px;   /* shell padding */
  --space-8:  40px;
  --space-10: 48px;
  --space-12: 60px;
  --space-16: 80px;

  /* ---- Radius ---- */
  --radius-sm:   6px;    /* chips, small controls */
  --radius-def:  8px;    /* buttons, fields */
  --radius-med:  12px;   /* cards */
  --radius-lg:   20px;   /* app shell / drawers / dialogs */
  --radius-full: 999px;  /* pills, avatars */

  /* ---- Border widths ---- */
  --border-thin: 1px;
  --border-med:  2px;

  /* ---- Elevation / shadows (cool silver-navy tint) ---- */
  /* Hairline-adjacent resting block */
  --shadow-20: 0 1px 2px rgba(16, 27, 44, 0.05);
  /* Standard card */
  --shadow-card: 0 1px 2px rgba(16, 27, 44, 0.05),
                 0 10px 28px -18px rgba(16, 27, 44, 0.16);
  /* Raised: menus, popovers, floating panels */
  --shadow-40: 0 2px 4px rgba(16, 27, 44, 0.06),
               0 14px 36px -14px rgba(16, 27, 44, 0.22);
  /* Overlay: dialogs */
  --shadow-60: 0 28px 60px -24px rgba(16, 27, 44, 0.35);
  /* Inset hairline (table cells / tree) */
  --shadow-inset: inset 0 0 0 1px rgba(15, 27, 44, 0.06);
  /* Gold CTA glow */
  --shadow-gold: 0 6px 16px -8px rgba(180, 116, 15, 0.55);

  /* ---- Focus ring — 2px surface gap + 2px gold, ≥3:1 ✓ ---- */
  --focus-ring: 0 0 0 2px var(--sys-surface-card),
                0 0 0 4px var(--sys-accent-strong);

  /* ---- Layout dimensions ---- */
  --sidebar-w:           280px;
  --sidebar-collapsed-w: 76px;
  --control-h:           44px;   /* top-bar controls (AA hit target) */
  --field-h:             44px;   /* form inputs */
  --content-pad:         28px;
}
