/* NetCoin public-site shell: deploy-ready navigation and visual system. */
:root{
  color-scheme:dark;
  --bg:#070a0f;
  --surface:#0d121a;
  --surface-2:#121923;
  --surface-3:#172131;
  --line:#273244;
  --line-soft:rgba(148,163,184,.18);
  --fg:#eef3f8;
  --mut:#9aa8b8;
  --mut-2:#c7d0dc;
  --accent:#3ddc97;
  --accent-2:#70a7ff;
  --warn:#ffcc66;
  --err:#ff6b6b;
  --shadow:0 18px 48px rgba(0,0,0,.28);
  --radius:8px;
  --pad:clamp(16px,2vw,32px);
  --max:1480px;
}

*{box-sizing:border-box}
html{background:var(--bg)!important;scroll-behavior:smooth!important}
body{
  min-height:100vh!important;
  margin:0!important;
  color:var(--fg)!important;
  background:linear-gradient(180deg,#0b1018 0,#070a0f 48%,#05070b 100%)!important;
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif!important;
  letter-spacing:0!important;
}

a{color:inherit}
.shell,.wrap{
  width:100%!important;
  max-width:min(var(--max),calc(100vw - 24px))!important;
  margin:0 auto!important;
  padding:22px var(--pad) 64px!important;
}

.topbar{
  display:grid!important;
  grid-template-columns:minmax(230px,auto) minmax(0,1fr)!important;
  grid-template-areas:
    "brand nav"
    "tools tools"!important;
  align-items:center!important;
  gap:14px 18px!important;
  margin:0 0 24px!important;
  overflow:visible!important;
}
.brand{
  grid-area:brand!important;
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
  min-width:0!important;
  margin:0!important;
}
.brand .logo,.logo{
  width:36px!important;
  height:36px!important;
  flex:0 0 36px!important;
  border-radius:8px!important;
  display:grid!important;
  place-items:center!important;
  color:#06130b!important;
  background:linear-gradient(135deg,var(--accent),var(--accent-2))!important;
  font-weight:900!important;
}
.brand h1,.brand>div:last-child{
  margin:0!important;
  min-width:0!important;
  color:var(--fg)!important;
  font-size:18px!important;
  line-height:1.12!important;
  font-weight:850!important;
  letter-spacing:0!important;
}
.brand h1{font-size:24px!important}
.brand h1 span{color:var(--accent)!important}
.brand small,.sub{
  display:block!important;
  margin-top:4px!important;
  color:var(--mut)!important;
  font-size:12px!important;
  font-weight:650!important;
  line-height:1.35!important;
  letter-spacing:0!important;
}

.site-nav{
  grid-area:nav!important;
  display:flex!important;
  justify-content:flex-end!important;
  align-items:center!important;
  gap:8px!important;
  margin:0!important;
  padding:0!important;
  overflow-x:auto!important;
  overflow-y:visible!important;
  scrollbar-width:none!important;
}
.site-nav::-webkit-scrollbar{display:none}
.site-nav a,.site-nav summary,.site-tools-more summary,.site-settings summary,.ecosystem-toggle{
  min-height:38px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:7px!important;
  padding:8px 13px!important;
  border:1px solid var(--line)!important;
  border-radius:8px!important;
  background:rgba(255,255,255,.026)!important;
  color:var(--fg)!important;
  text-decoration:none!important;
  white-space:nowrap!important;
  font-size:13px!important;
  font-weight:760!important;
  line-height:1!important;
  letter-spacing:0!important;
  cursor:pointer!important;
}
.site-nav a:hover,.site-nav summary:hover,.site-tools-more summary:hover,.site-settings summary:hover,.ecosystem-toggle:hover{
  border-color:rgba(61,220,151,.65)!important;
  background:rgba(61,220,151,.08)!important;
  text-decoration:none!important;
}
.site-nav a.active,.site-nav a[aria-current="page"]{
  border-color:var(--accent)!important;
  color:var(--accent)!important;
  background:rgba(61,220,151,.10)!important;
}
.site-nav .site-more{display:none!important}

.site-tools{
  grid-area:tools!important;
  display:grid!important;
  grid-template-columns:minmax(220px,1fr) minmax(280px,520px)!important;
  align-items:start!important;
  gap:12px!important;
  width:100%!important;
  margin:0!important;
}
.site-context{
  min-height:40px!important;
  display:flex!important;
  align-items:center!important;
  gap:9px!important;
  min-width:0!important;
  color:var(--mut)!important;
  font-size:13px!important;
}
.site-context span{
  color:var(--mut)!important;
  font-size:12px!important;
  font-weight:800!important;
}
.site-context strong{
  color:var(--fg)!important;
  font-size:13px!important;
}
.site-context small{
  min-width:0!important;
  color:var(--mut)!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}
.site-audience{display:none!important}

.site-search{
  justify-self:end!important;
  width:min(520px,100%)!important;
  min-width:0!important;
  display:flex!important;
  align-items:center!important;
  gap:8px!important;
  margin:0!important;
}
.site-search input{
  width:100%!important;
  min-width:0!important;
  height:40px!important;
  margin:0!important;
  border:1px solid var(--line)!important;
  border-radius:8px!important;
  background:#090e15!important;
  color:var(--fg)!important;
  padding:0 14px!important;
}
.site-search button{
  width:auto!important;
  min-width:84px!important;
  height:40px!important;
  margin:0!important;
  border-radius:8px!important;
  padding:0 16px!important;
}

.site-tools-more,.site-settings{position:relative!important;display:inline-flex!important;flex:0 0 auto!important}
.site-tools-more summary{border-color:rgba(61,220,151,.55)!important;color:var(--accent)!important}
.site-settings summary{border-color:rgba(112,167,255,.45)!important;color:var(--mut-2)!important}
.site-tools-more summary::-webkit-details-marker,.site-settings summary::-webkit-details-marker{display:none!important}
.site-tools-more[open] summary,.site-settings[open] summary{background:var(--accent)!important;border-color:var(--accent)!important;color:#06130b!important}
.site-more-panel,.site-settings-panel{
  position:fixed!important;
  top:116px!important;
  right:clamp(12px,2vw,32px)!important;
  z-index:10000!important;
  max-height:calc(100vh - 140px)!important;
  overflow:auto!important;
  padding:12px!important;
  border:1px solid var(--line)!important;
  border-radius:8px!important;
  background:rgba(10,14,21,.98)!important;
  box-shadow:var(--shadow)!important;
}
.site-more-panel{
  width:min(780px,calc(100vw - 24px))!important;
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:10px!important;
}
.site-more-panel a{
  display:block!important;
  min-height:78px!important;
  border:1px solid var(--line-soft)!important;
  border-radius:8px!important;
  padding:12px!important;
  background:linear-gradient(180deg,rgba(255,255,255,.042),rgba(255,255,255,.018))!important;
  text-decoration:none!important;
  font-weight:850!important;
  color:var(--fg)!important;
}
.site-more-panel a:hover{border-color:var(--accent)!important;background:rgba(61,220,151,.08)!important}
.site-more-panel a.active{border-color:var(--accent)!important}
.site-more-panel a small{
  display:block!important;
  margin-top:5px!important;
  color:var(--mut)!important;
  font-size:12px!important;
  font-weight:650!important;
  line-height:1.35!important;
}
.site-settings-panel{
  width:min(360px,calc(100vw - 24px))!important;
}
.site-settings-panel label{
  display:block!important;
  margin:0 0 6px!important;
  color:var(--mut-2)!important;
  font-size:13px!important;
  font-weight:800!important;
}
.site-settings-panel select{
  width:100%!important;
  margin:0 0 10px!important;
}
.site-settings-panel p{
  margin:8px 0 0!important;
  color:var(--mut)!important;
  font-size:13px!important;
  line-height:1.45!important;
}
.site-settings-note code{
  padding:1px 5px!important;
  border-radius:6px!important;
}

.card,.stat,.biglink,.notice,.warn,.statusbar,.checkout-box,.review{
  border:1px solid var(--line)!important;
  background:linear-gradient(180deg,rgba(255,255,255,.044),rgba(255,255,255,.018))!important;
  box-shadow:0 14px 36px rgba(0,0,0,.18)!important;
}
.card{
  border-radius:var(--radius)!important;
  padding:clamp(16px,1.45vw,22px)!important;
}
.card h2{
  color:var(--fg)!important;
  letter-spacing:0!important;
  text-transform:none!important;
  font-size:16px!important;
  line-height:1.25!important;
}
.hero,.dashboard-hero{
  display:grid!important;
  grid-template-columns:minmax(0,1.25fr) minmax(280px,.75fr)!important;
  gap:16px!important;
  align-items:stretch!important;
  margin:0 0 16px!important;
}
.hero h1,.dashboard-hero h1,.lead h1{
  font-size:clamp(34px,4vw,58px)!important;
  line-height:1.03!important;
  letter-spacing:0!important;
  margin:8px 0 12px!important;
}
.hero p,.dashboard-hero p,.lead p{
  color:var(--mut-2)!important;
  max-width:72ch!important;
  line-height:1.55!important;
}
.grid,.dashboard-grid{
  display:grid!important;
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr))!important;
  gap:14px!important;
  margin:0 0 16px!important;
}
.split{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:14px!important;
  margin:0 0 16px!important;
}
.biglink{
  display:block!important;
  min-height:0!important;
  border-radius:var(--radius)!important;
  padding:16px!important;
  text-decoration:none!important;
}
.biglink b{display:block!important;margin-bottom:6px!important;color:var(--fg)!important}
.biglink span{display:block!important;color:var(--mut)!important;line-height:1.45!important}
.biglink:hover{border-color:rgba(61,220,151,.65)!important;text-decoration:none!important}
.actions{display:flex!important;flex-wrap:wrap!important;gap:8px!important;align-items:center!important}
.pill,button,.actions a{
  border-radius:8px!important;
  letter-spacing:0!important;
}
.pill{
  display:inline-flex!important;
  align-items:center!important;
  gap:7px!important;
  border:1px solid var(--line)!important;
  background:rgba(61,220,151,.08)!important;
  color:var(--fg)!important;
  text-decoration:none!important;
  padding:7px 11px!important;
  font-size:12px!important;
  font-weight:800!important;
}
.pill:hover{border-color:var(--accent)!important;color:var(--accent)!important;text-decoration:none!important}

