/* calc-modal.css — Scoped styles for the Severance Runway Calculator modal */
/* All styles scoped under .calc-modal to prevent conflicts with the main site */

/* ===== MODAL SHELL ===== */
.calc-modal {
  position: fixed;
  inset: 0;
  z-index: 500;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}
.calc-modal.active {
  opacity: 1;
  pointer-events: all;
}
.calc-modal__overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.7);
  backdrop-filter: blur(8px);
}

/* Container = fullscreen scrollable panel */
.calc-modal__container {
  --cm-font-body: 'Inter', 'Helvetica Neue', sans-serif;
  --cm-font-mono: 'JetBrains Mono', 'SF Mono', 'Fira Code', monospace;
  --cm-accent: #22c55e;
  --cm-accent-muted: #16a34a;
  --cm-accent-dim: #15803d;
  --cm-accent-bg: rgba(34, 197, 94, 0.08);
  --cm-accent-bg-strong: rgba(34, 197, 94, 0.15);
  --cm-loss: #ef4444;
  --cm-loss-muted: #dc2626;
  --cm-loss-bg: rgba(239, 68, 68, 0.08);
  --cm-warning: #f59e0b;
  --cm-warning-bg: rgba(245, 158, 11, 0.08);
  --cm-bg: #0a0a0b;
  --cm-surface: #111113;
  --cm-surface-2: #18181b;
  --cm-surface-3: #1f1f23;
  --cm-surface-offset: #141416;
  --cm-surface-dynamic: #232328;
  --cm-divider: #27272a;
  --cm-border: #303036;
  --cm-border-subtle: #222226;
  --cm-text: #e4e4e7;
  --cm-text-muted: #a1a1aa;
  --cm-text-faint: #52525b;

  position: relative;
  z-index: 1;
  width: 100%;
  height: 100%;
  overflow-y: auto;
  background: var(--cm-bg);
  color: var(--cm-text);
  font-family: var(--cm-font-body);
}

/* ===== CLOSE BUTTON ===== */
.calc-modal__close {
  position: fixed;
  top: var(--space-4);
  right: var(--space-4);
  z-index: 510;
  color: var(--cm-text-muted);
  padding: var(--space-3);
  border-radius: var(--radius-md);
  background: var(--cm-surface-2);
  border: 1px solid var(--cm-border-subtle);
  cursor: pointer;
  transition: all 180ms cubic-bezier(0.16, 1, 0.3, 1);
  display: flex;
  align-items: center;
  justify-content: center;
}
.calc-modal__close:hover {
  color: var(--cm-text);
  background: var(--cm-surface-3);
}

/* ===== HEADER ===== */
.calc-modal__header {
  border-bottom: 1px solid var(--cm-border-subtle);
  background: var(--cm-bg);
}
.calc-modal__header-inner {
  max-width: 1080px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: var(--space-3) var(--space-5);
}
.calc-modal__header-left {
  display: flex;
  align-items: center;
  gap: var(--space-3);
}
.calc-modal__logo-mark {
  font-family: var(--cm-font-mono);
  font-weight: 700;
  font-size: var(--text-sm);
  background: var(--cm-accent);
  color: #000;
  padding: var(--space-1) var(--space-2);
  border-radius: var(--radius-sm);
  letter-spacing: 0.05em;
}
.calc-modal__logo-text {
  font-weight: 600;
  font-size: var(--text-sm);
  color: var(--cm-text);
  letter-spacing: -0.01em;
}

/* ===== MAIN ===== */
.calc-modal__main {
  max-width: 1080px;
  margin: 0 auto;
  padding: 0 var(--space-5);
  padding-bottom: var(--space-16);
}

