/* Benefit calculator only. Shared navigation and calculation engine stay unchanged. */
.tool-studio.vc-workspace .benefit-page { padding-top:26px; }
.tool-studio.vc-workspace .benefit-page > .benefit-hero,
.tool-studio.studio-rollout .benefit-page > .benefit-layout { width:100%; max-width:1240px; margin-inline:auto; }
.tool-studio.vc-workspace .benefit-hero { display:flex; align-items:center; gap:18px; padding-bottom:20px; }
.benefit-hero-icon { flex:0 0 68px; display:grid; place-items:center; width:68px; height:68px; border:1px solid #2287c1; border-radius:15px; color:#31c8ff; background:linear-gradient(145deg,#143c62,#151d39); box-shadow:0 0 22px #0a91ff17; }
.benefit-hero-icon svg { width:32px; height:32px; }
.benefit-hero-copy { flex:1; min-width:0; }
.tool-studio.vc-workspace .benefit-hero h1 { font-size:clamp(2rem,3vw,2.8rem); }
.tool-studio.vc-workspace .benefit-hero .lead { margin-top:5px; font-size:14px; line-height:1.5; }
.benefit-hero-tip { display:flex; align-items:center; gap:12px; width:252px; margin:0; padding:13px 15px; border:1px solid #364468; border-radius:12px; color:#bfcee8; background:linear-gradient(125deg,#18283e,#1b203d); font-size:13px; line-height:1.45; }
.benefit-hero-tip span { color:#ffd25b; font-size:21px; text-shadow:0 0 12px #ffd25b; }
.tool-studio.studio-rollout .benefit-layout { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.05fr); gap:18px; align-items:start; }
.benefit-form,.benefit-right { display:grid; align-content:start; gap:10px; min-width:0; }
.benefit-form { container:benefit-form / inline-size; }
.tool-studio.studio-rollout .benefit-form > .form-error:empty { display:none; }
.tool-studio.studio-rollout .benefit-form > .form-error:not(:empty) { margin:0; padding:10px 12px; border:1px solid #a96f93; border-radius:8px; background:#342239; }
.tool-studio.studio-rollout .benefit-form .benefit-block { margin:0; padding:16px; border:1px solid #344e74; border-radius:14px; background:radial-gradient(ellipse at 5% 0%,#2c477a44,transparent 75%),linear-gradient(135deg,#172a46,#17243a); box-shadow:inset 0 1px 0 #c4d6ff13,0 10px 24px #02081733; }
.tool-studio.studio-rollout .benefit-form fieldset legend { float:left; width:100%; margin:0 0 14px; padding:0; }
.benefit-block legend,.benefit-quick h2 { display:flex; align-items:center; gap:13px; }
.benefit-block legend > span:last-child,.benefit-quick h2 > span:last-child { display:grid; gap:2px; }
.tool-studio.vc-workspace .benefit-block legend strong,.benefit-quick h2 strong { color:#8ddaff; font-size:15px; line-height:1.2; }
.benefit-block legend small,.benefit-quick h2 small { color:#aebfdd; font-size:13px; font-weight:400; line-height:1.4; }
.benefit-step { flex:0 0 37px; display:grid; place-items:center; width:37px; height:37px; border-radius:50%; color:#fff; background:linear-gradient(135deg,#5aa0ff,#424dd8); font-size:18px; font-weight:750; box-shadow:0 0 15px #5878ff55; }
.benefit-fields { display:grid; gap:11px 16px; clear:both; }
.benefit-fields-two { grid-template-columns:repeat(2,minmax(0,1fr)); }
.benefit-fields-three { grid-template-columns:repeat(3,minmax(0,1fr)); }
.tool-studio.studio-rollout .benefit-fields .field { grid-template-rows:auto auto; align-content:start; gap:6px; }
.tool-studio.studio-rollout .benefit-fields label { color:#bdcde9; font-size:14px; font-weight:600; line-height:1.35; }
.tool-studio.studio-rollout .benefit-fields .field > label,.benefit-label { display:flex; align-items:center; min-height:0; }
.benefit-label { justify-content:flex-start; gap:5px; min-width:0; }
.benefit-label > label { flex:0 1 auto; min-width:0; }
.tool-studio.studio-rollout .benefit-fields :is(input,select) { min-height:39px; padding:7px 10px; font-size:15px; }
.tool-studio.studio-rollout .benefit-fields select { appearance:none; padding-right:38px; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='m1 1 5 5 5-5' fill='none' stroke='%23b8c9e5' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 13px center; background-size:12px 8px; }
.tool-studio.studio-rollout .benefit-fields input[type=number] { appearance:textfield; -moz-appearance:textfield; }
.tool-studio.studio-rollout .benefit-fields input[type=number]::-webkit-inner-spin-button,.tool-studio.studio-rollout .benefit-fields input[type=number]::-webkit-outer-spin-button { -webkit-appearance:none; margin:0; }
.tool-studio.studio-rollout .benefit-fields input[aria-invalid=true] { border-color:#ff9cb6; box-shadow:0 0 0 2px #e879aa40; }
.benefit-fields-three > :nth-child(3n) .info-popover-panel,.benefit-fields-two > :nth-child(2n) .info-popover-panel { left:auto!important; right:0!important; }
@container benefit-form (max-width:540px) { .benefit-fields-three { grid-template-columns:repeat(2,minmax(0,1fr)); } }
.tool-studio.studio-rollout .benefit-fixed { max-width:100%; }
.tool-studio.studio-rollout .benefit-quick h2 { margin:0 0 11px; font-weight:650; }
.benefit-quick-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px; }
.benefit-quick-card { display:flex; align-items:center; gap:10px; min-height:61px; padding:8px; border:1px solid #3a5375; border-radius:10px; background:linear-gradient(135deg,#1c2c47,#17253c); }
.benefit-quick-card > span { flex:0 0 34px; display:grid; place-items:center; width:34px; height:34px; border-radius:50%; font-size:20px; font-weight:700; }
.benefit-quick-card p { display:grid; gap:1px; margin:0; }
.benefit-quick-card strong { font-size:13px; }
.benefit-quick-card small { color:#b3c3df; font-size:12px; line-height:1.4; }
.quick-profit > span { color:#5fffe3; background:#0c5555; }.quick-profit strong { color:#5fffe3; }
.quick-margin > span { color:#72c8ff; background:#21497d; }.quick-margin strong { color:#81cfff; }
.quick-markup > span { color:#f3a4ff; background:#653077; }.quick-markup strong { color:#c7b4ff; }
.quick-break { border-color:#8c5cbe; box-shadow:inset 0 0 16px #9f62df12; }.quick-break > span { color:#e0a4ff; background:#563276; }.quick-break strong { color:#d3a5ff; }
.benefit-form-note { margin:1px 5px 0; color:#9cafca; font-size:12px; line-height:1.45; }
.tool-studio.studio-rollout .benefit-results { padding:16px; border:1px solid #344e74; border-radius:14px; background:radial-gradient(ellipse at 90% 0%,#293d7844,transparent 70%),linear-gradient(135deg,#182a47,#162237); box-shadow:inset 0 1px 0 #c4d6ff13,0 10px 24px #02081733; }
.benefit-results-head { display:flex; align-items:center; gap:11px; margin-bottom:17px; }
.benefit-results-icon { color:#33caff; font-size:22px; }
.benefit-results-head > div { flex:1; }
.tool-studio.vc-workspace .benefit-results-head h2 { margin:0; color:#f1f4ff; font-size:16px; }
.benefit-results-head p { margin:2px 0 0; color:#aebfdd; font-size:13px; }
.tool-studio.vc-workspace .benefit-recalculate { min-height:34px; padding:6px 10px; border-color:#6798f4; color:#c4dcff; background:linear-gradient(#244678,#263575); font-size:12px; }
.benefit-major-grid,.benefit-minor-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.benefit-metric { min-width:0; min-height:116px; padding:12px 9px; border:1px solid; border-radius:10px; text-align:center; }
.benefit-metric h3 { display:flex; align-items:center; justify-content:center; gap:5px; margin:0 0 7px; font-size:13px; line-height:1.3; }
.benefit-metric h3 span { display:grid; place-items:center; width:28px; height:28px; border-radius:50%; font-size:17px; }
.benefit-metric strong { display:block; color:#f2f5ff; font-size:clamp(1.25rem,2vw,1.7rem); line-height:1.2; font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
.benefit-metric p { margin:4px 0 0; color:#b9c8e2; font-size:12px; line-height:1.4; }
.metric-profit { border-color:#1bbbaa; background:linear-gradient(145deg,#10565d88,#10334688); }.metric-profit h3 { color:#69ffdc; }.metric-profit h3 span { background:#136d69; }
.metric-margin { border-color:#3188ec; background:linear-gradient(145deg,#174a8188,#182a5288); }.metric-margin h3 { color:#8bd9ff; }.metric-margin h3 span { background:#2367a6; }
.metric-break { border-color:#a345ed; background:linear-gradient(145deg,#57338c88,#2c235888); }.metric-break h3 { color:#e6a4ff; }.metric-break h3 span { background:#79359e; }
.benefit-metric.negative { border-color:#d66d91; background:#4b263b; }.benefit-metric.negative strong { color:#ffc4d7; }
.benefit-minor-grid { margin-top:12px; }
.benefit-minor-grid article { min-width:0; padding:10px 11px; border:1px solid #3b5578; border-radius:10px; background:linear-gradient(135deg,#20324f,#1b2b43); }
.benefit-minor-grid h3 { margin:0 0 3px; color:#b6c7e4; font-size:12px; font-weight:500; }
.benefit-minor-grid strong { color:#f1f4ff; font-size:14px; line-height:1.3; overflow-wrap:anywhere; font-variant-numeric:tabular-nums; }
.benefit-minor-grid p { margin:2px 0 0; color:#a9bcd9; font-size:12px; line-height:1.4; }
.benefit-breakdown { margin-top:15px; border:1px solid #355170; border-radius:10px; overflow:hidden; }
.benefit-breakdown table { width:100%; border-collapse:collapse; font-size:13px; }
.benefit-breakdown caption { padding:10px 13px; color:#e8efff; background:#203652; font-size:14px; font-weight:700; text-align:left; caption-side:top; }
.benefit-breakdown thead { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; }
.benefit-breakdown :is(th,td) { padding:4px 12px; border-bottom:1px solid #4b638041; color:#e2e9f8; line-height:1.25; }
.benefit-breakdown th { font-weight:450; text-align:left; }
.benefit-breakdown td { text-align:right; font-weight:650; font-variant-numeric:tabular-nums; white-space:nowrap; }
.benefit-breakdown tbody tr:nth-child(even) { background:#21335046; }
.benefit-breakdown .benefit-total-row { background:#2e4163!important; }.benefit-breakdown .benefit-total-row :is(th,td) { font-weight:700; color:#c8dcff; }
.benefit-breakdown .benefit-profit-row { background:#103c44!important; }.benefit-breakdown .benefit-profit-row :is(th,td) { border:0; color:#5df6d0; font-weight:750; }
.benefit-breakdown .benefit-profit-row.negative { background:#47283c!important; }.benefit-breakdown .benefit-profit-row.negative :is(th,td) { color:#ffc4d7; }
.benefit-right > .tool-help-grid { display:grid; grid-template-columns:minmax(0,1fr); gap:10px; margin:0; }
.benefit-right > .tool-help-grid > .tool-help-item { min-width:0; margin:0; padding:0; border:1px solid #344e74; border-radius:12px; background:linear-gradient(135deg,#182a47,#162237); box-shadow:inset 0 1px 0 #c4d6ff13,0 8px 18px #02081724; }
.benefit-right .tool-help-item > summary { min-height:58px; }
.benefit-right .tool-help-content { padding:0 16px 16px; font-size:13px; line-height:1.55; }
@media(max-width:1100px) { .benefit-hero-tip { display:none; } .tool-studio.studio-rollout .benefit-layout { grid-template-columns:minmax(0,1fr); } }
@media(max-width:699px) { .benefit-fields-three > :nth-child(3n) .info-popover-panel,.benefit-fields-two > :nth-child(2n) .info-popover-panel { left:50vw!important; right:auto!important; } }
@media(max-width:600px) { .tool-studio.vc-workspace .benefit-hero { align-items:flex-start; gap:10px; }.benefit-hero-icon { flex-basis:45px; width:45px; height:45px; }.benefit-hero-icon svg { width:24px; height:24px; }.benefit-fields-three { grid-template-columns:repeat(2,minmax(0,1fr)); }.tool-studio.studio-rollout .benefit-fixed { max-width:none; grid-column:auto; }.benefit-major-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }.metric-break { grid-column:1/-1; }.benefit-minor-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:380px) { .benefit-fields-two,.benefit-fields-three,.benefit-quick-grid { grid-template-columns:minmax(0,1fr); }.benefit-major-grid,.benefit-minor-grid { grid-template-columns:minmax(0,1fr); }.metric-break { grid-column:auto; }.benefit-breakdown :is(th,td) { padding-inline:7px; font-size:12px; } }
:root[data-theme=light] .tool-studio.vc-workspace .benefit-page .benefit-block,:root[data-theme=light] .tool-studio.vc-workspace .benefit-page .benefit-results,:root[data-theme=light] .benefit-right > .tool-help-grid > .tool-help-item { background:linear-gradient(135deg,#fff,#edf4ff); border-color:#b9cde6; box-shadow:0 8px 22px #34547e15; }
:root[data-theme=light] .benefit-hero-tip { color:#365472; background:#f3f7ff; border-color:#c4d4e9; }
:root[data-theme=light] .tool-studio.vc-workspace .benefit-block legend strong,:root[data-theme=light] .benefit-quick h2 strong { color:#155d96; }
:root[data-theme=light] .benefit-block legend small,:root[data-theme=light] .benefit-quick h2 small,:root[data-theme=light] .benefit-form-note { color:#536e8b; }
:root[data-theme=light] .tool-studio.studio-rollout .benefit-fields label { color:#274a71; }
:root[data-theme=light] .tool-studio.studio-rollout .benefit-fields select { background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='m1 1 5 5 5-5' fill='none' stroke='%234b6380' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); }
:root[data-theme=light] .benefit-quick-card,:root[data-theme=light] .benefit-minor-grid article { background:#f2f7ff; border-color:#c5d5e8; }
:root[data-theme=light] .benefit-quick-card.quick-break { border-color:#a88acb; box-shadow:inset 0 0 16px #9f62df0b; }
:root[data-theme=light] .benefit-quick-card small,:root[data-theme=light] .benefit-minor-grid :is(h3,p) { color:#536c88; }
:root[data-theme=light] .tool-studio.vc-workspace .benefit-results-head h2,:root[data-theme=light] .benefit-minor-grid strong { color:#203957; }
:root[data-theme=light] .benefit-results-head p { color:#536c88; }
:root[data-theme=light] .benefit-metric { background:#f1f7ff; }
:root[data-theme=light] .benefit-metric strong { color:#203957; }
:root[data-theme=light] .benefit-metric.negative { background:#fff0f4; border-color:#ce6f90; }:root[data-theme=light] .benefit-metric.negative strong { color:#a22b50; }
:root[data-theme=light] .benefit-metric p { color:#526b88; }
:root[data-theme=light] .metric-profit h3 { color:#067c70; }:root[data-theme=light] .metric-margin h3 { color:#155da2; }:root[data-theme=light] .metric-break h3 { color:#7833ac; }
:root[data-theme=light] .benefit-breakdown { border-color:#c1d2e7; }:root[data-theme=light] .benefit-breakdown caption { color:#203957; background:#e4eefb; }
:root[data-theme=light] .benefit-breakdown :is(th,td) { color:#213d5d; border-color:#c7d5e7; }:root[data-theme=light] .benefit-breakdown tbody tr:nth-child(even) { background:#f0f5fc; }
:root[data-theme=light] .benefit-breakdown .benefit-total-row { background:#dceafb!important; }:root[data-theme=light] .benefit-breakdown .benefit-total-row :is(th,td) { color:#1c4e81; }
:root[data-theme=light] .benefit-breakdown .benefit-profit-row { background:#def8f1!important; }:root[data-theme=light] .benefit-breakdown .benefit-profit-row :is(th,td) { color:#087462; }
:root[data-theme=light] .benefit-breakdown .benefit-profit-row.negative { background:#fff0f4!important; }:root[data-theme=light] .benefit-breakdown .benefit-profit-row.negative :is(th,td) { color:#a22b50; }
:root[data-theme=light] .quick-break > span { color:#7041a4; background:#e8dcf7; }:root[data-theme=light] .tool-studio.vc-workspace main .benefit-quick-card.quick-break strong { color:#7041a4; }
.tool-studio.studio-rollout .benefit-fields select { background-repeat:no-repeat!important; background-position:right 13px center!important; background-size:12px 8px!important; }