/* ============================================================
   NFT COLLECTION — Dock Kid gallery
   ============================================================ */
#nft{padding-top:6rem;padding-bottom:5rem}
.nft-head{margin-bottom:2.2rem}
.nft-search{margin-top:1.4rem;max-width:340px}
.nft-search input{
  width:100%;padding:.8rem 1rem;background:var(--panel);
  border:1px solid var(--line);border-radius:var(--r-md);
  color:var(--ink);font-family:var(--mono);font-size:.9rem;
}
.nft-search input::placeholder{color:var(--ink-faint)}
.nft-search input:focus{outline:2px solid var(--signal);outline-offset:2px;border-color:var(--signal)}

.nft-grid{
  display:grid;gap:10px;
  grid-template-columns:repeat(auto-fill,minmax(150px,1fr));
}
.nft-card{
  position:relative;aspect-ratio:1;background:var(--panel);
  border:1px solid var(--line-soft);border-radius:var(--r-sm);
  overflow:hidden;cursor:pointer;text-align:left;padding:0;
  transition:transform .3s var(--ease),border-color .3s var(--ease);
}
.nft-card:hover{transform:translateY(-3px);border-color:var(--signal-soft)}
.nft-card img{width:100%;height:100%;object-fit:cover;display:block}
.nft-card .nft-tag{
  position:absolute;left:6px;bottom:6px;
  font-family:var(--mono);font-size:.6rem;letter-spacing:.05em;
  background:rgba(4,7,15,.82);color:var(--signal);
  padding:2px 6px;border-radius:4px;
}
.nft-sentinel{height:2px}
.nft-loading{font-family:var(--mono);color:var(--ink-faint);font-size:.85rem;margin-top:1.4rem}

/* modal */
.nft-modal{position:fixed;inset:0;z-index:60;display:none;align-items:center;justify-content:center;padding:4vw;background:rgba(3,5,10,.8)}
.nft-modal.open{display:flex}
.nft-panel{
  position:relative;width:min(880px,100%);max-height:92vh;overflow:auto;
  background:var(--void-2);border:1px solid var(--line);border-radius:var(--r-lg);
  display:grid;grid-template-columns:1fr 1fr;gap:0;
}
.nft-close{
  position:absolute;top:14px;right:14px;z-index:2;
  width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  background:rgba(4,7,15,.7);border:1px solid var(--line);color:var(--ink);
}
.nft-close:hover{border-color:var(--signal);color:var(--signal)}
.nft-modal-media{background:#000;display:flex;align-items:center;justify-content:center}
.nft-modal-media img{width:100%;height:auto;display:block}
.nft-modal-info{padding:2.2rem 2rem}
.nft-modal-info h3{font-size:1.5rem;margin:.5rem 0 1.4rem}
.nft-traits{display:grid;gap:.9rem}
.nft-traits>div{display:flex;justify-content:space-between;gap:1rem;padding-bottom:.7rem;border-bottom:1px solid var(--line-soft)}
.nft-traits dt{font-family:var(--mono);font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-faint)}
.nft-traits dd{font-size:.95rem;color:var(--ink)}

@media(max-width:680px){
  .nft-panel{grid-template-columns:1fr}
  .nft-modal-info{padding:1.4rem}
  .nft-grid{grid-template-columns:repeat(auto-fill,minmax(110px,1fr))}
}