/* ===== PROGRESS ===== */
.calc-modal__progress-container {
  padding: var(--space-6) 0;
  position: sticky;
  top: 0;
  z-index: 50;
  background: var(--cm-bg);
}
.calc-modal__progress-steps {
  display: flex;
  align-items: center;
  max-width: 640px;
  margin: 0 auto;
}
.calc-modal__progress-step {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  padding: var(--space-2) var(--space-3);
  border-radius: var(--radius-full);
  color: var(--cm-text-faint);
  transition: all 180ms cubic-bezier(0.16, 1, 0.3, 1);
  white-space: nowrap;
  font-size: var(--text-xs);
  flex-shrink: 0;
  cursor: pointer;
  background: none;
  border: none;
  font-family: var(--cm-font-body);
}
.calc-modal__step-num {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  font-weight: 600;
  border: 1.5px solid var(--cm-border);
  transition: all 180ms cubic-bezier(0.16, 1, 0.3, 1);
}
.calc-modal__step-label { display: none; }
@media (min-width: 640px) {
  .calc-modal__step-label { display: inline; }
}
.calc-modal__progress-step.active { color: var(--cm-text); }
.calc-modal__progress-step.active .calc-modal__step-num {
  background: var(--cm-accent);
  color: #000;
  border-color: var(--cm-accent);
}
.calc-modal__progress-step.completed .calc-modal__step-num {
  background: var(--cm-accent-dim);
  color: var(--cm-accent);
  border-color: var(--cm-accent-dim);
}
.calc-modal__progress-step.completed { color: var(--cm-text-muted); }
.calc-modal__progress-line {
  flex: 1;
  height: 2px;
  background: var(--cm-border-subtle);
  border-radius: 1px;
  min-width: 16px;
  position: relative;
}
.calc-modal__progress-line-fill {
  position: absolute;
  top: 0; left: 0;
  height: 100%;
  width: 0%;
  background: var(--cm-accent-dim);
  border-radius: 1px;
  transition: width 300ms cubic-bezier(0.16, 1, 0.3, 1);
}

/* ===== STEP PANELS ===== */
.calc-modal__step-panel {
  display: none;
  opacity: 0;
  transform: translateX(12px);
}
.calc-modal__step-panel.active {
  display: block;
  animation: cmStepIn 350ms cubic-bezier(0.16, 1, 0.3, 1) forwards;
}
@keyframes cmStepIn {
  from { opacity: 0; transform: translateX(12px); }
  to { opacity: 1; transform: translateX(0); }
}
.calc-modal__step-content {
  max-width: 960px;
  margin: 0 auto;
}
.calc-modal__step-header { margin-bottom: var(--space-8); }
.calc-modal__step-overline {
  font-size: var(--text-xs);
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--cm-accent);
  display: block;
  margin-bottom: var(--space-2);
}
.calc-modal__step-title {
  font-size: var(--text-2xl);
  font-weight: 700;
  letter-spacing: -0.02em;
  margin-bottom: var(--space-2);
  color: var(--cm-text);
}
.calc-modal__step-subtitle {
  font-size: var(--text-sm);
  color: var(--cm-text-muted);
  max-width: 52ch;
}

/* ===== FORM ELEMENTS ===== */
.calc-modal__form-grid {
  display: flex;
  flex-direction: column;
  gap: var(--space-6);
}
.calc-modal__form-field {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}
.calc-modal__form-field label {
  font-size: var(--text-sm);
  font-weight: 500;
  color: var(--cm-text-muted);
  text-transform: none;
  letter-spacing: 0;
}
.calc-modal__form-field--compact { gap: var(--space-1); }
.calc-modal__form-field--compact label { font-size: var(--text-xs); }
.calc-modal__sub-label {
  font-size: var(--text-xs);
  color: var(--cm-text-faint);
  margin-top: var(--space-2);
}

.calc-modal__input-prefix-wrap,
.calc-modal__input-suffix-wrap {
  display: flex;
  align-items: center;
  background: var(--cm-surface);
  border: 1px solid var(--cm-border);
  border-radius: var(--radius-md);
  transition: border-color 180ms cubic-bezier(0.16, 1, 0.3, 1), box-shadow 180ms cubic-bezier(0.16, 1, 0.3, 1);
}
.calc-modal__input-prefix-wrap:focus-within,
.calc-modal__input-suffix-wrap:focus-within {
  border-color: var(--cm-accent);
  box-shadow: 0 0 0 3px var(--cm-accent-bg);
}
.calc-modal__input-prefix,
.calc-modal__input-suffix {
  font-size: var(--text-sm);
  color: var(--cm-text-faint);
  padding: 0 var(--space-3);
  flex-shrink: 0;
  user-select: none;
}
.calc-modal__input-prefix-wrap input,
.calc-modal__input-suffix-wrap input {
  flex: 1;
  border: none;
  background: transparent;
  padding: var(--space-3);
  font-size: var(--text-base);
  outline: none;
  min-width: 0;
  color: var(--cm-text);
  font-family: var(--cm-font-body);
}
.calc-modal__input-prefix-wrap input { padding-left: 0; }
.calc-modal__input-suffix-wrap input { padding-right: 0; }

