:root {
  --p-bg: #f6f6f9;
  --p-fg: #111115;
  --p-card: #fff;
  --p-card-fg: #111115;
  --p-primary: #773cd6;
  --p-primary-fg: #fafafa;
  --p-secondary: #edeef5;
  --p-secondary-fg: #26262b;
  --p-muted: #eeeef2;
  --p-muted-fg: #5d5d64;
  --p-accent: #ece8fe;
  --p-accent-fg: #38255f;
  --p-destructive: #e4405e;
  --p-border: #d6d6df;
  --p-input: #d6d6df;
  --p-ring: #824ae4;
  --p-exact: #31c08d;
  --p-exact-fg: #003824;
  --p-exact-bg: #cef6e2;
  --p-variant: #c3972a;
  --p-variant-fg: #573d00;
  --p-variant-bg: #feedc9;
  --p-chart-1: #945ff9;
  --p-chart-2: #2fcf8d;
  --p-chart-3: #f0bb3b;
  --p-chart-4: #f66b71;
  --p-chart-5: #009edb;
  --p-font-sans: Manrope, ui-sans-serif, system-ui, -apple-system, sans-serif;
  --p-font-display: "DM Serif Display", Georgia, "Times New Roman", serif;
  --p-display-ls: -.045em;
  --p-display-lh: .95;
  --p-radius: .8rem;
  --p-radius-sm: .5rem;
  --p-radius-lg: 1.25rem;
  --p-radius-pill: 999px;
  --p-shadow-card: 0 1px 2px rgba(17, 17, 21, .06),
                   0 8px 24px rgba(17, 17, 21, .05);
}

@supports (color: color(display-p3 0 0 0)) {
  :root {
    --p-bg: color(display-p3 .966153 .966357 .974452);
    --p-fg: color(display-p3 .0670269 .0671781 .0813009);
    --p-card: color(display-p3 1 1 1);
    --p-card-fg: color(display-p3 .0670269 .0671781 .0813009);
    --p-primary: color(display-p3 .437176 .248783 .810603);
    --p-primary-fg: color(display-p3 .980256 .980256 .980256);
    --p-secondary: color(display-p3 .931245 .931853 .958643);
    --p-secondary-fg: color(display-p3 .148015 .148277 .167815);
    --p-muted: color(display-p3 .932533 .932921 .949001);
    --p-muted-fg: color(display-p3 .363267 .363745 .390827);
    --p-accent: color(display-p3 .922808 .909065 .988188);
    --p-accent-fg: color(display-p3 .207385 .147486 .360882);
    --p-destructive: color(display-p3 .826724 .304211 .379733);
    --p-border: color(display-p3 .840399 .84108 .872613);
    --p-input: color(display-p3 .840399 .84108 .872613);
    --p-ring: color(display-p3 .481406 .302276 .863851);
    --p-exact: color(display-p3 .378966 .740409 .565736);
    --p-exact-fg: color(display-p3 -.00844015 .225796 .137467);
    --p-exact-bg: color(display-p3 .837752 .961479 .892113);
    --p-variant: color(display-p3 .738787 .599101 .255551);
    --p-variant-fg: color(display-p3 .336924 .241232 -.0496074);
    --p-variant-bg: color(display-p3 .984646 .930469 .803962);
    --p-chart-1: color(display-p3 .549501 .380097 .944582);
    --p-chart-2: color(display-p3 .402843 .801259 .573951);
    --p-chart-3: color(display-p3 .910283 .74283 .332858);
    --p-chart-4: color(display-p3 .897425 .454085 .458676);
    --p-chart-5: color(display-p3 .273277 .610097 .837212);
    --p-shadow-card: 0 1px 2px color(display-p3 .0670269 .0671781 .0813009 / .06),
                   0 8px 24px color(display-p3 .0670269 .0671781 .0813009 / .05);
  }
}

