
  :root{
    --bg:#eef1f3;
    --bg-line:#d9dfe3;
    --ink:#1d2025;
    --ink-soft:#4a5158;
    --nav:#3b4048;
    --nav-2:#101a22;
    --dark:#0e1821;
    --dark-2:#122130;
    --dark-3:#182b3b;
    --light-card:#f6f7f8;
    --light-card-2:#eef2f4;
    --line:#cfd7dc;
    --line-dark:#33424e;
    --orange:#f36c21;
    --orange-2:#ff8b3d;
    --teal:#00bfd0;
    --white:#ffffff;
    --safe-top:env(safe-area-inset-top,0px);
    --safe-bottom:env(safe-area-inset-bottom,0px);
    --shadow:0 12px 34px rgba(0,0,0,.14);
  }
  *{box-sizing:border-box}
  html{background:var(--bg);scroll-behavior:smooth}
  body.sp-cas-standalone-page{
    margin:0;
    font-family:Inter, Arial, sans-serif;
    color:var(--ink);
    background:
      repeating-linear-gradient(90deg, transparent 0, transparent 102px, rgba(0,0,0,.035) 102px, rgba(0,0,0,.035) 103px),
      linear-gradient(180deg,#f2f4f5 0%, #edf1f3 100%);
    -webkit-font-smoothing:antialiased;
    min-height:100vh;
  }
  img{max-width:100%;display:block}
  button{font:inherit}
  button:focus-visible,.hotspot:focus-visible{outline:2px solid var(--orange);outline-offset:2px}
  .sp-cas-app{max-width:1400px;margin:0 auto;background:transparent}

  .topbar{
    position:sticky;top:0;z-index:80;
    display:flex;align-items:center;justify-content:space-between;gap:14px;
    min-height:78px;
    padding:calc(12px + var(--safe-top)) 22px 12px;
    background:linear-gradient(90deg, var(--nav) 0%, #3f454d 40%, var(--nav-2) 100%);
    border-bottom:1px solid rgba(255,255,255,.09);
    box-shadow:0 2px 0 rgba(0,0,0,.08);
  }
  .brand{display:flex;align-items:center;gap:16px;min-width:0}
  .brand-logo{width:220px;max-width:54vw;height:auto}
  .brand-meta{display:flex;flex-direction:column;gap:4px;min-width:0}
  .brand-kicker,.brand-sub{
    text-transform:uppercase;font-size:10px;letter-spacing:.18em;line-height:1.1;color:#fff;white-space:nowrap
  }
  .brand-sub{color:#cfd7dd}
  .top-actions{display:flex;gap:8px}
  .icon-btn{
    width:44px;height:44px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.04);color:#fff;display:grid;place-items:center;cursor:pointer
  }
  .icon-btn svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:2}

  .hero{
    padding:18px 22px 0;
  }
  .hero-panel{
    display:grid;grid-template-columns:1.08fr .92fr;align-items:stretch;
    background:linear-gradient(90deg, #0f1820 0%, #0d1822 58%, #142637 100%);
    min-height:430px; box-shadow:var(--shadow); position:relative; overflow:hidden;
  }
  .hero-panel::before{content:'';position:absolute;left:0;top:0;width:6px;height:100%;background:var(--orange)}
  .hero-copy{padding:48px 40px 34px 48px;color:#fff;display:flex;flex-direction:column;justify-content:center;position:relative;z-index:1}
  .eyebrow{display:flex;align-items:center;gap:10px;font-size:11px;font-weight:800;letter-spacing:.2em;text-transform:uppercase;color:#d9e2e7}
  .eyebrow:before{content:'';width:42px;height:2px;background:var(--orange)}
  .hero h1{margin:16px 0 0;font-size:clamp(42px,7vw,72px);line-height:.92;letter-spacing:-.06em;font-weight:900;text-transform:uppercase;max-width:640px}
  .hero h1 span{color:var(--teal)}
  .hero p{margin:18px 0 22px;max-width:620px;color:#dde7eb;font-size:17px;line-height:1.55}
  .hero-actions{display:flex;gap:12px;flex-wrap:wrap}
  .btn{min-height:50px;padding:13px 18px;font-weight:800;text-transform:uppercase;letter-spacing:.08em;cursor:pointer;border:1px solid transparent;transition:transform .15s ease, background .15s ease}
  .btn:hover{transform:translateY(-1px)}
  .btn:active{transform:translateY(1px)}
  .btn-primary{background:var(--orange);color:#fff;border-color:var(--orange)}
  .btn-secondary{background:transparent;color:#fff;border-color:rgba(255,255,255,.22)}
  .hero-trust{display:flex;gap:18px;flex-wrap:wrap;margin-top:18px;color:#dce3e7;font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.14em}
  .hero-trust span{display:flex;align-items:center;gap:7px}
  .hero-trust i{width:7px;height:7px;background:var(--orange);display:inline-block;transform:rotate(45deg)}

  .hero-visual{position:relative;display:flex;align-items:stretch;justify-content:center;padding:38px 30px 30px;background:
      linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02)),
      linear-gradient(145deg, rgba(0,191,208,.08), transparent 40%, rgba(243,108,33,.08) 100%);
  }
  .hero-visual::after{content:'';position:absolute;inset:0;background:url('https://sulpaltesting.wpenginepowered.com/wp-content/uploads/2026/08/equipment-in-machine-shop-2026-01-09-10-23-39-123utc.jpg') center/cover no-repeat;opacity:.12;mix-blend-mode:screen}
  .hero-card{position:relative;z-index:1;align-self:center;width:min(100%, 560px);background:#0f1a22;border:1px solid rgba(255,255,255,.08);box-shadow:0 24px 60px rgba(0,0,0,.28)}
  .hero-card::before{content:'';position:absolute;left:0;top:0;right:0;height:4px;background:linear-gradient(90deg,var(--orange), var(--teal))}
  .hero-card img{aspect-ratio:1468/498;object-fit:cover}
  .hero-card-overlay{position:absolute;left:0;right:0;bottom:0;padding:16px;background:linear-gradient(180deg, transparent, rgba(8,14,18,.95));color:#fff}
  .hero-card-overlay strong{display:block;font-size:14px;font-weight:900;letter-spacing:.08em;text-transform:uppercase}
  .hero-card-overlay span{display:block;margin-top:6px;font-size:12px;color:#d6e0e4}

  .explorer{padding:26px 0 34px}
  .section-head{display:flex;justify-content:space-between;align-items:flex-end;gap:18px;padding:0 22px 16px}
  .section-head h2{margin:0;font-size:48px;line-height:.92;font-weight:900;text-transform:uppercase;letter-spacing:-.05em}
  .section-head h2 span{color:var(--teal)}
  .section-head p{margin:10px 0 0;max-width:760px;color:var(--ink-soft);font-size:15px;line-height:1.5}
  .status-pill{padding:10px 14px;font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;border:1px solid var(--line);background:#fff;color:#20262b;white-space:nowrap}

  .mode-tabs{display:grid;grid-template-columns:repeat(4, minmax(0,1fr));gap:14px;padding:0 22px 18px}
  .mode-tab{
    min-height:54px;padding:10px 12px;border:1px solid var(--line);background:#fff;color:#55606a;
    display:flex;align-items:center;justify-content:center;gap:9px;cursor:pointer;
    font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.09em
  }
  .mode-tab svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2}
  .mode-tab.active{background:var(--light-card);color:#1f252a;box-shadow:inset 0 -3px 0 var(--orange)}

  .explorer-card{margin:0 22px;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow);overflow:hidden}
  .scene-toolbar{
    display:flex;justify-content:space-between;align-items:center;gap:12px;padding:14px 16px;
    background:linear-gradient(90deg, var(--dark) 0%, var(--dark-2) 100%);color:#fff;border-bottom:1px solid rgba(255,255,255,.08)
  }
  .scene-toolbar strong{color:#fff}
  .scene-toolbar span{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.12em;color:#d2dce2}
  .legend{display:flex;align-items:center;gap:12px;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.09em}
  .legend span{display:flex;align-items:center;gap:6px}
  .legend i{width:10px;height:10px;border:2px solid currentColor;display:inline-block}
  .legend .air{color:var(--teal)} .legend .cond{color:var(--orange)}

  .tour-indicator{
    display:flex;align-items:center;gap:16px;padding:14px 16px;background:#f8fafb;border-bottom:1px solid var(--line)
  }
  .step-badge{position:relative;flex:0 0 54px;width:54px;height:54px;background:var(--dark);color:#fff;display:grid;place-items:center}
  .step-badge::after{content:'';position:absolute;left:0;top:0;width:4px;height:100%;background:var(--orange)}
  .step-badge.flash{animation:badgePulse .55s ease}
  @keyframes badgePulse{0%{transform:scale(.94)}60%{transform:scale(1.04)}100%{transform:scale(1)}}
  .step-number{font-size:22px;font-weight:900;letter-spacing:-.04em}
  .step-copy{flex:1;min-width:0}
  .step-copy strong{display:block;font-size:13px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;color:#1d2025}
  .step-copy span{display:block;margin-top:3px;color:#59626b;font-size:12px}
  .step-progress{display:flex;align-items:center;gap:10px;min-width:180px}
  .step-progress-label{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.1em;color:#24303a;white-space:nowrap}
  .step-progress-bar{position:relative;flex:1;height:8px;background:#dfe5e9}
  .step-progress-fill{position:absolute;left:0;top:0;bottom:0;width:0;background:linear-gradient(90deg,var(--orange), var(--teal));transition:width .35s ease}

  .scene-scroll{position:relative;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;-webkit-overflow-scrolling:touch;background:#d5d9de}
  .scene-scroll::-webkit-scrollbar{display:none}
  .scene-stage{position:relative;min-width:980px;aspect-ratio:1468/498;isolation:isolate}
  .scene-stage img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;user-select:none;-webkit-user-drag:none}
  .scene-overlay{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:3}
  .air-path,.cond-path{fill:none;stroke-linecap:round;stroke-linejoin:round;opacity:0;filter:drop-shadow(0 0 6px rgba(0,0,0,.38));transition:opacity .22s ease}
  .air-path{stroke:var(--teal);stroke-width:6;stroke-dasharray:15 11;animation:flowDash 1.2s linear infinite}
  .cond-path{stroke:var(--orange);stroke-width:5;stroke-dasharray:11 10;animation:flowDash 1.25s linear infinite}
  .flow-on.air .air-path{opacity:.98}
  .flow-on.cond .cond-path{opacity:.98}
  .drain-highlight{fill:rgba(243,108,33,.10);stroke:var(--orange);stroke-width:4;opacity:0;vector-effect:non-scaling-stroke;filter:drop-shadow(0 0 5px rgba(243,108,33,.48));transition:opacity .2s ease}
  .show-drain-highlights .drain-highlight{opacity:1;animation:drainPulse 1.45s ease-in-out infinite}
  .show-drain-highlights .drain-highlight:nth-child(2){animation-delay:.08s}
  .show-drain-highlights .drain-highlight:nth-child(3){animation-delay:.16s}
  .show-drain-highlights .drain-highlight:nth-child(4){animation-delay:.24s}
  .show-drain-highlights .drain-highlight:nth-child(5){animation-delay:.32s}
  @keyframes drainPulse{0%,100%{stroke-width:4;fill:rgba(243,108,33,.08)}50%{stroke-width:7;fill:rgba(243,108,33,.18)}}
  @keyframes flowDash{to{stroke-dashoffset:-52}}

  .hotspot{position:absolute;z-index:5;width:52px;height:52px;margin:-26px 0 0 -26px;border:0;background:transparent;padding:0;cursor:pointer;color:#fff}
  .hotspot-core{position:absolute;inset:7px;background:rgba(17,24,31,.92);display:grid;place-items:center;font-size:11px;font-weight:900;border:2px solid #fff;box-shadow:0 10px 18px rgba(0,0,0,.25)}
  .hotspot-label{position:absolute;left:50%;top:100%;transform:translateX(-50%);margin-top:6px;padding:5px 8px;background:rgba(17,24,31,.92);color:#fff;border:1px solid rgba(255,255,255,.12);font-size:9px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;white-space:nowrap;opacity:0;transition:opacity .18s ease}
  .hotspot:hover .hotspot-label,.hotspot.selected .hotspot-label{opacity:1}
  .hotspot.air .hotspot-core{box-shadow:inset 0 0 0 4px var(--teal),0 10px 18px rgba(0,0,0,.25)}
  .hotspot.cond .hotspot-core{box-shadow:inset 0 0 0 4px var(--orange),0 10px 18px rgba(0,0,0,.25)}
  .pulse-ring{position:absolute;inset:0;border:1px solid currentColor;opacity:0}
  .hotspot.selected .pulse-ring{opacity:1;animation:pulse 1.6s ease-out infinite}
  .hotspot.air{color:var(--teal)} .hotspot.cond{color:var(--orange)}
  .hotspot.dim{opacity:.16}
  @keyframes pulse{0%{transform:scale(.72);opacity:.92}100%{transform:scale(1.25);opacity:0}}
  .scene-caption{position:absolute;left:18px;bottom:16px;z-index:6;pointer-events:none;max-width:430px;padding:10px 12px 10px 14px;background:linear-gradient(90deg, rgba(15,24,32,.94), rgba(15,24,32,.74));color:#fff;font-size:10px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;border-left:4px solid var(--orange)}

  .step-rail{display:flex;gap:12px;align-items:stretch;padding:14px 16px;background:#f5f7f9;border-top:1px solid var(--line);overflow-x:auto;scrollbar-width:none}
  .step-rail::-webkit-scrollbar{display:none}
  .step-dot{flex:0 0 auto;display:flex;align-items:center;gap:8px;min-width:62px;padding:8px 10px;border:1px solid var(--line);background:#fff;color:#42505b;cursor:pointer}
  .step-dot:hover{background:#f3f6f8}
  .step-num{width:28px;height:28px;display:grid;place-items:center;background:var(--dark);color:#fff;font-size:11px;font-weight:900}
  .step-title{font-size:10px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;white-space:nowrap}
  .step-dot.active{border-color:#aebbc5;background:#f7f9fb;box-shadow:inset 0 -3px 0 var(--orange)}
  .step-dot.active .step-num{background:var(--orange)}
  .step-dot.cond.active .step-num{background:var(--orange)}

  .detail{margin:18px 22px 0;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow);position:relative}
  .detail::before{content:'';position:absolute;left:0;top:0;width:6px;height:100%;background:var(--teal)}
  .detail.cond-detail::before{background:var(--orange)}
  .detail-inner{padding:22px 22px 22px 28px}
  .detail-top{display:flex;justify-content:space-between;align-items:flex-start;gap:14px}
  .detail-title-wrap{display:flex;gap:14px;align-items:flex-start}
  .detail-step-box{width:58px;height:58px;background:var(--dark);color:#fff;display:grid;place-items:center;position:relative}
  .detail-step-box::after{content:'';position:absolute;left:0;top:0;width:4px;height:100%;background:var(--orange)}
  .detail-step-box span{font-size:22px;font-weight:900;letter-spacing:-.04em}
  .eyebrow-small{font-size:10px;font-weight:900;letter-spacing:.17em;text-transform:uppercase;color:var(--teal);margin-bottom:4px}
  .cond-detail .eyebrow-small{color:var(--orange)}
  .detail h3{margin:0;font-size:34px;line-height:.98;letter-spacing:-.04em;text-transform:uppercase}
  .tag{padding:9px 12px;border:1px solid var(--line);background:#f5f7f8;font-size:10px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:#42505b}
  .lead{margin:16px 0 0;font-size:17px;line-height:1.5;font-weight:650;color:#20252a;max-width:820px}
  .body{margin:10px 0 0;font-size:14px;line-height:1.7;color:#58616a;max-width:820px}
  .talking{margin-top:16px;padding:14px 14px 14px 16px;background:#f5f7f8;border-left:4px solid var(--orange)}
  .talking strong{display:block;font-size:10px;font-weight:900;letter-spacing:.15em;text-transform:uppercase;color:#d95d18;margin-bottom:5px}
  .talking span{font-size:13px;line-height:1.6;color:#293038}
  .detail-actions{margin-top:18px;display:flex;gap:8px;flex-wrap:wrap}
  .detail-actions .btn{min-height:44px;padding:11px 14px;font-size:12px}
  .btn-quiet{background:#fff;color:#20252a;border:1px solid var(--line)}

  .value-panel{display:none;margin:18px 22px 0}
  .value-intro{padding:18px 22px;background:linear-gradient(90deg, var(--dark) 0%, var(--dark-2) 100%);color:#fff;border-left:6px solid var(--orange);box-shadow:var(--shadow)}
  .value-intro h3{margin:0;font-size:32px;line-height:1;text-transform:uppercase;letter-spacing:-.03em}
  .value-intro p{margin:10px 0 0;max-width:820px;color:#d7e1e6;font-size:14px;line-height:1.6}
  .value-grid{display:grid;grid-template-columns:repeat(4, minmax(0,1fr));gap:14px;margin-top:14px}
  .value-card{background:#fff;border:1px solid var(--line);padding:18px 16px 16px;position:relative;box-shadow:var(--shadow)}
  .value-card::before{content:'';position:absolute;left:0;top:0;right:0;height:4px;background:var(--teal)}
  .value-card.orange::before{background:var(--orange)}
  .value-icon{width:42px;height:42px;display:grid;place-items:center;background:#f4f7f8;border:1px solid var(--line);margin-bottom:12px}
  .value-icon svg{width:22px;height:22px;stroke:var(--teal);fill:none;stroke-width:1.8}
  .orange .value-icon svg{stroke:var(--orange)}
  .value-card h4{margin:0 0 7px;font-size:17px;font-weight:900;line-height:1.05;text-transform:uppercase;letter-spacing:-.03em}
  .value-card p{margin:0;font-size:13px;line-height:1.6;color:#58616a}
  .value-note{margin-top:14px;padding:14px 16px;border:1px solid var(--line);background:#fff;box-shadow:var(--shadow);font-size:12px;line-height:1.6;color:#56616a}
  .value-note strong{color:#1d2025}

  .cta{margin:26px 22px 0;background:linear-gradient(90deg, var(--dark) 0%, #122434 100%);color:#fff;position:relative;box-shadow:var(--shadow);padding:24px 22px 24px 28px}
  .cta::before{content:'';position:absolute;left:0;top:0;width:6px;height:100%;background:var(--orange)}
  .cta h3{margin:0;font-size:34px;line-height:1;text-transform:uppercase;letter-spacing:-.04em}
  .cta p{margin:10px 0 14px;max-width:780px;color:#d8e2e7;font-size:14px;line-height:1.6}
  .cta-actions{display:flex;gap:8px;flex-wrap:wrap}
  .cta .btn-primary{background:var(--orange);color:#fff;border-color:var(--orange)}
  .fine-print{padding:18px 22px calc(28px + var(--safe-bottom));font-size:10px;line-height:1.6;color:#68737b}
  .fine-print strong{color:#25303a}

  .modal-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.72);z-index:100;display:none;align-items:center;justify-content:center;padding:24px 16px;overflow-y:auto}
  .modal-backdrop.open{display:flex}
  .modal{width:min(640px,100%);max-height:calc(100vh - 48px);overflow-y:auto;background:#fff;border-top:6px solid var(--orange);padding:20px 20px 22px;box-shadow:0 24px 60px rgba(0,0,0,.34)}
  .modal h3{margin:0;font-size:24px;line-height:1;text-transform:uppercase;letter-spacing:-.03em;color:#1d2025}
  .modal p{margin:10px 0 18px;font-size:14px;line-height:1.6;color:#56616a}

  .quote-form{display:grid;gap:14px;margin-top:18px}
  .quote-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .quote-field{display:grid;gap:6px;min-width:0}
  .quote-field.full{grid-column:1/-1}
  .quote-field label{font-size:10px;font-weight:900;letter-spacing:.12em;text-transform:uppercase;color:#38434c}
  .quote-field input,.quote-field select{width:100%;min-height:46px;border:1px solid #cfd7dc;background:#fff;color:#20272e;padding:10px 12px;font:inherit;font-size:16px;outline:none}
  .quote-field input:focus,.quote-field select:focus{border-color:var(--orange);box-shadow:0 0 0 2px rgba(243,108,33,.12)}
  .quote-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:2px}
  .quote-submit{flex:1 1 220px}
  .quote-note{margin:0!important;font-size:11px!important;line-height:1.5!important;color:#6d7780!important}
  .quote-status{display:none;margin:2px 0 0;padding:10px 12px;border-left:4px solid var(--teal);background:#f3f7f8;color:#33414a;font-size:12px;line-height:1.5}
  .quote-status.is-visible{display:block}
  @media(max-width:560px){.quote-grid{grid-template-columns:1fr}.quote-field.full{grid-column:auto}.modal{padding:18px 16px 20px}}

  .sp-cas-app[data-mode="air"] .hotspot.cond{opacity:.12;pointer-events:none}
  .sp-cas-app[data-mode="cond"] .hotspot.air{opacity:.14}
  .sp-cas-app[data-mode="value"] .hotspot{opacity:.12;pointer-events:none}
  .sp-cas-app[data-mode="value"] .detail{display:none}
  .sp-cas-app[data-mode="value"] .value-panel{display:block}
  .sp-cas-app[data-mode="value"] .step-progress{display:none}

  @media (prefers-reduced-motion:reduce){.air-path,.cond-path,.pulse-ring,.step-badge.flash,.drain-highlight{animation:none!important}.step-progress-fill{transition:none}.scene-scroll{scroll-behavior:auto}}
  @media (max-width:1100px){.hero-panel{grid-template-columns:1fr}.hero-visual{min-height:260px}}
  @media (max-width:860px){.section-head h2{font-size:40px}.value-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
  @media (max-width:760px){
    .topbar{padding-left:14px;padding-right:14px}
    .brand-logo{width:180px;max-width:48vw}
    .brand-sub{max-width:132px;overflow:hidden;text-overflow:ellipsis}
    .hero{padding:12px 12px 0}.hero-copy{padding:26px 22px 20px 26px}.hero-visual{padding:20px 18px}.hero p{font-size:15px}
    .section-head{padding:0 12px 14px;display:block}.status-pill{display:none}
    .mode-tabs{padding:0 12px 16px;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.mode-tab svg{display:none}
    .explorer-card,.detail,.value-panel,.cta{margin-left:12px;margin-right:12px}
    .scene-toolbar{padding:12px 14px}
    .tour-indicator{padding:12px 14px;align-items:flex-start;flex-wrap:wrap}.step-progress{width:100%;min-width:0}
    .scene-stage{min-width:980px}
    .detail-inner{padding:18px 18px 18px 22px}.detail h3{font-size:26px}.tag{display:none}
    .value-intro{padding:16px 18px}.value-grid{grid-template-columns:1fr}
    .cta h3{font-size:28px}.fine-print{padding-left:12px;padding-right:12px}
  }
  @media (max-width:420px){.section-head h2{font-size:34px}.step-title{display:none}.hero h1{font-size:36px}.top-actions .icon-btn:first-child{display:none}}


  /* Contextual application tool integration */
  .tool-context-btn{display:none}
  .tool-context-btn.is-visible{display:inline-flex;align-items:center;justify-content:center}
  .application-tool{margin:26px 22px 0}
  .application-tool-head{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:18px 20px;background:linear-gradient(90deg,var(--dark) 0%,#122434 100%);color:#fff;border-left:6px solid var(--orange);box-shadow:var(--shadow)}
  .application-tool-copy{min-width:0}
  .application-tool-kicker{font-size:10px;font-weight:900;letter-spacing:.16em;text-transform:uppercase;color:var(--orange-2);margin-bottom:5px}
  .application-tool-head h3{margin:0;font-size:28px;line-height:1;text-transform:uppercase;letter-spacing:-.035em}
  .application-tool-head p{margin:8px 0 0;max-width:760px;color:#d8e2e7;font-size:13px;line-height:1.55}
  .application-tool-toggle{flex:0 0 auto;min-height:44px;padding:11px 14px;border:1px solid rgba(255,255,255,.24);background:transparent;color:#fff;font-size:11px;font-weight:850;letter-spacing:.08em;text-transform:uppercase;cursor:pointer}
  .application-tool-toggle:hover{background:rgba(255,255,255,.06)}
  .application-tool-panel{background:#eef1f3;border:1px solid var(--line);border-top:0;padding:1px 0}
  .application-tool-panel[hidden]{display:none}
  .application-tool-panel .spoc-shell{font-family:Inter,Arial,sans-serif}
  @media(max-width:760px){
    .application-tool{margin-left:12px;margin-right:12px}
    .application-tool-head{display:block;padding:16px 18px}
    .application-tool-head h3{font-size:24px}
    .application-tool-toggle{margin-top:14px;width:100%}
  }


.spoc-shell,
    .spoc-shell * {
      box-sizing: border-box;
    }

    .spoc-shell {
      --spoc-orange: #f47a1f;
      --spoc-orange-dark: #d86512;
      --spoc-orange-soft: #fff4eb;
      --spoc-ink: #20272e;
      --spoc-muted: #6d7780;
      --spoc-border: #dfe3e6;
      --spoc-soft: #f7f8f9;
      --spoc-white: #ffffff;
      --spoc-error: #a63a32;
      width: min(100% - 32px, 1020px);
      margin: 42px auto;
      color: var(--spoc-ink);
      font-family: Inter, Arial, sans-serif;
      line-height: 1.45;
    }

    .spoc-card {
      overflow: hidden;
      background: var(--spoc-white);
      border: 1px solid #d9dee2;
      border-radius: 14px;
      box-shadow: 0 14px 40px rgba(31, 42, 51, 0.08);
    }

    .spoc-topline {
      height: 5px;
      background: var(--spoc-orange);
    }

    .spoc-header {
      padding: 30px 34px 26px;
      border-bottom: 1px solid var(--spoc-border);
    }

    .spoc-kicker {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      margin-bottom: 8px;
      color: var(--spoc-orange-dark);
      font-size: 0.76rem;
      font-weight: 800;
      letter-spacing: 0.08em;
      text-transform: uppercase;
    }

    .spoc-kicker-mark {
      width: 9px;
      height: 9px;
      border-radius: 2px;
      background: var(--spoc-orange);
      transform: rotate(45deg);
    }

    .spoc-title {
      margin: 0;
      color: #1f272e;
      font-size: clamp(1.7rem, 3vw, 2.25rem);
      line-height: 1.12;
      letter-spacing: -0.025em;
    }

    .spoc-subtitle {
      max-width: 760px;
      margin: 9px 0 0;
      color: var(--spoc-muted);
      font-size: 0.94rem;
    }

    .spoc-workspace {
      display: grid;
      grid-template-columns: minmax(0, 1.05fr) minmax(330px, 0.95fr);
    }

    .spoc-formarea {
      padding: 30px 34px 34px;
      border-right: 1px solid var(--spoc-border);
    }

    .spoc-resultarea {
      padding: 30px 30px 34px;
      background: var(--spoc-soft);
    }

    .spoc-block-title {
      margin: 0;
      color: #252e36;
      font-size: 1.05rem;
      font-weight: 850;
    }

    .spoc-block-copy {
      margin: 5px 0 22px;
      color: var(--spoc-muted);
      font-size: 0.82rem;
    }

    .spoc-field-list {
      display: grid;
      gap: 15px;
    }

    .spoc-field-row {
      display: grid;
      grid-template-columns: 34px minmax(0, 1fr);
      gap: 12px;
      align-items: start;
    }

    .spoc-step {
      display: grid;
      place-items: center;
      width: 30px;
      height: 30px;
      margin-top: 23px;
      border-radius: 8px;
      background: var(--spoc-orange-soft);
      color: var(--spoc-orange-dark);
      font-size: 0.78rem;
      font-weight: 900;
    }

    .spoc-label {
      display: flex;
      align-items: baseline;
      justify-content: space-between;
      gap: 12px;
      margin-bottom: 6px;
      color: #303941;
      font-size: 0.82rem;
      font-weight: 800;
    }

    .spoc-label-note {
      color: #899198;
      font-size: 0.7rem;
      font-weight: 650;
    }

    .spoc-inputgroup {
      display: grid;
      grid-template-columns: minmax(0, 1fr) 110px;
      overflow: hidden;
      border: 1px solid #cfd5da;
      border-radius: 8px;
      background: #fff;
      transition: 0.15s ease;
    }

    .spoc-inputgroup:focus-within {
      border-color: var(--spoc-orange);
      box-shadow: 0 0 0 3px rgba(244, 122, 31, 0.11);
    }

    .spoc-control {
      width: 100%;
      min-height: 45px;
      border: 1px solid #cfd5da;
      border-radius: 8px;
      padding: 10px 12px;
      background: #fff;
      color: var(--spoc-ink);
      font: inherit;
      font-size: 0.92rem;
      outline: none;
      transition: 0.15s ease;
    }

    .spoc-control:focus {
      border-color: var(--spoc-orange);
      box-shadow: 0 0 0 3px rgba(244, 122, 31, 0.11);
    }

    .spoc-inputgroup .spoc-control {
      border: 0;
      border-radius: 0;
      box-shadow: none;
    }

    .spoc-unit {
      display: flex;
      align-items: center;
      justify-content: center;
      min-height: 45px;
      padding: 0 10px;
      border-left: 1px solid #d9dde1;
      background: #f4f5f6;
      color: #58616a;
      font-size: 0.78rem;
      font-weight: 800;
      white-space: nowrap;
    }

    .spoc-readonly {
      background: #f5f6f7 !important;
      color: #606a73;
      cursor: default;
    }

    .spoc-help {
      margin-top: 5px;
      color: #858e96;
      font-size: 0.7rem;
      line-height: 1.45;
    }

    .spoc-lube-card {
      padding: 13px;
      border: 1px solid #d9dee2;
      border-radius: 10px;
      background: #fafbfb;
    }

    .spoc-lube-card .spoc-control {
      background: #fff;
    }

    .spoc-density-row {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      margin-top: 9px;
      padding-top: 9px;
      border-top: 1px solid #e4e7e9;
    }

    .spoc-density-copy {
      min-width: 0;
    }

    .spoc-density-title {
      display: block;
      color: #414b54;
      font-size: 0.72rem;
      font-weight: 800;
    }

    .spoc-density-note {
      display: block;
      margin-top: 1px;
      color: #90979d;
      font-size: 0.65rem;
    }

    .spoc-density-box {
      display: grid;
      grid-template-columns: 72px 46px;
      overflow: hidden;
      flex: 0 0 auto;
      border: 1px solid #d2d7db;
      border-radius: 7px;
      background: #fff;
    }

    .spoc-density-box .spoc-control {
      min-height: 36px;
      border: 0;
      border-radius: 0;
      padding: 7px 8px;
      text-align: right;
      box-shadow: none;
      font-size: 0.8rem;
    }

    .spoc-density-unit {
      display: grid;
      place-items: center;
      border-left: 1px solid #dfe3e6;
      background: #f1f3f4;
      color: #6e767d;
      font-size: 0.66rem;
      font-weight: 800;
    }

    .spoc-actions {
      display: flex;
      gap: 10px;
      margin-top: 24px;
      padding-left: 46px;
    }

    .spoc-btn {
      appearance: none;
      min-height: 44px;
      border: 0;
      border-radius: 8px;
      padding: 10px 17px;
      font: inherit;
      font-size: 0.82rem;
      font-weight: 850;
      cursor: pointer;
      transition: 0.16s ease;
    }

    .spoc-btn-primary {
      flex: 1 1 auto;
      background: var(--spoc-orange);
      color: #fff;
      box-shadow: 0 5px 14px rgba(244, 122, 31, 0.2);
    }

    .spoc-btn-primary:hover {
      background: var(--spoc-orange-dark);
      transform: translateY(-1px);
    }

    .spoc-btn-secondary {
      flex: 0 0 auto;
      border: 1px solid #d5dade;
      background: #fff;
      color: #5b646c;
    }

    .spoc-btn-secondary:hover {
      background: #f6f7f8;
    }

    .spoc-error {
      display: none;
      margin: 14px 0 0 46px;
      padding: 10px 12px;
      border: 1px solid #e5c4c0;
      border-radius: 8px;
      background: #fff5f4;
      color: var(--spoc-error);
      font-size: 0.76rem;
      font-weight: 700;
    }

    .spoc-error.is-visible {
      display: block;
    }

    .spoc-result-card {
      overflow: hidden;
      border: 1px solid #dce1e4;
      border-radius: 12px;
      background: #fff;
    }

    .spoc-result-head {
      padding: 12px 15px;
      border-bottom: 1px solid #e2e5e7;
      background: #fff;
      color: #53606a;
      font-size: 0.72rem;
      font-weight: 850;
      letter-spacing: 0.03em;
      text-transform: uppercase;
    }

    .spoc-hero-result {
      padding: 24px 20px 21px;
      border-bottom: 1px solid #e7eaec;
      text-align: center;
    }

    .spoc-result-eyebrow {
      margin-bottom: 4px;
      color: #717a82;
      font-size: 0.72rem;
      font-weight: 750;
    }

    .spoc-result-number {
      display: flex;
      align-items: baseline;
      justify-content: center;
      gap: 7px;
      color: #20272e;
      font-size: clamp(2.15rem, 5vw, 3.25rem);
      font-weight: 900;
      line-height: 1;
      letter-spacing: -0.045em;
    }

    .spoc-result-number span:first-child {
      color: var(--spoc-orange-dark);
    }

    .spoc-result-unit {
      color: #707980;
      font-size: 0.88rem;
      font-weight: 850;
      letter-spacing: 0;
    }

    .spoc-result-sub {
      max-width: 300px;
      margin: 8px auto 0;
      color: #838b92;
      font-size: 0.69rem;
      line-height: 1.45;
    }

    .spoc-results-grid {
      display: grid;
      grid-template-columns: 1fr 1fr;
    }

    .spoc-result-item {
      min-height: 82px;
      padding: 14px 15px;
      border-bottom: 1px solid #e8eaec;
    }

    .spoc-result-item:nth-child(odd) {
      border-right: 1px solid #e8eaec;
    }

    .spoc-result-item:nth-last-child(-n + 2) {
      border-bottom: 0;
    }

    .spoc-result-label {
      color: #7c858d;
      font-size: 0.67rem;
      font-weight: 750;
      line-height: 1.3;
    }

    .spoc-result-value {
      margin-top: 4px;
      color: #2f3840;
      font-size: 1.05rem;
      font-weight: 900;
      line-height: 1.2;
    }

    .spoc-result-value small {
      color: #7a838a;
      font-size: 0.66rem;
      font-weight: 750;
    }

    .spoc-basis {
      margin-top: 13px;
      padding: 11px 12px;
      border: 1px solid #e0e4e6;
      border-radius: 8px;
      background: #fff;
      color: #747d84;
      font-size: 0.69rem;
      line-height: 1.55;
    }

    .spoc-note {
      margin-top: 11px;
      color: #858d94;
      font-size: 0.67rem;
      line-height: 1.5;
    }

    .spoc-note strong {
      color: #5c666f;
    }

    .spoc-footer {
      padding: 17px 34px 19px;
      border-top: 1px solid var(--spoc-border);
      background: #fff;
      color: #778088;
      font-size: 0.7rem;
      line-height: 1.55;
    }

    .spoc-footer strong {
      color: #505a62;
    }

    @media (max-width: 800px) {
      .spoc-workspace {
        grid-template-columns: 1fr;
      }

      .spoc-formarea {
        border-right: 0;
        border-bottom: 1px solid var(--spoc-border);
      }
    }

    @media (max-width: 560px) {
      .spoc-shell {
        width: min(100% - 20px, 1020px);
        margin: 18px auto;
      }

      .spoc-card {
        border-radius: 11px;
      }

      .spoc-header,
      .spoc-formarea,
      .spoc-resultarea,
      .spoc-footer {
        padding-left: 20px;
        padding-right: 20px;
      }

      .spoc-field-row {
        grid-template-columns: 1fr;
        gap: 5px;
      }

      .spoc-step {
        display: none;
      }

      .spoc-actions {
        padding-left: 0;
      }

      .spoc-error {
        margin-left: 0;
      }

      .spoc-density-row {
        align-items: flex-end;
      }

      .spoc-results-grid {
        grid-template-columns: 1fr;
      }

      .spoc-result-item,
      .spoc-result-item:nth-child(odd),
      .spoc-result-item:nth-last-child(-n + 2) {
        border-right: 0;
        border-bottom: 1px solid #e8eaec;
      }

      .spoc-result-item:last-child {
        border-bottom: 0;
      }
    }
  


/* =========================================================
   SYSTEM BUILDER POC — additive styles only
   ========================================================= */
.system-builder{margin:30px 22px 0;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow);overflow:hidden}
.sb-head{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;padding:24px 26px;background:linear-gradient(90deg,#0f1820 0%,#13283a 100%);color:#fff;border-left:6px solid var(--orange)}
.sb-kicker{font-size:10px;font-weight:900;letter-spacing:.18em;text-transform:uppercase;color:var(--orange-2);margin-bottom:6px}
.sb-head h2{margin:0;font-size:38px;line-height:.96;text-transform:uppercase;letter-spacing:-.045em}
.sb-head h2 span{color:var(--teal)}
.sb-head p{margin:10px 0 0;max-width:770px;color:#d7e2e7;font-size:13px;line-height:1.6}
.sb-head-badge{flex:0 0 auto;padding:10px 12px;border:1px solid rgba(255,255,255,.18);font-size:10px;font-weight:850;letter-spacing:.12em;text-transform:uppercase;color:#e8eff2;white-space:nowrap}
.sb-workspace{display:grid;grid-template-columns:300px minmax(0,1fr);min-height:670px}
.sb-basis{padding:20px;background:#f5f7f8;border-right:1px solid var(--line)}
.sb-basis-title{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:16px}
.sb-basis-title strong{font-size:13px;font-weight:900;letter-spacing:.08em;text-transform:uppercase}
.sb-step{display:grid;place-items:center;width:30px;height:30px;background:var(--dark);color:#fff;font-size:12px;font-weight:900}
.sb-field{display:grid;gap:6px;margin-bottom:13px}
.sb-field label{font-size:9px;font-weight:900;letter-spacing:.13em;text-transform:uppercase;color:#46525c}
.sb-field input,.sb-field select{width:100%;min-height:46px;border:1px solid #cbd4d9;background:#fff;color:#1d252c;padding:10px 11px;font:inherit;font-size:14px;outline:none;border-radius:0}
.sb-field input:focus,.sb-field select:focus{border-color:var(--orange);box-shadow:0 0 0 2px rgba(243,108,33,.12)}
.sb-inline{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.sb-build-btn{width:100%;margin-top:3px}
.sb-basis-note{margin:13px 0 0;padding:11px 12px;border-left:3px solid var(--teal);background:#fff;font-size:10px;line-height:1.55;color:#68737b}
.sb-basis-note strong{color:#26313a}
.sb-main{min-width:0;background:#fff}
.sb-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-bottom:1px solid var(--line)}
.sb-metric{min-height:90px;padding:16px;border-right:1px solid var(--line);background:#fff}
.sb-metric:last-child{border-right:0}
.sb-metric-label{font-size:9px;font-weight:900;letter-spacing:.13em;text-transform:uppercase;color:#69747d}
.sb-metric-value{margin-top:5px;font-size:24px;font-weight:900;letter-spacing:-.04em;color:#1c242b}
.sb-metric-value small{font-size:11px;letter-spacing:.03em;color:#62707a}
.sb-metric-sub{margin-top:4px;font-size:10px;line-height:1.4;color:#77828a}
.sb-metric.is-good .sb-metric-value{color:#117c72}.sb-metric.is-warn .sb-metric-value{color:#c85817}
.sb-canvas-wrap{padding:18px 18px 14px;background:#e9eef1;border-bottom:1px solid var(--line)}
.sb-canvas-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px}
.sb-canvas-toolbar strong{font-size:11px;font-weight:900;letter-spacing:.1em;text-transform:uppercase;color:#29343d}
.sb-canvas-toolbar span{font-size:10px;color:#67737c}
.sb-scroll{overflow-x:auto;overflow-y:hidden;scrollbar-width:thin;padding-bottom:4px}
.sb-canvas{position:relative;min-width:1120px;min-height:370px;background:#fbfcfc;border:1px solid #cfd8de;overflow:hidden;--flow-speed:1.6s}
.sb-canvas::before{content:'';position:absolute;inset:0;background:linear-gradient(rgba(31,45,55,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(31,45,55,.035) 1px,transparent 1px);background-size:28px 28px;pointer-events:none}
.sb-ring{position:absolute;left:70px;right:70px;top:38px;height:82px;border:5px solid #203444;border-bottom-color:transparent;z-index:1}
.sb-ring-flow{position:absolute;left:70px;right:70px;top:38px;height:5px;background:repeating-linear-gradient(90deg,var(--teal) 0 16px,transparent 16px 28px);background-size:56px 5px;animation:sbFlow var(--flow-speed) linear infinite;z-index:2;opacity:.9}
.sb-ring-label{position:absolute;top:52px;left:50%;transform:translateX(-50%);z-index:3;padding:6px 10px;background:#fff;border:1px solid #cfd8de;font-size:9px;font-weight:900;letter-spacing:.14em;text-transform:uppercase;color:#30404b}
.sb-drop{position:absolute;top:38px;width:4px;height:82px;background:#203444;z-index:1}
.sb-drop::after{content:'';position:absolute;left:-4px;bottom:-5px;width:12px;height:12px;background:var(--teal);transform:rotate(45deg)}
.sb-drop.d1{left:18%}.sb-drop.d2{left:50%}.sb-drop.d3{left:82%}
.sb-poi{position:absolute;top:86px;transform:translateX(-50%);z-index:3;font-size:8px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#5f6c75;background:#fbfcfc;padding:3px 5px}.sb-poi.p1{left:18%}.sb-poi.p2{left:50%}.sb-poi.p3{left:82%}
.sb-nodes{position:absolute;left:24px;right:24px;top:162px;display:flex;align-items:stretch;gap:0;z-index:5}
.sb-node-wrap{display:flex;align-items:center;flex:1;min-width:0}
.sb-node{position:relative;width:124px;min-width:124px;height:122px;border:1px solid #c5cfd5;background:#fff;text-align:left;padding:11px 10px 9px;cursor:pointer;box-shadow:0 6px 15px rgba(35,50,60,.07);transition:transform .15s ease,border-color .15s ease,box-shadow .15s ease}
.sb-node:hover{transform:translateY(-2px);box-shadow:0 10px 18px rgba(35,50,60,.11)}
.sb-node.selected{border-color:var(--orange);box-shadow:inset 0 0 0 2px var(--orange),0 10px 18px rgba(35,50,60,.12)}
.sb-node.bottleneck{border-color:#db681f;box-shadow:inset 0 0 0 2px rgba(219,104,31,.38)}
.sb-node-stage{display:flex;align-items:center;justify-content:space-between;gap:6px;font-size:8px;font-weight:900;letter-spacing:.11em;text-transform:uppercase;color:#6e7981}
.sb-node-num{display:grid;place-items:center;width:20px;height:20px;background:#16232d;color:#fff;font-size:9px}
.sb-node-icon{width:34px;height:32px;margin:8px 0 6px;display:flex;align-items:flex-end;gap:3px}
.sb-machine{width:32px;height:25px;background:#324753;border-left:5px solid var(--orange);position:relative}.sb-machine:after{content:'';position:absolute;left:5px;right:5px;bottom:4px;height:4px;background:var(--teal)}
.sb-tank-icon{width:18px;height:31px;border:3px solid #324753;border-radius:9px 9px 4px 4px;position:relative;margin-left:7px}.sb-tank-icon:before{content:'';position:absolute;left:50%;top:-5px;width:6px;height:5px;background:#324753;transform:translateX(-50%)}
.sb-filter-icon{display:flex;gap:3px;margin-bottom:2px}.sb-filter-icon i{display:block;width:7px;height:29px;background:#324753;border-top:4px solid var(--teal)}
.sb-dryer-icon{width:31px;height:29px;border:3px solid #324753;position:relative}.sb-dryer-icon:before,.sb-dryer-icon:after{content:'';position:absolute;top:4px;bottom:4px;width:7px;border:2px solid var(--teal)}.sb-dryer-icon:before{left:4px}.sb-dryer-icon:after{right:4px}
.sb-water-icon{width:26px;height:29px;border:3px solid #324753;position:relative}.sb-water-icon:after{content:'';position:absolute;left:6px;right:6px;bottom:4px;height:8px;background:var(--teal);opacity:.65}
.sb-plant-icon{width:32px;height:28px;border:3px solid #324753;border-top:8px solid #324753;position:relative}.sb-plant-icon:after{content:'';position:absolute;left:4px;top:6px;width:5px;height:5px;background:var(--teal);box-shadow:9px 0 var(--teal),18px 0 var(--teal)}
.sb-node-name{font-size:10px;font-weight:900;line-height:1.15;text-transform:uppercase;color:#1f2930}
.sb-node-value{margin-top:4px;font-size:9px;line-height:1.3;color:#69757d;white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.sb-node-flow{position:absolute;left:10px;right:10px;bottom:8px;font-size:8px;font-weight:850;color:#0d7d86;text-transform:uppercase;letter-spacing:.05em}
.sb-node-alert{color:#c85817!important}
.sb-connector{position:relative;flex:1;min-width:18px;height:8px;background:#203444;overflow:hidden}
.sb-connector::after{content:'';position:absolute;inset:2px 0;background:repeating-linear-gradient(90deg,var(--teal) 0 10px,transparent 10px 18px);background-size:36px 4px;animation:sbFlow var(--flow-speed) linear infinite}
.sb-connector.stop::after{background:repeating-linear-gradient(90deg,#d86721 0 8px,transparent 8px 16px)}
@keyframes sbFlow{from{background-position:0 0}to{background-position:56px 0}}
.sb-cond-line{position:absolute;left:62px;right:62px;bottom:48px;border-top:2px dashed var(--orange);z-index:2}
.sb-cond-label{position:absolute;left:70px;bottom:55px;padding:4px 7px;background:#fff;font-size:8px;font-weight:900;letter-spacing:.1em;text-transform:uppercase;color:#b95116;z-index:3}
.sb-cond-box{position:absolute;bottom:19px;background:#fff;border:1px solid #d9b59e;padding:8px 10px;z-index:4;min-width:145px}
.sb-cond-box strong{display:block;font-size:9px;text-transform:uppercase;letter-spacing:.08em;color:#26313a}.sb-cond-box span{display:block;margin-top:3px;font-size:8px;color:#765a48}
.sb-cond-box.drain{left:37%}.sb-cond-box.ows{right:8%}
.sb-inspector{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:18px;padding:18px 20px 20px;background:#fff}
.sb-inspector-kicker{font-size:9px;font-weight:900;letter-spacing:.14em;text-transform:uppercase;color:var(--teal)}
.sb-inspector h3{margin:4px 0 5px;font-size:24px;line-height:1;text-transform:uppercase;letter-spacing:-.035em;color:#1d252c}
.sb-inspector-selection{font-size:13px;font-weight:800;color:#303b43}
.sb-inspector-detail{margin-top:7px;max-width:780px;font-size:11px;line-height:1.55;color:#6c7780}
.sb-inspector-tags{display:flex;gap:6px;flex-wrap:wrap;margin-top:9px}.sb-inspector-tags span{padding:5px 7px;background:#f1f4f5;border:1px solid #d6dde1;font-size:8px;font-weight:850;letter-spacing:.07em;text-transform:uppercase;color:#52606a}
.sb-cycle{display:flex;align-items:center;gap:7px;align-self:center}.sb-cycle button{width:44px;height:44px;border:1px solid #cbd4d9;background:#fff;color:#1f2930;font-weight:900;font-size:18px;cursor:pointer}.sb-cycle button:hover{border-color:var(--orange);color:var(--orange)}.sb-cycle .sb-auto-one{width:auto;padding:0 12px;font-size:9px;letter-spacing:.09em;text-transform:uppercase}
.sb-bottom{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:16px 20px;background:#f4f6f7;border-top:1px solid var(--line)}
.sb-bottom-copy{max-width:770px;font-size:10px;line-height:1.55;color:#66727a}.sb-bottom-copy strong{color:#27323a}
.sb-bottom-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}.sb-bottom-actions .btn{min-height:44px;padding:11px 14px;font-size:10px}
.sb-legend-row{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.sb-legend-row span{display:flex;align-items:center;gap:5px;font-size:8px;font-weight:850;letter-spacing:.08em;text-transform:uppercase;color:#65717a}.sb-legend-row i{width:16px;height:3px;background:var(--teal)}.sb-legend-row .cond i{background:var(--orange)}

/* System builder visual refinement overrides */
.sb-canvas{min-width:1280px;min-height:430px}
.sb-nodes{left:22px;right:22px;top:150px}
.sb-node-wrap{align-items:center}
.sb-node{width:144px;min-width:144px;height:168px;padding:11px 11px 10px;border-color:#c6d1d7;background:linear-gradient(180deg,#ffffff 0%,#f9fbfc 100%);box-shadow:0 8px 18px rgba(35,50,60,.08)}
.sb-node-stage{font-size:8px}
.sb-node-num{width:22px;height:22px;font-size:9px}
.sb-node-visual{height:56px;margin:8px 0 8px;border:1px solid #d5dde2;background:linear-gradient(180deg,#f9fbfc 0%,#edf2f5 100%);display:grid;place-items:center;padding:4px;overflow:hidden}
.sb-node-visual svg{display:block;width:100%;height:100%}
.sb-node-name{font-size:11px;letter-spacing:.04em}
.sb-node-value{margin-top:4px;font-size:10px;line-height:1.28;font-weight:800;color:#26323b;-webkit-line-clamp:2}
.sb-node-sub{margin-top:4px;font-size:9px;line-height:1.3;color:#66747d;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:24px}
.sb-node-flow{left:11px;right:11px;bottom:10px;font-size:9px;letter-spacing:.04em}
.sb-node-caption{position:absolute;right:10px;top:43px;padding:2px 5px;background:rgba(255,255,255,.92);border:1px solid #d7dee3;font-size:7px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;color:#6a767e}
.sb-cond-box{min-width:165px}
@media(max-width:760px){.sb-node{width:136px;min-width:136px;height:164px}.sb-node-visual{height:52px}}

/* Quote preview extension */
.modal{width:min(1040px,100%)}
.quote-field textarea{width:100%;min-height:78px;border:1px solid #cfd7dc;background:#fff;color:#20272e;padding:10px 12px;font:inherit;font-size:14px;resize:vertical;outline:none}.quote-field textarea:focus{border-color:var(--orange);box-shadow:0 0 0 2px rgba(243,108,33,.12)}
.quote-preview-shell{border:1px solid #d2d9dd;background:#f5f7f8;margin-top:2px}
.quote-preview-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 12px;background:#16242e;color:#fff}.quote-preview-head strong{font-size:10px;letter-spacing:.1em;text-transform:uppercase}.quote-route{font-size:9px;color:#cad8de;text-align:right}
.quote-view-tabs{display:flex;border-bottom:1px solid #d2d9dd;background:#fff}.quote-view-tab{flex:1;min-height:42px;border:0;border-right:1px solid #d2d9dd;background:#fff;color:#5e6a72;font-size:9px;font-weight:900;letter-spacing:.09em;text-transform:uppercase;cursor:pointer}.quote-view-tab:last-child{border-right:0}.quote-view-tab.active{color:#1d252c;box-shadow:inset 0 -3px 0 var(--orange);background:#f8f9fa}
.quote-doc-wrap{max-height:430px;overflow:auto;padding:12px}
.quote-doc{background:#fff;border:1px solid #d5dce0;box-shadow:0 8px 22px rgba(0,0,0,.08);max-width:850px;margin:0 auto;color:#20272e}
.qd-top{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;padding:18px 20px;border-bottom:5px solid var(--orange)}
.qd-brand img{width:210px;height:auto}.qd-brand small{display:block;margin-top:7px;font-size:8px;font-weight:850;letter-spacing:.13em;text-transform:uppercase;color:#6a757c}.qd-meta{text-align:right}.qd-meta strong{display:block;font-size:18px;text-transform:uppercase;letter-spacing:-.02em}.qd-meta span{display:block;margin-top:4px;font-size:9px;color:#68747c}.qd-alert{margin:12px 20px 0;padding:9px 10px;background:#fff4eb;border-left:4px solid var(--orange);font-size:9px;line-height:1.5;color:#6d4e3b}.qd-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:15px 20px}.qd-card{border:1px solid #d8dfe3;padding:10px 11px}.qd-card b{display:block;font-size:8px;letter-spacing:.11em;text-transform:uppercase;color:#6d7780;margin-bottom:5px}.qd-card span{display:block;font-size:10px;line-height:1.45;color:#253039}.qd-basis{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin:0 20px 14px;border:1px solid #d8dfe3}.qd-basis div{padding:9px 10px;border-right:1px solid #d8dfe3}.qd-basis div:last-child{border-right:0}.qd-basis b{display:block;font-size:8px;letter-spacing:.1em;text-transform:uppercase;color:#6d7780}.qd-basis strong{display:block;margin-top:3px;font-size:15px}.qd-table{width:calc(100% - 40px);margin:0 20px 15px;border-collapse:collapse;font-size:9px}.qd-table th{padding:8px 7px;background:#1a2a35;color:#fff;text-align:left;font-size:8px;letter-spacing:.08em;text-transform:uppercase}.qd-table td{padding:8px 7px;border-bottom:1px solid #dde3e6;vertical-align:top}.qd-table td.num,.qd-table th.num{text-align:right;white-space:nowrap}.qd-table td.qty{width:38px;text-align:center}.qd-line-title{font-weight:800;color:#202a31}.qd-line-sub{margin-top:2px;color:#78828a;font-size:8px;line-height:1.35}.qd-total{display:flex;justify-content:flex-end;padding:0 20px 16px}.qd-total-box{min-width:260px;border-top:3px solid var(--orange);padding-top:8px;display:flex;justify-content:space-between;gap:16px;font-size:12px;font-weight:900}.qd-footer{padding:11px 20px;background:#f3f5f6;border-top:1px solid #d9e0e4;font-size:8px;line-height:1.5;color:#68747c}
.quote-copy-hidden{display:none}

@media(max-width:980px){.sb-workspace{grid-template-columns:1fr}.sb-basis{border-right:0;border-bottom:1px solid var(--line)}.sb-basis{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 12px}.sb-basis-title,.sb-build-btn,.sb-basis-note{grid-column:1/-1}.sb-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.sb-metric:nth-child(2){border-right:0}.sb-metric:nth-child(-n+2){border-bottom:1px solid var(--line)}}
@media(max-width:760px){.system-builder{margin-left:12px;margin-right:12px}.sb-head{display:block;padding:20px 18px}.sb-head h2{font-size:31px}.sb-head-badge{display:inline-block;margin-top:14px}.sb-basis{padding:16px}.sb-inspector{grid-template-columns:1fr}.sb-cycle{justify-content:flex-start}.sb-bottom{display:block}.sb-bottom-actions{justify-content:flex-start;margin-top:12px}.quote-doc-wrap{padding:7px}.qd-top{display:block}.qd-meta{text-align:left;margin-top:12px}.qd-grid{grid-template-columns:1fr}.qd-basis{grid-template-columns:1fr}.qd-basis div{border-right:0;border-bottom:1px solid #d8dfe3}.qd-basis div:last-child{border-bottom:0}}
@media(max-width:560px){.sb-basis{grid-template-columns:1fr}.sb-basis-title,.sb-build-btn,.sb-basis-note{grid-column:auto}.sb-metrics{grid-template-columns:1fr}.sb-metric{border-right:0!important;border-bottom:1px solid var(--line)}.sb-metric:last-child{border-bottom:0}.quote-view-tab{font-size:8px}.qd-table{display:block;overflow-x:auto;white-space:nowrap}}



/* =========================================================
   COMPLETE AIR SYSTEM PLUGIN — modular builder refinement
   ========================================================= */
body.sp-cas-standalone-page{margin:0;background:#eef1f3}
body.sp-cas-standalone-page #wpadminbar{z-index:9999}
.sp-cas-app{--condensate:var(--orange);font-family:Inter,Arial,sans-serif;color:var(--ink);min-height:100vh}
.sp-cas-app .hotspot{color:var(--point-color,var(--teal))}
.sp-cas-app .hotspot .hotspot-core{box-shadow:inset 0 0 0 4px var(--point-color,var(--teal)),0 10px 18px rgba(0,0,0,.25)}
.sp-cas-app .hotspot.air,.sp-cas-app .hotspot.cond{color:var(--point-color,var(--teal))}
.sp-cas-app .cond-path{stroke:var(--condensate)}

/* Fit the complete builder into a desktop working viewport. */
.system-builder{margin-top:24px}
.sb-head{padding:17px 20px;align-items:center}
.sb-head h2{font-size:30px}.sb-head p{margin-top:7px;line-height:1.45}.sb-head-badge{padding:8px 10px}
.sb-workspace{grid-template-columns:248px minmax(0,1fr);min-height:0}
.sb-basis{padding:14px 15px}.sb-basis-title{margin-bottom:10px}.sb-step{width:26px;height:26px}
.sb-field{gap:4px;margin-bottom:8px}.sb-field label{font-size:8px}.sb-field input,.sb-field select{min-height:36px;padding:7px 9px;font-size:12px}
.sb-build-btn{min-height:40px!important;padding:9px 12px!important}.sb-basis-note{margin-top:9px;padding:8px 10px;font-size:9px}
.sb-metrics{grid-template-columns:repeat(4,minmax(0,1fr))}.sb-metric{min-height:61px;padding:9px 11px}.sb-metric-value{font-size:19px;margin-top:2px}.sb-metric-sub{font-size:8px;margin-top:2px}
.sb-canvas-wrap{padding:10px 12px 8px}.sb-canvas-toolbar{margin-bottom:6px}.sb-scroll{overflow-x:auto;padding-bottom:2px}
.sb-canvas{min-width:900px;min-height:310px;height:310px;--flow-speed:1.6s;background:#fbfcfc}
.sb-ring{left:42px;right:42px;top:24px;height:54px;border-width:4px}.sb-ring-flow{left:42px;right:42px;top:24px;height:4px}.sb-ring-label{top:35px;padding:4px 7px;font-size:7px}
.sb-drop{top:24px;height:54px;width:3px}.sb-poi{top:60px;font-size:7px}
.sb-nodes{left:14px;right:14px;top:88px;gap:0;align-items:stretch}
.sb-node-wrap{min-width:0;align-items:flex-start}.sb-node{width:94px;min-width:94px;height:156px;padding:0;border:0;background:transparent;box-shadow:none;overflow:visible;display:flex;flex-direction:column;align-items:stretch}
.sb-node:hover{transform:translateY(-1px);box-shadow:none}.sb-node.selected,.sb-node.bottleneck{border:0;box-shadow:none}
.sb-node-stage{height:17px;margin-bottom:4px;font-size:6.5px;letter-spacing:.08em}.sb-node-num{width:17px;height:17px;font-size:7px}
.sb-node-visual{position:relative;width:58px;height:58px;margin:0 auto 5px;border:1px solid #c9d4da;background:linear-gradient(180deg,#fff,#eef3f5);display:grid;place-items:center;padding:5px;overflow:hidden;box-shadow:0 4px 10px rgba(35,50,60,.08)}
.sb-node.selected .sb-node-visual{border-color:var(--orange);box-shadow:inset 0 0 0 2px var(--orange),0 5px 12px rgba(35,50,60,.10)}
.sb-node.bottleneck .sb-node-visual{border-color:#d86721;box-shadow:inset 0 0 0 2px rgba(216,103,33,.42),0 5px 12px rgba(35,50,60,.10)}
.sb-node-visual svg{width:100%;height:100%}.sb-part-image{width:100%;height:100%;object-fit:contain;display:block}
.sb-node-caption{display:none}
.sb-node-info{position:relative;flex:1;min-height:68px;padding:7px 7px 17px;border:1px solid #d2dbe0;background:#fff;box-shadow:0 4px 10px rgba(35,50,60,.05);overflow:hidden;text-align:left}
.sb-node.selected .sb-node-info{border-color:#efac84;background:#fffaf7}.sb-node.bottleneck .sb-node-info{border-color:#e3a178}
.sb-node-name{font-size:8px;letter-spacing:.04em;line-height:1.1}.sb-node-value{margin-top:3px;font-size:8px;line-height:1.18;-webkit-line-clamp:2}.sb-node-sub{margin-top:3px;font-size:7px;line-height:1.18;min-height:0;-webkit-line-clamp:2}.sb-node-flow{left:7px;right:7px;bottom:5px;font-size:6.5px}
.sb-connector{min-width:8px;height:5px;margin-top:55px}.sb-connector::after{inset:1px 0;background-size:30px 3px}
.sb-cond-line{left:46px;right:46px;bottom:36px}.sb-cond-label{left:48px;bottom:42px;font-size:6.5px;padding:3px 5px}.sb-cond-box{bottom:8px;min-width:125px;padding:5px 7px}.sb-cond-box strong{font-size:7px}.sb-cond-box span{font-size:6.5px}.sb-cond-box.drain{left:34%}.sb-cond-box.ows{right:5%}
.sb-inspector{grid-template-columns:minmax(0,1fr) auto;gap:12px;padding:10px 14px}.sb-inspector h3{font-size:18px;margin:2px 0 3px}.sb-inspector-selection{font-size:10px}.sb-inspector-detail{margin-top:4px;font-size:9px;line-height:1.4}.sb-inspector-tags{margin-top:5px}.sb-inspector-tags span{padding:3px 5px;font-size:6.5px}.sb-cycle button{width:34px;height:34px}.sb-cycle .sb-auto-one{height:34px;padding:0 8px;font-size:7px}
.sb-bottom{padding:9px 14px}.sb-bottom-copy{font-size:8.5px}.sb-bottom-actions .btn{min-height:36px;padding:8px 10px;font-size:8px}.sb-legend-row span{font-size:7px}

@media (min-width:981px) and (min-height:720px){
  .system-builder{scroll-margin-top:84px}
}
@media (max-width:1100px){.sb-workspace{grid-template-columns:220px minmax(0,1fr)}.sb-canvas{min-width:900px}}
@media (max-width:980px){.sb-workspace{grid-template-columns:1fr}.sb-basis{grid-template-columns:repeat(3,minmax(0,1fr));padding:14px}.sb-inline{display:contents}.sb-basis-title,.sb-build-btn,.sb-basis-note{grid-column:1/-1}.sb-field{margin-right:8px}.sb-metrics{grid-template-columns:repeat(4,minmax(0,1fr))}.sb-metric:nth-child(-n+2){border-bottom:0}}
@media (max-width:760px){.sb-canvas{min-width:900px;height:310px}.sb-node{width:94px;min-width:94px;height:156px}.sb-node-visual{height:58px}.sb-basis{grid-template-columns:1fr 1fr}.sb-head h2{font-size:28px}}
@media (max-width:560px){.sb-basis{grid-template-columns:1fr}.sb-metrics{grid-template-columns:1fr}.sb-metric{min-height:55px}.sb-inspector{grid-template-columns:1fr}}

.sb-cond-box{display:grid;grid-template-columns:auto 1fr;column-gap:6px;align-items:center;text-align:left}.sb-cond-box>span:not(.sb-cond-visual){grid-column:2}.sb-cond-visual{grid-row:1/3;width:27px;height:27px;display:grid;place-items:center}.sb-cond-visual img{width:100%;height:100%;object-fit:contain}.sb-cond-box:not(:has(.sb-cond-visual)){display:block}

/* =========================================================
   v1.1.0 visibility, editable flow direction, and value overlays
   ========================================================= */
/* WordPress themes often apply heading/body colors with selectors that are
   more specific than the POC. Keep text in every dark application panel
   explicitly legible without changing light-card typography. */
.sp-cas-app .hero-copy,
.sp-cas-app .hero-copy h1,
.sp-cas-app .hero-copy p,
.sp-cas-app .hero-copy .hero-trust,
.sp-cas-app .hero-copy .hero-trust span,
.sp-cas-app .hero-copy .eyebrow,
.sp-cas-app .sb-head,
.sp-cas-app .sb-head h2,
.sp-cas-app .sb-head p,
.sp-cas-app .sb-head-badge,
.sp-cas-app .application-tool-head,
.sp-cas-app .application-tool-head h3,
.sp-cas-app .application-tool-head p,
.sp-cas-app .application-tool-toggle,
.sp-cas-app .cta,
.sp-cas-app .cta h3,
.sp-cas-app .cta p,
.sp-cas-app .scene-toolbar,
.sp-cas-app .scene-toolbar strong,
.sp-cas-app .scene-toolbar span,
.sp-cas-app .value-intro,
.sp-cas-app .value-intro h3,
.sp-cas-app .value-intro p {
  color:#fff !important;
}
.sp-cas-app .hero-copy h1 span,
.sp-cas-app .sb-head h2 span { color:var(--teal) !important; }
.sp-cas-app .sb-kicker,
.sp-cas-app .application-tool-kicker { color:var(--orange-2) !important; }
.sp-cas-app .hero-copy .hero-trust { color:#dce3e7 !important; }
.sp-cas-app .hero-copy p,
.sp-cas-app .sb-head p,
.sp-cas-app .application-tool-head p,
.sp-cas-app .cta p,
.sp-cas-app .value-intro p { color:#d8e2e7 !important; }
.sp-cas-app .sb-head-badge { color:#eef4f7 !important; }

/* Admin-selectable direction reverses the moving dash animation while the
   stored route geometry remains exactly where the editor placed it. */
.sp-cas-app .air-path.flow-reverse,
.sp-cas-app .cond-path.flow-reverse { animation-direction:reverse; }

/* System Value mode overlays. These are intentionally contextual rather than
   guaranteed savings claims; the admin can edit/reposition every callout. */
.sp-cas-app .value-overlay-layer{
  position:absolute;
  inset:0;
  z-index:7;
  display:none;
  pointer-events:none;
}
.sp-cas-app[data-mode="value"] .value-overlay-layer{display:block}
.sp-cas-app[data-mode="value"] .scene-caption{opacity:.94}
.sp-cas-app .value-overlay-callout{
  position:absolute;
  transform:translate(-50%,-50%);
  width:min(220px,23vw);
  min-width:155px;
  padding:10px 12px 10px 14px;
  background:rgba(10,22,31,.92);
  border:1px solid rgba(255,255,255,.18);
  border-left:4px solid var(--value-accent,var(--teal));
  box-shadow:0 10px 28px rgba(0,0,0,.28);
  color:#fff;
  text-align:left;
}
.sp-cas-app .value-overlay-callout::after{
  content:'';
  position:absolute;
  left:10px;
  right:10px;
  bottom:-5px;
  height:2px;
  background:var(--value-accent,var(--teal));
  opacity:.7;
}
.sp-cas-app .value-overlay-callout strong{
  display:block;
  color:#fff !important;
  font-size:clamp(20px,2vw,31px);
  line-height:.95;
  letter-spacing:-.04em;
  font-weight:900;
}
.sp-cas-app .value-overlay-callout span{
  display:block;
  margin-top:5px;
  color:var(--value-accent,var(--teal)) !important;
  font-size:9px;
  line-height:1.2;
  font-weight:900;
  letter-spacing:.11em;
  text-transform:uppercase;
}
.sp-cas-app .value-overlay-callout small{
  display:block;
  margin-top:5px;
  color:#dbe5ea !important;
  font-size:8px;
  line-height:1.38;
  font-weight:600;
}
.sp-cas-app .value-overlay-disclaimer{
  position:absolute;
  right:14px;
  bottom:48px;
  max-width:390px;
  padding:7px 9px;
  background:rgba(255,255,255,.92);
  border-left:3px solid var(--orange);
  color:#3e4b54 !important;
  font-size:8px;
  line-height:1.4;
  font-weight:700;
}
@media(max-width:760px){
  .sp-cas-app .value-overlay-callout{width:175px;min-width:0;padding:8px 9px 8px 11px}
  .sp-cas-app .value-overlay-callout strong{font-size:19px}
  .sp-cas-app .value-overlay-callout small{display:none}
  .sp-cas-app .value-overlay-disclaimer{right:8px;bottom:42px;max-width:290px;font-size:7px}
}

/* =========================================================
   v1.2.0 — legible modular builder, drain feeds, quote dialog
   ========================================================= */

/* Admin-defined ZL drain feed paths. Each stored branch runs from the drain
   toward its connection on the condensate main. */
.sp-cas-app .cond-branch-path{
  fill:none;
  stroke:var(--condensate-branch,#55c52a);
  stroke-width:5;
  stroke-linecap:round;
  stroke-linejoin:round;
  stroke-dasharray:11 10;
  vector-effect:non-scaling-stroke;
  opacity:0;
  filter:drop-shadow(0 0 5px rgba(0,0,0,.32));
  animation:flowDash 1.25s linear infinite;
  transition:opacity .2s ease;
}
.sp-cas-app .flow-on.cond .cond-branch-path{opacity:.98}
@media (prefers-reduced-motion:reduce){.sp-cas-app .cond-branch-path{animation:none!important}}

/* Keep the complete system visible on common desktop displays while restoring
   readable card typography. Horizontal scrolling remains available as a safe
   fallback on smaller screens. */
@media (min-width:981px){
  .sp-cas-app .sb-workspace{grid-template-columns:232px minmax(0,1fr)}
  .sp-cas-app .sb-basis{padding:14px 14px}
  .sp-cas-app .sb-canvas{min-width:1010px;height:356px;min-height:356px}
  .sp-cas-app .sb-nodes{left:16px;right:16px;top:90px}
  .sp-cas-app .sb-node{width:106px;min-width:106px;height:194px}
  .sp-cas-app .sb-node-stage{height:20px;margin-bottom:5px;font-size:7.5px;letter-spacing:.08em}
  .sp-cas-app .sb-node-num{width:19px;height:19px;font-size:8px}
  .sp-cas-app .sb-node-visual{width:64px;height:64px;margin-bottom:6px;padding:5px}
  .sp-cas-app .sb-node-info{min-height:91px;padding:8px 8px 20px;border-color:#cbd5db;box-shadow:0 5px 12px rgba(35,50,60,.07)}
  .sp-cas-app .sb-node-name{font-size:9.5px;line-height:1.15;letter-spacing:.025em}
  .sp-cas-app .sb-node-value{margin-top:4px;font-size:10px;line-height:1.25;font-weight:800;-webkit-line-clamp:2}
  .sp-cas-app .sb-node-sub{margin-top:4px;font-size:8.3px;line-height:1.28;-webkit-line-clamp:2}
  .sp-cas-app .sb-node-flow{left:8px;right:8px;bottom:6px;font-size:7.4px;letter-spacing:.03em}
  .sp-cas-app .sb-connector{min-width:10px;height:6px;margin-top:59px}
  .sp-cas-app .sb-cond-line{left:50px;right:50px;bottom:38px}
  .sp-cas-app .sb-cond-label{left:52px;bottom:45px;font-size:7.4px;padding:3px 6px}
  .sp-cas-app .sb-cond-box{bottom:8px;min-width:148px;padding:7px 9px;column-gap:7px}
  .sp-cas-app .sb-cond-box strong{font-size:8.2px;line-height:1.25}
  .sp-cas-app .sb-cond-box span{font-size:7.6px;line-height:1.3}
  .sp-cas-app .sb-cond-visual{width:31px;height:31px}
  .sp-cas-app .sb-inspector{padding:12px 15px}
  .sp-cas-app .sb-inspector-kicker{font-size:8px}
  .sp-cas-app .sb-inspector h3{font-size:20px}
  .sp-cas-app .sb-inspector-selection{font-size:11px}
  .sp-cas-app .sb-inspector-detail{font-size:9.5px;line-height:1.45}
  .sp-cas-app .sb-inspector-tags span{font-size:7px}
}
@media (min-width:1280px){
  .sp-cas-app .sb-canvas{min-width:0;width:100%}
}
@media (max-width:980px){
  .sp-cas-app .sb-node-name{font-size:9px}
  .sp-cas-app .sb-node-value{font-size:9px}
  .sp-cas-app .sb-node-sub{font-size:8px}
}

/* Robust, IQC-inspired public quote request. These selectors are deliberately
   unique so theme modal/backdrop rules cannot turn the dialog into a blank or
   black overlay. */
body.spcas-quote-open{overflow:hidden!important}
.spcas-quote-backdrop{
  position:fixed!important;
  inset:0!important;
  z-index:100000!important;
  display:none!important;
  align-items:center!important;
  justify-content:center!important;
  padding:24px!important;
  overflow:auto!important;
  background:rgba(10,18,24,.78)!important;
}
.spcas-quote-backdrop.open{display:flex!important}
.spcas-quote-modal{
  position:relative!important;
  width:min(1080px,100%)!important;
  max-height:calc(100vh - 48px)!important;
  margin:auto!important;
  overflow:hidden!important;
  background:#f6f8f9!important;
  color:#1d252c!important;
  border:1px solid #d7dde1!important;
  border-top:6px solid var(--orange,#f36c21)!important;
  border-radius:8px!important;
  box-shadow:0 28px 80px rgba(0,0,0,.38)!important;
  font-family:Inter,Arial,sans-serif!important;
  text-align:left!important;
}
.spcas-quote-modal *{box-sizing:border-box}
.spcas-quote-modal-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:24px;
  padding:22px 24px 19px;
  background:#fff!important;
  border-bottom:1px solid #dde3e6;
}
.spcas-quote-eyebrow{margin-bottom:6px;color:#d85c15!important;font-size:10px;font-weight:900;letter-spacing:.16em;text-transform:uppercase}
.spcas-quote-modal-head h2{margin:0!important;color:#1d252c!important;font-size:29px!important;line-height:1.05!important;letter-spacing:-.035em!important;text-transform:uppercase!important;font-weight:900!important}
.spcas-quote-modal-head p{max-width:760px;margin:8px 0 0!important;color:#63707a!important;font-size:13px!important;line-height:1.55!important;font-weight:500!important}
.spcas-quote-close{
  flex:0 0 auto;
  width:40px;height:40px;
  border:1px solid #ced7dc!important;
  border-radius:5px!important;
  background:#fff!important;
  color:#28343d!important;
  font:700 24px/1 Arial,sans-serif!important;
  cursor:pointer;
}
.spcas-quote-close:hover,.spcas-quote-close:focus-visible{border-color:var(--orange,#f36c21)!important;color:var(--orange,#f36c21)!important;outline:none}
.spcas-quote-modal-body{max-height:calc(100vh - 164px);overflow:auto;padding:20px 22px 22px;background:#f6f8f9!important}
.spcas-quote-form{margin:0!important;padding:0!important;background:transparent!important;color:#1d252c!important}
.spcas-quote-layout{display:grid;grid-template-columns:minmax(0,.9fr) minmax(420px,1.1fr);gap:16px;align-items:start}
.spcas-quote-form-card,.spcas-quote-summary-card{overflow:hidden;background:#fff!important;border:1px solid #d9e0e4;border-radius:7px;box-shadow:0 7px 20px rgba(31,42,51,.05)}
.spcas-quote-card-head{display:flex;align-items:center;gap:10px;padding:13px 15px;border-bottom:1px solid #e1e5e8;background:#fff!important}
.spcas-quote-card-head>span{display:grid;place-items:center;width:29px;height:29px;background:#fff2e9!important;border:1px solid #f4c8aa;color:#d85c15!important;border-radius:4px;font-size:10px;font-weight:900}
.spcas-quote-card-head strong{display:block;color:#253039!important;font-size:12px;font-weight:900;letter-spacing:.07em;text-transform:uppercase}
.spcas-quote-card-head small{display:block;margin-top:2px;color:#7a858d!important;font-size:9px;font-weight:600}
.spcas-quote-card-head-dark{background:#172733!important;border-bottom-color:#263946}
.spcas-quote-card-head-dark>span{background:#f36c21!important;border-color:#f36c21!important;color:#fff!important}
.spcas-quote-card-head-dark strong{color:#fff!important}.spcas-quote-card-head-dark small{color:#cfd9de!important}
.spcas-quote-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:16px}
.spcas-quote-field{display:grid;gap:6px;min-width:0}
.spcas-quote-full{grid-column:1/-1}
.spcas-quote-field label{margin:0!important;color:#38454e!important;font-size:9px!important;font-weight:900!important;letter-spacing:.11em!important;text-transform:uppercase!important;line-height:1.25!important}
.spcas-quote-field label em{font-style:normal;color:#89939a;font-weight:600;letter-spacing:0;text-transform:none}
.spcas-quote-field input,.spcas-quote-field select,.spcas-quote-field textarea{
  width:100%!important;
  min-height:44px!important;
  margin:0!important;
  padding:10px 11px!important;
  border:1px solid #cbd4d9!important;
  border-radius:5px!important;
  background:#fff!important;
  color:#20272e!important;
  box-shadow:none!important;
  font:500 14px/1.35 Inter,Arial,sans-serif!important;
  text-transform:none!important;
}
.spcas-quote-field textarea{min-height:92px!important;resize:vertical!important}
.spcas-quote-field input:focus,.spcas-quote-field select:focus,.spcas-quote-field textarea:focus{border-color:var(--orange,#f36c21)!important;outline:0!important;box-shadow:0 0 0 3px rgba(243,108,33,.12)!important}
.spcas-quote-route{padding:10px 14px;background:#edf4f6!important;border-bottom:1px solid #dbe4e8;color:#40515c!important;font-size:10px;font-weight:800;line-height:1.4}
.spcas-quote-summary-scroll{max-height:430px;overflow:auto;padding:14px;background:#f8fafb!important}
.spcas-quote-pricing-note{margin:0;padding:11px 14px;background:#fff6ef!important;border-top:1px solid #f2d6c3;color:#654b3c!important;font-size:10px;line-height:1.5}.spcas-quote-pricing-note strong{color:#2c343a!important}
.spcas-system-request{color:#20282e!important}
.spcas-system-request-basis{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid #d9e0e4;background:#fff}
.spcas-system-request-basis>div{padding:9px 10px;border-right:1px solid #d9e0e4}.spcas-system-request-basis>div:last-child{border-right:0}
.spcas-system-request-basis span,.spcas-system-request-route span,.spcas-system-request-notes span{display:block;color:#7a858c!important;font-size:7.5px;font-weight:900;letter-spacing:.09em;text-transform:uppercase}
.spcas-system-request-basis strong{display:block;margin-top:3px;color:#26313a!important;font-size:12px;line-height:1.2}
.spcas-system-request-route{margin-top:10px;padding:9px 10px;background:#fff;border:1px solid #d9e0e4;border-left:3px solid var(--teal,#00bfd0)}
.spcas-system-request-route strong{display:block;margin-top:3px;color:#253039!important;font-size:10px;line-height:1.4}
.spcas-system-request-list{margin-top:10px;border:1px solid #d9e0e4;background:#fff}
.spcas-system-request-group-label{padding:6px 9px;background:#f2f5f6;border-bottom:1px solid #d9e0e4;color:#62717a!important;font-size:7px;font-weight:900;letter-spacing:.1em;text-transform:uppercase}.spcas-system-request-group-label.is-condensate{background:#fff4eb;color:#9b552c!important;border-top:2px solid #f36c21}
.spcas-system-request-item{display:grid;grid-template-columns:27px 1fr;gap:8px;padding:8px 9px;border-bottom:1px solid #e5e9eb}.spcas-system-request-item:last-child{border-bottom:0}
.spcas-system-request-qty{display:grid;place-items:center;width:25px;height:25px;background:#172733!important;color:#fff!important;border-radius:3px;font-size:8px;font-weight:900}
.spcas-system-request-item strong{display:block;color:#27323a!important;font-size:9px;font-weight:900;text-transform:uppercase;letter-spacing:.03em}.spcas-system-request-item b{display:block;margin-top:1px;color:#38444c!important;font-size:9px}.spcas-system-request-item small{display:block;margin-top:2px;color:#78838b!important;font-size:7.5px;line-height:1.3}
.spcas-system-request-notes{margin-top:10px;padding:9px 10px;background:#fff;border:1px solid #d9e0e4}.spcas-system-request-notes p{margin:4px 0 0!important;color:#515e67!important;font-size:9px!important;line-height:1.45!important}
.spcas-quote-status{display:none;margin:14px 0 0;padding:11px 13px;background:#eef7f7!important;border-left:4px solid var(--teal,#00bfd0);color:#33444d!important;font-size:11px;font-weight:700;line-height:1.5}.spcas-quote-status.is-visible{display:block}.spcas-quote-status.is-error{background:#fff1f0!important;border-left-color:#b9372e;color:#8e2f29!important}.spcas-quote-status.is-success{background:#eef8f4!important;border-left-color:#24825f;color:#245e4c!important}
.spcas-quote-actions{display:flex;gap:9px;justify-content:flex-end;margin-top:14px}
.spcas-quote-submit,.spcas-quote-cancel{min-height:44px;padding:10px 16px;border-radius:4px;font:900 10px/1 Inter,Arial,sans-serif;letter-spacing:.08em;text-transform:uppercase;cursor:pointer}
.spcas-quote-submit{border:1px solid var(--orange,#f36c21)!important;background:var(--orange,#f36c21)!important;color:#fff!important}.spcas-quote-submit:hover{filter:brightness(.96)}.spcas-quote-submit:disabled{opacity:.65;cursor:wait}
.spcas-quote-cancel{border:1px solid #cbd4d9!important;background:#fff!important;color:#34414a!important}
.spcas-quote-note{margin:9px 0 0!important;color:#77828a!important;font-size:9px!important;line-height:1.5!important;text-align:right!important}

@media(max-width:860px){
  .spcas-quote-backdrop{padding:12px!important;align-items:flex-start!important}
  .spcas-quote-modal{max-height:calc(100vh - 24px)!important}
  .spcas-quote-modal-head{padding:17px 17px 15px}
  .spcas-quote-modal-head h2{font-size:24px!important}
  .spcas-quote-modal-body{max-height:calc(100vh - 140px);padding:12px}
  .spcas-quote-layout{grid-template-columns:1fr}
  .spcas-quote-summary-scroll{max-height:none}
}
@media(max-width:560px){
  .spcas-quote-grid{grid-template-columns:1fr;padding:13px}.spcas-quote-full{grid-column:auto}
  .spcas-system-request-basis{grid-template-columns:1fr}.spcas-system-request-basis>div{border-right:0;border-bottom:1px solid #d9e0e4}.spcas-system-request-basis>div:last-child{border-bottom:0}
  .spcas-quote-actions{flex-direction:column}.spcas-quote-submit,.spcas-quote-cancel{width:100%}.spcas-quote-note{text-align:left!important}
}


/* =========================================================
   v1.3.0 — clearer equipment selection + receiver calculator
   ========================================================= */
.sp-cas-app .sb-node-stage-actions{display:flex;align-items:center;gap:4px;margin-left:auto}
.sp-cas-app .sb-node-adjust{display:inline-flex;align-items:center;min-height:17px;padding:0 5px;border:1px solid #d7dee2;background:#f5f7f8;color:#5c6871;font-size:6.2px;font-weight:900;letter-spacing:.06em;text-transform:uppercase}
.sp-cas-app .sb-node:hover .sb-node-adjust,.sp-cas-app .sb-node.selected .sb-node-adjust{border-color:#f1b38d;background:#fff4eb;color:#c85617}
.sp-cas-app .sb-refine-controls{display:grid;grid-template-columns:minmax(220px,340px) auto;gap:7px 8px;align-items:end;align-self:center;min-width:360px}
.sp-cas-app .sb-option-label{grid-column:1/-1;color:#56636c;font-size:7.5px;font-weight:900;letter-spacing:.12em;text-transform:uppercase}
.sp-cas-app .sb-option-select{width:100%;height:36px;border:1px solid #cbd4d9;border-radius:0;background:#fff;color:#25313a;padding:0 28px 0 9px;font:700 9px/1.2 Inter,Arial,sans-serif;outline:none}
.sp-cas-app .sb-option-select:focus{border-color:var(--orange);box-shadow:0 0 0 2px rgba(243,108,33,.12)}
.sp-cas-app .sb-option-select:disabled{background:#eef2f4;color:#7a858c}
.sp-cas-app .sb-auto-one{height:36px;border:1px solid #cbd4d9;background:#fff;color:#26333c;padding:0 10px;font:900 7px/1 Inter,Arial,sans-serif;letter-spacing:.08em;text-transform:uppercase;cursor:pointer;white-space:nowrap}
.sp-cas-app .sb-auto-one:hover{border-color:var(--orange);color:var(--orange)}
.sp-cas-app .sb-auto-one:disabled{opacity:.45;cursor:not-allowed}
@media(max-width:760px){.sp-cas-app .sb-refine-controls{min-width:0;width:100%;grid-template-columns:1fr}.sp-cas-app .sb-option-label{grid-column:auto}.sp-cas-app .sb-auto-one{width:100%}}
@media(max-width:760px){.sp-cas-app .sb-node-adjust{display:none}}

.sp-cas-app .sptank-shell .spoc-workspace{align-items:stretch}
.sp-cas-app .sptank-actions{flex-wrap:wrap}
.sp-cas-app .sptank-actions .spoc-btn{flex:1 1 145px}
.sp-cas-app .sptank-match{margin-top:13px;border:1px solid #d7dee2;background:#fff}
.sp-cas-app .sptank-match-head{display:flex;justify-content:space-between;gap:14px;align-items:center;padding:10px 12px;background:#172733;color:#fff}
.sp-cas-app .sptank-match-head strong{font-size:10px;letter-spacing:.09em;text-transform:uppercase}
.sp-cas-app .sptank-match-head span{color:#cbd7dc;font-size:8px;text-align:right}
.sp-cas-app .sptank-product{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:14px;padding:13px 14px;border-bottom:1px solid #e4e8ea}
.sp-cas-app .sptank-product-label{display:block;margin-bottom:4px;color:#c85617;font-size:7px;font-weight:900;letter-spacing:.09em;text-transform:uppercase}
.sp-cas-app .sptank-product strong{display:block;color:#27323a;font-size:15px;line-height:1.15}
.sp-cas-app .sptank-product small{display:block;margin-top:3px;color:#6d7880;font-size:8px;font-weight:800}
.sp-cas-app .sptank-product p{margin:0!important;color:#727d84!important;font-size:8.5px!important;line-height:1.45!important}
.sp-cas-app .sptank-match-note{padding:10px 12px;background:#f6f8f9;color:#5f6a72;font-size:8.5px;line-height:1.45;border-bottom:1px solid #e4e8ea}
.sp-cas-app .sptank-match-review{border-left:4px solid var(--orange);background:#fff6ef;color:#654b3c}
.sp-cas-app .sptank-available{display:flex;gap:6px;align-items:center;flex-wrap:wrap;padding:10px 12px;color:#6a757d;font-size:8px}
.sp-cas-app .sptank-available span{margin-right:3px;font-weight:800;text-transform:uppercase;letter-spacing:.06em}
.sp-cas-app .sptank-available strong{padding:3px 5px;border:1px solid #d7dee2;background:#f5f7f8;color:#34414a;font-size:8px}
@media(max-width:560px){.sp-cas-app .sptank-match-head,.sp-cas-app .sptank-product{display:block}.sp-cas-app .sptank-match-head span{display:block;margin-top:4px;text-align:left}.sp-cas-app .sptank-product p{margin-top:8px!important}}

.sp-cas-app .sb-cond-box{position:absolute}.sp-cas-app .sb-cond-change{position:absolute;right:5px;top:4px;margin:0!important;padding:2px 4px;border:1px solid #ead0bf;background:#fff7f2;color:#b9521a;font-style:normal;font-size:5.8px!important;font-weight:900;letter-spacing:.06em;text-transform:uppercase}.sp-cas-app .sb-cond-box:hover .sb-cond-change,.sp-cas-app .sb-cond-box.selected .sb-cond-change{border-color:#f0a97f;background:#fff0e6}

/* Quote request confirmation toast */
.spcas-success-toast{
  position:fixed;
  right:24px;
  bottom:24px;
  z-index:100000;
  width:min(430px,calc(100vw - 32px));
  display:flex;
  align-items:flex-start;
  gap:12px;
  padding:15px 16px;
  background:#162126!important;
  border:1px solid rgba(255,255,255,.16);
  border-left:4px solid #2fa878;
  box-shadow:0 18px 50px rgba(0,0,0,.28);
  color:#fff!important;
  opacity:0;
  visibility:hidden;
  transform:translateY(18px);
  pointer-events:none;
  transition:opacity .2s ease,transform .2s ease,visibility .2s ease;
}
.spcas-success-toast.is-visible{opacity:1;visibility:visible;transform:translateY(0)}
.spcas-success-toast-icon{
  width:28px;
  height:28px;
  flex:0 0 28px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:#2fa878!important;
  color:#fff!important;
  font-size:16px;
  font-weight:900;
  line-height:1;
}
.spcas-success-toast-copy{display:grid;gap:3px;min-width:0}
.spcas-success-toast-copy strong{margin:0!important;color:#fff!important;font-size:13px!important;line-height:1.25!important;text-transform:uppercase;letter-spacing:.035em;font-weight:900!important}
.spcas-success-toast-copy span{color:#d8e1e4!important;font-size:12px!important;line-height:1.45!important;font-weight:600!important}
@media (max-width:640px){
  .spcas-success-toast{right:16px;bottom:16px;left:16px;width:auto}
}

/* =========================================================
   v1.4.0 — intelligent builder experience / visual system flow
   ========================================================= */
.sp-cas-app .sb-basis{padding:16px 16px 15px}
.sp-cas-app .sb-air-quality-field small{display:block;margin-top:2px;color:#738089;font-size:8px;line-height:1.45;font-weight:650}
.sp-cas-app .sb-advanced{margin:6px 0 10px;border:1px solid #d1d9de;background:#fff}
.sp-cas-app .sb-advanced summary{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:38px;padding:8px 10px;cursor:pointer;list-style:none;color:#33414a;font-size:8px;font-weight:900;letter-spacing:.09em;text-transform:uppercase}
.sp-cas-app .sb-advanced summary::-webkit-details-marker{display:none}
.sp-cas-app .sb-advanced summary::after{content:'+';display:grid;place-items:center;width:18px;height:18px;background:#172733;color:#fff;font-size:12px;line-height:1;flex:0 0 18px}
.sp-cas-app .sb-advanced[open] summary::after{content:'–'}
.sp-cas-app .sb-advanced summary small{margin-left:auto;color:#88939a;font-size:7px;font-weight:800;letter-spacing:.05em;text-transform:none}
.sp-cas-app .sb-advanced-body{padding:10px 10px 2px;border-top:1px solid #e1e6e9;background:#f8fafb}
.sp-cas-app .sb-advanced-body .sb-field:last-child{margin-bottom:8px}

.sp-cas-app .sb-canvas-toolbar{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;margin-bottom:8px}
.sp-cas-app .sb-view-controls{justify-self:center;display:flex;border:1px solid #c7d1d7;background:#fff}
.sp-cas-app .sb-view-btn{min-height:32px;padding:0 12px;border:0;border-right:1px solid #d2dbe0;background:#fff;color:#64717a;font:900 7.5px/1 Inter,Arial,sans-serif;letter-spacing:.09em;text-transform:uppercase;cursor:pointer}
.sp-cas-app .sb-view-btn:last-child{border-right:0}
.sp-cas-app .sb-view-btn:hover{color:#1e2b34;background:#f6f8f9}
.sp-cas-app .sb-view-btn.active{background:#172733;color:#fff;box-shadow:inset 0 -3px 0 var(--teal)}
.sp-cas-app .sb-view-btn[data-view="cond"].active{box-shadow:inset 0 -3px 0 var(--orange)}
.sp-cas-app .sb-view-btn[data-view="sizing"].active{box-shadow:inset 0 -3px 0 #7d8b94}

.sp-cas-app .sb-canvas{min-width:1180px!important;height:430px!important;min-height:430px!important;overflow:hidden;isolation:isolate}
.sp-cas-app .sb-canvas::before{opacity:.78}
.sp-cas-app .sb-layer-label{position:absolute;left:8px;z-index:7;padding:3px 5px;background:rgba(255,255,255,.93);border-left:3px solid #9ca8af;color:#6a757d;font-size:6.5px;font-weight:900;letter-spacing:.1em;text-transform:uppercase;pointer-events:none}
.sp-cas-app .sb-layer-distribution{top:12px;border-left-color:#203444}
.sp-cas-app .sb-layer-air{top:116px;border-left-color:var(--teal)}
.sp-cas-app .sb-layer-cond{bottom:12px;border-left-color:var(--orange)}

.sp-cas-app .sb-ring{left:56px;right:56px;top:32px;height:72px;border-width:4px;border-bottom-color:transparent;transition:opacity .2s ease,filter .2s ease}
.sp-cas-app .sb-ring-flow{left:56px;right:56px;top:32px;height:4px;transition:opacity .2s ease;filter:drop-shadow(0 0 4px rgba(0,191,208,.24))}
.sp-cas-app .sb-ring-label{top:46px;padding:5px 8px;font-size:7.5px;box-shadow:0 4px 10px rgba(35,50,60,.06)}
.sp-cas-app .sb-ring-feed{position:absolute;right:118px;top:32px;width:4px;height:101px;background:#203444;z-index:3;transition:opacity .2s ease}
.sp-cas-app .sb-ring-feed::after{content:'';position:absolute;inset:0;background:repeating-linear-gradient(180deg,var(--teal) 0 10px,transparent 10px 18px);background-size:4px 36px;animation:sbFeedFlow var(--flow-speed) linear infinite;opacity:.95}
.sp-cas-app .sb-ring-feed::before{content:'';position:absolute;left:-5px;top:-5px;width:0;height:0;border-left:7px solid transparent;border-right:7px solid transparent;border-bottom:10px solid var(--teal);z-index:2}
.sp-cas-app .sb-ring-feed span{position:absolute;right:10px;bottom:9px;width:max-content;padding:3px 5px;background:#fff;border:1px solid #d4dce1;color:#53616a;font-size:6.5px;font-weight:900;letter-spacing:.08em;text-transform:uppercase}
@keyframes sbFeedFlow{from{background-position:0 36px}to{background-position:0 0}}
.sp-cas-app .sb-drop{top:32px;height:72px;width:3px;transition:opacity .2s ease}
.sp-cas-app .sb-drop.d1{left:20%}.sp-cas-app .sb-drop.d2{left:48%}.sp-cas-app .sb-drop.d3{left:76%}
.sp-cas-app .sb-poi{top:82px;font-size:7px;padding:3px 5px;transition:opacity .2s ease}
.sp-cas-app .sb-poi.p1{left:20%}.sp-cas-app .sb-poi.p2{left:48%}.sp-cas-app .sb-poi.p3{left:76%}

.sp-cas-app .sb-nodes{left:30px;right:30px;top:132px;gap:0;align-items:flex-start}
.sp-cas-app .sb-node-wrap{position:relative;display:flex;align-items:flex-start;min-width:0;flex:1}
.sp-cas-app .sb-node-stack{position:relative;width:116px;min-width:116px;height:196px;z-index:6;transition:opacity .2s ease,filter .2s ease}
.sp-cas-app .sb-node{width:116px!important;min-width:116px!important;height:196px!important;padding:0!important;border:0!important;background:transparent!important;box-shadow:none!important;overflow:visible;display:flex;flex-direction:column;align-items:stretch;transition:transform .16s ease,opacity .2s ease,filter .2s ease}
.sp-cas-app .sb-node:hover{transform:translateY(-2px);box-shadow:none!important}
.sp-cas-app .sb-node-stage{height:22px;margin-bottom:5px;padding-left:1px;font-size:7.5px;letter-spacing:.075em;color:#66737c}
.sp-cas-app .sb-node-num{width:22px;height:22px;font-size:8px}
.sp-cas-app .sb-node-visual{position:relative;width:78px;height:72px;margin:0 auto 6px;padding:6px;border:1px solid #c8d2d8;background:linear-gradient(180deg,#fff,#edf2f5);display:grid;place-items:center;overflow:hidden;box-shadow:0 5px 12px rgba(35,50,60,.08);transition:border-color .16s ease,box-shadow .16s ease,transform .16s ease}
.sp-cas-app .sb-node.selected .sb-node-visual{border-color:var(--orange);box-shadow:inset 0 0 0 2px var(--orange),0 7px 16px rgba(35,50,60,.11)}
.sp-cas-app .sb-node.bottleneck .sb-node-visual{border-color:#d86721;box-shadow:inset 0 0 0 2px rgba(216,103,33,.42),0 7px 16px rgba(35,50,60,.11)}
.sp-cas-app .sb-node-info{position:relative;flex:1;min-height:91px;padding:8px 8px 31px;border:1px solid #d0d9de;background:#fff;box-shadow:0 5px 12px rgba(35,50,60,.055);overflow:hidden;text-align:left;transition:border-color .16s ease,background .16s ease,box-shadow .16s ease}
.sp-cas-app .sb-node.selected .sb-node-info{border-color:#efaa80;background:#fffaf7;box-shadow:0 6px 14px rgba(35,50,60,.07)}
.sp-cas-app .sb-node.bottleneck .sb-node-info{border-color:#e09a6f}
.sp-cas-app .sb-node-name{font-size:9.5px;line-height:1.1;letter-spacing:.025em}
.sp-cas-app .sb-node-value{margin-top:4px;font-size:9px;line-height:1.25;font-weight:850;color:#28343c;-webkit-line-clamp:2}
.sp-cas-app .sb-node-sub{margin-top:4px;font-size:8px;line-height:1.25;color:#69767f;min-height:0;-webkit-line-clamp:2}
.sp-cas-app .sb-node-flow{left:8px;right:8px;bottom:6px;font-size:7.2px;line-height:1.16;letter-spacing:.01em;text-transform:none;color:#067b85;white-space:normal;overflow:visible}
.sp-cas-app .sb-node-caption{right:6px;top:31px;font-size:6.5px;padding:2px 4px}
.sp-cas-app .sb-node-change{position:absolute;right:3px;top:27px;z-index:9;min-height:20px;padding:0 6px;border:1px solid #d3dce1;background:#fff;color:#65717a;font:900 6px/1 Inter,Arial,sans-serif;letter-spacing:.07em;text-transform:uppercase;cursor:pointer;box-shadow:0 2px 7px rgba(31,45,55,.06)}
.sp-cas-app .sb-node-change:hover,.sp-cas-app .sb-node.selected + .sb-node-change{border-color:#efa77c;background:#fff4ec;color:#b84f16}
.sp-cas-app .sb-node.is-updated .sb-node-visual,.sp-cas-app .sb-node.is-updated .sb-node-info{animation:sbUpdated 1.05s ease}
@keyframes sbUpdated{0%{box-shadow:0 0 0 0 rgba(0,191,208,.55)}45%{box-shadow:0 0 0 6px rgba(0,191,208,.12)}100%{box-shadow:0 5px 12px rgba(35,50,60,.07)}}
.sp-cas-app .sb-connector{position:relative;flex:1;min-width:10px;height:7px;margin-top:63px;background:#203444;overflow:hidden;transition:opacity .2s ease,filter .2s ease}
.sp-cas-app .sb-connector::after{inset:2px 0;background-size:34px 3px;filter:drop-shadow(0 0 3px rgba(0,191,208,.2))}

.sp-cas-app .sb-node-cond-drop{position:absolute;left:50%;top:196px;width:0;height:59px;border-left:2px dashed var(--orange);z-index:2;transform:translateX(-50%);opacity:.36;transition:opacity .2s ease,filter .2s ease}
.sp-cas-app .sb-node-cond-drop::before{content:'';position:absolute;left:-4px;top:-4px;width:7px;height:7px;background:#fff;border:2px solid var(--orange)}
.sp-cas-app .sb-node-cond-drop i{position:absolute;left:-4px;bottom:-3px;width:7px;height:7px;background:var(--orange);transform:rotate(45deg)}
.sp-cas-app .sb-cond-line{left:54px;right:54px;bottom:41px;border-top:2px dashed var(--orange);transition:opacity .2s ease,filter .2s ease}
.sp-cas-app .sb-cond-label{left:60px;bottom:49px;font-size:7px;padding:3px 5px}
.sp-cas-app .sb-cond-box{bottom:7px;min-width:164px;min-height:46px;padding:6px 8px;background:#fff;border-color:#dfb292;box-shadow:0 4px 10px rgba(35,50,60,.06);transition:opacity .2s ease,filter .2s ease,border-color .2s ease}
.sp-cas-app .sb-cond-box strong{font-size:7.5px}.sp-cas-app .sb-cond-box span{font-size:6.8px;line-height:1.25}
.sp-cas-app .sb-cond-box.drain{left:38%}.sp-cas-app .sb-cond-box.ows{right:5%}
.sp-cas-app .sb-cond-box.selected{border-color:var(--orange);box-shadow:inset 0 0 0 1px var(--orange),0 5px 12px rgba(35,50,60,.08)}

.sp-cas-app .sb-view-air .sb-node-cond-drop,.sp-cas-app .sb-view-air .sb-cond-line,.sp-cas-app .sb-view-air .sb-cond-label{opacity:.18}
.sp-cas-app .sb-view-air .sb-cond-box{opacity:.66}
.sp-cas-app .sb-view-cond .sb-ring,.sp-cas-app .sb-view-cond .sb-ring-flow,.sp-cas-app .sb-view-cond .sb-ring-feed,.sp-cas-app .sb-view-cond .sb-drop,.sp-cas-app .sb-view-cond .sb-poi,.sp-cas-app .sb-view-cond .sb-connector{opacity:.13;filter:saturate(.25)}
.sp-cas-app .sb-view-cond .sb-node-stack{opacity:.56;filter:saturate(.5)}
.sp-cas-app .sb-view-cond .sb-node-stack:has(.sb-node-cond-drop){opacity:.9;filter:none}
.sp-cas-app .sb-view-cond .sb-node-cond-drop,.sp-cas-app .sb-view-cond .sb-cond-line,.sp-cas-app .sb-view-cond .sb-cond-label,.sp-cas-app .sb-view-cond .sb-cond-box{opacity:1;filter:drop-shadow(0 0 4px rgba(243,108,33,.08))}
.sp-cas-app .sb-view-sizing .sb-ring-flow,.sp-cas-app .sb-view-sizing .sb-ring-feed::after,.sp-cas-app .sb-view-sizing .sb-connector::after{animation:none!important;opacity:.35}
.sp-cas-app .sb-view-sizing .sb-node-flow{padding:3px 4px;left:5px;right:5px;bottom:4px;background:#edf7f8;color:#0a6e76;font-weight:900}
.sp-cas-app .sb-view-sizing .sb-node.bottleneck .sb-node-flow{background:#fff0e7;color:#b44e18}
.sp-cas-app .sb-view-sizing .sb-node-cond-drop,.sp-cas-app .sb-view-sizing .sb-cond-line,.sp-cas-app .sb-view-sizing .sb-cond-label,.sp-cas-app .sb-view-sizing .sb-cond-box{opacity:.18}

.sp-cas-app .sb-builder-notice{position:absolute;right:12px;top:111px;z-index:30;max-width:360px;padding:8px 10px;background:#172733;color:#fff;font-size:8px;font-weight:800;line-height:1.4;border-left:4px solid var(--teal);box-shadow:0 8px 20px rgba(19,35,46,.18);opacity:0;visibility:hidden;transform:translateY(-4px);transition:opacity .18s ease,transform .18s ease,visibility .18s ease;pointer-events:none}
.sp-cas-app .sb-builder-notice.is-visible{opacity:1;visibility:visible;transform:translateY(0)}

.sp-cas-app .sb-inline-picker{position:absolute;z-index:40;width:340px;max-width:calc(100% - 16px);padding:10px;background:#fff;border:1px solid #bfcbd1;border-top:4px solid var(--orange);box-shadow:0 14px 30px rgba(25,39,49,.22)}
.sp-cas-app .sb-inline-picker[hidden]{display:none!important}
.sp-cas-app .sb-inline-picker-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:7px}
.sp-cas-app .sb-inline-picker-head strong{color:#25323a;font-size:10px;line-height:1.2;text-transform:uppercase;letter-spacing:.045em}
.sp-cas-app .sb-inline-picker-head button{width:24px;height:24px;padding:0;border:1px solid #d2dbe0;background:#fff;color:#5d6870;font-size:16px;line-height:1;cursor:pointer}
.sp-cas-app .sb-inline-picker label{display:block;margin-bottom:4px;color:#68747d;font-size:7px;font-weight:900;letter-spacing:.09em;text-transform:uppercase}
.sp-cas-app .sb-inline-picker select{width:100%;height:34px;border:1px solid #c8d2d8;background:#fff;color:#26333b;padding:0 26px 0 8px;font:700 8.5px/1.2 Inter,Arial,sans-serif}
.sp-cas-app .sb-inline-auto{width:100%;min-height:31px;margin-top:7px;border:1px solid #c8d2d8;background:#f7f9fa;color:#34414a;font:900 7px/1 Inter,Arial,sans-serif;letter-spacing:.08em;text-transform:uppercase;cursor:pointer}
.sp-cas-app .sb-inline-auto:hover{border-color:var(--orange);color:var(--orange);background:#fff8f3}

.sp-cas-app .sb-inspector{grid-template-columns:minmax(0,1fr) minmax(330px,430px);gap:18px;padding:13px 16px 15px;border-top:1px solid #dde4e8}
.sp-cas-app .sb-inspector h3{font-size:20px}
.sp-cas-app .sb-inspector-selection{font-size:11px}
.sp-cas-app .sb-inspector-detail{font-size:9.5px;line-height:1.45;max-width:840px}
.sp-cas-app .sb-inspector-why{display:grid;grid-template-columns:auto 1fr;gap:8px;align-items:start;margin-top:8px;padding:8px 9px;background:#f4f8f9;border-left:3px solid var(--teal);max-width:880px}
.sp-cas-app .sb-inspector-why strong{color:#29363e;font-size:7px;line-height:1.4;letter-spacing:.09em;text-transform:uppercase;white-space:nowrap}
.sp-cas-app .sb-inspector-why span{color:#53616a;font-size:8.5px;line-height:1.45;font-weight:650}
.sp-cas-app .sb-inspector-tags span{font-size:7px;padding:4px 6px}
.sp-cas-app .sb-receiver-size{margin-top:8px;min-height:32px;padding:0 10px;border:1px solid var(--teal);background:#fff;color:#087782;font:900 7px/1 Inter,Arial,sans-serif;letter-spacing:.08em;text-transform:uppercase;cursor:pointer}
.sp-cas-app .sb-receiver-size:hover{background:#eef9fa}
.sp-cas-app .sb-refine-controls{grid-template-columns:minmax(230px,1fr) auto;min-width:0;width:100%;max-width:430px}
.sp-cas-app .sb-option-select{height:38px;font-size:9px}
.sp-cas-app .sb-auto-one{height:38px;font-size:7px}

.sp-cas-app .sb-canvas.is-assembling .sb-node-stack{animation:sbAssembleIn .42s cubic-bezier(.2,.75,.25,1) both;animation-delay:calc(var(--sb-i) * 85ms)}
.sp-cas-app .sb-canvas.is-assembling .sb-connector{animation:sbConnectorIn .28s ease both;animation-delay:calc((var(--sb-i) * 85ms) + 190ms)}
@keyframes sbAssembleIn{from{opacity:0;transform:translateY(12px) scale(.97)}to{opacity:1;transform:none}}
@keyframes sbConnectorIn{from{opacity:0;transform:scaleX(0);transform-origin:left}to{opacity:1;transform:scaleX(1);transform-origin:left}}

@media(max-width:980px){
  .sp-cas-app .sb-canvas-toolbar{grid-template-columns:1fr auto}.sp-cas-app .sb-view-controls{justify-self:end}.sp-cas-app .sb-legend-row{grid-column:1/-1}
  .sp-cas-app .sb-inspector{grid-template-columns:1fr}.sp-cas-app .sb-refine-controls{max-width:none}
}
@media(max-width:760px){
  .sp-cas-app .sb-canvas{min-width:1080px!important;height:420px!important;min-height:420px!important}
  .sp-cas-app .sb-canvas-toolbar{grid-template-columns:1fr}.sp-cas-app .sb-view-controls{justify-self:start}.sp-cas-app .sb-legend-row{grid-column:auto}
  .sp-cas-app .sb-node-stack{width:112px;min-width:112px}.sp-cas-app .sb-node{width:112px!important;min-width:112px!important}
  .sp-cas-app .sb-advanced summary small{display:none}
}
@media(max-width:560px){
  .sp-cas-app .sb-view-btn{padding:0 9px;font-size:7px}.sp-cas-app .sb-inspector-why{grid-template-columns:1fr;gap:3px}
}
@media(prefers-reduced-motion:reduce){
  .sp-cas-app .sb-ring-flow,.sp-cas-app .sb-ring-feed::after,.sp-cas-app .sb-connector::after,.sp-cas-app .sb-node.is-updated .sb-node-visual,.sp-cas-app .sb-node.is-updated .sb-node-info,.sp-cas-app .sb-canvas.is-assembling .sb-node-stack,.sp-cas-app .sb-canvas.is-assembling .sb-connector{animation:none!important}
  .sp-cas-app .sb-node,.sp-cas-app .sb-node-visual,.sp-cas-app .sb-builder-notice{transition:none!important}
}
.sp-cas-app .spcas-system-request-basis{grid-template-columns:repeat(4,1fr)}
@media(max-width:720px){.sp-cas-app .spcas-system-request-basis{grid-template-columns:1fr 1fr}.sp-cas-app .spcas-system-request-basis>div:nth-child(2){border-right:0}}
@media(max-width:480px){.sp-cas-app .spcas-system-request-basis{grid-template-columns:1fr}.sp-cas-app .spcas-system-request-basis>div{border-right:0}}

/* =========================================================
   v1.4.1 — full-width builder controls + no-scroll desktop layout
   ========================================================= */

/* Move the design controls out of the left rail so the system diagram can use
   the full available width. This is intentionally a layout-only refinement;
   existing control IDs, values, selection logic, and quote behavior are
   unchanged. */
@media (min-width:981px){
  .sp-cas-app .sb-workspace{
    display:grid;
    grid-template-columns:minmax(0,1fr)!important;
    min-height:0;
  }
  .sp-cas-app .sb-basis{
    position:relative;
    z-index:20;
    display:grid;
    grid-template-columns:minmax(150px,.72fr) minmax(220px,1.05fr) minmax(270px,1.35fr) minmax(190px,.86fr) minmax(190px,.88fr);
    grid-template-rows:auto auto;
    gap:10px 12px;
    align-items:end;
    padding:13px 16px 11px;
    border-right:0;
    border-bottom:1px solid var(--line);
    background:#f5f7f8;
  }
  .sp-cas-app .sb-basis-title{
    grid-column:1;
    grid-row:1;
    align-self:center;
    margin:0;
    min-height:44px;
  }
  .sp-cas-app .sb-basis-title strong{font-size:11.5px;line-height:1.2}
  .sp-cas-app .sb-step{width:27px;height:27px;font-size:10px}
  .sp-cas-app .sb-basis>.sb-inline{
    grid-column:2;
    grid-row:1;
    gap:8px;
    align-self:end;
  }
  .sp-cas-app .sb-basis>.sb-inline .sb-field,
  .sp-cas-app .sb-air-quality-field{margin-bottom:0}
  .sp-cas-app .sb-basis .sb-field{gap:4px}
  .sp-cas-app .sb-basis .sb-field label{font-size:7.5px;letter-spacing:.115em}
  .sp-cas-app .sb-basis .sb-field input,
  .sp-cas-app .sb-basis .sb-field select{min-height:40px;padding:8px 9px;font-size:12px}
  .sp-cas-app .sb-air-quality-field{
    grid-column:3;
    grid-row:1;
    align-self:end;
  }
  .sp-cas-app .sb-air-quality-field small{font-size:7.4px;line-height:1.35;margin-top:3px}
  .sp-cas-app .sb-advanced{
    grid-column:4;
    grid-row:1;
    align-self:end;
    position:relative;
    z-index:55;
    margin:0;
  }
  .sp-cas-app .sb-advanced summary{min-height:40px;padding:7px 9px}
  .sp-cas-app .sb-advanced summary small{font-size:6.5px}
  .sp-cas-app .sb-advanced-body{
    position:absolute;
    top:calc(100% + 6px);
    right:0;
    width:420px;
    padding:11px 11px 3px;
    border:1px solid #cbd5da;
    border-top:4px solid var(--teal);
    background:#f8fafb;
    box-shadow:0 16px 34px rgba(24,39,49,.2);
  }
  .sp-cas-app .sb-advanced[open]{border-color:#becbd1;box-shadow:0 4px 12px rgba(31,45,55,.06)}
  .sp-cas-app .sb-build-btn{
    grid-column:5;
    grid-row:1;
    align-self:end;
    min-height:44px;
    margin:0;
    padding-left:14px;
    padding-right:14px;
  }
  .sp-cas-app .sb-basis-note{
    grid-column:1/-1;
    grid-row:2;
    margin:0;
    padding:7px 10px;
    font-size:8.4px;
    line-height:1.45;
    background:#fff;
  }
  .sp-cas-app .sb-main{min-width:0;width:100%}
  .sp-cas-app .sb-metrics{grid-template-columns:repeat(4,minmax(0,1fr))}
  .sp-cas-app .sb-metric{min-height:78px;padding:12px 15px}
  .sp-cas-app .sb-metric-value{font-size:22px}
  .sp-cas-app .sb-metric-sub{font-size:8.5px}
  .sp-cas-app .sb-canvas-wrap{padding:11px 12px 10px}
}

/* Once the builder has desktop-width real estate, fit all eight equipment
   points on one canvas rather than forcing a horizontal scrollbar. */
@media (min-width:1100px){
  .sp-cas-app .sb-scroll{overflow-x:visible;overflow-y:visible;padding-bottom:0}
  .sp-cas-app .sb-canvas{
    width:100%!important;
    min-width:0!important;
    height:446px!important;
    min-height:446px!important;
  }
  .sp-cas-app .sb-nodes{left:24px;right:24px;top:134px}
  .sp-cas-app .sb-node-wrap{min-width:0;flex:1 1 0}
  .sp-cas-app .sb-node-stack{width:110px;min-width:110px;height:210px}
  .sp-cas-app .sb-node{width:110px!important;min-width:110px!important;height:210px!important}
  .sp-cas-app .sb-node-stage{height:23px;margin-bottom:6px;font-size:7.8px}
  .sp-cas-app .sb-node-num{width:23px;height:23px;font-size:8.5px}
  .sp-cas-app .sb-node-visual{width:80px;height:76px;margin-bottom:7px;padding:6px}
  .sp-cas-app .sb-node-info{min-height:98px;padding:9px 9px 33px}
  .sp-cas-app .sb-node-name{font-size:9.8px;line-height:1.12}
  .sp-cas-app .sb-node-value{font-size:9.3px;line-height:1.28}
  .sp-cas-app .sb-node-sub{font-size:8.15px;line-height:1.28}
  .sp-cas-app .sb-node-flow{left:9px;right:9px;bottom:7px;font-size:7.35px;line-height:1.18}
  .sp-cas-app .sb-node-caption{top:33px;font-size:6.7px}
  .sp-cas-app .sb-node-change{top:29px;min-height:21px;font-size:6.2px}
  .sp-cas-app .sb-connector{min-width:6px;height:7px;margin-top:67px}
  .sp-cas-app .sb-node-cond-drop{top:210px;height:58px}
  .sp-cas-app .sb-cond-line{left:48px;right:48px;bottom:40px}
  .sp-cas-app .sb-cond-label{left:54px;bottom:48px}
  .sp-cas-app .sb-cond-box{bottom:7px;min-width:176px;min-height:47px}
  .sp-cas-app .sb-ring-feed{right:86px}
}

/* Use the extra width on standard desktop and widescreen displays to make the
   product cards and imagery genuinely easier to scan. */
@media (min-width:1280px){
  .sp-cas-app .sb-node-stack{width:126px;min-width:126px;height:214px}
  .sp-cas-app .sb-node{width:126px!important;min-width:126px!important;height:214px!important}
  .sp-cas-app .sb-node-visual{width:86px;height:80px}
  .sp-cas-app .sb-node-info{min-height:100px;padding:9px 9px 34px}
  .sp-cas-app .sb-node-name{font-size:10.3px}
  .sp-cas-app .sb-node-value{font-size:9.7px}
  .sp-cas-app .sb-node-sub{font-size:8.45px}
  .sp-cas-app .sb-node-flow{font-size:7.55px}
  .sp-cas-app .sb-node-cond-drop{top:214px;height:54px}
  .sp-cas-app .sb-ring-feed{right:92px}
}

/* Keep the existing horizontal-scroll safety net on smaller screens, where
   shrinking all eight equipment cards further would make them less legible. */
@media (max-width:980px){
  .sp-cas-app .sb-basis{position:relative;z-index:2}
  .sp-cas-app .sb-advanced{position:static}
  .sp-cas-app .sb-advanced-body{position:static;width:auto;box-shadow:none;border-left:0;border-right:0;border-bottom:0}
}

/* Compact two-row top controls for smaller desktop/laptop widths. */
@media (min-width:981px) and (max-width:1179px){
  .sp-cas-app .sb-basis{
    grid-template-columns:150px minmax(250px,1fr) minmax(250px,1fr);
    grid-template-rows:auto auto auto;
  }
  .sp-cas-app .sb-basis-title{grid-column:1;grid-row:1}
  .sp-cas-app .sb-basis>.sb-inline{grid-column:2;grid-row:1}
  .sp-cas-app .sb-air-quality-field{grid-column:3;grid-row:1}
  .sp-cas-app .sb-advanced{grid-column:1/3;grid-row:2}
  .sp-cas-app .sb-build-btn{grid-column:3;grid-row:2}
  .sp-cas-app .sb-basis-note{grid-column:1/-1;grid-row:3}
  .sp-cas-app .sb-advanced-body{left:0;right:auto;width:min(520px,calc(100vw - 70px))}
}
@media (min-width:1100px) and (max-width:1279px){.sp-cas-app .sb-ring-feed{right:96px}}
@media (min-width:1280px){.sp-cas-app .sb-ring-feed{right:120px}}

/* =========================================================
   v1.4.2 — full-page builder width + aligned controls + clean cards
   ========================================================= */

/* Break the application out of narrow theme content columns on desktop while
   retaining a modest page gutter. This is presentation-only and does not alter
   builder state, selection logic, saved settings, or quote behavior. */
@media (min-width:1100px){
  .sp-cas-app{
    max-width:none!important;
    margin-left:calc(50% - 50vw + 20px)!important;
    margin-right:calc(50% - 50vw + 20px)!important;
  }
}

/* On full desktop widths, give every design-basis control its own grid column.
   The existing field IDs and DOM elements are preserved; display:contents only
   promotes the two airflow/pressure fields into the parent layout grid. */
@media (min-width:1280px){
  .sp-cas-app .sb-basis{
    grid-template-columns:
      160px
      minmax(115px,.55fr)
      minmax(115px,.55fr)
      minmax(280px,1.35fr)
      minmax(185px,.85fr)
      minmax(205px,.9fr)!important;
    grid-template-rows:auto auto!important;
    column-gap:12px;
    row-gap:9px;
    align-items:start;
    padding:14px 16px 11px;
  }
  .sp-cas-app .sb-basis-title{
    grid-column:1!important;
    grid-row:1!important;
    align-self:start;
    min-height:44px;
    margin:17px 0 0!important;
  }
  .sp-cas-app .sb-basis>.sb-inline{
    display:contents;
  }
  .sp-cas-app .sb-basis>.sb-inline>.sb-field:nth-child(1){
    grid-column:2;
    grid-row:1;
  }
  .sp-cas-app .sb-basis>.sb-inline>.sb-field:nth-child(2){
    grid-column:3;
    grid-row:1;
  }
  .sp-cas-app .sb-air-quality-field{
    grid-column:4!important;
    grid-row:1!important;
  }
  .sp-cas-app .sb-advanced{
    grid-column:5!important;
    grid-row:1!important;
    align-self:start!important;
    margin:17px 0 0!important;
  }
  .sp-cas-app .sb-build-btn{
    grid-column:6!important;
    grid-row:1!important;
    align-self:start!important;
    min-height:44px;
    margin:17px 0 0!important;
  }
  .sp-cas-app .sb-basis-note{
    grid-column:1/-1!important;
    grid-row:2!important;
  }
  .sp-cas-app .sb-basis .sb-field{
    gap:5px;
    margin:0;
    min-width:0;
  }
  .sp-cas-app .sb-basis .sb-field label{
    display:flex;
    align-items:flex-end;
    min-height:12px;
    font-size:7.8px;
    line-height:1.15;
  }
  .sp-cas-app .sb-basis .sb-field input,
  .sp-cas-app .sb-basis .sb-field select,
  .sp-cas-app .sb-advanced summary{
    min-height:44px;
  }
  .sp-cas-app .sb-air-quality-field small{
    max-width:520px;
    font-size:7.5px;
    line-height:1.35;
  }
  .sp-cas-app .sb-advanced-body{
    right:0;
    width:min(470px,calc(100vw - 56px));
  }
}

/* Use the additional page width for genuinely readable equipment cards rather
   than simply stretching the connectors. The information stack uses normal
   document flow so long SKUs/specs cannot collide with the capacity line. */
@media (min-width:1280px){
  .sp-cas-app .sb-canvas-wrap{
    padding:12px 14px 11px;
  }
  .sp-cas-app .sb-canvas{
    width:100%!important;
    min-width:0!important;
    height:494px!important;
    min-height:494px!important;
  }
  .sp-cas-app .sb-nodes{
    left:34px;
    right:34px;
    top:136px;
  }
  .sp-cas-app .sb-node-wrap{
    min-width:0;
    flex:1 1 0;
  }
  .sp-cas-app .sb-node-stack{
    width:clamp(144px,9.5vw,164px)!important;
    min-width:clamp(144px,9.5vw,164px)!important;
    height:236px!important;
  }
  .sp-cas-app .sb-node{
    width:clamp(144px,9.5vw,164px)!important;
    min-width:clamp(144px,9.5vw,164px)!important;
    height:236px!important;
  }
  .sp-cas-app .sb-node-stage{
    height:24px;
    margin-bottom:6px;
    font-size:8px;
  }
  .sp-cas-app .sb-node-num{
    width:24px;
    height:24px;
    font-size:8.5px;
  }
  .sp-cas-app .sb-node-visual{
    width:96px;
    height:84px;
    margin:0 auto 7px;
    padding:7px;
  }
  .sp-cas-app .sb-node-info{
    display:flex;
    flex-direction:column;
    flex:1 1 auto;
    min-height:112px;
    padding:9px 10px 8px;
    overflow:hidden;
  }
  .sp-cas-app .sb-node-name{
    display:-webkit-box;
    min-height:23px;
    overflow:hidden;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
    font-size:10.4px;
    line-height:1.1;
    letter-spacing:.02em;
    overflow-wrap:anywhere;
  }
  .sp-cas-app .sb-node-value{
    display:-webkit-box;
    min-height:23px;
    margin-top:4px;
    overflow:hidden;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
    font-size:9.6px;
    line-height:1.18;
    overflow-wrap:anywhere;
  }
  .sp-cas-app .sb-node-sub{
    display:-webkit-box;
    min-height:21px;
    margin-top:4px;
    overflow:hidden;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
    font-size:8.45px;
    line-height:1.22;
    overflow-wrap:anywhere;
  }
  .sp-cas-app .sb-node-flow{
    position:static!important;
    left:auto!important;
    right:auto!important;
    bottom:auto!important;
    display:-webkit-box;
    margin-top:auto;
    padding-top:6px;
    border-top:1px solid #e8edef;
    overflow:hidden!important;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
    font-size:7.7px;
    line-height:1.18;
    letter-spacing:0;
    white-space:normal;
    overflow-wrap:anywhere;
  }
  .sp-cas-app .sb-view-sizing .sb-node-flow{
    margin-top:auto;
    padding:5px 5px 4px;
    border-top:0;
  }
  .sp-cas-app .sb-node-caption{
    top:35px;
    right:7px;
    font-size:6.8px;
  }
  .sp-cas-app .sb-node-change{
    top:31px;
    right:4px;
    min-height:22px;
    padding:0 7px;
    font-size:6.5px;
  }
  .sp-cas-app .sb-connector{
    min-width:6px;
    height:7px;
    margin-top:69px;
  }
  .sp-cas-app .sb-node-cond-drop{
    top:236px;
    height:74px;
  }
  .sp-cas-app .sb-cond-line{
    left:58px;
    right:58px;
    bottom:44px;
  }
  .sp-cas-app .sb-cond-label{
    left:64px;
    bottom:52px;
  }
  .sp-cas-app .sb-cond-box{
    bottom:8px;
    min-width:190px;
    min-height:48px;
  }
  .sp-cas-app .sb-ring-feed{
    right:9%;
  }
}

/* On very wide displays, slightly increase spacing without letting the cards
   become oversized or overly sparse. */
@media (min-width:1700px){
  .sp-cas-app .sb-nodes{left:42px;right:42px}
  .sp-cas-app .sb-canvas-wrap{padding-left:16px;padding-right:16px}
}

/* =========================================================
   v1.4.3 — balanced desktop gutters + legibility refinement
   ========================================================= */

/* Keep the experience expansive, but add a little more breathing room between
   the application and the browser edge on desktop. The existing theme-breakout
   behavior remains intact; only the visual gutter changes. */
@media (min-width:1100px){
  .sp-cas-app{
    margin-left:calc(50% - 50vw + 28px)!important;
    margin-right:calc(50% - 50vw + 28px)!important;
  }
}
@media (min-width:1700px){
  .sp-cas-app{
    margin-left:calc(50% - 50vw + 36px)!important;
    margin-right:calc(50% - 50vw + 36px)!important;
  }
}

/* Increase the small supporting type throughout the builder without changing
   hierarchy or forcing the controls into additional rows. */
@media (min-width:1100px){
  .sp-cas-app .sb-basis .sb-field label{font-size:8.35px;line-height:1.2}
  .sp-cas-app .sb-air-quality-field small{font-size:8.05px;line-height:1.4}
  .sp-cas-app .sb-advanced summary{font-size:8.45px}
  .sp-cas-app .sb-advanced summary small{font-size:7px}
  .sp-cas-app .sb-basis-note{font-size:9px;line-height:1.48}
  .sp-cas-app .sb-metric-label{font-size:9.4px;line-height:1.2}
  .sp-cas-app .sb-metric-sub{font-size:9.1px;line-height:1.42}
  .sp-cas-app .sb-canvas-toolbar strong{font-size:11.4px}
  .sp-cas-app .sb-view-btn{font-size:8.15px;min-height:34px;padding-left:13px;padding-right:13px}
  .sp-cas-app .sb-legend-row span{font-size:7.75px}
  .sp-cas-app .sb-layer-label{font-size:7.35px;line-height:1.15}
  .sp-cas-app .sb-ring-label{font-size:8.15px}
  .sp-cas-app .sb-ring-feed span{font-size:7.25px}
  .sp-cas-app .sb-poi{font-size:7.8px}
  .sp-cas-app .sb-cond-label{font-size:7.55px}
  .sp-cas-app .sb-cond-box strong{font-size:8.15px}
  .sp-cas-app .sb-cond-box span{font-size:7.45px;line-height:1.3}

  .sp-cas-app .sb-inspector-kicker{font-size:8.7px}
  .sp-cas-app .sb-inspector-selection{font-size:11.4px}
  .sp-cas-app .sb-inspector-detail{font-size:10.2px;line-height:1.5}
  .sp-cas-app .sb-inspector-why strong{font-size:7.8px}
  .sp-cas-app .sb-inspector-why span{font-size:9.25px;line-height:1.48}
  .sp-cas-app .sb-inspector-tags span{font-size:7.6px}
  .sp-cas-app .sb-option-label{font-size:7.8px}
  .sp-cas-app .sb-option-select{font-size:9.7px}
  .sp-cas-app .sb-auto-one{font-size:7.55px}
  .sp-cas-app .sb-bottom-copy{font-size:9.2px;line-height:1.52}
  .sp-cas-app .sb-bottom-actions .btn{font-size:8.55px}
}

/* The additional desktop width is used to give the equipment cards slightly
   more room and to raise their minimum readable type size. All text remains in
   normal flow with controlled clamping so long model numbers cannot overlap. */
@media (min-width:1280px){
  .sp-cas-app .sb-canvas{
    height:506px!important;
    min-height:506px!important;
  }
  .sp-cas-app .sb-nodes{
    left:38px;
    right:38px;
    top:138px;
  }
  .sp-cas-app .sb-node-stack{
    width:clamp(148px,9.65vw,170px)!important;
    min-width:clamp(148px,9.65vw,170px)!important;
    height:242px!important;
  }
  .sp-cas-app .sb-node{
    width:clamp(148px,9.65vw,170px)!important;
    min-width:clamp(148px,9.65vw,170px)!important;
    height:242px!important;
  }
  .sp-cas-app .sb-node-stage{
    height:25px;
    margin-bottom:6px;
    font-size:8.65px;
    line-height:1.15;
  }
  .sp-cas-app .sb-node-num{
    width:25px;
    height:25px;
    font-size:9.25px;
  }
  .sp-cas-app .sb-node-visual{
    width:100px;
    height:87px;
    margin-bottom:7px;
    padding:7px;
  }
  .sp-cas-app .sb-node-info{
    min-height:116px;
    padding:10px 10px 9px;
  }
  .sp-cas-app .sb-node-name{
    min-height:25px;
    font-size:11px;
    line-height:1.12;
  }
  .sp-cas-app .sb-node-value{
    min-height:24px;
    margin-top:4px;
    font-size:10.05px;
    line-height:1.22;
  }
  .sp-cas-app .sb-node-sub{
    min-height:23px;
    margin-top:4px;
    font-size:8.85px;
    line-height:1.28;
  }
  .sp-cas-app .sb-node-flow{
    margin-top:auto;
    padding-top:6px;
    font-size:8.25px;
    line-height:1.22;
  }
  .sp-cas-app .sb-node-caption{
    top:36px;
    right:7px;
    font-size:7.25px;
  }
  .sp-cas-app .sb-node-change{
    top:32px;
    right:4px;
    min-height:23px;
    padding:0 7px;
    font-size:7px;
  }
  .sp-cas-app .sb-connector{margin-top:72px}
  .sp-cas-app .sb-node-cond-drop{
    top:242px;
    height:76px;
  }
  .sp-cas-app .sb-cond-line{bottom:44px}
  .sp-cas-app .sb-cond-label{bottom:52px}
  .sp-cas-app .sb-cond-box{bottom:8px;min-height:49px}
}

@media (min-width:1700px){
  .sp-cas-app .sb-nodes{left:46px;right:46px}
  .sp-cas-app .sb-node-stack,
  .sp-cas-app .sb-node{
    width:clamp(154px,9.45vw,176px)!important;
    min-width:clamp(154px,9.45vw,176px)!important;
  }
  .sp-cas-app .sb-node-name{font-size:11.25px}
  .sp-cas-app .sb-node-value{font-size:10.3px}
  .sp-cas-app .sb-node-sub{font-size:9.05px}
  .sp-cas-app .sb-node-flow{font-size:8.45px}
}

/* =========================================================
   v1.4.4 — readable builder typography + balanced card scale
   ========================================================= */

/* The builder is frequently viewed on large desktop displays. The previous
   pass preserved the full-system view, but several information tiers were
   still too small at normal browser zoom. These overrides raise the practical
   reading size while keeping the eight-point system on one line and retaining
   the existing responsive scroll fallback below desktop widths. */
@media (min-width:1100px){
  .sp-cas-app .sb-basis .sb-field label{
    font-size:10px;
    line-height:1.25;
    letter-spacing:.1em;
  }
  .sp-cas-app .sb-basis .sb-field input,
  .sp-cas-app .sb-basis .sb-field select{
    min-height:46px;
    padding:9px 11px;
    font-size:14px;
  }
  .sp-cas-app .sb-air-quality-field small{
    margin-top:4px;
    font-size:9.6px;
    line-height:1.45;
  }
  .sp-cas-app .sb-advanced summary{
    min-height:46px;
    padding:9px 11px;
    font-size:10px;
    line-height:1.25;
  }
  .sp-cas-app .sb-advanced summary small{
    font-size:8.6px;
    line-height:1.25;
  }
  .sp-cas-app .sb-build-btn{
    min-height:46px;
    font-size:11px;
  }
  .sp-cas-app .sb-basis-note{
    padding:9px 11px;
    font-size:10.5px;
    line-height:1.5;
  }

  .sp-cas-app .sb-metric{
    min-height:88px;
    padding:14px 16px;
  }
  .sp-cas-app .sb-metric-label{
    font-size:10.5px;
    line-height:1.2;
  }
  .sp-cas-app .sb-metric-value{
    margin-top:5px;
    font-size:26px;
  }
  .sp-cas-app .sb-metric-value small{
    font-size:12px;
  }
  .sp-cas-app .sb-metric-sub{
    margin-top:5px;
    font-size:10.5px;
    line-height:1.42;
  }

  .sp-cas-app .sb-canvas-toolbar{
    margin-bottom:10px;
  }
  .sp-cas-app .sb-canvas-toolbar strong{
    font-size:12.5px;
  }
  .sp-cas-app .sb-view-btn{
    min-height:38px;
    padding:0 15px;
    font-size:9.5px;
  }
  .sp-cas-app .sb-legend-row span{
    font-size:9px;
  }
  .sp-cas-app .sb-layer-label{
    padding:4px 6px;
    font-size:8.8px;
    line-height:1.15;
  }
  .sp-cas-app .sb-ring-label{
    padding:6px 9px;
    font-size:9.3px;
  }
  .sp-cas-app .sb-ring-feed span{
    padding:4px 6px;
    font-size:8.5px;
  }
  .sp-cas-app .sb-poi{
    font-size:9px;
  }
  .sp-cas-app .sb-cond-label{
    font-size:8.9px;
  }
  .sp-cas-app .sb-cond-box strong{
    font-size:9.6px;
    line-height:1.25;
  }
  .sp-cas-app .sb-cond-box span{
    font-size:8.8px;
    line-height:1.35;
  }

  /* The detail/refine panel should read like normal interface copy rather than
     micro-copy. The control column remains aligned with the explanation. */
  .sp-cas-app .sb-inspector{
    grid-template-columns:minmax(0,1fr) minmax(430px,540px);
    gap:28px;
    padding:20px 24px 22px;
    align-items:start;
  }
  .sp-cas-app .sb-inspector-kicker{
    font-size:10px;
    line-height:1.2;
  }
  .sp-cas-app .sb-inspector h3{
    margin:5px 0 6px;
    font-size:30px;
    line-height:1;
  }
  .sp-cas-app .sb-inspector-selection{
    font-size:14px;
    line-height:1.35;
  }
  .sp-cas-app .sb-inspector-detail{
    margin-top:7px;
    max-width:980px;
    font-size:12.5px;
    line-height:1.55;
  }
  .sp-cas-app .sb-inspector-why{
    grid-template-columns:auto minmax(0,1fr);
    gap:10px;
    margin-top:11px;
    padding:10px 12px;
    max-width:1040px;
  }
  .sp-cas-app .sb-inspector-why strong{
    font-size:9.5px;
    line-height:1.45;
  }
  .sp-cas-app .sb-inspector-why span{
    font-size:11.5px;
    line-height:1.5;
  }
  .sp-cas-app .sb-inspector-tags{
    gap:7px;
    margin-top:11px;
  }
  .sp-cas-app .sb-inspector-tags span{
    padding:5px 8px;
    font-size:9px;
  }
  .sp-cas-app .sb-refine-controls{
    grid-template-columns:minmax(300px,1fr) auto;
    max-width:540px;
    gap:9px;
  }
  .sp-cas-app .sb-option-label{
    font-size:9.5px;
    line-height:1.25;
  }
  .sp-cas-app .sb-option-select{
    height:46px;
    padding-left:11px;
    padding-right:34px;
    font-size:11.5px;
    line-height:1.3;
  }
  .sp-cas-app .sb-auto-one{
    height:46px;
    padding:0 12px;
    font-size:9px;
    line-height:1.1;
  }
  .sp-cas-app .sb-receiver-size{
    min-height:38px;
    padding:0 12px;
    font-size:9px;
  }
  .sp-cas-app .sb-bottom{
    padding:12px 18px;
  }
  .sp-cas-app .sb-bottom-copy{
    max-width:1040px;
    font-size:10.5px;
    line-height:1.5;
  }
  .sp-cas-app .sb-bottom-actions .btn{
    min-height:40px;
    padding:9px 12px;
    font-size:9.5px;
  }
}

/* Standard desktop: keep every point visible without a side scroller while
   establishing a readable 10–12 px information hierarchy. */
@media (min-width:1280px) and (max-width:1499px){
  .sp-cas-app .sb-canvas{
    height:540px!important;
    min-height:540px!important;
  }
  .sp-cas-app .sb-nodes{
    left:30px;
    right:30px;
    top:142px;
  }
  .sp-cas-app .sb-node-stack,
  .sp-cas-app .sb-node{
    width:clamp(132px,9.1vw,140px)!important;
    min-width:clamp(132px,9.1vw,140px)!important;
    height:264px!important;
  }
  .sp-cas-app .sb-node-stage{
    height:28px;
    margin-bottom:7px;
    font-size:9.2px;
    line-height:1.15;
  }
  .sp-cas-app .sb-node-num{
    width:27px;
    height:27px;
    font-size:10px;
  }
  .sp-cas-app .sb-node-visual{
    width:96px;
    height:86px;
    margin-bottom:8px;
    padding:7px;
  }
  .sp-cas-app .sb-node-info{
    min-height:130px;
    padding:10px 10px 9px;
  }
  .sp-cas-app .sb-node-name{
    min-height:27px;
    font-size:11.7px;
    line-height:1.14;
  }
  .sp-cas-app .sb-node-value{
    min-height:27px;
    margin-top:5px;
    font-size:10.6px;
    line-height:1.24;
  }
  .sp-cas-app .sb-node-sub{
    min-height:25px;
    margin-top:5px;
    font-size:9.6px;
    line-height:1.28;
  }
  .sp-cas-app .sb-node-flow{
    margin-top:auto;
    padding-top:7px;
    font-size:9.25px;
    line-height:1.25;
  }
  .sp-cas-app .sb-node-caption{
    top:39px;
    font-size:8.2px;
  }
  .sp-cas-app .sb-node-change{
    top:35px;
    min-height:25px;
    padding:0 7px;
    font-size:7.8px;
  }
  .sp-cas-app .sb-connector{
    min-width:4px;
    margin-top:76px;
  }
  .sp-cas-app .sb-node-cond-drop{
    top:264px;
    height:80px;
  }
  .sp-cas-app .sb-cond-line{
    bottom:48px;
  }
  .sp-cas-app .sb-cond-label{
    bottom:57px;
  }
  .sp-cas-app .sb-cond-box{
    bottom:9px;
    min-height:52px;
  }
}

/* Wide desktop: take advantage of the available width so product cards read
   comfortably at normal zoom instead of looking like miniature labels. */
@media (min-width:1500px){
  .sp-cas-app .sb-canvas{
    height:582px!important;
    min-height:582px!important;
  }
  .sp-cas-app .sb-nodes{
    left:42px;
    right:42px;
    top:144px;
  }
  .sp-cas-app .sb-node-stack,
  .sp-cas-app .sb-node{
    width:clamp(158px,9.35vw,180px)!important;
    min-width:clamp(158px,9.35vw,180px)!important;
    height:300px!important;
  }
  .sp-cas-app .sb-node-stage{
    height:30px;
    margin-bottom:8px;
    font-size:9.8px;
    line-height:1.15;
  }
  .sp-cas-app .sb-node-num{
    width:29px;
    height:29px;
    font-size:10.5px;
  }
  .sp-cas-app .sb-node-visual{
    width:108px;
    height:94px;
    margin-bottom:9px;
    padding:8px;
  }
  .sp-cas-app .sb-node-info{
    min-height:154px;
    padding:12px 11px 10px;
  }
  .sp-cas-app .sb-node-name{
    min-height:30px;
    font-size:13.5px;
    line-height:1.14;
  }
  .sp-cas-app .sb-node-value{
    min-height:29px;
    margin-top:5px;
    font-size:12.1px;
    line-height:1.25;
  }
  .sp-cas-app .sb-node-sub{
    min-height:27px;
    margin-top:5px;
    font-size:10.9px;
    line-height:1.3;
  }
  .sp-cas-app .sb-node-flow{
    margin-top:auto;
    padding-top:8px;
    font-size:10.6px;
    line-height:1.25;
  }
  .sp-cas-app .sb-node-caption{
    top:41px;
    right:8px;
    font-size:8.6px;
  }
  .sp-cas-app .sb-node-change{
    top:37px;
    right:4px;
    min-height:27px;
    padding:0 8px;
    font-size:8.2px;
  }
  .sp-cas-app .sb-connector{
    min-width:6px;
    height:8px;
    margin-top:82px;
  }
  .sp-cas-app .sb-node-cond-drop{
    top:300px;
    height:84px;
  }
  .sp-cas-app .sb-cond-line{
    left:66px;
    right:66px;
    bottom:50px;
  }
  .sp-cas-app .sb-cond-label{
    left:72px;
    bottom:59px;
  }
  .sp-cas-app .sb-cond-box{
    bottom:9px;
    min-width:208px;
    min-height:54px;
    padding:8px 10px;
  }
  .sp-cas-app .sb-cond-visual{
    width:34px;
    height:34px;
  }
}

/* Preserve useful card readability on smaller desktop/laptop layouts. The
   existing horizontal scroll fallback still takes over below 981 px. */
@media (min-width:1100px) and (max-width:1279px){
  .sp-cas-app .sb-node-name{font-size:10.8px}
  .sp-cas-app .sb-node-value{font-size:10px}
  .sp-cas-app .sb-node-sub{font-size:9.1px}
  .sp-cas-app .sb-node-flow{font-size:8.8px}
  .sp-cas-app .sb-inspector{grid-template-columns:minmax(0,1fr) minmax(360px,440px)}
}

/* =========================================================
   v1.4.5 — professional builder layout + readability system
   ========================================================= */

/* This release deliberately leaves every builder control, data point, ID,
   calculation, and interaction in place. The changes below reorganize visual
   hierarchy, spacing, and type scale so the application reads like a finished
   engineering/sales interface instead of a dense proof-of-concept. */
@media (min-width:1100px){
  .sp-cas-app .system-builder{
    margin-top:34px;
    border-color:#c5cfd5;
    box-shadow:0 16px 38px rgba(18,32,42,.13);
  }
  .sp-cas-app .sb-head{
    align-items:center;
    gap:34px;
    padding:28px 30px 27px;
    border-left-width:7px;
  }
  .sp-cas-app .sb-kicker{
    margin-bottom:7px;
    font-size:10.5px;
    letter-spacing:.17em;
  }
  .sp-cas-app .sb-head h2{
    font-size:40px;
    line-height:.96;
  }
  .sp-cas-app .sb-head p{
    max-width:930px;
    margin-top:11px;
    font-size:14.5px;
    line-height:1.58;
  }
  .sp-cas-app .sb-head-badge{
    padding:11px 14px;
    font-size:10.5px;
    line-height:1.2;
    border-color:rgba(255,255,255,.24);
    background:rgba(255,255,255,.035);
  }

  /* Design basis becomes a deliberate control deck. */
  .sp-cas-app .sb-basis{
    gap:12px 14px;
    padding:17px 18px 14px;
    background:#f0f4f6;
    border-bottom:1px solid #ccd6dc;
    align-items:start;
  }
  .sp-cas-app .sb-basis-title{
    min-height:54px;
    margin:0!important;
    padding:10px 11px;
    align-self:start!important;
    background:#172733;
    color:#fff;
    border-left:4px solid var(--teal);
  }
  .sp-cas-app .sb-basis-title strong{
    color:#fff;
    font-size:12px;
    line-height:1.2;
    letter-spacing:.075em;
  }
  .sp-cas-app .sb-step{
    width:30px;
    height:30px;
    background:var(--orange);
    color:#fff;
    font-size:11px;
  }
  .sp-cas-app .sb-basis .sb-field{
    gap:6px;
    margin:0;
  }
  .sp-cas-app .sb-basis .sb-field label{
    min-height:0;
    font-size:10.5px;
    line-height:1.25;
    letter-spacing:.085em;
    color:#43515b;
  }
  .sp-cas-app .sb-basis .sb-field input,
  .sp-cas-app .sb-basis .sb-field select{
    min-height:48px;
    padding:10px 12px;
    border-color:#bdc9d0;
    font-size:14px;
    line-height:1.3;
    background:#fff;
  }
  .sp-cas-app .sb-air-quality-field small{
    display:block;
    margin-top:5px;
    font-size:10.25px;
    line-height:1.45;
    color:#64717a;
  }
  .sp-cas-app .sb-advanced{
    border-color:#c6d1d7;
    background:#fff;
  }
  .sp-cas-app .sb-advanced summary{
    min-height:48px;
    padding:10px 11px;
    font-size:10.5px;
    line-height:1.25;
  }
  .sp-cas-app .sb-advanced summary small{
    font-size:9px;
    line-height:1.25;
  }
  .sp-cas-app .sb-advanced summary::after{
    width:22px;
    height:22px;
    flex-basis:22px;
    font-size:14px;
  }
  .sp-cas-app .sb-advanced-body{
    width:min(520px,calc(100vw - 70px));
    padding:14px 14px 5px;
    border-top-width:4px;
  }
  .sp-cas-app .sb-advanced-body .sb-field label{font-size:10px}
  .sp-cas-app .sb-advanced-body .sb-field input,
  .sp-cas-app .sb-advanced-body .sb-field select{font-size:13px}
  .sp-cas-app .sb-build-btn{
    min-height:48px;
    padding:11px 16px!important;
    font-size:11.5px;
    line-height:1.2;
    letter-spacing:.07em;
  }
  .sp-cas-app .sb-basis-note{
    margin:0;
    padding:10px 12px;
    border-left-width:4px;
    background:#fff;
    color:#596872;
    font-size:11px;
    line-height:1.5;
  }

  /* Four dashboard metrics read as distinct information cards. */
  .sp-cas-app .sb-metrics{
    gap:10px;
    padding:13px 14px;
    background:#e9eff2;
    border-bottom:1px solid #cbd6dc;
  }
  .sp-cas-app .sb-metric{
    min-height:100px;
    padding:15px 16px 14px;
    border:1px solid #c9d4da!important;
    border-top:3px solid #81919b!important;
    background:#fff;
    box-shadow:0 4px 12px rgba(28,43,53,.045);
  }
  .sp-cas-app .sb-metric.is-good{border-top-color:var(--teal)!important}
  .sp-cas-app .sb-metric.is-warn{border-top-color:var(--orange)!important}
  .sp-cas-app .sb-metric-label{
    font-size:10.5px;
    line-height:1.2;
    letter-spacing:.105em;
  }
  .sp-cas-app .sb-metric-value{
    margin-top:6px;
    font-size:28px;
    line-height:1;
  }
  .sp-cas-app .sb-metric-value small{font-size:12.5px}
  .sp-cas-app .sb-metric-sub{
    margin-top:7px;
    font-size:11px;
    line-height:1.4;
  }

  /* Give the map its own clear workspace and hierarchy. */
  .sp-cas-app .sb-canvas-wrap{
    padding:17px 18px 16px;
    background:#f3f6f7;
  }
  .sp-cas-app .sb-canvas-toolbar{
    min-height:42px;
    margin-bottom:12px;
    gap:16px;
  }
  .sp-cas-app .sb-canvas-toolbar strong{
    font-size:13.5px;
    letter-spacing:.09em;
  }
  .sp-cas-app .sb-view-controls{border-color:#bcc9d0}
  .sp-cas-app .sb-view-btn{
    min-height:40px;
    padding:0 17px;
    font-size:10px;
    letter-spacing:.08em;
  }
  .sp-cas-app .sb-legend-row{gap:16px}
  .sp-cas-app .sb-legend-row span{
    gap:7px;
    font-size:9.5px;
    letter-spacing:.075em;
  }
  .sp-cas-app .sb-legend-row i{width:20px;height:4px}
  .sp-cas-app .sb-canvas{
    border-color:#bcc9d0;
    background:#fbfcfd;
    box-shadow:inset 0 1px 0 #fff;
  }
  .sp-cas-app .sb-layer-label{
    padding:5px 7px;
    border-left-width:4px;
    font-size:9.25px;
    line-height:1.15;
    letter-spacing:.09em;
  }
  .sp-cas-app .sb-ring-label{
    padding:6px 10px;
    font-size:9.75px;
    letter-spacing:.1em;
  }
  .sp-cas-app .sb-ring-feed span{
    padding:4px 7px;
    font-size:9px;
  }
  .sp-cas-app .sb-poi{
    padding:4px 6px;
    font-size:9.5px;
  }
  .sp-cas-app .sb-cond-label{
    padding:4px 7px;
    font-size:9.25px;
  }
  .sp-cas-app .sb-cond-box{
    min-height:58px;
    padding:8px 10px;
    column-gap:9px;
  }
  .sp-cas-app .sb-cond-box strong{
    font-size:10.25px;
    line-height:1.25;
  }
  .sp-cas-app .sb-cond-box span{
    font-size:9.5px;
    line-height:1.35;
  }
  .sp-cas-app .sb-cond-visual{width:36px;height:36px}
  .sp-cas-app .sb-cond-change{
    font-size:8px;
    line-height:1.1;
  }

  /* Product cards: readable, consistent, and still compact enough to preserve
     the complete eight-point system view on normal desktop screens. */
  .sp-cas-app .sb-node-stage{
    color:#4d5d67;
    font-weight:900;
    letter-spacing:.07em;
  }
  .sp-cas-app .sb-node-num{
    background:#172733;
    color:#fff;
  }
  .sp-cas-app .sb-node-visual{
    border-color:#bdc9d0;
    background:linear-gradient(180deg,#fff 0%,#eef3f5 100%);
    box-shadow:0 6px 15px rgba(28,43,53,.08);
  }
  .sp-cas-app .sb-node-info{
    border-color:#c7d2d8;
    background:#fff;
    box-shadow:0 5px 14px rgba(28,43,53,.055);
  }
  .sp-cas-app .sb-node-name{
    color:#1f2c34;
    letter-spacing:.018em;
  }
  .sp-cas-app .sb-node-value{color:#2a3740}
  .sp-cas-app .sb-node-sub{color:#66747d}
  .sp-cas-app .sb-node-flow{
    color:#087982;
    border-top-color:#e2e9ec;
  }
  .sp-cas-app .sb-node-change{
    border-color:#c3ced4;
    background:#fff;
    color:#4d5b65;
    box-shadow:0 3px 9px rgba(24,39,49,.08);
  }
  .sp-cas-app .sb-node-change:hover,
  .sp-cas-app .sb-node.selected + .sb-node-change{
    border-color:var(--orange);
    background:#fff4ec;
    color:#a94612;
  }

  /* Change popover should be usable without squinting. */
  .sp-cas-app .sb-inline-picker{
    width:420px;
    padding:14px;
    border-color:#b7c5cc;
    box-shadow:0 18px 38px rgba(25,39,49,.23);
  }
  .sp-cas-app .sb-inline-picker-head{margin-bottom:10px}
  .sp-cas-app .sb-inline-picker-head strong{
    font-size:12px;
    line-height:1.25;
  }
  .sp-cas-app .sb-inline-picker-head button{
    width:30px;
    height:30px;
    font-size:18px;
  }
  .sp-cas-app .sb-inline-picker label{
    margin-bottom:6px;
    font-size:9.5px;
  }
  .sp-cas-app .sb-inline-picker select{
    height:44px;
    padding-left:10px;
    padding-right:32px;
    font-size:11.5px;
  }
  .sp-cas-app .sb-inline-auto{
    min-height:40px;
    margin-top:9px;
    font-size:9px;
  }

  /* Selected component / refine area: treat this as the explanatory panel, not
     a footer. It gets normal reading sizes and a clearly grouped control card. */
  .sp-cas-app .sb-inspector{
    grid-template-columns:minmax(0,1.35fr) minmax(390px,.65fr);
    gap:28px;
    padding:24px 26px 25px;
    border-top:1px solid #cbd6dc;
    background:#fff;
    align-items:start;
  }
  .sp-cas-app .sb-inspector-kicker{
    font-size:10.5px;
    line-height:1.2;
  }
  .sp-cas-app .sb-inspector h3{
    margin:6px 0 7px;
    font-size:31px;
    line-height:1;
  }
  .sp-cas-app .sb-inspector-selection{
    font-size:14.5px;
    line-height:1.35;
  }
  .sp-cas-app .sb-inspector-detail{
    max-width:1020px;
    margin-top:8px;
    font-size:13px;
    line-height:1.56;
  }
  .sp-cas-app .sb-inspector-why{
    gap:11px;
    margin-top:12px;
    padding:11px 13px;
    border-left-width:4px;
    background:#f1f7f8;
  }
  .sp-cas-app .sb-inspector-why strong{
    font-size:10px;
    line-height:1.45;
  }
  .sp-cas-app .sb-inspector-why span{
    font-size:12px;
    line-height:1.52;
  }
  .sp-cas-app .sb-inspector-tags{
    gap:8px;
    margin-top:12px;
  }
  .sp-cas-app .sb-inspector-tags span{
    padding:6px 9px;
    font-size:9.5px;
    line-height:1.15;
  }
  .sp-cas-app .sb-refine-controls{
    grid-template-columns:minmax(250px,1fr) auto;
    gap:10px;
    width:100%;
    max-width:none;
    min-width:0;
    padding:15px;
    align-self:stretch;
    align-content:center;
    background:#f3f6f7;
    border:1px solid #ccd6dc;
    border-top:4px solid #172733;
  }
  .sp-cas-app .sb-option-label{
    font-size:10px;
    line-height:1.25;
  }
  .sp-cas-app .sb-option-select{
    height:48px;
    padding-left:12px;
    padding-right:34px;
    border-color:#bdc9d0;
    font-size:12.5px;
    line-height:1.3;
  }
  .sp-cas-app .sb-auto-one{
    height:48px;
    padding:0 13px;
    font-size:9.5px;
    line-height:1.12;
  }
  .sp-cas-app .sb-receiver-size{
    min-height:40px;
    padding:0 13px;
    font-size:9.5px;
  }
  .sp-cas-app .sb-bottom{
    gap:24px;
    padding:15px 20px;
    background:#eef2f4;
  }
  .sp-cas-app .sb-bottom-copy{
    max-width:1160px;
    font-size:11.25px;
    line-height:1.52;
  }
  .sp-cas-app .sb-bottom-actions{gap:9px}
  .sp-cas-app .sb-bottom-actions .btn{
    min-height:42px;
    padding:10px 13px;
    font-size:10px;
  }

  /* Carry the improved reading scale through the supporting application tools
     so the builder does not feel disconnected from the rest of the page. */
  .sp-cas-app .application-tool-head{padding:21px 23px}
  .sp-cas-app .application-tool-kicker{font-size:10.5px}
  .sp-cas-app .application-tool-head h3{font-size:29px}
  .sp-cas-app .application-tool-head p{
    max-width:900px;
    font-size:14px;
    line-height:1.58;
  }
  .sp-cas-app .application-tool-toggle{
    min-height:46px;
    padding:11px 15px;
    font-size:11px;
  }
  .sp-cas-app .cta{padding:27px 25px 27px 30px}
  .sp-cas-app .cta p{font-size:14.5px;line-height:1.6}
  .sp-cas-app .fine-print{font-size:11px;line-height:1.62}
}

/* Laptop desktop: preserve readable cards even if that means a controlled
   horizontal map scroll. Controls still remain compact and aligned. */
@media (min-width:1100px) and (max-width:1279px){
  .sp-cas-app .sb-basis{
    grid-template-columns:170px minmax(270px,1fr) minmax(280px,1fr)!important;
    grid-template-rows:auto auto auto!important;
  }
  .sp-cas-app .sb-basis-title{grid-column:1!important;grid-row:1!important}
  .sp-cas-app .sb-basis>.sb-inline{grid-column:2!important;grid-row:1!important;display:grid!important;grid-template-columns:1fr 1fr!important}
  .sp-cas-app .sb-air-quality-field{grid-column:3!important;grid-row:1!important}
  .sp-cas-app .sb-advanced{grid-column:1/3!important;grid-row:2!important;margin:0!important}
  .sp-cas-app .sb-build-btn{grid-column:3!important;grid-row:2!important;margin:0!important;align-self:stretch!important}
  .sp-cas-app .sb-basis-note{grid-column:1/-1!important;grid-row:3!important}
  .sp-cas-app .sb-scroll{overflow-x:auto!important;overflow-y:hidden!important;padding-bottom:6px}
  .sp-cas-app .sb-canvas{min-width:1320px!important;width:1320px!important;height:558px!important;min-height:558px!important}
  .sp-cas-app .sb-nodes{left:28px;right:28px;top:144px}
  .sp-cas-app .sb-node-stack,
  .sp-cas-app .sb-node{width:138px!important;min-width:138px!important;height:282px!important}
  .sp-cas-app .sb-node-stage{height:27px;margin-bottom:7px;font-size:9.5px}
  .sp-cas-app .sb-node-num{width:26px;height:26px;font-size:9.5px}
  .sp-cas-app .sb-node-visual{width:96px;height:88px;margin-bottom:8px;padding:7px}
  .sp-cas-app .sb-node-info{min-height:145px;padding:11px 10px 10px}
  .sp-cas-app .sb-node-name{min-height:28px;font-size:12px;line-height:1.15}
  .sp-cas-app .sb-node-value{min-height:27px;font-size:11px;line-height:1.24}
  .sp-cas-app .sb-node-sub{min-height:25px;font-size:10px;line-height:1.3}
  .sp-cas-app .sb-node-flow{font-size:9.6px;line-height:1.25;padding-top:7px}
  .sp-cas-app .sb-node-change{top:35px;min-height:26px;font-size:8px}
  .sp-cas-app .sb-connector{min-width:8px;margin-top:77px}
  .sp-cas-app .sb-node-cond-drop{top:282px;height:82px}
  .sp-cas-app .sb-cond-line{bottom:49px}
  .sp-cas-app .sb-cond-label{bottom:58px}
  .sp-cas-app .sb-cond-box{bottom:10px;min-width:190px}
  .sp-cas-app .sb-inspector{grid-template-columns:minmax(0,1fr) minmax(360px,430px)}
}

/* Standard desktop: all eight points remain visible, but the cards now use a
   proper 10–12px supporting type scale and taller information area. */
@media (min-width:1280px) and (max-width:1499px){
  .sp-cas-app .sb-basis{
    grid-template-columns:175px minmax(125px,.55fr) minmax(125px,.55fr) minmax(300px,1.35fr) minmax(205px,.85fr) minmax(220px,.9fr)!important;
    grid-template-rows:auto auto!important;
  }
  .sp-cas-app .sb-basis>.sb-inline{display:contents!important}
  .sp-cas-app .sb-basis-title{grid-column:1!important;grid-row:1!important}
  .sp-cas-app .sb-basis>.sb-inline>.sb-field:nth-child(1){grid-column:2!important;grid-row:1!important}
  .sp-cas-app .sb-basis>.sb-inline>.sb-field:nth-child(2){grid-column:3!important;grid-row:1!important}
  .sp-cas-app .sb-air-quality-field{grid-column:4!important;grid-row:1!important}
  .sp-cas-app .sb-advanced{grid-column:5!important;grid-row:1!important;margin:0!important}
  .sp-cas-app .sb-build-btn{grid-column:6!important;grid-row:1!important;margin:0!important;align-self:start!important}
  .sp-cas-app .sb-basis-note{grid-column:1/-1!important;grid-row:2!important}
  .sp-cas-app .sb-canvas{height:580px!important;min-height:580px!important}
  .sp-cas-app .sb-nodes{left:28px;right:28px;top:146px}
  .sp-cas-app .sb-node-stack,
  .sp-cas-app .sb-node{width:clamp(134px,9.1vw,143px)!important;min-width:clamp(134px,9.1vw,143px)!important;height:292px!important}
  .sp-cas-app .sb-node-stage{height:28px;margin-bottom:7px;font-size:9.7px}
  .sp-cas-app .sb-node-num{width:27px;height:27px;font-size:10px}
  .sp-cas-app .sb-node-visual{width:98px;height:90px;margin-bottom:8px;padding:7px}
  .sp-cas-app .sb-node-info{min-height:150px;padding:11px 10px 10px}
  .sp-cas-app .sb-node-name{min-height:29px;font-size:12.2px;line-height:1.15}
  .sp-cas-app .sb-node-value{min-height:28px;font-size:11.2px;line-height:1.24}
  .sp-cas-app .sb-node-sub{min-height:25px;font-size:10.2px;line-height:1.3}
  .sp-cas-app .sb-node-flow{font-size:9.8px;line-height:1.25;padding-top:7px}
  .sp-cas-app .sb-node-change{top:36px;min-height:26px;padding:0 8px;font-size:8px}
  .sp-cas-app .sb-connector{min-width:4px;margin-top:79px}
  .sp-cas-app .sb-node-cond-drop{top:292px;height:89px}
  .sp-cas-app .sb-cond-line{bottom:51px}
  .sp-cas-app .sb-cond-label{bottom:60px}
  .sp-cas-app .sb-cond-box{bottom:10px;min-width:198px}
}

/* Wide desktop: use the additional room for larger imagery and genuinely
   comfortable card copy rather than stretching empty connector space. */
@media (min-width:1500px) and (max-width:1699px){
  .sp-cas-app .sb-canvas{height:610px!important;min-height:610px!important}
  .sp-cas-app .sb-nodes{left:38px;right:38px;top:148px}
  .sp-cas-app .sb-node-stack,
  .sp-cas-app .sb-node{width:clamp(154px,9.35vw,166px)!important;min-width:clamp(154px,9.35vw,166px)!important;height:310px!important}
  .sp-cas-app .sb-node-stage{height:30px;margin-bottom:8px;font-size:10px}
  .sp-cas-app .sb-node-num{width:29px;height:29px;font-size:10.5px}
  .sp-cas-app .sb-node-visual{width:106px;height:98px;margin-bottom:9px;padding:8px}
  .sp-cas-app .sb-node-info{min-height:158px;padding:12px 11px 10px}
  .sp-cas-app .sb-node-name{min-height:31px;font-size:13px;line-height:1.15}
  .sp-cas-app .sb-node-value{min-height:30px;font-size:12px;line-height:1.25}
  .sp-cas-app .sb-node-sub{min-height:27px;font-size:10.8px;line-height:1.3}
  .sp-cas-app .sb-node-flow{font-size:10.3px;line-height:1.25;padding-top:8px}
  .sp-cas-app .sb-node-change{top:39px;min-height:28px;padding:0 9px;font-size:8.5px}
  .sp-cas-app .sb-connector{min-width:6px;height:8px;margin-top:85px}
  .sp-cas-app .sb-node-cond-drop{top:310px;height:91px}
  .sp-cas-app .sb-cond-line{left:62px;right:62px;bottom:55px}
  .sp-cas-app .sb-cond-label{left:69px;bottom:64px}
  .sp-cas-app .sb-cond-box{bottom:11px;min-width:215px;min-height:60px}
}

/* Large desktop / presentation screens: this is the intended “wow” view. */
@media (min-width:1700px){
  .sp-cas-app .sb-head{padding-left:34px;padding-right:34px}
  .sp-cas-app .sb-head h2{font-size:42px}
  .sp-cas-app .sb-head p{font-size:15px}
  .sp-cas-app .sb-basis{padding-left:22px;padding-right:22px}
  .sp-cas-app .sb-metrics{padding:15px 18px;gap:12px}
  .sp-cas-app .sb-metric{min-height:106px;padding:16px 18px}
  .sp-cas-app .sb-metric-value{font-size:30px}
  .sp-cas-app .sb-canvas-wrap{padding:19px 20px 18px}
  .sp-cas-app .sb-canvas{height:640px!important;min-height:640px!important}
  .sp-cas-app .sb-nodes{left:46px;right:46px;top:150px}
  .sp-cas-app .sb-node-stack,
  .sp-cas-app .sb-node{width:clamp(174px,9.45vw,192px)!important;min-width:clamp(174px,9.45vw,192px)!important;height:332px!important}
  .sp-cas-app .sb-node-stage{height:31px;margin-bottom:8px;font-size:10.5px}
  .sp-cas-app .sb-node-num{width:30px;height:30px;font-size:11px}
  .sp-cas-app .sb-node-visual{width:118px;height:106px;margin-bottom:10px;padding:8px}
  .sp-cas-app .sb-node-info{min-height:169px;padding:13px 12px 11px}
  .sp-cas-app .sb-node-name{min-height:32px;font-size:14px;line-height:1.15}
  .sp-cas-app .sb-node-value{min-height:31px;font-size:13px;line-height:1.25}
  .sp-cas-app .sb-node-sub{min-height:29px;font-size:11.4px;line-height:1.32}
  .sp-cas-app .sb-node-flow{font-size:10.9px;line-height:1.25;padding-top:8px}
  .sp-cas-app .sb-node-change{top:40px;min-height:29px;padding:0 9px;font-size:9px}
  .sp-cas-app .sb-connector{min-width:8px;height:8px;margin-top:90px}
  .sp-cas-app .sb-node-cond-drop{top:332px;height:91px}
  .sp-cas-app .sb-cond-line{left:70px;right:70px;bottom:58px}
  .sp-cas-app .sb-cond-label{left:77px;bottom:67px}
  .sp-cas-app .sb-cond-box{bottom:12px;min-width:228px;min-height:62px;padding:9px 11px}
  .sp-cas-app .sb-cond-box strong{font-size:10.75px}
  .sp-cas-app .sb-cond-box span{font-size:10px}
}

/* Keep the hierarchy intact when the builder collapses for tablets/mobile. */
@media (max-width:1099px){
  .sp-cas-app .sb-head p{font-size:13px;line-height:1.55}
  .sp-cas-app .sb-basis .sb-field label{font-size:9px}
  .sp-cas-app .sb-basis-note{font-size:9.5px;line-height:1.5}
  .sp-cas-app .sb-metric-label{font-size:9.5px}
  .sp-cas-app .sb-metric-sub{font-size:9.5px}
  .sp-cas-app .sb-node-name{font-size:10px}
  .sp-cas-app .sb-node-value{font-size:9.5px}
  .sp-cas-app .sb-node-sub{font-size:8.8px}
  .sp-cas-app .sb-node-flow{font-size:8.5px}
  .sp-cas-app .sb-inspector-detail{font-size:11px}
  .sp-cas-app .sb-inspector-why span{font-size:10px}
  .sp-cas-app .sb-bottom-copy{font-size:9.5px}
}

/* =========================================================
   v1.5.0 — intelligent customizable system path
   ========================================================= */
.sp-cas-app .sb-toolbar-actions{display:flex;align-items:center;justify-content:flex-end;gap:12px;min-width:0}
.sp-cas-app .sb-layout-edit-toggle{min-height:38px;padding:0 13px;border:1px solid #aebcc4;background:#fff;color:#24323b;font:900 9px/1 Inter,Arial,sans-serif;letter-spacing:.08em;text-transform:uppercase;cursor:pointer;white-space:nowrap;transition:border-color .15s ease,background .15s ease,color .15s ease,box-shadow .15s ease}
.sp-cas-app .sb-layout-edit-toggle:hover{border-color:var(--orange);color:#a94612;background:#fff7f2}
.sp-cas-app .sb-layout-edit-toggle.active{border-color:var(--orange);background:#172733;color:#fff;box-shadow:inset 0 -3px 0 var(--orange)}

.sp-cas-app .sb-config-summary{display:grid;grid-template-columns:minmax(300px,1.15fr) minmax(360px,1.55fr) auto;gap:14px;align-items:stretch;margin-bottom:11px;padding:12px 13px;border:1px solid #c7d2d8;border-left:5px solid #81919b;background:#fff;box-shadow:0 4px 12px rgba(28,43,53,.045);transition:border-color .18s ease,background .18s ease}
.sp-cas-app .sb-config-summary.is-good{border-left-color:var(--teal);background:#fbfefe}
.sp-cas-app .sb-config-summary.is-warn{border-left-color:var(--orange);background:#fffdfb}
.sp-cas-app .sb-config-summary.is-error{border-left-color:#b94d32;background:#fffaf8}
.sp-cas-app .sb-config-status{display:grid;grid-template-columns:auto 1fr;gap:10px;align-items:center;min-width:0}
.sp-cas-app .sb-config-badge{display:inline-flex;align-items:center;justify-content:center;min-height:29px;padding:0 9px;background:#e7ecef;color:#42515b;font-size:8.5px;font-weight:950;letter-spacing:.09em;text-transform:uppercase;white-space:nowrap}
.sp-cas-app .sb-config-summary.is-good .sb-config-badge{background:#dff5f3;color:#086c65}
.sp-cas-app .sb-config-summary.is-warn .sb-config-badge{background:#fff0e5;color:#a94812}
.sp-cas-app .sb-config-summary.is-error .sb-config-badge{background:#fae6e1;color:#943923}
.sp-cas-app .sb-config-status strong{display:block;font-size:12px;line-height:1.25;color:#1f2c34}
.sp-cas-app .sb-config-status span:not(.sb-config-badge){display:block;margin-top:3px;font-size:10px;line-height:1.4;color:#65727b}
.sp-cas-app .sb-path-readout{min-width:0;padding:4px 13px;border-left:1px solid #dce3e7;border-right:1px solid #dce3e7;display:flex;flex-direction:column;justify-content:center}
.sp-cas-app .sb-path-readout>span{font-size:8.5px;font-weight:900;letter-spacing:.11em;text-transform:uppercase;color:#6a7780}
.sp-cas-app .sb-path-readout>strong{display:block;min-width:0;margin-top:4px;font-size:10px;line-height:1.45;color:#25343d;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sp-cas-app .sb-config-stats{display:grid;grid-template-columns:repeat(3,minmax(92px,1fr));gap:7px;min-width:315px}
.sp-cas-app .sb-config-stats>div{padding:7px 9px;border:1px solid #d5dde2;background:#f7f9fa}
.sp-cas-app .sb-config-stats span{display:block;font-size:7.5px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;color:#71808a}
.sp-cas-app .sb-config-stats strong{display:block;margin-top:3px;font-size:13px;line-height:1;color:#1f2d36}

.sp-cas-app .sb-layout-editor{display:grid;grid-template-columns:minmax(250px,1fr) auto auto;gap:10px 12px;align-items:center;margin:-1px 0 11px;padding:12px 13px;border:1px solid #c6d2d8;border-top:3px solid var(--orange);background:#172733;color:#fff;box-shadow:0 7px 16px rgba(25,39,49,.10)}
.sp-cas-app .sb-layout-editor-copy strong{display:block;font-size:11px;line-height:1.2;text-transform:uppercase;letter-spacing:.07em;color:#fff}
.sp-cas-app .sb-layout-editor-copy span{display:block;margin-top:4px;max-width:760px;font-size:9.5px;line-height:1.45;color:#c9d5db}
.sp-cas-app .sb-layout-selected{display:flex;align-items:center;gap:6px;padding:5px 6px;border:1px solid rgba(255,255,255,.15);background:rgba(255,255,255,.04)}
.sp-cas-app .sb-layout-selected>span{padding:0 6px;font-size:8px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:#aebbc2;white-space:nowrap}
.sp-cas-app .sb-layout-selected>span strong{color:#fff;font-size:9px}
.sp-cas-app .sb-layout-selected button,.sp-cas-app .sb-layout-restore{min-height:31px;padding:0 9px;border:1px solid rgba(255,255,255,.23);background:#223744;color:#fff;font:900 7.8px/1 Inter,Arial,sans-serif;letter-spacing:.055em;text-transform:uppercase;cursor:pointer;white-space:nowrap}
.sp-cas-app .sb-layout-selected button:hover:not(:disabled),.sp-cas-app .sb-layout-restore:hover{border-color:var(--teal);background:#294553}
.sp-cas-app .sb-layout-selected .sb-layout-remove{border-color:rgba(243,108,33,.55);color:#ffd9c4}
.sp-cas-app .sb-layout-selected .sb-layout-remove:hover:not(:disabled){border-color:var(--orange);background:#5a2f1c;color:#fff}
.sp-cas-app .sb-layout-selected button:disabled{opacity:.35;cursor:not-allowed}
.sp-cas-app .sb-layout-restore{justify-self:end;min-height:43px;padding:0 12px;border-color:rgba(255,255,255,.28);background:transparent}
.sp-cas-app .sb-removed-tray{grid-column:1/-1;display:grid;grid-template-columns:auto 1fr;gap:10px;align-items:center;padding-top:9px;border-top:1px solid rgba(255,255,255,.12)}
.sp-cas-app .sb-removed-tray>span{font-size:8px;font-weight:900;letter-spacing:.1em;text-transform:uppercase;color:#aebbc2}
.sp-cas-app .sb-removed-tray>div{display:flex;gap:6px;flex-wrap:wrap}
.sp-cas-app .sb-restore-chip{min-height:30px;padding:0 9px;border:1px solid rgba(0,191,208,.45);background:rgba(0,191,208,.08);color:#dffcff;font:900 8px/1 Inter,Arial,sans-serif;letter-spacing:.05em;text-transform:uppercase;cursor:pointer}
.sp-cas-app .sb-restore-chip span{margin-right:5px;color:var(--teal);font-size:13px;vertical-align:-1px}
.sp-cas-app .sb-restore-chip:hover{background:rgba(0,191,208,.18);border-color:var(--teal)}

.sp-cas-app .sb-config-advice{display:grid;grid-template-columns:repeat(auto-fit,minmax(275px,1fr));gap:7px;margin:-1px 0 11px}
.sp-cas-app .sb-advice-item{display:grid;grid-template-columns:25px 1fr;gap:8px;align-items:start;padding:8px 10px;border:1px solid #d5dde2;background:#fff}
.sp-cas-app .sb-advice-item>span{display:grid;place-items:center;width:23px;height:23px;background:#eef2f4;color:#586872;font-size:10px;font-weight:950}
.sp-cas-app .sb-advice-item p{margin:0;font-size:9.5px;line-height:1.42;color:#52616b}
.sp-cas-app .sb-advice-item.is-error{border-color:#e3b3a7;background:#fff9f7}.sp-cas-app .sb-advice-item.is-error>span{background:#f6dfd9;color:#9a3e29}
.sp-cas-app .sb-advice-item.is-warning{border-color:#edd0ba;background:#fffaf6}.sp-cas-app .sb-advice-item.is-warning>span{background:#ffecdd;color:#a94c16}
.sp-cas-app .sb-advice-item.is-info{border-color:#c9dce2;background:#fbfdfe}.sp-cas-app .sb-advice-item.is-info>span{background:#e6f2f5;color:#26717b}

.sp-cas-app .sb-layout-drag{position:absolute;left:4px;top:35px;z-index:11;display:flex;align-items:center;gap:3px;min-height:25px;padding:0 7px;border:1px solid #8ea0aa;background:#172733;color:#fff;font:900 7px/1 Inter,Arial,sans-serif;letter-spacing:.07em;text-transform:uppercase;cursor:grab;box-shadow:0 4px 10px rgba(23,39,51,.18);user-select:none}
.sp-cas-app .sb-layout-drag:active{cursor:grabbing}
.sp-cas-app .sb-layout-drag span{font-size:11px;letter-spacing:-.12em;color:var(--teal)}
.sp-cas-app .sb-node-stack.is-dragging{opacity:.45;filter:saturate(.4)}
.sp-cas-app .sb-node-wrap.is-drop-target .sb-node-visual,.sp-cas-app .sb-node-wrap.is-drop-target .sb-node-info{border-color:var(--teal)!important;box-shadow:inset 0 0 0 2px rgba(0,191,208,.38),0 7px 16px rgba(35,50,60,.11)!important}
.sp-cas-app .sb-canvas.is-layout-editing .sb-node-wrap{cursor:default}
.sp-cas-app .sb-canvas.is-layout-editing .sb-node-change{opacity:.72}
.sp-cas-app .sb-canvas.is-layout-editing .sb-node.selected .sb-node-visual{box-shadow:inset 0 0 0 2px var(--orange),0 7px 16px rgba(35,50,60,.11)}
.sp-cas-app .sb-metric.is-error{border-top-color:#b94d32!important}.sp-cas-app .sb-metric.is-error .sb-metric-value{color:#a33d27}

@media (min-width:1100px){
  .sp-cas-app .sb-canvas-toolbar{grid-template-columns:auto 1fr auto}
  .sp-cas-app .sb-toolbar-actions{min-width:315px}
  .sp-cas-app .sb-layout-edit-toggle{min-height:40px;font-size:9.5px}
  .sp-cas-app .sb-config-status strong{font-size:12.5px}
  .sp-cas-app .sb-config-status span:not(.sb-config-badge){font-size:10.5px}
  .sp-cas-app .sb-path-readout>strong{font-size:10.5px}
  .sp-cas-app .sb-config-stats strong{font-size:14px}
  .sp-cas-app .sb-layout-editor-copy span{font-size:10px}
  .sp-cas-app .sb-advice-item p{font-size:10px}
}

@media (max-width:1299px){
  .sp-cas-app .sb-config-summary{grid-template-columns:minmax(280px,1fr) minmax(0,1.3fr)}
  .sp-cas-app .sb-config-stats{grid-column:1/-1;min-width:0}
  .sp-cas-app .sb-layout-editor{grid-template-columns:1fr auto}
  .sp-cas-app .sb-layout-selected{grid-column:1/-1;justify-content:flex-start;flex-wrap:wrap}
}

@media (max-width:1099px){
  .sp-cas-app .sb-canvas-toolbar{grid-template-columns:1fr!important;align-items:start}
  .sp-cas-app .sb-view-controls{justify-self:start!important}
  .sp-cas-app .sb-toolbar-actions{justify-content:space-between;width:100%;flex-wrap:wrap}
  .sp-cas-app .sb-config-summary{grid-template-columns:1fr;gap:9px}
  .sp-cas-app .sb-path-readout{padding:8px 0;border:0;border-top:1px solid #dde4e8;border-bottom:1px solid #dde4e8}
  .sp-cas-app .sb-path-readout>strong{white-space:normal;overflow:visible}
  .sp-cas-app .sb-config-stats{min-width:0}
  .sp-cas-app .sb-layout-editor{grid-template-columns:1fr;padding:12px}
  .sp-cas-app .sb-layout-selected{flex-wrap:wrap}
  .sp-cas-app .sb-layout-restore{justify-self:start;min-height:36px}
  .sp-cas-app .sb-removed-tray{grid-template-columns:1fr}
  .sp-cas-app .sb-config-advice{grid-template-columns:1fr}
}

@media (max-width:620px){
  .sp-cas-app .sb-config-stats{grid-template-columns:1fr 1fr}
  .sp-cas-app .sb-config-stats>div:last-child{grid-column:1/-1}
  .sp-cas-app .sb-config-status{grid-template-columns:1fr}
  .sp-cas-app .sb-config-badge{justify-self:start}
  .sp-cas-app .sb-layout-selected{display:grid;grid-template-columns:1fr 1fr}
  .sp-cas-app .sb-layout-selected>span{grid-column:1/-1;padding:4px 2px}
  .sp-cas-app .sb-layout-selected .sb-layout-remove{grid-column:1/-1}
}
.sp-cas-app .sb-layout-editor[hidden],.sp-cas-app .sb-removed-tray[hidden],.sp-cas-app .sb-config-advice[hidden]{display:none!important}


/* =========================================================
   v1.6.0 — unmistakable blocking states + additive equipment
   ========================================================= */
.sp-cas-app .sb-config-summary.is-error{
  border-color:#cf8f87!important;
  border-left-color:#b42318!important;
  background:#fff3f2!important;
  box-shadow:0 5px 16px rgba(180,35,24,.10)!important;
}
.sp-cas-app .sb-config-summary.is-error .sb-config-badge{background:#b42318!important;color:#fff!important}
.sp-cas-app .sb-config-summary.is-error .sb-config-status strong{color:#8f1d16!important}
.sp-cas-app .sb-config-summary.is-error .sb-config-status span:not(.sb-config-badge){color:#7e403a!important}
.sp-cas-app .sb-metric.is-error{border-top-color:#b42318!important;background:#fff5f4!important}
.sp-cas-app .sb-metric.is-error .sb-metric-value{color:#a11d14!important}
.sp-cas-app .sb-metric.is-error .sb-metric-sub{color:#81423d!important}

/* A blocking logic/capacity issue marks the affected product card itself red. */
.sp-cas-app .sb-node.is-invalid .sb-node-visual,
.sp-cas-app .sb-node.is-invalid .sb-node-info{
  border-color:#b42318!important;
  background:#fff1f0!important;
  box-shadow:inset 0 0 0 2px rgba(180,35,24,.35),0 7px 16px rgba(125,25,18,.11)!important;
}
.sp-cas-app .sb-node.is-invalid .sb-node-stage>span:first-child,
.sp-cas-app .sb-node.is-invalid .sb-node-name,
.sp-cas-app .sb-node.is-invalid .sb-node-value{color:#8f1d16!important}
.sp-cas-app .sb-node.is-invalid .sb-node-num{background:#b42318!important;color:#fff!important}
.sp-cas-app .sb-node.is-invalid .sb-node-sub{color:#78423e!important}
.sp-cas-app .sb-node.is-invalid .sb-node-flow{
  margin-left:-11px;margin-right:-11px;margin-bottom:-10px;padding:8px 11px 9px;
  border-top:1px solid #dfaaa5!important;background:#ffe2df!important;color:#9f1c13!important;font-weight:950!important;
}
.sp-cas-app .sb-node.is-invalid + .sb-node-change{border-color:#b42318!important;color:#8f1d16!important;background:#fff7f6!important}
.sp-cas-app .sb-advice-item.is-error{border-color:#d98f86!important;border-left:4px solid #b42318!important;background:#fff1f0!important}
.sp-cas-app .sb-advice-item.is-error>span{background:#b42318!important;color:#fff!important}
.sp-cas-app .sb-advice-item.is-error p{color:#7f2821!important;font-weight:750}
.sp-cas-app .sb-connector.stop::after{border-left-color:#b42318!important}
.sp-cas-app .sb-connector.stop{background:linear-gradient(90deg,#b42318,#d04a40)!important}

/* A second compressor is a parallel source, not another series treatment stage. */
.sp-cas-app .sb-connector.parallel{position:relative;background:repeating-linear-gradient(90deg,#00bfd0 0 6px,transparent 6px 10px)!important}
.sp-cas-app .sb-connector.parallel::before{
  content:'+';position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:grid;place-items:center;
  width:20px;height:20px;border:2px solid #00a9b8;background:#fff;color:#007c87;font:950 14px/1 Inter,Arial,sans-serif;z-index:2;
}
.sp-cas-app .sb-connector.parallel::after{display:none!important}
.sp-cas-app .sb-connector.parallel.stop::before{border-color:#b42318;color:#b42318;background:#fff1f0}

.sp-cas-app .sb-layout-adders{
  grid-column:1/-1;display:flex;align-items:center;gap:7px;flex-wrap:wrap;padding-top:9px;border-top:1px solid rgba(255,255,255,.12)
}
.sp-cas-app .sb-layout-adders>span{font-size:8px;font-weight:950;letter-spacing:.1em;text-transform:uppercase;color:#aebbc2;margin-right:2px}
.sp-cas-app .sb-layout-adders button{
  min-height:32px;padding:0 10px;border:1px solid rgba(0,191,208,.55);background:rgba(0,191,208,.10);color:#e6fdff;
  font:900 8px/1 Inter,Arial,sans-serif;letter-spacing:.055em;text-transform:uppercase;cursor:pointer;white-space:nowrap
}
.sp-cas-app .sb-layout-adders button:hover:not(:disabled){border-color:var(--teal);background:rgba(0,191,208,.22)}
.sp-cas-app .sb-layout-adders button:disabled{opacity:.42;cursor:not-allowed}
.sp-cas-app .sb-layout-adders small{flex:1 1 320px;color:#aebbc2;font-size:8.5px;line-height:1.4}

.sp-cas-app .sb-restore-chip.is-required{border-color:#e06a5f!important;background:rgba(180,35,24,.23)!important;color:#fff3f1!important}
.sp-cas-app .sb-restore-chip.is-required span{color:#ff9d93!important}
.sp-cas-app .sb-restore-chip em{display:inline-block;margin-left:7px;font:900 7px/1 Inter,Arial,sans-serif;letter-spacing:.04em;text-transform:uppercase;color:#ffb4ad;font-style:normal}

.sp-cas-app .sb-treatment-type-control{grid-column:1/-1;padding:9px 10px;border:1px solid #ced8dd;background:#f5f8f9}
.sp-cas-app .sb-treatment-type-control label{display:block;margin-bottom:5px;color:#5d6971;font-size:8px;font-weight:950;letter-spacing:.08em;text-transform:uppercase}
.sp-cas-app .sb-treatment-type-control select{width:100%;min-height:40px;border:1px solid #bdc9cf;background:#fff;color:#25333b;padding:0 34px 0 10px;font:800 10px/1.2 Inter,Arial,sans-serif}
.sp-cas-app .sb-treatment-type-control small{display:block;margin-top:5px;color:#69767e;font-size:8.5px;line-height:1.4}
.sp-cas-app .sb-treatment-type-control[hidden],
.sp-cas-app .sb-inline-treatment-type[hidden]{display:none!important}
.sp-cas-app .sb-inline-treatment-type{margin:0 0 8px;padding:8px;border:1px solid #d6e0e4;background:#f6f9fa}
.sp-cas-app .sb-inline-treatment-type label{margin-bottom:5px!important}
.sp-cas-app .sb-inline-treatment-type select{height:36px!important}

/* Extra stages stay legible instead of squeezing every product card narrower. */
.sp-cas-app .sb-scroll.has-extra-stages{overflow-x:auto!important;overflow-y:hidden!important;padding-bottom:8px!important}
.sp-cas-app .sb-scroll.has-extra-stages .sb-canvas{
  width:max(100%,calc(var(--sb-stage-count, 9) * 178px + 135px))!important;
  min-width:max(100%,calc(var(--sb-stage-count, 9) * 178px + 135px))!important;
}

@media (max-width:760px){
  .sp-cas-app .sb-layout-adders{display:grid;grid-template-columns:1fr 1fr}
  .sp-cas-app .sb-layout-adders>span,.sp-cas-app .sb-layout-adders small{grid-column:1/-1}
  .sp-cas-app .sb-layout-adders button{width:100%}
}