.calc-modal select,
.calc-modal__container select {
  padding: var(--space-3) var(--space-4);
  background: var(--cm-surface);
  border: 1px solid var(--cm-border);
  border-radius: var(--radius-md);
  font-size: var(--text-base);
  color: var(--cm-text);
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23a1a1aa' stroke-width='2.5'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 12px center;
  padding-right: var(--space-10);
  cursor: pointer;
  width: 100%;
  font-family: var(--cm-font-body);
}
.calc-modal select:focus,
.calc-modal__container select:focus {
  border-color: var(--cm-accent);
  outline: none;
  box-shadow: 0 0 0 3px var(--cm-accent-bg);
}

/* Toggle Group */
.calc-modal__toggle-group {
  display: flex;
  gap: var(--space-1);
  background: var(--cm-surface);
  padding: var(--space-1);
  border-radius: var(--radius-md);
  border: 1px solid var(--cm-border-subtle);
  flex-wrap: wrap;
}
.calc-modal__toggle-btn {
  padding: var(--space-2) var(--space-4);
  border-radius: calc(var(--radius-md) - var(--space-1));
  font-size: var(--text-sm);
  font-weight: 500;
  color: var(--cm-text-muted);
  transition: all 180ms cubic-bezier(0.16, 1, 0.3, 1);
  white-space: nowrap;
  background: none;
  border: none;
  cursor: pointer;
  font-family: var(--cm-font-body);
}
.calc-modal__toggle-btn:hover { color: var(--cm-text); }
.calc-modal__toggle-btn.active {
  background: var(--cm-surface-dynamic);
  color: var(--cm-text);
}

/* Radio Group */
.calc-modal__radio-group {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}
.calc-modal__radio-option {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  padding: var(--space-3) var(--space-4);
  border-radius: var(--radius-md);
  font-size: var(--text-sm);
  cursor: pointer;
  transition: background 180ms cubic-bezier(0.16, 1, 0.3, 1);
  color: var(--cm-text-muted);
  text-transform: none;
  letter-spacing: 0;
  font-weight: 400;
}
.calc-modal__radio-option:hover { background: var(--cm-surface); }
.calc-modal__radio-option input[type="radio"] {
  width: 18px;
  height: 18px;
  accent-color: var(--cm-accent);
  flex-shrink: 0;
}

/* Conditional Field */
.calc-modal__conditional-field {
  margin-top: var(--space-3);
  padding-left: var(--space-4);
  border-left: 2px solid var(--cm-border-subtle);
}

/* Data Point */
.calc-modal__data-point {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: var(--space-3) var(--space-4);
  background: var(--cm-surface);
  border-radius: var(--radius-md);
  margin-top: var(--space-3);
}
.calc-modal__data-label {
  font-size: var(--text-xs);
  color: var(--cm-text-muted);
}
.calc-modal__data-value {
  font-size: var(--text-sm);
  font-weight: 600;
}

/* Form Divider */
.calc-modal__form-divider-label {
  font-size: var(--text-xs);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--cm-text-faint);
  padding-top: var(--space-4);
  border-top: 1px solid var(--cm-divider);
}

/* Slider */
.calc-modal__slider {
  -webkit-appearance: none;
  appearance: none;
  width: 100%;
  height: 6px;
  background: var(--cm-surface-dynamic);
  border-radius: 3px;
  outline: none;
}
.calc-modal__slider::-webkit-slider-thumb {
  -webkit-appearance: none;
  width: 22px; height: 22px;
  border-radius: 50%;
  background: var(--cm-accent);
  cursor: pointer;
  border: 2px solid var(--cm-bg);
  box-shadow: 0 4px 12px rgba(0,0,0,0.4);
}
.calc-modal__slider::-moz-range-thumb {
  width: 22px; height: 22px;
  border-radius: 50%;
  background: var(--cm-accent);
  cursor: pointer;
  border: 2px solid var(--cm-bg);
}
.calc-modal__slider-labels {
  display: flex;
  justify-content: space-between;
  font-size: var(--text-xs);
  color: var(--cm-text-faint);
  margin-top: var(--space-1);
}

