/* Bright, welcoming LoanLuma theme. All tool surfaces use semantic color tokens. */
html[data-vector="true"]{color-scheme:light;--color-base-100:#fffaf2;--color-base-200:#ffffff;--color-base-300:#fff0df;--color-base-content:#49352e;--color-primary:#bb4826;--color-primary-content:#ffffff;--color-secondary:#a23e23;--color-secondary-content:#ffffff;--color-success:#bb4826;--color-success-content:#ffffff;--color-warning:#874115;--accent:var(--color-primary)!important;--accent-content:var(--color-primary-content)!important;--line:color-mix(in srgb,var(--color-base-content) 16%,transparent)}
html[data-vector="true"] body{background-image:radial-gradient(ellipse at 85% 0%,color-mix(in srgb,var(--accent) 8%,transparent),transparent 50%)}
.finance-shell{max-width:1180px}.finance-shell .muted{color:color-mix(in srgb,var(--color-base-content) 76%,transparent)}
.finance-shell header{height:92px}.finance-shell .brand-mark{background:var(--accent);color:var(--accent-content);border-radius:12px;box-shadow:none}.brand-caption{font-size:9px;letter-spacing:1.6px;font-weight:500;border-left:1px solid var(--line);padding-left:14px;margin-left:5px}.currency-label{display:flex;align-items:center;gap:10px;font-size:11px}.currency-label .select{width:92px;min-height:40px}.finance-shell .intro{padding:20px 0 27px}.finance-shell h1{font-size:clamp(32px,4.3vw,51px);font-weight:600;letter-spacing:-2px}.finance-shell h1 em{font-family:Georgia,serif;font-weight:400;font-style:italic}.finance-shell .dot{box-shadow:none}.trust-note{display:flex;align-items:center;gap:12px;font-size:12px;padding-bottom:6px}.trust-note>span{font-size:30px;color:var(--accent)}.trust-note small{display:block;font-size:10px;margin-top:5px}.tool-nav{display:flex;gap:7px;flex-wrap:wrap;border-bottom:1px solid var(--line);padding-bottom:17px}.tool-nav .btn{border:0;font-size:13px}.tool-nav .selected{background:var(--accent);color:var(--accent-content)}.finance-heading{padding:23px 0 17px;display:flex;gap:18px;align-items:baseline;flex-wrap:wrap}.finance-heading h2{font-size:19px;margin:0;font-weight:650;letter-spacing:-.3px}.finance-heading p{font-size:12px;margin:0}.finance-layout{display:grid;grid-template-columns:minmax(280px,.9fr) minmax(0,1.35fr);gap:22px;align-items:start}.finance-shell .panel{box-shadow:0 8px 30px color-mix(in srgb,var(--accent) 3%,transparent)}.finance-shell .field{font-size:12px;gap:9px;font-weight:550}.finance-shell .input{height:47px;font-size:16px;font-variant-numeric:tabular-nums;background:var(--color-base-100)}.finance-shell .tiny{font-size:11px}.finance-shell .panel-head{min-height:57px}.hero-result{padding:13px 0 23px}.hero-result>span{font-size:13px}.hero-result>strong{display:block;font-size:clamp(35px,4.6vw,55px);line-height:1.25;letter-spacing:-2px;color:var(--accent);margin:8px 0;font-weight:600;overflow-wrap:anywhere;font-variant-numeric:tabular-nums}.hero-result p{font-size:12px;margin:0}.finance-stats{display:grid;grid-template-columns:1fr 1fr;gap:22px 17px;padding:21px 0;border-top:1px solid var(--line)}.finance-stats span{font-size:11px;display:block}.finance-stats strong{display:block;font-size:19px;margin-top:6px;letter-spacing:-.5px;overflow-wrap:anywhere;font-variant-numeric:tabular-nums}.cost-chart{height:12px;border-radius:20px;overflow:hidden;display:flex;margin-top:14px}.cost-chart>div:first-child{background:var(--accent)}.cost-chart>div:last-child{background:color-mix(in srgb,var(--accent) 28%,var(--color-base-100))}.chart-legend{display:flex;justify-content:space-between;gap:10px;font-size:10px;margin-top:10px}.chart-legend span:last-child{color:color-mix(in srgb,var(--accent) 70%,var(--color-base-content))}.insight{padding:17px 18px;margin-top:24px;background:color-mix(in srgb,var(--accent) 7%,var(--color-base-100));border-radius:12px;font-size:12px;line-height:1.7;border-left:3px solid var(--accent)}.offer-fields{border-top:1px solid var(--line);padding-top:12px;display:grid;gap:12px}.offer-fields h3{font-size:13px;margin:0}.comparison{display:grid;grid-template-columns:1fr 1fr;gap:13px}.offer-card{padding:17px;border:1px solid var(--line);border-radius:12px}.offer-card.best{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 4%,var(--color-base-200))}.offer-card>strong{display:block;font-size:26px;margin:13px 0;overflow-wrap:anywhere}.offer-card>strong small{font-size:10px;font-weight:400;display:block;margin-top:4px}.offer-card .finance-stats{grid-template-columns:1fr;gap:14px}.offer-card .finance-stats strong{font-size:16px}.result-actions{padding:18px 0;align-items:center}.schedule summary,.explanation summary{padding:19px 22px;font-size:12px;cursor:pointer;font-weight:600}.schedule-scroll{max-height:360px;overflow:auto}.schedule .table{font-size:12px;white-space:nowrap}.schedule th{position:sticky;top:0;background:var(--color-base-300);color:var(--color-base-content)}.explanation p{font-size:12px;margin:0 0 13px}.finance-shell .feature strong{font-size:12px}.finance-shell .feature p{font-size:11px}.finance-shell footer{font-size:11px}.validation{border-left:3px solid var(--color-warning);padding:18px;color:var(--color-warning)}.validation p{font-size:12px}.quick-extra{display:flex;gap:5px;flex-wrap:wrap}.quick-extra .btn{padding:7px 10px;font-size:11px;min-height:32px}#finance-message{font-size:12px;line-height:1.6;padding:12px 0;overflow-wrap:anywhere}.finance-shell #legacy-main header,.finance-shell #legacy-main .intro{display:none}
@media(max-width:800px){.finance-layout{grid-template-columns:1fr}.trust-note{display:none}.brand-caption{display:none}.finance-shell .intro{padding:9px 0 22px}.finance-shell h1{font-size:36px}.finance-layout .output-panel{min-height:0}.tool-nav{gap:3px}.tool-nav .btn{font-size:12px;padding:9px 11px}.finance-heading{gap:5px;display:block}.finance-heading p{margin-top:6px}.hero-result>strong{font-size:44px}.currency-label{font-size:0;gap:0}.finance-shell .intro .tag{display:flex;font-size:9px;letter-spacing:1.3px}.finance-shell .intro p{font-size:12px}}
@media(max-width:480px){.finance-shell header{height:73px}.finance-shell .grid2{grid-template-columns:1fr 1fr;gap:10px}.finance-shell .field{font-size:11px}.finance-shell .input{padding:10px;font-size:15px}.finance-shell .intro h1{font-size:33px}.finance-heading p{font-size:11px}.finance-layout{gap:16px}.comparison{gap:8px}.offer-card{padding:12px}.offer-card>strong{font-size:21px}.chart-legend{font-size:9px}.finance-shell .feature-row{margin:17px 0}}
.currency-label .select{font-size:12px}
.currency-control{position:relative}.currency-button{background:var(--color-base-200);white-space:nowrap}.currency-button [data-current-currency]{color:var(--accent);font-weight:750}.currency-options{position:absolute;top:calc(100% + 9px);right:0;width:260px;padding:16px;z-index:20;box-shadow:0 12px 35px color-mix(in srgb,var(--color-base-content) 15%,transparent)}.currency-options>strong{font-size:12px}.currency-options>div{display:grid;gap:4px;margin-top:10px}.currency-options .btn{justify-content:flex-start;width:100%;gap:13px;font-size:12px}.currency-options .btn b{width:34px}.currency-options .btn[aria-pressed="true"]{background:var(--accent);color:var(--accent-content)}.currency-options p{margin:12px 0 0;font-size:10px}@media(max-width:480px){.currency-button{padding:9px 10px;font-size:11px;gap:6px}.finance-shell header{gap:8px}.finance-shell .brand{gap:8px;font-size:18px}}
.finance-shell .brand-logo{display:block;width:218px;height:auto;flex-shrink:0}.finance-shell .brand{gap:12px}.finance-shell .brand-caption{letter-spacing:1.1px}@media(max-width:480px){.finance-shell .brand-logo{width:168px}.currency-button{padding:8px;font-size:10px;gap:4px}}@media(max-width:360px){.finance-shell header{flex-wrap:wrap;height:auto;min-height:85px;padding:12px 0;gap:10px}.finance-shell .brand-logo{width:155px}}

