/* movil.css — phones only (loaded with media="(max-width: 700px)", after every lazy stylesheet would not hold, so each
 * rule starts at html body to outrank them). Touch targets of 44 px, inputs of 16 px so iOS does not zoom. */

/* ---------- top bar: the wallet button always whole ---------- */
html body .topbar { gap: 6px; padding: 0 8px; min-width: 0; }
html body .topbar-right { flex: 1 1 auto; min-width: 0; justify-content: flex-end; gap: 6px; }
html body #lang { display: none; }
html body .refpill { flex: none; }
html body #cuenta .cta-off, html body #cuenta .cta-refby, html body #cuenta .cta-msg { display: none; }
html body #cuenta button.sm-btn { white-space: nowrap; font-size: 12px; padding: 6px 8px; }
html body #wal { flex: none; min-width: 0; }
html body #wal button { min-height: 38px; white-space: nowrap; }
html body #ins:empty, html body #cuenta:empty { display: none; }

/* ---------- bottom bar: four entries and More ---------- */
html body .side { padding: 4px 4px calc(4px + env(safe-area-inset-bottom)); }
html body .side .brand, html body .side .live, html body .side .about { display: none; }
html body .tabs { flex-direction: row; flex-wrap: nowrap; justify-content: space-around; gap: 0; width: 100%; overflow: visible; }
html body .tabs a { display: none; flex: 1 1 0; min-width: 0; flex-direction: column; justify-content: center; gap: 3px; padding: 6px 2px; min-height: 48px; font-size: 11px; text-align: center; }
html body .tabs a em, html body .tabs a.on::before { display: none; }
html body .tabs a span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%; }
html body .tabs a[data-r=""], html body .tabs a[data-r="signals"], html body .tabs a[data-r="referrals"], html body .tabs a[data-r="wallets"], html body .tabs a.tabs-mas { display: flex; }
html body .tabs a.tabs-mas svg { fill: currentColor; stroke: none; }
html body.mas-abierto .tabs { position: fixed; left: 0; right: 0; bottom: 0; z-index: 70; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 4px; padding: 12px 8px calc(10px + env(safe-area-inset-bottom)); background: var(--color-paper-2); border-top: 1px solid var(--color-rule); border-radius: 16px 16px 0 0; }
html body.mas-abierto .tabs a { display: flex; }
html body.mas-abierto::before { content: ""; position: fixed; inset: 0; z-index: 69; background: rgb(0 0 0 / .55); }
html body.mas-abierto #lang { display: flex; position: fixed; right: 12px; bottom: calc(190px + env(safe-area-inset-bottom)); z-index: 71; }
html body main { padding-bottom: calc(84px + env(safe-area-inset-bottom)); }

/* ---------- Pulse: one list, the page scrolls ---------- */
html body .pulse-head { gap: 6px; margin-bottom: 6px; }
html body .pulse-title, html body .pulse-live { display: none; }
html body .pulse-tools { display: flex; flex-wrap: nowrap; gap: 6px; overflow-x: auto; scrollbar-width: none; width: 100%; }
html body .pulse-tools::-webkit-scrollbar { display: none; }
html body .pulse-tools .chips { flex: none; flex-wrap: nowrap; }
html body .pulse-tools .chips.tog [data-ptog="sound"], html body .pulse-tools .chips.tog [data-pkeys], html body .pulse-tools .chips.tog [data-keys] { display: none; }
html body .pm-tabs { display: flex; position: sticky; top: 0; z-index: 5; gap: 2px; margin: 0 -8px 6px; padding: 4px 8px; overflow-x: auto; scrollbar-width: none; background: var(--color-paper); border-bottom: 1px solid var(--color-rule); }
html body .pm-tabs::-webkit-scrollbar { display: none; }
html body .pm-tabs button { flex: 1 0 auto; min-height: 40px; padding: 0 10px; border: 0; border-bottom: 2px solid transparent; background: transparent; color: var(--color-ink-2); font: 650 13px var(--font-body); white-space: nowrap; cursor: pointer; }
html body .pm-tabs button.on { color: var(--color-ink); border-bottom-color: var(--color-up); }
html body .pulse.four[data-m] .pcol { display: none; }
html body .pulse.four[data-m="new"] .pcol[data-col="new"], html body .pulse.four[data-m="running"] .pcol[data-col="running"], html body .pulse.four[data-m="stretch"] .pcol[data-col="stretch"], html body .pulse.four[data-m="migrated"] .pcol[data-col="migrated"] { display: flex; }
html body .pulse.four .pcol, html body .pulse .pcol { height: auto; max-height: none; min-height: 0; border-left: 0; border-right: 0; border-radius: 0; }
html body .pulse.four { margin: 0 -8px; height: auto; }
html body .pcol-body { overflow: visible; }
html body .pcol header, html body .pulse.four .pcol header { flex-wrap: nowrap; padding: 6px 8px; gap: 6px; }
html body .pcol header h2, html body .pcol header .pcount { display: none; }
html body .pcol header .pcol-tools { flex: 1 1 auto; flex-basis: auto; min-width: 0; gap: 6px; }
html body .pcol-q { flex: 1 1 auto; width: auto; min-width: 0; font-size: 16px; }
html body .pcol-q:focus { width: auto; flex-basis: auto; }
html body .psort { flex: 0 1 96px; min-width: 0; }