/* ===== CALLOUTS ===== */
.calc-modal__callout {
  padding: var(--space-3) var(--space-4);
  border-radius: var(--radius-md);
  font-size: var(--text-xs);
  line-height: 1.5;
  border-left: 3px solid;
}
.calc-modal__callout--accent {
  background: var(--cm-accent-bg);
  border-color: var(--cm-accent-dim);
  color: var(--cm-text-muted);
}
.calc-modal__callout--loss {
  background: var(--cm-loss-bg);
  border-color: var(--cm-loss-muted);
  color: var(--cm-text-muted);
}
.calc-modal__callout--warning {
  background: var(--cm-warning-bg);
  border-color: var(--cm-warning);
  color: var(--cm-text-muted);
}
.calc-modal__callout--info {
  background: var(--cm-surface);
  border-color: var(--cm-border);
  color: var(--cm-text-faint);
}

/* ===== BUTTONS ===== */
.calc-modal__btn {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  padding: var(--space-3) var(--space-5);
  border-radius: var(--radius-md);
  font-weight: 500;
  font-size: var(--text-sm);
  transition: all 180ms cubic-bezier(0.16, 1, 0.3, 1);
  min-height: 44px;
  cursor: pointer;
  border: none;
  font-family: var(--cm-font-body);
}
.calc-modal__btn--primary {
  background: var(--cm-accent);
  color: #000;
}
.calc-modal__btn--primary:hover { background: var(--cm-accent-muted); }
.calc-modal__btn--secondary {
  background: var(--cm-surface-2);
  border: 1px solid var(--cm-border);
  color: var(--cm-text-muted);
}
.calc-modal__btn--secondary:hover {
  background: var(--cm-surface-dynamic);
  color: var(--cm-text);
}
.calc-modal__step-nav {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: var(--space-10);
  padding-top: var(--space-6);
  border-top: 1px solid var(--cm-divider);
}

/* ===== TAX PANEL ===== */
.calc-modal__tax-panel {
  background: var(--cm-surface);
  border: 1px solid var(--cm-border-subtle);
  border-radius: var(--radius-lg);
  padding: var(--space-6);
  margin-top: var(--space-8);
}
.calc-modal__tax-panel-title {
  font-size: var(--text-sm);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--cm-text-faint);
  margin-bottom: var(--space-4);
}
.calc-modal__tax-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: var(--space-2) 0;
  font-size: var(--text-sm);
  color: var(--cm-text-muted);
}
.calc-modal__tax-row--loss .calc-modal__mono { color: var(--cm-loss); }
.calc-modal__tax-row--deduction .calc-modal__mono { color: var(--cm-accent); }
.calc-modal__tax-row--net {
  padding-top: var(--space-4);
  margin-top: var(--space-2);
  border-top: 2px solid var(--cm-divider);
  color: var(--cm-text);
  font-weight: 600;
}
.calc-modal__tax-savings {
  margin-top: var(--space-4);
  padding: var(--space-3) var(--space-4);
  background: var(--cm-accent-bg);
  border-radius: var(--radius-md);
  font-size: var(--text-xs);
  color: var(--cm-text-muted);
}
.calc-modal__lump-comparison {
  margin-top: var(--space-4);
  padding: var(--space-4);
  background: var(--cm-surface-2);
  border-radius: var(--radius-md);
  border: 1px solid var(--cm-border-subtle);
}
.calc-modal__lump-comparison-title {
  font-size: var(--text-xs);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--cm-text-faint);
  margin-bottom: var(--space-2);
}
.calc-modal__lump-comparison p {
  font-size: var(--text-sm);
  color: var(--cm-text-muted);
  line-height: 1.6;
}

