:root{
  --bg:#0d0f17; --bg2:#141826; --panel:#171b2b; --panel2:#1d2236;
  --line:#262c43; --txt:#e8ebf5; --mut:#8a90ab; --dim:#5b6080;
  --wow:#9b5cff; --wow2:#6f3cff; --wow-glow:rgba(155,92,255,.45);
  --mined:#2b3150; --green:#3ddc84; --amber:#ffb547; --red:#ff5470;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  background:radial-gradient(1200px 600px at 50% -200px,#1b1740 0%,var(--bg) 55%);
  color:var(--txt);font-family:"Inter",-apple-system,Segoe UI,Roboto,sans-serif;
  -webkit-font-smoothing:antialiased;min-height:100vh;
}
a{color:var(--wow);text-decoration:none}
a:hover{text-decoration:underline}
.mono{font-family:"JetBrains Mono",ui-monospace,Menlo,Consolas,monospace}

/* header */
header{
  display:flex;align-items:center;gap:16px;padding:14px 22px;
  border-bottom:1px solid var(--line);background:rgba(13,15,23,.8);
  backdrop-filter:blur(8px);position:sticky;top:0;z-index:50;
}
.logo{display:flex;align-items:center;gap:11px;font-weight:800;font-size:19px;letter-spacing:.3px}
.logo .badge{
  width:30px;height:30px;border-radius:8px;display:grid;place-items:center;font-size:15px;
  background:linear-gradient(135deg,var(--wow),var(--wow2));box-shadow:0 0 18px var(--wow-glow);
}
.logo small{color:var(--mut);font-weight:600;font-size:11px;letter-spacing:.5px;text-transform:uppercase}
header .spacer{flex:1}
.net-pill{
  font-size:12px;color:var(--mut);border:1px solid var(--line);border-radius:20px;
  padding:6px 12px;display:flex;align-items:center;gap:7px
}
.dot{width:8px;height:8px;border-radius:50%;background:var(--green);box-shadow:0 0 8px var(--green)}
button{
  font-family:inherit;cursor:pointer;border:none;border-radius:9px;font-weight:700;
  padding:9px 16px;font-size:13px;transition:.15s;
}
.btn-wow{background:linear-gradient(135deg,var(--wow),var(--wow2));color:#fff;box-shadow:0 4px 18px var(--wow-glow)}
.btn-wow:hover{filter:brightness(1.1)}
.btn-ghost{background:var(--panel2);color:var(--txt);border:1px solid var(--line)}
.btn-ghost:hover{border-color:var(--wow)}
button:disabled{opacity:.45;cursor:not-allowed;box-shadow:none;filter:none}

.wrap{max-width:1180px;margin:0 auto;padding:26px 22px 80px}

/* hero / stats */
.tagline{font-size:14px;color:var(--mut);margin:2px 0 22px}
.tagline b{color:var(--txt)}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:26px}
.stat{background:var(--panel);border:1px solid var(--line);border-radius:13px;padding:14px 15px}
.stat .k{font-size:11px;color:var(--mut);text-transform:uppercase;letter-spacing:.6px}
.stat .v{font-size:20px;font-weight:800;margin-top:5px}
.stat .v.sm{font-size:15px}
@media(max-width:900px){.stats{grid-template-columns:repeat(3,1fr)}}
@media(max-width:560px){.stats{grid-template-columns:repeat(2,1fr)}}

.section-h{display:flex;align-items:center;gap:10px;margin:8px 0 14px}
.section-h h2{font-size:15px;margin:0;letter-spacing:.3px}
.section-h .sub{color:var(--dim);font-size:12px}
.section-h .spacer{flex:1}

/* ============ mempool.space 3D blocks ============ */
.lane-row{display:flex;align-items:center;gap:10px;margin-bottom:8px;position:relative}
/* the rail the cubes sit on (mempool timeline) */
.lane-row::before{
  content:"";position:absolute;left:48px;right:48px;top:calc(50% + 8px);height:3px;z-index:0;
  background:linear-gradient(90deg,transparent,var(--line) 6%,var(--line) 94%,transparent);
}
.lane{
  display:flex;gap:34px;overflow-x:auto;padding:30px 18px 30px;scroll-behavior:smooth;flex:1;
  position:relative;z-index:1;scrollbar-width:thin;scrollbar-color:var(--wow2) transparent;
}
.lane::-webkit-scrollbar{height:8px}
.lane::-webkit-scrollbar-thumb{background:var(--wow2);border-radius:8px}
.arrow{
  flex:0 0 auto;width:40px;height:40px;border-radius:10px;background:var(--panel2);z-index:2;
  border:1px solid var(--line);color:var(--txt);font-size:19px;display:grid;place-items:center
}
.arrow:hover{border-color:var(--wow);color:var(--wow)}

