.exchange-dialog {
  width: min(1480px, 96vw);
  max-width: none;
  height: min(920px, 94vh);
  max-height: 94vh;
  padding: 0;
  overflow: hidden;
  color: #eaf4ff;
  border: 1px solid #2b4962;
  border-radius: 24px;
  background: #08121f;
  box-shadow: 0 32px 100px #000c, inset 0 1px #ffffff0a;
}

.exchange-dialog[open] { display: flex; flex-direction: column; }
.exchange-dialog.exchange-portfolio-outside { overflow: visible; }
.exchange-dialog::backdrop { background: #020711dc; backdrop-filter: blur(9px); }
.exchange-dialog .exchange-dialog-head { flex: 0 0 auto; padding: 17px 26px; background: linear-gradient(120deg, #10223a, #0b1729 56%, #111831); }
.exchange-dialog .exchange-dialog-head-compact { display: grid; grid-template-columns: minmax(270px, 1fr) minmax(175px, 290px) auto auto 42px; gap: 18px; align-items: center; }
.exchange-dialog .exchange-dialog-head-compact > div:first-child { min-width: 0; }
.exchange-dialog .exchange-dialog-head-compact > .dialog-close { justify-self: end; }
.exchange-dialog .exchange-dialog-head h2 { margin: 2px 0 4px; font-size: 27px; }
.exchange-dialog .exchange-dialog-head p:last-child { margin: 0; color: #8ea5bd; }
.exchange-header-balance { display: grid; min-width: 0; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 9px; padding: 9px 12px; border: 1px solid #d5ab465c; border-radius: 13px; background: linear-gradient(135deg, #2d240f99, #141c2bdb); box-shadow: inset 0 1px #fff3b51c, 0 8px 24px #0004; }
.exchange-header-balance > span { display: flex; min-width: 0; align-items: center; gap: 6px; color: #a99c7c; }
.exchange-header-balance > span i { font-size: 18px; font-style: normal; filter: drop-shadow(0 0 7px #ffd46170); }
.exchange-header-balance > span small { overflow: hidden; font-size: 9px; font-weight: 900; letter-spacing: .03em; white-space: nowrap; }
.exchange-header-balance > strong { overflow: hidden; color: #ffe189; font-size: 18px; font-variant-numeric: tabular-nums; text-align: right; text-overflow: ellipsis; text-shadow: 0 0 12px #ffc74b42; white-space: nowrap; }
.exchange-header-balance > em { color: #8c8065; font-size: 8px; font-style: normal; font-weight: 900; }

.exchange-tabs {
  display: flex;
  flex: 0 0 auto;
  gap: 8px;
  padding: 0;
  border: 0;
  background: transparent;
}
.exchange-tabs button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  min-width: 190px;
  padding: 12px 18px;
  color: #8da2b7;
  border: 1px solid #2b4057;
  border-radius: 12px;
  background: #101e2e;
  font-weight: 800;
  text-align: left;
}
.exchange-tabs button small { color: #5f7790; font-weight: 700; }
.exchange-tabs button.active { color: #e9fbff; border-color: #27d9d0; background: linear-gradient(135deg, #115b65, #174058); box-shadow: 0 0 22px #18d7ca20; }
.exchange-tabs button.active small { color: #73f3eb; }

.exchange-rules-toggle { display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-height: 40px; padding: 9px 13px; color: #a9bfd2; border: 1px solid #38526b; border-radius: 11px; background: #112237; font-size: 12px; font-weight: 900; white-space: nowrap; }
.exchange-rules-toggle span { color: #6ee7df; font-size: 15px; }
.exchange-rules-toggle:hover, .exchange-rules-toggle.active { color: #efffff; border-color: #2ed8ce; background: #164052; box-shadow: 0 0 18px #25d4c526; }
.exchange-rules-panel[hidden] { display: none; }
.exchange-rules-panel { flex: 0 0 auto; max-height: min(470px, 52vh); padding: 18px 24px 20px; overflow: auto; border-top: 1px solid #2a5061; border-bottom: 1px solid #1f3e51; background: radial-gradient(circle at 80% 0, #1a5a6140, transparent 38%), linear-gradient(145deg, #0d1e2c, #091523); scrollbar-color: #315d70 #0b1723; }
.exchange-rules-panel[data-market="cards"] { border-top-color: #6555ab; background: radial-gradient(circle at 80% 0, #5e4ba747, transparent 38%), linear-gradient(145deg, #171a31, #0c1423); }
.exchange-rules-panel > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; margin-bottom: 15px; }
.exchange-rules-panel > header .eyebrow { margin: 0 0 2px; color: #52d8cf; }
.exchange-rules-panel[data-market="cards"] > header .eyebrow { color: #aa9cff; }
.exchange-rules-panel h3 { margin: 0 0 4px; font-size: 21px; }
.exchange-rules-panel > header p:last-child { margin: 0; color: #8ca4b8; font-size: 12px; }
.exchange-rules-close { display: grid; width: 34px; height: 34px; flex: 0 0 auto; place-items: center; color: #8da5b9; border: 1px solid #344e65; border-radius: 10px; background: #102235; font-size: 21px; }
.exchange-rules-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.exchange-rules-grid article { padding: 13px 14px; border: 1px solid #244052; border-radius: 13px; background: #0a1724c7; }
.exchange-rules-panel[data-market="cards"] .exchange-rules-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.exchange-rules-panel[data-market="cards"] .exchange-rules-grid article { border-color: #3d3b68; background: #11182bc7; }
.exchange-rules-grid h4 { margin: 0 0 9px; color: #daf7f5; font-size: 13px; }
.exchange-rules-grid ul { display: grid; gap: 7px; margin: 0; padding: 0; list-style: none; }
.exchange-rules-grid li { position: relative; padding-left: 12px; color: #91a7ba; font-size: 11px; line-height: 1.55; }
.exchange-rules-grid li::before { position: absolute; top: .62em; left: 0; width: 4px; height: 4px; content: ""; border-radius: 50%; background: #3bd8ce; box-shadow: 0 0 7px #3bd8ce; }
.exchange-rules-panel[data-market="cards"] .exchange-rules-grid li::before { background: #a28fff; box-shadow: 0 0 7px #a28fff; }
.exchange-rules-note { margin: 12px 0 0; padding: 9px 12px; color: #cce7e4; border: 1px solid #2b655f; border-radius: 10px; background: #17403980; font-size: 11px; font-weight: 800; line-height: 1.5; }
.exchange-rules-panel[data-market="cards"] .exchange-rules-note { color: #ddd7ff; border-color: #594e91; background: #31295180; }

.exchange-card-coming {
  flex: 1;
  place-content: center;
  text-align: center;
  background: radial-gradient(circle at center, #25365f66, transparent 45%);
}
.exchange-card-coming:not([hidden]) { display: grid; justify-items: center; }
.exchange-coming-icon { display: grid; width: 94px; height: 94px; place-items: center; font-size: 45px; border: 1px solid #8b7bff70; border-radius: 28px; background: #6250cf20; box-shadow: 0 0 50px #795fff30; }
.exchange-card-coming h3 { margin: 3px 0 4px; font-size: 31px; }
.exchange-card-coming > p:not(.eyebrow) { max-width: 560px; margin: 0; color: #93a6bc; line-height: 1.7; }
.exchange-card-coming > span { margin-top: 18px; padding: 9px 18px; color: #c5bcff; border: 1px solid #6b5be0; border-radius: 999px; background: #4b3da533; font-weight: 800; }

.exchange-coin-panel { position: relative; display: flex; min-height: 0; flex: 1; flex-direction: column; overflow: hidden; scrollbar-color: #31536c #0b1624; }
.exchange-market-header {
  display: grid;
  grid-template-columns: minmax(270px, 1fr) auto minmax(380px, .95fr);
  gap: 22px;
  align-items: center;
  padding: 18px 26px;
  border-bottom: 1px solid #1c3347;
  background: linear-gradient(90deg, #0b1827, #0e1d2c);
}
.exchange-market-header > div:first-child { display: flex; align-items: center; gap: 13px; }
.exchange-symbol { position: relative; display: grid; flex: 0 0 auto; width: 58px; height: 58px; place-items: center; overflow: hidden; border-radius: 17px; background: linear-gradient(145deg, #4bfff1, #39b5ff); box-shadow: 0 0 25px #38e7e34a; }
.exchange-symbol::before { width: 25px; height: 25px; content: ""; border: 4px solid #061c2b; border-width: 0 4px 4px 0; transform: rotate(-45deg); }
.exchange-symbol::after { position: absolute; width: 28px; height: 4px; content: ""; border-radius: 999px; background: #061c2b; transform: translate(-1px, 8px) rotate(-45deg); }
.exchange-market-header h3 { margin: 0 0 3px; font-size: 21px; }
.exchange-market-header small { color: #8499ae; }
.exchange-status-dot { display: inline-block; width: 7px; height: 7px; margin-right: 5px; border-radius: 50%; background: #3ff5c0; box-shadow: 0 0 9px #3ff5c0; }
.exchange-market-price { text-align: right; }
.exchange-market-price strong { display: block; max-width: 100%; overflow: hidden; font-size: clamp(24px, 2.2vw, 32px); line-height: 1; letter-spacing: -.5px; text-overflow: ellipsis; white-space: nowrap; }
.exchange-market-price span { margin-right: 8px; font-size: 13px; font-weight: 900; }
.exchange-market-price small { font-size: 11px; }
.exchange-market-price .up, .exchange-market-stats .up, .exchange-trades .up { color: #ff6279; }
.exchange-market-price .down, .exchange-market-stats .down, .exchange-trades .down { color: #51a8ff; }
.exchange-market-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 7px; margin: 0; }
.exchange-market-stats div { padding: 9px 11px; border: 1px solid #21394f; border-radius: 10px; background: #0a1522; }
.exchange-market-stats dt { color: #667f98; font-size: 11px; }
.exchange-market-stats dd { min-width: 0; margin: 3px 0 0; overflow-wrap: anywhere; font-size: 13px; font-weight: 800; }

.exchange-workspace { position: relative; display: grid; min-height: 0; flex: 1; grid-template-columns: minmax(0, 1.65fr) minmax(330px, .68fr); gap: 14px; padding: 14px; overflow: hidden; }
.exchange-main-column, .exchange-side-column { min-width: 0; min-height: 0; display: grid; align-content: start; gap: 14px; }
.exchange-main-column { height: 100%; }
.exchange-side-column { display: flex; height: 100%; flex-direction: column; align-items: stretch; overflow: auto; scrollbar-color: #31536c transparent; scrollbar-width: thin; }
.exchange-side-column > article { flex: 0 0 auto; }
.exchange-order-ticket { order: -3; }
.exchange-open-orders-card { order: -2; }
.exchange-portfolio { order: -1; }
.exchange-chart-card, .exchange-order-book-card, .exchange-trades-card, .exchange-portfolio, .exchange-order-ticket, .exchange-open-orders-card {
  overflow: hidden;
  border: 1px solid #20384d;
  border-radius: 15px;
  background: #0b1725;
  box-shadow: inset 0 1px #ffffff06;
}
.exchange-chart-card > header, .exchange-order-book-card > header, .exchange-trades-card > header, .exchange-portfolio > header, .exchange-open-orders-card > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 42px;
  padding: 0 14px;
  border-bottom: 1px solid #1a3043;
}
.exchange-chart-card { display: flex; min-height: 0; height: 100%; flex-direction: column; }
.exchange-chart-card header div { display: flex; align-items: baseline; gap: 10px; }
.exchange-chart-actions { flex-wrap: wrap; justify-content: flex-end; }
.exchange-chart-intervals { display: inline-flex; align-items: center; gap: 2px !important; padding: 2px; border: 1px solid #29455c; border-radius: 9px; background: #081521; }
.exchange-chart-intervals button { min-width: 42px; padding: 5px 8px; color: #7890a5; border: 0; border-radius: 6px; background: transparent; font-size: 11px; font-weight: 900; white-space: nowrap; }
.exchange-chart-intervals button:hover { color: #d7f9ff; background: #173246; }
.exchange-chart-intervals button.active { color: #071923; background: #54ddd4; box-shadow: 0 0 12px #38d9cf33; }
.exchange-chart-latest { padding: 5px 8px; color: #7f98ad; border: 1px solid #2a465c; border-radius: 8px; background: #0b1927; font-size: 10px; font-weight: 900; white-space: nowrap; }
.exchange-chart-latest:hover, .exchange-chart-latest.active { color: #e7ffff; border-color: #42a9a3; background: #18464b; }
.exchange-chart-latest:disabled { opacity: .45; cursor: default; }
.exchange-chart-card header small, .exchange-order-book-card header small, .exchange-trades-card header small { color: #6f879e; }
#exchange-regime { max-width: min(210px, 42%); padding: 4px 9px; overflow: hidden; color: #7debd8; border-radius: 999px; background: #1c8d7730; font-size: 11px; font-weight: 800; text-overflow: ellipsis; white-space: nowrap; }
.exchange-chart-wrap { position: relative; min-height: 260px; height: auto; flex: 1; background: linear-gradient(#091421dd, #07111d), repeating-linear-gradient(90deg, transparent 0 79px, #24394e40 80px), repeating-linear-gradient(0deg, transparent 0 59px, #24394e40 60px); }
#exchange-chart { display: block; width: 100%; height: 100%; cursor: grab; touch-action: pan-y; user-select: none; }
#exchange-chart.dragging { cursor: grabbing; }
.exchange-chart-empty { position: absolute; inset: 0; display: grid; place-items: center; color: #6c8196; pointer-events: none; }
.exchange-chart-empty[hidden] { display: none; }

.exchange-market-lower { display: grid; min-height: 0; grid-template-columns: 1.05fr .95fr; gap: 14px; overflow: auto; }
.exchange-market-drawer-toggle { display: inline-flex; align-items: center; gap: 6px; padding: 7px 10px; color: #bceff0; border: 1px solid #2f777d; border-radius: 9px; background: #13343e; font-size: 11px; font-weight: 900; white-space: nowrap; }
.exchange-market-drawer-toggle:hover, .exchange-market-drawer-toggle[aria-expanded="true"] { color: #fff; border-color: #38d8cf; background: #17616a; box-shadow: 0 0 16px #32d7cc22; }
.exchange-market-drawer-backdrop { position: absolute; z-index: 20; inset: 0; padding: 0; border: 0; background: #020812a8; backdrop-filter: blur(2px); }
.exchange-market-drawer-backdrop[hidden] { display: none; }
.exchange-market-drawer { position: absolute; z-index: 21; top: 8px; right: 8px; bottom: 8px; display: flex; width: min(840px, calc(100% - 32px)); min-width: 0; padding: 12px; overflow: hidden; flex-direction: column; border: 1px solid #315d72; border-radius: 17px; background: #081421f7; box-shadow: -18px 0 60px #000a; opacity: 0; pointer-events: none; transform: translateX(calc(100% + 24px)); transition: transform .22s ease, opacity .18s ease; }
.market-drawer-open .exchange-market-drawer { opacity: 1; pointer-events: auto; transform: translateX(0); }
.exchange-market-drawer-head { display: flex; flex: 0 0 auto; align-items: center; justify-content: space-between; gap: 18px; padding: 2px 3px 11px; }
.exchange-market-drawer-head div { display: grid; gap: 2px; }
.exchange-market-drawer-head b { font-size: 17px; }
.exchange-market-drawer-head small { color: #718ba2; font-size: 11px; }
.exchange-market-drawer-close { display: grid; width: 34px; height: 34px; place-items: center; color: #b6c9d9; border: 1px solid #38536a; border-radius: 10px; background: #102236; font-size: 22px; }
.exchange-market-drawer .exchange-market-lower { flex: 1; }
.exchange-market-drawer .exchange-order-book-card, .exchange-market-drawer .exchange-trades-card { min-height: 0; }
.exchange-market-drawer .exchange-trades { max-height: none; height: calc(100% - 42px); }
.exchange-book-head, .exchange-book-row { display: grid; grid-template-columns: 54px 1fr 1fr 58px; align-items: center; min-height: 25px; padding: 0 12px; font-size: 11px; text-align: right; }
.exchange-book-head { min-height: 30px; color: #5f7890; border-bottom: 1px solid #172b3c; }
.exchange-book-head span:first-child, .exchange-book-row span:first-child { text-align: left; }
.exchange-book-row { position: relative; }
.exchange-book-row::before { position: absolute; z-index: 0; top: 2px; bottom: 2px; right: 0; width: var(--depth, 0%); content: ""; opacity: .13; }
.exchange-book-row > * { z-index: 1; }
.exchange-asks .exchange-book-row { color: #ff8192; }
.exchange-asks .exchange-book-row::before { background: #ff4e68; }
.exchange-bids .exchange-book-row { color: #62b5ff; }
.exchange-bids .exchange-book-row::before { background: #319bff; }
.exchange-book-row span:nth-child(n+3) { color: #a7b6c4; }
.exchange-book-mid { display: flex; justify-content: space-between; align-items: center; padding: 8px 14px; border-block: 1px solid #263f54; background: #0f2030; }
.exchange-book-mid small { color: #7590a8; }
.exchange-book-mid strong { font-size: 18px; }
.exchange-trade-head, .exchange-trade-row { display: grid; grid-template-columns: 1fr 1fr 1fr; min-height: 28px; align-items: center; padding: 0 13px; text-align: right; font-size: 11px; }
.exchange-trade-head { color: #5f7890; border-bottom: 1px solid #172b3c; }
.exchange-trade-head span:first-child, .exchange-trade-row span:first-child { text-align: left; color: #6b839a; }
.exchange-trades { max-height: 303px; overflow: auto; }
.exchange-trade-row:nth-child(even) { background: #0d1b2a; }
.exchange-empty-row { padding: 32px 12px; color: #60778d; text-align: center; font-size: 12px; }

.exchange-portfolio, .exchange-portfolio * { min-width: 0; box-sizing: border-box; }
.exchange-portfolio > header b { flex: 0 0 auto; white-space: nowrap; }
.exchange-portfolio > header i { padding: 3px 7px; color: #8094a7; border: 1px solid #344b5f; border-radius: 999px; background: #10202f; font-size: 9px; font-style: normal; font-weight: 1000; white-space: nowrap; }
.exchange-portfolio > header i.long { color: #ff8fa0; border-color: #a83a4e; background: #4f1d2938; }
.exchange-portfolio > header i.short { color: #76bcff; border-color: #347ab9; background: #153b603d; }
.exchange-portfolio-detached { position: fixed; z-index: 4; margin: 0; overflow: auto; border-color: #2c576d; background: #0a1725f5; box-shadow: 0 20px 60px #000b, 0 0 0 1px #5ce4db12; scrollbar-color: #31536c transparent; scrollbar-width: thin; }
.exchange-portfolio-detached > header { position: sticky; z-index: 2; top: 0; background: #0b1928f5; backdrop-filter: blur(8px); }
.exchange-portfolio-detached > header b { font-size: 18px; }
.exchange-portfolio > header span { max-width: 58%; color: #aebdcc; overflow-wrap: anywhere; text-align: right; font-size: 11px; font-weight: 900; line-height: 1.25; }
.exchange-portfolio-hero { padding: 14px; border-bottom: 1px solid #1d3448; background: radial-gradient(circle at 90% 0, #31ded41c, transparent 46%), linear-gradient(135deg, #102438, #0b1928); }
.exchange-total-assets { display: grid; grid-template-columns: minmax(0, 1fr) minmax(76px, 34%); align-items: center; gap: 2px 9px; }
.exchange-total-assets small { grid-column: 1; color: #84a1b8; font-size: 10px; font-weight: 800; }
.exchange-total-assets strong { grid-column: 1; overflow: hidden; font-size: clamp(18px, 1.8vw, 24px); letter-spacing: -.5px; text-overflow: ellipsis; white-space: nowrap; }
.exchange-total-assets span { grid-column: 2; grid-row: 1 / span 2; color: #587186; overflow-wrap: anywhere; text-align: right; font-size: 8px; line-height: 1.4; }
.exchange-return-summary { display: grid; grid-template-columns: 1fr auto; align-items: center; margin-top: 12px; padding: 10px 11px; border: 1px solid #254158; border-radius: 11px; background: #081522a8; }
.exchange-return-summary small { color: #7891a7; font-size: 10px; font-weight: 800; }
.exchange-return-summary strong { grid-row: 1 / span 2; grid-column: 2; max-width: 145px; overflow: hidden; font-size: clamp(18px, 1.75vw, 24px); text-align: right; text-overflow: ellipsis; white-space: nowrap; }
.exchange-return-summary span { max-width: 100%; margin-top: 2px; color: #a6b7c6; overflow-wrap: anywhere; font-size: 10px; font-weight: 800; line-height: 1.3; }
.exchange-return-summary .up, .exchange-portfolio .up { color: #ff657b; }
.exchange-return-summary .down, .exchange-portfolio .down { color: #58adff; }
.exchange-asset-mix { margin-top: 11px; }
.exchange-asset-mix > div { height: 7px; overflow: hidden; border-radius: 999px; background: #d6a52d; box-shadow: inset 0 1px 2px #0008; }
.exchange-asset-mix i { display: block; width: 0; height: 100%; margin-left: auto; background: linear-gradient(90deg, #2d95f2, #3be2d4); box-shadow: 0 0 10px #38d9d7; transition: width .35s ease; }
.exchange-asset-mix p { display: flex; justify-content: space-between; margin: 7px 0 0; color: #71899e; font-size: 9px; }
.exchange-asset-mix p span { display: flex; align-items: center; gap: 4px; }
.exchange-asset-mix p em { width: 6px; height: 6px; border-radius: 50%; background: #d6a52d; }
.exchange-asset-mix p span:last-child em { background: #3bcfcf; }
.exchange-asset-mix p b { max-width: 92px; overflow: hidden; color: #aebfce; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.exchange-portfolio-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; background: #1d3346; }
.exchange-portfolio-grid > div { padding: 11px 13px; background: #0c1927; }
.exchange-portfolio-grid small { display: block; color: #6c849b; font-size: 10px; }
.exchange-portfolio-grid strong { display: inline-block; max-width: 100%; margin-top: 3px; overflow: hidden; font-size: clamp(13px, 1.3vw, 17px); text-overflow: ellipsis; vertical-align: bottom; white-space: nowrap; }
.exchange-portfolio-grid span { margin-left: 3px; color: #71879b; font-size: 10px; }
.exchange-portfolio footer { display: flex; justify-content: space-between; padding: 9px 13px; color: #7d92a6; font-size: 11px; }
.exchange-portfolio footer b { margin-left: 6px; color: #dfeeff; }

.exchange-order-ticket { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: 8px; padding: 11px; }
.exchange-side-switch, .exchange-order-type { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; }
.exchange-order-type { grid-template-columns: 1fr 1fr 1.08fr; }
.exchange-side-switch, .exchange-order-type, .exchange-quick-quantity, .exchange-order-estimate, #exchange-submit-order, .exchange-order-ticket > p { grid-column: 1 / -1; }
.exchange-side-switch button { padding: 9px; color: #7990a6; border: 1px solid #294057; border-radius: 10px; background: #0d1b29; font-weight: 900; }
.exchange-side-switch .buy.active { color: #fff; border-color: #e34b62; background: linear-gradient(135deg, #c8324d, #7e2537); box-shadow: 0 0 18px #d2374d33; }
.exchange-side-switch .sell.active { color: #fff; border-color: #398fe4; background: linear-gradient(135deg, #267eca, #214c85); box-shadow: 0 0 18px #318fe033; }
.exchange-order-type { margin: 7px 0 0; }
.exchange-order-type button { padding: 7px; color: #70879d; border: 0; border-radius: 8px; background: #102033; font-size: 12px; }
.exchange-order-type button.active { color: #dffbff; background: #1a4859; }
.exchange-order-type .exchange-leverage-select { display: block; margin: 0; }
.exchange-leverage-select select { width: 100%; height: 100%; padding: 7px 5px; color: #ffe68a; border: 1px solid #705c28; border-radius: 8px; outline: 0; background: #2a230f; font-size: 12px; font-weight: 900; text-align: center; }
.exchange-leverage-select select:disabled { color: #786f52; border-color: #3b3a30; background: #1a1b1b; cursor: not-allowed; }
.exchange-order-ticket label { display: block; min-width: 0; margin-top: 7px; }
.exchange-order-ticket #exchange-price-row[hidden] + label { grid-column: 1 / -1; }
.exchange-order-ticket label > span { display: flex; min-width: 0; justify-content: space-between; gap: 8px; margin-bottom: 5px; color: #8298ac; font-size: 11px; }
.exchange-order-ticket label > span small { min-width: 0; overflow: hidden; color: #5fb9b2; font-size: 10px; font-weight: 800; text-overflow: ellipsis; white-space: nowrap; }
.exchange-order-ticket label > div { display: flex; align-items: center; border: 1px solid #2a4359; border-radius: 10px; background: #08131f; }
.exchange-order-ticket input { min-width: 0; flex: 1; padding: 9px; color: #eef9ff; border: 0; outline: 0; background: transparent; text-align: right; font-size: 15px; font-weight: 900; }
.exchange-order-ticket label em { padding-right: 11px; color: #607b91; font-size: 11px; font-style: normal; }
.exchange-quick-quantity { display: grid; grid-template-columns: repeat(4, 1fr); gap: 5px; margin-top: 6px; }
.exchange-quick-quantity button { padding: 5px 3px; color: #7990a6; border: 1px solid #253c52; border-radius: 7px; background: #0e1c2a; font-size: 10px; }
.exchange-order-estimate { margin: 7px 0; padding: 7px 9px; border: 1px solid #1d3347; border-radius: 10px; background: #091522; }
.exchange-order-estimate div { display: flex; justify-content: space-between; color: #7c92a6; font-size: 11px; }
.exchange-order-estimate div + div { margin-top: 6px; }
.exchange-order-estimate dd { margin: 0; color: #dcebf8; font-weight: 800; }
.exchange-risk-status { margin: 0 0 7px !important; padding: 7px 9px; color: #68d9c2 !important; border: 1px solid #246c61; border-radius: 9px; background: #12372f66; text-align: left !important; font-size: 10px !important; font-weight: 900; }
.exchange-risk-status.caution { color: #ffd36f !important; border-color: #806522; background: #4a390f66; }
.exchange-risk-status.close_only { color: #ff8998 !important; border-color: #913a4a; background: #511d2966; }
#exchange-submit-order { width: 100%; padding: 10px; color: white; border: 0; border-radius: 10px; font-weight: 1000; }
.exchange-submit-buy { background: linear-gradient(135deg, #e7475f, #a6243d); }
.exchange-submit-sell { background: linear-gradient(135deg, #3198ef, #2462ad); }
.exchange-order-ticket > p { margin: 5px 0 0; color: #586f84; text-align: center; font-size: 10px; }
.exchange-open-orders { max-height: 160px; overflow: auto; }
.exchange-open-order { display: grid; grid-template-columns: auto 1fr auto; gap: 8px; align-items: center; padding: 9px 11px; border-bottom: 1px solid #172c3d; font-size: 11px; }
.exchange-open-order > span { padding: 3px 6px; border-radius: 6px; font-weight: 900; }
.exchange-open-order > span.buy { color: #ff8192; background: #db42551c; }
.exchange-open-order > span.sell { color: #72baff; background: #378fdc1c; }
.exchange-open-order div { display: grid; gap: 2px; }
.exchange-open-order small { color: #668097; }
.exchange-open-order button { padding: 5px 8px; color: #a8b8c7; border: 1px solid #3a4d60; border-radius: 6px; background: #172536; }

.card-market-panel { position: relative; display: flex; min-height: 0; flex: 1; flex-direction: column; overflow: hidden; background: radial-gradient(circle at 15% 0, #443c8d20, transparent 31%), #071321; }
.card-market-toolbar { display: flex; flex: 0 0 auto; align-items: end; justify-content: space-between; gap: 24px; padding: 14px 24px; border-bottom: 1px solid #1e3047; background: #091725e8; }
.card-market-categories, .card-market-mine-head nav { display: flex; gap: 8px; }
.card-market-categories button, .card-market-mine-head button { position: relative; min-width: 92px; padding: 10px 17px; color: #8399af; border: 1px solid #2c4158; border-radius: 11px; background: #0d1c2b; font-size: 13px; font-weight: 900; }
.card-market-categories button.has-card-market-alert::after, .card-market-mine-head button.has-card-market-alert::after { position: absolute; top: 6px; right: 7px; width: 9px; height: 9px; border: 2px solid #0d1c2b; border-radius: 50%; background: #ff405f; box-shadow: 0 0 0 3px #ff405f20,0 0 12px #ff405f; content: ""; animation: card-market-alert-pulse 1.4s ease-in-out infinite; }
.card-market-categories button:hover, .card-market-mine-head button:hover { color: #dfe9ff; border-color: #6257a1; }
.card-market-categories button.active, .card-market-mine-head button.active { color: #f1edff; border-color: #8b78ff; background: linear-gradient(135deg, #5d4fbd, #3f3b87); box-shadow: 0 0 20px #7b68ff2e; }
.card-market-filters { display: flex; min-width: 0; align-items: end; justify-content: flex-end; gap: 8px; }
.card-market-filters[hidden] { display: none; }
.card-market-filters label { display: grid; gap: 4px; }
.card-market-filters label > span { padding-left: 3px; color: #667e95; font-size: 9px; font-weight: 900; }
.card-market-filters select, .card-market-filters input, .card-market-picker-filters select, .card-market-picker-filters input { height: 37px; color: #c9d6e5; border: 1px solid #294057; border-radius: 9px; outline: none; background: #0b1826; font-size: 11px; }
.card-market-filters select { max-width: 125px; padding: 0 26px 0 9px; }
.card-market-search input { width: clamp(175px, 17vw, 270px); padding: 0 12px; }
.card-market-filters select:focus, .card-market-filters input:focus, .card-market-picker-filters select:focus, .card-market-picker-filters input:focus { border-color: #8371ee; box-shadow: 0 0 0 3px #7c67e31c; }
.card-market-content { display: flex; min-height: 0; flex: 1; flex-direction: column; }
.card-market-view { display: flex; min-height: 0; flex: 1; flex-direction: column; padding: 20px 28px 22px; }
.card-market-view[hidden] { display: none; }
.card-market-section-head, .card-market-mine-head { display: flex; flex: 0 0 auto; align-items: end; justify-content: space-between; gap: 20px; margin-bottom: 13px; }
.card-market-section-head .eyebrow { margin: 0 0 2px; color: #9c8bff; }
.card-market-section-head h3 { margin: 0; font-size: 20px; }
.card-market-section-head > span, .card-market-mine-head > span { padding: 7px 11px; color: #9f91f7; border: 1px solid #443b75; border-radius: 999px; background: #27204a66; font-size: 11px; font-weight: 900; }
.card-market-rail { display: grid; min-height: 0; flex: 1; grid-auto-columns: calc((100% - 45px) / 4); grid-auto-flow: column; gap: 15px; align-items: stretch; padding: 4px 2px 12px; overflow-x: auto; overflow-y: hidden; cursor: grab; scrollbar-color: #7363d6 #111e2e; scrollbar-width: auto; scroll-snap-type: x proximity; }
.card-market-rail::-webkit-scrollbar { height: 13px; }
.card-market-rail::-webkit-scrollbar-track { border-radius: 999px; background: #101f30; }
.card-market-rail::-webkit-scrollbar-thumb { border: 3px solid #101f30; border-radius: 999px; background: #7666d6; }
.card-market-rail.dragging { cursor: grabbing; scroll-snap-type: none; user-select: none; }
.card-market-tile { --grade:#8d9baa; position: relative; display: flex; min-width: 0; flex-direction: column; overflow: hidden; border: 1px solid color-mix(in srgb, var(--grade) 62%, #172b3d); border-radius: 18px; background: linear-gradient(165deg, color-mix(in srgb, var(--grade) 14%, #0c1928) 0, #091523 42%); box-shadow: inset 0 1px #ffffff0b, 0 10px 25px #0004; scroll-snap-align: start; }
.card-market-tile.action-required { border-color: #ff4c6f; box-shadow: inset 0 0 0 1px #ff547260,0 0 0 2px #ff456d1f,0 0 26px #ff315b38,0 12px 32px #0007; }
.card-market-tile.completed { background: radial-gradient(circle at 50% 12%, #ff446b26, transparent 38%),linear-gradient(165deg,color-mix(in srgb,var(--grade) 16%,#211222),#091523 48%); }
.card-market-tile.grade-d, .card-market-card-slot.grade-d, .card-market-picker-card.grade-d { --grade:#8e9ca8; }
.card-market-tile.grade-c, .card-market-card-slot.grade-c, .card-market-picker-card.grade-c { --grade:#4ed49a; }
.card-market-tile.grade-b, .card-market-card-slot.grade-b, .card-market-picker-card.grade-b { --grade:#4da2ff; }
.card-market-tile.grade-a, .card-market-card-slot.grade-a, .card-market-picker-card.grade-a { --grade:#a875ff; }
.card-market-tile.grade-s, .card-market-card-slot.grade-s, .card-market-picker-card.grade-s { --grade:#ffc857; }
.card-market-tile.lost { filter: grayscale(1); opacity: .72; }
.card-market-tile.completed.lost { filter: grayscale(.65); opacity: 1; }
.card-market-tile-art { position: relative; min-height: 0; flex: 1 1 52%; overflow: hidden; border-bottom: 1px solid color-mix(in srgb, var(--grade) 45%, transparent); background: color-mix(in srgb, var(--grade) 10%, #07121e); }
.card-market-tile-art::after { position: absolute; inset: 0; content: ""; background: linear-gradient(180deg, transparent 50%, #07121ee8); pointer-events: none; }
.card-market-tile-art img { width: 100%; height: 100%; min-height: 210px; object-fit: cover; transition: transform .35s ease; }
.card-market-tile:hover .card-market-tile-art img { transform: scale(1.035); }
.card-market-card-badges { position: absolute; z-index: 1; top: 12px; right: 12px; left: 12px; display: flex; align-items: flex-start; justify-content: space-between; pointer-events: none; }
.card-market-card-badges > .game-card-grade-mark { top: 3px; left: 2px; color: var(--grade)!important; }
.card-market-card-badges > .game-card-grade-mark > strong { font-size: 62px; }
.card-market-card-badges > span:not(.game-card-grade-mark) { margin-left: auto; padding: 5px 9px; color: #edf5ff; border-radius: 999px; background: #081625dd; box-shadow: 0 3px 13px #0007; font-size: 10px; font-weight: 1000; }
.card-market-tile-body { display: flex; flex: 0 0 auto; flex-direction: column; padding: 14px 14px 15px; }
.card-market-tile-body h4 { margin: 0; overflow: hidden; color: #eef5ff; font-size: 17px; text-overflow: ellipsis; white-space: nowrap; }
.card-market-tile-body > p { margin: 4px 0 0; overflow: hidden; color: #748aa0; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.card-market-completed-banner { display: flex; align-items: center; gap: 7px; margin-top: 9px; padding: 8px 9px; color: #ffdbe2; border: 1px solid #ff547275; border-radius: 9px; background: linear-gradient(90deg,#6b1830aa,#3a1326aa); box-shadow: inset 0 1px #ffffff12,0 0 16px #ff315b20; font-size: 10px; }
.card-market-completed-banner span { color: #ff4568; text-shadow: 0 0 9px #ff4568; animation: card-market-alert-pulse 1.4s ease-in-out infinite; }
.card-market-completed-banner b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.card-market-time { min-width: 124px; align-self: flex-start; margin-top: 9px; padding: 4px 7px; color: var(--grade); border: 1px solid color-mix(in srgb, var(--grade) 40%, transparent); border-radius: 7px; background: color-mix(in srgb, var(--grade) 9%, transparent); font-size: 10px; font-variant-numeric: tabular-nums; text-align: center; }
.card-market-tile-body dl { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 5px; margin: 9px 0 0; }
.card-market-tile-body dl div { min-width: 0; padding: 8px 6px; border: 1px solid #1d3246; border-radius: 9px; background: #07131f; }
.card-market-tile-body dt { color: #647d94; font-size: 9px; }
.card-market-tile-body dd { margin: 3px 0 0; overflow: hidden; color: #e2edfa; font-size: 12px; font-weight: 900; text-overflow: ellipsis; white-space: nowrap; }
.card-market-tile-body dd small { color: #697f93; font-size: 8px; }
.card-market-tile-body dl div.empty dd { color: #52687d; text-align: center; }
.card-market-bid-state { padding: 7px 8px; border: 1px solid #286956; border-radius: 8px; background: #173f3566; font-weight: 900; }
.card-market-bid-state.outbid { color: #ffbfca !important; border-color: #853a4d; background: #501d2b66; }
.card-market-bid-state.highest { color: #72e6c2 !important; }
.card-market-bid-controls { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 5px; margin-top: 8px; }
.card-market-bid-controls input { min-width: 0; padding: 7px 6px; color: #eef5ff; border: 1px solid #2b4157; border-radius: 8px; outline: 0; background: #07131f; text-align: right; font-size: 11px; font-weight: 900; }
.card-market-bid-controls button { padding: 7px 8px; color: #efeaff; border: 1px solid #6c5bd0; border-radius: 8px; background: #41378a; font-size: 10px; font-weight: 900; }
.card-market-bid-controls button.buyout { color: #19200c; border-color: #d4a83f; background: #eabf52; }
.card-market-tile-overlay { position: absolute; z-index: 3; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 13px; padding: 20px; opacity: 0; background: #050b12de; backdrop-filter: blur(4px); transition: opacity .18s ease; pointer-events: none; }
.card-market-tile:hover .card-market-tile-overlay, .card-market-tile:focus-within .card-market-tile-overlay { opacity: 1; pointer-events: auto; }
.card-market-tile-overlay b { color: var(--grade); font-size: 19px; }
.card-market-tile-overlay button { padding: 10px 15px; color: #fff; border: 1px solid #8a76ff; border-radius: 10px; background: #5143ab; font-weight: 900; }
.card-market-tile-overlay button:disabled { color: #6f7a83; border-color: #3c4852; background: #252e35; cursor: not-allowed; }
.card-market-empty { display: grid; min-width: 250px; place-content: center; justify-items: center; color: #687f94; border: 1px dashed #33475c; border-radius: 18px; background: #0a172480; text-align: center; }
.card-market-empty span { font-size: 38px; filter: grayscale(.5); opacity: .7; }
.card-market-empty p { margin: 10px 0; font-size: 12px; }

.card-market-register-view { display: grid; grid-template-columns: minmax(280px, .78fr) minmax(440px, 1.22fr); gap: clamp(30px, 6vw, 95px); align-items: stretch; padding: 28px clamp(35px, 7vw, 120px); overflow: auto; }
.card-market-register-card { display: flex; min-height: 450px; }
.card-market-card-slot { --grade:#7565dc; display: flex; width: 100%; min-height: 100%; flex-direction: column; align-items: center; justify-content: center; gap: 10px; overflow: hidden; color: #aa9df5; border: 2px dashed #51468a; border-radius: 22px; background: radial-gradient(circle, #55488c2d, transparent 48%), #0a1625; }
.card-market-card-slot > span:first-child { display: grid; width: 74px; height: 74px; place-items: center; border: 1px solid #685bad; border-radius: 23px; background: #4b3f8429; font-size: 45px; font-weight: 200; }
.card-market-card-slot b { font-size: 17px; }
.card-market-card-slot small { color: #687d93; }
.card-market-card-slot.selected { position: relative; display: grid; min-height: 450px; grid-template-rows: minmax(0, 1fr) auto; justify-items: stretch; gap: 0; padding: 0; color: #eef5ff; border-style: solid; border-color: var(--grade); background: color-mix(in srgb, var(--grade) 11%, #0a1625); }
.card-market-card-slot.selected img { width: 100%; height: 100%; min-height: 0; object-fit: cover; }
.card-market-selected-visual { position: relative; display: block!important; width: 100%!important; height: 100%!important; min-height: 0; overflow: hidden; padding: 0!important; border: 0!important; border-radius: 0!important; background: transparent!important; }
.card-market-selected-visual > .game-card-grade-mark { top: 22px; left: 22px; color: var(--grade)!important; }
.card-market-selected-visual > .game-card-grade-mark > strong { font-size: 82px; }
.card-market-card-slot.selected > span:not(.card-market-selected-visual) { display: grid; width: auto; height: auto; gap: 4px; padding: 16px; border: 0; border-radius: 0; background: #091522; font-size: inherit; text-align: left; }
.card-market-card-slot.selected small { color: var(--grade); }
.card-market-register-form { display: flex; flex-direction: column; justify-content: center; gap: 15px; padding: clamp(15px, 3vw, 45px); border: 1px solid #283b53; border-radius: 22px; background: linear-gradient(145deg, #0e1d2e, #091522); }
.card-market-register-form .eyebrow { margin: 0; color: #9b89ff; }
.card-market-register-form h3 { margin: 3px 0; font-size: 25px; }
.card-market-register-form > div > p:last-child { margin: 0; color: #7b91a6; font-size: 11px; }
.card-market-register-form > label { display: grid; gap: 6px; }
.card-market-register-form > label > span, .card-market-register-form legend { color: #9cadbd; font-size: 12px; font-weight: 900; }
.card-market-register-form > label > div { display: flex; align-items: center; border: 1px solid #30465d; border-radius: 11px; background: #07131f; }
.card-market-register-form input[type="number"] { min-width: 0; flex: 1; padding: 11px 12px; color: #f0f5ff; border: 0; outline: 0; background: transparent; text-align: right; font-size: 16px; font-weight: 900; }
.card-market-register-form em { padding-right: 13px; color: #71889d; font-size: 11px; font-style: normal; }
.card-market-register-form > label small { color: #7769d2; font-size: 10px; }
.card-market-register-form fieldset { margin: 0; padding: 0; border: 0; }
.card-market-durations { display: grid; grid-template-columns: repeat(4, 1fr); gap: 7px; margin-top: 7px; }
.card-market-durations input { position: absolute; opacity: 0; pointer-events: none; }
.card-market-durations span { display: block; padding: 10px 5px; color: #788fa4; border: 1px solid #2b4158; border-radius: 9px; background: #0b1927; text-align: center; font-size: 11px; font-weight: 900; }
.card-market-durations input:checked + span { color: #f0ecff; border-color: #806deb; background: #4b4098; box-shadow: 0 0 15px #7562e433; }
.card-market-primary { padding: 12px; color: #fff; border: 1px solid #8d7aff; border-radius: 11px; background: linear-gradient(135deg, #7663e6, #4b3d9f); font-size: 13px; font-weight: 1000; }
.card-market-mine-head { align-items: center; }

@keyframes card-market-alert-pulse { 0%,100% { opacity:.55; transform:scale(.88); } 50% { opacity:1; transform:scale(1.12); } }

.card-market-picker[hidden] { display: none; }
.card-market-picker { position: absolute; z-index: 20; inset: 0; display: grid; place-items: center; padding: 18px 28px; }
.card-market-picker-backdrop { position: absolute; inset: 0; border: 0; background: #020711df; backdrop-filter: blur(6px); }
.card-market-picker > section { position: relative; display: flex; width: min(980px, 94%); height: 100%; max-height: 100%; flex-direction: column; overflow: hidden; border: 1px solid #5e5098; border-radius: 20px; background: #0b1827; box-shadow: 0 25px 80px #000b; }
.card-market-picker > section > header { display: flex; align-items: start; justify-content: space-between; padding: 18px 20px; border-bottom: 1px solid #253a51; }
.card-market-picker .eyebrow { margin: 0; color: #9e8cff; }
.card-market-picker h3 { margin: 3px 0 0; }
#card-market-picker-close { display: grid; width: 35px; height: 35px; place-items: center; color: #a4b6c7; border: 1px solid #394e63; border-radius: 10px; background: #132235; font-size: 22px; }
.card-market-picker-filters { display: grid; grid-template-columns: repeat(3, 1fr) 2fr; gap: 8px; padding: 13px 20px; border-bottom: 1px solid #1b3043; }
.card-market-picker-filters select, .card-market-picker-filters input { width: 100%; padding: 0 10px; }
.card-market-picker-list { display: grid; min-height: 220px; flex: 1 1 220px; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-auto-rows: 104px; align-content: start; gap: 10px; padding: 16px 20px 22px; overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; }
.card-market-picker-card { --grade:#8e9ca8; display: grid; min-width: 0; min-height: 104px; height: 104px; grid-template-columns: 76px minmax(0, 1fr); gap: 10px; align-items: stretch; overflow: hidden; color: #e8f1fb; border: 1px solid color-mix(in srgb, var(--grade) 55%, #263a4e); border-radius: 12px; background: color-mix(in srgb, var(--grade) 9%, #0b1928); text-align: left; }
.card-market-picker-card img { width: 76px; height: 100%; object-fit: cover; }
.card-market-picker-visual { position: relative; display: block; width: 76px; height: 102px; overflow: hidden; padding: 0; }
.card-market-picker-visual > .game-card-grade-mark { top: 8px; left: 8px; color: var(--grade)!important; }
.card-market-picker-visual > .game-card-grade-mark > strong { font-size: 36px; }
.card-market-picker-card > .card-market-picker-copy { display: grid; min-width: 0; gap: 5px; padding-right: 8px; }
.card-market-picker-card b, .card-market-picker-card small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.card-market-picker-card small { color: var(--grade); font-size: 9px; }

@media (min-width: 1600px) {
  .exchange-dialog { width: min(1380px, calc(100vw - 290px)); }
}

@media (max-width: 1050px) {
  .exchange-dialog { width: 98vw; height: 96vh; max-height: 96vh; }
  .exchange-dialog .exchange-dialog-head-compact { grid-template-columns: minmax(210px, 1fr) minmax(145px, 210px) auto auto 42px; gap: 10px; }
  .exchange-header-balance { gap: 6px; padding-inline: 9px; }
  .exchange-header-balance > span small { display: none; }
  .exchange-tabs button { min-width: 160px; padding-inline: 13px; }
  .exchange-rules-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .exchange-market-header { grid-template-columns: 1fr auto; }
  .exchange-market-stats { grid-column: 1 / -1; }
  .exchange-workspace { grid-template-columns: minmax(0, 1.35fr) minmax(300px, .65fr); }
  .card-market-toolbar { align-items: stretch; flex-direction: column; gap: 10px; }
  .card-market-filters { justify-content: stretch; }
  .card-market-filters label { min-width: 0; flex: 1; }
  .card-market-filters select, .card-market-search input { width: 100%; max-width: none; }
  .card-market-rail { grid-auto-columns: calc((100% - 30px) / 3); }
  .card-market-register-view { grid-template-columns: minmax(250px, .8fr) minmax(390px, 1.2fr); gap: 25px; padding-inline: 30px; }
  .card-market-picker-list { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 680px) {
  .exchange-dialog .exchange-dialog-head { padding: 16px; }
  .exchange-dialog .exchange-dialog-head-compact { grid-template-columns: minmax(0, 1fr) auto auto 42px; }
  .exchange-header-balance { grid-column: 2; grid-row: 1; min-width: 118px; }
  .exchange-header-balance > span { display: none; }
  .exchange-header-balance > strong { font-size: 14px; }
  .exchange-dialog .exchange-dialog-head-compact .exchange-tabs { grid-column: 1 / -1; grid-row: 2; }
  .exchange-dialog .exchange-dialog-head p:last-child { display: none; }
  .exchange-tabs { padding-top: 8px; }
  .exchange-tabs button { min-width: 0; flex: 1; padding: 10px; }
  .exchange-tabs button small { display: none; }
  .exchange-rules-toggle { padding-inline: 10px; }
  .exchange-rules-toggle span { display: none; }
  .exchange-rules-panel { max-height: 62vh; padding: 15px 14px 17px; }
  .exchange-rules-grid, .exchange-rules-panel[data-market="cards"] .exchange-rules-grid { grid-template-columns: 1fr; }
  .exchange-market-header { grid-template-columns: 1fr; padding: 14px; }
  .exchange-market-price { text-align: left; }
  .exchange-market-stats { grid-template-columns: 1fr 1fr; }
  .exchange-coin-panel { overflow: auto; }
  .exchange-workspace { min-height: 850px; flex: none; grid-template-columns: 1fr; padding: 8px; overflow: visible; }
  .exchange-main-column, .exchange-side-column { height: auto; overflow: visible; }
  .exchange-chart-card { height: auto; flex: 0 0 auto; }
  .exchange-chart-wrap { height: 260px; min-height: 260px; max-height: 260px; flex: 0 0 260px; contain: layout size paint; }
  #exchange-chart { height: 260px; max-height: 260px; }
  .exchange-chart-card > header { align-items: flex-start; gap: 6px; padding-block: 7px; flex-wrap: wrap; }
  .exchange-chart-actions { width: 100%; justify-content: flex-start; }
  #exchange-regime { margin-left: auto; }
  .exchange-side-column { display: flex; }
  .exchange-market-drawer { position: fixed; top: 4vh; right: 2vw; bottom: 4vh; width: 96vw; }
  .exchange-market-drawer .exchange-market-lower { grid-template-columns: 1fr; }
  .card-market-panel { min-height: 0; overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; }
  .card-market-toolbar { padding: 12px; }
  .card-market-categories button { min-width: 0; flex: 1; padding-inline: 8px; }
  .card-market-filters { display: grid; grid-template-columns: 1fr 1fr; }
  .card-market-filters label { min-width: 0; }
  .card-market-filters select, .card-market-filters input { width: 100%; min-width: 0; max-width: none; }
  .card-market-search { grid-column: 1 / -1; }
  .card-market-content { min-height: auto; flex: none; }
  .card-market-view { min-height: auto; flex: none; padding: 16px 14px 18px; overflow: visible; }
  .card-market-section-head, .card-market-mine-head { align-items: center; }
  .card-market-rail {
    min-height: 0;
    height: auto;
    flex: none;
    grid-auto-columns: 100%;
    align-items: start;
    padding: 4px 0 14px;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-padding-inline: 0;
    scroll-snap-type: x mandatory;
    overscroll-behavior-inline: contain;
    touch-action: pan-x pan-y;
  }
  .card-market-tile { width: 100%; min-height: 0; height: auto; align-self: start; }
  .card-market-tile-art { min-height: 0; flex: none; aspect-ratio: 1.08 / 1; }
  .card-market-tile-art img { height: 100%; min-height: 0; aspect-ratio: 1.08 / 1; }
  .card-market-tile-body { padding: 14px 12px 15px; }
  .card-market-empty { width: 100%; min-width: 0; min-height: 390px; }
  .card-market-register-view { display: flex; min-height: auto; flex-direction: column; padding: 18px; }
  .card-market-register-card { min-height: 390px; }
  .card-market-card-slot.selected { min-height: 390px; }
  .card-market-register-form { padding: 20px 15px; }
  .card-market-picker { position: fixed; padding: 10px; }
  .card-market-picker > section { width: 98%; height: 100%; max-height: 100%; }
  .card-market-picker-filters { grid-template-columns: 1fr 1fr; padding-inline: 12px; }
  .card-market-picker-list { grid-template-columns: 1fr; padding-inline: 12px; }
}

@media (max-width: 420px) {
  .card-market-tile-body dl { grid-template-columns: 1fr 1fr; }
  .card-market-tile-body dl > div:last-child { grid-column: 1 / -1; }
  .card-market-bid-controls { grid-template-columns: 1fr 1fr; }
  .card-market-bid-controls input { grid-column: 1 / -1; }
  .card-market-bid-controls button { min-height: 38px; }
  .card-market-time { min-width: 0; }
}