/* ===== BURN SECTIONS ===== */
.calc-modal__burn-section {
  background: var(--cm-surface);
  border: 1px solid var(--cm-border-subtle);
  border-radius: var(--radius-lg);
  margin-bottom: var(--space-4);
  overflow: hidden;
}
.calc-modal__burn-section-toggle {
  width: 100%;
  display: flex;
  align-items: center;
  padding: var(--space-4) var(--space-5);
  color: var(--cm-text);
  transition: background 180ms cubic-bezier(0.16, 1, 0.3, 1);
  gap: var(--space-3);
  cursor: pointer;
  background: none;
  border: none;
  font-family: var(--cm-font-body);
}
.calc-modal__burn-section-toggle:hover { background: var(--cm-surface-offset); }
.calc-modal__burn-section-title {
  font-size: var(--text-sm);
  font-weight: 600;
  flex: 1;
  text-align: left;
}
.calc-modal__burn-section-subtotal {
  font-size: var(--text-sm);
  color: var(--cm-text-muted);
}
.calc-modal__collapse-icon {
  color: var(--cm-text-faint);
  transition: transform 180ms cubic-bezier(0.16, 1, 0.3, 1);
  flex-shrink: 0;
}
.calc-modal__burn-section-toggle[aria-expanded="false"] .calc-modal__collapse-icon {
  transform: rotate(-90deg);
}
.calc-modal__burn-section-body {
  padding: 0 var(--space-5) var(--space-5);
  display: flex;
  flex-direction: column;
  gap: var(--space-5);
  overflow: hidden;
  transition: max-height 300ms cubic-bezier(0.16, 1, 0.3, 1), padding 300ms cubic-bezier(0.16, 1, 0.3, 1);
}
.calc-modal__burn-section-body.collapsed {
  max-height: 0 !important;
  padding-top: 0;
  padding-bottom: 0;
}

/* Debt */
.calc-modal__debt-card {
  background: var(--cm-surface-offset);
  border-radius: var(--radius-md);
  padding: var(--space-4);
}
.calc-modal__debt-card-label {
  font-size: var(--text-xs);
  font-weight: 600;
  color: var(--cm-text-faint);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: var(--space-3);
}
.calc-modal__debt-row {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: var(--space-3);
}
@media (max-width: 480px) {
  .calc-modal__debt-row { grid-template-columns: 1fr; }
}

/* Burn Total */
.calc-modal__burn-total {
  background: var(--cm-surface);
  border: 1px solid var(--cm-border-subtle);
  border-radius: var(--radius-lg);
  padding: var(--space-5);
  margin-top: var(--space-4);
}
.calc-modal__burn-total-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-weight: 600;
  font-size: var(--text-base);
  color: var(--cm-text);
}

/* ===== STEP 4: RESULTS ===== */
.calc-modal__runway-hero {
  text-align: center;
  padding: var(--space-12) 0 var(--space-8);
}
.calc-modal__runway-hero-number {
  font-size: var(--text-hero);
  font-weight: 700;
  color: var(--cm-accent);
  line-height: 1;
  letter-spacing: -0.03em;
}
.calc-modal__runway-hero-label {
  font-size: var(--text-lg);
  color: var(--cm-text-muted);
  margin-top: var(--space-2);
}
.calc-modal__runway-hero-deadline {
  font-size: var(--text-sm);
  color: var(--cm-text-faint);
  margin-top: var(--space-3);
  font-family: var(--cm-font-mono);
}