@supports (color: lab(0% 0 0)) {
  :root {
    --p-bg: lab(97.0748% .276148 -1.09878);
    --p-fg: lab(5.21313% .618696 -2.34639);
    --p-card: lab(100% 0 0);
    --p-card-fg: lab(5.21313% .618696 -2.34639);
    --p-primary: lab(40.4077% 50.3896 -70.8237);
    --p-primary-fg: lab(98.26% 0 0);
    --p-secondary: lab(94.1146% .938207 -3.65106);
    --p-secondary-fg: lab(15.2303% 1.00175 -3.61401);
    --p-muted: lab(94.1492% .556976 -2.19451);
    --p-muted-fg: lab(39.5747% 1.16736 -4.35613);
    --p-accent: lab(92.7229% 4.57221 -10.1855);
    --p-accent-fg: lab(19.5801% 20.6506 -32.3166);
    --p-destructive: lab(53.6956% 64.7485 22.5667);
    --p-border: lab(85.9769% 1.13484 -4.37571);
    --p-input: lab(85.9769% 1.13484 -4.37571);
    --p-ring: lab(45.1984% 49.0171 -70.8549);
    --p-exact: lab(69.3764% -47.7623 14.5497);
    --p-exact-fg: lab(19.981% -31.6961 9.4893);
    --p-exact-bg: lab(93.7128% -16.4957 5.11432);
    --p-variant: lab(65.3714% 9.72855 59.4832);
    --p-variant-fg: lab(28.1082% 9.19133 50.6712);
    --p-variant-bg: lab(94.3657% 2.03729 19.5421);
    --p-chart-1: lab(52.3399% 47.3098 -70.9392);
    --p-chart-2: lab(74.2685% -53.3924 20.9695);
    --p-chart-3: lab(79.3236% 11.1274 68.2268);
    --p-chart-4: lab(63.4224% 54.4031 24.6832);
    --p-chart-5: lab(60.5977% -18.7986 -41.3987);
    --p-shadow-card: 0 1px 2px lab(5.21313% .618696 -2.34639 / .06),
                   0 8px 24px lab(5.21313% .618696 -2.34639 / .05);
  }
}

:root[data-theme="dark"] {
  --p-bg: #050507;
  --p-fg: #f1f1f4;
  --p-card: #0f0f13;
  --p-card-fg: #f1f1f4;
  --p-primary: #945ff9;
  --p-primary-fg: #fbfcfd;
  --p-secondary: #18181e;
  --p-secondary-fg: #cdcdd3;
  --p-muted: #18181d;
  --p-muted-fg: #94949e;
  --p-accent: #231e33;
  --p-accent-fg: #dad0ff;
  --p-destructive: #f9667a;
  --p-border: rgba(255, 255, 255, .11);
  --p-input: rgba(255, 255, 255, .13);
  --p-ring: #945ff9;
  --p-exact: #a4f4cf;
  --p-exact-fg: #a4f4cf;
  --p-exact-bg: rgba(5, 55, 38, .55);
  --p-variant: #fee685;
  --p-variant-fg: #fee685;
  --p-variant-bg: rgba(61, 50, 0, .45);
  --p-chart-1: #a379ff;
  --p-chart-2: #4ad496;
  --p-chart-3: #f1bf4e;
  --p-chart-4: #f8767a;
  --p-chart-5: #37aae3;
  --p-shadow-card: 0 1px 2px rgba(0, 0, 0, .4),
                   0 8px 24px rgba(0, 0, 0, .28);
}

@supports (color: color(display-p3 0 0 0)) {
  :root[data-theme="dark"] {
    --p-bg: color(display-p3 .0189168 .0189656 .0257577);
    --p-fg: color(display-p3 .946213 .94648 .957231);
    --p-card: color(display-p3 .0585246 .0586604 .0725829);
    --p-card-fg: color(display-p3 .946213 .94648 .957231);
    --p-primary: color(display-p3 .549501 .380097 .944582);
    --p-primary-fg: color(display-p3 .986171 .98631 .991728);
    --p-secondary: color(display-p3 .0924067 .0925397 .11456);
    --p-secondary-fg: color(display-p3 .803526 .804008 .824854);
    --p-muted: color(display-p3 .0928192 .0929944 .111342);
    --p-muted-fg: color(display-p3 .580388 .581044 .615393);
    --p-accent: color(display-p3 .133618 .116796 .193501);
    --p-accent-fg: color(display-p3 .847989 .81339 .995276);
    --p-destructive: color(display-p3 .908476 .437001 .486902);
    --p-border: color(display-p3 1 1 1 / .11);
    --p-input: color(display-p3 1 1 1 / .13);
    --p-ring: color(display-p3 .549501 .380097 .944582);
    --p-exact: color(display-p3 .713564 .947518 .821671);
    --p-exact-fg: color(display-p3 .713564 .947518 .821671);
    --p-exact-bg: color(display-p3 .0866927 .21208 .152012 / .55);
    --p-variant: color(display-p3 .978844 .905027 .573487);
    --p-variant-fg: color(display-p3 .978844 .905027 .573487);
    --p-variant-bg: color(display-p3 .234074 .197915 .0234277 / .45);
    --p-chart-1: color(display-p3 .616069 .476575 .988151);
    --p-chart-2: color(display-p3 .452775 .821002 .605946);
    --p-chart-3: color(display-p3 .914083 .758406 .384386);
    --p-chart-4: color(display-p3 .909965 .491637 .492082);
    --p-chart-5: color(display-p3 .354013 .658287 .870581);
    --p-shadow-card: 0 1px 2px color(display-p3 0 0 0 / .4),
                   0 8px 24px color(display-p3 0 0 0 / .28);
  }
}

