hps-y2k-chrome

Y2K Chrome (hps-y2k-chrome)

Single-theme deck plugin locked to the y2k-chrome theme from the upstream MIT-licensed lewislulu/html-ppt-skill (36 themes × 31 layouts × 27 animations — this plugin ships exactly one of those skins, fully baked into one self-contained seed: example.html).

Start from example.html. Replace content only. Never rewrite the design system or the runtime script. No colors or fonts outside this spec.

Locked token sheet (:root — do not add, remove, or recolor)

:root{
  --bg:#dfe4ec;            --bg-soft:#eef1f6;
  --surface:rgba(255,255,255,.72);   --surface-2:rgba(255,255,255,.5);
  --border:rgba(120,135,170,.32);    --border-strong:rgba(80,100,140,.55);
  --text-1:#1a1f2e;        --text-2:#4a536a;       --text-3:#8590a6;
  --accent:#8a5cff;        --accent-2:#3ccfd8;     --accent-3:#ff84c4;
  --good:#1fb98c;          --warn:#e8a13d;         --bad:#e0445a;
  --grad:linear-gradient(135deg,#b8c4d8 0%,#f5f7fb 30%,#8a9ab8 55%,#e8ecf4 80%,#6b7a95 100%);
  --grad-soft:linear-gradient(135deg,#c9e4ff,#f5d6ff 50%,#d6fffa);
  --chrome-text:linear-gradient(180deg,#f8faff 0%,#9aa8c4 50%,#4a5670 100%);
  --radius:26px;           --radius-sm:16px;       --radius-lg:36px;
  --shadow:0 12px 30px rgba(70,90,130,.22),inset 0 1px 0 rgba(255,255,255,.9),inset 0 -1px 0 rgba(80,100,140,.2);
  --shadow-lg:0 24px 60px rgba(70,90,130,.35),inset 0 2px 0 rgba(255,255,255,.95);
  --font-sans:'Space Grotesk','Inter','Noto Sans SC',sans-serif;
  --font-display:'Space Grotesk','Inter',sans-serif;
  --font-mono:'JetBrains Mono',SFMono-Regular,Menlo,monospace;
  --letter-tight:-.03em;   --letter-normal:-.01em;
  --ease:cubic-bezier(.4,0,.2,1);
}

Fonts: Space Grotesk is both display and body type ('Noto Sans SC' fallback for CJK), JetBrains Mono for code/labels. Loaded via Google Fonts @import only — the sole permitted external resource.

Signature devices (use these, nothing else)

1. Silver-metal canvas — body carries the full-bleed 5-stop gradient linear-gradient(135deg,#c4cfe0 0%,#f0f3f8 25%,#aab8d0 50%,#f5f7fb 75%,#b8c4d8 100%). Every slide is transparent over it. Never paint an opaque slide background.
2. Chrome-clipped type — .h1, .chrome-text, .stat-big clip --chrome-text (white→steel→gunmetal) via background-clip:text, plus filter:drop-shadow(0 2px 3px rgba(40,55,85,.38)) so the white top stop keeps letter definition over the light canvas. Display numerals and hero words are always chrome, never flat color.
3. Frosted-glass cards — .card = --surface (72% white) + backdrop-filter:blur(16px) saturate(140%) + --shadow. The inset 0 1px 0 rgba(255,255,255,.9) top highlight is the signature — never drop it. Mega radius --radius:26px (lg surfaces 36px).
4. Candy accents — purple --accent leads (kickers, progress bar, checks), aqua --accent-2 and pink --accent-3 support (orbs, chart bars, eyebrow tints). Accents are for small surfaces only; large fills use --grad / --grad-soft.
5. Glossy orbs — .orb radial-gradient candy spheres with a white specular highlight, absolutely positioned, z-index:0, decor only.
6. Chrome sparkles — inline 4-point star SVGs (.sparkle) filled with the chrome gradient or candy accents.
7. Chrome capsule pills — .pill = linear-gradient(180deg,#fff,#d4dcec) with --border stroke; .pill-accent tints with --accent.