:root{--paper:#fff7ea;--ink:#1c1816;--muted:#6d5d52;--line:#d9c5ad;--accent-primary:#168a72;--accent-support:#c9973d;--accent:var(--accent-primary);--mint:#d9eee0;--gold:var(--accent-support);color:var(--ink);background:var(--paper);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{min-width:320px;margin:0}a,button{font:inherit}img{max-width:100%;display:block}::selection{color:var(--paper);background:var(--accent)}.page-shell{background:linear-gradient(180deg, #fffdf8eb, #fff7ea), var(--paper);grid-template-rows:auto minmax(0,1fr) auto;height:100svh;display:grid;overflow:hidden}.app-topbar,.flow-controls{z-index:2;width:min(1180px,100%);margin:0 auto;padding:18px 24px;position:relative}.app-topbar{justify-content:space-between;align-items:center;gap:18px;display:flex}.eyebrow,.step-label{color:var(--accent-primary);letter-spacing:0;text-transform:uppercase;margin:0;font-size:.78rem;font-weight:900}.progress-dots{gap:8px;display:flex}.progress-dots span{background:#168a7238;border-radius:999px;width:8px;height:8px;transition:width .18s,background .18s}.progress-dots .active{background:var(--accent-primary);width:26px}.step-stage{will-change:transform;min-width:100%;transition:transform .32s cubic-bezier(.22,1,.36,1);display:flex}.flow-step{place-items:center;min-width:100%;height:100%;padding:22px 24px;display:grid;overflow-y:auto}.flow-step-dark{color:var(--paper);background:linear-gradient(180deg, #fffaf009, transparent 34%), var(--ink)}.step-content{gap:20px;width:min(760px,100%);animation:.26s both step-in;display:grid}.step-content-wide{width:min(980px,100%)}h1,h2,h3,p{margin:0}h1,h2,h3{color:var(--ink);letter-spacing:0}.flow-step-dark h1,.flow-step-dark h2,.flow-step-dark h3{color:var(--paper)}h1{font-size:clamp(3.5rem,10vw,7rem);line-height:.92}h2{font-size:clamp(2.6rem,7vw,5.2rem);line-height:.94}.intro-copy{max-width:620px;color:var(--muted);font-size:clamp(1.05rem,1.8vw,1.22rem);line-height:1.45}.flow-step-dark .intro-copy{color:#fffaf0bd}.leak-picker{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;display:grid}.leak-option{min-height:188px;color:var(--ink);text-align:left;cursor:pointer;background:#fffbf5e6;border:1px solid #7e5b3e57;border-radius:8px;align-content:space-between;justify-items:start;padding:18px;transition:transform .18s,border-color .18s,background .18s,box-shadow .18s;display:grid;position:relative;box-shadow:inset 0 1px #ffffffb3,0 16px 34px #37221614}.category-icon{width:46px;height:46px;color:var(--accent-primary);background:#168a7214;border:1px solid #168a7238;border-radius:999px;place-items:center;display:inline-grid}.category-icon svg{fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:2.4px;width:28px;height:28px}.category-icon-large{width:58px;height:58px}.category-icon-large svg{width:34px;height:34px}.leak-option:after{content:"Choose";color:var(--accent-primary);text-transform:uppercase;border:1px solid #168a7261;border-radius:999px;place-self:end;padding:5px 9px;font-size:.72rem;font-weight:900;line-height:1}.leak-option:hover{background:#fffdf8;border-color:#168a72ad;transform:translateY(-2px)}.leak-option:focus-visible,.flow-controls button:focus-visible,.primary-link:focus-visible{outline-offset:3px;outline:3px solid #168a723d}.leak-option[aria-selected=true]{color:var(--paper);border-color:var(--accent-primary);background:linear-gradient(135deg, #c9973d29, transparent 32%), linear-gradient(160deg, #168a728f, transparent 58%), var(--ink);box-shadow:inset 0 0 0 2px #168a72b3,inset 0 1px #fff7ea29,0 18px 44px #37221638}.leak-option[aria-selected=true]:after{content:"Selected";color:#8ed9c7;background:#8ed9c71a;border-color:#8ed9c757}.leak-option span{color:var(--accent-primary);text-transform:uppercase;font-size:.78rem;font-weight:900}.leak-option>.category-icon{margin-bottom:14px}.leak-option[aria-selected=true] .category-icon{color:#8ed9c7;background:#8ed9c71a;border-color:#8ed9c74d}.leak-option[aria-selected=true]>span:not(.category-icon){color:#8ed9c7}.leak-option strong{max-width:100%;font-size:clamp(2rem,3.2vw,3.2rem);line-height:.98}.step-title-row{align-items:center;gap:14px;display:flex}.input-stack{gap:14px;display:grid}.money-input{background:#fffaf4d1;border:1px solid #7e5b3e42;border-radius:8px;gap:18px;padding:18px;display:grid;box-shadow:inset 0 1px #ffffffb8,0 14px 30px #37221612}.money-input>span:first-child{gap:8px;display:grid}.money-input strong{color:var(--ink);font-size:1.08rem;line-height:1.18}.money-input small{color:var(--muted);font-size:.92rem;line-height:1.4}.input-wrap{background:#fffdf8;border:1px solid #1c1816b8;border-radius:8px;align-items:center;min-width:0;min-height:58px;display:flex;box-shadow:inset 0 1px #ffffffd9,0 8px 18px #3722160f}.input-affix{color:var(--muted);white-space:nowrap;flex:none;padding-inline:12px;font-size:.9rem;font-weight:900}.input-wrap input{width:0;min-width:0;color:var(--ink);font:inherit;appearance:textfield;background:0 0;border:0;outline:0;flex:auto;padding:0 6px;font-size:1.45rem;font-weight:900}.input-wrap input::-webkit-outer-spin-button{display:none}.input-wrap input::-webkit-inner-spin-button{display:none}.input-wrap:focus-within{border-color:var(--accent-primary);box-shadow:0 0 0 3px #168a7233,0 10px 22px #3722161a}.result-step,.result-label,.reaction-copy span,.long-term-card>span,.easy-save-card strong{color:#8ed9c7}.result-focus{gap:18px;display:grid}.monthly-result{flex-wrap:wrap;align-items:baseline;gap:10px 18px;display:flex}.monthly-result strong{color:var(--paper);font-size:clamp(5rem,15vw,10rem);line-height:.78}.monthly-result span{color:#fffaf0b8;font-size:clamp(1.15rem,2vw,1.45rem);font-weight:850}.flow-step-dark p{color:#fffaf0c7;font-size:1.08rem;line-height:1.45}.result-label{text-transform:uppercase;font-size:.8rem;font-weight:900}.reaction-copy{border-left:3px solid var(--accent-primary);gap:8px;padding:2px 0 2px 14px;display:grid}.reaction-copy span{text-transform:uppercase;font-size:.76rem;font-weight:900}.result-split,.long-term-grid,.easy-save-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;display:grid}.result-split div,.long-term-card,.easy-save-card{background:#fffaf00f;border:1px solid #fffaf02e;border-radius:8px;gap:8px;min-width:0;padding:16px;display:grid}.result-split b,.long-term-card strong{color:var(--paper);white-space:nowrap;font-variant-numeric:tabular-nums;font-size:clamp(1.8rem,5vw,3rem);line-height:.95}.result-split span,.long-term-card span,.long-term-card small{text-transform:uppercase;font-size:.78rem;font-weight:900}.long-term-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.long-term-card{min-height:160px}.long-term-card p,.delivery-note{color:#fffaf0bd;font-size:.98rem;line-height:1.35}.benchmark-panel{background:#fffaf00e;border:1px solid #fffaf029;border-radius:8px;gap:14px;padding:clamp(16px,4vw,24px);display:grid}.benchmark-heading{justify-content:space-between;align-items:baseline;gap:14px;display:flex}.benchmark-heading span{color:#fffaf0a8;text-transform:uppercase;font-size:.78rem;font-weight:900}.benchmark-heading strong{color:#8ed9c7;text-transform:uppercase;font-size:clamp(1.4rem,5vw,2.5rem);line-height:1}.benchmark-chart{background:#fffaf008;border:1px solid #fffaf01a;border-radius:8px;width:100%;min-height:clamp(72px,16vw,120px);display:flex;position:relative;overflow:hidden}.benchmark-band{color:#fffaf0b8;text-align:center;text-transform:uppercase;justify-content:center;align-items:end;padding:0 6px 12px;font-size:clamp(.62rem,1.8vw,.78rem);font-weight:900;display:flex}.benchmark-band-low{background:#8ed9c71f}.benchmark-band-average{background:#8ed9c733}.benchmark-band-high{background:#c9973d33}.benchmark-band-extreme{background:#c9973d57}.benchmark-marker{background:#8ed9c7e6;width:1px;position:absolute;top:0;bottom:0;transform:translate(-.5px)}.benchmark-marker:before{content:"";background:#8ed9c7;border-radius:50%;width:9px;height:9px;position:absolute;top:0;left:50%;transform:translate(-50%,-1px)}.benchmark-panel p{color:#fffaf0c7}.easy-save-list{grid-template-columns:repeat(3,minmax(0,1fr))}.easy-save-card{background:#168a721a;border-color:#168a7257;align-content:space-between;min-height:150px}.easy-save-card p{color:#fffaf0db;font-weight:850}.primary-link,.flow-controls button{border:1px solid var(--accent-primary);min-height:48px;color:var(--paper);background:var(--accent-primary);font:inherit;cursor:pointer;border-radius:8px;justify-content:center;align-items:center;padding:0 18px;font-weight:900;text-decoration:none;display:inline-flex}.flow-controls{grid-template-columns:100px minmax(0,1fr) 100px;align-items:center;gap:12px;display:grid}.flow-controls span{color:var(--muted);text-align:center;text-transform:uppercase;font-size:.82rem;font-weight:900}.flow-controls button:disabled{cursor:not-allowed;opacity:.34}.flow-controls button:first-child{color:var(--ink);background:#fffdf8d1;border-color:#7e5b3e52}@media (width<=760px){.app-topbar,.flow-controls{padding-inline:16px}.flow-step{align-items:start;padding:18px 16px}.step-content{align-self:center}h1{font-size:clamp(3.2rem,18vw,5rem)}.leak-picker,.result-split,.long-term-grid,.easy-save-list{grid-template-columns:1fr}.leak-option{grid-template-columns:auto minmax(0,1fr) auto;align-content:center;align-items:center;gap:8px 14px;min-height:112px;padding:16px}.leak-option>.category-icon{grid-row:span 2;margin-bottom:0}.leak-option:after{grid-row:span 2;align-self:center}.long-term-card,.easy-save-card{min-height:auto}.flow-controls{grid-template-columns:82px minmax(0,1fr) 82px}.flow-controls button{min-height:44px;padding-inline:12px}}@keyframes step-in{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
