/* 1clicktee — khung + thành phần DÙNG CHUNG (D1, 12/11/2026). Đổi nội dung = đổi tên file (cache tĩnh 7 ngày).
   Vibe: cửa hàng thời trang đường phố tối giản — nền ngà, mực đen, MỘT màu nhấn cam, viền mảnh 1.5px mực,
   góc vuông / bo nhỏ 6px, KHÔNG bóng đổ mềm kiểu SaaS, KHÔNG kính mờ. Tiêu đề lớn Anton IN HOA, thân Be Vietnam Pro.
   Cam lấy từ bộ --oc-accent* của 1clickseo (static/oneclickseo/app-0911a.css): #FF5A36 / #E2401D / #FFE9E3 / #FFF7F3.
   Biến dùng chung cho thợ giao diện khác: --ot-* (mục :root). Class dùng chung: .ot-btn .ot-input .ot-chip .ot-alert
   .ot-toast .ot-modal .ot-display .ot-kicker .ot-container .ot-sr.
   1311e (F1 13/11): hàng điều khiển header MỘT chiều cao (--ot-hc: 40px, 36px ở ≤429px), bo 6px, cùng viền; logo khoá
   ngang mới logo-b-1311.svg (227:64) cao 32px ≥744px / 28px dưới; ô số dư hiện tiền $ (data-ot-balance-usd, JS
   OT.setBalanceUsd); HỢP ĐỒNG chừa chỗ đáy: body.ot-body padding-bottom = --ot-tabbar-h + --ot-stickybar-h + vùng an toàn
   (trang có thanh hành động dính: thêm class ot-has-stickybar + đặt --ot-stickybar-h trên body); chữ dải đầu / tab đáy ≥11px.
   1311g (I3 13/11, đa ngôn ngữ 54 ngữ — bê 1clickads lang-1311a.css + rtl-1311a.css): nút EN|VI → bộ chọn ngữ details.ot-lang
   (nút cao --ot-hc hiện mã ngữ + mũi tên, pop ô tìm + danh sách cuộn, ✓ mục đang chọn; bản nền đen .ot-lang--dark cho trang chủ);
   phông theo ngữ (--ot-noto đặt theo html[lang], link Noto nạp ở macro ot_font_head) — tiêu đề Anton với chữ không-Latin rơi về Noto đậm,
   bỏ giãn chữ; RTL: khung dùng thuộc tính logic + mục "hướng phải-sang-trái" cuối file. Bản 1311e giữ tại chỗ. */

/* ── phông tự host ── */
@font-face{font-family:"Be Vietnam Pro";font-style:normal;font-weight:400;font-display:swap;src:url("/static/oneclicktee/fonts/BeVietnamPro-Regular.ttf") format("truetype")}
@font-face{font-family:"Be Vietnam Pro";font-style:normal;font-weight:700;font-display:swap;src:url("/static/oneclicktee/fonts/BeVietnamPro-Bold.ttf") format("truetype")}
@font-face{font-family:"Be Vietnam Pro";font-style:normal;font-weight:800;font-display:swap;src:url("/static/oneclicktee/fonts/BeVietnamPro-ExtraBold.ttf") format("truetype")}
@font-face{font-family:"Anton";font-style:normal;font-weight:400;font-display:swap;src:url("/static/oneclicktee/fonts/Anton-vietnamese-1211.woff2") format("woff2");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}
@font-face{font-family:"Anton";font-style:normal;font-weight:400;font-display:swap;src:url("/static/oneclicktee/fonts/Anton-latin-ext-1211.woff2") format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Anton";font-style:normal;font-weight:400;font-display:swap;src:url("/static/oneclicktee/fonts/Anton-latin-1211.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

/* ── token ── */
:root{
  --ot-bg:#F4F1EA;            /* nền ngà */
  --ot-paper:#FBF9F4;         /* mặt ô nhập / hộp (ngà sáng hơn) */
  --ot-ink:#0B0B0B;           /* mực */
  --ot-muted:#5E5A53;         /* chữ phụ trên ngà (≈6:1) */
  --ot-faint:#8C877E;         /* chữ gợi ý / placeholder */
  --ot-line:#0B0B0B;          /* kẻ chính 1.5px */
  --ot-line-soft:rgba(11,11,11,.16);
  --ot-accent:#FF5A36;        /* MỘT màu nhấn */
  --ot-accent-2:#E2401D;      /* cam đậm (chữ cam nhỏ, viền lỗi) */
  --ot-accent-soft:#FFE9E3;
  --ot-accent-bg:#FFF7F3;
  --ot-on-ink:#F4F1EA;        /* chữ trên nền mực */
  --ot-font:"Be Vietnam Pro",var(--ot-noto,system-ui),system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --ot-display:"Anton",var(--ot-noto,"Impact"),"Impact","Arial Narrow Bold","Arial Narrow",sans-serif;
  --ot-bw:1.5px;              /* độ dày viền */
  --ot-r:6px;                 /* bo lớn nhất */
  --ot-r-sm:4px;
  --ot-h:48px;                /* cao nút / ô nhập chuẩn */
  --ot-h-sm:40px;
  --ot-strip-h:32px;
  --ot-header-h:64px;
  --ot-dock-h:0px;            /* ≤743px: 64px (dải menu đáy) — tên cũ, giữ cho CSS trang đang dùng */
  --ot-tabbar-h:0px;          /* HỢP ĐỒNG 1311e: chiều cao thật thanh tab đáy (0 ở cỡ không có thanh tab) */
  --ot-stickybar-h:0px;       /* HỢP ĐỒNG 1311e: thanh hành động dính đáy đang hiện — trang đặt trên body (kèm .ot-has-stickybar) */
  --ot-hc:40px;               /* cao MỌI điều khiển bên phải header (≤429px: 36px) */
  --ot-logo-h:32px;           /* cao logo header (≤743px: 28px) */
  --ot-safe-b:env(safe-area-inset-bottom,0px);
  --ot-container:1200px;
  --ot-gutter:24px;
  --ot-z-header:50;
  --ot-z-dock:60;
  --ot-z-pop:70;
  --ot-z-modal:1000;
  --ot-z-toast:1100;
  --ot-ease:cubic-bezier(.2,.7,.2,1);
}
@media (max-width:743px){:root{--ot-dock-h:64px;--ot-tabbar-h:64px;--ot-gutter:16px;--ot-header-h:56px;--ot-logo-h:28px}}
@media (max-width:429px){:root{--ot-hc:36px}}

/* ── nền ── */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
html,body{margin:0;padding:0}
/* U1 14/11 (QM L1): lưới an toàn tràn ngang. html clip → tràn của body tự cắt (overflow-x:clip ở body, KHÔNG thành khung cuộn nên
   header/phiếu sticky vẫn dính), khung nhìn di động không nở ra khi một hàng lỡ rộng hơn màn. Trình duyệt chưa có clip: bỏ qua cả hai, giữ hidden cũ */
html{overflow-x:clip}
body.ot-body{min-height:100vh;display:flex;flex-direction:column;padding-bottom:calc(var(--ot-tabbar-h,0px) + var(--ot-stickybar-h,0px) + env(safe-area-inset-bottom,0px));background:var(--ot-bg);color:var(--ot-ink);font-family:var(--ot-font);font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden;overflow-x:clip}
img,svg{display:block;max-width:100%}
a{color:inherit}
button,input,select,textarea{font:inherit;color:inherit}
:focus{outline:none}
:focus-visible{outline:2px solid var(--ot-accent);outline-offset:2px}
::selection{background:var(--ot-accent);color:var(--ot-ink)}
.ot-sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0;padding:0;margin:-1px}
.ot-container{width:100%;max-width:var(--ot-container);margin:0 auto;padding:0 var(--ot-gutter)}
.ot-skip{position:absolute;left:8px;top:-60px;z-index:calc(var(--ot-z-toast) + 1);padding:10px 14px;background:var(--ot-ink);color:var(--ot-on-ink);border-radius:var(--ot-r-sm);font-weight:700;text-decoration:none}
.ot-skip:focus-visible{top:8px}
.ot-icon{flex:none}