/* the rows: what decides a click, and a button a thumb can hit */
html body .pr { gap: 8px; padding: 10px 8px; }
html body .pr .r3 .sc:nth-child(n+4), html body .pr .r3 .flag:not(.bad) { display: none; }
html body .pr .pr-why, html body .pr .pr-tri, html body .pr .tri-why { display: none; }
html body .pr .qb { min-height: 40px; min-width: 64px; font-size: 13px; }
html body .pr .pr-quick .qb:not(.main) { display: none; }

/* ---------- a coin page ---------- */
html body.coin-mode main { padding: 6px 6px calc(140px + env(safe-area-inset-bottom)); }
html body .cp-main, html body .cp-chart, html body .cp-body, html body .cp-side, html body .cp-side > * { min-width: 0; max-width: 100%; }
html body .cp-chart { overflow: hidden; }
html body .cp-head { gap: 8px; padding: 8px; }
html body .cp-stats { gap: 4px 14px; }
html body .cp-mc b { font-size: 20px; }
html body .cp-quick { display: none; }
html body .tc-head { flex-wrap: nowrap; gap: 6px; overflow-x: auto; scrollbar-width: none; margin-bottom: 4px; padding-bottom: 2px; }
html body .tc-head::-webkit-scrollbar { display: none; }
html body .tc-head > * { flex: none; }
html body .tc-ohlc, html body .tc-src { display: none; }
html body .cp-chart .tc-canvas { height: 300px; }
html body .cp-side { grid-template-columns: minmax(0, 1fr); }
html body .cp-mbar { position: fixed; left: 0; right: 0; bottom: calc(60px + env(safe-area-inset-bottom)); z-index: 30; display: grid; grid-template-columns: 1fr 1fr; gap: 8px; padding: 6px 8px; background: var(--color-paper-2); border-top: 1px solid var(--color-rule); }
html body .cp-mbtn { min-height: 44px; border: 0; border-radius: 10px; font: 700 15px var(--font-body); color: #06110a; cursor: pointer; }
html body .cp-mbtn.buy { background: var(--color-up); }
html body .cp-mbtn.sell { background: var(--color-down); color: #fff; }
html body .pins { bottom: calc(118px + env(safe-area-inset-bottom)); }

/* ---------- forms and dialogs ---------- */
html body input, html body select, html body textarea { font-size: 16px; }
html body .pins-in { font-size: 16px; }
html body .wal-box, html body .qedit { max-width: calc(100vw - 16px); }
html body .tp-sl, html body .pins-b { min-height: 40px; }

/* ---------- second pass, after looking at each screen at 375 px ---------- */
/* the figures strip takes half a phone's screen above every page */
html body .strip, html body #presencia { display: none; }
/* signing in comes with connecting: until a wallet is connected, one button */
html body .topbar-right:has(#wal .wal-connect) #cuenta { display: none; }
/* a wide table made the chart wider than its card, which cut the price axis off */
html body .cp-main { grid-template-columns: minmax(0, 1fr); width: 100%; }
html body .cp-main > * { min-width: 0; max-width: 100%; }
html body .cp-tab, html body .cp-tw, html body .cp-filters { min-width: 0; max-width: 100%; }
html body .cp-tw { overflow-x: auto; }
html body .cp-filters { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
/* the More sheet sits above its backdrop */
html body.mas-abierto .side { z-index: 72; }
html body.mas-abierto #lang { bottom: calc(262px + env(safe-area-inset-bottom)); z-index: 73; }
html body.mas-abierto .tabs a { min-height: 56px; }