/* Loaded after the shared styles: focused phone overrides, desktop unchanged. */
@media (min-width:601px) {
  .mobile-court-agenda,
  .mobile-timeline-toggle { display:none; }
  .calendar-timeline { display:block; }
}

@media (max-width:600px) {
  .sidebar .nav,
  .sidebar .nav a { min-width:0; }
  .sidebar .nav a span { max-width:100%; overflow-wrap:anywhere; }
  .topbar .icon-btn,
  .modal-head .icon-btn,
  .lineup-sheet-close {
    width:44px;
    min-width:44px;
    height:44px;
    min-height:44px;
    flex-shrink:0;
  }
  .directory-player .btn,
  .directory-toolbar input,
  .directory-toolbar button {
    min-height:44px;
  }

  .calendar-court-filters {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
    width:100%;
    max-width:100%;
  }
  .calendar-court-filters .filter {
    min-width:0;
    min-height:44px;
    white-space:normal;
    overflow-wrap:anywhere;
    justify-content:center;
  }
  .mobile-court-agenda { display:grid; gap:14px; margin:18px 0; }
  .mobile-court-day {
    min-width:0;
    padding:14px;
    border:1px solid var(--line);
    border-radius:6px;
    background:var(--white);
  }
  .mobile-court-day-head {
    display:flex;
    justify-content:space-between;
    align-items:baseline;
    flex-wrap:wrap;
    gap:6px 10px;
    margin-bottom:12px;
  }
  .mobile-court-day-head h2,
  .mobile-court-day-head h3 { font-size:16px; line-height:1.35; }
  .mobile-court-day-head>span,
  .mobile-court-day-head>small { font-size:11px; color:var(--muted); }
  .mobile-calendar-event {
    display:block;
    width:100%;
    min-width:0;
    min-height:48px;
    margin:8px 0;
    padding:12px;
    border:1px solid var(--line);
    border-radius:5px;
    background:var(--paper);
    color:var(--ink);
    font:inherit;
    font-size:13px;
    line-height:1.5;
    text-align:left;
    overflow-wrap:anywhere;
  }
  .mobile-calendar-event strong,
  .mobile-calendar-event span { display:block; }
  .mobile-calendar-event span { font-size:12px; color:var(--muted); }
  .mobile-calendar-empty {
    margin:8px 0 12px;
    font-size:13px;
    line-height:1.6;
    color:var(--muted);
  }
  .mobile-calendar-book,
  .mobile-timeline-toggle {
    display:flex;
    align-items:center;
    justify-content:center;
    width:100%;
    min-width:0;
    min-height:44px;
    white-space:normal;
    overflow-wrap:anywhere;
    text-align:center;
  }
  .mobile-timeline-toggle { margin:18px 0 12px; }
  .calendar-timeline { display:none; }
  .calendar-timeline.is-open { display:block; }
  .calendar-day-activity { display:none; }

  .overlay {
    padding:max(8px,env(safe-area-inset-top)) 8px max(8px,env(safe-area-inset-bottom));
  }
  .modal,
  .modal.wide,
  .modal.booking-modal {
    padding:16px;
    max-height:calc(100dvh - max(8px,env(safe-area-inset-top)) - max(8px,env(safe-area-inset-bottom)));
    scroll-padding-block:12px 100px;
    overscroll-behavior:contain;
  }
  .modal .modal-head,
  .modal.booking-modal .modal-head {
    gap:12px;
    padding-bottom:12px;
    margin-bottom:16px;
  }
  .modal-head>div { min-width:0; }
  .modal-head h2 {
    font-size:22px;
    line-height:1.2;
    overflow-wrap:anywhere;
  }
  .modal-head .eyebrow {
    font-size:9px;
    letter-spacing:.1em;
  }
  .modal-head p { font-size:12px; line-height:1.5; }
  .modal-footer {
    position:sticky;
    bottom:0;
    gap:8px;
    padding:12px 0 max(4px,env(safe-area-inset-bottom));
    background:var(--white);
    border-top:1px solid var(--line);
  }
  .modal-footer .btn {
    flex:1 1 108px;
    min-width:0;
    min-height:48px;
    padding:11px 10px;
    white-space:normal;
    text-align:center;
    overflow-wrap:anywhere;
  }
  .modal input,
  .modal select,
  .modal textarea {
    max-width:100%;
    min-width:0;
    font-size:16px;
    scroll-margin-block:12px 100px;
  }

  /* The action fields come before the optional visual explanation. */
  .find-workspace { gap:16px; }
  .find-workspace #find-form { order:0; min-width:0; }
  .find-workspace #find-preview {
    order:1;
    grid-template-columns:minmax(0,1fr) 90px;
    gap:10px;
    padding:12px;
  }
  .find-workspace #find-preview .court-stage { max-width:90px; }
  .find-workspace .find-preview-head h3 { font-size:15px; }
  .find-workspace .find-preview-head p { font-size:11px; margin-bottom:0; }
  .find-workspace #find-preview>.small-note { font-size:10px; line-height:1.5; }
  .modal:has(.find-workspace) .modal-head>div>p { display:none; }
  .find-workspace .intent-choice span { min-height:72px; padding:10px 4px; }
  .find-workspace #find-form>.info-banner { margin-top:14px; }

  /* The touch picker stays inside the visible phone viewport, including a short one. */
  .lineup-experience.has-selection .lineup-experience-roster {
    left:max(8px,env(safe-area-inset-left));
    right:max(8px,env(safe-area-inset-right));
    bottom:max(8px,env(safe-area-inset-bottom));
    max-height:min(65dvh,calc(100dvh - 24px - env(safe-area-inset-top) - env(safe-area-inset-bottom)));
    min-height:0;
    padding:14px;
    overflow:auto;
    overscroll-behavior:contain;
    scroll-padding-block:8px;
  }
  .lineup-experience.has-selection .lineup-experience-picker-head { padding-right:48px; }
  .lineup-sheet-close { top:8px; right:8px; }
  .lineup-experience.has-selection .lineup-experience-roster-list,
  .modal.has-court-experience .lineup-experience.has-selection .lineup-experience-roster-list,
  .modal.booking-modal .lineup-experience.has-selection .lineup-experience-roster-list {
    min-height:0;
    max-height:min(280px,27dvh);
    flex:0 1 auto;
  }
}

@media (max-width:360px) {
  .modal,
  .modal.wide,
  .modal.booking-modal { padding:14px; }
  .modal-head h2 { font-size:21px; }
  .modal-footer .btn { gap:6px; font-size:12px; }
  .find-workspace #find-preview {
    grid-template-columns:minmax(0,1fr) 80px;
  }
  .find-workspace #find-preview .court-stage { max-width:80px; }
}

@media (max-width:600px) {
  .person-card>div { min-width:0; flex:1; overflow-wrap:anywhere; }
  .person-card .avatar { flex-shrink:0; }
  .person-card h3,
  .person-card strong { overflow-wrap:anywhere; }
}
