@import "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&family=JetBrains+Mono:wght@400;500;600&display=swap";:root{--bg-void:#05060b;--bg-deep:#0a0d17;--bg-surface:#0f1322;--bg-card:#141829;--bg-card-hover:#191e35;--bg-elevated:#1c2140;--border-subtle:#6366f114;--border-medium:#6366f126;--border-bright:#6366f14d;--text-primary:#f0f2ff;--text-secondary:#8b8fa8;--text-muted:#565a72;--text-accent:#a78bfa;--accent-purple:#8b5cf6;--accent-violet:#7c3aed;--accent-blue:#6366f1;--accent-cyan:#22d3ee;--accent-emerald:#34d399;--accent-rose:#f43f5e;--accent-amber:#f59e0b;--accent-orange:#f97316;--glow-purple:#8b5cf626;--glow-blue:#6366f11f;--glow-cyan:#22d3ee1a;--radius-sm:8px;--radius-md:12px;--radius-lg:16px;--radius-xl:24px;--shadow-card:0 4px 32px #0006, 0 0 0 1px var(--border-subtle);--shadow-glow:0 0 40px #8b5cf614;--shadow-elevated:0 8px 48px #00000080, 0 0 0 1px var(--border-medium);--transition-fast:.15s cubic-bezier(.4, 0, .2, 1);--transition-smooth:.3s cubic-bezier(.4, 0, .2, 1);--transition-spring:.5s cubic-bezier(.34, 1.56, .64, 1)}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;scroll-behavior:smooth;font-size:15px}body{background:var(--bg-void);color:var(--text-primary);min-height:100vh;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;overflow-x:hidden}body:before{content:"";pointer-events:none;z-index:0;background:radial-gradient(80% 50% at 20% 0,#8b5cf60f 0%,#0000 60%),radial-gradient(60% 40% at 80% 10%,#6366f10d 0%,#0000 50%),radial-gradient(50% 60% at 50% 100%,#22d3ee08 0%,#0000 50%);animation:20s ease-in-out infinite alternate meshShift;position:fixed;inset:0}@keyframes meshShift{0%{opacity:1}50%{opacity:.7}to{opacity:1}}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--border-medium);border-radius:100px}::-webkit-scrollbar-thumb:hover{background:var(--border-bright)}.app{z-index:1;flex-direction:column;gap:28px;max-width:1440px;margin:0 auto;padding:32px 40px 64px;display:flex;position:relative}.header{border-bottom:1px solid var(--border-subtle);justify-content:space-between;align-items:flex-start;gap:24px;padding-bottom:28px;display:flex}.header-left{flex-direction:column;gap:8px;display:flex}.logo-row{align-items:center;gap:14px;display:flex}.logo-icon{border-radius:var(--radius-md);background:linear-gradient(135deg, var(--accent-purple), var(--accent-blue));justify-content:center;align-items:center;width:44px;height:44px;font-size:22px;animation:3s ease-in-out infinite logoPulse;display:flex;box-shadow:0 0 24px #8b5cf640}@keyframes logoPulse{0%,to{box-shadow:0 0 24px #8b5cf640}50%{box-shadow:0 0 36px #8b5cf666}}.header h1{letter-spacing:-.03em;align-items:baseline;gap:0;font-size:1.6rem;font-weight:800;display:flex}.brand-name{background:linear-gradient(135deg, var(--text-primary) 0%, var(--accent-purple) 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}.brand-dot{color:var(--accent-blue);-webkit-text-fill-color:var(--accent-blue);margin:0 1px;font-weight:900}.brand-tld{background:linear-gradient(135deg, var(--accent-cyan) 0%, var(--accent-emerald) 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-size:.85em;font-weight:700}.brand-container{flex-direction:column;justify-content:center;display:flex}.brand-subtitle{text-transform:uppercase;letter-spacing:.05em;color:var(--text-muted);margin-top:-2px;font-size:.65rem;font-weight:500}.header-meta{flex-wrap:wrap;align-items:center;gap:16px;display:flex}.meta-badge{letter-spacing:.02em;background:var(--bg-card);border:1px solid var(--border-subtle);color:var(--text-secondary);transition:var(--transition-fast);border-radius:100px;align-items:center;gap:6px;padding:5px 12px;font-size:.75rem;font-weight:500;display:inline-flex}.meta-badge .dot{background:var(--accent-emerald);width:6px;height:6px;box-shadow:0 0 8px var(--accent-emerald);border-radius:50%;animation:2s ease-in-out infinite dotBlink}@keyframes dotBlink{0%,to{opacity:1}50%{opacity:.4}}.meta-badge.source .dot{background:var(--accent-cyan);box-shadow:0 0 8px var(--accent-cyan)}.hidden-badge{border-radius:var(--radius-sm);color:var(--accent-rose);vertical-align:middle;cursor:help;background:#f43f5e1a;border:1px solid #f43f5e33;align-items:center;padding:2px 8px;font-size:.7rem;font-weight:600;display:inline-flex}.header-right{align-items:center;gap:12px;display:flex}.connection-status{border-radius:var(--radius-md);color:var(--accent-emerald);background:#34d3990f;border:1px solid #34d39926;align-items:center;gap:8px;padding:8px 16px;font-size:.8rem;font-weight:500;display:flex}.connection-status.offline{color:var(--accent-rose);background:#f43f5e0f;border-color:#f43f5e26}.connection-status .pulse{background:currentColor;border-radius:50%;width:8px;height:8px;animation:2s ease-in-out infinite statusPulse}@keyframes statusPulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.6;transform:scale(1.4)}}.stats-row{grid-template-columns:repeat(4,1fr);gap:16px;display:grid}.stat-card{border-radius:var(--radius-lg);background:var(--bg-card);border:1px solid var(--border-subtle);box-shadow:var(--shadow-card);transition:var(--transition-smooth);padding:20px 22px;animation:.6s cubic-bezier(.16,1,.3,1) backwards cardSlideUp;position:relative;overflow:hidden}.stat-card:first-child{animation-delay:0s}.stat-card:nth-child(2){animation-delay:80ms}.stat-card:nth-child(3){animation-delay:.16s}.stat-card:nth-child(4){animation-delay:.24s}@keyframes cardSlideUp{0%{opacity:0;transform:translateY(16px)}}.stat-card:hover{border-color:var(--border-medium);box-shadow:var(--shadow-elevated), var(--shadow-glow);transform:translateY(-2px)}.stat-card:before{content:"";opacity:0;height:2px;transition:opacity var(--transition-smooth);border-radius:2px 2px 0 0;position:absolute;top:0;left:0;right:0}.stat-card:hover:before{opacity:1}.stat-card:first-child:before{background:linear-gradient(90deg, var(--accent-purple), var(--accent-blue))}.stat-card:nth-child(2):before{background:linear-gradient(90deg, var(--accent-cyan), var(--accent-emerald))}.stat-card:nth-child(3):before{background:linear-gradient(90deg, var(--accent-amber), var(--accent-orange))}.stat-card:nth-child(4):before{background:linear-gradient(90deg, var(--accent-rose), var(--accent-purple))}.stat-card .stat-icon{border-radius:var(--radius-sm);justify-content:center;align-items:center;width:36px;height:36px;margin-bottom:14px;font-size:16px;display:flex}.stat-card:first-child .stat-icon{color:var(--accent-purple);background:#8b5cf61a}.stat-card:nth-child(2) .stat-icon{color:var(--accent-cyan);background:#22d3ee1a}.stat-card:nth-child(3) .stat-icon{color:var(--accent-amber);background:#f59e0b1a}.stat-card:nth-child(4) .stat-icon{color:var(--accent-rose);background:#f43f5e1a}.stat-label{color:var(--text-muted);text-transform:uppercase;letter-spacing:.08em;margin-bottom:6px;font-size:.73rem;font-weight:500}.stat-value{letter-spacing:-.03em;font-variant-numeric:tabular-nums;font-size:1.7rem;font-weight:800;line-height:1.1}.stat-value .unit{color:var(--text-secondary);margin-left:2px;font-size:.7em;font-weight:500}.filters{border-radius:var(--radius-lg);background:var(--bg-card);border:1px solid var(--border-subtle);box-shadow:var(--shadow-card);flex-wrap:wrap;align-items:center;gap:12px;padding:14px 20px;display:flex}.search-wrapper{flex:1;min-width:240px;position:relative}.search-wrapper .search-icon{color:var(--text-muted);pointer-events:none;font-size:14px;position:absolute;top:50%;left:14px;transform:translateY(-50%)}.search-wrapper input{border-radius:var(--radius-md);border:1px solid var(--border-subtle);background:var(--bg-surface);width:100%;color:var(--text-primary);transition:var(--transition-fast);outline:none;padding:10px 14px 10px 40px;font-family:inherit;font-size:.87rem}.search-wrapper input::placeholder{color:var(--text-muted)}.search-wrapper input:focus{border-color:var(--accent-purple);box-shadow:0 0 0 3px var(--glow-purple)}.filter-divider{background:var(--border-subtle);width:1px;height:28px}.filter-group{align-items:center;gap:10px;display:flex}.filter-group label{color:var(--text-muted);text-transform:uppercase;letter-spacing:.06em;white-space:nowrap;font-size:.75rem;font-weight:500}.filter-group input[type=range]{appearance:none;background:var(--bg-elevated);cursor:pointer;border-radius:100px;outline:none;width:100px;height:4px}.filter-group input[type=range]::-webkit-slider-thumb{appearance:none;background:var(--accent-purple);border:2px solid var(--bg-card);width:16px;height:16px;box-shadow:0 0 8px var(--glow-purple);cursor:pointer;transition:var(--transition-fast);border-radius:50%}.filter-group input[type=range]::-webkit-slider-thumb:hover{transform:scale(1.2)}.filter-value{color:var(--accent-purple);text-align:center;border-radius:var(--radius-sm);background:#8b5cf614;min-width:36px;padding:3px 8px;font-family:JetBrains Mono,monospace;font-size:.8rem;font-weight:600}.filter-group input[type=number]{border-radius:var(--radius-sm);border:1px solid var(--border-subtle);background:var(--bg-surface);width:72px;color:var(--text-primary);text-align:center;transition:var(--transition-fast);outline:none;padding:6px 10px;font-family:JetBrains Mono,monospace;font-size:.8rem}.filter-group input[type=number]:focus{border-color:var(--accent-purple);box-shadow:0 0 0 3px var(--glow-purple)}.filter-select{border-radius:var(--radius-sm);border:1px solid var(--border-subtle);background:var(--bg-surface) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%238b8fa8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m3 5 3 3 3-3'/%3E%3C/svg%3E") no-repeat right 10px center;color:var(--text-primary);cursor:pointer;appearance:none;transition:var(--transition-fast);outline:none;padding:6px 30px 6px 10px;font-family:inherit;font-size:.8rem;font-weight:500}.filter-select:focus{border-color:var(--accent-purple);box-shadow:0 0 0 3px var(--glow-purple)}.sort-dir-btn{border-radius:var(--radius-sm);border:1px solid var(--border-subtle);background:var(--bg-surface);width:28px;height:28px;color:var(--text-primary);cursor:pointer;transition:var(--transition-fast);outline:none;justify-content:center;align-items:center;font-size:1rem;display:inline-flex}.sort-dir-btn:hover{background:var(--bg-card-hover);border-color:var(--border-medium)}.sort-dir-btn:focus{border-color:var(--accent-purple);box-shadow:0 0 0 3px var(--glow-purple)}.main-content{grid-template-columns:1fr 400px;align-items:start;gap:20px;display:grid}.table-section{border-radius:var(--radius-lg);background:var(--bg-card);border:1px solid var(--border-subtle);box-shadow:var(--shadow-card);animation:.6s cubic-bezier(.16,1,.3,1) .3s backwards cardSlideUp;overflow:hidden}.table-header{border-bottom:1px solid var(--border-subtle);justify-content:space-between;align-items:center;padding:18px 22px;display:flex}.table-header h2{color:var(--text-primary);align-items:center;gap:8px;font-size:.95rem;font-weight:700;display:flex}.table-header h2 .icon{font-size:16px}.table-header .count-badge{color:var(--accent-purple);font-variant-numeric:tabular-nums;background:#8b5cf61a;border-radius:100px;padding:2px 10px;font-size:.7rem;font-weight:600}.table-wrap{max-height:calc(100vh - 420px);overflow:auto}table{border-collapse:collapse;width:100%}thead{z-index:2;position:sticky;top:0}th{text-align:left;text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted);background:var(--bg-card);border-bottom:1px solid var(--border-subtle);white-space:nowrap;padding:12px 18px;font-size:.7rem;font-weight:600}td{border-bottom:1px solid var(--border-subtle);transition:var(--transition-fast);white-space:nowrap;padding:14px 18px;font-size:.85rem}td:first-child{white-space:normal;max-width:300px;font-weight:500}tbody tr{transition:var(--transition-fast)}tbody tr:hover{background:var(--bg-card-hover)}tbody tr:hover td{border-bottom-color:var(--border-medium)}.td-mono{font-family:JetBrains Mono,monospace;font-size:.8rem;font-weight:500}.ratio-cell{align-items:center;gap:10px;display:flex}.ratio-bar-bg{background:var(--bg-elevated);border-radius:100px;flex:1;min-width:60px;height:6px;overflow:hidden}.ratio-bar-fill{border-radius:100px;height:100%;transition:width .8s cubic-bezier(.16,1,.3,1)}.ratio-bar-fill.high{background:linear-gradient(90deg, var(--accent-emerald), var(--accent-cyan));box-shadow:0 0 8px #34d3994d}.ratio-bar-fill.medium{background:linear-gradient(90deg, var(--accent-amber), var(--accent-orange));box-shadow:0 0 8px #f59e0b33}.ratio-bar-fill.low{background:linear-gradient(90deg, var(--accent-rose), var(--accent-purple));box-shadow:0 0 8px #f43f5e33}.ratio-text{text-align:right;min-width:42px;font-family:JetBrains Mono,monospace;font-size:.78rem;font-weight:600}.ratio-text.high{color:var(--accent-emerald)}.ratio-text.medium{color:var(--accent-amber)}.ratio-text.low{color:var(--accent-rose)}.volume-badge{border-radius:100px;padding:3px 10px;font-family:JetBrains Mono,monospace;font-size:.78rem;font-weight:600;display:inline-flex}.volume-badge.large{color:var(--accent-emerald);background:#34d39914}.volume-badge.medium{color:var(--accent-amber);background:#f59e0b14}.volume-badge.small{color:var(--accent-purple);background:#8b5cf614}.trades-section{border-radius:var(--radius-lg);background:var(--bg-card);border:1px solid var(--border-subtle);box-shadow:var(--shadow-card);animation:.6s cubic-bezier(.16,1,.3,1) .4s backwards cardSlideUp;overflow:hidden}.trades-header{border-bottom:1px solid var(--border-subtle);justify-content:space-between;align-items:center;padding:18px 22px;display:flex}.trades-header h2{color:var(--text-primary);align-items:center;gap:8px;font-size:.95rem;font-weight:700;display:flex}.trades-header h2 .icon{font-size:16px}.trades-header .live-indicator{color:var(--accent-emerald);text-transform:uppercase;letter-spacing:.1em;align-items:center;gap:6px;font-size:.7rem;font-weight:600;display:flex}.trades-header .live-dot{background:var(--accent-emerald);border-radius:50%;width:6px;height:6px;animation:1.5s ease-in-out infinite livePulse}@keyframes livePulse{0%,to{box-shadow:0 0 #34d39980}50%{box-shadow:0 0 0 6px #34d39900}}.trades-list{max-height:calc(100vh - 420px);margin:0;padding:0;list-style:none;overflow-y:auto}.trade-item{border-bottom:1px solid var(--border-subtle);transition:var(--transition-fast);flex-direction:column;gap:6px;padding:14px 22px;animation:.4s cubic-bezier(.16,1,.3,1) backwards tradeSlideIn;display:flex}@keyframes tradeSlideIn{0%{opacity:0;transform:translate(-8px)}}.trade-item:hover{background:var(--bg-card-hover)}.trade-top{justify-content:space-between;align-items:center;gap:12px;display:flex}.trade-market{color:var(--text-primary);text-overflow:ellipsis;white-space:nowrap;flex:1;font-size:.82rem;font-weight:600;overflow:hidden}.trade-amount{white-space:nowrap;border-radius:100px;padding:3px 10px;font-family:JetBrains Mono,monospace;font-size:.82rem;font-weight:700}.trade-amount.buy{color:var(--accent-emerald);background:#34d39914}.trade-amount.sell{color:var(--accent-rose);background:#f43f5e14}.trade-bottom{align-items:center;gap:12px;font-size:.72rem;display:flex}.trade-side{text-transform:uppercase;letter-spacing:.06em;align-items:center;gap:4px;font-weight:600;display:inline-flex}.trade-side.buy{color:var(--accent-emerald)}.trade-side.sell{color:var(--accent-rose)}.trade-side .arrow{font-size:10px}.trade-source{color:var(--text-muted);font-weight:500}.trade-trader{color:var(--text-muted);transition:var(--transition-fast);font-family:JetBrains Mono,monospace;font-size:.7rem;text-decoration:none}.trade-trader:hover{color:var(--accent-purple);text-decoration:underline}.trade-time{color:var(--text-muted);font-variant-numeric:tabular-nums;margin-left:auto}.loading-state{flex-direction:column;justify-content:center;align-items:center;gap:20px;padding:80px 40px;animation:.6s fadeIn;display:flex}@keyframes fadeIn{0%{opacity:0}}.loading-spinner{border:3px solid var(--border-subtle);border-top-color:var(--accent-purple);border-radius:50%;width:48px;height:48px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.loading-state p{color:var(--text-muted);font-size:.9rem;font-weight:500}.empty-state{text-align:center;color:var(--text-muted);padding:48px 40px;font-size:.85rem}.empty-state .empty-icon{opacity:.5;margin-bottom:12px;font-size:32px}@media (width<=1200px){.main-content{grid-template-columns:1fr}.trades-section{order:-1}}@media (width<=900px){.stats-row{grid-template-columns:repeat(2,1fr)}.app{padding:20px 16px 48px}.header{flex-direction:column}}@media (width<=600px){.stats-row{grid-template-columns:1fr}.filters{flex-direction:column;align-items:stretch}.filter-divider{width:100%;height:1px}.filter-group{justify-content:space-between}.search-wrapper{min-width:0}}