/*
 * Parix.ai | background-remover — page styles. Sits on top of px-kit.css.
 * The generator's own markup, stylesheet and script are untouched; its
 * variables hang off .parix-bg, so re-pointing them here recolours it to the
 * reference palette and drops its old standalone page layout.
 */
.pxbg .parix-bg{
  --primary:#eb600e; --primary-2:#eb600e; --accent:#CF520F; --accent-2:#CF520F;
  --brand:#eb600e; --brand-2:#CF520F;
  --bg:#ffffff; --soft:#fef1ed; --card:#ffffff; --border:rgba(26,21,18,.08);
  --text:#1a1512; --muted:#6f655e; --ink:#1a1512;
  --radius:18px; --radius-sm:12px;
  --shadow:0 1px 2px rgba(26,21,18,.05),0 24px 48px -28px rgba(26,21,18,.28);
  --font:"DM Sans",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  max-width:1080px; margin:28px auto 0; padding:0; color:#1a1512; text-align:left;
}
.pxbg .parix-bg h2,.pxbg .parix-bg h3{font-family:var(--head)}

/* labels read as labels, not accents (the tools colour them with --primary) */
.pxbg label,.pxbg .lbl,.pxbg legend{color:var(--ink)}
.pxbg label i,.pxbg .lbl i{color:var(--b)}

/* shared visual bits used by the new sections */
.pxbg .bar{height:9px;border-radius:999px;background:#f3e3d8;overflow:hidden}
.pxbg .bar > i{display:block;height:100%;width:var(--w,0%);border-radius:999px;background:var(--b)}
.pxbg .barline{display:grid;grid-template-columns:96px 1fr auto;gap:12px;align-items:center;
  font-size:12.5px;color:var(--muted);margin-bottom:10px}
.pxbg .barline b{font-size:12.5px;color:var(--ink);font-variant-numeric:tabular-nums}
.pxbg .who a{color:var(--bdd);text-decoration:none;border-bottom:1px solid #f4b58c}
.pxbg .who a:hover{color:var(--b)}

/* The remover's own styles live in the child theme's global stylesheet and hang
 * off --pbg-* variables, so they are re-pointed here, on this page only. */
.pxbg .parix-bg{
  --pbg-primary:#eb600e; --pbg-primary-dark:#CF520F;
  --pbg-text:#1a1512; --pbg-muted:#6f655e;
  --pbg-border:rgba(26,21,18,.08); --pbg-soft:#fef6f4; --pbg-radius:16px;
  font-family:"DM Sans",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
}
.pxbg .parix-bg__btn--primary:hover{box-shadow:0 6px 16px rgba(235,96,14,.3)}
.pxbg .parix-bg__demo-stage{box-shadow:0 24px 60px rgba(26,21,18,.18)}
.pxbg .parix-bg__card-title,.pxbg .parix-bg__section-title{font-family:var(--head)}
.pxbg .parix-bg__tool{padding:0}

/* the alpha breakdown used in the overview card */
.pxbg .alpha{display:grid;grid-template-columns:120px 1fr auto;gap:12px;align-items:center;
  font-size:12.5px;color:var(--muted);margin-bottom:9px}
.pxbg .alpha b{font-size:12.5px;color:var(--ink);font-variant-numeric:tabular-nums}
.pxbg .checker{border-radius:12px;height:150px;margin:6px 0 12px;
  background-image:linear-gradient(45deg,#eeeae7 25%,transparent 25%),
    linear-gradient(-45deg,#eeeae7 25%,transparent 25%),
    linear-gradient(45deg,transparent 75%,#eeeae7 75%),
    linear-gradient(-45deg,transparent 75%,#eeeae7 75%);
  background-size:18px 18px;background-position:0 0,0 9px,9px -9px,-9px 0;
  background-color:#fff;display:grid;place-items:center}
.pxbg .checker i{display:block;width:78px;height:110px;border-radius:10px;background:#c63420;
  box-shadow:0 10px 24px -12px rgba(26,21,18,.5)}