/* ZIP Maker & Extractor — list rows, preview box. Shares web-* primitives from main.css. */
.web-group[hidden], .web-file-row[hidden], #btn-run[hidden] { display: none; }
.zip-list { display: flex; flex-direction: column; gap: 0.35rem; max-height: 320px; overflow: auto; }
.zip-list:empty { display: none; }
.zip-row { display: grid; grid-template-columns: auto minmax(0, 1fr) auto auto; align-items: center; gap: 0.5rem; padding: 0.25rem 0.25rem 0.25rem 0.6rem; border: 1px solid var(--border); border-radius: var(--radius-sm); background: var(--surface); font-size: 0.82rem; min-width: 0; }
.zip-row:has(.zip-row-pick) { grid-template-columns: minmax(0, 1fr) auto auto; padding-left: 0; }
.zip-row.is-active { border-color: var(--brand); box-shadow: 0 0 0 1px var(--brand) inset; }
.zip-row iconify-icon { color: var(--text-muted); flex-shrink: 0; }
.zip-row-name { font-family: var(--font-mono); color: var(--text-primary); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.zip-row-meta { color: var(--text-muted); font-size: 0.76rem; white-space: nowrap; }
.zip-row-pick { display: flex; align-items: center; gap: 0.5rem; min-width: 0; min-height: 44px; padding: 0 0.6rem; border: 0; background: none; color: inherit; font: inherit; text-align: left; cursor: pointer; border-radius: var(--radius-sm); }
.zip-row-pick:hover { background: var(--surface-hover, rgba(127, 127, 127, 0.08)); }
.zip-filter-label { margin-left: auto; }
.zip-filter { width: 150px; min-height: 44px; }
.zip-preview { margin-top: 0.75rem; min-width: 0; }
.zip-code { max-height: 420px; overflow: auto; white-space: pre-wrap; overflow-wrap: anywhere; font-size: 0.78rem; }
.zip-media { display: block; max-width: 100%; max-height: 420px; margin: 0 auto; border-radius: var(--radius-sm); }
audio.zip-media { width: 100%; }
.zip-pdf { width: 100%; height: 460px; border: 1px solid var(--border); border-radius: var(--radius-sm); background: var(--surface); }