:root {
  --pico-font-size: 95%;
  --pico-form-element-spacing-vertical: 0.4rem;
  --pico-form-element-spacing-horizontal: 0.6rem;
}

body { padding-bottom: 5rem; }
main.container { max-width: 720px; padding-inline: 1rem; }

.page-head {
  display: flex; align-items: baseline; justify-content: space-between;
  gap: 1rem; margin-block: 1rem 0.5rem;
}
.page-head h2 { margin: 0; }

.tbb { text-align: right; }
.tbb strong { display: block; font-size: 1.25rem; }
.tbb.neg strong { color: var(--pico-color-red-500); }

.bottom-nav {
  position: fixed; left: 0; right: 0; bottom: 0;
  display: flex; justify-content: space-around;
  background: var(--pico-card-background-color);
  border-top: 1px solid var(--pico-muted-border-color);
  padding: 0.6rem env(safe-area-inset-right) calc(0.6rem + env(safe-area-inset-bottom)) env(safe-area-inset-left);
  z-index: 50;
}
.bottom-nav a {
  text-decoration: none; color: var(--pico-muted-color);
  font-size: 0.9rem; padding: 0.3rem 0.8rem; border-radius: 6px;
}
.bottom-nav a.active { color: var(--pico-primary); font-weight: 600; }

.cats { width: 100%; font-size: 0.85rem; table-layout: auto; }
.cats th, .cats td { padding: 0.4rem 0.25rem; vertical-align: middle; }
.cats th.num, .cats td.num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.cats input { margin: 0; padding: 0.2rem 0.3rem; width: 5.5rem; text-align: right; font-size: 0.85rem; display: inline-block; }
.cats td:nth-child(2) { text-align: right; }
.cats td.num small { display: block; opacity: 0.55; font-size: 0.65rem; }
.num { text-align: right; font-variant-numeric: tabular-nums; }
.neg { color: var(--pico-color-red-500); }
@media (max-width: 520px) {
  .lifetime-col { display: none; }
  .cats { font-size: 0.78rem; }
  .cats input { width: 4.2rem; }
}

.month-nav { display: flex; align-items: center; gap: 0.6rem; }
.month-nav h2 { margin: 0; }
.month-nav a { text-decoration: none; font-size: 0.85rem; color: var(--pico-primary); }
.month-nav .muted { color: var(--pico-muted-color); font-size: 0.85rem; }

.stats-bar {
  display: flex; gap: 1rem; flex-wrap: wrap; align-items: center;
  font-size: 0.78rem; margin: 0.4rem 0 0.8rem;
  color: var(--pico-muted-color);
}
.stats-bar strong { color: var(--pico-color); }
.stats-bar .warn { color: var(--pico-color-orange-500); text-decoration: none; font-weight: 600; }
.stats-bar .ok { color: var(--pico-color-green-500); }

.hint-soft { font-size: 0.78rem; color: var(--pico-muted-color); text-align: center; margin: 0.8rem 0; }

