/* Hero dashboard mockup — modern dark fintech polish */
.hero-visual{position:relative;width:100%;max-width:640px;margin-left:auto}
.dash-glow{position:absolute;width:520px;height:520px;border-radius:50%;background:radial-gradient(circle,rgba(59,156,255,.16),transparent 65%);top:48%;left:48%;transform:translate(-50%,-50%);filter:blur(70px);z-index:-1;pointer-events:none}
.dash-glow--deep{position:absolute;width:380px;height:380px;border-radius:50%;background:radial-gradient(circle,rgba(59,156,255,.1),transparent 70%);top:75%;left:75%;transform:translate(-50%,-50%);filter:blur(60px);z-index:-1;pointer-events:none}
.dash-frame{padding:1px;border-radius:14px;background:linear-gradient(135deg,rgba(125,192,255,.32),rgba(98,142,224,.14) 48%,rgba(59,156,255,.22));box-shadow:0 36px 80px -28px rgba(0,0,0,.85),0 2px 0 rgba(255,255,255,.05) inset;animation:dash-float 7s ease-in-out infinite}
@keyframes dash-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
.dash-app{background:linear-gradient(180deg,#0E1730,#0A1426);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);border-radius:13px;overflow:hidden}

.dash-top{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 18px;border-bottom:1px solid rgba(255,255,255,.05);background:rgba(20,35,63,.5)}
.dash-brand{display:flex;align-items:center;gap:9px;min-width:0}
.dash-brand img{width:22px;height:22px;flex-shrink:0}
.dash-brand-text{font-family:'Inter',sans-serif;font-weight:700;font-size:.92rem;letter-spacing:-.01em;color:#F8FAFC}
.dash-brand-text .accent{color:#5EACF5}
.dash-pill{font-family:'IBM Plex Mono',monospace;font-size:.6rem;font-weight:600;padding:3px 9px;border-radius:5px;background:rgba(59,156,255,.1);border:1px solid rgba(59,156,255,.28);color:#7DC0FF;letter-spacing:.08em}
.dash-top-right{display:flex;align-items:center;gap:10px;flex-shrink:0}
.dash-wallet-chip{display:flex;align-items:center;gap:7px;padding:5px 11px 5px 7px;border-radius:7px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.07);font-size:.72rem;color:#CBD5E1;font-weight:500;font-family:'Inter',sans-serif}
.dash-wallet-chip img{width:18px;height:18px;border-radius:4px}
.dash-live{display:flex;align-items:center;gap:6px;font-size:.66rem;font-weight:700;font-family:'IBM Plex Mono',monospace;color:#34D399;letter-spacing:.08em}
.ldot{width:6px;height:6px;border-radius:50%;background:#34D399;box-shadow:0 0 8px rgba(52,211,153,.55);animation:dash-pdot 1.5s ease-in-out infinite}
@keyframes dash-pdot{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.4;transform:scale(.9)}}

.dash-context{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 18px;background:linear-gradient(90deg,rgba(59,156,255,.06),transparent 70%);border-bottom:1px solid rgba(255,255,255,.04);font-size:.72rem;color:#94A3B8;flex-wrap:wrap;font-family:'Inter',sans-serif}
.dash-context span:first-child{font-weight:700;color:#E2E8F0;text-transform:uppercase;letter-spacing:.08em;font-size:.62rem;font-family:'IBM Plex Mono',monospace}
.dash-context-amt{font-family:'IBM Plex Mono',monospace;color:#7DC0FF;font-weight:600;font-size:.72rem;letter-spacing:.02em}

.dash-focus{display:flex;align-items:center;gap:18px;padding:18px 18px 16px;border-bottom:1px solid rgba(255,255,255,.04)}
.risk-ring{position:relative;width:80px;height:80px;flex-shrink:0}
.risk-ring svg{width:100%;height:100%;transform:rotate(-90deg)}
.risk-ring-bg{fill:none;stroke:rgba(255,255,255,.06);stroke-width:5.5}
.risk-ring-fill{fill:none;stroke:url(#riskGrad);stroke-width:5.5;stroke-linecap:round;stroke-dasharray:239;stroke-dashoffset:52;filter:drop-shadow(0 0 6px rgba(239,68,68,.4))}
.risk-ring-val{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center}
.risk-ring-num{font-family:'Inter',sans-serif;font-size:1.5rem;font-weight:800;color:#FCA5A5;line-height:1;letter-spacing:-.02em}
.risk-ring-sub{font-size:.54rem;color:#64748B;text-transform:uppercase;letter-spacing:.1em;margin-top:2px;font-family:'IBM Plex Mono',monospace;font-weight:600}
.dash-focus-main{flex:1;min-width:0}
.dash-focus-label{font-family:'IBM Plex Mono',monospace;font-size:.62rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:#FCA5A5;margin-bottom:6px}
.dash-focus-addr{font-family:'IBM Plex Mono',monospace;font-size:.82rem;color:#F8FAFC;display:block;margin-bottom:4px;letter-spacing:.01em}
.dash-focus-desc{font-family:'Inter',sans-serif;font-size:.74rem;color:#94A3B8;line-height:1.5;margin:0}
.dash-stats-inline{display:flex;flex-wrap:wrap;gap:14px;margin-top:10px;font-family:'IBM Plex Mono',monospace;font-size:.68rem;color:#64748B;letter-spacing:.02em}
.dash-stats-inline em{font-style:normal;font-weight:700;color:#E2E8F0}
.dash-stats-inline .warn{color:#F87171}
.dash-stats-inline .warn em{color:#FCA5A5}
.dash-stats-inline .ok{color:#34D399}
.dash-stats-inline .ok em{color:#34D399}

.dash-rows{padding:10px 14px 14px;display:flex;flex-direction:column;gap:7px}
.dash-row{display:grid;grid-template-columns:46px 1fr auto auto;align-items:center;gap:10px;padding:11px 13px;border-radius:8px;background:rgba(255,255,255,.025);border:1px solid rgba(255,255,255,.04);transition:background .2s,border-color .2s}
.dash-row:hover{background:rgba(255,255,255,.04);border-color:rgba(255,255,255,.08)}
.dash-row--active{border-color:rgba(59,156,255,.32);background:linear-gradient(90deg,rgba(59,156,255,.08),rgba(98,142,224,.04));box-shadow:0 0 24px rgba(59,156,255,.08)}
.dash-row-chain{font-family:'IBM Plex Mono',monospace;font-size:.64rem;font-weight:700;text-align:center;line-height:1.2;letter-spacing:.04em}
.dash-row-chain.btc{color:#FB923C}
.dash-row-chain.eth{color:#A78BFA}
.dash-row-chain.usdt{color:#34D399}
.dash-row-addr{font-family:'IBM Plex Mono',monospace;font-size:.78rem;color:#F1F5F9;font-weight:500}
.dash-row-sub{font-family:'Inter',sans-serif;font-size:.66rem;color:#64748B;margin-top:2px}
.dash-row-score{font-family:'IBM Plex Mono',monospace;font-size:.86rem;font-weight:700;text-align:right;min-width:28px;letter-spacing:-.02em}
.dash-row-badge{font-family:'IBM Plex Mono',monospace;font-size:.6rem;font-weight:700;padding:4px 10px;border-radius:5px;text-align:center;min-width:62px;letter-spacing:.08em}
.badge-clear{background:rgba(16,185,129,.12);color:#34D399;border:1px solid rgba(16,185,129,.25)}
.badge-review{background:rgba(239,68,68,.12);color:#FCA5A5;border:1px solid rgba(239,68,68,.25)}
.badge-low{background:rgba(59,156,255,.12);color:#94A3B8;border:1px solid rgba(59,156,255,.25)}

.dash-actions{display:flex;gap:8px;padding:0 14px 14px}
.dash-action-btn{flex:1;padding:9px 12px;border-radius:7px;font-family:'Inter',sans-serif;font-size:.74rem;font-weight:600;text-align:center;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.03);color:#94A3B8;letter-spacing:.02em}
.dash-action-btn--primary{background:linear-gradient(135deg,#3B9CFF,#1E6FE0);border-color:transparent;color:#FFFFFF;box-shadow:0 6px 18px rgba(59,156,255,.32)}

.dash-foot{padding:10px 18px;border-top:1px solid rgba(255,255,255,.04);font-family:'IBM Plex Mono',monospace;font-size:.62rem;color:#64748B;display:flex;justify-content:space-between;gap:8px;flex-wrap:wrap;background:rgba(20,35,63,.32);letter-spacing:.06em}
.dash-foot strong{color:#7DC0FF;font-weight:600}

@media(max-width:768px){
  .hero-visual{max-width:100%}
  .dash-focus{flex-wrap:wrap}
  .risk-ring{width:72px;height:72px}
  .risk-ring-num{font-size:1.35rem}
  .dash-actions{flex-direction:column}
}
@media(prefers-reduced-motion:reduce){
  .dash-frame{animation:none}
  .ldot{animation:none}
}