.archive-shell { max-width: 1040px; margin: 0 auto; }
.archive-workspace { border-top: 1px solid var(--border-color, #ddd); border-bottom: 1px solid var(--border-color, #ddd); padding: 24px 0; }
.archive-drop { position: relative; display: grid; gap: 12px; padding: 32px 20px; border: 2px dashed var(--border-color, #bbb); border-radius: 8px; text-align: center; cursor: pointer; background: var(--bg-surface, #fff); }
.archive-drop:focus-within, .archive-drop.dragover { outline: 3px solid #168577; outline-offset: 3px; }
.archive-drop input { position: absolute; inset: 0; opacity: 0; width: 100%; height: 100%; cursor: pointer; }
.archive-drop i { font-size: 32px; color: #168577; }
.archive-actions { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin: 18px 0; }
.archive-actions .btn { border-radius: 6px; min-height: 44px; white-space: normal; }
.archive-shell [hidden] { display: none !important; }
.archive-shell button:disabled { opacity: .5; cursor: not-allowed; }
#archiveFileName, #archiveStatus, #archiveSummary { margin: 12px 0; overflow-wrap: anywhere; }
#archiveStatus { min-height: 48px; padding: 12px; background: var(--bg-surface, #f5f6f7); border-left: 3px solid #168577; }
[data-state="error"] #archiveStatus { border-color: #bd3947; }
.archive-table-wrap { overflow: auto; max-height: 360px; }
.archive-table { width: 100%; border-collapse: collapse; table-layout: fixed; }
.archive-table th, .archive-table td { padding: 10px; text-align: left; border-bottom: 1px solid var(--border-color, #ddd); overflow-wrap: anywhere; }
.archive-table th:last-child { width: 130px; }
.archive-table caption { text-align: left; font-size: 14px; padding: 10px; }
#archiveReset { min-width: 44px; }
.archive-help { padding: 28px 0; }
.archive-help h2 { font-size: 22px; margin: 24px 0 12px; }
.archive-help h3 { font-size: 17px; margin: 20px 0 8px; }
.archive-help p, .archive-help li { line-height: 1.8; }
.archive-help ul { padding-left: 22px; }
.archive-ad { margin: 24px 0; overflow: hidden; text-align: center; }
.archive-links { display: flex; gap: 20px; flex-wrap: wrap; margin-top: 20px; }
@media(max-width:600px) { .archive-drop { padding: 24px 12px; } .archive-actions { gap: 8px; } .archive-table th:last-child { width: 100px; } }