/* Presentation only: the original chart data and interaction code are preserved. */
.dex-chart{position:relative;border:1px solid #303036!important;background:linear-gradient(150deg,#101013,#070708)!important;border-radius:18px!important;box-shadow:0 18px 60px #0005;overflow:hidden}
.market-data-label{margin:0;padding:10px 20px;border-bottom:1px solid #ffffff0b;color:#aaa5af;font:11px/1.5 monospace;letter-spacing:.02em}
.dex-chart:before{content:"";position:absolute;inset:0 24px auto;height:1px;background:linear-gradient(90deg,transparent,#ff4f9a80,transparent);pointer-events:none}
.dex-chart-toolbar{padding:18px 20px!important;border-bottom:1px solid #ffffff0b!important;gap:12px!important}
.dex-chart-tabs{gap:5px!important}
.dex-chart-tabs button{border-radius:6px!important;background:transparent!important;color:#8d8d99!important;border:1px solid transparent!important;font-family:monospace!important;transition:color .2s,border-color .2s,background .2s}
.dex-chart-tabs button:hover{color:#fff!important;border-color:#ffffff24!important}
.dex-chart-tabs button[aria-pressed=true]{color:#fff!important;background:#ffffff0b!important;border-color:#ff4f9a60!important}
.dex-chart-unit,.dex-ohlc-readout{font-family:monospace!important;font-size:11px!important;letter-spacing:.025em}
.dex-grid-line{stroke:#ffffff0a!important;stroke-dasharray:2 6}
.dex-axis-line{stroke:#ffffff15!important}
.dex-axis-text{fill:#777782!important;font-family:monospace!important;font-size:10px!important}
.dex-crosshair{stroke:#ff4f9a80!important;stroke-dasharray:3 5}
.dex-chart-caption{border-top:1px solid #ffffff0b!important;color:#777782!important;font-family:monospace!important;font-size:10px!important;letter-spacing:.05em;padding:12px 20px!important}
.sm-chart-label{display:inline-flex;align-items:center;gap:7px;color:#b1adb5;font:10px monospace;letter-spacing:.12em;margin-left:auto}
.sm-chart-label:before{content:"";width:5px;height:5px;background:#ff4f9a;border-radius:50%;animation:sm-chart-pulse 3s ease-in-out infinite}
.dex-chart-surface{background:radial-gradient(ellipse at 75% 30%,#ffffff03,transparent 70%)}
/* Keep the scrolling ledger stable; JS animates only freshly inserted rows and
   their displacement. Transform/opacity do not change layout or scroll height. */
.trade-ledger-list{position:relative}
.trade-ledger-card{transform-origin:center top}
@keyframes sm-chart-pulse{50%{opacity:.3}}
@media(max-width:600px){.dex-chart-toolbar{padding:12px!important}.dex-chart-caption{padding:10px 12px!important}.sm-chart-label{font-size:9px;letter-spacing:.06em}}
@media(prefers-reduced-motion:reduce){.sm-chart-label:before{animation:none}.dex-chart-tabs button{transition:none}}