.tx-list { list-style: none; padding: 0; margin: 0; }
.tx {
  display: flex; justify-content: space-between; gap: 0.75rem;
  padding: 0.7rem 0; border-bottom: 1px solid var(--pico-muted-border-color);
}
.tx-main { min-width: 0; flex: 1; }
.tx-payee { font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tx-meta { font-size: 0.78rem; color: var(--pico-muted-color); }
.tx-side { text-align: right; }
.tx-amt { font-variant-numeric: tabular-nums; font-weight: 600; }
.tx-amt.neg { color: var(--pico-color-red-500); }
.tx-amt.pos { color: var(--pico-color-green-500); }
.tx-side select { font-size: 0.78rem; padding: 0.2rem; margin: 0.3rem 0 0; max-width: 9rem; }
.pill {
  display: inline-block; font-size: 0.7rem; padding: 0.1rem 0.4rem;
  border-radius: 999px; background: var(--pico-muted-border-color);
  color: var(--pico-muted-color); margin-top: 0.2rem;
}
.pill.ai { background: var(--pico-primary-background); color: var(--pico-primary-inverse); }

.acct-list { list-style: none; padding: 0; }
.acct-list li {
  display: flex; justify-content: space-between; align-items: center;
  padding: 0.8rem 0; border-bottom: 1px solid var(--pico-muted-border-color);
}
.acct-list li.disabled { opacity: 0.55; }
.acct-list small { display: block; color: var(--pico-muted-color); font-size: 0.75rem; }
.acct-right { display: flex; align-items: center; gap: 0.6rem; }
.acct-right form { margin: 0; }
button.toggle {
  font-size: 0.7rem; padding: 0.25rem 0.6rem; margin: 0;
  border-radius: 999px; min-width: 4.5rem;
}
button.toggle.off { background: var(--pico-muted-border-color); border-color: var(--pico-muted-border-color); color: var(--pico-muted-color); }

.hint {
  background: var(--pico-primary-background); color: var(--pico-primary-inverse);
  padding: 0.6rem 0.8rem; border-radius: 6px; font-size: 0.85rem; margin: 0.5rem 0;
}

details.danger { margin-top: 2rem; }
details.danger summary { font-size: 0.85rem; color: var(--pico-muted-color); cursor: pointer; }

/* Dedicated danger button — explicit colors so Pico's .secondary/.outline
   styling can't make it invisible. Applied directly via class="btn-danger".
   Styled to read as CAUTION at a glance: vivid red, white bold text,
   a slight shadow and uppercase treatment. */
button.btn-danger,
.btn-danger[type="submit"] {
  background: #e53935 !important;
  border: 2px solid #b71c1c !important;
  color: #ffffff !important;
  font-weight: 700 !important;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  padding: 0.55rem 1.2rem !important;
  box-shadow: 0 2px 4px rgba(183, 28, 28, 0.3);
  transition: all 0.15s ease;
}
button.btn-danger:hover,
.btn-danger[type="submit"]:hover {
  background: #c62828 !important;
  border-color: #7f0000 !important;
  box-shadow: 0 3px 6px rgba(127, 0, 0, 0.4);
  transform: translateY(-1px);
}
button.btn-danger:active,
.btn-danger[type="submit"]:active {
  transform: translateY(0);
  box-shadow: 0 1px 2px rgba(127, 0, 0, 0.3);
}

.htmx-indicator {
  display: none;
  margin-left: 0.6rem;
  color: var(--pico-color-orange-500);
  font-size: 0.85rem;
  font-weight: 600;
}
.htmx-request .htmx-indicator,
.htmx-request.htmx-indicator { display: inline; }

.actions { display: flex; gap: 0.5rem; flex-wrap: wrap; margin: 0.5rem 0; }
.actions button { flex: 1; min-width: 8rem; }
.result { font-size: 0.85rem; margin: 0.5rem 0; min-height: 1rem; }
.result pre { white-space: pre-wrap; color: var(--pico-color-red-500); font-size: 0.75rem; }

.status {
  padding: 0.6rem 0.8rem; border-radius: 8px; margin: 0.4rem 0;
  font-size: 0.85rem; line-height: 1.4;
}
.status small { display: block; opacity: 0.75; font-size: 0.72rem; margin-top: 0.2rem; }
.status.running { background: var(--pico-primary-background); color: var(--pico-primary-inverse); }
.status.done { background: var(--pico-card-sectioning-background-color); border: 1px solid var(--pico-muted-border-color); }
.status.err { background: rgba(220, 53, 69, 0.12); color: var(--pico-color-red-500); }
.status p { margin: 0.4rem 0 0; }
.spinner { display: inline-block; animation: spin 2s linear infinite; }
.warn { color: var(--pico-color-orange-500); }
.warn-list { font-size: 0.72rem; margin: 0.3rem 0 0; padding-left: 1rem; opacity: 0.75; }
@keyframes spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }

.filters { display: flex; gap: 0.5rem; }
.filters a { text-decoration: none; font-size: 0.85rem; padding: 0.2rem 0.6rem; border-radius: 6px; }
.filters a.active { background: var(--pico-primary-background); color: var(--pico-primary-inverse); }

.empty { text-align: center; color: var(--pico-muted-color); padding: 2rem 1rem; }

.login-card {
  max-width: 360px; margin: 6rem auto;
}
.login-card h1 { text-align: center; margin-bottom: 1.5rem; }
.login-card .error { color: var(--pico-color-red-500); display: block; margin-top: 0.5rem; }

.logout { margin-top: 2rem; }

/* Review page */
.review-actions { display: flex; gap: 0.5rem; align-items: center; flex-wrap: wrap; margin-bottom: 0.8rem; font-size: 0.85rem; }
.review-actions form { margin: 0; }

