:root{
  --bg: #0f1724;
  --card: #0b1220;
  --muted: #9aa4b2;
  --accent: #7dd3fc;
  --glass: rgba(255,255,255,0.03);
  --radius: 12px;
  --maxwidth: 1100px;
}
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
  background: linear-gradient(180deg,#071029 0%, #081826 60%);
  color:#e6eef6;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}
.container{max-width:var(--maxwidth);margin:0 auto;padding:20px}
.header-inner{display:flex;align-items:center;justify-content:space-between;padding:18px 0}
.brand{margin:0;font-size:1.4rem;letter-spacing:0.2px}
.tag{margin:6px 0 0;color:var(--muted);font-size:0.95rem}
.nav-small a{color:var(--muted);text-decoration:none;margin-left:16px}

.grid{display:grid;grid-template-columns:repeat(1,1fr);gap:18px;margin-top:20px}
.card{display:flex;align-items:center;background:linear-gradient(180deg, rgba(255,255,255,0.02), transparent);padding:14px;border-radius:var(--radius);text-decoration:none;color:inherit;border:1px solid rgba(255,255,255,0.03);transition:transform .16s ease,box-shadow .16s ease}
.card:hover{transform:translateY(-6px);box-shadow:0 6px 30px rgba(2,6,23,0.6)}
.thumb{width:84px;height:84px;flex:0 0 84px;border-radius:10px;overflow:hidden;background:linear-gradient(180deg, rgba(255,255,255,0.01), rgba(255,255,255,0.00));display:flex;align-items:center;justify-content:center;margin-right:16px;border:1px solid rgba(255,255,255,0.04);box-shadow:inset 0 1px 0 rgba(255,255,255,0.01), 0 6px 20px rgba(2,6,23,0.45)}
.thumb img{width:100%;height:100%;object-fit:contain;display:block;padding:10px;background:transparent}
.card-body h2{margin:0;font-size:1.05rem}
.muted{color:var(--muted);margin:6px 0 0}

.about{margin-top:28px;padding:18px;background:linear-gradient(180deg, rgba(255,255,255,0.01), transparent);border-radius:12px;border:1px solid rgba(255,255,255,0.02)}

.site-footer{margin-top:36px;padding:18px 0;color:var(--muted)}
.footer-inner{display:flex;justify-content:space-between;gap:12px;align-items:center}
.abuse-badge img{max-width:100%;height:auto;border-radius:6px}
@media(max-width:600px){
  .footer-inner{flex-direction:column;align-items:flex-start}
  .abuse-badge{margin-top:12px}
}

@media(min-width:700px){
  .grid{grid-template-columns:repeat(2,1fr)}
}
@media(min-width:1100px){
  .grid{grid-template-columns:repeat(4,1fr)}
  .card{flex-direction:column;align-items:stretch;padding:12px}
  .thumb{width:100%;height:140px;flex:0 0 auto;margin-right:0;margin-bottom:12px;border-radius:10px;display:flex;align-items:center;justify-content:center;border:1px solid rgba(255,255,255,0.04);box-shadow:0 8px 22px rgba(2,6,23,0.5)}
  .card-body{text-align:left}
}

/* small utilities */
.muted small{color:var(--muted)}

/* Inlined AbuseIPDB badge styling */
.abuse-badge .badge-svg{display:block;max-width:320px;width:100%;height:auto;padding:6px;border-radius:8px;background:var(--card);box-shadow:0 4px 8px rgba(2,6,23,0.35), inset 0 1px 0 rgba(255,255,255,0.02);transition:transform .14s ease,box-shadow .14s ease;filter:grayscale(.25) saturate(.55) brightness(.7) contrast(.95);opacity:.92}

/* Style for the remote badge image provided by user */
.abuse-badge{background:linear-gradient(180deg, rgba(255,255,255,0.03), rgba(255,255,255,0.015));padding:8px;border-radius:10px;display:inline-block}
.abuse-badge img{width:401px;max-width:100%;filter:grayscale(.02) brightness(1.12) saturate(.98);opacity:1;box-shadow:2px 2px 1px 1px rgba(0,0,0,.14)}
@media(max-width:560px){.abuse-badge img{width:260px}}
.abuse-badge .badge-svg *{vector-effect:non-scaling-stroke}
.abuse-badge .badge-svg text{fill:var(--muted)}
.abuse-badge .badge-svg circle,.abuse-badge .badge-svg path,.abuse-badge .badge-svg rect{stroke-opacity:.7;fill-opacity:.85}
.abuse-badge a:hover .badge-svg{transform:translateY(-3px);box-shadow:0 10px 24px rgba(2,6,23,0.5)}