/* Markets view navigation on phones (user picked A, 2026-10-29; markets-phone-nav.js). */
@media (max-width: 767px) {
  html.aiq-phone .mn-trig { display: none; }
  /* the 14 boxed tabs are replaced by one control; View settings keeps only its icon */
  html.aiq-phone .mkad-tabrow { gap: 8px; }
  html.aiq-phone .mkad-tabrow :is(.mkad-tabs, .mkad-tmore) { display: none !important; }
  html.aiq-phone .mkad-tabrow .mkad-blue > :is(span, svg:last-child) { display: none; }
  html.aiq-phone .mkad-tabrow .mkad-blue { width: 40px; padding: 0; justify-content: center; flex: none; }
  html.aiq-phone .mn-trig { display: flex; flex: 1 1 auto; min-width: 0; }
  html.aiq-phone .mn-trig > button { flex: 1 1 auto; min-width: 0; display: flex; align-items: center; gap: 8px; height: 40px; padding: 0 12px 0 8px;
    border: 0; border-radius: 10px; background: rgba(118,118,128,.12); color: var(--ph-ink); font: 600 15px Inter, sans-serif; text-align: left; }
  html.aiq-phone .mn-trig > button > span:not(.ic) { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  html.aiq-phone .mn-trig em { font: 500 12px Inter, sans-serif; color: var(--ph-mut); font-style: normal; }
  html.aiq-phone .mn-trig > button > i { color: var(--ph-mut); font-size: 13px; }
  /* the sheet */
  html.aiq-phone .mn-sheet .ph-pop-card { bottom: calc(64px + env(safe-area-inset-bottom)); }
  html.aiq-phone .mn-list { display: flex; flex-direction: column; }
  html.aiq-phone .mn-row { display: flex; align-items: center; gap: 12px; height: 44px; padding: 0 8px; border: 0; background: none; color: var(--ph-ink);
    font: 500 16px Inter, sans-serif; text-align: left; border-radius: 10px; }
  html.aiq-phone .mn-row > span:not(.ic) { flex: 1 1 auto; }
  /* the page's colour tile outside #mkad (the sheet lives on body) */
  html.aiq-phone .mn-sheet .ic { flex: none; display: inline-grid; place-items: center; width: 28px; height: 28px; border-radius: 8px; font-size: 15px;
    background: var(--tb, rgba(118,118,128,.14)); color: var(--tn, var(--ph-mut)); }
  html.aiq-phone .mn-row.on { background: rgba(118,118,128,.12); font-weight: 600; }
  html.aiq-phone .mn-row .ph-bold.ph-check { color: var(--ph-acc); }
}

/* The picker bar never shows on phones: the top-right three-bars button is the navigation (user, 2026-10-29). Done in CSS because
   every view switch re-renders the row, which dropped the .ph-nm-hide class markets() put on it. */
@media (max-width: 767px) {
  html.aiq-phone:is(.ph-nm-on, .ph-th-lite, .ph-th-on) .mkad-tabrow:not(#_):not(#_):not(#_) { display: none !important; }
  /* the view starts below the round button, so its filters never sit under it */
  html.aiq-phone.ph-nm-on:not(.ph-th-lite):not(.ph-th-on) .mkad-body:not(#_):not(#_) { padding-top: 56px; }
}

/* the three-bars dropdown on Markets: colourful icon tiles, same as the view tabs */
@media (max-width: 767px) {
  html.aiq-phone #ph-tabmenu button.mn-mi:not(#_):not(#_) { justify-content: flex-start; gap: 12px; }
  html.aiq-phone #ph-tabmenu button.mn-mi > span:not(.ic):not(#_) { flex: 1 1 auto; text-align: left; }
  html.aiq-phone #ph-tabmenu .mn-mi .ic:not(#_) { flex: none; display: inline-grid; place-items: center; width: 28px; height: 28px; border-radius: 8px; font-size: 15px;
    background: var(--tb, rgba(118,118,128,.14)); color: var(--tn, var(--ph-mut)); }
}

/* Overview: the index chips sit on the chart's top-left corner instead of a row of their own (user, 2026-10-29) */
@media (max-width: 767px) {
  html.aiq-phone:is(.ph-nm-on, .ph-th-lite, .ph-th-on) #mkad:has(.mkad-r3):not(#_) { position: relative; }
  html.aiq-phone:is(.ph-nm-on, .ph-th-lite, .ph-th-on) #mkad:has(.mkad-r3) .mkad-body:not(#_):not(#_) { padding-top: 0; }
  html.aiq-phone:is(.ph-nm-on, .ph-th-lite, .ph-th-on) #mkad .mkad-r3:not(#_):not(#_):not(#_) { position: absolute; z-index: 5; top: 8px; left: 8px; right: 72px; height: auto; padding: 0; border: 0;
    background: none; pointer-events: none; }
  html.aiq-phone:is(.ph-nm-on, .ph-th-lite, .ph-th-on) #mkad .mkad-r3 .mkad-pchips:not(#_):not(#_) { pointer-events: none; }
  html.aiq-phone:is(.ph-nm-on, .ph-th-lite, .ph-th-on) #mkad .mkad-r3 .mkad-pchip:not(#_):not(#_) { pointer-events: auto; }
}

/* Home and Explore: the header names the page, so their own big titles go */
@media (max-width: 767px) {
  html.aiq-phone.ph-th-lite :is(.hm-title, .ex-title):not(#_):not(#_) { display: none; }
}

@media (max-width: 767px) {
  html.aiq-phone.ph-th-lite .ph-h1-dup:not(#_):not(#_) { display: none !important; }
}

@media (max-width: 767px) {
  html.aiq-phone #ph-th .ph-th-logo:not(#_):not(#_) { flex: none; width: 28px; height: 28px; border-radius: 8px; object-fit: contain; background: #fff; border: 1px solid rgba(118,118,128,.25); padding: 2px; box-sizing: border-box; }
  /* an open investor / Congress member: their photo in place of the section icon (aiq-phone-tablehead.js) */
  html.aiq-phone #ph-th .ph-th-face:not(#_):not(#_) { flex: none; width: 28px; height: 28px; border-radius: 50%; object-fit: cover; object-position: 50% 20%; background: rgba(118,118,128,.12); }
  html.aiq-phone #ph-th .ph-th-t i[hidden]:not(#_):not(#_):not(#_) { display: none; }
}
