#view-living{
  --living-cream:var(--surface2);
  --living-white:var(--surface);
  font-family:var(--mesa-type-font-ui, 'Inter', sans-serif);
}

.living-income{
  width:100%;
  min-width:0;
  background:var(--living-cream);
  border:1px solid var(--border);
  border-radius:var(--ui-radius-panel);
  overflow:hidden;
}

.living-income__intro{
  padding:28px 30px 0;
  background:var(--living-white);
}

.living-income__intro .mesa-panel-heading-divider{
  margin-top:18px;
}

.living-income__body{
  display:grid;
  min-width:0;
  gap:22px;
  padding:24px 30px 30px;
}

.living-income__eyebrow{
  display:block;
  color:var(--gold);
  font-size:var(--ui-overline-size, 11px);
  font-weight:var(--ui-overline-weight, 600);
  letter-spacing:.1em;
  line-height:1.2;
  text-transform:uppercase;
}

.living-income__start,
.living-income__status,
.living-income__reading{
  background:var(--living-white);
  border:1px solid var(--gold-soft);
  border-radius:var(--ui-radius-card);
  box-shadow:var(--shadow-sm);
}

.living-income__start{
  display:grid;
  grid-template-columns:minmax(0,1.45fr) minmax(260px,.75fr);
  gap:34px;
  align-items:center;
  padding:28px 30px;
}

.living-income__start h3,
.living-income__section-head h3,
.living-income__reading-head h3{
  margin:7px 0 6px;
  color:var(--text);
  font-family:var(--mesa-type-font-display, 'DM Serif Display', serif);
  font-size:34px;
  font-weight:400;
  letter-spacing:0;
  line-height:1.08;
}

.living-income__start p,
.living-income__section-head p,
.living-income__reading-head p{
  margin:0;
  color:var(--text-mid);
  font-size:14px;
  line-height:1.55;
}

.living-income__start-note{
  display:grid;
  gap:5px;
  padding-left:22px;
  border-left:2px solid var(--gold);
  color:var(--text-mid);
  font-size:13px;
  line-height:1.5;
}

.living-income__start-note strong{
  color:var(--text);
}

.living-income__status{
  display:flex;
  gap:10px;
  align-items:center;
  padding:20px 24px;
  color:var(--text-mid);
  font-size:13px;
}

.living-income__status strong{color:var(--text);}

.living-income__reading{
  min-width:0;
  overflow:hidden;
}

.living-income__reading-head{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:24px;
  align-items:end;
  padding:27px 30px 23px;
}

.living-income__reading-head h3{
  font-size:42px;
}

.living-income__reference{
  display:grid;
  justify-items:end;
  gap:3px;
  color:var(--text-mid);
  font-size:11px;
}

.living-income__reference span{
  font-size:10px;
  font-weight:600;
  letter-spacing:.1em;
  text-transform:uppercase;
}

.living-income__reference strong{color:var(--text);}
.living-income__reference a{color:var(--gold-hover);text-underline-offset:3px;}

.living-income__metrics{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  border-top:1px solid var(--border);
  border-bottom:1px solid var(--border);
}

.living-income__metric{
  min-width:0;
  padding:18px 18px 17px;
  border-right:1px solid var(--border);
}

.living-income__metric:nth-child(3n){border-right:0;}
.living-income__metric:nth-child(-n+3){border-bottom:1px solid var(--border);}
.living-income__metric span,
.living-income__insight span{
  display:block;
  color:var(--text-mid);
  font-size:10px;
  font-weight:600;
  letter-spacing:.08em;
  line-height:1.25;
  text-transform:uppercase;
}

.living-income__metric strong{
  display:block;
  margin-top:6px;
  color:var(--text);
  font-size:19px;
  line-height:1.15;
}

.living-income__metric small{
  display:block;
  margin-top:5px;
  color:var(--text-mid);
  font-size:10px;
  line-height:1.35;
}

.living-income__metric--positive strong{color:var(--positive);}
.living-income__metric--negative strong{color:var(--negative);}

.living-income__sustainability{
  position:relative;
  display:grid;
  gap:18px;
  margin:26px 30px 4px;
  padding:22px 24px 20px;
  background:var(--bg-subtle);
  border-left:3px solid var(--gold);
}

.living-income__sustainability--positive{border-left-color:var(--positive);}
.living-income__sustainability--negative{border-left-color:var(--negative);}

.living-income__sustainability-head{
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:20px;
}

