:root {
    --color-bg: #f5f7fa;
    --color-surface: #fff;
    --color-text: #243447;
    --color-heading: #172033;
    --color-muted: #64748b;
    --color-border: #dce3eb;
    --color-primary: #1769aa;
    --color-primary-hover: #0f4f83;
    --color-added: #087f5b;
    --color-removed: #c92a2a;
    --color-community: #6d28d9;
    --radius: .5rem;
    --shadow: 0 1px 3px rgb(15 23 42 / .09);
    --content-width: 75rem;
    --reading-width: 64rem;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
    margin: 0;
    color: var(--color-text);
    background: var(--color-bg);
    font: 1rem/1.55 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
a { color: var(--color-primary); }
a:hover { color: var(--color-primary-hover); }
a:focus-visible, button:focus-visible, summary:focus-visible {
    outline: 3px solid rgb(23 105 170 / .35);
    outline-offset: 3px;
}
.container {
    width: min(100%, var(--content-width));
    margin-inline: auto;
    padding-inline: clamp(.75rem, 3vw, 2rem);
}
.year-page .container { max-width: var(--reading-width); }
.site-header {
    padding-block: 2rem;
    text-align: center;
}
.site-brand { display: inline-block; margin-bottom: .25rem; font-weight: 650; text-decoration: none; }
.title { margin: 0 0 .5rem; color: var(--color-heading); font-size: 2.5rem; line-height: 1.15; }
.year-page .title { font-size: 2rem; }
.subtitle { margin: 0 0 1rem; color: var(--color-muted); font-size: 1.1rem; }
.page-nav { display: flex; flex-wrap: wrap; justify-content: center; gap: .5rem; margin-top: 1rem; }
.nav-link, .development-link {
    display: inline-flex; align-items: center; justify-content: center;
    min-height: 2.5rem; padding: .5rem .9rem; border: 1px solid var(--color-border);
    border-radius: var(--radius); color: var(--color-primary); background: var(--color-surface);
    font-weight: 600; text-decoration: none;
}
.nav-link:hover, .development-link:hover { border-color: var(--color-primary); background: #eef6fc; }
.nav-link-primary, .development-link { color: #fff; border-color: var(--color-primary); background: var(--color-primary); }
.nav-link-primary:hover, .development-link:hover { color: #fff; background: var(--color-primary-hover); }

.chart-container, .commit-card, .release-card, .section, .summary, .year-item, .stat-card, .no-data {
    border: 1px solid var(--color-border); border-radius: var(--radius);
    background: var(--color-surface); box-shadow: var(--shadow);
}
.chart-container { padding: 2rem; margin-bottom: 2rem; text-align: center; }
.chart-container h2, .chart-container h3 { margin: 0 0 1.5rem; color: var(--color-heading); font-size: 1.5rem; }
.chart-wrapper { position: relative; width: 100%; max-width: 55rem; min-height: 18rem; margin: auto; }
.chart-note { color: var(--color-muted); font-size: .875rem; }
.summary, .stats-grid {
    display: grid; grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr));
    gap: 1.5rem; margin-bottom: 2rem;
}
.summary { gap: .75rem; padding: .75rem; background: #eef2f6; }
.summary-item, .stat-item, .stat-group { min-width: 0; text-align: center; }
.summary-item {
    display: flex; min-height: 5.5rem; padding: 1rem .75rem; border: 1px solid var(--color-border);
    border-top: 3px solid #94a3b8; border-radius: .4rem; background: var(--color-surface);
    align-items: center; flex-direction: column; justify-content: center;
}
.summary-item strong, .stat-number, .stat-value { display: block; color: var(--color-heading); font-size: 1.25rem; font-weight: 750; }
.summary-item strong { margin-bottom: .3rem; font-size: 1.4rem; font-variant-numeric: tabular-nums; line-height: 1.15; }
.summary-item small, .stat-label, .stat-desc { color: var(--color-muted); font-size: .82rem; text-transform: uppercase; letter-spacing: .04em; }
.summary-item-commits { border-top-color: var(--color-primary); }
.summary-item-releases { border-top-color: var(--color-community); }
.summary-item-added { border-top-color: var(--color-added); background: #f4fbf8; }
.summary-item-added strong { color: var(--color-added); }
.summary-item-removed { border-top-color: var(--color-removed); background: #fff7f7; }
.summary-item-removed strong { color: var(--color-removed); }
.summary-item-net { border-top-color: var(--color-primary); background: #f5f9fd; }
.summary-item-net strong { color: var(--color-primary); }
.summary-item-net.is-negative { border-top-color: var(--color-removed); background: #fff7f7; }
.summary-item-net.is-negative strong { color: var(--color-removed); }
.stat-card { padding: 1rem 1.25rem; }
.stat-card h3 { margin: 0 0 .8rem; color: var(--color-heading); font-size: 1rem; }
.stat-values { display: grid; grid-template-columns: repeat(3, 1fr); gap: .75rem; }

.years-list { display: grid; gap: .65rem; margin-bottom: 2rem; }
.year-item { display: flex; align-items: center; gap: 1rem; padding: 1rem 1.25rem; }
.year-item:hover { border-color: #b9c8d8; }
.year-link { min-width: 6rem; color: var(--color-primary); font-size: 1.2rem; font-weight: 750; text-decoration: none; }
.year-stats { display: grid; grid-template-columns: repeat(5, minmax(5rem, auto)); align-items: center; gap: clamp(.75rem, 3vw, 2rem); margin-left: auto; }
.commits-badge, .releases-badge, .tag-badge { display: inline-block; padding: .2rem .65rem; border-radius: 999px; color: #fff; background: var(--color-primary); font-size: .82rem; font-weight: 700; }
.releases-badge { background: var(--color-added); }
.tag-badge { margin-left: .4rem; border-radius: .3rem; font-size: .72rem; }
.bg-success { background: #218838; } .bg-info { background: #087f8c; } .bg-danger { background: #c92a2a; }
.bg-warning { color: #2b2b2b; background: #f6c344; } .bg-primary { background: #1769aa; }
.bg-secondary { background: #596579; } .bg-dark { background: #30343b; }
.current-release { border-left: 4px solid var(--color-community); }
.current-release .year-link { color: var(--color-community); }
.current-release .commits-badge { background: var(--color-community); }
.range-info { color: var(--color-muted); font: .8rem ui-monospace, SFMono-Regular, Consolas, monospace; }

.tabs { display: flex; gap: .25rem; margin: 1.5rem 0 0; border-bottom: 1px solid var(--color-border); }
.tab-button { flex: 1; padding: .8rem 1rem; border: 0; border-bottom: 3px solid transparent; color: var(--color-muted); background: transparent; font: inherit; font-weight: 650; cursor: pointer; }
.tab-button:hover { color: var(--color-heading); background: #edf3f8; }
.tab-button.active { color: var(--color-primary); border-bottom-color: var(--color-primary); }
.tab-content { padding-block: 1.25rem; }
.js .tab-content[hidden] { display: none; }
.month-nav { display: flex; flex-wrap: wrap; gap: .35rem; margin-bottom: 1rem; }
.month-nav a { padding: .25rem .55rem; border: 1px solid var(--color-border); border-radius: 999px; background: var(--color-surface); font-size: .8rem; text-decoration: none; }
.month-heading { margin: 1.5rem 0 .65rem; color: var(--color-heading); font-size: 1.15rem; scroll-margin-top: 1rem; }
.commit-card, .release-card { padding: 1.5rem; margin-bottom: 1rem; border-left: 4px solid var(--color-primary); }
.commit-card.tag-major, .commit-card.tag-add { border-left-color: #28a745; }
.commit-card.tag-improve { border-left-color: #17a2b8; }
.commit-card.tag-fix { border-left-color: #dc3545; }
.commit-card.tag-css { border-left-color: #007bff; }
.commit-card.tag-mibs, .commit-card.tag-php8 { border-left-color: #d19a00; }
.commit-card.tag-sql { border-left-color: #343a40; }
.commit-card.tag-minor, .commit-card.tag-trivial, .commit-card.tag-clean { border-left-color: #6c757d; }
.commit-card.tag-libs { border-left-color: #7c3aed; }
.commit-card.tag-devel { border-left-color: #d97706; }
.release-card { border-left-color: var(--color-added); }
.release-card.ce { border-left-color: var(--color-community); }
.commit-header { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: .5rem; margin-bottom: .75rem; }
.commit-title { margin: 0; color: var(--color-heading); font-size: 1.1rem; }
.revision-link { color: inherit; text-decoration: none; text-underline-offset: .15em; }
.revision-link:hover { color: var(--color-primary); text-decoration: underline; }
.commit-card { scroll-margin-top: 1rem; }
.commit-meta { color: var(--color-muted); font-size: .85rem; }
.commit-message { margin-bottom: 1rem; padding: .75rem; border-left: 3px solid #b8c3cf; border-radius: .25rem; background: #f7fafc; overflow-wrap: anywhere; }
.commit-message.tag-major, .commit-message.tag-add { border-left-color: #28a745; background: rgb(40 167 69 / .05); }
.commit-message.tag-improve { border-left-color: #17a2b8; background: rgb(23 162 184 / .05); }
.commit-message.tag-fix { border-left-color: #dc3545; background: rgb(220 53 69 / .05); }
.commit-message.tag-css { border-left-color: #007bff; background: rgb(0 123 255 / .05); }
.commit-message.tag-mibs, .commit-message.tag-php8 { border-left-color: #ffc107; background: rgb(255 193 7 / .05); }
.commit-message.tag-sql { border-left-color: #343a40; background: rgb(52 58 64 / .05); }
.commit-message.tag-minor { border-left-color: #6c757d; background: rgb(108 117 125 / .05); }
.commit-stats { display: flex; flex-wrap: wrap; gap: 1rem; margin-top: 1rem; font-size: .875rem; font-weight: 500; }
.added, .lines-added { color: var(--color-added); }
.removed, .lines-removed { color: var(--color-removed); }
.net-change { color: var(--color-heading); }

.file-section { margin-top: 1rem; }
.file-header { margin-bottom: .5rem; color: #374151; font-size: .9rem; font-weight: 600; }
.file-limit-note { margin: .25rem 0 .45rem; color: var(--color-muted); font-size: .8rem; }
.file-list { margin-top: .35rem; padding: .65rem; border-radius: .35rem; color: #f3f4f6; background: #171b22; font: .75rem/1.5 ui-monospace, SFMono-Regular, Consolas, monospace; }
.file-entry { display: flex; align-items: baseline; gap: .55rem; min-width: 0; }
.file-action { flex: 0 0 1ch; font-weight: 800; }
.file-action.A { color: #63e6be; } .file-action.D { color: #ff8787; } .file-action.R { color: #ffd43b; }
.file-path { min-width: 0; flex: 1; color: #e5e7eb; overflow-wrap: anywhere; }
.file-stats { flex: 0 0 auto; white-space: nowrap; }
.trunk-commits { margin: 1.5rem 0; }
.trunk-commits-header { margin-bottom: 1rem; padding-bottom: .5rem; border-bottom: 2px solid var(--color-border); color: var(--color-heading); font-size: 1rem; font-weight: 600; }
.trunk-commits h6 { margin: 1.5rem 0 .75rem; padding-bottom: .5rem; border-bottom: 1px solid var(--color-border); color: var(--color-heading); font-size: 1rem; }
.trunk-commits ul { margin: 0; padding-left: 1.3rem; }
.trunk-commits li { margin-block: .15rem; overflow-wrap: anywhere; }
.text-muted { color: var(--color-muted); }
.notice { margin-bottom: 1rem; color: var(--color-muted); font-size: .88rem; font-style: italic; }
.code-highlight { padding: .08rem .3rem; border: 1px solid #d8dee7; border-radius: .25rem; color: #9c2f62; background: #f8f5f7; font: .9em ui-monospace, SFMono-Regular, Consolas, monospace; }
.mib-link, .oid-link, .jira-link { font-weight: 600; text-decoration-thickness: .08em; text-underline-offset: .14em; }
.commit-bullet-list { margin: .5rem 0; padding-left: 1.25rem; }
.section { padding: 1rem; margin-bottom: 1rem; }
.no-data { padding: 2rem; margin-bottom: 1rem; text-align: center; color: var(--color-muted); }
.footer { padding: 1.5rem 0 2rem; border-top: 1px solid var(--color-border); color: var(--color-muted); text-align: center; }
.no-releases { color: var(--color-muted); }
.hidden-xl { display: block; }

@media (max-width: 52rem) {
    .year-item { align-items: flex-start; flex-direction: column; }
    .year-stats { width: 100%; grid-template-columns: repeat(2, minmax(0, 1fr)); margin-left: 0; }
    .summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .chart-wrapper { min-height: 14rem; }
}
@media (max-width: 34rem) {
    .stat-values { grid-template-columns: 1fr; }
    .tabs { align-items: stretch; flex-direction: column; border-bottom: 0; }
    .tab-button { border: 1px solid var(--color-border); border-radius: .35rem; }
    .tab-button.active { border-color: var(--color-primary); }
    .commit-header { align-items: flex-start; flex-direction: column; }
    .file-stats { display: none; }
}
@media (min-width: 75rem) { .hidden-xl { display: none; } }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