.review-list { list-style: none; padding: 0; margin: 0; }
.review-row {
  display: flex; justify-content: space-between; align-items: center; gap: 0.5rem;
  padding: 0.7rem 0; border-bottom: 1px solid var(--pico-muted-border-color);
  flex-wrap: wrap;
}
.rr-main { flex: 1; min-width: 0; }
.rr-payee { font-weight: 600; font-size: 0.92rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rr-meta { font-size: 0.72rem; color: var(--pico-muted-color); margin-top: 0.15rem; }
.rr-actions { display: flex; align-items: center; gap: 0.35rem; flex-shrink: 0; }
.rr-current { margin-right: 0.3rem; }
.rr-buttons { display: flex; gap: 0.3rem; align-items: center; }
.rr-buttons form { margin: 0; }

.btn-approve {
  background: var(--pico-color-green-500) !important;
  color: white !important;
  border: none !important;
  font-weight: 700;
  font-size: 0.9rem;
  padding: 0.3rem 0.6rem !important;
  border-radius: 6px;
  cursor: pointer;
  line-height: 1;
}
.btn-approve:hover { background: #2e7d32 !important; }

.change-form select {
  margin: 0; padding: 0.25rem 0.3rem; font-size: 0.75rem;
  max-width: 8rem; border-radius: 4px;
}

.pill.unc { background: var(--pico-color-orange-500); color: white; }

.nav-badge {
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--pico-color-orange-500); color: white;
  font-size: 0.6rem; font-weight: 700; min-width: 1.1rem; height: 1.1rem;
  border-radius: 999px; margin-left: 0.15rem; padding: 0 0.25rem;
}

.docs h3 { margin-top: 1.5rem; font-size: 1.05rem; }
.docs p, .docs li { font-size: 0.88rem; line-height: 1.5; }
.docs ul.def li { margin-bottom: 0.4rem; }
.docs code { font-size: 0.78rem; word-break: break-all; }
.docs pre { background: var(--pico-card-sectioning-background-color); padding: 0.7rem; border-radius: 6px; overflow-x: auto; font-size: 0.72rem; }
.docs pre code { word-break: normal; }
.docs-tools { width: 100%; font-size: 0.78rem; margin: 0.5rem 0; }
.docs-tools th, .docs-tools td { padding: 0.3rem 0.3rem; vertical-align: top; }
.docs-tools td:nth-child(2) { text-align: center; opacity: 0.7; }

.goals textarea { font-size: 0.85rem; }
.goals { margin: 1rem 0; }
.plan-actions { display: flex; gap: 0.7rem; align-items: center; flex-wrap: wrap; margin: 0.5rem 0; }
.plan-actions button { margin: 0; }
.plan-actions small { color: var(--pico-muted-color); font-size: 0.78rem; }

.pos { color: var(--pico-color-green-500); }

.plan-cards { display: grid; gap: 0.7rem; margin: 1rem 0; }
.plan-card { padding: 0.9rem 1rem; border-radius: 10px; border: 1px solid var(--pico-muted-border-color); background: var(--pico-card-sectioning-background-color); margin: 0; }
.plan-card h4 { margin: 0 0 0.4rem; font-size: 0.85rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--pico-muted-color); }
.plan-card p { margin: 0; font-size: 0.92rem; line-height: 1.55; }
.baseline-card { border-left: 3px solid var(--pico-color-slate-500, #64748b); }
.interpretation-card { border-left: 3px solid var(--pico-primary); }
.strategy-card { border-left: 3px solid var(--pico-color-green-500); }
.watchout-card { border-left: 3px solid var(--pico-color-orange-500); }

.projection table, .proposals table { width: 100%; font-size: 0.82rem; }
.projection th, .projection td { padding: 0.35rem 0.3rem; }
.projection th.num, .projection td.num { text-align: right; font-variant-numeric: tabular-nums; }

.proposals-head { display: flex; justify-content: space-between; align-items: baseline; }
.proposals-head h3 { margin-bottom: 0.3rem; }
.proposals-table .reasoning-inline { display: none; font-size: 0.66rem; opacity: 0.6; margin-top: 0.1rem; line-height: 1.25; white-space: normal; max-width: 9rem; margin-left: auto; }
.proposals-table.show-reasoning .reasoning-inline { display: block; }
.proposals-table .amt { cursor: help; border-bottom: 1px dotted var(--pico-muted-border-color); }
.proposals-table .actual-cell { color: var(--pico-muted-color); }
.proposals-table .delta { display: block; font-size: 0.66rem; opacity: 0.8; margin-top: 0.05rem; font-weight: 500; }
.proposals-table .delta.cut { color: var(--pico-color-green-500); }
.proposals-table .delta.grow { color: var(--pico-color-orange-500); }
.tag-income { display: inline-block; font-size: 0.65rem; padding: 0.1rem 0.35rem; border-radius: 3px; background: var(--pico-color-green-500); color: white; margin-left: 0.3rem; vertical-align: middle; opacity: 0.8; }

.inline-check { display: inline-flex; align-items: center; gap: 0.3rem; font-size: 0.78rem; margin-right: 0.5rem; }
.inline-check input { margin: 0; }

.neg-row { background: rgba(220, 53, 69, 0.06); }
.muted { color: var(--pico-muted-color); }

button.tiny { font-size: 0.7rem; padding: 0.2rem 0.5rem; margin: 0; }
tr.archived { opacity: 0.5; }
tr.archived td input { font-style: italic; }

.cat-create { margin: 1rem 0 1.5rem; padding: 0.7rem 0.9rem; background: var(--pico-card-sectioning-background-color); border-radius: 6px; }
.cat-create h4 { margin: 0 0 0.4rem; font-size: 0.85rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--pico-muted-color); }
.cat-create-form { display: flex; gap: 0.4rem; flex-wrap: wrap; align-items: center; }
.cat-create-form input { flex: 1; min-width: 8rem; margin: 0; padding: 0.35rem 0.6rem; font-size: 0.85rem; }
.cat-create-form button { margin: 0; padding: 0.4rem 1rem; font-size: 0.85rem; white-space: nowrap; }
.tool-counts { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; opacity: 0.6; word-break: break-all; }
.flash { display: inline-block; margin-left: 0.4rem; font-size: 0.85rem; }
.flash-ok { color: var(--pico-color-green-500); animation: fadeout 2s forwards; }
.flash-err { color: var(--pico-color-red-500); font-size: 0.7rem; }
@keyframes fadeout { 0% { opacity: 1; } 80% { opacity: 1; } 100% { opacity: 0; } }

.reset-steps { list-style: none; padding-left: 0; font-size: 0.78rem; margin: 0.4rem 0; }
.reset-steps li { padding: 0.1rem 0; }
.reset-steps li.ok { color: var(--pico-color); }
.reset-steps li.error { color: var(--pico-color-red-500); }
.reset-steps code { font-size: 0.78rem; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; }

.section-label { font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.05em; color: var(--pico-muted-color); margin-top: 0.8rem; margin-bottom: 0.2rem; }

/* Conversational review wizard */
.review-wizard {
  background: var(--pico-card-sectioning-background-color);
  border-radius: 10px;
  padding: 1rem 1rem 1.2rem;
  margin: 0.8rem 0 1.2rem;
}
.rw-progress {
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--pico-muted-color);
  margin-bottom: 0.7rem;
}
.rw-progress strong { color: var(--pico-color); margin: 0 0.25rem; font-size: 0.85rem; }
.rw-preview {
  padding: 0.6rem 0.8rem;
  background: var(--pico-background-color);
  border-radius: 6px;
  margin-bottom: 0.9rem;
}
.rw-payee { font-weight: 600; font-size: 1rem; }
.rw-meta { font-size: 0.78rem; color: var(--pico-muted-color); margin-top: 0.15rem; }
.rw-question {
  font-size: 1.05rem;
  line-height: 1.35;
  margin: 0.5rem 0 0.3rem;
}
.rw-context {
  font-size: 0.82rem;
  color: var(--pico-muted-color);
  margin-bottom: 0.8rem;
}
.rw-options { display: flex; flex-direction: column; gap: 0.4rem; margin-top: 0.6rem; }
.rw-options form { margin: 0; }
.rw-opt {
  width: 100%;
  text-align: left;
  padding: 0.8rem 1rem;
  border-radius: 8px;
  font-size: 0.95rem;
  background: var(--pico-primary-background);
  border: 1px solid var(--pico-primary-border);
  color: var(--pico-primary-inverse);
  min-height: 3rem;
}
.rw-opt:hover { filter: brightness(1.1); }
.rw-opt-mixed {
  background: var(--pico-background-color);
  color: var(--pico-color);
  border: 1px dashed var(--pico-muted-border-color);
}
.rw-opt-skip {
  background: transparent;
  color: var(--pico-muted-color);
  border: 1px dashed var(--pico-muted-border-color);
}
.rw-freeform { display: flex; flex-direction: column; gap: 0.5rem; margin-top: 0.6rem; }
.rw-freeform textarea { margin: 0; padding: 0.7rem 0.8rem; font-size: 0.95rem; min-height: 5rem; }
.rw-freeform small { color: var(--pico-muted-color); font-size: 0.78rem; }

