/* Translucent bars keep their existing layout and input behaviour. */
:root {
  --glass-bar: rgba(255, 255, 245, 0.025);
  --glass-edge: rgba(255, 255, 255, 0.075);
}
.chartToolbar,
.chartFooter,
body dialog .dialogHead,
body dialog .tabs,
body dialog .historyBottom,
body dialog .pairColumns {
  background: var(--glass-bar) !important;
  -webkit-backdrop-filter: blur(15px) saturate(115%);
  backdrop-filter: blur(15px) saturate(115%);
  border-color: var(--glass-edge) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.025);
}
.chartToolbar button:not(.selected),
.chartToolbar .chartTools button:not(.selected) {
  background: rgba(255, 255, 255, 0.015);
}
.chartToolbar button:hover {
  background: rgba(255, 255, 255, 0.06);
}
.chartToolbar button.selected {
  background: rgba(255, 255, 255, 0.085);
}
.accountMini,
.settingsFab,
#helpToast,
#toast {
  background: rgba(20, 20, 18, 0.32) !important;
  -webkit-backdrop-filter: blur(18px) saturate(115%);
  backdrop-filter: blur(18px) saturate(115%);
  border-color: var(--glass-edge) !important;
  box-shadow:
    0 3px 15px rgba(0, 0, 0, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.035);
}
.helperDataHead,
.positionsSection > .sectionTitle {
  background: transparent;
}
body dialog .tabs {
  border-radius: 6px;
}
body dialog .pairColumns {
  border-bottom: 1px solid var(--glass-edge);
}
.layoutWidget,
body dialog,
.cliFlow,
:is(#timeframes,[data-chart-node="timeframes"]) {
  scrollbar-width: thin;
  scrollbar-color: rgba(170, 170, 160, 0.24) transparent;
}
.layoutWidget::-webkit-scrollbar,
body dialog::-webkit-scrollbar,
.cliFlow::-webkit-scrollbar,
:is(#timeframes,[data-chart-node="timeframes"])::-webkit-scrollbar {
  width: 4px;
  height: 4px;
  background: transparent;
}
.layoutWidget::-webkit-scrollbar-track,
body dialog::-webkit-scrollbar-track,
.cliFlow::-webkit-scrollbar-track,
:is(#timeframes,[data-chart-node="timeframes"])::-webkit-scrollbar-track {
  background: transparent;
}
.layoutWidget::-webkit-scrollbar-thumb,
body dialog::-webkit-scrollbar-thumb,
.cliFlow::-webkit-scrollbar-thumb,
:is(#timeframes,[data-chart-node="timeframes"])::-webkit-scrollbar-thumb {
  background: rgba(170, 170, 160, 0.24);
  border-radius: 8px;
}
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  :root {
    --glass-bar: rgba(22, 22, 20, 0.88);
  }
}
/* Floating menus expose the chart underneath instead of a solid second layer. */
body dialog,
#helperDiagramDialog,
.emaSettings,
.fibonacciNotice {
  background: rgba(17, 17, 16, 0.48) !important;
  -webkit-backdrop-filter: blur(22px) saturate(110%);
  backdrop-filter: blur(22px) saturate(110%);
}
body dialog::backdrop,
#helperDiagramDialog::backdrop {
  background: rgba(0, 0, 0, 0.22);
  backdrop-filter: blur(2px);
}
.chartPanel {
  background: transparent !important;
}
.orderPanel,
.flowPanel {
  background: rgba(255, 255, 245, 0.018) !important;
  -webkit-backdrop-filter: blur(15px);
  backdrop-filter: blur(15px);
}
.widgetScrollBody {
  background: transparent;
  scrollbar-width: thin;
  scrollbar-color: rgba(170, 170, 160, 0.2) transparent;
}
.widgetScrollBody::-webkit-scrollbar {
  width: 4px;
  height: 4px;
  background: transparent;
}
.widgetScrollBody::-webkit-scrollbar-track {
  background: transparent;
}
.widgetScrollBody::-webkit-scrollbar-thumb {
  background: rgba(170, 170, 160, 0.2);
  border-radius: 8px;
}
/* The two panels stretch to their shared row, growing with extra order fields. */
.workspace > .orderPanel,
.workspace > .flowPanel {
  height: auto !important;
  min-height: 164px !important;
  max-height: none !important;
  align-self: stretch;
  overflow: visible;
}
.workspace > .orderPanel > .widgetScrollBody,
.workspace > .flowPanel > .widgetScrollBody {
  height: auto;
  max-height: none;
  overflow: visible;
}
.orderPanel .orderEquation {
  display: flex;
  align-items: center;
  gap: 7px;
  min-height: 25px;
  padding: 3px 7px;
  margin: 3px 0;
  background: rgba(255, 255, 255, 0.015);
  border-color: #ffffff0b;
}
.orderPanel .orderEquation > div {
  display: flex;
  align-items: baseline;
  gap: 7px;
  margin-left: auto;
}
.orderPanel .orderEquation small {
  font-size: 7px;
  line-height: 1.2;
}
.orderPanel .orderEquation output {
  font-size: 12px;
  line-height: 1.3;
}
.orderPanel .orderEquation #sizeFormula {
  font-size: 9px;
  line-height: 1.3;
}
.orderPanel .orderEquation .equationEquals {
  margin: 0;
}
.orderPanel #orderForm label {
  margin-bottom: 4px;
}
.orderPanel #orderForm input,
.orderPanel #orderForm select {
  height: 26px;
  padding: 4px 7px;
}
.orderPanel .tradeButtons button {
  min-height: 25px;
  padding: 5px;
}
.orderPanel #orderHint {
  margin: 3px 0 0;
  font-size: 8px;
}
.orderPanel .entryPreview {
  font-size: 8px;
}
@media (max-width: 480px) {
  .orderPanel .orderEquation > div {
    gap: 4px;
  }
  .orderPanel .orderEquation small {
    font-size: 6px;
  }
}
#helperDiagramDialog [data-prompt].cliComposer {
  position: static;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent !important;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 5px;
}
#helperDiagramDialog [data-prompt].cliComposer[hidden] {
  display: none;
}
#helperDiagramDialog .cliComposer textarea {
  width: 100%;
  min-height: 62px;
  margin: 0;
  padding: 10px 11px;
  background: rgba(255, 255, 255, 0.018);
  border: 1px solid #ffffff16;
  border-radius: 8px;
  resize: vertical;
  color: #ccc9be;
  font-size: 11px;
  line-height: 1.5;
  box-shadow: none;
}
#helperDiagramDialog .cliComposer textarea:focus {
  background: rgba(255, 255, 255, 0.025);
  border-color: #ba9a5555;
  outline: none;
  box-shadow: 0 0 0 2px #ba9a5507;
}
#helperDiagramDialog .cliComposer [data-submit] {
  padding: 4px 8px;
  background: #dfbd7506;
  border-color: #dfbd7525;
  font-size: 9px;
  border-radius: 5px;
}
/* Shared surfaces for dialogs and every nested settings/history view. */
:root {
  --glass-surface: rgba(17, 17, 16, 0.52);
  --glass-inset: rgba(255, 255, 245, 0.025);
  --glass-stroke: rgba(255, 255, 245, 0.09);
  --glass-muted: #aaa99d;
}
body dialog,
#helperDiagramDialog {
  background: var(--glass-surface) !important;
  border-color: var(--glass-stroke) !important;
  box-shadow:
    0 16px 50px #0005,
    inset 0 1px 0 #ffffff04;
  border-radius: 12px;
  color: #dddcd3;
}
body
  dialog
  :is(
    fieldset,
    .checkLabel,
    .fibLevel,
    .accountGrid .metric,
    .historyItem,
    .sessionRow,
    .emaDistanceResult,
    .helperDatum,
    .movementAlert,
    .emaSettings
  ),