/* ── chữ ── */
.ot-display{margin:0;font-family:var(--ot-display);font-weight:400;text-transform:uppercase;line-height:.92;letter-spacing:.005em;font-synthesis:none}
/* tiếng Việt in hoa có dấu chồng (Ầ, Ể, Ợ) → dòng phải thoáng hơn, không thì dấu chạm dòng trên */
.ot-display:lang(vi),:lang(vi) .ot-display{line-height:1.08}
.ot-kicker{display:inline-flex;align-items:center;gap:10px;margin:0;font-size:12px;font-weight:700;line-height:1.4;letter-spacing:.14em;text-transform:uppercase}
.ot-kicker::before{content:"";flex:none;width:10px;height:10px;background:var(--ot-accent)}
.ot-muted{color:var(--ot-muted)}
.ot-link{color:var(--ot-ink);font-weight:700;text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:3px}
.ot-link:hover{color:var(--ot-accent-2)}
.ot-textbtn{display:inline-flex;align-items:center;gap:6px;min-height:var(--ot-h-sm);margin:0;padding:0;border:0;background:none;font-size:14px;font-weight:700;color:var(--ot-ink);text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:3px;cursor:pointer}
.ot-textbtn:hover{color:var(--ot-accent-2)}
.ot-textbtn[disabled]{color:var(--ot-muted);text-decoration:none;cursor:not-allowed}

/* ── nút ── */
.ot-btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:10px;height:var(--ot-h);min-width:0;margin:0;padding:0 22px;border:var(--ot-bw) solid var(--ot-ink);border-radius:var(--ot-r);background:transparent;color:var(--ot-ink);font-family:var(--ot-font);font-size:14px;font-weight:800;line-height:1;letter-spacing:.07em;text-transform:uppercase;text-decoration:none;white-space:nowrap;cursor:pointer;user-select:none;transition:background-color .15s var(--ot-ease),color .15s var(--ot-ease),border-color .15s var(--ot-ease)}
.ot-btn:hover{background:var(--ot-ink);color:var(--ot-on-ink)}
.ot-btn--primary{background:var(--ot-ink);color:var(--ot-on-ink)}
.ot-btn--primary:hover{background:var(--ot-accent);border-color:var(--ot-accent);color:var(--ot-ink)}
.ot-btn--accent{background:var(--ot-accent);border-color:var(--ot-ink);color:var(--ot-ink)}
.ot-btn--accent:hover{background:var(--ot-ink);border-color:var(--ot-ink);color:var(--ot-on-ink)}
.ot-btn--sm{height:var(--ot-h-sm);padding:0 14px;font-size:12px}
.ot-btn--block{display:flex;width:100%}
.ot-btn--icon{width:var(--ot-h-sm);height:var(--ot-h-sm);padding:0}
.ot-btn[disabled],.ot-btn[aria-disabled=true]{opacity:.45;cursor:not-allowed;pointer-events:none}
.ot-btn.is-busy{pointer-events:none}
.ot-btn.is-busy .ot-btn__arrow{display:none}
.ot-spin{flex:none;width:16px;height:16px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:ot-spin .7s linear infinite}
@keyframes ot-spin{to{transform:rotate(360deg)}}
.ot-btn__arrow{transition:transform .15s var(--ot-ease)}
.ot-btn:hover .ot-btn__arrow{transform:translateX(3px)}

