/* plans · team builder: role cards on the left, a live receipt on the right */
#p4 .pz-team .tq{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,330px);gap:clamp(18px,2.4vw,32px);align-items:stretch;margin-top:min(14px,1.6vh)}
#p4 .pz-team .ladder{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;align-content:start}
#p4 .pz-team .ladder::before{display:none}
#p4 .pz-team .ladder:has(.rung:hover) .rung:not(:hover){opacity:.62}
#p4 .pz-team .rung{border:1px solid var(--line-str);border-radius:8px;background:rgba(16,35,61,.5);box-shadow:none}
#p4 .pz-team .rung:hover{transform:translateY(-2px);background:rgba(127,119,221,.09);border-color:rgba(127,119,221,.45);box-shadow:0 14px 30px -18px rgba(6,16,30,.9)}
#p4 .pz-team .rung:not(.zero){border-color:rgba(127,119,221,.3)}
#p4 .pz-team .rung.zero{border-style:dashed;background:transparent}
#p4 .pz-team .rin{display:flex;flex-direction:column;gap:6px;height:100%;padding:min(16px,1.9vh) 16px min(14px,1.7vh);transition-delay:calc(.08s + var(--k) * 60ms)}
#p4 .pz-team .rc-top{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
#p4 .pz-team .rnm{gap:9px}
#p4 .pz-team .rnm b{font-size:16px}
#p4 .pz-team .rung .node{justify-self:auto}
#p4 .pz-team .rpr{display:flex;align-items:baseline;gap:2px;font-size:15px;white-space:nowrap}
#p4 .pz-team .rpr small{font-size:11px;color:var(--grey)}
#p4 .pz-team .rds{font-size:13.5px;line-height:1.4;margin:0 0 auto;text-wrap:pretty}
#p4 .pz-team .rc-bot{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:min(10px,1.2vh);min-height:36px}
#p4 .pz-team .pips>img,#p4 .pz-team .pips>i{width:22px;height:22px;margin-left:-6px}
#p4 .pz-team .pips>:first-child{margin-left:0}
#p4 .pz-team .rung.zero .pips::before{content:"none yet";font-family:var(--mono);font-size:11.5px;color:var(--grey-dim)}
#p4 .pz-team .step{padding:2px;border-radius:8px;background:rgba(6,16,30,.4)}
#p4 .pz-team .sb{width:32px;height:32px;font-size:16px}
#p4 .pz-team .step output{min-width:26px;font-size:14px}

/* receipt */
#p4 .pz-team .rc{display:flex;flex-direction:column;gap:min(12px,1.5vh);padding:min(18px,2.2vh) 18px;border:1px solid rgba(127,119,221,.32);border-radius:8px;background:linear-gradient(180deg,rgba(91,79,207,.12),rgba(16,35,61,.55) 46%);opacity:0;transform:translateY(10px);transition:opacity .5s var(--ez) .35s,transform .6s var(--ez) .35s}
#p4 .pzv.on .rc{opacity:1;transform:none}
#p4 .rc-hd{display:flex;align-items:center;justify-content:space-between;gap:10px}
#p4 .rc-k{font-family:var(--mono);font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--purple-lt)}
#p4 .rc .tf-n{font-size:11.5px}
#p4 .rc .pz-big>span{font-size:clamp(36px,3.4vw,48px)}
#p4 .rc .pz-big small{font-size:12px}
#p4 .rc .tf-sum{display:none}
#p4 .rc-bar{display:flex;gap:2px;height:8px;border-radius:4px;overflow:hidden;background:rgba(159,176,196,.12)}
#p4 .rc-bar i{display:block;height:100%;flex:var(--w,0) 1 0%;min-width:0;background:var(--c);transition:flex-grow .45s var(--ez),opacity .2s}
#p4 .rc-bar.hl i:not(.hl){opacity:.28}
#p4 .rc-lines{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:2px}
#p4 .rc-lines li{display:grid;grid-template-columns:10px minmax(0,1fr) auto;align-items:center;gap:10px;padding:4px 6px;margin:0 -6px;border-radius:6px;font-size:14px;color:var(--grey);transition:background .15s,color .15s}
#p4 .rc-lines li i{width:8px;height:8px;border-radius:2px;background:var(--c)}
#p4 .rc-lines li span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#p4 .rc-lines li span em{font-style:normal;font-family:var(--mono);font-size:12.5px;color:var(--grey-dim);margin-left:6px}
#p4 .rc-lines li b{font-family:var(--mono);font-weight:500;font-size:13.5px;color:var(--ink);font-variant-numeric:tabular-nums}
#p4 .rc-lines li.hl{background:rgba(127,119,221,.14);color:var(--ink)}
#p4 .rc-lines li.new{animation:rcIn .3s var(--ez)}
@keyframes rcIn{from{opacity:0;transform:translateX(-6px)}}

