/* PS1-lowpoly — early-3D-era murky/desaturated palette (posterized texture-
   compression look, not clean modern flat design), faceted low-poly panel
   framing.
   Fonts (2026-09-02, swapped in from VT323 via the font-gallery-generator
   drag-and-drop tool's exported picks, then Gradient Vector moved from
   --font-mono to --font-h2 the same day in a later round): Kubo for
   --font-display (a bold geometric techno-futuristic monospaced display
   face -- its own readme claims SIL OFL but then lists restrictive
   commercial-EULA terms; the one clause relevant to us, "unlimited
   amount on a website, app," explicitly covers this use, see
   static/fonts/kubo/LICENSE.txt for the full text and the discrepancy),
   Gradient Vector for --font-h2 (genuine SIL OFL, shared with
   paragade.css's own Gradient Vector pick), DPSDbeyond for --font-mono
   (genuine SIL OFL -- static/fonts/dpsd-beyond/OFL.txt is clean and
   standard despite an unrelated bundled backpacker_license.pdf in the
   same zip -- shared with paragade.css's own DPSDbeyond pick).

   Contrast: --text/--text-2/--muted verified against all three grounds at
   full body-text WCAG rigor (not the relaxed vibe-card bar), recomputed
   with the standard relative-luminance formula. --muted was the hard case
   in the original draft, same as 8bit.css's note — a first #8a8578 draft
   cleared bg/bg2 but only hit 3.20:1 on bg3 (the murky palette's
   desaturation pulls contrast down fast at borderline lightness),
   brightened to #a8a296 for 4.64:1 worst case (vs bg3).
   FOLLOW-UP FIX (post-review): --text-2's original #a39d8f draft was never
   re-verified after --muted was brightened above it, and actually landed
   BELOW --muted in luminance (an inverted text > text-2 > muted step) at
   only 4.36:1 against bg3 — under the 4.5:1 AA bar. Brightened to #b8b2a4,
   restoring the correct text > text-2 > muted lightness order: text-2 is
   now 5.58:1 vs bg3 (worst case), 6.68:1 vs bg2, 7.77:1 vs bg. text itself
   is 7.66:1 worst case (vs bg3). danger vs danger-dark: 4.77:1.
   See: circuitforge-plans/vaportrade-clone/superpowers/specs/
   2026-08-13-ui-redesign-design.md §3 "Theme-pack roadmap". */
@font-face{
  font-family:"Kubo";
  src:url("/vaportrade/static/fonts/kubo/Kubo-Regular.woff2") format("woff2");
  font-weight:400;
  font-display:swap;
}
@font-face{
  font-family:"Gradient Vector";
  src:url("/vaportrade/static/fonts/gradient-vector/GradientVector-Regular.woff2") format("woff2");
  font-weight:400;
  font-display:swap;
}
@font-face{
  font-family:"DPSDbeyond";
  src:url("/vaportrade/static/fonts/dpsd-beyond/DPSDbeyond-Regular.woff2") format("woff2");
  font-weight:400;
  font-display:swap;
}
[data-theme="ps1-lowpoly"]{
  --bg:#1a1f2e; --bg2:#242b3d; --bg3:#2f3750; --border:#4a4d5e;
  --text:#d4d0c8; --text-2:#b8b2a4; --muted:#a8a296;
  --accent-1:#8fa693; --accent-2:#b08968; --accent-3:#7c8fa6;
  --success:#7fa876; --danger:#c96a5a; --danger-dark:#2a1210; --warning:#c9a15a;
  --font-display:"Kubo",monospace;
  --font-mono:"DPSDbeyond",monospace;
  --font-h2:"Gradient Vector",monospace;
  --font-size-display:2.125rem; --font-size-mono:1.125rem; --font-size-h2:1.375rem;
}
/* Dithered/posterized ground -- a banded diagonal gradient standing in for
   PS1-era limited-color dithering (a true Bayer-matrix dither needs a
   raster image; this is the CSS-only approximation), fixed full-viewport
   like matrix-terminal's scanline overlay and cf-defcon's grid overlay. */
[data-theme="ps1-lowpoly"] body::before{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:1;
  background:
    repeating-linear-gradient(45deg,rgba(0,0,0,.06) 0px,rgba(0,0,0,.06) 2px,transparent 2px,transparent 4px),
    linear-gradient(180deg,rgba(143,166,147,.04),rgba(176,137,104,.04));
}
[data-theme="ps1-lowpoly"] h1 .grad{
  background:linear-gradient(90deg,#8fa693,#b08968,#7c8fa6);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
/* Faceted low-poly panel edges -- clip-path corner cuts stand in for the
   brief's "angular low-poly decorative motifs" (a jagged border-image would
   need a raster asset; clip-path is the CSS-only equivalent and keeps this
   pack self-contained per the plain-mode-fallback discipline). Applied to
   .card/.tile only (large surfaces where the facet is visible without
   clipping small interactive targets like buttons/badges/chips). */
[data-theme="ps1-lowpoly"] .card,
[data-theme="ps1-lowpoly"] .tile{
  clip-path:polygon(
    10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%,0 10px
  );
  border-color:var(--border);
}
/* 2026-08-28 button glow-up note: this pack's own clip-path below
   already wins over the base button{} rule's cut-corner shape
   (theme.css) via higher specificity, no clip-path:none needed. But
   content:none on ::before/::after IS needed -- negative z-index paints
   ABOVE this element's own background per CSS2.1 stacking order
   (confirmed empirically), not behind it, so without this the base
   rule's ::after would silently cover this pack's own var(--accent-1)
   low-poly fill. */
[data-theme="ps1-lowpoly"] button:not(.ghost):not(.danger):not(.dice-roll):not(.app-nav-toggle){
  background:var(--accent-1);color:var(--bg);
  clip-path:polygon(6px 0,100% 0,100% calc(100% - 6px),calc(100% - 6px) 100%,0 100%,0 6px);
}
[data-theme="ps1-lowpoly"] button:not(.ghost):not(.danger):not(.dice-roll):not(.app-nav-toggle)::before,
[data-theme="ps1-lowpoly"] button:not(.ghost):not(.danger):not(.dice-roll):not(.app-nav-toggle)::after{
  content:none;
}
[data-theme="ps1-lowpoly"] button:not(.ghost):not(.danger):not(.dice-roll):not(.app-nav-toggle):hover{
  filter:none;background:var(--accent-2);
}
/* Faceted divider marker on section headings -- low-poly-flavored triangle
   glyph instead of the round bullets other packs use. */
[data-theme="ps1-lowpoly"] h2{
  display:flex;align-items:center;gap:6px;
}
[data-theme="ps1-lowpoly"] h2::before{content:"\25B2";color:var(--accent-3);font-size:.7em}
/* Selected-chip override — theme.css's .chip.on ships a Neon-Casino-specific
   hardcoded violet that clashes with this murky/desaturated palette. Same
   override pattern as lisa-frank.css/8bit.css/etc: swap in this pack's own
   --accent-1 (sage) instead of the leaked literal. */
[data-theme="ps1-lowpoly"] .chip.on{
  background:rgba(143,166,147,.22);border-color:var(--accent-1);color:var(--text);
}
