/* TravelPrep "lively" phase 2 styles (lively2.js). Uses the app's theme variables, so dark and light both work. */
.lv2sec{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:14px 16px;margin-bottom:12px;scroll-margin-top:calc(var(--hdr) + 12px)}
.lv2sec h3{margin:0 0 6px;font-size:1rem;display:flex;gap:8px;align-items:baseline;flex-wrap:wrap}
.lv2sec h3 .meta{margin:0;font-weight:400}
.lv2sec h4{margin:10px 0 4px;font-size:.9rem}
.lv2src{margin-top:10px;line-height:1.45}.lv2src a{color:var(--accent)}
.lv2head{display:flex;justify-content:space-between;align-items:center;gap:8px}.lv2head h3{margin:0}
.lv2unit{display:inline-flex;border:1px solid var(--line);border-radius:999px;overflow:hidden}
.lv2unit button{min-width:44px;min-height:36px;border:0;background:transparent;color:var(--muted);font:inherit;font-size:.82rem;cursor:pointer}
.lv2unit button[aria-pressed=true]{background:var(--accent);color:#06101f;font-weight:700}
.lv2lead{margin:6px 0 2px}
.lv2trip{margin:6px 0;padding:6px 10px;border-radius:10px;background:color-mix(in srgb,var(--accent) 14%,transparent);font-size:.88rem}
/* climate chart */
.bwrap{overflow-x:auto;margin:6px -4px 0}
.bchart{display:block;width:100%;min-width:520px;height:auto;font-family:inherit}
.bchart text{font-size:12px;text-anchor:middle;fill:var(--muted)}
.bchart .hv{fill:var(--text);font-weight:700}.bchart .lv{fill:var(--muted)}
.bchart .rng{stroke:#f2994a;stroke-width:12;stroke-linecap:round}
.bchart .okband{fill:color-mix(in srgb,var(--l1) 10%,transparent)}
.bchart .okcol{fill:color-mix(in srgb,var(--l1) 16%,transparent);stroke:color-mix(in srgb,var(--l1) 55%,transparent);stroke-width:1}
.bchart .tripcol{fill:none;stroke:var(--accent);stroke-width:2;stroke-dasharray:5 4}
.bchart .pbar{fill:#5aa9ff;opacity:.75}.bchart .pv{font-size:10px}
.bchart .mn{font-weight:600;fill:var(--text)}.bchart .mn.now{fill:var(--accent);font-weight:800}
.bchart .nowl{stroke:var(--accent);stroke-width:3;stroke-linecap:round}
.bchart .okdot{fill:var(--l1)}.bchart .ax{text-anchor:start;font-size:11px}.bchart .base{stroke:var(--line)}
.lv2key{display:flex;flex-wrap:wrap;gap:4px 14px;align-items:center}
.lv2key .k{display:inline-block;width:12px;height:12px;border-radius:3px;margin-right:-8px;vertical-align:-1px}
.lv2key .k.ok{background:color-mix(in srgb,var(--l1) 45%,transparent)}.lv2key .k.rng{background:#f2994a}.lv2key .k.p{background:#5aa9ff}.lv2key .k.tr{border:2px dashed var(--accent)}
.lv2tbl{margin-top:8px}.lv2tbl summary{cursor:pointer;min-height:36px;display:flex;align-items:center;color:var(--accent);font-size:.88rem}
.lv2tbl .tscroll{overflow-x:auto}.lv2tbl table{border-collapse:collapse;font-size:.84rem;min-width:100%}
.lv2tbl caption{text-align:left;color:var(--muted);font-size:.8rem;padding:4px 0}
.lv2tbl th,.lv2tbl td{padding:5px 8px;border-bottom:1px solid var(--line);text-align:left;white-space:nowrap}.lv2tbl tr.trip{background:color-mix(in srgb,var(--accent) 12%,transparent)}
/* holidays */
.hol{list-style:none;margin:6px 0 0;padding:0;display:grid;gap:6px}
.hol li{display:grid;grid-template-columns:56px 1fr;gap:10px;align-items:start;padding:6px;border-radius:10px}
.hol li.on{background:color-mix(in srgb,var(--accent) 14%,transparent)}
.hol time{display:flex;flex-direction:column;align-items:center;background:var(--panel2);border:1px solid var(--line);border-radius:10px;padding:4px 0;line-height:1.1}
.hol time b{font-size:1.2rem}.hol time span{font-size:.72rem;text-transform:uppercase;color:var(--muted);font-weight:700}.hol time small{font-size:.68rem;color:var(--muted)}
.hol .meta{display:block;margin-top:1px}
.tags{display:flex;flex-wrap:wrap;gap:4px;margin:4px 0 0}
.tag{display:inline-flex;align-items:center;gap:4px;font-size:.72rem;padding:2px 8px;border-radius:999px;border:1px solid var(--line);color:var(--muted);background:var(--panel2)}
.tag svg{width:13px;height:13px}.tag.trip{color:var(--accent);border-color:var(--accent)}.tag.danger,.danger{color:var(--l4);border-color:var(--l4)}
.tag.cC{color:#d9a441}.tag.cN{color:#3fb37f}.tag.cM{color:#a678de}
.holall{margin-top:8px}.holall summary{cursor:pointer;color:var(--accent);min-height:40px;display:flex;align-items:center}.holall h4{margin:10px 0 2px}
/* World Heritage */
.wgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px;margin-top:8px}
.wcard{background:var(--panel2);border:1px solid var(--line);border-radius:12px;overflow:hidden;display:flex;flex-direction:column}
.wcard[hidden]{display:none}
.wph{margin:0;position:relative;aspect-ratio:3/2;background:var(--line);overflow:hidden}
.wph img{width:100%;height:100%;object-fit:cover;display:block;cursor:zoom-in}
.wph figcaption{position:absolute;left:0;right:0;bottom:0;padding:14px 8px 4px;font-size:.66rem;color:#fff;background:linear-gradient(transparent,rgba(0,0,0,.7));line-height:1.3}
.wph figcaption a{color:#fff}
.wph.off{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;color:var(--muted);font-size:.75rem}
.wph.off svg{width:44px;height:44px}.wph.off.cC svg{color:#d9a441}.wph.off.cN svg{color:#3fb37f}.wph.off.cM svg{color:#a678de}
.wbody{padding:10px 12px;display:flex;flex-direction:column;gap:4px;flex:1}.wbody h4{margin:0;font-size:.92rem;line-height:1.3}
.wbody .dlinks{margin-top:auto;display:flex;flex-wrap:wrap;gap:4px 12px;align-items:center}
#whc-more{margin-top:10px}
.lv2save{min-height:40px}.lv2save.on{color:var(--l1);font-weight:700}
/* map pins */
.map .whcpin{fill:#fff;stroke-width:1.6;vector-effect:non-scaling-stroke;pointer-events:none}
.map .whcpin.cC{stroke:#5b3b00}.map .whcpin.cN{stroke:#0b5a3a}.map .whcpin.cM{stroke:#5a2d91}.map .whcpin.dz{fill:#ffd6d6;stroke:#c62828;stroke-width:2}
#mz-whc svg{width:22px;height:22px;display:block;margin:auto}
.lv2whc{display:inline-flex;gap:4px 8px;align-items:center;flex-wrap:wrap}.wk{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:-4px;background:#fff;border:2px solid}.wk.cC{border-color:#5b3b00}.wk.cN{border-color:#0b5a3a}.wk.cM{border-color:#5a2d91}.wk.dz{background:#ffd6d6;border-color:#c62828}
.whctip{display:flex;gap:6px;align-items:center}.whctip svg{width:18px;height:18px;flex:none}
.whcact{display:flex;flex-direction:column;gap:6px;margin-top:6px}
.whcact button{min-height:40px;text-align:left;border:1px solid var(--line);background:var(--panel2);color:var(--text);border-radius:8px;padding:6px 10px;font:inherit;cursor:pointer;display:flex;gap:6px;align-items:center}
.whcact a{color:var(--accent);min-height:32px;display:inline-flex;align-items:center}
/* nearby + similar on destination cards */
.lv2rel{margin-top:10px;padding-top:8px;border-top:1px dashed var(--line);display:grid;gap:8px}
.lv2rel h4{margin:0 0 4px;font-size:.85rem}.lv2rel h4 .meta{display:inline;font-weight:400}
.lv2near{list-style:none;margin:0;padding:0;display:grid;gap:4px;font-size:.88rem}.lv2near li{display:flex;gap:6px;align-items:center;flex-wrap:wrap;min-height:32px}
.lv2near .meta{margin:0}.wi{display:inline-flex}.wi svg{width:16px;height:16px}.wi.cC{color:#d9a441}.wi.cN{color:#3fb37f}.wi.cM{color:#a678de}
.lv2lvl{display:inline-block;font-size:.68rem;font-weight:700;padding:1px 7px;border-radius:999px;background:var(--lc,var(--muted));color:#0b0f17;white-space:nowrap}
.lv2lvl.lv1{--lc:var(--l1)}.lv2lvl.lv2{--lc:var(--l2)}.lv2lvl.lv3{--lc:var(--l3)}.lv2lvl.lv4{--lc:var(--l4);color:#fff}.lv2lvl.lvus{--lc:#8fb3ff}
/* horizontal card rows */
.lv2row{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(200px,240px);gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;padding:2px 2px 10px;overscroll-behavior-x:contain}
.lv2row.sm{grid-auto-columns:minmax(170px,200px)}
.lv2row:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:12px}
.lv2card{scroll-snap-align:start;display:flex;flex-direction:column;background:var(--panel);border:1px solid var(--line);border-radius:12px;overflow:hidden;color:var(--text);text-decoration:none;min-height:44px;transition:transform .15s,border-color .15s}
.lv2card>img{width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;display:block;background:var(--line)}
.lv2card .noimg,.lv2card .cflagw{display:flex;align-items:center;justify-content:center;aspect-ratio:3/2;background:var(--panel2)}
.lv2card .cfl{width:96px;height:auto;border-radius:4px;box-shadow:0 2px 8px rgba(0,0,0,.3)}
.lv2ct{padding:8px 10px;display:flex;flex-direction:column;gap:3px;align-items:flex-start}.lv2ct b{font-size:.9rem;line-height:1.25}.lv2ct .meta{margin:0;font-size:.75rem}
.lv2card .iflag{display:inline-block;width:16px;height:12px;vertical-align:-1px}
@media (hover:hover){.lv2card:hover{border-color:var(--accent);transform:translateY(-2px)}}
/* home discovery */
.lv2disc{margin:18px 0 8px}
.lv2hbar{display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap}.lv2hbar h2{margin:0;font-size:1.2rem}
.lv2acts{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.lv2acts .btn{margin-top:0}
.potd{position:relative;margin:12px 0;border-radius:var(--radius);overflow:hidden;border:1px solid var(--line);background:var(--panel);display:grid}
.potdimg{display:block;width:100%;height:clamp(240px,34vw,420px);overflow:hidden}.potdimg img{width:100%;height:100%;object-fit:cover;display:block}
.potdtxt{position:absolute;left:0;right:0;bottom:0;padding:40px 18px 12px;background:linear-gradient(transparent,rgba(5,10,18,.85));color:#fff}
.potdtxt h3{margin:2px 0;font-size:1.5rem}.potdtxt h3 a{color:#fff;text-decoration:none}.potdtxt p{margin:2px 0}
.potdtxt .iflag{width:20px;height:15px;vertical-align:-2px}
.eyebrow{font-size:.72rem;text-transform:uppercase;letter-spacing:.08em;font-weight:700;opacity:.85}
.pcred{font-size:.68rem;opacity:.85}.pcred a{color:#fff}.warn3{font-size:.8rem;color:#ffd9b8}
.lv2rowwrap h3{font-size:1rem;margin:14px 0 6px}.lv2rowwrap h3 .meta{display:inline;font-weight:400;font-size:.78rem}
@media (max-width:700px){.potdimg{height:auto;aspect-ratio:4/3}.potdtxt h3{font-size:1.2rem}}
/* trip: quick start, saved places, offline pack */
.lv2qs{border:1px solid var(--line);border-radius:12px;padding:10px 12px;margin:12px 0;display:grid;gap:10px}
.lv2qs legend{font-weight:700;padding:0 6px}.lv2qs legend .meta{display:block;font-weight:400}
.qsrow{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.qsdays{display:flex;gap:8px;align-items:center}.qsdays input{width:80px;min-height:44px}
.qswho,.qsint{display:flex;flex-wrap:wrap;gap:6px}
.lv2qs .chip{display:inline-flex;align-items:center;gap:6px;min-height:44px}
.lv2qs .chip svg{width:16px;height:16px}
.lv2qs .chip:has(input:checked){border-color:var(--accent);background:color-mix(in srgb,var(--accent) 18%,var(--panel))}
.lv2saved{list-style:none;padding:0;margin:4px 0 8px;display:grid;gap:4px}.lv2saved li{display:flex;align-items:center;gap:6px;flex-wrap:wrap;min-height:40px}
.lv2saved .meta{margin:0}.lv2saved .iflag{width:20px;height:15px}
.lv2rm{min-height:40px;color:var(--muted)}
.okpill{display:inline-block;padding:3px 10px;border-radius:999px;background:color-mix(in srgb,var(--l1) 22%,transparent);color:var(--l1);font-weight:700;font-size:.85rem}
/* save menu + undo toast */
.lv2menu{position:fixed;z-index:60;background:var(--panel);border:1px solid var(--line);border-radius:12px;box-shadow:0 12px 32px rgba(0,0,0,.35);padding:6px;display:grid;gap:2px}
.lv2menu .meta{margin:2px 8px 4px}
.lv2menu button{min-height:44px;text-align:left;background:transparent;border:0;color:var(--text);font:inherit;padding:8px 10px;border-radius:8px;cursor:pointer}
.lv2menu button:hover,.lv2menu button:focus-visible{background:var(--panel2)}.lv2menu button .meta{display:inline;margin-left:4px}
.toast.lv2t{pointer-events:auto;display:flex;gap:12px;align-items:center}
.lv2undo{min-height:36px;min-width:44px;background:transparent;border:1px solid currentColor;color:inherit;border-radius:8px;font:inherit;font-weight:700;cursor:pointer;padding:4px 10px}
/* Near me */
.lv2nearpg{max-width:760px}
.nearc{display:flex;gap:14px;align-items:center;background:var(--panel);border:1px solid var(--line);border-left:6px solid var(--lc,var(--line));border-radius:var(--radius);padding:12px 14px;margin:12px 0}
.nearc h3{margin:0;display:flex;gap:8px;align-items:center;flex-wrap:wrap}.nearc p{margin:2px 0}.nearc .nfl{width:64px;height:auto;border-radius:4px}
/* install banner */
.lv2inst{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(76px + env(safe-area-inset-bottom));z-index:40;width:min(560px,calc(100vw - 20px));display:flex;gap:10px;align-items:center;
  background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:10px 12px;box-shadow:0 12px 32px rgba(0,0,0,.4)}
.lv2inst img{border-radius:10px;flex:none}.lv2inst div{flex:1;display:flex;flex-direction:column}.lv2inst .meta{margin:0}.lv2inst .btn{margin-top:0;flex:none}
@media (min-width:1100px){.lv2inst{bottom:20px}}
@media (max-width:480px){.lv2inst{flex-wrap:wrap;row-gap:8px}.lv2inst div{flex:1 1 calc(100% - 60px)}.lv2inst .btn{flex:1 1 0;min-height:44px}} /* phones: text on one row, buttons share the next */
/* never cover the phone bottom sheet (its Save/Open buttons sit where the banner does) */
body:has(.maptip.lvsheet:not([hidden])) .lv2inst{display:none}
/* pull to refresh */
html.lv2ptr-page{overscroll-behavior-y:contain}
.lv2ptr{position:fixed;left:50%;top:calc(var(--hdr) - 44px);transform:translate(-50%,0);z-index:25;display:flex;gap:8px;align-items:center;background:var(--panel);border:1px solid var(--line);border-radius:999px;padding:8px 14px;
  font-size:.85rem;box-shadow:0 6px 18px rgba(0,0,0,.3);opacity:0;pointer-events:none;transition:opacity .15s}
.lv2ptr.on{opacity:1}.lv2ptr .sp{display:inline-block;font-weight:700;color:var(--accent)}
.lv2ptr.busy .sp{animation:lv2spin .8s linear infinite}
@keyframes lv2spin{to{transform:rotate(360deg)}}
.lv2prof h3{margin:0 0 6px}
/* press feedback (touch) */
@media (prefers-reduced-motion:no-preference){.btn,.chip,.lv2card,.lv2save,.mapctl button{transition:transform .12s ease}.btn:active,.chip:active,.lv2card:active,.mapctl button:active{transform:scale(.96)}}
@media (prefers-reduced-motion:reduce){.lv2card,.lv2ptr{transition:none}.lv2ptr.busy .sp{animation:none}}
@media print{.lv2inst,.lv2ptr,.lv2menu,#lv2-share,.lv2save,.lv2share,#tpack,#disc{display:none!important}}
.lv2sec button.link{color:var(--accent);background:none;border:0;padding:6px 0;min-height:32px;font:inherit;cursor:pointer;text-decoration:underline;text-underline-offset:2px}
.lv2sec button.link:hover{text-decoration-thickness:2px}
/* Inside a destination card the "Similar elsewhere" row is a compact list (the dest grid columns are narrow) */
.lv2rel .lv2row.sm{grid-auto-flow:row;grid-auto-columns:auto;overflow:visible;scroll-snap-type:none;padding:0;gap:6px}
.lv2rel .lv2row.sm .lv2card{flex-direction:row;align-items:center;gap:8px;padding:4px;border-radius:10px}
.lv2rel .lv2row.sm .lv2card>img,.lv2rel .lv2row.sm .lv2card>.noimg{width:64px;min-width:64px;height:48px;aspect-ratio:auto;border-radius:6px;object-fit:cover;margin:0}
.lv2rel .lv2row.sm .lv2card .cfl{width:36px}
.lv2rel .lv2row.sm .lv2ct{padding:0;font-size:.85rem;min-width:0}
.lv2near li{display:block}.lv2near li a{overflow-wrap:anywhere}.lv2near .wi{vertical-align:-3px;margin-right:4px}
.lv2stw{display:flex;flex-direction:column;gap:2px}.lv2stw .lv2save{align-self:flex-start;min-height:44px}
.lv2whc .wk{background:#fff!important;border-radius:50%!important;width:11px!important;height:11px!important}.lv2whc .wk.dz{background:#ffd6d6!important}
