/* ================================================================
   EdoGym — foglio di stile
   Strumento da palestra: tema scuro caldo, numeri mono "da display",
   colore = sensazione (non decorazione). Mobile-first, una serie alla
   volta a schermo: tipografia generosa, leggibile da lontano col
   telefono sul pavimento.
   ================================================================ */

:root {
  --bg:        #15130e;
  --bg-2:      #1d1a13;
  --card:      #23201a;
  --card-2:    #2b2720;
  --line:      #3a352b;
  --line-2:    #4a4434;
  --ink:       #efe9dc;
  --ink-dim:   #a59c89;
  --ink-faint: #6f6757;
  --brass:     #e0a21a;
  --brass-dim: #8a6a1f;

  /* scala sensazione: semantica, guida il carico */
  --f1: #6fb98f;  /* Facile  */
  --f2: #c9a227;  /* Giusto  */
  --f3: #e08a1e;  /* Duro    */
  --f4: #d1574b;  /* Limite  */

  --r: 14px;
  --r-lg: 20px;
  --mono: ui-monospace, "SF Mono", "JetBrains Mono", Menlo, Consolas, monospace;
  --sans: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

  --safe-top:    env(safe-area-inset-top);
  --safe-bottom: env(safe-area-inset-bottom);
  --actions-h: 96px;
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  font-family: var(--sans);
  background: var(--bg);
  color: var(--ink);
  line-height: 1.4;
  -webkit-font-smoothing: antialiased;
}

a { color: inherit; text-decoration: none; }

/* ============================== HOME ============================ */

.top {
  padding: calc(var(--safe-top) + 18px) 20px 16px;
  background: linear-gradient(180deg, var(--bg-2), var(--bg));
  border-bottom: 1px solid var(--line);
  display: flex; align-items: center; gap: 14px;
}
.top.sticky { position: sticky; top: 0; z-index: 20; }

.brand {
  font-weight: 700; letter-spacing: .04em; font-size: 1.5rem;
  display: flex; align-items: center; gap: 10px;
}
.brand.small { font-size: 1rem; letter-spacing: .08em; text-transform: uppercase; }
.mark { color: var(--brass); transform: translateY(1px); }
.sub { color: var(--ink-dim); font-size: .95rem; margin-top: 4px; text-transform: capitalize; }
.top-title { min-width: 0; }

.back {
  flex: none; width: 48px; height: 48px; border-radius: 50%;
  display: grid; place-items: center; font-size: 1.6rem;
  background: var(--card); border: 1px solid var(--line); color: var(--ink);
}
.back:active { background: var(--card-2); }

.wrap { max-width: 720px; margin: 0 auto; padding: 18px 16px 32px; }

.grid { display: grid; gap: 14px; margin-bottom: 14px; }
@media (min-width: 560px) { .grid { grid-template-columns: 1fr 1fr 1fr; } }

.card {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--r);
  display: block;
}
.day { padding: 22px; position: relative; overflow: hidden; min-height: 130px; }
.day::after {
  content: ""; position: absolute; right: -34px; top: -34px;
  width: 100px; height: 100px; border-radius: 50%;
  background: radial-gradient(circle, rgba(224,162,26,.18), transparent 70%);
}
.day-code {
  font-family: var(--mono); font-size: 2.6rem; font-weight: 700;
  color: var(--brass); letter-spacing: .02em; line-height: 1;
}
.day-name { font-size: 1.05rem; margin-top: 8px; }
.day-meta {
  display: flex; justify-content: space-between; gap: 8px;
  margin-top: 18px; color: var(--ink-dim); font-size: .85rem;
}
.flat {
  padding: 18px 20px; color: var(--ink-dim); font-size: 1rem;
  margin-top: 8px;
}
.flat:active { background: var(--card-2); }

/* ============================ SESSIONE ========================== */

.session-top {
  position: sticky; top: 0; z-index: 30;
  padding: calc(var(--safe-top) + 14px) 14px 14px;
  gap: 12px; flex-wrap: wrap;
}

/* strumenti a destra dell'header: data + salva */
.head-tools {
  display: flex; align-items: center; gap: 8px;
  flex: 0 0 auto;
}
.day-form { margin: 0; display: flex; align-items: center; }

