/* Responsive ring of saved trips; only transform and opacity animate. */
#accountTripList { display:block; min-width:0; container-type:inline-size; }
#accountTripList .library-trip-grid {
  --trip-card-width:min(80cqw,clamp(240px,24cqw,360px),max(180px,48svh)); --trip-card-height:calc(var(--trip-card-width) * 1.3);
  --trip-paper:#f7fbff; --trip-soft:#dbe9f4;
  position:relative; display:block; height:calc(var(--trip-card-height) + 96px); max-height:none;
  max-width:1600px; margin:0 auto; padding:0; overflow:hidden; border-radius:22px; isolation:isolate; perspective:1500px;
  background:radial-gradient(ellipse at 50% 55%,#fff,#f1f7fd 60%,#eaf3fb); touch-action:pan-y;
}
#accountTripList .library-trip-track { position:absolute; inset:0; }
#accountTripList .library-trip-slot {
  position:absolute; left:50%; top:56px; width:var(--trip-card-width); height:var(--trip-card-height);
  min-width:0; padding:0; border:0; border-radius:18px;
  transform:translateX(-50%) translate3d(var(--ring-x,0px),var(--ring-y,0px),var(--ring-z,0px)) rotateY(var(--ring-turn,0deg)) scale(var(--ring-scale,1));
  opacity:var(--ring-opacity,1); transition:none;
}
body.trip-home-active .trip-home-library #accountTripList .account-trip-row.library-trip-slot { background:transparent; border:0; box-shadow:none; }
#accountTripList .library-trip-card {
  position:relative; width:100%; height:100%; display:flex; flex-direction:column; isolation:isolate;
  border:1px solid rgba(222,236,247,.5); border-radius:18px; background:var(--wash);
  box-shadow:0 10px 22px rgba(17,41,61,.10); transition:transform 300ms cubic-bezier(.22,.61,.36,1);
}
#accountTripList .library-trip-card::after {
  content:""; position:absolute; inset:0; border-radius:inherit; pointer-events:none; z-index:1;
  background:#e5eff9; opacity:var(--ring-shade,0);
}
#accountTripList .library-trip-slot:not([data-ring-active="true"]):not([data-ring-hovered="true"]) .account-trip-actions,
#accountTripList .library-trip-slot:not([data-ring-active="true"]):not([data-ring-hovered="true"]) .library-trip-arrow { opacity:0; pointer-events:none; }
#accountTripList .account-trip-copy { opacity:var(--ring-copy,1); transition:opacity 300ms ease; }
#accountTripList [data-ring-side="right"] .account-trip-copy { text-align:right; }
#accountTripList [data-ring-hovered="true"] .account-trip-copy { opacity:1; text-align:left; }
#accountTripList [data-ring-hovered="true"] .library-trip-card::after { opacity:0; }
#accountTripList .account-trip-actions,#accountTripList .library-trip-arrow { transition:opacity 300ms ease; }
#accountTripList .library-trip-open {
  position:static; display:flex; flex-direction:column; align-items:stretch;
  flex:1; min-height:0; min-width:0; width:100%; gap:0; padding:0;
  overflow:visible; border:0; border-radius:17px 17px 0 0;
  color:var(--trip-paper); background:transparent; box-shadow:none;
  transform:none; transition:none;
}
#accountTripList .library-trip-thumbnail {
  position:absolute; inset:0; z-index:-2; display:block;
  width:100%; height:100%; border-radius:17px; object-fit:cover;
}
#accountTripList .library-trip-card::before {
  content:""; position:absolute; inset:0; z-index:-1;
  border-radius:17px; pointer-events:none;
  background:linear-gradient(180deg,rgba(8,27,40,.76),rgba(8,27,40,.56) 24%,rgba(8,27,40,.06) 43%,rgba(8,27,40,.04) 54%,rgba(8,27,40,.64) 72%,rgba(8,27,40,.88));
}
#accountTripList .account-trip-copy { min-width:0; padding:18px 16px 0; }
#accountTripList .account-trip-copy strong {
  display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden;
  color:var(--trip-paper); font-size:17px; line-height:24px; font-weight:500; min-height:0;
}
#accountTripList .account-trip-copy > span { color:var(--trip-soft); font-size:12px; line-height:1.5; margin-top:6px; }
#accountTripList .library-trip-arrow {
  position:absolute; top:auto; right:14px; bottom:88px; width:auto; height:36px; display:flex; gap:8px; padding:0 12px; border-radius:18px; font-size:13px; font-weight:600;
  color:var(--trip-paper); background:rgba(13,52,80,.9);
}
#accountTripList .account-trip-actions {
  display:flex; flex-wrap:wrap; gap:0; align-items:center;
  padding:8px 4px 6px; margin:0 10px; border-top:1px solid rgba(230,244,255,.18);
}
#accountTripList .account-trip-actions > span {
  display:block; flex:0 0 100%; padding:0 5px; color:var(--trip-soft); font-size:12px; line-height:20px;
}
#accountTripList .account-trip-actions button {
  flex:1; min-height:44px; padding:0 4px; border:0;
  color:var(--trip-paper); font-size:13px; white-space:nowrap;
  background:transparent; box-shadow:none; transition:none; transform:none;
}
#accountTripList .account-trip-actions .danger { color:#dbe9f4; font-size:12px; }
#accountTripList .account-trip-actions .danger:is(:hover,:focus-visible) { color:#ffd2cd; }
#accountTripList .library-trip-card button:focus-visible { outline:2px solid #acd9fa; outline-offset:-3px; }
#accountTripList .library-trip-card button:active { opacity:.75; filter:none; }
#accountTripList .library-trip-card button:disabled { opacity:.5; cursor:not-allowed; }

