*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%;overflow:hidden}

:root{
  --bg:#09090b;
  --bg2:#0f0f12;
  --surface:#18181b;
  --surface2:#1f1f23;
  --border:#27272a;
  --border2:#3f3f46;
  --text:#fafafa;
  --muted:#71717a;
  --muted2:#52525b;
  --accent:#e4e4e7;
  --green:#4ade80;
  --green-dim:rgba(74,222,128,0.1);
  --red:#f87171;
  --red-dim:rgba(248,113,113,0.1);
  --amber:#fbbf24;
  --amber-dim:rgba(251,191,36,0.08);
  --blue:#60a5fa;
  --blue-dim:rgba(96,165,250,0.08);
  --mono:'JetBrains Mono','Fira Code','Courier New',monospace;
  --sans:'Syne',system-ui,sans-serif;
}

body{background:var(--bg);color:var(--text);font-family:var(--sans);position:relative}

body::before{
  content:'';
  position:fixed;
  inset:0;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='1'/%3E%3C/svg%3E");
  opacity:.03;
  pointer-events:none;
  z-index:1000;
}

body::after{
  content:'';
  position:fixed;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(1200px 500px at 50% -20%, rgba(255,255,255,.08), transparent),
    repeating-linear-gradient(
      90deg,
      rgba(255,255,255,.01) 0px,
      rgba(255,255,255,.01) 2px,
      transparent 2px,
      transparent 42px
    );
  z-index:0;
}

.shell{display:grid;grid-template-columns:220px 1fr;grid-template-rows:100vh;height:100vh;width:100vw;position:relative;z-index:1}

.sidebar{background:var(--bg2);border-right:1px solid var(--border);display:flex;flex-direction:column;overflow:hidden}

.sidebar-logo{padding:20px 18px 16px;border-bottom:1px solid var(--border)}

.logo-mark{display:flex;align-items:center;gap:10px;margin-bottom:6px}

.logo-icon{
  width:28px;height:28px;
  background:var(--text);
  border-radius:6px;
  display:flex;align-items:center;justify-content:center;
  font-size:10px;
  font-family:var(--mono);
  color:#09090b;
  font-weight:700;
  flex-shrink:0;
}

.logo-name{font-family:var(--sans);font-size:1rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--text)}

.logo-sub{font-family:var(--mono);font-size:.6rem;color:var(--muted);letter-spacing:.05em;line-height:1.4}

.chain-section{padding:14px 18px;border-bottom:1px solid var(--border)}

.section-label{font-family:var(--mono);font-size:.6rem;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);margin-bottom:8px}

.chain-list{display:flex;flex-direction:column;gap:2px}

.chain-btn{
  display:flex;align-items:center;gap:8px;
  padding:7px 10px;
  border-radius:6px;border:1px solid transparent;
  background:transparent;
  color:var(--muted);
  font-family:var(--sans);font-size:.8rem;font-weight:500;
  cursor:pointer;text-align:left;transition:all .15s;width:100%;
}

.chain-btn:hover{background:var(--surface);color:var(--text)}

.chain-btn.active{background:var(--surface2);color:var(--text);border:1px solid var(--border2)}

.chain-dot{width:6px;height:6px;border-radius:50%;background:var(--muted2);flex-shrink:0}

.chain-btn.active .chain-dot{background:var(--green);box-shadow:0 0 6px var(--green)}

.run-section{padding:14px 18px;border-bottom:1px solid var(--border)}

.run-btn{
  width:100%;padding:9px 14px;background:var(--text);color:var(--bg);border:none;border-radius:7px;
  font-family:var(--sans);font-size:.82rem;font-weight:700;letter-spacing:.04em;
  cursor:pointer;transition:opacity .15s, transform .15s;
  display:flex;align-items:center;justify-content:center;gap:6px;
}

.run-btn:hover:not(:disabled){opacity:.85;transform:translateY(-1px)}
.run-btn:disabled{opacity:.35;cursor:not-allowed;transform:none}

.phase-section{padding:14px 18px;border-bottom:1px solid var(--border);flex:1}

.phase-step{display:flex;align-items:flex-start;gap:10px;padding:6px 0;position:relative}

.phase-step:not(:last-child)::after{content:'';position:absolute;left:9px;top:22px;width:1px;height:calc(100% - 6px);background:var(--border)}

.step-circle{width:18px;height:18px;border-radius:50%;border:1px solid var(--border2);background:var(--bg2);display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:.55rem;color:var(--muted);flex-shrink:0;transition:all .3s;z-index:1}

.step-label{font-size:.72rem;color:var(--muted);padding-top:1px;transition:color .3s;font-family:var(--mono)}