/* the isometric cube. depth = 18px. front face = the element itself.       */
/* ::before = top face (skewX), ::after = right face (skewY).               */
.cube{
  --front:linear-gradient(160deg,#7a47ff,#5a2ce0);
  --top:#9b73ff; --right:#4421a8; --ink:#fff;
  flex:0 0 auto;position:relative;cursor:pointer;color:var(--ink);
  margin:18px 18px 0 0;border-radius:5px;transition:transform .16s ease;
}
.cube:hover{transform:translateY(-5px)}
.cube .front{
  position:absolute;inset:0;z-index:3;display:flex;flex-direction:column;
  padding:11px 12px;border-radius:5px;background:var(--front);
}
.cube::before{ /* top face */
  content:"";position:absolute;z-index:2;left:9px;top:-18px;
  width:100%;height:18px;background:var(--top);
  transform:skewX(-45deg);border-radius:5px 5px 0 0;
}
.cube::after{ /* right face */
  content:"";position:absolute;z-index:1;right:-18px;top:-9px;
  width:18px;height:100%;background:var(--right);
  transform:skewY(-45deg);border-radius:0 5px 5px 0;
}

/* --- running / active cubes (purple, glowing, on the rail) --- */
.live-block{width:138px;height:138px}
.live-block .front{box-shadow:0 10px 30px var(--wow-glow)}
.live-block.running{animation:pulse 2.4s ease-in-out infinite}
@keyframes pulse{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}
.live-block.running .front{box-shadow:0 14px 42px var(--wow)}
.live-block .num{font-size:30px;font-weight:900;line-height:1;letter-spacing:-1px}
.live-block .pos{font-size:12px;opacity:.95;margin-top:4px;font-weight:600}
.live-block .cost{font-size:11px;opacity:.9;margin-top:auto;font-weight:600}
.live-block .tag{
  align-self:flex-start;font-size:8.5px;font-weight:800;letter-spacing:.6px;
  background:#ffffff2e;padding:3px 7px;border-radius:5px;margin-bottom:6px
}
.live-block .mini{
  margin-top:7px;font-size:10px;background:#ffffff24;border-radius:6px;
  padding:5px 0;text-align:center;font-weight:800;letter-spacing:.4px
}

/* progress */
.progress-card{background:var(--panel);border:1px solid var(--line);border-radius:13px;padding:16px 18px;margin:6px 0 26px}
.progress-card .top{display:flex;justify-content:space-between;font-size:13px;margin-bottom:9px;color:var(--mut)}
.progress-card .top b{color:var(--txt)}
.bar{height:11px;background:#0c0e16;border-radius:8px;overflow:hidden;border:1px solid var(--line)}
.bar>span{display:block;height:100%;background:linear-gradient(90deg,var(--wow2),var(--wow));border-radius:8px;transition:width .5s}

/* "blocks to mint" — compact mempool block grid, scrollable (one block per Elon "wow" post) */
.grid-scroll{
  max-height:560px;overflow-y:auto;border:1px solid var(--line);border-radius:13px;
  padding:12px;background:#0c0e16;scrollbar-width:thin;scrollbar-color:var(--wow2) transparent;
}
.grid-scroll::-webkit-scrollbar{width:9px}
.grid-scroll::-webkit-scrollbar-thumb{background:var(--wow2);border-radius:8px}
.grid{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(72px,1fr));
  gap:7px;
}
@media(max-width:640px){.grid{grid-template-columns:repeat(auto-fill,minmax(58px,1fr))}}
.cell{
  position:relative;cursor:pointer;border-radius:7px;aspect-ratio:1;
  display:flex;flex-direction:column;align-items:center;justify-content:center;color:#fff;user-select:none;
  background:linear-gradient(158deg,#4a2cb0 0%,#36207e 100%);border:1px solid #7a52ff55;
  box-shadow:inset 0 1px 0 #ffffff22, inset 0 -2px 0 #00000038;
  transition:transform .12s ease, box-shadow .12s ease;overflow:hidden;
}
.cell:hover{transform:translateY(-3px);box-shadow:inset 0 1px 0 #ffffff33,0 8px 18px var(--wow-glow);z-index:2}
.cell .num{font-size:15px;font-weight:900;letter-spacing:-.5px;line-height:1}
.cell .pos{font-size:8.5px;opacity:.85;margin-top:2px;font-weight:600}
/* mined = HATCHED block → pixel Elon */
.cell.mined{background:#15101f;border-color:#3a2d5e;padding:0}
.cell.mined .elon-img{width:100%;height:100%;object-fit:cover;display:block;border-radius:6px;image-rendering:pixelated}
.cell.mined .tagid{position:absolute;bottom:2px;right:4px;font-size:8px;font-weight:800;color:#fff;text-shadow:0 1px 2px #000c;letter-spacing:.2px;z-index:4}
.cell .crack{position:absolute;inset:0;pointer-events:none;opacity:0}

/* hatch animation when a mint completes */
@keyframes hatchShake{0%,100%{transform:translateY(0) rotate(0)}15%{transform:translateX(-2px) rotate(-5deg)}30%{transform:translateX(2px) rotate(5deg)}45%{transform:translateX(-2px) rotate(-3deg)}60%{transform:translateX(1px) rotate(2deg)}80%{transform:translateX(-1px)}}
@keyframes hatchFlash{0%{box-shadow:0 0 0 0 #9b5cff00}35%{box-shadow:0 0 22px 6px #9b5cffcc}100%{box-shadow:0 0 0 0 #9b5cff00}}
@keyframes hatchPop{0%{transform:scale(.1) rotate(-25deg);opacity:0}55%{transform:scale(1.32) rotate(10deg);opacity:1}100%{transform:scale(1) rotate(0)}}
@keyframes crackGo{0%,40%{opacity:0}45%{opacity:.95}100%{opacity:0}}
.cell.hatching{overflow:visible;z-index:5;animation:hatchShake .55s ease, hatchFlash 1s ease}
.cell.hatching .elon-img{animation:hatchPop .6s .28s cubic-bezier(.2,1.6,.4,1) both}
.cell.hatching .crack{
  background:
    linear-gradient(135deg,transparent 45%,#fff 46%,#fff 50%,transparent 51%),
    linear-gradient(40deg,transparent 45%,#fff 46%,#fff 50%,transparent 51%);
  animation:crackGo .5s ease both;
}
/* big celebratory Elon pop in the mint modal */
.hatch-pop{display:flex;justify-content:center;margin:2px 0 10px}
.hatch-pop .elon{width:96px;height:96px;image-rendering:pixelated;filter:drop-shadow(0 3px 7px #000a);animation:hatchPop .7s cubic-bezier(.2,1.6,.4,1) both}

/* modal */
.modal-bg{position:fixed;inset:0;background:#05060bcc;backdrop-filter:blur(4px);display:none;place-items:center;z-index:100;padding:20px}
.modal-bg.show{display:grid}
.modal{
  width:100%;max-width:440px;background:var(--panel);border:1px solid var(--line);border-radius:18px;
  padding:24px;box-shadow:0 24px 80px #000a
}
.modal h3{margin:0 0 4px;font-size:22px;display:flex;align-items:center;gap:9px}
.modal .blk-state{font-size:12px;padding:3px 9px;border-radius:20px;font-weight:700}
.state-active{background:#43269e;color:#cbb6ff}
.state-mined{background:#222845;color:var(--mut)}
.kv{display:flex;justify-content:space-between;gap:14px;padding:9px 0;border-bottom:1px solid var(--line);font-size:13px}
.kv .k{color:var(--mut)}
.kv .v{text-align:right;word-break:break-all}
.modal .xlink{display:block;margin:14px 0;padding:11px;background:var(--bg2);border:1px solid var(--line);border-radius:10px;font-size:12px;text-align:center}
.modal .actions{margin-top:18px;display:flex;gap:10px}
.modal .actions button{flex:1;padding:13px}
.close-x{position:absolute;}
.status{margin-top:13px;font-size:12px;text-align:center;min-height:16px}
.status.err{color:var(--red)} .status.ok{color:var(--green)} .status.work{color:var(--amber)}
.foot{margin-top:50px;text-align:center;color:var(--dim);font-size:12px;line-height:1.7}
.foot code{color:var(--mut)}

/* ===================== 🎉 surprise-gift celebration ===================== */
.cel-bg{position:fixed;inset:0;z-index:200;display:none;place-items:center;overflow:hidden;
  background:radial-gradient(circle at 50% 40%,#1a1140ee,#05060bf4);backdrop-filter:blur(3px)}
.cel-bg.show{display:grid}
.cel-confetti,.cel-balloons{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.confetti{position:absolute;left:50%;top:44%;width:10px;height:15px;opacity:0;will-change:transform;
  animation:confetti var(--dur) cubic-bezier(.15,.55,.3,1) forwards}
@keyframes confetti{
  0%{opacity:0;transform:translate(-50%,-50%) scale(.3) rotate(0)}
  8%{opacity:1}
  42%{transform:translate(calc(-50% + var(--tx)),calc(-50% + var(--ty))) rotate(calc(var(--rot)*.5))}
  100%{opacity:0;transform:translate(calc(-50% + var(--tx)*1.15),calc(-50% + var(--ty) + 360px)) rotate(var(--rot))}}
.balloon{position:absolute;bottom:-44px;opacity:0;will-change:transform;animation:balloon var(--bd) ease-in forwards}
@keyframes balloon{0%{opacity:0;transform:translate(0,0)}12%{opacity:1}100%{opacity:0;transform:translate(var(--bx),-112vh)}}
.cel-gift{position:absolute;font-size:94px;filter:drop-shadow(0 10px 18px #000a);animation:giftBounce .62s cubic-bezier(.2,1.5,.4,1) both}
@keyframes giftBounce{0%{transform:scale(0) rotate(-30deg)}55%{transform:scale(1.28) rotate(9deg)}76%{transform:scale(.93) rotate(-5deg)}100%{transform:scale(1) rotate(0)}}
.cel-card{position:relative;z-index:2;width:min(90vw,362px);text-align:center;
  background:linear-gradient(160deg,#221a44,#15101f);border:1px solid #6f3cff66;border-radius:20px;
  padding:24px 24px 20px;box-shadow:0 30px 90px #000c,0 0 0 4px #9b5cff22;
  opacity:0;transform:scale(.5);pointer-events:none}
.cel-card.show{opacity:1;transform:none;pointer-events:auto;animation:cardPop .6s cubic-bezier(.2,1.5,.4,1)}
@keyframes cardPop{0%{opacity:0;transform:scale(.4) translateY(30px) rotate(-3deg)}60%{transform:scale(1.06) rotate(1deg)}100%{opacity:1;transform:none}}
.cel-ribbon{display:inline-block;font-weight:900;font-size:13px;letter-spacing:1px;color:#fff;
  background:linear-gradient(90deg,#ff5470,#9b5cff,#42d6ff);padding:6px 14px;border-radius:20px;margin-bottom:6px;box-shadow:0 6px 18px #9b5cff66}
.cel-elon{width:132px;height:132px;margin:6px auto 4px;animation:hatchPop .7s .05s cubic-bezier(.2,1.6,.4,1) both}
.cel-elon .elon-img{width:100%;height:100%;object-fit:cover;border-radius:16px;image-rendering:pixelated;filter:drop-shadow(0 6px 14px #000a);border:2px solid #ffffff1a}
.cel-card h2{margin:6px 0 4px;font-size:22px}
.cel-msg{color:var(--mut);font-size:13px;line-height:1.55;margin:0 0 16px}
.cel-msg b{color:var(--txt)}
.cel-actions{display:flex;gap:10px}
.cel-actions>*{flex:1;padding:12px 0;text-align:center;border-radius:10px;font-weight:800;font-size:13px;text-decoration:none}

/* ===================== running lane: minted NFT cards ===================== */
.lane{gap:12px;padding:6px 8px 14px}
.lane-row::before{display:none}
.mintcard{flex:0 0 auto;width:130px;cursor:pointer;background:var(--panel);border:1px solid var(--line);border-radius:12px;overflow:hidden;transition:.15s}
.mintcard:hover{transform:translateY(-4px);border-color:var(--wow);box-shadow:0 10px 26px var(--wow-glow)}
.mintcard.newest{border-color:var(--wow);box-shadow:0 0 0 2px #9b5cff44}
.mc-img{position:relative;width:130px;height:130px}
.mc-img .elon-img{width:100%;height:100%;object-fit:cover;display:block;image-rendering:pixelated}
.mc-num{position:absolute;bottom:4px;right:6px;font-size:11px;font-weight:800;color:#fff;text-shadow:0 1px 2px #000c}
.mc-tag{position:absolute;top:6px;left:6px;font-size:8px;font-weight:800;letter-spacing:.4px;background:var(--wow2);color:#fff;padding:3px 6px;border-radius:5px}
.mc-meta{padding:8px 9px}
.mc-addr{display:flex;align-items:center;gap:6px;font:600 11px "JetBrains Mono",monospace;color:var(--mut);text-decoration:none}
.mc-addr:hover{color:var(--wow)}
.mc-logo{width:18px;height:18px;border-radius:5px;object-fit:cover;background:#ffffff14}

/* ===================== mosaic reveal grid ===================== */
.grid-scroll{max-height:700px;padding:0;background:#07080d;border-radius:12px;overflow:auto}
.grid{display:grid;gap:0}
.tile{position:relative;aspect-ratio:1;cursor:pointer;background-image:url("mosaic.jpg");background-repeat:no-repeat}
.tile .tnum{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:7px;font-weight:800;color:#fff;text-shadow:0 1px 2px #000;pointer-events:none;opacity:0;z-index:2}
.tile.covered::after{content:"";position:absolute;inset:0;background:rgba(8,9,15,.93);transition:background .3s}
.tile.covered:hover::after{background:rgba(8,9,15,.4)}
.tile.covered:hover .tnum{opacity:1}
.tile.revealed{box-shadow:inset 0 0 0 .5px #9b5cff44}
.tile.revealed:hover{z-index:5;transform:scale(1.9);transition:transform .12s;box-shadow:0 6px 18px #000c;border-radius:2px}
.tile.revealed:hover .tnum{opacity:1}
.tile.hatching{animation:hatchFlash 1s ease;z-index:6}
@media(max-width:640px){.grid-scroll{max-height:520px}}

/* ===================== miner leaderboard ===================== */
.leaderboard{display:grid;grid-template-columns:repeat(auto-fill,minmax(232px,1fr));gap:8px}
.lb-row{display:flex;align-items:center;gap:10px;background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:9px 12px}
.lb-rank{font-size:15px;min-width:24px;text-align:center;font-weight:800;color:var(--mut)}
.lb-logo{width:26px;height:26px;border-radius:6px;object-fit:cover;background:#ffffff14}
.lb-buy{width:26px;height:26px;border-radius:6px;display:grid;place-items:center;background:var(--panel2);border:1px dashed var(--line);color:var(--wow);font-weight:800;text-decoration:none;font-size:16px}
.lb-buy:hover{border-color:var(--wow)}
.lb-addr{flex:1;font:600 12px "JetBrains Mono",monospace;color:var(--txt);text-decoration:none}
.lb-addr:hover{color:var(--wow)}
.lb-count{font-size:11px;color:var(--wow);font-weight:800;white-space:nowrap}
.lb-empty{color:var(--dim);font-size:13px;padding:16px;border:1px dashed var(--line);border-radius:10px}
.lb-empty a{color:var(--wow)}

/* ======================================================================= */
/* ====================  CYBERPUNK NEON THEME (concept_09)  =============== */
/* ======================================================================= */
:root{
  --bg:#05060c; --bg2:#0a0d1a; --panel:#0c0f1c; --panel2:#11162a;
  --line:#15233f; --txt:#dfe7ff; --mut:#7a86b8; --dim:#5a6690;
  --wow:#00f0ff; --wow2:#ff2bd1; --wow-glow:rgba(0,240,255,.4);
  --mined:#15233f; --cyan:#00f0ff; --pink:#ff2bd1;
}
body{
  background:#05060c;font-family:"Share Tech Mono",ui-monospace,monospace;
}
body::before{ /* CRT scanlines */
  content:"";position:fixed;inset:0;pointer-events:none;z-index:999;
  background:linear-gradient(transparent 50%,rgba(0,240,255,.022) 50%);background-size:100% 4px;
}
a{color:var(--cyan)}
.mono{font-family:"Share Tech Mono",monospace}

/* header */
header{border-bottom:1px solid rgba(0,240,255,.25);background:rgba(6,8,16,.85)}
.logo{font-family:"Orbitron";letter-spacing:1.5px}
.logo>div{color:var(--cyan);text-shadow:0 0 8px var(--cyan),0 0 20px rgba(0,240,255,.4)}
.logo small{color:var(--pink) !important;text-shadow:0 0 6px var(--pink)}
.logo .badge{background:linear-gradient(135deg,var(--cyan),var(--pink));box-shadow:0 0 16px var(--cyan);border-radius:0;clip-path:polygon(6px 0,100% 0,100% calc(100% - 6px),calc(100% - 6px) 100%,0 100%,0 6px)}
.net-pill{border-color:var(--cyan);color:var(--cyan);border-radius:0;clip-path:polygon(7px 0,100% 0,100% calc(100% - 7px),calc(100% - 7px) 100%,0 100%,0 7px)}
.net-pill .dot,.dot{background:var(--cyan);box-shadow:0 0 8px var(--cyan)}
.btn-wow{font-family:"Orbitron";letter-spacing:1px;color:#05060c;background:linear-gradient(90deg,var(--cyan),var(--pink));border-radius:0;box-shadow:0 0 14px rgba(0,240,255,.35);clip-path:polygon(9px 0,100% 0,calc(100% - 9px) 100%,0 100%)}
.btn-wow:hover{box-shadow:0 0 20px var(--pink)}
.btn-ghost{background:var(--panel2);border:1px solid rgba(0,240,255,.3);color:var(--cyan);border-radius:0;clip-path:polygon(8px 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%,0 8px)}
.btn-ghost:hover{border-color:var(--pink);color:#fff;box-shadow:0 0 12px rgba(255,43,209,.4)}

/* hero / stats */
.tagline{color:var(--mut)} .tagline b{color:var(--cyan)}
.stat{background:var(--panel);border:1px solid rgba(0,240,255,.2);border-radius:0;clip-path:polygon(0 0,100% 0,100% calc(100% - 12px),calc(100% - 12px) 100%,0 100%)}
.stat .v{font-family:"Orbitron";color:var(--cyan);text-shadow:0 0 8px rgba(0,240,255,.4)}
.stat:nth-child(even) .v{color:var(--pink);text-shadow:0 0 8px rgba(255,43,209,.4)}
.stat .k{letter-spacing:1px}

/* section headings — Orbitron, pink rule + cyan glow */
.section-h h2{font-family:"Orbitron";letter-spacing:2px;color:#fff;border-left:3px solid var(--pink);padding-left:12px;text-shadow:0 0 10px rgba(0,240,255,.25)}
.section-h .sub{color:var(--dim)}

/* progress */
.progress-card{background:var(--panel);border:1px solid rgba(0,240,255,.2);border-radius:0;clip-path:polygon(0 0,100% 0,100% calc(100% - 12px),calc(100% - 12px) 100%,0 100%)}
.bar{background:#04111c;border-color:rgba(0,240,255,.25);border-radius:0}
.bar>span{background:linear-gradient(90deg,var(--cyan),var(--pink));border-radius:0;box-shadow:0 0 12px var(--cyan)}

/* running lane minted cards */
.mintcard{background:var(--panel);border:1px solid rgba(0,240,255,.22);border-radius:0;clip-path:polygon(10px 0,100% 0,100% 100%,0 100%,0 10px)}
.mintcard:hover{border-color:var(--pink);box-shadow:0 0 16px rgba(255,43,209,.3)}
.mintcard.newest{border-color:var(--pink);box-shadow:0 0 16px rgba(255,43,209,.4)}
.mc-num{font-family:"Orbitron"}
.mc-tag{background:var(--pink);color:#fff;border-radius:0}
.mc-addr{color:var(--mut)} .mc-addr:hover{color:var(--cyan)}

/* ============ mosaic grid: blue mask → reveal ============ */
.grid-scroll{max-height:760px;border:1px solid rgba(0,240,255,.18);background:#04060d;border-radius:0;padding:0}
.grid{gap:0}
.tile{aspect-ratio:1;position:relative;background-repeat:no-repeat}
.tile .tnum{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-family:"Orbitron";font-size:6px;font-weight:700;color:#fff;text-shadow:0 0 3px #000;opacity:0;pointer-events:none;z-index:2}
/* future = not posted yet (dark, faint grid) */
.tile.future{background:#070912;box-shadow:inset 0 0 0 .5px #0d1730}
/* masked = live block, not mined → BLUE neon box */
.tile.masked{cursor:pointer;background:linear-gradient(150deg,#0b3a63,#072744);box-shadow:inset 0 0 0 .5px rgba(0,240,255,.35),inset 0 0 7px rgba(0,240,255,.18)}
.tile.masked:hover{z-index:4;box-shadow:inset 0 0 0 1px var(--cyan),0 0 12px var(--cyan)}
.tile.masked:hover .tnum{opacity:1}
/* revealed = mined → mosaic slice with pink edge */
.tile.revealed{cursor:pointer;box-shadow:inset 0 0 0 .5px rgba(255,43,209,.5)}
.tile.revealed:hover{z-index:6;transform:scale(2.4);transition:transform .12s;box-shadow:0 0 14px var(--pink)}
.tile.revealed:hover .tnum{opacity:1}
.tile.hatching{animation:hatchFlash 1s ease;z-index:7}

/* leaderboard */
.lb-row{background:var(--panel);border:1px solid rgba(0,240,255,.2);border-radius:0;clip-path:polygon(8px 0,100% 0,100% 100%,0 100%,0 8px)}
.lb-rank{font-family:"Orbitron"}
.lb-addr{color:var(--txt)} .lb-addr:hover{color:var(--cyan)}
.lb-count{color:var(--pink)}
.lb-logo{border-radius:0} .lb-buy{border-radius:0;color:var(--cyan)}
.lb-buy:hover{border-color:var(--pink)}

/* modal + celebration */
.modal{background:var(--panel);border:1px solid rgba(0,240,255,.3);border-radius:0;clip-path:polygon(0 0,100% 0,100% calc(100% - 16px),calc(100% - 16px) 100%,0 100%)}
.modal h3{font-family:"Orbitron"}
.state-active{background:#072744;color:var(--cyan)}
.xlink{background:#04111c;border-color:rgba(0,240,255,.3)}
.cel-card{background:var(--panel);border:1px solid var(--pink);border-radius:0;box-shadow:0 0 40px rgba(255,43,209,.4),0 30px 90px #000c;clip-path:polygon(0 0,100% 0,100% calc(100% - 18px),calc(100% - 18px) 100%,0 100%)}
.cel-card h2{font-family:"Orbitron"}
.foot{color:var(--dim)}
.foot code,.foot .mono{color:var(--cyan)}

/* ============ mempool.space-style running lane (upcoming ┊ confirmed cubes) ============ */
.lane{align-items:stretch;gap:30px;padding:28px 16px 30px}
.lane-cube{width:120px;height:120px;flex:0 0 auto;margin:18px 18px 0 0}
.lane-cube .front{display:flex;flex-direction:column;padding:9px 10px;border-radius:0;font-family:"Share Tech Mono",monospace;overflow:hidden}
.lane-cube .ctag{align-self:flex-start;font-family:"Orbitron";font-size:7.5px;font-weight:700;letter-spacing:.4px;background:#ffffff2e;color:#fff;padding:2px 6px;margin-bottom:4px}
.lane-cube .cnum{font-family:"Orbitron";font-size:23px;font-weight:800;line-height:1;color:#fff;text-shadow:0 0 8px #0009}
.lane-cube .cpos{font-size:10px;opacity:.95;margin-top:3px}
.lane-cube .ccost{font-size:9.5px;opacity:.92;margin-top:auto}
.lane-cube .cmine{margin-top:5px;font-family:"Orbitron";font-size:8.5px;font-weight:800;text-align:center;background:#ffffff2b;padding:4px 0;letter-spacing:.4px}
.lane-cube .cminer{margin-top:auto;font-size:9px;display:flex;align-items:center;gap:4px}
.lane-cube .cminer a{color:#fff;text-decoration:none}
.cc-logo{width:14px;height:14px;object-fit:cover;background:#ffffff2e}

/* UPCOMING = green (ready to mine) */
.lane-cube.upcoming{--front:linear-gradient(160deg,#1f8a4d,#0c6b39);--top:#36c46e;--right:#075028}
/* NEXT = same green as upcoming, just a subtle glow */
.lane-cube.upcoming.next .front{box-shadow:0 0 18px #36c46e88}

/* CONFIRMED = the minted NFT as the cube face + miner/logo overlay */
.lane-cube.confirmed{--top:#00c0d8;--right:#005a7a}
.lane-cube.confirmed .front{background-size:cover;background-position:center;position:relative;color:#fff}
.lane-cube.confirmed .front::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#000a 0%,#0000 38%,#000b 100%)}
.lane-cube.confirmed .ctag,.lane-cube.confirmed .cnum,.lane-cube.confirmed .cminer{position:relative;z-index:1}
.lane-cube.confirmed .ctag.mined{background:var(--cyan);color:#04121a}
.lane-cube.confirmed.newest .front{box-shadow:0 0 20px var(--cyan)}

/* divider (mempool ↕ rail split) */
.lane-div{flex:0 0 auto;align-self:stretch;display:flex;align-items:center;justify-content:center;width:34px;margin:18px 8px 0;position:relative}
.lane-div::before{content:"";position:absolute;top:6px;bottom:6px;left:50%;border-left:2px dashed rgba(0,240,255,.45)}
.lane-div span{position:relative;z-index:1;background:var(--bg);color:var(--cyan);font-size:17px;padding:7px 0;text-shadow:0 0 8px var(--cyan)}

/* ACTIVE = existing but unmined block → colored (purple/cyber) block with MINE */
.lane-cube.active{--front:linear-gradient(160deg,#5b2ce0,#2a1a8a);--top:#7a52ff;--right:#1a1060}
/* NEWEST active = same purple as active, just a subtle glow */
.lane-cube.active.newest .front{box-shadow:0 0 18px var(--wow-glow)}
/* projected upcoming (future, not posted yet) — pending look, not clickable */
.lane-cube.upcoming.projected{cursor:default;opacity:.96}
.lane-cube.upcoming.projected .front{border:1px dashed #ffffff33}
.lane-cube .cmine.soon{background:#ffffff20;font-family:"Orbitron";font-size:8px}
.lane-cube.upcoming .cpos{opacity:.85}

/* top-row "upcoming" slots that complete the rectangle (Elon's next wows) */
.tile.upcoming-tile{background:#0a0d18;box-shadow:inset 0 0 0 .5px #16233f}
.grid-scroll{max-height:none;overflow:visible}

/* celebration: single View-tx button + tap-to-close hint (Awesome button removed) */
.cel-actions{justify-content:center}
.cel-actions>*{max-width:240px}
.cel-hint{margin-top:12px;text-align:center;font-size:11px;color:var(--dim);letter-spacing:.5px}

/* ============================ MOBILE ============================ */
@media (max-width:760px){
  header{padding:10px 13px;gap:9px;flex-wrap:wrap}
  .logo{font-size:15px;gap:8px}
  .logo .badge{width:26px;height:26px;font-size:13px}
  header > a.btn-ghost, #connectBtn{padding:8px 11px;font-size:12px}
  .net-pill{padding:5px 9px;font-size:11px}
  .wrap{padding:16px 13px 64px}
  .tagline{font-size:12.5px;margin-bottom:16px}
  .stats{grid-template-columns:repeat(3,1fr);gap:8px}
  .stat{padding:11px 11px}
  .stat .v{font-size:17px}.stat .v.sm{font-size:13px}
  .section-h{flex-wrap:wrap;gap:6px}
  .section-h h2{font-size:14px}
  .section-h .sub{font-size:11px;flex-basis:100%}
  .lane{gap:22px;padding:22px 10px 24px}
  .lane-cube{width:104px;height:104px;margin:14px 14px 0 0}
  .lane-cube .cnum{font-size:19px}
  .arrow{width:34px;height:34px}
  .leaderboard{grid-template-columns:1fr}
  .modal{max-width:none;width:100%;padding:20px}
  .grid-scroll{border-radius:8px}
  .tile .tnum{display:none}            /* tiles too small for numbers on phones */
  .tile.revealed:hover{transform:none} /* no hover-zoom on touch */
  .logowrap{padding:24px 14px 60px}
}
@media (max-width:430px){
  header{gap:7px}
  .logo small{display:none}            /* save header space */
  .net-pill{display:none}
  .stats{grid-template-columns:repeat(2,1fr)}
  .lane-cube{width:96px;height:96px}
  .lane-cube .front{padding:7px 8px}
  .lane-cube .cnum{font-size:17px}
  .lane-div{width:24px;margin:14px 4px 0}
  .stat .v{font-size:16px}
  .tagline{font-size:12px}
}

@media(max-width:760px){html,body{overflow-x:hidden}}

/* ======================================================================= */
/* ==============  COMIC POP-ART THEME  (overrides all above)  =========== */
/* ======================================================================= */
:root{
  --paper:#fff6e6; --surface:#ffffff; --ink:#0a0a0a;
  --red:#ff2e35; --yellow:#CBF806; --blue:#2454ff; --sky:#4fc3ff; --cpink:#ff5bab;
  /* remap the app's existing tokens onto the comic palette */
  --bg:#fff6e6; --bg2:#ffffff; --panel:#ffffff; --panel2:#fff3cf;
  --line:#0a0a0a; --txt:#0a0a0a; --mut:#6b6350; --dim:#8f886f;
  --wow:#ff2e35; --wow2:#2454ff; --wow-glow:rgba(255,46,53,.30);
  --mined:#ffe9a8; --green:#12a150; --amber:#e08a00; --red:#ff2e35;
  --cyan:#2454ff; --pink:#ff2e35; --accent:#2454ff; --font-display:'Bangers',cursive;
}
body.dark{
  --paper:#0d0a16; --surface:#1c1727; --ink:#f2ead6;
  --bg:#0d0a16; --bg2:#171225; --panel:#1c1727; --panel2:#2a2438;
  --line:#f2ead6; --txt:#f2ead6; --mut:#b7ae97; --dim:#8f886f;
  --wow:#ff5b60; --wow2:#5b86ff; --mined:#2a2438;
}
/* ---- page ---- */
body{
  background:var(--paper) !important;
  background-image:radial-gradient(rgba(10,10,10,.14) 1.5px,transparent 1.7px) !important;
  background-size:15px 15px !important;
  font-family:'Nunito',system-ui,sans-serif !important;color:var(--ink);
  transition:background-color .25s ease,color .25s ease;
}
body.dark{background-image:radial-gradient(rgba(242,234,214,.10) 1.5px,transparent 1.7px) !important}
body::before{content:none !important}   /* kill cyberpunk CRT scanlines */
a{color:var(--blue)} a:hover{color:var(--red)} body.dark a{color:var(--sky)}

/* ---- generic comic surfaces (thick ink border + hard shadow) ---- */
.stat,.progress-card,.modal,.mintcard,.lb-row,.gpanel,.gcard,.grid-scroll,#gatePanel{
  border:3px solid var(--ink) !important;border-radius:8px !important;
  box-shadow:5px 5px 0 var(--ink) !important;clip-path:none !important;background:var(--surface) !important;
}
/* ---- header ---- */
header{
  background:var(--yellow) !important;border-bottom:4px solid var(--ink) !important;backdrop-filter:none !important;
  background-image:radial-gradient(rgba(255,46,53,.28) 2px,transparent 2.2px) !important;background-size:16px 16px !important;
}
.logo{font-family:'Luckiest Guy',cursive !important;color:var(--red) !important;letter-spacing:.5px}
.logo>div{color:var(--red) !important;text-shadow:1px 1px 0 var(--ink) !important;line-height:1.05}
.logo small{color:var(--ink) !important;text-shadow:none !important;opacity:.75;font-weight:700;letter-spacing:.4px}
.logo .badge{background:var(--red) !important;border:3px solid var(--ink) !important;border-radius:6px !important;box-shadow:3px 3px 0 var(--ink) !important;clip-path:none !important}
.net-pill{border:3px solid var(--ink) !important;border-radius:20px !important;color:var(--ink) !important;clip-path:none !important;background:var(--surface) !important;font-weight:800}
.net-pill .dot,.dot{background:var(--green) !important;box-shadow:none !important}

/* ---- buttons ---- */
button,.btn-wow,.btn-ghost{
  font-family:'Bangers',cursive !important;letter-spacing:.04em;
  border:3px solid var(--ink) !important;border-radius:6px !important;box-shadow:4px 4px 0 var(--ink) !important;
  clip-path:none !important;transition:transform .08s,box-shadow .08s !important;
}
.btn-wow{background:var(--red) !important;color:#fff !important;text-shadow:none !important}
.btn-ghost{background:var(--yellow) !important;color:#0a0a0a !important}
button:hover,.btn-wow:hover,.btn-ghost:hover{transform:translate(2px,2px);box-shadow:2px 2px 0 var(--ink) !important;filter:none !important}
button:disabled{box-shadow:2px 2px 0 var(--ink) !important;transform:none}
#darkToggle{background:var(--yellow) !important;color:#0a0a0a !important;font-size:18px !important;padding:8px 12px !important}

/* ---- stats (values in a clean heavy sans — Bangers mangles numbers) ---- */
.stat .k{color:var(--mut) !important;font-weight:800;letter-spacing:.6px}
.stat .v{font-family:'Nunito','Inter',system-ui,sans-serif !important;font-weight:900 !important;letter-spacing:0 !important;color:var(--txt) !important;text-shadow:none !important;font-size:22px}
.stat .v.sm{font-size:17px !important}
.stat:nth-child(even) .v{color:var(--red) !important;text-shadow:none !important}

/* ---- section headings ---- */
.section-h h2{font-family:'Bangers',cursive !important;color:var(--ink) !important;letter-spacing:.04em;border-left:5px solid var(--red) !important;padding-left:12px;text-shadow:none !important}
.section-h .sub{color:var(--mut) !important}

/* ---- progress ---- */
.bar{background:var(--paper) !important;border:2px solid var(--ink) !important;border-radius:20px !important}
.bar>span{background:var(--red) !important;box-shadow:none !important;border-radius:20px}
.progress-card .top,.progress-card .top b{color:var(--ink) !important}

/* ---- live cost figure ---- */
#dsCostBig{background:none !important;-webkit-text-fill-color:var(--red) !important;color:var(--red) !important;font-family:'Bangers',cursive !important}

/* ---- blocks-to-mine grid ---- */
.grid-scroll{background:var(--paper) !important}
.cell{background:var(--blue) !important;border:2px solid var(--ink) !important;border-radius:6px !important;box-shadow:2px 2px 0 var(--ink) !important;color:#fff}
.cell .num{font-family:'Bangers',cursive}
.cell.mined{background:#ffffff !important}

/* ---- mint modal ---- */
.modal h3{font-family:'Bangers',cursive !important}
.state-active{background:var(--blue) !important;color:#fff !important;border:2px solid var(--ink)}
.state-mined{background:var(--yellow) !important;color:#0a0a0a !important}
.modal .xlink{background:var(--paper) !important;border:2px solid var(--ink) !important}
.kv{border-bottom:2px solid var(--line) !important}

/* ---- celebration ---- */
.cel-card{background:var(--surface) !important;border:4px solid var(--ink) !important;border-radius:14px !important;box-shadow:8px 8px 0 var(--ink) !important;clip-path:none !important}
.cel-card h2{font-family:'Bangers',cursive !important;color:var(--red)}
.cel-ribbon{background:var(--red) !important;border:2px solid var(--ink);box-shadow:3px 3px 0 var(--ink)}

/* ---- running-lane mint cards ---- */
.mc-tag{background:var(--red) !important;color:#fff !important;border:2px solid var(--ink);border-radius:4px}
.mc-num{font-family:'Bangers',cursive}
.mintcard.newest{box-shadow:5px 5px 0 var(--red) !important}

/* ---- RUNNING BLOCKS lane cubes + mosaic → comic pop-art (match homepage palette) ---- */
/* isometric cube: bright comic front + solid ink (black) side faces; text color per-state via --ink */
.cube{--front:var(--blue) !important;--top:#0a0a0a !important;--right:#0a0a0a !important;--ink:#fff}
.cube .front{border:2px solid #0a0a0a}
.lane-cube.upcoming{--front:var(--sky) !important;--top:#0a0a0a !important;--right:#0a0a0a !important;--ink:#0a0a0a}   /* future = sky */
.lane-cube.upcoming.next{--front:var(--yellow) !important}                                                          /* ● NEXT = yellow */
.lane-cube.active{--front:var(--red) !important;--top:#0a0a0a !important;--right:#0a0a0a !important;--ink:#fff}        /* mineable = red */
.lane-cube.confirmed{--top:#0a0a0a !important;--right:#0a0a0a !important}                                            /* minted = art + ink faces */
.lane-cube .cnum{font-family:'Bangers',cursive !important;color:var(--ink) !important;text-shadow:none !important}
.lane-cube .cpos,.lane-cube .cminer,.lane-cube .cminer a{color:var(--ink) !important}
.lane-cube .ctag{background:#0a0a0a !important;color:#fff !important;border-radius:3px}
.lane-cube.confirmed .ctag.mined{background:var(--yellow) !important;color:#0a0a0a !important}
.lane-cube .cmine,.lane-cube .cmine.soon{background:#0a0a0a1a !important;color:var(--ink) !important}
/* drop the neon glows for crisp comic edges */
.lane-cube.upcoming.next .front,.lane-cube.active .front,.lane-cube.confirmed.newest .front,.live-block .front,.live-block.running .front{box-shadow:none !important}

/* ---- 3D isometric running blocks: chunky depth + shaded COLOUR faces (not flat black) ---- */
/* deeper extrusion, scoped to the lane so other .cube uses are untouched */
.lane-cube::before{left:12px !important;top:-24px !important;height:24px !important;border-radius:6px 6px 0 0 !important}   /* top face  */
.lane-cube::after{right:-24px !important;top:-12px !important;width:24px !important;border-radius:0 6px 6px 0 !important}   /* right face */
/* ink-outline the 3D silhouette + a comic gloss on the front so it reads as a solid block */
.lane-cube::before,.lane-cube::after{box-shadow:inset 0 0 0 2px #0a0a0a33 !important}
.lane-cube .front{box-shadow:inset 0 3px 0 #ffffff33, inset 0 -5px 0 #00000026 !important}
/* per-state face shading — lighter top, darker right = light hitting a cube from top-left */
.cube{--top:#5b82ff !important;--right:#16309e !important}                        /* default blue      */
.lane-cube.upcoming{--top:#8ad8ff !important;--right:#2f8fc0 !important}          /* sky  · upcoming   */
.lane-cube.upcoming.next{--top:#ffe75a !important;--right:#c9a600 !important}     /* yellow · ● NEXT   */
.lane-cube.active{--top:#ff6f74 !important;--right:#b3161c !important}            /* red  · mineable   */
.lane-cube.confirmed{--top:#524a6d !important;--right:#1b1830 !important}         /* minted art → slate faces */
.lane-cube:hover{transform:translateY(-7px)}                                     /* lift = picked-up block */

/* mosaic tiles → 3D comic blocks: each cell is a raised chiclet (light top-left / dark bottom-right
   bevel = the same lit-from-top-left shading as the running-block cubes) — a wall of mineable blocks
   that reveals into a 3D-tiled mosaic. Revealed keeps a lighter bevel so the face image still reads. */
.tile.future{background:var(--paper) !important;box-shadow:inset 2px 2px 0 rgba(255,255,255,.6),inset -3px -3px 0 rgba(0,0,0,.10),inset 0 0 0 1px #0a0a0a1a !important}
.tile.masked{background:var(--sky) !important;box-shadow:inset 3px 3px 0 rgba(255,255,255,.5),inset -4px -4px 0 rgba(0,0,0,.30),inset 0 0 0 1px #0a0a0a !important}
.tile.masked:hover{z-index:4 !important;box-shadow:inset 2px 2px 0 rgba(255,255,255,.55),inset -3px -3px 0 rgba(0,0,0,.34),inset 0 0 0 2px var(--ink),0 0 12px var(--red) !important}
.tile.revealed{box-shadow:inset 2px 2px 0 rgba(255,255,255,.24),inset -3px -3px 0 rgba(0,0,0,.36),inset 0 0 0 .5px #0a0a0a !important}
.tile.revealed:hover{box-shadow:0 0 0 2px var(--ink),6px 6px 0 var(--red) !important}
.tile.upcoming-tile{background:var(--paper) !important;box-shadow:inset 2px 2px 0 rgba(255,255,255,.6),inset -3px -3px 0 rgba(0,0,0,.10),inset 0 0 0 1px #0a0a0a1a !important}

/* ---- leaderboard ---- */
.lb-rank{font-family:'Bangers',cursive !important;color:var(--ink) !important}
.lb-count{color:var(--red) !important}
.lb-buy{border:2px dashed var(--ink) !important;color:#0a0a0a !important;background:var(--yellow) !important}

/* ---- gate panel ---- */
#gatePanel h2{font-family:'Bangers',cursive !important}

/* ---- foot ---- */
.foot{color:var(--mut) !important}
.foot code,.foot .mono{color:var(--blue) !important}

/* ============ GALLERY page ============ */
.gtitle{font-family:'Bangers',cursive !important;color:var(--red) !important;text-shadow:2px 2px 0 var(--ink)}
.gnav a,.gnav button{font-family:'Bangers',cursive !important;border:3px solid var(--ink) !important;border-radius:6px !important;box-shadow:3px 3px 0 var(--ink) !important;background:var(--yellow) !important;color:#0a0a0a !important;cursor:pointer;padding:9px 16px;font-size:14px}
.gnav a:hover,.gnav button:hover{color:var(--red) !important;transform:translate(2px,2px);box-shadow:1px 1px 0 var(--ink) !important}
.gnav #connectBtn{background:var(--red) !important;color:#fff !important}
.ghdr{color:var(--mut) !important;font-family:'Bangers',cursive;letter-spacing:.06em;font-size:15px}
.filters select,.filters input{background:var(--surface) !important;color:var(--ink) !important;border:2px solid var(--ink) !important;border-radius:6px !important;font-weight:700}
.hrow{background:var(--paper) !important;border:2px solid var(--ink) !important;border-radius:6px !important}
.hrank{color:var(--red) !important}
.grar{color:var(--blue) !important}
.gtr,.gcount{color:var(--mut) !important}
.gid{color:var(--ink)}
.gcard canvas.gart{background:var(--paper) !important}
.pill{border:2px solid var(--ink) !important}
.more{background:var(--yellow) !important;border:3px solid var(--ink) !important;border-radius:6px !important;box-shadow:4px 4px 0 var(--ink) !important;color:#0a0a0a !important;font-family:'Bangers',cursive}

/* ---- comic theme: mobile refinements (mine + gallery) ---- */
@media(max-width:640px){
  header{gap:8px !important;padding:10px 12px !important}
  .logo{font-size:16px !important}
  #darkToggle{padding:6px 9px !important;font-size:16px !important}
  button,.btn-wow,.btn-ghost{box-shadow:3px 3px 0 var(--ink) !important;border-width:2px !important}
  .stat,.progress-card,.modal,.mintcard,.gpanel,.gcard,.grid-scroll,#gatePanel{box-shadow:4px 4px 0 var(--ink) !important}
  .gtop{gap:8px}
  .gnav{display:flex;flex-wrap:wrap;gap:6px}
  .gnav a,.gnav button{padding:7px 11px !important;font-size:13px !important;box-shadow:2px 2px 0 var(--ink) !important;margin-left:0 !important}
  .section-h h2{border-left-width:4px !important;padding-left:9px}
}
@media(max-width:400px){
  .logo{font-size:14px !important}
  header{gap:6px !important;padding:9px 10px !important}
  button,.btn-wow,.btn-ghost{font-size:12px !important}
  #darkToggle{padding:5px 8px !important}
}

/* ---- wrong-network warning pill (auto network detection) ---- */
.net-pill.wrong-net{background:var(--red) !important;color:#fff !important;border-color:var(--ink) !important}
.net-pill.wrong-net .dot{background:#fff !important;box-shadow:none !important}

/* ---- unify mining + gallery menus with the main page: secondary links = plain Bangers text, hover red ---- */
header > a.btn-ghost{
  background:transparent !important;border:0 !important;box-shadow:none !important;border-radius:0 !important;
  color:#0a0a0a !important;font-family:'Bangers',cursive !important;font-size:20px !important;
  letter-spacing:.04em !important;padding:2px 6px !important;
}
header > a.btn-ghost:hover{transform:none !important;color:var(--red) !important}
.gnav a:not(#connectBtn){
  background:transparent !important;border:0 !important;box-shadow:none !important;border-radius:0 !important;
  color:var(--ink) !important;font-family:'Bangers',cursive !important;font-size:20px !important;
  letter-spacing:.04em !important;padding:2px 6px !important;
}
.gnav a:not(#connectBtn):hover{transform:none !important;color:var(--red) !important}

/* ---- gallery: rarity + status text readable on BOTH white (light) and dark cards ---- */
.tier-leg{color:#b8760a !important} .tier-epic{color:#7b2fd6 !important} .tier-rare{color:#1f7fd1 !important}
.tier-unc{color:#178a41 !important} .tier-com{color:var(--mut) !important}
.grar{color:var(--blue) !important}
.mintedp{color:#178a41 !important;border-color:var(--ink) !important}
.openp{color:#1f7fd1 !important;border-color:var(--ink) !important}
body.dark .tier-leg{color:#ffd54a !important} body.dark .tier-epic{color:#c77dff !important}
body.dark .tier-rare{color:#5ad1ff !important} body.dark .tier-unc{color:#7CFC9B !important}
body.dark .grar{color:#5ad1ff !important}
body.dark .mintedp{color:#7CFC9B !important} body.dark .openp{color:#5ad1ff !important}
/* gallery body/meta text → always theme-aware */
.gmeta,.gid,.gown,.haddr,.hcount,.hrow{color:var(--ink) !important}
.gtr,.gcount,.ghdr{color:var(--mut) !important}

/* ===== homepage-style nav layout on mining + gallery (match the main-page menu) ===== */
header{display:block !important;padding:0 !important;position:sticky;top:0;z-index:60}
header .wrap{max-width:1160px;margin:0 auto;display:flex;align-items:center;gap:16px;height:70px;padding:0 20px !important}
header .logo{font-size:26px !important;-webkit-text-stroke:2px #0a0a0a;text-stroke:2px #0a0a0a;text-decoration:none;line-height:1;color:var(--red) !important}
header .spacer,header .sp{flex:1}
header .lnk{font-family:'Bangers',cursive !important;font-size:20px;letter-spacing:.04em;color:#0a0a0a !important;text-decoration:none;padding:2px 6px;white-space:nowrap}
header .lnk:hover{color:var(--red) !important}
@media(max-width:640px){
  header .wrap{height:auto;min-height:56px;gap:9px;flex-wrap:wrap;padding:9px 15px !important}
  header .logo{font-size:20px !important}
  header .lnk{font-size:17px}
}

/* ---- brand tagline bar (mining + gallery) ---- */
.tagbar{font-family:'Bangers',cursive !important;text-align:center;background:var(--red);color:#fff;
  border-bottom:4px solid var(--ink);padding:7px 12px;font-size:19px;letter-spacing:.07em;
  background-image:radial-gradient(rgba(0,0,0,.22) 1.8px,transparent 2px);background-size:15px 15px}
@media(max-width:640px){.tagbar{font-size:15px;padding:6px 10px}}