/* ============ engine console ============ */
body.console{background:var(--bg)}
.wrap{max-width:1180px;margin:0 auto;padding:120px clamp(18px,4vw,44px) 70px}
.head{max-width:680px;margin-bottom:38px}
.head h1{font-size:clamp(30px,4.4vw,48px);margin:14px 0 0}
.head p{color:var(--muted);margin-top:16px;font-size:15.5px}

.engine-badge{font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--dim);border:1px solid var(--line-2);padding:7px 13px;border-radius:999px}
.engine-badge.live{color:var(--up);border-color:rgba(61,220,151,.3)}
.engine-badge.warn{color:#ffb454;border-color:rgba(255,180,84,.3)}

.cols{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.panel{border:1px solid var(--line-2);border-radius:18px;background:rgba(255,255,255,.02);overflow:hidden;
  display:flex;flex-direction:column}
.panel.wide{grid-column:1 / -1}
.panel-head{display:flex;align-items:baseline;gap:12px;padding:14px 18px;border-bottom:1px solid var(--line-2);
  background:rgba(255,255,255,.02)}
.panel-head b{font-family:var(--disp);font-size:13.5px;letter-spacing:.02em}
.panel-head span{font-family:var(--mono);font-size:11px;color:var(--dim);letter-spacing:.06em;margin-left:auto}
.panel-body{padding:18px;flex:1}

/* composer */
.composer{display:flex;gap:12px}
.composer img{border-radius:10px;flex:none}
.composer-main{flex:1;min-width:0}
.composer-who b{font-size:14px}
.composer-who span{font-size:12.5px;color:var(--dim);margin-left:7px}
#post{width:100%;margin-top:8px;background:#07070d;color:var(--txt);resize:vertical;
  border:1px solid var(--line-2);border-radius:12px;padding:12px;font-family:var(--body);font-size:15px;
  line-height:1.5;outline:none;transition:border-color .2s}
#post:focus{border-color:rgba(124,58,255,.5)}
.composer-foot{display:flex;align-items:center;gap:10px;margin-top:12px;flex-wrap:wrap}
.chips{display:flex;gap:6px;flex-wrap:wrap;margin-right:auto}
.chip{font-family:var(--mono);font-size:11.5px;color:var(--v-3);background:var(--v-dim);
  border:1px solid rgba(124,58,255,.25);border-radius:999px;padding:5px 11px;cursor:pointer;transition:.2s}
.chip:hover{border-color:var(--v);color:#fff}

.parse{margin-top:16px;border-top:1px solid var(--line-2);padding-top:14px;
  font-family:var(--mono);font-size:12.5px;line-height:1.9}
.parse .ln{opacity:0;animation:fade .3s forwards}
.parse .k{color:var(--v-2)} .parse .g{color:var(--up)} .parse .t{color:var(--dim)} .parse .r{color:#ff5c7a}

/* market */
.empty{text-align:center;padding:48px 20px;color:var(--dim)}
.empty img{margin:0 auto 16px;border-radius:12px;opacity:.5}
.empty p{font-size:14.5px;max-width:280px;margin:0 auto}
.empty b{color:var(--v-3)}

.mk-top{display:flex;justify-content:space-between;align-items:flex-start;gap:16px}
.mk-pair{font-family:var(--mono);font-size:19px;color:var(--v-3);letter-spacing:.04em}
.mk-under{font-size:12.5px;color:var(--dim);margin-top:5px}
.mk-under b{color:var(--txt);font-family:var(--mono)}
.mk-price{text-align:right}
.mk-px{font-family:var(--mono);font-size:21px;font-weight:500;transition:color .4s}
.mk-px.up{color:var(--up)} .mk-px.down{color:#ff5c7a}
.mk-lbl{font-family:var(--mono);font-size:10.5px;color:var(--dim);letter-spacing:.08em;margin-top:4px}
.g{color:var(--up)} .r{color:#ff5c7a}

#chart{width:100%;height:150px;display:block;margin:16px 0 4px}

.mk-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;
  border-block:1px solid var(--line-2);padding:14px 0;margin-bottom:16px}
.mk-stats span{display:block;font-family:var(--mono);font-size:10px;letter-spacing:.12em;
  text-transform:uppercase;color:var(--dim)}
.mk-stats b{display:block;font-family:var(--mono);font-size:14px;margin-top:5px}

.trade-head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:10px}
.trade-head b{font-family:var(--disp);font-size:14px}
.trade-head span{font-family:var(--mono);font-size:12px;color:var(--dim)}
.trade-row{display:flex;gap:8px}
#amt{flex:1;background:#07070d;border:1px solid var(--line-2);border-radius:999px;color:var(--txt);
  padding:10px 16px;font-family:var(--mono);font-size:13px;outline:none;min-width:0}
#amt:focus{border-color:rgba(124,58,255,.5)}
.btn.buy{background:rgba(61,220,151,.12);border-color:rgba(61,220,151,.35);color:var(--up)}
.btn.buy:hover{background:rgba(61,220,151,.2)}
.btn.sell{background:rgba(255,92,122,.1);border-color:rgba(255,92,122,.3);color:#ff8fa3}
.btn.sell:hover{background:rgba(255,92,122,.18)}
.earn{display:flex;align-items:center;gap:10px;margin-top:12px;padding-top:12px;
  border-top:1px solid var(--line-2);font-family:var(--mono);font-size:12px;color:var(--dim)}
.earn b{margin-left:auto;font-size:13px}

/* router */
.router{display:grid;grid-template-columns:1.2fr 1fr;gap:18px}
.t-head{display:grid;grid-template-columns:1.3fr .9fr .6fr 1fr;gap:8px;
  font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--dim);
  padding-bottom:9px;border-bottom:1px solid var(--line-2)}
.fills-head{display:flex;justify-content:space-between}
.t-body{font-family:var(--mono);font-size:12px;max-height:250px;overflow:auto;scrollbar-width:thin;
  -webkit-mask-image:linear-gradient(#000 88%,transparent);mask-image:linear-gradient(#000 88%,transparent)}
.t-empty{color:var(--dim);padding:18px 0;text-align:center}
.hrow{display:grid;grid-template-columns:1.3fr .9fr .6fr 1fr;gap:8px;padding:9px 0;
  border-bottom:1px solid var(--line-2)}
.hrow.you{color:var(--v-3)}
.hrow .fee{color:var(--up)}
.frow{display:flex;gap:10px;align-items:center;padding:7px 0;border-bottom:1px solid var(--line-2)}
.frow .side{width:34px;font-weight:700}
.frow .side.buy{color:var(--up)} .frow .side.sell{color:#ff5c7a}
.frow .who{color:var(--muted);flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.frow .fee{color:var(--v-2)}
.frow.new{animation:flash .9s var(--ease)}
@keyframes flash{from{background:rgba(124,58,255,.18)}to{background:transparent}}

.note{margin-top:26px;color:var(--dim);font-size:12.5px;max-width:760px;line-height:1.7}

@media (max-width:900px){
  .cols{grid-template-columns:1fr}
  .router{grid-template-columns:1fr}
  .mk-stats{grid-template-columns:repeat(2,1fr)}
}