.cbcalc, .cbcalc-preview { color: #172737; font: 16px/1.6 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
.cbcalc { --cb-ink: #172737; --cb-steel: #405e72; --cb-red: #983c32; background: #fffdf8; border: 1px solid #c3c9cb; padding: clamp(16px, 3vw, 36px); max-width: 1100px; margin: 24px auto; }
.cbcalc *, .cbcalc-preview * { box-sizing: border-box; }
.cbcalc [hidden] { display: none !important; }
.cbcalc h2, .cbcalc h3 { font-family: Georgia, "Times New Roman", serif; line-height: 1.2; color: var(--cb-ink); }
.cbcalc h2 { margin: 0 0 16px; font-size: clamp(26px, 4vw, 36px); }
.cbcalc h3 { font-size: 23px; }
.cbcalc p { margin: 12px 0 20px; }
.cbcalc .cbcalc-lead { max-width: 75ch; }
.cbcalc fieldset { min-width: 0; margin: 18px 0; border: 1px solid #bcc7cb; padding: 18px; }
.cbcalc legend { padding: 0 8px; font-weight: 750; font-size: 18px; }
.cbcalc .cbcalc-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.cbcalc .cbcalc-field { display: flex; flex-direction: column; margin-bottom: 17px; min-width: 0; }
.cbcalc label { font-weight: 650; display: block; }
.cbcalc input[type="text"], .cbcalc textarea { width: 100%; min-width: 0; border: 1px solid #6a7d87; border-radius: 0; padding: 11px 12px; background: #fff; color: #172737; font: inherit; }
.cbcalc input[type="text"] { margin: 6px 0; min-height: 48px; }
.cbcalc input[type="radio"] { accent-color: #172737; width: 19px; height: 19px; vertical-align: middle; margin-right: 8px; }
.cbcalc small, .cbcalc .cbcalc-hint { color: #405360; font-size: 14px; }
.cbcalc .cbcalc-error { color: #8a251e; font-size: 14px; font-weight: 650; }
.cbcalc [aria-invalid="true"] { border: 2px solid #983c32; }
.cbcalc .cbcalc-mode, .cbcalc .cbcalc-actions, .cbcalc .cbcalc-scenarios { display: flex; flex-wrap: wrap; gap: 12px; }
.cbcalc .cbcalc-mode label { padding: 6px 12px 6px 0; }
.cbcalc button { font: inherit; font-weight: 650; min-height: 46px; padding: 10px 18px; border: 1px solid #405e72; background: #fffdf8; color: #172737; cursor: pointer; border-radius: 0; }
.cbcalc button:hover:enabled { background: #e6edf0; }
.cbcalc button.cbcalc-primary, .cbcalc button[aria-pressed="true"] { background: #172737; color: #fffdf8; }
.cbcalc button:disabled { color: #56636c; background: #e9e9e5; border-color: #9ba5a9; cursor: default; }
.cbcalc :focus-visible { outline: 3px solid #983c32; outline-offset: 4px; }
.cbcalc .cbcalc-results:focus, .cbcalc .cbcalc-errors:focus { outline: 3px solid #983c32; outline-offset: 4px; }
.cbcalc .cbcalc-results { margin-top: 30px; padding-top: 24px; border-top: 4px solid #405e72; }
.cbcalc .cbcalc-difference { font: bold clamp(25px, 4vw, 34px)/1.25 Georgia, serif; }
.cbcalc .cbcalc-period { color: #405360; }
.cbcalc .cbcalc-break-even { background: #e8eef0; padding: 16px; }
.cbcalc table { width: 100%; min-width: 0; border-collapse: collapse; table-layout: fixed; font-variant-numeric: tabular-nums; }
.cbcalc caption { text-align: left; font-weight: 700; padding-bottom: 12px; }
.cbcalc th, .cbcalc td { padding: 12px 10px; border-bottom: 1px solid #c3c9cb; text-align: right; overflow-wrap: anywhere; }
.cbcalc th:first-child { text-align: left; width: 44%; }
.cbcalc thead { background: #172737; color: #fffdf8; }
.cbcalc tbody th { font-weight: 550; }
.cbcalc tr[data-metric="totalCost"] { background: #e8eef0; font-weight: 750; }
.cbcalc .cbcalc-notes { margin-top: 28px; padding-top: 12px; border-top: 1px solid #bcc7cb; font-size: 14px; }
.cbcalc .cbcalc-errors { padding: 16px; border: 2px solid #983c32; background: #fff5f0; }
.cbcalc .cbcalc-errors a { color: #802c25; text-decoration: underline; overflow-wrap: anywhere; }
.cbcalc .cbcalc-status { min-height: 1.6em; font-size: 14px; }
.cbcalc-preview { margin: 0; background: #f2efe7; }
.cbcalc-preview .cbcalc-preview-header { background: #172737; color: #fffdf8; display: flex; justify-content: space-between; gap: 16px; padding: 24px max(20px, calc((100vw - 1100px) / 2)); font-size: 13px; letter-spacing: .08em; }
.cbcalc-preview .cbcalc-preview-header span:first-child { font: bold 24px Georgia, serif; }
.cbcalc-preview .cbcalc-preview-main { max-width: 1140px; margin: auto; padding: 40px 20px; }
.cbcalc-preview h1 { font: bold clamp(35px, 5vw, 58px)/1.1 Georgia, serif; max-width: 850px; margin: 16px 0; }
.cbcalc-preview .cbcalc-preview-kicker { color: #983c32; font-size: 12px; letter-spacing: .15em; font-weight: 750; }
.cbcalc-preview .cbcalc-preview-intro { max-width: 65ch; color: #405360; }
@media (max-width: 600px) {
  .cbcalc .cbcalc-grid { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .cbcalc fieldset { padding: 12px; }
  .cbcalc .cbcalc-actions button { flex: 1 1 100%; }
  .cbcalc th, .cbcalc td { padding: 9px 5px; font-size: 13px; }
  .cbcalc-preview .cbcalc-preview-main { padding: 24px 12px; }
  .cbcalc-preview .cbcalc-preview-header { flex-wrap: wrap; padding: 20px; }
}
@media (prefers-reduced-motion: reduce) {
  .cbcalc *, .cbcalc-preview * { scroll-behavior: auto !important; animation: none !important; transition: none !important; }
}
@media print {
  .cbcalc-preview { background: #fff; }
  .cbcalc-preview .cbcalc-preview-header { display: none; }
  .cbcalc-preview .cbcalc-preview-main { max-width: none; padding: 0; }
  .cbcalc { border: 0; padding: 0; margin: 10px 0; font-size: 10pt; color: #000; }
  .cbcalc .cbcalc-actions, .cbcalc .cbcalc-scenarios, .cbcalc .cbcalc-status, .cbcalc .cbcalc-copy-fallback, .cbcalc .cbcalc-errors { display: none !important; }
  .cbcalc fieldset { break-inside: avoid; padding: 8px; margin: 8px 0; }
  .cbcalc .cbcalc-field { margin-bottom: 5px; }
  .cbcalc input[type="text"] { min-height: 0; padding: 2px; margin: 0; }
  .cbcalc small { font-size: 8pt; }
  .cbcalc .cbcalc-results { outline: none; }
  .cbcalc tr { break-inside: avoid; }
  .cbcalc thead { display: table-header-group; color: #000; background: #eee; }
  .cbcalc th, .cbcalc td { padding: 5px; }
  .cbcalc .cbcalc-notes { font-size: 9pt; }
}
