/* Home-screen mode uses the same authenticated, online monitor as Safari. */
html { -webkit-text-size-adjust: 100%; }
body.ph-console, body.login-body {
  min-height: 100vh;
  min-height: 100dvh;
}
@media (max-width: 900px) {
  .ph-console .ph-sidebar {
    padding-top: max(15px, env(safe-area-inset-top));
    padding-left: max(20px, env(safe-area-inset-left));
    padding-right: max(20px, env(safe-area-inset-right));
  }
  .ph-console .ph-main {
    padding-left: max(22px, env(safe-area-inset-left));
    padding-right: max(22px, env(safe-area-inset-right));
    padding-bottom: max(30px, env(safe-area-inset-bottom));
  }
  .login-body {
    padding: env(safe-area-inset-top) env(safe-area-inset-right)
      env(safe-area-inset-bottom) env(safe-area-inset-left);
  }
  .login-card input { font-size: 16px; }
  .ph-console .ph-dialog { max-height: 85dvh; overflow-y: auto; }
}
@media (max-width: 640px) {
  .ph-console .ph-sidebar {
    padding-top: max(12px, env(safe-area-inset-top));
    padding-left: max(15px, env(safe-area-inset-left));
    padding-right: max(15px, env(safe-area-inset-right));
  }
  .ph-console .ph-main {
    padding-left: max(15px, env(safe-area-inset-left));
    padding-right: max(15px, env(safe-area-inset-right));
  }
}

/* Compact navigation and status: keep useful monitor content in the first screen. */
@media (max-width: 760px) {
  .ph-console .ph-sidebar {
    flex-wrap: nowrap;
    gap: 9px;
    padding: max(8px, env(safe-area-inset-top)) max(12px, env(safe-area-inset-right))
      8px max(12px, env(safe-area-inset-left));
  }
  .ph-console .ph-brand { gap: 0; flex: none; }
  .ph-console .ph-brand > span:last-child { display: none; }
  .ph-console .ph-monogram { width: 30px; height: 34px; font-size: 18px; }
  .ph-console .ph-monogram > span { left: 8px; bottom: 7px; width: 15px; }
  .ph-console .ph-products {
    margin: 0;
    width: auto;
    flex: 1;
    justify-content: space-between;
    gap: 3px;
  }
  .ph-console .ph-products > a { font-size: 13px; padding: 11px 9px; min-height: 44px; }
  .ph-console .ph-products > a:first-child { font-size: 0; }
  .ph-console .ph-products > a:first-child::after { content: 'SP50'; font-size: 13px; }
  .ph-console .ph-main {
    padding: 12px max(12px, env(safe-area-inset-right))
      max(24px, env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-left));
  }
  .ph-console .ph-heading { display: block; margin-bottom: 10px; }
  .ph-console .ph-heading .ph-kicker { display: none; }
  .ph-console .ph-heading h1 { font-size: 24px; line-height: 1.25; margin-bottom: 7px; }
  .ph-console .ph-heading h1 > span { font-size: 21px; }
  .ph-console .ph-head-status {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px 8px;
    text-align: left;
  }
  .ph-console .ph-head-status .dw-badge { font-size: 12px; padding: 3px 6px; }
  .ph-console .ph-head-status .ph-link-state { font-size: 12px; }
  .ph-console .ph-head-status p { order: 1; width: 100%; margin: 0; font-size: 12px; line-height: 1.4; }
  .ph-console .ph-metrics { margin-bottom: 8px; }
  .ph-console .ph-metric { display: block; padding: 9px 10px; }
  .ph-console .ph-metric > span { display: block; font-size: 12px; margin-bottom: 3px; }
  .ph-console .ph-metric > strong { font-size: 25px; line-height: 1.1; }
  .ph-console .ph-metric .ph-inspection { font-size: 17px; }
  .ph-console .ph-metric small { display: block; font-size: 11px; line-height: 1.4; margin-top: 2px; }
  .ph-console .ph-metric em { font-size: 12px; margin-left: 4px; }
  .ph-console .ph-metric + .ph-metric::before { top: 10px; bottom: 10px; }
  .ph-console .ph-tabs { margin-bottom: 10px; gap: 0; }
  .ph-console .ph-tabs > div { width: 100%; gap: 0; }
  .ph-console .ph-tabs button { flex: 1; min-height: 44px; font-size: 14px; padding: 10px 5px; }
  .ph-console .ph-tabs [hidden] { display: none; }
  .ph-console .ph-tab-note { display: none; }
  .ph-console .dw-panel { padding: 12px; margin-bottom: 12px; }
  .ph-console .ph-controls-panel { padding: 12px !important; }
  .ph-console .dw-panel h2 { font-size: 18px; }
  .ph-console .dw-panel-head { margin-bottom: 8px; gap: 5px; }
  .ph-console .ph-position-panel .ph-section-label,
  .ph-console .ph-position-panel .dw-filters { display: none; }
  .ph-console #comparison-note { font-size: 12px; line-height: 1.5; margin: 0 0 8px; }
  .ph-console .dw-trade-card-head { padding: 9px 10px; gap: 6px; }
  .ph-console .dw-trade-identity { flex-wrap: wrap; gap: 5px 7px; }
  .ph-console .dw-trade-identity h3 { font-size: 18px; }
  .ph-console .dw-trade-status { font-size: 12px; }
  .ph-console .dw-trade-column { padding: 11px 10px; }
  .ph-console .dw-trade-column h4 { margin-bottom: 8px; font-size: 13px; }
  .ph-console .dw-price-row { margin-bottom: 8px; }
  .ph-console .dw-price-row span { font-size: 13px; }
  .ph-console .dw-price-row strong { font-size: 21px; }
  .ph-console .dw-trade-held .dw-holding-column { order: -1; border-top: 0; border-bottom: 1px solid var(--dw-line); }
}
