:root {
  --pzcf-ink: #111a1d;
  --pzcf-muted: #687276;
  --pzcf-line: rgba(18, 31, 34, .12);
  --pzcf-soft: #edf2f1;
  --pzcf-paper: #f7f9f8;
  --pzcf-teal: #007a70;
  --pzcf-teal-bright: #30d5c4;
  --pzcf-action: #007a70;
  --pzcf-action-hover: #00675f;
  --pzcf-stage: #151b1d;
  --pzcf-stage-2: #202729;
  --pzcf-display: Michroma, "Arial Narrow", sans-serif;
  --pzcf-body: "IBM Plex Sans", "Helvetica Neue", sans-serif;
  --pzcf-mono: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  --pzcf-ease: cubic-bezier(.22, 1, .36, 1);
}

html { scroll-behavior: smooth; }
body.pzcf-active { background: radial-gradient(70% 80% at 81% 24%,rgba(71,188,176,.14),transparent 72%),linear-gradient(142deg,#fbfcfb 0%,#eef3f2 100%); color: var(--pzcf-ink); }
body.pzcf-active .pzcf { overflow: clip; font-family: var(--pzcf-body); background: linear-gradient(180deg, #f8faf9 0%, #e9eeee 45%, #f3f6f5 100%); }
body.pzcf-active main.pzcf { padding-top: 0 !important; }
.pzcf *, .pzcf *::before, .pzcf *::after { box-sizing: border-box; }
.pzcf [hidden] { display: none !important; }
.pzcf :where(h1,h2,h3,p,figure,ol,ul,dl,dd) { margin: 0; }
.pzcf :where(button,a) { -webkit-tap-highlight-color: transparent; }
.pzcf :where(button) { font: inherit; }
.pzcf img { display: block; max-width: 100%; }
.pzcf-shell { width: min(1480px, calc(100% - clamp(32px, 6vw, 96px))); margin-inline: auto; }
.pzcf-eyebrow { color: var(--pzcf-teal); font: 400 11px/1.3 var(--pzcf-display); letter-spacing: .14em; text-transform: uppercase; }
.pzcf-button {
  appearance: none; min-height: 52px; display: inline-flex; align-items: center; justify-content: center; gap: 18px;
  padding: 0 22px; border: 1px solid transparent; border-radius: 15px; text-decoration: none; cursor: pointer;
  font: 600 14px/1 var(--pzcf-body); transition: transform 150ms var(--pzcf-ease), background-color 180ms ease, border-color 180ms ease, color 180ms ease, opacity 180ms ease;
}
.pzcf-button:active { transform: scale(.975); transition-duration: 80ms; }
.pzcf-button:focus-visible, .pzcf button:focus-visible, .pzcf a:focus-visible { outline: 3px solid color-mix(in srgb, var(--pzcf-action) 55%, white); outline-offset: 3px; }
.pzcf-button--primary { color: #fff; background: var(--pzcf-action); box-shadow: 0 14px 30px rgba(0, 92, 84, .2), inset 0 1px 0 rgba(255,255,255,.28); }
.pzcf-button--primary:hover { background: var(--pzcf-action-hover); }
.pzcf-button--primary:disabled { cursor: not-allowed; color: rgba(255,255,255,.9); background: #9bc9c4; border-color: #8ebfba; opacity: 1; box-shadow: none; }
.pzcf-button--quiet { color: #253034; background: rgba(255,255,255,.7); border-color: var(--pzcf-line); }
.pzcf-button--quiet:hover { background: #fff; }

/* Hero */
.pzcf-hero { min-height: clamp(350px, 46vh, 420px); position: relative; isolation: isolate; display: grid; align-items: center; padding: clamp(24px, 3.2vw, 48px) 0; background: radial-gradient(70% 80% at 81% 24%, rgba(71, 188, 176, .14), transparent 72%), linear-gradient(142deg, #fbfcfb 0%, #eef3f2 100%); }
.pzcf-hero::after { content: ""; position: absolute; inset: auto 5% 0; height: 1px; background: linear-gradient(90deg, transparent, rgba(11, 80, 74, .2), transparent); }
.pzcf-hero__field { position: absolute; inset: 0; z-index: -1; overflow: hidden; pointer-events: none; opacity: .55; }
.pzcf-hero__field::before { content: ""; position: absolute; inset: 0; background-image: linear-gradient(rgba(16,58,55,.035) 1px, transparent 1px), linear-gradient(90deg, rgba(16,58,55,.035) 1px, transparent 1px); background-size: 64px 64px; mask-image: linear-gradient(90deg, transparent, #000 45%, #000); }
.pzcf-hero__signal { position: absolute; width: 460px; height: 460px; border: 1px solid rgba(0,122,112,.12); border-radius: 50%; }
.pzcf-hero__signal--a { right: -80px; top: 48px; }
.pzcf-hero__signal--b { right: 120px; top: 247px; width: 240px; height: 240px; }
.pzcf-hero__signal--c { right: 340px; bottom: -170px; width: 320px; height: 320px; }
.pzcf-hero__layout { display: grid; grid-template-columns: minmax(0, .94fr) minmax(500px, 1.06fr); gap: clamp(32px, 4.2vw, 72px); align-items: center; }
.pzcf-hero__copy { min-width: 0; }
.pzcf-breadcrumb { width: max-content; display: inline-flex; gap: 10px; align-items: center; margin-bottom: 18px; color: #4b595c; text-decoration: none; font: 400 9px/1.2 var(--pzcf-display); letter-spacing: .08em; text-transform: uppercase; }
.pzcf-breadcrumb:hover { color: var(--pzcf-teal); }
.pzcf-hero h1 { max-width: 760px; margin-top: 11px; color: #10191c; font: 400 clamp(34px, 3.35vw, 55px)/1.06 var(--pzcf-display); letter-spacing: -.04em; text-wrap: balance; }
.pzcf-hero__lead { max-width: 700px; margin-top: 16px; color: #4f5c60; font-size: clamp(15px, 1.05vw, 17px); line-height: 1.5; }
.pzcf-hero__actions { display: flex; align-items: center; gap: 24px; margin-top: 22px; }
.pzcf-hero__proof { display: flex; align-items: baseline; gap: 8px; color: #687478; font: 500 13px/1.4 var(--pzcf-body); }
.pzcf-hero__proof strong { color: var(--pzcf-teal); font: 400 25px/1 var(--pzcf-display); }
.pzcf-hero__instrument { min-height: 320px; position: relative; display: grid; grid-template-columns: 1fr minmax(72px, .66fr) 1fr; align-items: center; padding: 28px 26px 84px; border: 1px solid rgba(255,255,255,.75); border-radius: 28px; overflow: hidden; background: linear-gradient(155deg, rgba(31,39,41,.98), rgba(15,20,22,.98)); box-shadow: 0 30px 70px rgba(23,49,47,.2), inset 0 1px 0 rgba(255,255,255,.12); }
.pzcf-hero__instrument::before { content: ""; position: absolute; inset: 0; background: radial-gradient(80% 65% at 50% 18%, rgba(42,211,194,.16), transparent 65%), linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px); background-size: auto, 36px 36px, 36px 36px; }
.pzcf-hero__instrument::after { content: ""; position: absolute; width: 68%; aspect-ratio: 1; left: 16%; top: 5%; border: 1px solid rgba(52,221,205,.12); border-radius: 50%; box-shadow: 0 0 80px rgba(30,196,181,.08); }
.pzcf-hero__terminal { min-width: 0; position: relative; z-index: 2; filter: drop-shadow(0 26px 30px rgba(0,0,0,.42)); }
.pzcf-hero__terminal img { width: 100%; height: 150px; object-fit: contain; }
.pzcf-hero__terminal--a { transform: rotate(-12deg) translateX(8%); }
.pzcf-hero__terminal--b { transform: scaleX(-1) rotate(-12deg) translateX(8%); }
.pzcf-hero__cable { position: relative; z-index: 1; height: 110px; display: grid; align-items: center; }
.pzcf-hero__cable span { height: 20px; margin-inline: -26%; border-radius: 99px; background: linear-gradient(180deg, #333c3e, #080b0c 54%, #2b3335); box-shadow: 0 15px 24px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.12); }
.pzcf-hero__readout { position: absolute; z-index: 3; inset: auto 18px 18px; display: grid; grid-template-columns: auto 1fr; gap: 3px 14px; align-items: center; padding: 13px 16px; border: 1px solid rgba(255,255,255,.12); border-radius: 16px; color: #fff; background: rgba(8,14,15,.58); backdrop-filter: blur(18px) saturate(150%); box-shadow: inset 0 1px 0 rgba(255,255,255,.09); }
.pzcf-hero__readout small { grid-row: 1 / span 2; align-self: stretch; display: flex; align-items: center; padding-right: 12px; border-right: 2px solid var(--pzcf-teal-bright); color: var(--pzcf-teal-bright); font: 400 6px/1.5 var(--pzcf-display); letter-spacing: .12em; writing-mode: vertical-rl; transform: rotate(180deg); }
.pzcf-hero__readout strong { font: 400 11px/1.3 var(--pzcf-display); letter-spacing: -.015em; }
.pzcf-hero__readout span { color: rgba(255,255,255,.58); font: 500 10px/1.4 var(--pzcf-mono); }

/* Main configurator */
.pzcf-work { position: relative; padding: clamp(10px, 1.3vw, 18px) 0 clamp(36px, 4vw, 58px); scroll-margin-top: 92px; }
.pzcf-work::before { content: ""; position: absolute; inset: 0; z-index: 0; background: radial-gradient(48% 38% at 15% 30%, rgba(0,122,112,.09), transparent 80%); pointer-events: none; }
.pzcf-work .pzcf-shell { position: relative; z-index: 1; }
.pzcf-mode { flex: 0 0 auto; display: grid; grid-template-columns: 1fr 1fr; padding: 5px; border: 1px solid rgba(14,44,41,.12); border-radius: 16px; background: rgba(255,255,255,.62); box-shadow: inset 0 1px 0 rgba(255,255,255,.9); backdrop-filter: blur(18px); }
.pzcf-mode button { min-height: 38px; padding: 0 14px; border: 0; border-radius: 11px; color: #5d696c; background: transparent; cursor: pointer; font: 600 11px/1 var(--pzcf-body); white-space: nowrap; transition: color 180ms ease, background-color 180ms ease, box-shadow 180ms ease, transform 100ms ease; }
.pzcf-mode button:active { transform: scale(.97); }
.pzcf-mode button.is-active { color: #fff; background: #1c2729; box-shadow: 0 8px 18px rgba(13,31,32,.18), inset 0 1px 0 rgba(255,255,255,.12); }
.pzcf-app { border: 1px solid rgba(17,33,35,.11); border-radius: 32px; overflow: clip; background: rgba(250,252,251,.84); box-shadow: 0 40px 90px rgba(30,60,57,.13), inset 0 1px 0 #fff; }
.pzcf-progress { min-height: 68px; display: grid; grid-template-columns: auto minmax(0,1fr) auto; align-items: center; gap: clamp(12px,1.5vw,22px); padding: 9px 14px; border-bottom: 1px solid var(--pzcf-line); background: rgba(255,255,255,.68); }
.pzcf-progress ol { min-width: 0; display: grid; grid-template-columns: repeat(5, minmax(0,1fr)); list-style: none; }
.pzcf-progress li { min-width: 0; position: relative; color: #7a8587; font: 600 11px/1.25 var(--pzcf-body); }
.pzcf-progress li button { appearance: none; width: 100%; min-width: 0; position: relative; z-index: 1; display: grid; grid-template-columns: 28px minmax(0,1fr); gap: 10px; align-items: center; padding: 0 12px 0 0; border: 0; color: inherit; background: transparent; text-align: left; cursor: pointer; font: inherit; }
.pzcf-progress li button:disabled { cursor: default; }
.pzcf-progress li button:not(:disabled):hover strong { color: var(--pzcf-teal); }
.pzcf-progress li button:not(:disabled):active { transform: scale(.985); }
.pzcf-progress li:not(:last-child)::after { content: ""; position: absolute; z-index: 0; left: 28px; right: 0; top: 14px; height: 1px; background: #d4dcda; }
.pzcf-progress li span { position: relative; z-index: 1; width: 28px; height: 28px; display: grid; place-items: center; border: 1px solid #cbd4d2; border-radius: 50%; color: #647174; background: #f8faf9; font: 500 10px/1 var(--pzcf-mono); transition: all 220ms var(--pzcf-ease); }
.pzcf-progress li strong { position: relative; z-index: 1; min-width: 0; width: max-content; max-width: 100%; padding-right: 8px; background: rgba(255,255,255,.68); font: inherit; }
.pzcf-progress li.is-active { color: #172325; }
.pzcf-progress li.is-active span { border-color: var(--pzcf-teal); color: #fff; background: var(--pzcf-teal); box-shadow: 0 0 0 5px rgba(0,122,112,.09); }
.pzcf-progress li.is-complete span { border-color: rgba(0,122,112,.28); color: var(--pzcf-teal); background: #e9f6f3; }
.pzcf-progress li.is-complete:not(:last-child)::after { background: rgba(0,122,112,.44); }
.pzcf-history { display: flex; gap: 6px; }
.pzcf-history button { min-height: 42px; display: inline-flex; align-items: center; gap: 8px; padding: 0 12px; border: 1px solid var(--pzcf-line); border-radius: 12px; color: #556164; background: rgba(255,255,255,.72); cursor: pointer; font-size: 12px; font-weight: 600; }
.pzcf-history button:hover { color: #182326; background: #fff; }
.pzcf-history button:active { transform: scale(.97); }
.pzcf-history button:disabled { opacity: .38; cursor: default; }
.pzcf-app__body { display: grid; grid-template-columns: minmax(0, 1fr) 330px; min-height: 610px; }
.pzcf-builder { min-width: 0; display: grid; grid-template-columns: minmax(300px,.82fr) minmax(0,1.18fr); gap: 16px; padding: 16px; }
.pzcf-stage { min-height: 578px; position: relative; overflow: hidden; padding: 62px 24px 82px; border-radius: 24px; color: #fff; background: linear-gradient(145deg, var(--pzcf-stage-2), var(--pzcf-stage)); box-shadow: inset 0 1px 0 rgba(255,255,255,.09), 0 20px 40px rgba(11,25,26,.16); }
.pzcf-stage::after { content: ""; position: absolute; width: min(680px, 82%); aspect-ratio: 1; left: 50%; top: -68%; transform: translateX(-50%); border: 1px solid rgba(40,214,196,.13); border-radius: 50%; box-shadow: 0 0 100px rgba(30,195,180,.08), inset 0 0 100px rgba(30,195,180,.05); }
.pzcf-stage__grid { position: absolute; inset: 0; opacity: .5; background-image: linear-gradient(rgba(255,255,255,.028) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.028) 1px, transparent 1px); background-size: 34px 34px; mask-image: linear-gradient(#000, transparent 84%); }
.pzcf-stage__status { position: absolute; z-index: 4; left: 22px; top: 20px; display: inline-flex; align-items: center; gap: 9px; }
.pzcf-stage__status span { width: 7px; height: 7px; border-radius: 50%; background: #7c898b; box-shadow: 0 0 0 5px rgba(124,137,139,.1); transition: background-color 180ms ease, box-shadow 180ms ease; }
.pzcf-stage__status span.is-valid { background: var(--pzcf-teal-bright); box-shadow: 0 0 0 5px rgba(48,213,196,.11), 0 0 18px rgba(48,213,196,.35); }
.pzcf-stage__status small { color: rgba(255,255,255,.58); font: 500 9px/1.2 var(--pzcf-mono); letter-spacing: .08em; text-transform: uppercase; }
.pzcf-stage__connection { position: relative; z-index: 2; min-height: 210px; display: grid; grid-template-columns: minmax(0,1fr) minmax(38px,.34fr) minmax(0,1fr); align-items: center; gap: 4px; }
.pzcf-end { min-width: 0; position: relative; display: grid; justify-items: center; text-align: center; }
.pzcf-end__role { position: absolute; left: 4px; top: 4px; width: 30px; height: 30px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.16); border-radius: 9px; color: rgba(255,255,255,.72); background: rgba(255,255,255,.05); font: 500 10px/1 var(--pzcf-mono); }
.pzcf-end__image { width: 100%; height: 130px; position: relative; display: grid; place-items: center; transition: transform 340ms var(--pzcf-ease), opacity 180ms ease; }
.pzcf-end__image.is-switching { opacity: .25; transform: scale(.92); }
.pzcf-stage .pzcf-end__image img { position: absolute; inset: 0; width: 100%; height: 100%; max-height: 100%; object-fit: contain; filter: drop-shadow(0 12px 12px rgba(0,0,0,.3)); }
.pzcf-end__image img[hidden] { display: none; }
.pzcf-end__image.is-placeholder::before { content: ""; width: 62px; height: 62px; border: 1px solid rgba(255,255,255,.2); border-radius: 50%; background: radial-gradient(circle,transparent 0 7px,rgba(255,255,255,.07) 8px 10px,transparent 11px), repeating-conic-gradient(from 18deg,rgba(255,255,255,.18) 0 4deg,transparent 4deg 120deg); box-shadow: inset 0 0 0 10px rgba(255,255,255,.025), 0 18px 28px rgba(0,0,0,.22); }
.pzcf-end__image.is-placeholder::after { content: "?"; position: absolute; width: 25px; height: 25px; display: grid; place-items: center; border: 1px solid rgba(48,213,196,.34); border-radius: 8px; color: var(--pzcf-teal-bright); background: rgba(18,30,31,.88); font: 500 11px/1 var(--pzcf-mono); box-shadow: 0 8px 20px rgba(0,0,0,.25); }
.pzcf-end--b .pzcf-end__image { transform: scaleX(-1); }
.pzcf-end--b .pzcf-end__image.is-placeholder::after { transform: scaleX(-1); }
.pzcf-end--b .pzcf-end__image.is-switching { transform: scaleX(-1) scale(.92); }
.pzcf-end small { display: block; margin-top: 12px; color: rgba(255,255,255,.38); font: 500 8px/1.3 var(--pzcf-mono); letter-spacing: .1em; }
.pzcf-end strong { display: block; max-width: 220px; min-height: 39px; margin-top: 5px; color: rgba(255,255,255,.94); font: 400 12px/1.45 var(--pzcf-display); }
.pzcf-line { position: relative; height: 60px; display: grid; align-items: center; }
.pzcf-line span { height: 16px; margin-inline: -22%; border-radius: 99px; background: linear-gradient(180deg,#3b4446,#090c0d 55%,#2d3537); box-shadow: 0 10px 16px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.11); }
.pzcf-line i { position: absolute; top: 50%; width: 4px; height: 4px; margin-top: -2px; border-radius: 50%; background: var(--pzcf-teal-bright); opacity: 0; box-shadow: 0 0 12px var(--pzcf-teal-bright); }
.pzcf-stage.is-compatible .pzcf-line i { opacity: 1; animation: pzcf-signal 2.8s linear infinite; }
.pzcf-stage.is-compatible .pzcf-line i:nth-of-type(2) { animation-delay: -.92s; }
.pzcf-stage.is-compatible .pzcf-line i:nth-of-type(3) { animation-delay: -1.84s; }
@keyframes pzcf-signal { from { left: -10%; } to { left: 110%; } }
.pzcf-stage__meta { position: absolute; z-index: 3; inset: auto 18px 16px; display: grid; grid-template-columns: repeat(3,1fr); gap: 1px; overflow: hidden; border: 1px solid rgba(255,255,255,.08); border-radius: 14px; background: rgba(3,8,9,.36); backdrop-filter: blur(14px); }
.pzcf-stage__meta span { min-width: 0; display: grid; gap: 3px; padding: 11px 14px; background: rgba(255,255,255,.025); }
.pzcf-stage__meta small { color: rgba(255,255,255,.35); font: 500 7px/1.2 var(--pzcf-mono); letter-spacing: .12em; }
.pzcf-stage__meta strong { overflow-wrap: anywhere; color: rgba(255,255,255,.88); font: 500 10px/1.35 var(--pzcf-mono); }

/* Question and options */
.pzcf-question { min-width: 0; min-height: 578px; position: relative; display: flex; flex-direction: column; padding: 18px 2px 4px; }
.pzcf-question__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; padding: 0 12px; }
.pzcf-question__head > div { min-width: 0; }
.pzcf-question__head small { color: var(--pzcf-teal); font: 500 9px/1.2 var(--pzcf-mono); letter-spacing: .12em; text-transform: uppercase; }
.pzcf-question__head h3 { max-width: 850px; margin-top: 7px; font: 400 clamp(22px, 1.75vw, 29px)/1.16 var(--pzcf-display); letter-spacing: -.035em; text-wrap: balance; }
.pzcf-question__head p { max-width: 760px; margin-top: 8px; color: #687478; font-size: 13.5px; line-height: 1.46; }
.pzcf-swap { min-height: 43px; flex: 0 0 auto; display: inline-flex; align-items: center; gap: 8px; padding: 0 14px; border: 1px solid var(--pzcf-line); border-radius: 12px; color: #4d5b5e; background: rgba(255,255,255,.7); cursor: pointer; font-size: 12px; font-weight: 600; }
.pzcf-swap:hover { color: var(--pzcf-teal); border-color: rgba(0,122,112,.32); }
.pzcf-swap:active { transform: scale(.97); }
.pzcf-options { min-height: 140px; display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 9px; margin-top: 18px; padding: 0 8px; }
.pzcf-option { min-width: 0; position: relative; display: grid; grid-template-columns: 46px minmax(0,1fr); gap: 12px; align-items: center; min-height: 80px; padding: 14px; border: 1px solid rgba(19,40,41,.11); border-radius: 17px; text-align: left; color: #1c282b; background: rgba(255,255,255,.64); cursor: pointer; box-shadow: inset 0 1px 0 rgba(255,255,255,.9); transition: transform 150ms var(--pzcf-ease), border-color 180ms ease, background-color 180ms ease, box-shadow 180ms ease; }
.pzcf-option:hover { transform: translateY(-2px); border-color: rgba(0,122,112,.32); background: #fff; box-shadow: 0 12px 28px rgba(25,58,55,.08), inset 0 1px 0 #fff; }
.pzcf-option:active { transform: scale(.985); transition-duration: 80ms; }
.pzcf-option.is-selected { border-color: var(--pzcf-teal); background: #effaf7; box-shadow: 0 0 0 3px rgba(0,122,112,.08), inset 0 1px 0 #fff; }
.pzcf-option:disabled, .pzcf-option.is-disabled { opacity: .42; cursor: not-allowed; transform: none; box-shadow: none; }
.pzcf-option__visual { width: 46px; height: 46px; display: grid; place-items: center; border-radius: 13px; overflow: hidden; background: #e7edeb; }
.pzcf-option__visual img { width: 42px; height: 42px; object-fit: contain; }
.pzcf-option__visual span { color: var(--pzcf-teal); font: 500 11px/1 var(--pzcf-mono); }
.pzcf-option__copy { min-width: 0; display: grid; gap: 4px; }
.pzcf-option__copy small { color: #7a8588; font: 500 7px/1.2 var(--pzcf-mono); letter-spacing: .09em; text-transform: uppercase; }
.pzcf-option__copy strong { font: 600 13px/1.35 var(--pzcf-body); }
.pzcf-option__copy em { color: #697578; font: 400 11px/1.35 var(--pzcf-body); font-style: normal; }
.pzcf-option__check { position: absolute; right: 10px; top: 10px; width: 18px; height: 18px; display: grid; place-items: center; border: 1px solid rgba(17,45,42,.15); border-radius: 50%; color: transparent; background: #fff; font-size: 10px; }
.pzcf-option.is-selected .pzcf-option__check { border-color: var(--pzcf-teal); color: #fff; background: var(--pzcf-teal); }
.pzcf-options--applications { grid-template-columns: repeat(4,minmax(0,1fr)); }
.pzcf-options--applications .pzcf-option { grid-template-columns: 1fr; align-content: end; min-height: 100px; padding: 12px; overflow: hidden; }
.pzcf-options--applications .pzcf-option__visual { position: absolute; inset: 0; width: auto; height: auto; border-radius: inherit; background: linear-gradient(145deg,#e5ecea,#f7f9f8); }
.pzcf-options--applications .pzcf-option__visual::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 18%, rgba(248,250,249,.46) 56%, #f7f9f8 83%); }
.pzcf-options--applications .pzcf-option__visual img { position: absolute; right: -2%; top: -12%; width: 70%; height: 86%; object-fit: contain; opacity: .9; }
.pzcf-options--applications .pzcf-option__copy { position: relative; z-index: 2; padding-top: 36px; }
.pzcf-options--applications .pzcf-option__copy small { color: var(--pzcf-teal); }
.pzcf-options--applications .pzcf-option__copy strong { font-size: 12.5px; line-height: 1.25; }
.pzcf-options--applications .pzcf-option__copy em { display: none; }
.pzcf-options--lengths { grid-template-columns: repeat(auto-fit,minmax(86px,1fr)); }
.pzcf-options--lengths .pzcf-length { grid-template-columns: 1fr; align-content: space-between; justify-items: stretch; min-height: 104px; padding: 13px 12px 12px; overflow: hidden; text-align: left; background: linear-gradient(155deg,rgba(255,255,255,.9),rgba(241,246,244,.76)); }
.pzcf-length__graphic { height: 30px; position: relative; display: flex; align-items: center; padding-inline: 3px; }
.pzcf-length__graphic::before, .pzcf-length__graphic::after { content: ""; position: absolute; z-index: 2; top: 10px; width: 8px; height: 12px; border: 1px solid #475356; border-radius: 3px; background: linear-gradient(90deg,#2b3436,#111719); box-shadow: 0 3px 5px rgba(20,33,34,.2); }
.pzcf-length__graphic::before { left: 0; }
.pzcf-length__graphic::after { left: calc(var(--pzcf-length) - 8px); }
.pzcf-length__graphic i { width: var(--pzcf-length); height: 4px; display: block; border-radius: 99px; background: linear-gradient(180deg,#4b5759,#12191a 66%); box-shadow: 0 4px 8px rgba(13,28,28,.2); transition: width 280ms var(--pzcf-ease); }
.pzcf-length__graphic b { position: absolute; left: 0; bottom: 1px; width: var(--pzcf-length); height: 1px; background: rgba(0,122,112,.28); }
.pzcf-length__graphic b::before, .pzcf-length__graphic b::after { content: ""; position: absolute; top: -2px; width: 1px; height: 5px; background: var(--pzcf-teal); }
.pzcf-length__graphic b::before { left: 0; }
.pzcf-length__graphic b::after { right: 0; }
.pzcf-length__copy { display: grid; gap: 5px; margin-top: 12px; }
.pzcf-length__copy strong { font: 400 16px/1 var(--pzcf-display); letter-spacing: -.02em; }
.pzcf-length__copy small { color: #7b8789; font: 500 7px/1.2 var(--pzcf-mono); letter-spacing: .07em; text-transform: uppercase; }
.pzcf-length.is-selected .pzcf-length__graphic i { background: linear-gradient(180deg,#2ebaaa,#006f66 68%); box-shadow: 0 3px 10px rgba(0,122,112,.28); }
.pzcf-config-fields { grid-column: 1/-1; display: grid; grid-template-columns: 1.2fr .8fr; gap: 18px; margin-top: 2px; }
.pzcf-fieldset { min-width: 0; padding: 16px; border: 1px solid var(--pzcf-line); border-radius: 18px; background: rgba(255,255,255,.52); }
.pzcf-fieldset legend { padding: 0 6px; color: #687478; font: 500 9px/1.2 var(--pzcf-mono); letter-spacing: .1em; text-transform: uppercase; }
.pzcf-series-row { display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; }
.pzcf-series-row button { min-height: 52px; border: 1px solid var(--pzcf-line); border-radius: 12px; color: #4e5a5d; background: rgba(255,255,255,.72); cursor: pointer; font: 400 11px/1 var(--pzcf-display); }
.pzcf-series-row button.is-selected { border-color: var(--pzcf-teal); color: var(--pzcf-teal); background: #edf9f6; box-shadow: 0 0 0 3px rgba(0,122,112,.07); }
.pzcf-toggle { min-height: 52px; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.pzcf-toggle span:first-child { display: grid; gap: 2px; }
.pzcf-toggle strong { font-size: 13px; }
.pzcf-toggle small { color: #7a8587; font-size: 11px; }
.pzcf-switch { width: 48px; height: 28px; position: relative; flex: 0 0 auto; border: 0; border-radius: 99px; background: #c9d1cf; cursor: pointer; transition: background-color 180ms ease; }
.pzcf-switch::after { content: ""; position: absolute; width: 22px; height: 22px; left: 3px; top: 3px; border-radius: 50%; background: #fff; box-shadow: 0 2px 7px rgba(16,34,34,.24); transition: transform 230ms var(--pzcf-ease); }
.pzcf-switch.is-selected { background: var(--pzcf-teal); }
.pzcf-switch.is-selected::after { transform: translateX(20px); }
.pzcf-question__actions { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-top: auto; padding: 24px 8px 0; }
.pzcf-question__actions .pzcf-button--primary { min-width: 190px; }
.pzcf-question__actions [data-pzcf-back][hidden] + [data-pzcf-next] { margin-left: auto; }

/* Live inspector */
.pzcf-inspector { min-width: 0; position: relative; display: flex; flex-direction: column; padding: 32px 26px 22px; border-left: 1px solid var(--pzcf-line); color: #eaf2f0; background: linear-gradient(155deg,#253033,#172022); }
.pzcf-inspector::before { content: ""; position: absolute; inset: 0; pointer-events: none; background: radial-gradient(80% 38% at 20% 0,rgba(41,207,190,.12),transparent 80%), linear-gradient(rgba(255,255,255,.022) 1px,transparent 1px), linear-gradient(90deg,rgba(255,255,255,.022) 1px,transparent 1px); background-size: auto,32px 32px,32px 32px; mask-image: linear-gradient(#000,transparent 86%); }
.pzcf-inspector > * { position: relative; z-index: 1; }
.pzcf-inspector__top .pzcf-eyebrow { color: var(--pzcf-teal-bright); }
.pzcf-inspector__top h3 { min-height: 58px; margin-top: 14px; font: 400 20px/1.4 var(--pzcf-display); letter-spacing: -.025em; }
.pzcf-inspector__top > p:last-child { margin-top: 10px; color: rgba(235,244,242,.56); font-size: 13px; line-height: 1.5; }
.pzcf-spec-list { margin-top: 28px; border-top: 1px solid rgba(255,255,255,.09); }
.pzcf-spec-list > div { min-width: 0; display: grid; grid-template-columns: 86px minmax(0,1fr); gap: 12px; padding: 13px 0; border-bottom: 1px solid rgba(255,255,255,.075); }
.pzcf-spec-list dt { color: rgba(235,244,242,.38); font: 500 8px/1.4 var(--pzcf-mono); letter-spacing: .08em; text-transform: uppercase; }
.pzcf-spec-list dd { overflow-wrap: anywhere; color: rgba(255,255,255,.88); font: 500 11px/1.45 var(--pzcf-mono); }
.pzcf-inspector__validation { display: grid; grid-template-columns: 34px 1fr; gap: 12px; align-items: start; margin-top: 24px; padding: 15px; border: 1px solid rgba(49,210,194,.15); border-radius: 15px; background: rgba(25,100,94,.14); }
.pzcf-inspector__validation > span { width: 30px; height: 30px; display: grid; place-items: center; border: 1px solid rgba(52,211,195,.28); border-radius: 50%; color: var(--pzcf-teal-bright); background: rgba(45,205,189,.08); font-size: 13px; }
.pzcf-inspector__validation strong { display: block; color: #e8f6f3; font-size: 12px; line-height: 1.35; }
.pzcf-inspector__validation p { margin-top: 3px; color: rgba(232,246,243,.5); font-size: 11px; line-height: 1.4; }
.pzcf-inspector__validation.is-complete { border-color: rgba(48,213,196,.34); background: rgba(16,127,115,.22); }
.pzcf-inspector__foot { display: flex; justify-content: space-between; gap: 16px; margin-top: auto; padding-top: 24px; color: rgba(255,255,255,.28); font: 500 7px/1.4 var(--pzcf-mono); letter-spacing: .1em; }
.pzcf-inspector__foot strong { color: rgba(255,255,255,.5); font-weight: 500; }

/* Result */
.pzcf-question.is-result { padding-top: 26px; }
.pzcf-question.is-result .pzcf-question__head { display: none; }
.pzcf-result { display: grid; gap: 18px; }
.pzcf-result__hero { display: grid; grid-template-columns: 1.15fr .85fr; gap: 18px; padding: 24px; border: 1px solid rgba(0,122,112,.2); border-radius: 22px; background: linear-gradient(140deg,#eff9f6,#fff 65%); box-shadow: inset 0 1px 0 #fff; }
.pzcf-result__label { display: inline-flex; width: max-content; align-items: center; gap: 8px; color: var(--pzcf-teal); font: 500 8px/1.3 var(--pzcf-mono); letter-spacing: .1em; }
.pzcf-result__label::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--pzcf-teal); box-shadow: 0 0 0 5px rgba(0,122,112,.08); }
.pzcf-result__hero h3 { margin-top: 13px; font: 400 clamp(22px,2vw,31px)/1.18 var(--pzcf-display); letter-spacing: -.03em; }
.pzcf-result__sku { display: block; margin-top: 8px; color: #647174; font: 500 11px/1.4 var(--pzcf-mono); }
.pzcf-result__hero p { max-width: 660px; margin-top: 14px; color: #596669; font-size: 14px; line-height: 1.55; }
.pzcf-result__media { min-height: 190px; position: relative; display: grid; place-items: center; overflow: hidden; border-radius: 16px; background: radial-gradient(circle at 50% 42%,rgba(0,122,112,.12),transparent 65%),#e5ecea; }
.pzcf-result__media::after { content: ""; position: absolute; width: 150px; height: 150px; border: 1px solid rgba(0,122,112,.16); border-radius: 50%; }
.pzcf-result__media img { position: relative; z-index: 1; width: 88%; height: 170px; object-fit: contain; filter: drop-shadow(0 16px 18px rgba(13,46,42,.2)); }
.pzcf-result__facts { display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; margin-top: 18px; }
.pzcf-result__facts span { display: grid; gap: 4px; padding: 11px; border: 1px solid rgba(18,46,43,.09); border-radius: 12px; background: rgba(255,255,255,.66); }
.pzcf-result__facts small { color: #778285; font: 500 7px/1.2 var(--pzcf-mono); letter-spacing: .08em; }
.pzcf-result__facts strong { color: #243033; font: 600 11px/1.35 var(--pzcf-body); }
.pzcf-result__section { padding: 22px; border: 1px solid var(--pzcf-line); border-radius: 20px; background: rgba(255,255,255,.6); }
.pzcf-result__section header { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin-bottom: 16px; }
.pzcf-result__section h4 { margin: 0; font: 400 16px/1.35 var(--pzcf-display); }
.pzcf-result__section header span { color: #758184; font: 500 8px/1.3 var(--pzcf-mono); letter-spacing: .08em; }
.pzcf-result__section--bom { padding: 0; overflow: hidden; border-color: rgba(0,122,112,.34); background: #fff; box-shadow: 0 18px 44px rgba(18,58,54,.11), inset 0 1px 0 #fff; }
.pzcf-result__section--bom .pzcf-result__bom-head { align-items: center; margin: 0; padding: 22px 24px; color: #fff; background: radial-gradient(90% 180% at 100% 0,rgba(48,213,196,.17),transparent 56%),linear-gradient(135deg,#172224,#253234); }
.pzcf-result__bom-head > div { min-width: 0; }
.pzcf-result__section--bom .pzcf-result__bom-head span { display: block; color: rgba(221,241,237,.55); }
.pzcf-result__section--bom .pzcf-result__bom-head h4 { margin-top: 8px; color: #fff; font: 400 clamp(21px,2.1vw,30px)/1.15 var(--pzcf-display); letter-spacing: -.035em; }
.pzcf-result__bom-head p { margin-top: 8px; color: rgba(232,243,241,.67); font-size: 12px; line-height: 1.4; }
.pzcf-result__bom-count { min-width: 84px; display: grid; justify-items: end; gap: 5px; padding-left: 20px; border-left: 1px solid rgba(255,255,255,.12); }
.pzcf-result__bom-count b { color: var(--pzcf-teal-bright); font: 400 28px/1 var(--pzcf-display); }
.pzcf-result__bom-count small { max-width: 80px; color: rgba(232,243,241,.48); font: 500 7px/1.3 var(--pzcf-mono); letter-spacing: .08em; text-align: right; text-transform: uppercase; }
.pzcf-result__section--bom .pzcf-bom { padding: 12px; }
.pzcf-bom { display: grid; gap: 8px; }
.pzcf-bom__item { min-width: 0; display: grid; grid-template-columns: 64px 104px minmax(0,1fr) auto; gap: 15px; align-items: center; min-height: 86px; padding: 10px 14px 10px 10px; border: 1px solid rgba(18,40,40,.09); border-radius: 15px; background: linear-gradient(135deg,#f7faf9,#fff); transition: border-color 180ms ease, transform 180ms var(--pzcf-ease), box-shadow 180ms ease; }
.pzcf-bom__item:hover { transform: translateY(-1px); border-color: rgba(0,122,112,.25); box-shadow: 0 10px 24px rgba(18,58,54,.07); }
.pzcf-bom__image { width: 64px; height: 64px; display: grid; place-items: center; border-radius: 12px; overflow: hidden; background: radial-gradient(circle at 50% 45%,#fff,#e5ecea); }
.pzcf-bom__image img { width: 58px; height: 58px; object-fit: contain; }
.pzcf-bom__sku { width: max-content; max-width: 100%; padding: 6px 8px; border: 1px solid rgba(0,122,112,.14); border-radius: 7px; color: var(--pzcf-teal); background: rgba(0,122,112,.055); font: 500 9px/1.3 var(--pzcf-mono); overflow-wrap: anywhere; }
.pzcf-bom__copy { min-width: 0; }
.pzcf-bom__copy strong { display: block; color: #243033; font-size: 13px; line-height: 1.3; }
.pzcf-bom__copy p { margin-top: 3px; color: #748083; font-size: 11px; line-height: 1.4; }
.pzcf-bom__qty { min-width: 74px; padding: 9px 11px; border-radius: 9px; color: #334143; background: #eaf0ee; font: 500 9px/1.3 var(--pzcf-mono); text-align: center; }
.pzcf-result__note { padding: 14px 16px; border-left: 3px solid var(--pzcf-teal); border-radius: 0 13px 13px 0; color: #596669; background: rgba(0,122,112,.055); font-size: 12px; line-height: 1.5; }
.pzcf-result__actions { display: grid; grid-template-columns: 1fr auto; gap: 12px; }
.pzcf-result__actions.is-single { grid-template-columns: 1fr; }
.pzcf-result__source { min-height: 52px; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 0 18px; border: 1px solid var(--pzcf-line); border-radius: 15px; color: #4f5d60; text-decoration: none; background: rgba(255,255,255,.68); font-size: 12px; font-weight: 600; }
.pzcf-result__source:hover { color: var(--pzcf-teal); background: #fff; }
.pzcf-result__actions .pzcf-button { white-space: nowrap; }
.pzcf-alternatives { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
.pzcf-alternative { min-width: 0; padding: 14px; border: 1px solid var(--pzcf-line); border-radius: 14px; background: #f8faf9; }
.pzcf-alternative small { color: var(--pzcf-teal); font: 500 8px/1.3 var(--pzcf-mono); }
.pzcf-alternative strong { display: block; margin-top: 5px; font-size: 13px; line-height: 1.35; }
.pzcf-alternative p { margin-top: 4px; color: #758083; font-size: 11px; line-height: 1.4; }

/* Complete portfolio workspace */
.pzcf-choice-search { grid-column: 1 / -1; min-height: 58px; display: grid; grid-template-columns: auto minmax(180px,1fr); gap: 16px; align-items: center; padding: 8px 10px 8px 16px; border: 1px solid var(--pzcf-line); border-radius: 15px; color: #687477; background: rgba(255,255,255,.72); font-size: 11px; font-weight: 600; }
.pzcf-choice-search input { width: 100%; min-height: 40px; padding: 0 13px; border: 1px solid rgba(18,42,40,.11); border-radius: 10px; outline: 0; color: #172325; background: #f4f7f6; font: 500 12px/1 var(--pzcf-body); }
.pzcf-choice-search input:focus { border-color: var(--pzcf-teal); box-shadow: 0 0 0 3px rgba(0,122,112,.08); background: #fff; }
.pzcf-choice-grid { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; }
.pzcf-app.is-result .pzcf-app__body { display: block; min-height: 0; }
.pzcf-app.is-result .pzcf-builder { display: block; height: auto; padding: clamp(12px,2vw,24px); }
.pzcf-app.is-result .pzcf-stage, .pzcf-app.is-result .pzcf-inspector, .pzcf-app.is-result .pzcf-question__head, .pzcf-app.is-result .pzcf-question__actions { display: none; }
.pzcf-app.is-result .pzcf-question { min-height: 0; height: auto; display: block; padding: 0; }
.pzcf-app.is-result .pzcf-options { min-height: 0; display: block; margin: 0; padding: 0; }
.pzcf-app.is-result .pzcf-result { display: grid; grid-template-columns: minmax(0,1.18fr) minmax(390px,.82fr); gap: 16px; }
.pzcf-app.is-result .pzcf-result__hero { grid-column: 1; min-height: 100%; }
.pzcf-app.is-result .pzcf-result__section--bom { grid-column: 2; grid-row: 1; }
.pzcf-app.is-result .pzcf-result__note, .pzcf-app.is-result .pzcf-result__actions, .pzcf-app.is-result .pzcf-catalog { grid-column: 1 / -1; }
.pzcf-app.is-result .pzcf-result__note { margin-top: 2px; }

.pzcf-catalog { margin-top: 8px; scroll-margin-top: 88px; overflow: clip; border: 1px solid rgba(17,43,40,.13); border-radius: 24px; background: rgba(244,248,247,.82); box-shadow: 0 22px 55px rgba(24,58,55,.09), inset 0 1px 0 #fff; }
.pzcf-catalog__head { min-height: 178px; display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 28px; align-items: center; padding: clamp(24px,3vw,38px); color: #fff; background: radial-gradient(70% 160% at 90% 0,rgba(48,213,196,.18),transparent 58%),linear-gradient(135deg,#121b1d,#293638); }
.pzcf-catalog__head > div > span { color: var(--pzcf-teal-bright); font: 500 8px/1.3 var(--pzcf-mono); letter-spacing: .11em; text-transform: uppercase; }
.pzcf-catalog__head h4 { margin-top: 10px; color: #fff; font: 400 clamp(25px,2.5vw,38px)/1.1 var(--pzcf-display); letter-spacing: -.04em; }
.pzcf-catalog__head p { max-width: 760px; margin-top: 12px; color: rgba(236,246,244,.62); font-size: 13px; line-height: 1.55; }
.pzcf-catalog__head > strong { min-width: 152px; display: grid; grid-template-columns: auto 1fr; gap: 12px; align-items: center; padding-left: 24px; border-left: 1px solid rgba(255,255,255,.12); }
.pzcf-catalog__head > strong b { color: var(--pzcf-teal-bright); font: 400 30px/1 var(--pzcf-display); }
.pzcf-catalog__head > strong small { color: rgba(235,246,243,.45); font: 500 7px/1.45 var(--pzcf-mono); letter-spacing: .08em; }
.pzcf-catalog__toolbar { position: sticky; z-index: 5; top: 92px; display: grid; grid-template-columns: auto minmax(260px,1fr); gap: 10px 16px; padding: 14px; border-bottom: 1px solid var(--pzcf-line); background: rgba(250,252,251,.94); backdrop-filter: blur(18px) saturate(140%); }
.pzcf-catalog__modes { display: flex; gap: 5px; padding: 4px; border: 1px solid var(--pzcf-line); border-radius: 12px; background: #edf2f1; }
.pzcf-catalog__modes button, .pzcf-catalog__filters > button { min-height: 40px; padding: 0 13px; border: 0; border-radius: 8px; color: #617073; background: transparent; cursor: pointer; font-size: 11px; font-weight: 650; }
.pzcf-catalog__modes button.is-selected { color: #fff; background: #1c2729; box-shadow: 0 6px 15px rgba(20,40,41,.15); }
.pzcf-catalog__search { position: relative; min-width: 0; }
.pzcf-catalog__search input { width: 100%; min-height: 50px; padding: 0 44px 0 16px; border: 1px solid var(--pzcf-line); border-radius: 12px; outline: 0; color: #172325; background: #fff; font: 500 13px/1 var(--pzcf-body); }
.pzcf-catalog__search input:focus { border-color: var(--pzcf-teal); box-shadow: 0 0 0 3px rgba(0,122,112,.08); }
.pzcf-catalog__search i { position: absolute; right: 15px; top: 50%; transform: translateY(-50%); color: var(--pzcf-teal); font: 400 19px/1 var(--pzcf-display); font-style: normal; }
.pzcf-catalog__filters { grid-column: 1 / -1; display: flex; align-items: center; gap: 6px; }
.pzcf-catalog__filters > button { min-height: 35px; border: 1px solid var(--pzcf-line); background: #fff; }
.pzcf-catalog__filters > button.is-selected { border-color: rgba(0,122,112,.32); color: var(--pzcf-teal); background: #eaf7f4; }
.pzcf-catalog__filters label { display: flex; align-items: center; gap: 8px; margin-left: auto; color: #7a8587; font: 500 8px/1 var(--pzcf-mono); letter-spacing: .08em; text-transform: uppercase; }
.pzcf-catalog__filters select { min-height: 35px; padding: 0 32px 0 11px; border: 1px solid var(--pzcf-line); border-radius: 9px; color: #364346; background: #fff; font: 600 11px/1 var(--pzcf-body); }
.pzcf-product-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; padding: 14px; }
.pzcf-product-family { min-width: 0; display: flex; flex-direction: column; overflow: hidden; border: 1px solid rgba(17,41,39,.1); border-radius: 18px; background: #fff; box-shadow: 0 9px 26px rgba(24,55,52,.055); transition: transform 180ms var(--pzcf-ease), border-color 180ms ease, box-shadow 180ms ease; }
.pzcf-product-family:hover { transform: translateY(-2px); border-color: rgba(0,122,112,.25); box-shadow: 0 16px 34px rgba(24,55,52,.09); }
.pzcf-product-family.is-best { border-color: rgba(0,122,112,.46); box-shadow: 0 0 0 3px rgba(0,122,112,.06),0 18px 38px rgba(24,68,63,.11); }
.pzcf-product-family__media { min-height: 178px; position: relative; display: grid; place-items: center; overflow: hidden; background: radial-gradient(circle at 50% 45%,#fff,#e8efed 72%); }
.pzcf-product-family__media::after { content: ""; position: absolute; width: 112px; height: 112px; border: 1px solid rgba(0,122,112,.1); border-radius: 50%; }
.pzcf-product-family__media img { position: relative; z-index: 1; width: 88%; height: 150px; object-fit: contain; filter: drop-shadow(0 14px 16px rgba(17,50,46,.16)); }
.pzcf-product-family__media > span:not(.pzcf-product-family__placeholder) { position: absolute; z-index: 2; left: 10px; top: 10px; padding: 6px 8px; border-radius: 7px; color: #fff; background: var(--pzcf-teal); font: 600 7px/1 var(--pzcf-mono); letter-spacing: .07em; text-transform: uppercase; }
.pzcf-product-family__placeholder { position: relative; z-index: 1; width: 64px; height: 64px; display: grid; place-items: center; border: 1px solid rgba(0,122,112,.18); border-radius: 18px; color: var(--pzcf-teal); background: rgba(255,255,255,.64); font: 400 14px/1 var(--pzcf-display); }
.pzcf-product-family__body { flex: 1; padding: 15px 15px 13px; }
.pzcf-product-family__meta { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.pzcf-product-family__meta span { color: var(--pzcf-teal); font: 500 7px/1.2 var(--pzcf-mono); letter-spacing: .08em; text-transform: uppercase; }
.pzcf-product-family__meta b { color: #879294; font: 500 7px/1.2 var(--pzcf-mono); }
.pzcf-product-family h5 { margin: 11px 0 0; color: #1c282b; font: 600 15px/1.3 var(--pzcf-body); }
.pzcf-product-family code { display: block; margin-top: 6px; color: var(--pzcf-teal); font: 500 9px/1.3 var(--pzcf-mono); }
.pzcf-product-family__body > p { min-height: 34px; margin-top: 8px; color: #748083; font-size: 11px; line-height: 1.48; }
.pzcf-product-family__facts { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 11px; }
.pzcf-product-family__facts span { padding: 6px 7px; border-radius: 7px; color: #526063; background: #eef3f2; font: 500 8px/1 var(--pzcf-mono); }
.pzcf-product-family__variants { margin-top: auto; border-top: 1px solid var(--pzcf-line); }
.pzcf-product-family__variants summary { min-height: 47px; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 0 15px; color: #536164; cursor: pointer; list-style: none; font-size: 11px; font-weight: 650; }
.pzcf-product-family__variants summary::-webkit-details-marker { display: none; }
.pzcf-product-family__variants summary span { color: var(--pzcf-teal); font-size: 16px; transition: transform 180ms ease; }
.pzcf-product-family__variants[open] summary span { transform: rotate(45deg); }
.pzcf-product-family__variants > div { max-height: 270px; overflow: auto; border-top: 1px solid var(--pzcf-line); background: #f6f9f8; }
.pzcf-variant-row { min-height: 58px; display: grid; grid-template-columns: minmax(0,1fr) auto auto 14px; gap: 9px; align-items: center; padding: 8px 12px; border-bottom: 1px solid rgba(18,42,40,.08); color: #334144; text-decoration: none; }
.pzcf-variant-row:hover { background: #fff; }
.pzcf-variant-row > span { min-width: 0; }
.pzcf-variant-row strong { display: block; overflow-wrap: anywhere; color: var(--pzcf-teal); font: 500 8px/1.3 var(--pzcf-mono); }
.pzcf-variant-row small { display: block; overflow: hidden; margin-top: 3px; color: #707d80; font-size: 9px; line-height: 1.25; text-overflow: ellipsis; white-space: nowrap; }
.pzcf-variant-row b, .pzcf-variant-row em { color: #5f6b6e; font: 500 8px/1 var(--pzcf-mono); font-style: normal; white-space: nowrap; }
.pzcf-variant-row i { color: var(--pzcf-teal); font-style: normal; }
.pzcf-catalog__more { min-height: 54px; width: calc(100% - 28px); display: flex; align-items: center; justify-content: center; gap: 16px; margin: 0 14px 14px; border: 1px solid rgba(0,122,112,.22); border-radius: 13px; color: var(--pzcf-teal); background: #edf8f5; cursor: pointer; font-size: 12px; font-weight: 700; }
.pzcf-catalog__more:hover { background: #e3f5f0; }
.pzcf-catalog__more span { padding: 5px 7px; border-radius: 6px; background: rgba(0,122,112,.08); font: 500 8px/1 var(--pzcf-mono); }
.pzcf-catalog__empty { margin: 14px; padding: 42px 18px; border: 1px dashed rgba(18,44,41,.18); border-radius: 15px; color: #6a777a; text-align: center; font-size: 13px; }

/* Explanation chapter */
.pzcf-method { padding: 0 0 clamp(90px,10vw,150px); }
.pzcf-method__scene { position: relative; display: grid; grid-template-columns: .82fr 1.18fr; gap: clamp(36px,5vw,78px); align-items: stretch; overflow: hidden; padding: clamp(34px,4.2vw,64px); border: 1px solid rgba(255,255,255,.12); border-radius: 32px; color: #edf5f3; background: radial-gradient(70% 110% at 84% 10%,rgba(35,189,174,.16),transparent 60%),linear-gradient(145deg,#121a1c,#263234); box-shadow: 0 32px 70px rgba(22,48,46,.18), inset 0 1px 0 rgba(255,255,255,.1); }
.pzcf-method__scene::before { content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .46; background-image: linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px); background-size: 42px 42px; mask-image: linear-gradient(90deg,transparent,#000); }
.pzcf-method__scene > * { position: relative; z-index: 1; }
.pzcf-method__lead { display: flex; flex-direction: column; justify-content: center; }
.pzcf-method__lead .pzcf-eyebrow { color: var(--pzcf-teal-bright); }
.pzcf-method__lead h2 { max-width: 620px; margin-top: 15px; color: #fff; font: 400 clamp(27px,2.7vw,43px)/1.16 var(--pzcf-display); letter-spacing: -.035em; text-wrap: balance; }
.pzcf-method__lead > p { max-width: 600px; margin-top: 20px; color: rgba(230,241,239,.64); font-size: 15px; line-height: 1.65; }
.pzcf-method__checks { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 28px; }
.pzcf-method__checks span { display: inline-flex; align-items: center; gap: 8px; padding: 8px 10px; border: 1px solid rgba(255,255,255,.09); border-radius: 9px; color: rgba(239,248,246,.68); background: rgba(255,255,255,.035); font-size: 11px; }
.pzcf-method__checks i { color: var(--pzcf-teal-bright); font: 500 7px/1 var(--pzcf-mono); font-style: normal; }
.pzcf-method__logic { display: grid; grid-template-columns: 1fr; gap: 10px; padding: 10px; border: 1px solid rgba(255,255,255,.09); border-radius: 24px; background: rgba(0,0,0,.15); box-shadow: inset 0 1px 0 rgba(255,255,255,.04); }
.pzcf-method__outcome { min-width: 0; display: grid; grid-template-columns: 50px minmax(0,1fr); gap: 16px; align-items: center; min-height: 132px; padding: 20px; border: 1px solid rgba(255,255,255,.08); border-radius: 17px; background: linear-gradient(135deg,rgba(255,255,255,.075),rgba(255,255,255,.035)); box-shadow: inset 0 1px 0 rgba(255,255,255,.06); }
.pzcf-method__outcome--factory { border-color: rgba(48,213,196,.21); background: linear-gradient(135deg,rgba(26,137,126,.2),rgba(255,255,255,.035)); }
.pzcf-method__icon { width: 50px; height: 50px; display: grid; place-items: center; border: 1px solid rgba(48,213,196,.3); border-radius: 15px; color: var(--pzcf-teal-bright); background: rgba(48,213,196,.09); font: 400 19px/1 var(--pzcf-display); }
.pzcf-method__outcome small { color: var(--pzcf-teal-bright); font: 500 8px/1.2 var(--pzcf-mono); letter-spacing: .1em; }
.pzcf-method__outcome strong { display: block; margin-top: 7px; color: #fff; font: 400 15px/1.35 var(--pzcf-display); }
.pzcf-method__outcome p { margin-top: 7px; color: rgba(230,241,239,.57); font-size: 12px; line-height: 1.45; }
.pzcf-method__or { height: 0; position: relative; z-index: 2; display: grid; place-items: center; }
.pzcf-method__or span { width: 32px; height: 22px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.1); border-radius: 99px; color: rgba(232,244,241,.45); background: #172022; font: 500 7px/1 var(--pzcf-mono); }
.pzcf-method__verified { display: flex; align-items: center; gap: 9px; padding: 6px 10px 2px; color: rgba(232,244,241,.5); font: 500 8px/1.4 var(--pzcf-mono); letter-spacing: .06em; text-transform: uppercase; }
.pzcf-method__verified span { color: var(--pzcf-teal-bright); }
.pzcf-noscript { width: min(720px,calc(100% - 32px)); margin: 24px auto; padding: 24px; border: 1px solid #ccc; border-radius: 16px; background: #fff; font-family: sans-serif; }
.pzcf-noscript a { display: inline-block; margin-top: 12px; color: var(--pzcf-teal); }

@supports not (backdrop-filter: blur(1px)) {
  .pzcf-mode, .pzcf-stage__meta { background: #f3f6f5; }
  .pzcf-hero__readout { background: #121a1c; }
  .pzcf-stage__meta { background: #101719; }
}

@media (min-width: 1021px) {
  .pzcf-progress { min-height: 58px; }
  .pzcf-app:not(.is-result) .pzcf-app__body { min-height: 0; height: clamp(520px, calc(100vh - 212px), 688px); height: clamp(520px, calc(100svh - 212px), 688px); grid-template-rows: minmax(0,1fr); overflow: hidden; }
  .pzcf-app:not(.is-result) .pzcf-builder { min-height: 0; height: 100%; grid-template-rows: minmax(0,1fr); overflow: hidden; padding: 10px; gap: 10px; }
  .pzcf-app:not(.is-result) .pzcf-stage { min-height: 0; height: auto; align-self: stretch; }
  .pzcf-app:not(.is-result) .pzcf-question { min-height: 0; height: auto; align-self: stretch; overflow: hidden; }
  .pzcf-app:not(.is-result) .pzcf-options { min-height: 0; flex: 1 1 auto; align-content: start; overflow-x: hidden; overflow-y: auto; padding-bottom: 84px; scrollbar-color: rgba(0,122,112,.35) transparent; scrollbar-width: thin; }
  .pzcf-app:not(.is-result) .pzcf-question__actions { position: absolute; z-index: 5; inset: auto 2px 0; min-height: 76px; margin: 0; padding: 16px 8px 8px; background: linear-gradient(180deg,rgba(250,252,251,0),rgba(250,252,251,.97) 24%,#fafcfb 52%); }
  .pzcf-app.is-result .pzcf-app__body { height: auto; }
}

@media (max-width: 1240px) {
  .pzcf-hero__layout { grid-template-columns: minmax(0,.92fr) minmax(470px,1.08fr); gap: 44px; }
  .pzcf-hero__instrument { min-height: 310px; padding-inline: 24px; }
  .pzcf-app__body { grid-template-columns: minmax(0,1fr) 310px; }
  .pzcf-options { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .pzcf-options--applications { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .pzcf-options--lengths { grid-template-columns: repeat(auto-fit,minmax(86px,1fr)); }
  .pzcf-progress li strong { font-size: 10px; }
  .pzcf-history button { width: 42px; justify-content: center; overflow: hidden; white-space: nowrap; color: transparent; gap: 0; font-size: 0; }
  .pzcf-history button span { display: none; }
  .pzcf-history button::before { color: #455256; font: 700 17px/1 Arial,sans-serif; }
  .pzcf-history [data-pzcf-undo]::before { content: "↶"; }
  .pzcf-history [data-pzcf-reset]::before { content: "↺"; }
  .pzcf-method__scene { grid-template-columns: 1fr; }
  .pzcf-product-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}

@media (max-width: 1020px) {
  .pzcf-hero { min-height: auto; padding-block: 36px; }
  .pzcf-hero__layout { grid-template-columns: 1fr; }
  .pzcf-hero__copy { max-width: 830px; }
  .pzcf-hero__instrument { min-height: 320px; }
  .pzcf-progress { grid-template-columns: minmax(0,1fr) auto; grid-template-areas: "mode history" "steps steps"; }
  .pzcf-mode { grid-area: mode; width: max-content; }
  .pzcf-progress ol { grid-area: steps; }
  .pzcf-history { grid-area: history; }
  .pzcf-app__body { grid-template-columns: 1fr; }
  .pzcf-builder { padding-bottom: 8px; }
  .pzcf-question__actions { position: sticky; z-index: 5; bottom: 8px; padding: 18px 8px 6px; background: linear-gradient(180deg,transparent,rgba(250,252,251,.97) 25%); }
  .pzcf-inspector { min-height: 0; display: grid; grid-template-columns: .9fr 1.1fr; gap: 28px; padding: 26px; border-left: 0; border-top: 1px solid rgba(255,255,255,.08); }
  .pzcf-inspector__top h3 { min-height: auto; }
  .pzcf-spec-list { margin-top: 0; }
  .pzcf-inspector__validation { grid-column: 1; margin-top: 0; }
  .pzcf-inspector__foot { grid-column: 2; grid-row: 2; align-self: end; }
  .pzcf-options--applications { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .pzcf-result__hero { grid-template-columns: 1fr .72fr; }
  .pzcf-app.is-result .pzcf-result { grid-template-columns: 1fr; }
  .pzcf-app.is-result .pzcf-result__hero, .pzcf-app.is-result .pzcf-result__section--bom, .pzcf-app.is-result .pzcf-result__note, .pzcf-app.is-result .pzcf-result__actions, .pzcf-app.is-result .pzcf-catalog { grid-column: 1; grid-row: auto; }
  .pzcf-catalog__toolbar { top: 78px; }
}

@media (max-width: 820px) {
  .pzcf-shell { width: min(100% - 28px, 720px); }
  .pzcf-hero { padding-block: 30px 36px; }
  .pzcf-breadcrumb { margin-bottom: 16px; }
  .pzcf-hero h1 { font-size: clamp(34px,7vw,49px); }
  .pzcf-hero__actions { align-items: flex-start; flex-direction: column; gap: 18px; }
  .pzcf-hero__instrument { min-height: 280px; grid-template-columns: 1fr 70px 1fr; padding: 28px 22px 82px; border-radius: 26px; }
  .pzcf-hero__terminal img { height: 130px; }
  .pzcf-hero__readout { inset: auto 18px 18px; }
  .pzcf-progress { grid-template-columns: 1fr auto; padding: 10px 14px; }
  .pzcf-progress ol { display: flex; }
  .pzcf-progress li { flex: 1 1 0; }
  .pzcf-progress li button { grid-template-columns: 26px; padding: 0; }
  .pzcf-progress li span { width: 26px; height: 26px; }
  .pzcf-progress li:not(:last-child)::after { left: 26px; top: 13px; }
  .pzcf-progress li strong { display: none; }
  .pzcf-builder { display: block; }
  .pzcf-stage { min-height: 340px; padding-inline: 24px; }
  .pzcf-question { min-height: 430px; padding-top: 28px; }
  .pzcf-stage__connection { grid-template-columns: 1fr 68px 1fr; }
  .pzcf-end__image { height: 125px; }
  .pzcf-end strong { min-height: 34px; font-size: 10px; }
  .pzcf-options--applications { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .pzcf-options--lengths { grid-template-columns: repeat(4,minmax(0,1fr)); }
  .pzcf-config-fields { grid-template-columns: 1fr; }
  .pzcf-inspector { grid-template-columns: 1fr; }
  .pzcf-inspector__validation, .pzcf-inspector__foot { grid-column: 1; grid-row: auto; }
  .pzcf-result__hero { grid-template-columns: 1fr; }
  .pzcf-result__media { grid-row: 1; min-height: 210px; }
  .pzcf-result__actions { grid-template-columns: 1fr; }
  .pzcf-bom__item { grid-template-columns: 48px minmax(0,1fr) auto; }
  .pzcf-bom__sku { grid-column: 2; grid-row: 1; }
  .pzcf-bom__copy { grid-column: 2; grid-row: 2; }
  .pzcf-bom__image { grid-row: 1 / span 2; }
  .pzcf-bom__qty { grid-column: 3; grid-row: 1 / span 2; }
  .pzcf-method__outcome { min-height: 120px; }
  .pzcf-choice-grid { grid-template-columns: 1fr; }
  .pzcf-catalog__toolbar { position: static; grid-template-columns: 1fr; }
  .pzcf-catalog__modes { width: 100%; }
  .pzcf-catalog__modes button { flex: 1; }
  .pzcf-catalog__filters { overflow-x: auto; padding-bottom: 3px; }
  .pzcf-catalog__filters label { min-width: max-content; }
}

@media (max-width: 560px) {
  .pzcf-shell { width: calc(100% - 20px); }
  .pzcf-hero { padding: 24px 0 32px; }
  .pzcf-breadcrumb { margin-bottom: 14px; font-size: 8px; }
  .pzcf-hero h1 { font-size: clamp(31px,10vw,43px); line-height: 1.09; letter-spacing: -.04em; }
  .pzcf-hero__lead { margin-top: 22px; font-size: 16px; line-height: 1.58; }
  .pzcf-hero__actions .pzcf-button { width: 100%; }
  .pzcf-hero__instrument { min-height: 230px; grid-template-columns: 1fr 38px 1fr; margin-top: 12px; padding: 24px 10px 78px; border-radius: 22px; }
  .pzcf-hero__terminal img { height: 96px; }
  .pzcf-hero__terminal--a { transform: rotate(-10deg) translateX(5%); }
  .pzcf-hero__terminal--b { transform: scaleX(-1) rotate(-10deg) translateX(5%); }
  .pzcf-hero__cable span { height: 12px; }
  .pzcf-hero__readout { inset: auto 10px 10px; gap: 4px 12px; padding: 14px; border-radius: 15px; }
  .pzcf-hero__readout small { padding-right: 10px; font-size: 6px; }
  .pzcf-hero__readout strong { font-size: 10px; }
  .pzcf-hero__readout span { font-size: 9px; }
  .pzcf-work { padding: 8px 0 40px; }
  .pzcf-mode { width: 100%; }
  .pzcf-mode button { padding-inline: 8px; }
  .pzcf-app { border-radius: 24px; }
  .pzcf-progress { min-height: 68px; grid-template-areas: "mode mode" "steps history"; gap: 9px 8px; padding: 9px 10px 10px; }
  .pzcf-history button { width: 38px; min-height: 38px; }
  .pzcf-builder { padding: 8px; }
  .pzcf-stage { min-height: 300px; padding: 54px 12px 78px; border-radius: 19px; }
  .pzcf-stage__status { left: 15px; top: 15px; }
  .pzcf-stage__connection { min-height: 170px; grid-template-columns: 1fr 28px 1fr; gap: 0; }
  .pzcf-end__role { left: 1px; width: 25px; height: 25px; }
  .pzcf-end__image { height: 98px; }
  .pzcf-end small { margin-top: 6px; font-size: 6px; }
  .pzcf-end strong { max-width: 130px; min-height: 31px; font-size: 8px; line-height: 1.4; }
  .pzcf-line span { height: 9px; margin-inline: -35%; }
  .pzcf-stage__meta { inset: auto 8px 8px; }
  .pzcf-stage__meta span { padding: 8px; }
  .pzcf-stage__meta small { font-size: 6px; }
  .pzcf-stage__meta strong { font-size: 8px; }
  .pzcf-question { min-height: 410px; padding: 26px 2px 4px; }
  .pzcf-question__head { display: grid; gap: 14px; padding-inline: 8px; }
  .pzcf-question__head h3 { font-size: 24px; }
  .pzcf-question__head p { font-size: 14px; }
  .pzcf-swap { width: max-content; }
  .pzcf-options { grid-template-columns: 1fr; margin-top: 20px; padding: 0 4px; }
  .pzcf-options--applications { grid-template-columns: 1fr; }
  .pzcf-options--applications .pzcf-option { min-height: 118px; }
  .pzcf-options--applications .pzcf-option__visual img { width: 55%; }
  .pzcf-options--lengths { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .pzcf-option { min-height: 72px; }
  .pzcf-question__actions { position: sticky; z-index: 4; bottom: 8px; padding: 18px 4px 4px; background: linear-gradient(180deg,transparent,rgba(250,252,251,.96) 24%); }
  .pzcf-question__actions .pzcf-button { min-height: 49px; }
  .pzcf-question__actions .pzcf-button--primary { flex: 1; }
  .pzcf-inspector { padding: 26px 20px; }
  .pzcf-result { gap: 12px; }
  .pzcf-result__hero, .pzcf-result__section { padding: 16px; border-radius: 17px; }
  .pzcf-result__section--bom { padding: 0; }
  .pzcf-result__section--bom .pzcf-result__bom-head { padding: 18px; }
  .pzcf-result__section--bom .pzcf-result__bom-head h4 { font-size: 21px; }
  .pzcf-result__bom-count { min-width: 62px; padding-left: 12px; }
  .pzcf-result__section--bom .pzcf-bom { padding: 8px; }
  .pzcf-result__facts { grid-template-columns: 1fr; }
  .pzcf-bom__item { grid-template-columns: 44px minmax(0,1fr); padding: 9px; }
  .pzcf-bom__image { width: 44px; height: 44px; }
  .pzcf-bom__sku { grid-column: 2; }
  .pzcf-bom__copy { grid-column: 2; }
  .pzcf-bom__qty { grid-column: 2; grid-row: 3; }
  .pzcf-alternatives { grid-template-columns: 1fr; }
  .pzcf-result__actions .pzcf-button { white-space: normal; text-align: center; }
  .pzcf-app.is-result .pzcf-builder { padding: 8px; }
  .pzcf-choice-search { grid-template-columns: 1fr; gap: 7px; padding: 11px; }
  .pzcf-product-grid { grid-template-columns: 1fr; padding: 8px; }
  .pzcf-catalog { border-radius: 18px; }
  .pzcf-catalog__head { min-height: 0; grid-template-columns: 1fr; gap: 22px; padding: 24px 18px; }
  .pzcf-catalog__head > strong { min-width: 0; width: max-content; padding: 0; border: 0; }
  .pzcf-catalog__toolbar { padding: 8px; }
  .pzcf-catalog__modes { display: grid; grid-template-columns: 1fr; }
  .pzcf-catalog__filters { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); overflow: visible; margin-inline: 0; padding: 0; }
  .pzcf-catalog__filters > button { min-width: 0; padding-inline: 5px; }
  .pzcf-catalog__filters label { grid-column: 1 / -1; width: 100%; justify-content: space-between; margin: 3px 0 0; }
  .pzcf-catalog__filters select { min-width: 0; flex: 1; }
  .pzcf-product-family__media { min-height: 190px; }
  .pzcf-variant-row { grid-template-columns: minmax(0,1fr) auto 12px; }
  .pzcf-variant-row em { display: none; }
  .pzcf-catalog__more { width: calc(100% - 16px); margin: 0 8px 8px; }
  .pzcf-method { padding-bottom: 80px; }
  .pzcf-method__scene { width: calc(100% - 20px); padding: 30px 20px; border-radius: 24px; }
  .pzcf-method__lead h2 { font-size: 28px; }
  .pzcf-method__checks { display: grid; grid-template-columns: repeat(3,1fr); }
  .pzcf-method__checks span { justify-content: center; padding-inline: 5px; font-size: 9px; }
  .pzcf-method__outcome { grid-template-columns: 42px minmax(0,1fr); gap: 13px; padding: 16px; }
  .pzcf-method__icon { width: 42px; height: 42px; border-radius: 13px; }
  .pzcf-method__outcome strong { font-size: 13px; }
}

.pzcf-comparison { grid-column: 1 / -1; padding: 24px; border: 1px solid var(--pzcf-teal); border-radius: 20px; background: #f5faf8; color: #203c38; }
.pzcf-comparison h4 { margin: 0 0 20px; font: 400 18px/1.5 var(--pzcf-display); }
.pzcf-comparison__head, .pzcf-comparison__row { display: grid; grid-template-columns: minmax(120px,.8fr) repeat(2,minmax(0,1fr)); gap: 16px; }
.pzcf-comparison__head { padding-bottom: 10px; font-weight: 600; }
.pzcf-comparison__row { padding: 14px 0; border-top: 1px solid #d1dfda; font: 400 14px/1.5 var(--pzcf-body); }
.pzcf-comparison__row > strong { font-weight: 600; }
.pzcf-comparison__row > strong small { display: block; margin-top: 4px; font: 500 12px/1.4 var(--pzcf-body); color: #80501b; }
.pzcf-comparison__row > span > small { display: none; }
@media (max-width: 600px) {
  .pzcf-comparison { padding: 18px; }
  .pzcf-comparison h4 { font-size: 17px; }
  .pzcf-comparison__head { display: none; }
  .pzcf-comparison__row { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
  .pzcf-comparison__row > strong { grid-column: 1 / -1; }
  .pzcf-comparison__row > strong small { display: inline; margin-left: 8px; }
  .pzcf-comparison__row > span > small { display: block; margin-bottom: 4px; color: #526b65; font-size: 12px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .pzcf *, .pzcf *::before, .pzcf *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; transition-duration: .01ms !important; }
}

@media (prefers-reduced-transparency: reduce) {
  .pzcf-mode, .pzcf-option, .pzcf-stage__meta, .pzcf-hero__readout { backdrop-filter: none; }
  .pzcf-mode, .pzcf-option { background: #f8faf9; }
  .pzcf-stage__meta, .pzcf-hero__readout { background: #101719; }
}

@media (prefers-contrast: more) {
  .pzcf-option, .pzcf-fieldset, .pzcf-result__section, .pzcf-method__outcome { border-color: #455254; }
  .pzcf-option.is-selected { border-width: 2px; }
  .pzcf-inspector { background: #0c1213; }
}

/* Give the order summary its own row before the columns become cramped. */
@media(min-width:1021px) and (max-width:1240px){.pzcf-app.is-result .pzcf-result{grid-template-columns:minmax(0,1fr)}.pzcf-app.is-result .pzcf-result__hero,.pzcf-app.is-result .pzcf-result__section--bom{grid-column:1;grid-row:auto}.pzcf-app.is-result .pzcf-result__hero{min-height:0}}
.pzcf-result__facts{grid-template-columns:repeat(3,minmax(0,1fr))}.pzcf-result__facts span{min-width:0}.pzcf-result__facts small{font-size:10px;line-height:1.4}.pzcf-result__facts strong{font-size:13px;line-height:1.45}.pzcf-result__label{font-size:10px}

/* Keep connector names readable instead of squeezing them into a third-column sliver. */
.pzcf-result__facts{grid-template-columns:repeat(2,minmax(0,1fr))}.pzcf-result__facts>span:first-child{grid-column:1/-1;grid-template-columns:minmax(82px,.35fr) minmax(0,1fr);align-items:baseline;column-gap:12px}.pzcf-result__facts small{overflow-wrap:anywhere}