.admin-layout { display: grid; gap: var(--space-5); }
@media (min-width: 900px) { .admin-layout { grid-template-columns: 12rem minmax(0, 1fr); } }
.admin-nav { display: flex; flex-direction: column; gap: var(--space-1); }
@media (max-width: 899px) { .admin-nav { flex-direction: row; flex-wrap: wrap; } }
.admin-nav a { padding: 0.4rem 0.6rem; border-radius: var(--radius-small); text-decoration: none; color: var(--color-ink-soft); }
.admin-nav a[aria-current="page"], .admin-nav a:hover { background: var(--color-surface-sunken); color: var(--color-ink); }
.stat-grid { display: grid; gap: var(--space-3); grid-template-columns: repeat(auto-fill, minmax(11rem, 1fr)); margin-block-end: var(--space-6); }
.stat-card { background: var(--color-surface); border: 1px solid var(--color-line); border-radius: var(--radius); padding: var(--space-4); text-decoration: none; color: var(--color-ink); }
.stat-card strong { display: block; font-size: 1.8rem; line-height: 1.1; }
.stat-card span { color: var(--color-ink-faint); font-size: 0.85rem; }
.stat-card--alert strong { color: var(--color-danger); }
.moderation-form { display: flex; flex-wrap: wrap; gap: var(--space-2); align-items: center; }
.moderation-form input[type="text"] { min-width: 14rem; flex: 1; }

/* Quick moderation buttons in the admin lists; the row flashes after a change made without reloading. */
#flash:empty { display: none; }
.row-actions { display: flex; flex-wrap: wrap; gap: var(--space-1); }
.row-actions form { margin: 0; }
@keyframes admin-row-updated { from { background: var(--color-accent-soft, #fff3c4); } to { background: transparent; } }
tr.is-updated td { animation: admin-row-updated 1.6s ease-out; }

/* Library tab of the admin scripts list: category path and sub-category chips with script counts. */
.category-browser { display: grid; gap: var(--space-3); margin-block-end: var(--space-4); }
.category-browser__path { display: flex; flex-wrap: wrap; gap: var(--space-1); list-style: none; margin: 0; padding: 0; font-size: 0.95rem; }
.category-browser__path li + li::before { content: "›"; margin-inline-end: var(--space-1); color: var(--color-ink-soft); }
.category-browser__path a[aria-current="page"] { font-weight: 600; color: var(--color-ink); text-decoration: none; }
.category-browser__children { display: flex; flex-wrap: wrap; gap: var(--space-2); list-style: none; margin: 0; padding: 0; }
.category-chip { display: inline-flex; align-items: center; gap: var(--space-1); padding: 0.35rem 0.75rem; border: 1px solid var(--color-line); border-radius: 999px; text-decoration: none; color: var(--color-ink); background: var(--color-surface); }
.category-chip:hover { border-color: var(--color-accent); }

/* Analytics: stat tiles, visits per day (one series, accent colour, no legend) and bar lists. */
.analytics-filters { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-3); margin-block-end: var(--space-4); }
.analytics-filters .tabs { margin-block-end: 0; }
.stat-tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr)); gap: var(--space-3); margin-block-end: var(--space-4); }
.stat-tile { display: grid; gap: var(--space-1); padding: var(--space-3) var(--space-4); border: 1px solid var(--color-line); border-radius: var(--radius); background: var(--color-surface); }
.stat-tile__label { color: var(--color-ink-soft); font-size: 0.85rem; }
.stat-tile__value { font-size: 1.6rem; font-variant-numeric: tabular-nums; }
.analytics-card { margin-block-end: var(--space-4); }
.analytics-card h2 { font-size: 1rem; margin-block: 0 var(--space-3); }
.analytics-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 18rem), 1fr)); gap: var(--space-4); }
.analytics-grid .analytics-card { margin: 0; }
.day-chart { display: grid; gap: var(--space-1); margin-block-end: var(--space-3); }
.day-chart__bars { display: flex; align-items: flex-end; gap: 2px; height: 10rem; border-block-end: 1px solid var(--color-line); }
.day-chart__bar { position: relative; flex: 1 1 0; min-width: 2px; height: var(--bar-share); background: var(--color-accent); border-radius: 4px 4px 0 0; }
.day-chart__bar--empty { height: 0; }
.day-chart__bar::before { content: ""; position: absolute; inset: -10rem -1px 0; }
.day-chart__bar:hover { filter: brightness(0.85); }
.day-chart__bar:hover::after { content: attr(data-tooltip); position: absolute; bottom: calc(100% + 0.4rem); left: 50%; transform: translateX(-50%); padding: 0.25rem 0.5rem; border-radius: var(--radius-small); background: var(--color-ink); color: var(--color-surface); font-size: 0.75rem; white-space: nowrap; z-index: 2; pointer-events: none; }
.day-chart__axis { display: flex; justify-content: space-between; }
.bar-list { display: grid; gap: var(--space-2); list-style: none; margin: 0; padding: 0; }
.bar-list__row { display: grid; grid-template-columns: 1fr auto; gap: 0.15rem var(--space-2); font-size: 0.9rem; }
.bar-list__label { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bar-list__value { font-variant-numeric: tabular-nums; color: var(--color-ink-soft); }
.bar-list__bar { grid-column: 1 / -1; height: 6px; width: var(--bar-share); min-width: 2px; background: var(--color-accent); border-radius: 0 4px 4px 0; }
.table--compact td, .table--compact th { padding-block: 0.35rem; font-size: 0.85rem; }