.cat-head__title { display: flex; flex-wrap: nowrap; align-items: center; gap: 8px; margin: 0; }
.cat-head__name { min-width: 0; overflow-wrap: anywhere; }
.cat-head__pct { display: block; margin: 4px 0 6px; font-weight: 700; }
.cat-head__foot { margin: 6px 0 0; color: var(--label-2); font-size: 0.765rem; }
.builder-head { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; margin: 4px 0; }
.builder-head__bob { margin: 0 0 4px; font-weight: 600; }

.account-card { display: grid; grid-template-columns: 72px 1fr; column-gap: var(--sp-3); align-items: center; }
.account-card > .thumb { grid-row: 1 / span 4; align-self: start; }
.account-card__title { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-2); row-gap: var(--sp-1); font: 600 1rem/1.294 var(--font); min-width: 0; }
.account-card__chips { display: flex; flex-wrap: wrap; gap: 6px; margin: 4px 0 8px; }
.account-card__bar { display: grid; grid-template-columns: 1fr auto; gap: var(--sp-2); align-items: center; }
.account-card__bar .num { font-weight: 600; font-size: 0.882rem; }
.account-card__meta { margin-top: 4px; font-size: 0.765rem; line-height: 1.385; color: var(--label-2); font-variant-numeric: tabular-nums; }
.account-card__meta.is-stale { color: var(--orange-text); }

.summary {
  display: grid; grid-template-columns: 1fr 1fr;
}
.summary > div { padding: var(--sp-2) var(--sp-1); }
.summary > div + div { box-shadow: inset 0.5px 0 var(--separator); padding-left: var(--sp-4); }
.summary .t-title1 { margin: 2px 0; }
.section:has(> .summary) { container-type: inline-size; }
@container (max-width: 13em) {
  .summary { grid-template-columns: 1fr; }
  .summary > div + div { box-shadow: inset 0 0.5px var(--separator); padding-left: var(--sp-1); }
}

.picker { position: relative; }
.picker select {
  position: absolute; inset: 0; opacity: 0; font-size: 16px; width: 100%;
}

.eq-group { padding: var(--sp-3); }
.eq-group + .eq-group { margin-top: var(--sp-2); }
.eq-group__hdr { display: flex; align-items: center; gap: var(--sp-2); margin-bottom: var(--sp-3); }
.eq-group__hdr h3 { flex: 1; margin: 0; font: 600 0.882rem/1.333 var(--font); }
.eq-group__hdr .num { font-size: 0.765rem; color: var(--label-2); }
.eq-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(52px, 1fr));
  gap: 12px 4px;
  margin: 0; padding: 0; list-style: none;
}
.eq {
  position: relative;
  display: grid; justify-items: center; gap: 2px;
  width: 100%; min-height: 52px; padding: 0;
  border: 0; background: none; color: inherit;
}
.eq:active .thumb { opacity: 0.7; }
.eq__lvl {
  position: absolute; top: -5px; right: max(-2px, calc(50% - 26px - 6px));
  min-width: 20px; height: 18px; padding: 0 5px;
  border-radius: var(--r-pill);
  background: var(--bg-2); color: var(--label);
  box-shadow: 0 0 0 1px var(--separator), 0 1px 2px rgba(0, 0, 0, 0.12);
  font: 700 11px/18px var(--font); text-align: center; letter-spacing: 0;
}
.eq.is-lvl1 .eq__lvl { color: var(--label-2); font-weight: 500; }
.eq.is-max .eq__lvl { background: color-mix(in srgb, var(--green) 16%, var(--bg-2)); color: var(--green-text); box-shadow: 0 0 0 1px var(--green); }
.eq.is-over .eq__lvl { background: color-mix(in srgb, var(--orange) 16%, var(--bg-2)); color: var(--orange-text); box-shadow: 0 0 0 1px var(--orange); }
.eq__cap {
  max-width: 60px;
  font: 400 10px/12px var(--font); color: var(--label-2); font-style: italic;
  text-align: center;
}
.eq__cap--soft { color: var(--tint); font-style: normal; }
.eq__cap--warn { color: var(--orange-text); font-style: normal; font-weight: 600; font-variant-numeric: tabular-nums; }

