.feature-layout{grid-template-columns:248px minmax(0,1fr);min-height:0}
.feature-layout .sidebar{border-right:1px solid var(--line)}
.feature-main{min-width:0;min-height:0;overflow:auto;padding:28px clamp(20px,3vw,42px) 30px;background:#131922}
.feature-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:22px}
.feature-heading h1{margin:0;color:#edf3fa;font-size:24px;letter-spacing:-.35px}
.feature-heading p{margin:5px 0 0;color:#94a2b5;font-size:11px}
.feature-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.feature-btn{min-height:34px;padding:0 12px;border:1px solid #3a4758;border-radius:7px;background:#202936;color:#cbd6e4;font:11px "Segoe UI",sans-serif;cursor:pointer;transition:.15s}
.feature-btn:hover{border-color:#597493;background:#29384a;color:#fff}
.feature-btn.primary{border-color:#4a78c5;background:#3b70c8;color:white;font-weight:600}
.feature-btn.primary:hover{background:#4b82dc}
.feature-btn.danger{border-color:#73454b;color:#f0b3b4;background:#342329}
.feature-btn.danger:hover{border-color:#bd646a;background:#512d32;color:white}
.feature-btn.small{min-height:29px;padding:0 9px;font-size:10px}
.feature-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-bottom:19px}
.feature-stat{padding:13px 15px;border:1px solid #2c3847;border-radius:9px;background:linear-gradient(145deg,#1b2430,#171e28)}
.feature-stat-label{color:#99a7b9;font-size:10px}.feature-stat-value{display:block;margin-top:5px;color:#edf3fa;font-size:21px;font-weight:700}.feature-stat.overdue .feature-stat-value{color:#f08c83}.feature-stat.upcoming .feature-stat-value{color:#f1c779}.feature-stat.complete .feature-stat-value{color:#70d6b0}
.feature-toolbar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:15px;padding:10px;border:1px solid #293544;border-radius:9px;background:#171e28}
.feature-search{height:31px;min-width:180px;flex:1;padding:0 9px;border:1px solid #303c4c;border-radius:6px;outline:0;background:#111821;color:#e9eef6;font:10px "Segoe UI",sans-serif}
.feature-select{height:31px;padding:0 9px;border:1px solid #303c4c;border-radius:6px;background:#111821;color:#cbd6e4;font:10px "Segoe UI",sans-serif}
.date-section{margin:19px 0 9px;color:#9eacc0;font-size:11px;font-weight:700;letter-spacing:.3px}
.date-section .date-count{margin-left:6px;color:#718198;font-weight:400}
.feature-list{display:flex;flex-direction:column;gap:8px}
.feature-row{display:flex;align-items:center;gap:12px;min-width:0;padding:12px 13px;border:1px solid #2b3746;border-radius:9px;background:#19212c;transition:border-color .16s,transform .16s,background .16s}
.feature-row:hover{border-color:#40536b;background:#1d2835;transform:translateY(-1px)}
.feature-row-content{min-width:0;flex:1}
.feature-row-title{overflow:hidden;color:#e5ebf3;font-size:12px;font-weight:650;text-overflow:ellipsis;white-space:nowrap}
.feature-row-sub{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin-top:5px;color:#8493a7;font-size:10px}
.feature-dot{width:7px;height:7px;border-radius:50%;background:#f1c779;box-shadow:0 0 9px #f1c77955;flex:none}
.feature-dot.late{background:#f08c83;box-shadow:0 0 9px #f08c8355}
.feature-dot.done{background:#70d6b0;box-shadow:0 0 9px #70d6b055}
.feature-row-actions{display:flex;align-items:center;gap:6px;flex:none}
.feature-pill{padding:4px 7px;border:1px solid #354357;border-radius:5px;background:#202936;color:#bac8d9;font-size:9px;white-space:nowrap}
.feature-pill.amber{border-color:#746344;background:#352f24;color:#f1d79e}
.feature-pill.red{border-color:#704348;background:#38272b;color:#f0aeae}
.feature-pill.green{border-color:#355d51;background:#20332e;color:#9ae0c6}
.feature-empty{padding:36px 15px;text-align:center;color:#8493a7;font-size:11px}
.feature-notice{display:flex;align-items:flex-start;gap:11px;margin:17px 0;padding:13px 15px;border:1px solid #354b65;border-radius:9px;background:#1b2939;color:#b9c9dc;font-size:10px;line-height:1.65}
.feature-notice .notice-icon{color:#83b2ef;font-size:15px}
.feature-notice strong{display:block;margin-bottom:2px;color:#e2eaf4;font-size:11px}
.feature-card{padding:17px;border:1px solid #2c3847;border-radius:10px;background:#19212c}
.feature-card-title{margin:0 0 4px;color:#e6edf6;font-size:13px;font-weight:700}
.feature-card-caption{margin:0;color:#8796aa;font-size:10px;line-height:1.6}
.trash-expiry{color:#f1c779}
.backup-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(270px,.8fr);gap:13px;align-items:start}
.backup-primary{padding:20px;background:radial-gradient(ellipse at 100% 0,#263e5b 0,transparent 55%),#19212c}
.backup-status{display:flex;align-items:center;gap:8px;margin:15px 0;color:#aab9cb;font-size:10px}
.backup-status .dot{width:8px;height:8px;border-radius:50%;background:#70d6b0;box-shadow:0 0 9px #70d6b077}
.backup-includes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:17px 0}
.backup-include{padding:11px;border:1px solid #2e3b4c;border-radius:7px;background:#151c25;color:#d4deea;font-size:10px}
.backup-include span{display:block;margin-top:4px;color:#8493a7;font-size:9px}
.backup-progress{height:5px;overflow:hidden;border-radius:5px;background:#2b3746}
.backup-progress span{display:block;width:0;height:100%;border-radius:5px;background:linear-gradient(90deg,#5c91df,#70d6b0);transition:width .5s}
.backup-path{display:flex;align-items:center;gap:8px;margin-top:12px;padding:9px 10px;border:1px solid #303c4c;border-radius:7px;background:#121922;color:#b8c6d7;font:10px Consolas,monospace;overflow-wrap:anywhere}
.backup-path span{flex:1}
.backup-side{display:flex;flex-direction:column;gap:12px}
.backup-setting{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 0;border-top:1px solid #2a3543;color:#c8d3e0;font-size:10px}
.backup-setting:first-of-type{margin-top:9px}
.backup-setting small{display:block;margin-top:3px;color:#7f8ea2;font-size:9px}
.toggle-switch{position:relative;width:34px;height:19px;flex:none}
.toggle-switch input{position:absolute;opacity:0}
.toggle-switch i{position:absolute;inset:0;border-radius:12px;background:#394657;cursor:pointer;transition:.2s}
.toggle-switch i:before{position:absolute;top:3px;left:3px;width:13px;height:13px;border-radius:50%;background:#cbd5e1;content:"";transition:.2s}
.toggle-switch input:checked+i{background:#4779c4}
.toggle-switch input:checked+i:before{transform:translateX(15px);background:white}
.backup-history{margin-top:13px}
.backup-history-row{display:flex;align-items:center;gap:10px;padding:10px 0;border-top:1px solid #2b3746}
.backup-file-icon{display:grid;width:31px;height:34px;place-items:center;border:1px solid #40536b;border-radius:6px;background:#202b38;color:#94baf0}
.backup-file-info{min-width:0;flex:1}.backup-file-name{overflow:hidden;color:#d8e1ec;font-size:10px;text-overflow:ellipsis;white-space:nowrap}.backup-file-meta{margin-top:3px;color:#7f8ea2;font-size:9px}
.feature-toast{position:fixed;right:22px;bottom:20px;z-index:30;padding:11px 15px;border:1px solid #40536b;border-radius:8px;background:#202b38;color:#e6edf6;font-size:11px;box-shadow:0 12px 30px #0008;opacity:0;transform:translateY(8px);pointer-events:none;transition:.2s}
.feature-toast.show{opacity:1;transform:translateY(0)}
@media(max-width:1050px){.feature-layout{grid-template-columns:218px minmax(0,1fr)}.feature-main{padding:24px 20px}}
@media(max-width:790px){.feature-layout{grid-template-columns:205px minmax(0,1fr)}.feature-stats{gap:7px}.feature-stat{padding:11px}.feature-row{align-items:flex-start;flex-wrap:wrap}.feature-row-content{flex-basis:calc(100% - 30px)}.feature-row-actions{margin-left:19px}}
@media(max-width:650px){.feature-main{padding:20px 14px}.feature-head{flex-direction:column}.feature-stats{grid-template-columns:1fr}.backup-grid{grid-template-columns:1fr}.backup-includes{grid-template-columns:1fr}.feature-row-actions{flex-wrap:wrap}.feature-select{flex:1}}
