/* UX cleanup — preserve Trippbo color tokens and existing cards.
   The changes below adjust spacing, reading order and progressive disclosure only. */
.ux-trip-quick-actions{
  display:flex;flex-wrap:wrap;align-items:flex-start;gap:10px;margin:12px 0 19px;
}
.ux-trip-quick-actions .ux-quick-link{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  min-height:42px;white-space:normal;text-align:center;
}
.ux-trip-join{min-width:0;max-width:100%}
.ux-trip-join>summary{list-style:none;cursor:pointer}
.ux-trip-join>summary::-webkit-details-marker{display:none}
.ux-trip-join[open]{flex-basis:100%}
.ux-trip-join>.trip-collab-join{margin:11px 0 0;max-width:760px}
.ux-trip-join .trip-join-form{max-width:700px}
.ux-trip-main-heading{margin:12px 0 11px}
.ux-trip-main-heading h2{font-size:clamp(20px,2vw,25px);margin:0}
.ux-trip-main .travel-grid{margin-top:0}
.ux-trip-main .trip-cover:not(img){height:125px}
.ux-trip-main .trip-info{padding:13px 16px}
.ux-trip-main+.trip-flashbacks{margin-top:23px}

.ux-collapsible,.ux-trip-photo-tools{margin:14px 0}
.ux-collapsible>summary,.ux-trip-photo-tools>summary{
  display:flex;align-items:center;gap:8px;list-style:none;
  cursor:pointer;font-weight:800;color:var(--text);line-height:1.5;
}
.ux-collapsible>summary::-webkit-details-marker,
.ux-trip-photo-tools>summary::-webkit-details-marker{display:none}
.ux-collapsible>summary::after,.ux-trip-photo-tools>summary::after{
  content:'⌄';color:var(--muted);margin-inline-start:auto;font-size:20px;line-height:1;
}
.ux-collapsible[open]>summary::after,.ux-trip-photo-tools[open]>summary::after{content:'⌃'}
.ux-details-body{padding-top:13px}
.ux-trip-photo-tools{padding:13px 16px;background:var(--surface2);border:1px solid var(--border);border-radius:15px}
.ux-trip-photo-tools .section-sub{margin:0 0 8px}
.ux-trip-photo-tools .section-sub h3{font-size:16px}
.ux-trip-photo-tools .form-grid{margin:0}
.ux-trip-photo-tools .trip-photo-upload{margin:8px 0}
.ux-dated-memories .timeline-list{margin-top:4px}
.ux-trip-saved-places{margin:18px 0}
.ux-trip-invite-options,.ux-trip-danger{position:relative;min-width:0}
.ux-trip-invite-options>summary,.ux-trip-danger>summary{
  list-style:none;cursor:pointer;display:inline-flex;gap:8px;align-items:center;
}
.ux-trip-invite-options>summary::-webkit-details-marker,
.ux-trip-danger>summary::-webkit-details-marker{display:none}
.ux-trip-invite-options[open],.ux-trip-danger[open]{
  flex-basis:100%;width:100%;border:1px solid var(--border);
  background:var(--surface2);padding:10px;border-radius:14px;
}
.ux-trip-invite-options[open]>summary,.ux-trip-danger[open]>summary{margin-bottom:9px}
.ux-trip-invite-options .trip-collab-actions{margin:0}
.ux-trip-danger>button{margin-top:4px}

.post .ux-post-fallback,.post-detail .ux-post-fallback,.ux-post-fallback{
  height:145px;min-height:110px;gap:6px;padding:15px;
}
.ux-post-fallback svg{width:30px;height:30px}
.ux-post-fallback span{font-size:14px;font-weight:800}
.post-body .caption-title{margin:1px 0 5px}
.post-body .caption-sub{margin:8px 0 12px}
.ux-post-engagement{border-top:1px solid var(--border);padding-top:9px}
.ux-post-engagement .post-actionbar{margin:0}
.ux-post-ai-actions{margin-top:9px;display:flex;flex-wrap:wrap;gap:7px;align-items:center}
.ux-action-more{min-width:0}
.ux-action-more>summary,.ux-story-options>summary{
  cursor:pointer;list-style:none;color:var(--muted);font-size:12px;font-weight:800;
  border:1px solid var(--border);border-radius:10px;padding:7px 11px;
  display:inline-flex;align-items:center;min-height:34px;
}
.ux-action-more>summary::-webkit-details-marker,
.ux-story-options>summary::-webkit-details-marker{display:none}
.ux-action-more[open]{flex-basis:100%}
.ux-action-more>button{display:inline-flex;margin-top:7px}
.ux-inline-options{margin-inline-start:auto;position:relative}
.ux-inline-options>summary{
  cursor:pointer;list-style:none;display:grid;place-items:center;
  width:36px;height:36px;border-radius:10px;color:var(--text);
}
.ux-inline-options>summary::-webkit-details-marker{display:none}
.ux-inline-options>summary:hover{background:var(--surface2)}
.ux-inline-options-menu{padding:8px 0}
.ux-inline-options-menu .btn{white-space:nowrap}
.ux-story-heading{padding-top:13px}
.ux-story-heading h2{font-size:clamp(22px,2.5vw,28px);margin:0 0 7px}
.ux-story-heading p:last-child{margin-bottom:6px}
.ux-story-heading+.post-detail-actions{margin:7px 0 16px}
.ux-moments-more{margin-top:10px}
.ux-moments-more>summary{list-style:none;cursor:pointer;font-weight:800;color:var(--primary);padding:7px 0}
.ux-moments-more>summary::-webkit-details-marker{display:none}
.ux-moments-more>p:first-of-type{margin-top:9px}
.ux-story-options{margin-top:13px}
.ux-story-options .ux-details-body{padding-top:8px}
.ux-story-options .btn{width:auto}
:where(.ux-collapsible,.ux-trip-photo-tools,.ux-trip-join,.ux-trip-invite-options,
.ux-trip-danger,.ux-inline-options,.ux-action-more,.ux-moments-more,.ux-story-options)>summary:focus-visible{
  outline:3px solid var(--primary);outline-offset:3px;border-radius:9px;
}
@media(max-width:620px){
  .ux-trip-quick-actions{gap:8px;margin:10px 0 14px}
  .ux-trip-quick-actions .ux-quick-link{font-size:12px;padding:9px 12px}
  .ux-trip-main-heading{margin:10px 0}
  .ux-trip-main .travel-grid{gap:11px}
  .ux-trip-main .trip-cover:not(img){height:115px}
  .post .ux-post-fallback,.ux-post-fallback{height:123px;min-height:105px}
  .post-body{padding:12px 16px 16px}
  .ux-post-ai-actions>.btn{flex:1 1 auto}
  .ux-story-heading{padding-top:9px}
  .ux-story-heading+.post-detail-actions{margin-bottom:11px}
  .ux-trip-invite-options[open],.ux-trip-danger[open]{padding:8px}
}

