:root{
--tone-canvas:#F1EEF2;--tone-sheet:#FFFFFF;--tone-plate:#1B1016;--tone-plate-2:#2A1A22;--tone-seam:#DDD6DE;--tone-seam-dk:#3E2A34;--tone-veil:rgba(27,16,22,.8);
--tone-text:#18121A;--tone-quiet:#5D5360;--tone-on-plate:#F6EEF2;--tone-on-plate-2:#BFAFB8;
--tone-berry:#D61D59;--tone-berry-ink:#A8124A;--tone-berry-lit:#FF5C8D;--tone-amber:#FD9E01;--tone-flare:#F06820;
--typeface-show:"Anton","Anton-local",Impact,"Arial Narrow",sans-serif;
--typeface-read:"Public Sans","Public-local",system-ui,-apple-system,"Segoe UI",sans-serif;
--step-xs:.8125rem;--step-sm:.9375rem;--step-base:1.0625rem;--step-md:1.25rem;
--step-lg:clamp(1.75rem,1.2rem + 2.2vw,2.75rem);--step-xl:clamp(2.125rem,1.2rem + 3.8vw,4rem);--step-num:clamp(2.5rem,1.6rem + 3vw,4.5rem);
--tall-show:1.22;--tall-read:1.6;--tall-ui:1.25;
--beat-1:4px;--beat-2:8px;--beat-3:12px;--beat-4:20px;--beat-5:32px;--beat-6:56px;--beat-7:96px;
--inset:20px;--span-max:1200px;--span-prose:68ch;--top-h-sm:60px;--top-h:76px;
--round-sm:6px;--round-md:12px;--round-lg:18px;--round-xl:24px;--round-btn:10px;
--depth-plate:0 24px 60px -32px rgba(27,16,22,.45);
--hold-btn-h:46px;--hold-btn-h-sm:38px;--hold-logo:80px;--hold-logo-sm:60px;--hold-slider:104px;--hold-slider-sm:80px;
--hold-cat:50px;--hold-cat-sm:42px;--hold-cat-tab:22px}

