:root{ --bg:#0b0f14; --card:#121821; --muted:#6b7a90; --text:#e6edf6; --accent:#1ea7fd; --ok:#28d17c; --warn:#f59f00; --err:#ff6b6b; --border:#1f2a37 }
*{box-sizing:border-box}
html,body{margin:0;height:100%;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;background:var(--bg);color:var(--text)}
a{color:var(--accent);text-decoration:none}
header{position:sticky;top:0;z-index:10;background:rgba(11,15,20,.8);backdrop-filter:blur(6px);border-bottom:1px solid var(--border)}
.wrap{max-width:1080px;margin:0 auto;padding:16px}
.row{display:flex;gap:16px;flex-wrap:wrap}
.row-gap{display:flex;gap:8px;flex-wrap:wrap;margin:8px 0}
.inline-end{align-items:flex-end;gap:12px}
.card{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:16px;margin:0 0 16px 0}
.card.full{flex:1 1 100%}
.flex1{flex:1}
.grow{flex:1;min-width:260px}
.muted{color:var(--muted)}
.footer{color:var(--muted);padding:40px 0;text-align:center}
.section-title{margin:0 0 10px 0;font-size:18px}
.badges{display:flex;gap:8px;flex-wrap:wrap}
.badge{padding:6px 10px;border:1px solid var(--border);border-radius:999px;color:var(--muted);font-weight:600;font-size:12px}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px}
.kpi h3{margin:0 0 6px 0;color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.06em}
.kpi .v{font-size:20px;font-weight:700}
.table-wrap{overflow:auto}
.table-wrap table{width:100%;border-collapse:collapse}
.table-wrap th,.table-wrap td{padding:10px;border-bottom:1px solid var(--border);font-size:14px}
.table-wrap th{color:var(--muted);text-align:left}
.pill{display:inline-flex;align-items:center;gap:6px;padding:8px 12px;border-radius:999px;border:1px solid var(--border);background:transparent;color:var(--text);cursor:pointer}
.dot{width:8px;height:8px;border-radius:50%}
.dot.ok{background:var(--ok)}
.dot.warn{background:var(--warn)}
.dot.err{background:var(--err)}
.right{text-align:right}
.sm{font-size:12px;margin-top:6px}
.mt6{margin-top:6px}
.mt8{margin-top:8px}
input[type="text"]{width:100%;background:#0e141b;border:1px solid var(--border);border-radius:10px;color:var(--text);padding:10px}
.brand{display:flex;align-items:center;gap:10px;justify-content:space-between}
.coins{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px}
.coin{cursor:pointer;transition:transform .08s ease, box-shadow .1s ease}
.coin:hover{transform:translateY(-1px);box-shadow:0 6px 30px rgba(0,0,0,.25)}
.coin .t{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px}
.coin .s{font-size:20px;font-weight:800}
.drawer{position:fixed;top:64px;right:16px;background:var(--card);border:1px solid var(--border);border-radius:12px;max-width:440px;width:calc(100% - 32px);padding:14px;z-index:20;box-shadow:0 10px 40px rgba(0,0,0,.35)}
.drawer-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:10px}
.drawer-row{display:flex;align-items:center;justify-content:space-between;margin-top:10px}
.drawer-actions{display:flex;gap:8px;margin-top:12px}

/* Skeletons */
.sk{position:relative;display:inline-block;border-radius:6px;background:#0e141b;overflow:hidden}
.sk.line{height:12px;width:100%}
.sk.kpi{height:20px;width:80px;border-radius:8px;display:inline-block}
.sk-row td .sk.line{height:12px}
@keyframes shimmer{0%{transform:translateX(-100%)}100%{transform:translateX(100%)}}
.sk::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg, rgba(255,255,255,0), rgba(255,255,255,.06), rgba(255,255,255,0));transform:translateX(-100%);animation:shimmer 1.2s infinite}


/* === Tables (alignment & spacing) === */
.table{width:100%;border-collapse:collapse;table-layout:fixed}
.table th,.table td{padding:10px 12px;border-bottom:1px solid var(--border);text-align:left;vertical-align:middle;font-size:14px}
.table thead th{color:var(--muted);font-weight:600}

/* Miner Workers column widths */
#miner-workers thead th:nth-child(1),
#miner-workers tbody td:nth-child(1){width:36%}
#miner-workers thead th:nth-child(2),
#miner-workers tbody td:nth-child(2){width:24%}
#miner-workers thead th:nth-child(3),
#miner-workers tbody td:nth-child(3){width:20%}
#miner-workers thead th:nth-child(4),
#miner-workers tbody td:nth-child(4){width:20%}

/* Miner Payments column widths */
#miner-pays thead th:nth-child(1),
#miner-pays tbody td:nth-child(1){width:30%}
#miner-pays thead th:nth-child(2),
#miner-pays tbody td:nth-child(2){width:25%}
#miner-pays thead th:nth-child(3),
#miner-pays tbody td:nth-child(3){width:45%}

/* Stronger white glow for landing logo */
#view-landing .hero-logo{
  filter: brightness(2.15) contrast(1.28) drop-shadow(0 0 36px rgba(255,255,255,.90)) drop-shadow(0 0 14px rgba(255,255,255,.70));
  opacity: 1;
}


