/* Optional background studies. All three share the live cards and typography. */
:root[data-background="daylight"]{--canvas:#f5f5f2;--header-rgb:245,245,242}
:root[data-background="studio"]{--canvas:#f7f7f4;--header-rgb:247,247,244}
:root[data-background="layers"]{--canvas:#f6f6f3;--header-rgb:246,246,243}
:root[data-background] .site-header{background:rgba(var(--header-rgb),.94)}
@supports(backdrop-filter:blur(10px)){
  :root[data-background] .site-header{background:rgba(var(--header-rgb),.80)}
}
:root[data-background] .paper-backdrop{inset:-48px;opacity:1;filter:none;background:none}
:root[data-background] .paper-backdrop::before,
:root[data-background] .paper-backdrop::after{content:'';position:absolute;inset:0;pointer-events:none}
:root[data-background="daylight"] .paper-backdrop::before{
  background:radial-gradient(ellipse at 12% 15%,rgba(255,255,255,.97),transparent 66%),radial-gradient(ellipse at 100% 82%,rgba(167,168,156,.10),transparent 64%);
}
:root[data-background="daylight"] .paper-backdrop::after{background:url('assets/paper-transport.jpg') repeat;background-size:700px;filter:grayscale(1);opacity:.055}
:root[data-background="studio"] .paper-backdrop::before{
  background:linear-gradient(122deg,transparent 7%,rgba(112,116,107,.045) 18%,rgba(112,116,107,.09) 24%,transparent 38%,transparent 70%,rgba(112,116,107,.065) 89%,transparent 100%);
  filter:blur(24px);
}
:root[data-background="studio"] .paper-backdrop::after{background:radial-gradient(ellipse at 70% 10%,rgba(255,255,255,.85),transparent 56%)}
:root[data-background="layers"] .paper-backdrop::before{
  inset:-18% 45% -18% -20%;background:#fafaf7;transform:rotate(-13deg);box-shadow:14px 7px 50px rgba(107,108,95,.07);
}
:root[data-background="layers"] .paper-backdrop::after{
  inset:55% -20% -35% 60%;background:#f9f9f6;transform:rotate(17deg);box-shadow:-14px -8px 42px rgba(107,108,95,.045);
}
@media(max-width:599px){
  :root[data-background="layers"] .paper-backdrop{transform:none}
  :root[data-background="layers"] .paper-backdrop::before{inset:-10% 58% -10% -50%}
}
@media(prefers-reduced-motion:reduce){:root[data-background] .paper-backdrop{transform:none}}
@media(prefers-reduced-transparency:reduce),(prefers-contrast:more){
  :root[data-background] .site-header{background:var(--canvas)}
  :root[data-background] .paper-backdrop{display:none}
}