.calculator-workspace { --workspace-bg: #fff; --workspace-ink: #171b21; --workspace-muted: #69727e; --workspace-line: #e1e4e8; --workspace-soft: #f6f7f8; }
.calculator-workspace .calculator-page__heading { max-width: 850px; margin-bottom: 1.6rem; }
.calculator-workspace .calculator-page__heading h1 { font-size: clamp(2rem, 4.2vw, 3.6rem); }
.calculator-workspace .calculator-page__heading > p:last-child { max-width: 720px; font-size: .95rem; line-height: 1.7; }
.calculator-workspace .calculator-form__legend { margin: 0 0 .75rem; }
.calculator-workspace .calculator-form { margin-top: 0; }
.calculator-workspace__layout { display: grid; grid-template-columns: minmax(0, 1fr) 310px; gap: 1.3rem; align-items: start; }
.calculator-workspace__editor { min-width: 0; padding: 1.6rem; border: 1px solid var(--workspace-line); border-radius: .8rem; background: var(--workspace-bg); }
.calculator-mobile-preview { display: none; }
.calculator-tabs { display: none; }
.calculator-workspace--ready .calculator-tabs { display: flex; gap: .7rem; margin-bottom: 1.6rem; border-bottom: 1px solid var(--workspace-line); }
.calculator-tabs button { display: flex; flex: 1; gap: .5rem; align-items: center; padding: .7rem 0 .85rem; border: 0; border-bottom: 2px solid transparent; background: transparent; color: var(--workspace-muted); font-size: .77rem; font-weight: 700; text-align: left; line-height: 1.4; }
.calculator-tabs button > span { display: grid; place-items: center; flex: 0 0 1.6rem; height: 1.6rem; border-radius: 50%; background: var(--workspace-soft); color: var(--workspace-muted); font-size: .7rem; }
.calculator-tabs button[aria-selected="true"] { border-bottom-color: var(--workspace-ink); color: var(--workspace-ink); }
.calculator-tabs button[aria-selected="true"] > span { background: var(--workspace-ink); color: var(--workspace-bg); }
.calculator-tabs button:hover { color: var(--workspace-ink); }
.calculator-workspace [data-calculator-panel][hidden], .calculator-workspace [hidden] { display: none !important; }
.calculator-workspace [data-calculator-panel] { min-width: 0; }
.calculator-workspace [data-calculator-panel] > h2 { margin: 0 0 .5rem; color: var(--workspace-ink); font-size: 1.45rem; letter-spacing: -.04em; line-height: 1.3; }
.calculator-panel-lead { margin: 0 0 1.3rem; color: var(--workspace-muted); font-size: .83rem; line-height: 1.65; }
.calculator-workspace .calculator-card__fields, .calculator-workspace .calculator-lifestyle .calculator-card__fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.2rem; }
.calculator-workspace .calculator-card__fields > .calculator-field--wide { grid-column: 1 / -1; }
.calculator-workspace .calculator-field { min-width: 0; margin: 0; padding: 0; border: 0; background: transparent; border-radius: 0; gap: .55rem; align-content: start; }
.calculator-workspace .calculator-field__label { color: var(--workspace-ink); font-size: .8rem; font-weight: 650; line-height: 1.5; }
.calculator-workspace .calculator-field__control { gap: .5rem; }
.calculator-workspace .calculator-field__control input, .calculator-workspace .calculator-field__control select { padding: .65rem .6rem; border-color: #bdc3cc; border-radius: .4rem; background: var(--workspace-bg); color: var(--workspace-ink); font-size: .88rem; font-weight: 600; }
.calculator-workspace .calculator-field__control--with-period { grid-template-columns: minmax(0, 1fr) auto; }
.calculator-workspace .calculator-field__control--with-period > span { display: none; }
.calculator-workspace .calculator-field__control select { max-width: 100%; font-size: .75rem; }
.calculator-workspace .calculator-field__control > span { color: var(--workspace-muted); }
.calculator-workspace .calculator-field small { color: var(--workspace-muted); font-size: .72rem; font-weight: 400; line-height: 1.6; letter-spacing: 0; }
.calculator-workspace .calculator-field__nested { border-color: var(--workspace-line); margin-top: .3rem; }
.calculator-workspace .calculator-field-presets, .calculator-workspace .calculator-bonus-presets { gap: .35rem; margin: 0; }
.calculator-workspace .calculator-field-presets button, .calculator-workspace .calculator-bonus-presets button { padding: .4rem .6rem; border-radius: .4rem; border-color: #bdc3cc; font-size: .7rem; font-weight: 550; }
.calculator-slider { display: block; width: 100%; height: 1.6rem; margin: .05rem 0; padding: 0; appearance: none; -webkit-appearance: none; background: transparent; cursor: pointer; accent-color: #536648; }
.calculator-slider::-webkit-slider-runnable-track { height: .3rem; border-radius: 1rem; background: linear-gradient(to right, #667958 0%, #667958 var(--slider-progress, 0%), #e2e6de var(--slider-progress, 0%), #e2e6de 100%); }
.calculator-slider::-moz-range-track { height: .3rem; border-radius: 1rem; background: #e2e6de; }
.calculator-slider::-moz-range-progress { height: .3rem; border-radius: 1rem; background: #667958; }
.calculator-slider::-webkit-slider-thumb { width: 1.15rem; height: 1.15rem; margin-top: -.425rem; appearance: none; -webkit-appearance: none; border: 2px solid #fff; border-radius: 50%; background: #536648; box-shadow: 0 0 0 1px #536648; }
.calculator-slider::-moz-range-thumb { width: 1rem; height: 1rem; border: 2px solid #fff; border-radius: 50%; background: #536648; box-shadow: 0 0 0 1px #536648; }
.calculator-workspace button:focus-visible, .calculator-slider:focus-visible, .calculator-workspace summary:focus-visible { outline: 2px solid #667958; outline-offset: 4px; }
.calculator-workspace .calculator-result { padding: .85rem; border: 1px solid var(--workspace-line); border-radius: .5rem; background: var(--workspace-soft); }
.calculator-workspace .calculator-result__label { color: var(--workspace-muted); font-size: .74rem; font-weight: 500; line-height: 1.5; }
.calculator-workspace .calculator-result output { color: var(--workspace-ink); font-size: 1.15rem; font-weight: 700; }
.calculator-workspace .calculator-result-pair { margin-top: 1rem; gap: .75rem; }
.calculator-workspace .calculator-details { margin-top: 1.3rem; border-top: 1px solid var(--workspace-line); }
.calculator-details > summary { padding: 1rem 0; color: var(--workspace-ink); font-size: .83rem; font-weight: 650; cursor: pointer; }
.calculator-details[open] > summary { margin-bottom: .5rem; }
.calculator-calendar-note { margin: 1.2rem 0 0; padding: .8rem 1rem; border-radius: .5rem; background: var(--workspace-soft); color: var(--workspace-muted); font-size: .74rem; line-height: 1.65; }
.calculator-calendar-note p { margin: 0; }
.calculator-calendar-note p + p { margin-top: .5rem; }
.calculator-calendar-note a { text-decoration: underline; }
.calculator-calendar-brief { margin: 1rem 0 0; color: var(--workspace-muted); font-size: .74rem; line-height: 1.6; }
.calculator-step-actions { display: none; }
.calculator-workspace--ready .calculator-step-actions { display: flex; justify-content: space-between; align-items: center; gap: .7rem; margin-top: 1.5rem; padding-top: 1.1rem; border-top: 1px solid var(--workspace-line); }
.calculator-step-actions button { min-height: 2.6rem; padding: .6rem .85rem; border: 1px solid var(--workspace-line); border-radius: .4rem; background: var(--workspace-bg); color: var(--workspace-ink); font-size: .78rem; font-weight: 650; }
.calculator-step-actions [data-calculator-next] { background: var(--workspace-ink); color: var(--workspace-bg); border-color: var(--workspace-ink); }
.calculator-step-actions button:disabled { opacity: .35; cursor: default; }
.calculator-step-actions > span { color: var(--workspace-muted); font-size: .73rem; }
.calculator-preview { position: sticky; top: 100px; padding: 1.5rem; border-radius: .8rem; background: #e9eee3; color: #293422; }
.calculator-preview__overline { margin: 0 0 .6rem; color: #5e6d54; font-size: .7rem; font-weight: 650; letter-spacing: .06em; text-transform: uppercase; }
.calculator-preview h2 { margin: 0 0 .35rem; font-size: 1.05rem; font-weight: 600; letter-spacing: -.02em; }
.calculator-preview__main { display: block; margin: .6rem 0 .4rem; font-family: "Space Grotesk", ui-sans-serif, system-ui, sans-serif; font-size: clamp(1.7rem, 3vw, 2.25rem); font-weight: 700; letter-spacing: -.06em; overflow-wrap: anywhere; }
.calculator-preview__hint { margin: 0; color: #64705d; font-size: .75rem; line-height: 1.6; }
.calculator-preview dl { margin: 1.5rem 0 0; }
.calculator-preview dl > div { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .5rem; padding: .8rem 0; border-top: 1px solid #cbd4c2; align-items: baseline; }
.calculator-preview dt { color: #58654f; font-size: .75rem; line-height: 1.5; }
.calculator-preview dd { margin: 0; font-size: .83rem; font-weight: 650; text-align: right; }
.calculator-preview a { display: block; margin-top: 1.1rem; font-size: .75rem; text-decoration: underline; line-height: 1.6; }
.calculator-workspace .calculator-lifestyle { margin: 0; }
.calculator-workspace .calculator-lifestyle__grid { display: block; }
.calculator-workspace .calculator-card { padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
.calculator-workspace .calculator-card__heading { margin-bottom: 1rem; }
.calculator-workspace .calculator-card__heading h3 { color: var(--workspace-ink); font-size: 1.05rem; }
.calculator-workspace .calculator-comparison { margin-top: 1.3rem; padding: 0; border: 0; border-radius: 0; background: transparent; color: var(--workspace-ink); }
.calculator-workspace .calculator-comparison__heading h2 { color: var(--workspace-ink); font-size: 1.25rem; }
.calculator-workspace .calculator-comparison__note, .calculator-workspace .calculator-disclaimer { color: var(--workspace-muted); font-size: .75rem; font-weight: 400; line-height: 1.7; }
.calculator-workspace .calculator-comparison__table-wrap { margin-top: 1rem; border: 1px solid var(--workspace-line); border-radius: .5rem; }
.calculator-workspace .calculator-comparison table { min-width: 580px; color: var(--workspace-ink); background: var(--workspace-bg); font-size: .75rem; }
.calculator-workspace .calculator-comparison th, .calculator-workspace .calculator-comparison td { padding: .8rem; border-color: var(--workspace-line); }
.calculator-workspace .calculator-comparison thead th { background: var(--workspace-soft); color: var(--workspace-ink); }
.calculator-workspace .calculator-comparison thead small { color: var(--workspace-muted); font-weight: 400; }
.calculator-workspace .calculator-comparison tbody th { color: var(--workspace-ink); }
.calculator-workspace .osvc-rate-calculator__benefits { margin: 0; padding: 0; border: 0; }
.calculator-workspace .calculator-context { margin-top: 1rem; padding: 0; background: transparent; border: 0; }
.calculator-workspace .calculator-context__heading { display: none; }
.calculator-workspace .calculator-context__grid { grid-template-columns: 1fr; }
.calculator-workspace .calculator-context__grid article { padding: 0; border: 0; background: transparent; }
.calculator-workspace .calculator-disclaimer { margin: 0; padding: 0; }
.calculator-workspace .calculator-lifestyle__savings { grid-template-columns: repeat(2, minmax(0, 1fr)); }
html.dark-mode .calculator-workspace { --workspace-bg: #1c1c1c; --workspace-ink: #f1f2f3; --workspace-muted: #b8bdc6; --workspace-line: #41464e; --workspace-soft: #272b30; }
html.dark-mode .calculator-workspace .calculator-field__control input, html.dark-mode .calculator-workspace .calculator-field__control select { border-color: #646b76; }
html.dark-mode .calculator-workspace .calculator-field { border: 0; background: transparent; }
html.dark-mode .calculator-workspace .calculator-result { background: var(--workspace-soft); }
html.dark-mode .calculator-workspace .calculator-result__label { color: var(--workspace-muted); }
html.dark-mode .calculator-workspace .calculator-comparison thead th { background: var(--workspace-soft); }
html.dark-mode .calculator-workspace .calculator-field-presets button, html.dark-mode .calculator-workspace .calculator-bonus-presets button { border-color: #646b76; background: #1c1c1c; color: #ddd; }
html.dark-mode .calculator-workspace .calculator-field-presets button[aria-pressed="true"], html.dark-mode .calculator-workspace .calculator-bonus-presets button[aria-pressed="true"] { background: #eee; color: #111; }
html.dark-mode .calculator-preview { background: #2b3327; color: #f0f4ed; }
html.dark-mode .calculator-preview dt, html.dark-mode .calculator-preview__hint, html.dark-mode .calculator-preview__overline { color: #c4cebc; }
html.dark-mode .calculator-preview dl > div { border-color: #4b5744; }
html.dark-mode .calculator-slider::-webkit-slider-thumb { background: #b6c8a5; border-color: #2b3327; box-shadow: 0 0 0 1px #b6c8a5; }
html.dark-mode .calculator-slider::-moz-range-thumb { background: #b6c8a5; border-color: #2b3327; }
@media (max-width: 1080px) {
  .calculator-workspace__layout { grid-template-columns: minmax(0, 1fr) 270px; gap: 1rem; }
  .calculator-workspace__editor, .calculator-preview { padding: 1.2rem; }
  .calculator-tabs button { flex-direction: column; align-items: start; gap: .4rem; font-size: .72rem; }
}
@media (max-width: 800px) {
  .calculator-workspace__layout { grid-template-columns: 1fr; }
  .calculator-preview { position: static; }
  .calculator-preview dl { display: grid; grid-template-columns: 1fr 1fr; gap: 0 1.2rem; margin-top: 1rem; }
  .calculator-workspace .calculator-page__heading > p:last-child { font-size: .87rem; }
  .calculator-mobile-preview { display: flex; justify-content: space-between; align-items: center; gap: .7rem; margin: 0 0 1rem; padding: .8rem; border-radius: .5rem; background: #e9eee3; color: #293422; font-size: .75rem; }
  .calculator-mobile-preview output { font-size: 1.05rem; font-weight: 750; white-space: nowrap; }
  html.dark-mode .calculator-mobile-preview { background: #2b3327; color: #f0f4ed; }
}
@media (max-width: 540px) {
  .calculator-workspace__editor { padding: 1rem; }
  .calculator-workspace--ready .calculator-tabs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .25rem .5rem; }
  .calculator-tabs button { flex-direction: row; align-items: center; gap: .3rem; padding: .6rem 0; font-size: .7rem; }
  .calculator-tabs button > span { flex-basis: 1.3rem; height: 1.3rem; }
  .calculator-workspace .calculator-card__fields, .calculator-workspace .calculator-lifestyle .calculator-card__fields { grid-template-columns: 1fr; gap: 1.1rem; }
  .calculator-workspace .calculator-result-pair, .calculator-workspace .calculator-lifestyle__savings { grid-template-columns: 1fr; }
  .calculator-preview dl { grid-template-columns: 1fr; }
  .calculator-workspace [data-calculator-panel] > h2 { font-size: 1.3rem; }
}