/* Momigo Plus - Dòng Momigo. Design system pilot.
   Token thương hiệu kế thừa từ we-pilot/momigo/index.html (cùng bảng màu, cùng font). */
:root{
  --pink:#F0468C; --pink-d:#D63578; --pink-l:#FDECF4; --pink-grad:linear-gradient(135deg,#FF5C9A,#EC3F86);
  --logo-pink:#ED4E92; --logo-blue:#3457C4;
  --blue:#3B6FE0; --lav:#F3EEFF; --lav-b:#E3D9F7; --plus:#8B5CF6;
  --page:#FDF2F7; --card:#ffffff;
  --green:#3FA368; --green-l:#E7F6ED; --green-b:#BEE6CC;
  --amber:#B4741C; --amber-l:#FCF1E1; --amber-b:#F0D3A2;
  --red:#C43C46; --red-l:#FCEBEC; --red-b:#F3BEC2;
  --ink:#2C2740; --ink2:#6B6480; --mut:#A79FB5; --line:#F0E6EE;
  --font:'Inter',-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  --round:'Baloo 2',var(--font);
  --safe-top:env(safe-area-inset-top);
}
*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}
html,body{height:100%}
body{font-family:var(--font);background:#e6d7e6;color:var(--ink);overscroll-behavior-y:none}
button{font-family:inherit;border:none;background:none;color:inherit;cursor:pointer}
input,textarea,select{font-family:inherit;font-size:15px}

/* height chứ KHÔNG phải min-height: min-height làm khung phình theo nội dung,
   đẩy ô nhập và thanh tab ra ngoài màn hình trên điện thoại thật. */
/* overflow:clip chứ không chỉ hidden. hidden VẪN cuộn được bằng lệnh, nên
   scrollIntoView hoặc bàn phím ảo đẩy được cả khung lên vài chục pixel và thanh
   tab rời khỏi đáy màn hình. clip thì không có gì để cuộn. Trình duyệt cũ không
   hiểu clip sẽ dùng hidden ở dòng trên. */
#app{max-width:430px;margin:0 auto;height:100dvh;max-height:100dvh;background:var(--page);
     display:flex;flex-direction:column;position:relative;overflow:hidden;overflow:clip}

/* ── thanh trên ───────────────────────────────────────── */
/* ── KHỐI ĐẦU TRANG ────────────────────────────────────────────────
   Nổi trên trục, không chiếm chỗ trong dòng chảy. Cuộn xuống thì co lại
   và trục chạy xuyên bên dưới qua lớp kính mờ. */
.head{position:absolute;top:0;left:0;right:0;z-index:20;
  background:rgba(253,242,247,.66);-webkit-backdrop-filter:blur(18px) saturate(1.5);
  backdrop-filter:blur(18px) saturate(1.5);
  transition:background .18s}
/* Máy không có backdrop-filter thì nền phải ĐẶC, không thì chữ trục đè lên chữ header. */
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .head{background:var(--page)}
}
.head.mini{background:rgba(253,242,247,.78);box-shadow:0 6px 18px rgba(180,60,120,.07)}
/* Tắt hiệu ứng lúc ĐO. Đọc offsetHeight của phần tử đang chuyển trạng thái thì
   trả về con số DỞ DANG giữa chừng, và chỗ chèn cho trục sai theo. */
.head.nomo,.head.nomo *{transition:none !important}
.top{padding:calc(var(--safe-top) + 12px) 16px 8px;display:flex;align-items:center;gap:10px;flex:none;
  transition:padding .18s}