body dialog .fibOptions label:has(input[type='checkbox']) {
  background: var(--glass-inset) !important;
  border-color: var(--glass-stroke) !important;
  box-shadow: none;
  border-radius: 7px;
}
body
  dialog
  :is(input:not([type='checkbox']):not([type='range']):not([type='color']), select, textarea) {
  background: rgba(0, 0, 0, 0.14) !important;
  border-color: #ffffff18 !important;
  color: #dedcd2;
  box-shadow: none;
}
body dialog :is(input, select, textarea):focus-visible {
  outline: 1px solid #b5a07670;
  outline-offset: 1px;
}
body dialog button,
body dialog .backupActions a {
  background: rgba(255, 255, 255, 0.025);
  border-color: #ffffff14;
  color: #bcb9ae;
  font-weight: 400;
  border-radius: 5px;
  transition:
    background 0.18s,
    border-color 0.18s;
}
body dialog button:hover,
body dialog .backupActions a:hover {
  background: rgba(255, 255, 255, 0.065);
  border-color: #ffffff26;
}
body
  dialog
  :is(
    .primary,
    button[type='submit'],
    .tabs button.selected,
    #pairFilters button.selected,
    button[aria-expanded='true']
  ) {
  background: rgba(223, 189, 117, 0.06);
  border-color: #dfbd7529;
  color: #c9b47f;
}
body dialog :is(.sell, [data-clear-all], [data-delete], [data-fib-action='clear']) {
  background: rgba(241, 116, 135, 0.045);
  border-color: #f1748728;
  color: #dc8694;
}
body dialog .dialogHead {
  border-bottom-color: #ffffff0c;
}
body dialog :is(.historyBottom, .pairColumns, .tabs) {
  border-color: #ffffff0c;
}
body dialog .pairRow {
  border-bottom-color: #ffffff08;
}
body dialog .pairRow:hover {
  background: #ffffff04;
}
body dialog .pairRow.selected {
  background: #dfbd7506;
}
.emaLegend,
.fibonacciNotice,
:is(#chart,[data-chart-node="chart"]) .chartLevelLabel,
.widgetMoveHandle,
.widgetResizeHandle {
  background: rgba(17, 17, 16, 0.22) !important;
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  border-color: #ffffff12 !important;
}
#helperDiagramDialog .helperDataHead [data-close],
body dialog .dialogHead > button {
  background: transparent;
  border: 0;
}
#helperDiagramDialog .helperDataGrid > .helperDatum {
  background: transparent !important;
  border-radius: 0;
}
body dialog :is(.note, .modelNotes) {
  color: #9d9b8f;
}
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  body dialog,
  #helperDiagramDialog {
    background: rgba(17, 17, 16, 0.96) !important;
  }
}
.selectStyled {
  position: relative;
  display: block;
  min-width: 0;
}
.selectStyled > select {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  opacity: 0;
  pointer-events: none;
  transform: none !important;
  overflow: hidden;
}
body .glassSelectTrigger {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  width: 100%;
  height: 100%;
  min-height: 23px;
  padding: 3px 7px;
  background: rgba(0, 0, 0, 0.14);
  border: 1px solid #ffffff18;
  border-radius: 5px;
  color: #dedcd2;
  font: inherit;
  font-size: 10px;
  text-align: left;
  box-sizing: border-box;
}
.glassSelectTrigger span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.glassSelectTrigger i {
  font-size: 12px;
  font-style: normal;
  color: #98968b;
}
body .glassSelectTrigger:focus-visible {
  outline: 1px solid #b5a07670;
  outline-offset: 1px;
}
.glassSelectMenu {
  padding: 4px;
  border: 1px solid #ffffff18;
  border-radius: 8px;
  background: rgba(22, 22, 20, 0.65);
  color: #dedcd2;
  backdrop-filter: blur(22px) saturate(115%);
  -webkit-backdrop-filter: blur(22px) saturate(115%);
  box-shadow: 0 9px 30px #0005;
  overflow: auto;
  scrollbar-width: thin;
  z-index: 300;
}
.glassSelectMenu button {
  display: block;
  text-align: left;
  width: 100%;
  min-height: 27px;
  padding: 5px 8px;
  border: 1px solid transparent;
  border-radius: 4px;
  background: transparent;
  color: #c9c7bc;
  font: inherit;
  font-size: 11px;
}
.glassSelectMenu button:hover,
.glassSelectMenu button.highlighted {
  background: #ffffff08;
  border-color: #ffffff0c;
}
.glassSelectMenu button[aria-selected='true'] {
  color: #d9bf85;
  background: #dfbd750c;
}
.glassSelectMenu button[aria-selected='true']::after {
  content: '✓';
  float: right;
  color: #bfa970;
}
.glassSelectMenu button:disabled {
  opacity: 0.4;
}
body dialog [data-delete-plan] {
  color: #cf8994;
  background: #f1748706;
  border-color: #f1748720;
}
.cliFlow text {
  font-family:
    Inter,
    -apple-system,
    BlinkMacSystemFont,
    'Segoe UI',
    sans-serif;
  font-size: 10px;
  font-weight: 500;
  fill: #d5d2c8;
}
.cliFlow .flowEdges text {
  font-size: 8px;
  font-weight: 400;
  fill: #969181;
}
.flowStateDot {
  fill: #6c6c63;
}
.cliFlow [data-state='pass'] .flowStateDot {
  fill: #66b798;
}
.cliFlow [data-state='wait'] .flowStateDot {
  fill: #b5a16c;
}
.cliFlow .flowVisited rect {
  stroke: #b6a57170;
}
.cliFlow .flowCurrent rect {
  stroke: #cfb878;
  fill: #dfbd7506;
}
.cliFlow .flowVisited[data-state='pass'] rect {
  stroke: #66b79870;
}
.cliFlow .flowEdges path.flowTaken {
  stroke: #b8a575;
  stroke-width: 1.3;
}
.flowLiveStatus {
  font-size: 10px;
  color: #bab5a2;
  margin: 0 0 10px;
  line-height: 1.5;
}
.preparedEntryLayer {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 5;
  overflow: hidden;
}
.preparedEntryLabel {
  position: absolute;
  transform: none;
  transform-origin: center;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 4px 7px;
  margin: 0;
  border: 1px solid #c9ac6838;
  border-radius: 5px;
  background: rgba(26, 25, 20, 0.45);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  color: #d4bc85;
  font:
    9px Inter,
    system-ui,
    sans-serif;
  line-height: 1.2;
  font-variant-numeric: tabular-nums;
}
.preparedEntryLabel[hidden] {
  display: none;
}
.preparedEntryLabel[data-active='false'] {
  color: #999487;
  border-color: #ffffff1a;
}
.preparedEntryLabel::after {
  content: none;
}
.preparedEntryLabel:active {
  transform: scale(0.985);
}
.preparedEntryConnectors {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  overflow: hidden;
}
.preparedEntryConnectors path {
  fill: none;
  stroke: #c9ac6899;
  stroke-width: 1;
  vector-effect: non-scaling-stroke;
}
.preparedEntryConnectors path[data-kind='EXIT'] {
  stroke: #d38ba199;
}
.preparedEntryConnectors path[data-kind='REBUY'] {
  stroke: #71b4df99;
}
.preparedEntryLabel b {
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.015em;
}
.preparedEntryCaption {
  color: #b9ad8d;
}
@media (max-width: 600px) {
  .preparedEntryLabel {
    gap: 5px;
    padding: 3px 5px;
    font-size: 8px;
  }
  .preparedEntryLabel b {
    font-size: 9px;
  }
}
@media (prefers-reduced-transparency: reduce) {
  .glassSelectMenu {
    background: #181817;
  }
}

