/* Personal: interests, a map with attached memories, then two matching lists. */
#personal { padding-top:62px; padding-bottom:72px; }
#personal .screen-content { width:min(100%,820px); }
#personal .section-heading { margin-bottom:23px; }
#personal .personal-story { max-width:760px; }
#personal .personal-story p { font-size:16px; line-height:1.8; }
#personal .personal-pastimes { display:flex; align-items:baseline; flex-wrap:wrap; gap:9px 15px; margin-top:16px; font-size:14px; }
#personal .personal-pastimes .text-link { font-size:14px; }
#personal .pastime-dot { color:#bcc4cf; }
#personal .chess-panel { margin:18px 0 24px; width:min(100%,290px); }
#personal .chess-smallprint { justify-content:flex-end; margin-top:7px; }
#personal #chess-status { position:absolute; width:1px; height:1px; padding:0; margin:0; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; }
#personal h3 { font-size:15px; font-weight:500; letter-spacing:-.15px; }
#personal .travel-story { margin-top:36px; }
#personal .widget-heading { align-items:baseline; margin:0 0 8px; }
#personal .travel-subtitle { color:#939aa4; font-size:12px; margin-top:3px; }
#personal .map-controls { gap:2px; }
#personal .map-controls button { padding:2px 6px; font-size:12px; }
#personal .travel-stage { position:relative; height:405px; isolation:isolate; }
#personal .draggable-map { position:absolute; top:70px; left:0; width:100%; height:285px; background:transparent; border-radius:0; z-index:1; }
#personal .draggable-map path { fill:#e8edf3; stroke:#fff; stroke-width:.7; transition:fill .2s; }
#personal .draggable-map path[fill] { fill:#adc5e9; }
#personal .draggable-map .visited-country { cursor:inherit; }
#personal .draggable-map .photo-country-active { fill:#769ed8; }
#personal .photo-connections { position:absolute; inset:0; width:100%; height:100%; overflow:visible; pointer-events:none; z-index:2; }
#personal .photo-connections path { fill:none; stroke:#9bb4d4; stroke-width:1; stroke-dasharray:3 4; transition:stroke .2s; }
#personal .photo-connections path.is-active { stroke:#356ed8; stroke-width:1.3; }
#personal .travel-pin { cursor:default; outline:none; }
#personal .pin-halo { fill:#6290d2; fill-opacity:.12; }
#personal .pin-dot { fill:#517fbf; stroke:#fff; stroke-width:2; vector-effect:non-scaling-stroke; }
#personal .travel-pin.is-active .pin-dot, #personal .travel-pin:focus .pin-dot { fill:#245bb0; stroke-width:2.5; }
#personal .travel-pin.is-active .pin-halo, #personal .travel-pin:focus .pin-halo { fill-opacity:.25; }
#personal .map-postcards { display:contents; border:0; padding:0; margin:0; }
#personal .map-postcard { position:absolute; margin:0; cursor:default; width:138px; height:auto; padding:5px 5px 8px; background:#fff; border:1px solid #e4e8ee; border-radius:9px; overflow:visible; box-shadow:0 4px 12px #213b5910,0 1px 3px #213b5910; z-index:3; transition:transform .24s,box-shadow .24s; text-align:left; }
#personal .postcard-rainier { left:0; top:31px; transform:rotate(-6deg); }
#personal .postcard-thailand { left:46%; top:0; transform:rotate(4deg); }
#personal .postcard-new-zealand { right:0; top:65px; transform:rotate(6deg); }
#personal .postcard-argentina { left:6%; top:225px; transform:rotate(-4deg); }
#personal .postcard-argentina img { object-position:50% 92%; }
#personal .postcard-image { display:block; aspect-ratio:1.18; overflow:hidden; border-radius:5px; }
#personal .map-postcard img { width:100%; height:100%; display:block; object-fit:cover; }
#personal .postcard-rainier img { object-position:50% 68%; }
#personal .postcard-thailand img { object-position:50% 74%; }
#personal .postcard-new-zealand img { object-position:55% 50%; }
#personal .postcard-label { display:block; color:#414a57; font-size:12px; font-weight:500; line-height:1.3; padding:7px 3px 0; }
#personal .postcard-caption { display:block; color:#8a939e; font-size:10px; line-height:1.3; padding:3px 3px 0; }
#personal .map-postcard:hover, #personal .map-postcard:focus-visible, #personal .map-postcard.is-active { z-index:5; transform:translateY(-6px) rotate(0deg); box-shadow:0 12px 25px #213b591c,0 2px 5px #213b590b; }
#personal .personal-favorites { display:grid; grid-template-columns:1fr 1fr; gap:54px; align-items:start; margin-top:25px; }
#personal .music-card, #personal .shows-card { min-width:0; }
#personal .personal-favorites h3 { margin:0 0 17px; height:24px; line-height:24px; }
#personal .song-list, #personal .watch-list { display:grid; grid-template-rows:repeat(5,47px); gap:11px; padding:0; margin:0; list-style:none; }
#personal .song-row { display:flex; align-items:center; gap:12px; min-width:0; min-height:47px; }
#personal .song-row img { width:40px; height:40px; border-radius:5px; flex-shrink:0; }
#personal .song-row > span { min-width:0; max-width:none; }
#personal .song-row strong, #personal .song-row small { max-width:100%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
#personal .song-row strong { font-size:14px; line-height:1.4; font-weight:450; }
#personal .song-row small { font-size:12px; color:#8a929d; margin-top:2px; }
#personal .watch-list li { min-width:0; }
#personal .show-row { display:flex; align-items:center; gap:13px; height:47px; }
#personal .watch-rank { font-size:11px; color:#a4acb7; font-variant-numeric:tabular-nums; width:17px; flex-shrink:0; }
#personal .show-row img { display:block; width:31px; height:46px; object-fit:cover; border-radius:3px; flex-shrink:0; transition:transform .2s; }
#personal .watch-title { color:#50565f; font-size:14px; line-height:1.4; }
#personal .show-row:hover .watch-title { color:var(--blue); }
#personal .show-row:hover img { transform:translateY(-2px); }
@media (min-width:900px) {
  #personal .personal-story:has(.chess-panel:not([hidden])) { max-width:none; display:grid; grid-template-columns:minmax(0,1fr) 290px; column-gap:48px; align-items:start; }
  #personal .personal-story:has(.chess-panel:not([hidden])) .chess-panel { grid-column:2; grid-row:1; margin:0; }
}
@media (max-width:1100px) and (min-width:721px) {
  #personal .personal-favorites { gap:32px; }
  #personal .map-postcard { width:124px; }
}
@media (max-width:720px) {
  #personal { padding-top:52px; padding-bottom:110px; }
  #personal .travel-story { margin-top:30px; }
  #personal .travel-stage { height:415px; margin-top:15px; }
  #personal .draggable-map { top:95px; height:210px; }
  #personal .map-postcard { width:94px; padding:4px 4px 6px; border-radius:7px; }
  #personal .postcard-image { aspect-ratio:1.12; border-radius:3px; }
  #personal .postcard-rainier { top:32px; left:0; }
  #personal .postcard-thailand { top:0; left:calc(50% - 47px); }
  #personal .postcard-new-zealand { top:47px; right:0; }
  #personal .postcard-argentina { top:279px; left:10%; }
  #personal .postcard-label { font-size:10px; padding:6px 1px 0; }
  #personal .postcard-caption { font-size:8px; padding:2px 1px 0; }
  #personal .personal-favorites { gap:22px; margin-top:23px; }
  #personal .personal-favorites h3 { font-size:13px; margin-bottom:14px; }
  #personal .song-list, #personal .watch-list { grid-template-rows:repeat(5,49px); gap:11px; }
  #personal .song-row { gap:8px; min-height:49px; }
  #personal .song-row img { width:30px; height:30px; border-radius:4px; }
  #personal .song-row strong { font-size:12px; }
  #personal .song-row small { font-size:10px; }
  #personal .show-row { height:49px; gap:7px; }
  #personal .show-row img { width:25px; height:37px; }
  #personal .watch-rank { width:12px; font-size:9px; }
  #personal .watch-title { font-size:12px; }
  #personal .personal-story .marketplace-popout { left:45%; }
}
@media (prefers-reduced-motion:reduce) { #personal .map-postcard { transition:none; } }
