/* Stats summary (ui/summary.js): DofusBook-style cards, light mode, page tokens from style.css. */
.stuff-summary {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr));
  gap: 10px; align-items: start; margin-top: 12px;
}
.stuff-summary .ss-card {
  background: var(--panel, #fff); border: 1px solid var(--line, #dcdcd8); border-radius: 12px;
  padding: 8px 10px 10px; container-type: inline-size; min-width: 0;
}
.stuff-summary .ss-c2 { grid-column: span 1; }
.stuff-summary .ss-h { font-size: 12px; font-weight: 600; color: var(--muted, #6b6b70); text-transform: uppercase; letter-spacing: .04em; margin: 0 0 6px; }
.stuff-summary .ss-list { display: grid; grid-template-columns: 1fr; column-gap: 12px; row-gap: 1px; }
@container (min-width: 300px) { .stuff-summary .ss-list { grid-template-columns: 1fr 1fr; } }
.stuff-summary .ss-row { display: flex; align-items: center; gap: 5px; min-width: 0; padding: 2px 0; font-size: 13px; line-height: 18px; }
.stuff-summary .ss-v { font-weight: 700; font-variant-numeric: tabular-nums; min-width: 3.2em; text-align: right; }
.stuff-summary .ss-v small { font-weight: 600; font-size: 11px; margin-left: 1px; }
.stuff-summary .ss-ic { width: 16px; height: 16px; flex: 0 0 16px; display: inline-block; vertical-align: middle; }
.stuff-summary .ss-l { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.stuff-summary .ss-exo { font-size: 10px; font-weight: 700; line-height: 14px; padding: 0 5px; border-radius: 7px; background: var(--chip, #eef1fb); color: var(--accent, #3559c7); }
.stuff-summary .ss-zero, .stuff-summary .ss-zero .ss-v { color: var(--muted, #6b6b70); font-weight: 400; }
.stuff-summary .ss-zero .ss-ic { opacity: .45; }
.stuff-summary .ss-tbl { width: 100%; border-collapse: collapse; font-size: 13px; font-variant-numeric: tabular-nums; }
.stuff-summary .ss-tbl th, .stuff-summary .ss-tbl td { padding: 2px 4px; text-align: right; white-space: nowrap; }
.stuff-summary .ss-tbl thead th { font-size: 11px; font-weight: 600; color: var(--muted, #6b6b70); }
.stuff-summary .ss-tbl tbody th { text-align: left; font-weight: 400; display: flex; align-items: center; gap: 5px; }
.stuff-summary .ss-tbl td.ss-v { font-weight: 700; min-width: 0; }
.stuff-summary .ss-tbl td.ss-zero { color: var(--muted, #6b6b70); font-weight: 400; }
.stuff-summary .ss-tbl tbody tr + tr > * { border-top: 1px solid var(--line, #dcdcd8); }

/* short summary + folded full cards (no overflow in the narrow left column) */
.stuff-summary details.ss-all > summary { cursor: pointer; color: var(--muted, #6b6b70); font-size: 12px; margin: 2px 0 4px; }
.stuff-summary .ss-scroll { overflow-x: auto; }
.stuff-summary .ss-tbl { width: 100%; font-size: 12px; }
.stuff-summary .ss-tbl th, .stuff-summary .ss-tbl td { padding: 1px 3px; }

.stuff-summary .ss-resgrid { display: grid; grid-template-columns: 1fr 1fr; gap: 2px 10px; margin-top: 6px; padding-top: 6px; border-top: 1px solid var(--line, #dcdcd8); }
.stuff-summary .ss-resgrid + .ss-resgrid { border-top: 0; padding-top: 0; margin-top: 2px; }
.stuff-summary .ss-res { display: inline-flex; align-items: center; gap: 4px; font-weight: 700; font-variant-numeric: tabular-nums; }
.stuff-summary .ss-res.ss-zero { opacity: .45; }

.stuff-summary .ss-grid4 { display: grid; grid-template-columns: 1fr 1fr; gap: 0 8px; }

/* 2x2 PA/PO PM/Invo: compact value column, labels always visible, small exo badge (the owner: PO / Invo were off-centre) */
.stuff-summary .ss-grid4 { grid-template-columns: max-content max-content; column-gap: 18px; justify-content: start; padding-left: 4px; }
.stuff-summary .ss-grid4 .ss-v { min-width: 1.6em; }
.stuff-summary .ss-grid4 .ss-l { overflow: visible; }
.stuff-summary .ss-grid4 .ss-exo { font-size: 9px; padding: 0 4px; line-height: 13px; }

/* "Affichage Duffus" (owner 2026-10-16): darker rounded cards, lime caps titles; only under :root[data-view="duffus"] */
:root[data-view="duffus"] .stuff-summary .ss-card { background: var(--dx-card2, #232422); border: 1px solid rgba(255, 255, 255, .05); border-radius: 16px; padding: 10px 12px 12px; }
:root[data-view="duffus"] .stuff-summary .ss-h { color: var(--accent); font-size: 11px; font-weight: 700; letter-spacing: .08em; }
:root[data-view="duffus"] .stuff-summary .ss-v { color: #fff; }
:root[data-view="duffus"] .stuff-summary .ss-zero, :root[data-view="duffus"] .stuff-summary .ss-zero .ss-v, :root[data-view="duffus"] .stuff-summary .ss-tbl td.ss-zero { color: var(--muted); }
:root[data-view="duffus"] .stuff-summary .ss-exo { background: rgba(183, 220, 105, .16); color: var(--accent); }
:root[data-view="duffus"] .stuff-summary .ss-tbl tbody tr + tr > *, :root[data-view="duffus"] .stuff-summary .ss-resgrid { border-top-color: rgba(255, 255, 255, .07); }
:root[data-view="duffus"] .stuff-summary details.ss-all > summary { color: var(--muted); }

/* condensed summary in the history window cards (summary.js compact, owner 2026-10-16) */
.stuff-mini { display: flex; flex-direction: column; gap: 4px; color: var(--text); }
.stuff-mini .sm-sec { display: grid; grid-template-columns: repeat(auto-fill, minmax(92px, 1fr)); gap: 0 8px; }
.stuff-mini .sm-sec + .sm-sec, .stuff-mini .ss-resgrid { border-top: 1px solid var(--line, #dcdcd8); padding-top: 4px; }
.stuff-mini .sm-peaks { grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); }
.stuff-mini .ss-row { display: flex; align-items: center; gap: 4px; min-width: 0; font-size: 12px; line-height: 17px; }
.stuff-mini .ss-v { font-weight: 700; font-variant-numeric: tabular-nums; }
.stuff-mini .ss-v small { font-size: 10px; font-weight: 600; }
.stuff-mini .ss-ic { width: 14px; height: 14px; flex: 0 0 14px; display: inline-block; }
.stuff-mini .ss-l { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--muted, #6b6b70); }
.stuff-mini .ss-exo { font-size: 9px; font-weight: 700; line-height: 13px; padding: 0 4px; border-radius: 7px; background: var(--chip, #eef1fb); color: var(--accent, #3559c7); }
.stuff-mini .ss-zero, .stuff-mini .ss-zero .ss-v { color: var(--muted, #6b6b70); font-weight: 400; }
.stuff-mini .ss-zero .ss-ic { opacity: .45; }
.stuff-mini .ss-resgrid { display: grid; grid-template-columns: repeat(4, max-content); gap: 0 12px; font-size: 12px; }
.stuff-mini .ss-res { display: inline-flex; align-items: center; gap: 3px; font-weight: 700; font-variant-numeric: tabular-nums; }
.stuff-mini .ss-res.ss-zero { opacity: .45; }
/* history window (owner 2026-10-16): key stats on one line, the rest behind "détails" */
.stuff-mini .sm-main { display: flex; flex-wrap: wrap; gap: 0 10px; }
.stuff-mini .sm-main .ss-row { flex: none; }
/* the stat icon says it (PdV heart, PA star...): the name stays for screen readers only */
.stuff-mini .sm-main img.ss-ic + .ss-l { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.stuff-mini details.sm-more > summary { cursor: pointer; font-size: 11px; color: var(--muted, #6b6b70); width: max-content; }
.stuff-mini details.sm-more[open] { display: flex; flex-direction: column; gap: 4px; }
.stuff-mini details.sm-more[open] > summary { margin-bottom: 0; }
.stuff-mini .sm-sub { display: flex; flex-wrap: wrap; gap: 0 10px; }
.stuff-mini .sm-main + .sm-more .sm-sub { border-top: 0; }
:root[data-view="duffus"] .stuff-mini .ss-v, :root[data-view="duffus"] .stuff-mini .ss-res { color: #fff; }
:root[data-view="duffus"] .stuff-mini .ss-zero .ss-v { color: var(--muted); }
:root[data-view="duffus"] .stuff-mini .sm-sec + .sm-sec, :root[data-view="duffus"] .stuff-mini .ss-resgrid { border-top-color: rgba(255, 255, 255, .07); }
:root[data-view="duffus"] .stuff-mini .ss-exo { background: rgba(183, 220, 105, .16); color: var(--accent); }
/* exo tags are switches in the left summary card (owner 2026-10-17) */
.stuff-summary button.ss-exo { border: 1px solid transparent; cursor: pointer; font-family: inherit; }
.stuff-summary button.ss-exo.off { background: transparent; color: var(--muted, #888); border-color: var(--line, #ccc); opacity: .7; }
.stuff-summary button.ss-exo:hover { border-color: var(--accent, #3559c7); opacity: 1; }
.stuff-mini button.ss-exo.off { display: none; }
