# Việc còn để sau

Các điểm nhỏ (minor) chưa xử lý và những thứ cố ý chưa làm. Nhóm theo component; không việc nào chặn việc dùng design system.

## Chung

- Chữ trắng trên `pink` (2.86:1 ở Kem sữa, 2.27:1 ở Đêm dịu) và `mint`/`warn` làm chữ dưới chuẩn 4.5:1: giữ đúng màu gốc của game, đã ghi trong usage note của token.
- Chưa có bản bọc React; component hiện là HTML/CSS lớp `tt-` + JS vanilla `window.TTMU`.
- Chưa đưa vào assets: Thần Mèo Karin (nhân vật có bản quyền), QR Threads của dev gốc. Ảnh minigame Bầu Cua và xóc đĩa đã có ở `assets/Minigame`. Nút Bầu Cua, Xì Dách trong preview HUD giữ như game.
- Các minigame còn lại chưa dựng thành component (Tìm nghi phạm, câu đố toán, Tìm cặp, Mega 6/45, Xếp ly…): xem `docs/minigames-todo.md`.

- Các mục tương phản của bốn theme gốc (chữ trắng trên `pink`, `mint`/`warn` làm chữ, `soft` trên `line`, tab chưa chọn, gợi ý ô trống, % loading của splash…) vẫn giữ nguyên theo màu của game. `hc` (Tương phản cao) đạt ngưỡng tương phản AAA cho chữ (SC 1.4.6) và 3:1 cho viền, focus, đồ hoạ (SC 1.4.11) trên các preview, kể cả các trạng thái mở bằng JS có `data-audit-click`: `node scripts/audit.js hc` = 0 lỗi; số liệu của bốn theme gốc xem bằng `node scripts/audit.js kem --verbose`.
- Audit `hc` chưa đo (cần kiểm tra bằng mắt hoặc công cụ khác): chữ nằm trên tranh vẽ (9 dòng `over-image` ở splash và Cover); chữ sinh bởi `::before` / `::after`; trạng thái `:hover` và `:active`; cỡ chữ mà nơi dùng tự đặt (audit lấy cỡ chữ của preview); trạng thái JS không có `data-audit-click`.
- Audit `hc` cần làm tiếp: `backdrop()` bỏ qua `opacity` của phần tử đang giữ nền đục; heuristic bóng ở bước bề mặt còn lỏng (bất kỳ bóng không phải rgba nhạt đều tính 3:1); `focusProbe` bỏ qua im lặng phần tử không focus được (nên in số lượng bỏ qua); `audit.html` lấy danh sách component từ listing thư mục, nên để `audit.js` truyền `comps=`; preview vẫn chép cứng danh sách theme trong script đặt `data-theme`; lượt bấm `data-audit-click` chưa kiểm tra trạng thái đã thực sự mở (dialog không mở hay gauge không tới `is-hit` thì audit vẫn đo DOM tĩnh và thoát 0), nên thêm bước xác nhận trạng thái đổi cho từng trigger.
- Token: `alpha-*` và `fill-tabs` nằm trong `color.tokens` dù là giá trị không phải màu (độ đục, `color-mix`), gây vướng cho bên đọc `tokens.json` không phải CSS; nên tách nhóm riêng.
- `build.js` nên lint thêm: token có giá trị theo theme phải đủ cả 5 theme; `src/*.css` không chứa `[data-theme`; `TTMU.themes` khớp `tokens.json`.
- Thanh tiến độ: `fill-muted` làm rãnh chỉ cách `panel` 1.25:1 ở `hc` (đã có phần lấp là fill nên không mất thông tin, nhưng rãnh trống khó thấy).

## Button, IconButton, Chip, Stepper, PriceInput

- Preview còn dư chiều cao (marker `height` lớn hơn nội dung) ở Button, Chip, IconButton, Stepper.
- IconButton preview dùng inline style `margin-top`; PriceInput preview dùng inline style `justify-content`: đổi sang `tt-stack` hoặc `tt-row`.
- `tt-button--ghost` và `tt-button--accent` chỉ hợp lệ khi đi cùng `--small`; nên ghi rõ hoặc cho dùng độc lập.
- `.danger` / `.front-btn-megah`: phần bỏ `margin-top` của nguồn chưa mô tả đầy đủ.
- Stepper: chưa chặn `max` là NaN, `min > max`, `set(Infinity)`.