.rw-skip-row { text-align: right; margin-top: 0.9rem; }
.rw-skip-row button { margin: 0; }

.rw-other { margin-top: 0.8rem; padding-top: 0.8rem; border-top: 1px dashed var(--pico-muted-border-color); }
.rw-other summary { cursor: pointer; font-size: 0.85rem; color: var(--pico-muted-color); padding: 0.3rem 0; }
.rw-other-form { display: flex; flex-direction: column; gap: 0.35rem; margin-top: 0.6rem; }
.rw-other-form label { display: flex; flex-direction: column; gap: 0.2rem; font-size: 0.78rem; color: var(--pico-muted-color); }
.rw-other-form select, .rw-other-form input { margin: 0; padding: 0.5rem 0.6rem; font-size: 0.9rem; }
.rw-other-form button {
  margin: 0;
  padding: 0.7rem 1rem;
  font-size: 0.9rem;
  align-self: stretch;
  background: var(--pico-primary-background);
  border: 1px solid var(--pico-primary-border);
  color: var(--pico-primary-inverse);
  border-radius: 8px;
}
.rw-other-form button:hover { filter: brightness(1.1); }
.rw-other-new { margin-top: 0.9rem; padding-top: 0.7rem; border-top: 1px dotted var(--pico-muted-border-color); }
.rw-other-hint { margin-top: 0.6rem; color: var(--pico-muted-color); }

