.backup-grid { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(300px, .65fr); gap: 14px; }
.backup-settings, .backup-overview, .backup-history { padding: 17px; }
.backup-form-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 11px; margin: 14px 0; }
.backup-form-grid label { display: grid; gap: 6px; color: var(--muted); font-size: 11px; }
.backup-form-grid input, .backup-form-grid select { width: 100%; min-height: 40px; border: 1px solid var(--line); border-radius: 8px; padding: 0 10px; color: var(--text); background: #07111e; }
.backup-form-grid label small { margin-top: -26px; margin-right: 9px; justify-self: end; pointer-events: none; }
.toggle-row { display: flex; align-items: center; justify-content: space-between; gap: 15px; padding: 12px; border: 1px solid var(--line-soft); border-radius: 10px; background: rgba(8, 20, 34, .7); }
.toggle-row span, .toggle-row strong, .toggle-row small { display: block; }
.toggle-row small { margin-top: 4px; color: var(--muted); }
.toggle-row input { width: 39px; height: 21px; accent-color: var(--green); }
.backup-targets, .backup-readiness, .backup-destinations { display: flex; flex-wrap: wrap; gap: 8px; }
.backup-targets { padding: 12px 0; color: var(--muted); }
.backup-targets label { padding-right: 14px; }
.backup-targets .backup-disk-select { display: grid; gap: 5px; width: min(100%, 320px); }
.backup-disk-select select { min-height: 38px; border: 1px solid var(--line); border-radius: 8px; padding: 0 9px; color: var(--text); background: #07111e; }
.backup-readiness { padding: 10px 0 3px; border-top: 1px solid var(--line-soft); }
.backup-readiness span, .backup-destination { border: 1px solid var(--line-soft); border-radius: 99px; padding: 5px 9px; color: var(--muted); font-size: 10px; }
.backup-readiness .is-ready, .backup-destination.is-ready { border-color: rgba(20, 214, 155, .3); color: #54ddb6; background: rgba(6, 67, 52, .2); }
.backup-readiness .is-warning, .backup-destination.is-warning { border-color: rgba(245, 167, 65, .32); color: #f2b15b; background: rgba(96, 56, 9, .18); }
.backup-lock { display: grid; width: 44px; height: 44px; place-items: center; border-radius: 12px; color: #6ee1c0; background: rgba(20, 214, 155, .12); font-size: 22px; }
.backup-facts { display: grid; gap: 10px; margin: 16px 0; }
.backup-facts div { padding: 12px; border: 1px solid var(--line-soft); border-radius: 10px; }
.backup-facts span, .backup-facts strong { display: block; }
.backup-facts span { color: var(--muted); font-size: 10px; }
.backup-facts strong { margin-top: 5px; font-size: 14px; }
.backup-history { margin-top: 14px; }
.backup-runs { display: grid; gap: 8px; }
.backup-run { display: grid; grid-template-columns: 44px minmax(0, 1fr) auto; align-items: center; gap: 12px; padding: 12px; border: 1px solid var(--line-soft); border-radius: 11px; background: rgba(6, 15, 26, .65); }
.backup-run-icon { display: grid; width: 44px; height: 44px; place-items: center; border-radius: 10px; color: #47b7ff; background: rgba(38, 116, 226, .13); }
.backup-run-main { min-width: 0; }
.backup-run-main > div:first-child { display: flex; align-items: center; gap: 8px; }
.backup-run-main small, .backup-run-main p { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.backup-run-main small { margin-top: 4px; color: var(--muted); font-size: 10px; }
.backup-run-main p { margin: 5px 0 7px; color: var(--muted-2); font-size: 10px; }
@media (max-width: 980px) { .backup-grid { grid-template-columns: 1fr; } }
@media (max-width: 700px) { .backup-form-grid { grid-template-columns: 1fr 1fr; } .backup-run { grid-template-columns: 38px minmax(0, 1fr); } .backup-run > button { grid-column: 1 / -1; } }
@media (max-width: 480px) { .backup-form-grid { grid-template-columns: 1fr; } }