.cliComposerActions {
  display: flex;
  align-items: center;
  gap: 6px;
}
.preparedEntryLabel {
  max-width: calc(100% - 70px);
}

#historyButton,
#closeAllButton,
.positionCard .positionFooter .positionCLI {
  font-family:
    Inter,
    -apple-system,
    BlinkMacSystemFont,
    Segoe UI,
    system-ui,
    sans-serif;
}
.cliFlow .cliDiagramDesktop,
.cliFlow .cliDiagramMobile {
  width: auto;
  max-width: 100%;
  height: auto;
  margin: auto;
}
.cliFlow text {
  font-size: 9.5px;
  font-weight: 400;
  letter-spacing: 0.01em;
  fill: #c9c7bd;
}
.cliFlow .flowEdges text {
  font-size: 7.5px;
  color: #969181;
}
.cliFlow rect {
  stroke-width: 0.8;
}
.cliFlow .flowCurrent rect {
  fill: #dfbd7504;
  stroke: #c8b17990;
}
.cliAccounts {
  width: 100%;
  margin-bottom: 7px;
}
.cliAccountChoice {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 7px;
}
.cliAccountChoice label {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 9px;
  color: #aaa696;
}
.cliAccountChoice .compactControl {
  min-width: 130px;
}
.cliAccountChoice > span {
  font-size: 8px;
  color: #858173;
}
.cliAccounts [data-account-status] {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 7px;
}
.cliAccountCard {
  padding: 8px 10px;
  border: 1px solid #ffffff0e;
  border-radius: 7px;
  background: #ffffff02;
  min-width: 0;
}
.cliAccountCard > div:first-child {
  display: flex;
  justify-content: space-between;
  gap: 8px;
}
.cliAccountCard strong {
  font-size: 9px;
  font-weight: 500;
}
.cliAccountCard small {
  font-size: 8px;
  color: #938e7d;
}
.cliAccountEmail {
  display: block;
  margin-top: 3px;
  font-size: 8px;
  color: #aaa696;
  overflow: hidden;
  text-overflow: ellipsis;
}
.cliAccountQuota {
  display: flex;
  gap: 8px;
  margin-top: 5px;
  font-size: 8px;
  color: #969181;
  font-variant-numeric: tabular-nums;
}
.cliAccountQuota b {
  font-weight: 500;
  color: #b9ab83;
}
.cliAccountCard button {
  margin-top: 5px !important;
  font-size: 8px !important;
  padding: 3px 7px !important;
}
.cliAccountLogin {
  display: grid;
  gap: 4px;
  margin-top: 7px;
}
.cliAccountLogin a {
  font-size: 9px;
  color: #d2b97a;
}
.cliAccountLogin code {
  font-size: 13px;
  letter-spacing: 0.14em;
  color: #ddd2af;
}
.cliAccountError {
  display: block;
  margin-top: 4px;
  color: #c8868f !important;
}
@media (max-width: 460px) {
  .cliAccountChoice {
    align-items: flex-start;
  }
  .cliAccountChoice > span {
    max-width: 95px;
    text-align: right;
  }
  .cliAccountCard {
    padding: 7px;
  }
  .cliAccountCard > div:first-child {
    flex-direction: column;
    gap: 2px;
  }
}
.flowLiveStatus {
  font-size: 9px;
  color: #a49e8b;
  line-height: 1.45;
  margin-bottom: 9px;
}
.preparedEntryLabel {
  padding: 2px 5px;
  gap: 5px;
  font-size: 8px;
  border-radius: 4px;
  background: rgba(26, 25, 20, 0.3);
}
.preparedEntryLabel b {
  font-size: 9px;
  font-weight: 450;
}
.preparedEntryCaption {
  letter-spacing: 0.01em;
}
.preparedEntryIdentity {
  position: relative;
  display: grid;
  place-items: center;
  width: 14px;
  height: 14px;
  flex: none;
}
.preparedEntryIcon {
  width: 10px;
  height: 10px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.1;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.preparedEntryLabel[data-active='true'] .preparedEntryIdentity::after {
  content: '';
  position: absolute;
  inset: 0;
  border: 1px solid #c9ac6815;
  border-top-color: #c9ac6870;
  border-radius: 50%;
  animation: cliProgressSpin 5s linear infinite;
}
:is(#fundingChart,[data-chart-node="fundingChart"]),
:is(#fundingChart,[data-chart-node="fundingChart"]) div,
:is(#fundingChart,[data-chart-node="fundingChart"]) canvas,
:is(#fundingPanel,[data-chart-node="fundingPanel"]) .fundingLabel,
.fundingClock,
.chartPanel > .chartFooter {
  touch-action: pan-y !important;
  overscroll-behavior: auto;
  cursor: auto;
}
:is(#fundingChart,[data-chart-node="fundingChart"]) .fundingAxisRegion,
:is(#fundingChart,[data-chart-node="fundingChart"]) .fundingAxisRegion * {
  touch-action: none !important;
  cursor: ns-resize;
}
.fundingPlotFrame {
  position: absolute;
  left: 0;
  top: 0;
  pointer-events: none;
  z-index: 3;
  border: 1px solid #d7d0b42b;
  border-right-color: #d7d0b440;
}
.fundingPlotFrame i {
  position: absolute;
  left: -1px;
  right: -1px;
  height: 5px;
  border-left: 1px solid #d5bd7d70;
  border-right: 1px solid #d5bd7d70;
}
.fundingFrameTop {
  top: -1px;
  border-top: 1px solid #d5bd7d38;
}
.fundingFrameBottom {
  bottom: -1px;
  border-bottom: 1px solid #d5bd7d38;
}
.fundingClipIndicator {
  position: absolute;
  z-index: 4;
  pointer-events: none;
  transform: translateX(-50%);
  font:
    8px Inter,
    system-ui,
    sans-serif;
  line-height: 12px;
  color: #c8b982;
  background: #17161099;
  border-radius: 3px;
  padding: 0 3px;
}
@media (prefers-reduced-motion: reduce) {
  .preparedEntryIdentity::after {
    animation: none !important;
  }
}
/* Market picker uses one glass surface; rows do not paint a second panel. */
body #pairPicker {
  background: rgba(16, 17, 16, 0.38) !important;
  backdrop-filter: blur(18px) saturate(110%);
  -webkit-backdrop-filter: blur(18px) saturate(110%);
  border: 1px solid #ffffff16 !important;
  border-radius: 12px;
  box-shadow:
    0 18px 55px #0005,
    inset 0 1px #ffffff05;
}
#pairPicker .dialogHead {
  background: rgba(18, 19, 17, 0.16);
  border-bottom: 1px solid #ffffff0b;
}
body #pairPicker #pairFilters {
  background: rgba(255, 255, 255, 0.018);
  border: 1px solid #ffffff0b;
  padding: 4px;
  gap: 3px;
  border-radius: 7px;
  backdrop-filter: none;
}
body #pairPicker #pairFilters button {
  padding: 4px 8px;
  font-size: 9px;
  font-weight: 400;
  border: 1px solid transparent;
  background: transparent;
  border-radius: 4px;
  color: #9e9f94;
}
body #pairPicker #pairFilters button.selected {
  color: #cdb985;
  background: #d8bb7309;
  border-color: #d8bb7322;
}
body #pairPicker .pairColumns {
  background: rgba(255, 255, 255, 0.018);
  backdrop-filter: none;
  border-top: 1px solid #ffffff0a;
  border-bottom: 1px solid #ffffff0d;
  padding: 7px 0;
  margin-bottom: 2px;
  border-radius: 5px 5px 0 0;
}
body #pairPicker .pairColumns button {
  font-size: 8px;
  font-weight: 400;
  letter-spacing: 0.02em;
  color: #9b9d92;
  background: transparent;
  border: 0;
}
body #pairPicker .pairRow {
  background: transparent;
  border-bottom: 1px solid #ffffff07;
  min-height: 34px;
  color: #c9cbc1;
  font-size: 9.5px;
  font-weight: 400;
  font-variant-numeric: tabular-nums;
  transition: background 0.15s;
}
body #pairPicker .pairRow.highlighted,
body #pairPicker .pairRow:hover {
  background: rgba(210, 192, 145, 0.045);
  box-shadow: inset 2px 0 #c6b47965;
  border-radius: 4px;
}
body #pairPicker .pairRow > strong {
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.02em;
}
body #pairPicker .pairRow .star {
  color: #7e837c;
  background: transparent;
  border: 0;
  font-size: 13px;
  padding: 2px;
}
.pairRow .star.favorite {
  color: #ccb77a !important;
}
body #pairPicker #pairSearch {
  background: #ffffff03 !important;
  border-color: #ffffff14 !important;
  color: #d0d1c7;
  font-weight: 400;
  box-shadow: none;
}
body #pairPicker #pairSearch:focus-visible {
  outline: none;
  border-color: #b6a16a50 !important;
  box-shadow: 0 0 0 2px #b6a16a06;
}
body #pairPicker #morePairs {
  font-size: 9px;
  font-weight: 400;
  padding: 5px;
  color: #93968b;
  background: #ffffff02;
  border-color: #ffffff0d;
  border-radius: 5px;
}
body #pairPicker #pairRows {
  scrollbar-width: thin;
  scrollbar-color: #a8ad992b transparent;
}
#pairPicker mark {
  color: #ddd1a5;
  background: #ccad6b14;
  border-radius: 2px;
}
.fundingPlotFrame {
  border-color: rgba(89, 168, 245, 0.48);
}
.fundingPlotFrame i {
  border-left-color: rgba(89, 168, 245, 0.85);
  border-right-color: rgba(89, 168, 245, 0.85);
}
.fundingFrameTop {
  border-top-color: rgba(89, 168, 245, 0.65);
}
.fundingFrameBottom {
  border-bottom-color: rgba(89, 168, 245, 0.65);
}

