#renovation-budget { margin: 2.5rem 0; padding: 2rem 0; border-block: 2px solid #1a3a2a; color: #24352c; font: 1rem/1.6 var(--body, system-ui, sans-serif); letter-spacing: 0; overflow-wrap: anywhere; scroll-margin-top: 7rem; }
#renovation-budget *, #renovation-budget *::before, #renovation-budget *::after { box-sizing: border-box; letter-spacing: 0; }
#renovation-budget [hidden] { display: none !important; }
#renovation-budget h2 { font: 600 1.8rem/1.2 var(--display, Georgia, serif); color: #1a3a2a; margin: 0 0 1rem; }
#renovation-budget h3 { font: 600 1.2rem/1.35 var(--body, system-ui, sans-serif); margin: 0 0 .75rem; color: #1a3a2a; }
#renovation-budget p { margin: 0 0 1rem; }
#renovation-budget .rb-eyebrow { font-weight: 600; margin-bottom: .4rem; }
#renovation-budget .rb-note, #renovation-budget .rb-meta, #renovation-budget .rb-publisher { font-size: .9rem; color: #46544e; }
#renovation-budget .rb-actions { display: flex; flex-wrap: wrap; gap: .65rem; margin: 1.25rem 0; }
#renovation-budget button { min-height: 44px; padding: .65rem .9rem; border: 1px solid #1a3a2a; border-radius: 4px; background: #fff; color: #1a3a2a; font: inherit; font-weight: 600; cursor: pointer; white-space: normal; overflow-wrap: anywhere; max-width: 100%; }
#renovation-budget button:hover { background: #eaf1ed; }
#renovation-budget button:disabled { cursor: wait; opacity: .65; }
#renovation-budget :is(button,input,a):focus-visible { outline: 3px solid #8a5513; outline-offset: 3px; }
#renovation-budget :is(button,input,.rb-results) { scroll-margin-block: 7rem 8rem; }
#renovation-budget .rb-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 1.5rem; align-items: start; margin-top: 1.5rem; }
#renovation-budget fieldset { min-width: 0; margin: 0 0 1.5rem; padding: 0; border: 0; }
#renovation-budget legend { font-size: 1.15rem; font-weight: 600; margin-bottom: 1rem; width: 100%; }
#renovation-budget .rb-field { margin-bottom: 1rem; }
#renovation-budget label { display: block; font-weight: 600; }
#renovation-budget .rb-field p { font-size: .9rem; margin: .2rem 0 .5rem; }
#renovation-budget input { display: block; width: 100%; min-width: 0; min-height: 48px; padding: .65rem .7rem; font: inherit; font-variant-numeric: tabular-nums; background: #fff; color: #182c22; border: 1px solid #62776c; border-radius: 4px; }
#renovation-budget input[aria-invalid="true"] { border: 2px solid #a22e24; }
#renovation-budget .rb-error { display: block; color: #96291f; font-size: .9rem; margin-top: .3rem; }
#renovation-budget .rb-error:empty { display: none; }
#renovation-budget .rb-results { border-top: 3px solid #1a3a2a; padding: 1rem; background: #edf3f0; min-width: 0; }
#renovation-budget .rb-status { font-weight: 600; }
#renovation-budget dl { margin: 0 0 1rem; }
#renovation-budget .rb-results dl > div { border-bottom: 1px solid #b3c6bc; padding: .7rem 0; }
#renovation-budget dt { font-weight: 600; }
#renovation-budget dd { margin: .25rem 0 0; font-variant-numeric: tabular-nums; }
#renovation-budget .rb-results dd { font-size: 1.2rem; font-weight: 600; }
#renovation-budget .rb-results .rb-gap { border-block: 2px solid #1a3a2a; }
#renovation-budget .rb-gap dd { font-size: 1.5rem; }
#renovation-budget .rb-warning { border-left: 3px solid #a22e24; padding-left: .8rem; color: #79291f; }
#renovation-budget :is(.rb-method,.rb-alternatives,.rb-questions) { margin-top: 1.5rem; padding-top: 1.5rem; border-top: 1px solid #b3c6bc; }
#renovation-budget .rb-alternatives dl > div { margin-bottom: 1rem; }
#renovation-budget ul { padding-left: 1.3rem; margin: 0 0 1rem; }
#renovation-budget li { margin-bottom: .7rem; }
#renovation-budget a { color: #1a5140; text-decoration: underline; text-underline-offset: 3px; }
#renovation-budget .rb-print-value { display: block; padding: .4rem 0; border-bottom: 1px solid #62776c; font-weight: 600; }
@media (max-width: 760px) {
  #renovation-budget .rb-layout { grid-template-columns: minmax(0, 1fr); }
  #renovation-budget .rb-results { padding: 1rem .8rem; }
}
@media print {
  #renovation-budget { margin: 0; padding: 0; border: 0; color: #000; font: 11pt/1.4 Arial, sans-serif; }
  #renovation-budget h2 { font-size: 18pt; }
  #renovation-budget h3, #renovation-budget legend { font-size: 13pt; break-after: avoid; }
  #renovation-budget p { margin-bottom: .6rem; orphans: 3; widows: 3; }
  #renovation-budget .rb-field { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: .15rem .75rem; margin-bottom: .65rem; padding-bottom: .4rem; border-bottom: 1px solid #b3c6bc; }
  #renovation-budget .rb-field label { grid-area: 1 / 1; }
  #renovation-budget .rb-field p { grid-column: 1 / -1; grid-row: 2; margin: 0; font-size: 10pt; }
  #renovation-budget .rb-field :is(.rb-print-value,input) { grid-area: 1 / 2; padding: 0; margin: 0; border: 0; min-height: 0; text-align: right; }
  #renovation-budget .rb-field .rb-error { grid-column: 1 / -1; grid-row: 3; }
  #renovation-budget .rb-actions { display: none; }
  #renovation-budget .rb-layout { display: block; }
  #renovation-budget :is(.rb-field, .rb-results dl > div, .rb-alternatives dl > div, li) { break-inside: avoid; }
  #renovation-budget .rb-results { background: #fff; padding: .6rem 0; break-inside: avoid; }
  #renovation-budget .rb-results dl > div { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: .7rem; padding: .45rem 0; }
  #renovation-budget .rb-results dd { text-align: right; margin: 0; }
  #renovation-budget .rb-questions p { break-inside: avoid; }
  #renovation-budget :is(.rb-results dd,.rb-gap dd) { font-size: 12pt; }
  #renovation-budget a { color: #000; }
  #renovation-budget a[href^="https://www.consumerfinance.gov/"]::after { content: " (" attr(href) ")"; font-size: 9pt; }
  #renovation-budget :is(.rb-note,.rb-meta,.rb-publisher) { color: #000; font-size: 10pt; }
}