/* commander inside the receipt */
#p4 .rc .cmd{display:grid;grid-template-columns:34px minmax(0,1fr) auto auto;align-items:center;gap:12px;padding:10px 12px;border:1px solid rgba(22,201,144,.4);border-radius:8px;background:rgba(13,158,114,.08);transition:border-color .2s,background .2s,opacity .2s}
#p4 .rc .cmd.off{border-color:var(--line-str);background:transparent}
#p4 .rc .cmd.off .atom,#p4 .rc .cmd.off .cnm,#p4 .rc .cmd.off .cpr{opacity:.55}
#p4 .rc .cmd .atom{width:34px;height:34px;display:block}
#p4 .rc .cnm{display:flex;flex-direction:column;gap:2px;min-width:0}
#p4 .rc .cnm b{font-family:var(--disp);font-weight:600;font-size:15px;color:var(--ink)}
#p4 .rc .cnm span{font-size:12.5px;line-height:1.3;color:var(--grey)}
#p4 .rc .cpr{font-family:var(--mono);font-size:14px;color:var(--ink)}
#p4 .rc .ctg{display:flex;align-items:center;margin:0;cursor:pointer}

#p4 .rc .pz-cta{width:100%;height:48px;margin-top:auto;font-size:15px}
#p4 .rc .tf-under{margin:0;text-align:center;font-size:13.5px}