/* ── ô nhập ── */
.ot-field{display:block;margin:0 0 16px}
.ot-label{display:block;margin:0 0 8px;font-size:12px;font-weight:700;line-height:1.4;letter-spacing:.1em;text-transform:uppercase}
.ot-input{display:block;width:100%;height:var(--ot-h);margin:0;padding:0 16px;border:var(--ot-bw) solid var(--ot-ink);border-radius:var(--ot-r);background:var(--ot-paper);color:var(--ot-ink);font-size:16px;line-height:1.2;-webkit-appearance:none;appearance:none;transition:border-color .15s,background-color .15s}
.ot-input::placeholder{color:var(--ot-faint);opacity:1}
.ot-input:hover{background:#FFFFFF}
.ot-input:focus{background:#FFFFFF}
.ot-input:focus-visible{outline:2px solid var(--ot-ink);outline-offset:2px}  /* mực, không cam — cam dành cho lỗi */
.ot-input.is-invalid,.ot-input[aria-invalid=true]{border-color:var(--ot-accent-2);background:var(--ot-accent-bg)}
.ot-input[disabled]{opacity:.45;cursor:not-allowed}
.ot-hint{margin:8px 0 0;font-size:13px;color:var(--ot-muted)}

/* ── chip ── */
.ot-chip{display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 10px;border:var(--ot-bw) solid var(--ot-ink);border-radius:var(--ot-r-sm);background:transparent;color:var(--ot-ink);font-size:12px;font-weight:700;line-height:1;letter-spacing:.06em;text-transform:uppercase;white-space:nowrap;font-variant-numeric:tabular-nums}
.ot-chip--ink{background:var(--ot-ink);color:var(--ot-on-ink)}
.ot-chip--accent{background:var(--ot-accent);color:var(--ot-ink)}
.ot-chip__dot{flex:none;width:8px;height:8px;background:var(--ot-accent)}
.ot-chip--accent .ot-chip__dot{background:var(--ot-ink)}

/* ── thông báo trong trang ── */
.ot-alert{display:flex;align-items:flex-start;gap:10px;margin:0 0 16px;padding:12px 14px;border:var(--ot-bw) solid var(--ot-ink);border-inline-start-width:6px;border-radius:var(--ot-r-sm);background:var(--ot-paper);font-size:14px;line-height:1.5}
.ot-alert--err{border-color:var(--ot-accent-2);background:var(--ot-accent-bg)}
.ot-alert--info{border-inline-start-color:var(--ot-ink)}
.ot-alert .ot-icon{margin-top:2px}

/* ── thanh trên cùng ── */
.ot-strip{height:var(--ot-strip-h);display:flex;align-items:center;justify-content:center;padding:0 var(--ot-gutter);background:var(--ot-ink);color:var(--ot-on-ink);font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;white-space:nowrap;overflow:hidden}
.ot-strip__t{overflow:hidden;text-overflow:ellipsis}
@keyframes ot-marquee{from{transform:translateX(0)}to{transform:translateX(-100%)}}
.ot-header{position:sticky;top:0;z-index:var(--ot-z-header);background:var(--ot-bg);border-bottom:var(--ot-bw) solid var(--ot-line)}
/* Header KHÔNG BAO GIỜ làm trang tràn ngang (320–1440, en/vi, 3 trạng thái). Mọi con min-width:0; chật thì nhường theo
   thứ tự (ưu tiên giữ): logo → Sign in / số dư → nút ngữ → chip lượt thử (co trước nhất: flex-shrink 1000, rồi gọn, rồi ẩn).
   Chữ dài cắt ellipsis, không xuống dòng. Logo: chỉ đặt CHIỀU CAO, rộng theo tỉ lệ file (227:64) → không bao giờ méo.
   Hàng bên phải: chip số dư / lượt thử, + Nạp, EN|VI, Đăng nhập, nút tài khoản — CÙNG cao --ot-hc, bo --ot-r, viền --ot-bw. */
.ot-header__in{display:flex;align-items:center;gap:28px;height:var(--ot-header-h);min-width:0}
.ot-header__in>*,.ot-header__right>*{min-width:0}
.ot-logo{position:relative;display:inline-flex;align-items:center;flex:none;height:var(--ot-logo-h);color:var(--ot-ink);text-decoration:none}
.ot-logo img{width:auto;height:var(--ot-logo-h);max-width:none;aspect-ratio:227/64;object-fit:contain;object-position:left center}
.ot-logo__txt{display:none;font-family:var(--ot-display);font-size:calc(var(--ot-logo-h) - 2px);font-weight:400;line-height:var(--ot-logo-h);letter-spacing:.02em;text-transform:uppercase;white-space:nowrap}
.ot-logo.is-fallback img{display:none}
.ot-logo.is-fallback .ot-logo__txt{display:inline}
.ot-nav{display:flex;flex:0 1 auto;align-items:center;gap:4px;height:100%;min-width:0}
.ot-nav__a{position:relative;display:inline-flex;flex:0 1 auto;align-items:center;gap:8px;min-width:0;height:100%;padding:0 12px;font-size:13px;font-weight:800;letter-spacing:.09em;text-transform:uppercase;text-decoration:none;color:var(--ot-ink);white-space:nowrap}
.ot-nav__a::after{content:"";position:absolute;left:12px;right:12px;bottom:-1.5px;height:3px;background:transparent;transition:background-color .15s}
.ot-nav__a:hover::after{background:var(--ot-ink)}
.ot-nav__a[aria-current=page]::after{background:var(--ot-accent)}
.ot-nav__a .ot-icon{display:none}
.ot-nav__a span,.ot-header__t,.ot-trial__long,.ot-balance .ot-num{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ot-header__right{display:flex;flex:0 1 auto;align-items:center;justify-content:flex-end;gap:8px;margin-inline-start:auto;min-width:0}
.ot-header__right .ot-chip{flex:0 1 auto;min-width:0;overflow:hidden;height:var(--ot-hc);border-radius:var(--ot-r)}
.ot-header__right .ot-btn{flex:0 1 auto;min-width:0}
.ot-header__right .ot-btn--sm{height:var(--ot-hc)}
.ot-header__right .ot-trial{flex-shrink:1000}
.ot-trial::after{content:attr(data-ot-trial) "\00a0" attr(data-ot-short);display:none;white-space:nowrap}
/* bộ chọn ngữ (I3 13/11, khuôn oa_lang_menu + lang-1311a.css): details.ot-lang > summary.ot-lang__btn (mã ngữ + mũi tên, cao --ot-hc,
   viền mực, bo --ot-r — cùng hàng nút header) + .ot-lang__pop (ô tìm cố định khi > 8 ngữ + danh sách cuộn + dòng rỗng). Pop tuyệt đối
   (không đẩy bố cục), mép cuối dòng (lật theo hướng chữ), nổi trên header (--ot-z-pop). ≤743px: pop cố định vừa màn, cuộn trong. */
.ot-lang{position:relative;flex:none;min-width:0}
.ot-lang__btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;box-sizing:border-box;height:var(--ot-hc);min-width:40px;padding:0 10px;border:var(--ot-bw) solid var(--ot-ink);border-radius:var(--ot-r);background:transparent;list-style:none;cursor:pointer;user-select:none;-webkit-user-select:none;font-size:12px;font-weight:800;line-height:1;letter-spacing:.06em;text-transform:uppercase;white-space:nowrap;color:var(--ot-ink);transition:background-color .15s var(--ot-ease),color .15s var(--ot-ease)}
.ot-lang__btn::-webkit-details-marker{display:none}
.ot-lang__btn::marker{content:""}
.ot-lang__btn:hover{background:var(--ot-accent-soft)}
.ot-lang[open]>.ot-lang__btn{background:var(--ot-ink);color:var(--ot-on-ink)}
.ot-lang__chev{flex:none;transition:transform .15s var(--ot-ease)}
.ot-lang[open] .ot-lang__chev{transform:rotate(180deg)}
.ot-lang__pop{position:absolute;inset-inline-end:0;top:calc(100% + 8px);z-index:var(--ot-z-pop);display:flex;flex-direction:column;width:280px;max-width:calc(100vw - 16px);max-height:min(60vh,520px);overflow:hidden;padding:0;background:var(--ot-bg);border:var(--ot-bw) solid var(--ot-ink);border-radius:var(--ot-r);color:var(--ot-ink);text-align:start;letter-spacing:normal;text-transform:none}
.ot-lang:not([open])>.ot-lang__pop{display:none}
.ot-lang__pop.is-up{top:auto;bottom:calc(100% + 8px)}
.ot-lang__find{position:relative;flex:none;padding:8px;border-bottom:var(--ot-bw) solid var(--ot-line-soft)}
.ot-lang__find>.ot-icon{position:absolute;inset-inline-start:20px;top:50%;transform:translateY(-50%);color:var(--ot-muted);pointer-events:none}
.ot-lang__q{display:block;width:100%;height:40px;margin:0;padding:0;padding-inline:38px 12px;border:var(--ot-bw) solid var(--ot-ink);border-radius:var(--ot-r-sm);background:var(--ot-paper);font-size:14px;font-weight:500;line-height:1.2;color:var(--ot-ink);-webkit-appearance:none;appearance:none}
.ot-lang__q::-webkit-search-decoration,.ot-lang__q::-webkit-search-cancel-button{-webkit-appearance:none;appearance:none}
.ot-lang__q::placeholder{color:var(--ot-faint);opacity:1}
.ot-lang__q:focus{background:#FFFFFF;box-shadow:inset 0 0 0 1px var(--ot-ink)}
.ot-lang__q:focus-visible{outline:none}
.ot-lang__list{position:relative;display:flex;flex-direction:column;flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:6px}
.ot-lang__o{display:flex;flex:none;align-items:center;justify-content:space-between;gap:10px;min-height:40px;padding:0 10px;border-radius:var(--ot-r-sm);font-size:14px;font-weight:700;line-height:1.25;text-decoration:none;color:var(--ot-ink)}
.ot-lang__o[hidden]{display:none}
.ot-lang__o>span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:start}
.ot-lang__o>.ot-icon{flex:none}
.ot-lang__o:hover{background:var(--ot-accent-soft)}
.ot-lang__o[aria-current=true]{background:var(--ot-ink);color:var(--ot-on-ink)}
.ot-lang__o:focus-visible{outline:2px solid var(--ot-accent);outline-offset:-2px}
.ot-lang__none{flex:none;margin:0;padding:6px 14px 14px;font-size:14px;line-height:1.45;color:var(--ot-muted);text-align:center}
/* bản nền đen (menu trang chủ — nút ở phần CSS màn đầu của landing.html) */
.ot-lang--dark>.ot-lang__btn:hover{background:rgba(244,241,234,.08)}
.ot-lang--dark[open]>.ot-lang__btn{background:var(--ot-bg);border-color:var(--ot-bg);color:var(--ot-ink)}
.ot-lang--dark .ot-lang__pop{background:var(--ot-ink);border:1px solid rgba(244,241,234,.35);color:var(--ot-on-ink);font-family:var(--f-body,var(--ot-font))}
.ot-lang--dark .ot-lang__find{border-bottom-color:rgba(244,241,234,.16)}
.ot-lang--dark .ot-lang__find>.ot-icon{color:rgba(244,241,234,.6)}
.ot-lang--dark .ot-lang__q{background:rgba(244,241,234,.04);border:1px solid rgba(244,241,234,.35);color:var(--ot-on-ink);font-family:inherit}
.ot-lang--dark .ot-lang__q::placeholder{color:rgba(244,241,234,.5)}
.ot-lang--dark .ot-lang__q:focus{background:rgba(244,241,234,.04);border-color:var(--ot-on-ink);box-shadow:none}
.ot-lang--dark .ot-lang__o{color:var(--ot-on-ink);font-weight:500}
.ot-lang--dark .ot-lang__o:hover{background:rgba(244,241,234,.1)}
.ot-lang--dark .ot-lang__o[aria-current=true]{background:var(--ot-on-ink);color:var(--ot-ink);font-weight:600}
.ot-lang--dark .ot-lang__none{color:rgba(244,241,234,.6)}
.ot-acct{position:relative;flex:none}
.ot-acct>summary{display:inline-flex;align-items:center;justify-content:center;width:var(--ot-hc);height:var(--ot-hc);border:var(--ot-bw) solid var(--ot-ink);border-radius:var(--ot-r);list-style:none;cursor:pointer}
.ot-acct>summary::-webkit-details-marker{display:none}
.ot-acct>summary:hover,.ot-acct[open]>summary{background:var(--ot-ink);color:var(--ot-on-ink)}
.ot-pop{position:absolute;inset-inline-end:0;top:calc(100% + 8px);z-index:var(--ot-z-pop);min-width:260px;max-width:calc(100vw - 32px);padding:6px;background:var(--ot-bg);border:var(--ot-bw) solid var(--ot-ink);border-radius:var(--ot-r)}
.ot-pop__who{padding:10px 10px 12px;margin-bottom:6px;border-bottom:var(--ot-bw) solid var(--ot-line-soft);font-size:13px;line-height:1.4}
.ot-pop__who small{display:block;font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--ot-muted)}
.ot-pop__who span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:700}
.ot-pop__item{display:flex;align-items:center;gap:10px;width:100%;min-height:44px;padding:0 10px;border:0;border-radius:var(--ot-r-sm);background:none;font-size:14px;font-weight:700;text-align:start;text-decoration:none;color:var(--ot-ink);cursor:pointer}
.ot-pop__item:hover{background:var(--ot-ink);color:var(--ot-on-ink)}
.ot-pop__item:focus-visible{outline-offset:-2px}
.ot-pop form{margin:0}
.ot-main{flex:1 0 auto;width:100%}

