/* ui/app/man.css — bố cục riêng của APP NHIỀU MÀN. Chỉ var(--…) của ../_chung/kieu.css (lưới logic/kieu-giao-dien.test.ts).
   Luật: nút chính ở nửa dưới (thanh đáy dính); mỗi màn MỘT nút đặc màu nhấn (Gửi); chip đầu trang xuống hàng, không cuộn
   ngang; con số làm việc to và đậm (--chu-so), nhãn nhỏ. */
.man-vao { position: fixed; inset: 0; z-index: 30; overflow-y: auto; background: var(--nen); padding: var(--k2); }
.man-vao.an { display: none; }
.man-vao .the { margin-top: var(--k4); padding: var(--k3) var(--k2); }
.man-vao h1 { margin: 0 0 var(--k1); }
.man-vao .nut { width: 100%; }

.dau-trang-nhan .chip.tren-nhan { min-height: var(--chip-cao); }
.dau-trang-nhan .chip.tren-nhan:disabled { cursor: default; opacity: 1; }
.hang-chip-dau { margin-top: var(--k1); }
.than-app { min-height: calc(var(--k6) * 8); padding-bottom: calc(env(safe-area-inset-bottom) + var(--k6) * 2); }
body.co-day .than-app { padding-bottom: calc(env(safe-area-inset-bottom) + var(--k6) * 4); }
.muc { margin: var(--k3) 0 var(--k1); }
.muc:first-child { margin-top: var(--k1); }
.khoi { display: block; }

/* menu: mỗi màn một thẻ bấm được, cả thẻ là nút */
.luoi-menu { display: flex; flex-direction: column; gap: var(--k1); padding-top: var(--k1); }
.o-menu { display: flex; align-items: center; gap: var(--k2); width: 100%; min-height: var(--nut-cao-lon); border: 0; text-align: left; cursor: pointer; color: var(--chu); }
.o-menu .bt { color: var(--mau-nhan); }
.o-menu:active { background: var(--mau-nhan-nen); }

/* bao: ba ô số một hàng (nước · bột ướt · số mác) */
.bao { display: flex; flex-direction: column; gap: var(--k1); }
.bao.lech { border: var(--vien-day) solid var(--cho); }
.luoi-3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--k1); }
.so-o { font-size: var(--chu-so); font-weight: var(--dam-dam); font-variant-numeric: tabular-nums; padding: 0 var(--k1); }
.so-lon-o { font-size: var(--chu-so-lon); font-weight: var(--dam-dam); font-variant-numeric: tabular-nums; min-height: var(--nut-cao-lon); }
.them { margin-top: var(--k1); }
.nut.nho.phu { flex: 1 1 0; }

/* thanh đáy dính: tóm tắt + dòng báo + nút Gửi — vùng ngón cái (luật 1) */
.thanh-day {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 10; display: flex; flex-direction: column; gap: var(--k1);
  padding: var(--k1) var(--k2) calc(env(safe-area-inset-bottom) + var(--k1));
  background: var(--the); border-top: var(--vien-manh) solid var(--vien-nhat);
}
.thanh-day .o-loi { min-height: 0; margin: 0; }
.bao-xong { display: flex; align-items: center; gap: var(--k0); color: var(--xong); font-weight: var(--dam-vua); }
.bang-truot .o-loi { min-height: 0; }