.head.mini .top{padding:calc(var(--safe-top) + 6px) 16px 2px}
.head.mini .logo{font-size:17px}
.logo{transition:font-size .18s}
.logo{font-family:var(--round);font-weight:800;font-size:21px;letter-spacing:-.01em}
.logo .mi{color:var(--logo-pink)} .logo .go{color:var(--logo-blue)} .logo .pl{color:var(--plus);font-size:12px;vertical-align:super;margin-left:3px;font-weight:700}
.top .grow{flex:1}
.top .chip{background:#fff;border:1px solid var(--line);border-radius:999px;padding:5px 11px;font-size:12px;font-weight:600;color:var(--ink2);white-space:nowrap}
.top .chip b{color:var(--pink-d)}

/* ── THẺ TIÊU ĐIỂM ─────────────────────────────────────────────────
   Trả lời câu "mẹ đang xem hành trình của bé nào". Đứng ở MỌI tab, vì
   câu hỏi đó không biến mất khi mẹ sang Cẩm nang hay Của tôi. */
.hero{display:flex;align-items:center;gap:11px;margin:2px 14px 8px;padding:9px 12px;border-radius:18px;
  background:linear-gradient(120deg,#FFEAF3 0%,#F6ECFF 52%,#EAF0FF 100%);
  border:1px solid #F3E2EE;box-shadow:0 2px 10px rgba(180,60,120,.06);cursor:pointer;flex:none}
.hero .ha{width:42px;height:42px;border-radius:50%;object-fit:cover;object-position:top center;
  background:rgba(255,255,255,.75);border:2px solid #fff;flex:none}
.hero .hi{flex:1;min-width:0}
.hero .hn{font-family:var(--round);font-weight:800;font-size:15px;color:var(--ink);line-height:1.2;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hero .hr{display:flex;align-items:center;gap:7px;margin-top:3px}
.hero .chip{background:rgba(255,255,255,.9);border:1px solid #F0DCEA;border-radius:999px;padding:2px 9px;
  font-size:11.5px;font-weight:700;color:var(--ink2);white-space:nowrap}
.hero .chip b{color:var(--pink-d)}
.hero .hd{font-size:11.5px;color:var(--ink2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hero .hx{font-size:19px;color:var(--mut);flex:none;line-height:1}
/* Chưa có ngày dự sinh: thẻ vẫn đứng, nhưng nói thẳng là đang thiếu chứ không
   nhạt đi thành trang trí - đây là lúc nó cần được bấm nhất. */
.hero.void{background:linear-gradient(120deg,#FFF6E8,#FFF0F5)}
.hero.void .hn{color:var(--ink)}

/* Đồng hồ lượt Momi AI, ngay trên ô nhập */
.ailine{flex:none;padding:0 18px 5px;font-size:11px;font-weight:600;color:var(--ink2);
  text-align:right;cursor:pointer;white-space:nowrap}
.ailine b{color:var(--plus)}
.ailine.low b{color:var(--pink-d)}
.pin{margin:0 16px 6px;background:var(--amber-l);border:1px solid var(--amber-b);color:#7d5214;border-radius:12px;padding:7px 11px;font-size:12.5px;display:flex;gap:7px;align-items:center;flex:none;cursor:pointer}
.ferr{color:var(--red);font-size:12px;line-height:1.5;margin:6px 2px 0;font-weight:600}
.pin.red{background:var(--red-l);border-color:var(--red-b);color:#912d35}
.pin b{font-weight:700}

/* ── trục ─────────────────────────────────────────────── */
.scroll{flex:1;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:2px 14px 8px}
/* padding-top do fitHead() đặt lúc chạy, đúng bằng chiều cao khối đầu trang lúc CHƯA co. */
.mark{display:flex;align-items:center;gap:9px;margin:14px 2px 9px;font-size:11px;font-weight:700;letter-spacing:.06em;color:var(--mut);text-transform:uppercase}
.mark:before,.mark:after{content:"";height:1px;background:var(--line);flex:1}
.mark.now{color:var(--pink)} .mark.now:before,.mark.now:after{background:var(--pink-l)}
.mark span{flex:none}

.cell{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:12px 13px;margin-bottom:9px;box-shadow:0 2px 8px rgba(180,60,120,.05);position:relative}
.cell .kk{font-size:10.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--mut);margin-bottom:5px;display:flex;align-items:center;gap:6px}
.cell .ti{font-family:var(--round);font-weight:700;font-size:15.5px;line-height:1.3;color:var(--ink);margin-bottom:4px;overflow-wrap:anywhere}
.cell .bd{font-size:13.5px;line-height:1.6;color:var(--ink);overflow-wrap:anywhere;word-break:break-word}
.cell .bd b{font-weight:700}
.cell .keep{margin-top:8px;padding-top:7px;border-top:1px dashed var(--line);font-size:11.5px;color:var(--ink2);display:flex;gap:6px;align-items:flex-start}
.cell .keep i{font-style:normal;flex:none}
.acts{display:flex;flex-wrap:wrap;gap:7px;margin-top:9px}
.act{border:1px solid var(--pink-l);background:var(--pink-l);color:var(--pink-d);border-radius:999px;padding:6px 12px;font-size:12.5px;font-weight:600}
.act.ghost{background:#fff;border-color:var(--line);color:var(--ink2)}
.act:active{transform:scale(.97)}
.cell[data-tap]{cursor:pointer}

.cell.say{padding-left:46px}
.cell .ava{position:absolute;left:10px;top:11px;width:26px;height:auto;border-radius:50%;background:#F6F1FF}
/* Ảnh minh hoạ trong ô. float:right để chữ chảy vòng quanh rồi xuống dưới -
   ô KHÔNG cao thêm khi thân dài, và ô có thân ngắn thì ảnh vẫn không tràn ra
   ngoài vì có min-height. Dùng position:absolute thì thân chạy ĐÈ lên ảnh. */
.cell .il{float:right;width:56px;height:56px;object-fit:contain;margin:0 0 6px 11px;shape-outside:circle()}
.cell .il.big{width:74px;height:74px}
.cell:has(.il){min-height:56px}
.cell:has(.il.big){min-height:74px}
/* Ô của mẹ và ô Momigo vừa nói không mang ảnh, nhưng phòng khi thêm sau: */
.cell.you .il{display:none}
@media (max-width:340px){.cell .il{width:46px;height:46px}.cell .il.big{width:58px;height:58px}}

/* Thẻ tiêu điểm lúc co: một dòng, bỏ nền thẻ (lớp kính của .head đã là mặt nền),
   giấu ngày dự sinh và mũi chevron. Vẫn giữ tên bé và tuần - đó là thứ trả lời
   "đang xem của ai", và câu hỏi đó không mất đi khi mẹ cuộn. */
.hero{transition:margin .18s,padding .18s,background .18s,border-color .18s,box-shadow .18s}
.hero .ha{transition:width .18s,height .18s}
.head.mini .hero{margin:0 12px 5px;padding:2px 4px;background:none;border-color:transparent;box-shadow:none;border-radius:12px}
.head.mini .hero .ha{width:26px;height:26px;border-width:1px}
.head.mini .hero .hn{font-size:13px}
.head.mini .hero .hd,.head.mini .hero .hx{display:none}
.head.mini .hero .hi{display:flex;align-items:center;gap:8px}
.head.mini .hero .hr{margin-top:0}
.head.mini .hero .chip{padding:1px 8px;font-size:11px}
/* Biểu tượng đầu dòng trong bảng trượt (thai giáo, mốc khám). Cùng bề rộng cho
   MỌI dòng để chữ thẳng cột - emoji rộng hẹp khác nhau, để tự nhiên thì so le. */
.kv .ic{font-style:normal;display:inline-block;width:21px;margin-right:8px;font-size:15px;line-height:1;vertical-align:-1px}
.kv .ic.dim{opacity:.45}
.cell.you{background:var(--pink-grad);border-color:transparent;color:#fff;margin-left:34px}
.cell.you .kk{color:rgba(255,255,255,.82)} .cell.you .bd{color:#fff}
.cell.wait .bd{color:var(--ink2);font-style:italic}
.cell.safe{background:var(--red-l);border-color:var(--red-b)}
.cell.safe .kk{color:var(--red)} .cell.safe .ti{color:#912d35}
.cell.human{background:linear-gradient(135deg,#fff,#F7F4FF);border-color:var(--lav-b)}
.cell.human .kk{color:#6D5AA8} .cell.human .ti{color:#4C3E7A}
.cell.watch{background:var(--amber-l);border-color:var(--amber-b)}
.cell.watch .kk{color:var(--amber)} .cell.watch .ti{color:#7d5214}
.cell.num{background:linear-gradient(135deg,#fff,#f4f8ff);border-color:#DCE6FA}
.cell.num .kk{color:var(--blue)}
.cell.mem{background:var(--lav);border-color:var(--lav-b)}
.cell.mem .kk{color:#6D5AA8} .cell.mem .ti{color:#4C3E7A}
.cell.log{background:var(--green-l);border-color:var(--green-b)}
.cell.log .kk{color:#2f7a4d}
.cell.exam{background:#fff;border-color:var(--amber-b);border-left:3px solid var(--amber)}
.cell.exam .kk{color:var(--amber)}
.cell.soon{background:repeating-linear-gradient(135deg,#fff,#fff 9px,#FBF7FF 9px,#FBF7FF 18px);border-color:var(--lav-b)}
.cell.soon .kk{color:var(--plus)}
.cell.soon .ti{color:#5B4A86}
.cell.note{background:#FFFBF3;border-color:#F3E3C6}
.cell.note .kk{color:#9A7326}
.cell.invite{background:linear-gradient(135deg,#fff,#F2F6FF);border-color:#D9E3F8}
.cell.invite .kk{color:var(--logo-blue)}
.ph{font-size:11.5px;color:var(--plus);background:#F6F1FF;border:1px dashed var(--lav-b);border-radius:9px;padding:6px 8px;margin-top:8px;line-height:1.5}

.fold{background:#fff;border:1px dashed var(--line);border-radius:999px;padding:7px 13px;margin:0 auto 9px;font-size:12.5px;color:var(--ink2);display:block;width:fit-content}
.trend{display:flex;align-items:flex-end;gap:3px;height:38px;margin:8px 0 2px}
.trend i{flex:1;background:var(--blue);opacity:.28;border-radius:2px 2px 0 0;min-height:3px}
.trend i.last{opacity:.85}
.hint{font-size:12px;color:var(--mut);text-align:center;padding:6px 20px 2px;line-height:1.5}

/* ── dải câu gợi ý ─────────────────────────────────────── */
.sugs{flex:none;display:flex;gap:7px;overflow-x:auto;padding:6px 12px 2px;scrollbar-width:none}
.sugs::-webkit-scrollbar{display:none}
.sug{flex:none;background:#fff;border:1px solid var(--pink-l);color:var(--ink);border-radius:999px;
     padding:8px 13px;font-size:12.5px;white-space:nowrap;box-shadow:0 1px 4px rgba(180,60,120,.06)}
.sug:active{background:var(--pink-l)}

/* ── ô nhập + tab ─────────────────────────────────────── */
.bar{flex:none;padding:8px 12px;background:rgba(255,255,255,.94);border-top:1px solid var(--line);display:flex;gap:8px;align-items:flex-end;backdrop-filter:blur(8px)}
.bar .plus{width:38px;height:38px;border-radius:50%;background:var(--pink-l);color:var(--pink-d);font-size:20px;font-weight:700;display:flex;align-items:center;justify-content:center;flex:none}
.bar .box{flex:1;background:#F7F2F6;border:1px solid var(--line);border-radius:19px;padding:9px 13px;display:flex;align-items:center;gap:8px;min-height:38px}
.bar .box input{flex:1;background:none;border:none;outline:none;font-size:14.5px;color:var(--ink)}
.bar .box input::placeholder{color:var(--mut)}
.bar .send{width:38px;height:38px;border-radius:50%;background:var(--pink-grad);color:#fff;font-size:16px;display:flex;align-items:center;justify-content:center;flex:none;opacity:.35;transition:opacity .15s}
.bar .send.on{opacity:1}
.tabs{flex:none;display:flex;background:#fff;border-top:1px solid var(--line);padding:6px 4px calc(env(safe-area-inset-bottom) + 6px)}
.tab{flex:1;text-align:center;padding:3px 0;color:var(--mut)}
.tab .ic{font-size:19px;line-height:1.25}
.tab .lb{font-size:10.5px;font-weight:600}
.tab.on{color:var(--pink)}

/* ── bảng trượt ───────────────────────────────────────── */
.sheet{position:absolute;left:0;right:0;bottom:0;background:#fff;border-radius:20px 20px 0 0;box-shadow:0 -8px 34px rgba(90,40,70,.18);transform:translateY(calc(100% + 24px));transition:transform .26s cubic-bezier(.3,.9,.3,1);z-index:40;max-height:82%;display:flex;flex-direction:column}
.sheet.up{transform:translateY(0)}
.sheet .sh{padding:14px 16px 8px;flex:none;display:flex;align-items:center;gap:10px;border-bottom:1px solid var(--line)}
.sheet .sh h3{font-family:var(--round);font-weight:700;font-size:17px;flex:1}
.sheet .sh .x{width:30px;height:30px;border-radius:50%;background:#F7F2F6;color:var(--ink2);display:flex;align-items:center;justify-content:center;font-size:15px}
.sheet .sb{overflow-y:auto;padding:12px 16px calc(env(safe-area-inset-bottom) + 16px)}
.grid{display:grid;grid-template-columns:1fr 1fr;gap:9px}
.tool{background:#fff;border:1px solid var(--line);border-radius:15px;padding:12px;text-align:left}
.tool .em{font-size:22px;display:block;margin-bottom:5px}
.tool .nm{font-size:13.5px;font-weight:700;font-family:var(--round)}
.tool .sb2{font-size:11.5px;color:var(--ink2);margin-top:2px;line-height:1.4}
.msg{margin-bottom:11px}
.msg .who{font-size:10.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--mut);margin-bottom:3px}
.msg .tx{font-size:13.5px;line-height:1.6;background:#F7F2F6;border-radius:13px;padding:9px 12px}
.msg.me .tx{background:var(--pink-grad);color:#fff}
.row{display:flex;gap:9px;align-items:center;margin-bottom:10px}
.row .lb{font-size:13px;color:var(--ink2);flex:1}
.fld{width:100%;padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:#FBF8FA;outline:none}
.fld:focus{border-color:var(--pink);background:#fff}
.btn{display:block;width:100%;padding:13px;border-radius:14px;background:var(--pink-grad);color:#fff;font-weight:700;font-size:15px;font-family:var(--round);margin-top:6px}
.btn.sec{background:#fff;border:1px solid var(--line);color:var(--ink)}
.btn:active{transform:scale(.99)}
.chips{display:flex;flex-wrap:wrap;gap:7px;margin:4px 0 10px}
.chip2{border:1px solid var(--line);background:#fff;border-radius:999px;padding:8px 13px;font-size:13px;color:var(--ink)}
.chip2.on{border-color:var(--pink);background:var(--pink-l);color:var(--pink-d);font-weight:600}
.kv{display:flex;justify-content:space-between;padding:9px 0;border-bottom:1px solid var(--line);font-size:13.5px}
.kv b{font-weight:700}
.note-s{font-size:11.5px;color:var(--ink2);line-height:1.55;margin-top:10px}

/* ── màn cửa vào / onboarding / cảm nhận ──────────────── */
.pane{flex:1;min-height:0;overflow-y:auto;padding:calc(var(--safe-top) + 26px) 22px 26px;display:flex;flex-direction:column}
.pane h1{font-family:var(--round);font-weight:800;font-size:26px;line-height:1.22;margin-bottom:9px}
.pane h2{font-family:var(--round);font-weight:700;font-size:20px;line-height:1.3;margin-bottom:7px}
.pane p{font-size:14px;line-height:1.62;color:var(--ink2);margin-bottom:13px}
.door{background:#fff;border:1px solid var(--line);border-radius:18px;padding:15px;margin-bottom:11px;text-align:left;width:100%;box-shadow:0 3px 12px rgba(180,60,120,.06)}
.door .dt{font-family:var(--round);font-weight:700;font-size:16.5px;margin-bottom:3px}
.door .dd{font-size:12.5px;color:var(--ink2);line-height:1.55}
.door.hi{border-color:var(--pink);background:linear-gradient(135deg,#fff,#FFF4F9)}
.disc{font-size:11.5px;color:var(--mut);line-height:1.6;margin-top:auto;padding-top:16px;border-top:1px solid var(--line)}
.steps{display:flex;gap:5px;margin-bottom:18px}
.steps i{height:3px;flex:1;background:var(--line);border-radius:2px}
.steps i.on{background:var(--pink)}
.big{font-family:var(--round);font-weight:800;font-size:34px;color:var(--pink-d);line-height:1}
.sum{background:#fff;border:1px solid var(--line);border-radius:16px;padding:14px;margin-bottom:12px}

/* ── phía trước: dải một dòng ───────────────────────────
   Dưới mốc HÔM NAY, ô cuối cùng phải là câu mới nhất của mẹ. Mọi thứ thuộc về
   tương lai co lại thành dải mảnh, chạm mới nở ra. Trước đây ô "Tuần sau" nằm
   dưới câu trả lời mới nhất nên mẹ tưởng đó mới là thứ Momigo vừa nói. */
.aheadwrap{margin-top:13px;padding-top:10px;border-top:1px dashed var(--line)}
.aheadwrap .ahl{font-size:10px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--mut);margin:0 2px 7px}
.ahead{width:100%;display:flex;align-items:center;gap:8px;background:#fff;border:1px dashed var(--lav-b);
       border-radius:12px;padding:8px 10px;margin-bottom:7px;text-align:left}
.ahead .k{flex:none;font-size:9.5px;font-weight:700;letter-spacing:.04em;color:var(--plus);
          background:#F6F1FF;border-radius:6px;padding:3px 7px;white-space:nowrap}
.ahead .t{flex:1;min-width:0;font-size:12.5px;color:var(--ink2);line-height:1.4;
          overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ahead .x{flex:none;color:var(--mut);font-size:15px;line-height:1}
.ahead.ex .k{color:var(--amber);background:var(--amber-l)}
.ahead:active{background:#FBF8FF}

/* ── dòng danh sách trong tab Của tôi / Tài khoản ───────
   Hai thẻ có nội dung ở trên, còn lại là dòng để tra cứu. Không đẻ thêm khuôn thẻ. */
.lrow{width:100%;display:flex;align-items:center;gap:11px;background:var(--card);border:1px solid var(--line);
      border-radius:14px;padding:12px 13px;margin-bottom:8px;text-align:left;box-shadow:0 2px 8px rgba(180,60,120,.05)}
.lrow .em{flex:none;font-size:19px;width:24px;text-align:center}
.lrow .mid{flex:1;min-width:0;display:block}
.lrow .nm{display:block;font-family:var(--round);font-weight:700;font-size:14.5px;color:var(--ink);line-height:1.25}
.lrow .sb3{display:block;font-size:12px;color:var(--ink2);margin-top:2px;line-height:1.4}
.lrow .x{flex:none;color:var(--mut);font-size:16px}
.lrow:active{background:#FDF9FC}

/* ── sổ của mẹ: dải tâm trạng 7 ngày ────────────────────
   Nhật ký và tâm trạng là MỘT chức năng: một emoji và mấy dòng chữ. */
.moods{display:flex;gap:5px;margin:9px 0 3px}
.moods i{flex:1;aspect-ratio:1;border-radius:9px;background:#FBF6FA;border:1px solid var(--line);
         display:flex;align-items:center;justify-content:center;font-size:16px;font-style:normal}
.moods i.na{color:var(--mut);font-size:11px}
.moods i.tod{border-color:var(--pink);background:var(--pink-l)}
.dnote{font-size:12.5px;color:var(--ink2);line-height:1.55;background:#FBF6FA;border-left:2px solid var(--lav-b);
       border-radius:0 8px 8px 0;padding:7px 10px;margin-top:8px}
.dnote b{display:block;font-size:10.5px;letter-spacing:.04em;text-transform:uppercase;color:var(--mut);margin-bottom:3px}
.ta{width:100%;min-height:86px;padding:11px 12px;border:1px solid var(--line);border-radius:12px;
    background:#FBF8FA;outline:none;resize:none;line-height:1.55;color:var(--ink)}
.ta:focus{border-color:var(--pink);background:#fff}
.more-t{font-size:12.5px;color:var(--ink2);text-decoration:underline;padding:8px 0;display:block}

/* ── sổ hỏi bác sĩ: dòng câu hỏi ghi được và đánh dấu được ── */
.qrow{display:flex;align-items:flex-start;gap:8px;padding:10px 0;border-bottom:1px solid var(--line)}
.qrow .qt{flex:1;min-width:0;font-size:13.5px;line-height:1.55;color:var(--ink);display:block}
.qrow .qw{display:block;font-size:11px;color:var(--mut);margin-top:3px}
.qrow .qx{flex:none;width:26px;height:26px;border-radius:50%;background:#F7F2F6;color:var(--mut);font-size:12px}
.qrow.done .qt{color:var(--mut);text-decoration:line-through}
.qrow.done .qw{text-decoration:none}

/* ── tường có tên ───────────────────────────────────────
   Nở ra tại chỗ mẹ vừa với tay. Tông tím Plus, KHÔNG dùng tông đỏ hay vàng -
   tông cảnh báo dành riêng cho an toàn, mượn nó để bán là lừa mắt mẹ. */
.cell.wall{background:linear-gradient(135deg,#fff,#F6F1FF);border-color:var(--lav-b);border-left:3px solid var(--plus)}
.cell.wall .kk{color:var(--plus)}
.cell.wall .ti{color:#5B4A86}
.cell.wall .act{background:var(--plus);border-color:var(--plus);color:#fff}
.cell.wall .act.ghost{background:#fff;border-color:var(--line);color:var(--ink2)}

/* ── cửa trial: số 0đ phải là thứ to nhất trên màn ────── */
.zero{background:linear-gradient(135deg,#FFF4F9,#F6F1FF);border:1px solid var(--lav-b);border-radius:16px;
      padding:16px;text-align:center;margin:10px 0 4px}
.zero .z0{font-family:var(--round);font-weight:800;font-size:40px;color:var(--pink-d);line-height:1}
.zero .zl{font-size:12.5px;color:var(--ink2);margin-top:3px}
.faq{padding:10px 0;border-bottom:1px solid var(--line)}
.faq > b{display:block;font-size:13px;color:var(--ink);margin-bottom:3px}
.faq span b{font-weight:700}
.faq span{display:block;font-size:12.5px;line-height:1.55;color:var(--ink2)}
.wait2{text-align:center;padding:22px 0;color:var(--ink2);font-size:13.5px;font-style:italic}

/* ── dòng khoá trong bảng trượt ─────────────────────────
   Vẫn thấy TÊN thứ bị khoá. Giấu đi thì mẹ không biết app có gì. */
.kv.lockrow{color:var(--mut)}
.kv.lockrow b{opacity:.55;font-weight:400}
.tool.lk{border-style:dashed}
.tool .lock{font-style:normal;font-size:11px;opacity:.6}
.gtitle{font-size:10.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--mut);margin:14px 2px 7px}
.gtitle:first-child{margin-top:2px}

/* vì sao ô này xuất hiện: một dòng, mờ hơn nội dung, không cạnh tranh với việc chính */
.vi{margin-top:6px;font-size:11.5px;line-height:1.5;color:var(--mut);font-style:italic}
/* nhãn phần giả lập: phải đọc được, không được mờ tới mức thành trang trí (D-32) */
.simline{margin:2px 14px 10px;padding:8px 10px;border-radius:10px;background:#FFF7E6;border:1px solid #F2E0B8;
  font-size:11.5px;line-height:1.55;color:#7A5B12}
/* bốn trụ giá trị Plus */
.tru{padding:10px 0;border-bottom:1px solid var(--line)}
.tru b{display:block;font-family:var(--round);font-size:14px;color:var(--ink);margin-bottom:2px}
.tru span{font-size:12.5px;line-height:1.6;color:var(--mut)}

/* chỗ trống CÓ NHÃN cho phần Momigo giải thích dấu hiệu (D-11) */
.phc{margin:8px 0 2px;padding:10px 12px;border-radius:12px;background:#F7F7FA;border:1px dashed #D8D8E2;
  font-size:12px;line-height:1.6;color:var(--mut)}
.phc b{display:block;font-family:var(--round);font-size:12.5px;color:var(--ink);margin-bottom:3px}