.phase-step.active .step-circle{border-color:var(--text);background:var(--text);color:var(--bg)}
.phase-step.active .step-label{color:var(--text)}

.phase-step.done .step-circle{border-color:var(--green);background:var(--green-dim);color:var(--green)}
.phase-step.done .step-label{color:var(--green)}

.sidebar-stats{padding:14px 18px;margin-top:auto;border-top:1px solid var(--border)}

.stat-row{display:flex;justify-content:space-between;align-items:center;padding:4px 0}

.stat-k{font-family:var(--mono);font-size:.62rem;color:var(--muted)}
.stat-v{font-family:var(--mono);font-size:.62rem;color:var(--text);font-weight:600}

.main{display:grid;grid-template-rows:auto 1fr;overflow:hidden;background:var(--bg)}

.topbar{border-bottom:1px solid var(--border);padding:0 20px;height:44px;display:flex;align-items:center;justify-content:space-between;background:var(--bg2)}

.topbar-left{display:flex;align-items:center;gap:16px}

.meta-pill{
  font-family:var(--mono);
  font-size:.58rem;
  color:var(--muted);
  border:1px solid var(--border);
  background:var(--surface);
  border-radius:999px;
  padding:3px 9px;
  letter-spacing:.08em;
}

.meta-pill.chain{
  color:var(--text);
  border-color:var(--border2);
}

.status-pill{display:flex;align-items:center;gap:6px;font-family:var(--mono);font-size:.65rem;color:var(--muted);letter-spacing:.04em}

.status-dot{width:5px;height:5px;border-radius:50%;background:var(--muted2)}

.status-dot.live{background:var(--green);box-shadow:0 0 5px var(--green);animation:pulse-dot 2s infinite}

@keyframes pulse-dot{0%,100%{opacity:1}50%{opacity:.4}}

.topbar-right{display:flex;align-items:center;gap:10px;font-family:var(--mono);font-size:.6rem;color:var(--muted)}

.topbar-btn{
  border:1px solid var(--border2);
  background:var(--surface);
  color:var(--text);
  border-radius:6px;
  font-family:var(--mono);
  font-size:.62rem;
  letter-spacing:.03em;
  padding:5px 9px;
  cursor:pointer;
  transition:all .15s;
}

