/* Blog (templates home / category / single + patterns/tin-tuc-*.php). Loaded only on pages with a block of class "nw". */
.nw{--nw-left:248px;--nw-right:300px;--nw-top:calc(var(--nav-h) + var(--s-5));--dg-cover-h:176px;padding:var(--s-6) var(--s-4) var(--gap-section)}
.nw__page{max-width:var(--page);margin-inline:auto}
.nw-grid{display:grid;grid-template-columns:var(--nw-left) minmax(0,1fr) var(--nw-right);gap:var(--gap-grid);align-items:start}
.nw-grid > *{margin:0;min-width:0}
.nw-side{position:sticky;top:var(--nw-top);display:grid;gap:var(--gap-grid)}
.nw-side > *{margin:0}
.nw-mid{display:grid;gap:var(--gap-grid)}
.nw-mid > *{margin:0}

/* sidebar modules */
.nw-mod{display:grid;gap:var(--gap-stack);padding:var(--gap-card-s);border:1px solid var(--rule);border-radius:var(--r-card);background:var(--card)}
.nw-mod > *{margin:0;min-width:0}
.nw-mod .mono{font-size:var(--t-2xs)}
.nw-mod__p{color:var(--ink-2);font-size:var(--t-s)}
.nw-mod__rss{font-size:var(--t-s)}
.nw-cats{list-style:none;margin:0;padding:0;display:grid;gap:2px}
.nw-cats li{margin:0;display:flex;align-items:center;justify-content:space-between;gap:var(--s-2);min-height:var(--ctl-s);padding:0 var(--s-3);border-radius:var(--r-pill);color:var(--ink-3);font:500 var(--t-2xs)/1 var(--font-mono);transition:background-color var(--dur) var(--ease-out)}
.nw-cats li:hover,.nw-cats li.current-cat{background:var(--paper-2)}
.nw-cats a{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--ink-2);text-decoration:none;font:500 var(--t-s)/1.2 var(--font-body)}
.nw-cats li:hover a,.nw-cats li.current-cat a{color:var(--ink)}
.nw-cats li.current-cat a{font-weight:600}
.nw-tags{display:flex;flex-wrap:wrap;gap:var(--s-2)}
.nw-mod--tags:not(:has(.nw-tags)){display:none} /* no tags yet: the module stays out of the way */
.nw-tags a{display:inline-flex;align-items:center;min-height:var(--s-6);padding:0 var(--s-2);border:1px solid var(--rule);border-radius:var(--r);background:var(--card);color:var(--ink-2);text-decoration:none;font:500 var(--t-xs)/1 var(--font-body) !important;transition:border-color var(--dur) var(--ease-out)} /* the block sets a size per tag; all topics weigh the same here */
.nw-tags a:hover{border-color:var(--ink-2);color:var(--ink)}
.nw-author__name{font:600 var(--t-s)/1.2 var(--font-body)}
.nw-author__sub{color:var(--ink-3);font-size:var(--t-xs)}
.nw-latest{min-width:0}
.nw-latest__list{list-style:none;margin:0;padding:0;display:grid;gap:var(--s-3)}
.nw-latest__list > li{margin:0;display:grid;gap:2px;padding-top:var(--s-3);border-top:1px solid var(--rule)}
.nw-latest__list > li:first-child{padding-top:0;border-top:0}
.nw-latest__title{font:600 var(--t-s)/1.35 var(--font-body);margin:0}
.nw-latest__title a{color:var(--ink);text-decoration:none}
.nw-latest__title a:hover{color:var(--accent)}
.nw-latest__date{font:500 var(--t-2xs)/1 var(--font-mono);color:var(--ink-3);margin:0}

/* heading of the index */
.nw-head{display:grid;gap:var(--gap-text)}
.nw-head > *{margin:0}
.nw-head__title{font-size:var(--t-2xl);font-weight:800;letter-spacing:-0.03em;line-height:1.08;max-width:22ch}
.nw-head__title strong{font-weight:inherit;color:var(--accent)}
.nw-head__lede{color:var(--ink-2);max-width:var(--measure)}

