/* Đăng ký, đăng nhập, kiểm tra email, quên mật khẩu, đặt mật khẩu mới theo giao diện ver 2 "Apple × EaseUI" (27/10), cùng
   phong cách trang học thử (course-v2.css): nền xám nhạt #F5F5F7, thanh trên kính mờ chỉ có logo, một cột thẻ trắng ở giữa,
   ô nhập bo 12px, chip và nút viên thuốc, màu chính mực #1D1D1F, link xanh #0066CC. Phủ lên auth.css khi body có class k2
   (bodyClass trong từng trang); form, id, logic giữ nguyên. Bỏ class k2 là về giao diện ver 1 (cột trái tối). */
html:has(body.k2 .a1),body.k2:has(.a1){background:#F5F5F7}
/* Nền mesh xanh thương hiệu (mesh.js 'brand', 27/10 người dùng: đỡ nhàm chán): body trong suốt cho canvas hiện dưới thẻ form */
body.k2.brand-mesh:has(.a1){background:transparent}
body.k2.brand-mesh .mesh-bg{opacity:.95}
.k2 .a1{
  --c-emerald:#1D1D1F;--c-emerald-text:#0066CC;--c-on-emerald:#fff;--c-emerald-tint:#F5F5F7;--c-emerald-ring:rgba(0,102,204,.18);
  --c-line:#D2D2D7;--c-ink:#1D1D1F;--c-body:#424245;--c-muted:#6E6E73;
  flex-direction:column;align-items:stretch;min-height:100vh;color:#1D1D1F;-webkit-font-smoothing:antialiased
}

/* Cột trái tối thành thanh trên kính mờ, chỉ còn logo màu + "Học thử" */
.k2 .a1-side{flex:none;position:sticky;top:0;z-index:20;flex-direction:row;align-items:center;justify-content:flex-start;gap:0;padding:12px 24px;min-height:64px;background:rgba(255,255,255,.8);backdrop-filter:saturate(180%) blur(20px);-webkit-backdrop-filter:saturate(180%) blur(20px);border-bottom:1px solid rgba(0,0,0,.06);color:#1D1D1F}
.k2 .a1-mid,.k2 .a1-stats{display:none}
.k2 .a1-logo{display:flex;align-items:center;gap:12px;text-decoration:none}
.k2 .a1-logo .a1-logo-w{display:none}
.k2 .a1-logo .a1-logo-c{display:block;height:32px}
.k2 .a1-logo .a1-logo-s{display:flex;align-items:center;gap:12px;font-size:14px;color:#6E6E73}
.k2 .a1-logo .a1-logo-s::before{content:"";width:1px;height:16px;background:#D2D2D7}

/* Thẻ form giữa trang */
.k2 .a1-main{flex:1;align-items:flex-start;padding:56px 24px 80px}
.k2 .a1-card{max-width:480px;border:0;border-radius:24px;padding:36px;box-shadow:0 1px 2px rgba(0,0,0,.04),0 12px 40px rgba(0,0,0,.06);animation:a2up .5s cubic-bezier(.2,.7,.2,1) both}
.k2.pg-dang-ky .a1-card{max-width:600px}
@keyframes a2up{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.k2 .a1-card h1{font-size:30px;line-height:1.15;font-weight:600;letter-spacing:-.025em;color:#1D1D1F;margin-bottom:24px}
.k2 .a1-card .lead{color:#6E6E73;font-size:15px;margin:-16px 0 24px}

/* Tab Đăng ký, Đăng nhập: viên thuốc */
.k2 .a1-tabs{border-radius:980px;background:rgba(0,0,0,.045);padding:4px;margin-bottom:28px}
.k2 .a1-tabs a{border-radius:980px;font-weight:500;color:#424245}
.k2 .a1-tabs a[aria-current=page]{background:#fff;color:#1D1D1F;box-shadow:0 1px 3px rgba(0,0,0,.10)}

/* Ô nhập */
.k2 .a1-card .field>span,.k2 .a1-card .field>label>span,.k2 .a1-card .field-row>span,.k2 .a1-card fieldset.field legend{font-size:13px;font-weight:500;color:#424245}
.k2 .a1-card .field input,.k2 .a1-card .field textarea{border-radius:12px;border-color:#D2D2D7;padding:12px 14px;font-size:16px;background:#fff}
.k2 .a1-card .field input:focus,.k2 .a1-card .field textarea:focus{border-color:#0066CC;box-shadow:0 0 0 4px rgba(0,102,204,.15)}
.k2 .a1-card .pwtoggle{color:#0066CC}

/* Chip: viên thuốc, chọn thì nền mực chữ trắng */
.k2 .a1-card .chip span{border-radius:980px;border-color:#D2D2D7;padding:8px 16px;font-size:14px;background:#fff;transition:background-color .2s,border-color .2s,color .2s}
.k2 .a1-card .chip input:checked+span{background:#1D1D1F;border-color:#1D1D1F;color:#fff;box-shadow:none}
.k2 .a1-card .chip input:focus-visible+span{outline-color:#1D1D1F}
.k2 .a1-card .check input{accent-color:#1D1D1F}

/* Nút chính viên thuốc màu mực */
.k2 .a1-card .btn-primary,.k2 .a1-card .btn-primary:hover{background:#1D1D1F;color:#fff;border-radius:980px;min-height:50px;font-size:16px;font-weight:500}
.k2 .a1-card .btn-primary:hover{filter:none;background:#000}
.k2 .a1-card .btn-primary[aria-busy=true]:hover{background:#1D1D1F}
.k2 .a1-card .btn-ghost{border-radius:980px}
.k2 .a1-card .auth-foot,.k2 .a1-card .hint{color:#6E6E73}
.k2 .a1-card .auth-foot a,.k2 .a1-card .field-row a,.k2 .a1-card .alert a,.k2 .a1-card .backline a,.k2 .a1-card .resend-btn,.k2 .a1-card .linkbtn,.k2 .a1-card .copy{color:#0066CC}

/* Khối thông báo, các bước, icon */
.k2 .a1-card .alert,.k2 .a1-card .notice,.k2 .a1-card .safe,.k2 .a1-card .return,.k2 .a1-card .rules{border-radius:14px}
.k2 .a1-card .notice,.k2 .a1-card .rules{background:#F5F5F7}
.k2 .a1-card .mailicon{background:#F5F5F7;border-radius:999px}
.k2 .a1 svg[stroke="#00806A"],.k2 .a1 svg[stroke="#1D4ED8"]{stroke:#1D1D1F}
.k2 .a1-card .steps3 .done .dot{background:#F5F5F7;color:#1D1D1F}
.k2 .a1-card .steps3 .now .dot{background:#1D1D1F}

@media (max-width:900px){
  .k2 .a1-side{padding:10px 16px;min-height:56px}
  .k2 .a1-logo .a1-logo-c{height:28px}
  .k2 .a1-main{padding:28px 16px 48px}
  .k2 .a1-card{padding:24px 20px;border-radius:20px}
  .k2 .a1-card h1{font-size:26px}
}
@media (prefers-reduced-motion:reduce){.k2 .a1-card{animation:none}}

/* Nút liên hệ nổi (ContactFab) dùng chữ Inter như trang học thử */
.tfa-ct{--tfa-ct-face:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
