/* =============================================================================
   ATLAS RESEARCH — Affiliate Hub stylesheet
   File đích: /var/www/atlasresearch.blog/affiliate_hub/css/style.css
   Hướng thiết kế: mỗi khối là một "khung hình" vừa đúng một màn hình, lăn chuột
   nhảy sang khung kế tiếp (scroll-snap). Mỗi sàn mang một màu pastel lấy từ màu
   thương hiệu, chữ navy của logo. Một kiểu chữ, góc vuông, không đường kẻ mảnh,
   không bóng đổ, không gradient. Thanh công cụ dính trên cùng.
   -----------------------------------------------------------------------------
   1. Design tokens                   5. Chương từng sàn
   2. Nền tảng + khung hình           6. Công cụ kiểm tra link
   3. Tiện ích + nút                  7. Lưu ý an toàn (FAQ)
   4. Thanh công cụ + hero            8. Footer + chuyển động
                                      9. Tin tức
   ============================================================================= */

/* 1. DESIGN TOKENS ========================================================== */
/* Trang chủ động dùng một giao diện sáng pastel ở mọi chế độ của thiết bị. */
:root{
  color-scheme:light;

  --paper:#F6F8FB;          /* nền chung, trắng ngả xanh rất nhẹ */
  --bar-bg:#FFFFFF;
  --ink:#0F1B2D;            /* navy của logo, dùng cho mọi chữ */
  --ink-soft:#3E4A5E;
  --accent:#0F1B2D;         /* nút chính: khối navy đặc trên nền pastel */
  --accent-ink:#FFFFFF;
  --orbit:#D2A85A;          /* vòng quỹ đạo vàng trong logo */

  /* pastel cho các khung không thuộc sàn nào */
  --sky:#DCEBF7;            /* kiểm tra link */
  --mist:#E6E4F2;           /* lưu ý an toàn */
  --mist-tile:#F3F2FA;
  --butter:#F7EDC8;         /* footer */
  --tile-open:#FFFFFF;

  --ok:#C9EDD8;  --ok-ink:#0B4D33;
  --warn:#FFD6D0; --warn-ink:#8A1C12;
  --unknown:#E3E7EE;

  /* 6 bậc cỡ chữ */
  --t-display:clamp(52px,8.4vw,132px);
  --t-head:clamp(34px,4.4vw,64px);
  --t-sub:clamp(24px,2.4vw,34px);
  --t-lead:clamp(18px,1.5vw,21px);
  --t-body:17px;
  --t-small:14px;

  --font:"Be Vietnam Pro","Segoe UI",system-ui,-apple-system,Roboto,"Helvetica Neue",Arial,sans-serif;

  --bar-h:68px;
  --margin:clamp(16px,3vw,40px);
  --ease-out:cubic-bezier(.16,1,.3,1);
}

/* 2. NỀN TẢNG + KHUNG HÌNH ================================================= */
*,*::before,*::after{box-sizing:border-box;}
*{margin:0;padding:0;}
html{
  scroll-behavior:smooth;
  scroll-padding-top:var(--bar-h);
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
}
body{
  font-family:var(--font);
  font-size:var(--t-body);
  font-weight:500;
  line-height:1.55;
  color:var(--ink);
  background:var(--paper);
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}
img,svg{display:block;max-width:100%;}
a{color:inherit;}
button,input{font:inherit;color:inherit;}
button{background:none;border:0;cursor:pointer;}
ul,ol{list-style:none;}

h1,h2,h3{font-weight:800;line-height:.98;letter-spacing:-.035em;text-wrap:balance;}
h2{font-size:var(--t-head);}
p{text-wrap:pretty;}

:focus-visible{outline:3px solid var(--ink);outline-offset:3px;}

/* Mỗi khung chiếm đúng phần màn hình dưới thanh công cụ */
.frame{
  min-height:calc(100svh - var(--bar-h));
  padding:clamp(40px,6vh,80px) var(--margin);
  scroll-snap-align:start;
}

/* Lăn chuột nhảy từng khung — chỉ bật khi màn hình đủ cao để mỗi khung vừa
   khít; màn hình thấp/điện thoại dùng "proximity" để nội dung dài vẫn cuộn được. */
@media (min-width:900px) and (min-height:680px){
  html{scroll-snap-type:y mandatory;}
  .frame{height:calc(100svh - var(--bar-h));display:grid;align-content:center;}
}
@media (max-width:899px),(max-height:679px){
  html{scroll-snap-type:y proximity;}
}

/* 3. TIỆN ÍCH + NÚT ========================================================= */
.sr-only{
  position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;
}
.skip-link:not(:focus){clip-path:inset(50%);}
.skip-link{
  position:absolute;left:16px;top:-80px;z-index:100;
  background:var(--ink);color:var(--paper);padding:12px 18px;font-weight:700;
  transition:top .2s ease;
}
.skip-link:focus{top:12px;}

.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  min-height:52px;padding:0 24px;
  font-size:var(--t-body);font-weight:700;line-height:1.2;text-align:center;text-decoration:none;white-space:nowrap;
  border:2px solid transparent;
  transition:background-color .2s ease,color .2s ease,border-color .2s ease,transform .15s ease;
}
.btn svg{width:18px;height:18px;transition:transform .2s var(--ease-out);}
.btn:hover svg{transform:translate(3px,-3px);}
.btn:active{transform:translateY(1px);}
.btn--primary{background:var(--accent);color:var(--accent-ink);}
.btn--primary:hover{background:var(--ink-soft);}
.btn--secondary{background:transparent;color:var(--ink);border-color:var(--ink);}
.btn--secondary:hover{background:var(--ink);color:var(--paper);}
.btn--soon{color:var(--ink);background:var(--brand-deep,var(--unknown));cursor:not-allowed;user-select:none;}

