.express-view { --express-accent: var(--green); display: grid; gap: 14px; }
.brand-wordmark-image { border-radius: 50%; filter: drop-shadow(0 2px 5px color-mix(in srgb, var(--green) 15%, transparent)); }
.express-heading, .express-chart-head, .express-positions-head { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.express-heading h1 { margin: 4px 0 0; font-size: clamp(22px, 3vw, 30px); }
.express-heading .eyebrow { display: block; }
.express-account { display: grid; justify-items: end; gap: 4px; padding: 8px 14px; border: 1px solid var(--line); border-radius: var(--radius-card); background: var(--surface); }
.express-account span, .express-order-title .eyebrow, .express-field > span { color: var(--muted); font-size: var(--font-size-overline); letter-spacing: var(--letter-spacing-label); }
.express-account strong { color: var(--text); font-size: var(--font-size-title); }
.express-layout { display: grid; grid-template-columns: minmax(0, 1fr) 280px; gap: 12px; align-items: stretch; }
.express-chart-panel, .express-order-panel, .express-positions { min-width: 0; padding: 14px; border: 1px solid var(--line); border-radius: var(--radius-panel); background: var(--surface); box-shadow: var(--shadow-panel); }
.express-chart-head { flex-wrap: wrap; min-height: 42px; }
.express-pair-label { display: flex; align-items: center; gap: 9px; padding: 4px 8px 4px 4px; border: 1px solid var(--line); border-radius: var(--radius-control); background: var(--surface-raised); }
.express-pair-label .coin-icon { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 50%; font-size: 16px; }
.express-pair-label select, .express-field select { border: 0; background: transparent; color: var(--text); font: var(--font-weight-semibold) var(--font-size-small-plus) var(--font-ui); }
.express-price { display: grid; gap: 2px; }
.express-price strong { font: var(--font-weight-semibold) clamp(16px, 2vw, 22px) var(--font-data); color: var(--text); }
.express-price span { font-size: var(--font-size-caption); }
.express-intervals, .express-zoom { display: flex; align-items: center; gap: 3px; padding: 3px; border: 1px solid var(--line); border-radius: var(--radius-control); background: var(--surface-raised); }
.express-chart-tools { display: flex; align-items: center; gap: 4px; }
.express-chart-tools button { min-height: 34px; padding: 0 9px; border: 1px solid var(--line); border-radius: var(--radius-control); background: var(--surface-raised); color: var(--text-secondary); cursor: pointer; font: var(--font-weight-semibold) var(--font-size-caption) var(--font-ui); white-space: nowrap; }
.express-chart-tools button:hover, .express-chart-tools button.active { border-color: color-mix(in srgb, var(--green) 48%, var(--line)); color: var(--green); }
.express-intervals button, .express-zoom button { min-width: 34px; height: 29px; padding: 0 7px; border: 0; border-radius: 6px; background: transparent; color: var(--muted); cursor: pointer; font: var(--font-weight-semibold) var(--font-size-caption) var(--font-ui); }
.express-intervals button.active, .express-zoom button:hover { background: var(--surface-soft); color: var(--text); }
.express-zoom button:nth-child(2) { min-width: 48px; font-family: var(--font-data); }
.express-chart-wrap { height: clamp(340px, 40vw, 520px); position: relative; overflow: hidden; margin-top: 10px; border: 1px solid var(--line-soft); border-radius: var(--radius-card); background: color-mix(in srgb, var(--bg) 62%, var(--surface)); }
.express-chart-wrap svg { width: 100%; height: 100%; display: block; touch-action: none; cursor: crosshair; user-select: none; }
.express-grid path { stroke: var(--line-soft); stroke-width: 1; vector-effect: non-scaling-stroke; }
.express-grid-off .express-grid path { visibility: hidden; }
.express-grid text { fill: var(--muted); font: 13px var(--font-data); }
.express-candles line { stroke-width: 1.25; vector-effect: non-scaling-stroke; }
.express-candles rect { stroke-width: .5; vector-effect: non-scaling-stroke; }
.express-candles .up line, .express-candles .up rect { stroke: var(--green); fill: var(--green); }
.express-candles .down line, .express-candles .down rect { stroke: var(--red); fill: var(--red); }
.express-line { fill: none; stroke: var(--express-accent); stroke-width: 2; vector-effect: non-scaling-stroke; }
.express-area { fill: url(#expressFill); }
.express-current-line { stroke: var(--green); stroke-width: 1; stroke-dasharray: 4 4; opacity: .75; vector-effect: non-scaling-stroke; }
.express-price-tag { fill: var(--green); }
.express-price-text { fill: var(--text-on-accent); font: 700 11px var(--font-data); }
.express-deal-level { stroke-width: 1.1; stroke-dasharray: 6 5; opacity: .8; vector-effect: non-scaling-stroke; }
.express-deal-level.up, .express-deal-label.up { stroke: var(--green); fill: var(--green); }
.express-deal-level.down, .express-deal-label.down { stroke: var(--red); fill: var(--red); }
.express-deal-label { font: 700 15px var(--font-data); paint-order: stroke; stroke: var(--surface); stroke-width: 3px; }
.express-crosshair-x, .express-crosshair-y { stroke: var(--text-secondary); stroke-width: 1; stroke-dasharray: 3 4; opacity: .65; vector-effect: non-scaling-stroke; pointer-events: none; }
.express-cursor-dot { fill: var(--green); stroke: var(--surface); stroke-width: 2; pointer-events: none; }
.express-crosshair-label { position: absolute; z-index: 2; padding: 5px 7px; border: 1px solid var(--line); border-radius: 6px; background: var(--surface); color: var(--text); font: var(--font-weight-medium) var(--font-size-caption) var(--font-data); pointer-events: none; white-space: nowrap; }
.express-chart-empty { position: absolute; inset: 0; display: grid; place-items: center; background: color-mix(in srgb, var(--surface) 84%, transparent); color: var(--muted); font-size: var(--font-size-small); }
.express-chart-empty[hidden] { display: none; }
.express-chart-footer { display: flex; justify-content: space-between; gap: 10px; margin-top: 8px; color: var(--muted); font-size: var(--font-size-caption); }
.express-order-panel { display: flex; flex-direction: column; gap: 15px; }
.express-order-title { display: grid; gap: 5px; }
.express-order-title strong { color: var(--text); font-size: var(--font-size-title); }
.express-direction { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; }
.express-direction button { min-height: 58px; display: flex; align-items: center; justify-content: center; gap: 9px; border: 1px solid var(--line); border-radius: var(--radius-card); background: var(--surface-raised); color: var(--muted); cursor: pointer; }
.express-direction button span { font-size: 23px; }
.express-direction button b { font-size: var(--font-size-caption); letter-spacing: .08em; }
.express-direction button[data-express-side="up"].active { border-color: color-mix(in srgb, var(--green) 60%, var(--line)); background: color-mix(in srgb, var(--green) 12%, var(--surface)); color: var(--green); }
.express-direction button[data-express-side="down"].active { border-color: color-mix(in srgb, var(--red) 60%, var(--line)); background: color-mix(in srgb, var(--red) 12%, var(--surface)); color: var(--red); }
.express-field { display: grid; gap: 7px; }
.express-field select, .express-stake { width: 100%; min-height: 42px; padding: 0 11px; border: 1px solid var(--line); border-radius: var(--radius-control); background: var(--surface-raised); color: var(--text); }
.express-field select { cursor: pointer; }
.express-stake { display: flex; align-items: center; justify-content: space-between; }
.express-stake input { width: 100%; min-width: 0; border: 0; outline: 0; background: transparent; color: var(--text); font: var(--font-weight-semibold) var(--font-size-body) var(--font-data); }
.express-stake span { color: var(--muted); font-size: var(--font-size-caption); }
.express-presets { display: grid; grid-template-columns: repeat(4, 1fr); gap: 5px; margin-top: -10px; }
.express-presets button { min-height: 29px; border: 1px solid var(--line); border-radius: 6px; background: var(--surface); color: var(--text-secondary); cursor: pointer; font: var(--font-weight-medium) var(--font-size-caption) var(--font-data); }
.express-presets button:hover { border-color: var(--green); color: var(--green); }
.express-entry-reference { display: grid; gap: 5px; padding: 10px 11px; border: 1px solid var(--line-soft); border-radius: var(--radius-control); background: var(--surface-raised); }
.express-entry-reference span, .express-entry-reference small { color: var(--muted); font-size: var(--font-size-tiny); }
.express-entry-reference strong { color: var(--text); font-size: var(--font-size-body); }
.express-payout { display: grid; gap: 4px; margin-top: auto; padding: 11px 0 2px; border-top: 1px solid var(--line-soft); }
.express-payout span { color: var(--muted); font-size: var(--font-size-caption); }
.express-payout i { color: var(--dim); font-style: normal; }
.express-payout > div { display: grid; gap: 3px; }
.express-payout-rate { color: var(--dim); font-size: var(--font-size-tiny); font-style: normal; }
.express-payout strong { color: var(--green); font: var(--font-weight-semibold) var(--font-size-title) var(--font-data); }
.express-submit { min-height: 46px; border: 0; border-radius: var(--radius-control); background: var(--green); color: var(--text-on-accent); cursor: pointer; font-weight: var(--font-weight-bold); transition: filter var(--motion-fast) ease, transform var(--motion-fast) ease; }
.express-submit:hover:not(:disabled) { filter: brightness(1.08); transform: translateY(-1px); }
.express-submit:disabled { cursor: not-allowed; opacity: .48; }
.express-disclaimer { margin: -7px 0 0; color: var(--muted); font-size: var(--font-size-tiny); line-height: 1.5; }
.express-positions { padding: 13px 15px; }
.express-positions-head { margin-bottom: 9px; }
.express-positions-head h2 { margin: 3px 0 0; font-size: var(--font-size-subtitle); }
.express-positions-head > span { color: var(--muted); font-size: var(--font-size-caption); }
.express-deals { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; }
.express-deal { min-width: 0; display: grid; grid-template-columns: 32px minmax(0, 1fr) auto; align-items: center; gap: 9px; padding: 9px; border: 1px solid var(--line-soft); border-radius: var(--radius-control); background: var(--surface-raised); }
.express-deal-side { width: 29px; height: 29px; display: grid; place-items: center; border-radius: 8px; font-size: 18px; }
.express-deal-side.up { background: color-mix(in srgb, var(--green) 12%, var(--surface)); color: var(--green); }
.express-deal-side.down { background: color-mix(in srgb, var(--red) 12%, var(--surface)); color: var(--red); }
.express-deal-main, .express-deal-result { display: grid; min-width: 0; gap: 3px; }
.express-deal-main strong, .express-deal-result strong { overflow: hidden; color: var(--text); font-size: var(--font-size-caption); text-overflow: ellipsis; white-space: nowrap; }
.express-deal-main small, .express-deal-result small { overflow: hidden; color: var(--muted); font-size: var(--font-size-tiny); text-overflow: ellipsis; white-space: nowrap; }
.express-deal-result { justify-items: end; }
.express-deal.win .express-deal-result small { color: var(--green); }
.express-deal.loss .express-deal-result small { color: var(--red); }
.express-empty { grid-column: 1 / -1; padding: 15px; color: var(--muted); text-align: center; font-size: var(--font-size-caption); }
html[data-theme="light"] .express-price-tag { fill: var(--green); }
html[data-theme="light"] .express-stake input { color: var(--text); }
@media (max-width: 1100px) {
  .brand { min-width: 0; }
  .brand-copy small { display: none; }
  .main-nav { gap: 0; }
  .nav-button { padding: 0 8px; font-size: 11px; }
  .top-actions { min-width: 0; gap: 6px; }
  .express-layout { grid-template-columns: minmax(0, 1fr) 258px; }
  .express-chart-head { justify-content: flex-start; }
  .express-price { margin-right: auto; }
  .express-chart-wrap { height: clamp(340px, 46vw, 500px); }
}
@media (min-width: 761px) and (max-width: 1190px) {
  .ticker-tape { margin-inline: -20px; }
}
@media (min-width: 1191px) {
  .ticker-tape { margin-inline: calc(-1 * clamp(14px, 2.4vw, 38px)); }
}
@media (max-width: 900px) {
  .main-nav { display: none; }
  .mobile-nav { position: fixed; z-index: 18; right: 0; bottom: 0; left: 0; display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); padding: 8px 8px calc(8px + env(safe-area-inset-bottom)); border-top: 1px solid var(--line); background: color-mix(in srgb, var(--bg) 94%, transparent); backdrop-filter: blur(18px); }
  .mobile-nav button { display: grid; justify-items: center; gap: 3px; border: 0; background: transparent; color: var(--muted); cursor: pointer; font-size: 8px; }
  .mobile-nav-icon svg { width: 17px; height: 17px; }
  .mobile-nav button span[data-i18n] { font-size: 8px; line-height: 1.1; }
  .mobile-nav button.active { color: var(--green); }
  .app-frame { padding-bottom: 70px; }
}
@media (max-width: 760px) {
  .mobile-nav { grid-template-columns: repeat(7, minmax(0, 1fr)) !important; padding-inline: 4px; }
  .mobile-nav button { gap: 2px; font-size: 7px; }
  .mobile-nav-icon svg { width: 15px; height: 15px; }
  .express-view { gap: 9px; padding-bottom: 68px; }
  .express-heading .eyebrow { font-size: 8px; letter-spacing: .06em; white-space: nowrap; }
  .express-layout { grid-template-columns: minmax(0, 1fr); gap: 9px; }
  .express-chart-panel, .express-order-panel { padding: 10px; }
  .express-chart-head { gap: 6px; }
  .express-pair-label { order: 1; }
  .express-price { order: 2; margin-left: auto; margin-right: 0; }
  .express-intervals { order: 3; }
  .express-chart-tools { order: 4; }
  .express-zoom { order: 5; margin-left: auto; }
  .express-chart-wrap { height: min(56vh, 420px); min-height: 290px; margin-top: 8px; }
  .express-grid text { font-size: 21px; }
  .express-chart-footer { flex-wrap: wrap; gap: 4px 8px; font-size: 8px; }
  .express-chart-footer span:last-child { display: block; margin-left: auto; text-align: right; }
  .express-order-panel { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
  .express-order-title, .express-direction, .express-payout, .express-submit, .express-disclaimer { grid-column: 1 / -1; }
  .express-direction button { min-height: 45px; }
  .express-field { align-content: start; }
  .express-presets { grid-column: 1 / -1; margin-top: -5px; }
  .express-entry-reference { grid-column: 1 / -1; grid-template-columns: 1fr auto; align-items: center; gap: 3px 8px; padding: 8px 10px; }
  .express-entry-reference span { grid-column: 1; }
  .express-entry-reference strong { grid-column: 2; grid-row: 1 / span 2; }
  .express-entry-reference small { grid-column: 1; }
  .express-deal-label { font-size: 20px; }
  .express-payout { grid-template-columns: 1fr auto; align-items: center; padding-top: 8px; }
  .express-payout strong { font-size: var(--font-size-subtitle); }
  .express-disclaimer { margin: -6px 0 0; }
  .express-deals { grid-template-columns: minmax(0, 1fr); }
}
