/* UGAP page (ugap.html), loaded after style.css. */
:root { --ug-cheap: #0e7490; --ug-dear: #d9480f; --ug-err: #94a3b8; --ug-todo: #dbe5ed; --ug-a: #2563eb; --ug-b: #8fd0de; }
[data-theme="dark"] { --ug-cheap: #2bb3cb; --ug-dear: #f08a4b; --ug-err: #64748b; --ug-todo: #1c3146; --ug-a: #5b8ef7; --ug-b: #135a73; }

.ug-status { margin-bottom: var(--sp-4); padding: var(--sp-2) var(--sp-3); border-left: 4px solid var(--c-amber); border-radius: var(--r-md); background: color-mix(in srgb, var(--c-amber) 10%, transparent); color: var(--c-ink); font-size: .92rem; line-height: 1.6; }
.ug-status a { color: var(--c-teal-600); font-weight: 600; }
.callout a { color: var(--c-teal-600); font-weight: 600; }
.ug-noblame { margin-top: var(--sp-3); margin-bottom: 0; }

.ug-svg { display: block; max-width: 100%; height: auto; overflow: visible; }
.ug-svg text { font-family: var(--font-body); }
.ug-tick { fill: var(--c-muted); font-size: 11px; }
.ug-val { paint-order: stroke; stroke: var(--c-surface); stroke-width: 3px; stroke-linejoin: round; fill: var(--c-ink); font-size: 11.5px; font-weight: 600; font-variant-numeric: tabular-nums; }
.ug-head { fill: var(--c-muted); font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.ug-label { fill: var(--c-ink); font-size: 12.5px; paint-order: stroke; stroke: var(--c-surface); stroke-width: 4px; stroke-linejoin: round; }
.ug-label.is-strong { font-weight: 700; }
.ug-zero { stroke: var(--c-ink); stroke-width: 1.2; stroke-dasharray: 3 3; opacity: .55; }
.ug-grid { stroke: var(--c-line); stroke-width: 1; }
.ug-bar--cheap { fill: var(--ug-cheap); }
.ug-bar--dear { fill: var(--ug-dear); }
.ug-iqr { stroke: var(--c-muted); stroke-width: 6; stroke-linecap: round; opacity: .38; }
.ug-row.is-small .ug-iqr { stroke-dasharray: 2 5; stroke-linecap: butt; }
.ug-dot--cheap { fill: var(--ug-cheap); stroke: var(--c-surface); stroke-width: 2; }
.ug-dot--dear { fill: var(--ug-dear); stroke: var(--c-surface); stroke-width: 2; }
.ug-col--a { fill: var(--ug-a); }
.ug-col--b { fill: var(--ug-b); }

.ug-legend { display: flex; flex-wrap: wrap; gap: .4rem 1.2rem; margin-top: .6rem; color: var(--c-muted); font-size: .8rem; }
.ug-legend span { display: inline-flex; align-items: center; gap: .4rem; }
.ug-sw { display: inline-block; width: 12px; height: 12px; border-radius: 3px; }
.ug-sw--cheap { background: var(--ug-cheap); } .ug-sw--dear { background: var(--ug-dear); }
.ug-sw--read { background: var(--c-teal-600); } .ug-sw--err { background: var(--ug-err); } .ug-sw--todo { background: var(--ug-todo); }
.ug-sw--a { background: var(--ug-a); } .ug-sw--b { background: var(--ug-b); }

.ug-stackrows { display: grid; gap: .55rem; padding: 0; list-style: none; }
.ug-stackrows li { display: grid; gap: .2rem; }
.ug-stackrows__line { display: flex; justify-content: space-between; gap: 1rem; color: var(--c-ink); font-size: .84rem; }
.ug-stackrows__line strong { font-variant-numeric: tabular-nums; font-weight: 600; white-space: nowrap; }
.ug-stackrows__track { display: flex; min-width: 6px; height: 9px; overflow: hidden; border-radius: var(--r-pill); background: var(--ug-todo); }
.ug-stackrows__track .is-read { background: var(--c-teal-600); }
.ug-stackrows__track .is-err { background: var(--ug-err); }
.ug-stackrows__track .is-todo { background: var(--ug-todo); }

.ug-filters { display: flex; flex-wrap: wrap; gap: .6rem; margin-bottom: var(--sp-2); }
.ug-filters .select-wrap { flex: 0 1 220px; }
.ug-table td:first-child, .ug-table td:nth-child(3) { min-width: 220px; }
.ug-sort { padding: 0; border: 0; background: none; color: inherit; font: inherit; cursor: pointer; }
.ug-sort:hover { color: var(--c-ink); }
.ug-pill { display: inline-block; padding: .1rem .5rem; border-radius: var(--r-pill); font-weight: 700; font-size: .78rem; }
.ug-pill.is-cheap { background: color-mix(in srgb, var(--ug-cheap) 15%, transparent); color: var(--ug-cheap); }
.ug-pill.is-dear { background: color-mix(in srgb, var(--ug-dear) 15%, transparent); color: var(--ug-dear); }
.ug-more { display: flex; justify-content: center; margin-top: var(--sp-2); }
.ug-excluded td { opacity: .8; }
.ug-nowrap { white-space: nowrap; }

.section:not(.section--alt) .gap { background: var(--c-surface); }
.ug-cov .panel { height: 100%; }

@media (min-width: 861px) {
  .ug-cov { grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); }
}
@media (max-width: 860px) {
  .ug-cov { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 560px) {
  .ug-status { padding: var(--sp-2); font-size: .86rem; }
  .ug-table td:first-child, .ug-table td:nth-child(3) { min-width: 170px; }
}
