/* =====================================================================
   PrivateDrop 2.0 — design tokens (single source of truth)
   Every 2.0 layer (header, board, panels, modals) reads these variables;
   no layer should hard-code its own graphite or gold any more.
   Skin cards keep their own palette (rarity / price yellow) on purpose.

   Surfaces  : one warm-neutral graphite ramp, darkest = page
   Accent    : warm gold — a highlight, not a fill; CTA is the only gold slab
   Geometry  : radius xs 6 · sm 8 · md 10 · lg 14 · xl 18
               spacing 4 / 8 / 12 / 16 / 20 / 24 / 32
               control heights 32 (phone) · 40 · 48
   ===================================================================== */
:root{
  /* surfaces */
  --pd2-bg:#0a0b0d;
  --pd2-chrome:#0c0d10;
  --pd2-s1:#121317;
  --pd2-s2:#16171b;
  --pd2-s3:#1c1d22;
  --pd2-s4:#24252b;
  --pd2-well:#0d0e11;
  --pd2-panel:linear-gradient(180deg,#16171b 0%,#121317 100%);
  --pd2-raised:linear-gradient(180deg,#1d1e23 0%,#17181c 100%);

  /* lines */
  --pd2-line:rgba(255,255,255,.06);
  --pd2-line-2:rgba(255,255,255,.1);
  --pd2-line-3:rgba(255,255,255,.16);
  --pd2-hi:inset 0 1px 0 rgba(255,255,255,.04);

  /* text */
  --pd2-text:#eceef1;
  --pd2-text-2:#a5a8af;
  --pd2-text-3:#72757c;
  --pd2-text-4:#4e5157;

  /* gold accent */
  --pd2-gold:#e8bd62;
  --pd2-gold-hi:#f6dc9b;
  --pd2-gold-lo:#b6873e;
  --pd2-gold-rgb:232 189 98;
  --pd2-gold-text:linear-gradient(180deg,#f8e2a8 0%,#e8bd62 55%,#c99545 100%);
  --pd2-gold-fill:linear-gradient(180deg,#f7dc98 0%,#ebc066 50%,#d6a24a 100%);
  --pd2-gold-fill-hover:linear-gradient(180deg,#fbe4ac 0%,#f1c973 50%,#ddab55 100%);
  --pd2-gold-fill-press:linear-gradient(180deg,#e2c07a 0%,#d9ab52 50%,#c08d3c 100%);
  --pd2-gold-bevel:inset 0 1px 0 rgba(255,250,230,.55),inset 0 -1px 0 rgba(110,72,18,.35);
  --pd2-on-gold:#1c1508;
  --pd2-gold-line:rgba(232,189,98,.34);
  --pd2-gold-line-2:rgba(232,189,98,.6);
  --pd2-gold-wash:rgba(232,189,98,.07);
  --pd2-gold-wash-2:rgba(232,189,98,.13);

  /* status */
  --pd2-danger:#ff6a5f;
  --pd2-success:#3fcf86;

  /* geometry */
  --pd2-r-xs:6px;
  --pd2-r-sm:8px;
  --pd2-r-md:10px;
  --pd2-r-lg:14px;
  --pd2-r-xl:18px;
  --pd2-r-pill:999px;
  --pd2-sp-1:4px;
  --pd2-sp-2:8px;
  --pd2-sp-3:12px;
  --pd2-sp-4:16px;
  --pd2-sp-5:20px;
  --pd2-sp-6:24px;
  --pd2-sp-8:32px;
  --pd2-ctl-h:40px;
  --pd2-ctl-h-lg:48px;

  /* depth */
  --pd2-shadow-1:0 1px 2px rgba(0,0,0,.28),0 10px 28px rgba(0,0,0,.24);
  --pd2-shadow-2:0 2px 6px rgba(0,0,0,.3),0 20px 50px rgba(0,0,0,.4);
  --pd2-shadow-modal:0 30px 90px rgba(0,0,0,.65),0 0 0 1px rgba(255,255,255,.06);
  --pd2-backdrop:rgba(5,6,8,.74);

  /* type */
  --pd2-font:Inter,"Segoe UI",Arial,sans-serif;
  --pd2-font-num:"Exo 2",Inter,"Segoe UI",Arial,sans-serif;

  /* motion */
  --pd2-ease:cubic-bezier(.2,.8,.2,1);
  --pd2-t:.18s;
}