/* Etichetta-pillola visibile; il vero <input type="date"> è invisibile sopra
   per mantenere il picker nativo affidabile (specie iOS Safari) e darci
   pieno controllo sul look. */
.day-pill {
  position: relative;
  display: inline-flex; align-items: center;
  background: var(--card); color: var(--ink);
  border: 1px solid var(--line); border-radius: 999px;
  padding: 0;
  min-height: 38px;
  overflow: hidden;
  cursor: pointer;
}
.day-pill.past {
  color: var(--brass);
  border-color: var(--brass-dim);
  background: rgba(224,162,26,.10);
}
.day-text {
  padding: 9px 14px;
  font-family: var(--mono); font-size: .85rem; font-weight: 800;
  letter-spacing: .04em;
  pointer-events: none;
  white-space: nowrap;
}

/* L'input nativo: invisibile ma cliccabile, sopra l'etichetta. */
.day-pill input[type="date"] {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  margin: 0; padding: 0;
  background: transparent; color: transparent;
  border: 0; outline: 0;
  font-size: 16px;            /* >=16 evita lo zoom iOS al focus */
  -webkit-appearance: none; appearance: none;
  cursor: pointer; opacity: 0;
  z-index: 2;
}
.day-pill input[type="date"]::-webkit-calendar-picker-indicator {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  opacity: 0; cursor: pointer;
}
.day-go {
  margin-left: 6px;
  background: var(--card); color: var(--ink);
  border: 1px solid var(--line); border-radius: 999px;
  padding: 8px 12px; cursor: pointer;
}

.save-mid {
  background: var(--brass-dim); color: #1a1305;
  border: none; border-radius: 999px;
  padding: 0 16px; min-height: 38px;
  font-weight: 800; font-size: .9rem; letter-spacing: .04em;
  cursor: pointer;
}
.save-mid:active { background: var(--brass); }

/* Banda "stai modificando una sessione passata" */
.past-bar {
  max-width: 640px; margin: 12px auto 0;
  padding: 10px 16px;
  background: rgba(224,162,26,.10);
  border: 1px solid var(--brass-dim);
  color: var(--brass);
  border-radius: 10px;
  font-size: .9rem;
  width: calc(100% - 32px);
  text-align: center;
}
.past-bar strong { color: var(--ink); font-family: var(--mono); }
.past-bar a {
  color: var(--ink-dim);
  border-bottom: 1px dotted var(--ink-faint);
}
.prog { flex: 1; min-width: 0; }
.prog-bar {
  height: 8px; border-radius: 999px; background: var(--card-2);
  overflow: hidden; border: 1px solid var(--line);
}
.prog-bar > i {
  display: block; height: 100%;
  background: linear-gradient(90deg, var(--brass-dim), var(--brass));
  width: 0%; transition: width .3s ease;
}
.prog-meta {
  display: flex; justify-content: space-between;
  margin-top: 6px; font-family: var(--mono);
  font-size: .8rem; color: var(--ink-faint);
  letter-spacing: .06em; text-transform: uppercase;
}
.prog-code { color: var(--brass); font-weight: 700; }

.session-form { padding: 0 0 var(--actions-h); }

.step {
  display: none;
  padding: 22px 20px 12px;
  max-width: 640px; margin: 0 auto;
}
.step.active { display: block; animation: stepIn .25s ease; }
@keyframes stepIn {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: none; }
}

/* "Esercizio 1/8 ● Serie 1/4" — alta priorità di lettura */
.step-meta {
  display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
  margin-bottom: 18px;
  font-size: 1.1rem; font-weight: 800; letter-spacing: .01em;
  color: var(--ink);
}
.step-meta .sm-block { display: inline-flex; align-items: baseline; gap: 4px; }
.step-meta b {
  font-family: var(--mono); font-weight: 800;
  color: var(--brass); font-size: 1.35em;
  letter-spacing: .02em;
}
.step-meta .sm-tot { color: var(--ink-dim); font-weight: 700; }
.step-meta .sm-dot {
  color: var(--brass-dim); font-size: .6em;
  align-self: center;
}