/* feed */
.nw-feed{min-width:0}
.nw-list{list-style:none;margin:0;padding:0;display:grid;gap:var(--gap-grid)} /* cards never share an edge */
.nw-list > li{margin:0;min-width:0}
.nw-card{display:grid;gap:var(--gap-stack);padding:var(--gap-card-s);border:1px solid var(--rule);border-radius:var(--r-card);background:var(--card)}
.nw-card > *{margin:0;min-width:0}
.nw-card__top{gap:var(--s-2) var(--s-3);font-size:var(--t-xs);color:var(--ink-3)}
.nw-card__top > *{margin:0}
.nw-card__who{font:600 var(--t-s)/1.2 var(--font-body);color:var(--ink)}
.nw-cat{font-size:var(--t-xs)}
.nw-cat a{display:inline-flex;align-items:center;gap:var(--s-2);color:var(--ink-2);font-weight:500;text-decoration:none}
.nw-cat a::before{content:"";width:var(--s-2);height:var(--s-2);border-radius:50%;background:var(--accent-fill)}
.nw-card__date,.dg-read-time{font-size:var(--t-xs);color:var(--ink-3)}
.nw-card__top > * + *::before,.nw-meta > * + *::before{content:"·";margin-right:var(--s-3);color:var(--ink-3)}
.nw-card__top > .nw-cat + *::before{margin-left:0}
.nw-card__title{font-size:var(--t-xl);font-weight:700;letter-spacing:-0.02em;line-height:1.2}
.nw-card__title a{text-decoration:none;color:inherit;transition:color var(--dur) var(--ease-press)}
.nw-card__title a:hover{color:var(--accent)}
.nw-card__excerpt{color:var(--ink-2)}
.nw-card__excerpt p{margin:0}
.nw-card__excerpt .wp-block-post-excerpt__more-text{display:none}
.nw-pages{margin-top:var(--s-2);font-size:var(--t-s)}
.nw-pages a,.nw-pages .page-numbers{color:var(--ink-2);text-decoration:none}
.nw-pages .page-numbers.current{color:var(--ink);font-weight:600}
.nw-empty{padding:var(--gap-card);border:1px dashed var(--rule);border-radius:var(--r-card);color:var(--ink-2);text-align:center}

