
:root{
  --bg:#0b0c10; --panel:#111319; --panel-2:#151a25; --text:#e5e7eb; --muted:#a3a3a3; --border:#1f2430;
  --pill:#2a3143; --accent:#f1f5f9;
}
body.light{ --bg:#f7f8fb; --panel:#ffffff; --panel-2:#f2f4f8; --text:#0b0c10; --muted:#5a5f6b; --border:#dde2ea; --pill:#eef2f7; --accent:#0b1220; }

*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--text);font:16px/1.5 Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial}
.wrap{max-width:1180px;margin:0 auto;padding:18px}
.muted{color:var(--muted)}

.site-header{border-bottom:1px solid var(--border);background:var(--panel);position:sticky;top:0;z-index:30}
.head-inner{display:flex;align-items:center;justify-content:space-between}
.brand{color:var(--text);text-decoration:none;font-weight:800}
.main-nav a{color:var(--muted);text-decoration:none;margin-left:16px}
.main-nav a:hover{color:var(--text)}
.ticker{border-top:1px solid var(--border);border-bottom:1px solid var(--border);background:var(--panel-2)}
.ticker .wrap{overflow:hidden}
.ticker .tv-dark{display:block}
.ticker .tv-light{display:none}
body.light .ticker .tv-dark{display:none}
body.light .ticker .tv-light{display:block}

.hero{background:var(--panel);border:1px solid var(--border);border-radius:14px;padding:18px;margin-top:12px}
.hero-title{margin:0 0 6px 0;font-size:28px;font-weight:800}
.hero-copy{margin:0;color:var(--muted)}

.filter-bar{margin-top:14px;display:flex;flex-direction:column;align-items:center;gap:6px}
.filter-label{font-size:13px;color:var(--muted)}
.filter-inputs{position:relative;display:flex;gap:8px;align-items:center}
#exSearch{min-width:420px;padding:10px 12px;border-radius:10px;border:1px solid var(--border);background:var(--panel-2);color:var(--text)}
.ex-typeahead{position:absolute;top:calc(100% + 6px);left:0;right:0;max-height:320px;overflow:auto;border:1px solid var(--border);border-radius:10px;background:var(--panel);display:none;z-index:40}
.ex-typeahead.show{display:block}
.ex-option{padding:10px 12px;border-bottom:1px solid var(--border);cursor:pointer;text-transform:capitalize}
.ex-option:last-child{border-bottom:none}
.ex-option:hover{background:var(--panel-2)}

.boards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:16px}
.board{display:flex;flex-direction:column;background:var(--panel);border:1px solid var(--border);border-radius:14px;overflow:hidden}
.board-head{padding:12px 14px;border-bottom:1px solid var(--border);background:var(--panel-2)}
.board-title{margin:0;font-size:18px;letter-spacing:.06em;color:var(--text);text-transform:uppercase}
.board-body{padding:0;max-height:68vh;overflow:auto}
.board-stream .listing-card{margin:0;border-radius:0;border-left:none;border-right:none;border-top:1px solid var(--border)}
.board-stream .listing-card:first-child{border-top:none}
.board-stream .listing-card:hover{background:rgba(255,255,255,.02)}