/* Badge superset — sopra il titolo quando questa serie fa parte di un gruppo */
.ss-badge {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  margin-bottom: 10px;
}
.ss-tag {
  display: inline-block;
  font-family: var(--mono); font-size: .72rem; font-weight: 800;
  letter-spacing: .16em; text-transform: uppercase;
  padding: 4px 10px; border-radius: 999px;
  background: rgba(224,162,26,.14);
  color: var(--brass);
  border: 1px solid var(--brass-dim);
}
.ss-with {
  font-size: .92rem; color: var(--ink-dim);
  font-weight: 600;
}
.t-rest.ss { color: var(--brass); font-weight: 700; }

.ex-name {
  margin: 0 0 12px;
  font-size: clamp(1.9rem, 7.5vw, 2.6rem);
  line-height: 1.12; letter-spacing: -.01em;
  font-weight: 800;
}

.ex-target {
  display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap;
  font-family: var(--mono); color: var(--brass);
  font-size: 1.05rem; letter-spacing: .02em;
}
.ex-target .t-sep { color: var(--ink-faint); }
.ex-target .t-rest { color: var(--ink-dim); }

.coach {
  margin: 16px 0 0;
  font-size: 1rem; color: var(--ink-dim);
  border-left: 3px solid var(--brass-dim);
  padding: 4px 0 4px 14px;
  line-height: 1.5;
}