/* 4. THANH CÔNG CỤ + HERO =================================================== */
.bar{
  position:sticky;top:env(safe-area-inset-top,0px);z-index:50;
  display:flex;align-items:center;gap:32px;
  height:var(--bar-h);padding:0 var(--margin);
  background:var(--bar-bg);
}
.bar__brand{
  display:flex;align-items:center;gap:12px;margin-right:auto;
  text-decoration:none;font-size:var(--t-body);font-weight:800;letter-spacing:-.02em;white-space:nowrap;
}
.bar__brand img{width:32px;height:32px;}
.bar__nav{display:flex;align-items:center;gap:32px;}
.bar__nav a{position:relative;font-weight:700;text-decoration:none;white-space:nowrap;}
.bar__nav a::after{
  content:"";position:absolute;left:0;right:0;bottom:-4px;height:3px;background:currentColor;
  transform:scaleX(0);transform-origin:left;transition:transform .25s var(--ease-out);
}
.bar__nav a:hover::after,.bar__nav a.is-current::after{transform:scaleX(1);}
.bar__action{min-height:44px;padding:0 18px;}

/* Nội dung hero gom trong khối giữa rộng tối đa 1240px: chữ bên trái, giá + tin dồn sang phải */
.hero{
  display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,520px);align-items:start;
  gap:40px clamp(32px,5vw,80px);
  padding-inline:max(var(--margin),calc((100% - 1240px) / 2));
  position:relative;overflow:clip;isolation:isolate;
}
/* Vòng quỹ đạo của logo, rộng ~120vh, tâm ở 78% ngang / 55% dọc: mép phải, trên, dưới cắt nó */
.hero__orbit{
  position:absolute;z-index:-1;left:78%;top:55%;width:max(120vh,760px);height:auto;aspect-ratio:1;
  translate:-50% -50%;fill:none;stroke:var(--orbit);stroke-width:44;pointer-events:none;
}
.hero__inner,.hero__side{position:relative;}
.hero__inner{max-width:980px;}
.hero h1{font-size:var(--t-display);line-height:.92;letter-spacing:-.05em;}
.masked .line{display:block;overflow:hidden;padding-bottom:.08em;margin-bottom:-.08em;}
.masked .line > span{display:block;}
.hero__standfirst{margin-top:32px;font-size:var(--t-lead);line-height:1.5;max-width:44ch;}
.hero__actions{display:flex;flex-wrap:wrap;align-items:center;gap:16px 28px;margin-top:36px;}
.hero__link{font-weight:700;text-underline-offset:6px;text-decoration-thickness:2px;}
.hero__link:hover{color:var(--ink-soft);}

