/* ============================================================
   Urban Passport — Effects: elevation, motion, focus.   "Daylight"
   Clean, COOL-neutral soft shadows (no warm/parchment tint, no
   grain, no emboss/deboss letterpress). Snappy, playful motion
   with a satisfying spring on the collect moment.
   ============================================================ */
:root {
  /* ---- Soft neutral elevation ---- */
  --shadow-sm:  0 1px 2px rgba(20, 21, 26, 0.06),
                0 1px 1px rgba(20, 21, 26, 0.04); /* @kind shadow */
  --shadow-md:  0 6px 18px rgba(20, 21, 26, 0.08),
                0 2px 5px rgba(20, 21, 26, 0.05); /* @kind shadow */
  --shadow-lg:  0 16px 40px rgba(20, 21, 26, 0.12),
                0 4px 10px rgba(20, 21, 26, 0.06); /* @kind shadow */
  --shadow-card: 0 10px 30px rgba(20, 21, 26, 0.14),
                 0 2px 6px rgba(20, 21, 26, 0.06); /* @kind shadow */
  --shadow-pop:  0 20px 50px rgba(20, 21, 26, 0.18),
                 0 6px 14px rgba(20, 21, 26, 0.08); /* @kind shadow */
  --shadow-sheet: 0 -8px 40px rgba(20, 21, 26, 0.12); /* @kind shadow */

  /* tinted glow for the brand CTA / collect moment */
  --shadow-brand: 0 8px 22px rgba(58, 102, 255, 0.34); /* @kind shadow */
  --shadow-collected: 0 8px 22px rgba(17, 163, 107, 0.30); /* @kind shadow */

  /* ---- Focus ring & hairlines ---- */
  --ring:        0 0 0 3px var(--blue-100); /* @kind shadow */
  --ring-strong: 0 0 0 3px rgba(58, 102, 255, 0.45); /* @kind shadow */
  --hairline-inset: inset 0 0 0 1px var(--border-hairline); /* @kind shadow */

  /* ---- Motion (snappy + a playful spring on collect) ---- */
  --ease-out:    cubic-bezier(0.16, 1, 0.3, 1); /* @kind other */
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1); /* @kind other */
  --ease-spring: cubic-bezier(0.34, 1.45, 0.5, 1); /* @kind other */
  --dur-fast:    130ms; /* @kind other */
  --dur-base:    220ms; /* @kind other */
  --dur-slow:    360ms; /* @kind other */
  --dur-collect: 480ms; /* @kind other */

  /* ---- Press feedback ---- */
  --press-scale: 0.97; /* @kind other */

  /* ---- LEGACY COMPAT (old "Atlas" effect names → clean values) ---- */
  --emboss-top: none; /* @kind other */
  --deboss: var(--hairline-inset); /* @kind shadow */
  --shadow-cover: var(--shadow-lg); /* @kind shadow */
  --ease-paper: var(--ease-out); /* @kind other */
  --ease-stamp: var(--ease-spring); /* @kind other */
  --dur-stamp: var(--dur-collect); /* @kind other */
  --tilt-a: 0deg; /* @kind other */
  --tilt-b: 0deg; /* @kind other */
  --tilt-seal: 0deg; /* @kind other */
}

/* ============================================================
   Reusable utilities (consumers may apply directly)
   ============================================================ */

/* Gold foil sheen — used ONLY on legendary cards / completed seals. */
.up-foil {
  background-image: linear-gradient(
    115deg,
    #C8901F 0%, #E7A93B 26%,
    #FBE3A6 48%, #E7A93B 70%, #C8901F 100%
  );
  background-size: 220% 100%;
}

/* Clean hairline frame for flat cards. */
.up-hairline { box-shadow: var(--hairline-inset); }