.review-progress { list-style: none; padding: 0; margin: 0.6rem 0 0.4rem; font-size: 0.88rem; line-height: 1.7; }
.review-progress li { padding: 0; }
.review-progress strong { color: var(--pico-color); }
.review-tokens { display: block; margin-top: 0.5rem; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; opacity: 0.55; font-size: 0.7rem; }

/* Plan page - 2-step wizard */
.plan-step { max-width: 32rem; margin: 0 auto; }
.plan-step-head { margin-bottom: 1rem; }
.plan-step-head h3 { margin: 0.2rem 0 0.15rem; }
.plan-step-num {
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--pico-muted-color);
}

.plan-headline {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 0.6rem;
  margin: 1rem 0 1.2rem;
  text-align: center;
}
.plan-headline > div {
  padding: 0.7rem 0.3rem;
  background: var(--pico-card-sectioning-background-color);
  border-radius: 8px;
}
.plan-headline small {
  display: block;
  font-size: 0.66rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--pico-muted-color);
  margin-bottom: 0.2rem;
}
.plan-headline strong { font-size: 1.1rem; }

.plan-pie-wrap {
  max-width: 320px;
  margin: 0.6rem auto 1.2rem;
}

.plan-cat-list { list-style: none; padding: 0; margin: 0 0 1.2rem; }
.plan-cat-list li {
  padding: 0.7rem 0;
  border-bottom: 1px solid var(--pico-muted-border-color);
}
.pc-head { display: flex; justify-content: space-between; align-items: baseline; }
.pc-name { font-weight: 600; font-size: 0.95rem; }
.pc-total { font-size: 0.92rem; }
.pc-bars {
  display: flex;
  gap: 0.4rem;
  align-items: flex-end;
  height: 2.5rem;
  margin-top: 0.4rem;
}
.pc-bar {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: center;
  height: 100%;
}
.pc-fill {
  width: 100%;
  min-height: 2px;
  background: var(--pico-primary-background);
  border-radius: 3px 3px 0 0;
  transition: height 0.2s ease;
}
.pc-bar small {
  font-size: 0.62rem;
  color: var(--pico-muted-color);
  margin-top: 0.15rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.plan-goals { margin: 1rem 0; padding: 0.6rem 0.8rem; background: var(--pico-card-sectioning-background-color); border-radius: 8px; }
.plan-goals summary { cursor: pointer; font-size: 0.9rem; }
.plan-goals summary small { color: var(--pico-muted-color); }
.goals-form { margin-top: 0.7rem; }
.goals-form textarea { margin-bottom: 0.5rem; }

.plan-next-form, .plan-create-form, .plan-rerun-form { display: flex; flex-direction: column; align-items: center; gap: 0.3rem; margin-top: 1rem; }
.plan-next-form small, .plan-create-form small, .plan-rerun-form small { color: var(--pico-muted-color); font-size: 0.78rem; text-align: center; }
.plan-next-btn, .plan-create-btn { padding: 0.8rem 2rem; font-size: 1rem; }
.plan-rerun-form { margin-top: 0.5rem; }

.plan-strategy {
  padding: 0.8rem 1rem;
  background: var(--pico-card-sectioning-background-color);
  border-left: 3px solid var(--pico-primary);
  border-radius: 6px;
  font-size: 0.92rem;
  line-height: 1.45;
  margin: 0.8rem 0 1rem;
}

.plan-total {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 0.5rem;
  padding: 0.7rem 0.9rem;
  background: var(--pico-background-color);
  border: 1px solid var(--pico-muted-border-color);
  border-radius: 8px;
  margin-bottom: 1rem;
}
.plan-total strong { font-size: 1.3rem; }
.plan-total small { color: var(--pico-muted-color); font-size: 0.78rem; }

.plan-proposals { list-style: none; padding: 0; margin: 0 0 1.2rem; }
.plan-proposals li {
  padding: 0.7rem 0;
  border-bottom: 1px solid var(--pico-muted-border-color);
}
.pp-head { display: flex; justify-content: space-between; align-items: baseline; }
.pp-name { font-weight: 600; font-size: 0.95rem; }
.pp-amount { font-size: 1.05rem; }
.pp-reason { margin-top: 0.25rem; font-size: 0.8rem; color: var(--pico-muted-color); line-height: 1.4; }

.plan-back { text-align: center; margin-top: 1.5rem; }

/* Category budget-relevance toggle pill */
.toggle-on { background: var(--pico-primary-background); border: 1px solid var(--pico-primary-border); color: var(--pico-primary-inverse); }
.toggle-off { background: transparent; border: 1px dashed var(--pico-muted-border-color); color: var(--pico-muted-color); }
tr.excluded input { opacity: 0.6; }

.review-empty { text-align: center; padding: 1.5rem 0.5rem; }
.review-empty .empty { margin-bottom: 1rem; }
.review-empty button.primary { padding: 0.8rem 1.4rem; font-size: 1rem; }

.review-prefs { margin-top: 1.5rem; padding-top: 0.8rem; border-top: 1px solid var(--pico-muted-border-color); }
.review-prefs summary { cursor: pointer; font-size: 0.85rem; color: var(--pico-muted-color); }
.prefs-form { display: flex; flex-direction: column; gap: 0.6rem; margin-top: 0.7rem; }
.prefs-form label { display: flex; flex-direction: column; gap: 0.25rem; font-size: 0.82rem; }
.prefs-form select { margin: 0; }
.prefs-form button { align-self: flex-start; margin: 0; }

/* Drill-in per-transaction view */
.drill-list { list-style: none; padding: 0; margin: 0; }
.drill-row {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  padding: 0.6rem 0;
  border-bottom: 1px solid var(--pico-muted-border-color);
}
.drill-main { display: flex; flex-wrap: wrap; gap: 0.5rem; align-items: baseline; font-size: 0.85rem; }
.drill-date { color: var(--pico-muted-color); font-size: 0.78rem; min-width: 3.5rem; }
.drill-amt { font-weight: 600; min-width: 4.5rem; }
.drill-amt.neg { color: var(--pico-color-red-500); }
.drill-amt.pos { color: var(--pico-color-green-500); }
.drill-memo { color: var(--pico-muted-color); font-size: 0.78rem; flex: 1; min-width: 0; }
.drill-acct { color: var(--pico-muted-color); font-size: 0.72rem; }
.drill-row select { margin: 0; padding: 0.35rem 0.6rem; font-size: 0.85rem; }
.drill-actions { display: flex; gap: 0.6rem; margin-top: 1rem; }
.drill-actions button, .drill-actions a { margin: 0; }

.neg { color: var(--pico-color-red-500); }
.pos { color: var(--pico-color-green-500); }