/* status.trdn.io — austere dark dashboard */

:root[data-theme="dark"]{
  --bg:#000000;
  --bg2:#0A0A0A;
  --bg3:#09090B;
  --c1:#18181B;
  --c2:#262626;
  --tw:#FFFFFF;
  --tn:#FAFAFA;
  --tm:#E5E7EB;
  --tt:#D1D5DB;
  --a1:#666666;
  --a2:#737373;
  --a3:#8E8E8E;
  --border:#27272A;
  --line:#292929;

  --ok:#10b981;
  --warn:#f59e0b;
  --down:#ef4444;
  --loading:#737373;
}

*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{
  background:var(--bg);
  color:var(--tm);
  font-family:'Exo 2',sans-serif;
  font-weight:300;
  line-height:1.5;
  min-height:100vh;
  -webkit-font-smoothing:antialiased;
}
::-webkit-scrollbar{width:3px;}
::-webkit-scrollbar-track{background:var(--bg);}
::-webkit-scrollbar-thumb{background:var(--a1);border-radius:2px;}

a{color:var(--tw);text-decoration:none;border-bottom:1px solid var(--border);transition:border-color .2s;}
a:hover{border-color:var(--tw);}

code{
  font-family:'Share Tech Mono',monospace;
  font-size:.85em;
  color:var(--tn);
  background:var(--c1);
  padding:1px 6px;
  border-radius:3px;
  border:1px solid var(--border);
}

/* ── Top bar ── */
.topbar{
  position:sticky;top:0;z-index:10;
  display:flex;align-items:center;justify-content:space-between;
  padding:20px 32px;
  background:rgba(0,0,0,0.92);
  backdrop-filter:blur(20px);
  border-bottom:1px solid var(--border);
}
.brand{
  display:flex;align-items:center;gap:10px;
  text-decoration:none;border:none;color:var(--tw);
  font-family:'Rajdhani',sans-serif;font-weight:700;
  font-size:1rem;letter-spacing:.2em;
}
.brand-mark{
  width:22px;height:18px;background:var(--tw);border-radius:5px;
  display:grid;place-items:center;
  font-size:.78rem;color:var(--bg);font-weight:700;
}
.brand-name{color:var(--tw);}
.brand-divider{color:var(--a2);}
.brand-page{color:var(--a3);font-weight:500;letter-spacing:.18em;}
.updated{
  font-family:'Share Tech Mono',monospace;
  font-size:.68rem;
  color:var(--a2);letter-spacing:.15em;text-transform:uppercase;
}

/* ── Main ── */
main{
  max-width:1100px;margin:0 auto;padding:40px 32px 64px;
}

/* ── Overall banner ── */
.banner{
  display:flex;align-items:center;gap:18px;
  padding:24px 28px;
  border:1px solid var(--border);
  border-radius:6px;
  background:var(--bg3);
  margin-bottom:48px;
  transition:border-color .3s;
}
.banner[data-status="ok"]{border-color:rgba(16,185,129,0.4);}
.banner[data-status="warn"]{border-color:rgba(245,158,11,0.4);}
.banner[data-status="down"]{border-color:rgba(239,68,68,0.4);}
.banner-indicator{flex-shrink:0;}
.banner-headline{
  font-family:'Rajdhani',sans-serif;font-weight:600;
  font-size:1.4rem;color:var(--tw);
  letter-spacing:.01em;
  margin-bottom:4px;
}
.banner-sub{
  font-size:.85rem;color:var(--tt);
  font-family:'Share Tech Mono',monospace;letter-spacing:.05em;
}

/* ── Status dots ── */
.dot{
  display:inline-block;width:12px;height:12px;border-radius:50%;
  background:var(--loading);
  flex-shrink:0;
  vertical-align:middle;
  transition:background .25s,box-shadow .25s;
}
.dot.ok{background:var(--ok);box-shadow:0 0 12px rgba(16,185,129,0.45);}
.dot.warn{background:var(--warn);box-shadow:0 0 12px rgba(245,158,11,0.45);}
.dot.down{background:var(--down);box-shadow:0 0 12px rgba(239,68,68,0.45);}
.dot-large{width:16px;height:16px;}
.banner-indicator .dot{width:16px;height:16px;}
.dot-pulse{animation:pulse 1.4s ease-in-out infinite;}
@keyframes pulse{
  0%,100%{opacity:1;transform:scale(1);}
  50%{opacity:.5;transform:scale(.85);}
}