## ThemePicker

- Chưa có `aria-label` mặc định cho radiogroup.
- Khi id theme hiện tại không hợp lệ thì chưa có `tabindex` dự phòng.
- Picker giữ giá trị `current` trong bộ nhớ: gọi `TTMU.setTheme` từ ngoài làm picker lệch trạng thái.

## FolderTabs, Pager, Signboard, SplashScreen

- `TTMU.tabs`: `destroy()` chưa khôi phục `role`/`tabindex`/`hidden`; tabpanel chưa có `tabindex="0"` (tuỳ chọn theo ARIA).
- `Signboard --door`: font-weight 900 thay vì 800 của game; chưa tái tạo hình trang trí cửa (1.1rem, drop-shadow).
- `TTMU.fitStage` với `maxHeight` để sân khấu lệch trái: cần ghi chú trong README.
- SplashScreen: phần trang trí chưa dựng.

## Card, Rating, Review, ItemRow, StatTiles, Ledger

- `.tt-rating-summary__bar > i` là selector phần tử trần: đổi sang lớp `__fill`.
- Hai chỗ dùng `14px` thay vì `var(--space-14)` trong `src/30-data.css`.
- `.tt-card--goal` và `.tt-ledger` đặt dưới mục Avatar; `.tt-card--goal { margin: 0 }` không có tác dụng.
- Review: avatar emoji chưa có `role="img"` + `aria-label`.
- README token: danh sách của Ledger (radius, ink) và Card (ink) chưa chính xác; Ledger có thể thêm mẫu `role="table"`.

## Toast, Dialog

- Closure `hide` cũ có thể ẩn toast mới (cần token so sánh).
- Action thiếu label ra chuỗi "undefined".
- Dialog: kéo chuột từ card ra scrim làm đóng; Esc chưa `stopPropagation`.

## CustomerCard, PatienceBar, PourGauge, IngredientBin, CupSize

- `src/50-counter.css`: bo góc 9px/5px và khoảng cách 5/3/2px còn là số literal: tokenise hoặc ghi chú.
- IngredientBin: kích thước foam đặt bằng inline style (nên là modifier class); URL sprite theo từng bin đặt inline (nên là custom property `--tt-bin-sprite`).
- PourGauge: `role="progressbar"` và `aria-value*` của track chỉ do JS thêm; markup tĩnh trong README (mục Cấu trúc) chưa có, nên khi không có JS track không có ngữ nghĩa; thiếu `aria-valuetext`; `destroy()` gọi `onStop` giữa lúc đang rót; `pointerup`/`keyup` dừng bất kể bắt đầu bằng thiết bị nào.

## Cover

- Ghi chú dẫn xuất nói chalk có đáy y=268, thực tế là đáy counter (chalk 260); các `r` là hình học literal chứ không lấy từ token radius.
- Khối pink của theme Nâu cà phê gần màu counter (có khe nền ngăn cách).

## Toast, Alert, UrgentAlert, Countdown

- Countdown và UrgentAlert còn px literal (giá trị của game); ghi chú token `urgent-bg` chưa có tỉ lệ tương phản.

## UpgradeCard, StaffCard, PartyContract, GiftCard, SavingsCard, OnlineOrder, FriendRow

- Chữ nhỏ `pink` / `pink-d` trong GiftCard và OnlineOrder dưới 4.5:1 ở Kem sữa và Đêm dịu (cặp màu của game, đã ghi); `hc` đạt.
- SavingsCard chưa hiện số lãi đã tích luỹ.
- ShipperBadge chưa được OnlineOrder dùng (trạng thái chờ shipper là `tt-badge` chữ).
- Trùng mẫu: `tt-savings-card__facts` / `__fact` ≈ `tt-stat-tiles` (và cùng nguồn với `tt-party-contract__box`); `tt-switch--row` ≈ `tt-settings-row`; trạng thái "Đang giao / đang tới lấy" hiện theo hai cách (`tt-badge--muted` trong OnlineOrder và `tt-shipper__status` trong ShipperBadge). Nên gộp thành một khối dùng chung.