@font-face{font-family:"Anton";font-style:normal;font-weight:400;font-display:swap;src:url(glyphs/anton-vietnamese.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(glyphs/anton-latin.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}
@font-face{font-family:"Public Sans";font-style:normal;font-weight:400 700;font-display:swap;src:url(glyphs/publicsans-vietnamese.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:"Public Sans";font-style:normal;font-weight:400 700;font-display:swap;src:url(glyphs/publicsans-latin.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}
/* Dự phòng: số đo tính từ file font (bề rộng chữ trung bình + ascent/descent) */
@font-face{font-family:"Anton-local";src:local("Impact");size-adjust:93.8%;ascent-override:125.5%;descent-override:35.1%;line-gap-override:0%}
@font-face{font-family:"Public-local";src:local("Helvetica"),local("Arial");size-adjust:99.8%;ascent-override:95.2%;descent-override:22.5%;line-gap-override:0%}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--tone-canvas);color:var(--tone-text);font:400 var(--step-base)/var(--tall-read) var(--typeface-read)}
img{max-width:100%;height:auto;display:block}
a{color:var(--tone-berry-ink);text-underline-offset:3px}
a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible{outline:2px solid var(--tone-berry);outline-offset:3px}
h1,h2,h3,p,li,td,th,summary,figcaption,.freshrow-title,.cattile-title,.wayline{overflow-wrap:anywhere}
.wrap{max-width:var(--span-max);margin:0 auto;padding-left:var(--inset);padding-right:var(--inset)}
.head-show{font-family:var(--typeface-show);font-weight:400;text-transform:uppercase;line-height:var(--tall-show);letter-spacing:0;margin:0}
.jumpover{position:absolute;left:var(--beat-2);top:-60px;background:var(--tone-plate);color:var(--tone-on-plate);padding:var(--beat-2) var(--beat-3);border-radius:var(--round-sm);z-index:60}
.jumpover:focus{top:var(--beat-2)}
.screen-reader-text{clip-path:inset(50%);height:1px;width:1px;white-space:nowrap;overflow:hidden;position:absolute}

/* đầu trang */
.topframe{background:var(--tone-canvas);border-bottom:1px solid var(--tone-seam);position:sticky;top:0;z-index:40}
.topframe-in{display:flex;align-items:center;gap:var(--beat-3);min-height:var(--top-h-sm)}
.logo-hold{display:block;flex:none}
.logo-hold img{width:125px;height:24px}
.navline{display:none}
.act-top{margin-left:auto;min-height:var(--hold-btn-h-sm);display:flex;align-items:center}
.sheet-open{flex:none;width:44px;height:44px;display:grid;place-content:center;gap:5px;background:transparent;border:1px solid var(--tone-seam);border-radius:var(--round-btn);cursor:pointer;padding:0}
.sheet-open i{display:block;width:18px;height:2px;background:var(--tone-text)}
.sheet-open i:nth-child(2){width:12px;justify-self:end}

/* menu điện thoại */
.navsheet{position:fixed;inset:0;z-index:80;background:var(--tone-plate);color:var(--tone-on-plate);padding:var(--beat-3) var(--inset) var(--beat-5);display:none;flex-direction:column;overflow-y:auto}
html[data-sheet="on"]{overflow:hidden}
html[data-sheet="on"] .navsheet{display:flex}
.navsheet-top{display:flex;justify-content:space-between;align-items:center;min-height:48px}
.navsheet-top img{width:125px;height:24px}
.navsheet-close{width:44px;height:44px;border:1px solid var(--tone-seam-dk);border-radius:var(--round-btn);background:transparent;color:var(--tone-on-plate);font-size:var(--step-md);cursor:pointer}
.navsheet-list{list-style:none;margin:var(--beat-5) 0;padding:0;counter-reset:sheet}
.navsheet-list li{border-top:1px solid var(--tone-seam-dk);counter-increment:sheet}
.navsheet-list li:last-child{border-bottom:1px solid var(--tone-seam-dk)}
.navsheet-list a{display:flex;align-items:baseline;gap:var(--beat-3);padding:var(--beat-4) 0;min-height:48px;color:var(--tone-on-plate);text-decoration:none;font-family:var(--typeface-show);text-transform:uppercase;font-size:var(--step-lg);line-height:var(--tall-show)}
.navsheet-list a::before{content:counter(sheet,decimal-leading-zero);font-family:var(--typeface-read);font-size:var(--step-xs);color:var(--tone-berry-lit)}
.act-sheet{margin-top:auto}
.navsheet-note{margin:var(--beat-4) 0 0;font-size:var(--step-xs);color:var(--tone-on-plate-2)}

/* hero: tấm tối chứa ảnh */
.heroplate{margin-top:var(--beat-4);background:var(--tone-plate);color:var(--tone-on-plate);border-radius:var(--round-xl);overflow:hidden;box-shadow:var(--depth-plate)}
.heroplate-pic{aspect-ratio:16/9;width:100%}
.heroplate-pic img{width:100%;height:100%;object-fit:cover}
.heroplate-words{padding:var(--beat-4) var(--beat-4) var(--beat-5)}
.heroplate-date{margin:0 0 var(--beat-3);font-size:var(--step-xs);color:var(--tone-on-plate-2)}
.heroplate h1{font-size:var(--step-xl)}
.heroplate-sapo{margin:var(--beat-3) 0 var(--beat-4);max-width:34rem;color:var(--tone-on-plate)}
.heroplate-sapo p{margin:0}
.heroplate-sapo p+p{margin-top:var(--beat-3)}
.act-hero{min-height:var(--hold-btn-h)}

/* dải logo (slider plugin) */
.logo-rail{margin:var(--beat-5) 0 0;min-height:var(--hold-slider-sm)}
.logo-rail:empty{display:none}

/* 5 khối H2 */
.leaf{border-top:1px solid var(--tone-seam);padding:var(--beat-5) 0 var(--beat-6)}
.leaf:first-of-type{margin-top:var(--beat-6)}
.leaf-num{display:block;font-family:var(--typeface-show);font-size:var(--step-num);line-height:1;color:var(--tone-berry);margin-bottom:var(--beat-3)}
.leaf h2{font-size:var(--step-lg)}
.leaf-frame{margin:var(--beat-4) 0 0;background:var(--tone-sheet);border:1px solid var(--tone-seam);border-radius:var(--round-lg);overflow:hidden}
.leaf-frame img{aspect-ratio:16/9;width:100%;object-fit:cover}
.leaf-copy{max-width:var(--span-prose)}
.leaf-copy p{margin:var(--beat-4) 0 0}
.leaf-copy ul,.leaf-copy ol{margin:var(--beat-4) 0 0;padding-left:1.2em}
.leaf-copy li+li{margin-top:var(--beat-2)}
.leaf-copy li::marker{color:var(--tone-berry)}

/* bảng */
.tabscroll{overflow-x:auto;margin:var(--beat-4) 0 0;border:1px solid var(--tone-seam);border-radius:var(--round-md);background:var(--tone-sheet)}
.tabscroll table{width:100%;min-width:30rem;border-collapse:collapse;font-size:var(--step-sm)}
.tabscroll th{text-align:left;font-weight:700;background:var(--tone-plate);color:var(--tone-on-plate);padding:var(--beat-3)}
.tabscroll td{padding:var(--beat-3);border-top:1px solid var(--tone-seam);vertical-align:top}

/* bài mới: hàng kẻ */
.freshzone{padding:var(--beat-6) 0;border-top:1px solid var(--tone-seam)}
.freshzone h2{font-size:var(--step-lg)}
.freshzone-head{display:flex;flex-wrap:wrap;align-items:end;justify-content:space-between;gap:var(--beat-3)}
.freshzone-head>*{min-width:0}
.freshzone-all{font-size:var(--step-sm);font-weight:600}
.freshlist{list-style:none;margin:var(--beat-5) 0 0;padding:0}
.freshrow{border-top:1px solid var(--tone-seam)}
.freshrow:last-child{border-bottom:1px solid var(--tone-seam)}
.freshrow a{display:grid;grid-template-columns:1fr auto;gap:var(--beat-1) var(--beat-4);padding:var(--beat-4) 0;color:var(--tone-text);text-decoration:none}
.freshrow a>*{min-width:0}
.freshrow-meta{grid-column:1;font-size:var(--step-xs);color:var(--tone-quiet)}
.freshrow-meta b{color:var(--tone-berry-ink);font-weight:600}
.freshrow-title{grid-column:1;font-size:var(--step-md);font-weight:600;line-height:var(--tall-ui)}
.freshrow-go{grid-column:2;grid-row:1/span 2;align-self:center;width:12px;height:12px;border-top:2px solid var(--tone-berry);border-right:2px solid var(--tone-berry);transform:rotate(45deg)}
.freshrow a:hover .freshrow-title{color:var(--tone-berry-ink)}

/* hỏi đáp: tấm tối thứ 2 */
.askplate{background:var(--tone-plate);color:var(--tone-on-plate);border-radius:var(--round-xl);padding:var(--beat-5) var(--beat-4);margin:var(--beat-4) 0 var(--beat-6);box-shadow:var(--depth-plate)}
.askplate h2{font-size:var(--step-lg);margin-bottom:var(--beat-4)}
.askrow{border-top:1px solid var(--tone-seam-dk)}
.askrow:last-of-type{border-bottom:1px solid var(--tone-seam-dk)}
.askrow summary{display:flex;gap:var(--beat-4);justify-content:space-between;list-style:none;cursor:pointer;padding:var(--beat-4) 0;font-weight:600;font-size:var(--step-base);line-height:var(--tall-ui);min-height:48px}
.askrow summary::-webkit-details-marker{display:none}
.askrow summary::after{content:"";flex:none;width:10px;height:10px;margin-top:4px;border-right:2px solid var(--tone-amber);border-bottom:2px solid var(--tone-amber);transform:rotate(45deg);transition:transform .2s}
.askrow[open] summary::after{transform:rotate(-135deg);margin-top:9px}
.askrow-a{color:var(--tone-on-plate-2);max-width:var(--span-prose);padding-bottom:var(--beat-4)}
.askrow-a p{margin:0}
.askrow-a strong{color:var(--tone-on-plate)}

/* chân trang */
.tailpiece{border-top:1px solid var(--tone-seam);padding:var(--beat-5) 0;font-size:var(--step-sm)}
.tailpiece-row{display:flex;flex-wrap:wrap;align-items:center;gap:var(--beat-3) var(--beat-5)}
.tailpiece-row+.tailpiece-row{margin-top:var(--beat-4);padding-top:var(--beat-4);border-top:1px solid var(--tone-seam)}
.tailpiece img{width:125px;height:24px}
.age-mark{display:inline-grid;place-items:center;width:40px;height:40px;border-radius:50%;border:2px solid var(--tone-berry);color:var(--tone-berry-ink);font-weight:700;font-size:var(--step-xs);flex:none}
.tail-note{margin:0;color:var(--tone-quiet);max-width:46rem;flex:1 1 18rem}
.tail-links{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:var(--beat-2) var(--beat-4)}
.tail-links a{color:var(--tone-text)}
.tail-by{color:var(--tone-quiet)}
.tail-by b{color:var(--tone-text)}
.tail-end{color:var(--tone-quiet);font-size:var(--step-xs);justify-content:space-between}

/* bài viết + trang */
.wayline{margin:var(--beat-5) 0 var(--beat-3);font-size:var(--step-xs);color:var(--tone-quiet)}
.wayline p{margin:0}
.wayline a{color:var(--tone-quiet)}
.wayline span[aria-hidden]{margin:0 var(--beat-2);color:var(--tone-berry)}
.readhead h1{font-size:var(--step-xl);max-width:22ch}
.byline-row{display:flex;flex-wrap:wrap;align-items:center;gap:var(--beat-2) var(--beat-4);margin:var(--beat-4) 0;font-size:var(--step-sm);color:var(--tone-quiet)}
.byline-row b,.byline-row time{color:var(--tone-text)}
.readpic{margin:0 0 var(--beat-5);background:var(--tone-sheet);border:1px solid var(--tone-seam);border-radius:var(--round-lg);overflow:hidden}
.readpic img{aspect-ratio:16/9;width:100%;object-fit:cover}
.prosebody{max-width:var(--span-prose);padding-bottom:var(--beat-5)}
.prosebody h2{font-family:var(--typeface-show);font-weight:400;text-transform:uppercase;line-height:var(--tall-show);font-size:clamp(1.5rem,1.1rem + 1.5vw,2.125rem);margin:var(--beat-6) 0 var(--beat-3)}
.prosebody h3{font-size:var(--step-md);line-height:var(--tall-ui);margin:var(--beat-5) 0 var(--beat-2)}
.prosebody p,.prosebody ul,.prosebody ol{margin:0 0 var(--beat-4)}
.prosebody li::marker{color:var(--tone-berry)}
.prosebody figure{margin:var(--beat-5) 0}
.prosebody img{border-radius:var(--round-lg)}
.prosebody figcaption,.wp-caption-text{margin-top:var(--beat-2);font-size:var(--step-xs);color:var(--tone-quiet)}
.wp-caption{max-width:100%!important;width:auto!important}
.aligncenter{margin-left:auto;margin-right:auto}
.prosebody blockquote{margin:var(--beat-5) 0;padding:var(--beat-1) 0 var(--beat-1) var(--beat-4);border-left:3px solid var(--tone-amber);font-size:var(--step-md);line-height:var(--tall-ui)}
.prosebody .tabscroll{margin:0 0 var(--beat-4)}
.writerbox{display:flex;gap:var(--beat-4);align-items:flex-start;margin:var(--beat-5) 0 var(--beat-6);padding:var(--beat-4);background:var(--tone-sheet);border:1px solid var(--tone-seam);border-radius:var(--round-lg);max-width:var(--span-prose)}
.writerbox-ini{flex:none;width:56px;height:56px;border-radius:var(--round-md);background:var(--tone-berry);color:var(--tone-sheet);display:grid;place-items:center;font-family:var(--typeface-show);font-size:var(--step-md)}
.writerbox p{margin:var(--beat-1) 0 0;font-size:var(--step-sm);color:var(--tone-quiet)}
.writerbox b{color:var(--tone-text)}

/* chuyên mục, tìm kiếm, 404 */
.cathead{padding:var(--beat-2) 0 var(--beat-5);border-bottom:1px solid var(--tone-seam)}
.cathead h1{font-size:var(--step-xl)}
.cathead p{margin:var(--beat-3) 0 0;max-width:var(--span-prose);color:var(--tone-quiet)}
.catgrid{list-style:none;margin:var(--beat-5) 0 var(--beat-6);padding:0;display:grid;gap:var(--beat-5) var(--beat-4)}
.catgrid>*{min-width:0}
.cattile a{color:var(--tone-text);text-decoration:none;display:block}
.cattile-pic{aspect-ratio:3/2;border-radius:var(--round-lg);border:1px solid var(--tone-seam);overflow:hidden;background:repeating-linear-gradient(135deg,var(--tone-sheet) 0 14px,var(--tone-canvas) 14px 28px)}
.cattile-pic img{width:100%;height:100%;object-fit:cover}
.cattile-title{display:block;margin-top:var(--beat-3);font-weight:600;font-size:var(--step-md);line-height:var(--tall-ui)}
.cattile-meta{display:block;margin-top:var(--beat-1);font-size:var(--step-xs);color:var(--tone-quiet)}
.cattile a:hover .cattile-title{color:var(--tone-berry-ink)}
.void-note{margin:var(--beat-5) 0 var(--beat-6);max-width:var(--span-prose);color:var(--tone-quiet)}
.pager{margin-bottom:var(--beat-6)}
.pager .nav-links{display:flex;flex-wrap:wrap;gap:var(--beat-2)}
.pager a.page-numbers,.pager span.page-numbers{min-width:44px;height:44px;padding:0 var(--beat-3);display:grid;place-items:center;border:1px solid var(--tone-seam);border-radius:var(--round-btn);color:var(--tone-text);text-decoration:none;font-weight:600;font-size:var(--step-sm)}
.pager span.current{background:var(--tone-plate);color:var(--tone-on-plate);border-color:var(--tone-plate)}
.seekbox{display:flex;gap:var(--beat-2);margin:var(--beat-4) 0 0;max-width:34rem}
.seekbox input{flex:1 1 auto;min-width:0;height:46px;padding:0 var(--beat-3);border:1px solid var(--tone-seam);border-radius:var(--round-btn);background:var(--tone-sheet);font:inherit;color:var(--tone-text)}
.seekbox button{flex:none;height:46px;padding:0 var(--beat-4);border:0;border-radius:var(--round-btn);background:var(--tone-plate);color:var(--tone-on-plate);font:600 var(--step-sm)/1 var(--typeface-read);cursor:pointer}
.lostlinks{list-style:none;margin:var(--beat-5) 0 var(--beat-6);padding:0}

/* nút plugin (theme tự vẽ; plugin in <div><a><span>…</span></a><a>…</a></div>) */
.act-top>div,.act-hero>div,.act-sheet>div{display:flex;gap:var(--beat-2)}
.act-top a,.act-hero a,.act-sheet a{display:inline-flex;align-items:center;justify-content:center;height:var(--hold-btn-h);padding:0 var(--beat-4);border-radius:var(--round-btn);font-weight:700;font-size:var(--step-sm);text-decoration:none;white-space:nowrap;border:1px solid transparent;background:var(--tone-plate);color:var(--tone-on-plate)}
.act-top a:first-child,.act-hero a:first-child,.act-sheet a:first-child{background:var(--tone-amber);color:var(--tone-plate)}
.act-top a:first-child:hover,.act-hero a:first-child:hover,.act-sheet a:first-child:hover{background:var(--tone-flare)}
.act-top a:last-child:not(:first-child):hover{background:var(--tone-plate-2)}
.act-top a{height:var(--hold-btn-h-sm);padding:0 var(--beat-3)}
.act-top a:last-child:not(:first-child){display:none}
.act-hero a,.act-sheet a{flex:1 1 0}
.act-hero a:last-child:not(:first-child),.act-sheet a:last-child:not(:first-child){background:transparent;color:var(--tone-on-plate);border-color:var(--tone-on-plate-2)}
.act-hero a:last-child:not(:first-child):hover,.act-sheet a:last-child:not(:first-child):hover{background:var(--tone-plate-2)}

@media (min-width:640px){.catgrid{grid-template-columns:1fr 1fr}}
@media (min-width:768px){
.act-top a:last-child:not(:first-child){display:inline-flex}
.logo-rail{min-height:var(--hold-slider)}}
@media (min-width:1024px){
.wrap{padding-left:var(--beat-5);padding-right:var(--beat-5)}
.heroplate{position:relative;aspect-ratio:16/9;display:flex;align-items:flex-end}
.heroplate-pic{position:absolute;inset:0;height:100%}
.heroplate::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,var(--tone-plate) 0%,var(--tone-plate) 38%,var(--tone-veil) 52%,transparent 72%)}
.heroplate-words{position:relative;z-index:1;width:54%;padding:var(--beat-6)}
.act-hero a{flex:0 1 auto;min-width:11rem}
.leaf{display:grid;grid-template-columns:4fr 8fr;gap:var(--beat-6);padding:var(--beat-6) 0 var(--beat-7)}
.leaf>*{min-width:0}
.leaf-mark{position:sticky;top:calc(var(--top-h) + var(--beat-4));align-self:start}
.leaf-frame{margin-top:0}
.freshrow a{grid-template-columns:11rem 1fr auto;align-items:baseline;padding:var(--beat-5) 0}
.freshrow-meta{grid-column:1;grid-row:1}
.freshrow-title{grid-column:2;grid-row:1}
.freshrow-go{grid-column:3;grid-row:1}
.askplate{padding:var(--beat-6);display:grid;grid-template-columns:4fr 8fr;gap:var(--beat-6)}
.askplate>*{min-width:0}
.catgrid{grid-template-columns:repeat(3,1fr)}}
@media (min-width:1180px){
.topframe-in{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);min-height:var(--top-h);gap:var(--beat-5)}
.navline{display:block}
.navline ul{display:flex;flex-wrap:wrap;gap:var(--beat-2) var(--beat-4);margin:0;padding:0;list-style:none;white-space:nowrap}
.navline a{color:var(--tone-text);text-decoration:none;font-size:var(--step-sm);font-weight:500;padding:var(--beat-2) 0;border-bottom:2px solid transparent}
.navline a:hover,.navline [aria-current]{border-bottom-color:var(--tone-berry)}
.logo-hold{justify-self:center}
.logo-hold img{width:168px;height:32px}
.act-top{justify-self:end;min-height:var(--hold-btn-h)}
.act-top a{height:var(--hold-btn-h);padding:0 var(--beat-4)}
.sheet-open{display:none}}
.cathead:first-child{padding-top:var(--beat-5)}
