/* Say Piano – tầng MÁY TÍNH BẢNG (chủ dự án 2026-10-19: Galaxy Tab S9 FE+ 12,4", 2560×1600 → khung CSS ngang 1280×800 / 1463×914).
 * Trên máy bảng "vừa" là chưa đủ: giao diện phải PHÓNG LÊN cho cân màn lớn, không như bố cục điện thoại lọt thỏm giữa khoảng trống.
 * Bậc: rộng ≥ 1000 px và cao ≥ 600 px. Nạp SAU mọi tệp CSS khác (app.html).
 *
 * Cách phóng:
 *  - Khung màn app (thanh dọc + khung phải của Hôm nay, Tác phẩm, Xếp hạng, Cửa hàng, Tôi…): `zoom` (--bang) trên .rail và .scr__khung –
 *    phần tử co giãn theo flex/phần trăm nên vẫn đúng một màn hình, mọi chữ / nút / thẻ to theo. Không dùng ở màn có toạ độ tính bằng
 *    JS + con trỏ (bản đồ Khu rừng – chỉ phóng phần nổi; Xem bản nhạc – chỉ phóng hai thanh; khối làn Khởi động).
 *  - Màn bài học (.gm): phóng thanh trên; chữ, nút, nhân vật, bàn phím (phím trắng ≤ 72 px – ban-phim.js rongToiDa) và bản nhạc to theo
 *    clamp/cqh sẵn có, nâng trần ở đây. Thanh phản hồi / chân không dùng zoom (phan-hoi.js đo chiều cao).
 * Không dùng tính năng CSS mới ngoài những gì app đã dùng (WebView 105: zoom, clamp, :has, container query). */

@media (min-width: 1000px) and (min-height: 600px) {
  :root { --bang: 1.2; }

  /* ---------- khung app ---------- */
  .scr--ngang > .rail { zoom: var(--bang); }
  .scr--ngang:not(.scr--kr):not(.scr--bn) > .scr__khung { zoom: var(--bang); }
  /* bản đồ Khu rừng: chỉ phóng phần nổi (thanh trên, bảng Vùng, bản đồ nhỏ, chú thích) – bản đồ giữ toạ độ thật */
  .scr--kr .scr__top, .scr--kr .kr-dau, .scr--kr .kr-mini, .scr--kr .kr-ghichu { zoom: var(--bang); }
  /* Xem bản nhạc: thanh trên + thanh dưới to; bản nhạc có nút thu phóng riêng (mặc định đã trải hết chiều cao) */
  .scr--bn .scr__top, .scr--bn .bn-duoi { zoom: var(--bang); }

  /* ---------- bài học ---------- */
  .gm-top { zoom: var(--bang); }
  .gm__main { padding-left: 32px; padding-right: 32px; }
  .gm { --trai: clamp(260px, 30%, 420px); }
  .gm-ask .gm-ask__q { font-size: clamp(18px, 3.4cqh, 26px); }
  .gm-ask__bong { padding: 12px 18px 14px; border-radius: 24px; }
  .gm-ask__bai { font-size: 15px; }
  .gm-btn { min-height: 62px; font-size: 20px; border-radius: 20px; }
  .gm-foot .gm-btn { min-width: 300px; }
  .gm-sheet { font-size: 18px; }
  .gm-sheet .gm-btn { min-width: 300px; min-height: 58px; }
  .gm-card { font-size: 20px; }
  .gm-opts:not(.gm-opts--grid) .gm-card { min-height: clamp(56px, 16cqh, 96px); }
  /* bàn phím: phím cao hơn (bề ngang chia đều, phím trắng ≤ 72 px – game/ban-phim.js) */
  .gm-bp__keys { height: clamp(150px, 34cqh, 240px); }
  .gm-man--kb-rong { --bp-h: clamp(140px, 32cqh, 230px); }
  .gm-bp__ten { padding: 2px 7px; }
  /* màn đàn: lời nhân vật, nút ▶ to */
  .gm-dt__loi-chu { font-size: 19px; }
  .gm-dt__loi-ch svg, .gm-dt__loi-ch img { height: 52px; }
  .gm-dt__go { width: 108px; height: 108px; }
  .gm-dt.is-midi .gm-dt__go { width: 120px; height: 120px; }
  .gm-dt__go-chu { font-size: 17px; }
  .gm-dt__sau { min-height: 52px; font-size: 17px; }
  .gm-dt__khuong { padding: 16px 22px 12px; }
}
/* 1280×800 (Tab S9 FE+), 1463×914 (cỡ chữ hiển thị nhỏ hơn) */
@media (min-width: 1000px) and (min-height: 760px) { :root { --bang: 1.32; } }
@media (min-width: 1300px) and (min-height: 880px) { :root { --bang: 1.45; } }

