

:root {
  --pp-chrome:    #ffffff;
  --pp-bg:        #f6f6f5;
  --pp-surface:   #ececeb;
  --pp-surface2:  #e1e1e0;
  --pp-surface3:  #d5d5d3;

  --pp-ink:       #1b1b1a;
  --pp-muted:     #63625f;
  --pp-faint:     #8b8a87;

  /* Accent is a FILL in light mode (2.1:1 on bg); accent-ink is the text-safe pair. */
  --pp-accent:     #c9ac00;
  --pp-accent-hi:  #a68e00;
  --pp-on-accent:  #201b00;
  --pp-accent-ink: #8a6d00;
  --pp-accent2:    #00788a;
  --pp-line:       #c6c6c4;
  --pp-grad:    linear-gradient(135deg, #f5d601, #c9ac00);
  --pp-grad-hi: linear-gradient(135deg, #ffe64a, #e0c100);

  --pp-good:      #217a4b;
  --pp-bad:       #b3323e;
  /* Lucky flag is GOLD (approved card-page mockup, 2026-08-14). Light gold is
     the text-safe deep tone; the bright gold is a fill on dark only. */
  --pp-warn:      #8a6d00;
  --pp-glow:      0 6px 20px rgba(201,172,0,.20);

  --pp-shine:     rgba(255, 255, 255, .62);

  /* Card data colors — CVD-validated, never retune to match a scheme. */
  --pp-c-red:       #d93a45;
  --pp-c-blue:      #2f6fdb;
  --pp-c-green:     #3a8f4d;
  --pp-c-purple:    #8a4fd3;
  --pp-c-colorless: #767b84;

  --pp-el-fire:     #ab4225;
  --pp-el-water:    #0e61c3;
  --pp-el-grass:    #427001;
  --pp-el-electric: #766301;
  --pp-el-ice:      #0d6f76;
  --pp-el-ground:   #864d1d;
  --pp-el-dark:     #43235e;
  --pp-el-dragon:   #9438b6;
  --pp-el-neutral:  #745f58;

  /* Brand colors are tokens too — they were pasted raw in two files. */
  --pp-brand-discord: #5865f2;
  --pp-brand-nexus: #191353;

  --pp-holo-light: #ffffff;

  /* Derived. Never give these a value of their own. */
  --pp-border: var(--pp-bg);
  --pp-shadow: 0 1px 2px rgba(28,30,34,.05), 0 4px 16px rgba(28,30,34,.06);
  
  --pp-holo-lift: 0 8px 22px rgba(28,30,34,.16);
}

html.s-dark, html.site-s-dark {
  --pp-line:      #47474c;
  --pp-chrome:    #040404;
  --pp-bg:        #17171a;
  --pp-surface:   #212124;
  --pp-surface2:  #2b2b2e;
  --pp-surface3:  #353539;

  --pp-ink:       #eae8e4;
  --pp-muted:     #979795;
  --pp-faint:     #6f6f6d;

  /* The yellow accent (12.6:1 on the page); cyan demoted to accent2 (focus rings). */
  --pp-accent:     #f5d601;
  --pp-accent-hi:  #ffe64a;
  --pp-on-accent:  #1f1a00;
  --pp-accent-ink: #f5d601;
  --pp-accent2:    #00dfff;

  --pp-good:      #3ef08c;
  --pp-bad:       #ff6e7c;
  --pp-warn:      #f5d60c;
  --pp-glow:      0 8px 24px rgba(245,214,1,.14);

  --pp-shine:     rgba(255, 246, 200, .38);

  --pp-c-red:       #e14b56;
  --pp-c-blue:      #4285e0;
  --pp-c-green:     #37a057;
  --pp-c-purple:    #9560e6;
  --pp-c-colorless: #9aa0aa;

  --pp-el-fire:     #f86036;
  --pp-el-water:    #3692fe;
  --pp-el-grass:    #61a301;
  --pp-el-electric: #c8a801;
  --pp-el-ice:      #15adb8;
  --pp-el-ground:   #d67b2e;
  --pp-el-dark:     #bc6cff;
  --pp-el-dragon:   #d35bff;
  --pp-el-neutral:  #b29288;

  --pp-holo-light: #ffffff;

  --pp-border: var(--pp-bg);
  --pp-shadow: 0 1px 2px rgba(0,0,0,.3), 0 6px 20px rgba(0,0,0,.25);
  --pp-holo-lift: 0 12px 34px rgba(0,0,0,.34);
}

:root {
  --pp-art-ink:       #ffffff;
  --pp-art-muted:     #a9aeb8;
  --pp-art-faint:     #676c76;
  --pp-art-scrim:     rgba(6,8,11,.82);
  
  --pp-art-accent:    #f5d601;
  --pp-art-accent-hi: #ffe64a;
  --pp-art-on-accent: #1f1a00;
}

:root {
  --pp-tcg:       var(--pp-warn);
  --pp-red:       var(--pp-c-red);
  --pp-blue:      var(--pp-c-blue);
  --pp-green:     var(--pp-c-green);
  --pp-purple:    var(--pp-c-purple);
  --pp-colorless: var(--pp-c-colorless);
  /* Discord's own hover step — brand palette, not ours, same in both schemes. */
  --pp-brand-discord-hi: #4752c4;
  /* CardNexus navy is already near-black, so its hover steps UP, not down. */
  --pp-brand-nexus-hi: #221a70;
}

