/* Phase 16 screens: Reports (S6), Compliance (S7, S8, S8b), Settings (S9). Tokens only. */

.count-badge { display: inline-block; min-width: 20px; padding: 0 6px; margin-left: var(--s-1); border-radius: var(--r-pill); background: var(--brand-1); color: #fff; font-size: var(--fs-12); font-weight: 600; text-align: center; line-height: 20px; font-variant-numeric: tabular-nums; }
.count-badge--rail { margin-left: auto; }

fieldset.fieldset { border: 0; margin: 0; padding: 0; min-width: 0; display: flex; flex-direction: column; gap: var(--s-2); }
fieldset.fieldset > legend { padding: 0; margin-bottom: var(--s-2); font-size: var(--fs-13); color: var(--text-2); }
.check.radio { align-items: flex-start; }
.check.radio input { margin-top: 3px; }
.save-row { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-3); }
input.color { width: 44px; height: 36px; padding: 2px; border: 1px solid var(--line-strong); border-radius: var(--r-sm); background: var(--bg-2); cursor: pointer; flex: none; }
.price-tier { border: 1px solid var(--line); border-radius: var(--r-md); padding: var(--s-3) var(--s-4) var(--s-4); display: flex; flex-direction: column; gap: var(--s-3); min-width: 0; }
.price-tier > legend { padding: 0 var(--s-2); font-size: var(--fs-13); color: var(--text-2); }
.card--danger { border-color: rgba(251,113,133,.4); }
.int-item { align-items: flex-start; flex-wrap: wrap; }
.int-form { display: flex; flex-wrap: wrap; gap: var(--s-2); align-items: center; flex: 0 1 420px; }
.int-form .input { flex: 1 1 180px; min-width: 0; }

/* Reports */
.gallery { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: var(--s-4); }
.gallery-card { display: flex; flex-direction: column; gap: var(--s-3); min-width: 0; }
.thumb { display: block; position: relative; width: 100%; height: 200px; overflow: hidden; border-radius: var(--r-sm); border: 1px solid var(--line-strong); background: #fff; }
.thumb iframe { position: absolute; top: 0; left: 0; width: 794px; height: 800px; border: 0; transform: scale(.27); transform-origin: top left; pointer-events: none; background: #fff; }
.gen-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); gap: var(--s-5); align-items: start; }
.gap-pick--scroll { max-height: 260px; overflow-y: auto; padding-right: var(--s-2); }
.preview { position: sticky; top: var(--s-4); min-height: 420px; border-radius: var(--r-md); border: 1px solid var(--line-strong); background: var(--bg-2); overflow: hidden; }
.preview-frame { display: block; width: 100%; height: min(78vh, 760px); border: 0; background: #fff; }
.preview-empty { min-height: 420px; display: grid; place-content: center; justify-items: center; gap: var(--s-3); color: var(--text-2); text-align: center; padding: var(--s-5); }

/* Library */
.pinned { position: sticky; top: 0; z-index: 5; }
.lib-counts { display: flex; flex-wrap: wrap; gap: var(--s-2) var(--s-5); color: var(--text-2); }
.lib-counts b { color: var(--text); }
.lib-grid { display: grid; grid-template-columns: minmax(200px, 1fr) minmax(220px, 1.1fr) minmax(0, 2.4fr); gap: var(--s-4); align-items: start; }
.lib-pane { display: flex; flex-direction: column; gap: var(--s-2); min-width: 0; }
.pane-h { font-size: var(--fs-14); margin: 0; }
.pane-item { display: flex; flex-direction: column; align-items: flex-start; gap: var(--s-1); width: 100%; text-align: left; padding: var(--s-3); border-radius: var(--r-sm); border: 1px solid transparent; background: none; color: var(--text); }
.pane-item:hover { background: rgba(25,20,102,.04); }
.pane-item[aria-current="true"] { background: rgba(42,35,153,.08); border-color: var(--brand-1); }
.pane-title { font-weight: 600; overflow-wrap: anywhere; }
.progress { display: block; width: 100%; height: 6px; border-radius: var(--r-pill); background: var(--surface-3); overflow: hidden; }
.progress > span { display: block; height: 100%; background: var(--pass); }
.note-tabs { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--s-2); }
.note-tab { display: inline-flex; align-items: center; gap: var(--s-2); padding: var(--s-1) var(--s-3); border-radius: var(--r-pill); border: 1px solid var(--line-strong); background: none; color: var(--text); font-size: var(--fs-13); }
.note-tab[aria-current="true"] { border-color: var(--brand-1); background: rgba(42,35,153,.08); }
.lib-note { display: flex; flex-direction: column; gap: var(--s-3); }
.note-text { white-space: pre-wrap; overflow-wrap: anywhere; max-width: 75ch; }
.sub-h { font-size: var(--fs-13); font-weight: 600; color: var(--text-2); margin: 0 0 var(--s-1); }
.diff { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s-4); }
.diff-full { grid-column: 1 / -1; }
.diff-del { text-decoration: line-through; color: var(--fail); }
.diff-add { text-decoration: underline; text-decoration-style: double; color: var(--pass); }
.actions { padding-top: var(--s-2); border-top: 1px solid var(--line); gap: var(--s-3); }
.status--amended { color: var(--warn); }

/* Requests + Law Watch */
.board--4 { grid-template-columns: repeat(4, minmax(220px, 1fr)); }
.src-tiles { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--s-3); }
.src-tile { display: flex; flex-direction: column; gap: var(--s-2); min-width: 0; }

@media (max-width: 1100px) {
  .lib-grid, .gen-grid { grid-template-columns: minmax(0, 1fr); }
  .src-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .preview { position: static; }
}
@media (max-width: 768px) {
  .board--4 { grid-template-columns: repeat(4, 82%); scroll-snap-type: x mandatory; }
  .diff { grid-template-columns: minmax(0, 1fr); }
  .src-tiles { grid-template-columns: minmax(0, 1fr); }
  .int-form { flex-basis: 100%; }
}