.living-income__sustainability-head h4{
  margin:6px 0 0;
  color:var(--text);
  font-family:var(--mesa-type-font-display, 'DM Serif Display', serif);
  font-size:25px;
  font-weight:400;
  letter-spacing:0;
  line-height:1.1;
}

.living-income__sustainability-head > strong{
  color:var(--text-mid);
  font-size:11px;
  font-weight:600;
  line-height:1.3;
  text-align:right;
}

.living-income__equation{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:22px;
}

.living-income__equation-item{
  position:relative;
  min-width:0;
  padding-left:20px;
}

.living-income__equation-item:first-child{padding-left:0;}
.living-income__equation-item[data-operator]::before{
  content:attr(data-operator);
  position:absolute;
  top:19px;
  left:0;
  color:var(--text-dim);
  font-size:15px;
  font-weight:600;
  line-height:1;
}

.living-income__equation-item span{
  display:block;
  color:var(--text-mid);
  font-size:9.5px;
  font-weight:600;
  letter-spacing:.07em;
  line-height:1.3;
  text-transform:uppercase;
}

.living-income__equation-item strong{
  display:block;
  margin-top:5px;
  color:var(--text);
  font-size:17px;
  line-height:1.2;
  white-space:nowrap;
}

.living-income__equation-item small{
  display:block;
  margin-top:3px;
  color:var(--text-mid);
  font-size:9.5px;
  line-height:1.35;
}

.living-income__sustainability--positive .living-income__equation-result strong{color:var(--positive);}
.living-income__sustainability--negative .living-income__equation-result strong{color:var(--negative);}
.living-income__sustainability > p{
  margin:0;
  color:var(--text-mid);
  font-size:12px;
  line-height:1.55;
}

.living-income__insights{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:0;
  padding:22px 30px 24px;
}

.living-income__insight{
  padding:0 24px;
  border-right:1px solid var(--border);
}
.living-income__insight:first-child{padding-left:0;}
.living-income__insight:last-child{padding-right:0;border-right:0;}
.living-income__insight strong{display:block;margin-top:7px;color:var(--text);font-size:14px;line-height:1.35;}
.living-income__insight small{display:block;margin-top:4px;color:var(--text-mid);font-size:11px;line-height:1.45;}

.living-income__planner{
  min-width:0;
  padding:28px 30px 30px;
  background:var(--living-white);
  border:1px solid var(--border);
  border-radius:var(--ui-radius-card);
}

.living-income__section-head{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(220px,280px);
  gap:28px;
  align-items:end;
  padding-bottom:22px;
  border-bottom:1px solid var(--border);
}

.living-income__section-head h3{font-size:27px;}
.living-income__budget-field,
.living-income__field{
  display:grid;
  gap:6px;
  min-width:0;
}

.living-income__budget-field > span,
.living-income__field > span{
  color:var(--label-accent);
  font-size:var(--ui-field-label-size);
  font-weight:var(--ui-field-label-weight);
  letter-spacing:var(--ui-field-label-tracking);
  line-height:var(--ui-field-label-line-height);
  text-transform:uppercase;
}

.living-income__budget-field input,
.living-income__field input,
.living-income__field select{
  width:100%;
  height:var(--field-h);
  padding:0 13px;
  color:var(--text);
  background-color:var(--bg-subtle);
  border:1px solid var(--input-border);
  border-radius:var(--ui-control-radius);
  font:600 13px/1 var(--mesa-type-font-ui, 'Inter', sans-serif);
  outline:none;
}

.living-income__field select{
  padding-right:36px;
  background-color:var(--input-bg);
}

.living-income__budget-field input:focus,
.living-income__field input:focus,
.living-income__field select:focus{
  border-color:var(--gold);
  box-shadow:0 0 0 3px var(--gold-dim);
}

.living-income__field .mesa-select-menu-wrap,
.living-income__field .mesa-select-menu{
  width:100%;
  min-width:0;
  max-width:none;
}

.living-income__field .mesa-select-menu__trigger{
  display:flex;
  width:100%;
  min-width:0;
  max-width:none;
  height:var(--field-h);
  min-height:var(--field-h);
  padding:0;
  justify-content:flex-start;
  border:1px solid var(--input-border);
  border-radius:var(--ui-control-radius);
  background:var(--input-bg);
  color:var(--text);
  box-shadow:none;
  font-family:var(--mesa-type-font-ui, 'Inter', sans-serif);
  font-size:var(--ui-field-font-size, 14px);
  font-weight:600;
  letter-spacing:0;
  line-height:1.2;
}

