@font-face{
  font-family:"Creator Genius";
  src:url("/public/fonts/creator-genius.ttf") format("truetype");
  font-weight:400;
  font-display:swap;
}
:root{
  --display:"Creator Genius","Bricolage Grotesque",system-ui,sans-serif;
  --bg:#0b0f0c;
  --bg-2:#0f1611;
  --card:#111813;
  --ink:#eef6ee;
  --ink-dim:#a3b6a8;
  --ink-faint:#6d8074;
  --line:rgba(255,255,255,.08);
  --line-2:rgba(255,255,255,.14);
  --acc:#38e07a;
  --acc-soft:#8ff0b4;
  --acc-deep:#12351f;
  --amber:#f0c869;
  --red:#ff6b7a;
  --shadow:0 10px 30px rgba(0,0,0,.38);
  --mono:"Spline Sans Mono",ui-monospace,monospace;
  --sans:"Bricolage Grotesque",system-ui,sans-serif;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;color:var(--ink);background:var(--bg);font-family:var(--sans);
  background-image:radial-gradient(120% 80% at 100% -10%,rgba(56,224,122,.06),transparent 55%),linear-gradient(180deg,#0b0f0c,#0a0d0b);
  background-attachment:fixed;
}
a{color:inherit;text-decoration:none}
button,input,select{font:inherit;color:inherit}
h1,h2,p,dl,dd{margin:0}
code{font-family:var(--mono);font-size:.9em;color:var(--acc)}
.scanline{position:fixed;inset:0;z-index:60;pointer-events:none;opacity:.35;background:repeating-linear-gradient(180deg,transparent 0 3px,rgba(0,0,0,.15) 3px 4px);mix-blend-mode:overlay}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

.wrap{width:min(1180px,calc(100% - 34px));margin:0 auto;padding:22px 0 40px}

/* top bar */
.top{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-bottom:18px;border-bottom:1px solid var(--line)}
.wordmark{display:flex;align-items:center;gap:10px}
.glyph{display:grid;place-items:center;width:30px;height:30px;border:1px solid var(--line-2);border-radius:8px;color:var(--acc);font-size:16px;transform:translateY(-1px)}
.word{font-family:var(--display);font-weight:800;letter-spacing:.01em;font-size:20px}
.word em{font-style:normal;color:var(--ink-faint);font-weight:600;font-family:var(--mono);font-size:12px;letter-spacing:0}
.top-right{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.live-pill{display:inline-flex;align-items:center;gap:8px;padding:6px 11px;border:1px solid var(--line);border-radius:999px;font-family:var(--mono);font-size:12px;color:var(--ink-dim);background:var(--bg-2)}
.pulse{width:7px;height:7px;border-radius:50%;background:var(--acc);box-shadow:0 0 0 0 rgba(56,224,122,.55);animation:beat 2.4s infinite}
.pulse.stale{background:var(--red);animation:none}
@keyframes beat{0%{box-shadow:0 0 0 0 rgba(56,224,122,.5)}70%{box-shadow:0 0 0 7px rgba(56,224,122,0)}100%{box-shadow:0 0 0 0 rgba(56,224,122,0)}}
.ghost-btn{padding:6px 12px;border:1px solid var(--line);border-radius:999px;background:transparent;font-family:var(--mono);font-size:12px;color:var(--ink-dim);cursor:pointer;transition:border-color .15s,color .15s}
.ghost-btn:hover{border-color:var(--acc);color:var(--ink)}
.ghost-btn.on{border-color:var(--acc);color:var(--acc)}

/* ticker tape */
.tape{margin-top:14px;border:1px solid var(--line);border-radius:10px;background:var(--bg-2);overflow:hidden;position:relative}
.tape:before,.tape:after{content:"";position:absolute;top:0;bottom:0;width:46px;z-index:2;pointer-events:none}
.tape:before{left:0;background:linear-gradient(90deg,var(--bg-2),transparent)}
.tape:after{right:0;background:linear-gradient(270deg,var(--bg-2),transparent)}
.tape-track{display:flex;gap:30px;white-space:nowrap;padding:9px 0;padding-left:30px;animation:tape 42s linear infinite;width:max-content}
.tape:hover .tape-track{animation-play-state:paused}
@keyframes tape{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.tape-item{font-family:var(--mono);font-size:12.5px;color:var(--ink-dim)}
.tape-item b{color:var(--ink);font-weight:600}
.tape-item .up{color:var(--acc)}
.tape-item.muted{color:var(--ink-faint)}

/* KPI strip */
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:22px}
.kpi{position:relative;background:linear-gradient(180deg,var(--card),#0e150f);border:1px solid var(--line);border-radius:14px;padding:19px 18px 16px;transition:border-color .18s,transform .14s,box-shadow .18s;overflow:hidden}
.kpi:before{content:"";position:absolute;left:0;top:0;right:0;height:2px;background:linear-gradient(90deg,transparent,var(--line-2),transparent);opacity:.5}
.kpi:hover{border-color:var(--line-2);transform:translateY(-2px);box-shadow:var(--shadow)}
.kpi-val{font-family:var(--mono);font-size:29px;font-weight:600;letter-spacing:-.02em;color:var(--ink);line-height:1;font-variant-numeric:tabular-nums}
.kpi-lbl{margin-top:11px;font-family:var(--mono);font-size:11px;text-transform:uppercase;letter-spacing:.09em;color:var(--ink-dim)}
/* first KPI is the headline metric — brighter, accented */
.kpi.lead{background:linear-gradient(180deg,#12291b,#0d1a12);border-color:rgba(56,224,122,.28)}
.kpi.lead:before{background:linear-gradient(90deg,transparent,var(--acc),transparent);opacity:.9}
.kpi.lead .kpi-val{color:var(--acc);font-size:33px}
.kpi.lead .kpi-lbl{color:var(--acc-soft)}

/* controls */
.controls{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;margin-top:20px}
.control-left{flex:1;min-width:240px}
.control-right{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.search{position:relative;display:flex;align-items:center}
.search-i{position:absolute;left:13px;color:var(--ink-faint);font-size:15px;pointer-events:none}
.search input{width:100%;height:44px;padding:0 14px 0 36px;border:1px solid var(--line-2);border-radius:11px;background:var(--bg-2);font-family:var(--mono);font-size:13px;color:var(--ink);outline:none;transition:border-color .15s}
.search input:focus{border-color:var(--acc)}
.segment{display:inline-flex;padding:3px;border:1px solid var(--line);border-radius:11px;background:var(--bg-2);gap:2px}
.seg-btn{padding:7px 12px;border:0;border-radius:8px;background:transparent;font-family:var(--mono);font-size:12px;color:var(--ink-dim);cursor:pointer;transition:background .12s,color .12s;white-space:nowrap}
.seg-btn:hover{color:var(--ink)}
.seg-btn.active{background:var(--acc);color:#04140a;font-weight:600}
.run-btn{height:44px;padding:0 18px;border:1px solid var(--line-2);border-radius:11px;background:var(--bg-2);color:var(--ink);font-weight:600;font-size:12.5px;cursor:pointer;transition:border-color .15s,color .15s;font-family:var(--mono)}
.run-btn:hover{border-color:var(--acc);color:var(--acc)}
.run-btn:active{transform:translateY(1px)}
.run-btn:disabled{opacity:.55;cursor:default}
.scan-meta{font-family:var(--mono);font-size:11.5px;color:var(--ink-faint);margin-top:10px}
.live-dot{width:8px;height:8px;border-radius:50%;background:var(--acc);box-shadow:0 0 0 0 rgba(56,224,122,.5);animation:beat 2s infinite}

/* grid */
.grid{display:grid;grid-template-columns:1.62fr .88fr;gap:20px;margin-top:22px;align-items:start}
.col-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:12px}
.col-head h2{font-size:16px;font-weight:800;letter-spacing:-.01em;display:flex;align-items:center;gap:9px}
.col-head h2:before{content:"";width:3px;height:15px;border-radius:2px;background:var(--acc);box-shadow:0 0 10px rgba(56,224,122,.4)}
.tag{font-family:var(--mono);font-size:11px;color:var(--ink-faint);border:1px solid var(--line);border-radius:999px;padding:3px 9px}

/* mint list (CatchMint-style dense rows) */
.mint-head{display:grid;grid-template-columns:28px 48px 1fr 168px 88px;gap:16px;align-items:center;padding:12px 18px;font-family:var(--mono);font-size:10.5px;text-transform:uppercase;letter-spacing:.1em;color:var(--ink-dim);background:var(--bg-2);border:1px solid var(--line);border-bottom:0;border-radius:14px 14px 0 0}
.mint-head .mh-supply{text-align:left}
.mint-head .mh-right{text-align:right}
@media(max-width:560px){.mint-head{display:none}}
.mint-list{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:0 0 14px 14px;overflow:hidden;background:var(--card)}
.mint-list .loading{padding:22px;font-family:var(--mono);font-size:13px;color:var(--ink-faint)}
.mint-row{position:relative;display:grid;grid-template-columns:28px 48px 1fr 168px 88px;gap:16px;align-items:center;padding:15px 18px;border-bottom:1px solid var(--line);transition:background .12s}
.mint-row:last-child{border-bottom:0}
.mint-row:before{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;background:var(--acc);opacity:0;transition:opacity .12s}
.mint-row:hover{background:rgba(56,224,122,.05)}
.mint-row:hover:before{opacity:1}
.mint-row.fresh{animation:slideIn .5s ease}
.mint-row.surging{background:rgba(56,224,122,.06)}
.mint-row.flash{animation:rowFlash 1.6s ease}
.mint-row.flash:before{opacity:1}
@keyframes rowFlash{0%{background:rgba(56,224,122,.28)}30%{background:rgba(56,224,122,.16)}100%{background:transparent}}
.mint-rank{display:grid;place-items:center;width:24px;height:24px;margin:0 auto;border-radius:7px;background:var(--bg-2);border:1px solid var(--line);font-family:var(--mono);font-size:11.5px;color:var(--ink-dim);font-variant-numeric:tabular-nums}
.mint-row:nth-child(1) .mint-rank,.mint-row:nth-child(2) .mint-rank,.mint-row:nth-child(3) .mint-rank{color:var(--acc);border-color:rgba(56,224,122,.35)}
.mint-av{width:48px;height:48px;border-radius:10px;overflow:hidden;background:linear-gradient(135deg,var(--acc-deep),#0c1a11);display:grid;place-items:center;font-family:var(--mono);font-size:14px;font-weight:600;color:var(--acc);border:1px solid var(--line);cursor:zoom-in}
.mint-av img{width:100%;height:100%;object-fit:cover}
.mint-info{min-width:0}
.mint-name{display:flex;align-items:center;gap:9px;font-weight:600;font-size:15.5px;min-width:0}
.mint-name .nm{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:0 1 auto;min-width:0}
.mint-name .chip{flex:0 0 auto}
.mint-name.unknown .nm{color:var(--ink-dim);font-weight:500}
.mint-name a:hover{color:var(--acc)}
.mint-meta{margin-top:6px;font-family:var(--mono);font-size:12.5px;color:var(--ink-dim);display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.mint-meta a{color:var(--ink-dim)}
.mint-meta a:hover{color:var(--acc)}
.mint-meta .link{color:var(--ink-faint);opacity:.6}
.mint-supply{min-width:0}
.mint-supply .supply-track{height:5px;border-radius:99px;background:rgba(255,255,255,.08);overflow:hidden}
.mint-supply .supply-track span{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,var(--acc),#7bf0a6)}
.mint-supply .supply-txt{margin-top:6px;display:block;font-family:var(--mono);font-size:12px;color:var(--ink-dim);font-variant-numeric:tabular-nums}
.mint-right{text-align:right;min-width:0}
.mint-when{font-family:var(--mono);font-size:13.5px;font-weight:500;color:var(--ink);font-variant-numeric:tabular-nums;white-space:nowrap}
.mint-price{margin-top:5px;font-family:var(--mono);font-size:12px;font-weight:500;color:var(--ink-dim);font-variant-numeric:tabular-nums;white-space:nowrap}
.mint-price.free{color:var(--acc)}
.mint-price.paid{color:var(--amber)}
.mint-badges{display:flex;gap:6px;align-items:center;flex-wrap:wrap}

/* recent mints sidebar */
.recent-list{display:flex;flex-direction:column;gap:2px;max-height:680px;overflow:auto;-webkit-mask-image:linear-gradient(180deg,#000 calc(100% - 26px),transparent);mask-image:linear-gradient(180deg,#000 calc(100% - 26px),transparent);padding-bottom:6px}
.recent-list.loading{padding:18px;font-family:var(--mono);font-size:13px;color:var(--ink-faint)}
.recent-list::-webkit-scrollbar{width:7px}
.recent-list::-webkit-scrollbar-thumb{background:var(--line-2);border-radius:99px}
.recent-row{display:grid;grid-template-columns:30px 1fr auto;gap:10px;align-items:center;padding:9px 8px;border-radius:9px;transition:background .12s;cursor:pointer}
.recent-row:hover{background:rgba(56,224,122,.06)}
.recent-row .recent-body{min-width:0}
.recent-row:hover .recent-name{color:var(--acc-soft)}
.recent-row.fresh{animation:slideIn .45s ease}
.recent-av{width:30px;height:30px;border-radius:7px;overflow:hidden;background:linear-gradient(135deg,var(--acc-deep),#0c1a11);display:grid;place-items:center;font-family:var(--mono);font-size:10px;color:var(--acc);cursor:zoom-in}
.recent-av img{width:100%;height:100%;object-fit:cover}
.recent-body{min-width:0}
.recent-name{font-weight:600;font-size:13.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.recent-name.unknown{color:var(--ink-dim);font-weight:500}
.recent-sub{margin-top:3px;font-family:var(--mono);font-size:11.5px;color:var(--ink-faint)}
.recent-right{text-align:right;font-family:var(--mono);font-size:11.5px;white-space:nowrap}
.recent-right .rp{color:var(--ink-dim)}
.recent-right .rp.free{color:var(--acc)}
.recent-right .rt{color:var(--ink-faint);margin-top:2px}

/* feed */
.feed{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--card)}
.feed.loading,.hot-list.loading,.os-list.loading{padding:22px;font-family:var(--mono);font-size:13px;color:var(--ink-faint)}
.feed-row{position:relative;display:grid;grid-template-columns:38px 1fr auto;gap:13px;align-items:center;padding:13px 15px;border-bottom:1px solid var(--line);transition:background .12s}
.feed-row:before{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;background:var(--acc);opacity:0;transition:opacity .12s}
.feed-row:last-child{border-bottom:0}
.feed-row:hover{background:rgba(56,224,122,.05)}
.feed-row:hover:before{opacity:1}
.feed-row.fresh{animation:slideIn .5s ease}
@keyframes slideIn{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
.thumb{width:38px;height:38px;border-radius:9px;overflow:hidden;background:linear-gradient(135deg,var(--acc-deep),#0c1a11);display:grid;place-items:center;font-family:var(--mono);font-size:12px;font-weight:600;color:var(--acc);border:1px solid var(--line)}
.thumb img{width:100%;height:100%;object-fit:cover}
.feed-main{min-width:0}
.feed-name{font-weight:600;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.feed-name.unknown{color:var(--ink-dim);font-weight:500}
.feed-sub{margin-top:4px;font-family:var(--mono);font-size:11.5px;color:var(--ink-faint);display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.feed-sub a:hover{color:var(--acc)}
.feed-sub .by{color:var(--ink-faint)}
.feed-sub .minter-link{color:var(--ink-dim)}
.feed-sub .minter-link:hover{color:var(--acc)}
.feed-right{text-align:right;font-family:var(--mono);font-size:11px;color:var(--ink-faint);white-space:nowrap;font-variant-numeric:tabular-nums}
.feed-right .tok{color:var(--ink);font-size:14px;font-weight:500}
.feed-right .blk{color:var(--ink-faint);margin-top:3px}
.feed-right .blk a:hover{color:var(--acc)}

/* hot list */
.hot-list{display:grid;grid-template-columns:1fr 1fr;gap:8px}
@media(max-width:620px){.hot-list{grid-template-columns:1fr}}
.hot-row{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:center;padding:12px 13px;border:1px solid var(--line);border-radius:11px;background:var(--card);transition:border-color .15s,box-shadow .3s,transform .12s}
.hot-row:hover{border-color:var(--line-2);transform:translateY(-1px)}
.hot-row .rank{font-family:var(--mono);font-size:11px;color:var(--ink-faint)}
.hot-left{display:flex;gap:10px;align-items:center;min-width:0}
.hot-info{min-width:0}
.hot-av{width:34px;height:34px;flex:0 0 auto;border-radius:8px;overflow:hidden;background:linear-gradient(135deg,var(--acc-deep),#0c1a11);border:1px solid var(--line)}
.hot-av img{width:100%;height:100%;object-fit:cover}
.hot-row.surging{border-color:rgba(56,224,122,.55);box-shadow:inset 0 0 0 1px rgba(56,224,122,.3),0 0 22px rgba(56,224,122,.12);animation:surgePulse 2.6s ease-in-out infinite}
@keyframes surgePulse{50%{box-shadow:inset 0 0 0 1px rgba(56,224,122,.45),0 0 30px rgba(56,224,122,.22)}}
.chip.vel{color:var(--amber);border-color:rgba(240,200,105,.35)}
.chip.vel.surge{color:#04140a;background:var(--acc);border-color:var(--acc);font-weight:600}
.chip.new{color:#04140a;background:var(--amber);border-color:var(--amber);font-weight:700;letter-spacing:.04em}
.supply{margin-top:7px;display:flex;align-items:center;gap:8px}
.supply-track{flex:1;height:5px;border-radius:99px;background:rgba(255,255,255,.08);overflow:hidden}
.supply-track span{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,var(--acc),#7bf0a6)}
.supply-txt{font-family:var(--mono);font-size:10.5px;color:var(--ink-faint);white-space:nowrap;font-variant-numeric:tabular-nums}
.hot-name{font-weight:600;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hot-info{flex:1}
.hot-name.unknown{color:var(--ink-dim);font-weight:500}
.hot-sub{margin-top:5px;font-family:var(--mono);font-size:12px;color:var(--ink-faint);display:flex;gap:8px;flex-wrap:wrap}
.hot-sub a:hover{color:var(--acc)}
.hot-count{text-align:right;font-family:var(--mono);font-variant-numeric:tabular-nums}
.hot-count b{display:block;font-size:21px;font-weight:600;color:var(--acc);line-height:1}
.hot-count span{margin-top:2px;font-size:10px;color:var(--ink-dim);text-transform:uppercase;letter-spacing:.12em}
.hot-row:first-child{border-color:rgba(56,224,122,.28)}

/* opensea list */
.os-list{display:grid;grid-template-columns:1fr 1fr;gap:7px;max-height:400px;overflow:auto;-webkit-mask-image:linear-gradient(180deg,#000 calc(100% - 22px),transparent);mask-image:linear-gradient(180deg,#000 calc(100% - 22px),transparent);padding-bottom:4px}
@media(max-width:620px){.os-list{grid-template-columns:1fr}}
.os-list::-webkit-scrollbar{width:7px}
.os-list::-webkit-scrollbar-thumb{background:var(--line-2);border-radius:99px}
.os-row{display:grid;grid-template-columns:30px 1fr;gap:10px;align-items:center;padding:9px 11px;border:1px solid var(--line);border-radius:10px;background:var(--card)}
.os-row:hover{border-color:var(--line-2)}
.os-av{width:30px;height:30px;border-radius:7px;overflow:hidden;background:radial-gradient(120% 120% at 30% 20%,var(--acc-deep),#0a1610);display:grid;place-items:center;font-family:var(--mono);font-size:11px;font-weight:600;color:var(--acc-soft);border:1px solid rgba(56,224,122,.16);box-shadow:inset 0 0 0 1px rgba(255,255,255,.03)}
.os-av img{width:100%;height:100%;object-fit:cover}
.os-body{min-width:0}
.os-name{font-weight:600;font-size:13.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.os-name.unknown{color:var(--ink-dim);font-weight:500}
.os-links{margin-top:4px;display:flex;gap:10px;font-family:var(--mono);font-size:11.5px;color:var(--ink-faint)}
.os-links a:hover{color:var(--acc)}

.chip{font-family:var(--mono);font-size:11px;padding:2px 7px;border:1px solid var(--line);border-radius:6px;color:var(--ink-dim)}
.chip.live{color:var(--acc);border-color:rgba(56,224,122,.4)}
.link{color:var(--ink-dim)}
.empty,.error{padding:20px;font-family:var(--mono);font-size:13px;color:var(--ink-faint)}
.error{color:var(--red)}

/* thumbnails are tappable to open the art */
.thumb,.hot-av,.os-av{cursor:zoom-in}

/* lightbox */
.lightbox{position:fixed;inset:0;z-index:100;display:none;align-items:center;justify-content:center;padding:24px;background:rgba(4,8,5,.86);backdrop-filter:blur(6px)}
.lightbox.open{display:flex;animation:lbIn .18s ease}
@keyframes lbIn{from{opacity:0}to{opacity:1}}
.lightbox-inner{position:relative;display:flex;flex-direction:column;gap:12px;max-width:min(560px,92vw)}
.lightbox-close{position:absolute;top:-14px;right:-14px;width:34px;height:34px;display:grid;place-items:center;border:1px solid var(--line-2);border-radius:50%;background:var(--card);color:var(--ink);font-size:15px;cursor:pointer;transition:border-color .15s,color .15s;z-index:1}
.lightbox-close:hover{border-color:var(--acc);color:var(--acc)}
.lightbox-inner img{width:100%;height:auto;max-height:76vh;object-fit:contain;border-radius:14px;border:1px solid var(--line-2);background:var(--card)}
.lightbox-cap{display:flex;align-items:center;justify-content:space-between;gap:14px;font-family:var(--mono);font-size:13px;color:var(--ink)}
.lightbox-cap a{color:var(--acc)}
.lightbox-cap a:hover{text-decoration:underline}

/* clickable collection name in Mints overview */
.mint-name .nm[data-detail]{cursor:pointer;transition:color .13s;border-bottom:1px dashed transparent}
.mint-name .nm[data-detail]:hover{color:var(--acc-soft);border-bottom-color:rgba(143,240,180,.4)}
.mint-name .nm[data-detail]:focus-visible{outline:2px solid var(--acc);outline-offset:2px;border-radius:3px}

/* ── collection detail modal (CatchMint-style) ─────────────────────── */
.detail{position:fixed;inset:0;z-index:120;display:none;align-items:center;justify-content:center;padding:24px 20px;background:rgba(4,8,5,.82);backdrop-filter:blur(7px);overflow:auto}
.detail-card{margin:auto}
.detail.open{display:flex;animation:lbIn .18s ease}
.detail-card{position:relative;width:min(720px,94vw);background:linear-gradient(180deg,var(--card),#0c130e);border:1px solid var(--line-2);border-radius:20px;padding:26px;box-shadow:0 30px 80px rgba(0,0,0,.6),inset 0 1px 0 rgba(255,255,255,.04);animation:dtIn .22s cubic-bezier(.2,.7,.3,1)}
@keyframes dtIn{from{opacity:0;transform:translateY(14px) scale(.985)}to{opacity:1;transform:none}}
.detail-close{position:absolute;top:16px;right:16px;width:34px;height:34px;display:grid;place-items:center;border:1px solid var(--line-2);border-radius:50%;background:var(--bg-2);color:var(--ink);font-size:15px;cursor:pointer;transition:border-color .15s,color .15s;z-index:1}
.detail-close:hover{border-color:var(--acc);color:var(--acc)}
.dt-head{display:grid;grid-template-columns:150px 1fr;gap:22px;align-items:start}
@media(max-width:540px){.dt-head{grid-template-columns:1fr;justify-items:center;text-align:center}}
.dt-art{width:150px;height:150px;border-radius:16px;overflow:hidden;border:1px solid var(--line-2);background:linear-gradient(135deg,var(--acc-deep),#0a1610);display:grid;place-items:center;cursor:zoom-in}
.dt-art img{width:100%;height:100%;object-fit:cover}
.dt-art.noimg{font-family:var(--mono);font-size:40px;font-weight:700;color:var(--acc-soft)}
.dt-headinfo{min-width:0;display:flex;flex-direction:column;gap:9px}
.dt-name{font-family:var(--display);font-size:26px;font-weight:800;letter-spacing:-.01em;line-height:1.15;display:flex;align-items:center;gap:9px;flex-wrap:wrap}
@media(max-width:540px){.dt-name{justify-content:center}}
.dt-contract{font-family:var(--mono);font-size:12.5px}
.dt-contract a{color:var(--ink-dim)}
.dt-contract a:hover{color:var(--acc)}
.dt-supply{margin-top:4px}
.dt-supply-top{display:flex;justify-content:space-between;gap:12px;font-family:var(--mono);font-size:12px;color:var(--ink-dim);margin-bottom:6px}
.dt-bar{height:8px;border-radius:99px;background:var(--bg-2);border:1px solid var(--line);overflow:hidden}
.dt-bar span{display:block;height:100%;background:linear-gradient(90deg,var(--acc),var(--acc-soft));border-radius:99px}
.dt-links{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px}
@media(max-width:540px){.dt-links{justify-content:center}}
.dt-link{font-family:var(--mono);font-size:12px;padding:5px 11px;border:1px solid var(--line-2);border-radius:8px;color:var(--ink-dim);transition:border-color .13s,color .13s,background .13s}
.dt-link:hover{border-color:var(--acc);color:var(--acc);background:rgba(56,224,122,.06)}
.dt-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:22px}
@media(max-width:540px){.dt-stats{grid-template-columns:repeat(2,1fr)}}
.dt-stat{background:var(--bg-2);border:1px solid var(--line);border-radius:12px;padding:13px 14px}
.dt-stat-v{font-size:18px;font-weight:800;letter-spacing:-.01em}
.dt-stat-k{font-family:var(--mono);font-size:10.5px;text-transform:uppercase;letter-spacing:.09em;color:var(--ink-dim);margin-top:3px}
.dt-section{margin:24px 0 10px;font-family:var(--mono);font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:var(--ink-dim);display:flex;align-items:center;gap:8px}
.dt-section:before{content:"";width:3px;height:13px;border-radius:2px;background:var(--acc);box-shadow:0 0 8px rgba(56,224,122,.4)}
.dt-activity{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:12px;overflow:hidden}
.dt-ev{display:grid;grid-template-columns:auto 1fr auto auto;gap:12px;align-items:center;padding:10px 14px;border-bottom:1px solid var(--line);font-size:13px}
.dt-ev:last-child{border-bottom:0}
.dt-ev-id{font-family:var(--mono);font-weight:600}
.dt-ev-mid{font-family:var(--mono);font-size:11.5px;color:var(--ink-faint);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dt-ev-mid a{color:var(--ink-dim)}
.dt-ev-mid a:hover{color:var(--acc)}
.dt-ev-p{font-family:var(--mono);font-size:12.5px;text-align:right}
.dt-ev-p.free{color:var(--acc)}
.dt-ev-t{font-family:var(--mono);font-size:11.5px;color:var(--ink-faint);text-align:right;min-width:34px}
.dt-ev-empty{padding:16px;font-family:var(--mono);font-size:12.5px;color:var(--ink-faint);text-align:center}

/* full-width leaderboard row (Top 24h + On OpenSea) */
.side-pair{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:22px}
.side-pair .card-block{min-width:0}
@media(max-width:900px){.side-pair{grid-template-columns:1fr}}

/* footer */
.foot{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-top:28px;padding-top:18px;border-top:1px solid var(--line);font-family:var(--mono);font-size:11.5px;color:var(--ink-faint)}

@media(max-width:900px){
  .grid{grid-template-columns:1fr}
  .kpis{grid-template-columns:repeat(2,1fr)}
  .controls{flex-direction:column;align-items:stretch}
  .control-right{justify-content:space-between}
}
@media(max-width:560px){
  .kpi-val{font-size:24px}
  .mint-row{grid-template-columns:22px 40px 1fr auto;gap:10px;padding:12px}
  .mint-supply{display:none}
  .mint-right{min-width:auto}
  .feed-row{grid-template-columns:30px 1fr;gap:10px}
  .feed-right{grid-column:2;text-align:left;margin-top:2px}
}
