/* 启动态的必要样式随 index.html 到达；退出层独立于业务模态。 */
/* 51 收妥层甲：纸色薄幕覆全窗，徽记居中缓息，其下微字；无键。 */
@keyframes breathe { 0%, 100% { opacity: .38; } 50% { opacity: .92; } }
#exitLayer .ico-flow { animation: breathe 1.6s var(--ease) infinite; }
#exitLayer { position: fixed; inset: 0; z-index: 60; display: grid; place-items: center; background: var(--paper); }
.exit-veil { display: flex; flex-direction: column; align-items: center; gap: 14px; color: var(--ink-2); }
.exit-veil .ico-flow { width: 48px; height: 48px; }
.exit-veil:focus { outline: none; }
#modalBox:has(.sealed-warning) > header { color: var(--blood); }
#modalBox.small-dialog { width: 360px; }
#modalBox:has(#namesForm) { width: 380px; }
#modalBox:has(.archive-confirm), #modalBox:has(.archive-flow) { width: 440px; }
#modalBox:has(footer:empty) footer { display: none; }
#modalBox:has(.flow-picker) { width: 420px; }
#modalBox:has(.flow-report) { width: 440px; }
.flow-picker { display: flex; flex-direction: column; gap: 1px; max-height: 40vh; overflow: auto; }
#modalBody .flow-picker .preview-item { padding: 5px 8px; border: 0; border-radius: 4px; font-size: 13px; }
.flow-picker .preview-item:not(:has(:disabled)):hover { background: var(--hover); }
.flow-picker input { accent-color: var(--qing); }
.flow-report p { margin: 0; padding: 4px 6px; font-size: 13px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.flow-report h4 { margin: 8px 0 2px; font: 11px var(--font-mono); color: var(--ink-3); }
.modal-quiet { border-color: transparent; background: transparent; color: var(--ink-2); font-size: 12.5px; }

/* 51 归芸：确认、进度与结果同一弹层承接；珠串乙半水，承珠入结果。 */
.archive-flow .beads { display: flex; flex-wrap: wrap; gap: 5px 4.5px; margin: 2px 0 0; }
.archive-flow .beads b { position: relative; flex: none; width: 8px; height: 8px; border-radius: 50%; border: var(--stroke) solid var(--line-2); box-sizing: border-box; }
.archive-flow .beads b.d { background: var(--qing); border-color: var(--qing); }
.archive-flow .beads b.c2 { border-color: var(--qing); overflow: hidden; }
.archive-flow .beads b.c2::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 50%; background: var(--qing); animation: slosh 1.6s var(--ease) infinite; }
@keyframes slosh { 0%, 100% { height: 36%; opacity: .55; } 50% { height: 64%; opacity: .95; } }
.archive-flow .beads.ind b { border-color: var(--qing); animation: beadInd 1.8s linear infinite; animation-delay: calc(var(--i) * .18s); }
@keyframes beadInd { 0%, 70%, 100% { opacity: .22; } 20% { opacity: .95; } }
.archive-flow .beads b.s { border-color: var(--qing); }
.archive-flow .beads b.f { background: var(--open); border-color: var(--open); }
.prog-l { display: flex; align-items: baseline; justify-content: space-between; margin-top: 10px; font-size: 13px; color: var(--ink-2); }
.prog-l .n { font: 11.5px var(--font-mono); color: var(--ink-3); }
.tips { margin: 12px 0 0; text-align: center; font-size: 11.5px; color: var(--ink-3); min-height: 18px; transition: opacity .4s var(--ease); }
.rs-h { display: flex; align-items: center; gap: 8px; margin: 18px 0 3px; font: 13px/1.4 var(--font-display); letter-spacing: 1px; color: var(--ink-2); }
.rs-h .lg { width: 8px; height: 8px; border-radius: 50%; border: var(--stroke) solid var(--qing); box-sizing: border-box; flex: none; }
.rs-h .lg.f { background: var(--open); border-color: var(--open); }
.rs-h .c { font: 11px var(--font-mono); color: var(--ink-3); letter-spacing: 0; }
.rs-row { display: flex; align-items: baseline; gap: 14px; width: 100%; padding: 6px 8px; border: 0; border-radius: 4px; background: none; color: var(--ink); font-size: 13px; text-align: left; }
.rs-row .t { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rs-row .go { font: 11.5px var(--font-mono); color: var(--ink-3); white-space: nowrap; transition: color var(--t-fast) var(--ease); }
button.rs-row { cursor: pointer; }
button.rs-row:hover { background: var(--hover); }
button.rs-row:hover .go { color: var(--qing); }
.archive-flow .clean { color: var(--ink-2); padding: 10px 0 2px; }

/* 删洗沿归芸同层承珠；原因换行，结果留至用户确认。 */
#modalBox:has(.cleanup-flow) { width: 440px; }
.cleanup-current { margin: 10px 0 0; font-size: 11.5px; color: var(--ink-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cleanup-summary { margin: 10px 0 8px; color: var(--ink-2); }
.cleanup-results { max-height: 222px; overflow: auto; }
.cleanup-result-row { padding: 8px 6px; border-bottom: var(--stroke) solid var(--line); }
.cleanup-result-row:last-child { border-bottom: 0; }
.cleanup-result-title { display: flex; gap: 10px; align-items: baseline; }
.cleanup-result-title > span { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cleanup-result-title > small { font: 11px var(--font-mono); color: var(--ink-3); }
.cleanup-reason { margin-top: 3px; font-size: 12px; line-height: 1.65; color: var(--ink-2); overflow-wrap: anywhere; }