.app-shell { grid-template-columns: 190px minmax(0, 1fr); max-width: 100%; overflow: visible; }
.workspace, .content-grid, .main-column, .panel, .cost-section, .fixed-layout, .fixed-layout > div { min-width: 0; max-width: 100%; }
.workspace { width: 100%; overflow-x: clip; }
.table-scroll { width: 100%; max-width: 100%; overflow-x: auto; overscroll-behavior-inline: contain; }
.editor-table { width: 100%; }
.variable-section .subheading-row { min-width: 0; }
.variable-section .switch-label { min-width: 0; max-width: 100%; justify-content: flex-end; }
.variable-section .switch-label span { white-space: normal; }
.sidebar { z-index: 15; }
.variable-cost-list { display: grid; gap: 12px; }
.variable-cost-card { min-width: 0; padding: 15px; border: 1px solid var(--line); border-radius: 13px; background: #fff; }
.variable-cost-header { display: grid; align-items: end; gap: 12px; }
.variable-cost-card.shared .variable-cost-header { grid-template-columns: minmax(180px, 1.4fr) minmax(135px, .7fr) minmax(130px, .7fr) 32px; }
.variable-cost-card.individual .variable-cost-header { grid-template-columns: minmax(180px, 1fr) minmax(135px, 180px) 32px; }
.variable-cost-header label > span, .variable-rate-cell > span { min-height: 14px; color: var(--muted); font-size: 10px; text-transform: uppercase; letter-spacing: .06em; }
.package-cost-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; margin-top: 12px; }
.package-subtotal { min-width: 0; padding: 11px 13px; border-radius: 9px; background: #f1eee7; text-align: right; }
.package-subtotal span, .package-subtotal strong { display: block; }
.package-subtotal span { overflow: hidden; color: var(--muted); font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.package-subtotal strong { margin-top: 3px; color: var(--pine); font-family: "Fraunces", serif; font-size: 17px; }
.fixed-layout {
  display: grid;
  grid-template-columns: minmax(480px, 820px) minmax(230px, 1fr);
  gap: 32px;
  align-items: start;
}

.fixed-totals {
  display: grid;
  grid-template-columns: repeat(2, minmax(190px, 260px));
  justify-content: end;
  margin-top: 16px;
}

.fixed-totals div { min-width: 0; }
.basis-select { min-width: 145px; padding: 10px 34px 10px 12px; white-space: nowrap; }
.variable-table th:first-child, .variable-table td:first-child { width: 190px; }
.variable-table th:nth-child(2), .variable-table td:nth-child(2) { width: 145px; }
.variable-table td:nth-child(n + 3) .money-input { min-width: 120px; max-width: 165px; }
.variable-subtotal { min-width: 150px; color: var(--pine); font-weight: 700; }
.variable-rate-cell { min-width: 125px; }
.variable-rate-cell small { display: block; margin-top: 7px; color: var(--muted); text-align: right; white-space: nowrap; }
.variable-rate-cell small strong { color: var(--pine); }
.break-even-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(270px, 1fr)); gap: 14px; }
.break-even-card { overflow: hidden; border: 1px solid var(--line); border-radius: 14px; background: #fff; }
.break-even-card h4 { margin: 0; padding: 16px 18px; border-bottom: 1px solid var(--line); font-size: 15px; }
.break-even-metrics { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 18px; padding: 18px; }
.break-even-metrics div:last-child { grid-column: 1 / -1; }
.break-even-metrics span, .break-even-result span { display: block; color: var(--muted); font-size: 10px; text-transform: uppercase; letter-spacing: .06em; }
.break-even-metrics strong { display: block; margin-top: 4px; font-size: 14px; }
.break-even-result { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 15px 18px; background: #f1eee7; }
.break-even-result strong { color: var(--pine); font: 600 26px "Fraunces", serif; }
.utility-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(270px, 1fr)); gap: 14px; }
.utility-card { overflow: hidden; border: 1px solid var(--line); border-radius: 14px; background: #fff; }
.utility-card h4 { margin: 0; padding: 16px 18px; border-bottom: 1px solid var(--line); font-size: 15px; }
.utility-lines { padding: 8px 18px; }
.utility-lines div { display: flex; justify-content: space-between; gap: 16px; padding: 11px 0; border-bottom: 1px solid var(--line); }
.utility-lines div:last-child { border: 0; }
.utility-lines span { color: var(--muted); font-size: 11px; }
.utility-totals { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 18px; }
.utility-totals div { padding: 18px; border-radius: 12px; background: var(--forest); color: #fff; text-align: right; }
.utility-totals span, .utility-totals strong { display: block; }
.utility-totals span { color: #bfcac4; font-size: 11px; }
.utility-totals strong { margin-top: 5px; font: 600 24px "Fraunces", serif; }
.utility-totals div:last-child strong { color: #f2cd87; }
.print-report { display: none; }
.user-form { display: grid; grid-template-columns: minmax(220px, 1fr) minmax(220px, 1fr) auto; align-items: end; gap: 12px; margin-bottom: 8px; }

@media (max-width: 1050px) {
  .fixed-layout { grid-template-columns: 1fr; }
  .fixed-totals { grid-template-columns: repeat(2, minmax(180px, 1fr)); margin-top: 12px; }
  .cost-list { max-width: none; }
}

@media (max-width: 1350px) {
  .variable-table th, .variable-table td { padding-left: 11px; padding-right: 11px; }
  .variable-table .name-input { min-width: 145px; }
  .variable-table .basis-select { min-width: 125px; }
  .variable-table td:nth-child(n + 3) .money-input { min-width: 110px; }
}

@media (max-width: 720px) {
  .app-shell { max-width: 100%; overflow: visible; }
  .fixed-layout { display: block; }
  .fixed-totals { grid-template-columns: 1fr; }
  .cost-row { grid-template-columns: minmax(135px, 1fr) minmax(125px, 145px) 28px; gap: 5px; }
  .basis-select { min-width: 130px; }
  .variable-table th:first-child, .variable-table td:first-child { width: 180px; }
  .utility-totals { grid-template-columns: 1fr; }
  .variable-cost-card.shared .variable-cost-header, .variable-cost-card.individual .variable-cost-header { grid-template-columns: 1fr 1fr 32px; }
  .variable-cost-card.shared .variable-cost-header label:nth-child(3) { grid-column: 1 / 3; }
  .variable-cost-card.shared .variable-cost-header .delete-button { grid-column: 3; grid-row: 1; }
  .user-form { grid-template-columns: 1fr; }
}

@media (max-width: 520px) {
  .variable-cost-card.shared .variable-cost-header, .variable-cost-card.individual .variable-cost-header { grid-template-columns: 1fr 32px; }
  .variable-cost-header label { grid-column: 1; }
  .variable-cost-card.shared .variable-cost-header label:nth-child(3) { grid-column: 1; }
  .variable-cost-header .delete-button { grid-column: 2; grid-row: 1; }
  .package-cost-grid { grid-template-columns: 1fr; }
}

@media print {
  @page { size: A4; margin: 12mm; }
  body { background: #fff; }
  #login-view, #app-view, #toast { display: none !important; }
  .print-report { display: block !important; color: #1c211e; font-family: "DM Sans", sans-serif; }
  .print-header { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; padding-bottom: 14px; border-bottom: 2px solid #17261f; }
  .print-header p { margin: 0 0 4px; color: #315344; font-size: 9pt; font-weight: 700; letter-spacing: .15em; }
  .print-header h1 { margin: 0; font: 600 25pt "Fraunces", serif; }
  .print-header > div:last-child { text-align: right; }
  .print-header span, .print-header strong { display: block; }
  .print-header span { margin-top: 3px; color: #6e746f; font-size: 8.5pt; }
  .print-summary { display: grid; grid-template-columns: repeat(4, 1fr); margin: 16px 0; border: 1px solid #dedbd2; border-radius: 8px; }
  .print-summary div { padding: 11px; border-right: 1px solid #dedbd2; }
  .print-summary div:last-child { border: 0; }
  .print-summary span, .print-summary strong { display: block; }
  .print-summary span { color: #6e746f; font-size: 7.5pt; }
  .print-summary strong { margin-top: 4px; font: 600 14pt "Fraunces", serif; }
  .print-packages { display: grid; gap: 11px; }
  .print-package { break-inside: avoid; border: 1px solid #dedbd2; border-radius: 8px; overflow: hidden; }
  .print-package-title { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 10px 13px; background: #f1eee7; }
  .print-package-title h2 { margin: 0; font-size: 12pt; }
  .print-package-title span { color: #6e746f; font-size: 8pt; }
  .print-package-title > strong { color: #315344; font: 600 17pt "Fraunces", serif; }
  .print-financial-grid { display: grid; grid-template-columns: repeat(3, 1fr); }
  .print-financial-grid div { padding: 8px 13px; border-right: 1px solid #dedbd2; border-top: 1px solid #dedbd2; }
  .print-financial-grid div:nth-child(3n) { border-right: 0; }
  .print-financial-grid span, .print-financial-grid strong { display: block; }
  .print-financial-grid span { color: #6e746f; font-size: 7.5pt; }
  .print-financial-grid strong { margin-top: 2px; font-size: 9.5pt; }
  .print-footer { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-top: 14px; break-inside: avoid; }
  .print-footer div { padding: 11px 13px; border-radius: 7px; background: #17261f; color: #fff; text-align: right; }
  .print-footer span, .print-footer strong { display: block; }
  .print-footer span { color: #bfcac4; font-size: 7.5pt; }
  .print-footer strong { margin-top: 3px; font: 600 14pt "Fraunces", serif; }
}