/* MAXYTB inner pages: the G2 ("Picasso ceramics") design system.
   Published content-hashed by assets.publish() as /assets/css/site.<sha10>.css (cached one year).
   The shared tokens below are IDENTICAL to the landing's inline <style> (test_templates checks it). */
:root{color-scheme:light;
  --cream:#fbf5ea;
  --paper:#fffdf8;
  --blue:#1f4be0;
  --navy:#0a1a44;
  --ink:#0f1b3d;
  --muted:#4a5474;
  --sun:#ffc83d;
  --coral:#ff6b4a;
  --sky:#e7edff;
  --on-blue:#dfe6ff;
  --soft:rgba(10,26,68,.14);
  --r:28px;
  --display:"Fraunces","Noto Serif Display","Noto Serif",Cambria,"Times New Roman",serif;
  --sans:"Be Vietnam Pro",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --line:rgba(10,26,68,.16);
  --err:#b42318;
  --plate:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 124 124'%3E%3Ccircle cx='65' cy='66' r='56' fill='%230a1a44'/%3E%3Ccircle cx='62' cy='63' r='56' fill='%23fbf2df' stroke='%230a1a44' stroke-width='2'/%3E%3Ccircle cx='62' cy='63' r='50' fill='none' stroke='%231f4be0' stroke-width='5' stroke-linecap='round' stroke-dasharray='24 5 17 5 31 5 13 5'/%3E%3Ccircle cx='62' cy='63' r='44.6' fill='none' stroke='%23e8a200' stroke-width='1.8' stroke-linecap='round' stroke-dasharray='.1 3.4'/%3E%3Ccircle cx='62' cy='63' r='42' fill='%23fffaf0'/%3E%3Cpath d='M63 21A42 42 0 0 0 63 105C60 99 56 96 57 91 61 90 62 88 60 86 63 84 62 82 60 81 63 79 61 76 55 76 58 70 62 63 64 57 65 50 64 36 63 21Z' fill='%231f4be0'/%3E%3Cpath d='M35 55c5-6 13-6 18 0-5 6-13 6-18 0z' fill='none' stroke='%23fffaf0' stroke-width='2.4'/%3E%3Ccircle cx='44' cy='55' r='2.8' fill='%23fffaf0'/%3E%3Cpath d='M70 53c5-6 13-6 18 0-5 6-13 6-18 0z' fill='none' stroke='%231f4be0' stroke-width='2.4'/%3E%3Ccircle cx='79' cy='53' r='3' fill='%231f4be0'/%3E%3Ccircle cx='89' cy='69' r='5.4' fill='%23ffc83d'/%3E%3Ccircle cx='40' cy='70' r='3.4' fill='%23ffc83d'/%3E%3Cpath d='M64 83c7 5 15 3 19-3' fill='none' stroke='%23ff6b4a' stroke-width='2.8' stroke-linecap='round'/%3E%3Cpath d='M54 12l1.4-7 3.4 3.4L62 3l3.2 5.4 3.4-3.4L70 12z' fill='%23ffc83d' stroke='%230a1a44' stroke-width='1.4' stroke-linejoin='round'/%3E%3C/svg%3E");
}
*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
.mx-req{font-style:normal;color:var(--err)}
.mx-opt{font-weight:400;color:var(--muted);font-size:.9em}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;font:400 1rem/1.6 var(--sans);color:var(--ink);background:var(--cream);overflow-x:hidden}
@supports (overflow:clip){body{overflow-x:clip}}
img,svg{max-width:100%}
img{height:auto}
a{color:var(--blue);text-underline-offset:3px}
a:hover{color:var(--navy)}
h1,h2,h3{text-wrap:balance}
p{text-wrap:pretty}
[id]{scroll-margin-top:16px}
main:focus{outline:none}
:focus-visible{outline:3px solid var(--blue);outline-offset:3px}
.mx-foot :focus-visible,.mx-btn-primary:focus-visible,.mx-band :focus-visible{outline-color:var(--sun)}
.mx-skip{position:absolute;left:16px;top:-80px;z-index:20;padding:12px 18px;border-radius:14px;background:var(--navy);color:#fff;font-weight:700;text-decoration:none}
.mx-skip:focus{top:12px;color:#fff}
.mx-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.mx-sprite{position:absolute;width:0;height:0;overflow:hidden}
.mx-i{width:20px;height:20px;flex:none;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.mx-i-sm{width:15px;height:15px;stroke-width:2.4}
.mx-wrap{width:100%;max-width:1232px;margin-inline:auto;padding-inline:16px}
.mx-read{max-width:760px}
.mx-num{white-space:nowrap;font-variant-numeric:lining-nums tabular-nums}
.mx-muted{color:var(--muted)}
.mx-h1,.mx-body h2,.mx-sec-title,.mx-card h2,.mx-card h3,.mx-level h2,.mx-level h3,.mx-cta-box h2,.mx-author h2,.mx-foot-brand,.mx-stat b{font-family:var(--display);font-optical-sizing:auto;font-variation-settings:"SOFT" 100;font-variant-numeric:lining-nums}
@media (min-width:768px){.mx-wrap{padding-inline:32px}}

/* ---------- buttons ---------- */
.mx-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:10px 20px;border-radius:999px;border:2px solid var(--navy);background:var(--paper);color:var(--navy);box-shadow:0 4px 0 var(--navy);font:700 1rem/1.15 var(--sans);text-align:center;text-decoration:none;cursor:pointer;transition:transform .18s ease,box-shadow .18s ease}
.mx-btn:hover{color:var(--navy);transform:translateY(-2px);box-shadow:0 6px 0 var(--navy)}
.mx-btn:active{transform:translateY(2px);box-shadow:0 2px 0 var(--navy)}
.mx-btn-primary,.mx-btn-primary:hover{background:var(--blue);color:#fff}
.mx-btn-sun,.mx-btn-sun:hover{background:var(--sun);color:var(--navy)}
.mx-btn-line{background:transparent;box-shadow:none}
.mx-btn-line:hover{box-shadow:none;background:rgba(31,75,224,.07)}
.mx-btn-sm{min-height:44px;padding:8px 16px;font-size:.95rem;box-shadow:0 3px 0 var(--navy)}
.mx-btn .mx-num{font-weight:800}
.mx-cta-row{display:flex;flex-wrap:wrap;gap:12px;margin:16px 0 0}
.mx-linkbtn{display:inline-flex;align-items:center;min-height:44px;padding:0;background:none;border:0;color:inherit;font:inherit;font-weight:700;text-decoration:underline;text-underline-offset:4px;cursor:pointer}

/* ---------- header ---------- */
.mx-banner{background:var(--navy);color:#fff;text-align:center;padding:10px 16px;font-size:.92rem}
.mx-banner a{display:inline-flex;align-items:center;min-height:44px;padding:0 8px;margin:-12px 0;color:var(--sun);font-weight:700}
.mx-head{position:relative;z-index:3;padding-block:10px 6px}
.mx-head-row{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"brand act" "nav nav";align-items:center;gap:4px 12px}
.mx-brand{grid-area:brand;justify-self:start;display:inline-flex;align-items:center;gap:10px;min-height:44px;color:var(--navy);text-decoration:none}
.mx-brand:hover{color:var(--navy)}
.mx-brand-mark{width:40px;height:40px;flex:none;border-radius:12px;overflow:hidden}
.mx-brand-word{font-weight:800;font-size:1.06rem;letter-spacing:.05em}
.mx-brand-word span{color:var(--blue)}
.mx-head-act{grid-area:act;display:flex;align-items:center;gap:6px}
.mx-login{display:inline-flex;align-items:center;min-height:44px;padding:0 14px;border:2px solid var(--navy);border-radius:999px;background:var(--paper);box-shadow:0 3px 0 var(--navy);font-weight:700;font-size:.95rem;color:var(--navy);white-space:nowrap;text-decoration:none}
.mx-login:hover{color:var(--blue)}
@media (max-width:767px){.mx-nav a[aria-current]{order:-1}}
.mx-head .mx-btn{display:none;min-height:44px;padding:8px 16px;font-size:.95rem;box-shadow:0 3px 0 var(--navy)}
@media (min-width:960px){.mx-head .mx-btn{display:inline-flex}}
.mx-nav{grid-area:nav;min-width:0;display:flex;gap:2px;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none;padding:4px 2px 8px;margin:0 -2px;-webkit-mask-image:linear-gradient(90deg,#000 88%,transparent);mask-image:linear-gradient(90deg,#000 88%,transparent)}
.mx-nav::-webkit-scrollbar{display:none}
.mx-nav a{flex:none;display:inline-flex;align-items:center;min-height:44px;padding:0 14px;border-radius:999px;border:2px solid transparent;font-weight:700;font-size:.93rem;color:var(--navy);text-decoration:none;white-space:nowrap}
.mx-nav a:hover{color:var(--blue)}
.mx-nav a[aria-current]{background:var(--navy);color:#fff}
.mx-nav a:focus-visible{outline-offset:-4px}
@media (max-width:420px){.mx-login{padding:0 12px;font-size:.88rem}.mx-head .mx-btn{padding:8px 12px}.mx-brand-word{font-size:.9rem}}
@media (min-width:768px) and (max-width:1023px){.mx-nav a{padding:0 9px;font-size:.88rem}.mx-nav a[aria-current]{order:-1}}
@media (min-width:768px){
  .mx-nav{justify-self:start;max-width:100%;border:2px solid var(--navy);border-radius:999px;background:var(--paper);box-shadow:0 3px 0 var(--navy);padding:0;margin:2px 0 6px;-webkit-mask-image:none;mask-image:none}
  .mx-nav a{border:0}
}
@media (min-width:1180px){.mx-head{padding-block:14px 6px}}

/* ---------- page head (hero) with the ceramic plate ---------- */
.mx-hero{position:relative;isolation:isolate;overflow:hidden;padding:8px 0 28px}
.mx-hero-grid{position:relative}
.mx-plate{float:right;width:clamp(84px,24vw,120px);aspect-ratio:1;margin:4px -4px 8px 14px;background:var(--plate) no-repeat center/contain;position:relative}
.mx-plate::before{content:"";position:absolute;z-index:-1;left:34%;top:-16px;bottom:-8px;width:100vw;background:var(--blue);border-bottom-left-radius:40px}
.mx-hero-sm .mx-plate{width:72px;margin-top:0}
.mx-hero-sm .mx-plate::before{display:none}
.mx-kicker{margin:0 0 10px;font-size:.8rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--blue)}
.mx-kicker a{display:inline;padding:14px 0;color:inherit;text-decoration:none}
.mx-kicker a:hover{text-decoration:underline}
.mx-h1{margin:0;font-weight:800;font-size:clamp(1.9rem,1.2rem + 3.2vw,3.4rem);line-height:1.08;letter-spacing:-.02em;color:var(--navy);overflow-wrap:anywhere}
.mx-hero-sm .mx-h1{font-size:clamp(1.6rem,1.15rem + 1.7vw,2.4rem);line-height:1.14}
.mx-lead{margin:14px 0 0;font-size:clamp(1.02rem,.95rem + .4vw,1.2rem);line-height:1.55;color:var(--muted);max-width:40em}
.mx-meta{margin:12px 0 0;font-size:.92rem;color:var(--muted)}
.mx-meta span+span::before{content:" · "}
.mx-parent{margin:10px 0 0;font-weight:700;color:var(--navy)}
.mx-crumbs{margin:0 0 12px;font-size:.88rem;color:var(--muted)}
.mx-crumbs ol{display:flex;flex-wrap:wrap;align-items:center;margin:0;padding:0;list-style:none}
.mx-crumbs li{display:inline-flex;align-items:center}
.mx-crumbs li+li::before{content:"›";padding:0 6px;color:var(--muted)}
.mx-crumbs a{display:inline-flex;align-items:center;min-height:44px;color:var(--muted)}
.mx-crumbs li:last-child{min-width:0;max-width:100%}
.mx-crumbs [aria-current]{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--navy);font-weight:700}
.mx-crumbs a{min-width:44px;justify-content:center}
@media (min-width:640px){.mx-plate{width:150px;margin-left:24px}.mx-plate::before{bottom:-24px}}
@media (min-width:1100px){
  .mx-hero{padding:16px 0 44px}
  .mx-hero-grid{display:grid;grid-template-columns:minmax(0,1fr) 260px;column-gap:48px;align-items:center}
  .mx-hero-grid>.mx-plate{grid-column:2;grid-row:1/span 9;float:none;width:100%;margin:0;align-self:start}
  .mx-hero-grid>.mx-plate::before{left:50%;top:-60vh;bottom:-44px;border-bottom-left-radius:60px}
  .mx-hero-sm .mx-hero-grid{grid-template-columns:minmax(0,1fr) 120px}
  .mx-hero-sm .mx-hero-grid>.mx-plate{align-self:start;margin-top:36px}
}

/* ---------- layout ---------- */
.mx-main{padding:8px 0 56px}
.mx-section{padding:40px 0}
.mx-section+.mx-section{padding-top:8px}
.mx-sec-title{margin:0 0 16px;font-weight:800;font-size:clamp(1.55rem,1.2rem + 1.6vw,2.3rem);line-height:1.12;letter-spacing:-.015em;color:var(--navy)}
.mx-sec-sub{margin:-6px 0 18px;color:var(--muted);max-width:44em}
.mx-panel{padding:22px 18px;border-radius:var(--r);background:var(--paper);border:2px solid var(--soft)}
.mx-band{background:var(--blue);color:var(--paper)}
.mx-band .mx-sec-title,.mx-band a{color:var(--paper)}
@media (min-width:768px){.mx-panel{padding:28px 32px}}

/* ---------- article body typography ---------- */
.mx-article{margin-inline:auto}
.mx-hero-read>.mx-wrap>*{max-width:760px;margin-inline:auto}
.mx-cover{display:block;width:100%;height:auto;margin:8px 0 24px;border-radius:22px;border:2px solid var(--navy);background:var(--sky)}
.mx-body{font-size:1.06rem;line-height:1.72;overflow-wrap:break-word}
.mx-body>*:first-child{margin-top:0}
.mx-body p,.mx-body ul,.mx-body ol,.mx-body table,.mx-body blockquote,.mx-body pre,.mx-body figure{margin:0 0 18px}
.mx-body h2{margin:40px 0 12px;font-weight:800;font-size:clamp(1.45rem,1.2rem + 1vw,1.9rem);line-height:1.18;letter-spacing:-.01em;color:var(--navy)}
.mx-body h3{margin:28px 0 10px;font-size:1.2rem;line-height:1.3;font-weight:800;color:var(--navy)}
.mx-body h4{margin:22px 0 8px;font-size:1.06rem;font-weight:800;color:var(--navy)}
.mx-body ul,.mx-body ol{padding-left:1.4em}
.mx-body li{margin:0 0 8px}
.mx-body li::marker{color:var(--blue);font-weight:700}
.mx-body img{display:block;margin:0 auto;border-radius:16px}
.mx-body figcaption{margin-top:6px;font-size:.9rem;color:var(--muted);text-align:center}
.mx-body blockquote{padding:14px 18px;border-left:5px solid var(--sun);border-radius:0 16px 16px 0;background:var(--paper)}
.mx-body blockquote>:last-child{margin-bottom:0}
.mx-body table{display:block;width:max-content;min-width:100%;max-width:100%;overflow-x:auto;border-collapse:collapse;font-size:.95rem;line-height:1.5;border:2px solid var(--line);border-radius:14px;background:var(--paper)}
.mx-body .mx-table-scroll{margin:0 0 18px;overflow-x:auto;border:2px solid var(--line);border-radius:14px;background:var(--paper)}
.mx-body .mx-table-scroll>table{display:table;width:100%;min-width:100%;max-width:none;margin:0;border:0;border-radius:0;overflow:visible}
.mx-body td>a:only-child,.mx-body td>.mx-celllink{vertical-align:baseline}
.mx-body th,.mx-body td{padding:9px 12px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top;min-width:8rem}
.mx-body th:first-child,.mx-body td:first-child{min-width:0}
@media (max-width:767px){.mx-body th,.mx-body td{min-width:9rem}.mx-body th:first-child,.mx-body td:first-child{min-width:0}}
.mx-body th{background:var(--sky);color:var(--navy);font-weight:800}
.mx-body tr:last-child td{border-bottom:0}
.mx-body pre{padding:14px;border-radius:14px;background:var(--navy);color:#e8ecfa;overflow-x:auto;font-size:.9rem}
.mx-body code{font-size:.92em;padding:1px 5px;border-radius:6px;background:var(--sky)}
.mx-body a.mx-linkline{display:inline-block;min-width:44px;padding-block:11px;margin-block:-11px}
.mx-body pre code{padding:0;background:none}
.mx-body hr{border:0;border-top:2px dashed var(--line);margin:32px 0}
.mx-body strong{color:var(--navy)}
.mx-body li>a:only-child,.mx-body td>a.mx-cell-link{display:inline-flex;align-items:center;min-height:44px;min-width:44px}

/* ---------- boxes used inside bodies (slots) ---------- */
.mx-answer{margin:0 0 24px;padding:18px 20px;border-radius:22px;background:var(--paper);border:2px solid var(--navy);box-shadow:0 5px 0 var(--navy);font-size:1.06rem;line-height:1.6}
.mx-answer p{margin:0}
.mx-answer p+p{margin-top:10px}
.mx-toc{margin:0 0 28px;padding:16px 20px;border-radius:22px;background:var(--sky)}
.mx-toc h2{margin:0 0 6px!important;font:800 .8rem/1.4 var(--sans)!important;letter-spacing:.14em;text-transform:uppercase;color:var(--blue)!important}
.mx-toc ol{margin:0!important;padding-left:1.3em}
.mx-toc li{margin:0!important}
.mx-toc a{display:block;padding:9px 0;color:var(--navy);font-weight:700;text-decoration:none;line-height:1.35}
.mx-toc a:hover{color:var(--blue);text-decoration:underline}
.mx-note,.mx-risk,.mx-commit,.mx-not-for,.mx-prohibited,.mx-bridge,.mx-in-topic,.mx-review,.mx-sources,.mx-changelog,.mx-faq{margin:28px 0}
.mx-risk{padding:18px 20px;border-radius:22px;background:#fff0e0;border:2px solid var(--coral);color:#4a1d00}
.mx-risk strong{color:#4a1d00}
.mx-risk a{color:#7a2e00;font-weight:700}
.mx-risk p{margin:0}
.mx-not-for,.mx-prohibited,.mx-commit{padding:18px 20px;border-radius:22px;background:var(--paper);border:2px solid var(--soft)}
.mx-not-for h2,.mx-prohibited h2,.mx-commit h2,.mx-in-topic h2,.mx-sources h2,.mx-changelog h2,.mx-faq>h2:not(.mx-sec-title),.mx-bridge h2{margin:0 0 10px!important;font-size:1.25rem!important}
.mx-not-for ul,.mx-prohibited ul,.mx-commit ul,.mx-in-topic ul,.mx-sources ol,.mx-changelog ul{margin:0!important}
.mx-commit li::marker{content:"✓  ";color:var(--blue)}
.mx-not-for li::marker,.mx-prohibited li::marker{content:"✕  ";color:var(--err)}
.mx-disclaimer{font-size:.92rem;color:var(--muted)}
.mx-review{padding:14px 18px;border-radius:18px;border:2px dashed var(--line);font-size:.94rem;color:var(--muted)}
.mx-review p{margin:0}
.mx-review p+p{margin-top:4px}
.mx-review a{font-weight:700}
.mx-pending{display:inline-block;margin:12px 0 0;padding:4px 12px;border-radius:999px;background:var(--sky);color:var(--navy);font-size:.86rem;font-weight:700}
.mx-in-topic,.mx-bridge{padding:18px 20px;border-radius:22px;background:var(--sky)}
.mx-in-topic li{margin:0!important}
.mx-in-topic a{display:inline-flex;align-items:center;min-height:44px;font-weight:700}
.mx-bridge p{margin:0 0 10px}
.mx-sources{font-size:.92rem}
.mx-sources li{margin:0;overflow-wrap:anywhere}
.mx-sources a,.mx-lsec-src a,.mx-toc a{display:inline-flex;align-items:center;min-height:44px}
.mx-changelog{font-size:.92rem;color:var(--muted)}
.mx-faq details{margin:0 0 10px;border-radius:18px;background:var(--paper);border:2px solid var(--soft)}
.mx-faq summary{display:flex;align-items:center;min-height:48px;padding:10px 16px;font-weight:800;color:var(--navy);cursor:pointer;list-style:none}
.mx-faq summary::-webkit-details-marker{display:none}
.mx-faq summary::after{content:"+";margin-left:auto;padding-left:12px;font-size:1.4rem;line-height:1;color:var(--blue)}
.mx-faq details[open] summary::after{content:"−"}
.mx-faq details>div{padding:0 16px 14px}
.mx-faq details>div>:last-child{margin-bottom:0}
.mx-svc{display:block;overflow-x:auto;border-collapse:collapse;margin:0 0 18px}

/* ---------- CTA / Zalo ---------- */
.mx-cta-box{position:relative;overflow:hidden;isolation:isolate;margin:40px 0 0;padding:24px 20px;border-radius:var(--r);background:var(--sun);color:var(--navy);border:2px solid var(--navy);box-shadow:0 6px 0 var(--navy)}
.mx-cta-box::before{content:"";position:absolute;z-index:-1;right:-60px;bottom:-80px;width:220px;aspect-ratio:1;border-radius:50%;background:#ffd76e}
.mx-cta-box h2{margin:0 0 8px;font-weight:800;font-size:clamp(1.4rem,1.15rem + 1.2vw,2rem);line-height:1.12}
.mx-cta-box p{margin:0;max-width:36em}
.mx-cta-box .mx-cta-row{margin-top:16px}
.mx-zalo-line{margin:0 0 4px;font-weight:700}
.mx-cta-box a:not(.mx-btn),.mx-zalo a:not(.mx-btn),.mx-lsec-task a{color:var(--navy);font-weight:700}
.mx-zalo{margin:28px 0;padding:18px 20px;border-radius:22px;background:var(--sun);color:var(--navy);border:2px solid var(--navy);box-shadow:0 5px 0 var(--navy)}
.mx-zalo .mx-cta-row{margin:8px 0 0}
@media (min-width:768px){.mx-cta-box{padding:32px 36px}}

/* ---------- cards, chips, pager, search ---------- */
.mx-grid{display:grid;gap:18px;grid-template-columns:repeat(auto-fill,minmax(min(100%,270px),1fr))}
.mx-card{position:relative;display:flex;flex-direction:column;min-width:0;border-radius:24px;background:var(--paper);border:2px solid var(--navy);box-shadow:0 5px 0 var(--navy);overflow:hidden;transition:transform .18s ease,box-shadow .18s ease}
.mx-card:hover{transform:translateY(-3px);box-shadow:0 8px 0 var(--navy)}
.mx-card img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;background:var(--sky);border-bottom:2px solid var(--navy)}
.mx-card-body{display:flex;flex-direction:column;gap:6px;padding:14px 18px 18px;flex:1}
.mx-card h2,.mx-card h3{margin:0;font-weight:750;font-size:1.2rem;line-height:1.25;color:var(--navy)}
.mx-card h2 a,.mx-card h3 a{color:inherit;text-decoration:none}
.mx-card h2 a::after,.mx-card h3 a::after{content:"";position:absolute;inset:0;z-index:1}
.mx-card p{margin:0;font-size:.94rem;line-height:1.5;color:var(--muted)}
.mx-card:focus-within{outline:3px solid var(--blue);outline-offset:3px}
.mx-card a:focus-visible{outline:none}
.mx-cat{margin:0;font-size:.74rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--blue)}
.mx-card-noimg{height:64px;background:var(--plate) no-repeat 18px center/auto 46px,var(--sky);border-bottom:2px solid var(--navy)}
.mx-chips{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;padding:2px 2px 10px;margin:0 -2px 8px}
.mx-chips::-webkit-scrollbar{display:none}
.mx-chip{flex:none;display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:0 16px;border-radius:999px;border:2px solid var(--navy);background:var(--paper);color:var(--navy);font-weight:700;font-size:.93rem;text-decoration:none;white-space:nowrap}
.mx-chip small{font-weight:400;color:var(--muted)}
.mx-chip:hover{background:var(--sky);color:var(--navy)}
.mx-chip[aria-current]{background:var(--navy);color:#fff}
.mx-chip[aria-current] small{color:var(--on-blue)}
.mx-search{display:flex;gap:8px;margin:0 0 16px;max-width:560px}
.mx-search input{flex:1;min-width:0;min-height:48px;padding:10px 16px;border-radius:999px;border:2px solid rgba(10,26,68,.55);background:#fff;color:var(--ink);font:400 1rem/1.4 var(--sans);color-scheme:light}
.mx-search input:focus{outline:3px solid var(--blue);outline-offset:2px;border-color:var(--blue)}
.mx-search .mx-btn{min-height:48px;box-shadow:none}
.mx-results{margin:0 0 24px}
.mx-results ul{margin:8px 0 0;padding-left:1.2em}
.mx-results li{margin:0 0 6px}
.mx-results a{display:inline-flex;min-height:44px;align-items:center;font-weight:700}
.mx-pager{display:flex;flex-wrap:wrap;gap:8px;margin:32px 0 0}
.mx-pager a,.mx-pager span{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;padding:0 12px;border-radius:999px;border:2px solid var(--navy);background:var(--paper);color:var(--navy);font-weight:700;text-decoration:none}
.mx-pager a:hover{background:var(--sky)}
.mx-pager [aria-current]{background:var(--navy);color:#fff}
.mx-pager .mx-gap{border-color:transparent;background:none}
.mx-empty{padding:24px;border-radius:22px;background:var(--paper);border:2px dashed var(--line);color:var(--muted)}

/* ---------- article extras ---------- */
.mx-related{padding:48px 0 0}
.mx-keybox{margin:28px 0;padding:18px 20px;border-radius:22px;background:var(--paper);border:2px dashed var(--line);font-size:.94rem}
.mx-keybox dl{display:grid;grid-template-columns:auto 1fr;gap:4px 16px;margin:10px 0}
.mx-keybox dt{color:var(--muted)}
.mx-keybox dd{margin:0;font-weight:700;color:var(--navy)}
.mx-keybox p{margin:0}
.mx-tags{display:flex;flex-wrap:wrap;gap:6px;margin:24px 0 0;padding:0;list-style:none}
.mx-tags li{padding:3px 12px;border-radius:999px;background:var(--sky);color:var(--navy);font-size:.86rem}
.mx-author{display:grid;grid-template-columns:auto minmax(0,1fr);gap:14px 16px;align-items:center;margin:32px 0 0;padding:18px;border-radius:24px;background:var(--paper);border:2px solid var(--navy);box-shadow:0 5px 0 var(--navy)}
.mx-author h2{margin:0;font-size:1.25rem;font-weight:800;color:var(--navy)}
.mx-author h2 a{display:inline-flex;align-items:center;min-height:44px}
.mx-author p{margin:2px 0 0;font-size:.94rem;color:var(--muted)}
.mx-author .mx-cta-row{grid-column:1/-1;margin:0}
.mx-face{display:block;width:72px;height:72px;flex:none;border-radius:22%;overflow:hidden;border:2px solid var(--navy);background:var(--sky)}
.mx-face img{display:block;width:100%;height:100%;object-fit:cover}
.mx-face-lg{width:128px;height:128px}
@media (max-width:479px){.mx-author{grid-template-columns:1fr}.mx-face-lg{width:96px;height:96px}}
.mx-mark{display:grid;place-items:center;background:var(--plate) no-repeat center/82%,var(--cream)}
.mx-prevnext{display:grid;gap:12px;margin:32px 0 0}
.mx-prevnext a{display:flex;flex-direction:column;gap:2px;min-height:44px;padding:14px 18px;border-radius:20px;border:2px solid var(--navy);background:var(--paper);color:var(--navy);text-decoration:none;font-weight:700;line-height:1.35}
.mx-prevnext a small{font-weight:700;font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;color:var(--blue)}
.mx-prevnext a:hover{background:var(--sky)}
.mx-prevnext [rel=next]{text-align:right}
@media (min-width:640px){.mx-prevnext{grid-template-columns:1fr 1fr}.mx-prevnext [rel=next]:only-child{grid-column:2}}

/* ---------- course ---------- */
.mx-stats{display:flex;flex-wrap:wrap;gap:10px 28px;margin:20px 0 0;padding:0;list-style:none}
.mx-stat{padding-left:12px;border-left:3px solid var(--sun);line-height:1.2}
.mx-stat b{display:block;font-weight:800;font-size:1.6rem;color:var(--blue)}
.mx-stat span{font-size:.86rem;color:var(--muted)}
.mx-start{display:grid;gap:12px;margin:0;padding:0;list-style:none}
.mx-start li{display:grid;gap:4px;padding:16px 18px;border-radius:20px;background:var(--paper);border:2px solid var(--soft)}
.mx-start b{color:var(--navy)}
.mx-start a{display:inline-flex;align-items:center;gap:6px;min-height:44px;font-weight:800}
.mx-start small{color:var(--muted);font-size:.9rem}
@media (min-width:768px){.mx-start{grid-template-columns:repeat(2,minmax(0,1fr))}}
.mx-levels{display:grid;gap:18px;counter-reset:lv;margin:0;padding:0;list-style:none}
.mx-level{border-radius:var(--r);background:var(--paper);border:2px solid var(--navy);box-shadow:0 6px 0 var(--navy);overflow:hidden}
.mx-level-head{display:grid;grid-template-columns:auto minmax(0,1fr);gap:4px 16px;align-items:center;padding:20px 20px 14px}
.mx-level-no{grid-row:span 2;display:grid;place-items:center;width:52px;height:52px;border-radius:50%;background:var(--blue);color:#fff;font:800 1.3rem/1 var(--display);box-shadow:0 0 0 4px var(--paper),0 0 0 6px var(--navy)}
.mx-level:nth-child(3n+2) .mx-level-no{background:var(--sun);color:var(--navy)}
.mx-level:nth-child(3n) .mx-level-no{background:var(--coral);color:var(--navy)}
.mx-level h2,.mx-level h3{margin:0;font-weight:800;font-size:clamp(1.25rem,1.1rem + .8vw,1.6rem);line-height:1.2;color:var(--navy)}
.mx-level-meta{margin:0;font-size:.88rem;color:var(--muted)}
.mx-level-goal{margin:0;padding:0 20px 12px;color:var(--muted)}
.mx-lessons{margin:0;padding:0 12px 12px;list-style:none;counter-reset:ls}
.mx-lessons li{counter-increment:ls}
.mx-lessons a{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:2px 12px;align-items:baseline;min-height:44px;padding:10px 8px;border-top:1px solid var(--line);color:var(--navy);text-decoration:none}
.mx-lessons a::before{content:counter(ls);font-weight:800;color:var(--blue);font-variant-numeric:tabular-nums}
.mx-lessons a:hover{background:var(--sky);border-radius:12px}
.mx-lessons b{font-weight:700;line-height:1.35}
.mx-lessons small{color:var(--muted);white-space:nowrap}
.mx-lessons em{grid-column:2/-1;font-style:normal;font-size:.9rem;color:var(--muted);line-height:1.45}
.mx-formats{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(min(100%,230px),1fr))}
.mx-format{padding:18px;border-radius:22px;background:var(--paper);border:2px solid var(--soft)}
.mx-format h3{margin:0 0 6px;color:var(--navy)}
.mx-format p{margin:0;color:var(--muted)}
.mx-format .mx-format-price{margin-top:10px;font-weight:700;color:var(--navy)}
.mx-format-price a{display:inline-flex;align-items:center;min-height:44px;font-weight:800}
.mx-course-cta{margin:0}
.mx-course-cta h2{font-family:var(--display)}
@media (min-width:1100px){.mx-levels{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* ---------- lesson sections ---------- */
.mx-progress{margin:14px 0 0;display:flex;align-items:center;gap:10px;font-size:.9rem;color:var(--muted)}
.mx-progress i{flex:1;max-width:220px;height:8px;border-radius:99px;background:var(--sky);overflow:hidden}
.mx-progress i b{display:block;height:100%;background:var(--blue);border-radius:99px}
.mx-lsec{margin:32px 0;padding:20px;border-radius:24px;border:2px solid var(--soft);background:var(--paper)}
.mx-lsec>h2{margin:0 0 12px!important;display:flex;align-items:center;gap:10px}
.mx-lsec>h2::before{content:"";flex:none;width:34px;height:34px;border-radius:50%;background:var(--blue) no-repeat center/18px}
.mx-lsec>:last-child{margin-bottom:0}
.mx-lsec ul{list-style:none;padding-left:0}
.mx-lsec li{position:relative;padding-left:32px}
.mx-lsec li::before{content:"";position:absolute;left:0;top:.2em;width:20px;height:20px;border-radius:6px;border:2px solid var(--navy);background:#fff}
.mx-lsec-check{border-color:var(--navy);box-shadow:0 5px 0 var(--navy)}
.mx-lsec-check>h2::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 12.5l4 4 8-9' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
.mx-lsec-bench{background:var(--sky);border-color:transparent}
.mx-lsec-bench>h2::before{background-color:var(--navy);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 19V11M12 19V5M19 19v-6' fill='none' stroke='%23ffc83d' stroke-width='3' stroke-linecap='round'/%3E%3C/svg%3E")}
.mx-lsec-bench li::before{top:.55em;width:8px;height:8px;left:8px;border:0;border-radius:50%;background:var(--blue)}
.mx-lsec-bad{background:#fff4ee;border-color:rgba(255,107,74,.55)}
.mx-lsec-bad>h2::before{background-color:var(--coral);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 7l10 10M17 7L7 17' fill='none' stroke='%230a1a44' stroke-width='3' stroke-linecap='round'/%3E%3C/svg%3E")}
.mx-lsec-bad li::before{border:0;background:none;content:"✕";width:auto;height:auto;top:0;left:4px;font-weight:800;color:#b3261e}
.mx-lsec-task{background:var(--sun);border-color:var(--navy);box-shadow:0 5px 0 var(--navy)}
.mx-lsec-task>h2::before{background-color:var(--navy);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 19l3-1 10-10-2-2L6 16zM14 6l2 2' fill='none' stroke='%23ffc83d' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
.mx-lsec-task,.mx-lsec-task strong{color:var(--navy)}
.mx-lsec-src{font-size:.9rem}
.mx-lsec-src>h2{font-size:1.15rem!important}
.mx-lsec-src>h2::before{display:none}
.mx-lsec-src li{padding-left:0}
.mx-lsec-src li::before{display:none}
.mx-lsec-src a{overflow-wrap:anywhere;word-break:break-word}

/* ---------- key ranking ---------- */
.mx-kr-tools{display:grid;gap:10px;margin:0 0 16px;padding:14px;border-radius:22px;background:var(--paper);border:2px solid var(--soft)}
.mx-kr-tools label{display:grid;gap:4px;font-size:.86rem;font-weight:700;color:var(--navy)}
.mx-kr-tools input,.mx-kr-tools select{min-height:44px;padding:8px 12px;border-radius:14px;border:2px solid rgba(10,26,68,.55);background:#fff;color:var(--ink);font:400 1rem/1.3 var(--sans);color-scheme:light;min-width:0;width:100%}
.mx-kr-count{margin:0;align-self:end;font-size:.9rem;color:var(--muted)}
@media (min-width:768px){.mx-kr-tools{grid-template-columns:2fr 2fr 1fr 1fr 1.2fr;align-items:end}}
.mx-tablewrap{overflow-x:auto;border-radius:22px;border:2px solid var(--navy);background:var(--paper);box-shadow:0 5px 0 var(--navy)}
.mx-table{width:100%;border-collapse:collapse;font-size:.93rem}
.mx-table th,.mx-table td{padding:10px 12px;border-bottom:1px solid var(--line);text-align:left;vertical-align:middle}
.mx-table thead th{background:var(--navy);color:#fff;font-weight:700;white-space:nowrap}
.mx-table tbody tr:last-child td{border-bottom:0}
.mx-table tbody tr:nth-child(even){background:rgba(231,237,255,.45)}
.mx-table td.mx-r,.mx-table th.mx-r{text-align:right;font-variant-numeric:tabular-nums}
.mx-sort{display:inline-flex;align-items:center;gap:4px;min-height:44px;padding:0;background:none;border:0;color:inherit;font:inherit;font-weight:700;cursor:pointer;text-decoration:underline;text-underline-offset:4px}
.mx-sort[aria-sort]::after,th[aria-sort] .mx-sort::after{content:"↓"}
th[aria-sort=ascending] .mx-sort::after{content:"↑"}
.mx-ch{font-weight:800;color:var(--navy)}
.mx-ch small{display:block;font-weight:400;color:var(--muted);font-size:.84rem}
.mx-ch a{display:inline-flex;align-items:center;min-height:44px;margin-right:10px;font-weight:700;font-size:.88rem}
.mx-tier{display:inline-grid;place-items:center;min-width:34px;height:30px;padding:0 8px;border-radius:999px;border:2px solid var(--navy);font-weight:800;color:var(--navy);background:var(--paper)}
.mx-tier-S{background:var(--sun)}
.mx-tier-A{background:var(--blue);color:#fff}
.mx-tier-B{background:var(--sky)}
@media (max-width:767px){
  .mx-tablewrap{overflow:visible;border:0;background:none;box-shadow:none;border-radius:0}
  .mx-table thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .mx-table,.mx-table tbody,.mx-table tr,.mx-table td{display:block;width:100%}
  .mx-table tr{margin:0 0 14px;padding:12px 14px;border-radius:20px;background:var(--paper)!important;border:2px solid var(--navy);box-shadow:0 4px 0 var(--navy)}
  .mx-table td{display:flex;justify-content:space-between;gap:12px;padding:4px 0;border:0;text-align:right}
  .mx-table td::before{content:attr(data-label);font-weight:700;color:var(--muted);text-align:left}
  .mx-table td.mx-ch{display:block;text-align:left;padding-bottom:8px}
  .mx-table td.mx-ch::before{display:none}
  /* key ranking on phones (fixer r2 #38): a compact two-line card — "#rank, channel, tier" then score · sub ·
     views, instead of one labelled row per column (144 cards of ~270 px) */
  #kr-table tr{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;padding:10px 12px;margin:0 0 10px;box-shadow:0 3px 0 var(--navy)}
  #kr-table td{display:block;width:auto;padding:0;text-align:left}
  #kr-table td[data-label="#"]{flex:none;font-weight:800;color:var(--navy)}
  #kr-table td[data-label="#"]::before{content:"#";font-weight:800;color:var(--navy)}
  #kr-table td.mx-ch{flex:1 1 calc(100% - 110px);min-width:0;padding:0}
  #kr-table td.mx-ch a{min-height:44px;margin-right:12px}
  #kr-table a{min-height:44px}
  #kr-table td[data-label="Hạng"]{flex:none}
  #kr-table td[data-label="Hạng"]::before,#kr-table td[data-label="Nhóm"]{display:none}
  #kr-table td.mx-r:not([data-label="#"]){flex:1 1 26%;font-size:.9rem;font-weight:700;color:var(--navy)}
  #kr-table td.mx-r:not([data-label="#"])::before{display:block;font-size:.74rem;font-weight:700}
}
.mx-groups{display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(min(100%,260px),1fr));margin:0;padding:0;list-style:none}
.mx-groups li{padding:14px 16px;border-radius:20px;background:var(--paper);border:2px solid var(--soft)}
.mx-groups b{display:block;color:var(--navy)}
.mx-groups span{font-size:.88rem;color:var(--muted)}
.mx-method{margin:16px 0 0;padding:12px 16px;border-radius:18px;background:var(--sky);font-size:.92rem}
.mx-method summary{display:flex;align-items:center;min-height:44px;font-weight:800;color:var(--navy);cursor:pointer}
.mx-method p{margin:6px 0 0}

/* ---------- lead form (partials/lead_form.html, contract of form.src.js) ---------- */
.mx-form{padding:22px 18px;border-radius:var(--r);background:var(--paper);border:2px solid var(--navy);box-shadow:0 6px 0 var(--navy)}
.mx-form-title{margin:0 0 14px;font:800 1.35rem/1.2 var(--display);color:var(--navy)}
.mx-field{display:flex;flex-direction:column;gap:6px;margin:0 0 14px}
.mx-field label{font-size:.92rem;font-weight:700;color:var(--navy)}
.mx-field input,.mx-field select,.mx-field textarea{width:100%;min-height:48px;padding:11px 14px;border-radius:14px;border:2px solid rgba(10,26,68,.55);background:#fff;color:var(--ink);font:400 1rem/1.4 var(--sans);color-scheme:light}
.mx-field input:focus,.mx-field select:focus,.mx-field textarea:focus{outline:3px solid var(--blue);outline-offset:2px;border-color:var(--blue)}
.mx-check{margin:0 0 12px;font-size:.9rem;line-height:1.5;color:var(--muted)}
.mx-check label{display:flex;gap:10px;align-items:flex-start;min-height:44px}
.mx-check input{flex:none;width:22px;height:22px;margin:1px 0 0;accent-color:var(--blue);color-scheme:light}
.mx-submit .mx-btn{width:100%}
.mx-err{display:block;color:var(--err);font-size:.88rem;font-weight:700}
.mx-err:empty{display:none}
.mx-result{margin:0 0 14px;padding:16px 18px;border-radius:20px;background:var(--paper);border:2px solid var(--navy)}
.mx-result p{margin:0 0 10px}
.mx-cta{display:flex;flex-wrap:wrap;gap:10px}
.mx-ok{background:#e3f6e8}
.mx-fail{background:#fff0e0}

/* ---------- footer, float bar, consent ---------- */
.mx-foot{background:var(--navy);color:#e8ecfa;font-size:.94rem;padding:44px 0 96px}
.mx-foot-grid{display:grid;gap:28px}
.mx-foot h2{margin:0 0 8px;font:800 .8rem/1.4 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--sun)}
.mx-foot p{margin:0 0 8px}
.mx-foot a{display:inline-flex;align-items:center;gap:6px;min-height:44px;color:#fff;font-weight:700;text-underline-offset:4px}
.mx-foot a:hover{color:var(--sun)}
.mx-foot-brand{margin:0 0 6px;font-size:1.5rem;font-weight:800;line-height:1.15;color:#fff}
.mx-slogan{font-family:var(--display);font-style:normal;font-weight:700;color:var(--sun)}
.mx-foot ul{margin:0;padding:0;list-style:none}
.mx-foot .mx-cta-row{margin:8px 0 12px}
.mx-foot .mx-btn{min-height:46px;padding:8px 16px;font-size:.95rem;box-shadow:0 3px 0 #000}
.mx-foot .mx-btn,.mx-foot .mx-btn:hover{color:var(--navy)}
.mx-foot .mx-btn-primary,.mx-foot .mx-btn-primary:hover{background:var(--sun);color:var(--navy)}
.mx-copy{margin-top:28px;padding-top:14px;border-top:1px solid rgba(255,255,255,.18);font-size:.88rem;color:#c9d2ee}
.mx-foot .mx-linkbtn{color:#fff}
@media (min-width:768px){.mx-foot-grid{grid-template-columns:1.2fr 1.3fr 1fr;gap:40px}}
.mx-float{position:fixed;left:0;right:0;bottom:0;z-index:6;display:flex;gap:8px;padding:8px 10px calc(8px + env(safe-area-inset-bottom));background:rgba(251,245,234,.97);border-top:2px solid var(--navy)}
.mx-float{transition:transform .25s ease}
.mx-float.mx-float-off{transform:translateY(110%);visibility:hidden;transition:transform .25s ease,visibility 0s linear .25s}
@media (prefers-reduced-motion:reduce){.mx-float{transition:none}}
.mx-float .mx-btn{flex:1 1 0;min-width:0;min-height:46px;padding:8px 10px;font-size:.95rem;box-shadow:0 3px 0 var(--navy);white-space:nowrap}
.mx-cb{position:fixed;left:12px;right:12px;bottom:78px;z-index:7;max-width:560px;margin:0 auto;padding:16px;border-radius:22px;background:var(--paper);border:2px solid var(--navy);box-shadow:0 6px 0 var(--navy);font-size:.94rem}
.mx-cb p{margin:0 0 10px}
@media (min-width:960px){.mx-float{display:none}.mx-foot{padding-bottom:44px}.mx-cb{bottom:20px}}

/* ---------- 404 / notices ---------- */
.mx-nf .mx-plate{width:140px}
.mx-pillars{display:grid;gap:10px;margin:0;padding:0;list-style:none;grid-template-columns:repeat(auto-fill,minmax(min(100%,220px),1fr))}
.mx-pillars a{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:52px;padding:10px 18px;border-radius:18px;border:2px solid var(--navy);background:var(--paper);color:var(--navy);font-weight:700;text-decoration:none}
.mx-pillars a:hover{background:var(--sky)}
.mx-list{margin:0;padding-left:1.2em}
.mx-list li{margin:0 0 6px}
.mx-list a{display:inline-flex;align-items:center;min-height:44px}

/* ---------- motion, print ---------- */
@media (prefers-reduced-motion:reduce){.mx-btn,.mx-card{transition:none}.mx-btn:hover,.mx-btn:active,.mx-card:hover{transform:none}}
@media (forced-colors:active){.mx-plate,.mx-plate::before{display:none}}
@media print{
  .mx-skip,.mx-nav,.mx-float,.mx-cb,.mx-plate,.mx-head-act,.mx-search,.mx-chips,.mx-pager{display:none!important}
  body,.mx-foot,.mx-cta-box,.mx-band{background:#fff!important;color:#000!important}
  .mx-foot a,.mx-band a{color:#000!important}
  .mx-btn,.mx-card,.mx-answer,.mx-level,.mx-tablewrap{box-shadow:none!important}
}

/* ---------- fixer r3 (visual review) ---------- */
/* phones: breadcrumbs collapse to the parent link ("‹ Chính sách …"); the last crumb repeats the H1 */
@media (max-width:599px){
  .mx-crumbs li{display:none}
  .mx-crumbs li:nth-last-child(2){display:inline-flex}
  .mx-crumbs li:nth-last-child(2)::before{content:"‹";padding:0 6px 0 0;color:var(--muted)}
  .mx-crumbs{margin-bottom:4px}
}
@media (max-width:420px){.mx-hero .mx-h1{font-size:clamp(1.65rem,1.05rem + 3.4vw,2rem)}}
/* body tables on phones: readable columns that scroll inside the box, with a right-edge cue */
@media (max-width:640px){
  .mx-body .mx-table-scroll>table{min-width:34rem}
  .mx-body .mx-table-scroll th:first-child,.mx-body .mx-table-scroll td:first-child{min-width:8em}
  .mx-body .mx-table-scroll{background:linear-gradient(90deg,var(--paper) 30%,rgba(255,253,248,0)) left/24px 100% no-repeat local,
    linear-gradient(270deg,var(--paper) 30%,rgba(255,253,248,0)) right/24px 100% no-repeat local,
    radial-gradient(farthest-side at 100% 50%,rgba(10,26,68,.22),transparent) right/12px 100% no-repeat scroll,var(--paper)}
}
/* niche groups on the key AI hub */
.mx-groups{margin:0 0 18px}
.mx-groups h2{margin:0 0 8px;font-size:1.05rem;font-weight:800;color:var(--navy)}
.mx-groups ul{display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0;list-style:none}
.mx-groups a{display:inline-flex;align-items:center;min-height:44px;padding:0 16px;border:2px solid var(--navy);border-radius:999px;background:var(--paper);font-weight:700;color:var(--navy);text-decoration:none}
.mx-groups a:hover{color:var(--blue)}
/* one left edge for every /day-youtube section: narrow blocks keep the wrap's left edge instead of centring */
.mx-read-l>*{max-width:760px}
/* /day-youtube on phones and tablets: lesson titles only (the descriptions are on the lesson pages) */
@media (max-width:1023px){.mx-lessons em{display:none}}