/* Applied when html.mal-phone is set. Do not use width-only media — some phones report 980px. */
html.mal-phone,
html.mal-phone body {
  overflow-x: hidden !important;
  max-width: 100% !important;
}

html.mal-phone .hero-root,
html.mal-phone .hero-stage,
html.mal-phone #root {
  overflow-x: hidden !important;
  max-width: 100% !important;
}

html.mal-phone .hero-eye-hot,
html.mal-phone .hero-media-fan,
html.mal-phone .hero-media-scrim,
html.mal-phone .hero-full-btn,
html.mal-phone .hero-my-btn,
html.mal-phone .hero-menu-pipe,
html.mal-phone .hero-menu-pipe-realty,
html.mal-phone .hero-menu-pipe-realty-glow,
html.mal-phone .gate-marks,
html.mal-phone .gate-quote,
html.mal-phone .gate-quote-ko,
html.mal-phone .gate-meta,
html.mal-phone .gate-tagline,
html.mal-phone .gate-footer,
html.mal-phone .hero-cal-soon {
  display: none !important;
}

html.mal-phone .hero-logo-icon,
html.mal-phone .gate-logo-icon {
  height: 34px !important;
  width: 34px !important;
}
html.mal-phone .hero-logo-word,
html.mal-phone .gate-logo-word {
  font-size: 26px !important;
  transform: none !important;
}
html.mal-phone .hero-logo-lockup,
html.mal-phone .gate-logo-lockup {
  gap: 6px !important;
  top: max(4px, env(safe-area-inset-top, 0px)) !important;
  left: max(8px, env(safe-area-inset-left, 0px)) !important;
}

html.mal-phone .mal-dday {
  left: auto !important;
  right: max(8px, env(safe-area-inset-right, 0px)) !important;
  top: max(4px, env(safe-area-inset-top, 0px)) !important;
  height: 40px !important;
}
html.mal-phone .mal-dday-n {
  font-size: 1.45rem !important;
  letter-spacing: 0.03em;
}

html.mal-phone .hero-dock {
  gap: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  left: 0 !important;
  right: 0 !important;
  transform: none !important;
  justify-content: space-around !important;
  flex-wrap: nowrap !important;
  bottom: 0 !important;
  padding: 2px 0 calc(6px + env(safe-area-inset-bottom, 0px)) !important;
  background: linear-gradient(180deg, transparent, rgba(5, 7, 13, 0.82) 36%);
}
html.mal-phone .hero-dock-item {
  flex: 1 1 0;
  min-width: 0;
  font-size: 8px !important;
  letter-spacing: 0.02em !important;
  margin-right: 0 !important;
  padding: 8px 1px 6px !important;
}

html.mal-phone .hero-menu-layer {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  align-content: start !important;
  align-items: stretch !important;
  justify-items: stretch !important;
  gap: 8px !important;
  inset: 0 !important;
  padding:
    calc(52px + env(safe-area-inset-top, 0px))
    10px
    calc(62px + env(safe-area-inset-bottom, 0px)) !important;
  overflow: auto !important;
  -webkit-overflow-scrolling: touch;
}

html.mal-phone .hero-menu-card,
html.mal-phone .hero-menu-card.is-realty {
  position: relative !important;
  left: auto !important;
  top: auto !important;
  right: auto !important;
  bottom: auto !important;
  transform: none !important;
  width: auto !important;
  max-width: none !important;
  min-width: 0 !important;
  opacity: 1 !important;
  animation: none !important;
  aspect-ratio: 16 / 10;
  height: auto !important;
  border-radius: 12px !important;
}

html.mal-phone .hero-menu-card-body {
  left: 8px !important;
  right: 8px !important;
  bottom: 8px !important;
}
html.mal-phone .hero-menu-label { font-size: 12px !important; }
html.mal-phone .hero-menu-sub { font-size: 10px !important; }

