/* Phone / tablet / laptop. Loaded last. */
html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}
html, body { overflow-x: hidden; max-width: 100%; }
body { overflow-wrap: anywhere; word-wrap: break-word; }
img, svg, video { max-width: 100%; height: auto; }
button, a, input, select, textarea { max-width: 100%; }
input, select, textarea { font-size: 16px; }
h1, h2, h3, h4, p, li, td, th, label, b, small, span { overflow-wrap: anywhere; }

.table-wrap,
.sr-card:has(.sr-table),
.card,
.block {
  max-width: 100%;
  -webkit-overflow-scrolling: touch;
}

@media (max-width: 1280px) {
  .owner-desk { padding: 16px 16px 12px; gap: 16px; }
  .wrap { padding-left: 16px; padding-right: 16px; }
  .ed-pills { flex-wrap: wrap; }
}

@media (max-width: 1100px) {
  .shift-week { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .desk-2, .desk-3, .cal-panel { grid-template-columns: 1fr; }
  .vv-meet, .vv-cl-book, .vv-ed-cols, .vv-pay-ways { grid-template-columns: 1fr; }
}

@media (max-width: 900px) {
  .grid-3, .grid-2, .fields, .passport, .feat-grid { grid-template-columns: 1fr; }
  .more-grid { grid-template-columns: 1fr 1fr; }
  .owner-desk { grid-template-columns: 1fr; padding: 12px; }
  .owner-rail { position: static; }
  .owner-rail nav {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4px;
  }
  .owner-rail nav a { min-height: 40px; display: flex; align-items: center; }
  .wrap { padding: 12px; }
  .topbar { padding: 10px 12px; flex-wrap: wrap; }
  .role-switch { width: 100%; overflow-x: auto; flex-wrap: nowrap; -webkit-overflow-scrolling: touch; padding-bottom: 2px; }
  .role-switch button { flex: 0 0 auto; min-height: 36px; }
  .who span { display: none; }
  .subnav { padding: 10px 12px 0; }
  .admin-shell { grid-template-columns: 1fr; }
  .kpis { grid-template-columns: 1fr 1fr; }
  .shift-week { grid-template-columns: 1fr 1fr; }
  .block-head { flex-wrap: wrap; }
  .h { font-size: 22px; }
  .login-card { padding: 24px 18px 20px; border-radius: 22px; }
  .brand-name { font-size: 28px; }
  .backdrop { padding: 12px; align-items: end; }
  .modal { width: 100%; border-radius: 18px 18px 12px 12px; }
  .toast { width: calc(100% - 24px); left: 12px; transform: none; bottom: calc(12px + env(safe-area-inset-bottom)); }
  .vv-meet-stage { min-height: 200px; }
  .vv-meet-self { width: 78px; }
  .vv-meet-self img { height: 56px; }
  .vv-meet-who { left: 12px; bottom: 64px; }
  .vv-meet-who b { font-size: 16px; }
  .vv-ico { min-width: 52px; font-size: 10px; }
  .vv-ico i { width: 44px; height: 44px; }
  .vv-meet-bar { gap: 10px; padding: 10px 10px 12px; }
  .chat-form { flex-wrap: wrap; }
  .chat-form input { min-width: 0; }
  .row { flex-wrap: wrap; }
  .slot { grid-template-columns: 48px 1fr; }
  .slot > :last-child { grid-column: 2; }
}

@media (max-width: 720px) {
  .pet-card, .home-pet { width: 100%; flex: 1 1 100%; }
  .home-pet .shot { height: 168px; }
  .passport-card { grid-template-columns: 1fr; }
  .passport-card .shot { height: 200px; width: 100%; }
  .more-grid { grid-template-columns: 1fr; }
  .kpis { grid-template-columns: 1fr 1fr; }
  .home-hero h1 { font-size: 20px; }
  .home-hero > img { height: 168px; }
  .cal.big i { min-height: 48px; padding: 4px; }
  .cal.big i small { font-size: 9px; padding: 0 3px; }
  .owner-rail nav { grid-template-columns: 1fr 1fr; }
  .btn { min-height: 44px; }
  .btn-sm { min-height: 36px; }
  .subnav a, .subnav button, .tabs button { min-height: 40px; padding: 10px 12px; }
  .login { padding: 20px 12px 32px; }
  .demo-banner { font-size: 11px; letter-spacing: 0.04em; padding: 0 8px; text-align: center; white-space: normal; height: auto; min-height: 22px; line-height: 1.3; }
  .h, .home-hero h1, .sr-title, .ed-head h1, .brand-name { overflow-wrap: anywhere; white-space: normal; }
  .ed-head .lead, .ed-pills a, .btn, .vv-meet-form .btn { white-space: normal; }
  table.data,
  .sr-table,
  .ed-table,
  .sr-lab table,
  table.data thead, table.data tbody, table.data th, table.data td, table.data tr,
  .sr-table thead, .sr-table tbody, .sr-table th, .sr-table td, .sr-table tr,
  .ed-table thead, .ed-table tbody, .ed-table th, .ed-table td, .ed-table tr,
  .sr-lab table thead, .sr-lab table tbody, .sr-lab table th, .sr-lab table td, .sr-lab table tr {
    display: block; width: 100%; min-width: 0;
  }
  table.data thead, .sr-table thead, .ed-table thead, .sr-lab table thead { display: none; }
  table.data tr, .sr-table tr, .ed-table tr, .sr-lab table tr {
    padding: 10px 0; border-bottom: 1px solid rgba(0,0,0,0.08);
  }
  table.data td, .sr-table td, .ed-table td, .sr-lab table td { padding: 3px 0; border: 0; }
  .ed-table-card, .sr-lab { overflow: visible; }
  .ed-head h1, .ed-head .lead { height: auto; white-space: normal; overflow: visible; text-overflow: unset; }
  .ed-pills a { white-space: normal; }
  .sr-st, .sr-merck-th, .sr-btn-out { white-space: normal; }
  .sr-feed-cta { grid-template-columns: 40px 1fr; }
  .sr-feed-cta > :last-child { grid-column: 2; }
}

@media (max-width: 420px) {
  .kpis { grid-template-columns: 1fr; }
  .shift-week { grid-template-columns: 1fr; }
  .role-switch button { font-size: 11px; padding: 6px 8px; }
}

@media (max-width: 900px) {
  .side {
    position: fixed; left: 0; top: var(--banner-h); bottom: 0;
    width: min(260px, 86vw); z-index: 70; height: auto;
    transform: translateX(-105%);
    transition: transform 0.2s ease;
  }
  .side.open { transform: translateX(0); }
  .side-mask {
    display: block; position: fixed;
    inset: var(--banner-h) 0 0 0;
    background: rgba(26, 46, 36, 0.38); z-index: 65;
  }
  .menu-toggle { display: inline-flex; min-height: 40px; min-width: 40px; }
}
