/* =============================================================================
   KINKO DESIGN SYSTEM — Card Component
   General-purpose surface container: white bg, 1px border, 12px radius, shadow.
   Spec: components/card.md
   Figma: node 2384:67964 (Cards page)
   ============================================================================= */

/* ── 1. Component tokens — aliases to semantic tokens ─────────────────────── */
:root {
  --card-bg:     var(--surface-default);  /* white card surface */
  --card-border: var(--border-default);   /* grey-200 border stroke */
  --card-shadow: var(--shadow-low);       /* 0 1px 2px rgba(0,0,0,0.06) subtle lift */
}

/* ── 2. Card container ────────────────────────────────────────────────────── */
.card {
  background: var(--card-bg);
  border: var(--border-width-small) solid var(--card-border);
  border-radius: var(--radius-12);
  padding: var(--spacing-12);
  box-shadow: var(--card-shadow);
  overflow: hidden;
  position: relative;
}

/* ── 3. Content slot ──────────────────────────────────────────────────────── */
.card__slot {
  position: relative;
  width: 100%;
}