/* Sunshine accents with darker coral text/buttons for readable contrast. */
.visualization{border-top:1px solid var(--line);padding:22px 0 5px;margin-top:12px}
.visualization h3{font-size:13px;font-weight:650;margin:0 0 14px;letter-spacing:-.1px}
.donut-layout{display:grid;grid-template-columns:160px minmax(0,1fr);align-items:center;gap:18px}
.donut-svg{width:160px;max-width:100%;height:auto}.donut-label{font-size:8px;letter-spacing:1px;fill:var(--color-base-content)}.donut-sub{font-size:19px;font-weight:650;fill:var(--color-primary)}
.visual-legend{display:grid;gap:17px}.visual-legend>div{display:grid;grid-template-columns:9px minmax(0,1fr) auto;align-items:center;gap:9px;font-size:11px}.visual-legend small{display:block;font-size:10px;color:var(--color-base-content);opacity:.75;margin-top:3px}.visual-legend strong{font-size:12px;font-variant-numeric:tabular-nums;overflow-wrap:anywhere;min-width:0}.legend-dot{display:inline-block;width:9px;height:9px;border-radius:50%;flex-shrink:0}
.trend-chart svg{display:block;width:100%;height:auto;margin:10px 0}.trend-scale{display:flex;justify-content:space-between;gap:8px;font-size:10px;opacity:.8}.series-legend{display:flex;gap:18px;flex-wrap:wrap;margin-top:13px;font-size:10px}.series-legend>span{display:flex;align-items:center;gap:7px}
.cost-bar-row{margin:18px 0}.cost-bar-row>div:first-child{display:flex;justify-content:space-between;gap:10px;font-size:12px;margin-bottom:9px}.cost-bar-track{background:var(--color-base-300);height:14px;border-radius:8px;overflow:hidden}.cost-bar-track>span{display:block;height:100%;border-radius:8px}
.finance-shell .brand-logo{width:218px;border-radius:6px}.finance-shell .intro{background:radial-gradient(ellipse at 95% 20%,#ffdf861c,transparent 65%)}
@media(max-width:480px){.donut-layout{grid-template-columns:125px minmax(0,1fr);gap:12px}.donut-svg{width:125px}.visual-legend>div{grid-template-columns:8px minmax(0,1fr);gap:7px}.visual-legend strong{grid-column:2}.visual-legend{gap:10px}.finance-shell .brand-logo{width:160px}}
@media(prefers-reduced-motion:reduce){.btn{transition:none}}
.loan-type-heading{display:flex;justify-content:space-between;align-items:center;gap:15px;padding:25px 0 16px}.loan-type-heading h2{font-size:21px;font-weight:600;letter-spacing:-.5px;margin:8px 0 0}.loan-type-heading .eyebrow{font-size:9px}.loan-type-heading .pill{font-size:9px;white-space:nowrap}.loan-type-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.loan-type-grid .btn{background:var(--color-base-200);border:1px solid var(--line);font-size:12px;min-height:43px}.loan-type-grid .selected{background:var(--accent);color:var(--accent-content);border-color:var(--accent)}.hub-input-details{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:13px 0}.hub-input-details summary{cursor:pointer;font-size:12px;font-weight:600}.hub-input-details .stack{padding-top:15px}.field small{font-size:10px;font-weight:400;line-height:1.6}.stack.grid2{display:grid}.loan-type-grid .btn:focus-visible{outline:2px solid var(--accent);outline-offset:3px}#hub-message{padding:12px 0;overflow-wrap:anywhere}#hub-message textarea{width:100%;margin-top:8px}.loan-type-grid~.explanation{margin-top:18px}
@media(max-width:600px){.loan-type-heading{align-items:start}.loan-type-heading .pill{display:none}.loan-type-heading h2{font-size:20px}.loan-type-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}.loan-type-grid .btn{font-size:12px;min-height:40px}.loan-type-heading .eyebrow{font-size:8px}}
/* Keep inputs aligned even when only one field has a help note. */
.finance-shell .field{align-content:start;min-width:0}
.finance-shell .grid2{align-items:start}
.finance-shell .grid2 .field-label{min-height:3em;line-height:1.5;display:flex;align-items:flex-end}
.currency-button{align-items:center;line-height:1.3}
.currency-chevron{display:block;flex:none;align-self:center;width:16px;height:16px}
.currency-button[aria-expanded="true"] .currency-chevron{transform:rotate(180deg)}
.workflow-inputs{display:grid;grid-template-columns:minmax(0,1fr);gap:20px}
.workflow-inputs.two-offers{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}
.workflow-results{margin-top:20px}
.workflow-donuts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.workflow-results .offer-card .finance-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
.workflow-inputs:not(.two-offers){max-width:650px}
#work-message{padding:12px 0;overflow-wrap:anywhere}
#work-message textarea{width:100%;margin-top:8px}
@media(max-width:800px){.workflow-inputs.two-offers,.workflow-donuts{grid-template-columns:1fr}.workflow-inputs:not(.two-offers){max-width:none}}
@media(max-width:480px){.workflow-results .comparison{grid-template-columns:1fr}.workflow-results .offer-card .finance-stats{gap:16px}}
.workflow-payoff-layout{display:grid;grid-template-columns:minmax(280px,.9fr) minmax(0,1.35fr);gap:22px;align-items:start}
.workflow-payoff-layout .workflow-results{margin-top:0}
@media(max-width:800px){.workflow-payoff-layout{grid-template-columns:minmax(0,1fr)}}
.finance-shell .brand-caption{font-size:12px;letter-spacing:0;line-height:1.5;font-weight:500;max-width:230px;text-transform:none}