/* Cột phải của hero: giá coin + tin mới, mỗi khối một tấm trắng */
.hero__side{display:grid;gap:8px;}
.panel{background:#FFFFFF;padding:16px 24px;}
.panel__head{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin-bottom:8px;}
.panel__title{font-size:var(--t-body);letter-spacing:-.01em;line-height:1.2;}
.panel__note{font-size:var(--t-small);color:var(--ink-soft);}
.panel__more{font-size:var(--t-small);font-weight:700;color:var(--ink-soft);text-underline-offset:4px;}
.panel__more:hover{color:var(--ink);}

.ticker__row{
  display:grid;grid-template-columns:minmax(0,1fr) auto 76px;align-items:center;gap:16px;
  margin:0 -12px;padding:8px 12px;text-decoration:none;font-variant-numeric:tabular-nums;
  transition:background-color .2s ease;
}
.ticker__row:hover{background:var(--sky);}
.ticker__coin{font-size:var(--t-small);color:var(--ink-soft);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.ticker__coin b{margin-right:6px;font-size:var(--t-body);font-weight:800;color:var(--ink);}
.ticker__price{font-weight:700;}
.ticker__change{font-size:var(--t-small);font-weight:700;text-align:right;}
.ticker__change.is-up{color:var(--ok-ink);}
.ticker__change.is-down{color:var(--warn-ink);}

.latest__item{display:grid;grid-template-columns:84px minmax(0,1fr);gap:14px;align-items:center;margin:0 -12px;padding:8px 12px;text-decoration:none;transition:background-color .2s ease;}
.latest__item:hover{background:var(--sky);}
.latest__item:not(:has(img)){grid-template-columns:minmax(0,1fr);}
.latest__thumb{width:84px;height:56px;object-fit:cover;background:var(--mist);}
.latest__title{
  display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;overflow:hidden;
  font-weight:700;line-height:1.4;
}

/* 5. CHƯƠNG TỪNG SÀN ======================================================== */
/* Hai sàn một khung: hai mảng màu mỗi mảng nửa màn hình, gặp nhau ở một cạnh dọc.
   Khung thứ hai dàn chữ lên mép trên và cửa sổ trình duyệt xuống mép dưới, để hai khung liền nhau không trùng bố cục. */
.pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-content:stretch;padding:0;}
.partner{
  display:flex;flex-direction:column;justify-content:flex-start;gap:24px;
  padding:clamp(32px,9vh,104px) clamp(24px,3.4vw,56px) clamp(28px,5vh,56px);
  background:var(--brand);color:var(--brand-ink);
}
.pair--flip .partner{justify-content:space-between;}
.partner__text,.partner__side{display:flex;flex-direction:column;}
.partner__side{gap:12px;}

.partner__name{font-size:var(--t-head);line-height:.95;letter-spacing:-.045em;margin-bottom:16px;}
.partner__tagline{font-size:var(--t-lead);font-weight:700;line-height:1.35;margin-bottom:10px;max-width:34ch;}
.partner__desc{font-size:var(--t-body);line-height:1.6;max-width:52ch;}
.partner__tags{margin-top:12px;font-size:var(--t-small);font-weight:700;max-width:52ch;}

/* Cửa sổ trình duyệt: thanh địa chỉ + logo (mảnh giao diện, data-ui) */
.browser{display:flex;flex-direction:column;background:var(--brand-deep);}
.partner__domain{display:flex;align-items:center;gap:12px;min-height:64px;padding:10px 12px 10px 18px;}
.addr{display:flex;align-items:center;gap:10px;min-width:0;font-size:var(--t-sub);line-height:1.1;}
.addr__lock{width:20px;height:20px;flex-shrink:0;}
.addr__scheme{font-size:var(--t-lead);font-weight:500;opacity:.75;}
.addr strong{font-weight:800;letter-spacing:-.02em;font-variant-numeric:tabular-nums;white-space:nowrap;}
.partner__plate{display:grid;place-items:center;aspect-ratio:16 / 4.2;margin:0 8px 8px;background:#FFFFFF;}
.partner__plate--dark{background:var(--ink);}
.partner__plate img{height:clamp(40px,4.2vw,58px);width:auto;max-width:70%;object-fit:contain;}
.partner__domain-note{font-size:var(--t-small);font-weight:700;}

.copy-btn{
  display:inline-flex;align-items:center;gap:8px;margin-left:auto;min-height:44px;padding:0 4px;
  font-size:var(--t-small);font-weight:700;color:inherit;white-space:nowrap;
  transition:opacity .2s ease;
}
.copy-btn[hidden]{display:none;}
.copy-btn svg{width:18px;height:18px;}
.copy-btn:hover{opacity:.7;}
.copy-btn__done,.copy-btn.is-done .copy-btn__icon{display:none;}
.copy-btn.is-done .copy-btn__done{display:block;}

.partner__actions{display:flex;flex-wrap:wrap;gap:12px;}
.partner__actions .btn{flex:1 1 200px;}

/* 6. CÔNG CỤ KIỂM TRA LINK ================================================== */
.checker{
  display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:24px;align-items:center;
  background:var(--sky);
}
.checker__intro{grid-column:1 / span 5;}
.checker__intro h2{margin-bottom:28px;}
.checker__intro p{font-size:var(--t-lead);line-height:1.5;max-width:40ch;}
.checker__form{grid-column:7 / span 6;padding:clamp(24px,3vw,40px);background:#FFFFFF;}
.checker__form label{display:block;font-weight:700;margin-bottom:12px;}
.checker__row{display:flex;gap:8px;}
.checker__row input{
  flex:1;min-width:0;min-height:56px;padding:0 18px;
  font-size:var(--t-body);font-weight:700;
  background:var(--paper);border:2px solid var(--ink);border-radius:0;
}
.checker__row input::placeholder{color:var(--ink-soft);font-weight:500;}
.checker__row input:focus-visible{outline-offset:0;}
.checker__row .btn{min-height:56px;}
.checker__help{margin-top:12px;font-size:var(--t-small);color:var(--ink-soft);}
.checker__result{display:block;margin-top:24px;padding:20px 22px;font-size:var(--t-body);line-height:1.5;}
.checker__result[hidden]{display:none;}
.checker__result strong{display:block;font-size:var(--t-lead);font-weight:800;letter-spacing:-.02em;margin-bottom:6px;}
.checker__result a{font-weight:700;}
.checker__result.is-ok{background:var(--ok);color:var(--ok-ink);}
.checker__result.is-warn{background:var(--warn);color:var(--warn-ink);}
.checker__result.is-unknown{background:var(--unknown);color:var(--ink);}

/* 7. LƯU Ý AN TOÀN (FAQ) ==================================================== */
.faq{
  display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:24px;align-items:center;
  background:var(--mist);
}
.faq h2{grid-column:1 / span 4;align-self:start;}
.faq__list{grid-column:5 / span 8;display:flex;flex-direction:column;gap:8px;}
.faq details{background:var(--mist-tile);transition:background-color .25s ease;}
.faq summary{
  position:relative;display:flex;align-items:center;
  min-height:64px;padding:12px 64px 12px 24px;
  font-size:var(--t-lead);font-weight:700;line-height:1.3;cursor:pointer;list-style:none;
}
.faq summary::-webkit-details-marker{display:none;}
/* Dấu cộng vẽ bằng hai thanh 3px; khi mở, thanh dọc xoay nằm ngang thành dấu trừ */
.faq summary::before,.faq summary::after{
  content:"";position:absolute;right:24px;top:50%;width:16px;height:3px;margin-top:-1.5px;
  background:currentColor;transition:transform .3s var(--ease-out);
}
.faq summary::after{transform:rotate(90deg);}
.faq details[open]{background:var(--ink);color:var(--paper);}
.faq details[open] summary::after{transform:rotate(0deg);}
.faq details:not([open]) summary:hover{background:var(--tile-open);}
.faq details p{padding:0 24px 22px;max-width:56ch;font-size:var(--t-body);line-height:1.6;}

/* 8. FOOTER ================================================================= */
.site-footer{background:var(--ink);color:var(--paper);overflow:hidden;}
.site-footer a:focus-visible{outline-color:var(--paper);}
.site-footer__name{font-size:13.45vw;font-weight:800;line-height:.86;letter-spacing:-.055em;white-space:nowrap;margin-left:-.04em;}
.site-footer__row{
  display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:24px;align-items:start;
  margin-top:clamp(40px,7vh,72px);
}
.site-footer__places{grid-column:1 / span 5;display:flex;flex-direction:column;gap:6px;}
.site-footer__places a{font-size:var(--t-sub);font-weight:800;letter-spacing:-.02em;text-decoration:none;}
.site-footer__places a:hover{text-decoration:underline;text-decoration-thickness:3px;text-underline-offset:6px;}
.disclaimer{grid-column:7 / span 6;}
.disclaimer__title{font-size:var(--t-body);letter-spacing:0;line-height:1.3;margin-bottom:10px;}
.disclaimer p{font-size:var(--t-body);line-height:1.65;max-width:60ch;}
.site-footer__bottom{
  display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;
  margin-top:clamp(40px,8vh,96px);font-size:var(--t-small);font-weight:700;
}
.site-footer__bottom a{text-underline-offset:4px;}

/* 9. TIN TỨC (news/ và news/<bài>/) ======================================== */
/* Trang tin không dùng khung toàn màn hình: cuộn tự nhiên. */
html.page-news{scroll-snap-type:none;}

/* Ảnh thu nhỏ trong danh sách "phóng to" thành ảnh đầu bài (View Transitions
   giữa hai trang; trình duyệt chưa hỗ trợ thì chuyển trang bình thường). */
@media (prefers-reduced-motion:no-preference){
  @view-transition{navigation:auto;}
  ::view-transition-group(*){animation-duration:.45s;animation-timing-function:var(--ease-out);}
}

.news{padding:clamp(40px,6vw,80px) max(var(--margin),calc((100% - 1240px) / 2)) clamp(64px,8vw,120px);}
.news__title{font-size:var(--t-display);line-height:.92;letter-spacing:-.05em;}
.news__lead{margin:20px 0 clamp(40px,5vw,72px);font-size:var(--t-lead);line-height:1.5;max-width:44ch;}
.news__empty{font-size:var(--t-lead);color:var(--ink-soft);}
.news:has(.story) .news__empty{display:none;}

/* Danh sách bài: một cột theo dòng thời gian — chấm tròn trên đường dọc bên trái,
   chữ (thời gian, tiêu đề, sapo) bên trái, ảnh thu nhỏ bên phải. */
.stories{
  position:relative;max-width:820px;
  display:flex;flex-direction:column;gap:clamp(32px,4vw,48px);
  padding-left:44px;
}
.stories::before{content:"";position:absolute;left:5px;top:6px;bottom:0;width:2px;background:var(--mist);}
.story{position:relative;}
.story::before{
  content:"";position:absolute;left:-44px;top:4px;width:12px;height:12px;border-radius:50%;
  background:var(--ink);
}
.story > a{
  display:grid;grid-template-columns:minmax(0,1fr) 216px;gap:28px;align-items:start;
  text-decoration:none;
}
.story__body{display:flex;flex-direction:column;gap:10px;}
.story__meta{font-size:var(--t-small);font-weight:500;color:var(--ink-soft);}
.story__title{font-size:var(--t-lead);line-height:1.35;letter-spacing:-.01em;text-wrap:pretty;}
.story__excerpt{font-size:var(--t-body);line-height:1.6;color:var(--ink-soft);}
.story__thumb{width:216px;height:auto;aspect-ratio:3 / 2;object-fit:cover;background:var(--mist);margin-top:28px;}
.story > a:hover .story__title{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:4px;}
.story > a:hover .story__thumb{opacity:.9;}

/* Bài mới nhất: ảnh lớn bên phải làm điểm nhấn của màn hình đầu (tiêu đề do agent viết, dài, nên giữ cỡ thường) */
.stories{max-width:none;}
.stories > .story:not(:first-of-type){max-width:860px;}
.story:first-of-type > a{grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(24px,4vw,56px);}
.story:first-of-type .story__thumb{width:100%;aspect-ratio:16 / 9;margin-top:0;}

/* Trang bài viết */
.article{padding-bottom:clamp(64px,8vw,120px);}
.article__hero{
  display:block;width:100%;height:auto;aspect-ratio:16 / 9;max-height:72svh;object-fit:cover;background:var(--sky);
}
.article__head{max-width:860px;margin:0 auto;padding:clamp(32px,5vw,64px) var(--margin) 0;}
/* Link quay lại nằm cuối bài, thẳng mép với phần nội dung */
.article__back{display:block;max-width:860px;margin:48px auto 0;padding:0 var(--margin);font-weight:700;text-underline-offset:4px;}
.article__title{font-size:clamp(30px,3.4vw,48px);line-height:1.1;letter-spacing:-.03em;}
.article__meta{margin-top:18px;font-size:var(--t-small);font-weight:700;color:var(--ink-soft);}
.article__lead{margin-top:24px;font-size:var(--t-lead);line-height:1.55;font-weight:700;}

.prose{max-width:860px;margin:0 auto;padding:32px var(--margin) 0;font-size:18px;line-height:1.75;}
.prose > * + *{margin-top:1.1em;}
.prose h2{font-size:var(--t-sub);line-height:1.2;letter-spacing:-.02em;margin-top:1.8em;}
.prose h3{font-size:var(--t-lead);line-height:1.3;letter-spacing:-.01em;margin-top:1.5em;}
.prose ul,.prose ol{padding-left:1.4em;}
.prose ul{list-style:disc;}
.prose ol{list-style:decimal;}
.prose li + li{margin-top:.4em;}
.prose a{font-weight:700;text-underline-offset:3px;}
.prose strong{font-weight:800;}
.prose figure img{width:100%;height:auto;}
.prose figcaption{margin-top:8px;font-size:var(--t-small);color:var(--ink-soft);}
.prose blockquote{padding:16px 22px;background:var(--mist);font-weight:700;}
.prose .source{margin-top:2.4em;font-size:var(--t-small);color:var(--ink-soft);}

.site-footer--compact{padding:28px var(--margin);}
.site-footer--compact .site-footer__bottom{margin-top:0;}

@media (max-width:560px){
  .stories{padding-left:28px;}
  .story::before{left:-28px;}
  .story > a{grid-template-columns:minmax(0,1fr) 112px;gap:14px;}
  .story__thumb{width:112px;margin-top:26px;}
  .story__excerpt{display:none;}
  .story__title{font-size:var(--t-body);}
  .story:first-of-type > a{grid-template-columns:minmax(0,1fr);}
  .story:first-of-type .story__thumb{order:-1;}
  .story:first-of-type .story__excerpt{display:block;}

  .prose{font-size:17px;}
}

/* 10. BẢNG XẾP HẠNG (xep-hang/) ============================================ */
/* Dựng sẵn trên Cloudflare (functions/xep-hang/index.js); tab và bộ lọc là link thường. */

/* Dải chạy ngang: 10 người dẫn đầu tuần gần nhất (danh sách lặp hai lần để nối liền) */
.lbticker{overflow:hidden;background:var(--ink);color:var(--paper);font-size:var(--t-small);}
.lbticker__track{display:flex;width:max-content;}
.lbticker ul{display:flex;}
.lbticker li{padding:12px 48px 12px 0;white-space:nowrap;}
.lbticker li:first-child{padding-left:var(--margin);}
.lbticker strong{font-weight:800;}
.lbticker b{color:var(--orbit);font-weight:800;}
@media (prefers-reduced-motion:no-preference){
  .lbticker__track{animation:lb-marquee 45s linear infinite;}
  .lbticker:hover .lbticker__track{animation-play-state:paused;}
  @keyframes lb-marquee{to{transform:translateX(-50%);}}
}

.lbticker__label{color:var(--orbit);font-weight:800;}
.board .news__lead{margin-bottom:clamp(28px,3vw,40px);}

/* Chọn bảng: hai tab lớn "Nhà giao dịch" / "Người mời" */
.lb-boards{display:flex;gap:4px;}
.lb-boards a{
  flex:0 1 280px;padding:18px 24px;font-size:var(--t-lead);font-weight:800;letter-spacing:-.01em;text-decoration:none;
  background:var(--tile-open);transition:background-color .2s ease,color .2s ease;
}
.lb-boards a:hover{background:var(--mist);}
.lb-boards a[aria-current]{background:var(--ink);color:var(--paper);}
.lb-intro{margin:16px 0 24px;max-width:62ch;color:var(--ink-soft);}
.board__me{margin:-12px 0 clamp(28px,3vw,40px);font-weight:700;}
.board__me a{text-underline-offset:4px;}
.is-signed-in .board__me{display:none;} /* đã đăng nhập: không mời đăng nhập nữa */
.lb-empty{font-size:var(--t-lead);color:var(--ink-soft);margin-top:32px;}
.lb-demo{margin:-8px 0 24px;padding:12px 16px;background:var(--warn);color:var(--warn-ink);font-size:var(--t-small);}

/* Tổng quan kỳ */
.lb-summary{margin-bottom:28px;}
.lb-summary__period{font-size:var(--t-small);font-weight:700;color:var(--ink-soft);}
.lb-summary__stats{display:flex;flex-wrap:wrap;gap:12px;margin-top:14px;}
.lb-summary__stats div{padding:18px 22px;background:var(--butter);min-width:200px;}
.lb-summary__stats div + div{background:var(--sky);}
.lb-summary__stats div:last-child{background:var(--mist);}
.lb-summary__stats dt{font-size:var(--t-small);font-weight:700;color:var(--ink-soft);}
.lb-summary__stats dd{font-size:var(--t-sub);font-weight:800;letter-spacing:-.02em;line-height:1.2;}
.lb-summary__stats dd span{font-size:var(--t-small);}

/* Chọn kỳ + lọc theo sàn */
.lb-controls{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;margin-bottom:clamp(32px,4vw,48px);}
.lb-tabs,.lb-filters{display:flex;flex-wrap:wrap;gap:6px;}
.lb-tabs a,.lb-filters a{
  padding:10px 16px;font-size:var(--t-small);font-weight:700;text-decoration:none;
  background:var(--chip,var(--unknown));transition:background-color .2s ease,color .2s ease;
}
.lb-tabs a{background:var(--tile-open);}
.lb-tabs a:hover,.lb-filters a:hover{background:var(--ink-soft);color:var(--paper);}
.lb-tabs a[aria-current],.lb-filters a[aria-current]{background:var(--ink);color:var(--paper);}

/* Ảnh đại diện vuông; không có ảnh thì hiện chữ cái đầu trên nền pastel */
.lb-avatar{width:40px;height:40px;flex-shrink:0;object-fit:cover;background:var(--av,var(--mist));}
.lb-avatar--initials{display:grid;place-items:center;font-size:var(--t-small);font-weight:800;}
.lb-verified{display:inline-block;width:16px;height:16px;margin-left:6px;vertical-align:-2px;}
.lb-verified svg{width:100%;height:100%;}

/* Bục vinh danh: thứ tự hiển thị 2 – 1 – 3, hạng 1 cao nhất */
.podium{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:end;gap:12px;max-width:960px;margin:0 auto clamp(40px,5vw,64px);}
.podium__item{
  display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center;
  padding:28px 16px 24px;background:var(--sky);
}
.podium__item--1{order:2;min-height:300px;background:var(--butter);}
.podium__item--2{order:1;min-height:250px;}
.podium__item--3{order:3;min-height:220px;background:var(--mist);}
.podium__rank{font-size:var(--t-sub);font-weight:800;line-height:1;}
.podium__item--1 .podium__rank{color:var(--orbit);font-size:var(--t-head);}
.podium__item .lb-avatar{width:72px;height:72px;font-size:var(--t-lead);margin-top:auto;background:var(--tile-open);}
.podium__name{font-weight:800;line-height:1.3;word-break:break-word;}
.podium__reward{font-size:var(--t-lead);font-weight:800;letter-spacing:-.01em;}
.podium__reward span,.lb-row__reward span{font-size:var(--t-small);}
.podium__meta{font-size:var(--t-small);color:var(--ink-soft);}

/* Danh sách từ hạng 4 */
.lb-table{max-width:960px;margin:0 auto;}
.lb-list{display:flex;flex-direction:column;gap:4px;}
.lb-row{
  display:grid;grid-template-columns:56px minmax(0,1fr) minmax(0,220px) 110px 170px;align-items:center;gap:16px;
  padding:12px 18px;background:var(--tile-open);
}
.lb-row--head{background:none;padding-top:0;padding-bottom:8px;font-size:var(--t-small);font-weight:700;color:var(--ink-soft);}
.lb-row__rank{font-weight:800;color:var(--ink-soft);font-variant-numeric:tabular-nums;}
.lb-row__who{display:flex;align-items:center;gap:12px;min-width:0;}
.lb-row__name{font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.lb-row__chips{display:flex;flex-wrap:wrap;gap:4px;}
.lb-chip{padding:2px 8px;font-size:12px;font-weight:700;background:var(--chip,var(--unknown));}
.lb-row__refs,.lb-row__reward{text-align:right;font-variant-numeric:tabular-nums;}
.lb-row__reward{font-weight:800;}

.board__rules{max-width:860px;margin:clamp(56px,7vw,96px) auto 0;padding:clamp(24px,3vw,40px);background:var(--mist);}
.board__rules h2{font-size:var(--t-sub);letter-spacing:-.02em;margin-bottom:16px;}
.board__rules ul{list-style:disc;padding-left:1.3em;display:flex;flex-direction:column;gap:10px;line-height:1.6;}
.board__note{margin-top:20px;font-size:var(--t-small);color:var(--ink-soft);}

@media (max-width:760px){
  .lb-row{grid-template-columns:40px minmax(0,1fr) auto;gap:12px;padding:12px 14px;}
  .lb-row__chips,.lb-row__refs{display:none;}
  .podium{gap:6px;}
  .podium__item{padding:20px 8px 16px;}
  .podium__item--1{min-height:240px;}
  .podium__item--2{min-height:200px;}
  .podium__item--3{min-height:180px;}
  .podium__item .lb-avatar{width:52px;height:52px;}
  .podium__reward{font-size:var(--t-body);}
  .podium__meta{display:none;}
  .lb-summary__stats div{min-width:0;flex:1 1 140px;}
}

/* 11. TÀI KHOẢN (tai-khoan/) ================================================ */
.bar__user{min-width:32px;min-height:32px;display:flex;align-items:center;}
/* Ảnh đại diện thay nút "Tài khoản" khi đã đăng nhập (js/main.js), cùng dáng nút tròn của Clerk */
.bar__avatar{
  display:grid;place-items:center;flex-shrink:0;width:36px;height:36px;overflow:hidden;border-radius:50%;
  background:var(--ink);color:var(--paper);font-weight:800;text-decoration:none;
}
.bar__avatar img{width:100%;height:100%;object-fit:cover;}
.bar__avatar:hover{outline:3px solid var(--orbit);outline-offset:2px;}
.account__status{margin:0 0 24px;padding:12px 16px;background:var(--unknown);font-size:var(--t-small);font-weight:700;}
.account__status[hidden]{display:none;}
.account__status.is-ok{background:var(--ok);color:var(--ok-ink);}
.account__status.is-warn{background:var(--warn);color:var(--warn-ink);}
.account__signin{display:flex;flex-direction:column;align-items:flex-start;gap:16px;}
.account__ref{padding:14px 18px;background:var(--butter);font-weight:700;}
.account__ref[hidden]{display:none;}

.account__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;max-width:1080px;}
.account__grid[hidden]{display:none;}
.card{display:flex;flex-direction:column;gap:14px;padding:clamp(22px,2.6vw,32px);background:var(--tile-open);}
.card h2{font-size:var(--t-sub);letter-spacing:-.02em;line-height:1.15;}
.card label{font-weight:700;}
.card__hint{font-size:var(--t-small);color:var(--ink-soft);line-height:1.6;}
.card__link{font-weight:700;text-underline-offset:4px;margin-top:auto;}
.card--rank{background:var(--butter);}
.card--invite{background:var(--sky);}
.card--wide{grid-column:1 / -1;}
.card form{display:flex;flex-direction:column;gap:10px;}
.card form[hidden],.account__locked[hidden]{display:none;}
.account__locked{font-weight:700;padding:14px 16px;background:var(--mist);}

.account__row{display:flex;gap:8px;}
.account__row input,.uids input{
  flex:1;min-width:0;min-height:52px;padding:0 16px;
  font-size:var(--t-body);font-weight:700;
  background:var(--paper);border:2px solid var(--ink);border-radius:0;
}
.account__row input::placeholder,.uids input::placeholder{color:var(--ink-soft);font-weight:500;}
.account__row input:focus-visible,.uids input:focus-visible{outline-offset:0;}
.account__row .btn{min-height:52px;}
.btn:disabled{opacity:.55;cursor:progress;}

/* Thông báo trong từng khung + hộp xác nhận cùng giao diện trang */
.card__msg{padding:10px 14px;font-size:var(--t-small);font-weight:700;background:var(--unknown);}
.card__msg[hidden]{display:none;}
.card__msg.is-ok{background:var(--ok);color:var(--ok-ink);}
.card__msg.is-warn{background:var(--warn);color:var(--warn-ink);}
.confirm{
  width:min(460px,calc(100% - 32px));margin:auto;padding:clamp(24px,3vw,36px);
  border:0;border-radius:0;background:var(--tile-open);color:var(--ink);
}
.confirm::backdrop{background:rgba(15,27,45,.55);}
.confirm h2{font-size:var(--t-sub);letter-spacing:-.02em;line-height:1.2;margin-bottom:12px;}
.confirm p{color:var(--ink-soft);line-height:1.6;}
.confirm__actions{display:flex;justify-content:flex-end;gap:8px;margin-top:24px;flex-wrap:wrap;}
@media (prefers-reduced-motion:no-preference){
  .confirm[open]{animation:confirm-in .25s var(--ease-out);}
  @keyframes confirm-in{from{opacity:0;transform:translateY(12px);}to{opacity:1;transform:none;}}
}

.invite__code{font-size:var(--t-head);font-weight:800;letter-spacing:.12em;line-height:1;font-variant-numeric:tabular-nums;}

.rank{display:flex;flex-direction:column;gap:12px;}
.rank div{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding-bottom:12px;border-bottom:2px solid rgba(15,27,45,.08);}
.rank dt{font-weight:700;}
.rank dd{font-weight:800;text-align:right;}

/* Bảng nhỏ trong trang tài khoản: khối lượng của tôi, người đã giới thiệu */
.table-wrap{overflow-x:auto;}
.mini-table{width:100%;border-collapse:collapse;font-size:var(--t-small);}
.mini-table th{text-align:left;font-weight:700;color:var(--ink-soft);padding:8px 10px;white-space:nowrap;}
.mini-table td{padding:10px;background:var(--paper);border-top:4px solid var(--tile-open);vertical-align:middle;}
.mini-table .num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap;}
.mini-table .mono{font-variant-numeric:tabular-nums;letter-spacing:.02em;}
.mini-table .empty{color:var(--ink-soft);}
.uid-chip{display:inline-block;margin:2px 4px 2px 0;padding:2px 8px;background:var(--mist);font-weight:700;white-space:nowrap;}
.uid-chip.is-verified{background:var(--ok);color:var(--ok-ink);}
.uid-chip.is-rejected{background:var(--warn);color:var(--warn-ink);text-decoration:line-through;}
/* Trạng thái UID sàn */
.uid-badge{display:inline-block;align-self:flex-start;padding:3px 8px;font-size:12px;font-weight:700;background:var(--unknown);}
.uid-badge[hidden]{display:none;}
.uid-badge.is-pending{background:var(--butter);}
.uid-badge.is-verified{background:var(--ok);color:var(--ok-ink);}
.uid-badge.is-rejected{background:var(--warn);color:var(--warn-ink);}
.uid-legend{display:flex;flex-direction:column;gap:6px;font-size:var(--t-small);color:var(--ink-soft);}
.uid-legend .uid-badge{margin-right:6px;}
.uids input[readonly]{background:var(--ok);border-color:var(--ok-ink);cursor:not-allowed;}
.uid-claims{padding:12px 14px;background:var(--butter);font-size:var(--t-small);font-weight:700;}
.uid-claims[hidden]{display:none;}
.card__msg-action{margin-top:10px;min-height:40px;font-size:var(--t-small);}
.state{font-weight:700;white-space:nowrap;}
.state.is-ok{color:var(--ok-ink);}
.state.is-wait{color:var(--ink-soft);}

.uids{display:grid !important;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;align-items:start;}
.uids__field{display:flex;flex-direction:column;gap:6px;}
.uids__field span{font-weight:700;}
.uids .btn{grid-column:1 / -1;justify-self:start;}

@media (max-width:860px){
  .account__grid{grid-template-columns:minmax(0,1fr);}
  .uids{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media (max-width:480px){
  .account__row{flex-direction:column;}
  .uids{grid-template-columns:minmax(0,1fr);}
}

/* 12. QUẢN TRỊ (quan-tri/) =================================================== */
.admin .news__lead{max-width:70ch;}
.admin-tabs{display:flex;flex-wrap:wrap;gap:4px;margin-bottom:24px;}
.admin-tabs button{padding:14px 22px;font-size:var(--t-body);font-weight:800;background:var(--tile-open);}
.admin-tabs button[hidden]{display:none;}
.admin-tabs button:hover{background:var(--mist);}
.admin-tabs button[aria-pressed="true"]{background:var(--ink);color:var(--paper);}
.admin-panel{display:flex;flex-direction:column;gap:16px;}
.admin-panel[hidden]{display:none;}
.admin-filters{display:flex;flex-wrap:wrap;gap:8px;}
.admin-filters input,.admin-filters select,.admin-detail select{
  min-height:48px;padding:0 14px;font-size:var(--t-body);font-weight:700;
  background:var(--tile-open);border:2px solid var(--ink);border-radius:0;
}
.admin-filters input{flex:1 1 260px;min-width:0;}
.admin-filters .btn{min-height:48px;}
.admin-table td{white-space:nowrap;}
.admin-table td:nth-child(2),.admin-table td.admin-actions{white-space:normal;}
.admin-table tr.is-clickable{cursor:pointer;}
.admin-table tr.is-clickable:hover td,.admin-table tr.is-clickable:focus-visible td{background:var(--sky);}
.admin-actions{display:flex;flex-wrap:wrap;gap:4px;}
.btn--sm{min-height:34px;padding:0 12px;font-size:var(--t-small);}
.admin-pager{display:flex;align-items:center;gap:12px;font-size:var(--t-small);font-weight:700;}
.admin-detail{border-top:6px solid var(--ink);}
.admin-detail[hidden]{display:none;}
.admin-detail__head{display:flex;justify-content:space-between;align-items:center;gap:12px;}
.admin-detail h3{font-size:var(--t-lead);margin-top:8px;}
.admin-detail__actions{display:flex;flex-wrap:wrap;align-items:flex-end;gap:8px;margin-top:8px;}
.admin-detail__actions label{display:flex;flex-direction:column;gap:6px;font-weight:700;}
.admin-detail__actions label[hidden],.admin-detail__actions .btn[hidden]{display:none;}
.admin-claims{background:var(--butter);}
.admin-claims[hidden]{display:none;}
.confirm__field{display:flex;flex-direction:column;gap:6px;margin-top:16px;font-weight:700;}
.confirm__field[hidden]{display:none;}
.confirm__field input{min-height:48px;padding:0 14px;font-size:var(--t-body);background:var(--paper);border:2px solid var(--ink);border-radius:0;}
.account__notice{padding:14px 18px;font-weight:700;}
.account__notice[hidden]{display:none;}
.account__notice.is-warn{background:var(--warn);color:var(--warn-ink);}
.account__notice.is-staff{background:var(--sky);}
.account__notice a{text-underline-offset:4px;}

/* CHUYỂN ĐỘNG (chỉ khi có JS và người dùng không tắt chuyển động) =========== */
@media (prefers-reduced-motion:no-preference){
  .js .masked .line > span{transform:translateY(105%);transition:transform .9s var(--ease-out);}
  .js .masked .line:nth-child(2) > span{transition-delay:.11s;}
  .js .masked.is-in .line > span{transform:none;}

  .js [data-reveal]{opacity:0;transform:translateY(24px);transition:opacity .7s var(--ease-out),transform .7s var(--ease-out);transition-delay:var(--delay,0ms);}
  .js [data-reveal].is-in{opacity:1;transform:none;}

  /* Vòng quỹ đạo quay vào vị trí khi tải trang, như vòng trong logo */
  .hero__orbit{animation:orbit-in 1.4s var(--ease-out) both;}
  @keyframes orbit-in{from{opacity:0;rotate:-22deg;scale:.92;}to{opacity:1;rotate:0deg;scale:1;}}
  /* Giá vừa cập nhật nháy nhẹ */
  .ticker__price.is-tick{animation:tick .9s var(--ease-out);}
  @keyframes tick{from{opacity:.35;}to{opacity:1;}}
  .latest__thumb{transition:scale .4s var(--ease-out);}
  .latest__item:hover .latest__thumb{scale:1.06;}
  .partner__plate img{transition:scale .5s var(--ease-out);}
  .browser:hover .partner__plate img{scale:1.06;}
}

/* RESPONSIVE ================================================================ */
@media (max-width:1024px){
  .checker__intro,.checker__form{grid-column:1 / span 12;}
  .checker__form{margin-top:40px;}
  .faq h2{grid-column:1 / span 12;margin-bottom:32px;}
  .faq__list{grid-column:1 / span 12;}
}

@media (max-width:999px){
  .hero{grid-template-columns:minmax(0,1fr);}
  .bar,.bar__nav{gap:20px;}
  .pair{grid-template-columns:minmax(0,1fr);height:auto;}
  .pair--flip .partner{justify-content:flex-start;}
  .partner{padding-block:clamp(56px,10vw,96px);}
  .checker,.faq{align-content:center;}
  .hero__orbit{left:85%;top:72%;}
}

@media (max-width:760px){
  :root{--bar-h:60px;}
  .bar{gap:12px;}
  /* Điện thoại: chỉ giữ "Tin tức" (luôn là link cuối của menu) cạnh nút Kiểm tra link */
  .bar__nav{gap:0;}
  .bar__nav a:not(:last-child){display:none;}
  .bar__action{min-height:40px;padding:0 14px;font-size:var(--t-small);}

  .hero h1{font-size:15vw;}
  .hero__actions .btn{width:100%;}
  .panel{padding:16px;}

  .partner__name{font-size:18vw;margin-bottom:22px;}
  .partner__domain{padding:8px 8px 8px 14px;}
  .addr{font-size:22px;}
  .addr__scheme{display:none;}
  .copy-btn__text{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;}

  .checker__row{flex-direction:column;}
  .faq summary{font-size:var(--t-body);padding:12px 56px 12px 20px;}
  .faq summary::before,.faq summary::after{right:20px;}
  .faq details p{padding:0 20px 20px;font-size:16px;}

  .site-footer__places,.disclaimer{grid-column:1 / span 12;}
  .disclaimer{margin-top:40px;}
}

/* Điện thoại hẹp: thanh trên chỉ đủ chỗ cho logo + Tin tức + nút — chữ thương hiệu chỉ còn cho trình đọc màn hình */
@media (max-width:419px){
  .bar__brand span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  *,*::before,*::after{transition:none!important;animation:none!important;}
}

@media print{
  .bar,.partner__actions,.copy-btn,.skip-link,.checker{display:none!important;}
  html{scroll-snap-type:none;}
  body{background:#fff;color:#000;}
  .frame{height:auto;min-height:0;}
  .partner,.faq,.site-footer{background:none!important;}
}