/* ==========================================================================
   Places globe — layered on base.css (tokens, chrome, .win, .chip, .foot)
   Markup: /travel/index.html · behaviour: /assets/js/travel.js · data: /travel.json (public) or
   /travel-lan.json (home network only, served by nginx when the visitor is on the LAN)
   ========================================================================== */

[hidden]{display:none !important}

.shero{padding:clamp(36px,7vh,76px) 0 clamp(18px,3vh,28px)}
.shero h1{margin:0;font:600 clamp(34px,5.6vw,60px)/1.05 var(--sans);letter-spacing:-.04em;color:rgb(var(--hi))}
.sstatus{margin-top:14px;font:400 13.5px/1.5 var(--mono);color:rgb(var(--dim))}
.sec-note{margin:14px 0 30px;font:400 12.5px/1.6 var(--mono);color:rgb(var(--dim))}
.notice{margin:0 0 18px;padding:12px 16px;border-radius:10px;font:400 13px/1.55 var(--mono);color:rgb(var(--fg));background:rgb(var(--acc) / .06);border:1px solid rgb(var(--acc) / .28)}
.tv-mode{display:inline-block;margin-top:12px;padding:5px 11px;border-radius:999px;font:500 12px/1.4 var(--mono);color:rgb(var(--acc2));
  background:rgb(var(--acc2) / .08);border:1px solid rgb(var(--acc2) / .35)}

/* ---- globe + side panel ---------------------------------------------------- */
.tv{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:18px;align-items:start}
@media (max-width:900px){.tv{grid-template-columns:minmax(0,1fr)}}
.tv-globe-win{min-width:0}
.tv-globe{position:relative;width:100%;aspect-ratio:1/1;max-width:78vh;margin:0 auto;touch-action:none;cursor:grab}
.tv-globe.is-drag{cursor:grabbing}
.tv-globe canvas{display:block;width:100%;height:100%}
.tv-load{position:absolute;inset:0;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;
  font:500 13px/1.4 var(--mono);letter-spacing:.06em;color:rgb(var(--acc))}
.tv-ring{width:min(46%,260px);aspect-ratio:1/1;border-radius:50%;border:1px solid rgb(var(--acc) / .35);
  box-shadow:0 0 40px -8px rgb(var(--acc) / .55),inset 0 0 40px -12px rgb(var(--acc) / .5);
  background:conic-gradient(from 0deg,rgb(var(--acc) / 0) 0deg,rgb(var(--acc) / .35) 60deg,rgb(var(--acc) / 0) 120deg);animation:tvspin 1.6s linear infinite}
@keyframes tvspin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.tv-ring{animation:none}}
.tv-tip{position:absolute;z-index:2;pointer-events:none;max-width:240px;padding:8px 11px;border-radius:9px;font:400 12.5px/1.45 var(--mono);
  color:rgb(var(--fg));background:rgb(var(--bg) / .9);border:1px solid rgb(var(--acc) / .45);box-shadow:0 0 20px -6px rgb(var(--acc) / .6);transform:translate(-50%,calc(-100% - 12px))}
.tv-tip b{display:block;color:rgb(var(--hi));font:600 13.5px/1.35 var(--sans)}
.tv-zoom{position:absolute;right:10px;bottom:10px;display:flex;gap:6px}
.tv-zoom .ib{min-width:34px;height:34px;font:600 16px var(--mono)}
.tv-zoom .ib.txt{font:500 12px var(--mono);padding:0 10px}

.tv-side{display:flex;flex-direction:column;gap:14px;min-width:0}
.tv-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.tv-stat{padding:12px 14px;border-radius:12px;background:rgb(var(--bg) / .58);border:1px solid rgb(var(--acc) / .2)}
.tv-stat b{display:block;font:600 clamp(20px,2.4vw,26px)/1.1 var(--sans);color:rgb(var(--hi))}
.tv-stat span{font:400 11.5px/1.4 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:rgb(var(--dim))}

.tv-place-body{padding:14px 16px 16px;font:400 13px/1.55 var(--mono);color:rgb(var(--fg))}
.tv-place-body h3{margin:0 0 4px;font:600 18px/1.3 var(--sans);color:rgb(var(--hi))}
.tv-place-body .tv-meta{color:rgb(var(--dim))}
.tv-place-body .tv-act{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}

.tv-trips{min-width:0}
.tv-list{list-style:none;margin:0;padding:6px 0;max-height:min(46vh,520px);overflow:auto}
.tv-list li{margin:0}
.tv-loc summary{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:10px;align-items:baseline;padding:9px 16px;cursor:pointer;
  list-style:none;font:400 13px/1.4 var(--mono);border-bottom:1px solid rgb(var(--fg) / .06)}
.tv-loc summary::-webkit-details-marker{display:none}
.tv-loc summary::before{content:"▸";grid-column:1;grid-row:1;justify-self:start;margin-left:-11px;color:rgb(var(--dim));font-size:10px}
.tv-loc[open] summary::before{content:"▾"}
.tv-loc summary:hover,.tv-loc summary:focus-visible{background:rgb(var(--err) / .07);outline:none}
.tv-loc .loc{grid-column:1;grid-row:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:600 14px/1.35 var(--sans);color:rgb(var(--err))}
.tv-loc .yrs{color:rgb(var(--acc));font-size:12px}
.tv-loc .n{color:rgb(var(--dim));font-size:12px;min-width:3.2em;text-align:right}
.tv-years{list-style:none;margin:0;padding:2px 0 8px;background:rgb(var(--err) / .03)}
.tv-years button{display:grid;grid-template-columns:3.4em minmax(0,1fr);gap:10px;width:100%;padding:6px 16px 6px 30px;text-align:left;cursor:pointer;
  font:400 12.5px/1.4 var(--mono);color:rgb(var(--fg));background:none;border:0}
.tv-years button:hover,.tv-years button:focus-visible{background:rgb(var(--acc) / .07);outline:none}
.tv-years .y{color:rgb(var(--acc))}
.tv-years .w{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* ---- photos ------------------------------------------------------------------ */
.tv-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:8px;margin-top:12px}
.tv-place .tv-grid{grid-template-columns:repeat(auto-fill,minmax(84px,1fr));gap:6px}
.tv-ph{position:relative;display:block;aspect-ratio:1/1;overflow:hidden;border-radius:9px;background:rgb(var(--fg) / .05);border:1px solid rgb(var(--acc) / .15)}
.tv-ph img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .25s ease}
.tv-ph:hover img{transform:scale(1.05)}
.tv-ph span{position:absolute;left:0;right:0;bottom:0;padding:14px 7px 5px;font:400 10.5px/1.3 var(--mono);color:rgb(var(--hi));
  background:linear-gradient(transparent,rgb(var(--bg) / .85))}
.tv-snaps{margin-top:26px}
.tv-more{margin-top:10px}
@media (prefers-reduced-motion:reduce){.tv-ph img{transition:none}}

@media (pointer:coarse){.tv-loc summary{min-height:44px;align-content:center}}

.tv-tabs{display:flex;gap:14px}
.tv-tabs button{background:none;border:0;padding:0;font:inherit;color:inherit;cursor:pointer;opacity:.55}
.tv-tabs button[aria-pressed="true"]{opacity:1;color:rgb(var(--acc))}
.tv-tabs button:focus-visible{outline:1px solid rgb(var(--acc));outline-offset:2px}
.tv-span{display:block;padding:4px 16px 2px 28px}
.tv-years button.tv-city{grid-template-columns:minmax(0,1fr)}