/* DobbsCoin pool theme — neon-mono, mobile-first */
:root{
  --bg:#0a0a0a;
  --panel:#0f0f0f;
  --panel-2:rgba(15,15,15,.95);
  --ink:#c9ffdf;
  --ink-mute:rgba(201,255,223,.65);
  --green:#39ff88;
  --cyan:#7ffcff;
  --gold:#ffd700;
  --orange:#ff9900;
  --line:rgba(57,255,136,.35);
  --line-soft:rgba(57,255,136,.18);
  --danger:#ff5c5c;
}

*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{
  font-family:'IBM Plex Mono', ui-monospace, 'SF Mono', Menlo, Consolas, monospace;
  background:
    radial-gradient(900px 500px at 20% 0%, rgba(57,255,136,.10), transparent 60%),
    radial-gradient(900px 500px at 80% 10%, rgba(127,252,255,.08), transparent 55%),
    var(--bg);
  background-attachment: fixed;
  color:var(--ink);
  min-height:100vh;
  font-size:14px;
  line-height:1.5;
}

a{color:var(--cyan); text-decoration:none;}
a:hover{text-decoration:underline; color:var(--green);}

h1,h2,h3{margin:0 0 8px 0; color:var(--green); font-weight:600; letter-spacing:.5px;}
h1{font-size:18px;}
h2{font-size:15px;}
h3{font-size:13px;}

hr{border:0; border-top:1px dashed var(--line-soft); margin:16px 0;}

code,pre{font-family:inherit; color:var(--cyan);}

/* Layout */
.wrap{max-width:1200px; margin:0 auto; padding:14px;}

/* Header / nav */
.header{
  margin:6px 0 16px 0;
  padding:14px 16px;
  border:1px solid var(--line);
  border-radius:12px;
  background:linear-gradient(180deg, rgba(15,15,15,.92), rgba(10,10,10,.7));
  box-shadow:0 0 0 1px rgba(127,252,255,.10) inset, 0 0 30px rgba(57,255,136,.08);
}
.header .title{
  display:flex; align-items:baseline; gap:10px; flex-wrap:wrap;
}
.header h1{
  margin:0; color:var(--gold); letter-spacing:.5px;
  font-size:clamp(16px, 3.4vw, 22px);
}
.header h1 .accent{color:var(--green);}
.header .sub{color:var(--ink-mute); font-size:12px;}

.nav{
  margin-top:12px;
  display:flex; gap:6px; flex-wrap:wrap;
}
.nav a{
  display:inline-block;
  padding:7px 12px;
  border:1px solid var(--line-soft);
  border-radius:999px;
  color:var(--ink);
  background:rgba(15,15,15,.6);
  font-size:12px;
  letter-spacing:.5px;
  text-transform:uppercase;
}
.nav a:hover{ border-color:var(--green); color:var(--green); text-decoration:none; background:rgba(57,255,136,.08);}
.nav a.active{ border-color:var(--green); color:var(--green); background:rgba(57,255,136,.10);}

/* Cards */
.card{
  border:1px solid var(--line);
  background:linear-gradient(180deg, var(--panel-2), rgba(10,10,10,.78));
  border-radius:12px;
  padding:14px 16px;
  margin-bottom:14px;
  box-shadow:0 0 0 1px rgba(127,252,255,.06) inset, 0 0 18px rgba(57,255,136,.05);
}
.card h2{
  display:flex; justify-content:space-between; align-items:center;
  margin-bottom:10px;
  border-bottom:1px dashed var(--line-soft);
  padding-bottom:8px;
}
.card h2 .meta{font-size:11px; color:var(--ink-mute); font-weight:400;}

/* Stat tiles */
.tiles{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(140px, 1fr));
  gap:10px;
}
.tile{
  border:1px solid var(--line-soft);
  background:rgba(7,7,7,.7);
  border-radius:10px;
  padding:10px 12px;
}
.tile .label{
  font-size:10px; letter-spacing:1px;
  text-transform:uppercase;
  color:var(--ink-mute);
  margin-bottom:4px;
}
.tile .value{
  color:var(--green);
  font-size:clamp(15px, 2.4vw, 20px);
  font-weight:600;
  font-variant-numeric: tabular-nums;
  word-break:break-word;
}
.tile.gold .value{color:var(--gold);}
.tile.cyan .value{color:var(--cyan);}

