/* Shared browser defaults. */
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
input, select, textarea { border-radius: 0; }
input[type=range]::-moz-range-thumb { width: 10px; height: 10px; border-radius: 50%; background: var(--txt); border: 3px solid var(--p); box-shadow: 0 0 0 1px var(--p4); cursor: pointer; }
input[type=range]::-moz-range-track { background: transparent; border: 0; }
@supports not selector(::-webkit-scrollbar) { * { scrollbar-width: thin; scrollbar-color: var(--p4) transparent; } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; transition-duration: .01ms !important; } }
/* Phone/tablet layout. Trading behavior and desktop layout stay unchanged. */
.mobile-trade-nav { display: none; }

@media (max-width: 1020px) {
  html, body { height: 100%; height: 100dvh; overflow: hidden; }
  body { min-width: 0; }
  #app { display: block; flex: 1; min-height: 0; overflow: auto; overscroll-behavior-y: contain; }
  .hd { height: auto; min-height: 64px; flex-wrap: wrap; gap: 10px; padding: 10px max(12px,env(safe-area-inset-right)) 0 max(12px,env(safe-area-inset-left)); border-bottom: 1px solid var(--line2); }
  .logo { font-size: 24px; margin-right: auto; }
  .hd .search, .hd .xbtn, .hd > [data-new] { display: none; }
  .hd .nav { order: 5; width: 100%; margin: 0; display: flex; gap: 0; justify-content: space-around; border-top: 1px solid var(--line); }
  .nav a { min-height: 44px; font-size: 14px; justify-content: center; flex: 1; white-space: nowrap; }
  .nav a.on { color: var(--y); box-shadow: inset 0 -2px var(--y); }
  #hacct { gap: 6px; }
  #hacct > .btn { min-height: 40px; padding: 0 12px; font-size: 13px; }
  .hd .hbox { min-width: 82px; height: 40px; padding: 0 8px; }
  .hd:has([data-auth]) .hbox { display: none; }
  .amenu-pop { max-width: calc(100vw - 24px); }
  .amenu-pop button, .amenu-pop a { min-height: 44px; }
  .ft { height: auto; min-height: 30px; gap: 12px; font-size: 10px; padding: 7px 12px max(7px,env(safe-area-inset-bottom)); }
  .ft .tick, .ft .stable, .ft .fx-x { display: none; }
  .ft #ftmode { margin-right: auto; }
  .ft .grow { display: none; }
  input, select, textarea { font-size: 16px; }
  button, a, input { touch-action: manipulation; }
  button:focus-visible, a:focus-visible, input:focus-visible { outline: 2px solid var(--y); outline-offset: 3px; }

  /* Trade panels retain their inputs when switching views. */
  .fx { display: flex; flex-direction: column; height: 100%; min-height: 0; padding: 8px max(10px,env(safe-area-inset-right)) 8px max(10px,env(safe-area-inset-left)); gap: 10px; }
  .mobile-trade-nav { display: grid; grid-template-columns: repeat(3,1fr); gap: 4px; flex: none; background: var(--p); border: 1px solid var(--line2); border-radius: 12px; padding: 4px; }
  .mobile-trade-nav button { min-height: 40px; border-radius: 8px; font-size: 13px; display: flex; justify-content: center; align-items: center; gap: 7px; color: var(--mute); }
  .mobile-trade-nav button[aria-pressed="true"] { background: var(--y); color: #111; font-weight: 700; }
  .fx[data-mobile-panel="chart"] > .fleft, .fx[data-mobile-panel="chart"] > .fright,
  .fx[data-mobile-panel="tokens"] > .fm, .fx[data-mobile-panel="tokens"] > .fright,
  .fx[data-mobile-panel="trade"] > .fm, .fx[data-mobile-panel="trade"] > .fleft { display: none; }
  .fx > .fleft, .fx > .fm, .fx > .fright { flex: 1; min-height: 0; width: 100%; }
  .fleft .scroll { overflow: auto; min-height: 0; }
  .flh { height: 52px; padding: 0 12px; }
  .fls { width: min(220px,60%); height: 38px; }
  .fls input { font-size: 16px; }
  .fpills { gap: 6px; padding: 0 8px 8px; }
  .fpills button { min-height: 40px; padding: 0 10px; font-size: 12px; }
  .flr { min-height: 64px; padding: 10px; }
  .fm { overflow: auto; overscroll-behavior-y: contain; }
  .fhead { gap: 8px; padding: 4px 0; }
  .fid { flex: 1 0 100%; min-width: 0; }
  .fid1 { flex-wrap: wrap; }
  .fid1 b { max-width: 140px; overflow: hidden; text-overflow: ellipsis; }
  .fid small { white-space: normal; flex-wrap: wrap; gap: 5px; font-size: 11px; }
  .fid .ca { min-height: 28px; }
  .fhead > .grow { display: none; }
  .fmc { padding: 0 4px; }
  .fmc span { font-size: 10px; }
  .fmc b { font-size: 16px; }
  .fst { flex: 1 1 28%; min-width: 0; padding: 7px 4px; }
  .fst:nth-of-type(n+6) { display: none; }
  .fst b, .fst b span { font-size: 12px; }
  .fst > span { font-size: 10px; }
  .fchart { height: 48vh; height: 48dvh; min-height: 320px; max-height: 520px; flex: none; width: 100%; overflow: hidden; }
  .fchart .cv { min-width: 0; width: 100%; }
  .fbot { flex: none; height: 290px; min-height: 240px; }
  .fbot .scroll { overflow: auto; }
  .fsh, .fsr { grid-template-columns: minmax(100px,1fr) 54px 82px 52px; padding: 0 8px; gap: 5px; }
  .fsh > :nth-child(4), .fsr > :nth-child(4) { display: none; }
  .fsr { min-height: 44px; font-size: 12px; }
  .fsr .cell b { font-size: 11px; }
  .fbh { min-height: 44px; padding-left: 8px; }
  .fbh button { min-height: 40px; }
  .fmin { font-size: 10px; }
  .fright { overflow: auto; overscroll-behavior-y: contain; }
  .fright-in { overflow: visible; flex: none; padding-bottom: 16px; }
  .ftk { padding: 12px; gap: 12px; }
  .fbs button, .fpre button, .fgo { min-height: 48px; }
  .fbs .gear { width: 44px; }
  .fmax { align-items: center; min-height: 36px; }
  .fmax button { min-height: 36px; margin-left: auto; padding: 0 12px; }
  .famt input { font-size: 30px; }
  .fwin button, .flinks a { min-height: 40px; }

  /* Builder: strategies first, followed by editable rules and review. */
  .shell { display: flex; flex-direction: column; padding: 10px; gap: 12px; min-width: 0; }
  .shell > .left { order: 0; }
  .shell > .mid { order: 1; }
  .shell > .est { order: 2; }
  .shell > .pnl { flex: none; min-width: 0; }
  .shell .scroll { overflow: visible; }
  #left > .lsec:first-child { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 5px; padding: 6px; }
  #left > .lsec:not(:first-child) { display: none; }
  .tpl { width: 100%; min-width: 0; margin: 0; padding: 12px 8px; gap: 7px; min-height: 68px; }
  .tpl .tx { min-width: 0; }
  .tpl .tx b { font-size: 12px; }
  .tpl .tx small { font-size: 10px; line-height: 1.45; }
  .tpl .rv { display: none; }
  .tpl .ticon { width: 28px; height: 28px; flex: none; font-size: 16px; }
  .namebar { flex-wrap: wrap; padding: 12px; gap: 8px; }
  .namebar input { min-width: 0; width: auto; flex: 1; font-size: 16px; }
  .secnav { display: flex; overflow-x: auto; flex-wrap: nowrap; gap: 5px; padding: 6px 10px; }
  .secnav button { min-height: 40px; flex: none; }
  .fr { display: grid; grid-template-columns: minmax(0,1fr); gap: 12px; padding: 16px 12px; }
  .fl small { font-size: 12px; line-height: 1.6; }
  .fc { justify-content: flex-start; flex-wrap: wrap; max-width: 100%; gap: 8px; }
  .box input { font-size: 16px; min-height: 38px; }
  .seg button, .chips button { min-height: 40px; }
  .sw { min-width: 44px; min-height: 28px; }
  .ladder { padding: 0 12px 12px; }
  .rung { flex-wrap: wrap; gap: 7px; }
  .wr { min-width: 0; }.wr .tx { min-width: 0; }
  .wadd { flex-wrap: wrap; }.wadd input { min-width: 0; max-width: 100%; font-size: 16px; }
  .foot { position: static; padding: 12px; }
  .foot .cta, .foot .btn { min-height: 48px; }
  .section { scroll-margin-top: 10px; }

  /* Accounts, portfolio and bots. Keep actions visible and tables scrollable. */
  .wrap { padding: 10px; gap: 12px; }
  .wrap > .pnl { flex: none !important; }
  .strip { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
  .sbox { min-width: 0; padding: 12px; }
  .sbox > b { font-size: 19px; overflow-wrap: anywhere; }
  .sbox > span, .sbox small { font-size: 11px; }
  .ph { flex-wrap: wrap; min-height: 48px; padding: 8px 12px; gap: 8px; }
  .ph .cta, .ph .btn, .pills button { min-height: 40px; }
  .botgrid, .pgrid { display: flex; flex-direction: column; min-width: 0; }
  .botgrid > .pnl, .pgrid > .pnl { flex: none; min-width: 0; }
  .lb-head { flex-wrap: wrap; gap: 8px; padding: 4px; }
  .lb-head > div { min-width: 0; flex: 1; }
  .lb-head h1 { font-size: 18px; overflow-wrap: anywhere; }
  .lb-head small { flex-wrap: wrap; font-size: 10px; }
  .lb-head .btn { min-height: 44px; }
  .lbscroll { max-height: 65vh; max-height: 65dvh; overflow: auto; }
  .lb-log { padding: 12px; font-size: 12px; }
  .lb-log > span, .kvl b { overflow-wrap: anywhere; }
  .lb-pos .tx { min-width: 0; }.lb-pos small { overflow-wrap: anywhere; }
  .lbt .th { display: none; }
  .lbt .tr { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 13px; padding: 16px; font-size: 13px; }
  .lbt .tr > span { min-width: 0; }
  .lbt .tr > .cell { grid-column: 1/-1; }
  .lbt .cell > span:last-child { min-width: 0; }
  .lbt .cell b { overflow-wrap: anywhere; }
  .lbt .tr > span:nth-child(n+3):before { display: block; color: var(--mute); font-size: 10px; margin-bottom: 4px; }
  .lbt .tr > span:nth-child(3):before { content: 'Balance · SOL'; }
  .lbt .tr > span:nth-child(4):before { content: 'Equity · SOL'; }
  .lbt .tr > span:nth-child(5):before { content: 'Realized · SOL'; }
  .lbt .tr > span:nth-child(6):before { content: 'Open positions'; }
  .lbt .tr > span:nth-child(7):before { content: 'Following'; }
  .lbt .tr > span:last-child { grid-column: 1/-1; white-space: normal; overflow-wrap: anywhere; }
  .lbt .tr > span:last-child:before { content: 'Latest activity'; }
  .tpos, .thist, .dtable { overflow-x: auto; max-width: 100%; }
  .tpos .th, .tpos .tr, .thist .th, .thist .tr { min-width: 680px; }
  .tpos .scroll, .thist .scroll { overflow: visible; }
  .dtable .th, .dtable .tr { min-width: 900px; }
  .emptybig { padding: 36px 18px; }
  .emptybig h2 { font-size: 22px; }.emptybig p { line-height: 1.7; }
  #modal { padding: 12px; align-items: center; }
  .mbox { width: 100%; max-height: calc(100vh - 24px); max-height: calc(100dvh - 24px); padding: 18px; overflow: auto; overscroll-behavior: contain; }
  .mbox .x { min-width: 40px; min-height: 40px; }
  .au, .dep { min-width: 0; width: 100%; }
  .au input, .dep input { font-size: 16px; min-height: 48px; }
  .au .cta, .dep .cta, .daddr .btn { min-height: 44px; }
  .dep .fine { color: var(--mute); }
  .sp-card { width: min(100%,440px); max-height: 90vh; max-height: 90dvh; overflow: auto; }
  #toasts { max-width: calc(100vw - 24px); }
}

@media (max-width: 360px) {
  .hd .hbox { display: none; }
  .nav a { font-size: 12px; }
  .fpills { gap: 3px; }.fpills button { padding: 0 7px; }
  .fpre { gap: 5px; }.fpre button { font-size: 12px; }
  .fsh, .fsr { grid-template-columns: minmax(84px,1fr) 44px 70px 40px; }
  .ft { gap: 8px; font-size: 9px; }
}

@media (max-width: 1020px) { .ft { flex-wrap: wrap; column-gap: 10px; row-gap: 5px; } .ft #ftmode { flex: 1 0 100%; } .hd, .ft { flex-shrink: 0; } }
/* Global token search: accessible from every route, including phones. */
.hd .token-search { display:flex; position:relative; min-width:160px; flex:1; max-width:380px; overflow:visible; }
.token-search input { width:100%; min-width:0; }
#token-results { position:absolute; z-index:100; top:calc(100% + 8px); left:0; width:max(100%,320px); max-width:calc(100vw - 24px); max-height:55vh; overflow:auto; padding:6px; background:var(--p); border:1px solid var(--line2); border-radius:12px; box-shadow:0 12px 35px #0009; }
#token-results[hidden] { display:none; }
#token-results a { display:flex; gap:10px; align-items:center; padding:12px 8px; min-height:60px; border-radius:8px; }
#token-results a:hover,#token-results a:focus-visible { background:var(--p3); outline:2px solid var(--y); outline-offset:-2px; }
#token-results img { width:32px;height:32px;object-fit:cover;border-radius:50%; }
#token-results span { min-width:0; font-size:12px; overflow-wrap:anywhere; }
#token-results b { color:var(--txt);font-size:14px; }
#token-results small { display:block; font-size:10px;color:var(--mute);overflow-wrap:anywhere; }
#token-results p { padding:16px; font-size:13px;white-space:normal; }
#token-results button { color:var(--y);padding:8px; }
@media(max-width:1020px){.hd .token-search{display:flex;order:4;flex:1 0 100%;max-width:none;width:100%;height:42px;margin:0;}.token-search input{font-size:16px;}#token-results{width:100%;}.token-search .kbd{display:none;}}
@media(min-width:1021px) and (max-width:1250px){.hd{gap:10px;}.hd .xbtn,.hd>[data-new]{display:none;}.hd .token-search{max-width:280px;}.hd .nav{gap:12px;}}
.market-status{padding:0 12px 6px;color:var(--mute);font-size:10px;min-height:6px;flex:none}

/* Keep token identity together and balance the phone market summary. */
@media(max-width:1020px){.fhead>.fid{flex:1 1 calc(100% - 60px)}}
@media(max-width:480px){.fhead>.fmc,.fhead>.fst{flex:1 1 calc(50% - 4px);min-width:0;height:48px}.fhead>.fmc{display:flex;flex-direction:column;justify-content:center}}