/* ===================== Responsive ===================== */
@media (max-width: 1240px) {
  .strips { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dash-chart-wide { grid-template-columns: 1fr; }
}
@media (max-width: 1100px) {
  .hz-split { grid-template-columns: minmax(0, 1fr); }
  .pulse { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pulse-cell:nth-child(3) { border-left: none; }
  .pulse-cell:nth-child(n+3) { border-top: 1px solid var(--border-soft); }
}
@media (max-width: 900px) {
  .grid-2 { grid-template-columns: 1fr; }
}
/* Phones and small tablets: the sidebar becomes a bottom tab bar. */
@media (max-width: 820px) {
  .app { display: block; }
  .mobile-top {
    display: flex; align-items: center; justify-content: space-between; gap: 12px;
    position: sticky; top: 0; z-index: 30; padding: 12px 16px;
    background: rgba(5, 9, 8, .78); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
    border-bottom: 1px solid var(--border-soft);
  }
  .mobile-top .brand-mark { width: 32px; height: 32px; border-radius: 9px; }
  .mobile-top .brand-text b { font-size: 15px; }
  .mobile-top .avatar { width: 32px; height: 32px; }
  .sidebar {
    position: fixed; top: auto; left: 10px; right: 10px; bottom: calc(10px + env(safe-area-inset-bottom));
    width: auto; height: var(--tabbar-h); z-index: 35; padding: 6px;
    border: 1px solid var(--border); border-radius: 22px;
    background: rgba(13, 21, 19, .9); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);
    box-shadow: var(--shadow);
  }
  .sidebar-brand, .sidebar-foot, .nav-label { display: none; }
  .nav { flex-direction: row; gap: 2px; height: 100%; }
  .nav .nav-item { flex: 1; flex-direction: column; justify-content: center; gap: 4px; padding: 6px 2px; font-size: 11.5px; border-radius: 16px; text-align: center; min-width: 0; }
  .nav .nav-item .ni { width: auto; }
  .nav .nav-item.active { background: var(--text); color: #07100d; }
  .nav .nav-item.active .ni { color: #07100d; }
  .nav .nav-item.active::after { display: none; }
  .nav .nav-item[data-mobile="more"] { display: none; }
  .nav-more { display: flex; }
  .nav-more.active { background: var(--text); color: #07100d; }
  .main { padding: 20px 16px calc(var(--tabbar-h) + 34px + env(safe-area-inset-bottom)); }
  .view-head { align-items: flex-start; margin-bottom: 18px; }
  .view-head h1 { font-size: 26px; }
  .view-head > div:first-child { min-width: 0; flex: 1 1 100%; }
  .head-tools { width: 100%; }
  .head-tools .input-sm { flex: 1 1 100%; width: 100%; min-width: 0; }
  .strips { grid-template-columns: 1fr; }
  .tbl thead th:first-child, .tbl tbody td:first-child { position: sticky; left: 0; background: var(--panel); z-index: 1; }
  .drawer { top: auto; left: 0; right: 0; bottom: 0; width: 100%; max-width: 100%; max-height: 88vh; border-radius: 24px 24px 0 0; animation: sheet-in .35s var(--ease); }
  .modal-backdrop { place-items: end center; padding: 0; }
  .modal { border-radius: 24px 24px 0 0; max-height: 92vh; }
  .ann-card { flex-direction: column; }
  .toast { bottom: calc(var(--tabbar-h) + 26px); }
}
@media (max-width: 640px) {
  .hz-problem { grid-template-columns: minmax(0, 1fr) auto; }
  .hz-problem .badge { grid-column: 1 / -1; width: fit-content; }
  .hz-bar { display: none; }
  .pulse-cell { padding: 18px 16px; }
  .pulse-cell .p-val { font-size: 26px; }
  .plan-fields { grid-template-columns: 1fr 1fr; }
  .ann-compose-row select { flex: 1; width: auto; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}
.plan-row input, .plan-row select { font-size: 13px; padding: 9px 12px; }
.plan-weight-help, .plan-row .hint { font-size: 12px; color: var(--muted); line-height: 1.5; }
