/* Base reset + typography + utilities (shared) */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; height: 100%; background: var(--bg); }
body {
  margin: 0; min-height: 100%;
  background: var(--bg); color: var(--text);
  font-family: var(--font); font-size: var(--fs-md); line-height: var(--lh);
  font-feature-settings: 'tnum' 1, 'lnum' 1;
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
  overscroll-behavior-y: none;
  -webkit-tap-highlight-color: transparent;
}
[dir='rtl'] body, body[dir='rtl'] { letter-spacing: 0; }
h1, h2, h3, h4 { margin: 0; font-weight: 700; line-height: 1.3; letter-spacing: -0.01em; }
h1 { font-size: var(--fs-2xl); } h2 { font-size: var(--fs-xl); } h3 { font-size: var(--fs-lg); } h4 { font-size: var(--fs-md); }
p { margin: 0; }
a { color: var(--brand); text-decoration: none; }
a:hover { text-decoration: underline; }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; background: none; border: 0; padding: 0; -webkit-tap-highlight-color: transparent; touch-action: manipulation; }
a, button, [role='button'], label { touch-action: manipulation; }
img, svg { display: block; max-width: 100%; }
ul, ol { margin: 0; padding: 0; list-style: none; }
hr { border: 0; border-top: 1px solid var(--border); margin: var(--s-4) 0; }
::selection { background: var(--brand-soft); }
:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; border-radius: 4px; }
input, textarea, select { background: var(--surface); }
input::placeholder, textarea::placeholder { color: var(--text-3); opacity: 1; }
input[type='number'] { -moz-appearance: textfield; }
input[type='number']::-webkit-outer-spin-button, input[type='number']::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
input[type='date'], input[type='time'] { min-height: 46px; }
[hidden] { display: none !important; }

/* Numbers always tabular, Latin, LTR inside RTL text */
.num { font-variant-numeric: tabular-nums lining-nums; direction: ltr; unicode-bidi: isolate; white-space: nowrap; }
.money { font-variant-numeric: tabular-nums lining-nums; unicode-bidi: isolate; white-space: nowrap; }
.ltr { direction: ltr; unicode-bidi: isolate; }

/* Utilities */
.muted { color: var(--text-2); }
.faint { color: var(--text-3); }
.small { font-size: var(--fs-sm); }
.xs { font-size: var(--fs-xs); }
.bold { font-weight: 700; }
.semibold { font-weight: 600; }
.center { text-align: center; }
.start { text-align: start; }
.end { text-align: end; }
.row { display: flex; align-items: center; gap: var(--s-2); }
.row.between { justify-content: space-between; }
.row.wrap { flex-wrap: wrap; }
.row.top { align-items: flex-start; }
.col { display: flex; flex-direction: column; gap: var(--s-2); }
.grow { flex: 1 1 auto; min-width: 0; }
.self-start { align-self: flex-start; }
.truncate { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mt-1 { margin-block-start: var(--s-1); } .mt-2 { margin-block-start: var(--s-2); } .mt-3 { margin-block-start: var(--s-3); } .mt-4 { margin-block-start: var(--s-4); } .mt-6 { margin-block-start: var(--s-6); } .mt-8 { margin-block-start: var(--s-8); }
.mb-1 { margin-block-end: var(--s-1); } .mb-2 { margin-block-end: var(--s-2); } .mb-3 { margin-block-end: var(--s-3); } .mb-4 { margin-block-end: var(--s-4); } .mb-6 { margin-block-end: var(--s-6); }
.gap-1 { gap: var(--s-1); } .gap-2 { gap: var(--s-2); } .gap-3 { gap: var(--s-3); } .gap-4 { gap: var(--s-4); } .gap-6 { gap: var(--s-6); }
.hidden { display: none !important; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.debt-color { color: var(--debt); }
.payment-color { color: var(--payment); }
.brand-color { color: var(--brand); }
.accent-color { color: var(--accent-strong); }
.icon { width: 1.25em; height: 1.25em; flex: 0 0 auto; }
[dir='rtl'] .icon-flip { transform: scaleX(-1); }

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}