/* bản đồ Khu rừng trên máy bảng: nút to hơn (toạ độ do JS đặt – không zoom), sóng đường đi cao hơn (game/ban-do-rung.js bienDoCong) */
@media (min-width: 1000px) and (min-height: 600px) {
  .kr-nut { width: 70px; height: 70px; margin: -35px 0 0 -35px; }
  .kr-nut.is-hien-tai { width: 82px; height: 82px; margin: -41px 0 0 -41px; }
  .kr-nut__mat b { font-size: 26px; }
  .kr-nut.is-mo .kr-nut__mat b { font-size: 23px; }
  .kr-ic { width: 30px; height: 30px; }
  .kr-nut.is-khoa .kr-ic { width: 26px; height: 26px; }
}

/* Hôm nay / Xếp hạng trên máy bảng (đã phóng --bang): danh sách dùng hết chiều cao thay vì dồn lên trên */
@media (min-width: 1000px) and (min-height: 600px) {
  .hn-nv__ds { justify-content: space-evenly; }
  .hn-nv__i { min-height: 56px; }
  .hn-nv__ic { width: 42px; height: 42px; border-radius: 13px; }
  .hn-nv__b > b { font-size: 15px; }
  .xh-cot { grid-template-rows: repeat(5, minmax(40px, 74px)); align-content: space-evenly; gap: 6px; }
  .xh-cot:not(.xh-cot--minh) { height: 100%; }
  .xh-cot--minh { grid-template-rows: 48px; }
  .xh-dong { font-size: 16px; }
}

/* Gõ tiết tấu trên máy bảng: thẻ tiết tấu, nút và ô gõ to theo màn */
@media (min-width: 1000px) and (min-height: 600px) {
  .gm-tt__mau svg { max-height: clamp(80px, 30cqh, 210px); }
  .gm-tt__mau:has(> svg:nth-child(2)) svg { max-height: clamp(60px, 19cqh, 150px); }
  .gm-tt__mau:has(> svg:nth-child(3)) svg { max-height: clamp(44px, 15cqh, 110px); }
  .gm-tt__mau:has(> svg:nth-child(4)) svg { max-height: clamp(36px, 11cqh, 90px); }
  .gm-tt__trai > .gm-tt__mau { padding: 14px 18px; }
  .gm-tt__row .gm-play, .gm-tt__row .gm-tt__go { min-height: 60px; padding: 0 22px; border-radius: 18px; font-size: 20px; }
  .gm-tt__row .gm-play__ico svg { width: 28px; height: 28px; }
  .gm-tt__trai > .gm-tt__msg { font-size: 17px; }
  .gm-tt__phai > .gm-pad { width: clamp(220px, 34cqw, 400px); height: clamp(150px, 40cqh, 300px); border-radius: 30px; font-size: 22px; }
  .gm-tt__phach { width: 34px; height: 34px; }
  .gm-tt__dem-so { font-size: 52px; }
  .gm-dt__phim .gm-bp__keys { height: clamp(150px, 32cqh, 260px); }
}