## Tooltip, Switch, Slider, Spinner, Skeleton

- Tooltip gắn bộ nghe `window` ngay cả khi đang ẩn; mẫu tooltip `--inline` trong tài liệu có `role="tooltip"` mà không có trigger.
- Tooltip: biến `held` không được đặt lại sau khi nhấn giữ trên thiết bị lai, nên chuột phải sau đó có thể bị chặn.

## Minigame (BetChips, MinigameWallet, MinigameResult, BauCuaBoard, DiceBowl, PlayingCard, CardHand, XiDachSeat, XiDachTable)

Danh sách việc nhỏ chưa xử lý của nhóm Minigame; kế hoạch các minigame còn lại nằm ở `docs/minigames-todo.md`.

- Token `tie` đang dùng cho cả cảnh báo (nên có token `notice` riêng); `__sub` của BauCuaBoard có `aria-label` tĩnh, chưa theo `data-name`; mặt xúc xắc `die-face` có thể là alias của `awning-white`; các token `felt-*` gần trùng nhau về màu mực.
- MinigameWallet: số tiền chưa là live region. DiceBowl: markup tĩnh (không JS) để lộ xúc xắc cho trình đọc màn hình.
- XiDachTable: danh sách luật dùng selector thẻ `strong`.
- CardHand: `setResult` với loại lạ xoá trạng thái cũ trước khi kiểm tra loại; XiDachSeat: trạng thái `is-standing` chưa có CSS; token `--den` là alias dư; cỡ `--mini` của PlayingCard là bổ sung của design system (game không có); tổ hợp nút `accent` + `ghost` cần ghi rõ ý định.
- Emoji và trình đọc màn hình chưa theo một quy tắc chung giữa hai game: preview XiDachTable để "🎯" trong nhãn chip, `show()` của preview BauCuaBoard chèn icon không `aria-hidden`, nhãn nút và tiêu đề có emoji bị đọc thành tên emoji. Cần chọn một quy tắc (emoji trang trí luôn bọc `aria-hidden`, nhãn đọc bằng chữ).
- Bầu Cua tự dựng nút `tt-baucua__action`, `tt-baucua__sub`, `tt-dicebowl__roll` (gần `tt-button--primary`), còn Xì Dách dùng lại `tt-button`; nên thống nhất về `tt-button`.
- Tên API chưa đồng nhất: `setDisabled(flag)` (Bầu Cua) so với `enable(name, flag)` (XiDachTable) và `setCanSettle(flag)` (XiDachSeat); `onSettle(seatEl)` của XiDachSeat so với kiểu `(id, el)` của BauCuaBoard.
- `diceBowl.roll(faces)` không kiểm tra số mặt khớp số xúc xắc (thừa hoặc thiếu mặt thì bỏ qua lặng lẽ).
- Điểm lệch có chủ ý so với game: game hiện 5 mức chip, "Tất tay" là bổ sung của design system; biểu tượng 🎂 và ⚠️ trên nhãn tay bài là bổ sung; nhãn "Chọn lại" / "Nhân đôi ×2" viết thường hơn "Chọn Lại" / "Nhân Đôi x2" của game; nút của DiceBowl là "Lắc" thay "🧋 MỞ HỘP MAY MẮN" cho vừa cột 125px.
- Công thức pha màu trạng thái `mint 14% / warn 10% / gold 22% / street 8%` lặp lại ở ba khối (XiDachSeat, CardHand, MinigameResult); có thể gom thành token hoặc biến cục bộ `--tt-*`.
- Markup mẫu dùng id cố định (`banner`, `rules-title`, `chips-label`): một trang có hai bàn thì id phải riêng cho từng bàn (`aria-describedby`, `aria-labelledby` trỏ đúng).
- `docs/minigames-todo.md`: một số khoảng dòng CSS ở mục 5 và 6 chồng nhau, mục 7 dùng khoảng dòng rộng; nên thu hẹp khi dựng component.

## Gallery (index.html)

- Neo mục lục dùng `scroll-margin-top: 70px`, quá nhỏ khi header dính xuống dòng ở 360px.
- Iframe đang hiện tải hai lần khi khôi phục theme khác mặc định từ localStorage (tải kem rồi đổi src).