
.settings-page{display:grid;gap:12px}
.settings-header{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.settings-header h1{margin:4px 0}
.settings-header p{margin:0;color:var(--muted);font-size:12px}
.final-version-badge{padding:7px 10px;border-radius:999px;background:rgba(52,199,89,.14);border:1px solid rgba(52,199,89,.25);color:#7bea9c;font-weight:900;font-size:11px}
.settings-card{padding:14px;border-radius:20px;background:var(--surface);border:1px solid var(--line)}
.settings-form-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:9px}
.settings-form-grid label{display:grid;gap:5px}
.settings-form-grid label.full{grid-column:1/-1}
.settings-form-grid span{font-size:10px;color:var(--muted);text-transform:uppercase}
.settings-form-grid input,.settings-form-grid select,.settings-row select{width:100%;padding:11px;border-radius:12px;border:1px solid var(--line);background:var(--surface-2);color:var(--text)}
.settings-card .primary-button{margin-top:12px}
.settings-row{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:center;padding:12px 0;border-bottom:1px solid var(--line)}
.settings-row:last-child{border-bottom:0}
.settings-row strong,.settings-row small{display:block}
.settings-row small{color:var(--muted);margin-top:4px}
.settings-row select{width:auto;min-width:135px}
.accent-picker{display:flex;gap:8px}
.accent-picker button{width:30px;height:30px;border-radius:50%;border:3px solid transparent;background:var(--dot)}
.accent-picker button.active{border-color:var(--text)}
.toggle{position:relative;width:50px;height:30px}
.toggle input{opacity:0;width:0;height:0}
.toggle span{position:absolute;inset:0;border-radius:999px;background:#2c2c2e;transition:.2s}
.toggle span::after{content:"";position:absolute;width:24px;height:24px;left:3px;top:3px;border-radius:50%;background:#fff;transition:.2s}
.toggle input:checked+span{background:var(--success)}
.toggle input:checked+span::after{transform:translateX(20px)}
.backup-status,.privacy-note{padding:11px;border-radius:14px;background:rgba(10,132,255,.08);border:1px solid rgba(10,132,255,.2);color:#cfe4ff;font-size:12px;line-height:1.45}
.settings-actions-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:9px;margin-top:12px}
.file-button{text-align:center}
.danger-button{grid-column:1/-1;border:1px solid rgba(255,69,58,.28);border-radius:14px;padding:12px;background:rgba(255,69,58,.12);color:#ff8178;font-weight:900}
.app-info-list{display:grid;gap:0}
.app-info-list>div{display:flex;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid var(--line)}
.app-info-list>div:last-child{border-bottom:0}
.app-info-list span{color:var(--muted)}
body.light-mode{--bg:#f2f2f7;--surface:#ffffff;--surface-2:#f7f7fa;--line:#d1d1d6;--text:#111111;--muted:#6e6e73;background:#f2f2f7;color:#111}
body.light-mode .app-header{background:rgba(242,242,247,.92)}
body.light-mode .tab-bar{background:rgba(250,250,250,.96)}
@media(max-width:560px){
  .settings-form-grid,.settings-actions-grid{grid-template-columns:1fr}
  .settings-form-grid label.full,.danger-button{grid-column:1}
  .settings-row{grid-template-columns:1fr}
}

/* v3.0.21 usability refinements */
.backup-status strong{font-size:1.05em;color:var(--text, #fff)}
.accent-picker button{position:relative}
.accent-picker button:focus-visible{outline:3px solid var(--accent);outline-offset:4px}
.final-version-badge{min-width:92px;text-align:center}
@media (max-width:480px){.settings-actions-grid{gap:12px}.settings-actions-grid>*{min-height:54px}.app-info-list>div{gap:16px}}
