/* Per-theme surface pattern.
 *
 * finish-themes.css hard-locks both body pseudo-elements for every non-galaxy
 * theme (`body::before{background-image:none!important}` and a `!important`
 * gradient on `body::after`), so a pattern cannot be added there without an
 * important-war. html::before is unclaimed by every stylesheet in the project,
 * which makes it the one free layer. Each theme sets --st-pattern; this file only
 * paints it. A theme with no --st-pattern renders nothing.
 *
 * Only "cheat" had a texture before this (its scanlines are baked into --st-page).
 * Its pattern here is intentionally omitted so it is not textured twice.
 */

html[data-visual-theme]::before{
  content:"";
  position:fixed;
  inset:0;
  z-index:0;
  pointer-events:none;
  background-image:var(--st-pattern,none);
  background-size:var(--st-pattern-size,auto);
  opacity:var(--st-pattern-opacity,.5);
}
/* The app shell must sit above the texture. */
body>.shell,body>.admin-app-top,body>.admin-app-main,body>.mobile{position:relative;z-index:1}

/* Grove — leaf veins on the diagonal. */
html[data-visual-theme="grove"]{
  --st-pattern:
    repeating-linear-gradient(56deg,color-mix(in srgb,var(--st-sage) 12%,transparent) 0 1px,transparent 1px 13px),
    repeating-linear-gradient(-56deg,color-mix(in srgb,var(--st-sage) 8%,transparent) 0 1px,transparent 1px 22px);
  --st-pattern-opacity:.42;
}

/* Gold — fine hatched bullion. */
html[data-visual-theme="gold"]{
  --st-pattern:
    repeating-linear-gradient(45deg,color-mix(in srgb,var(--st-gold) 13%,transparent) 0 2px,transparent 2px 9px);
  --st-pattern-opacity:.34;
}

/* Gummy — soft confectionery dots. */
html[data-visual-theme="gummy"]{
  --st-pattern:radial-gradient(circle,color-mix(in srgb,var(--st-cyan) 20%,transparent) 0 2px,transparent 2.6px);
  --st-pattern-size:26px 26px;
  --st-pattern-opacity:.4;
}

/* Galaxy already animates its own starfield in finish-themes.css; adding a static
   pattern on top only muddied it, so this theme is deliberately left untextured. */

/* Holofoil — interference banding. */
html[data-visual-theme="holofoil"]{
  --st-pattern:
    repeating-linear-gradient(100deg,color-mix(in srgb,var(--st-cyan) 14%,transparent) 0 1px,transparent 1px 7px),
    repeating-linear-gradient(80deg,color-mix(in srgb,var(--st-purple) 11%,transparent) 0 1px,transparent 1px 11px);
  --st-pattern-opacity:.36;
}

/* Gem — faceted lattice. */
html[data-visual-theme="gem"]{
  --st-pattern:
    repeating-linear-gradient(60deg,color-mix(in srgb,var(--st-purple) 14%,transparent) 0 1px,transparent 1px 17px),
    repeating-linear-gradient(-60deg,color-mix(in srgb,var(--st-purple) 14%,transparent) 0 1px,transparent 1px 17px);
  --st-pattern-opacity:.4;
}

/* Cube — the grid it is named after. */
html[data-visual-theme="cube"]{
  --st-pattern:
    linear-gradient(color-mix(in srgb,var(--st-cyan) 15%,transparent) 1px,transparent 1px),
    linear-gradient(90deg,color-mix(in srgb,var(--st-cyan) 15%,transparent) 1px,transparent 1px);
  --st-pattern-size:30px 30px;
  --st-pattern-opacity:.32;
}

/* Quack — scattered feather flecks. */
html[data-visual-theme="quack"]{
  --st-pattern:
    radial-gradient(circle at 30% 30%,color-mix(in srgb,var(--st-gold) 24%,transparent) 0 2.2px,transparent 3px),
    radial-gradient(circle at 78% 68%,color-mix(in srgb,var(--st-sage) 20%,transparent) 0 1.8px,transparent 2.5px);
  --st-pattern-size:44px 44px;
  --st-pattern-opacity:.46;
}

/* Classic and starfall have no accent palette of their own here, so they inherit
   no pattern and keep the plain surface they have today. */

/* Light mode carries far less contrast headroom than dark, so every pattern is
   pulled back rather than being tuned one theme at a time. */
html[data-theme="light"][data-visual-theme]::before{opacity:calc(var(--st-pattern-opacity,.5) * .55)}

/* Patterns are decoration. Anyone who has asked for less visual noise, or who is
   printing, gets a clean surface. */
@media(prefers-contrast:more){html[data-visual-theme]::before{display:none}}
@media print{html[data-visual-theme]::before{display:none}}