.filter-search, .sort-label, .alias-field {
  display: flex; align-items: center; gap: var(--sp-2);
  min-height: 44px; margin: 0 var(--margin-r) var(--sp-3) var(--margin-l);
  padding: 0 var(--sp-3);
  background: var(--panel-2); color: var(--ink);
  border-radius: var(--r-card); border: 2px solid #1E1B16;
}
.filter-search input, .sort-label select, .alias-field input {
  flex: 1; min-height: 44px; border: 0; background: transparent; color: var(--ink);
  font: 400 1rem/1.3 var(--font);
}
.chip-row {
  display: flex; gap: 6px; overflow-x: auto;
  margin: 0 var(--margin-r) var(--sp-3) var(--margin-l);
  padding-bottom: 2px;
}
.chip-row button {
  flex: none; min-height: 44px; padding: 0 12px;
  border-radius: var(--r-pill); border: 2px solid #1E1B16;
  background: var(--panel-2); color: var(--ink);
  font: 600 0.82rem/1 var(--font);
}
.chip-row button[aria-pressed="true"] { background: var(--go); color: #FFFFFF; }
.seg > button { min-height: 44px; }
.seg { height: auto; }
.chart-bars { display: grid; gap: 8px; }
.chart-bars .bar-row { display: grid; grid-template-columns: 4.6rem 1fr auto; gap: 8px; align-items: center; }
.chart svg.chart { width: 100%; height: auto; }
.file-input { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }

.card > div:has(> .slots) { container-type: inline-size; min-width: 0; }
.slots { display: flex; align-items: center; gap: 4px; min-height: 22px; font-size: 0.765rem; color: var(--label-2); }
.slots__lbl { min-width: 9.5em; }
@container (max-width: 12em) {
  .slots { flex-wrap: wrap; row-gap: 2px; }
  .slots__lbl { flex: 1 0 100%; min-width: 0; }
}
.slots i { width: 8px; height: 8px; border-radius: 50%; box-shadow: inset 0 0 0 1.5px var(--label-3); }
.slots i.on   { background: var(--label-2); box-shadow: none; }
.slots i.free { box-shadow: inset 0 0 0 1.5px var(--green-text); }
.slots .num { margin-left: 4px; color: var(--label); font-weight: 600; }
.done-label { color: var(--green-text); font-weight: 600; }

.ladder { display: grid; grid-template-columns: 4.2em repeat(7, 1fr) 3.2em; gap: 6px 3px; align-items: center; }
.ladder__hdr  { font-size: 0.647rem; color: var(--label-2); text-align: center; font-variant-numeric: tabular-nums; }
.ladder__name { font-size: 0.765rem; font-weight: 600; white-space: nowrap; }
.ladder i { height: 14px; border-radius: 4px; }
.ladder i.done      { background: var(--tint); }
.ladder i.todo      { box-shadow: inset 0 0 0 1.5px var(--fill-1); }
.ladder i.goal.todo { box-shadow: inset 0 0 0 1.5px var(--tint); }
.ladder i.goal.done { background: var(--green); }
.ladder i.none      { visibility: hidden; }
.ladder__val { font-size: 0.765rem; text-align: right; color: var(--label-2); font-variant-numeric: tabular-nums; }

.card__top { display: flex; justify-content: space-between; align-items: baseline; gap: var(--sp-2); }
.card__top--chart { flex-wrap: wrap; row-gap: var(--sp-1); }
.card__top--chart > :first-child { flex: none; white-space: nowrap; }
.chart-wrap { position: relative; container-type: inline-size; }
.chart-select {
  appearance: none; -webkit-appearance: none; border: 0; background: none; color: var(--tint);
  font: 400 0.882rem/1.333 var(--font); text-align: right;
  flex: 0 1 auto; min-width: 0; max-width: 55%;
  padding-block: 12px; margin-block: -12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
@container (max-width: 17em) {
  .card__top--chart { flex-direction: column; align-items: flex-start; }
  .card__top--chart .chart-select { max-width: 100%; text-align: left; }
}
.chart { width: 100%; height: auto; display: block; overflow: visible; }
.chart__grid line { stroke: var(--separator); stroke-width: 0.5; }
.chart :is(.chart__y, .chart__x) text { fill: var(--label-2); font: 400 11px/13px var(--font); font-variant-numeric: tabular-nums; }
.chart__y text { text-anchor: end; }
.chart__x text { text-anchor: middle; }
.chart__area { fill: var(--tint-soft); }
.chart__line, .chart__step { fill: none; stroke: var(--tint); stroke-width: 2.5; stroke-linejoin: round; stroke-linecap: round; }
.chart__pt   { fill: var(--bg-2); stroke: var(--tint); stroke-width: 2.5; }
.chart__goal { stroke: var(--green); stroke-width: 1.5; stroke-dasharray: 4 4; }
.chart-wrap { position: relative; }
.chart-callout {
  position: absolute; padding: 6px 10px; border-radius: 8px;
  font: 600 13px/18px var(--font); font-variant-numeric: tabular-nums;
}

.offline-dl__top { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: var(--sp-2); }
.offline-dl__top h3 { margin: 0; font: 600 1rem/1.294 var(--font); }
.offline-dl__top .num { white-space: nowrap; }
.offline-dl .bar { --cat: var(--tint); margin-bottom: 6px; }
.offline-dl__meta { font-size: 0.765rem; line-height: 1.385; color: var(--label-2); font-variant-numeric: tabular-nums; margin-bottom: var(--sp-3); }
.offline-dl.is-done .bar { --cat: var(--green); }
.offline-dl__status { min-height: 1.385em; }

.json-input { display: block; width: 100%; min-height: calc(8 * 18px); padding: 0; border: 0; resize: vertical;
  background: transparent; color: var(--label); font: 400 13px/18px var(--font-mono); letter-spacing: 0; }
.json-input::placeholder { color: var(--label-3); }
.json-input:focus { outline: none; }
.json-input--short { min-height: calc(3 * 18px); }
.file-input { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.preview { display: grid; grid-template-columns: 96px 1fr; column-gap: var(--sp-3); align-items: center; }
.preview__main { min-width: 0; display: grid; gap: 2px; }
.preview__main .account-card__title { flex-wrap: wrap; row-gap: 2px; }
.kv { display: grid; grid-template-columns: auto 1fr; gap: var(--sp-2) var(--sp-3); margin: var(--sp-3) 0 0; padding-top: var(--sp-3); border-top: 0.5px solid var(--separator); }
.kv dt { color: var(--label-2); white-space: nowrap; }
.kv dd { margin: 0; text-align: right; font-weight: 600; font-variant-numeric: tabular-nums; }
.delta { white-space: nowrap; }
@container (max-width: 19em) {
  .preview { grid-template-columns: 1fr; row-gap: var(--sp-3); }
  .preview > .thumb { --size: 72px; }
  .kv { grid-template-columns: 1fr; row-gap: 0; }
  .kv dt { white-space: normal; }
  .kv dd { text-align: left; margin-bottom: var(--sp-2); }
}
.ficha { text-align: center; }
.validating-card { display: grid; gap: var(--sp-3); }

.group-label { margin: var(--sp-6) var(--margin-r) var(--sp-2) var(--margin-l); }
.stack > * + * { margin-top: var(--sp-2); }
.sheet .section { margin-bottom: var(--sp-5); }
textarea:focus, .btn:focus { outline: none; }
textarea:focus-visible, .btn:focus-visible, a:focus-visible { outline: 3px solid var(--tint); outline-offset: 2px; }

.link-row { display: flex; gap: 16px; margin-top: 8px; }
.link-row a { color: var(--tint); font-weight: 600; }
.date-row { display: flex; gap: 8px; margin: 0 var(--margin-r) var(--sp-3) var(--margin-l); }
.date-row label { flex: 1; display: flex; flex-direction: column; gap: 4px; font: 600 0.75rem/1.2 var(--font); color: var(--label-2); }
.date-row input { min-height: 44px; border: 2px solid #1E1B16; border-radius: var(--r-card); background: var(--panel-2); color: var(--ink); font: 400 1rem/1.3 var(--font); padding: 0 8px; }
.legend-row { display: flex; flex-wrap: wrap; gap: 8px 12px; margin-top: 8px; }
.legend { display: inline-flex; align-items: center; gap: 4px; font: 600 0.75rem/1.2 var(--font); color: var(--label-2); }
.legend i { width: 10px; height: 10px; border-radius: 2px; }
.legend-row--cuentas { gap: 6px 10px; }
.legend-row--cuentas .legend { font-size: 0.82rem; color: var(--label); }
.legend-row--cuentas .legend i { width: 12px; height: 12px; border-radius: 3px; }
.gcat { margin: 14px 0 4px; }
.gcat h3 { margin: 0 0 6px; font: 600 0.82rem/1.2 var(--font); }
.gbar { display: flex; align-items: flex-end; gap: 3px; height: 88px; }
.gbar i { flex: 1 1 0; min-width: 6px; border-radius: 3px 3px 0 0; background: var(--c, var(--tint)); height: calc(var(--k, 0) * 100%); min-height: 2px; }
.gbar i.is-na { background: var(--fill-1); height: 8%; min-height: 4px; }
.stack-bar { display: flex; height: 22px; border-radius: 6px; overflow: hidden; background: var(--fill-1); min-width: 0; }
.stack-bar i { display: block; height: 100%; background: var(--cat); min-width: 2px; }
.compare-grid { display: grid; grid-template-columns: 1fr; gap: 8px; }
.heat { display: grid; gap: 3px; overflow-x: auto; }
.heat__row { display: grid; grid-template-columns: 3.2rem repeat(var(--cols), minmax(1.6rem, 1fr)); gap: 3px; align-items: center; }
.heat__name, .heat__lab { font: 600 0.65rem/1 var(--font); color: var(--label-2); overflow: hidden; text-overflow: ellipsis; }
.heat__cell { height: 28px; border-radius: 4px; background: color-mix(in srgb, var(--tint) calc(var(--k) * 100%), var(--bg-2)); }
.heat__cell.has-acct { background: color-mix(in srgb, var(--acct) calc(var(--k) * 100%), var(--bg-2)); }
.heat__cell.is-na { background: var(--fill-1); }
.radar text { fill: var(--label-2); font: 600 10px/12px var(--font); text-anchor: middle; dominant-baseline: middle; }
.radar .ring { fill: none; stroke: var(--separator); stroke-width: 1; }
.goal { display: block; height: 4px; margin-top: 6px; border-radius: 2px; background: var(--fill-3); }
.goal__fill { display: block; height: 100%; width: calc(var(--p) * 1%); max-width: 100%; border-radius: 2px; background: var(--tint); }
.row .btn-text[aria-pressed="true"] { color: var(--orange-text); }