.saved-hub { padding:var(--space-8) 0 var(--space-10); min-height:70vh; }
.saved-hub [hidden] { display:none !important; }
.saved-hub>.wrap { max-width:1120px; }
.saved-hub-heading { margin-block:var(--space-5); }
.saved-hub h1 { font-size:var(--text-xl); margin-bottom:var(--space-2); }
.saved-hub-heading p,.saved-hub-caption { color:var(--color-text-muted); }
.saved-category-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--space-5); padding-block:var(--space-5); }
.saved-category { display:flex; flex-direction:column; min-width:0; padding:var(--space-5); border:1px solid var(--color-border); border-radius:var(--radius-md); background:var(--color-surface); color:var(--color-text); text-decoration:none; }
.saved-category:hover,.saved-category:focus-visible { border-color:var(--color-primary); background:var(--color-surface-2); }
.saved-category-name { font-size:var(--text-lg); font-weight:600; line-height:1.3; }
.saved-category-count { font-size:var(--text-sm); color:var(--color-primary); font-variant-numeric:tabular-nums; margin-top:var(--space-2); }
.saved-category-description { color:var(--color-text-muted); font-size:var(--text-sm); margin-block:var(--space-4); }
.saved-category-open { display:flex; align-items:center; justify-content:space-between; gap:var(--space-2); margin-top:auto; padding-top:var(--space-3); border-top:1px solid var(--color-divider); font-size:var(--text-sm); font-weight:600; color:var(--color-primary); }
.saved-hub-back { display:inline-flex; align-items:center; min-height:44px; font-size:var(--text-sm); margin-block:var(--space-3); text-decoration:underline; }
.saved-hub #saved-hub-detail { padding:0; }
.saved-detail-heading { display:flex; justify-content:space-between; align-items:center; gap:var(--space-3); flex-wrap:wrap; margin-block:var(--space-3) var(--space-5); }
.saved-detail-heading h2 { font:600 var(--text-xl)/1.3 var(--font-body); }
.saved-detail-heading p,.saved-hub-caption { font-size:var(--text-sm); margin-block:var(--space-2); }
.saved-hub [data-saved-panel] { margin-top:var(--space-4); }
.saved-hub .fav-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
.saved-hub .fav-tile-title,.saved-hub .fav-tile-meta { overflow-wrap:anywhere; }
.saved-hub .fav-tile--linked { position:relative; }
.saved-hub .fav-tile--linked:hover { border-color:var(--color-primary); }
.saved-item-link { display:flex; align-items:center; justify-content:space-between; gap:var(--space-3); color:var(--color-text); text-decoration:none; }
.saved-item-link::after { content:""; position:absolute; inset:0; border-radius:var(--radius-md); }
.saved-item-link>span { color:var(--color-primary); flex:none; }
.saved-item-link:focus-visible::after { outline:2px solid var(--color-primary); outline-offset:3px; }
.saved-hub .fav-tile--linked .fav-tile-remove { position:relative; z-index:1; }
.saved-item-unavailable { margin-top:var(--space-2); font-size:var(--text-xs); color:var(--color-text-muted); }
.saved-hub .fav-empty { padding:var(--space-5); }
.saved-hub .saved-river-alerts { margin-top:var(--space-8); padding:var(--space-5) 0 0; border-top:1px solid var(--color-divider); }
.saved-river-alerts h3 { font:600 var(--text-lg)/1.3 var(--font-body); margin-bottom:var(--space-4); }
.saved-river-alerts .fav-empty-inline { margin:0; font-size:var(--text-sm); }
.saved-river-alerts .btn { margin-top:var(--space-3); }
.saved-hub-notice { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:var(--space-3); padding:var(--space-4); margin-block:var(--space-4); background:var(--color-surface); border:1px solid var(--color-border); border-radius:var(--radius-md); }
.saved-hub-notice p { margin:0; }
.saved-hub button,.saved-hub .btn { min-height:44px; }
.saved-hub .fav-tile-remove { min-width:44px; }
.saved-hub a:focus-visible,.saved-hub button:focus-visible { outline:2px solid var(--color-primary); outline-offset:3px; }
/* Saved › Trip plans: each plan as a card, drawn by account.js (renderSavedPlansSection). */
.trip-cards { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--space-5); }
.trip-card { display:flex; flex-direction:column; overflow:hidden; background:var(--color-surface); border:1px solid var(--color-border); border-radius:var(--radius-xl); box-shadow:var(--shadow-sm); }
.trip-card__media { position:relative; aspect-ratio:800/421; overflow:hidden; background:linear-gradient(135deg,var(--color-surface-2),var(--color-surface-offset)); }
.trip-card[data-trip-status="loading"] .trip-card__media { animation:trip-pulse 1.4s ease-in-out infinite; }
.trip-card__photo { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.trip-card__fish { position:absolute; left:10%; top:8%; width:80%; height:70%; object-fit:contain; }
.trip-card__tags { position:absolute; left:var(--space-3); bottom:var(--space-3); right:64px; display:flex; flex-wrap:wrap; gap:var(--space-2); }
.trip-card__tag { display:inline-flex; align-items:center; gap:6px; padding:4px 10px; border-radius:var(--radius-full); background:color-mix(in srgb,var(--color-surface) 94%,transparent); color:var(--color-text); font-size:var(--text-xs); font-weight:600; box-shadow:var(--shadow-sm); }
.trip-card__tag img { width:36px; height:16px; object-fit:contain; }
.saved-hub .trip-card__remove { position:absolute; top:var(--space-2); right:var(--space-2); width:44px; height:44px; display:grid; place-items:center; padding:0; border:0; border-radius:var(--radius-full); background:color-mix(in srgb,var(--color-surface) 92%,transparent); color:var(--color-text); font-size:22px; line-height:1; cursor:pointer; box-shadow:var(--shadow-sm); }
.saved-hub .trip-card__remove:hover { color:var(--color-error); }
.trip-card__body { flex:1; display:flex; flex-direction:column; gap:var(--space-3); padding:var(--space-5); }
.trip-card__eyebrow { margin:0; font-size:var(--text-xs); font-weight:600; letter-spacing:.06em; text-transform:uppercase; color:var(--color-text-muted); }
.trip-card__title { margin:0; font-family:var(--font-display); font-size:var(--text-xl); line-height:1.2; }
.trip-card__title a { color:var(--color-text); text-decoration:none; }
.trip-card__title a:hover { color:var(--color-primary); text-decoration:underline; }
.trip-card__from { margin:calc(-1 * var(--space-2)) 0 0; font-size:var(--text-sm); color:var(--color-text-muted); }
.trip-card__live { display:flex; flex-direction:column; gap:var(--space-3); }
.trip-card__pick { display:flex; flex-direction:column; gap:2px; padding:var(--space-3) var(--space-4); background:var(--color-surface-2); border-left:3px solid var(--color-primary); border-radius:var(--radius-md); }
.trip-card__label { font-size:var(--text-xs); font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--color-primary); }
.trip-card__pick--out { border-left-color:var(--color-warning); }
.trip-card__pick--out .trip-card__label { color:var(--color-warning); }
.trip-card__area,.trip-card__walk { font-size:var(--text-sm); color:var(--color-text-muted); }
.trip-card__badges { display:flex; flex-wrap:wrap; align-items:center; gap:var(--space-1) var(--space-3); margin-top:var(--space-1); }
.trip-card .river-flow-badge { cursor:default; }
.trip-card__warn { margin-top:var(--space-1); font-size:var(--text-sm); color:var(--color-warning); }
.trip-card__facts { display:flex; flex-direction:column; gap:var(--space-2); margin:0; }
.trip-card__facts>div { display:grid; grid-template-columns:7rem minmax(0,1fr); gap:var(--space-3); }
.trip-card__facts dt { padding-top:2px; font-size:var(--text-xs); font-weight:700; letter-spacing:.04em; text-transform:uppercase; color:var(--color-text-muted); }
.trip-card__facts dd { margin:0; font-size:var(--text-sm); }
.trip-card__also { margin:0; font-size:var(--text-sm); color:var(--color-text-muted); }
.trip-card__also span { display:block; font-size:var(--text-xs); font-weight:700; letter-spacing:.04em; text-transform:uppercase; }
.trip-card__note { margin:0; font-size:var(--text-sm); color:var(--color-text-muted); }
.trip-card__skeleton span { display:block; height:14px; margin-bottom:var(--space-3); border-radius:var(--radius-sm); background:var(--color-surface-2); animation:trip-pulse 1.4s ease-in-out infinite; }
.trip-card__skeleton span:first-child { height:76px; }
.trip-card__skeleton span:nth-child(2) { width:85%; } .trip-card__skeleton span:nth-child(3) { width:70%; } .trip-card__skeleton span:nth-child(4) { width:55%; }
.trip-card__open { margin-top:auto; align-self:flex-start; }
.trip-cards__note { margin:var(--space-4) 0 0; font-size:var(--text-sm); color:var(--color-text-muted); }
.saved-hub .trip-cards__upgrade { padding:0; border:0; background:none; color:var(--color-primary); font:inherit; font-weight:600; text-decoration:underline; cursor:pointer; }
@keyframes trip-pulse { 50% { opacity:.55; } }
@media(prefers-reduced-motion:reduce){ .trip-card[data-trip-status="loading"] .trip-card__media,.trip-card__skeleton span { animation:none; } }
@media(max-width:700px){
  .saved-hub { padding-top:var(--space-4); }
  .saved-category-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--space-3); }
  .saved-category { padding:var(--space-4); }
  .saved-category-name { font-size:var(--text-base); }
  .saved-category-description { display:none; }
  .saved-category-open { margin-top:var(--space-4); font-size:var(--text-xs); }
  .saved-hub .fav-grid { grid-template-columns:1fr; }
  .trip-cards { grid-template-columns:1fr; }
  .trip-card__body { padding:var(--space-4); }
  .trip-card__facts>div { grid-template-columns:6rem minmax(0,1fr); }
}
@media(max-width:350px){.saved-category-grid{grid-template-columns:1fr;}}