input,textarea,select{
  border-color:var(--line)!important;
  background:#090e15!important;
  color:var(--fg)!important;
  border-radius:8px!important;
}
button,.button{
  border:1px solid var(--line)!important;
  background:var(--accent)!important;
  color:#06130b!important;
  font-weight:850!important;
}
button.secondary,.ghost{background:transparent!important;color:var(--fg)!important}
pre,code{
  border-radius:8px!important;
  background:rgba(0,0,0,.25)!important;
  border-color:var(--line-soft)!important;
}
table{border-color:var(--line)!important}
th{color:var(--mut-2)!important;background:rgba(255,255,255,.035)!important}
td,th{border-color:var(--line-soft)!important}
.muted,.footer{color:var(--mut)!important}
.footer{
  margin:20px 0 0!important;
  font-size:13px!important;
  line-height:1.45!important;
}
.mode-hidden{display:none!important}
.site-status-pill{display:none!important}

.github-quickstart{
  margin:18px 0 12px!important;
  border:1px solid var(--line-soft)!important;
  background:rgba(255,255,255,.025)!important;
}
.github-quickstart details{width:100%!important}
.github-quickstart summary{cursor:pointer!important;font-weight:850!important;color:var(--fg)!important}
.github-quickstart-grid{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(260px,1fr))!important;gap:12px!important;margin-top:12px!important}
.github-quickstart h2{font-size:14px!important;margin:0 0 8px!important}
.github-quickstart pre{white-space:pre-wrap!important;overflow:auto!important;max-height:240px!important;font-size:12px!important;line-height:1.45!important;padding:12px!important}
.github-quickstart-note{grid-column:1/-1!important;margin:0!important;line-height:1.45!important}