/* Video tutorial — accesso rapido */
.video-row {
  margin: 14px 0 0;
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
}
.video-btn {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 10px 16px;
  background: #ff0033; color: #fff;
  border: 1px solid #c20023; border-radius: 12px;
  font-weight: 800; font-size: .98rem; letter-spacing: .02em;
  cursor: pointer; text-decoration: none;
}
.video-btn:active { background: #c20023; }
.video-edit {
  background: var(--card-2); color: var(--ink-dim);
  border: 1px solid var(--line); border-radius: 10px;
  padding: 8px 12px;
  font-size: .85rem; font-weight: 600;
  cursor: pointer;
}
.video-edit:active { background: var(--card); color: var(--ink); }
.video-add {
  background: var(--card); color: var(--ink-dim);
  border: 1px dashed var(--line); border-radius: 12px;
  padding: 10px 16px;
  font-size: .92rem; font-weight: 600; letter-spacing: .01em;
  cursor: pointer;
}
.video-add:active { color: var(--ink); border-color: var(--brass-dim); }

/* Link "modifica ✎" sullo storico */
.hist-edit {
  color: var(--brass);
  font-weight: 700; font-size: .9rem;
  border-bottom: 1px dotted var(--brass-dim);
  white-space: nowrap;
}
.hist-delete {
  color: var(--f4);
  font-weight: 700; font-size: .9rem;
  border-bottom: 1px dotted var(--f4);
  white-space: nowrap;
  background: none; border-left: none; border-top: none; border-right: none;
  padding: 0; cursor: pointer; font-family: inherit;
}

/* Form di delete: vive nella head-tools solo per fornire il submit al pulsante 🗑 */
.delete-form-hidden { display: none; }

/* Pulsante elimina, accanto a Salva */
.del-mid {
  background: rgba(209,87,75,.10);
  color: var(--f4);
  border: 1px solid var(--f4);
  border-radius: 999px;
  min-height: 38px; min-width: 42px;
  padding: 0 12px;
  font-size: 1rem; font-weight: 800;
  cursor: pointer; line-height: 1;
}
.del-mid:active { background: rgba(209,87,75,.25); color: var(--ink); }

/* --- "Ultima volta" — la card che batte oggi ----------------- */
.last-card {
  margin: 22px 0 24px;
  background: var(--card);
  border: 1px solid var(--line);
  border-left: 5px solid var(--line-2);
  border-radius: var(--r-lg);
  padding: 18px 20px 16px;
}
.last-card.f1, .last-head.f1 { border-left-color: var(--f1); }
.last-card.f2, .last-head.f2 { border-left-color: var(--f2); }
.last-card.f3, .last-head.f3 { border-left-color: var(--f3); }
.last-card.f4, .last-head.f4 { border-left-color: var(--f4); }
.last-card:has(.last-head.f1) { border-left-color: var(--f1); }
.last-card:has(.last-head.f2) { border-left-color: var(--f2); }
.last-card:has(.last-head.f3) { border-left-color: var(--f3); }
.last-card:has(.last-head.f4) { border-left-color: var(--f4); }

.last-head {
  font-family: var(--mono); font-size: .78rem;
  letter-spacing: .12em; text-transform: uppercase;
  color: var(--ink-dim);
}
.last-head.empty { color: var(--ink-faint); }
.last-vals {
  display: flex; align-items: baseline; gap: 14px;
  margin-top: 10px;
  font-size: clamp(2.4rem, 9vw, 3.1rem);
  font-weight: 700; letter-spacing: .01em; line-height: 1;
}
.last-vals .lv { display: inline-flex; align-items: baseline; gap: 4px; }
.last-vals small {
  font-size: .42em; color: var(--ink-faint);
  font-weight: 600; margin-left: 2px;
}
.last-vals .lv-x { color: var(--ink-faint); font-weight: 400; }
.last-vals.empty { color: var(--ink-faint); }
.last-feel {
  margin-top: 8px;
  font-size: .9rem; font-weight: 700; letter-spacing: .06em;
  text-transform: uppercase;
}
.last-feel.f1 { color: var(--f1); }
.last-feel.f2 { color: var(--f2); }
.last-feel.f3 { color: var(--f3); }
.last-feel.f4 { color: var(--f4); }
.last-note {
  margin-top: 6px; color: var(--ink-faint);
  font-size: .9rem;
}

/* --- "Oggi" inputs giganti ----------------------------------- */
.today { margin: 8px 0 28px; }
.t-label {
  font-family: var(--mono); font-size: .78rem;
  letter-spacing: .12em; text-transform: uppercase;
  color: var(--ink-faint); margin-bottom: 10px;
}

.big-inputs {
  display: grid; grid-template-columns: 1fr 1fr; gap: 12px;
}
.bi-cell {
  position: relative;
  background: var(--card-2);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  padding: 10px 6px 14px;
  transition: border-color .15s, background .15s;
}
.bi-cell:focus-within {
  border-color: var(--brass);
  background: #322d23;
}
.bi {
  display: block; width: 100%;
  background: transparent; border: none; color: var(--ink);
  font-family: var(--mono);
  font-size: clamp(3rem, 13vw, 4.4rem);
  font-weight: 700; line-height: 1;
  text-align: center; padding: 8px 0 0;
  -moz-appearance: textfield;
  outline: none;
}
.bi::placeholder { color: var(--ink-faint); opacity: .55; }
.bi::-webkit-outer-spin-button, .bi::-webkit-inner-spin-button {
  -webkit-appearance: none; margin: 0;
}
.bi-unit {
  display: block; text-align: center;
  margin-top: 6px;
  font-family: var(--mono); font-size: .82rem;
  letter-spacing: .14em; text-transform: uppercase;
  color: var(--ink-faint);
}

.delta-big {
  text-align: center; margin-top: 14px; min-height: 1.4em;
  font-family: var(--mono); font-weight: 700;
  font-size: clamp(1.15rem, 4.5vw, 1.4rem);
  letter-spacing: .02em;
  color: transparent;
}
.delta-big.up   { color: var(--f1); }
.delta-big.down { color: var(--f4); }
.delta-big.eq   { color: var(--ink-faint); }

/* --- Sensazione: 4 pulsanti grandi --------------------------- */
.feel-block { margin-bottom: 16px; }
.feel.big {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px;
}
.feel.big input { position: absolute; opacity: 0; pointer-events: none; }
.feel.big .fb {
  display: block; text-align: center;
  padding: 16px 4px;
  border-radius: 14px; cursor: pointer;
  background: var(--card); border: 1px solid var(--line);
  color: var(--ink-dim);
  font-weight: 700; font-size: .95rem;
  letter-spacing: .02em;
  user-select: none;
  transition: transform .08s ease, border-color .15s, background .15s;
}
.feel.big .fb:active { transform: scale(.97); }
.feel.big .fb.f1.on { background: var(--f1); color: #0c130e; border-color: var(--f1); }
.feel.big .fb.f2.on { background: var(--f2); color: #14110a; border-color: var(--f2); }
.feel.big .fb.f3.on { background: var(--f3); color: #160d04; border-color: var(--f3); }
.feel.big .fb.f4.on { background: var(--f4); color: #160807; border-color: var(--f4); }

@media (max-width: 360px) {
  .feel.big .fb { font-size: .82rem; padding: 14px 2px; }
}

/* --- Step finale (sessione completa) ------------------------- */
.step-end {
  text-align: center;
  padding-top: 40px;
}
.step-end .ex-name { margin-bottom: 22px; }
.end-stats {
  font-size: 1.1rem; color: var(--brass);
  letter-spacing: .06em;
  margin-bottom: 12px;
}
.end-line {
  font-size: 1rem; color: var(--ink-dim);
  margin: 0 auto; max-width: 360px;
}

/* --- Toast salvataggio --------------------------------------- */
.toast {
  max-width: 640px; margin: 12px auto 0;
  padding: 14px 18px;
  background: rgba(111,185,143,.12); border: 1px solid var(--f1);
  color: var(--f1); border-radius: 12px;
  font-size: 1rem; font-weight: 600;
  width: calc(100% - 32px);
  text-align: center;
}
.toast-warn {
  background: rgba(209,87,75,.10);
  border-color: var(--f4);
  color: var(--f4);
}

/* --- Barra azioni inferiore ---------------------------------- */
.actions {
  position: fixed; left: 0; right: 0;
  bottom: 0;
  padding: 12px 14px calc(var(--safe-bottom) + 14px);
  background: linear-gradient(180deg, transparent, var(--bg) 30%);
  display: grid; grid-template-columns: 56px 1fr 56px; gap: 10px;
  z-index: 25;
}
.act-prev {
  height: 64px; border-radius: 18px;
  background: var(--card); border: 1px solid var(--line);
  color: var(--ink); font-size: 1.6rem; cursor: pointer;
}
.act-prev:active { background: var(--card-2); }
.act-prev:disabled { opacity: .35; }

.act-next {
  display: flex; flex-direction: column; justify-content: center; align-items: center;
  gap: 2px;
  height: 64px; border-radius: 18px;
  background: var(--brass); color: #1a1305;
  border: none; cursor: pointer;
  font-weight: 800; letter-spacing: .02em;
  box-shadow: 0 10px 26px rgba(0,0,0,.5), 0 0 0 1px rgba(224,162,26,.4);
}
.act-next:active { transform: scale(.985); }
.act-next .an-label { font-size: 1.15rem; }
.act-next .an-sub {
  font-size: .78rem; opacity: .8; font-weight: 700;
  letter-spacing: .06em; text-transform: uppercase;
}

.act-skip-ex {
  height: 64px; border-radius: 18px;
  background: var(--card); border: 1px solid var(--line);
  color: var(--ink); font-size: 1.4rem; font-weight: 700;
  cursor: pointer; line-height: 1;
}
.act-skip-ex:active { background: var(--card-2); }
.act-skip-ex:disabled { opacity: .25; }

.act-save {
  grid-column: 2 / -1;
  height: 64px; border-radius: 18px;
  background: var(--brass); color: #1a1305;
  border: none; cursor: pointer;
  font-weight: 800; font-size: 1.2rem; letter-spacing: .02em;
  box-shadow: 0 10px 26px rgba(0,0,0,.5), 0 0 0 1px rgba(224,162,26,.4);
}

/* quando "fine sessione" la grid diventa prev + save (niente next/skip-ex) */
.actions.end { grid-template-columns: 56px 1fr; }
.actions.end .act-next,
.actions.end .act-skip-ex { display: none; }
.actions.end .act-save { display: block; grid-column: auto; }

/* ====================== TIMER DI RIPOSO ========================= */

.rest {
  position: fixed; inset: 0;
  background: var(--bg);
  z-index: 60;
  display: flex; flex-direction: column;
  align-items: stretch;
  padding: calc(var(--safe-top) + 28px) 20px calc(var(--safe-bottom) + 24px);
  animation: restIn .25s ease;
}
.rest.hidden { display: none; }
@keyframes restIn {
  from { opacity: 0; transform: scale(.98); }
  to   { opacity: 1; transform: none; }
}

.rest-head {
  display: flex; justify-content: space-between; align-items: center;
  font-family: var(--mono); font-size: .85rem;
  letter-spacing: .14em; text-transform: uppercase;
  color: var(--ink-faint);
}
.rest-close {
  background: none; border: none; color: var(--ink-dim);
  font-size: 1.5rem; padding: 4px 8px; cursor: pointer;
}

.rest-clock {
  flex: 1;
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  gap: 16px;
}
.rest-time {
  font-family: var(--mono); font-weight: 800;
  font-size: clamp(7rem, 32vw, 12rem);
  line-height: 1; letter-spacing: -.02em;
  font-variant-numeric: tabular-nums;
}
.rest-bar {
  width: min(82%, 420px); height: 6px;
  background: var(--card-2); border-radius: 999px; overflow: hidden;
  border: 1px solid var(--line);
}
.rest-bar > i {
  display: block; height: 100%; width: 100%;
  background: var(--brass); transition: width 1s linear;
}
.rest.paused .rest-time { color: var(--ink-dim); }

.rest-ctls {
  display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 10px;
  max-width: 420px; width: 100%; margin: 0 auto 22px;
}
.rest-ctl {
  height: 60px; border-radius: 16px;
  background: var(--card); color: var(--ink);
  border: 1px solid var(--line);
  font-family: var(--mono); font-weight: 700; font-size: 1.1rem;
  cursor: pointer;
}
.rest-ctl:active { background: var(--card-2); }
.rest-pause { letter-spacing: .04em; }

/* Preview prossima serie */
.rest-next {
  background: var(--card); border: 1px solid var(--line);
  border-radius: var(--r-lg);
  padding: 14px 18px; margin: 0 auto 16px;
  max-width: 420px; width: 100%;
  text-align: center;
}
.rest-next-label {
  font-family: var(--mono); font-size: .75rem;
  letter-spacing: .14em; text-transform: uppercase;
  color: var(--ink-faint);
}
.rest-next-text {
  font-size: 1.15rem; font-weight: 700; margin-top: 4px;
  color: var(--ink);
}

/* SALTA RIPOSO — l'azione "tracciamo già la prossima" */
.rest-skip {
  display: block; width: 100%;
  max-width: 420px; margin: 0 auto;
  height: 64px; border-radius: 18px;
  background: var(--brass); color: #1a1305;
  border: none; cursor: pointer;
  font-weight: 800; font-size: 1.15rem;
  letter-spacing: .02em;
  box-shadow: 0 10px 26px rgba(0,0,0,.45), 0 0 0 1px rgba(224,162,26,.35);
}
.rest-skip:active { transform: scale(.985); }
.rest-skip .rs-sub {
  display: block; margin-top: 2px;
  font-size: .78rem; opacity: .8;
  text-transform: uppercase; letter-spacing: .08em;
}

/* fine riposo: tutto verde "VAI" */
.rest.done .rest-time { color: var(--f1); }
.rest.done .rest-bar > i { background: var(--f1); width: 100% !important; }
.rest.done .rest-skip { background: var(--f1); color: #0c130e; box-shadow: 0 10px 26px rgba(0,0,0,.45), 0 0 0 1px rgba(111,185,143,.4); }

/* ============================= STORICO ========================== */
.hist-title { margin: 4px 0 16px; font-size: 1.5rem; }
.hist-group {
  margin: 26px 0 10px; font-family: var(--mono); font-size: .85rem;
  letter-spacing: .08em; text-transform: uppercase; color: var(--brass);
}
.spark { color: var(--brass); margin: 6px 0 22px; }
.spark svg { width: 100%; height: 110px; display: block; }
.spark circle { fill: var(--brass); }
table.hist { width: 100%; border-collapse: collapse; font-size: 1rem; }
table.hist th {
  text-align: left; color: var(--ink-faint); font-weight: 700;
  font-size: .78rem; text-transform: uppercase; letter-spacing: .06em;
  padding: 10px 12px; border-bottom: 1px solid var(--line);
}
table.hist td { padding: 14px 12px; border-bottom: 1px solid var(--line); }
.mono { font-family: var(--mono); }
.empty-state {
  color: var(--ink-dim); font-size: 1rem; background: var(--card);
  border: 1px dashed var(--line); border-radius: var(--r); padding: 20px;
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; animation: none !important; }
}