/* VibeSwap coin profile v1: theme variables + call page gradient cards */
.cb-page { max-width: 1180px; display: grid; gap: 18px; }
.cb-card { position: relative; box-sizing: border-box; padding: 20px 22px; border-radius: 20px;
  background: radial-gradient(120% 90% at 0% 0%, color-mix(in srgb, var(--purple,#9945ff) 16%, transparent), transparent 60%),
    radial-gradient(110% 90% at 100% 100%, color-mix(in srgb, var(--mint,#14f195) 10%, transparent), transparent 60%),
    linear-gradient(160deg, color-mix(in srgb, var(--surface,#0e1726) 94%, transparent), color-mix(in srgb, var(--bg,#070b14) 96%, transparent));
  border: 1px solid color-mix(in srgb, var(--purple,#9945ff) 26%, var(--line,#1c2638)); box-shadow: 0 14px 40px #0007, inset 0 1px 0 #ffffff0f; min-width: 0; }
.cb-card h2 { margin: 0 0 12px; font: 700 18px "Space Grotesk", Inter, sans-serif; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.cb-card h2 small { font: 600 12px Inter, sans-serif; color: var(--muted); }
.cb-hero { display: grid; grid-template-columns: 1fr 340px; gap: 18px; }
.cb-id { display: flex; gap: 16px; align-items: center; }
.cb-logo { width: 72px; height: 72px; border-radius: 50%; object-fit: cover; flex: none; border: 2px solid var(--mint); background: var(--bg); box-shadow: 0 0 24px color-mix(in srgb, var(--mint) 22%, transparent); }
.cb-id h1 { margin: 0; font: 700 clamp(24px, 3.6vw, 36px) "Space Grotesk", Inter, sans-serif; line-height: 1.1; }
.cb-id h1 span { color: var(--mint); }
.cb-ca { display: inline-flex; gap: 8px; align-items: center; margin-top: 6px; font: 500 12px ui-monospace, monospace; color: var(--muted); background: none; border: 1px solid var(--line); border-radius: 999px; padding: 4px 10px; cursor: pointer; max-width: 100%; overflow: hidden; text-overflow: ellipsis; }
.cb-ca:hover { color: var(--mint); border-color: var(--mint); }
.cb-soc { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 10px; }
.cb-soc a { font: 600 12px Inter, sans-serif; color: var(--text); text-decoration: none; border: 1px solid var(--line); border-radius: 999px; padding: 5px 12px; background: var(--surface); }
.cb-soc a:hover { border-color: var(--mint); color: var(--mint); }
.cb-stats { display: grid; grid-template-columns: repeat(auto-fill, minmax(118px, 1fr)); gap: 10px; margin-top: 16px; }
.cb-stat { background: color-mix(in srgb, var(--bg) 55%, transparent); border: 1px solid var(--line); border-radius: 14px; padding: 10px 12px; display: grid; gap: 3px; min-width: 0; }
.cb-stat small { font-size: 10px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.cb-stat b { font: 700 18px "Space Grotesk", Inter, sans-serif; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.up { color: var(--mint) !important; } .dn { color: #ff5c7a !important; }
.cb-swap { background: radial-gradient(110% 80% at 50% 0%, color-mix(in srgb, var(--mint) 16%, transparent), transparent 62%),
    radial-gradient(110% 90% at 100% 100%, color-mix(in srgb, var(--purple) 18%, transparent), transparent 60%),
    linear-gradient(200deg, color-mix(in srgb, var(--surface) 92%, transparent), color-mix(in srgb, var(--bg) 96%, transparent));
  border-color: color-mix(in srgb, var(--mint) 26%, var(--line)); display: grid; gap: 12px; align-content: start; }
.cb-swap p { margin: 0; color: var(--muted); font-size: 13px; }
.cb-qb { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.cb-qb a, .cb-btn { display: inline-flex; justify-content: center; align-items: center; gap: 6px; padding: 10px; border-radius: 12px; border: 1px solid var(--line); background: var(--surface); color: var(--text); font: 700 14px "Space Grotesk", Inter, sans-serif; text-decoration: none; cursor: pointer; }
.cb-qb a:hover, .cb-btn:hover { border-color: var(--mint); color: var(--mint); }
.cb-go { display: flex; justify-content: center; padding: 15px; border-radius: 999px; background: var(--mint); color: var(--bg); font: 700 17px "Space Grotesk", Inter, sans-serif; text-decoration: none;
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--mint) 35%, transparent), 0 8px 30px color-mix(in srgb, var(--mint) 25%, transparent); }
.cb-go:hover { filter: brightness(1.06); }
.cb-row { display: flex; gap: 8px; justify-content: center; flex-wrap: wrap; }
.cb-row .cb-btn { padding: 7px 14px; border-radius: 999px; font: 700 13px Inter, sans-serif; }
.cb-pass { justify-self: center; font: 700 12px Inter, sans-serif; padding: 4px 12px; border-radius: 999px; border: 1px solid var(--line); color: var(--muted); }
.cb-pass.ok { border-color: var(--mint); color: var(--mint); } .cb-pass.bad { border-color: #ff5c7a; color: #ff5c7a; }
/* call banner */
.cb-call { border-color: color-mix(in srgb, var(--mint) 45%, var(--line)); }
.cb-call .cb-eyebrow { margin: 0 0 4px; font: 700 13px "Space Grotesk", Inter, sans-serif; letter-spacing: .08em; color: var(--mint); text-transform: uppercase; }
.cb-call .cb-stats { grid-template-columns: repeat(5, 1fr); margin-top: 10px; }
.cb-secs { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-top: 14px; }
.cb-sec { background: color-mix(in srgb, var(--bg) 55%, transparent); border: 1px solid var(--line); border-radius: 14px; padding: 12px 14px; font-size: 14px; line-height: 1.5; }
.cb-sec h3 { margin: 0 0 6px; font: 700 14px "Space Grotesk", Inter, sans-serif; }
.cb-sec p { margin: 0; color: var(--muted); } .cb-sec ul { margin: 6px 0 0; padding-left: 18px; color: var(--muted); }
/* chart */
.cb-tools { display: flex; gap: 6px; flex-wrap: wrap; margin-left: auto; }
.cb-tools button { padding: 5px 11px; border-radius: 999px; border: 1px solid var(--line); background: var(--surface); color: var(--muted); font: 700 12px Inter, sans-serif; cursor: pointer; }
.cb-tools button[aria-pressed="true"] { background: var(--mint); color: var(--bg); border-color: var(--mint); }
.cb-tools i { width: 1px; background: var(--line); margin: 0 4px; }
.cb-chartwrap { position: relative; height: 460px; border-radius: 14px; overflow: hidden; background: color-mix(in srgb, var(--bg) 70%, transparent); border: 1px solid var(--line); }
.cb-chart { position: absolute; inset: 0; }
.cb-zone { position: absolute; left: 0; right: 60px; pointer-events: none; z-index: 2; display: none;
  background: linear-gradient(90deg, color-mix(in srgb, var(--mint) 4%, transparent), color-mix(in srgb, var(--mint) 13%, transparent));
  border-top: 1px dashed color-mix(in srgb, var(--mint) 60%, transparent); border-bottom: 1px dashed color-mix(in srgb, var(--mint) 60%, transparent); }
.cb-zone span { position: absolute; left: 10px; top: 4px; font: 700 11px Inter, sans-serif; color: var(--mint); letter-spacing: .05em; text-transform: uppercase; }
.cb-legend { position: absolute; left: 12px; top: 10px; z-index: 3; font: 600 12px Inter, sans-serif; color: var(--muted); pointer-events: none; display: flex; gap: 10px; flex-wrap: wrap; }
.cb-legend b { color: var(--text); font-weight: 700; }
.cb-msg { position: absolute; inset: 0; display: grid; place-items: center; color: var(--muted); font-size: 14px; z-index: 4; }
.cb-key { display: flex; gap: 14px; flex-wrap: wrap; margin-top: 10px; font-size: 12px; color: var(--muted); }
.cb-key span::before { content: ""; display: inline-block; width: 10px; height: 10px; border-radius: 3px; margin-right: 6px; vertical-align: -1px; background: var(--c); }
.cb-skel { background: linear-gradient(90deg, var(--surface), color-mix(in srgb, var(--surface) 70%, var(--line)), var(--surface)); background-size: 200% 100%; animation: cbsk 1.2s infinite; border-radius: 10px; }
@keyframes cbsk { to { background-position: -200% 0; } }
/* safety + holders */
.cb-grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.cb-score { display: flex; gap: 18px; align-items: center; margin-bottom: 14px; }
.cb-ring { --p: 0; --c: var(--mint); width: 92px; height: 92px; border-radius: 50%; flex: none; display: grid; place-items: center;
  background: conic-gradient(var(--c) calc(var(--p) * 1%), color-mix(in srgb, var(--line) 300%, transparent) 0); }
.cb-ring b { width: 74px; height: 74px; border-radius: 50%; background: var(--surface); display: grid; place-items: center; font: 700 26px "Space Grotesk", Inter, sans-serif; }
.cb-score p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.5; }
.cb-score strong { display: block; color: var(--text); font: 700 17px "Space Grotesk", Inter, sans-serif; margin-bottom: 2px; }
.cb-checks { display: grid; gap: 6px; }
.cb-chk { display: grid; grid-template-columns: 22px 1fr auto; gap: 8px; align-items: center; padding: 8px 10px; border-radius: 10px; background: color-mix(in srgb, var(--bg) 55%, transparent); border: 1px solid var(--line); font-size: 14px; }
.cb-chk i { font-style: normal; font-weight: 800; text-align: center; } .cb-chk.ok i { color: var(--mint); } .cb-chk.warn i { color: #ffb547; } .cb-chk.bad i { color: #ff5c7a; }
.cb-chk b { font: 700 13px Inter, sans-serif; color: var(--muted); }
.cb-risks { margin: 10px 0 0; padding: 0; list-style: none; display: grid; gap: 4px; font-size: 13px; color: var(--muted); }
.cb-risks li.danger { color: #ff5c7a; } .cb-risks li.warn { color: #ffb547; }
.cb-hold { display: grid; gap: 5px; }
.cb-h { display: grid; grid-template-columns: 22px 1fr 64px; gap: 8px; align-items: center; font-size: 13px; padding: 6px 8px; border-radius: 10px; text-decoration: none; color: var(--text); }
.cb-h:hover { background: color-mix(in srgb, var(--bg) 55%, transparent); }
.cb-h em { font-style: normal; color: var(--muted); font-size: 12px; }
.cb-h code { font: 12px ui-monospace, monospace; }
.cb-h .tag { font: 700 10px Inter, sans-serif; padding: 2px 7px; border-radius: 999px; border: 1px solid var(--line); margin-left: 6px; color: var(--muted); }
.cb-h .tag.dev { color: #ffb547; border-color: #ffb547; } .cb-h .tag.lp { color: var(--cyan,#22d3ee); border-color: var(--cyan,#22d3ee); } .cb-h .tag.insider { color: #ff5c7a; border-color: #ff5c7a; }
.cb-bar { grid-column: 2 / 4; height: 5px; border-radius: 99px; background: color-mix(in srgb, var(--line) 300%, transparent); overflow: hidden; }
.cb-bar u { display: block; height: 100%; background: linear-gradient(90deg, var(--purple), var(--mint)); border-radius: 99px; }
.cb-h b { text-align: right; font: 700 13px "Space Grotesk", Inter, sans-serif; }
.cb-trades { display: grid; gap: 4px; max-height: 260px; overflow: auto; font-size: 13px; }
.cb-tr { display: grid; grid-template-columns: 52px 60px 1fr auto; gap: 8px; padding: 5px 8px; border-radius: 8px; background: color-mix(in srgb, var(--bg) 50%, transparent); color: var(--text); text-decoration: none; }
.cb-tr em { font-style: normal; color: var(--muted); } .cb-tr code { font: 12px ui-monospace, monospace; color: var(--muted); overflow: hidden; text-overflow: ellipsis; }
.cb-note { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.5; }
.cb-find { display: flex; gap: 8px; } .cb-find input { flex: 1; padding: 12px 14px; border-radius: 12px; border: 1px solid var(--line); background: var(--surface); color: var(--text); font: 14px Inter, sans-serif; }
@media (max-width: 960px) { .cb-hero, .cb-grid2 { grid-template-columns: 1fr; } .cb-stats { grid-template-columns: repeat(3, 1fr); } .cb-secs { grid-template-columns: 1fr; } .cb-call .cb-stats { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 720px) { .cb-card { padding: 16px 14px; border-radius: 18px; } .cb-chartwrap { height: 360px; } .cb-stats, .cb-call .cb-stats { grid-template-columns: repeat(2, 1fr); } }
#vx-cp { display: contents; }
.cb-swap .vx-actrow { display: flex; gap: 8px; justify-content: center; align-items: center; flex-wrap: wrap; width: 100%; }
.cb-swap .vx-share, .cb-swap .vx-watch { margin: 0; padding: 7px 14px; font: 700 13px Inter, sans-serif; border: 1px solid var(--line); background: var(--surface); color: var(--text); border-radius: 999px; text-decoration: none; cursor: pointer; }
.cb-swap .vx-share:hover, .cb-swap .vx-watch:hover { border-color: var(--mint); color: var(--mint); }
.cb-swap .vx-watch[aria-pressed=true] { border-color: var(--mint); color: var(--mint); }
.cb-back { justify-self: start; color: var(--mint); font: 600 14px Inter, sans-serif; text-decoration: none; }

/* community vibe vote (under the safety badge) */
.vb-vote{margin-top:10px;padding:10px;border-radius:12px;background:var(--surface-2,#17171b)}
.vb-vote-h{font-size:12px;font-weight:700;color:var(--muted,#a1a1aa);text-transform:uppercase;letter-spacing:.04em;margin-bottom:6px}
.vb-vote-btns{display:flex;gap:8px}
.vb-vote-btns button{flex:1;border:1px solid var(--line,#26262e);background:var(--surface,#111116);color:var(--text,#f4f4f5);border-radius:10px;padding:8px;font-weight:800;cursor:pointer}
.vb-vote-btns button.mine.bull{border-color:var(--mint,#14f195)}.vb-vote-btns button.mine.bear{border-color:#fb7185}
.vb-vote-bar{height:8px;border-radius:999px;background:#fb7185;margin-top:8px;overflow:hidden}.vb-vote-bar i{display:block;height:100%;background:var(--mint,#14f195)}
.vb-vote-n{display:flex;justify-content:space-between;font-size:12px;color:var(--muted,#a1a1aa);margin-top:4px}