body dialog [data-delete-current] {
  color: #bf838e;
  background: #f1748704;
  border-color: #f174871b;
  padding: 4px 7px;
  font-size: 9px;
}
.cliStrategyHistory {
  margin: 12px 0 4px;
  border-top: 1px solid #ffffff0c;
  padding-top: 9px;
}
.cliStrategyHistory > summary {
  font-size: 10px;
  color: #aea68f;
  cursor: pointer;
}
.cliStrategyHistory [data-history-rows] {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  padding-top: 9px;
}
@media (max-width: 600px) {
  .cliStrategyHistory [data-history-rows] {
    grid-template-columns: 1fr;
  }
}
.preparedEntryLabel[data-kind='REBUY'] {
  color: #93c6e4;
  border-color: #71b4df50;
  background: rgba(18, 39, 52, 0.27);
}
.preparedEntryLabel[data-kind='EXIT'] {
  color: #e0a2b7;
  border-color: #d38ba150;
  background: rgba(46, 25, 36, 0.27);
}
.preparedEntryLabel[data-kind='REBUY'] .preparedEntryIdentity::after {
  border-style: dashed;
  border-top-color: #8ec9ea;
  animation-direction: reverse;
  animation-duration: 7s;
}
.preparedEntryLabel[data-kind='EXIT'] .preparedEntryIdentity::after {
  border-top-color: #dc9fb5;
}
.preparedEntryLabel[data-kind='REBUY']::after {
  background: #71b4df99;
}
.preparedEntryLabel[data-kind='EXIT']::after {
  background: #d38ba199;
}
.preparedEntryLabel[data-kind='REBUY'] .preparedEntryCaption,
.preparedEntryLabel[data-kind='EXIT'] .preparedEntryCaption {
  color: inherit;
}
.preparedEntryLabel[data-kind='ENTRY'][data-side='SHORT'] {
  border-color: #d37f9455;
}
.preparedEntryLabel[data-kind='ENTRY'][data-side='SHORT'] .preparedEntryCaption {
  color: #e69aac;
}
.preparedEntryLabel[data-kind='ENTRY'][data-side='LONG'] {
  border-color: #6ebc9855;
}
.preparedEntryLabel[data-kind='ENTRY'][data-side='LONG'] .preparedEntryCaption {
  color: #90d2b3;
}
.preparedEntryLabel[data-kind='ENTRY'][data-side='SHORT'] .preparedEntryIdentity::after {
  border-top-color: #dc93a7;
}
.preparedEntryLabel[data-kind='ENTRY'][data-side='LONG'] .preparedEntryIdentity::after {
  border-top-color: #7dcca8;
}