/* Timeline */
.calc-modal__timeline-container {
  margin: var(--space-8) 0;
  padding: 0 var(--space-2);
}
.calc-modal__timeline-bar {
  height: 32px;
  display: flex;
  border-radius: var(--radius-md);
  overflow: visible;
  position: relative;
  background: var(--cm-surface-2);
}
.calc-modal__timeline-zone {
  height: 100%;
  transition: width 500ms cubic-bezier(0.16, 1, 0.3, 1);
}
.calc-modal__timeline-green {
  background: var(--cm-accent-dim);
  border-radius: var(--radius-md) 0 0 var(--radius-md);
  opacity: 0.5;
}
.calc-modal__timeline-yellow {
  background: var(--cm-warning);
  opacity: 0.3;
}
.calc-modal__timeline-red {
  background: var(--cm-loss);
  border-radius: 0 var(--radius-md) var(--radius-md) 0;
  opacity: 0.25;
}
.calc-modal__timeline-marker {
  position: absolute;
  top: -6px;
  width: 3px;
  height: 44px;
  background: var(--cm-text);
  border-radius: 2px;
  transition: left 500ms cubic-bezier(0.16, 1, 0.3, 1);
}
.calc-modal__timeline-marker-label {
  position: absolute;
  top: -24px;
  left: 50%;
  transform: translateX(-50%);
  font-size: 11px;
  font-family: var(--cm-font-mono);
  font-weight: 600;
  color: var(--cm-text);
  white-space: nowrap;
  background: var(--cm-surface-dynamic);
  padding: 2px 6px;
  border-radius: var(--radius-sm);
}
.calc-modal__timeline-labels {
  display: flex;
  justify-content: space-between;
  margin-top: var(--space-3);
  font-size: var(--text-xs);
  color: var(--cm-text-faint);
}

/* Levers */
.calc-modal__levers-section { margin: var(--space-10) 0; }
.calc-modal__levers-title {
  font-size: var(--text-lg);
  font-weight: 600;
  margin-bottom: var(--space-5);
  letter-spacing: -0.01em;
  color: var(--cm-text);
}
.calc-modal__levers-grid {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}
.calc-modal__lever-card {
  display: flex;
  align-items: center;
  gap: var(--space-4);
  padding: var(--space-4) var(--space-5);
  background: var(--cm-surface);
  border: 1px solid var(--cm-border-subtle);
  border-radius: var(--radius-lg);
  transition: all 180ms cubic-bezier(0.16, 1, 0.3, 1);
  cursor: pointer;
}
.calc-modal__lever-card:hover { border-color: var(--cm-border); }
.calc-modal__lever-card.active {
  border-color: var(--cm-accent-dim);
  background: var(--cm-accent-bg);
}
.calc-modal__lever-toggle {
  width: 40px;
  height: 22px;
  border-radius: var(--radius-full);
  background: var(--cm-surface-dynamic);
  position: relative;
  flex-shrink: 0;
  transition: background 180ms cubic-bezier(0.16, 1, 0.3, 1);
}
.calc-modal__lever-toggle::after {
  content: '';
  position: absolute;
  top: 3px; left: 3px;
  width: 16px; height: 16px;
  border-radius: 50%;
  background: var(--cm-text-faint);
  transition: all 180ms cubic-bezier(0.16, 1, 0.3, 1);
}
.calc-modal__lever-card.active .calc-modal__lever-toggle {
  background: var(--cm-accent-dim);
}
.calc-modal__lever-card.active .calc-modal__lever-toggle::after {
  left: 21px;
  background: var(--cm-accent);
}
.calc-modal__lever-info { flex: 1; min-width: 0; }
.calc-modal__lever-name {
  font-size: var(--text-sm);
  font-weight: 500;
  color: var(--cm-text);
  margin-bottom: var(--space-1);
}
.calc-modal__lever-desc {
  font-size: var(--text-xs);
  color: var(--cm-text-muted);
  line-height: 1.5;
}
.calc-modal__lever-badge {
  font-family: var(--cm-font-mono);
  font-size: var(--text-sm);
  font-weight: 700;
  color: var(--cm-accent);
  white-space: nowrap;
  flex-shrink: 0;
}
.calc-modal__lever-input-wrap {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  margin-top: var(--space-2);
}
.calc-modal__lever-input-wrap .calc-modal__input-prefix-wrap {
  max-width: 160px;
}
.calc-modal__lever-input-wrap .calc-modal__input-prefix-wrap input {
  padding: var(--space-2);
  font-size: var(--text-sm);
}

/* Optimized */
.calc-modal__optimized-hero {
  text-align: center;
  padding: var(--space-8);
  background: var(--cm-accent-bg);
  border: 1px solid var(--cm-accent-dim);
  border-radius: var(--radius-lg);
  margin-bottom: var(--space-8);
}
.calc-modal__optimized-label {
  font-size: var(--text-xs);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--cm-accent);
  margin-bottom: var(--space-3);
}
.calc-modal__optimized-number {
  display: flex;
  align-items: baseline;
  justify-content: center;
  gap: var(--space-3);
}
.calc-modal__optimized-number .calc-modal__mono {
  font-size: var(--text-3xl);
  font-weight: 700;
  color: var(--cm-accent);
  line-height: 1;
}
.calc-modal__optimized-delta {
  font-size: var(--text-base);
  font-weight: 600;
  color: var(--cm-accent-muted);
}

