:root{--brand-primary: #6630b4;--brand-accent: #43bea5;--brand-ink: #222a39;--brand-soft: #cbcae3;--canvas: #ececf1;--panel: rgba(255, 255, 255, .72);--line: color-mix(in srgb, var(--brand-primary) 45%, #ffffff);--shadow: 0 16px 36px rgba(31, 35, 46, .12);font-family:Nunito Sans,Avenir Next,Segoe UI,sans-serif;color:var(--brand-ink);background:radial-gradient(circle at 0% 0%,rgba(255,255,255,.92),var(--canvas) 55%)}*{box-sizing:border-box}body{margin:0;min-height:100vh;color:var(--brand-ink);background:var(--canvas)}#app{min-height:100vh}.roi-app{min-height:100vh;max-width:1380px;margin:0 auto;padding:clamp(.9rem,2vw,1.8rem);display:grid;gap:clamp(.85rem,1.6vw,1.5rem);background-image:linear-gradient(to right,rgba(255,255,255,.32) 1px,transparent 1px),linear-gradient(to bottom,rgba(255,255,255,.32) 1px,transparent 1px);background-size:22px 22px}.roi-app.is-entering{animation:intro-fade .45s ease}.roi-header{display:flex;justify-content:space-between;align-items:flex-start;gap:clamp(.8rem,2vw,2rem)}.roi-header h1{margin:0;font-size:clamp(1.7rem,2.9vw,2.6rem);letter-spacing:-.01em;max-width:30ch;text-wrap:balance}.roi-main{display:grid;gap:clamp(.9rem,1.4vw,1.2rem)}.brand-wrap{display:inline-flex;align-items:center;padding:.15rem .35rem .2rem 0}.brand-logo{width:clamp(11rem,16vw,18rem);height:auto;display:block;filter:drop-shadow(0 6px 14px rgba(25,30,42,.16))}.input-section{background:var(--panel);border:2px solid var(--line);border-radius:1rem;box-shadow:var(--shadow);padding:clamp(.85rem,1.8vw,1.2rem);display:grid;gap:clamp(.6rem,1.2vw,.95rem)}.two-column{grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(.7rem,1.4vw,1.15rem)}.section-title{margin:0;color:var(--brand-primary);font-size:clamp(1.05rem,2vw,1.3rem);font-weight:900;letter-spacing:-.01em;text-wrap:balance}.two-column .section-title,.result-section .section-title{grid-column:1 / -1}.field-column,.field-grid{display:grid;gap:.75rem}.field{display:grid;grid-template-columns:minmax(0,1fr) minmax(14rem,21rem);align-items:center;gap:.75rem;font-size:clamp(.95rem,1.3vw,1.05rem);line-height:1.35}.field span:first-child{font-weight:700;text-wrap:balance}.field-input-wrap{position:relative;display:flex;align-items:center}.field-prefix,.field-suffix{position:absolute;font-weight:800;color:var(--brand-primary);font-size:1rem}.field-prefix{left:.8rem}.field-suffix{right:.8rem}.field input{width:100%;border:2px solid var(--brand-primary);border-radius:.5rem;background:#ffffffd9;color:var(--brand-primary);min-height:3rem;font-size:clamp(1.1rem,2.2vw,1.35rem);font-weight:800;padding:.5rem .8rem;line-height:1.2}.field[data-kind=currency] input,.field input:has(+.field-suffix){padding-inline-end:2.8rem}.field-input-wrap .field-prefix+input{padding-inline-start:2rem}.field input:focus{outline:3px solid color-mix(in srgb,var(--brand-accent) 45%,transparent);outline-offset:1px}.currency-row{display:flex;align-items:center;gap:.6rem;justify-content:flex-end;flex-wrap:wrap}.currency-row.align-end{grid-column:1 / -1}.currency-row label{font-weight:700}.currency-row select{border:2px solid var(--brand-primary);border-radius:.5rem;background:#ffffffe6;color:var(--brand-primary);font-weight:800;min-height:2.6rem;padding:.35rem .6rem;font-size:1rem;min-width:5.2rem;touch-action:manipulation}.result-section{display:grid;gap:clamp(.75rem,1.4vw,1rem)}.customer-layout{grid-template-columns:repeat(3,minmax(0,1fr))}.ecommerce-layout{grid-template-columns:repeat(2,minmax(0,1fr))}.result-card{background:var(--panel);border:2px solid var(--line);border-radius:1rem;box-shadow:var(--shadow);padding:clamp(.8rem,1.6vw,1.15rem);text-align:center;display:grid;justify-items:center;align-content:center;gap:.45rem;min-height:13rem}.result-icon{font-size:clamp(3rem,8vw,6rem);color:var(--brand-soft);line-height:1}.result-icon .fa-solid{display:inline-block}.result-value{margin:0;color:var(--brand-accent);font-size:clamp(2rem,5vw,4rem);font-weight:900;letter-spacing:-.03em}.result-label{margin:0;color:var(--brand-primary);font-weight:800;font-size:clamp(1.35rem,2.9vw,1.65rem)}.result-subline{margin:0;font-size:1rem;color:color-mix(in srgb,var(--brand-ink) 65%,#ffffff)}.gauge-card{padding:.5rem}.gauge-widget{width:100%;display:grid;justify-items:center}.gauge-svg{width:min(27rem,100%);height:auto}.gauge-base,.gauge-fill{fill:none;stroke-width:20;stroke-linecap:round}.gauge-base{stroke:color-mix(in srgb,var(--brand-soft) 82%,#ffffff)}.gauge-fill{stroke-dasharray:430}.gauge-tick{stroke:color-mix(in srgb,var(--brand-soft) 45%,#ffffff);stroke-width:2}.gauge-needle{stroke-width:8;stroke-linecap:round;transform-origin:180px 180px;transition:transform .3s ease}.gauge-cap{stroke:var(--brand-primary);stroke-width:2}.gauge-metric,.gauge-cost{margin:0;font-weight:900}.gauge-metric{color:var(--brand-accent);font-size:2rem}.gauge-cost{color:var(--brand-primary);font-size:1.5rem}.gauge-widget span{font-size:.95rem;font-weight:700}.roi-footnotes{display:flex;justify-content:space-between;gap:1rem;color:var(--brand-primary);font-style:italic;font-weight:600;font-size:clamp(.86rem,1.3vw,1rem)}.help-trigger{position:fixed;right:max(.9rem,env(safe-area-inset-right));bottom:max(.9rem,env(safe-area-inset-bottom));width:3rem;height:3rem;border-radius:999px;border:0;background:var(--brand-primary);color:#fff;font-size:1.4rem;font-weight:800;cursor:pointer;box-shadow:var(--shadow)}.help-trigger:hover{transform:translateY(-1px)}.help-modal{position:fixed;inset:0;background:#10131c7a;opacity:0;pointer-events:none;transition:opacity .2s ease;display:grid;place-items:center;padding:1rem;z-index:10}.help-modal.is-open{opacity:1;pointer-events:auto}.help-dialog{width:min(72rem,100%);max-height:86vh;overflow:auto;border:2px solid var(--brand-primary);border-radius:.8rem;background:#f7f8fb;box-shadow:var(--shadow)}.help-dialog-head{display:flex;align-items:center;justify-content:space-between;gap:.8rem;padding:.9rem 1rem;border-bottom:2px solid var(--line)}.help-dialog-head h2{margin:0;font-size:1.25rem}.help-close{border:2px solid var(--brand-primary);border-radius:.45rem;padding:.35rem .65rem;font-weight:700;color:var(--brand-primary);background:#fffc;cursor:pointer}.help-dialog-body{padding:1rem;display:grid;gap:1rem}.help-card{border:2px solid var(--line);border-radius:.65rem;background:#fff;padding:.9rem;display:grid;gap:.65rem}.help-card h3{margin:0;color:var(--brand-primary);font-size:1.1rem}.help-equation{display:flex;flex-wrap:wrap;align-items:center;gap:.45rem .55rem;padding:.55rem .65rem;border:1px solid color-mix(in srgb,var(--brand-primary) 30%,#ffffff);border-radius:.5rem;background:color-mix(in srgb,var(--brand-soft) 20%,#ffffff)}.help-term{display:inline-grid;justify-items:center;align-items:center;gap:.15rem;min-width:7.6rem;color:var(--brand-ink)}.help-term i{color:var(--brand-primary);font-size:1.2rem}.help-term small{font-size:.73rem;font-weight:700;line-height:1.2;text-align:center}.help-op{font-size:1.1rem;font-weight:900;color:var(--brand-primary)}.help-formula,.help-example,.help-note{margin:0;line-height:1.4}.help-formula{font-weight:700}.help-note{color:color-mix(in srgb,var(--brand-ink) 65%,#ffffff);font-size:.94rem}@keyframes intro-fade{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@media(max-width:1040px){.two-column,.customer-layout,.ecommerce-layout,.field{grid-template-columns:1fr}.roi-header{flex-direction:column;align-items:flex-start}.roi-footnotes{flex-direction:column}.currency-row{justify-content:flex-start}}@media(max-width:760px){.roi-app{background-size:16px 16px}.field{gap:.45rem}.field input{min-height:2.85rem}.gauge-metric{font-size:1.65rem}.gauge-cost{font-size:1.25rem}.result-card{min-height:11rem}.result-subline{font-size:.95rem}.help-dialog{max-height:90vh}.help-term{min-width:6.6rem}.help-term small{font-size:.68rem}}@media(max-width:520px){.roi-header h1{font-size:1.5rem}.result-value{font-size:clamp(1.7rem,10vw,2.4rem)}.result-label{font-size:1.25rem}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}