.app.settings { flex-direction: row; }
.app.settings .set-nav { width: 190px; flex: none; display: flex; flex-direction: column; gap: 4px; padding: 12px 10px; border-right: 1px solid rgba(0,60,150,0.2); background: linear-gradient(180deg, rgba(255,255,255,0.55), rgba(215,236,255,0.4)); }
.app.settings .set-tab { display: flex; align-items: center; gap: 10px; border: 0; background: transparent; padding: 9px 10px; border-radius: 10px; color: #0b3a80; font: 600 0.92rem var(--font); cursor: pointer; text-align: left; }
.app.settings .set-tab img { width: 26px; height: 26px; object-fit: contain; }
.app.settings .set-tab:hover { background: rgba(140,205,255,0.3); }
.app.settings .set-tab.active { background: linear-gradient(180deg, #9fd6ff, #3aa0ff); color: #fff; text-shadow: 0 1px 1px rgba(0,30,90,0.5); }
.app.settings .set-pane { flex: 1; min-width: 0; overflow: auto; padding: 18px 22px; }
.app.settings .set-pane[hidden] { display: none; }
.app.settings h3 { margin: 0 0 12px; font-size: 1.2rem; }
.app.settings .wall-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; }
.app.settings .wall-item { aspect-ratio: 16/10; cursor: pointer; position: relative; }
.app.settings .wall-item img { width: 100%; height: 100%; object-fit: cover; display: block; }
.app.settings .wall-item.on { outline: 3px solid #3aa0ff; box-shadow: 0 0 0 5px rgba(120,200,255,0.5); }
.app.settings .wall-item.on::after { content: "✓"; position: absolute; right: 6px; bottom: 6px; width: 24px; height: 24px; border-radius: 50%; background: linear-gradient(180deg, #c8ff8a, #4fb31a); color: #fff; font-weight: 700; display: grid; place-items: center; box-shadow: 0 2px 4px rgba(0,0,0,0.3); }
.app.settings .wall-del { position: absolute; top: 6px; right: 6px; width: 22px; height: 22px; border-radius: 50%; border: 1px solid rgba(255,255,255,0.8); background: linear-gradient(180deg, #ffb3a3, #e0432a); color: #fff; font-size: 0.7rem; cursor: pointer; }
.app.settings .set-row { display: flex; align-items: center; gap: 12px; margin-top: 14px; flex-wrap: wrap; }
.app.settings .set-hint { font-size: 0.82rem; opacity: 0.75; margin: 8px 0 0; }
.app.settings .set-switch { display: flex; align-items: center; gap: 12px; cursor: pointer; font-weight: 600; }
.app.settings .set-switch input { display: none; }
.app.settings .set-switch .sw { width: 46px; height: 26px; border-radius: 999px; background: linear-gradient(180deg, #d8e6f5, #b7cde6); border: 1px solid #7fa9d8; position: relative; transition: background 0.2s; flex: none; }
.app.settings .set-switch .sw::after { content: ""; position: absolute; top: 2px; left: 2px; width: 20px; height: 20px; border-radius: 50%; background: linear-gradient(180deg, #fff, #d9ecff); box-shadow: 0 2px 4px rgba(0,40,120,0.35); transition: transform 0.2s; }
.app.settings .set-switch input:checked + .sw { background: linear-gradient(180deg, #a9ecff, #1e90ff); }
.app.settings .set-switch input:checked + .sw::after { transform: translateX(20px); }
.app.settings .set-account { display: flex; align-items: center; gap: 12px; margin-bottom: 10px; }
.app.settings .set-account img { width: 56px; height: 56px; border-radius: 50%; }