#accountTripList .library-trip-grid:not(:has(.library-trip-slot)) { height:auto; min-height:140px; }
#accountTripList .library-trip-grid:not(:has(.library-trip-slot)) .library-trip-track { position:relative; padding:36px 24px; }
#accountTripList .library-trip-open:hover { background:transparent; }
#accountTripList .account-trip-actions button:hover { background:rgba(225,241,252,.14); }
@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference) {
  #accountTripList .library-trip-card { transform:translate3d(var(--hover-shift,0px),0,0); }
  #accountTripList [data-ring-hovered="true"] .library-trip-card { transform:translate3d(0,-30px,0) scale(1.06); }

}
@container (max-width:650px) {
  #accountTripList .library-trip-grid { height:calc(var(--trip-card-height) + 84px); }
}
@container (max-width:650px) { #accountTripList .library-trip-slot { top:44px; } }
@media (prefers-reduced-motion:reduce) { #accountTripList .library-trip-card { transition:none; } }
#accountTripList .library-ring-controls {
  display:flex; align-items:center; justify-content:center; gap:12px; width:min(310px,100%); min-width:0;
  padding:12px 4px 0; margin:0 auto;
}
#accountTripList .library-ring-label,#accountTripList .library-ring-count { flex:none; color:#526b83; font-size:12px; font-variant-numeric:tabular-nums; }
#accountTripList .library-ring-track { position:relative; display:block; flex:1; height:44px; min-width:48px; }
#accountTripList .library-ring-ticks { display:flex; align-items:center; justify-content:space-between; position:absolute; inset:0 5px; pointer-events:none; }
#accountTripList .library-ring-ticks i { width:1px; height:6px; background:#71869e; opacity:.7; }
#accountTripList input[data-trip-scrubber] {
  position:absolute; inset:0; appearance:none; -webkit-appearance:none; width:100%; height:44px; min-height:44px;
  margin:0; padding:0; border:0; background:transparent; box-shadow:none; cursor:ew-resize;
}
#accountTripList input[data-trip-scrubber]::-webkit-slider-runnable-track { height:44px; background:transparent; }
#accountTripList input[data-trip-scrubber]::-webkit-slider-thumb { appearance:none; -webkit-appearance:none; width:3px; height:16px; margin-top:14px; background:#146eb0; border:0; border-radius:2px; }
#accountTripList input[data-trip-scrubber]::-moz-range-track { height:44px; background:transparent; }
#accountTripList input[data-trip-scrubber]::-moz-range-thumb { width:3px; height:16px; background:#146eb0; border:0; border-radius:2px; }
#accountTripList .library-ring-controls :focus-visible { outline:2px solid #298fd0; outline-offset:3px; }
@container (max-width:350px) {
  #accountTripList .library-ring-controls { gap:8px; }
  #accountTripList .library-ring-label,#accountTripList .library-ring-count { font-size:12px; }
}

/* Scoped photo labels override the shared badge's dark-on-white treatment. */
#accountTripList .account-trip-copy .trip-creator-badge {
  max-width:100%; width:fit-content; gap:6px; margin-top:8px; padding:3px 7px 3px 3px;
  color:#f7fbff !important; background:rgba(8,27,40,.78); border-radius:16px;
}
#accountTripList .account-trip-copy .trip-creator-badge > span:last-child { color:#f7fbff !important; font-size:12px !important; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
#accountTripList .trip-creator-avatar { width:22px; height:22px; min-width:22px; flex-basis:22px; }
#accountTripList .library-trip-arrow svg { width:16px; height:16px; flex:none; }
#accountTripList .library-ring-track { border-radius:6px; }
#accountTripList .library-ring-track:focus-within { background:#e5f0fa; }
#accountTripList .library-stats span,#accountTripList .library-list-heading > span { color:#526b83; font-size:12px; }
body.trip-home-active .trip-home-library #accountTripsHead #newAccountTrip { background:#1475b9; color:#fff; }
#accountTripList .library-trip-grid::after {
  content:""; position:absolute; top:50%; left:12px; width:9px; height:9px;
  border:solid #2c6995; border-width:0 0 2px 2px; transform:rotate(45deg);
  opacity:0; pointer-events:none; z-index:250; transition:opacity 180ms ease;
}
#accountTripList .library-trip-grid[data-edge-direction]::after { opacity:.8; }
#accountTripList .library-trip-grid[data-edge-direction="right"]::after { left:auto; right:12px; transform:rotate(225deg); }
@media (max-width:680px) {
  body.trip-home-active .trip-home-library .account-trips-head { gap:12px; }
  body.trip-home-active .trip-home-library .account-trips-head p { margin-top:6px; }
  body.trip-home-active .trip-home-library .account-trip-search-bar { margin:12px 0 8px; gap:8px; }
  body.trip-home-active #accountTripList .library-stats { padding:8px 0 12px; gap:10px; }
  body.trip-home-active #accountTripList .library-stats strong { font-size:22px; line-height:1.2; }
  body.trip-home-active #accountTripList .library-stats span { margin-top:4px; line-height:1.4; }
  body.trip-home-active #accountTripList .library-list-heading { padding:12px 0 10px; }
}

#accountTripList .library-trip-grid[data-ring-count="2"] { max-width:calc(var(--trip-card-width) * 2.3 + 48px); }