/* Màu/phông là TẠM (chưa lấy từ website moibeautymedspa.com). Đổi ở :root là xong. Không dùng phông/script bên ngoài. */
:root{--bg:#faf6f1;--card:#fff;--ink:#2b2623;--muted:#7a6f66;--accent:#8a6a4f;--accent-ink:#fff;--line:#e8dfd5;--bad:#b3261e;--ok:#2e6b4f;--warn:#9a6700;--r:14px}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:17px/1.5 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
h1,h2,h3{font-family:Georgia,"Times New Roman",serif;font-weight:500;margin:0 0 .4em;line-height:1.2}
h1{font-size:1.7rem}h2{font-size:1.4rem}h3{font-size:1.1rem}
.wrap{max-width:520px;margin:0 auto;padding:16px 16px 96px}
.brand{display:flex;justify-content:space-between;align-items:center;padding:6px 0 14px}
.logo{font-family:Georgia,serif;font-size:1.25rem;letter-spacing:.04em}
.langs{display:flex;gap:6px}.langs button{border:1px solid var(--line);background:#fff;border-radius:999px;padding:6px 12px;font:inherit;font-size:.85rem;color:var(--muted)}
.langs button.on{background:var(--ink);color:#fff;border-color:var(--ink)}
.bar{height:6px;background:var(--line);border-radius:6px;overflow:hidden;margin-bottom:18px}.bar i{display:block;height:100%;background:var(--accent);width:0;transition:width .25s}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:18px;margin-bottom:14px}
label{display:block;font-weight:600;margin:14px 0 6px}label.opt{font-weight:500}
input[type=text],input[type=tel],input[type=email],input[type=password],input[type=number],textarea,select{width:100%;font:inherit;padding:13px 14px;border:1px solid var(--line);border-radius:10px;background:#fff;color:var(--ink)}
textarea{min-height:84px;resize:vertical}input:focus,textarea:focus,select:focus,button:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.hint{color:var(--muted);font-size:.88rem;margin:4px 0 0}.err{color:var(--bad);font-size:.92rem;margin:8px 0 0;min-height:1.2em}
.choice{display:flex;gap:10px;align-items:flex-start;padding:12px 14px;border:1px solid var(--line);border-radius:10px;margin:8px 0;background:#fff;font-weight:500}
.choice input{margin-top:4px;width:20px;height:20px;flex:none;accent-color:var(--accent)}
.row{display:flex;gap:10px}.row>*{flex:1}
.btn{display:block;width:100%;border:0;border-radius:12px;padding:15px 18px;font:inherit;font-weight:600;background:var(--accent);color:var(--accent-ink);margin-top:16px}
.btn.sec{background:#fff;color:var(--ink);border:1px solid var(--line)}.btn.bad{background:var(--bad)}.btn:disabled{opacity:.5}
.btn.sm{display:inline-block;width:auto;padding:9px 14px;margin:0;font-size:.9rem}
.hide{display:none!important}.center{text-align:center}
.ok-ico{width:64px;height:64px;border-radius:50%;background:var(--ok);color:#fff;display:flex;align-items:center;justify-content:center;font-size:34px;margin:8px auto 14px}
.ghost{border:2px dashed var(--line);border-radius:12px;padding:14px;color:var(--muted);text-align:center}
.pill{display:inline-block;padding:2px 10px;border-radius:999px;font-size:.78rem;font-weight:600;background:#eee;color:#444;margin:2px 4px 2px 0}
.pill.warn{background:#fff3cd;color:var(--warn)}.pill.bad{background:#fde7e5;color:var(--bad)}.pill.ok{background:#e0f2e9;color:var(--ok)}.pill.star{background:#efe3ff;color:#5b3a99}
.dry{background:#fff3cd;color:#664d03;text-align:center;font-size:.85rem;padding:6px}
a.link{color:var(--accent);font-weight:600}
/* staff */
.staff .wrap{max-width:760px}.gl{display:grid;gap:10px}
.g{border:1px solid var(--line);background:#fff;border-radius:12px;padding:12px 14px;text-align:left;font:inherit;width:100%}
.g.more{border-color:#b58900;box-shadow:0 0 0 2px #fff3cd}.g b{font-size:1.05rem}.g .t{color:var(--muted);font-size:.88rem}
.kv{display:grid;grid-template-columns:140px 1fr;gap:4px 10px;font-size:.95rem}.kv span:nth-child(odd){color:var(--muted)}
.sticky{position:sticky;top:0;background:var(--bg);padding:8px 0;z-index:2;display:flex;justify-content:space-between;align-items:center}
#bar.p1{width:33%}#bar.p2{width:66%}#bar.p3{width:100%}
a.btn{text-decoration:none;text-align:center;color:var(--ink)}a.btn:not(.sec){color:var(--accent-ink)}
#consBox{margin-top:20px}#waBox .hint{margin-bottom:6px}
.btn.cancel{color:var(--bad);border-color:#e6b8b4;margin-top:28px;font-weight:500}
