/* VargaMesh Mempool Explorer v0.14.0
   Main-site visual system alignment + responsive explorer refinements. */
:root{
  --bg:#050a10;
  --bg2:#08131d;
  --panel:#0c1823;
  --panel2:#101f2c;
  --panel3:#132736;
  --text:#f2f8fc;
  --muted:#97adbd;
  --soft:#71899a;
  --line:#1c3749;
  --line2:#2b536b;
  --accent:#43e0b7;
  --accent2:#63aafc;
  --accent3:#aa91ff;
  --ok:#5be397;
  --warn:#ffc961;
  --danger:#ff7484;
  --shadow:0 24px 90px rgba(0,0,0,.32);
  --shadow-soft:0 14px 42px rgba(0,0,0,.18);
  --max:1440px;
  --r:20px;
  --r2:30px;
}

html{background:var(--bg);scroll-behavior:smooth;color-scheme:dark}
body{
  color:var(--text);
  background:
    radial-gradient(circle at 8% -5%,rgba(71,175,235,.17),transparent 31%),
    radial-gradient(circle at 91% 0,rgba(67,224,183,.11),transparent 27%),
    linear-gradient(180deg,var(--bg),var(--bg2) 44%,var(--bg));
  line-height:1.58;
  -webkit-font-smoothing:antialiased;
}