/* ── header máy tính bảng 744–1023px: menu thu khoảng cách (chữ không xuống dòng), chip gọn, số dư/Nạp chỉ số + icon ── */
@media (max-width:1023px){
  .ot-trial>.ot-trial__long{display:none}
  .ot-trial::after{display:inline;min-width:0;overflow:hidden;text-overflow:ellipsis}   /* U2 13/11: nhãn gọn dài (uk…) cắt có … thay vì cụt */
  .ot-header__right .ot-hide-sm{display:none}
  .ot-header__right [data-ot-topup]{width:var(--ot-hc);padding:0}
}
@media (min-width:744px) and (max-width:1023px){
  .ot-header__in{gap:14px}
  .ot-nav{gap:0}
  .ot-nav__a{padding:0 8px;font-size:12px;letter-spacing:.06em}
  .ot-nav__a::after{left:8px;right:8px}
  .ot-header__right{gap:6px}
  .ot-header__right .ot-btn--sm{padding:0 12px}
  .ot-lang__btn{padding:0 8px}
}
/* 744–819px: logo 32px + menu 3 mục + số dư lớn ($10,000.00) / "Đăng nhập" phải vừa, không cắt chữ menu (đo F1) */
@media (min-width:744px) and (max-width:819px){
  .ot-header__in{gap:10px}
  .ot-balance>.ot-icon{display:none}
}