/* Summary */
.calc-modal__summary-card {
  background: var(--cm-surface);
  border: 1px solid var(--cm-border-subtle);
  border-radius: var(--radius-lg);
  padding: var(--space-6);
  margin-top: var(--space-8);
}
.calc-modal__summary-card-title {
  font-size: var(--text-sm);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--cm-text-faint);
  margin-bottom: var(--space-5);
}
.calc-modal__summary-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: var(--space-2) 0;
  font-size: var(--text-sm);
  color: var(--cm-text-muted);
}
.calc-modal__summary-row--highlight {
  font-weight: 600;
  color: var(--cm-text);
  font-size: var(--text-base);
  padding: var(--space-3) 0;
}
.calc-modal__summary-row--accent .calc-modal__mono { color: var(--cm-accent); }
.calc-modal__summary-divider {
  height: 1px;
  background: var(--cm-divider);
  margin: var(--space-3) 0;
}
.calc-modal__summary-footer {
  margin-top: var(--space-6);
  padding-top: var(--space-4);
  border-top: 1px solid var(--cm-divider);
  font-size: var(--text-xs);
  color: var(--cm-text-faint);
  text-align: center;
  font-style: italic;
}

/* Methodology */
.calc-modal__methodology {
  margin-top: var(--space-10);
  padding: var(--space-4) var(--space-5);
  background: var(--cm-surface);
  border: 1px solid var(--cm-border-subtle);
  border-radius: var(--radius-lg);
}
.calc-modal__methodology summary {
  font-size: var(--text-sm);
  font-weight: 500;
  color: var(--cm-text-muted);
  cursor: pointer;
  list-style: none;
  display: flex;
  align-items: center;
  gap: var(--space-2);
  min-height: 44px;
}
.calc-modal__methodology summary::-webkit-details-marker { display: none; }
.calc-modal__methodology summary::before {
  content: '▸';
  font-size: 12px;
  color: var(--cm-text-faint);
  transition: transform 180ms cubic-bezier(0.16, 1, 0.3, 1);
}
.calc-modal__methodology[open] summary::before { transform: rotate(90deg); }
.calc-modal__methodology-body {
  margin-top: var(--space-4);
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}
.calc-modal__methodology-body p {
  font-size: var(--text-xs);
  color: var(--cm-text-faint);
  line-height: 1.7;
}
.calc-modal__methodology-body strong { color: var(--cm-text-muted); }

/* ===== UTILITIES ===== */
.calc-modal__mono {
  font-family: var(--cm-font-mono);
  font-variant-numeric: tabular-nums lining-nums;
}
.calc-modal__accent-text { color: var(--cm-accent); }

/* ===== RESPONSIVE ===== */
@media (max-width: 640px) {
  .calc-modal__main { padding: 0 var(--space-4); padding-bottom: var(--space-12); }
  .calc-modal__progress-container { padding: var(--space-4) 0; }
  .calc-modal__step-title { font-size: var(--text-xl); }
  .calc-modal__runway-hero { padding: var(--space-8) 0 var(--space-6); }
  .calc-modal__runway-hero-number { font-size: var(--text-3xl); }
  .calc-modal__tax-panel, .calc-modal__burn-section, .calc-modal__summary-card, .calc-modal__methodology { padding: var(--space-4); }
  .calc-modal__burn-section-toggle { padding: var(--space-3) var(--space-4); }
  .calc-modal__burn-section-body { padding: 0 var(--space-4) var(--space-4); }
  .calc-modal__lever-card { padding: var(--space-3) var(--space-4); flex-wrap: wrap; }
  .calc-modal__lever-badge { width: 100%; text-align: right; }
  .calc-modal__toggle-group { flex-wrap: wrap; }
  .calc-modal__toggle-btn { font-size: var(--text-xs); padding: var(--space-2) var(--space-3); }
}