/* Desktop sizing cleanup — targeted at Explore and Story Details.
 * Keep existing theme tokens and do not override mobile/tablet navigation. */
@media (min-width: 851px) {
  /* Fixed desktop tracks stop 1–2 trending places from filling an entire row. */
  .ux-explore-trending{
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:16px;
    margin-bottom:20px;
  }
  .ux-explore-trending.ux-count-1{
    grid-template-columns:minmax(0,1fr);
    max-width:390px;
  }
  .ux-explore-trending.ux-count-2{
    grid-template-columns:repeat(2,minmax(0,1fr));
    max-width:810px;
  }
  .ux-explore-trending .trend-tile img,
  .ux-explore-trending .trend-tile .explore-art{
    height:118px;
    object-fit:cover;
  }
  .ux-explore-trending .trend-tile>div:last-child{
    padding:12px 15px;
    gap:5px;
  }
  .ux-explore-trending .trend-tile strong{font-size:15px;line-height:1.35}
  .ux-explore-trending .trend-tile small{font-size:13px;line-height:1.5}

  /* Use all three tracks for populated results; use two properly sized
     columns for two stories rather than leaving an overly large empty slot. */
  .ux-explore-stories{
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:18px;
    align-items:stretch;
  }
  .ux-explore-stories.ux-count-1{
    grid-template-columns:minmax(0,1fr);
    max-width:450px;
  }
  .ux-explore-stories.ux-count-2{
    grid-template-columns:repeat(2,minmax(0,1fr));
    max-width:920px;
  }
  .ux-explore-stories .explore-card{
    min-width:0;
    display:flex;
    flex-direction:column;
  }
  .ux-explore-stories .explore-card img,
  .ux-explore-stories .explore-card .explore-art{
    height:170px;
    flex-shrink:0;
    object-fit:cover;
  }
  .ux-explore-stories .explore-meta{
    padding:14px 16px;
    display:grid;
    gap:5px;
  }
  .ux-explore-stories .explore-meta strong{
    font-size:16px;
    line-height:1.4;
    overflow-wrap:anywhere;
  }
  .ux-explore-stories .explore-meta small{
    font-size:13px;
    line-height:1.5;
    overflow-wrap:anywhere;
  }

  /* An empty traveler discovery strip needn't consume vertical desktop space.
     Still show a no-results message during an active search. */
  .ux-explore-travelers-empty-head,
  .ux-explore-travelers-empty{display:none}

  /* Story: slightly wider reading column and more legible supporting text. */
  .cols.ux-desktop-story{
    grid-template-columns:minmax(0,1fr) minmax(250px,270px);
    gap:22px;
    align-items:start;
  }
  .ux-desktop-story>section,
  .ux-desktop-story>.right-box{min-width:0}
  .ux-desktop-story>section>article.card{
    padding:22px;
  }
  .ux-desktop-story .ux-story-heading h2{
    font-size:26px;
    line-height:1.28;
  }
  .ux-desktop-story .ux-story-heading .post-description{
    font-size:15px;
    line-height:1.65;
  }
  .ux-desktop-story .ux-story-heading .muted.small,
  .ux-desktop-story>section>article .small.muted{
    font-size:14px;
    line-height:1.5;
  }
  .ux-desktop-story>section>article .name{
    font-size:15px;
    line-height:1.4;
  }
  .ux-desktop-story .post-detail-actions{
    gap:14px;
    padding-block:11px;
  }
  .ux-desktop-story .post-detail-actions .bare,
  .ux-desktop-story .comment,
  .ux-desktop-story .map-summary{
    font-size:15px;
    line-height:1.65;
  }
  .ux-desktop-story .map-summary{
    padding:17px 20px;
  }
  .ux-desktop-story .map-summary p{
    line-height:1.55;
    margin-bottom:8px;
  }
  .ux-desktop-story .map-summary p:last-child{margin-bottom:0}
  .ux-desktop-story .right-box .card-pad{padding:20px}
  .ux-desktop-story .right-box h3{
    font-size:18px;
    margin-bottom:16px;
  }
  .ux-desktop-story .right-box p{
    font-size:14px;
    line-height:1.6;
    margin-bottom:13px;
  }
  .ux-desktop-story .right-box .btn{min-height:40px}
}
@media (min-width:851px) and (max-width:1120px){
  .ux-explore-trending.ux-count-3,
  .ux-explore-stories.ux-count-3{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .cols.ux-desktop-story{
    grid-template-columns:minmax(0,1fr) 250px;
    gap:18px;
  }
  .ux-desktop-story>section>article.card{padding:19px}
}