*{box-sizing:border-box}
body{margin:0;font-family:'Be Vietnam Pro',system-ui,-apple-system,sans-serif;background:#FBFAF8;color:#163056;-webkit-font-smoothing:antialiased}
a{color:#39688E;text-decoration:none}a:hover{color:#163056}
.scr{width:390px;background:#FBFAF8;display:flex;flex-direction:column}
.pad{padding:0 24px}
.t-khonglo{font-weight:900;font-size:56px;line-height:1;letter-spacing:-3px;margin:0}
.t-lon{font-weight:900;font-size:40px;line-height:1.05;letter-spacing:-2.5px;margin:0}
.t-vua{font-weight:800;font-size:30px;line-height:1.1;letter-spacing:-2px;margin:0}
.t-solon{font-weight:900;font-size:44px;line-height:1;letter-spacing:-2.5px;margin:0}
.t-td1{font-weight:700;font-size:22px;line-height:1.3;letter-spacing:-1px;margin:0}
.t-td2{font-weight:600;font-size:17px;line-height:1.4;letter-spacing:-.5px;margin:0}
.t-manh{font-weight:600;font-size:15px;line-height:1.5;margin:0}
.t-thuong{font-weight:400;font-size:15px;line-height:1.5;margin:0}
.t-nho{font-weight:500;font-size:13px;line-height:1.4;margin:0}
.t-nhan{font-weight:600;font-size:11px;line-height:1.3;letter-spacing:4px;text-transform:uppercase;margin:0}
.mo{color:#8195AC}.vua{color:#39688E}
.the{background:#FFFFFF;border-radius:28px;box-shadow:0 8px 22px rgba(22,48,86,.10)}
.bong-mem{box-shadow:0 2px 8px rgba(22,48,86,.06)}
.bong-cao{box-shadow:0 18px 44px rgba(22,48,86,.14)}
.o{display:flex;flex-direction:column;gap:8px}
.hang{display:flex;align-items:center}
.nhap{height:52px;border:1.5px solid #E7E1D7;border-radius:18px;background:#FFFFFF;display:flex;align-items:center;padding:0 18px;font-size:15px;font-weight:500;color:#163056}
.nhap.rong{color:#8195AC;font-weight:400}
.nut{height:52px;border-radius:999px;background:#163056;color:#FFFFFF;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:16px;letter-spacing:-.3px;box-shadow:0 8px 22px rgba(22,48,86,.18)}
.nut.phu{background:#FFFFFF;color:#163056;border:1.5px solid #C9D3DE;box-shadow:none}
.o3d{border:1.5px dashed #C9D3DE;border-radius:18px;display:flex;align-items:center;justify-content:center;text-align:center;color:#8195AC;font-size:11px;font-weight:600;letter-spacing:.4px;padding:10px;background:rgba(238,243,248,.45)}
.ma-o{width:44px;height:56px;border:1.5px solid #E7E1D7;border-radius:14px;background:#FFFFFF;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:24px}
.ma-o.dang{border-color:#163056;border-width:2px}
.phim{height:62px;border-radius:18px;background:#FFFFFF;border:1px solid #E7E1D7;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:24px}
.nav{height:78px;border-top:1px solid #E7E1D7;background:#FFFFFF;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));align-items:center;padding-top:6px}
.nav div{display:flex;flex-direction:column;align-items:center;gap:6px;font-size:11px;font-weight:600;color:#8195AC}
.nav div.on{color:#163056}

/* ---- lop app: bo khung tren la token tu ban Figma da duyet, khong sua ---- */
html,body{background:#FBFAF8}
body{min-height:100vh}
.scr{width:100%;max-width:430px;margin:0 auto;min-height:100vh;position:relative;padding-bottom:96px}
/* Do uu tien phai CAO hon .man{display:none}, khong thi man da an van hien va
   ca app xep chong thanh mot trang dai. Vi vay .man.hien.giua chu khong .scr.giua. */
.man.hien.giua{display:flex;flex-direction:column;justify-content:center;padding-bottom:24px}
button,input{font-family:inherit;font-size:inherit;color:inherit}
button{border:0;background:none;cursor:pointer;-webkit-tap-highlight-color:transparent}
.nut{cursor:pointer;width:100%;transition:transform .12s ease,opacity .12s ease}
.nut:active{transform:scale(.985)}
.nut[disabled]{opacity:.45;cursor:default;transform:none}
input.nhap{width:100%;border:1.5px solid #E7E1D7;outline:none}
input.nhap:focus{border-color:#163056}
input.nhap::placeholder{color:#8195AC;font-weight:400}
.nav{position:fixed;left:50%;transform:translateX(-50%);bottom:0;width:100%;max-width:430px;z-index:20;
  padding-bottom:env(safe-area-inset-bottom)}
/* .nav dat display:grid nen thuoc tinh hidden mac dinh bi de len — phai noi lai. */
.nav[hidden]{display:none}
.nav button{display:flex;flex-direction:column;align-items:center;gap:6px;font-size:11px;font-weight:600;color:#8195AC;padding:0}
.nav button.on{color:#163056}
.loi{background:#FDECE7;border:1.5px solid #E8552E;color:#B33C1B;border-radius:16px;padding:12px 16px;font-size:13px;font-weight:600;line-height:1.45}
.mung{background:#E8F8F2;border:1.5px solid #2FC79A;color:#1B7A5C;border-radius:16px;padding:12px 16px;font-size:13px;font-weight:600;line-height:1.45}
.man{display:none}.man.hien{display:block}
.lop{position:fixed;inset:0;background:rgba(22,48,86,.45);display:flex;align-items:flex-end;justify-content:center;z-index:30}
.lop .hop{background:#FBFAF8;border-radius:32px 32px 0 0;width:100%;max-width:430px;padding:28px 24px calc(28px + env(safe-area-inset-bottom))}
.o-ma{display:flex;gap:8px;justify-content:space-between}
.o-ma input{width:100%;height:60px;text-align:center;font-weight:800;font-size:24px;border:1.5px solid #E7E1D7;border-radius:14px;background:#FFFFFF;outline:none;padding:0}
.o-ma input:focus{border-color:#163056;border-width:2px}
.lien{background:none;border:0;padding:0;color:#39688E;font-weight:600;font-size:13px;cursor:pointer;
  text-align:left;align-self:flex-start}
.o-ngay{height:60px;border-radius:16px;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:16px}
.o-ngay.chua{background:#FFFFFF;border:1.5px solid #E7E1D7;color:#8195AC}
.o-ngay.xong{background:#163056;color:#FFFFFF}
.o-ngay.nay{background:#FFFFFF;border:2px dashed #F9B635;color:#163056;font-weight:800}
.o-ngay.qua{background:#FF7A59;color:#FFFFFF;font-size:13px;font-weight:900;box-shadow:0 8px 22px rgba(255,122,89,.34)}
.tai{display:flex;align-items:center;justify-content:center;padding:40px 0;color:#8195AC;font-weight:600;font-size:13px}