/* article */
.nw-post{display:grid;gap:var(--gap-card-s);padding:var(--gap-card);border:1px solid var(--rule);border-radius:var(--r-card);background:var(--card)}
.nw-post > *{margin:0;min-width:0} /* grid items default to min-width:auto: a wide code block would widen every sibling */
.nw-crumb{gap:var(--s-2);color:var(--ink-3);font-size:var(--t-xs)}
.nw-crumb > *{margin:0}
.nw-crumb a{color:var(--ink-2);text-decoration:none}
.nw-crumb a:hover{color:var(--accent)}
.nw-crumb > * + *::before{content:"›";margin-right:var(--s-2);color:var(--ink-3)}
.nw-post__title{font-size:var(--t-2xl);font-weight:800;letter-spacing:-0.03em;line-height:1.1}
.nw-meta{gap:var(--s-2) var(--s-3);color:var(--ink-3);font-size:var(--t-xs)}
.nw-meta > *{margin:0}
.nw-meta__who{font:600 var(--t-xs)/1.2 var(--font-body);color:var(--ink)}
.nw-meta__date::after{content:" (đăng)"}
.nw-meta__mod::after{content:" (cập nhật)"}
.nw-post__image{margin:0}
.nw-post__image img{border-radius:var(--r-pill)}
.nw-body{display:grid;gap:var(--gap-text);font-size:var(--t-m);line-height:1.7}
.nw-body > *{margin:0;min-width:0;max-width:none}
.nw-body h2{font-size:var(--t-xl);font-weight:700;letter-spacing:-0.02em;margin-top:var(--s-4);scroll-margin-top:calc(var(--nav-h) + var(--s-6))}
.nw-body h3{font-size:var(--t-l);font-weight:700;margin-top:var(--s-2);scroll-margin-top:calc(var(--nav-h) + var(--s-6))}
.nw-body h4{font-size:var(--t-m);font-family:var(--font-display);font-weight:700}
.nw-body ul,.nw-body ol{padding-left:1.25em;display:grid;gap:var(--s-2)}
.nw-body li::marker{color:var(--accent)}
.nw-body a{color:var(--accent)}
.nw-body img{max-width:100%;height:auto;border-radius:var(--r-pill)}
.nw-body pre{padding:var(--s-4);border:1px solid var(--rule);border-radius:var(--r-pill);background:var(--paper-2);overflow-x:auto;overflow-y:hidden;font:400 var(--t-xs)/1.6 var(--font-mono)}
.nw-body code{font-family:var(--font-mono);font-size:.92em;padding:1px var(--s-1);border-radius:var(--r);background:var(--paper-2)}
.nw-body pre code{padding:0;background:none}
.nw-body blockquote{padding:var(--s-3) var(--s-4);border-left:3px solid var(--accent-fill);border-radius:0 var(--r-pill) var(--r-pill) 0;background:var(--accent-tint)}
.nw-body table{border-collapse:collapse;width:100%;font-size:var(--t-s)}
.nw-body th,.nw-body td{padding:var(--s-2) var(--s-3);border:1px solid var(--rule);text-align:left;vertical-align:top}
.nw-body figure{margin:0}
.nw-body iframe{max-width:100%}
.nw-tags-line{font-size:var(--t-xs)}
.nw-tags-line a{display:inline-flex;align-items:center;min-height:var(--s-6);padding:0 var(--s-2);margin:0 var(--s-1) var(--s-1) 0;border:1px solid var(--rule);border-radius:var(--r);color:var(--ink-2);text-decoration:none;font:500 var(--t-xs)/1 var(--font-body)}
.nw-tags-line .wp-block-post-terms__separator{display:none}
.nw-post .dg-acts{border-bottom:1px solid var(--rule);padding-bottom:var(--s-2)}
.nw-cta{display:grid;gap:var(--s-3);padding:var(--gap-card-s);border:1px solid var(--rule);border-radius:var(--r-card);background:var(--paper-2)}
.nw-cta > *{margin:0}
.nw-cta__h{font-size:var(--t-l);font-weight:700}
.nw-cta__p{color:var(--ink-2);font-size:var(--t-s)}
.nw-cta__row{gap:var(--s-2)}
.nw-cta__row .wp-block-button__link{min-height:var(--ctl-s);padding-inline:var(--s-4);font-size:var(--t-s)}
.nw-comments{display:grid;gap:var(--gap-stack);padding-top:var(--s-4);border-top:1px solid var(--rule)}
.nw-comments > *{margin:0}
.nw-comments__title{font-size:var(--t-l);font-weight:700}
.nw-comment{gap:var(--s-3);padding:var(--s-3) 0;border-top:1px solid var(--rule)}
.nw-comment__avatar img{border-radius:50%}
.nw-comment__body{display:grid;gap:var(--s-1);min-width:0}
.nw-comment__body > *{margin:0}
.nw-comment__head{gap:var(--s-2);font-size:var(--t-xs);color:var(--ink-3)}
.nw-comment__head .wp-block-comment-author-name{font-weight:600;color:var(--ink)}
.nw-comment__links{gap:var(--s-3);font-size:var(--t-xs)}
.nw-comments .comment-reply-title{font:700 var(--t-l)/1.2 var(--font-display);margin:0}
.nw-comments .comment-notes,.nw-comments .logged-in-as{color:var(--ink-3);font-size:var(--t-xs)}
.nw-comments .comment-form{display:grid;gap:var(--s-3)}
.nw-comments .comment-form p{margin:0}
.nw-comments .comment-form label{display:block;margin-bottom:var(--s-1);font:600 var(--t-s)/1.3 var(--font-body)}
.nw-comments .comment-form input:not([type="checkbox"]):not([type="submit"]),.nw-comments .comment-form textarea{width:100%;min-height:var(--ctl);padding:var(--s-2) var(--s-3);border:1px solid var(--rule);border-radius:var(--r);background:var(--paper);color:var(--ink);font:400 var(--t-s)/1.4 var(--font-body)}
.nw-comments .comment-form textarea{min-height:calc(var(--s-9) + var(--s-5))}
.nw-pn{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--gap-grid)}
.nw-pn > *{margin:0}
.nw-pn > :empty{display:none}
.nw-pn a{display:grid;gap:var(--s-1);padding:var(--s-4);border:1px solid var(--rule);border-radius:var(--r-pill);text-decoration:none;color:inherit;font:600 var(--t-s)/1.3 var(--font-body);transition:border-color var(--dur) var(--ease-press)}
.nw-pn a:hover{border-color:var(--ink-2)}
.nw-pn .nw-pn__next{text-align:right}
.nw-pn .post-navigation-link__label{display:block;font:500 var(--t-2xs)/1 var(--font-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3)}
.nw-sub__form{min-width:0}

@media (max-width: 1239px){
  .nw{--nw-left:216px;--nw-right:256px}
}
@media (max-width: 1023px){
  .nw-grid{grid-template-columns:minmax(0,1fr)}
  .nw-mid{order:-1} /* phone and tablet: the posts come first, the side modules after */
  .nw-side{position:static}
  .nw-side--left{grid-template-columns:repeat(2,minmax(0,1fr))}
  .nw-side--left .nw-mod--author{grid-column:1 / -1}
  .nw-side--right{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width: 767px){
  .nw{padding-top:var(--s-4)}
  .nw-side--left,.nw-side--right{grid-template-columns:minmax(0,1fr)}
  .nw-post{padding:var(--gap-card-s)}
  .nw-pn{grid-template-columns:minmax(0,1fr)}
  .nw-pn .nw-pn__next{text-align:left}
}