/* ── dải menu đáy (≤743px) ── */
.ot-dock{display:none}
@media (max-width:743px){
  .ot-header__in{gap:10px}
  .ot-header .ot-nav{display:none}
  .ot-header__right{gap:6px}
  .ot-header__right .ot-btn--sm{padding:0 12px}
  .ot-lang__btn{gap:4px;padding:0 8px}
  .ot-lang__btn,.ot-header__right .ot-btn--sm{min-height:40px}   /* U1 14/11 (QM L8): vùng bấm nút đầu trang ≥ 40px (--ot-hc ≤429px là 36) */
  /* pop cố định vừa màn (mép 8px), đỉnh ngay dưới nút (JS đặt --ot-pop-top), đáy chừa thanh tab đáy + thanh hành động dính; cuộn trong */
  .ot-lang__pop{position:fixed;top:var(--ot-pop-top,64px);inset-inline:8px;width:auto;max-width:none;max-height:calc(100dvh - var(--ot-pop-top,64px) - var(--ot-tabbar-h,0px) - var(--ot-stickybar-h,0px) - var(--ot-safe-b) - 12px)}
  .ot-lang__pop.is-up{top:var(--ot-pop-top,64px);bottom:auto}
  .ot-lang__q{height:44px;font-size:16px}
  .ot-lang__o{min-height:44px}
  .ot-hide-sm{display:none!important}
  .ot-dock{position:fixed;left:0;right:0;bottom:0;z-index:var(--ot-z-dock);display:grid;grid-template-columns:repeat(3,minmax(0,1fr));height:calc(var(--ot-dock-h) + var(--ot-safe-b));padding-bottom:var(--ot-safe-b);background:var(--ot-bg);border-top:var(--ot-bw) solid var(--ot-ink)}
  .ot-dock .ot-nav__a{flex-direction:column;justify-content:center;gap:4px;height:var(--ot-dock-h);padding:0 4px;font-size:11px;letter-spacing:.06em}
  .ot-dock .ot-nav__a .ot-icon{display:block}
  .ot-dock .ot-nav__a+.ot-nav__a{border-inline-start:var(--ot-bw) solid var(--ot-line-soft)}
  .ot-dock .ot-nav__a::after{top:-1.5px;bottom:auto;left:0;right:0}
  .ot-dock .ot-nav__a:hover::after{background:transparent}
  .ot-dock .ot-nav__a[aria-current=page]::after{background:var(--ot-accent)}
  /* chừa chỗ dải tab: KHÔNG còn luật riêng ở đây — body.ot-body (mục nền) cộng --ot-tabbar-h + --ot-stickybar-h + vùng an toàn */
  .ot-strip{justify-content:flex-start;font-size:11px;letter-spacing:.12em}
  .ot-strip__t{flex:none;overflow:visible;text-overflow:clip;padding-inline-start:100%;animation:ot-marquee 18s linear infinite}
}
@media (max-width:479px){.ot-balance>.ot-icon{display:none}}   /* số dư lớn ($10,000.00) vẫn vừa hàng ở 430–479px */
@media (max-width:429px){
  .ot-trial>.ot-chip__dot{display:none}
  .ot-header .ot-container{padding:0 14px}
  .ot-header__right .ot-chip{padding:0 6px;letter-spacing:.03em}
  .ot-header__right .ot-btn--sm{padding:0 10px}
  .ot-lang__btn{min-width:36px;padding:0 6px}
}
@media (max-width:389px){
  /* ≤389px tiếng Việt vãng lai: "5 lượt" + EN|VI + ĐĂNG NHẬP phải vừa, không cắt chữ (đo F1 ở 360/380) */
  .ot-header .ot-container{padding:0 10px}
  .ot-header__right .ot-chip{padding:0 5px;letter-spacing:0}
  .ot-header__right .ot-btn--sm{padding:0 8px;letter-spacing:.02em}
}
@media (max-width:379px){
  .ot-header__in{gap:6px}
  .ot-header__right{gap:5px}
  .ot-header__right [data-ot-topup]{display:none}  /* Nạp vẫn có trong menu tài khoản */
}
@media (max-width:359px){.ot-header__right .ot-trial{display:none}}

