.archive-browser { padding:24px; min-width:0; }
.archive-upload { border-top:1px solid var(--line); }
.catalog-preview { display:block; width:100%; height:220px; object-fit:contain; background:var(--surface-muted); margin-bottom:18px; }
.catalog-source { display:flex; flex-direction:column; align-items:flex-start; gap:14px; padding:24px 0; border-bottom:1px solid var(--line); }
.catalog-detail-preview { width:100%; max-height:440px; object-fit:contain; background:var(--surface-muted); }
.archive-toolbar { display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; padding-bottom:24px; }
.archive-toolbar [role=tablist] { display:flex; flex-wrap:wrap; gap:4px; border-bottom:1px solid var(--line); }
.archive-toolbar [role=tab] { border:0; border-bottom:3px solid transparent; background:transparent; color:var(--muted); padding:12px 16px; min-height:44px; }
.archive-toolbar [aria-selected=true] { border-bottom-color:var(--green); color:var(--foreground); font-weight:600; }
.archive-toolbar input { width:260px; max-width:100%; min-width:0; }
.archive-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
.tool-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
.archive-card { border:1px solid var(--line); border-radius:8px; padding:22px; display:flex; flex-direction:column; min-width:0; background:var(--surface); }
.archive-card h3 { margin:8px 0; font-size:18px; line-height:1.5; overflow-wrap:anywhere; }
.archive-card p { font-size:14px; line-height:1.8; margin:8px 0; overflow-wrap:anywhere; }
.archive-card header { display:flex; gap:12px; align-items:center; }
.archive-card footer { margin-top:auto; padding-top:20px; display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px; }
.archive-card .btn { height:38px; min-height:38px; align-self:center; }
.archive-card a { color:var(--blue); font-size:14px; text-underline-offset:4px; }
.tool-mark { display:grid; place-items:center; flex:none; width:42px; height:42px; border-radius:8px; background:var(--green-soft); font-size:22px; font-weight:600; }
.archive-card:nth-child(3n+2) .tool-mark { background:var(--blue-soft); }
.archive-card:nth-child(3n) .tool-mark { background:var(--red-soft); }
.archive-channel { display:block; font-size:14px; color:var(--green); font-weight:600; margin-bottom:6px; }
.reference-card { border-top:4px solid #69a99c; }
.reference-card.tone-1 { border-top-color:#7ba3cd; }
.reference-card.tone-2 { border-top-color:#d295a1; }
.reference-card.tone-3 { border-top-color:#c6ac59; }
.archive-document { max-width:1100px; margin:auto; padding:24px; min-width:0; }
.archive-document > header { padding-bottom:24px; border-bottom:1px solid var(--line); }
.archive-document h2 { font-size:24px; line-height:1.5; overflow-wrap:anywhere; }
.archive-section { padding:24px 0; border-bottom:1px solid var(--line); min-width:0; }
.archive-section h2, .archive-section h3 { font-size:18px; margin:0 0 18px; }
.archive-prose { white-space:pre-wrap; line-height:1.9; overflow-wrap:anywhere; font-size:15px; font-weight:400; }
.archive-update { color:var(--muted); font-size:13px; }
.archive-reference-select { display:block; margin-top:20px; }
.archive-reference-select select { display:block; width:100%; margin-top:8px; }
@media (max-width:1100px) { .tool-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
#documents .archive-upload { grid-column:1 / -1; margin-top:24px; border:1px solid var(--border, #e2e5e9); border-radius:8px; background:#fff; min-width:0; }
#documents .archive-upload .upload-card { border:0; box-shadow:none; }
.archive-card footer { flex-wrap:wrap; gap:10px; }
@media (max-width:640px) {
 .archive-browser,.archive-document { padding:16px; }
 .archive-grid { grid-template-columns:minmax(0,1fr); gap:14px; }
 .archive-toolbar { display:block; }
 .archive-toolbar input { width:100%; margin-top:16px; }
 .archive-toolbar [role=tab] { padding:10px; font-size:14px; }
 .archive-card { padding:18px; }
}