/* space for the logo above the title */
}
#dash-logo{height:72px;width:auto;object-fit:contain;filter:drop-shadow(0 0 18px rgba(255,255,255,.75)) drop-shadow(0 0 8px rgba(255,255,255,.45));pointer-events:auto;user-select:none;}
@media (max-width: 520px){
  #dash-logo{height:72px;width:auto;object-fit:contain;filter:drop-shadow(0 0 18px rgba(255,255,255,.75)) drop-shadow(0 0 8px rgba(255,255,255,.45));pointer-events:auto;user-select:none;}
}
/* remove homepage link + settings for public */
.topbar .logo, #btn-settings, #drawer{ display:none !important; }


/* was ~48px */
#dash-logo{height:72px;width:auto;object-fit:contain;filter:drop-shadow(0 0 18px rgba(255,255,255,.75)) drop-shadow(0 0 8px rgba(255,255,255,.45));pointer-events:auto;user-select:none;}                /* was ~42px */


/* assume two lines (title + meta) ≈ 3 text lines of height */
  padding-top: 60px;   /* space for the taller logo */
  padding-bottom: 6px; /* tighten bottom so the separator sits closer */
  margin-bottom: 8px;  /* reduce gap to cards */
  border-bottom: 1px solid var(--card-border, rgba(255,255,255,.06)); /* ensure separator exists and is up */
}
#view-dashboard .page-head h2{ margin: 0 0 4px 0; line-height: 1.2; }
#view-dashboard .page-head .muted{ line-height: 1.2; }

/* Logo: same visual height as the header block (~3 lines), a bit wider */
#dash-logo{height:72px;width:auto;object-fit:contain;filter:drop-shadow(0 0 18px rgba(255,255,255,.75)) drop-shadow(0 0 8px rgba(255,255,255,.45));pointer-events:auto;user-select:none;}

/* Small screens: scale down slightly */
@media (max-width: 520px){
  #view-dashboard .page-head{position:sticky;top:0;z-index:5;background:rgba(11,15,20,.8);backdrop-filter:blur(6px);border-bottom:1px solid var(--border);padding:18px 0 26px;position:relative;}
  #dash-logo{height:72px;width:auto;object-fit:contain;filter:drop-shadow(0 0 18px rgba(255,255,255,.75)) drop-shadow(0 0 8px rgba(255,255,255,.45));pointer-events:auto;user-select:none;}
}


}
/* === Dashboard header layout & bigger clickable logo === */
#view-dashboard .page-head{position:sticky;top:0;z-index:5;background:rgba(11,15,20,.8);backdrop-filter:blur(6px);border-bottom:1px solid var(--border);padding:18px 0 26px;position:relative;}

#view-dashboard .page-head .head-main{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;width:100%;padding:0 16px;margin:0;}

#view-dashboard .page-head .head-titles h2{ 
  margin: 0 0 4px 0; 
  line-height: 1.2; 
  font-size: 22px;
}

#view-dashboard .page-head .head-actions{
  display:flex;
  gap:8px;
  align-items:flex-start;
}

#dash-logo-link{display:block;position:absolute;left:50%;transform:translateX(-50%);bottom:2px;}

#dash-logo{height:72px;width:auto;object-fit:contain;filter:drop-shadow(0 0 18px rgba(255,255,255,.75)) drop-shadow(0 0 8px rgba(255,255,255,.45));pointer-events:auto;user-select:none;}

@media (max-width: 640px){
  #dash-logo{height:72px;width:auto;object-fit:contain;filter:drop-shadow(0 0 18px rgba(255,255,255,.75)) drop-shadow(0 0 8px rgba(255,255,255,.45));pointer-events:auto;user-select:none;}
  #view-dashboard .page-head .head-main{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;width:100%;padding:0 16px;margin:0;}
  #view-dashboard .page-head .head-actions{ align-self: stretch; }
}


#view-dashboard .page-head .head-actions{margin-left:auto;}
@media (max-width:640px){
  #dash-logo{height:62px;}
  #view-dashboard .page-head .head-main{flex-direction:column;align-items:flex-start;}
  #view-dashboard .page-head .head-actions{align-self:stretch;}
}
/* === Hide scrollbars in cards but keep scroll via mouse/trackpad === */
#view-dashboard .card{
  overflow: auto;
  -ms-overflow-style: none;   /* IE/Edge */
  scrollbar-width: none;      /* Firefox */
}
#view-dashboard .card::-webkit-scrollbar{ width:0; height:0; } /* WebKit */

#view-dashboard .table-wrap{
  -ms-overflow-style: none;
  scrollbar-width: none;
}
#view-dashboard .table-wrap::-webkit-scrollbar{ width:0; height:0; }

/* Ensure logo link sits above and is clickable */
#dash-logo-link{ z-index: 6; }
/* === Hide inner scrollbars for Gridstack cards === */
#view-dashboard .grid-stack .grid-stack-item-content{
  overflow: auto;
  -ms-overflow-style: none;
  scrollbar-width: none;
}
#view-dashboard .grid-stack .grid-stack-item-content::-webkit-scrollbar{ width:0; height:0; }