/* ── toast ── */
.ot-toasts{position:fixed;left:50%;bottom:calc(24px + var(--ot-tabbar-h,0px) + var(--ot-stickybar-h,0px) + var(--ot-safe-b));z-index:var(--ot-z-toast);display:flex;flex-direction:column;align-items:center;gap:8px;width:max-content;max-width:calc(100vw - 32px);transform:translateX(-50%);pointer-events:none}
.ot-toast{display:flex;align-items:center;gap:10px;max-width:100%;min-height:44px;padding:10px 16px;border:var(--ot-bw) solid var(--ot-ink);border-inline-start:6px solid var(--ot-accent);border-radius:var(--ot-r-sm);background:var(--ot-ink);color:var(--ot-on-ink);font-size:14px;font-weight:700;line-height:1.4;pointer-events:auto;animation:ot-toast-in .2s var(--ot-ease)}
.ot-toast--ok{border-inline-start-color:var(--ot-on-ink)}
.ot-toast--err{background:var(--ot-accent);color:var(--ot-ink);border-color:var(--ot-ink);border-inline-start-color:var(--ot-ink)}
.ot-toast.is-out{opacity:0;transform:translateY(6px);transition:opacity .18s,transform .18s}
@keyframes ot-toast-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

/* ── hộp thoại .ot-modal (Esc / bấm nền đóng, trả focus, nổi trên mọi thứ) ── */
.ot-modal{position:fixed;inset:0;z-index:var(--ot-z-modal);display:none;align-items:center;justify-content:center;padding:24px}
.ot-modal.is-open{display:flex}
.ot-modal__backdrop{position:absolute;inset:0;background:rgba(11,11,11,.6)}
.ot-modal__panel{position:relative;display:flex;flex-direction:column;width:100%;max-width:480px;max-height:calc(100vh - 48px);overflow:hidden;background:var(--ot-bg);border:var(--ot-bw) solid var(--ot-ink);border-radius:var(--ot-r);animation:ot-modal-in .18s var(--ot-ease)}
.ot-modal__panel--wide{max-width:760px}
.ot-modal__head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:20px 20px 12px 24px}
.ot-modal__title{margin:6px 0 0;font-family:var(--ot-display);font-size:32px;font-weight:400;line-height:1;text-transform:uppercase}
.ot-modal__x{flex:none}
.ot-modal__body{padding:0 24px 8px;overflow-y:auto;overscroll-behavior:contain;font-size:15px;line-height:1.55}
.ot-modal__body p{margin:0 0 12px}
.ot-modal__foot{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:10px;padding:16px 24px 24px}
@keyframes ot-modal-in{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
body.ot-modal-open{overflow:hidden}
@media (max-width:743px){
  .ot-modal{align-items:flex-end;padding:0}
  .ot-modal__panel{max-width:none;max-height:calc(100vh - 24px);border-left:0;border-right:0;border-bottom:0;border-radius:var(--ot-r) var(--ot-r) 0 0;padding-bottom:var(--ot-safe-b)}
  .ot-modal__title{font-size:28px}
  .ot-modal__foot .ot-btn{flex:1 1 0}
}

/* ── footer chung họ 1click: LỚP DA 1clicktee (phần tử gốc .ocs--oneclicktee) ── */
.ocs--oneclicktee{--ocs-font:var(--ot-font);--ocs-ink:var(--ot-ink);--ocs-muted:var(--ot-muted);--ocs-faint:var(--ot-faint);--ocs-bg:var(--ot-bg);--ocs-line:var(--ot-ink);--ocs-pop:var(--ot-bg);--ocs-pop-line:var(--ot-ink);--ocs-pop-sep:var(--ot-line-soft)}
.ocs--oneclicktee.ocs-foot{background:var(--ot-bg);border-top:var(--ot-bw) solid var(--ot-ink);color:var(--ot-muted)}
.ocs--oneclicktee .ocs-foot__in{max-width:var(--ot-container);padding:20px var(--ot-gutter)}
.ocs--oneclicktee .ocs-foot__zone--orova{border-inline-start:var(--ot-bw) solid var(--ot-line-soft)}
.ocs--oneclicktee .ocs-foot__lbl{font-weight:800;letter-spacing:.02em;color:var(--ot-ink)}
.ocs--oneclicktee .ocs-foot__lbl img{border-radius:var(--ot-r-sm)}
.ocs--oneclicktee .ocs-foot__a,.ocs--oneclicktee .ocs-pm__btn{font-weight:600;color:var(--ot-muted)}
.ocs--oneclicktee .ocs-foot__a:hover,.ocs--oneclicktee .ocs-pm__btn:hover,.ocs--oneclicktee .ocs-pm.ocs-on .ocs-pm__btn{color:var(--ot-ink);text-decoration:underline;text-underline-offset:3px}
.ocs--oneclicktee .ocs-pm__pop{background:var(--ot-bg);border:var(--ot-bw) solid var(--ot-ink);border-radius:var(--ot-r);box-shadow:none}
.ocs--oneclicktee .ocs-pm__row:hover,.ocs--oneclicktee .ocs-pm__row.ocs-sel{background:var(--ot-accent-soft)}
.ocs--oneclicktee .ocs-pm__row[aria-current=page]{background:var(--ot-ink)}
.ocs--oneclicktee .ocs-pm__row[aria-current=page] .ocs-pm__nm,.ocs--oneclicktee .ocs-pm__row[aria-current=page] .ocs-pm__ic{color:var(--ot-on-ink)}
@media (max-width:1023px){.ocs--oneclicktee .ocs-foot__zone--orova{border-inline-start:0;border-top:var(--ot-bw) solid var(--ot-line-soft)}}
@media (max-width:743px){.ocs--oneclicktee.ocs-foot{--ocs-safe-b:calc(var(--ot-dock-h) + var(--ot-safe-b))}}
@media (max-width:640px){.ocs--oneclicktee .ocs-foot__lbl,.ocs--oneclicktee .ocs-foot__a,.ocs--oneclicktee .ocs-pm__btn{min-height:44px}}

@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
  .ot-strip__t{animation:none!important;padding-inline-start:0!important;overflow:hidden!important;text-overflow:ellipsis!important;flex:1 1 auto!important}}