.living-income__field .mesa-select-menu__trigger:hover:not(:disabled),
.living-income__field .mesa-select-menu__trigger--open{
  border-color:color-mix(in srgb, var(--gold) 48%, var(--input-border));
  background:var(--input-bg);
  color:var(--text);
  filter:none;
}

.living-income__field .mesa-select-menu__trigger:focus-visible{
  border-color:var(--gold);
  outline:none;
  box-shadow:0 0 0 3px var(--gold-dim);
}

.living-income__field .mesa-select-menu__trigger-row{
  width:100%;
  height:100%;
  gap:10px;
  padding:0 var(--ui-control-padding-x, 13px);
}

.living-income__field .mesa-select-menu__trigger-value{
  color:inherit;
  font:inherit;
  letter-spacing:0;
}

.living-income__field .mesa-select-menu__trigger-chev{
  color:var(--text-dim);
  font-size:10px;
  opacity:1;
}

.living-income__field .mesa-select-menu__dropdown{
  right:0;
  left:0;
  width:100%;
  min-width:100%;
  max-width:none;
  transform:none;
}

.living-income__field .mesa-select-menu__menu{
  width:100%;
  min-width:0;
  max-width:100%;
  border-color:var(--input-border);
  border-radius:var(--ui-control-radius);
  background:var(--surface);
}

.living-income__field .mesa-select-menu__option{
  display:flex;
  width:100%;
  min-height:36px;
  padding:8px 10px;
  color:var(--text-mid);
  font-family:var(--mesa-type-font-ui, 'Inter', sans-serif);
  font-size:13px;
  font-weight:600;
  letter-spacing:0;
  line-height:1.25;
}

