/* Cost comparison chapter, shared with /invest (copied from css/invest.css; keep both in step). */
.iv-tag{display:inline-block;font-family:var(--mono);font-size:9.5px;line-height:1;letter-spacing:.1em;text-transform:uppercase;padding:5px 7px 4px;border:1px solid;border-radius:2px;vertical-align:.18em;white-space:nowrap;margin-right:4px}
.iv-tag-m{color:#9ee6b8;border-color:#4f7d5f;background:#16231b}
.iv-tag-h{color:#ffd28a;border-color:#7a6232;background:#241d10}
.iv-tag-r{color:#c9d3ff;border-color:#4d5680;background:#161a29}
.iv-source{font-size:12px;line-height:1.6;color:var(--muted);max-width:820px;margin-top:16px}
.iv-source a{text-decoration:underline;text-underline-offset:2px}
.iv-calcs-head{display:grid;grid-template-columns:auto auto 1fr;gap:10px 16px;align-items:center;margin-bottom:26px}
.iv-calcs-head h3{font-size:32px;text-transform:uppercase}
.iv-calcs-head p{grid-column:1/-1;font-size:14px;color:#d9d6ce;max-width:680px}
/* 04 The cost difference */
.iv-cost-panel{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.6fr);gap:26px 40px;border:1px solid var(--line);background:#141413;padding:30px;align-items:start}
.iv-cost-controls{display:grid;gap:14px}
.iv-cost-controls .iv-calcs-head{margin-bottom:6px}
.iv-cost-panel label{display:grid;grid-template-columns:1fr auto;gap:2px 14px;font-size:13px;color:#d9d6ce}
.iv-cost-panel output{font-family:var(--mono);font-size:13px;color:var(--ink)}
.iv-cost-panel input[type=range]{grid-column:1/-1;width:100%;height:44px;accent-color:var(--pink);margin:0;cursor:pointer}
.iv-cost-shots{font-family:var(--mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.iv-cost-shots b{color:var(--ink);font-weight:400}
.iv-cost-bars{list-style:none;margin:0;padding:0;display:grid;gap:16px}
.iv-cost-bars li{display:grid;grid-template-columns:minmax(0,1fr) 110px;grid-template-areas:"name val" "track track";gap:8px 16px;align-items:end}
.iv-cost-name{grid-area:name;display:flex;flex-direction:column}
.iv-cost-name b{font-weight:600;font-size:14px}
.iv-cost-name span{font-size:12px;color:var(--muted)}
.iv-cost-val{grid-area:val;text-align:right;font-family:var(--display);font-weight:600;font-size:clamp(30px,2.8vw,44px);line-height:1;font-variant-numeric:tabular-nums}
.iv-cost-track{grid-area:track;height:14px;background:#232321;position:relative;overflow:hidden}
.iv-cost-track i{position:absolute;inset:0 auto 0 0;width:max(4px,calc(var(--v) * 100%));transition:width .45s cubic-bezier(.2,.7,.2,1)}
.iv-cost-x{grid-column:2;display:flex;align-items:center;gap:16px;border-top:1px solid var(--line);padding-top:18px;font-size:14px;color:#d9d6ce}
.iv-cost-x b{font-family:var(--display);font-weight:600;font-size:clamp(40px,4vw,62px);color:var(--pink);line-height:1;margin-right:10px;vertical-align:-.12em}
.iv-cost-49{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:28px}
.iv-decentral{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:50px;margin-top:70px;align-items:start}
.iv-decentral h3{font-size:clamp(40px,4.4vw,68px);text-transform:uppercase;margin-bottom:18px}
.iv-decentral>div>p{color:#d9d6ce;max-width:520px}
.iv-decentral ul{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.iv-decentral li{display:flex;gap:20px;align-items:flex-start;padding:22px 0;border-bottom:1px solid var(--line)}
.iv-decentral h4{margin:0 0 6px;font-family:var(--display);font-weight:600;font-size:28px;text-transform:uppercase}
.iv-decentral li p{font-size:14px;color:#d9d6ce}

.is-them .iv-cost-track i{background:linear-gradient(90deg,#5d5c57,#8f8e87)}
.is-them .iv-cost-val{color:#c9c7c0}
.is-us .iv-cost-track i{background:linear-gradient(90deg,var(--red),var(--pink));box-shadow:0 0 14px #ff343b88}
.is-us .iv-cost-val{color:var(--pink)}
/* Media queries for the cost chapter on /studio */
@media (max-width:980px){.iv-cost-panel,.iv-decentral{grid-template-columns:1fr}.iv-cost-x{grid-column:1}}
@media (max-width:600px){.iv-cost-panel{padding:20px 14px}.iv-cost-bars li{grid-template-columns:minmax(0,1fr) 92px}.iv-cost-x{flex-direction:column;align-items:flex-start}}
@media (prefers-reduced-motion:reduce){.iv-cost-track i{transition:none}}
.sv-paused .iv-cost-track i{transition:none}
.sv-cost .iv-cost-x .iv-ico{width:40px;height:40px}
.sv-cost .iv-decentral .iv-ico{width:40px;height:40px;flex:none}