/* Tables — responsive */
.tbl-wrap{ overflow-x:auto; -webkit-overflow-scrolling:touch; margin:0 -4px;}
table.tbl{
  width:100%;
  border-collapse:collapse;
  font-size:12px;
  font-variant-numeric: tabular-nums;
}
table.tbl th, table.tbl td{
  padding:8px 10px;
  text-align:left;
  border-bottom:1px dashed var(--line-soft);
  white-space:nowrap;
}
table.tbl th{
  color:var(--ink-mute);
  font-weight:600;
  font-size:10px;
  letter-spacing:1px;
  text-transform:uppercase;
  border-bottom:1px solid var(--line);
}
table.tbl tbody tr:hover{ background:rgba(57,255,136,.04); }
table.tbl td.num{ text-align:right; color:var(--green); }
table.tbl td.gold{ color:var(--gold); }
table.tbl td.muted{ color:var(--ink-mute); }
table.tbl td.mono{ font-family:inherit; }

/* Status pills */
.pill{
  display:inline-block;
  padding:1px 8px;
  border-radius:999px;
  font-size:10px;
  letter-spacing:.5px;
  text-transform:uppercase;
  border:1px solid currentColor;
}
.pill.ok{ color:var(--green); }
.pill.warn{ color:var(--gold); }
.pill.bad{ color:var(--danger); }

/* Forms / inputs (for connect page) */
input, textarea, select{
  width:100%;
  padding:12px;
  background:#070707;
  color:var(--ink);
  border:1px solid rgba(127,252,255,.22);
  border-radius:10px;
  outline:none;
  font-family:inherit;
  font-size:14px;
}
input:focus, textarea:focus, select:focus{ border-color:var(--green); box-shadow:0 0 0 2px rgba(57,255,136,.12); }
label{
  display:block;
  margin-top:10px; margin-bottom:6px;
  color:rgba(201,255,223,.9);
  font-size:11px; letter-spacing:.8px; text-transform:uppercase;
}
button, .btn{
  width:auto;
  padding:10px 16px;
  background:linear-gradient(180deg, rgba(57,255,136,.25), rgba(57,255,136,.12));
  border:1px solid rgba(57,255,136,.55);
  color:var(--green);
  font-weight:600;
  border-radius:10px;
  font-family:inherit;
  font-size:14px;
  cursor:pointer;
}
button:hover, .btn:hover{ background:linear-gradient(180deg, rgba(57,255,136,.35), rgba(57,255,136,.18)); text-decoration:none; }
button:active{transform:translateY(1px);}

/* Inline copyable */
.copy-block{
  display:flex; align-items:center; gap:8px;
  background:#070707;
  border:1px solid rgba(127,252,255,.22);
  border-radius:10px;
  padding:10px 12px;
  font-size:13px;
}
.copy-block code{ color:var(--cyan); flex:1; word-break:break-all;}
.copy-block .copy-btn{
  flex:0 0 auto;
  padding:4px 10px; font-size:11px;
  border:1px solid var(--line); background:rgba(57,255,136,.10);
  color:var(--green); border-radius:6px; cursor:pointer;
}

/* Charts */
.ct-chart{ background:transparent; }
.ct-chart .ct-grid{ stroke:rgba(57,255,136,.10); stroke-dasharray:2px; }
.ct-chart .ct-label{ fill:var(--ink-mute); color:var(--ink-mute); font-size:10px;}
.ct-chart .ct-line{ stroke:var(--green); stroke-width:2px; }
.ct-chart .ct-area{ fill:rgba(57,255,136,.18); }
.ct-chart .ct-point{ stroke:var(--cyan); stroke-width:6px; }

/* Footer */
.footer{
  margin:20px 0 6px;
  padding:10px;
  font-size:11px;
  color:var(--ink-mute);
  text-align:center;
}

/* Mobile tweaks */
@media (max-width: 600px) {
  .wrap{ padding:10px; }
  .header{ padding:12px 12px; }
  .nav a{ padding:6px 10px; font-size:11px; }
  .card{ padding:12px; }
  .tiles{ grid-template-columns:repeat(2, 1fr); gap:8px; }
  .tile .value{ font-size:16px;}
  table.tbl th, table.tbl td{ padding:6px 8px; }
}