.preparedEntryLabel {
  pointer-events: auto;
  cursor: pointer;
  text-align: left;
}
.preparedEntryLabel:focus-visible {
  outline: 1px solid #c4b489;
  outline-offset: 3px;
}
.preparedEntryLabel:hover {
  background: rgba(45, 44, 38, 0.6);
}
.helperDataHead > span {
  display: none;
}

body dialog::backdrop,
#helperDiagramDialog::backdrop {
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  background: rgba(0, 0, 0, 0.25);
}
body dialog {
  isolation: isolate;
  backface-visibility: hidden;
  transform: translateZ(0);
}
/* Mobile browsers zoom focused text fields when their font is below 16px. */
@media (max-width: 600px), (hover: none) and (pointer: coarse) {
  body
    #helperDiagramDialog
    :is(textarea, input:not([type='checkbox']):not([type='range']):not([type='color']), select) {
    font-size: 16px;
    line-height: 1.4;
  }
}

.preparedEntryLabel {
  left: 10px;
  right: auto;
  transition: top 0.32s cubic-bezier(0.2, 0.7, 0.2, 1);
  white-space: nowrap;
}
.preparedEntryCaption {
  max-width: 190px;
  overflow: hidden;
  text-overflow: ellipsis;
}
.preparedEntryLabel::after {
  right: auto;
  left: -6px;
}
.positionsSection #positions .compactPosition .positionMeters > div {
  grid-template-rows: auto 8px !important;
  gap: 5px;
}
.positionsSection
  #positions
  .compactPosition
  .positionMeters
  :is(.profitTrack, .growthTrack, .buyingTrack, .realizedTrack) {
  height: 8px !important;
  border: 1px solid #ffffff24;
  border-radius: 4px;
  background: #ffffff10;
}
.positionsSection #positions .compactPosition .positionMeters i {
  min-width: 0;
  box-shadow: 0 0 5px currentColor;
}
.positionsSection #positions .compactPosition.eventsView > .positionTop {
  display: none !important;
}
.positionsSection #positions .compactPosition.eventsView > .helperWidget {
  grid-row: 1 !important;
  height: 96px !important;
  overflow: auto;
}
.positionsSection #positions .compactPosition.eventsView > .positionFooter {
  grid-row: 2 !important;
}
.compactPosition.eventsView .helperInventory {
  display: none;
}
@media (max-width: 700px) {
  main > header {
    min-height: 44px;
    overflow: hidden;
  }
  main > header .connectionStatus {
    min-width: 0;
  }
  main > header #banner {
    display: none;
  }
  main > header .latency {
    width: 68px;
    font-variant-numeric: tabular-nums;
  }
  main > header .headerControlCount {
    min-width: 24px;
  }
  main > header .movementAlertsButton,
  main > header .emaDistanceButton {
    min-width: 70px;
  }
}

@media (max-width: 700px) {
  .marketHead {
    min-height: 68px;
  }
  .marketHead .quote {
    width: 142px;
    flex: none;
    font-variant-numeric: tabular-nums;
  }
  .marketHead #price {
    display: block;
    min-width: 142px;
    text-align: right;
  }
  .marketHead > div:first-child {
    min-width: 0;
  }
  main {
    max-width: 100%;
    overflow-x: clip;
  }
}

.preparedEntryLabel {
  transition:
    background 0.18s,
    border-color 0.18s;
}