@media(max-width:1180px){#p4 .pz-team .ladder{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:900px){#p4 .pz-team .tq{grid-template-columns:minmax(0,1fr)}#p4 .pz-team .rc .pz-cta{margin-top:4px}}
@media(max-width:560px){#p4 .pz-team .ladder{grid-template-columns:minmax(0,1fr)}}
@media(max-height:760px){#p4 .pz-team .rds{display:none}#p4 .pz-team .rc-bot{margin-top:6px}#p4 .rc .cnm span{display:none}#p4 .rc-lines li{padding:2px 6px}}
@media(max-height:620px){#p4 .rc-lines{display:none}}
@media(prefers-reduced-motion:reduce){#p4 .rc-bar i,#p4 .pz-team .rc{transition:none}#p4 .rc-lines li.new{animation:none}}

/* cards, tightened: name and price share a row that never spills, price is a quiet mono tag */
#p4 .pz-team .tq-l{display:flex;flex-direction:column;gap:10px;min-width:0}
#p4 .pz-team .tq-note{margin:0;font-family:var(--mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--grey)}
#p4 .pz-team .rung{min-width:0}
#p4 .pz-team .rin{min-width:0;gap:4px}
#p4 .pz-team .rc-top{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px}
#p4 .pz-team .rnm{min-width:0}
#p4 .pz-team .rnm b{font-size:15.5px;white-space:normal;line-height:1.2;overflow-wrap:anywhere}
#p4 .pz-team .rpr{flex:none;padding:3px 8px;border-radius:999px;background:rgba(127,119,221,.14);font-size:13px;line-height:1.2}
#p4 .pz-team .rung.zero .rpr{background:rgba(159,176,196,.1)}
#p4 .pz-team .rds{font-size:13px;line-height:1.35;overflow-wrap:anywhere}
#p4 .pz-team .rc-bot{min-width:0;flex-wrap:nowrap}
#p4 .pz-team .pips{flex:1;min-width:0;overflow:hidden}
#p4 .pz-team .rung.zero .pips::before{white-space:nowrap}
#p4 .pz-team .step{flex:none}
#p4 .pz-team .sb{width:30px;height:30px}
#p4 .pz-team .step output{min-width:22px}

/* one-line card header: name on the left, price on the right, always on the same baseline */
#p4 .pz-team .rnm b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;overflow-wrap:normal;line-height:1.25}
#p4 .pz-team .rc-top{align-items:center;min-height:26px}
#p4 .pz-team .rnm{display:flex;align-items:center;gap:8px;overflow:hidden}
#p4 .pz-team .rnm .node{flex:none}
#p4 .pz-team .rin{padding-left:14px;padding-right:14px}
@media(max-width:1380px){#p4 .pz-team .rnm b{font-size:14.5px}}

/* card: name, then a larger price beneath it, stepper nudged in from the edge */
#p4 .pz-team .rin{display:grid;grid-template-columns:minmax(0,1fr);grid-template-areas:"nm" "pr" "ds" "bt";align-content:start;gap:4px}
#p4 .pz-team .rc-top{display:contents}
#p4 .pz-team .rnm{grid-area:nm}
#p4 .pz-team .rpr{grid-area:pr;justify-self:start;padding:0;border-radius:0;background:none!important;font-size:22px;font-weight:500;letter-spacing:-.02em;line-height:1.1;margin-top:2px}
#p4 .pz-team .rung.zero .rpr{color:var(--grey)}
#p4 .pz-team .rds{grid-area:ds}
#p4 .pz-team .rc-bot{grid-area:bt;align-self:end}
#p4 .pz-team .step{margin-right:6px}

/* fixes: old responsive grid-areas leaking into the new grids */
#p4 .rc .cmd>*{grid-area:auto!important;grid-column:auto;grid-row:auto}
#p4 .rc .cmd{grid-template-areas:none!important;grid-template-columns:34px minmax(0,1fr) auto auto!important}
#p4 .pz-team .pips{display:none!important}
#p4 .rc-hd{margin-bottom:2px}
#p4 .rc .pz-big{margin-top:2px}

#p4 .pz-team .rc-bot{justify-content:flex-start}
#p4 .pz-team .step{margin-right:0}

/* lone wolf · same builder language: six cards all marked yours, the receipt shows the flat price */
#p4 .pz-lone .tq{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,330px);gap:clamp(18px,2.4vw,32px);align-items:stretch;margin-top:min(14px,1.6vh)}
#p4 .pz-lone .tq-l{display:flex;flex-direction:column;gap:10px;min-width:0}
#p4 .pz-lone .tq-note{margin:0;font-family:var(--mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--grey)}
#p4 .pz-lone .ladder{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;align-content:start}
#p4 .pz-lone .ladder::before{display:none}
#p4 .pz-lone .lwc{min-width:0;border:1px solid rgba(127,119,221,.3);border-radius:8px;background:rgba(16,35,61,.5);transition:transform .3s var(--ez),background .3s var(--ez),border-color .3s var(--ez)}
#p4 .pz-lone .lwc:hover{transform:translateY(-2px);background:rgba(127,119,221,.09);border-color:rgba(127,119,221,.45)}
#p4 .pz-lone .rin{display:grid;grid-template-columns:minmax(0,1fr);grid-template-areas:"nm" "pr" "ds" "bt";align-content:start;gap:4px;height:100%;min-width:0;padding:min(16px,1.9vh) 14px min(14px,1.7vh);transition-delay:calc(.08s + var(--k) * 60ms)}
#p4 .pz-lone .rc-top{display:contents}
#p4 .pz-lone .rnm{grid-area:nm;display:flex;align-items:center;gap:8px;min-width:0;overflow:hidden}
#p4 .pz-lone .rnm b{font-family:var(--disp);font-weight:600;font-size:15.5px;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#p4 .pz-lone .rnm .node{width:9px;height:9px;border-radius:50%;flex:none;border:1.5px solid var(--purple-lt);background:var(--purple-lt);box-shadow:0 0 8px rgba(127,119,221,.8)}
#p4 .pz-lone .rpr{grid-area:pr;justify-self:start;display:block;margin-top:2px;font-family:var(--mono);font-size:22px;font-weight:500;letter-spacing:-.02em;line-height:1.1;color:var(--grey);text-decoration:line-through;text-decoration-color:transparent;text-decoration-thickness:1.5px;transition:text-decoration-color .3s ease calc(1.1s + var(--k) * 90ms)}
#p4 .pzv.on.pz-lone .rpr{text-decoration-color:rgba(167,161,232,.7)}
#p4 .pz-lone .rds{grid-area:ds;display:block;margin:0;font-size:13px;line-height:1.35;color:var(--grey);overflow-wrap:anywhere}
#p4 .pz-lone .rc-bot{grid-area:bt;display:flex;align-items:center;min-height:36px;margin-top:min(10px,1.2vh)}
#p4 .pz-lone .lw-own{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 12px 0 9px;border-radius:999px;background:rgba(22,201,144,.12);color:var(--teal-br);font:600 13px var(--body);opacity:0;transform:scale(.85)}
#p4 .pz-lone .lw-own svg{width:14px;height:14px}
#p4 .pzv.on.pz-lone .lw-own{animation:lwOwn .4s cubic-bezier(.3,1.4,.5,1) calc(.9s + var(--k) * 90ms) both}
@keyframes lwOwn{from{opacity:0;transform:scale(.85)}to{opacity:1;transform:none}}
#p4 .pz-lone .lw-save{color:var(--teal-br)}
#p4 .pz-lone .lw-save b{color:var(--teal-br)}
#p4 .pz-lone .lw-save i{background:none!important;border:1px dashed rgba(22,201,144,.6)}
#p4 .pz-lone .rc .lw-under{margin-top:-2px}
#p4 .pz-lone .rc .lw-link{margin:0 auto;font-size:13.5px}
@media(max-width:1180px){#p4 .pz-lone .ladder{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:900px){#p4 .pz-lone .tq{grid-template-columns:minmax(0,1fr)}}
@media(max-width:560px){#p4 .pz-lone .ladder{grid-template-columns:minmax(0,1fr)}}
@media(max-height:760px){#p4 .pz-lone .rds{display:none}#p4 .pz-lone .rc-bot{margin-top:6px}}
@media(max-height:620px){#p4 .pz-lone .rc-lines{display:none}}
@media(prefers-reduced-motion:reduce){#p4 .pzv.on.pz-lone .lw-own{animation:none;opacity:1;transform:none}}

/* lone wolf gets the same width as team */
#p4 .pzv-lone,#p4 #pzLone{max-width:none!important;width:100%}
@media(max-height:620px){#p4 .pz-lone .rc{gap:8px}#p4 .pz-lone .rc .pz-big>span{font-size:34px}}

#p4 .pz-lone .lw-under{display:block;margin:0;text-align:center}

/* onboarding header: one-line headline, kicker clear of the top bar */
#pOnb{padding-top:calc(var(--bar) + 28px);align-items:safe center;justify-content:safe center}
#pOnb .obx-head{max-width:none}
#pOnb .obx-h{white-space:nowrap;font-size:clamp(24px,min(3.1vw,6.4vh),46px)}
@media(max-width:760px){#pOnb .obx-h{white-space:normal}}

/* onboarding fits short screens: tighter rhythm, then shed detail */
@media(max-height:760px){#pOnb .obx{gap:min(16px,2.4vh)}#pOnb .obx-head{gap:6px}#pOnb .obx-sub{font-size:13.5px;line-height:1.5}#pOnb .obx-c{padding:12px 12px 10px;gap:6px}#pOnb .obx-rail{padding-top:22px}}
@media(max-height:620px){#pOnb .obx-e{display:none}#pOnb .obx-c h3{font-size:14px}#pOnb .obx-ic{width:22px;height:22px}#pOnb{padding-bottom:calc(var(--ftr) + 10px)}}