::selection{background:rgba(67,224,183,.24);color:#fff}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}

.skip-link{position:fixed;left:12px;top:-90px;z-index:250;padding:10px 14px;background:#fff;color:#000;border-radius:10px;font-weight:800;transition:.18s}
.skip-link:focus{top:12px}

/* ---------- Header / navigation ---------- */
.topbar{
  display:block;
  min-height:0;
  padding:0;
  position:sticky;
  top:0;
  z-index:80;
  border-bottom:1px solid rgba(42,83,107,.7);
  background:rgba(5,10,16,.84);
  backdrop-filter:blur(22px) saturate(140%);
  box-shadow:0 10px 38px rgba(0,0,0,.16);
}
.topbar-inner{
  width:min(var(--max),calc(100% - 38px));
  min-height:76px;
  margin:auto;
  display:flex;
  align-items:center;
  gap:16px;
}
.brand{display:flex;align-items:center;gap:11px;font-weight:900;letter-spacing:-.02em;white-space:nowrap;min-width:max-content}
.brandmark{
  width:42px;
  height:42px;
  border-radius:12px;
  display:grid;
  place-items:center;
  background:#050a12;
  border:1px solid rgba(93,224,244,.28);
  box-shadow:0 8px 25px rgba(0,0,0,.28),0 0 20px rgba(32,203,229,.09);
  position:relative;
  overflow:hidden;
  flex:0 0 auto;
}
.brandmark:after{content:"";position:absolute;inset:1px;border:1px solid rgba(255,255,255,.08);border-radius:11px;pointer-events:none}
.brandmark img{width:45px;height:45px;object-fit:contain;filter:none!important}
.brandtext{display:flex!important;flex-direction:column!important;line-height:1!important}
.brand strong{font-size:1.03rem;letter-spacing:-.02em}
.brand small{margin-top:6px;color:#86a0b3;font-size:.63rem;letter-spacing:.14em;font-weight:750}

.topnav{margin-left:auto;display:flex;align-items:center;gap:2px;color:#a7bccb;font-size:.87rem;min-width:0}
.topnav>a,.nav-more-button{
  min-height:38px;
  display:inline-flex;
  align-items:center;
  gap:7px;
  padding:9px 10px;
  border:0;
  border-radius:10px;
  background:transparent;
  color:#a7bccb;
  font:inherit;
  font-weight:750;
  cursor:pointer;
  transition:background .18s,color .18s,border-color .18s,transform .18s;
}
.topnav>a:after{display:none!important}
.topnav>a:hover,.topnav>a.active,.topnav>a[aria-current="page"],.nav-more-button:hover,.nav-more:has([aria-current="page"])>.nav-more-button{
  background:#10232f;
  color:#fff;
}
.topnav>a:hover,.nav-more-button:hover{transform:translateY(-1px)}
.nav-more{position:relative}
.nav-more-button>span:last-child{font-size:.86em;color:#7995a8;transition:transform .18s}
.nav-more.open>.nav-more-button>span:last-child{transform:rotate(180deg)}
.nav-more-menu{
  position:absolute;
  right:0;
  top:calc(100% + 10px);
  width:min(300px,calc(100vw - 32px));
  padding:8px;
  display:grid;
  gap:4px;
  border:1px solid var(--line2);
  border-radius:16px;
  background:linear-gradient(180deg,rgba(15,31,44,.99),rgba(7,17,26,.99));
  box-shadow:0 24px 80px rgba(0,0,0,.46);
  opacity:0;
  visibility:hidden;
  transform:translateY(-7px) scale(.985);
  transform-origin:top right;
  transition:.18s ease;
}
.nav-more.open>.nav-more-menu{opacity:1;visibility:visible;transform:none}
.nav-more-menu a{
  min-height:42px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:9px 11px;
  border:1px solid transparent;
  border-radius:10px;
  color:#abc0ce;
  font-size:.82rem;
  font-weight:750;
  background:transparent;
}
.nav-more-menu a:hover,.nav-more-menu a[aria-current="page"]{background:#10232f;border-color:rgba(43,83,107,.45);color:#fff}
.nav-more-menu .nav-feature{padding:9px 11px!important;border:1px solid rgba(67,224,183,.14);background:rgba(67,224,183,.045);color:#baf2e4!important}
.nav-more-menu .nav-feature:hover{border-color:rgba(67,224,183,.42);background:rgba(67,224,183,.09)}
.nav-more-menu .nav-site-link{color:#8ca2b0}

.top-actions{display:flex;align-items:center;gap:8px;margin-left:4px}
.live-pill,.advanced-toggle,.top-actions select{
  min-height:36px;
  border:1px solid var(--line);
  background:#0c1a25;
  border-radius:999px;
  padding:7px 10px;
  color:#bdd0dc;
  font-size:.72rem;
  font-weight:800;
}
.live-pill{display:flex;align-items:center;gap:7px;border-color:#25684a;color:#baf1cf;background:rgba(12,38,30,.88)}
.live-dot{width:8px;height:8px;border-radius:50%;background:var(--ok);box-shadow:0 0 15px rgba(91,227,151,.78)}
.advanced-toggle{cursor:pointer;transition:.18s}
.advanced-toggle:hover,.advanced-toggle[aria-pressed="true"]{border-color:#47809e;background:#122a39;color:#fff}
.top-actions select{appearance:none;padding-right:25px;background:#0c1a25 linear-gradient(45deg,transparent 50%,#7593a6 50%) calc(100% - 12px) 50%/5px 5px no-repeat;cursor:pointer}
.menu-btn{display:none;width:40px;height:38px;padding:0;border:1px solid var(--line);border-radius:11px;background:#0b1924;cursor:pointer;align-items:center;justify-content:center;flex-direction:column;gap:4px}
.menu-btn span{display:block;width:17px;height:2px;border-radius:2px;background:#dceaf2;transition:.18s}
.menu-btn[aria-expanded="true"] span:nth-child(1){transform:translateY(6px) rotate(45deg)}
.menu-btn[aria-expanded="true"] span:nth-child(2){opacity:0}
.menu-btn[aria-expanded="true"] span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}

/* ---------- Hero ---------- */
.hero{display:block;grid-template-columns:none;gap:0;padding:70px 0 42px;max-width:none;margin:0;position:relative;overflow:hidden}
.hero:before{content:"";position:absolute;width:720px;height:720px;border-radius:50%;border:1px solid rgba(99,170,252,.07);right:-350px;top:-410px;box-shadow:0 0 0 90px rgba(99,170,252,.014),0 0 0 180px rgba(67,224,183,.009);pointer-events:none}
.hero-grid{width:min(var(--max),calc(100% - 38px));margin:auto;display:grid;grid-template-columns:minmax(0,1.2fr) minmax(380px,.8fr);gap:44px;align-items:center;position:relative}
.eyebrow{font-size:.72rem;letter-spacing:.15em;color:#9be7d5;font-weight:900;text-transform:uppercase}
.hero h1{font-size:clamp(2.9rem,6vw,5.8rem);line-height:.96;margin:18px 0 20px;letter-spacing:-.06em;max-width:900px}
.hero-title-main{color:#f6fbff}
.grad{background:linear-gradient(90deg,#f8fcff,#66e6c7 43%,#78b7ff 76%,#ad9cff);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero p{max-width:760px;margin:0;color:var(--muted);font-size:clamp(1rem,1.25vw,1.12rem);line-height:1.72}
.hero-links{display:flex;gap:8px;flex-wrap:wrap;margin-top:22px}
.hero-links>a{display:inline-flex;align-items:center;gap:7px;padding:8px 11px;border:1px solid var(--line2);border-radius:10px;background:rgba(8,20,30,.72);color:#bdd0dc;font-size:.76rem;font-weight:800;transition:.18s}
.hero-links>a:hover{transform:translateY(-1px);border-color:#47809e;background:#122a39;color:#fff}
.hero-link-dot{width:7px;height:7px;border-radius:50%;background:var(--ok);box-shadow:0 0 12px rgba(91,227,151,.75)}
.hero-grow{border-color:rgba(67,224,183,.35)!important;background:rgba(67,224,183,.07)!important;color:#c1f6e8!important}

.hero-console{border:1px solid var(--line2);border-radius:26px;padding:22px;background:linear-gradient(160deg,rgba(17,35,48,.96),rgba(7,18,27,.94));box-shadow:var(--shadow);position:relative;overflow:hidden}
.hero-console:after{content:"";position:absolute;width:180px;height:180px;border-radius:50%;background:rgba(67,224,183,.08);filter:blur(50px);right:-70px;top:-70px;pointer-events:none}
.console-head{display:flex;align-items:center;justify-content:space-between;padding-bottom:14px;border-bottom:1px solid var(--line);position:relative;z-index:1}
.console-head span{display:flex;align-items:center;gap:8px;font-size:.76rem;font-weight:850;letter-spacing:.08em}
.console-head i{width:8px;height:8px;border-radius:50%;background:var(--ok);box-shadow:0 0 15px rgba(91,227,151,.8)}
.console-head small{color:var(--muted);font-size:.7rem}
.searchbar{display:flex;max-width:none;margin-top:16px;padding:7px;border:1px solid var(--line2);border-radius:16px;background:rgba(8,20,30,.88);box-shadow:none;overflow:visible;position:relative;z-index:1}
.searchbar:focus-within{border-color:#47809e;box-shadow:0 0 0 3px rgba(99,170,252,.08)}
.searchbar input{min-width:0;flex:1;padding:12px 13px;border:0;outline:0;color:#fff;background:transparent;font-size:.82rem}
.searchbar button{border:0;border-radius:10px;background:linear-gradient(135deg,#42dfb7,#62aafc);color:#031019;font-weight:850;padding:0 15px;cursor:pointer;box-shadow:0 8px 24px rgba(66,181,202,.13)}
.console-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:13px;position:relative;z-index:1}
.console-grid>a{padding:12px 13px;border:1px solid rgba(43,83,107,.55);border-radius:13px;background:#081721;transition:.18s}
.console-grid>a:hover{transform:translateY(-1px);border-color:#3b718e;background:#0b1c28}
.console-grid span{display:block;color:var(--muted);font-size:.68rem}
.console-grid b{display:block;margin-top:2px;font-size:.96rem;color:#eef8fc}
.console-hint{display:flex;align-items:center;gap:6px;margin-top:12px;color:#6f899a;font-size:.68rem;position:relative;z-index:1}
.console-hint kbd{padding:2px 6px;border:1px solid var(--line);border-bottom-color:#31546b;border-radius:6px;background:#07131c;color:#a8c0cf;font:700 .65rem ui-monospace,SFMono-Regular,Consolas,monospace}
.console-hint span:last-child{margin-left:3px}

.detail-route .hero{padding:30px 0 22px;border-bottom:1px solid rgba(28,55,73,.45);background:rgba(6,15,23,.25)}
.detail-route .hero-grid{grid-template-columns:minmax(0,1fr) minmax(340px,.62fr);gap:28px}
.detail-route .hero h1{font-size:clamp(2.1rem,4vw,3.7rem);margin:10px 0 12px}
.detail-route .hero p{font-size:.92rem}
.detail-route .hero-links{margin-top:12px}
.detail-route .console-grid,.detail-route .console-hint{display:none}
.detail-route .hero-console{padding:16px 17px;border-radius:18px}
.detail-route .searchbar{margin-top:12px}

/* ---------- Main widths / sections ---------- */
.live-chain-mount,#app,.status-banner{width:min(var(--max),calc(100% - 38px));max-width:none;margin-left:auto;margin-right:auto}
#app{padding:0 0 76px}
.status-banner{margin-top:0;margin-bottom:18px;padding:12px 14px;border:1px solid #6a5420;background:rgba(48,39,9,.72);color:#f8da79;border-radius:13px;font-size:.78rem}
.live-chain-mount{margin-top:10px}

.grid{gap:14px}
.stats-grid{grid-template-columns:repeat(6,minmax(0,1fr));margin:0 0 18px}
.card{background:linear-gradient(180deg,rgba(15,30,43,.97),rgba(8,20,30,.97));border:1px solid var(--line);border-radius:var(--r);box-shadow:0 12px 50px rgba(0,0,0,.12);transition:border-color .18s,transform .18s,box-shadow .18s}
.card:hover{border-color:#2c566e}
.section-card{padding:22px}
.section-card:hover{border-color:#2c566e;box-shadow:0 18px 58px rgba(0,0,0,.15)}
.section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:18px}
.section-head h2{margin:4px 0 0;font-size:clamp(1.18rem,1.8vw,1.55rem);letter-spacing:-.035em;line-height:1.12}
.section-head p{margin:6px 0 0;color:var(--muted);font-size:.78rem;line-height:1.55;max-width:760px}

.stat{padding:17px 18px;min-height:118px;position:relative;overflow:hidden;background:linear-gradient(180deg,rgba(15,31,44,.97),rgba(8,20,30,.97));border-radius:18px}
.stat:before{content:"";position:absolute;width:90px;height:90px;border-radius:50%;right:-30px;top:-38px;background:rgba(67,224,183,.055);filter:blur(6px)}
.stat .label{position:relative;color:#819bac;font-size:.68rem;font-weight:850;text-transform:uppercase;letter-spacing:.09em}
.stat .value{position:relative;margin-top:7px;color:#f5fbff;font-weight:900;font-size:clamp(1.25rem,1.9vw,1.7rem);letter-spacing:-.04em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.stat .sub{position:relative;margin-top:4px;padding-right:15px;color:#71899a;font-size:.68rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.stat-source{right:12px!important;bottom:10px!important;max-width:72%!important}
.stat-link{display:block;color:inherit;text-decoration:none}
.stat-link:hover{transform:translateY(-2px);border-color:#36718f;box-shadow:0 16px 48px rgba(0,0,0,.2)}
.stat-arrow{position:absolute;right:14px;top:14px;color:#5b8ea4;font-size:1rem;transition:.18s}
.stat-link:hover .stat-arrow{transform:translateX(2px);color:var(--accent)}

.badge{padding:5px 8px;border:1px solid rgba(43,83,107,.72);border-radius:999px;background:#0b1a24;color:#a7c1cf;font-size:.66rem;font-weight:800}
.badge.gold{color:#f0d87e;border-color:#5a4d22;background:#1b1707}
.badge.blue{color:#9bdcff;border-color:#28536a;background:#0a1c27}
.source-pill{border-color:#28534a;background:#071a16;color:#89cfbd}

.grow-callout{margin:0 0 18px;padding:15px 16px;border:1px solid rgba(67,224,183,.32);border-radius:16px;background:radial-gradient(circle at 90% 0,rgba(67,224,183,.12),transparent 35%),linear-gradient(135deg,rgba(7,35,37,.96),rgba(4,18,29,.98));box-shadow:var(--shadow-soft)}
.grow-callout-icon{width:46px;height:46px;border-radius:13px;background:rgba(67,224,183,.08)}
.grow-callout-icon img{width:35px;height:35px}
.grow-callout-copy strong{font-size:.9rem}
.grow-callout-copy p{font-size:.72rem;color:#8aa5af}
.grow-callout-cta{padding:9px 12px;border-radius:9px;font-size:.72rem}

.nestex-card,.network-observatory-card,.health-card,.dashboard-blocks{margin-bottom:18px}
.nestex-card{background:radial-gradient(circle at 100% 0,rgba(99,170,252,.08),transparent 34%),linear-gradient(180deg,rgba(15,30,43,.97),rgba(8,20,30,.97))}
.nestex-hero{border-radius:16px;border-color:rgba(43,83,107,.72);background:linear-gradient(135deg,rgba(17,35,48,.92),rgba(8,22,30,.96))}
.nestex-grid{gap:10px}
.nestex-grid .entity-metric,.network-observatory-grid .entity-metric,.health-metrics .entity-metric{border-radius:14px!important;border:1px solid rgba(28,55,73,.72)!important;background:linear-gradient(180deg,#0d1b26,#091720)!important}

.network-observatory-card{background:radial-gradient(circle at 95% 0,rgba(67,224,183,.09),transparent 31%),linear-gradient(180deg,rgba(15,30,43,.97),rgba(8,20,30,.97));border-color:var(--line)}
.network-observatory-grid{grid-template-columns:repeat(7,minmax(0,1fr));gap:9px;border:0;background:transparent;border-radius:0;overflow:visible}
.network-observatory-grid .entity-metric{min-height:94px;padding:14px}
.network-observatory-foot{margin-top:12px;padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:#07141d;font-size:.66rem}

.health-metrics{gap:9px}
.service-mini{border-radius:14px;overflow:hidden}

.dashboard-core-grid{gap:18px!important;margin-bottom:18px}
.metric-panel{min-height:0}
.metric-big{font-size:clamp(2rem,3.2vw,3rem);color:#f5fbff}
.progress{height:10px;border-color:var(--line);background:#07141c}
.progress>span{background:linear-gradient(90deg,var(--accent),var(--accent2))}
.switcher{padding:4px;background:#07151e;border:1px solid var(--line);border-radius:11px}
.switcher button{padding:7px 10px;border-radius:8px;font-weight:750}
.switcher button.active{background:#102b36;color:#fff}

/* ---------- Live chain / blocks ---------- */
.chain-stage,.mempool-overview{border-radius:18px!important;border-color:var(--line)!important;background:linear-gradient(180deg,rgba(12,27,38,.97),rgba(7,18,27,.98))!important;box-shadow:var(--shadow-soft)}
.chain-track-shell{border-radius:15px!important}
.blocks-row{grid-template-columns:repeat(6,minmax(165px,1fr));gap:10px}
.block-tile{min-height:220px;border-radius:15px;border-color:#244b45;background:radial-gradient(circle at 90% 0,rgba(67,224,183,.08),transparent 35%),linear-gradient(180deg,rgba(13,37,34,.96),rgba(8,21,26,.98));box-shadow:0 10px 30px rgba(0,0,0,.1)}
.block-tile:hover{transform:translateY(-3px);border-color:#51cdb0;box-shadow:0 18px 48px rgba(0,0,0,.2)}
.block-height{font-size:1.28rem;letter-spacing:-.03em}
.block-hash{color:#7fa49b}
.block-miner{border-radius:9px!important;background:rgba(3,14,16,.72)!important}

/* ---------- Mempool ---------- */
.mempool-overview{margin-bottom:18px}
.mempool-overview-head{padding:18px 20px 15px;border-bottom-color:var(--line)}
.mempool-overview-head h3{font-size:1.35rem}
.mempool-overview-head p{font-size:.72rem;color:var(--muted)}
.overview-live{padding:6px 9px;font-size:.62rem}
.mempool-summary-grid{gap:8px;padding:8px;background:transparent}
.mempool-summary-grid .entity-metric{border:1px solid var(--line);border-radius:12px;min-height:94px;background:#081721;padding:13px 14px}
.mempool-summary-grid .entity-metric span{font-size:.62rem;color:#819bac}
.mempool-summary-grid .entity-metric strong{font-size:1.18rem}
.mempool-summary-grid .entity-metric small{font-size:.62rem}
.mempool-overview-foot{padding:10px 15px;color:#71899a;font-size:.62rem}
.mempool-detail-grid{gap:18px;margin-bottom:18px}
.mempool-canvas-wrap{border-radius:14px!important;border-color:var(--line)!important;background:#06131a!important;overflow:hidden}
#mempoolCanvas{border-radius:12px}
.fee-distribution{gap:10px}
.fee-band{padding:11px 12px;border-radius:10px;border-color:var(--line);background:#081721}
.fee-band-head span{font-size:.66rem}.fee-band-head strong{font-size:.74rem}
.fee-band small{font-size:.61rem;color:#71899a}
.fee-band-bar{height:7px;background:#10212c}
.mempool-table-wrap{border:1px solid rgba(28,55,73,.62);border-radius:13px;overflow:auto}
.mempool-table{margin:0}

/* ---------- Detail routes / data ---------- */
.route-title{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:start;gap:12px;margin:8px 0 18px;padding:0}
.route-title h2{font-size:clamp(1.25rem,2.2vw,1.8rem);letter-spacing:-.035em}
.route-sub{margin-top:5px;color:#71899a;font-size:.72rem}
.back{padding:8px 10px;border:1px solid var(--line);border-radius:10px;background:#0a1924;color:#a8becb;font-weight:750}
.back:hover{border-color:#3f738e;background:#102633;color:#fff}
.kv{gap:1px;border:1px solid var(--line);border-radius:14px;background:var(--line);overflow:hidden}
.kv>div{background:#091720;padding:13px 14px}
.kv .k{color:#7894a5;font-size:.65rem;font-weight:800}
.kv .v{font-size:.78rem;color:#e1edf3}
.detail-group,.protocol-card{border-color:var(--line);border-radius:15px;background:#081721}
.identity-panel{border-radius:18px!important}
.raw-pre{border-radius:12px;border-color:var(--line);background:#061018}

.data-table{font-size:.74rem}
.data-table th{padding:11px 10px;color:#7895a5;border-bottom-color:var(--line);font-size:.62rem}
.data-table td{padding:12px 10px;border-bottom-color:rgba(28,55,73,.42)}
.data-table tbody tr:hover td{background:#0c1b25}
.click{color:#79e6c9;font-weight:750}
.api-list{gap:8px}
.api-row{grid-template-columns:76px 1fr;padding:11px 12px;border-color:var(--line);border-radius:11px;background:#081721}

/* ---------- Footer ---------- */
.footer{display:block;padding:0;border-top:1px solid rgba(28,55,73,.7);background:rgba(4,11,17,.42);color:var(--muted);font-size:.78rem}
.footer-inner{width:min(var(--max),calc(100% - 38px));margin:auto;padding:42px 0 32px}
.footer-grid{display:grid;grid-template-columns:minmax(280px,1.5fr) minmax(150px,.55fr) minmax(190px,.7fr);gap:42px}
.footer-brand p{max-width:520px;margin:15px 0 0;color:#86a0b0;line-height:1.65}
.footer-badges{display:flex;flex-wrap:wrap;gap:7px;margin-top:15px}
.footer-badges span{padding:5px 8px;border:1px solid var(--line);border-radius:999px;background:#091721;color:#89a4b4;font-size:.63rem;font-weight:800}
.footer-column{display:grid;align-content:start;gap:8px}
.footer-column h4{margin:0 0 5px;color:#e9f4fa;font-size:.8rem;letter-spacing:.02em}
.footer-column a{color:#8fa8b7;transition:.16s}
.footer-column a:hover{color:#fff;transform:translateX(2px)}
.footer-bottom{display:flex;justify-content:space-between;gap:20px;margin-top:32px;padding-top:18px;border-top:1px solid rgba(28,55,73,.65);color:#6f8796}
.footer-bottom small{max-width:760px;text-align:right}

/* ---------- Utility / interaction polish ---------- */
.nav-news-badge{border-radius:999px}
.mini-action,.btn{border-radius:9px}
.error-card{padding:34px}
.skeleton{border-radius:18px}

@media(max-width:1280px){
  :root{--max:1180px}
  .stats-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .network-observatory-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
  .hero-grid{grid-template-columns:minmax(0,1fr) minmax(340px,.72fr);gap:30px}
  .topnav>a,.nav-more-button{padding-left:8px;padding-right:8px;font-size:.82rem}
  .live-pill{display:none}
}

@media(max-width:980px){
  .topbar-inner{flex-wrap:wrap;padding:10px 0;min-height:70px}
  .brand{order:1}
  .top-actions{order:2;margin-left:auto}
  .menu-btn{display:flex}
  .topnav{
    order:3;
    width:100%;
    margin:0;
    display:none;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:7px;
    padding:8px 0 4px;
    border-top:1px solid rgba(28,55,73,.62);
  }
  .topnav.open{display:grid}
  .topnav>a,.nav-more-button{width:100%;justify-content:flex-start;padding:10px 11px;background:#091721;border:1px solid rgba(28,55,73,.62)}
  .nav-more{grid-column:1/-1}
  .nav-more-button{justify-content:space-between}
  .nav-more-menu{position:static;width:100%;margin-top:7px;display:none;opacity:1;visibility:visible;transform:none;box-shadow:none;border-radius:12px;background:#07141d}
  .nav-more.open>.nav-more-menu{display:grid}
  .hero{padding:48px 0 34px}
  .hero-grid,.detail-route .hero-grid{grid-template-columns:1fr}
  .hero-console{max-width:none}
  .detail-route .hero-copy{display:none}
  .detail-route .hero{padding:18px 0}
  .detail-route .hero-console{padding:14px}
  .footer-grid{grid-template-columns:1fr 1fr}
  .footer-brand{grid-column:1/-1}
}

@media(max-width:760px){
  .topbar-inner,.hero-grid,.live-chain-mount,#app,.status-banner,.footer-inner{width:min(100% - 24px,var(--max))}
  .brandtext small{font-size:.56rem;letter-spacing:.1em}
  .hero h1{font-size:clamp(2.55rem,14vw,4rem)}
  .hero p{font-size:.94rem}
  .hero-console{padding:17px;border-radius:20px}
  .console-grid{grid-template-columns:1fr 1fr}
  .searchbar{padding:6px}
  .searchbar input{padding:11px 10px;font-size:.76rem}
  .searchbar button{padding:0 12px;font-size:.75rem}
  .stats-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
  .stat{min-height:104px;padding:14px}
  .stat .value{font-size:1.15rem}
  .section-card{padding:16px}
  .section-head{align-items:flex-start;flex-direction:column;margin-bottom:14px}
  .section-head> :last-child{align-self:flex-start}
  .network-observatory-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .mempool-summary-grid{grid-template-columns:repeat(2,minmax(0,1fr));padding:7px}
  .blocks-row{grid-template-columns:repeat(6,155px)}
  .route-title{grid-template-columns:1fr}
  .route-extra{justify-self:start}
  .footer-grid{grid-template-columns:1fr;gap:26px}
  .footer-brand{grid-column:auto}
  .footer-bottom{flex-direction:column}
  .footer-bottom small{text-align:left}
}

@media(max-width:480px){
  .top-actions select{min-width:58px}
  .brandmark{width:39px;height:39px}.brandmark img{width:42px;height:42px}
  .brand strong{font-size:.95rem}.brand small{display:none}
  .topnav{grid-template-columns:1fr}
  .nav-more{grid-column:auto}
  .hero{padding-top:38px}
  .hero h1{font-size:2.55rem}
  .hero-links>a{flex:1 1 auto;justify-content:center}
  .console-grid{grid-template-columns:1fr 1fr}
  .console-hint{display:none}
  .stats-grid{grid-template-columns:1fr 1fr}
  .network-observatory-grid{grid-template-columns:1fr}
  .mempool-summary-grid{grid-template-columns:1fr}
  .mempool-summary-grid .entity-metric{min-height:78px}
}

@media(prefers-reduced-motion:reduce){
  *,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}

/* Dashboard information hierarchy */
.dashboard-section-kicker{display:flex;align-items:baseline;gap:10px;margin:8px 0 12px;padding:0 2px;color:#7f98a8}
.dashboard-section-kicker span{color:#9be7d5;font-size:.72rem;font-weight:900;letter-spacing:.13em;text-transform:uppercase}
.dashboard-section-kicker small{font-size:.72rem;color:#71899a;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dashboard-section-secondary{margin-top:24px}
@media(max-width:760px){.dashboard-section-kicker{display:grid;gap:2px}.dashboard-section-kicker small{white-space:normal}}
.nav-more.is-current>.nav-more-button{background:#10232f;color:#fff}

@media(max-width:360px){.advanced-toggle{display:none}}

/* ---------- v0.14.0 interactive network / block / transaction layer ---------- */
.noscript-notice{width:min(calc(100% - 28px),var(--max));margin:16px auto;padding:12px 16px;border:1px solid rgba(255,201,97,.42);border-radius:14px;background:rgba(255,201,97,.08);color:#ffe2a1;font-weight:700}
.section-head-actions{gap:14px}.section-head-inline{display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:flex-end}
.explorer-toolbar{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:16px;padding:10px 12px;border:1px solid rgba(28,55,73,.74);border-radius:15px;background:rgba(7,18,27,.68)}
.filter-field{display:flex;align-items:center;gap:8px;min-width:min(460px,100%);padding:8px 11px;border:1px solid rgba(43,83,107,.85);border-radius:12px;background:#07131c;color:var(--soft)}
.filter-field:focus-within{border-color:rgba(67,224,183,.7);box-shadow:0 0 0 3px rgba(67,224,183,.07)}
.filter-field input{width:100%;border:0;outline:0;background:transparent;color:var(--text);font:inherit;font-size:.83rem}.filter-field input::placeholder{color:#688194}.toolbar-meta{font-size:.75rem;color:var(--muted);white-space:nowrap}.filter-hidden{display:none!important}.filter-empty{margin:15px 0;padding:18px;text-align:center;border:1px dashed rgba(43,83,107,.65);border-radius:14px;color:var(--muted)}

.block-tile{position:relative;overflow:hidden;cursor:pointer;outline:none}.block-tile:focus-visible{border-color:var(--accent);box-shadow:0 0 0 3px rgba(67,224,183,.12)}
.block-tile-head{display:flex;justify-content:space-between;align-items:center;gap:9px}.block-conf{font-size:.64rem;font-weight:900;letter-spacing:.05em;color:#98b3c5;background:rgba(7,18,27,.72);border:1px solid rgba(43,83,107,.7);padding:4px 7px;border-radius:999px;white-space:nowrap}
.block-capacity{margin-top:10px}.block-capacity>div:first-child{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:.68rem;color:#849aaa}.block-capacity strong{color:#dcebf3}.block-capacity-bar{height:6px;margin-top:5px;overflow:hidden;border-radius:99px;background:#07131b;border:1px solid rgba(43,83,107,.45)}.block-capacity-bar i{display:block;height:100%;width:var(--fill,0%);border-radius:inherit;background:linear-gradient(90deg,var(--accent2),var(--accent))}.block-capacity-bar.large{height:9px;margin:8px 0}
.block-quick-actions{display:flex;gap:7px;margin-top:11px;opacity:.2;transform:translateY(4px);transition:.18s}.block-tile:hover .block-quick-actions,.block-tile:focus-within .block-quick-actions{opacity:1;transform:none}.block-quick-actions .mini-action{flex:1;justify-content:center}
.block-capacity-detail{margin-top:14px;padding:13px 15px;border-top:1px solid rgba(28,55,73,.6)}.block-capacity-detail-head{display:flex;justify-content:space-between;align-items:center}.block-capacity-detail-head span{color:var(--muted);font-size:.75rem}.block-capacity-detail-head strong{font-size:.9rem}.block-capacity-detail small{color:var(--soft);font-size:.7rem}
.block-route-tools,.tx-detail-toolbar{align-items:center;flex-wrap:wrap}.block-nav-actions{display:flex;gap:6px;flex-wrap:wrap}.copy-action{gap:6px}.copy-action.icon-only{min-width:32px;padding:5px 7px}.copy-action.icon-only span{display:none}

.mining-observatory-card{position:relative;overflow:hidden;background:radial-gradient(circle at 86% 0,rgba(67,224,183,.08),transparent 32%),linear-gradient(180deg,#0c1924,#09141e)}
.mining-metric-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px}.mining-paths{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:14px}.mining-path{padding:15px;border:1px solid rgba(43,83,107,.68);border-radius:15px;background:rgba(7,18,27,.64)}.mining-path-head{display:flex;justify-content:space-between;gap:10px;align-items:flex-start}.mining-path h3{margin:0;font-size:.9rem}.mining-path p{margin:8px 0 0;color:var(--muted);font-size:.76rem}.mining-path code{display:block;margin-top:9px;padding:7px 9px;border-radius:9px;background:#050d14;color:#b9f5e7;font-size:.72rem;overflow-wrap:anywhere}.mining-risk-note{display:flex;gap:9px;align-items:flex-start;margin-top:13px;padding:10px 12px;border-radius:12px;background:rgba(255,201,97,.055);border:1px solid rgba(255,201,97,.2);font-size:.73rem;color:#c6b58c}
.network-detail-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.network-detail-grid>.card{min-width:0}.peer-bars{display:grid;gap:9px;margin-top:14px}.peer-bar-row{display:grid;grid-template-columns:90px minmax(0,1fr) 48px;align-items:center;gap:8px;font-size:.73rem;color:var(--muted)}.peer-bar{height:7px;border-radius:99px;background:#07131b;overflow:hidden}.peer-bar i{display:block;height:100%;width:var(--w,0%);background:linear-gradient(90deg,var(--accent2),var(--accent));border-radius:inherit}.observer-note{margin-top:12px;padding:9px 10px;border-radius:10px;background:rgba(99,170,252,.05);border:1px solid rgba(99,170,252,.16);color:#829bad;font-size:.7rem}

.tx-lifecycle-card{overflow:hidden}.tx-lifecycle{display:grid;grid-template-columns:minmax(0,1fr) 80px minmax(0,1fr) 80px minmax(0,1fr);align-items:center;gap:0;padding:8px 4px}.tx-life-step{display:flex;align-items:center;gap:10px;min-width:0}.tx-life-step i{display:grid;place-items:center;width:31px;height:31px;flex:0 0 31px;border-radius:50%;border:1px solid rgba(67,224,183,.55);background:rgba(67,224,183,.1);color:#c9fff1;font-style:normal;font-size:.72rem;font-weight:900}.tx-life-step.pending i{border-color:rgba(43,83,107,.65);background:#091722;color:#6d8798}.tx-life-step div{display:grid;min-width:0}.tx-life-step strong{font-size:.76rem}.tx-life-step span{font-size:.68rem;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tx-life-line{height:2px;background:#1a3242;margin:0 10px}.tx-life-line.active{background:linear-gradient(90deg,var(--accent2),var(--accent))}
.tx-flow-card{overflow:hidden}.tx-flow{display:grid;grid-template-columns:minmax(0,1fr) 220px minmax(0,1fr);gap:14px;align-items:stretch}.tx-flow-column{display:grid;gap:7px;align-content:start}.tx-flow-label{display:flex;justify-content:space-between;align-items:center;padding:0 2px 5px;color:#8fa7b8;font-size:.7rem;font-weight:900;letter-spacing:.08em;text-transform:uppercase}.tx-flow-label span{color:#cce0ea}.tx-flow-party{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:7px;align-items:center;padding:10px;border:1px solid rgba(43,83,107,.55);border-radius:12px;background:rgba(6,16,24,.72);min-width:0}.tx-flow-party-main{display:grid;gap:3px;min-width:0}.tx-flow-party-main>a,.tx-flow-party-main>span{font-size:.73rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tx-flow-party strong{font-size:.7rem;white-space:nowrap}.tx-flow-role{display:block;margin-top:2px}.tx-flow-more{padding:8px;text-align:center;color:var(--soft);font-size:.7rem;border:1px dashed rgba(43,83,107,.45);border-radius:10px}.tx-flow-center{position:relative;display:grid;place-items:center;align-content:center;gap:10px;min-height:220px}.tx-flow-node{display:grid;gap:4px;width:100%;padding:18px;text-align:center;border:1px solid rgba(67,224,183,.38);border-radius:18px;background:radial-gradient(circle at 50% 0,rgba(67,224,183,.11),transparent 56%),#07141d;box-shadow:0 18px 50px rgba(0,0,0,.18)}.tx-flow-node>span{font-size:.65rem;font-weight:950;letter-spacing:.16em;color:var(--accent)}.tx-flow-node strong{font-size:.77rem}.tx-flow-node small{font-size:.68rem;color:var(--muted)}.tx-flow-arrow{position:absolute;top:42%;font-size:1.25rem;color:#4fbdac}.tx-flow-arrow.left{left:-4px}.tx-flow-arrow.right{right:-4px}.tx-flow-balance{display:grid;grid-template-columns:auto 1fr;gap:3px 9px;width:100%;font-size:.65rem;color:var(--muted)}.tx-flow-balance strong{text-align:right;color:#dceaf3}.fee-reference{display:grid;gap:1px;min-width:160px;padding:7px 10px;border-radius:11px;background:#07131c;border:1px solid rgba(43,83,107,.58)}.fee-reference span,.fee-reference small{font-size:.62rem;color:var(--muted)}.fee-reference strong{font-size:.77rem}.fee-reference.blue{border-color:rgba(67,224,183,.28)}.fee-reference.gold{border-color:rgba(255,201,97,.3)}

@media(max-width:1180px){.mining-metric-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.network-detail-grid{grid-template-columns:1fr 1fr}.network-detail-grid>*:last-child{grid-column:1/-1}.tx-flow{grid-template-columns:minmax(0,1fr) 180px minmax(0,1fr)}}
@media(max-width:900px){.mining-paths{grid-template-columns:1fr}.tx-flow{grid-template-columns:1fr}.tx-flow-center{min-height:auto;padding:10px 0}.tx-flow-arrow{display:none}.tx-lifecycle{grid-template-columns:1fr}.tx-life-line{height:24px;width:2px;margin:3px 0 3px 15px}.network-detail-grid{grid-template-columns:1fr}.network-detail-grid>*:last-child{grid-column:auto}}
@media(max-width:760px){.explorer-toolbar{align-items:stretch;flex-direction:column}.filter-field{min-width:0;width:100%}.toolbar-meta{white-space:normal}.mining-metric-grid{grid-template-columns:1fr 1fr}.block-quick-actions{opacity:1;transform:none}.block-route-tools{display:grid!important;gap:8px}.block-nav-actions{width:100%}.tx-flow-party{grid-template-columns:minmax(0,1fr) auto}.tx-flow-party .copy-action{grid-column:1/-1;justify-self:start}.section-head-inline{justify-content:flex-start}.fee-reference{min-width:0}.peer-bar-row{grid-template-columns:78px minmax(0,1fr) 42px}}
@media(max-width:480px){.mining-metric-grid{grid-template-columns:1fr}.tx-life-step span{white-space:normal}.block-nav-actions{display:grid;grid-template-columns:1fr 1fr}.block-nav-actions .mini-action{justify-content:center}}
/* v0.14 markup alignment */
.block-capacity-bar i{width:var(--fill,var(--w,0%))}
.network-observatory-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
.mining-path{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:12px;align-items:start;text-decoration:none;color:inherit}
.mining-path>span{display:grid;place-items:center;width:30px;height:30px;border-radius:9px;background:rgba(67,224,183,.08);border:1px solid rgba(67,224,183,.2);color:var(--accent);font-size:.68rem;font-weight:900}
.mining-path>div{display:grid;gap:5px;min-width:0}.mining-path b{font-size:.82rem}.mining-path code{margin-top:1px}.mining-path small{font-size:.68rem;color:var(--muted);line-height:1.45}.mining-path>i{font-style:normal;color:var(--accent);transition:.18s}.mining-path:hover{border-color:rgba(67,224,183,.5);transform:translateY(-2px)}.mining-path:hover>i{transform:translate(2px,-2px)}
.mining-caveat{display:flex;align-items:flex-start;gap:9px;margin-top:13px;padding:10px 12px;border-radius:12px;background:rgba(255,201,97,.055);border:1px solid rgba(255,201,97,.2);color:#c6b58c}.mining-caveat p{margin:0;font-size:.73rem}
.peer-total{display:flex;align-items:baseline;gap:8px;margin-top:4px}.peer-total strong{font-size:2rem;line-height:1}.peer-total span{font-size:.72rem;color:var(--muted)}
.peer-bars>div{display:grid;gap:5px}.peer-bars>div>span{display:flex;justify-content:space-between;gap:8px;font-size:.7rem;color:var(--muted)}.peer-bars>div>i{display:block;height:7px;border-radius:99px;background:#07131b;overflow:hidden}.peer-bars>div>i>em{display:block;width:var(--w,0%);height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--accent2),var(--accent))}
.network-detail-panel .kv code{overflow-wrap:anywhere}
@media(max-width:1280px){.network-observatory-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:760px){.network-observatory-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:480px){.network-observatory-grid{grid-template-columns:1fr}}
.consensus-facts-card{margin-top:12px;background:radial-gradient(circle at 100% 0,rgba(99,170,252,.07),transparent 34%),linear-gradient(180deg,#0c1924,#09141e)}
.consensus-facts-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px}.consensus-facts-grid .entity-metric{min-height:94px;border:1px solid rgba(43,83,107,.58);border-radius:14px;background:rgba(7,18,27,.62)}
@media(max-width:1180px){.consensus-facts-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:540px){.consensus-facts-grid{grid-template-columns:1fr}}