@supports (color: lab(0% 0 0)) {
  :root[data-theme="dark"] {
    --p-bg: lab(1.35676% .192977 -.725141);
    --p-fg: lab(95.3263% .369281 -1.46437);
    --p-card: lab(4.3887% .555374 -2.09964);
    --p-card-fg: lab(95.3263% .369281 -1.46437);
    --p-primary: lab(52.3399% 47.3098 -70.9392);
    --p-primary-fg: lab(98.8232% .183612 -.732839);
    --p-secondary: lab(8.24823% 1.26056 -4.30739);
    --p-secondary-fg: lab(82.5319% .748485 -2.92221);
    --p-muted: lab(8.26848% 1.0273 -3.60075);
    --p-muted-fg: lab(61.5981% 1.34814 -5.09021);
    --p-accent: lab(12.4964% 7.06277 -13.1555);
    --p-accent-fg: lab(85.2898% 11.2895 -23.4285);
    --p-destructive: lab(63.2112% 58.3496 19.7609);
    --p-border: lab(100% 0 0 / .11);
    --p-input: lab(100% 0 0 / .13);
    --p-ring: lab(52.3399% 47.3098 -70.9392);
    --p-exact: lab(90.2248% -31.015 9.5621);
    --p-exact-fg: lab(90.2248% -31.015 9.5621);
    --p-exact-bg: lab(19.5951% -20.5004 6.23993 / .55);
    --p-variant: lab(91.7268% -.694394 49.8766);
    --p-variant-fg: lab(91.7268% -.694394 49.8766);
    --p-variant-bg: lab(21.3492% 1.0265 31.6476 / .45);
    --p-chart-1: lab(59.8733% 40.5663 -64.7159);
    --p-chart-2: lab(76.4621% -49.8289 19.5961);
    --p-chart-3: lab(80.4982% 9.91267 61.9624);
    --p-chart-4: lab(65.8532% 51.17 23.0073);
    --p-chart-5: lab(65.2799% -18.4941 -38.62);
    --p-shadow-card: 0 1px 2px lab(0% 0 0 / .4),
                   0 8px 24px lab(0% 0 0 / .28);
  }
}

.p2026 {
  background: var(--p-bg);
  color: var(--p-fg);
  font-family: var(--p-font-sans);
  -webkit-font-smoothing: antialiased;
  font-size: 16px;
  line-height: 1.55;
}

.p-display {
  font-family: var(--p-font-display);
  letter-spacing: var(--p-display-ls);
  font-weight: 400;
  line-height: var(--p-display-lh);
}

.p-display em {
  color: var(--p-primary);
  font-style: normal;
}

.p-eyebrow {
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--p-muted-fg);
  align-items: center;
  gap: .5rem;
  font-size: .688rem;
  font-weight: 700;
  display: flex;
}

.p-card {
  background: var(--p-card);
  color: var(--p-card-fg);
  border: 1px solid var(--p-border);
  border-radius: var(--p-radius);
  box-shadow: var(--p-shadow-card);
}

.p-tag {
  align-items: center;
  gap: .3rem;
  font-size: .688rem;
  font-weight: 500;
  display: inline-flex;
}

.p-tag--exact {
  color: var(--p-exact);
}

.p-tag--variant {
  color: var(--p-variant);
}

.p-tag--muted {
  color: var(--p-muted-fg);
}

.p-badge-best {
  letter-spacing: .1em;
  text-transform: uppercase;
  border-radius: var(--p-radius-pill);
  background: var(--p-exact-bg);
  color: var(--p-exact-fg);
  padding: .25rem .6rem;
  font-size: .625rem;
  font-weight: 800;
}

.p-btn {
  font-family: var(--p-font-sans);
  border-radius: var(--p-radius-pill);
  background: var(--accent-solid, #7c3aed);
  color: #fff;
  cursor: pointer;
  border: 0;
  padding: .75rem 1.25rem;
  font-size: .875rem;
  font-weight: 800;
  transition: filter .18s;
}

.p-btn:hover {
  filter: brightness(1.08);
}

.p-btn--ghost {
  color: var(--p-fg);
  border: 1px solid var(--p-border);
  background: none;
  font-weight: 600;
}