/* ============================================================
   Thési — Base (reset + element defaults)
   ============================================================ */
*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; padding: 0; height: 100%; }
body {
  font-family: var(--font);
  font-size: var(--fs-16);
  line-height: var(--lh);
  color: var(--text);
  background: var(--bg);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  overscroll-behavior: none;
}
h1, h2, h3, h4, p { margin: 0; }
button { font-family: inherit; cursor: pointer; border: none; background: none; color: inherit; }
input { font-family: inherit; }
a { color: inherit; text-decoration: none; }
ul { margin: 0; padding: 0; list-style: none; }

/* Typography helpers */
.t-display { font-size: var(--fs-28); font-weight: var(--fw-semibold); letter-spacing: var(--tracking-tight); line-height: var(--lh-tight); }
.t-title   { font-size: var(--fs-22); font-weight: var(--fw-semibold); letter-spacing: var(--tracking-tight); line-height: var(--lh-tight); }
.t-head    { font-size: var(--fs-18); font-weight: var(--fw-semibold); line-height: 1.3; }
.t-body    { font-size: var(--fs-16); font-weight: var(--fw-regular); }
.t-sub     { font-size: var(--fs-14); color: var(--text-2); }
.t-meta    { font-size: var(--fs-13); color: var(--text-2); }
.t-caption { font-size: var(--fs-12); color: var(--text-3); }
.t-num     { font-variant-numeric: tabular-nums; }
.medium    { font-weight: var(--fw-medium); }
.semibold  { font-weight: var(--fw-semibold); }

/* Layout helpers */
.row { display: flex; align-items: center; }
.between { display: flex; align-items: center; justify-content: between; justify-content: space-between; }
.col { display: flex; flex-direction: column; }
.gap-1 { gap: var(--s1); } .gap-2 { gap: var(--s2); } .gap-3 { gap: var(--s3); } .gap-4 { gap: var(--s4); }
.grow { flex: 1; min-width: 0; }
.truncate { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hidden { display: none !important; }
.center { display: flex; align-items: center; justify-content: center; }

/* Accessibility */
.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; }
:focus-visible { outline: 2px solid var(--info); outline-offset: 2px; }