/* Gaps (#gaps, gaps.js): the app's own tokens (app.css), so light and dark follow the theme. Severity and status are
   words (never color alone); the table scrolls inside its own box on a phone (320 px reflow). */
.gp-filters { display: flex; flex-wrap: wrap; gap: 12px; align-items: flex-end; margin: 0 0 16px; max-width: 1100px; }
.gp-field { display: grid; gap: 4px; min-width: 0; flex: 1 1 150px; }
.gp-field label, label.gp-size { font-size: 13px; color: var(--muted); }
.gp-field select, .gp-field input { font: inherit; padding: 8px 10px; border: 1px solid var(--line); border-radius: 6px; background: var(--surface); color: var(--ink); min-width: 0; width: 100%; box-sizing: border-box; }
.gp-field.gp-actions { flex: 0 0 auto; }
.gp-results { max-width: 1400px; }
.gp-scroll { overflow-x: auto; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); }
.gp-scroll:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
table.gp-table { min-width: 960px; }
/* Short columns keep to one line; the rule title, resource and requirements wrap at word boundaries and break a long
   ARN only where it must (overflow-wrap: break-word does not shrink the column's minimum the way "anywhere" does). */
table.gp-table td, table.gp-table th { overflow-wrap: break-word; }
table.gp-table th, table.gp-table td[data-col="severity"], table.gp-table td[data-col="status"], table.gp-table td[data-col="obligation"],
table.gp-table td[data-col="account"], table.gp-table td[data-col="region"], table.gp-table td[data-col="service"],
table.gp-table td[data-col="first_seen"], table.gp-table td[data-col="decision"] { white-space: nowrap; }
table.gp-table td[data-col="rule"], table.gp-table td[data-col="resource"], table.gp-table td[data-col="requirements"] { min-width: 14rem; }
button.gp-sort { font: inherit; font-size: 12px; font-weight: 600; color: var(--ink); background: none; border: 0; padding: 2px 0; cursor: pointer; text-align: left; }
button.gp-sort:hover { text-decoration: underline; }
.gp-sev { display: inline-block; padding: 1px 8px; border-radius: 10px; border: 1px solid var(--line); border-left-width: 5px; font-size: 12.5px; font-weight: 600; color: var(--ink); background: var(--surface); }
.gp-sev-critical { border-left-color: var(--st-blocked); }
.gp-sev-high { border-left-color: var(--support); }
.gp-sev-medium { border-left-color: var(--st-in_progress); }
.gp-sev-low { border-left-color: var(--st-not_applicable); }
.gp-req { display: inline-block; padding: 0 6px; border: 1px solid var(--line); border-radius: 4px; font-size: 12px; margin: 1px 0; }
.gp-pager { margin-top: 12px; }
.gp-pager select { font: inherit; padding: 6px 8px; border: 1px solid var(--line); border-radius: 6px; background: var(--surface); color: var(--ink); }
.gp-detail { max-width: 860px; display: grid; gap: 18px; }
.gp-detail h2 { font-size: 18px; margin: 0 0 6px; }
.gp-detail h3 { font-size: 14px; margin: 10px 0 4px; }
.gp-facts { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 10px 20px; margin: 0; padding: 14px 16px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); }
.gp-facts dt { font-size: 12px; color: var(--muted); }
.gp-facts dd { margin: 0; overflow-wrap: anywhere; }
.gp-text { white-space: pre-wrap; overflow-wrap: anywhere; margin: 0; }
.gp-dec-now { font-weight: 600; margin: 0 0 6px; }
.gp-dec-form { display: grid; gap: 10px; max-width: 520px; margin-top: 10px; }
.gp-dec-form textarea { font: inherit; padding: 8px 10px; border: 1px solid var(--line); border-radius: 6px; background: var(--surface); color: var(--ink); width: 100%; box-sizing: border-box; }
.ev-scroll { overflow-x: auto; max-width: 100%; }
#ev-table { border-collapse: collapse; width: 100%; font-size: 14px; }
#ev-table th, #ev-table td { text-align: left; padding: 6px 10px; border-bottom: 1px solid var(--line); overflow-wrap: anywhere; vertical-align: top; }
.gp-detail > * { min-width: 0; }
#gp-evidence { min-width: 0; max-width: 100%; }
#gp-evidence li, #gp-evidence p { overflow-wrap: anywhere; }
.ev-json { margin: 8px 0 0; padding: 12px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); max-width: 100%; box-sizing: border-box; white-space: pre-wrap; overflow-wrap: anywhere; font-size: 13px; }
.ev-hit { background: var(--support-soft); color: var(--ink); border-radius: 3px; }
.rc-list { list-style: none; margin: 0 0 12px; padding: 0; display: grid; gap: 8px; }
.rc-row { padding: 8px 10px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); overflow-wrap: anywhere; min-width: 0; }
.rc-status { font-weight: 600; }
.rc-claims { margin-top: 4px; }
#res-checks h3 { font-size: 14px; margin: 14px 0 6px; }
#res-evidence { margin-top: 12px; max-width: 860px; min-width: 0; }
#res-evidence:focus { outline: none; }
.rc-open { white-space: normal; text-align: left; }
.ev-line { display: block; }
.ev-cut { display: block; color: var(--muted, inherit); font-style: italic; }