.listing-card{position:relative;display:flex;gap:16px;border:1px solid var(--border);border-radius:12px;padding:16px;align-items:center;background:var(--panel);transition:transform .12s ease, box-shadow .12s ease;min-height:180px}
.card-link{position:absolute;inset:0;z-index:5;text-indent:-9999px}
.logo-wrap{min-width:84px}
.token-logo{width:84px;height:84px;border-radius:12px;border:1px solid var(--border);background:#0b0c10;object-fit:cover}
.token-logo--placeholder{display:flex;align-items:center;justify-content:center;font-size:22px;color:var(--muted);border:1px dashed var(--border)}
.card-body{flex:1;display:flex;flex-direction:column;gap:10px}
.card-top{display:flex;align-items:center;justify-content:space-between;gap:10px}
.card-title{margin:0;font-size:19px;font-weight:800}
.card-badges{display:flex;gap:6px}
.excerpt{margin:0;color:var(--muted)}
.line-clamp-3{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.card-meta{margin-top:auto;display:flex;gap:10px;color:var(--muted);font-size:13px}

.card-actions, .ex-actions{display:flex;gap:8px;margin-top:8px;flex-wrap:wrap}
.card-actions.has-icons, .ex-actions.has-icons{margin-top:10px}
.ex-icon{width:28px;height:28px;border-radius:50%;border:1px solid var(--border);background:var(--panel-2);display:inline-block;-webkit-mask-size:16px 16px;mask-size:16px 16px;-webkit-mask-position:center;mask-position:center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;background-color:var(--text);transition:transform .12s ease, background-color .12s ease}
.ex-icon:hover{transform:translateY(-1px);background-color:#ffd166}
.ex-binance{ -webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%23000" d="M12 2 7.5 6.5 9 8l3-3 3 3 1.5-1.5L12 2zm0 6L8 12l4 4 4-4-4-4zm-6 0L2 12l4 4 1.5-1.5L5 12l2.5-2.5L6 8zm12 0-1.5 1.5L19 12l-2.5 2.5L18 16l4-4-4-4zm-6 6-3-3 3-3 3 3-3 3z"/></svg>'); mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%23000" d="M12 2 7.5 6.5 9 8l3-3 3 3 1.5-1.5L12 2zm0 6L8 12l4 4 4-4-4-4zm-6 0L2 12l4 4 1.5-1.5L5 12l2.5-2.5L6 8zm12 0-1.5 1.5L19 12l-2.5 2.5L18 16l4-4-4-4zm-6 6-3-3 3-3 3 3-3 3z"/></svg>'); }
.ex-okx{ -webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%23000" d="M4 4h6v6H4V4zm10 0h6v6h-6V4zM4 14h6v6H4v-6zm10 0h6v6h-6v-6z"/></svg>'); mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%23000" d="M4 4h6v6H4V4zm10 0h6v6h-6V4zM4 14h6v6H4v-6zm10 0h6v6h-6v-6z"/></svg>'); }
.ex-coinbase{ -webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%23000" d="M12 2a10 10 0 1 0 .001 20.001A10 10 0 0 0 12 2zm-1 7h2v6h-2V9z"/></svg>'); mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%23000" d="M12 2a10 10 0 1 0 .001 20.001A10 10 0 0 0 12 2zm-1 7h2v6h-2V9z"/></svg>'); }
.ex-bybit{ -webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%23000" d="M7 4h2v16H7V4zm8 0h2v16h-2V4z"/></svg>'); mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%23000" d="M7 4h2v16H7V4zm8 0h2v16h-2V4z"/></svg>'); }
.ex-kraken{ -webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%23000" d="M12 5c4 0 7 3 7 7v7h-3v-3h-2v3h-2v-3h-2v3H8v-3H6v3H3v-7c0-4 3-7 7-7z"/></svg>'); mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%23000" d="M12 5c4 0 7 3 7 7v7h-3v-3h-2v3h-2v-3h-2v3H8v-3H6v3H3v-7c0-4 3-7 7-7z"/></svg>'); }
.ex-kucoin{ -webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%23000" d="M6 4h2l8 8-8 8H6l8-8L6 4z"/></svg>'); mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%23000" d="M6 4h2l8 8-8 8H6l8-8L6 4z"/></svg>'); }

.site-footer{margin-top:32px;border-top:1px solid var(--border);background:var(--panel)}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 2fr;gap:18px;padding:20px 18px}
.footer-grid h4,.footer-grid h5{margin:0 0 8px 0}
.site-footer p, .site-footer a{color:var(--muted);text-decoration:none}
.site-footer a:hover{color:var(--text);text-decoration:underline}
.donation{display:block;user-select:all;padding:8px 10px;border:1px dashed var(--border);border-radius:8px;background:var(--panel-2);color:var(--text);margin-bottom:8px;overflow-wrap:anywhere}
.foot-bottom{border-top:1px solid var(--border);padding:12px 18px;color:var(--muted)}

.theme-switch{position:fixed;right:14px;bottom:14px;display:flex;background:var(--panel);border:1px solid var(--border);border-radius:999px;overflow:hidden;z-index:50}
.theme-switch .seg{padding:8px 12px;border:0;background:transparent;color:var(--text);cursor:pointer}
.theme-switch .seg.active{background:var(--panel-2);font-weight:700}

@media (max-width:980px){
  .boards{grid-template-columns:1fr}
  #exSearch{min-width:260px}
  .footer-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:640px){
  .footer-grid{grid-template-columns:1fr}
}

/* Hyperliquid mono icon (stylized H) */
.ex-hyper{ -webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%23000" d="M4 4h4v6h8V4h4v16h-4v-6H8v6H4z"/></svg>'); mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%23000" d="M4 4h4v6h8V4h4v16h-4v-6H8v6H4z"/></svg>'); }
#ad-frame {
  width: 100%;
  margin: 20px auto;
  display: flex;
  justify-content: center;
  background: rgba(0,0,0,0.5);
  border-radius: 10px;
  padding: 10px 0;
}

#ad-frame iframe {
  border: 0;
  width: 70%;
  max-width: 900px;
  height: 90px; /* You can tweak this */
}