/* ChainRanker - DefiLlama-inspired dashboard */
*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;padding:0}
:root{
  --bg:#0d1117; --bg-2:#11161d; --bg-3:#161c24;
  --line:#1f2731; --line-2:#273040;
  --fg:#e6edf3; --fg-muted:#8b949e; --fg-dim:#6b7280;
  --accent:#2172e5; --accent-2:#3b82f6; --accent-soft:rgba(33,114,229,.14);
  --up:#16c784; --dn:#ea3943;
  --pill:#1a2332;
  --mono:ui-monospace,'SFMono-Regular',Menlo,Consolas,'Roboto Mono','PingFang SC',monospace;
  --sans:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue','PingFang SC','Microsoft YaHei',Arial,sans-serif;
}
body{background:var(--bg);color:var(--fg);font-family:var(--sans);font-size:14px;line-height:1.6;min-height:100vh}
a{color:var(--accent-2);text-decoration:none}
a:hover{color:#60a5fa}
img{max-width:100%;display:block}
h1,h2,h3,h4{margin:0;color:var(--fg);font-weight:700;line-height:1.3}
p{margin:0 0 12px}
button{font-family:inherit}

/* ============== TOPBAR ============== */
.topbar{position:sticky;top:0;z-index:40;background:rgba(13,17,23,.92);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.topbar__inner{display:flex;align-items:center;gap:16px;padding:10px 20px;max-width:1600px;margin:0 auto}
.topbar__menu{display:none;background:none;border:0;color:var(--fg);cursor:pointer;padding:6px}
.topbar__brand{display:flex;align-items:center;gap:10px;color:var(--fg);flex-shrink:0}
.brand-mark{display:inline-flex}
.brand-name{font-size:17px;font-weight:800;letter-spacing:-0.2px}
.brand-sub{font-size:10px;color:var(--fg-dim);letter-spacing:1px;font-weight:600;border-left:1px solid var(--line-2);padding-left:10px;margin-left:2px}
.topbar__spacer{flex:1}
.topbar__ticker{display:flex;gap:18px;align-items:center;font-family:var(--mono);font-size:12px}
.mini-ticker{color:var(--fg-muted);white-space:nowrap}
.mini-ticker b{color:var(--fg);font-weight:700;margin-right:4px}
.mini-ticker em{font-style:normal;margin-left:4px;font-weight:600}
.mini-ticker em.up{color:var(--up)}
.mini-ticker em.dn{color:var(--dn)}
.topbar__actions{display:flex;gap:8px;flex-shrink:0}
.btn-pill{display:inline-flex;align-items:center;padding:7px 14px;border-radius:999px;font-size:13px;font-weight:600;white-space:nowrap;cursor:pointer;border:1px solid transparent;transition:transform .15s,background .15s}
.btn-pill--primary{background:var(--accent);color:#fff}
.btn-pill--primary:hover{background:var(--accent-2);color:#fff;transform:translateY(-1px)}
.btn-pill--ghost{background:transparent;color:var(--fg);border-color:var(--line-2)}
.btn-pill--ghost:hover{background:var(--bg-3);color:var(--fg)}

/* ============== LAYOUT ============== */
.app-body{display:grid;grid-template-columns:240px 1fr;max-width:1600px;margin:0 auto;min-height:calc(100vh - 58px)}
.app-sidebar{border-right:1px solid var(--line);padding:18px 14px 100px;position:sticky;top:58px;align-self:start;max-height:calc(100vh - 58px);overflow-y:auto}
.app-main{padding:22px 26px 120px;min-width:0}

.side-section{margin-bottom:22px}
.side-label{font-size:11px;color:var(--fg-dim);letter-spacing:1.4px;font-weight:700;text-transform:uppercase;padding:4px 10px 8px}
.side-link{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:8px;color:var(--fg-muted);font-size:13.5px;font-weight:500;margin-bottom:1px}
.side-link:hover{background:var(--bg-3);color:var(--fg)}
.side-link.is-active{background:var(--accent-soft);color:var(--fg);font-weight:600}
.side-link.is-active svg{color:var(--accent-2)}
.side-link--cat{font-size:13px;color:var(--fg-muted)}
.side-cta{margin-top:14px;padding:14px;border:1px solid var(--line);border-radius:12px;background:linear-gradient(155deg,#17212e 0%,#111821 100%)}
.side-cta__title{font-size:13px;color:var(--fg);font-weight:700;margin-bottom:10px;line-height:1.4}

.btn-block{display:flex;align-items:center;justify-content:center;padding:10px 14px;border-radius:8px;font-weight:600;font-size:13px;cursor:pointer;border:1px solid transparent;margin-bottom:6px;transition:background .15s}
.btn-block--primary{background:var(--accent);color:#fff}
.btn-block--primary:hover{background:var(--accent-2);color:#fff}
.btn-block--ghost{background:transparent;color:var(--fg);border-color:var(--line-2)}
.btn-block--ghost:hover{background:var(--bg-3);color:var(--fg)}
.btn-mini{display:inline-flex;align-items:center;padding:3px 10px;font-size:11.5px;font-weight:600;border-radius:5px;background:var(--accent-soft);color:var(--accent-2);cursor:pointer;border:1px solid transparent}
.btn-mini:hover{background:var(--accent);color:#fff}

.side-mask{display:none;position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:35;opacity:0;transition:opacity .2s}
.side-mask.open{opacity:1}

/* ============== PAGE HEADER ============== */
.page-hd{display:grid;grid-template-columns:1.1fr 1.6fr;gap:24px;align-items:stretch;margin-bottom:22px}
.page-hd__text{padding:22px 24px;background:linear-gradient(140deg,#122033 0%,#0e1720 80%);border:1px solid var(--line);border-radius:14px;display:flex;flex-direction:column;justify-content:center}
.page-hd__eyebrow{display:inline-flex;align-items:center;gap:6px;font-size:11px;color:var(--accent-2);font-weight:700;letter-spacing:1.2px;margin-bottom:10px}
.page-hd__title{font-size:26px;font-weight:800;margin-bottom:10px;letter-spacing:-0.4px}
.page-hd__desc{color:var(--fg-muted);font-size:14px;margin:0;line-height:1.7}
.page-hd__kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.kpi{background:var(--bg-2);border:1px solid var(--line);border-radius:12px;padding:16px}
.kpi__label{font-size:11.5px;color:var(--fg-muted);text-transform:uppercase;letter-spacing:.8px;font-weight:600;margin-bottom:8px}
.kpi__val{font-size:22px;font-weight:800;font-family:var(--mono);color:var(--fg);margin-bottom:4px;letter-spacing:-0.5px}
.kpi__chg{font-size:12px;font-family:var(--mono);font-weight:600;display:inline-flex;align-items:center;gap:3px}
.kpi__chg.up{color:var(--up)}
.kpi__chg.dn{color:var(--dn)}

/* ============== PANEL ============== */
.panel{background:var(--bg-2);border:1px solid var(--line);border-radius:14px;padding:18px 20px;margin-bottom:18px}
.panel__hd{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:14px;gap:16px}
.panel__title{font-size:17px;font-weight:700;margin-bottom:2px}
.panel__sub{color:var(--fg-muted);font-size:12.5px;margin:0}
.panel__more{font-size:12.5px;color:var(--accent-2);font-weight:600;display:inline-flex;align-items:center;gap:4px;white-space:nowrap}

/* ============== DATA TABLE ============== */
.data-table-wrap{overflow-x:auto;margin:0 -20px;padding:0 20px}
.data-table{width:100%;border-collapse:collapse;font-size:13.5px}
.data-table thead th{text-align:left;font-size:11px;color:var(--fg-dim);font-weight:700;text-transform:uppercase;letter-spacing:.8px;padding:8px 12px;border-bottom:1px solid var(--line)}
.data-table thead th.num{text-align:right}
.data-table tbody td{padding:12px;border-bottom:1px solid var(--line);color:var(--fg);vertical-align:middle}
.data-table tbody tr:last-child td{border-bottom:0}
.data-table tbody tr:hover{background:var(--bg-3)}
.data-table td.num{text-align:right;font-family:var(--mono)}
.data-table td.rank{color:var(--fg-dim);font-weight:600;width:32px}
.data-table .mono{font-family:var(--mono)}
.data-table .up{color:var(--up)}
.data-table .dn{color:var(--dn)}
.data-table .muted{color:var(--fg-muted);font-weight:400;margin-left:4px;font-size:12.5px}
.sym-dot{display:inline-flex;width:22px;height:22px;border-radius:50%;background:linear-gradient(135deg,#2172e5,#6366f1);color:#fff;font-size:11px;font-weight:700;align-items:center;justify-content:center;margin-right:8px;vertical-align:middle}

/* ============== CATEGORY GRID ============== */
.cat-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:10px}
.cat-tile{display:grid;grid-template-columns:32px 1fr;grid-template-rows:auto auto;column-gap:10px;padding:14px;background:var(--bg-3);border:1px solid var(--line);border-radius:10px;color:var(--fg);transition:border-color .2s,transform .15s}
.cat-tile:hover{border-color:var(--accent);color:var(--fg);transform:translateY(-2px)}
.cat-tile__ic{grid-row:1 / 3;width:32px;height:32px;border-radius:8px;background:var(--accent-soft);color:var(--accent-2);display:inline-flex;align-items:center;justify-content:center}
.cat-tile__name{font-weight:700;font-size:14px}
.cat-tile__desc{color:var(--fg-muted);font-size:12px;line-height:1.5}

/* ============== ROW LIST ============== */
.row-list{display:flex;flex-direction:column;border-top:1px solid var(--line)}
.row-item{display:flex;justify-content:space-between;gap:20px;padding:14px 4px;border-bottom:1px solid var(--line);color:var(--fg)}
.row-item:hover{background:var(--bg-3);color:var(--fg)}
.row-item__main{flex:1;min-width:0}
.row-item__tags{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:6px}
.chip{display:inline-block;padding:2px 8px;background:var(--pill);color:var(--fg-muted);font-size:11px;border-radius:4px;font-weight:600;letter-spacing:.3px}
.chip--link{color:var(--accent-2)}
.chip--on{background:var(--accent);color:#fff}
.row-item__title{font-size:15px;font-weight:600;margin:2px 0 4px;line-height:1.45}
.row-item__desc{color:var(--fg-muted);font-size:13px;line-height:1.55;margin:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.row-item__meta{display:flex;flex-direction:column;align-items:flex-end;gap:4px;color:var(--fg-dim);font-size:12px;font-family:var(--mono);flex-shrink:0;white-space:nowrap}

/* ============== Q (FAQ) LIST ============== */
.q-list{display:flex;flex-direction:column;gap:6px}
.q-item{border:1px solid var(--line);border-radius:10px;background:var(--bg-3);overflow:hidden}
.q-item__head{width:100%;text-align:left;padding:14px 16px;background:none;border:0;color:var(--fg);font-size:14px;font-weight:600;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:16px}
.q-item__arrow{font-size:18px;color:var(--fg-muted);font-weight:400;transition:transform .2s}
.q-item.is-open .q-item__arrow{transform:rotate(45deg);color:var(--accent-2)}
.q-item__body{max-height:0;overflow:hidden;transition:max-height .3s;padding:0 16px;color:var(--fg-muted);font-size:13.5px}
.q-item.is-open .q-item__body{max-height:320px;padding:0 16px 14px}
.q-item__link{display:inline-flex;align-items:center;gap:4px;color:var(--accent-2);font-weight:600;font-size:13px;margin-top:6px}

/* ============== FAQ DATA-ROW STYLE ============== */
.faq-rows{border-top:1px dashed var(--line-2);border-bottom:1px dashed var(--line-2)}
.faq-row{display:grid;grid-template-columns:64px 1fr 28px;align-items:center;gap:18px;padding:14px 8px;border-bottom:1px dashed var(--line);color:var(--fg);transition:background .15s,color .15s,padding .15s;position:relative}
.faq-row:last-child{border-bottom:0}
.faq-row__idx{font-family:var(--mono,ui-monospace,SFMono-Regular,Menlo,monospace);font-size:12px;font-weight:700;color:var(--fg-dim);letter-spacing:.5px;background:var(--bg-3);border:1px solid var(--line);border-radius:4px;padding:4px 8px;text-align:center}
.faq-row__q{font-family:var(--mono,ui-monospace,SFMono-Regular,Menlo,monospace);font-size:13.5px;font-weight:500;color:var(--fg);letter-spacing:.2px;line-height:1.55}
.faq-row__act{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:50%;border:1px solid var(--line-2);color:var(--fg-muted);transition:all .15s}
.faq-row:hover{background:rgba(22,199,132,.06);padding-left:14px}
.faq-row:hover .faq-row__idx{border-color:var(--up);color:var(--up);background:rgba(22,199,132,.08)}
.faq-row:hover .faq-row__q{color:var(--up)}
.faq-row:hover .faq-row__act{border-color:var(--up);color:var(--up);background:rgba(22,199,132,.08);transform:translateX(2px)}
@media (max-width:640px){.faq-row{grid-template-columns:52px 1fr 24px;gap:12px;padding:12px 6px}.faq-row__q{font-size:13px}}

/* ============== CTA BAND ============== */
.cta-band{display:flex;justify-content:space-between;align-items:center;gap:24px;padding:26px 28px;background:linear-gradient(110deg,#1a365d 0%,#1e3a8a 50%,#312e81 100%);border-radius:14px;margin:22px 0;border:1px solid #293b5c}
.cta-band__text h2{font-size:20px;margin-bottom:6px;color:#fff}
.cta-band__text p{color:rgba(255,255,255,.75);margin:0;font-size:13.5px}
.cta-band__btns{display:flex;gap:10px;flex-shrink:0}
.cta-band__btns .btn-block{margin:0;min-width:140px}
.cta-band__btns .btn-block--primary{background:#fff;color:var(--accent)}
.cta-band__btns .btn-block--primary:hover{background:#f0f6ff;color:var(--accent)}
.cta-band__btns .btn-block--ghost{color:#fff;border-color:rgba(255,255,255,.4)}
.cta-band__btns .btn-block--ghost:hover{background:rgba(255,255,255,.1);color:#fff}

/* ============== ARTICLE ============== */
.article-wrap{max-width:100%}
.bc{font-size:12px;color:var(--fg-muted);margin-bottom:16px;display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.bc a{color:var(--fg-muted)}
.bc a:hover{color:var(--accent-2)}
.bc__cur{color:var(--fg)}
.article-grid{display:grid;grid-template-columns:1fr 300px;gap:24px;align-items:flex-start}
.article-body{background:var(--bg-2);border:1px solid var(--line);border-radius:14px;padding:28px 32px}
.article-hd{border-bottom:1px solid var(--line);padding-bottom:18px;margin-bottom:22px}
.article-hd__tags{display:flex;gap:6px;margin-bottom:12px;flex-wrap:wrap}
.article-hd__title{font-size:26px;font-weight:800;letter-spacing:-0.3px;line-height:1.3;margin-bottom:12px}
.article-hd__meta{display:flex;gap:10px;align-items:center;color:var(--fg-dim);font-size:12.5px}
.article-hd__lead{margin-top:14px;padding:12px 14px;border-left:3px solid var(--accent);background:var(--bg-3);border-radius:6px;color:var(--fg-muted);font-size:13.5px}

.prose{color:var(--fg);font-size:15px;line-height:1.8}
.prose p{margin:0 0 14px;color:#c9d1d9}
.prose h2{font-size:20px;margin:28px 0 12px;padding-bottom:6px;border-bottom:1px solid var(--line)}
.prose h3{font-size:16.5px;margin:22px 0 10px;color:var(--fg)}
.prose h4{font-size:15px;margin:18px 0 8px}
.prose ul,.prose ol{padding-left:22px;margin:8px 0 16px;color:#c9d1d9}
.prose li{margin-bottom:6px;line-height:1.75}
.prose strong{color:#fff;font-weight:700}
.prose a{color:var(--accent-2);text-decoration:underline;text-decoration-color:rgba(96,165,250,.3);text-underline-offset:3px}
.prose a:hover{text-decoration-color:var(--accent-2)}
.prose blockquote{border-left:3px solid var(--accent);background:var(--bg-3);margin:14px 0;padding:12px 16px;color:var(--fg-muted);border-radius:0 8px 8px 0}
.prose code{background:var(--bg-3);padding:1px 6px;border-radius:4px;font-family:var(--mono);font-size:13px;color:#f0b429}
.prose pre{background:#0a0f16;border:1px solid var(--line);padding:14px 16px;border-radius:8px;overflow-x:auto;margin:14px 0}
.prose pre code{background:none;padding:0;color:#c9d1d9}
.prose table{width:100%;border-collapse:collapse;margin:14px 0;font-size:13.5px}
.prose table th,.prose table td{border:1px solid var(--line);padding:8px 12px;text-align:left}
.prose table thead th{background:var(--bg-3);color:var(--fg);font-weight:700;font-size:12.5px}

.related{margin-top:28px;padding-top:20px;border-top:1px solid var(--line)}
.related h3{font-size:14px;color:var(--fg-muted);margin-bottom:12px;text-transform:uppercase;letter-spacing:.8px;font-weight:700}
.related__grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.related__card{display:block;padding:14px;background:var(--bg-3);border:1px solid var(--line);border-radius:10px;color:var(--fg)}
.related__card:hover{border-color:var(--accent);color:var(--fg)}
.related__card span{display:block;font-weight:600;font-size:13.5px;margin-bottom:4px;line-height:1.45}
.related__card time{color:var(--fg-dim);font-size:11.5px;font-family:var(--mono)}

.article-side{display:flex;flex-direction:column;gap:14px;position:sticky;top:74px}
.side-card{background:var(--bg-2);border:1px solid var(--line);border-radius:12px;padding:16px}
.side-card--cta{background:linear-gradient(155deg,#15202e 0%,#101821 100%)}
.side-card h4{font-size:14px;font-weight:700;margin-bottom:6px}
.side-card > p{font-size:12.5px;color:var(--fg-muted);margin-bottom:12px;line-height:1.6}
.side-card__title{font-size:13px;color:var(--fg-muted);letter-spacing:.8px;text-transform:uppercase;margin-bottom:10px;font-weight:700}
.side-card__list{list-style:none;padding:0;margin:0}
.side-card__list li{border-bottom:1px solid var(--line);padding:8px 0}
.side-card__list li:last-child{border-bottom:0}
.side-card__list a{color:var(--fg);font-size:13px;line-height:1.45;display:block}
.side-card__list a:hover{color:var(--accent-2)}
.side-card__tags{display:flex;flex-wrap:wrap;gap:6px}

/* ============== TAG PAGE ============== */
.tag-hd{padding:18px 22px;background:var(--bg-2);border:1px solid var(--line);border-radius:12px;margin-bottom:16px;display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.tag-hd__title{font-size:22px;display:flex;align-items:center;gap:10px;margin:0}
.tag-hd__sub{margin:0;color:var(--fg-muted);font-size:13px;font-family:var(--mono)}
.empty-note{text-align:center;padding:60px 20px;color:var(--fg-muted)}

/* ============== DOWNLOAD PAGE ============== */
.dl-hero{padding:34px 28px;background:radial-gradient(ellipse at top right,#1e3a8a 0%,transparent 50%),linear-gradient(165deg,#0f1827 0%,#121a28 100%);border:1px solid var(--line);border-radius:14px;margin-bottom:18px}
.dl-hero h1{font-size:28px;margin-bottom:10px;letter-spacing:-0.5px}
.dl-hero p{color:var(--fg-muted);margin:0;font-size:14px;max-width:720px}
.dl-hero__tags{display:flex;gap:8px;margin-top:14px;flex-wrap:wrap}
.dl-hero__tags span{padding:4px 10px;background:rgba(33,114,229,.15);color:var(--accent-2);border-radius:4px;font-size:11.5px;font-weight:600}

.dl-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:14px;margin-bottom:18px}
.dl-card{padding:20px 22px;background:var(--bg-2);border:1px solid var(--line);border-radius:12px}
.dl-card__badge{display:inline-block;padding:3px 8px;background:var(--accent-soft);color:var(--accent-2);font-size:10.5px;font-weight:700;letter-spacing:1px;border-radius:4px;margin-bottom:10px}
.dl-card__title{font-size:17px;margin-bottom:14px}
.dl-card__list{list-style:none;padding:0;margin:0 0 14px;font-size:13px;color:var(--fg-muted)}
.dl-card__list li{padding:5px 0;display:flex;align-items:center;gap:8px}
.dl-card__list li::before{content:"•";color:var(--accent-2);font-weight:700}

.dl-steps{padding:22px;background:var(--bg-2);border:1px solid var(--line);border-radius:12px;margin-bottom:18px}
.dl-steps__title{font-size:18px;margin-bottom:18px;display:flex;align-items:center;gap:10px}
.dl-steps__title::before{content:"";width:4px;height:20px;background:var(--accent);border-radius:2px}
.dl-steps__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:12px}
.dl-step{padding:16px;background:var(--bg-3);border:1px solid var(--line);border-radius:10px;position:relative}
.dl-step__num{position:absolute;top:-10px;left:14px;width:26px;height:26px;background:var(--accent);color:#fff;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-weight:700;font-size:13px;font-family:var(--mono)}
.dl-step h3{font-size:14.5px;margin:8px 0 6px}
.dl-step p{font-size:13px;color:var(--fg-muted);line-height:1.65;margin:0}
.dl-warn{padding:14px 18px;background:rgba(234,57,67,.08);border:1px solid rgba(234,57,67,.3);border-radius:10px;color:#fda4af;font-size:13px;margin-bottom:18px}
.dl-warn strong{color:#fecaca}

/* ============== STATIC PAGE ============== */
.static-page{background:var(--bg-2);border:1px solid var(--line);border-radius:14px;padding:28px 34px}
.static-page h1{font-size:26px;margin-bottom:16px}
.static-page h2{font-size:17px;margin:22px 0 10px;padding-bottom:6px;border-bottom:1px solid var(--line)}
.static-page p,.static-page li{color:#c9d1d9;font-size:14.5px;line-height:1.75}
.static-page ul{padding-left:22px}

/* ============== ERROR ============== */
.err-page{text-align:center;padding:80px 24px}
.err-page__code{font-size:90px;font-weight:800;font-family:var(--mono);color:var(--accent);letter-spacing:-2px;margin-bottom:10px}
.err-page h1{font-size:24px;margin-bottom:10px}
.err-page p{color:var(--fg-muted);margin-bottom:24px}
.err-page__btns{display:inline-flex;gap:10px}
.err-page__btns .btn-block{min-width:140px;margin:0}

/* ============== MOBILE DOCK ============== */
.m-dock{display:none;position:fixed;bottom:0;left:0;right:0;background:rgba(13,17,23,.96);backdrop-filter:blur(12px);border-top:1px solid var(--line);z-index:30;padding:6px 8px env(safe-area-inset-bottom)}
.m-dock__i{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;padding:7px 0;color:var(--fg-muted);font-size:10px}
.m-dock__i em{font-style:normal}
.m-dock__i--on{color:var(--accent-2)}

/* ============== RESPONSIVE ============== */
@media (max-width: 1100px){
  .page-hd{grid-template-columns:1fr}
  .page-hd__kpis{grid-template-columns:repeat(4,1fr)}
  .article-grid{grid-template-columns:1fr}
  .article-side{position:static;order:2;display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
  .topbar__ticker{display:none}
}
@media (max-width: 820px){
  .app-body{grid-template-columns:1fr}
  .app-sidebar{position:fixed;top:56px;left:0;bottom:0;width:260px;background:var(--bg);z-index:38;transform:translateX(-100%);transition:transform .25s;max-height:none}
  .app-sidebar.open{transform:translateX(0)}
  .side-mask{display:block;pointer-events:none}
  .side-mask.open{pointer-events:auto}
  body.side-open{overflow:hidden}
  .topbar__menu{display:inline-flex}
  .brand-sub{display:none}
  .topbar__actions .btn-pill--ghost{display:none}
  .app-main{padding:16px 14px 100px}
  .m-dock{display:flex}
  .page-hd__kpis{grid-template-columns:repeat(2,1fr)}
  .page-hd__text{padding:18px}
  .page-hd__title{font-size:22px}
  .panel{padding:14px 12px}
  .panel__hd{flex-direction:column;align-items:flex-start;gap:4px}
  .data-table-wrap{margin:0 -12px;padding:0 12px}
  .hide-sm{display:none}
  .cta-band{flex-direction:column;align-items:stretch;padding:18px 16px}
  .cta-band__btns{flex-direction:column}
  .article-body{padding:20px 18px}
  .article-hd__title{font-size:22px}
  .related__grid{grid-template-columns:1fr}
  .row-item{flex-direction:column;gap:8px;align-items:flex-start}
  .row-item__meta{flex-direction:row;gap:12px;align-items:center}
}

/* ============== FOOTER (data-table style) ============== */
.dl-footer{margin-top:32px;border-top:1px solid var(--line);background:var(--bg-2);padding:20px 22px 24px;font-family:var(--mono);color:var(--fg-muted);font-size:12px}
.dl-footer__stats{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;padding:12px 14px;background:var(--bg-3);border:1px solid var(--line);border-radius:8px;margin-bottom:16px}
.dl-footer__stat{display:flex;flex-direction:column;gap:2px;font-family:var(--mono)}
.dl-footer__stat-label{font-size:10px;color:var(--fg-dim);text-transform:uppercase;letter-spacing:.06em}
.dl-footer__stat-value{font-size:15px;color:var(--fg);font-weight:700}
.dl-footer__stat-change{font-size:11px}
.dl-footer__stat-change.up{color:var(--up)}
.dl-footer__stat-change.down{color:var(--dn)}
.dl-footer__bar{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:10px 0;border-bottom:1px dashed var(--line);margin-bottom:14px;flex-wrap:wrap}
.dl-footer__brand-line{display:flex;align-items:center;gap:8px}
.dl-footer__brand-name{color:var(--fg);font-weight:700;font-size:13px;font-family:var(--sans)}
.dl-footer__brand-slug{color:var(--fg-dim);font-size:11px;letter-spacing:.04em}
.dl-footer__links{display:flex;flex-wrap:wrap;gap:6px;align-items:center;font-size:12px}
.dl-footer__links a{color:var(--fg-muted)}
.dl-footer__links a:hover{color:var(--accent-2)}
.dl-footer__links span{color:var(--fg-dim)}
.dl-footer__table{width:100%;border-collapse:collapse;font-family:var(--mono);font-size:12px;margin-bottom:16px}
.dl-footer__table thead th{text-align:left;padding:6px 10px;background:var(--bg-3);color:var(--fg-dim);font-size:10px;letter-spacing:.06em;font-weight:600;text-transform:uppercase;border-bottom:1px solid var(--line)}
.dl-footer__table tbody td{padding:7px 10px;border-bottom:1px solid var(--line);color:var(--fg-muted)}
.dl-footer__table tbody tr:hover{background:rgba(33,114,229,.04)}
.dl-footer__table td a{color:var(--fg)}
.dl-footer__table td a:hover{color:var(--accent-2)}
.dl-footer__table code{background:var(--pill);color:var(--accent-2);padding:2px 6px;border-radius:4px;font-size:11px}
.dl-footer__meta{padding-top:10px;border-top:1px solid var(--line)}
.dl-footer__desc{font-family:var(--sans);font-size:12px;color:var(--fg-muted);margin:0 0 10px;line-height:1.65}
.dl-footer__risk{font-family:var(--sans);font-size:11.5px;color:var(--fg-dim);padding:8px 10px;background:rgba(234,57,67,.06);border-left:2px solid var(--dn);border-radius:2px;margin-bottom:10px}
.dl-footer__risk strong{color:#fecaca}
.dl-footer__copy{display:flex;gap:8px;align-items:center;color:var(--fg-dim);font-size:11px}
.dl-footer__sep{color:var(--line-2)}
@media (max-width:720px){
  .dl-footer__stats{grid-template-columns:repeat(2,1fr)}
  .dl-footer__bar{flex-direction:column;align-items:flex-start}
  .dl-footer__table .hide-sm{display:none}
}

/* Pager */
.fp-pager{display:flex;justify-content:center;align-items:center;gap:8px;margin:36px 0 12px;flex-wrap:wrap;font-family:var(--mono);font-size:13px}
.fp-pager__btn{padding:7px 14px;border:1px solid var(--line-2);border-radius:6px;color:var(--fg);background:var(--bg-2);transition:.15s}
.fp-pager__btn:hover{border-color:var(--accent-2);color:var(--accent-2)}
.fp-pager__btn.is-disabled{opacity:.4;pointer-events:none}
.fp-pager__nums{display:inline-flex;gap:4px}
.fp-pager__n{display:inline-flex;align-items:center;justify-content:center;min-width:30px;height:30px;padding:0 8px;border:1px solid var(--line-2);border-radius:6px;color:var(--fg-2,#bcc4d3);background:var(--bg-2);transition:.15s}
.fp-pager__n:hover{border-color:var(--accent-2);color:var(--accent-2)}
.fp-pager__n.is-current{background:var(--accent);color:#fff;border-color:var(--accent)}

.topbar__lang{display:inline-flex;gap:1px;background:var(--bg-3,rgba(255,255,255,.05));border:1px solid var(--line-2);border-radius:6px;padding:2px}
.topbar__lang a{padding:4px 7px;font-size:11.5px;font-weight:600;color:var(--fg);font-family:var(--mono);letter-spacing:.04em;border-radius:4px}
.topbar__lang a:hover{background:var(--bg-2);color:var(--accent-2)}
.topbar__lang a.is-active{background:var(--accent);color:#fff}
@media (max-width:980px){.topbar__lang{display:none}}