/* ── Grid of region cards ── */
.grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
  gap:16px;
  margin-bottom:48px;
}
.card{
  background:var(--c1);
  border:1px solid var(--border);
  border-radius:6px;
  padding:20px 22px;
  transition:border-color .2s,background .2s;
}
.card:hover{border-color:var(--a2);background:#1c1c1f;}
.card-head{
  display:flex;align-items:center;justify-content:space-between;
  margin-bottom:8px;
}
.card-title{
  display:flex;align-items:center;gap:10px;
  font-family:'Rajdhani',sans-serif;font-weight:600;
  font-size:.95rem;color:var(--tw);letter-spacing:.02em;
}
.card-region{
  font-family:'Share Tech Mono',monospace;font-size:.62rem;
  color:var(--a2);letter-spacing:.15em;text-transform:uppercase;
  padding:2px 7px;border:1px solid var(--border);border-radius:3px;
}
.card-url{
  font-family:'Share Tech Mono',monospace;font-size:.72rem;
  color:var(--a3);letter-spacing:.05em;
  margin-bottom:16px;
}
.card-stats{
  display:flex;gap:24px;flex-wrap:wrap;
  padding-top:12px;border-top:1px solid var(--line);
}
.stat-pair{display:flex;flex-direction:column;gap:2px;}
.stat-label{
  font-family:'Share Tech Mono',monospace;font-size:.58rem;
  color:var(--a2);letter-spacing:.15em;text-transform:uppercase;
}
.stat-val{
  font-family:'Share Tech Mono',monospace;font-size:.85rem;
  color:var(--tn);
}
.stat-val.ok{color:var(--ok);}
.stat-val.warn{color:var(--warn);}
.stat-val.down{color:var(--down);}

/* ── Sections ── */
.section{margin-bottom:48px;}
.section h2{
  font-family:'Rajdhani',sans-serif;font-weight:600;
  font-size:1.2rem;color:var(--tw);letter-spacing:.04em;
  text-transform:uppercase;
  margin-bottom:16px;
  padding-bottom:8px;border-bottom:1px solid var(--border);
}

/* ── Region health summary (live data) ── */
.region-summary{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
  gap:12px;
}
.rsum-card{
  background:var(--c1);
  border:1px solid var(--border);
  border-radius:5px;
  padding:14px 18px;
}
.rsum-region{
  font-family:'Rajdhani',sans-serif;font-weight:600;
  font-size:.92rem;color:var(--tw);
  margin-bottom:8px;
}
.rsum-row{
  display:flex;justify-content:space-between;
  font-family:'Share Tech Mono',monospace;font-size:.72rem;
  color:var(--tt);padding:2px 0;
}
.rsum-row span:first-child{color:var(--a2);}

/* ── Mints table ── */
.mints-meta{
  font-family:'Share Tech Mono',monospace;font-size:.72rem;
  color:var(--a3);margin-bottom:14px;letter-spacing:.05em;
}
.mints-wrap{
  background:var(--c1);
  border:1px solid var(--border);
  border-radius:6px;
  overflow:hidden;
}
.mints-table{
  width:100%;border-collapse:collapse;font-family:'Share Tech Mono',monospace;font-size:.78rem;
}
.mints-table th{
  text-align:left;padding:12px 18px;
  background:var(--bg3);
  border-bottom:1px solid var(--border);
  font-family:'Share Tech Mono',monospace;font-size:.68rem;
  color:var(--a2);letter-spacing:.15em;text-transform:uppercase;font-weight:400;
}
.mints-table td{
  padding:11px 18px;
  border-bottom:1px solid var(--line);
  color:var(--tt);
  vertical-align:top;
}
.mints-table tr:last-child td{border-bottom:none;}
.mints-table tr:hover td{background:#1c1c1f;}
.mints-table .cell-worker{color:var(--tn);}
.mints-table .cell-token{color:var(--a3);}
.mints-table .cell-status.success{color:var(--ok);}
.mints-table .cell-status.failed{color:var(--down);}
.mints-table .cell-status.pending{color:var(--warn);}
.mints-table .cell-tx a{color:var(--tw);border:none;text-decoration:underline;text-decoration-color:var(--a1);text-underline-offset:3px;}
.mints-table .cell-tx a:hover{text-decoration-color:var(--tw);}

/* ── Helpers ── */
.muted{color:var(--a2);font-style:italic;text-align:center;padding:20px;font-size:.85rem;}

/* ── Footer ── */
footer{
  max-width:1100px;margin:0 auto;
  padding:32px;
  border-top:1px solid var(--border);
  font-family:'Share Tech Mono',monospace;
  font-size:.7rem;
  color:var(--a2);letter-spacing:.1em;
  text-align:center;
}
.foot-row{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-bottom:8px;}
.foot-row code{color:var(--tt);}
.dotsep{color:var(--a1);}
.foot-sub a{color:var(--tt);border:none;}
.foot-sub a:hover{color:var(--tw);}

/* ── Mobile ── */
@media (max-width:640px){
  .topbar{padding:16px 20px;}
  main{padding:24px 20px 40px;}
  .brand-name{display:none;}
  .grid{grid-template-columns:1fr;}
  .banner{flex-direction:column;align-items:flex-start;text-align:left;}
  .mints-table th,.mints-table td{padding:9px 12px;font-size:.72rem;}
  .mints-table .col-token{display:none;}
}
