# SettingsRow
Hàng bấm được trong hộp thoại Cài đặt: icon, nhãn và giá trị hiện tại căn phải.

## Khi nào dùng
- Danh sách tuỳ chọn trong Cài đặt (Hướng dẫn, Có gì mới, Màu giao diện, Sao lưu…).
- Mỗi hàng mở một hộp thoại con hoặc bật/tắt một tuỳ chọn; giá trị hiện tại nằm ở `__value`.

## Biến thể
| Biến thể | Lớp | Dùng khi |
|---|---|---|
| Mặc định | `tt-settings-row` | Tuỳ chọn thường |
| Thành công | `tt-settings-row tt-settings-row--success` | "Cập nhật bản mới": nền xanh bạc hà, viền `target` |
| Cảnh báo | `tt-settings-row tt-settings-row--warn` | Hành động phá dữ liệu ("Xoá dữ liệu", "Chơi lại từ đầu") |
| Danh sách | `tt-settings-list` | Cột các hàng, gap 5px; thêm `tt-settings-list--scroll` để cuộn dọc (tối đa 58vh) như hộp thoại gốc |

## Cấu trúc
```html
<div class="tt-settings-list">
  <button class="tt-settings-row">
    <span class="tt-settings-row__icon"><img class="tt-ico" src="assets/Icons/ic_book.png" alt=""></span>
    Có gì mới<small class="tt-settings-row__value">v12.47.144</small>
  </button>
</div>
```

## Trạng thái
| Trạng thái | Hiệu ứng |
|---|---|
| Mặc định | Nền `bg`, viền 2px `line`, bo 14px, cao tối thiểu 52px |
| `--warn` | Chữ `warn`, viền pha 40% `warn` với `line` |
| `--success` | Gradient 135° pha `mint` 18% → 30% với `panel`, viền `target` |
| `:disabled` | Opacity .4 (bổ sung) |

## Token sử dụng
`bg`, `panel`, `line`, `ink`, `soft`, `warn`, `mint`, `target`, `radius-14`, `space-4/6/12/14`.

## Khả năng tiếp cận
- Mỗi hàng là `<button>` thật; icon trang trí dùng `alt=""` hoặc `aria-hidden`.
- Giá trị phụ (`__value`) nằm trong nút nên được đọc cùng nhãn.
- `soft` trên `bg` đạt từ 5.52:1; `warn` đi kèm icon ở hàng cảnh báo.

## Nên / Không nên
| Nên | Không nên |
|---|---|
| Đặt giá trị hiện tại ở `__value` ("Bật", "Tắt") | Dùng `--warn` cho tuỳ chọn thường |
| Dùng `--success` riêng cho việc cập nhật | Dùng nhiều hàng `--success` trong một danh sách |

## Nguồn
`.setl` (max-height 58vh + cuộn thành `--scroll`, tắt mặc định), `.setb`, `.setb span`, `.setb span .ico`, `.setb small`, `.setb.warnb` — css/style.css; nút `#sUpdate` trong `showSettings()` — js/game.js.
- Style nội tuyến của "Cập nhật bản mới" (`#e3f7ed→#d1f2e1`, viền `#5aae86`) đổi sang `color-mix` với `mint`/`panel` để hợp cả Đêm dịu; viền dùng `target`.
- `.setb small` gốc không đặt cỡ chữ riêng (kế thừa); ở đây dùng .78rem cho giá trị phụ giống `.sbtn`.
- `.setb` bị khai báo hai lần trong style.css (có bản 38px/.86rem); bản đầy đủ 52px/1rem được dùng.