@media (max-width:980px){
  .shell,.wrap{max-width:100%!important;padding:16px 14px 52px!important}
  .topbar{
    grid-template-columns:1fr!important;
    grid-template-areas:"brand" "nav" "tools"!important;
    gap:10px!important;
  }
  .site-nav{justify-content:flex-start!important;padding-bottom:4px!important}
  .site-tools{grid-template-columns:1fr!important}
  .site-context small{white-space:normal!important}
  .site-search{justify-self:stretch!important;width:100%!important}
  .site-more-panel,.site-settings-panel{left:12px!important;right:12px!important;top:126px!important;width:auto!important}
  .site-more-panel{grid-template-columns:1fr!important}
  .hero,.dashboard-hero,.split{grid-template-columns:1fr!important}
  .hero h1,.dashboard-hero h1,.lead h1{font-size:clamp(30px,10vw,42px)!important}
}

@media (min-width:1500px){
  :root{--max:1600px}
  .grid,.dashboard-grid{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))!important}
}

/* NetCoin sleek UI pass 20260708: compact, modern, feature-complete. */
:root{
  --bg:#05070b!important;
  --surface:#0b111a!important;
  --surface-2:#0f1724!important;
  --surface-3:#141f2e!important;
  --line:#223044!important;
  --line-soft:rgba(148,163,184,.16)!important;
  --fg:#f4f7fb!important;
  --mut:#8fa1b5!important;
  --mut-2:#c8d4e3!important;
  --accent:#45f0a5!important;
  --accent-2:#7fb5ff!important;
  --radius:16px!important;
  --shadow:0 18px 50px rgba(0,0,0,.28)!important;
}
body{
  background:
    radial-gradient(circle at 12% -8%,rgba(69,240,165,.14),transparent 32%),
    radial-gradient(circle at 88% 2%,rgba(127,181,255,.11),transparent 28%),
    linear-gradient(180deg,#080c13,#05070b 58%,#04060a)!important;
}
.shell,.wrap{max-width:min(1320px,calc(100vw - 32px))!important;padding:18px clamp(14px,2vw,28px) 56px!important}
.topbar{grid-template-columns:auto minmax(0,1fr)!important;gap:12px 16px!important;margin-bottom:12px!important}
.brand .logo,.logo{border-radius:14px!important;box-shadow:0 12px 30px rgba(69,240,165,.18)!important}
.brand h1,.brand>div:last-child{font-size:18px!important}.brand small,.sub{font-size:11px!important;color:var(--mut)!important}
.site-nav{gap:7px!important}.site-nav a,.site-nav summary,.site-tools-more summary,.site-settings summary{min-height:34px!important;padding:7px 11px!important;border-radius:999px!important;font-size:12px!important;background:rgba(255,255,255,.035)!important}.site-nav a.active{background:rgba(69,240,165,.12)!important}
.site-tools{grid-template-columns:minmax(180px,.75fr) minmax(260px,440px)!important;gap:10px!important;margin-top:2px!important}.site-context{min-height:34px!important}.site-context small{font-size:12px!important}.site-search input,.site-search button{height:36px!important;border-radius:999px!important}.site-search button{min-width:58px!important;padding:0 13px!important}
.feature-dock{display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:10px!important;margin:10px 0 18px!important}.feature-group{border:1px solid var(--line-soft)!important;border-radius:18px!important;background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.018))!important;padding:11px!important;min-width:0!important}.feature-group>b{display:block!important;color:var(--fg)!important;font-size:12px!important;margin-bottom:8px!important}.feature-group>div{display:flex!important;flex-wrap:wrap!important;gap:6px!important}.feature-group a{display:inline-flex!important;align-items:center!important;min-height:26px!important;border:1px solid rgba(148,163,184,.14)!important;border-radius:999px!important;padding:5px 8px!important;color:var(--mut-2)!important;text-decoration:none!important;font-size:11px!important;font-weight:750!important;background:rgba(0,0,0,.16)!important}.feature-group a:hover{border-color:var(--accent)!important;color:var(--accent)!important;text-decoration:none!important}
.site-more-panel{border-radius:18px!important;grid-template-columns:repeat(4,minmax(0,1fr))!important}.site-more-panel a{min-height:64px!important;border-radius:14px!important}.site-more-panel a small{font-size:11px!important;line-height:1.25!important}
.card,.stat,.biglink,.notice,.warn,.statusbar,.checkout-box,.review{border-radius:18px!important;background:linear-gradient(180deg,rgba(255,255,255,.052),rgba(255,255,255,.018))!important;box-shadow:0 14px 40px rgba(0,0,0,.20)!important}.card{padding:clamp(15px,1.35vw,20px)!important}.card h2{font-size:15px!important;margin-bottom:8px!important}.hero,.dashboard-hero{gap:13px!important;margin-bottom:13px!important}.hero h1,.dashboard-hero h1,.lead h1{font-size:clamp(30px,3.6vw,48px)!important;margin:6px 0 8px!important}.hero p,.dashboard-hero p,.lead p{font-size:15px!important;line-height:1.45!important;margin-bottom:10px!important}.muted{line-height:1.45!important}.grid,.dashboard-grid,.split{gap:13px!important}.biglink{padding:15px!important}.biglink span{font-size:13px!important}.pill{border-radius:999px!important;padding:6px 10px!important}.footer{font-size:12px!important;color:var(--mut)!important}.github-quickstart{display:none!important}
@media (max-width:1100px){.feature-dock{grid-template-columns:repeat(2,minmax(0,1fr))!important}.site-tools{grid-template-columns:1fr!important}.site-more-panel{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media (max-width:640px){.shell,.wrap{max-width:100%!important;padding:14px 12px 48px!important}.topbar{grid-template-columns:1fr!important;grid-template-areas:"brand" "nav" "tools"!important}.feature-dock{display:flex!important;overflow-x:auto!important;padding-bottom:4px!important}.feature-group{min-width:230px!important}.site-more-panel{grid-template-columns:1fr!important}.site-search{display:none!important}}
