.ps-catalog {
  --ps-ink: #162025;
  --ps-muted: #59676e;
  --ps-line: #dce3e6;
  --ps-blue: #124fba;
  --ps-tint: #edf4ff;
  color: var(--ps-ink);
  font: 15px/1.5 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  max-width: 1440px;
  margin: 0 auto;
  padding: 24px 40px 72px;
}
.ps-catalog *, .ps-preview * { box-sizing: border-box; }
.ps-catalog [hidden], .ps-preview [hidden] { display: none !important; }
.ps-catalog a { color: inherit; text-decoration: none; }
.ps-catalog button, .ps-catalog input { font: inherit; }
.ps-catalog button { cursor: pointer; }
.ps-catalog :focus-visible, .ps-preview :focus-visible { outline: 3px solid #225fdb; outline-offset: 4px; }
.ps-breadcrumbs { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; color: var(--ps-muted); font-size: 12px; }
.ps-breadcrumbs a:hover { color: var(--ps-blue); text-decoration: underline; }
.ps-breadcrumbs > span[aria-hidden] { color: #a9b4b8; }
.ps-breadcrumbs [aria-current] { color: var(--ps-ink); }
.ps-heading { margin: 46px 0 38px; }
.ps-eyebrow { margin: 0 0 12px; text-transform: uppercase; font-size: 11px; font-weight: 750; letter-spacing: .15em; color: #124fba; }
.ps-heading h1 { margin: 0 0 14px; font-size: clamp(32px, 4vw, 54px); line-height: 1.1; font-weight: 750; letter-spacing: -.045em; }
.ps-description { color: var(--ps-muted); margin: 0; max-width: 800px; }
.ps-results-heading { display: flex; justify-content: space-between; align-items: center; color: var(--ps-muted); font-size: 12px; border-bottom: 1px solid var(--ps-line); padding-bottom: 14px; margin-bottom: 24px; }
.ps-results-heading > span:first-child { font-weight: 650; color: var(--ps-ink); }
.ps-card-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 24px; }
.ps-card { display: flex; flex-direction: column; border: 1px solid var(--ps-line); border-radius: 6px; overflow: hidden; background: white; transition: border-color .15s, box-shadow .15s; }
.ps-card:hover { border-color: #9bacb7; box-shadow: 0 8px 24px #1620250b; }
.ps-card-image { aspect-ratio: 1.5; padding: 14px; background: #f6f8f9; display: flex; align-items: center; justify-content: center; }
.ps-card-image img { width: 100%; height: 100%; object-fit: contain; mix-blend-mode: multiply; }
.ps-card-content { padding: 20px; flex: 1; display: flex; flex-direction: column; }
.ps-card-detail { margin: 0 0 6px; font-size: 10px; letter-spacing: .08em; text-transform: uppercase; color: var(--ps-muted); overflow-wrap: anywhere; }
.ps-card h2 { margin: 0 0 20px; font-size: 21px; line-height: 1.25; font-weight: 700; letter-spacing: -.025em; overflow-wrap: anywhere; }
.ps-card-action { margin-top: auto; padding-top: 14px; border-top: 1px solid #edf0f2; font-size: 12px; color: var(--ps-blue); font-weight: 650; display: flex; justify-content: space-between; }
.ps-placeholder { color: #687780; font-size: 13px; text-align: center; padding: 32px 16px; }
.ps-placeholder-large { min-height: 400px; display: flex; justify-content: center; align-items: center; flex-direction: column; gap: 12px; background: #f6f8f9; font-weight: 600; }
.ps-placeholder-large span { max-width: 270px; font-weight: 400; font-size: 12px; }
.ps-diagram-layout { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: 30px; align-items: start; }
.ps-diagram-panel { position: sticky; top: 20px; border: 1px solid var(--ps-line); border-radius: 6px; overflow: hidden; }
.ps-panel-heading { display: flex; justify-content: space-between; gap: 12px; padding: 15px 18px; background: #f6f8f9; border-bottom: 1px solid var(--ps-line); font-size: 10px; font-weight: 700; letter-spacing: .11em; }
.ps-panel-heading > span:last-child { color: var(--ps-muted); font-weight: 500; }
.ps-diagram-image { position: relative; background: white; }
.ps-diagram-image > img { display: block; width: 100%; height: auto; }
.ps-hotspots { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.ps-hotspots rect { fill: transparent; stroke: transparent; stroke-width: 2; vector-effect: non-scaling-stroke; cursor: pointer; pointer-events: all; }
.ps-hotspots rect:hover, .ps-hotspots rect:focus-visible, .ps-hotspots rect.ps-highlighted { fill: #327bf033; stroke: #125ecc; outline: none; }
.ps-hotspots rect.ps-selected { fill: #327bf055; stroke: #125ecc; }
.ps-diagram-hint { margin: 0; padding: 14px 18px; border-top: 1px solid var(--ps-line); font-size: 11px; color: var(--ps-muted); }
.ps-status-dot { display: inline-block; width: 6px; height: 6px; background: #2867d4; border-radius: 50%; margin-right: 7px; vertical-align: 1px; }
.ps-parts-panel { min-width: 0; border: 1px solid var(--ps-line); border-radius: 6px; overflow: hidden; }
.ps-table-scroll { overflow-x: auto; }
.ps-parts-table { width: 100%; border-collapse: collapse; text-align: left; }
.ps-parts-table th { padding: 12px 16px; font-size: 10px; font-weight: 550; color: var(--ps-muted); border-bottom: 1px solid var(--ps-line); white-space: nowrap; }
.ps-parts-table th:nth-child(2) { text-align: center; }
.ps-parts-table td { padding: 17px 16px; border-bottom: 1px solid #e9edef; vertical-align: top; transition: background .12s; }
.ps-parts-table td:first-child { min-width: 155px; }
.ps-parts-table tr:last-child td { border-bottom: 0; }
.ps-parts-table tr.ps-highlighted td { background: #edf4ff; }
.ps-parts-table tr.ps-selected td { background: #e4efff; }
.ps-parts-table tr.ps-selected td:first-child { box-shadow: inset 3px 0 #125ecc; }
.ps-part-select { border: 0; padding: 0; background: transparent; color: var(--ps-blue); font-size: 12px !important; font-weight: 700 !important; text-align: left; overflow-wrap: anywhere; }
.ps-part-select:hover { text-decoration: underline; }
.ps-part-name { display: block; margin-top: 5px; font-size: 11px; line-height: 1.5; color: #46565e; overflow-wrap: anywhere; }
.ps-part-status, .ps-part-replacement { display: block; margin-top: 6px; font-size: 10px; color: #86500c; }
.ps-required-qty { font-size: 12px; text-align: center; }
.ps-part-price { display: block; margin-top: 6px; font-size: 11px; overflow-wrap: anywhere; }
.ps-order { display: flex; align-items: center; gap: 6px; }
.ps-order input { width: 48px; min-height: 36px; border: 1px solid #c8d2d8; border-radius: 3px; padding: 4px; text-align: center; font-size: 12px; background: white; color: var(--ps-ink); }
.ps-order input::-webkit-inner-spin-button { opacity: 1; }
.ps-add { border: 1px solid #162025; border-radius: 3px; background: #162025; color: white; padding: 7px 10px; min-height: 36px; font-size: 11px !important; white-space: nowrap; }
.ps-add span { margin-left: 6px; }
.ps-add:hover { background: #124fba; border-color: #124fba; }
.ps-add:disabled { background: #eef1f3; border-color: #dce3e6; color: #687780; cursor: not-allowed; }
.ps-notice { margin: 0; border-top: 1px solid var(--ps-line); padding: 15px 18px; font-size: 10px; color: var(--ps-muted); line-height: 1.7; }
.ps-cart-help { margin: 0; padding: 14px 18px; background: #fff7e5; font-size: 12px; color: #784e11; }
.ps-feedback { margin: 0; padding: 0 18px 12px; font-size: 12px; color: var(--ps-blue); }
.ps-feedback:empty { padding: 0; }
.ps-page-nav { margin-top: 28px; display: flex; justify-content: space-between; gap: 20px; }
.ps-page-nav a { display: flex; flex-direction: column; gap: 5px; font-size: 13px; font-weight: 650; }
.ps-page-nav a:last-child { text-align: right; }
.ps-page-nav a span { font-size: 10px; font-weight: 400; color: var(--ps-muted); }
.ps-page-nav a:hover { color: var(--ps-blue); }

/* Shared shell styling; local previews also include the simulated cart. */
.ps-preview { margin: 0; background: #fff; color: #162025; font: 14px/1.5 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
.ps-site-header { background: #11191d; color: white; }
.ps-site-header-inner { max-width: 1440px; margin: auto; padding: 24px 40px; display: flex; justify-content: space-between; align-items: center; gap: 20px; }
.ps-wordmark { font-size: 28px; font-weight: 850; line-height: 1; font-style: italic; letter-spacing: -.055em; color: white; text-decoration: none; }
.ps-wordmark > span { color: #a8c4f2; }
.ps-wordmark small { display: block; font-size: 7px; font-style: normal; font-weight: 500; letter-spacing: .2em; margin-top: 9px; color: #c0c9ce; }
.ps-header-right { display: flex; align-items: center; gap: 26px; }
.ps-preview-label { font-size: 9px; letter-spacing: .14em; color: #c0c9ce; }
.ps-demo-cart { border: 1px solid #435158; border-radius: 4px; background: transparent; color: white; padding: 9px 13px; cursor: pointer; font: inherit; font-size: 11px; }
.ps-demo-cart > span { display: inline-block; background: #dbe8ff; color: #172d4a; min-width: 19px; border-radius: 3px; margin-left: 8px; font-size: 10px; }
.ps-preview-banner { padding: 9px 40px; background: #eef3f8; border-bottom: 1px solid #e0e7ec; text-align: center; font-size: 9px; font-weight: 700; letter-spacing: .06em; color: #3d5264; }
.ps-preview-banner > span { margin-left: 12px; font-weight: 400; letter-spacing: 0; }
.ps-site-footer { max-width: 1360px; margin: 0 auto; border-top: 1px solid #dce3e6; padding: 26px 0; color: #59676e; display: flex; align-items: center; gap: 25px; font-size: 10px; }
.ps-footer-brand { text-decoration: none; color: #162025; font-weight: 800; font-style: italic; letter-spacing: -.04em; font-size: 15px; }
.ps-site-footer > span:last-child { margin-left: auto; }
.ps-skip { position: absolute; top: -100px; left: 20px; padding: 12px; background: white; color: #124fba; z-index: 10; }
.ps-skip:focus { top: 10px; }
.ps-cart-dialog { max-width: min(480px, calc(100% - 32px)); width: 100%; border: 1px solid #dce3e6; padding: 32px; border-radius: 8px; color: #162025; }
.ps-cart-dialog::backdrop { background: #11191d88; }
.ps-cart-dialog h2 { font-size: 27px; letter-spacing: -.04em; }
.ps-cart-dialog p { color: #59676e; font-size: 13px; }
.ps-cart-dialog ul { padding: 0; list-style: none; }
.ps-cart-dialog li { padding: 12px 0; border-bottom: 1px solid #dce3e6; font-size: 13px; }
.ps-close { position: absolute; top: 12px; right: 16px; border: 0; background: none; font-size: 26px; cursor: pointer; }
.ps-clear-cart { border: 1px solid #c8d2d8; border-radius: 3px; background: white; padding: 9px 13px; cursor: pointer; }
@media (min-width: 1600px) { .ps-diagram-layout { gap: 40px; } }
@media (max-width: 1000px) {
  .ps-diagram-layout { grid-template-columns: 1fr; gap: 24px; }
  .ps-diagram-panel { position: static; }
  .ps-diagram-image { max-width: 650px; margin: 0 auto; }
  .ps-site-footer { margin: 0 24px; }
}
@media (max-width: 600px) {
  .ps-catalog { padding: 20px 18px 45px; }
  .ps-heading { margin: 30px 0; }
  .ps-description { font-size: 13px; }
  .ps-breadcrumbs { gap: 7px; font-size: 10px; }
  .ps-card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
  .ps-card-content { padding: 13px; }
  .ps-card h2 { font-size: 17px; margin-bottom: 14px; }
  .ps-card-detail { font-size: 9px; }
  .ps-card-action { font-size: 10px; }
  .ps-card-image { padding: 8px; }
  .ps-site-header-inner { padding: 21px 18px; }
  .ps-wordmark { font-size: 24px; }
  .ps-preview-label { display: none; }
  .ps-preview-banner { padding: 8px 18px; }
  .ps-preview-banner > span { display: block; margin: 3px 0 0; font-size: 9px; }
  .ps-parts-table td { padding: 14px 10px; }
  .ps-parts-table th { padding: 11px 10px; }
  .ps-parts-table td:first-child { min-width: 135px; }
  .ps-order input { width: 41px; }
  .ps-add { padding: 7px 9px; }
  .ps-add span { display: none; }
  .ps-site-footer { margin: 0 18px; flex-wrap: wrap; gap: 10px 20px; }
  .ps-site-footer > span:last-child { margin-left: 0; }
}
@media (prefers-reduced-motion: reduce) { .ps-catalog * { transition: none !important; scroll-behavior: auto !important; } }

.ps-cart-toggle { display: inline-flex; align-items: center; gap: 8px; color: white; background: #26343b; border: 1px solid #657078; border-radius: 4px; padding: 10px 14px; cursor: pointer; }
.ps-cart-toggle[hidden] { display: none; }
.ps-shopping-cart { position: fixed; inset: 0 0 0 auto; margin: 0; box-sizing: border-box; width: min(360px, 100vw); height: 100dvh; max-height: 100dvh; max-width: 100vw; padding: 20px; border: 0; color: #162025; }
.ps-shopping-cart[open] { display: flex; flex-direction: column; gap: 12px; }
.ps-shopping-cart::backdrop { background: rgb(0 0 0 / .4); }
.ps-shopping-cart header { display: flex; justify-content: space-between; align-items: center; }
.ps-shopping-cart h2, .ps-shopping-cart p { margin: 0; }
.ps-shopping-cart ul { list-style: none; margin: 0; padding: 0; flex: 1; min-height: 0; overflow-y: auto; }
.ps-shopping-cart li { padding: 16px 0; border-bottom: 1px solid #ddd; overflow-wrap: anywhere; }
.ps-shopping-cart li img { float: right; object-fit: contain; margin-left: 8px; }
.ps-shopping-cart li p { margin-bottom: 8px; }
.ps-shopping-cart li div { display: flex; align-items: center; gap: 12px; }
.ps-shopping-cart button { min-height: 36px; cursor: pointer; }
.ps-shopping-cart button:disabled { cursor: default; opacity: .5; }
.ps-shopping-cart footer { border-top: 1px solid #ddd; padding-top: 16px; }
.ps-shopping-cart footer button { margin-top: 12px; width: 100%; background: #1557b0; color: white; border: 0; padding: 10px; }