html.mal-phone .menu-panel-root,
html.mal-phone .menu-panel-root.is-fixed-viewport {
  padding: 0 !important;
  inset: 0 !important;
  place-items: stretch !important;
}
html.mal-phone .menu-panel-card,
html.mal-phone .menu-panel-root.is-fixed-viewport .menu-panel-card,
html.mal-phone .menu-panel-root[data-width="1200"].is-fixed-viewport .menu-panel-card,
html.mal-phone .menu-panel-root[data-width="1520"].is-fixed-viewport .menu-panel-card,
html.mal-phone .menu-panel-root[data-width="1360"].is-fixed-viewport .menu-panel-card {
  width: 100% !important;
  max-width: 100% !important;
  height: 100dvh !important;
  max-height: 100dvh !important;
  border-radius: 0 !important;
  overflow: auto !important;
  padding:
    max(8px, env(safe-area-inset-top, 0px))
    8px
    max(8px, env(safe-area-inset-bottom, 0px)) !important;
}
html.mal-phone .menu-panel-body,
html.mal-phone .menu-panel-root.is-fixed-viewport .menu-panel-body {
  overflow: auto !important;
  min-height: 0 !important;
}

html.mal-phone .mal-realty-stage {
  inset: 48px 0 54px !important;
  border-radius: 0 !important;
}
html.mal-phone .mal-realty-bar {
  flex-wrap: wrap;
  gap: 6px;
  padding: 8px;
}
html.mal-phone .mal-realty-bar button { padding: 7px 10px; }

html.mal-phone .hero-ls-stage,
html.mal-phone .hero-ls-stage:not(.is-embed),
html.mal-phone .mal-ls-signals {
  inset: 48px 8px 58px !important;
  width: auto !important;
  height: auto !important;
  max-height: none !important;
  grid-template-columns: 1fr !important;
  grid-template-rows: none !important;
  overflow: auto !important;
}
html.mal-phone .hero-ls-card {
  min-height: 0 !important;
  max-height: none !important;
}

html.mal-phone .portal-summary,
html.mal-phone .portal-summary.portal-total {
  left: 8px !important;
  right: 8px !important;
  width: auto !important;
  top: auto !important;
  bottom: calc(54px + env(safe-area-inset-bottom, 0px)) !important;
  height: min(58dvh, 480px) !important;
  max-height: min(58dvh, 480px) !important;
}

html.mal-phone .ls-namecard {
  left: 8px !important;
  right: 8px !important;
  width: auto !important;
  max-width: calc(100% - 16px) !important;
}

html.mal-phone .stock-tiles {
  --watch-cols: 2 !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}