/* ── phông theo ngữ (I3 13/11, khuôn 1clickads lang-1311a.css) ──
   Be Vietnam Pro + Anton chỉ phủ Latin/tiếng Việt → ngữ chữ khác lấy thêm MỘT họ Noto Sans (link nạp theo ngữ: macro ot_font_head
   của _layout.html / phần đầu landing.html). --ot-noto đứng SAU Be Vietnam Pro / Anton trong --ot-font / --ot-display (mục token) →
   chữ Latin, số, tên hãng giữ nét cũ; chữ khác hệ rơi về Noto. Trang chủ (html.ldp-html) dùng --f-body/--f-display/--f-serif riêng. */
html[lang=th]{--ot-noto:"Noto Sans Thai"}
html[lang=lo]{--ot-noto:"Noto Sans Lao"}
html[lang=km]{--ot-noto:"Noto Sans Khmer"}
html[lang=my]{--ot-noto:"Noto Sans Myanmar"}
html:is([lang=ar],[lang=fa],[lang=ur]){--ot-noto:"Noto Sans Arabic"}
html[lang=he]{--ot-noto:"Noto Sans Hebrew"}
html:is([lang=hi],[lang=mr],[lang=ne]){--ot-noto:"Noto Sans Devanagari"}
html[lang=bn]{--ot-noto:"Noto Sans Bengali"}
html[lang=ta]{--ot-noto:"Noto Sans Tamil"}
html[lang=te]{--ot-noto:"Noto Sans Telugu"}
html[lang=si]{--ot-noto:"Noto Sans Sinhala"}
html[lang=ja]{--ot-noto:"Noto Sans JP"}
html[lang=ko]{--ot-noto:"Noto Sans KR"}
html[lang=zh]{--ot-noto:"Noto Sans SC"}
html[lang=zh-tw]{--ot-noto:"Noto Sans TC"}
html:is([lang=ru],[lang=uk],[lang=bg],[lang=sr],[lang=kk],[lang=mn],[lang=el]){--ot-noto:"Noto Sans"}
html.ldp-html{--f-body:"OT Vietnam Pro",var(--ot-noto,system-ui),system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --f-display:"Anton",var(--ot-noto,"Impact"),"Impact","Arial Narrow",sans-serif;--f-serif:"Playfair Display",var(--ot-noto,"Georgia"),"Georgia",serif}
/* chữ KHÔNG có hoa/thường (Ả Rập, Do Thái, Thái, Lào, Khmer, Myanmar, Ấn, Sinhala, Nhật, Hàn, Hoa): giãn chữ làm đứt nét nối (Ả Rập),
   tách dấu (Thái/Ấn), thưa vô nghĩa (CJK) → tắt mọi giãn chữ. */
html:is([lang=ar],[lang=fa],[lang=ur],[lang=he],[lang=th],[lang=lo],[lang=km],[lang=my],[lang=hi],[lang=mr],[lang=ne],[lang=bn],[lang=ta],[lang=te],[lang=si],[lang=ja],[lang=ko],[lang=zh],[lang=zh-tw]) body *{letter-spacing:normal!important}
/* tiêu đề Anton (một nét 400, chỉ Latin) → chữ khác hệ rơi về Noto ĐẬM 800 (U2 13/11: thêm Kirin + Hy Lạp ru/uk/bg/sr/kk/mn/el — Noto Sans nạp 400–800); Anton giữ nét 400 cho chữ Latin (không tô đậm giả).
   In hoa giữ nguyên: không tác dụng lên chữ không có hoa/thường, chỉ giữ chữ Latin rơi về en (chưa dịch) cùng kiểu bản gốc. Danh sách = mọi lớp đang dùng --ot-display / --f-display (base, pages, app, shop, pay, ldp — rà 13/11). */
