/* ═══════════════════════════════════════════════════════════════
   NORMIE COLOSSEUM — Live On-Chain Activity Feed
   ═══════════════════════════════════════════════════════════════ */

.nc-section{
  margin:14px auto 0;
  max-width:920px;
  padding:12px 12px 14px;
  border:2px solid var(--line);
  border-radius:14px;
  background:rgba(240,240,240,.70);
  position:relative;
  overflow:hidden;
}
body.dark-ui .nc-section{
  background:rgba(26,26,46,.70);
}

/* ── Header row ──────────────────────────────────────────────── */
.nc-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  margin-bottom:10px;
  flex-wrap:wrap;
}

.nc-title{
  font-size:11px;
  letter-spacing:2px;
  text-transform:uppercase;
  opacity:.75;
  font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;
}

.nc-live{
  display:inline-flex;
  align-items:center;
  gap:5px;
  font-size:9px;
  letter-spacing:2px;
  text-transform:uppercase;
  opacity:.55;
  font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;
}

.nc-live__dot{
  width:6px;
  height:6px;
  border-radius:50%;
  background:#ff3050;
  animation:ncPulse 2s ease-in-out infinite;
}
@keyframes ncPulse{
  0%,100%{ opacity:.4; }
  50%{ opacity:1; }
}

.nc-refresh{
  border:1.5px solid var(--line);
  background:transparent;
  color:var(--ink);
  padding:5px 10px;
  border-radius:6px;
  font-size:9px;
  letter-spacing:2px;
  text-transform:uppercase;
  cursor:pointer;
  font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;
  transition:background .15s ease;
}
.nc-refresh:hover{ background:rgba(0,0,0,.05); }
.nc-refresh:disabled{ opacity:.3; cursor:not-allowed; }
body.dark-ui .nc-refresh:hover{ background:rgba(255,255,255,.05); }

