/* Shared structure; each edition supplies its own surface and ink. */
html body #sizeTracker {
    --tracker-surface: #14141c;
    --tracker-border: #343440;
    --tracker-ink: #eeeef4;
    --tracker-muted: #b0b0c0;
    --tracker-track: #30303d;
    --tracker-accent: var(--accent, #ff69b4);
    display: grid;
    grid-template-columns: 24px minmax(0, 1fr) auto;
    align-items: center;
    gap: 6px 10px;
    width: max-content;
    max-width: 100%;
    min-width: 0;
    padding: 10px 12px;
    border: 1px solid var(--tracker-border) !important;
    border-radius: 10px;
    background: var(--tracker-surface) !important;
    color: var(--tracker-ink) !important;
    font-family: inherit;
    font-size: 12px;
    line-height: 1.4;
    box-shadow: none;
    transition: opacity .25s ease, transform .25s ease;
}
html body.gallery-light #sizeTracker {
    --tracker-surface: #f3f3ec;
    --tracker-border: #d5d8cb;
    --tracker-ink: #30392b;
    --tracker-muted: #606957;
    --tracker-track: #dce0d2;
    --tracker-accent: #647a51;
    border-radius: 6px;
}
html body #sizeTracker .size-tracker-icon {
    grid-column: 1; grid-row: 1 / 3;
    width: 24px; height: 24px;
    background: transparent;
    border-radius: 0;
}
html body #sizeTracker .size-tracker-icon svg {width: 16px; height: 16px; color: var(--tracker-accent); opacity: 1}
html body #sizeTracker #sizeText {grid-column: 2; color: var(--tracker-ink); font-family: inherit; font-weight: 500; font-size: 11px; line-height: 1.5; font-variant-numeric: tabular-nums; white-space: normal; overflow-wrap: anywhere}
html body #sizeTracker #sizeImgCount {display: block; grid-column: 3; color: var(--tracker-muted); font-size: 11px; line-height: 1.5; font-variant-numeric: tabular-nums; white-space: normal; text-align: right}
html body #sizeTracker #sizeSep, html body #sizeTracker #sizeSpeed {display: none}
html body #sizeTracker .size-tracker-bar {grid-column: 2 / 4; width: 100%; height: 3px; margin: 0; opacity: 1; background: var(--tracker-track); border-radius: 2px}
html body #sizeTracker .size-tracker-fill {background: var(--tracker-accent); border-radius: 2px; transition: width .25s ease}
html body #sizeTracker .size-tracker-fill::after {display: none}
html body #sizeTracker.bye {opacity: 0; pointer-events: none; transform: translateY(-4px)}
@media (max-width: 768px) {
    html body #sizeTracker {width: 100%; margin: 0; padding: 9px 11px; min-height: 44px}
}
@media (prefers-reduced-motion: reduce) {
    html body #sizeTracker, html body #sizeTracker .size-tracker-fill {transition: none}
}