.living-income__field .mesa-select-menu__option-text{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.living-income__form{
  display:grid;
  grid-template-columns:repeat(12,minmax(0,1fr));
  gap:14px;
  align-items:end;
  min-width:0;
  padding:23px 0 18px;
}

.living-income__field--name{grid-column:span 3;}
.living-income__field--category{grid-column:span 2;}
.living-income__field--amount{grid-column:span 2;}
.living-income__field--frequency{grid-column:span 2;}
.living-income__field--rate{grid-column:span 3;}
.living-income__field--source{grid-column:span 6;}
.living-income__form-actions{display:flex;grid-column:span 6;gap:8px;align-items:center;justify-content:flex-end;min-width:0;}
.living-income__form-actions [hidden]{display:none !important;}
.living-income__form-actions .ui-button{white-space:nowrap;}
.living-income__form-hint{grid-column:1/-1;margin:0;color:var(--text-mid);font-size:11px;}
.living-income__form-error{grid-column:1/-1;margin:0;color:var(--negative);font-size:12px;font-weight:600;}

.living-income__entries-head{
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:20px;
  padding:17px 0 12px;
}

.living-income__entries-head h4{margin:0;color:var(--text);font-size:14px;}
.living-income__entries-head p{margin:4px 0 0;color:var(--text-mid);font-size:11px;}
.living-income__empty-list{margin:0;padding:24px;text-align:center;color:var(--text-mid);background:var(--bg-subtle);border:1px solid var(--border);border-radius:var(--ui-radius-compact);}

.living-income__table-wrap{overflow-x:auto;}
.living-income__table{width:100%;min-width:0;border-collapse:collapse;table-layout:fixed;}
.living-income__table th{
  padding:12px 10px;
  color:var(--text-mid);
  font-size:9.5px;
  font-weight:600;
  letter-spacing:.08em;
  text-align:left;
  text-transform:uppercase;
  border-bottom:1px solid var(--border);
}
.living-income__table td{padding:15px 10px;color:var(--text);font-size:12px;line-height:1.4;border-bottom:1px solid var(--border);vertical-align:middle;}
.living-income__table td strong{display:block;font-size:12px;}
.living-income__table td small{display:block;margin-top:3px;color:var(--text-mid);font-size:10px;}
.living-income__table th:first-child{width:20%;}
.living-income__table th:nth-child(2){width:12%;}
.living-income__table th:nth-child(3){width:9%;}
.living-income__table th:nth-child(4){width:23%;}
.living-income__table th:nth-child(5){width:13%;}
.living-income__table th:nth-child(6){width:11%;}
.living-income__row-actions{white-space:nowrap;text-align:right;}
.living-income__row-actions button{padding:4px 6px;color:var(--text-mid);background:none;border:0;font:600 10px/1 var(--mesa-type-font-ui, 'Inter', sans-serif);cursor:pointer;}
.living-income__row-actions button:hover,.living-income__row-actions button:focus-visible{color:var(--gold-hover);text-decoration:underline;text-underline-offset:3px;}
.living-income__row-actions button:last-child:hover,.living-income__row-actions button:last-child:focus-visible{color:var(--negative);}

@media (max-width:1180px){
  .living-income__form{grid-template-columns:repeat(3,minmax(0,1fr));}
  .living-income__field--name,.living-income__field--category,.living-income__field--amount,.living-income__field--frequency,.living-income__field--rate{grid-column:span 1;}
  .living-income__field--source{grid-column:span 2;}
  .living-income__form-actions{grid-column:span 1;}
  .living-income__form-actions{justify-content:flex-end;}
}

@media (max-width:720px){
  #view-living{padding-bottom:78px;}
  .living-income{border-radius:0;border-left:0;border-right:0;}
  .living-income__intro{padding:22px 18px 0;}
  .living-income__body{gap:16px;padding:18px;}
  .living-income__start{grid-template-columns:1fr;gap:20px;padding:22px 20px;}
  .living-income__start-note{padding-left:16px;}
  .living-income__reading-head{grid-template-columns:1fr;gap:14px;padding:22px 20px 18px;}
  .living-income__reading-head h3{font-size:36px;}
  .living-income__section-head h3,.living-income__start h3{font-size:28px;}
  .living-income__reference{justify-items:start;}
  .living-income__metrics{grid-template-columns:repeat(2,minmax(0,1fr));}
  .living-income__metric{border-bottom:1px solid var(--border);}
  .living-income__metric:nth-child(3n){border-right:1px solid var(--border);}
  .living-income__metric:nth-child(2n){border-right:0;}
  .living-income__metric:nth-last-child(-n+2){border-bottom:0;}
  .living-income__sustainability{gap:16px;margin:20px 20px 4px;padding:19px 18px 18px;}
  .living-income__sustainability-head{align-items:start;}
  .living-income__sustainability-head h4{font-size:23px;}
  .living-income__sustainability-head > strong{max-width:120px;}
  .living-income__equation{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 12px;}
  .living-income__equation-item:nth-child(3){padding-left:0;}
  .living-income__equation-item:nth-child(3)::before{display:none;}
  .living-income__insights{grid-template-columns:1fr;padding:6px 20px 12px;}
  .living-income__insight,.living-income__insight:first-child,.living-income__insight:last-child{padding:15px 0;border-right:0;border-bottom:1px solid var(--border);}
  .living-income__insight:last-child{border-bottom:0;}
  .living-income__planner{padding:22px 18px;border-radius:var(--ui-radius-card);}
  .living-income__section-head{grid-template-columns:1fr;gap:18px;}
  .living-income__form{grid-template-columns:1fr 1fr;}
  .living-income__field--name,.living-income__field--category,.living-income__field--amount,.living-income__field--frequency,.living-income__field--rate{grid-column:span 1;}
  .living-income__field--name,.living-income__field--source,.living-income__form-actions{grid-column:1/-1;}
  .living-income__form-actions{justify-content:stretch;}
  .living-income__form-actions .ui-button{flex:1;}
  .living-income__table-wrap{overflow:visible;}
  .living-income__table,.living-income__table tbody,.living-income__table tr,.living-income__table td{display:block;width:100%;min-width:0;max-width:100%;}
  .living-income__table thead{display:none;}
  .living-income__table tr{display:grid;grid-template-columns:1fr 1fr;gap:12px 16px;padding:17px 0;border-bottom:1px solid var(--border);}
  .living-income__table td{padding:0;border:0;}
  .living-income__table td::before{content:attr(data-label);display:block;margin-bottom:4px;color:var(--text-mid);font-size:9px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;}
  .living-income__table td:first-child,.living-income__row-actions{grid-column:1/-1;}
  .living-income__table td:nth-child(4){grid-column:1/-1;overflow-wrap:anywhere;}
  .living-income__row-actions{text-align:left;}
}

@media (max-width:430px){
  .living-income__sustainability-head{display:grid;gap:9px;}
  .living-income__sustainability-head > strong{max-width:none;text-align:left;}
  .living-income__equation{grid-template-columns:1fr;gap:14px;}
  .living-income__equation-item,.living-income__equation-item:nth-child(3){padding-left:18px;}
  .living-income__equation-item:first-child{padding-left:0;}
  .living-income__equation-item:nth-child(3)::before{display:block;}
  .living-income__form{grid-template-columns:1fr;}
  .living-income__field--name,.living-income__field--category,.living-income__field--amount,.living-income__field--frequency,.living-income__field--rate,.living-income__field--source,.living-income__form-actions{grid-column:auto;}
}
