/* Mobile + modal scrollbar. Desktop layout lives in app.css and is not changed. */

.ld-modal-card {
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.ld-modal-card::-webkit-scrollbar {
  width: 0;
  height: 0;
  display: none;
}

@media (max-width: 960px) {
  html, body, .bg, .layout, .main, .content { overflow-x: hidden; }

  .input, select.input, textarea.input {
    font-size: 16px;
    max-width: 100%;
  }

  .page-head-row { align-items: flex-start; gap: 0.75rem; }
  .page-head-actions,
  .page-head-actions .row { width: 100%; }
  .page-head-actions .btn,
  .page-head-row > .btn,
  .page-head-row > .row .btn {
    flex: 1 1 auto;
    min-height: 42px;
  }

  .vault-hero,
  .vault-hero.shop { height: 168px; }
  .vault-body { margin-top: -56px; padding: 0 1rem 1.1rem; }
  .vault-balance { font-size: 1.55rem; word-break: break-word; }
  .wh-tile { padding: 0.7rem 0.75rem; min-width: 0; }
  .wh-tile b { font-size: 0.98rem; word-break: break-word; }

  .gta-panel { padding: 0.95rem 1rem; }
  .gta-panel.table-wrap {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }
  .gta-panel.table-wrap::-webkit-scrollbar { display: none; }
  .table-wrap { -webkit-overflow-scrolling: touch; scrollbar-width: none; }
  .table-wrap::-webkit-scrollbar { display: none; }
  table.data th,
  table.data td { padding: 0.7rem 0.75rem; }

  .vault-tx { display: grid; grid-template-columns: 1fr auto; gap: 0.35rem 0.75rem; }
  .vault-tx-meta,
  .vault-tx-who span { white-space: normal; }

  .gta-filter { flex-direction: column; }
  .gta-filter .input,
  .gta-filter .btn { width: 100%; min-width: 0; }

  .gta-dossier-head,
  .gta-wanted,
  .gta-dip { flex-direction: column; align-items: stretch; }
  .gta-dossier-nick { word-break: break-word; }
  .ld-actions { justify-content: flex-start; }

  .gta-menu { grid-template-columns: 1fr 1fr; }
  .gta-menu-item { padding: 0.85rem 0.9rem; min-height: 72px; }

  .ld-modal { align-items: flex-end; padding: 0; background: rgba(0, 0, 0, 0.72); }
  .ld-modal-card {
    max-width: none;
    max-height: min(92dvh, 92vh);
    border-radius: 16px 16px 0 0;
    padding: 1.2rem 1.1rem calc(1.15rem + env(safe-area-inset-bottom));
  }
  .ld-modal-actions { flex-wrap: nowrap; }
  .ld-modal-actions .btn { flex: 1; min-height: 44px; }

  .hub-wrap { overflow-x: hidden; overflow-y: auto; -webkit-overflow-scrolling: touch; }
  .hub-inner {
    padding-top: max(1.15rem, env(safe-area-inset-top));
    padding-bottom: max(2rem, env(safe-area-inset-bottom));
  }
  .hub-brand-title { font-size: 1.15rem; letter-spacing: 0.08em; }
  .hub-title { font-size: 1.7rem; }
  .hub-lead { font-size: 0.92rem; }
  .hub-card-photo { height: 118px; }

  .nav a { min-height: 44px; }
  .sidebar { width: min(300px, 86vw); }

  .auth-wrap {
    padding: max(1.25rem, env(safe-area-inset-top)) 1rem max(1.25rem, env(safe-area-inset-bottom));
    align-items: start;
  }
  .auth-card { padding: 1.5rem 1.2rem; }
  .row, .btn { max-width: 100%; }
}

@media (max-width: 640px) {
  .gta-menu { grid-template-columns: 1fr; }
  .hub-modules { grid-template-columns: 1fr 1fr; gap: 0.7rem; }
  .hub-card-photo { height: 96px; }
  .hub-card-body { padding: 0.05rem 0.8rem 0.9rem; }
  .hub-card-name { font-size: 0.92rem; }
  .hub-card-kicker {
    font-size: 0.6rem;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
  .vault-hero,
  .vault-hero.shop { height: 148px; }
  .page-title { font-size: 1.2rem; }
  .top-date { display: none; }
  .top-user .name {
    max-width: 110px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
}