/* ════════════════════════════════════════════════════════════════════
   DS-BLOG — Blog design layer (Full-Site Design Wave, Blog area)
   Built ONLY on the shared DS tokens (--ink / --muted / --ds-line /
   --float-bg / --hover-fill) + the shared .glass / .chip / .btn system
   from ds-v6.css. Every blog-specific class is namespaced .dsb-.
   Dark mode = html[data-theme="dark"] token extension (navy, first-class).
   ════════════════════════════════════════════════════════════════════ */

/* ---------- Page shell & layout ---------- */
.dsb-main{ padding:2.75rem 0 5rem; }
.dsb-layout{ display:grid; grid-template-columns:minmax(0,1fr); gap:2.5rem; align-items:start; }
.dsb-layout-spaced{ margin-top:3rem; }
.dsb-ad-narrow{ margin:2rem auto 0; max-width:760px; }
.dsb-cat-chip{ margin-bottom:1rem; }
.dsb-ad-top{ margin-top:1.5rem; }
.dsb-appcta{ margin-top:2.5rem; }
.dsb-cta-ghostbtn{ display:inline-flex; align-items:center; justify-content:center; gap:.5rem; min-height:48px; padding:.65rem 1.35rem; border-radius:999px; border:1.5px solid rgba(255,255,255,.35); color:rgba(255,255,255,.75); font-weight:700; font-size:.92rem; }
@media (min-width:1024px){
  .dsb-layout{ grid-template-columns:minmax(0,1fr) 350px; gap:3rem; }
  .dsb-side-sticky{ position:sticky; top:96px; }
}
.dsb-stack{ display:flex; flex-direction:column; gap:1.5rem; min-width:0; }
.dsb-main a{ text-decoration:none; }
.dsb-main :focus-visible{ outline:none; box-shadow:0 0 0 2px #fff, 0 0 0 4.5px rgba(99,102,241,.65); border-radius:10px; }
html[data-theme="dark"] .dsb-main :focus-visible{ box-shadow:0 0 0 2px #0b1020, 0 0 0 4.5px rgba(165,180,252,.8); }

/* ---------- Hero (index) ---------- */
.dsb-hero{ text-align:center; padding:1rem 0 2.25rem; }
.dsb-hero h1{ margin:1.1rem auto 0; max-width:52rem; font-size:2.35rem; line-height:1.12; font-weight:800; letter-spacing:-.025em; color:var(--ink); }
@media (min-width:640px){ .dsb-hero h1{ font-size:3rem; } }
.dsb-hero-sub{ margin:1rem auto 0; max-width:42rem; font-size:1.075rem; line-height:1.65; color:var(--muted); }
.dsb-search{ margin:1.9rem auto 0; max-width:36rem; display:flex; gap:.5rem; }
.dsb-search-field{ position:relative; flex:1 1 auto; min-width:0; }
.dsb-search-field svg{ position:absolute; left:1.15rem; top:50%; transform:translateY(-50%); pointer-events:none; }
.dsb-search-input{ width:100%; min-height:52px; border-radius:999px; border:1px solid var(--ds-line); padding:.7rem 1.2rem .7rem 2.9rem; font-size:.95rem; font-weight:500; box-shadow:0 1px 2px rgba(15,23,42,.05); color:var(--ink) !important; -webkit-text-fill-color:var(--ink); caret-color:var(--ink); color-scheme:light; background:rgba(255,255,255,.92); }
html[data-theme="dark"] .dsb-search-input{ color-scheme:dark; background:rgba(13,18,30,.9); border-color:rgba(255,255,255,.16); }
.dsb-pills{ margin-top:1.9rem; display:flex; flex-wrap:nowrap; justify-content:flex-start; gap:.6rem; overflow-x:auto; scrollbar-width:none; padding-bottom:.25rem; cursor:grab; }
@media (min-width:1024px){ .dsb-pills{ flex-wrap:wrap; justify-content:center; overflow-x:visible; cursor:default; } }
.dsb-pills::-webkit-scrollbar{ display:none; }
.dsb-pill{ display:inline-flex; align-items:center; gap:.4rem; min-height:44px; padding:.55rem 1.15rem; border-radius:999px; font-weight:700; font-size:.875rem; white-space:nowrap; background:rgba(255,255,255,.8); border:1px solid var(--ds-line); color:var(--ink); transition:background .18s ease, transform .18s ease, color .18s ease; cursor:pointer; }
.dsb-pill:hover{ background:#fff; transform:translateY(-1px); }
.dsb-pill.on{ background:#0b0f19; color:#fff; border-color:#0b0f19; }
html[data-theme="dark"] .dsb-pill{ background:rgba(21,27,43,.8); }
html[data-theme="dark"] .dsb-pill:hover{ background:rgba(33,42,63,.95); }
html[data-theme="dark"] .dsb-pill.on{ background:#fff; color:#0b0f19; border-color:#fff; }

/* ---------- Trending strip ---------- */
.dsb-trending{ display:flex; align-items:center; gap:1rem; padding:.8rem 1.25rem; border-radius:999px; margin-bottom:1.75rem; overflow:hidden; }
.dsb-trending-badge{ flex:none; display:inline-flex; align-items:center; gap:.4rem; padding:.35rem .8rem; border-radius:999px; font-size:.72rem; font-weight:800; letter-spacing:.06em; text-transform:uppercase; background:#ffe0ec; color:#b4235f; }
html[data-theme="dark"] .dsb-trending-badge{ background:rgba(244,114,182,.16); color:#f9a8d4; }
.dsb-trending-links{ display:flex; align-items:center; gap:.75rem; overflow-x:auto; white-space:nowrap; scrollbar-width:none; min-width:0; }
.dsb-trending-links::-webkit-scrollbar{ display:none; }
.dsb-trending-links a{ font-size:.9rem; font-weight:600; color:var(--ink); transition:color .18s ease; }
.dsb-trending-links a:hover{ color:#4f46e5; }
html[data-theme="dark"] .dsb-trending-links a:hover{ color:#a5b4fc; }
.dsb-trending-sep{ color:var(--muted); opacity:.6; }

/* ---------- Featured (preview composition) ---------- */
.dsb-feature{ display:grid; overflow:hidden; }
@media (min-width:1024px){ .dsb-feature{ grid-template-columns:1fr 1fr; } }
.dsb-feature-media{ position:relative; min-height:260px; background:linear-gradient(130deg,#a7f3d0,#bae6fd 55%,#ddd6fe); overflow:hidden; }
@media (min-width:1024px){ .dsb-feature-media{ min-height:340px; } }
.dsb-feature-media img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform .7s cubic-bezier(.16,1,.3,1); }
.dsb-feature:hover .dsb-feature-media img{ transform:scale(1.04); }
.dsb-feature-flag{ position:absolute; top:1.25rem; left:1.25rem; z-index:2; }
.dsb-feature-body{ padding:2rem; display:flex; flex-direction:column; }
@media (min-width:640px){ .dsb-feature-body{ padding:2.5rem; } }
.dsb-feature-body h2{ margin:1rem 0 0; font-size:1.55rem; line-height:1.3; font-weight:800; letter-spacing:-.02em; color:var(--ink); }
@media (min-width:640px){ .dsb-feature-body h2{ font-size:1.9rem; } }
.dsb-feature-body p{ margin:.8rem 0 0; line-height:1.65; color:var(--muted); }
.dsb-feature-foot{ margin-top:auto; padding-top:1.6rem; display:flex; align-items:center; gap:.8rem; flex-wrap:wrap; }
.dsb-avatar{ width:44px; height:44px; border-radius:999px; flex:none; display:flex; align-items:center; justify-content:center; color:#fff; font-weight:800; font-size:.85rem; background:linear-gradient(135deg,#6366f1,#a855f7); overflow:hidden; }
.dsb-avatar img{ width:100%; height:100%; object-fit:cover; }
.dsb-byline{ line-height:1.35; min-width:0; }
.dsb-byline strong{ display:block; font-size:.875rem; color:var(--ink); }
.dsb-byline span{ font-size:.75rem; color:var(--muted); }
.dsb-feature-side{ display:grid; gap:1.25rem; margin-top:1.25rem; }
@media (min-width:1024px){ .dsb-feature-side{ grid-template-columns:1fr 1fr; } }
.dsb-subpost{ display:flex; gap:1.1rem; padding:1.1rem; align-items:stretch; transition:transform .22s ease, box-shadow .22s ease; }
.dsb-subpost:hover{ transform:translateY(-3px); box-shadow:0 26px 48px -20px rgba(76,64,180,.28); }
.dsb-subpost-img{ position:relative; width:132px; flex:none; border-radius:18px; overflow:hidden; background:linear-gradient(120deg,#ddd6fe,#fbcfe8); min-height:118px; }
.dsb-subpost-img img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.dsb-subpost-body{ min-width:0; display:flex; flex-direction:column; }
.dsb-subpost-body h3{ margin:.55rem 0 0; font-size:1rem; line-height:1.4; font-weight:800; color:var(--ink); }
.dsb-subpost-body p{ margin:.4rem 0 0; font-size:.85rem; line-height:1.55; color:var(--muted); }
.dsb-subpost-meta{ margin-top:auto; padding-top:.6rem; font-size:.75rem; font-weight:600; color:var(--muted); display:flex; gap:.9rem; flex-wrap:wrap; }

/* ---------- Section head ---------- */
.dsb-sec-head{ display:flex; align-items:center; gap:.9rem; margin-bottom:1.4rem; }
.dsb-sec-dot{ width:11px; height:11px; border-radius:99px; background:#12b76a; box-shadow:0 0 0 5px rgba(18,183,106,.16); flex:none; }
.dsb-sec-head h2, .dsb-sec-head h3{ font-size:1.45rem; font-weight:800; letter-spacing:-.02em; color:var(--ink); margin:0; white-space:nowrap; }
.dsb-sec-line{ flex:1 1 auto; height:1px; background:var(--ds-line); }

/* ---------- Post cards ---------- */
.dsb-grid{ display:grid; gap:1.25rem; grid-template-columns:1fr; }
@media (min-width:640px){ .dsb-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
.dsb-grid-3{ }
@media (min-width:1024px){ .dsb-grid-3{ grid-template-columns:repeat(3,minmax(0,1fr)); } }
.dsb-card{ display:flex; flex-direction:column; overflow:hidden; color:var(--ink); transition:transform .22s ease, box-shadow .22s ease; }
.dsb-card:hover{ transform:translateY(-4px); box-shadow:0 30px 55px -20px rgba(76,64,180,.3); }
.dsb-card-img{ position:relative; height:180px; flex:none; overflow:hidden; background:linear-gradient(120deg,#e6e2ff,#dcf0ff); }
.dsb-card-img img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .6s cubic-bezier(.16,1,.3,1); }
.dsb-card:hover .dsb-card-img img{ transform:scale(1.05); }
.dsb-time{ position:absolute; top:.8rem; right:.8rem; display:inline-flex; align-items:center; gap:.32rem; padding:.28rem .65rem; border-radius:999px; font-size:.7rem; font-weight:800; background:var(--float-bg); color:var(--ink); box-shadow:0 6px 16px -6px rgba(11,15,25,.35); }
.dsb-card-body{ padding:1.4rem 1.5rem 1.5rem; display:flex; flex-direction:column; flex:1 1 auto; }
.dsb-card-meta{ display:flex; align-items:center; justify-content:space-between; gap:.6rem; flex-wrap:wrap; }
.dsb-card-date{ font-size:.78rem; font-weight:600; color:var(--muted); display:inline-flex; align-items:center; gap:.35rem; }
.dsb-card-title{ margin:.8rem 0 0; font-size:1.12rem; line-height:1.38; font-weight:800; letter-spacing:-.01em; color:var(--ink); }
.dsb-card-ex{ margin:.55rem 0 0; font-size:.9rem; line-height:1.6; color:var(--muted); }
.dsb-card-foot{ margin-top:auto; padding-top:1.1rem; display:flex; align-items:center; justify-content:space-between; gap:.6rem; }
.dsb-author-label{ font-size:.8rem; font-weight:700; color:var(--muted); display:inline-flex; align-items:center; gap:.45rem; min-width:0; }
.dsb-author-label i{ color:#d97706; }
html[data-theme="dark"] .dsb-author-label i{ color:#fcd34d; }
.dsb-read{ font-size:.85rem; font-weight:800; color:#4f46e5; display:inline-flex; align-items:center; gap:.4rem; white-space:nowrap; }
html[data-theme="dark"] .dsb-read{ color:#a5b4fc; }
.dsb-read i{ transition:transform .18s ease; }
.dsb-card:hover .dsb-read i, .dsb-subpost:hover .dsb-read i{ transform:translateX(3px); }

/* ---------- Pagination (skins the preserved bootstrap-4 view) ---------- */
.dsb-pager{ margin-top:2.75rem; display:flex; justify-content:center; }
.dsb-pager .pagination{ display:flex; flex-wrap:wrap; justify-content:center; gap:.5rem; list-style:none; margin:0; padding:0; }
.dsb-pager .page-item{ display:flex; }
.dsb-pager .page-link{ min-width:46px; min-height:46px; padding:.5rem .85rem; border-radius:999px; font-weight:700; font-size:.9rem; background:rgba(255,255,255,.8); border:1px solid var(--ds-line); color:var(--ink); display:inline-flex; align-items:center; justify-content:center; text-decoration:none; transition:background .18s ease, transform .18s ease; box-shadow:none; }
.dsb-pager .page-link:hover{ background:#fff; transform:translateY(-1px); color:var(--ink); }
.dsb-pager .page-item.active .page-link{ background:#0b0f19; color:#fff; border-color:#0b0f19; }
.dsb-pager .page-item.disabled .page-link{ opacity:.45; pointer-events:none; }
html[data-theme="dark"] .dsb-pager .page-link{ background:rgba(21,27,43,.8); }
html[data-theme="dark"] .dsb-pager .page-link:hover{ background:rgba(33,42,63,.95); color:var(--ink); }
html[data-theme="dark"] .dsb-pager .page-item.active .page-link{ background:#fff; color:#0b0f19; border-color:#fff; }

/* ---------- Ad shells (ad() output renders inside; slots preserved) ---------- */
.dsb-ad{ border:1.5px dashed #b9c1d6; background:rgba(255,255,255,.45); border-radius:22px; padding:1rem; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.35rem; color:#7c86a0; text-align:center; min-height:120px; overflow:hidden; }
.dsb-ad-cap{ font-size:.62rem; letter-spacing:.28em; font-weight:700; text-transform:uppercase; }
.dsb-ad-side{ min-height:280px; }
html[data-theme="dark"] .dsb-ad{ background:rgba(21,27,43,.5); border-color:rgba(255,255,255,.25); color:var(--muted); }
/* In-article ad cards (post body flow) */
.dsb-adcard{ border:1px solid var(--ds-line); background:rgba(255,255,255,.55); border-radius:22px; padding:1rem 1rem 1.1rem; margin:2rem 0; text-align:center; overflow:hidden; }
html[data-theme="dark"] .dsb-adcard{ background:rgba(21,27,43,.55); }
.dsb-adcard-head{ display:flex; align-items:center; justify-content:center; gap:.45rem; font-size:.62rem; letter-spacing:.28em; font-weight:700; text-transform:uppercase; color:#7c86a0; margin-bottom:.6rem; }
.pulse-dot{ width:7px; height:7px; border-radius:99px; background:#12b76a; box-shadow:0 0 0 0 rgba(18,183,106,.5); animation:pulse 1.8s infinite; }
@keyframes pulse{ 0%{ box-shadow:0 0 0 0 rgba(18,183,106,.45); } 70%{ box-shadow:0 0 0 7px rgba(18,183,106,0); } 100%{ box-shadow:0 0 0 0 rgba(18,183,106,0); } }
.dsb-adcard-body{ display:flex; justify-content:center; }
.dsb-adcard-body > *{ max-width:100%; }

/* ---------- Sidebar widgets ---------- */
.dsb-widget{ padding:1.5rem; }
.dsb-wtitle{ font-size:.82rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:var(--ink); margin:0 0 1.1rem; padding-bottom:.7rem; border-bottom:1px solid var(--ds-line); display:flex; align-items:center; gap:.5rem; }
.dsb-searchbox{ position:relative; }
.dsb-search-row{ display:flex; align-items:center; gap:.4rem; border:1.5px solid var(--ds-line); border-radius:999px; padding:.3rem .3rem .3rem 1rem; background:rgba(255,255,255,.9); transition:border-color .18s ease, box-shadow .18s ease; }
.dsb-search-row:focus-within{ border-color:rgba(99,102,241,.55); box-shadow:0 0 0 3px rgba(99,102,241,.18); }
.dsb-search-row > i{ color:#8a93a8; font-size:.9rem; flex:none; }
.dsb-search-row input{ flex:1 1 auto; min-width:0; border:0; background:transparent; min-height:40px; font-size:.92rem; font-weight:500; color:var(--ink) !important; -webkit-text-fill-color:var(--ink); caret-color:var(--ink); }
.dsb-search-row input:focus{ outline:none; }
.dsb-search-go{ flex:none; min-height:40px; padding:.45rem 1.05rem; border-radius:999px; border:0; background:#0b0f19; color:#fff; font-weight:700; font-size:.85rem; cursor:pointer; transition:background .18s ease, transform .18s ease; }
.dsb-search-go:hover{ background:#1a2138; }
.dsb-search-go:active{ transform:scale(.97); background:#1a2138; color:#fff; }
html[data-theme="dark"] .dsb-search-row{ background:rgba(13,18,30,.9); }
html[data-theme="dark"] .dsb-search-go{ background:#fff; color:#0b0f19; }
html[data-theme="dark"] .dsb-search-go:hover, html[data-theme="dark"] .dsb-search-go:active{ background:#eef1f8; color:#0b0f19; }
.tm-search-hints{ display:flex; flex-wrap:wrap; gap:.4rem; margin-top:.8rem; }
.tm-search-hints span{ font-size:.72rem; font-weight:700; padding:.28rem .65rem; border-radius:999px; background:var(--hover-fill); color:var(--muted); cursor:pointer; transition:background .18s ease, color .18s ease; }
.tm-search-hints span:hover{ color:var(--ink); }
#tmSearchResults{ display:none; position:absolute; left:0; right:0; top:calc(100% + .5rem); z-index:60; background:var(--float-bg); -webkit-backdrop-filter:blur(18px) saturate(1.5); backdrop-filter:blur(18px) saturate(1.5); border:1px solid var(--ds-line); border-radius:20px; box-shadow:0 24px 50px -18px rgba(76,64,180,.3); overflow:hidden; padding:.4rem; }
#tmSearchResults a{ display:block; padding:.65rem .8rem; border-radius:13px; font-size:.88rem; font-weight:600; color:var(--ink); line-height:1.45; }
#tmSearchResults a:hover{ background:var(--hover-fill); }
#tmSearchResults mark{ background:#ffe8cf; color:inherit; border-radius:4px; padding:0 .15em; }
html[data-theme="dark"] #tmSearchResults mark{ background:rgba(251,191,36,.35); }
.dsb-no-results{ padding:1rem; text-align:center; color:var(--muted); font-size:.83rem; }
.dsb-cloud{ display:flex; flex-wrap:wrap; gap:.45rem; }
.dsb-cloud a{ display:inline-flex; align-items:center; min-height:38px; padding:.4rem .85rem; border-radius:999px; font-size:.8rem; font-weight:700; background:rgba(255,255,255,.75); border:1px solid var(--ds-line); color:var(--ink); transition:background .18s ease, transform .18s ease; }
.dsb-cloud a:hover{ background:#fff; transform:translateY(-1px); }
html[data-theme="dark"] .dsb-cloud a{ background:rgba(21,27,43,.75); }
html[data-theme="dark"] .dsb-cloud a:hover{ background:rgba(33,42,63,.95); }
.dsb-pop{ display:flex; flex-direction:column; }
.dsb-pop-item{ display:flex; gap:.85rem; align-items:flex-start; padding:.7rem 0; border-bottom:1px solid var(--ds-line); color:var(--ink); }
.dsb-pop-item:last-child{ border-bottom:0; padding-bottom:0; }
.dsb-pop-item:first-child{ padding-top:0; }
.dsb-pop-img{ position:relative; width:62px; height:62px; flex:none; border-radius:16px; overflow:hidden; background:linear-gradient(120deg,#e6e2ff,#ffe8cf); }
.dsb-pop-img img{ width:100%; height:100%; object-fit:cover; display:block; }
.dsb-pop-num{ position:absolute; left:0; bottom:0; min-width:20px; height:20px; padding:0 .3rem; display:flex; align-items:center; justify-content:center; font-size:.68rem; font-weight:800; background:#0b0f19; color:#fff; border-radius:0 10px 0 0; }
.dsb-pop-info{ min-width:0; }
.dsb-pop-info h6{ margin:0; font-size:.88rem; line-height:1.4; font-weight:700; color:var(--ink); }
.dsb-pop-info time{ font-size:.72rem; font-weight:600; color:var(--muted); display:inline-flex; align-items:center; gap:.3rem; margin-top:.25rem; }
.dsb-trust{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:1rem; }
.dsb-trust li{ display:flex; gap:.85rem; align-items:flex-start; }
.dsb-trust .dsb-tile{ margin-top:.1rem; }
.dsb-trust strong{ display:block; font-size:.9rem; color:var(--ink); }
.dsb-trust span{ font-size:.8rem; color:var(--muted); }
.dsb-tile{ width:44px; height:44px; border-radius:14px; flex:none; display:flex; align-items:center; justify-content:center; font-size:1rem; }
.dsb-tile-mint{ background:#d7f6e6; color:#067647; } .dsb-tile-lav{ background:#e6e2ff; color:#4338ca; }
.dsb-tile-peach{ background:#ffe8cf; color:#9a4a00; } .dsb-tile-sky{ background:#dcf0ff; color:#075e9e; }
.dsb-tile-rose{ background:#ffe0ec; color:#b4235f; }
html[data-theme="dark"] .dsb-tile-mint{ background:rgba(52,211,153,.15); color:#6ee7b7; }
html[data-theme="dark"] .dsb-tile-lav{ background:rgba(165,180,252,.15); color:#a5b4fc; }
html[data-theme="dark"] .dsb-tile-peach{ background:rgba(253,186,116,.15); color:#fdba74; }
html[data-theme="dark"] .dsb-tile-sky{ background:rgba(125,211,252,.15); color:#7dd3fc; }
html[data-theme="dark"] .dsb-tile-rose{ background:rgba(249,168,212,.15); color:#f9a8d4; }
/* VIP promo widget */
.dsb-vip{ position:relative; overflow:hidden; text-align:center; padding:2rem 1.5rem 1.6rem; background:linear-gradient(150deg,rgba(255,248,235,.92),rgba(255,255,255,.75)); }
html[data-theme="dark"] .dsb-vip{ background:linear-gradient(150deg,rgba(66,32,6,.5),rgba(21,27,43,.85)); }
.dsb-vip-badge{ position:absolute; top:0; left:0; display:inline-flex; align-items:center; gap:.35rem; padding:.35rem .85rem; border-radius:0 0 14px 0; font-size:.66rem; font-weight:800; letter-spacing:.07em; text-transform:uppercase; background:linear-gradient(135deg,#f59e0b,#ea580c); color:#fff; }
.dsb-vip .dsb-tile{ margin:0 auto; width:52px; height:52px; border-radius:17px; font-size:1.2rem; }
.dsb-vip h4{ margin:1rem 0 0; font-size:1.08rem; font-weight:800; line-height:1.4; color:var(--ink); }
.dsb-vip p{ margin:.6rem 0 0; font-size:.86rem; line-height:1.6; color:var(--muted); }
.dsb-vip-list{ list-style:none; margin:1.05rem 0 1.25rem; padding:0; text-align:left; display:flex; flex-direction:column; gap:.5rem; }
.dsb-vip-list li{ display:flex; align-items:center; gap:.55rem; font-size:.86rem; font-weight:600; color:var(--ink); }
.dsb-btn-gold{ display:inline-flex; align-items:center; justify-content:center; gap:.5rem; width:100%; min-height:48px; padding:.65rem 1.35rem; border-radius:999px; border:0; font-weight:800; font-size:.92rem; background:linear-gradient(135deg,#f59e0b,#ea580c); color:#fff !important; -webkit-text-fill-color:#fff; box-shadow:0 12px 24px -10px rgba(234,88,12,.55); transition:transform .18s ease, filter .18s ease; cursor:pointer; }
.dsb-btn-gold:hover{ filter:brightness(1.07); transform:translateY(-1px); color:#fff; }
.dsb-btn-gold:active{ transform:scale(.98); filter:brightness(.96); color:#fff; }
/* Dark CTA widget (temp-mail generator) */
.dsb-cta{ border-radius:26px; padding:1.9rem 1.5rem; text-align:center; color:#fff; background:linear-gradient(120deg,#0b0f19,#312e81); box-shadow:0 24px 50px -20px rgba(30,27,75,.55); }
.dsb-cta .dsb-tile{ margin:0 auto; background:rgba(255,255,255,.13); color:#fff; width:52px; height:52px; border-radius:17px; font-size:1.2rem; }
.dsb-cta h5{ margin:1rem 0 0; font-size:1.12rem; font-weight:800; }
.dsb-cta p{ margin:.55rem 0 1.3rem; font-size:.88rem; line-height:1.6; color:#c7d2fe; }
.dsb-cta .btn{ width:100%; }

/* ---------- Fields (dark-mode form rule: explicit colors always) ---------- */
.dsb-field{ color:#0c1222; -webkit-text-fill-color:#0c1222; caret-color:#0c1222; color-scheme:light; background:rgba(255,255,255,.92); border:1.5px solid var(--ds-line); border-radius:18px; padding:.85rem 1.05rem; font-size:.95rem; line-height:1.55; width:100%; transition:border-color .18s ease, box-shadow .18s ease; }
.dsb-field::placeholder{ color:#8a93a8; -webkit-text-fill-color:#8a93a8; }
.dsb-field:focus{ outline:none; border-color:rgba(99,102,241,.55); box-shadow:0 0 0 3px rgba(99,102,241,.18); }
html[data-theme="dark"] .dsb-field{ color:var(--ink) !important; -webkit-text-fill-color:var(--ink); caret-color:var(--ink); color-scheme:dark; background:rgba(13,18,30,.9); border-color:rgba(255,255,255,.16); }
html[data-theme="dark"] .dsb-field::placeholder{ color:#8a93a8; -webkit-text-fill-color:#8a93a8; }

/* ---------- Post: progress, crumbs, article ---------- */
.dsb-progress{ position:fixed; top:0; left:0; width:100%; height:4px; z-index:2000; background:transparent; }
.dsb-progress-bar{ height:4px; width:0%; background:linear-gradient(90deg,#0ea5a4,#4f46e5); transition:width .1s linear; }
.dsb-crumbs-row{ display:flex; align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap; margin-bottom:1.4rem; }
.dsb-crumbs{ display:flex; align-items:center; gap:.55rem; flex-wrap:wrap; font-size:.87rem; font-weight:600; color:var(--muted); min-width:0; }
.dsb-crumbs a{ color:var(--muted); display:inline-flex; align-items:center; gap:.4rem; transition:color .18s ease; }
.dsb-crumbs a:hover{ color:var(--ink); }
.dsb-crumbs .dsb-sep{ opacity:.55; font-size:.7rem; }
.dsb-crumbs .dsb-current{ color:var(--ink); font-weight:700; }
.dsb-article{ overflow:hidden; }
.dsb-hero-img{ position:relative; margin:0; max-height:480px; overflow:hidden; background:linear-gradient(130deg,#a7f3d0,#bae6fd 55%,#ddd6fe); }
.dsb-hero-img img{ width:100%; height:100%; max-height:480px; object-fit:cover; display:block; }
.dsb-article-inner{ padding:2rem 1.5rem 2.4rem; }
@media (min-width:640px){ .dsb-article-inner{ padding:2.6rem 2.75rem 2.8rem; } }
.dsb-title{ margin:0; font-size:2rem; line-height:1.18; font-weight:800; letter-spacing:-.025em; color:var(--ink); }
@media (min-width:640px){ .dsb-title{ font-size:2.55rem; } }
/* E-E-A-T box */
.dsb-eeat{ margin-top:1.5rem; display:flex; align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap; padding:1rem 1.15rem; border-radius:20px; }
.dsb-eeat-who{ display:flex; align-items:center; gap:.85rem; min-width:0; }
.dsb-eeat-who img{ width:46px; height:46px; border-radius:999px; object-fit:cover; flex:none; }
.dsb-eeat-name{ display:block; font-size:.88rem; color:var(--muted); }
.dsb-eeat-name strong a{ color:var(--ink); font-weight:800; }
.dsb-eeat-role{ display:block; font-size:.76rem; color:var(--muted); }
.dsb-eeat-badges{ display:flex; gap:.45rem; flex-wrap:wrap; }
/* Share strip */
.dsb-share{ margin-top:1.15rem; display:flex; align-items:center; gap:.8rem; flex-wrap:wrap; }
.dsb-share-text{ font-size:.85rem; font-weight:700; color:var(--muted); }
.dsb-share-btns{ display:flex; gap:.5rem; flex-wrap:wrap; }
.dsb-share-btn{ width:44px; height:44px; border-radius:999px; border:1px solid var(--ds-line); background:rgba(255,255,255,.8); color:var(--ink); display:inline-flex; align-items:center; justify-content:center; font-size:.95rem; cursor:pointer; transition:transform .18s ease, background .18s ease, color .18s ease, border-color .18s ease; }
.dsb-share-btn:hover{ transform:translateY(-2px); color:#fff; }
.dsb-share-btn:active{ transform:scale(.95); color:#fff; }
.dsb-share-btn.fb:hover, .dsb-share-btn.fb:active{ background:#1877f2; border-color:#1877f2; }
.dsb-share-btn.x:hover, .dsb-share-btn.x:active{ background:#0b0f19; border-color:#0b0f19; }
.dsb-share-btn.in:hover, .dsb-share-btn.in:active{ background:#0a66c2; border-color:#0a66c2; }
.dsb-share-btn.wa:hover, .dsb-share-btn.wa:active{ background:#22a85c; border-color:#22a85c; }
.dsb-share-btn.copy:hover, .dsb-share-btn.copy:active{ background:#4f46e5; border-color:#4f46e5; }
html[data-theme="dark"] .dsb-share-btn{ background:rgba(21,27,43,.85); }
html[data-theme="dark"] .dsb-share-btn.x:hover, html[data-theme="dark"] .dsb-share-btn.x:active{ background:#fff; color:#0b0f19; border-color:#fff; }
/* App banner (id/function hooks preserved in markup) */
.dsb-appbanner{ margin-top:1.5rem; display:flex; align-items:center; gap:1rem; flex-wrap:wrap; padding:1.05rem 1.2rem; border-radius:20px; background:linear-gradient(120deg,#0b0f19,#312e81); color:#fff; }
.dsb-appbanner-icon{ width:46px; height:46px; flex:none; border-radius:15px; background:rgba(255,255,255,.13); display:flex; align-items:center; justify-content:center; font-size:1.1rem; }
.dsb-appbanner-text{ flex:1 1 220px; min-width:0; line-height:1.4; }
.dsb-appbanner-text strong{ display:block; font-size:.95rem; }
.dsb-appbanner-text span{ font-size:.83rem; color:#c7d2fe; }
.dsb-appbanner-close{ margin-left:auto; flex:none; width:38px; height:38px; border-radius:999px; border:0; background:rgba(255,255,255,.12); color:#fff; font-size:1.15rem; line-height:1; cursor:pointer; transition:background .18s ease, transform .18s ease; }
.dsb-appbanner-close:hover{ background:rgba(255,255,255,.22); }
.dsb-appbanner-close:active{ transform:scale(.94); background:rgba(255,255,255,.22); color:#fff; }

/* ---------- TOC (class names are JS hooks: toggleTOC queries them) ---------- */
.tmu-toc-card{ background:rgba(255,255,255,.65); border:1px solid var(--ds-line); border-left:4px solid #4f46e5; border-radius:20px; padding:1.25rem 1.4rem; margin:1.6rem 0 2rem; box-shadow:0 10px 26px -14px rgba(76,64,180,.18); }
html[data-theme="dark"] .tmu-toc-card{ background:rgba(21,27,43,.7); }
.tmu-toc-header{ display:flex; align-items:center; justify-content:space-between; gap:1rem; cursor:pointer; }
.tmu-toc-title{ display:flex; align-items:center; gap:.65rem; font-size:.92rem; font-weight:800; letter-spacing:.05em; text-transform:uppercase; color:var(--ink); }
.tmu-toc-title-badge{ width:30px; height:30px; border-radius:10px; background:#e6e2ff; color:#4338ca; display:grid; place-items:center; font-size:.8rem; flex:none; }
html[data-theme="dark"] .tmu-toc-title-badge{ background:rgba(165,180,252,.16); color:#a5b4fc; }
.tmu-toc-toggle{ display:inline-flex; align-items:center; gap:.35rem; min-height:34px; padding:.3rem .85rem; border-radius:999px; border:1px solid var(--ds-line); background:rgba(255,255,255,.7); font-size:.75rem; font-weight:800; color:var(--muted); cursor:pointer; transition:background .18s ease, color .18s ease; }
.tmu-toc-toggle:hover{ color:var(--ink); }
.tmu-toc-toggle:active{ background:var(--hover-fill); color:var(--muted); }
html[data-theme="dark"] .tmu-toc-toggle{ background:rgba(21,27,43,.8); }
.toc-chevron{ transition:transform .2s ease; }
.tmu-toc-content{ margin-top:1rem; transition:opacity .25s ease; }
.tmu-toc-list{ display:flex; flex-direction:column; gap:.3rem; }
.tmu-toc-item{ display:block; }
.tmu-toc-link .tmu-toc-submark{ margin-left:.4rem; }
.tmu-toc-link{ display:flex; align-items:center; gap:.65rem; padding:.42rem .6rem; border-radius:11px; font-size:.92rem; font-weight:600; line-height:1.45; color:var(--ink); transition:background .15s ease, color .15s ease; }
.tmu-toc-link:hover{ background:var(--hover-fill); color:#4f46e5; }
html[data-theme="dark"] .tmu-toc-link:hover{ color:#a5b4fc; }
.tmu-toc-link.is-sub{ font-size:.86rem; font-weight:500; color:var(--muted); padding-left:1.1rem; }
.tmu-toc-num{ display:inline-flex; align-items:center; justify-content:center; min-width:23px; height:23px; padding:0 .3rem; border-radius:8px; background:#e6e2ff; color:#4338ca; font-size:.7rem; font-weight:800; flex:none; }
html[data-theme="dark"] .tmu-toc-num{ background:rgba(165,180,252,.16); color:#a5b4fc; }
.tmu-toc-submark{ color:#4f46e5; font-size:.68rem; margin-left:.4rem; flex:none; }
html[data-theme="dark"] .tmu-toc-submark{ color:#a5b4fc; }

/* ---------- PROSE — the article body (readability is the spec) ---------- */
.dsb-prose{ max-width:760px; margin:0 auto; font-size:1.0625rem; line-height:1.8; color:var(--ink); overflow-wrap:break-word; }
.dsb-prose > *:first-child{ margin-top:0 !important; }
.dsb-prose p{ margin:0 0 1.4em; }
.dsb-prose h2{ font-size:1.62rem; line-height:1.3; font-weight:800; letter-spacing:-.015em; margin:2.1em 0 .65em; color:var(--ink); scroll-margin-top:104px; }
.dsb-prose h3{ font-size:1.28rem; line-height:1.35; font-weight:700; margin:1.8em 0 .55em; color:var(--ink); scroll-margin-top:104px; }
.dsb-prose h4{ font-size:1.08rem; font-weight:700; margin:1.6em 0 .5em; color:var(--ink); scroll-margin-top:104px; }
.dsb-prose h5, .dsb-prose h6{ font-size:1rem; font-weight:700; margin:1.5em 0 .5em; color:var(--ink); }
.dsb-prose a{ color:#4f46e5; font-weight:600; text-decoration:underline; text-underline-offset:3px; text-decoration-thickness:1.5px; }
.dsb-prose a:hover{ color:#3730a3; }
html[data-theme="dark"] .dsb-prose a{ color:#a5b4fc; }
html[data-theme="dark"] .dsb-prose a:hover{ color:#c7d2fe; }
.dsb-prose strong{ font-weight:700; }
.dsb-prose ul, .dsb-prose ol{ margin:0 0 1.4em; padding-left:1.45em; }
.dsb-prose li{ margin:.4em 0; }
.dsb-prose li::marker{ color:#4f46e5; font-weight:700; }
html[data-theme="dark"] .dsb-prose li::marker{ color:#a5b4fc; }
.dsb-prose img{ border-radius:20px; box-shadow:0 18px 38px -18px rgba(20,24,60,.28); margin:1.6em auto; max-width:100%; height:auto; }
.dsb-prose figure{ margin:1.8em 0; }
.dsb-prose figure img{ margin:0 auto; }
.dsb-prose figcaption{ margin-top:.7em; text-align:center; font-size:.85rem; color:var(--muted); }
.dsb-prose blockquote{ margin:1.8em 0; padding:1.15em 1.35em; border-radius:18px; border-left:4px solid #4f46e5; background:rgba(255,255,255,.55); font-size:1.02em; line-height:1.7; color:var(--ink); }
html[data-theme="dark"] .dsb-prose blockquote{ background:rgba(21,27,43,.65); }
.dsb-prose blockquote p:last-child{ margin-bottom:0; }
.dsb-prose pre{ position:relative; background:#0b0f19; color:#e6ebf5; border-radius:18px; padding:1.15rem 1.25rem; margin:1.6em 0; overflow-x:auto; font-size:.88rem; line-height:1.65; }
.dsb-prose pre code{ background:transparent; padding:0; font-size:inherit; color:inherit; }
.dsb-prose code{ font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; font-size:.86em; background:rgba(79,70,229,.09); padding:.14em .45em; border-radius:8px; }
html[data-theme="dark"] .dsb-prose code{ background:rgba(165,180,252,.14); }
.copy-code-btn{ position:absolute; top:.65rem; right:.65rem; display:inline-flex; align-items:center; gap:.35rem; min-height:34px; padding:.3rem .75rem; border-radius:999px; border:1px solid rgba(255,255,255,.22); background:rgba(255,255,255,.1); color:#e6ebf5; font-size:.74rem; font-weight:700; cursor:pointer; transition:background .18s ease, transform .18s ease; }
.copy-code-btn:hover{ background:rgba(255,255,255,.2); color:#fff; }
.copy-code-btn:active{ transform:scale(.95); background:rgba(255,255,255,.2); color:#fff; }
.dsb-prose table{ display:block; width:100%; overflow-x:auto; border-collapse:collapse; margin:1.6em 0; font-size:.95em; }
.dsb-prose th, .dsb-prose td{ padding:.75rem 1rem; text-align:left; border-bottom:1px solid var(--ds-line); vertical-align:top; }
.dsb-prose th{ font-weight:800; background:var(--hover-fill); }
.dsb-prose hr{ border:0; border-top:1px solid var(--ds-line); margin:2.4em 0; }
.dsb-prose iframe, .dsb-prose video, .dsb-prose embed{ max-width:100%; border-radius:18px; }
.dsb-prose mark{ background:#ffe8cf; color:inherit; border-radius:4px; padding:0 .15em; }
html[data-theme="dark"] .dsb-prose mark{ background:rgba(251,191,36,.35); }
.dsb-prose .tm-ad-slot{ margin:2em 0; }

/* ---------- Post CTA rows ---------- */
.dsb-cta-row{ margin-top:1.5rem; display:flex; align-items:center; gap:1.1rem; flex-wrap:wrap; padding:1.4rem 1.5rem; border-radius:24px; }
.dsb-cta-row .dsb-tile{ width:52px; height:52px; border-radius:17px; font-size:1.15rem; }
.dsb-cta-text{ flex:1 1 260px; min-width:0; }
.dsb-cta-text h3{ margin:0; font-size:1.12rem; font-weight:800; color:var(--ink); }
.dsb-cta-text p{ margin:.35rem 0 0; font-size:.9rem; line-height:1.6; color:var(--muted); }

/* ---------- Comments (dsb-cx system) ---------- */
.dsb-cx{ margin-top:2.75rem; }
.dsb-cx-head{ display:flex; align-items:center; gap:.7rem; margin-bottom:1.4rem; }
.dsb-cx-head h3{ margin:0; font-size:1.35rem; font-weight:800; letter-spacing:-.01em; color:var(--ink); display:flex; align-items:center; gap:.6rem; }
.dsb-cx-count{ display:inline-flex; align-items:center; justify-content:center; min-width:30px; height:30px; padding:0 .5rem; border-radius:999px; background:#0b0f19; color:#fff; font-size:.82rem; font-weight:800; }
html[data-theme="dark"] .dsb-cx-count{ background:#fff; color:#0b0f19; }
.dsb-cx-formcard{ display:flex; gap:1rem; padding:1.3rem; border-radius:24px; margin-bottom:1.6rem; }
.dsb-cx-avatar{ flex:none; }
.dsb-cx-avatar img{ width:48px; height:48px; border-radius:999px; object-fit:cover; display:block; }
.dsb-cx-avatar-sm img{ width:36px; height:36px; }
.dsb-cx-form{ flex:1 1 auto; min-width:0; }
.dsb-cx-formfoot{ margin-top:.8rem; display:flex; justify-content:flex-end; gap:.5rem; }
.dsb-cx-guest{ text-align:center; padding:2.2rem 1.5rem; border-radius:24px; margin-bottom:1.6rem; }
.dsb-cx-guest .dsb-tile{ margin:0 auto; width:52px; height:52px; border-radius:17px; font-size:1.15rem; }
.dsb-cx-guest h4{ margin:1rem 0 0; font-size:1.1rem; font-weight:800; color:var(--ink); }
.dsb-cx-guest p{ margin:.5rem auto 1.3rem; max-width:26rem; font-size:.9rem; line-height:1.6; color:var(--muted); }
.dsb-cx-list{ display:flex; flex-direction:column; gap:1.1rem; }
.dsb-cx-item{ display:flex; gap:1rem; padding:1.25rem 1.3rem; border-radius:24px; }
.dsb-cx-content{ flex:1 1 auto; min-width:0; }
.dsb-cx-meta{ display:flex; align-items:baseline; gap:.6rem; flex-wrap:wrap; }
.dsb-cx-author{ font-weight:800; font-size:.92rem; color:var(--ink); }
.dsb-cx-time{ font-size:.76rem; font-weight:600; color:var(--muted); }
.dsb-cx-body{ margin-top:.45rem; font-size:.94rem; line-height:1.65; color:var(--ink); overflow-wrap:break-word; }
.dsb-cx-actions{ margin-top:.7rem; }
.dsb-cx-replybtn{ display:inline-flex; align-items:center; gap:.4rem; min-height:38px; padding:.35rem .85rem; border-radius:999px; border:1px solid var(--ds-line); background:rgba(255,255,255,.7); font-size:.8rem; font-weight:700; color:var(--muted); cursor:pointer; transition:background .18s ease, color .18s ease, transform .18s ease; }
.dsb-cx-replybtn:hover{ color:var(--ink); background:#fff; }
.dsb-cx-replybtn:active{ transform:scale(.96); color:var(--ink); }
html[data-theme="dark"] .dsb-cx-replybtn{ background:rgba(21,27,43,.8); }
.dsb-cx-replyform{ margin-top:.9rem; }
.dsb-cx-replies{ margin-top:1rem; display:flex; flex-direction:column; gap:.9rem; }
.dsb-cx-replies .dsb-cx-item{ background:rgba(255,255,255,.45); border:1px solid var(--ds-line); box-shadow:none; padding:1rem 1.1rem; }
html[data-theme="dark"] .dsb-cx-replies .dsb-cx-item{ background:rgba(13,18,30,.5); }
.dsb-cx-empty{ text-align:center; padding:2.4rem 1.5rem; border:1.5px dashed #b9c1d6; border-radius:24px; color:var(--muted); }
html[data-theme="dark"] .dsb-cx-empty{ border-color:rgba(255,255,255,.25); }
.dsb-cx-empty i{ font-size:1.7rem; display:block; margin-bottom:.8rem; }
.dsb-cx-empty p{ margin:0; font-size:.92rem; font-weight:600; }

/* ---------- Listing hero (category / tag / search) ---------- */
.dsb-list-hero{ padding:1.6rem 1.8rem; margin-bottom:2rem; display:flex; align-items:center; gap:1.2rem; flex-wrap:wrap; }
@media (min-width:640px){ .dsb-list-hero{ padding:2rem 2.4rem; } }
.dsb-list-hero .dsb-tile{ width:56px; height:56px; border-radius:19px; font-size:1.25rem; }
.dsb-list-hero-text{ flex:1 1 280px; min-width:0; }
.dsb-list-hero-text h1{ margin:.55rem 0 0; font-size:1.9rem; line-height:1.15; font-weight:800; letter-spacing:-.02em; color:var(--ink); }
.dsb-list-hero-text p{ margin:.5rem 0 0; font-size:.95rem; line-height:1.6; color:var(--muted); max-width:44rem; }
.dsb-search-hero{ padding:2rem 1.8rem; margin-bottom:2.25rem; }
@media (min-width:640px){ .dsb-search-hero{ padding:2.6rem; } }
.dsb-search-hero-top{ display:flex; align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap; margin-bottom:1.5rem; }
.dsb-search-hero-top h1{ margin:0; font-size:1.7rem; font-weight:800; letter-spacing:-.02em; color:var(--ink); }
.dsb-search-hero-top h1 span{ color:#4f46e5; }
html[data-theme="dark"] .dsb-search-hero-top h1 span{ color:#a5b4fc; }
.dsb-search-big{ display:flex; align-items:center; gap:.5rem; border:1.5px solid var(--ds-line); border-radius:999px; padding:.35rem .35rem .35rem 1.3rem; background:rgba(255,255,255,.92); transition:border-color .18s ease, box-shadow .18s ease; }
.dsb-search-big:focus-within{ border-color:rgba(99,102,241,.55); box-shadow:0 0 0 3px rgba(99,102,241,.18); }
.dsb-search-big > i{ color:#8a93a8; font-size:1.05rem; flex:none; }
.dsb-search-big input{ flex:1 1 auto; min-width:0; border:0; background:transparent; min-height:48px; font-size:1rem; font-weight:500; color:var(--ink) !important; -webkit-text-fill-color:var(--ink); caret-color:var(--ink); }
.dsb-search-big input:focus{ outline:none; }
html[data-theme="dark"] .dsb-search-big{ background:rgba(13,18,30,.9); }
.dsb-grid mark{ background:#ffe8cf; color:inherit; border-radius:4px; padding:0 .12em; }
html[data-theme="dark"] .dsb-grid mark{ background:rgba(251,191,36,.35); }

/* ---------- Author page ---------- */
.dsb-author-hero{ display:flex; gap:2rem; align-items:flex-start; flex-wrap:wrap; padding:2.4rem; margin-bottom:2.6rem; position:relative; overflow:hidden; }
.dsb-author-hero::before{ content:''; position:absolute; top:0; left:0; right:0; height:5px; background:linear-gradient(90deg,#0ea5a4,#4f46e5,#a855f7); }
.dsb-author-avatar{ position:relative; flex:none; }
.dsb-author-avatar img{ width:150px; height:150px; border-radius:999px; object-fit:cover; display:block; border:4px solid rgba(255,255,255,.9); box-shadow:0 18px 36px -14px rgba(76,64,180,.4); }
html[data-theme="dark"] .dsb-author-avatar img{ border-color:rgba(255,255,255,.16); }
.dsb-author-verified{ position:absolute; right:4px; bottom:8px; width:38px; height:38px; border-radius:999px; background:#12b76a; color:#fff; display:flex; align-items:center; justify-content:center; font-size:.85rem; border:3px solid #fff; }
html[data-theme="dark"] .dsb-author-verified{ border-color:#131a2c; }
.dsb-author-info{ flex:1 1 300px; min-width:0; }
.dsb-author-info h1{ margin:0; font-size:2.1rem; line-height:1.15; font-weight:800; letter-spacing:-.02em; color:var(--ink); }
.dsb-author-role{ display:inline-flex; margin-top:.7rem; }
.dsb-author-bio{ margin:1rem 0 0; font-size:.98rem; line-height:1.7; color:var(--muted); max-width:46rem; }
.dsb-author-tags{ margin-top:1.1rem; display:flex; flex-wrap:wrap; gap:.45rem; }
.dsb-author-sub{ margin:-.4rem 0 1.8rem; font-size:.93rem; color:var(--muted); }
.dsb-author-stats{ margin-top:1.4rem; display:flex; flex-wrap:wrap; gap:1.4rem; }
.dsb-author-stat{ display:inline-flex; align-items:center; gap:.5rem; font-size:.88rem; font-weight:600; color:var(--muted); }
.dsb-author-stat strong{ color:var(--ink); font-weight:800; }
.dsb-author-stat i{ color:#4f46e5; }
html[data-theme="dark"] .dsb-author-stat i{ color:#a5b4fc; }

/* ---------- Empty states (Gold Standard: state + CTA) ---------- */
.dsb-empty{ text-align:center; padding:3rem 1.6rem; border:1.5px dashed #b9c1d6; border-radius:26px; background:rgba(255,255,255,.45); }
html[data-theme="dark"] .dsb-empty{ background:rgba(21,27,43,.5); border-color:rgba(255,255,255,.25); }
.dsb-empty .dsb-tile{ margin:0 auto; width:56px; height:56px; border-radius:19px; font-size:1.3rem; }
.dsb-empty h3{ margin:1.15rem 0 0; font-size:1.3rem; font-weight:800; color:var(--ink); }
.dsb-empty p{ margin:.6rem auto 0; max-width:28rem; font-size:.93rem; line-height:1.65; color:var(--muted); }
.dsb-empty .btn{ margin-top:1.4rem; }
.dsb-empty-label{ display:block; margin-top:1.4rem; font-size:.74rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:var(--muted); }
.dsb-empty-btns{ display:flex; gap:.6rem; justify-content:center; flex-wrap:wrap; margin-top:1.4rem; }
.dsb-empty-btns .btn{ margin-top:0; }

/* ---------- Scams directory (Bootstrap accordion, DS-skinned) ---------- */
.dsb-scams-hero{ text-align:center; padding:.5rem 0 2.4rem; }
.dsb-scams-hero h1{ margin:1.1rem auto 0; max-width:46rem; font-size:2.1rem; line-height:1.16; font-weight:800; letter-spacing:-.025em; color:var(--ink); }
@media (min-width:640px){ .dsb-scams-hero h1{ font-size:2.6rem; } }
.dsb-scams-hero p{ margin:1rem auto 0; max-width:40rem; font-size:1.02rem; line-height:1.65; color:var(--muted); }
.dsb-scams{ max-width:56rem; margin:0 auto; border-radius:26px; overflow:hidden; }
.dsb-scams .accordion-item{ background:transparent; border:0; border-bottom:1px solid var(--ds-line); }
.dsb-scams .accordion-item:last-child{ border-bottom:0; }
.dsb-scams .accordion-button{ background:transparent; color:var(--ink); font-weight:700; font-size:.98rem; padding:1.15rem 1.4rem; box-shadow:none !important; min-height:56px; }
.dsb-scams .accordion-button:not(.collapsed){ background:var(--hover-fill); color:var(--ink); }
.dsb-scams .accordion-button::after{ filter:none; }
html[data-theme="dark"] .dsb-scams .accordion-button::after{ filter:invert(1); }
.dsb-scams .accordion-body{ padding:1.15rem 1.4rem 1.35rem; background:rgba(255,255,255,.4); color:var(--muted); line-height:1.65; font-size:.93rem; }
html[data-theme="dark"] .dsb-scams .accordion-body{ background:rgba(13,18,30,.45); }
.dsb-scams .accordion-body strong{ color:var(--ink); }
.dsb-scam-row{ display:flex; align-items:center; justify-content:space-between; gap:1rem; width:100%; margin-right:.75rem; }
.dsb-scam-main{ display:flex; align-items:center; gap:.8rem; min-width:0; flex-wrap:wrap; }
.dsb-scam-note{ margin-bottom:0; font-size:.85rem; }
.dsb-scam-note i{ color:#d97706; margin-right:.35rem; }
.dsb-scams .accordion-body p{ margin:0 0 .55rem; }
.dsb-scams .accordion-body p:last-child{ margin-bottom:0; }
@media (max-width:767px){ .dsb-scam-title{ display:none; } }
.dsb-scam-badge{ display:inline-flex; align-items:center; padding:.3rem .7rem; border-radius:999px; font-size:.7rem; font-weight:800; letter-spacing:.04em; text-transform:uppercase; color:#fff; white-space:nowrap; }
.dsb-scam-brand{ font-weight:800; color:var(--ink); }
.dsb-scam-title{ color:var(--muted); font-size:.88rem; font-weight:500; }
.dsb-scam-time{ color:var(--muted); font-size:.8rem; font-weight:600; white-space:nowrap; }

/* ---------- Motion: one curve, reduced-motion respected ---------- */
.dsb-card, .dsb-subpost, .dsb-pill, .dsb-cloud a, .dsb-share-btn, .dsb-search-go, .tmu-toc-toggle{ transition-timing-function:cubic-bezier(.16,1,.3,1); }
@media (prefers-reduced-motion: reduce){
  .dsb-main *, .dsb-main *::before, .dsb-main *::after{ transition:none !important; animation:none !important; }
  .dsb-progress-bar{ transition:none !important; }
  html{ scroll-behavior:auto; }
}

/* ══ visualfix1 (2026-10-23): VIP promo card — old cream/orange dress removed.
   The card now wears the blog DS premium language: the same deep ink→indigo
   family as .dsb-cta and the homepage Lifetime card. Markup/classes and all
   content/links are unchanged; only these rules are overridden. ══ */
.dsb-vip{ background:linear-gradient(140deg,#0b0f19,#312e81); color:#fff; border:1px solid rgba(255,255,255,.14); box-shadow:0 24px 50px -20px rgba(30,27,75,.55); }
html[data-theme="dark"] .dsb-vip{ background:linear-gradient(140deg,#0b0f19,#312e81); }
.dsb-vip-badge{ background:rgba(255,255,255,.13); color:#fcd34d; border-right:1px solid rgba(255,255,255,.22); border-bottom:1px solid rgba(255,255,255,.22); }
.dsb-vip .dsb-tile-peach{ background:rgba(255,255,255,.13); color:#fcd34d; }
.dsb-vip h4{ color:#fff; }
.dsb-vip p{ color:#c7d2fe; }
.dsb-vip-list li{ color:#eef2ff; }
.dsb-vip-list .ck{ display:inline-flex; align-items:center; justify-content:center; width:20px; height:20px; flex:none; border-radius:999px; background:rgba(52,211,153,.18); color:#6ee7b7; font-size:.62rem; }
.dsb-btn-gold{ background:#fff; color:#0b0f19 !important; -webkit-text-fill-color:#0b0f19; box-shadow:0 14px 28px -12px rgba(2,6,23,.55); }
.dsb-btn-gold:hover{ filter:brightness(.95); color:#0b0f19; }
.dsb-btn-gold:active{ filter:brightness(.9); color:#0b0f19; }
