/* FC Components pages v2 (cp-*) */
.hp-sec[id]{scroll-margin-top:96px}

/* ---------- covering sub-strip ---------- */
.cp-subbar{position:relative;z-index:3;background:var(--paper);border-bottom:1px solid var(--line)}
.cp-sub{max-width:1240px;margin:0 auto;padding:10px clamp(18px,4vw,40px);display:flex;align-items:center;gap:16px}
.cp-sub__k{flex:none;display:inline-flex;align-items:center;gap:8px;font:500 11.5px/1 "Geist Mono",ui-monospace,monospace;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.cp-sub__k svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.cp-sub nav{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;padding:2px}
.cp-sub nav::-webkit-scrollbar{display:none}
.hp .cp-sub nav a{flex:none;display:inline-flex;align-items:center;gap:9px;padding:5px 15px 5px 5px;border-radius:999px;background:#fff;font-size:14px;font-weight:500;line-height:1;color:var(--muted)!important;box-shadow:inset 0 0 0 1px var(--line);transition:color .25s,box-shadow .25s,background .3s,transform .35s var(--ease)}
.cp-sub nav a img{width:26px;height:26px;border-radius:50%;object-fit:cover;transition:transform .45s var(--ease)}
.hp .cp-sub nav a:hover{color:var(--ink)!important;box-shadow:inset 0 0 0 1.5px var(--forest);transform:translateY(-1px)}
.cp-sub nav a:hover img{transform:scale(1.12) rotate(-6deg)}
.hp .cp-sub nav a[aria-current]{background:var(--lime);color:var(--ink)!important;box-shadow:none}
@media(max-width:620px){.cp-sub{gap:10px;padding-top:8px;padding-bottom:8px}.cp-sub__k{display:none}}

/* ---------- hero tweak ---------- */
.cp-hero .sv-crumb a+svg+a{opacity:.9}

/* ---------- two-column figure + body ---------- */
.cp-pk,.ab-pk{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:clamp(28px,4.4vw,72px);align-items:center}
.ab-pk{margin-top:0}
.ab-pk .sy-fig,.cp-pk .sy-fig{margin:0}
.cp-pk--r .cp-pk__f{order:2}
.cp-pk__f .sy-fig img{aspect-ratio:4/3.1;object-fit:cover}
.cp-pk__b .hp-head{margin:0}
.cp-pk__b .sy-prose,.cp-pk__b .sv-ck,.cp-pk__b .sy-num,.cp-pk__b .cp-p{margin-top:22px}
@media(max-width:900px){.cp-pk,.ab-pk{grid-template-columns:1fr}.cp-pk--r .cp-pk__f{order:0}}

/* ---------- paragraphs ---------- */
.cp-p{margin-top:18px;max-width:760px;font-size:17px;line-height:1.65;color:var(--muted)}
.hp-dark .cp-p{color:rgba(255,255,255,.76)}
.cp-p--wide{max-width:none}
.cp-p--lead{font-size:clamp(17px,1.5vw,19.5px);color:var(--ink)}
.hp-dark .cp-p--lead{color:#fff}
.cp-after{margin-top:36px}

/* ---------- in-this-guide jump links ---------- */
.cp-toc{margin-top:30px;padding:18px 20px 20px;border-radius:20px;background:var(--field);box-shadow:inset 0 0 0 1px var(--line)}
.hp-paper .cp-toc{background:#fff}
.cp-toc__k{display:block;margin-bottom:12px;font:500 11.5px/1 "Geist Mono",ui-monospace,monospace;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.cp-toc ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.hp .cp-toc a{display:inline-flex;align-items:center;gap:8px;padding:8px 14px 8px 8px;border-radius:999px;background:var(--paper);font-size:14px;font-weight:500;line-height:1.2;color:var(--ink)!important;transition:background .25s,transform .35s var(--ease),box-shadow .25s}
.hp-paper .cp-toc a{background:var(--field)}
.cp-toc a span{display:grid;place-items:center;min-width:26px;height:26px;padding:0 6px;border-radius:999px;background:#fff;font:500 11px/1 "Geist Mono",monospace;color:var(--forest);transition:background .25s}
.hp .cp-toc a:hover{transform:translateY(-2px);box-shadow:inset 0 0 0 1.5px var(--forest)}
.cp-toc a:hover span{background:var(--lime)}

/* ---------- prose columns ---------- */
.cp-cols{display:grid;grid-template-columns:repeat(var(--c,2),minmax(0,1fr));gap:16px;margin-top:40px}
.cp-col{position:relative;padding:28px 26px;border-radius:22px;background:#fff;box-shadow:inset 0 0 0 1px var(--line);transition:box-shadow .35s,transform .45s var(--ease)}
.hp-white .cp-col{background:var(--paper);box-shadow:none}
.cp-col:hover{transform:translateY(-3px);box-shadow:inset 0 0 0 1.5px var(--forest),0 24px 40px -30px rgba(19,42,29,.45)}
.cp-col .hp-ic{margin-bottom:18px;background:#EEF4D5;color:var(--forest)}
.cp-col:hover .hp-ic{background:var(--lime);color:var(--ink);transform:rotate(-8deg) scale(1.06)}
.cp-col h3{font-size:clamp(19px,1.6vw,22px);line-height:1.25;letter-spacing:-.01em}
.cp-col p{margin-top:10px;font-size:15.5px;line-height:1.6;color:var(--muted)}
.hp-dark .cp-col{background:rgba(255,255,255,.05);box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)}
.hp-dark .cp-col h3{color:#fff}.hp-dark .cp-col p{color:rgba(255,255,255,.74)}
.hp-dark .cp-col .hp-ic{background:rgba(205,235,79,.16);color:var(--lime)}
.hp-dark .cp-col:hover{box-shadow:inset 0 0 0 1.5px rgba(205,235,79,.55)}
@media(max-width:900px){.cp-cols{grid-template-columns:1fr}}

/* ---------- stats ---------- */
.cp-stat{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;margin-top:36px}
.cp-st{padding:24px 24px 22px;border-radius:22px;background:rgba(255,255,255,.06);box-shadow:inset 0 0 0 1px rgba(255,255,255,.14)}
.cp-st b{display:block;font-size:clamp(40px,5vw,62px);line-height:1;letter-spacing:-.04em;font-weight:600;color:var(--lime)}
.cp-st span{display:block;margin-top:12px;font-size:15px;line-height:1.5;color:rgba(255,255,255,.78)}
.hp-sec:not(.hp-dark) .cp-st{background:#fff;box-shadow:inset 0 0 0 1px var(--line)}
.hp-sec:not(.hp-dark) .cp-st b{color:var(--forest)}
.hp-sec:not(.hp-dark) .cp-st span{color:var(--muted)}

/* ---------- does / does not ---------- */
.cp-yn{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:40px}
.cp-yn__c{padding:28px;border-radius:24px;background:#fff;box-shadow:inset 0 0 0 1px var(--line)}
.cp-yn__c.n{background:var(--deep);box-shadow:none;color:#fff}
.cp-yn__c h3{display:flex;align-items:center;gap:12px;font-size:21px;letter-spacing:-.01em}
.cp-yn__c h3 i{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--lime);color:var(--ink)}
.cp-yn__c.n h3 i{background:rgba(255,255,255,.12);color:#fff}
.cp-yn__c h3 svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.cp-yn__c ul{list-style:none;margin:20px 0 0;padding:0;display:grid;gap:10px}
.cp-yn__c li{position:relative;padding:12px 14px 12px 38px;border-radius:14px;background:var(--paper);font-size:15.5px;line-height:1.5}
.cp-yn__c li:before{content:'';position:absolute;left:16px;top:20px;width:8px;height:8px;border-radius:50%;background:var(--forest)}
.cp-yn__c.n li{background:rgba(255,255,255,.07);color:rgba(255,255,255,.86)}
.cp-yn__c.n li:before{background:rgba(255,255,255,.4);border-radius:2px;transform:rotate(45deg)}
@media(max-width:820px){.cp-yn{grid-template-columns:1fr}}

/* ---------- light callout ---------- */
.cp-note{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:18px 24px;align-items:center;margin-top:28px;padding:22px 24px;border-radius:22px;background:#EEF4D5;box-shadow:inset 0 0 0 1px #DCE8B4}
.cp-note .hp-ic{width:48px;height:48px;border-radius:14px;background:var(--lime);color:var(--ink)}
.cp-note h3{font-size:18px;letter-spacing:-.01em}
.cp-note p{margin-top:4px;font-size:15.5px;line-height:1.55;color:#3d4a40}
.hp-dark .cp-note{background:rgba(205,235,79,.1);box-shadow:inset 0 0 0 1px rgba(205,235,79,.28)}
.hp-dark .cp-note h3{color:#fff}.hp-dark .cp-note p{color:rgba(255,255,255,.78)}
@media(max-width:720px){.cp-note{grid-template-columns:auto 1fr}.cp-note .hp-btn{grid-column:1/-1;justify-self:start}}
.cp-ask{margin-top:28px}

/* ---------- diagnostic cards ---------- */
.cp-worn{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:44px}
.cp-worn--4{grid-template-columns:repeat(4,minmax(0,1fr))}
.cp-w{position:relative;background:#fff;border-radius:20px;padding:22px 22px 24px;box-shadow:inset 0 0 0 1px var(--line);overflow:hidden;transition:transform .45s var(--ease),box-shadow .4s}
.hp-white .cp-w{background:var(--paper);box-shadow:none}
.cp-w:before{content:'';position:absolute;left:22px;right:22px;top:0;height:3px;border-radius:0 0 3px 3px;background:repeating-linear-gradient(90deg,var(--line) 0 8px,transparent 8px 14px);transition:background .35s}
.cp-w:hover{transform:translateY(-4px);box-shadow:inset 0 0 0 1.5px var(--forest),0 22px 40px -28px rgba(19,42,29,.45)}
.cp-w:hover:before{background:repeating-linear-gradient(90deg,var(--lime-d) 0 8px,transparent 8px 14px)}
.cp-w__top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px}
.cp-w__tag{font:500 11px/1 "Geist Mono",ui-monospace,monospace;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);padding:6px 10px;border-radius:999px;background:var(--field)}
.hp-white .cp-w__tag{background:#fff}
.cp-w .hp-ic{width:38px;height:38px;border-radius:12px;background:#EEF4D5;color:var(--forest);transition:transform .5s var(--ease),background .3s,color .3s}
.cp-w:hover .hp-ic{background:var(--lime);color:var(--ink);transform:rotate(-8deg) scale(1.06)}
.cp-w h3{font-size:17.5px;letter-spacing:-.01em;line-height:1.3}
.cp-w p{margin-top:8px;font-size:14.8px;line-height:1.55;color:var(--muted)}
.hp-dark .cp-w{background:rgba(255,255,255,.05);box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)}
.hp-dark .cp-w:before{background:repeating-linear-gradient(90deg,rgba(255,255,255,.22) 0 8px,transparent 8px 14px)}
.hp-dark .cp-w:hover{box-shadow:inset 0 0 0 1.5px rgba(205,235,79,.6)}
.hp-dark .cp-w:hover:before{background:repeating-linear-gradient(90deg,var(--lime) 0 8px,transparent 8px 14px)}
.hp-dark .cp-w__tag{background:rgba(255,255,255,.09);color:rgba(255,255,255,.7)}
.hp-dark .cp-w .hp-ic{background:rgba(205,235,79,.16);color:var(--lime)}
.hp-dark .cp-w:hover .hp-ic{background:var(--lime);color:var(--ink)}
.hp-dark .cp-w h3{color:#fff}.hp-dark .cp-w p{color:rgba(255,255,255,.74)}
@media(max-width:1080px){.cp-worn,.cp-worn--4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){.cp-worn,.cp-worn--4{grid-template-columns:1fr}.cp-w:hover{transform:none}}

/* ---------- shared figure card ---------- */
.cp-fig{position:relative;border-radius:26px;background:#fff;box-shadow:inset 0 0 0 1px var(--line);padding:clamp(16px,2.4vw,28px);overflow:hidden;isolation:isolate}
.cp-fig:before{content:'';position:absolute;inset:0;z-index:-1;background-image:radial-gradient(rgba(34,66,48,.13) 1px,transparent 1.2px);background-size:18px 18px;-webkit-mask-image:radial-gradient(ellipse at center,#000 30%,transparent 78%);mask-image:radial-gradient(ellipse at center,#000 30%,transparent 78%)}
.hp-white .cp-fig{background:var(--paper);box-shadow:none}
.hp-dark .cp-fig{background:rgba(255,255,255,.04);box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)}
.hp-dark .cp-fig:before{background-image:radial-gradient(rgba(255,255,255,.12) 1px,transparent 1.2px)}
.cp-svg{display:block;width:100%;height:auto;overflow:visible}
.cp-svg *{vector-effect:non-scaling-stroke}
.cp-fig__cap{position:absolute;left:18px;bottom:16px;font:500 11px/1 "Geist Mono",ui-monospace,monospace;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);padding:7px 10px;border-radius:999px;background:rgba(255,255,255,.85);backdrop-filter:blur(4px)}
.hp-dark .cp-fig__cap{background:rgba(19,42,29,.7);color:rgba(255,255,255,.7)}
.cp-fig__n{display:block;margin-top:14px;font-size:13.5px;line-height:1.5;color:var(--muted)}
.hp-dark .cp-fig__n{color:rgba(255,255,255,.6)}
.cp-svg .lb{font:500 12px "Geist Mono",ui-monospace,monospace;letter-spacing:.06em;text-transform:uppercase;fill:var(--muted)}
.hp-dark .cp-svg .lb{fill:rgba(255,255,255,.62)}
.cp-svg .gd{stroke:var(--line);stroke-width:2;fill:none}
.hp-dark .cp-svg .gd{stroke:rgba(255,255,255,.22)}

/* ---------- segmented picker ---------- */
.cp-seg{position:relative;display:grid;grid-template-columns:repeat(var(--n,2),minmax(0,1fr));padding:5px;border-radius:999px;background:var(--field);box-shadow:inset 0 0 0 1px var(--line)}
.hp-white .cp-seg{background:#fff}
.cp-seg__pill{position:absolute;top:5px;bottom:5px;left:5px;width:calc((100% - 10px)/var(--n,2));border-radius:999px;background:var(--deep);transform:translateX(calc(var(--x,0)*100%));transition:transform .55s var(--ease)}
.hp .cp-seg button.cp-b,.hp .cp-seg button.cp-b:hover,.hp .cp-seg button.cp-b:focus{all:unset;box-sizing:border-box;position:relative;z-index:1;display:flex;align-items:center;justify-content:center;text-align:center;min-height:46px;padding:10px 12px;border-radius:999px;font:600 14.5px/1.2 "Onest",system-ui,sans-serif;color:var(--muted)!important;cursor:pointer;transition:color .35s}
.hp .cp-seg button.cp-b[aria-pressed=true]{color:#fff!important}
.hp .cp-seg button.cp-b:focus-visible{outline:3px solid var(--lime);outline-offset:2px}
.hp-dark .cp-seg{background:rgba(255,255,255,.07);box-shadow:inset 0 0 0 1px rgba(255,255,255,.14)}
.hp-dark .cp-seg__pill{background:var(--lime)}
.hp-dark .cp-seg button.cp-b{color:rgba(255,255,255,.75)!important}
.hp .hp-dark .cp-seg button.cp-b[aria-pressed=true]{color:var(--ink)!important}
@media(max-width:560px){.cp-seg--4{grid-template-columns:1fr 1fr;border-radius:22px}.cp-seg--4 .cp-seg__pill{display:none}.hp .cp-seg--4 button.cp-b[aria-pressed=true]{background:var(--deep)}.hp .hp-dark .cp-seg--4 button.cp-b[aria-pressed=true]{background:var(--lime)}}
.cp-panels{position:relative;display:grid;margin-top:22px}
.cp-panel{grid-area:1/1;opacity:0;visibility:hidden;transform:translateY(10px);transition:opacity .45s,transform .55s var(--ease),visibility 0s .45s}
.cp-panel.on{opacity:1;visibility:visible;transform:none;transition:opacity .5s .08s,transform .6s .08s var(--ease)}
.cp-panel h3{font-size:clamp(20px,1.9vw,25px);letter-spacing:-.015em;line-height:1.2}
.cp-panel p{margin-top:10px;font-size:16.5px;line-height:1.62;color:var(--muted)}
.hp-dark .cp-panel h3{color:#fff}.hp-dark .cp-panel p{color:rgba(255,255,255,.78)}

/* ---------- numbered row list (shared by pickers) ---------- */
.cp-rows{list-style:none;margin:0;padding:0;display:grid;gap:8px;align-content:center}
.hp .cp-rows button.cp-row,.hp .cp-rows button.cp-row:hover,.hp .cp-rows button.cp-row:focus{all:unset;box-sizing:border-box;display:grid;grid-template-columns:auto 1fr;gap:16px;align-items:start;width:100%;padding:16px 18px;border-radius:18px;cursor:pointer;color:var(--ink)!important;background:transparent;box-shadow:inset 0 0 0 1px var(--line);transition:background .35s,box-shadow .35s,transform .4s var(--ease)}
.hp .cp-rows button.cp-row:hover{box-shadow:inset 0 0 0 1.5px var(--forest);transform:translateX(3px)}
.hp .cp-rows button.cp-row[aria-pressed=true]{background:var(--deep);box-shadow:none;color:#fff!important}
.hp .cp-rows button.cp-row:focus-visible{outline:3px solid var(--lime);outline-offset:2px}
.cp-row .n{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--field);font:500 12px/1 "Geist Mono",monospace;color:var(--forest);transition:background .3s,color .3s}
.cp-row[aria-pressed=true] .n{background:var(--lime);color:var(--ink)}
.cp-row b{display:block;font-size:16.5px;letter-spacing:-.01em;line-height:1.3;padding-top:5px}
.cp-row small{display:block;margin-top:4px;font-size:14.8px;line-height:1.55;color:var(--muted);transition:color .3s}
.cp-row b+small{margin-top:5px}
.cp-row span>small:only-child{margin-top:0;padding-top:5px;font-size:15.5px;color:var(--ink)}
.cp-row[aria-pressed=true] small{color:rgba(255,255,255,.8)!important}
.hp-dark .cp-rows button.cp-row{color:#fff!important;box-shadow:inset 0 0 0 1px rgba(255,255,255,.16)}
.hp-dark .cp-rows button.cp-row:hover{box-shadow:inset 0 0 0 1.5px var(--lime)}
.hp .hp-dark .cp-rows button.cp-row[aria-pressed=true]{background:var(--lime);color:var(--ink)!important}
.hp-dark .cp-row .n{background:rgba(255,255,255,.1);color:#fff}
.hp-dark .cp-row[aria-pressed=true] .n{background:var(--deep);color:var(--lime)}
.hp-dark .cp-row small,.hp-dark .cp-row span>small:only-child{color:rgba(255,255,255,.72)}
.hp-dark .cp-row[aria-pressed=true] small{color:rgba(14,28,20,.78)!important}

/* ---------- layouts for pickers ---------- */
.cp-loads,.cp-lay,.cp-lock{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:clamp(20px,3vw,40px);align-items:center;margin-top:44px}
.cp-ply,.cp-pcx,.cp-uvs,.cp-shade,.cp-mesh{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:clamp(20px,3vw,44px);align-items:center;margin-top:44px}
.cp-drain,.cp-door{margin-top:0}
.cp-drain .cp-seg,.cp-door .cp-seg{margin-top:16px}
@media(max-width:900px){.cp-loads,.cp-lay,.cp-lock,.cp-ply,.cp-pcx,.cp-uvs,.cp-shade,.cp-mesh{grid-template-columns:1fr}}

/* ---------- FRAME loads ---------- */
.cp-loads .fr{fill:none;stroke:var(--forest);stroke-width:5;stroke-linejoin:round}
.cp-loads .fr2{fill:none;stroke:var(--line);stroke-width:2}
.cp-loads .ld{opacity:.2;transition:opacity .45s}
.cp-loads .ar{fill:none;stroke:var(--forest);stroke-width:3;stroke-linecap:round;marker-end:url(#cpah)}
.cp-loads marker path{fill:var(--forest)}
.cp-loads .ln{fill:none;stroke:var(--forest);stroke-width:2}
.cp-loads .ln.dsh{stroke-dasharray:6 6}
.cp-loads rect{fill:#fff;stroke:var(--forest);stroke-width:2}
.cp-loads .lf{fill:none;stroke:#5E9A4B;stroke-width:2;stroke-linecap:round}
.cp-loads .sn{fill:#fff;stroke:#A9BBC4;stroke-width:2}
.cp-loads[data-k=own] [data-g=own],.cp-loads[data-k=crop] [data-g=crop],.cp-loads[data-k=wind] [data-g=wind],.cp-loads[data-k=snow] [data-g=snow]{opacity:1}
.cp-loads[data-k=own] [data-g=own] .ar,.cp-loads[data-k=wind] [data-g=wind] .ar,.cp-loads[data-k=snow] [data-g=snow] .ar{stroke:#7FA82E;stroke-dasharray:7 5;animation:cp-flow 1s linear infinite}
.cp-loads[data-k=crop] [data-g=crop] rect{fill:var(--lime)}
.cp-loads[data-k=snow] [data-g=snow] .sn{fill:#EAF2F5;animation:cp-pulse 2.4s var(--ease) infinite}
.cp-loads[data-k=wind] .fr{animation:cp-sway 2.6s ease-in-out infinite;transform-origin:280px 300px}
@keyframes cp-flow{to{stroke-dashoffset:-24}}
@keyframes cp-pulse{50%{opacity:.7}}
@keyframes cp-sway{50%{transform:skewX(-1.2deg)}}

/* ---------- GUTTERS drain ---------- */
.cp-drain .fr2{fill:none;stroke:var(--line);stroke-width:2}
.cp-drain .roof{fill:none;stroke:var(--forest);stroke-width:5;stroke-linejoin:round;transition:opacity .5s,stroke .5s}
.cp-drain .rn{stroke:#8DB7C9;stroke-width:2;stroke-linecap:round;opacity:0;animation:cp-rain 1.3s linear infinite;animation-delay:calc(var(--i)*-.17s)}
@keyframes cp-rain{0%{opacity:0;transform:translateY(-10px)}15%{opacity:1}100%{opacity:0;transform:translateY(46px)}}
.cp-drain .fl{fill:none;stroke:#5AA5C6;stroke-width:4;stroke-linecap:round;stroke-dasharray:10 12;animation:cp-flow .9s linear infinite;transition:opacity .5s}
.cp-drain .gt__w{fill:#fff;stroke:var(--forest);stroke-width:3}
.cp-drain .gt__f{fill:#5AA5C6;transform-box:fill-box;transform-origin:bottom;transform:scaleY(.95);transition:transform 1.1s var(--ease)}
.cp-drain .dp{fill:#fff;stroke:var(--forest);stroke-width:2}
.cp-drain .dpw{stroke:#5AA5C6;stroke-width:3;stroke-dasharray:6 8;animation:cp-flow .6s linear infinite reverse}
.cp-drain[data-k=s] .roof.b{opacity:.18}
.cp-drain[data-k=s] .fl.b{opacity:0}
.cp-drain[data-k=s] .gt__f{transform:scaleY(.4)}
.cp-drain__lab{position:absolute;left:50%;bottom:18px;transform:translateX(-50%);display:grid}
.cp-drain__lab span{grid-area:1/1;white-space:nowrap;font:500 11.5px/1 "Geist Mono",monospace;letter-spacing:.08em;text-transform:uppercase;color:var(--forest);padding:8px 12px;border-radius:999px;background:#EEF4D5;opacity:0;transition:opacity .4s}
.cp-drain__lab span.on{opacity:1}

/* ---------- DOORS ---------- */
.cp-door .wl{stroke:var(--line);stroke-width:2;fill:none}
.cp-door .op{transform-box:view-box;transform-origin:210px 175px;transition:transform .8s var(--ease)}
.cp-door .op__o{fill:rgba(205,235,79,.12);stroke:var(--forest);stroke-width:5}
.cp-door .op__m{fill:none;stroke:#7FA82E;stroke-width:2;stroke-dasharray:7 6;animation:cp-flow 1.2s linear infinite}
.cp-door .sl{fill:#fff;stroke:var(--ink);stroke-width:2.4;stroke-linejoin:round;stroke-linecap:round;opacity:0;transform:translateY(10px);transition:opacity .4s,transform .6s var(--ease)}
.cp-door .sl .lf{fill:none;stroke:#5E9A4B}
.cp-door[data-k=p] [data-g=p],.cp-door[data-k=c] [data-g=c],.cp-door[data-k=l] [data-g=l],.cp-door[data-k=v] [data-g=v]{opacity:1;transform:none;transition-delay:.2s}
.cp-door__key{display:flex;flex-wrap:wrap;gap:8px 16px;justify-content:center;margin-top:8px;font-size:13px;color:var(--muted)}
.cp-door__key span{display:inline-flex;align-items:center;gap:7px}
.cp-door__key i{width:18px;height:10px;border-radius:3px}
.cp-door__key .a{background:#fff;box-shadow:inset 0 0 0 2px var(--ink)}
.cp-door__key .b{box-shadow:inset 0 0 0 2px #7FA82E;background:repeating-linear-gradient(90deg,transparent 0 3px,#fff 3px 5px)}
.cp-door__key .c{background:rgba(205,235,79,.3);box-shadow:inset 0 0 0 3px var(--forest)}

/* ---------- COVERING climate matcher ---------- */
.cp-clim{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:16px;margin-top:44px}
.cp-clim__b{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.hp .cp-clim button.cp-cl,.hp .cp-clim button.cp-cl:hover,.hp .cp-clim button.cp-cl:focus{all:unset;box-sizing:border-box;display:flex;flex-direction:column;justify-content:space-between;gap:28px;min-height:150px;padding:20px;border-radius:22px;cursor:pointer;background:#fff;color:var(--ink)!important;box-shadow:inset 0 0 0 1px var(--line);font:600 17px/1.25 "Onest",system-ui,sans-serif;letter-spacing:-.01em;transition:background .4s,box-shadow .35s,transform .45s var(--ease)}
.hp-white .cp-clim button.cp-cl{background:var(--paper);box-shadow:none}
.hp .cp-clim button.cp-cl:hover{transform:translateY(-3px);box-shadow:inset 0 0 0 1.5px var(--forest)}
.hp .cp-clim button.cp-cl[aria-pressed=true]{background:var(--deep);color:#fff!important;box-shadow:none}
.cp-cl .hp-ic{background:#EEF4D5;color:var(--forest);transition:transform .5s var(--ease),background .3s,color .3s}
.cp-cl[aria-pressed=true] .hp-ic{background:var(--lime);color:var(--ink);transform:rotate(-8deg) scale(1.08)}
.hp .cp-clim button.cp-cl:focus-visible{outline:3px solid var(--lime);outline-offset:2px}
.cp-clim__p{position:relative;display:grid;padding:clamp(24px,3vw,40px);border-radius:26px;background:#EEF4D5;overflow:hidden}
.cp-clim__p:after{content:'';position:absolute;right:-80px;bottom:-80px;width:260px;height:260px;border-radius:50%;background:radial-gradient(circle,rgba(205,235,79,.7),transparent 70%)}
.cp-clim .cp-panel{position:relative;z-index:1}
.cp-clim__k{display:block;font:500 11.5px/1 "Geist Mono",monospace;letter-spacing:.1em;text-transform:uppercase;color:var(--forest)}
.cp-clim .cp-panel h3{margin:12px 0 28px;font-size:clamp(24px,2.4vw,32px);line-height:1.15}
.cp-clim .cp-panel p{margin-top:12px;font-size:clamp(17px,1.5vw,20px);line-height:1.5;color:var(--ink)}
@media(max-width:900px){.cp-clim{grid-template-columns:1fr}.hp .cp-clim button.cp-cl{min-height:0;flex-direction:row;align-items:center;gap:12px}}

/* ---------- FILM layer stack ---------- */
.cp-lay__fig{display:grid;place-items:center;min-height:400px}
.cp-lay__stk{position:relative;width:min(240px,52vw);aspect-ratio:1;transform:rotateX(58deg) rotateZ(-38deg);transform-style:preserve-3d;margin:120px 0 40px}
.cp-lay__s{position:absolute;inset:0;border-radius:18px;background:linear-gradient(135deg,rgba(255,255,255,.95),rgba(220,235,226,.75));box-shadow:inset 0 0 0 1.5px rgba(34,66,48,.35),0 18px 30px -18px rgba(19,42,29,.5);transform:translateZ(calc(var(--i)*6px));transition:transform 1s var(--ease),background .4s,box-shadow .4s}
.cp-lay__s:nth-child(2){background:linear-gradient(135deg,rgba(236,244,214,.95),rgba(205,235,79,.35))}
.cp-lay__s:nth-child(3){background:linear-gradient(135deg,rgba(226,240,246,.95),rgba(141,183,201,.4))}
.cp-lay__s:nth-child(4){background:linear-gradient(135deg,rgba(246,240,226,.95),rgba(233,214,160,.45))}
.cp-lay__s em{display:none;position:absolute;left:100%;top:50%;margin-left:14px;white-space:nowrap;font:600 12px/1 "Geist Mono",monospace;letter-spacing:.06em;text-transform:uppercase;font-style:normal;color:var(--forest);transform:rotateZ(38deg) rotateX(-58deg) translateY(-50%);transform-origin:left center;opacity:0;transition:opacity .4s}
.cp-lay.cp-in .cp-lay__s{transform:translateZ(calc(var(--i)*44px))}
.cp-lay.cp-in .cp-lay__s em{opacity:.55}
.cp-lay[data-k='0'] [data-k='0'].cp-lay__s,.cp-lay[data-k='1'] [data-k='1'].cp-lay__s,.cp-lay[data-k='2'] [data-k='2'].cp-lay__s,.cp-lay[data-k='3'] [data-k='3'].cp-lay__s{box-shadow:inset 0 0 0 3px var(--lime-d),0 18px 30px -18px rgba(19,42,29,.6)}
.cp-lay[data-k='0'] [data-k='0'] em,.cp-lay[data-k='1'] [data-k='1'] em,.cp-lay[data-k='2'] [data-k='2'] em,.cp-lay[data-k='3'] [data-k='3'] em{opacity:1}
.cp-lay.cp-in[data-k='0'] [data-k='0'].cp-lay__s,.cp-lay.cp-in[data-k='1'] [data-k='1'].cp-lay__s,.cp-lay.cp-in[data-k='2'] [data-k='2'].cp-lay__s,.cp-lay.cp-in[data-k='3'] [data-k='3'].cp-lay__s{transform:translateZ(calc(var(--i)*44px + 14px))}
@media(max-width:620px){.cp-lay__fig{min-height:300px}.cp-lay__s em{display:none}}

/* ---------- FILM one or two layers ---------- */
.cp-ply .fm{fill:none;stroke:var(--forest);stroke-width:4;transition:opacity .5s,transform .7s var(--ease)}
.cp-ply .fm.i{opacity:0;transform-box:view-box;transform-origin:280px 266px;transform:scale(1.06)}
.cp-ply .gap{fill:rgba(205,235,79,.28);opacity:0;transition:opacity .6s}
.cp-ply .ht{fill:none;stroke:#E39B3A;stroke-width:3;stroke-linecap:round;stroke-dasharray:6 10;animation:cp-flow .9s linear infinite reverse;animation-delay:calc(var(--i)*-.3s);transition:opacity .5s}
.cp-ply .ht.two{opacity:0}
.cp-ply .lf{fill:#B9DD8A;stroke:#5E9A4B;stroke-width:1.6}
.cp-ply .fan{opacity:0;transition:opacity .5s}
.cp-ply .fan circle{fill:#fff;stroke:var(--forest);stroke-width:2}
.cp-ply .fan path{fill:var(--forest);transform-box:fill-box;transform-origin:center;animation:cp-spin 1.6s linear infinite}
.cp-ply .lb.two{opacity:0;transition:opacity .5s}
.cp-ply[data-k=b] .fm.i,.cp-ply[data-k=b] .gap,.cp-ply[data-k=b] .fan,.cp-ply[data-k=b] .lb.two,.cp-ply[data-k=b] .ht.two{opacity:1;transform:none}
.cp-ply[data-k=b] .ht.one{opacity:0}
@keyframes cp-spin{to{transform:rotate(360deg)}}

/* ---------- POLYCARBONATE thickness ---------- */
.cp-pcx .sh{opacity:0;transform-box:view-box;transform-origin:280px 110px;transform:scaleY(.6);transition:opacity .45s,transform .7s var(--ease)}
.cp-pcx[data-k=t6] [data-g=t6],.cp-pcx[data-k=t8] [data-g=t8],.cp-pcx[data-k=t10] [data-g=t10]{opacity:1;transform:none}
.cp-pcx .air{fill:#E3EFF3}
.cp-pcx .rb{fill:none;stroke:#9DB7C2;stroke-width:2}
.cp-pcx .sk{fill:var(--forest)}
.cp-pcx .mm{font-size:14px;fill:var(--forest);font-weight:600}
.cp-pcx .sun path{stroke:#E3B43A;stroke-width:3;stroke-linecap:round;stroke-dasharray:4 8;animation:cp-flow 1.2s linear infinite}
.cp-pcx .ann path{stroke:var(--muted);stroke-width:1.4;stroke-dasharray:3 4}.cp-pcx .ann circle{fill:var(--forest)}
.cp-pcx .annt text{font:500 11px "Geist Mono",monospace;letter-spacing:.06em;text-transform:uppercase;fill:var(--muted)}
.cp-meters{display:grid;gap:10px;margin-top:20px}
.cp-m{display:grid;grid-template-columns:96px 1fr;align-items:center;gap:12px;font-size:13.5px;color:var(--muted)}
.cp-m i{height:8px;border-radius:999px;background:var(--line);overflow:hidden}
.cp-m b{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,var(--forest),#5E9A4B);transform-origin:left;animation:cp-grow .9s var(--ease) both}
@keyframes cp-grow{from{transform:scaleX(0)}}
.hp-dark .cp-m{color:rgba(255,255,255,.7)}.hp-dark .cp-m i{background:rgba(255,255,255,.14)}.hp-dark .cp-m b{background:linear-gradient(90deg,#9CC63A,var(--lime))}

/* ---------- POLYCARBONATE UV side ---------- */
.cp-uvs .sun circle{fill:#F5D36B;stroke:#E3B43A;stroke-width:2}
.cp-uvs .sun path,.cp-uvs .ray{stroke:#E3B43A;stroke-width:3;stroke-linecap:round;fill:none}
.cp-uvs .ray{stroke-dasharray:5 7;animation:cp-flow 1s linear infinite}
.cp-uvs .air{fill:#E3EFF3;transition:fill .8s}
.cp-uvs .rb{fill:none;stroke:#9DB7C2;stroke-width:2;transition:stroke .8s}
.cp-uvs .face{fill:#C9D6DB;transition:fill .6s}
.cp-uvs[data-k=ok] .face.top{fill:var(--lime-d)}
.cp-uvs[data-k=bad] .face.bot{fill:var(--lime-d)}
.cp-uvs[data-k=bad] .face.top{fill:#D9B44A}
.cp-uvs[data-k=bad] .air{fill:#F1E3B4}
.cp-uvs[data-k=bad] .rb{stroke:#CDB16A}
.cp-uvs .uvt,.cp-uvs .uvb{opacity:0;transition:opacity .4s}
.cp-uvs[data-k=ok] .uvt,.cp-uvs[data-k=bad] .uvb{opacity:1}
.cp-uvs .mk{opacity:0;transition:opacity .4s}
.cp-uvs .mk circle{stroke-width:2}
.cp-uvs .mk path{fill:none;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.cp-uvs .mk.ok circle{fill:var(--lime);stroke:var(--lime-d)}.cp-uvs .mk.ok path{stroke:var(--ink)}
.cp-uvs .mk.bad circle{fill:#F6DADA;stroke:#D86A6A}.cp-uvs .mk.bad path{stroke:#B33A3A}
.cp-uvs[data-k=ok] .mk.ok,.cp-uvs[data-k=bad] .mk.bad{opacity:1}

/* ---------- SHADE slider ---------- */
.cp-shade .sun circle{fill:#F5D36B;stroke:#E3B43A;stroke-width:2}
.cp-shade .sun path,.cp-shade .ray{stroke:#E3B43A;stroke-width:3;stroke-linecap:round;fill:none}
.cp-shade .ray.in{stroke-dasharray:5 7;animation:cp-flow 1s linear infinite}
.cp-shade .ray.out path{stroke-dasharray:5 7;animation:cp-flow 1s linear infinite;opacity:calc((100 - var(--v)) / 85)}
.cp-shade .cloth{fill:var(--ink);opacity:calc(var(--v) / 140)}
.cp-shade .knit{opacity:.9}
.cp-shade pattern circle{fill:#fff;opacity:.85}
.cp-shade .crop path{fill:#B9DD8A;stroke:#5E9A4B;stroke-width:1.6}
.cp-read{display:grid;grid-template-columns:auto 1fr;align-items:end;gap:2px 14px}
.cp-read b{grid-row:span 2;font-size:clamp(56px,7vw,84px);line-height:.9;letter-spacing:-.05em;font-weight:600;color:var(--forest);font-variant-numeric:tabular-nums}
.cp-read span{font-size:15px;color:var(--ink);font-weight:600}
.cp-read em{font-style:normal;font-size:14.5px;color:var(--muted)}
.hp-dark .cp-read b{color:var(--lime)}.hp-dark .cp-read span{color:#fff}.hp-dark .cp-read em{color:rgba(255,255,255,.7)}
.cp-rng{display:block;margin-top:26px}
.cp-rng .sr,.cp-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.cp-rng input{-webkit-appearance:none;appearance:none;display:block;width:100%;height:10px;margin:0;border-radius:999px;outline:none;background:linear-gradient(90deg,#F5D36B,#C9B98A 45%,#3E4A42);cursor:pointer}
.cp-rng--mesh input{background:linear-gradient(90deg,#DCE8B4,var(--forest))}
.cp-rng input::-webkit-slider-thumb{-webkit-appearance:none;width:30px;height:30px;border-radius:50%;background:#fff;border:7px solid var(--deep);box-shadow:0 6px 16px -4px rgba(0,0,0,.4);cursor:grab;transition:transform .25s}
.cp-rng input:active::-webkit-slider-thumb{transform:scale(1.12);cursor:grabbing}
.cp-rng input::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:#fff;border:7px solid var(--deep);cursor:grab}
.cp-rng input:focus-visible{outline:3px solid var(--lime);outline-offset:6px}
.hp-dark .cp-rng input::-webkit-slider-thumb{border-color:var(--lime);background:var(--deep)}
.cp-scale{margin-top:16px}
.cp-scale__t{display:flex;justify-content:space-between;font:500 11.5px/1 "Geist Mono",monospace;color:var(--muted)}
.cp-scale__b{position:relative;height:66px;margin-top:10px}
.cp-band{position:absolute;top:0;height:8px;border-radius:999px;background:var(--line);transition:background .35s}
.cp-band em{position:absolute;left:0;top:16px;width:max-content;max-width:180px;font-style:normal;font-size:13px;line-height:1.35;color:var(--muted);transition:color .35s}
.cp-band:last-child em{left:auto;right:0;text-align:right}
.cp-band.on{background:var(--lime-d)}
.cp-band.on em{color:var(--ink);font-weight:600}
.hp-dark .cp-band{background:rgba(255,255,255,.16)}.hp-dark .cp-band em{color:rgba(255,255,255,.6)}.hp-dark .cp-band.on{background:var(--lime)}.hp-dark .cp-band.on em{color:#fff}

/* ---------- INSECT NET mesh ---------- */
.cp-mesh .net{fill:url(#cpmesh)}
.cp-mesh pattern path{fill:none;stroke:var(--forest);stroke-width:1.4}
.cp-mesh .netf{stroke:var(--forest);stroke-width:3}
.cp-mesh .aw{fill:none;stroke:#8DB7C9;stroke-width:2;stroke-linecap:round;stroke-dasharray:14 22;animation:cp-flow .8s linear infinite;animation-duration:calc(.7s + (1 - var(--af,1)) * 1.6s);opacity:calc(.25 + var(--af,1) * .7);animation-delay:calc(var(--i)*-.17s)}
.cp-mesh .pb,.cp-mesh .ps{transform:translate(30px,var(--y))}
.cp-mesh .pb{fill:#8A5A3C}
.cp-mesh .ps{fill:#C05A1F}
.cp-mesh.cp-in .pb{animation:cp-block 2.8s var(--ease) infinite;animation-delay:calc(var(--i)*-.7s)}
.cp-mesh.cp-in .ps{animation:cp-pass 2.4s linear infinite;animation-delay:calc(var(--i)*-.34s)}
.cp-mesh.cp-in[data-s=f] .ps{animation-name:cp-block}
@keyframes cp-block{0%{transform:translate(30px,var(--y));opacity:0}12%{opacity:1}55%,72%{transform:translate(246px,var(--y));opacity:1}100%{transform:translate(214px,calc(var(--y) + 26px));opacity:0}}
@keyframes cp-pass{0%{transform:translate(30px,var(--y));opacity:0}10%{opacity:1}88%{opacity:1}100%{transform:translate(420px,var(--y));opacity:0}}
.cp-mesh .crop path{fill:#B9DD8A;stroke:#5E9A4B;stroke-width:1.6}
.cp-mesh__key{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 18px;margin-top:6px;font-size:13px;color:var(--muted)}
.cp-mesh__key span{display:inline-flex;align-items:center;gap:8px}
.cp-mesh__key i{border-radius:50%}
.cp-mesh__key .b{width:13px;height:13px;background:#8A5A3C}
.cp-mesh__key .s{width:6px;height:6px;background:#C05A1F}
.hp-dark .cp-mesh__key{color:rgba(255,255,255,.7)}
.cp-rng__l{display:flex;justify-content:space-between;margin-top:12px;font:500 11.5px/1 "Geist Mono",monospace;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.hp-dark .cp-rng__l{color:rgba(255,255,255,.6)}
.cp-air{display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:center;margin-top:22px;font-size:14px;font-weight:600;color:var(--ink)}
.cp-air i{height:10px;border-radius:999px;background:var(--line);overflow:hidden}
.cp-air b{display:block;height:100%;width:calc(var(--af,1)*100%);border-radius:999px;background:linear-gradient(90deg,#5AA5C6,#8DB7C9);transition:width .3s}
.hp-dark .cp-air{color:#fff}.hp-dark .cp-air i{background:rgba(255,255,255,.14)}

/* ---------- FASTENERS lock channel ---------- */
.cp-lock .mem{fill:#E7ECE3;stroke:#B9C4B4;stroke-width:2}
.cp-lock .ch{fill:#D5DCD2;stroke:#7E8C82;stroke-width:2;stroke-linejoin:round}
.cp-lock .scr{stroke:#5E6A60;stroke-width:3;stroke-linecap:round}
.cp-lock .s1{opacity:0;transform:translateY(-16px);transition:opacity .5s,transform .7s var(--ease)}
.cp-lock .film{fill:none;stroke:#7FB8D0;stroke-width:5;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1.3s var(--ease)}
.cp-lock .film.f2{stroke:#B5D637;stroke-width:4;opacity:.9}
.cp-lock .wire{fill:none;stroke:var(--deep);stroke-width:5;stroke-linecap:round;stroke-linejoin:round;opacity:0;transform:translateY(-90px);transition:opacity .3s,transform .8s cubic-bezier(.3,1.5,.5,1)}
.cp-lock .t2,.cp-lock .t3,.cp-lock .t4{opacity:0;transition:opacity .4s}
.cp-lock[data-k='1'] .s1,.cp-lock[data-k='2'] .s1,.cp-lock[data-k='3'] .s1,.cp-lock[data-k='4'] .s1{opacity:1;transform:none}
.cp-lock[data-k='2'] .f1,.cp-lock[data-k='3'] .f1,.cp-lock[data-k='4'] .f1{stroke-dashoffset:0}
.cp-lock[data-k='2'] .t2,.cp-lock[data-k='3'] .t2,.cp-lock[data-k='4'] .t2{opacity:1}
.cp-lock[data-k='3'] .wire,.cp-lock[data-k='4'] .wire{opacity:1;transform:none}
.cp-lock[data-k='3'] .t3{opacity:1}
.cp-lock[data-k='4'] .f2{stroke-dashoffset:0}
.cp-lock[data-k='4'] .t4{opacity:1}
.cp-lock[data-k='4'] .wire{animation:cp-lift 2.4s var(--ease) .9s infinite}
@keyframes cp-lift{0%,100%{transform:none}40%,55%{transform:translateY(-36px)}}
.hp .cp-fig button.cp-replay,.hp .cp-fig button.cp-replay:hover,.hp .cp-fig button.cp-replay:focus{all:unset;box-sizing:border-box;position:absolute;right:16px;top:16px;display:inline-flex;align-items:center;gap:7px;padding:8px 13px;border-radius:999px;background:#fff;box-shadow:inset 0 0 0 1px var(--line);font:500 12px/1 "Geist Mono",monospace;letter-spacing:.06em;text-transform:uppercase;color:var(--forest)!important;cursor:pointer;transition:box-shadow .3s}
.hp .cp-fig button.cp-replay:hover{box-shadow:inset 0 0 0 1.5px var(--forest)}
.cp-replay svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.hp-dark .cp-lock .mem{fill:rgba(255,255,255,.08);stroke:rgba(255,255,255,.2)}
.hp-dark .cp-lock .ch{fill:#C9D1C6;stroke:#fff}
.hp-dark .cp-lock .wire{stroke:var(--lime)}

/* ---------- section heads paired with a figure ---------- */
.cp-split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:clamp(28px,4vw,64px);align-items:center}
.cp-split .hp-head{margin:0}
@media(max-width:900px){.cp-split{grid-template-columns:1fr}}

/* ---------- reduced motion ---------- */
@media(prefers-reduced-motion:reduce){.cp-svg *,.cp-lay__s,.cp-panel,.cp-seg__pill{animation:none!important;transition:none!important}}

.cp-side__h{margin-bottom:18px;font-size:clamp(21px,2vw,26px);letter-spacing:-.015em;line-height:1.2}
.hp-dark .cp-side__h{color:#fff}
@media(max-width:620px){.cp-svg .lb,.cp-pcx .annt text{font-size:19px}.cp-pcx .mm{font-size:20px}}

.cp-pk__b .cp-p--lead{margin-top:26px}
.cp-buy{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(28px,4vw,64px);align-items:start}
.cp-buy .hp-head{margin:0}
.cp-buy .cp-ask{display:grid;grid-template-columns:auto 1fr;gap:16px;align-items:start;margin-top:30px}
.cp-buy .cp-ask .hp-btn{grid-column:1/-1;justify-self:start}
.cp-buy__r .sv-todo{margin-top:0}
@media(max-width:900px){.cp-buy{grid-template-columns:1fr}}
.cp-life{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(28px,4vw,64px);align-items:center}
.cp-life .cp-stat{grid-template-columns:1fr 1fr}
.cp-life .hp-head{margin:0}
@media(max-width:900px){.cp-life{grid-template-columns:1fr}}
@media(max-width:560px){.cp-life .cp-stat{grid-template-columns:1fr}}
.cp-life .cp-st b{font-size:clamp(34px,3.4vw,46px);white-space:nowrap}
.cp-note p:empty{display:none}
.cp-read b span{font:inherit;color:inherit;letter-spacing:inherit}
.cp-read em span{font:inherit;color:inherit}
.cp-shade .cloth{fill:#1F2B24;opacity:calc(.25 + var(--v) / 120);stroke:var(--forest);stroke-width:2}
.cp-shade .knit{opacity:calc((100 - var(--v)) / 75)}
.hp-dark .cp-mesh pattern path{stroke:rgba(255,255,255,.5)}
.hp-dark .cp-mesh .netf{stroke:var(--lime)}
.hp-dark .cp-mesh .net{opacity:1}
.cp-mesh .pb{fill:#C98A5A}.cp-mesh .ps{fill:#F08A4B}.cp-mesh__key .b{background:#C98A5A}.cp-mesh__key .s{background:#F08A4B}
.cp-svg .film{vector-effect:none}
.cp-lock[data-k='4'] .t3{opacity:1}
.cp-split .sy-num,.cp-pk__b .sy-num{grid-template-columns:1fr!important}
.cp-split .sv-grid{--c:2}
@media(max-width:620px){.cp-split .sv-grid{--c:1}}