/* ── Feed container ──────────────────────────────────────────── */
.nc-feed{
  display:flex;
  flex-direction:column;
  gap:8px;
  max-height:420px;
  overflow-y:auto;
  overflow-x:hidden;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
  -ms-overflow-style:none;
  scroll-snap-type:y proximity;
  padding-right:4px;
  mask-image:linear-gradient(to bottom, transparent 0, #000 4px, #000 calc(100% - 4px), transparent 100%);
  -webkit-mask-image:linear-gradient(to bottom, transparent 0, #000 4px, #000 calc(100% - 4px), transparent 100%);
  position:relative;
}


.nc-feed::-webkit-scrollbar{width:0;height:0;display:none;}
.nc-feed::before,
.nc-feed::after{
  content:"";
  position:sticky;
  left:0;
  right:0;
  height:4px;
  display:block;
  z-index:2;
  pointer-events:none;
}
.nc-feed::before{
  top:0;
  margin-bottom:-4px;
  background:linear-gradient(180deg, rgba(240,240,240,.96), rgba(240,240,240,0));
}
.nc-feed::after{
  bottom:0;
  margin-top:-4px;
  background:linear-gradient(0deg, rgba(240,240,240,.96), rgba(240,240,240,0));
}
body.dark-ui .nc-feed::before{
  background:linear-gradient(180deg, rgba(26,26,46,.98), rgba(26,26,46,0));
}
body.dark-ui .nc-feed::after{
  background:linear-gradient(0deg, rgba(26,26,46,.98), rgba(26,26,46,0));
}
/* ── Event card ──────────────────────────────────────────────── */
 .nc-event{
  scroll-snap-align:start;
  display:flex;
  align-items:center;
  gap:10px;
  padding:8px 10px;
  border:1.5px solid rgba(74,74,74,.12);
  border-radius:10px;
  background:rgba(255,255,255,.3);
  animation:ncSlideIn .35s ease-out;
  font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;
  flex-wrap:wrap;
}
body.dark-ui .nc-event{
  background:rgba(30,34,44,.4);
  border-color:rgba(100,100,120,.15);
}

@keyframes ncSlideIn{
  0%{ opacity:0; transform:translateY(-6px); }
  100%{ opacity:1; transform:translateY(0); }
}

/* Whale burn highlight */
.nc-event--whale{
  border-color:rgba(255,48,80,.25);
  background:rgba(255,48,80,.04);
}
body.dark-ui .nc-event--whale{
  border-color:rgba(255,80,112,.2);
  background:rgba(255,48,80,.06);
}

/* Customization highlight */
.nc-event--custom{
  border-color:rgba(0,200,212,.2);
  background:rgba(0,200,212,.03);
}
body.dark-ui .nc-event--custom{
  border-color:rgba(64,232,240,.15);
  background:rgba(0,200,212,.05);
}

/* ── Normie thumbnail in event ────────────────────────────────── */
.nc-event__img{
  width:40px;
  height:40px;
  border-radius:4px;
  border:1.5px solid rgba(74,74,74,.15);
  image-rendering:pixelated;
  image-rendering:crisp-edges;
  flex-shrink:0;
  background:#e3e5e4;
  transition:border-color .15s ease, transform .1s ease, box-shadow .15s ease;
}
.nc-event__img[style*="cursor"]:hover{
  border-color:rgba(0,200,212,.5);
  transform:scale(1.12);
  box-shadow:0 2px 8px rgba(0,0,0,.12);
}
.nc-event__img[style*="cursor"]:active{
  transform:scale(1.04);
}
body.dark-ui .nc-event__img{
  border-color:rgba(100,100,120,.2);
}

/* Before/after pair for customizations */
.nc-event__pair{
  display:flex;
  align-items:center;
  gap:4px;
  flex-shrink:0;
}
.nc-event__arrow{
  font-size:10px;
  opacity:.35;
}

/* ── Event text ──────────────────────────────────────────────── */
.nc-event__body{
  flex:1;
  min-width:0;
}
.nc-event__headline{
  font-size:9px;
  letter-spacing:1px;
  line-height:1.4;
  text-transform:uppercase;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.nc-event__detail{
  font-size:8px;
  letter-spacing:1.5px;
  opacity:.4;
  text-transform:uppercase;
  margin-top:2px;
}
.nc-event__tag{
  display:inline-block;
  padding:1px 3px;
  border-radius:3px;
  font-size:6.5px;
  letter-spacing:1px;
  text-transform:uppercase;
  margin-right:3px;
  line-height:1.2;
  vertical-align:middle;
}
.nc-event__tag--burn{
  background:rgba(255,160,40,.15);
  color:#b87020;
}
.nc-event__tag--whale{
  background:rgba(255,48,80,.12);
  color:#cc2040;
}
.nc-event__tag--custom{
  background:rgba(0,200,212,.12);
  color:#008090;
}
body.dark-ui .nc-event__tag--burn{
  background:rgba(255,180,60,.1);
  color:#e8a040;
}
body.dark-ui .nc-event__tag--whale{
  background:rgba(255,80,112,.1);
  color:#ff6080;
}
body.dark-ui .nc-event__tag--custom{
  background:rgba(64,232,240,.1);
  color:#60d8e0;
}

/* ── Loading / empty state ───────────────────────────────────── */
.nc-loading{
  text-align:center;
  padding:20px 0;
  font-size:9px;
  letter-spacing:2px;
  text-transform:uppercase;
  opacity:.4;
  font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;
}

/* ── Timestamp ───────────────────────────────────────────────── */
.nc-event__time{
  font-size:8px;
  letter-spacing:1px;
  opacity:.3;
  white-space:nowrap;
  flex-shrink:0;
}

/* ── Clickable wallet address ─────────────────────────────────── */
.nc-wallet-link{
  cursor:pointer;
  text-decoration:underline;
  text-decoration-style:dotted;
  text-underline-offset:2px;
  opacity:.65;
  transition:opacity .15s ease, color .15s ease;
}
.nc-wallet-link:hover{
  opacity:1;
  color:var(--accent, #00c8d4);
}

/* ── Inline wallet grid ───────────────────────────────────────── */
.nc-wallet-grid-wrap{
  width:100%;
  margin-top:8px;
  padding-top:8px;
  border-top:1px solid rgba(74,74,74,.1);
  animation:ncSlideIn .25s ease-out;
}
body.dark-ui .nc-wallet-grid-wrap{
  border-top-color:rgba(100,100,120,.15);
}

.nc-wallet-grid-label{
  font-size:8px;
  letter-spacing:1.5px;
  text-transform:uppercase;
  opacity:.4;
  margin-bottom:6px;
  font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;
}

.nc-wallet-grid{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
}

.nc-wallet-grid__img{
  width:36px;
  height:36px;
  border-radius:3px;
  border:1.5px solid rgba(74,74,74,.12);
  image-rendering:pixelated;
  image-rendering:crisp-edges;
  background:#e3e5e4;
  transition:border-color .15s ease, transform .1s ease, box-shadow .15s ease;
}
.nc-wallet-grid__img:hover{
  border-color:rgba(0,200,212,.5);
  transform:scale(1.15);
  box-shadow:0 2px 8px rgba(0,0,0,.12);
  z-index:1;
  position:relative;
}
.nc-wallet-grid__img:active{
  transform:scale(1.05);
}
body.dark-ui .nc-wallet-grid__img{
  border-color:rgba(100,100,120,.2);
}