html:is([lang=ar],[lang=fa],[lang=ur],[lang=he],[lang=th],[lang=lo],[lang=km],[lang=my],[lang=hi],[lang=mr],[lang=ne],[lang=bn],[lang=ta],[lang=te],[lang=si],[lang=ja],[lang=ko],[lang=zh],[lang=zh-tw],[lang=ru],[lang=uk],[lang=bg],[lang=sr],[lang=kk],[lang=mn],[lang=el]) :is(
  .ot-display,.ot-modal__title,.ot-logo__txt,
  .otpg-card__code,.otpg-over__t,.otpg-odtee__n,.otpg-dp__countn,.otpg-how b,.otpg-steps b,.otpg-steps__t,.otpg-zones__z,
  .otc-tab b,.otc-style__ph,.otc-style__q,.otc-style__more,.otc-sim__cur,.otc-swatch__line,.otc-out__pct,.otc-card__no,.otc-gate__list b,
  .ots-mto__t,.ots-vis__sub,.ots-fs__lg,.ots-sum__t,.ots-soon__t,.ots-done__stamp,.ots-done__codev,.otp-big,
  .hero-title,.hero-ghost,.mq span,.lb-title,.kho-tab,.kho-label,.how-title,.step-n,.step-copy h3,.tp-text,.sl-big,.gm-title,.gm-caption b,.gm-n,
  .mto-title,.mto-notes h3,.lang-title,.lang-lines li,.faq-title,.faq-q,.final-title,.ocs-prod__t){font-weight:800;font-synthesis:none}
/* CJK: dòng tiêu đề Anton .84–.92 quá sít cho chữ vuông */
html:is([lang=ja],[lang=ko],[lang=zh],[lang=zh-tw]) :is(.ot-display,.ot-modal__title,.hero-title,.hero-ghost,.how-title,.gm-title,.mto-title,.lang-title,.faq-title,.final-title,.lb-title){line-height:1.12}
/* chữ có dấu cao/thấp (Thái, Lào, Khmer, Myanmar, Ấn, Sinhala): dòng tiêu đề thoáng để dấu dòng trên không chạm dòng dưới; Ả Rập 1.25 */
html:is([lang=ar],[lang=fa],[lang=ur]) :is(.ot-display,.ot-modal__title,.hero-title,.hero-ghost,.how-title,.gm-title,.mto-title,.lang-title,.faq-title,.final-title,.lb-title){line-height:1.25}
html:is([lang=th],[lang=lo],[lang=km],[lang=my],[lang=hi],[lang=mr],[lang=ne],[lang=bn],[lang=ta],[lang=te],[lang=si]) :is(h1,h2,h3,h4,.ot-display,.ot-modal__title,.hero-title,.hero-ghost,.how-title,.gm-title,.mto-title,.lang-title,.faq-title,.final-title,.lb-title){line-height:1.4}

/* ── hướng phải-sang-trái (I3 13/11, khuôn 1clickads rtl-1311a.css): ar / he / fa / ur ──
   Khung (header, pop, cảnh báo, toast, tab đáy, dải chữ chạy) đã chuyển sang thuộc tính logic ở trên — tự lật. Dưới đây: chỗ còn
   trái/phải cứng. Số tiền / email / URL / ô số giữ trái-sang-phải. Icon mũi tên hướng lật gương bằng `scale` (không đè transform). */
html[dir=rtl] .ot-skip{left:auto;right:8px}
html[dir=rtl] .ot-logo img{object-position:right center}
html[dir=rtl] .ot-modal__head{padding:20px 24px 12px 20px}
html[dir=rtl] :is(.ot-num,[data-ot-balance-usd],.ot-pop__who span){unicode-bidi:isolate}
html[dir=rtl] :is(input[type=email],input[type=url],input[type=tel],input[type=number],input[inputmode=numeric],input[inputmode=decimal],input[inputmode=email]){direction:ltr;text-align:right}
html[dir=rtl] :is(input[type=text],input[type=search],input:not([type]),textarea){unicode-bidi:plaintext}
html[dir=rtl] svg.ot-icon:is(:has(>path[d="m14 6 6 6-6 6"]),:has(>path[d="m10 6-6 6 6 6"]),:has(>path[d="m16 16 4-4-4-4"])){scale:-1 1}
html[dir=rtl] .ot-btn:hover .ot-btn__arrow{transform:translateX(-3px)}
@keyframes ot-marquee-rtl{from{transform:translateX(0)}to{transform:translateX(100%)}}
@media (max-width:743px){html[dir=rtl] .ot-strip__t{animation-name:ot-marquee-rtl}}
/* trang chủ (CSS màn đầu nội tuyến của landing.html viết theo trái/phải): tiêu đề 2 dòng, chữ nối nghiêng, chú thích, mũi tên nút */
html[dir=rtl] .hero-title .ln-1,html[dir=rtl] .hero-ghost .ln-1{text-align:right;margin-left:0;margin-right:-.035em}
html[dir=rtl] .hero-title .ln-2,html[dir=rtl] .hero-ghost .ln-2{text-align:left;margin-right:0;margin-left:-.03em}
html[dir=rtl] .hero-then{left:auto;right:.6vw}
html[dir=rtl] .hero-caption{text-align:left}
html[dir=rtl] .hero-dots{justify-content:flex-start}
html[dir=rtl] .lf-row input{padding:10px 0 10px 14px}
html[dir=rtl] .btn-main i{display:inline-block;scale:-1 1}
html[dir=rtl] .btn-main:hover i{transform:translateX(-5px)}
@media (max-width:640px){html[dir=rtl] .hero-title .hero-then,html[dir=rtl] .hero-ghost .hero-then{right:0;margin:.02em .04em .04em 0}}