html,
body {
  width: 100%;
  max-width: none;
  overflow-x: hidden;
}

.app-shell {
  width: 100%;
  max-width: none;
  margin: 0;
  padding-left: max(10px, env(safe-area-inset-left));
  padding-right: max(10px, env(safe-area-inset-right));
}

.mobile-screens,
.screen,
.time-panel,
.pulse-panel,
.panel,
.market-chart-card,
.decision-chart-grid,
.chart-grid,
.activity-list {
  width: 100%;
  max-width: none;
}

.bottom-nav {
  left: 0;
  right: 0;
  width: 100%;
  max-width: none;
  transform: none;
  border-radius: 12px 12px 0 0;
  padding-left: max(8px, env(safe-area-inset-left));
  padding-right: max(8px, env(safe-area-inset-right));
}

.app-topbar .compact-controls,
.app-topbar .topbar-actions,
.topbar .compact-controls,
.topbar .topbar-actions,
.device-toggle,
.viewport-toggle,
.preview-toggle,
.layout-toggle,
.device-mode-toggle,
.view-mode-toggle,
[data-device-mode],
[data-layout-mode] {
  display: none !important;
}

.section-title-row,
.market-chart-head,
.home-chart-head,
.section-title-row > *,
.market-chart-head > *,
.home-chart-head > * {
  min-width: 0;
}

.section-title-row h1,
.section-title-row h2,
.market-chart-head h3,
.home-chart-head h3,
.market-chart-head p,
.home-chart-head p,
.market-chart-head span,
.home-chart-head span,
.home-chart-status,
.quiet-summary {
  overflow-wrap: anywhere;
}

.market-chart-head span,
.home-chart-head span {
  max-width: min(44%, 150px);
}

.home-mini-chart {
  min-height: clamp(260px, 62vw, 520px);
}

.chart-stage {
  height: clamp(380px, 72vw, 640px);
  min-height: clamp(380px, 72vw, 640px);
}

.decision-runtime-svg line[stroke-width="2.5"] {
  stroke-width: 1.35px !important;
}

.decision-runtime-svg line[stroke-width="1.5"][opacity=".7"] {
  stroke-width: 1px !important;
  opacity: .45 !important;
}

.decision-runtime-svg rect[fill="#f2b94c"],
.decision-runtime-svg rect[fill="#58d968"] {
  width: 62px !important;
  height: 21px !important;
  rx: 5px !important;
}

.decision-runtime-svg text[fill="#071014"] {
  font-size: 13px !important;
  font-weight: 900 !important;
}

@media (min-width: 560px) {
  .app-shell {
    padding-left: max(14px, env(safe-area-inset-left));
    padding-right: max(14px, env(safe-area-inset-right));
  }

  .screen.is-active {
    gap: 14px;
  }

  .home-mini-chart {
    min-height: clamp(340px, 54vw, 560px);
  }
}

@media (min-width: 720px) {
  .app-shell {
    padding-left: max(18px, env(safe-area-inset-left));
    padding-right: max(18px, env(safe-area-inset-right));
  }

  .home-mini-chart {
    min-height: clamp(380px, 50vw, 620px);
  }
}

@media (max-width: 620px) {
  .decision-runtime-svg rect[fill="#f2b94c"],
  .decision-runtime-svg rect[fill="#58d968"] {
    width: 56px !important;
    height: 19px !important;
  }

  .decision-runtime-svg text[fill="#071014"] {
    font-size: 12px !important;
  }
}

@media (max-width: 380px) {
  .section-title-row,
  .market-chart-head,
  .home-chart-head,
  .time-panel {
    grid-template-columns: 1fr;
  }

  .time-cell + .time-cell {
    border-left: 0;
    border-top: 1px solid var(--line);
  }

  .market-chart-head span,
  .home-chart-head span {
    max-width: 100%;
    text-align: left;
  }

  .home-chart-status,
  .quiet-summary {
    font-size: 11px;
  }

  .next-candle-pill {
    width: 100%;
    white-space: normal;
    text-align: center;
  }
}