html.mal-phone .stock-band--watch,
html.mal-phone .stock-band--positions,
html.mal-phone .stock-table-wrap,
html.mal-phone .stock-table-wrap.stock-table-wrap--seed,
html.mal-phone .stock-table-wrap--seed,
html.mal-phone .stock-body,
html.mal-phone .mal-stock-host,
html.mal-phone .mal-assets-host {
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: auto !important;
  overflow-y: auto !important;
}
html.mal-phone .stock-band--market,
html.mal-phone .dash-top,
html.mal-phone .net-worth,
html.mal-phone .cal-grid,
html.mal-phone .talon-main,
html.mal-phone .plan-stage,
html.mal-phone .wallet-hold {
  grid-template-columns: 1fr !important;
}
html.mal-phone .net-worth__parts {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

html.mal-phone .mal-quotes-host,
html.mal-phone .mal-quotes-chart,
html.mal-phone .etf-chart-card {
  width: 100% !important;
  max-width: 100% !important;
  height: min(52dvh, 380px) !important;
  max-height: min(52dvh, 380px) !important;
}

html.mal-phone .gate-content {
  justify-content: center !important;
  padding: calc(64px + env(safe-area-inset-top, 0px)) 14px 20px !important;
}
html.mal-phone .gate-panel,
html.mal-phone .gate-card {
  width: min(360px, 100%) !important;
}
html.mal-phone .gate-input {
  font-size: 16px !important;
  letter-spacing: 0.14em !important;
}

html.mal-phone .hero-shot,
html.mal-phone .gate-bg-video {
  object-position: 50% 30% !important;
}

html.mal-phone .hero-portal-orb-caption {
  left: 50% !important;
  top: calc(100% + 4px) !important;
  transform: translateX(-50%) !important;
  white-space: nowrap;
}

html.mal-phone .hero-portal-orb {
  display: none !important;
}

html.mal-phone .stock-slide,
html.mal-phone .mal-assets.solution {
  padding: 8px 8px 72px !important;
  height: auto !important;
  min-height: 100% !important;
  overflow: auto !important;
  gap: 6px !important;
}
html.mal-phone .stock-head,
html.mal-phone .solution-head {
  flex-wrap: wrap !important;
  gap: 6px !important;
  margin-bottom: 4px !important;
}
html.mal-phone .stock-head h2,
html.mal-phone .mal-assets h2 { font-size: 1.05rem !important; }
html.mal-phone .stock-head__actions {
  width: 100% !important;
  justify-content: flex-start !important;
  gap: 6px !important;
}
html.mal-phone .stock-hero,
html.mal-phone .stock-hero--split,
html.mal-phone .stock-hero--compact {
  grid-template-columns: 1fr !important;
  padding: 8px !important;
}
html.mal-phone .stock-hero__eval { border-right: 0 !important; padding: 4px 0 8px !important; }
html.mal-phone .stock-hold-list--alloc {
  flex-wrap: wrap !important;
  max-height: none !important;
}
html.mal-phone .stock-tiles {
  --watch-cols: 2 !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 6px !important;
}
html.mal-phone .stock-tiles--watch {
  grid-template-rows: none !important;
  height: auto !important;
  flex: 0 0 auto !important;
}
html.mal-phone .stock-tiles--watch .stock-tile,
html.mal-phone .stock-tile {
  min-height: 72px !important;
  height: auto !important;
  padding: 6px 8px !important;
}
html.mal-phone .stock-markets {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 6px !important;
}
html.mal-phone .stock-market { min-height: 56px !important; padding: 6px 8px !important; }
html.mal-phone .stock-table--holds { font-size: 11px !important; }
html.mal-phone .stock-table-wrap--seed,
html.mal-phone .stock-band--positions {
  height: auto !important;
  max-height: none !important;
  overflow: auto !important;
}

html.mal-phone .net-worth {
  grid-template-columns: 1fr !important;
  padding: 8px !important;
  margin-bottom: 6px !important;
}
html.mal-phone .net-worth__value { font-size: 1.25rem !important; }
html.mal-phone .net-worth__part { min-height: 48px !important; padding: 6px !important; }
html.mal-phone .dash-top {
  grid-template-columns: 1fr !important;
  gap: 6px !important;
  margin-bottom: 6px !important;
}
html.mal-phone .gold-hold,
html.mal-phone .wallet-hold {
  grid-template-columns: 1fr !important;
  padding: 8px !important;
  margin-bottom: 6px !important;
}
html.mal-phone .mal-assets .exchange-grid {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  grid-template-rows: auto !important;
  gap: 6px !important;
  flex: 0 0 auto !important;
  height: auto !important;
}
html.mal-phone .exchange-grid > .bithumb:not(.gate),
html.mal-phone .exchange-grid > .bithumb.gate,
html.mal-phone .exchange-grid > [data-gate],
html.mal-phone .exchange-grid > [data-gate2],
html.mal-phone .exchange-grid > [data-gate3],
html.mal-phone .exchange-grid > [data-gate4] {
  grid-column: auto !important;
  grid-row: auto !important;
}

html.mal-phone .plan-hold-grid {
  grid-template-columns: 1fr 1fr !important;
  grid-template-rows: auto !important;
  gap: 8px !important;
  min-height: 0 !important;
}
html.mal-phone .plan-hold-card {
  min-height: 96px !important;
  padding: 10px 10px 8px !important;
}
html.mal-phone .plan-hold-name { font-size: 12px !important; }
html.mal-phone .plan-hold-amt { font-size: 15px !important; }
html.mal-phone .plan-hold-share { font-size: 11px !important; }
html.mal-phone .plan-stage {
  padding-bottom: 64px !important;
  overflow: auto !important;
}

html.mal-phone .portal-summary,
html.mal-phone .portal-summary.portal-total {
  left: 8px !important;
  right: 8px !important;
  width: auto !important;
  max-width: none !important;
  top: calc(48px + env(safe-area-inset-top, 0px)) !important;
  bottom: calc(58px + env(safe-area-inset-bottom, 0px)) !important;
  height: auto !important;
  max-height: none !important;
  overflow: auto !important;
}

html.mal-phone .talon-main {
  grid-template-columns: 1fr !important;
  gap: 8px !important;
}
html.mal-phone .talon-plan-weights {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 6px !important;
}
html.mal-phone .talon-plan-weights > button {
  min-height: 108px !important;
}
html.mal-phone .talon-plan-media { min-height: 64px !important; }
html.mal-phone .talon-trade { padding: 8px !important; }

html.mal-phone .cal-grid {
  grid-template-columns: 1fr !important;
}

html.mal-phone .hero-ls-stage:not(.is-embed) .hero-ls-card {
  min-height: 200px !important;
}