.topbar-btn:hover{background:var(--surface2);border-color:#5b5b66}

.topbar-btn:disabled{opacity:.45;cursor:not-allowed}

.dashboard{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;gap:1px;background:var(--border);overflow:hidden}

.card{background:var(--bg);display:flex;flex-direction:column;overflow:hidden;transition:background .2s}

.card:hover{background:#0d0d10}

.card-head{padding:12px 16px 10px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;flex-shrink:0}

.card-title{display:flex;align-items:center;gap:8px}

.card-icon{font-family:var(--mono);font-size:.7rem;color:var(--muted);background:var(--surface);padding:2px 6px;border-radius:3px;border:1px solid var(--border)}

.card-label{font-size:.75rem;font-weight:600;letter-spacing:.03em;color:var(--text)}

.card-count{font-family:var(--mono);font-size:.62rem;color:var(--muted);background:var(--surface);padding:2px 8px;border-radius:20px;border:1px solid var(--border)}

.card-body{flex:1;overflow-y:auto;padding:0}

.card-body::-webkit-scrollbar{width:3px}
.card-body::-webkit-scrollbar-track{background:transparent}
.card-body::-webkit-scrollbar-thumb{background:var(--border2);border-radius:2px}

.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;gap:6px;color:var(--muted2)}

.empty-state-icon{font-size:1.2rem;opacity:.3}

.empty-state-text{font-family:var(--mono);font-size:.62rem;text-align:center;letter-spacing:.04em}

.token-row{display:grid;grid-template-columns:18px 80px 1fr auto auto;align-items:center;gap:10px;padding:10px 16px;border-bottom:1px solid var(--border);transition:background .15s;animation:rowIn .3s ease both}
.token-row:hover{background:var(--surface)}
.token-row:last-child{border-bottom:none}

.row-num{font-family:var(--mono);font-size:.6rem;color:var(--muted2)}

.token-sym{font-family:var(--sans);font-size:.82rem;font-weight:700;color:var(--text);letter-spacing:.02em}

.token-sector{font-family:var(--mono);font-size:.6rem;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

.token-mcap{font-family:var(--mono);font-size:.65rem;color:var(--muted);text-align:right}

.token-inflow{font-family:var(--mono);font-size:.72rem;font-weight:600;color:var(--green);text-align:right;min-width:60px}
.token-inflow.neutral{color:var(--muted)}

.wallet-row{padding:11px 16px;border-bottom:1px solid var(--border);display:grid;grid-template-columns:1fr auto;gap:8px;transition:background .15s;animation:rowIn .35s ease both}
.wallet-row:hover{background:var(--surface)}
.wallet-row:last-child{border-bottom:none}

.wallet-addr{font-family:var(--mono);font-size:.68rem;color:var(--blue);margin-bottom:4px}

.wallet-meta{display:flex;gap:12px;align-items:center;flex-wrap:wrap}

.wallet-label-tag{font-family:var(--mono);font-size:.58rem;background:var(--surface);border:1px solid var(--border2);color:var(--muted);padding:1px 6px;border-radius:3px}

.wallet-pnl{font-family:var(--mono);font-size:.72rem;font-weight:600}
.wallet-pnl.pos{color:var(--green)}
.wallet-pnl.neg{color:var(--red)}
.wallet-pnl.zero{color:var(--muted)}

.coord-row{padding:11px 16px;border-bottom:1px solid var(--border);animation:rowIn .35s ease both;transition:background .15s}
.coord-row:hover{background:var(--surface)}
.coord-row:last-child{border-bottom:none}

.coord-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px}

.coord-strength{display:flex;gap:3px}

.strength-pip{width:16px;height:3px;border-radius:2px;background:var(--border2)}
.strength-pip.on{background:var(--amber)}

.coord-cp{font-family:var(--mono);font-size:.62rem;color:var(--muted);margin-bottom:4px}

.coord-wallets{font-family:var(--mono);font-size:.6rem;color:var(--amber)}

.no-coord{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px}

.no-coord-badge{font-family:var(--mono);font-size:.6rem;background:var(--green-dim);color:var(--green);border:1px solid rgba(74,222,128,.2);padding:4px 12px;border-radius:20px;letter-spacing:.06em}

.no-coord-text{font-family:var(--mono);font-size:.6rem;color:var(--muted2);text-align:center;max-width:180px;line-height:1.5}

.perp-row{padding:11px 16px;border-bottom:1px solid var(--border);animation:rowIn .35s ease both;transition:background .15s}
.perp-row:hover{background:var(--surface)}
.perp-row:last-child{border-bottom:none}

.perp-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:5px}

.perp-addr{font-family:var(--mono);font-size:.68rem;color:var(--blue)}

.side-badge{font-family:var(--mono);font-size:.6rem;padding:2px 8px;border-radius:3px;font-weight:700;letter-spacing:.06em}
.side-badge.long{background:var(--green-dim);color:var(--green);border:1px solid rgba(74,222,128,.2)}
.side-badge.short{background:var(--red-dim);color:var(--red);border:1px solid rgba(248,113,113,.2)}
.side-badge.unknown{background:var(--surface);color:var(--muted);border:1px solid var(--border)}

.perp-detail{font-family:var(--mono);font-size:.62rem;color:var(--muted)}

.no-overlap{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px}

.no-overlap-badge{font-family:var(--mono);font-size:.6rem;background:var(--blue-dim);color:var(--blue);border:1px solid rgba(96,165,250,.2);padding:4px 12px;border-radius:20px;letter-spacing:.06em}

.no-overlap-text{font-family:var(--mono);font-size:.6rem;color:var(--muted2);text-align:center;max-width:180px;line-height:1.5}

.skel{display:flex;flex-direction:column;gap:1px;padding:8px 0}

.skel-row{height:38px;margin:0 16px;border-radius:4px;background:linear-gradient(90deg,var(--surface) 25%,var(--surface2) 50%,var(--surface) 75%);background-size:200% 100%;animation:shimmer 1.5s infinite;border:1px solid var(--border)}

@keyframes shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}

@keyframes rowIn{from{opacity:0;transform:translateX(-6px)}to{opacity:1;transform:translateX(0)}}

::-webkit-scrollbar{width:3px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:var(--border2)}

@media (max-width: 980px){
  html,body{overflow:auto}
  .shell{grid-template-columns:1fr;grid-template-rows:auto 1fr;min-height:100vh;height:auto}
  .sidebar{border-right:none;border-bottom:1px solid var(--border)}
  .phase-section{max-height:220px;overflow:auto}
  .dashboard{grid-template-columns:1fr;grid-template-rows:repeat(4,minmax(240px,auto))}
  .main{min-height:70vh}
  .topbar{height:auto;min-height:44px;padding:8px 12px;flex-wrap:wrap;gap:8px}
  .topbar-left{gap:8px;flex-wrap:wrap}
}