/* Redesign (docs/decisions.md, 2026-09-24): floating chrome over a full-screen map.
   Loaded last so it wins over the older layered rules in styles.css / map.css / dark.css.
   Stage 3a: phone map page (≤800px) + floating tab pill on every phone page. */

:root{
 --rd-card:#fff;--rd-ink:#243047;--rd-shadow:rgba(36,48,71,.14);
 --rd-nav:#fff;--rd-nav-ring:#efe6dd;--rd-nav-on:#ffe9df;--rd-nav-on-ink:#a3381e;--rd-nav-idle:#66738a;--rd-nav-shadow:0 8px 24px rgba(36,48,71,.16);--rd-strong:#243047;
 --rd-clear:#8a95a8;--rd-clear-x:#fff;
 --rd-behind:#e7ded4;--rd-handle:#d3c8bd;
 --rd-pill-h:60px;--rd-pill-gap:10px;--rd-pill-bottom:max(8px,calc(env(safe-area-inset-bottom) - 12px));--rd-box:#b9b0a6;
}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]){
 --rd-card:#1d273a;--rd-ink:#eef2f7;--rd-shadow:rgba(0,0,0,.38);
 --rd-nav:#2c3853;--rd-nav-ring:#46557a;--rd-nav-on:#40506f;--rd-nav-on-ink:#ffb3a0;--rd-nav-idle:#a3b0c4;--rd-nav-shadow:0 10px 28px rgba(0,0,0,.4);--rd-strong:#3a4866;
 --rd-clear:#4a5874;--rd-clear-x:#eef2f7;--rd-box:#6b7890;--rd-behind:#0c121d;--rd-handle:#46557a;
}}
:root[data-theme=dark]{
 --rd-card:#1d273a;--rd-ink:#eef2f7;--rd-shadow:rgba(0,0,0,.38);
 --rd-nav:#2c3853;--rd-nav-ring:#46557a;--rd-nav-on:#40506f;--rd-nav-on-ink:#ffb3a0;--rd-nav-idle:#a3b0c4;--rd-nav-shadow:0 10px 28px rgba(0,0,0,.4);--rd-strong:#3a4866;
 --rd-clear:#4a5874;--rd-clear-x:#eef2f7;--rd-box:#6b7890;--rd-behind:#0c121d;--rd-handle:#46557a;
}

/* Search bar parts: logo + clear ✕ + ☾ exist at every width; only the phone uses them in stage 3a */
.search-suns,.search-clear,.map-theme{display:none}
.map-theme svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.map-theme .i-sun{display:none}
:root[data-theme=dark] .map-theme .i-moon{display:none}
:root[data-theme=dark] .map-theme .i-sun{display:block}
@media (prefers-color-scheme:dark){
 :root:not([data-theme=light]) .map-theme .i-moon{display:none}
 :root:not([data-theme=light]) .map-theme .i-sun{display:block}
}

@media(max-width:800px){
 /* No top bar on the map: the map fills the screen, the search bar floats */
 body.map-mode .header,body.map-mode .preview{display:none}
 body.map-mode,html.app body.map-mode{--hdr:0px}
 /* html.app (home-screen app) had its own shorter #main height; this must outrank it */
 html body.map-mode #main,html.app body.map-mode #main{height:100dvh;min-height:0;margin:0}
 html body.map-mode .map-canvas-wrap{margin-top:0;height:100%;visibility:visible}

 body.map-mode .map-toolbar{top:calc(10px + var(--sat,0px));left:12px;right:12px;display:grid;grid-template-columns:minmax(0,1fr) 52px;gap:10px;align-items:center}
 body.map-mode #map-search{height:52px;max-width:none;margin:0;padding:0 4px 0 12px;gap:8px;border:0;border-radius:26px;background:var(--rd-card);box-shadow:0 8px 24px var(--rd-shadow)}
 body.map-mode #map-search .search-suns{display:block;width:30px;height:28px;flex:none}
 body.map-mode #map-search .search-icon,body.map-mode #map-search .search-go{display:none}
 body.map-mode #map-search input{font-size:16px;font-weight:500;color:var(--rd-ink)}
 body.map-mode #map-search .search-clear{display:grid;place-items:center;width:44px;height:44px;flex:none;padding:0;border-radius:22px;background:transparent}
 body.map-mode #map-search .search-clear[hidden]{display:none}
 body.map-mode #map-search .search-clear span{width:26px;height:26px;border-radius:13px;background:var(--rd-clear);display:grid;place-items:center}
 body.map-mode #map-search .search-clear svg{width:12px;height:12px;fill:none;stroke:var(--rd-clear-x);stroke-width:3.2;stroke-linecap:round}
 body.map-mode .map-theme{display:grid;place-items:center;width:52px;height:52px;border:0;border-radius:26px;background:var(--rd-card);color:var(--rd-ink);box-shadow:0 8px 24px var(--rd-shadow)}

 /* Filters: always visible, one sideways-scrolling row */
 body.map-mode .mobile-filter-toggle{display:none}
 body.map-mode .map-toolbar .map-chips{display:flex;grid-column:1 / -1;flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;margin:0 -12px;padding:2px 12px 8px;gap:8px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
 body.map-mode .map-toolbar .map-chips::-webkit-scrollbar{display:none}
 /* Soft edge where the row continues off-screen, so it reads as "swipe for more" rather than cut off */
 body.map-mode .map-toolbar .map-chips{--fl:0px;--fr:44px;-webkit-mask-image:linear-gradient(to right,transparent 0,#000 var(--fl),#000 calc(100% - var(--fr)),transparent 100%);mask-image:linear-gradient(to right,transparent 0,#000 var(--fl),#000 calc(100% - var(--fr)),transparent 100%)}
 body.map-mode .map-toolbar .map-chips.chips-scrolled{--fl:32px}
 body.map-mode .map-toolbar .map-chips.chips-end{--fr:0px}
 body.map-mode .map-toolbar .map-chips>*{flex:none;min-height:38px;border-radius:19px;border-color:transparent;box-shadow:0 2px 8px var(--rd-shadow)}

 /* Floating list card above the tab pill (swipe heights come in stage 3b) */
 body.map-mode .map-workspace .nearby-panel:not(.expanded){left:10px;right:10px;bottom:calc(var(--rd-pill-bottom) + var(--rd-pill-h) + var(--rd-pill-gap));border:0;border-radius:24px;box-shadow:0 12px 32px var(--rd-shadow)}
 body.map-mode .map-workspace .nearby-panel.expanded{top:0;bottom:0;height:auto;padding-top:var(--sat,0px)}
 body.map-mode .nearby-panel.expanded .nearby-list{padding-bottom:calc(var(--rd-pill-h) + 28px + env(safe-area-inset-bottom))}
 body.map-mode .nearby-panel.expanded .panel-foot{padding-bottom:calc(var(--rd-pill-h) + 24px + env(safe-area-inset-bottom))}
 /* Everything that sat at the map's bottom edge moves above the floating list card */
 body.map-mode{--rd-sheet:178px;--rd-above:calc(var(--rd-pill-bottom) + var(--rd-pill-h) + var(--rd-pill-gap) + var(--rd-sheet) + 8px)}
 body.map-mode[data-sheet=min]{--rd-sheet:74px}
 body.map-mode .leaflet-bottom{bottom:var(--rd-above)}
 body.map-mode .leaflet-control-attribution{border-radius:8px;margin:0 10px 0 0}
 body.map-mode .map-legend{bottom:calc(var(--rd-above) + 26px);left:12px}
 body.map-mode .origin-label{bottom:calc(var(--rd-above) + 78px);left:12px}
 body.map-mode .map-controls{top:auto;right:14px;bottom:calc(var(--rd-above) + 26px)}
 body.map-mode .map-controls button:first-child{width:48px;height:48px;border:0;border-radius:24px;background:var(--rd-card);box-shadow:0 4px 14px var(--rd-shadow)}

 /* Floating tab pill on every phone page */
 html .mobile-nav,html body.map-mode .mobile-nav{display:flex;position:fixed;left:50%;right:auto;top:auto;bottom:var(--rd-pill-bottom);transform:translateX(-50%);width:min(calc(100vw - 32px),440px);box-sizing:border-box;min-height:0;gap:4px;padding:6px;justify-content:space-between;background:var(--rd-nav);border:0;border-radius:30px;box-shadow:0 0 0 1px var(--rd-nav-ring),var(--rd-nav-shadow);backdrop-filter:none;z-index:700}
 html .mobile-nav .nav-item,html body.map-mode .mobile-nav .nav-item{position:relative;flex-direction:row;align-items:center;justify-content:center;flex:1 1 0;gap:6px;height:48px;min-width:0;padding:0 8px;border-radius:24px;font-size:14px;font-weight:700;color:var(--rd-nav-idle);white-space:nowrap}
 html .mobile-nav .nav-item svg,html body.map-mode .mobile-nav .nav-item svg{width:20px;height:20px}
 html .mobile-nav .nav-item .nav-label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%)}
 html .mobile-nav .nav-item.active,html body.map-mode .mobile-nav .nav-item.active{background:var(--rd-nav-on);color:var(--rd-nav-on-ink);flex-grow:1.7}
 html .mobile-nav .nav-item.active .nav-label{position:static;width:auto;height:auto;overflow:visible;clip:auto;clip-path:none}
 html .mobile-nav .nav-item.active svg{color:currentColor;fill:none}
 /* Messages sit just above the tab pill */
 html body .toast,html body.map-mode .toast{bottom:calc(var(--rd-pill-bottom) + var(--rd-pill-h) + 14px)}
 /* Page content clears the pill */
 body:not(.map-mode) .footer{padding-bottom:calc(var(--rd-pill-h) + 34px + env(safe-area-inset-bottom))}
}

/* Multi-check menus: 條件 (下雨天 / 推車友善 / 免費放電) and 類型, any combination (all widths) */
.check-trigger{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.check-trigger .outing-chevron{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;transition:transform .2s}
.check-trigger[aria-expanded=true] .outing-chevron{transform:rotate(180deg)}
.check-panel{position:fixed;z-index:1300;display:flex;flex-direction:column;background:var(--rd-card);color:var(--rd-ink);border-radius:20px;box-shadow:0 16px 40px rgba(20,28,43,.28);overflow:hidden;pointer-events:auto}
.check-panel[hidden]{display:none}
.check-list{overflow-y:auto;overscroll-behavior:contain;padding:8px}
.check-row{position:relative;display:flex;align-items:center;gap:12px;min-height:46px;padding:0 10px;border-radius:12px;font-size:15px;cursor:pointer}
.check-row:hover{background:var(--pale)}
.check-row input{position:absolute;opacity:0;width:1px;height:1px;margin:0}
.check-box{width:22px;height:22px;border-radius:7px;border:2px solid var(--rd-box);display:grid;place-items:center;flex:none;box-sizing:border-box}
.check-row input:checked+.check-box{background:var(--primary);border-color:var(--primary)}
.check-row input:checked+.check-box::after{content:'';width:10px;height:5px;border:2.5px solid #fff;border-top:0;border-right:0;transform:translateY(-1px) rotate(-45deg)}
.check-row input:focus-visible+.check-box{outline:3px solid var(--coral);outline-offset:2px}
.check-foot{display:flex;justify-content:space-between;gap:8px;padding:10px 12px;border-top:1px solid var(--line)}
.check-clear{min-height:44px;padding:0 14px;border-radius:22px;color:var(--primary);font-weight:700}
.check-done{min-height:44px;padding:0 22px;border-radius:22px;background:var(--rd-strong);color:#fff;font-weight:700}
body.check-open .map-toolbar{z-index:1200}

/* Stage 3b: phone list card heights + place cards you swipe sideways */
.place-carousel{display:none}
@media(max-width:800px){
 html body.map-mode .map-workspace .nearby-panel.sheet-min:not(.expanded),html body.map-mode .map-workspace .nearby-panel.sheet-mid:not(.expanded){height:var(--rd-sheet)}
 body.map-mode .nearby-panel:not(.expanded) .nearby-heading>*:not(.nearby-title),body.map-mode .nearby-panel:not(.expanded) #nearby-list{display:none}
 body.map-mode .nearby-panel:not(.expanded) .nearby-heading{padding:0 18px}
 body.map-mode .nearby-panel:not(.expanded) .nearby-title{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0}
 html body.map-mode .map-workspace .nearby-panel:not(.expanded) .nearby-title h1{font-size:21px;line-height:1.3;margin:0}
 body.map-mode .nearby-panel:not(.expanded) .mobile-expand{min-height:44px;font-size:14px}

 body.map-mode .nearby-panel.sheet-mid:not(.expanded) .place-carousel{display:flex;gap:10px;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;padding:8px 22px 14px;scroll-padding:0 22px;scrollbar-width:none;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain}
 .place-carousel::-webkit-scrollbar{display:none}
 .pc-card{position:relative;flex:0 0 calc(100% - 44px);scroll-snap-align:center;display:flex;align-items:center;min-width:0;border-radius:18px;background:var(--rd-card);box-shadow:0 2px 10px var(--rd-shadow);transition:box-shadow .2s}
 .pc-card.sel{box-shadow:0 0 0 2px var(--primary),0 4px 14px var(--rd-shadow)}
 .pc-open{flex:1;min-width:0;display:flex;align-items:center;gap:12px;padding:10px 0 10px 10px;text-align:left;border-radius:18px}
 .pc-thumb{width:68px;height:68px;border-radius:14px;overflow:hidden;flex:none;background:var(--pale);display:block}
 .pc-thumb{position:relative}
 .pc-thumb .photo{position:absolute;inset:0;width:100%;height:100%;border-radius:0}
 .pc-thumb img{width:100%;height:100%;object-fit:cover;display:block}
 .pc-thumb .photo-credit.compact{right:3px;bottom:3px;transform:scale(.8);transform-origin:bottom right}
 .pc-thumb>*:not(img){max-width:100%;max-height:100%}
 .pc-text{display:flex;flex-direction:column;gap:2px;min-width:0}
 .pc-kicker{font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
 .pc-name{font-size:17px;font-weight:700;line-height:1.3;color:var(--rd-ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
 .pc-meta{font-size:13px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
 .pc-save{width:48px;height:48px;flex:none;display:grid;place-items:center;margin-right:4px;color:var(--rd-ink)}
 .pc-save svg{width:22px;height:22px}
 .pc-save.saved svg{fill:#e5484d;stroke:#e5484d}
 .pc-empty{margin:0;padding:18px 4px;font-size:14px;color:var(--muted)}
}
@media(max-width:800px) and (prefers-reduced-motion:reduce){body.map-mode .nearby-panel{transition:none}}

/* Stage 3c: phone place page is a sheet that slides up; photos swipe sideways (desktop shows the cover only) */
.detail-slides{display:contents}
.detail-slides>.detail-slide:not(:first-child),.detail-dots,.detail-count{display:none}
@media(max-width:800px){
 body.detail-mode .header,body.detail-mode .preview{display:none}
 body.detail-mode{background:var(--rd-behind)}
 html body.detail-mode #main{margin:0;max-width:none;padding:0}
 body.detail-mode .detail-page{position:relative;margin-top:calc(10px + var(--sat,0px));min-height:calc(100dvh - 10px - var(--sat,0px));padding:26px 16px calc(var(--rd-pill-bottom) + var(--rd-pill-h) + 28px);background:var(--paper);border-radius:28px 28px 0 0;box-shadow:0 -8px 30px rgba(20,28,43,.16);animation:rd-sheet-up .36s cubic-bezier(.2,.8,.2,1);will-change:transform}
 body.detail-mode .detail-page::before{content:'';position:absolute;top:9px;left:50%;width:40px;height:5px;margin-left:-20px;border-radius:3px;background:var(--rd-handle)}
 body.detail-mode .footer{display:none}
 .detail-slides{display:flex;height:100%;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain}
 .detail-slides::-webkit-scrollbar{display:none}
 .detail-slides>.detail-slide,.detail-slides>.detail-slide:not(:first-child){display:block;position:relative;flex:0 0 100%;height:100%;scroll-snap-align:center;scroll-snap-stop:always}
 .detail-slide>.photo{position:absolute;inset:0;width:100%;height:100%}
 .detail-slide img{width:100%;height:100%;object-fit:cover}
 .detail-dots{display:flex;gap:6px;position:absolute;left:50%;bottom:12px;transform:translateX(-50%);pointer-events:none}
 .detail-dots span{width:7px;height:7px;border-radius:4px;background:rgba(255,255,255,.6);box-shadow:0 0 3px rgba(0,0,0,.3)}
 .detail-dots span.on{background:#fff}
 .detail-count{display:block;position:absolute;top:10px;right:10px;padding:2px 9px;border-radius:12px;background:rgba(20,28,43,.72);color:#fff;font-size:12px;pointer-events:none}
 /* Photo credit sits top-left on slides so the page dots at the bottom stay readable (stress test 2026-09-24). */
 .detail-slide .photo-credit{top:10px;left:10px;right:auto;bottom:auto;max-width:calc(100% - 84px)}
}
@keyframes rd-sheet-up{from{transform:translateY(60vh);opacity:.3}to{transform:none;opacity:1}}
@keyframes rd-fade-in{from{opacity:0}to{opacity:1}}
@media(max-width:800px) and (prefers-reduced-motion:reduce){body.detail-mode .detail-page{animation:rd-fade-in .2s ease-out}}

/* Stage 3d: desktop map page — floating list panel (logo in the search bar), tab pill over the map,
   place details beside the map. 801–1000px: 340px list; ≥1001px: 400px list; ≥1400px: detail panel on the right. */
@media(min-width:801px){
 body.map-mode{--rd-list-w:420px;--rd-tool-h:134px;--rd-right:0px}
 body.map-mode .header,body.map-mode .preview{display:none}
 html body.map-mode #main,html.app body.map-mode #main{height:100dvh;min-height:0;margin:0;max-width:none}
 body.map-mode .map-workspace{display:block;position:relative;height:100%}
 html body.map-mode .map-canvas-wrap{position:absolute;inset:0;margin:0;height:100%;visibility:visible}
 html body.map-mode .map-workspace .nearby-panel{position:absolute;left:16px;top:16px;bottom:16px;width:var(--rd-list-w);height:auto;padding-top:var(--rd-tool-h);background:var(--paper)!important;background-image:none!important;border:0;border-radius:24px;box-shadow:0 12px 36px var(--rd-shadow);overflow:hidden;z-index:500}
 body.map-mode .nearby-panel::after,body.map-mode .header::before{content:none;display:none}
 body.map-mode .nearby-panel .eyebrow{display:none}
 html body.map-mode .nearby-panel .nearby-heading{padding-top:4px}

 /* Search bar + ☾ + filters sit at the top of the list panel */
 html body.map-mode .map-toolbar,html body.map-mode .map-toolbar.toolbar-centred{top:32px;left:32px;right:auto;width:calc(var(--rd-list-w) - 32px);display:grid;grid-template-columns:minmax(0,1fr) 52px;gap:10px;align-items:center;z-index:600}
 body.map-mode #map-search{height:52px;max-width:none;margin:0;padding:0 4px 0 12px;gap:8px;border:0;border-radius:26px;background:var(--rd-card);box-shadow:0 2px 10px var(--rd-shadow)}
 body.map-mode #map-search .search-suns{display:block;width:30px;height:28px;flex:none}
 body.map-mode #map-search .search-icon,body.map-mode #map-search .search-go{display:none}
 body.map-mode #map-search input{font-size:16px;font-weight:500;color:var(--rd-ink)}
 body.map-mode #map-search .search-clear{display:grid;place-items:center;width:44px;height:44px;flex:none;padding:0;border-radius:22px;background:transparent}
 body.map-mode #map-search .search-clear[hidden]{display:none}
 body.map-mode #map-search .search-clear span{width:26px;height:26px;border-radius:13px;background:var(--rd-clear);display:grid;place-items:center}
 body.map-mode #map-search .search-clear svg{width:12px;height:12px;fill:none;stroke:var(--rd-clear-x);stroke-width:3.2;stroke-linecap:round}
 body.map-mode .map-theme{display:grid;place-items:center;width:52px;height:52px;border:0;border-radius:26px;background:var(--rd-card);color:var(--rd-ink);box-shadow:0 2px 10px var(--rd-shadow)}
 body.map-mode .mobile-filter-toggle{display:none}
 html body.map-mode .map-toolbar .map-chips{display:flex;grid-column:1 / -1;flex-wrap:nowrap;justify-content:flex-start;overflow-x:auto;overflow-y:hidden;margin:0 -4px;padding:2px 4px 8px;gap:8px;scrollbar-width:none}
 body.map-mode .map-toolbar .map-chips::-webkit-scrollbar{display:none}
 body.map-mode .map-toolbar .map-chips>*{flex:none;min-height:38px;border-radius:19px;border-color:transparent;box-shadow:0 1px 6px var(--rd-shadow)}

 /* Tab pill floats over the centre of the visible map */
 html body.map-mode .mobile-nav{display:flex;position:fixed;top:16px;bottom:auto;left:var(--rd-pill-x);right:auto;transform:translateX(-50%);width:auto;gap:4px;padding:5px;justify-content:center;background:var(--rd-nav);border:0;border-radius:28px;box-shadow:0 0 0 1px var(--rd-nav-ring),var(--rd-nav-shadow);backdrop-filter:none;z-index:700}
 html body.map-mode .mobile-nav .nav-item{flex:none;flex-direction:row;gap:6px;height:44px;min-width:0;padding:0 16px;border-radius:22px;font-size:14px;font-weight:700;color:var(--rd-nav-idle)}
 html body.map-mode .mobile-nav .nav-item svg{width:18px;height:18px}
 html body.map-mode .mobile-nav .nav-item .nav-label{position:static;width:auto;height:auto;overflow:visible;clip:auto;clip-path:none}
 html body.map-mode .mobile-nav .nav-item.active{background:var(--rd-nav-on);color:var(--rd-nav-on-ink)}
 html body.map-mode .mobile-nav .nav-item.active svg{color:currentColor;fill:none}
 html body.map-mode .mobile-nav .nav-item:hover:not(.active){background:color-mix(in srgb,var(--rd-nav-on) 55%,transparent)}

 /* Map buttons bottom-right, legend bottom-left of the map area */
 html body.map-mode .map-controls{top:auto;bottom:40px;right:calc(24px + var(--rd-right))}
 html body.map-mode .map-controls button{border:0;border-radius:23px;background:var(--rd-card);box-shadow:0 4px 14px var(--rd-shadow)}
 html body.map-mode .map-legend{left:calc(32px + var(--rd-list-w));right:auto;bottom:24px}
 html body.map-mode .origin-label{left:calc(32px + var(--rd-list-w));bottom:70px}
 body.map-mode .leaflet-bottom.leaflet-right{right:var(--rd-right)}

 /* Place details beside the map */
 body.map-mode .map-detail{position:absolute;left:16px;top:calc(16px + var(--rd-tool-h));bottom:16px;width:var(--rd-list-w);z-index:550;overflow-y:auto;overscroll-behavior:contain;background:var(--paper);border-radius:0 0 24px 24px}
 body.map-mode .map-detail .detail-page{padding:0 18px 24px}
 body.map-mode .map-detail .detail-layout{display:block}
 body.map-mode .map-detail .detail-layout>*{width:auto;max-width:none}
 body.map-mode .map-detail .detail-image{height:230px;border-radius:18px}
 body.map-mode .map-detail .back{position:sticky;top:0;z-index:2;display:flex;align-items:center;gap:6px;width:calc(100% + 36px);margin:0 -18px 8px;padding:12px 18px;background:var(--paper);font-weight:700;color:var(--primary)}
 body.map-mode .map-detail-close{display:none}
 body.map-mode .map-detail .detail-intro h1{font-size:26px}
 body.map-mode .map-detail .place-highlights{grid-template-columns:1fr}
 body.map-mode .map-detail .facility-grid{grid-template-columns:1fr 1fr}
}
@media(min-width:801px) and (max-width:1000px){body.map-mode{--rd-list-w:340px}}
@media(min-width:1400px){
 body.map-mode.map-detail-open{--rd-right:532px}
 body.map-mode .map-detail{left:auto;right:16px;top:16px;width:500px;border-radius:24px;box-shadow:0 12px 36px var(--rd-shadow)}
 body.map-mode .map-detail .back{display:none}
 body.map-mode .map-detail .detail-page{padding-top:22px}
 body.map-mode .map-detail-close{display:grid;place-items:center;position:sticky;top:12px;float:right;margin:12px 12px -56px 0;width:44px;height:44px;border-radius:22px;background:var(--rd-card);box-shadow:0 2px 10px var(--rd-shadow);z-index:3;color:var(--rd-ink)}
 body.map-mode .map-detail-close svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round}
}

/* Detail panel readability (Henry): heart + map buttons beside the place type, larger text throughout */
@media(min-width:801px){
 body.map-mode .map-detail .detail-page{padding-left:22px;padding-right:22px;padding-bottom:28px}
 body.map-mode .map-detail .back{width:calc(100% + 44px);margin:0 -22px 8px;padding:12px 22px;font-size:15px}
 body.map-mode .map-detail .detail-kicker{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:16px}
 body.map-mode .map-detail .detail-quick{display:flex;gap:6px;flex:none}
 body.map-mode .map-detail .detail-quick>*{width:56px;height:56px;display:grid;grid-template-rows:24px auto;place-items:center;align-content:center;gap:3px;border-radius:16px;color:var(--rd-ink);text-decoration:none;background:var(--rd-card);box-shadow:0 1px 6px var(--rd-shadow)}
 body.map-mode .map-detail .detail-quick>*:hover{background:var(--pale)}
 body.map-mode .map-detail .detail-quick svg{width:22px;height:22px;display:block}
 body.map-mode .map-detail .detail-quick span{font-size:12px;line-height:1;color:var(--muted);white-space:nowrap}
 body.map-mode .map-detail .quick-save.saved svg,body.map-mode .map-detail .quick-save[aria-pressed=true] svg{fill:#e5484d;stroke:#e5484d}
 /* the heart and map buttons replace the side card's own 收藏 / Google 地圖 buttons here */
 body.map-mode .map-detail .detail-aside [data-save],body.map-mode .map-detail .detail-aside a.primary{display:none}
 body.map-mode .map-detail .detail-kicker .category{font-size:14px}
 body.map-mode .map-detail .detail-intro h1{font-size:29px;line-height:1.3}
 body.map-mode .map-detail .detail-intro .meta{font-size:14px}
 body.map-mode .map-detail .detail-intro p{font-size:17px;line-height:1.75}
 body.map-mode .map-detail .place-guide-head h2{font-size:23px}
 body.map-mode .map-detail .place-guide-head p{font-size:15px;line-height:1.75}
 body.map-mode .map-detail .place-guide-head span,body.map-mode .map-detail .place-highlights small{font-size:12px}
 body.map-mode .map-detail .place-highlights h3{font-size:17px}
 body.map-mode .map-detail .place-highlights p{font-size:15px;line-height:1.7}
 body.map-mode .map-detail .detail-section h2,body.map-mode .map-detail .detail-aside h2{font-size:22px}
 body.map-mode .map-detail .visit-facts dt,body.map-mode .map-detail .visit-facts dd{font-size:15px}
 body.map-mode .map-detail .facility-item span,body.map-mode .map-detail .info-row span,body.map-mode .map-detail .info-row b{font-size:14px}
 body.map-mode .map-detail .facility-item small,body.map-mode .map-detail .detail-section small{font-size:13px}
 body.map-mode .map-detail .photo-gallery figcaption p{font-size:15px}
 body.map-mode .map-detail .detail-aside a,body.map-mode .map-detail .detail-aside button{font-size:15px}
 body.map-mode .map-detail .source-box summary{font-size:14px}
 body.map-mode .map-detail .source-box li,body.map-mode .map-detail .source-box a{font-size:13px}
}

/* Stage 4: your-location marker — the two suns, geometry and gradients from Henry's refined icon SVG
   (assets/app-icon-source.svg: small = 0.583 × big, centres 1.36 radii apart at 40°, hairline gap), a slow pulse, a heading beam from the compass,
   and the zoom morph (little sun orbits in when zooming out, spins back out when zooming in). */
.you-mark{--heading:0deg}
.you-mark>span{position:absolute;left:50%;top:50%;display:block}
.you-big{width:24px;height:24px;margin:-12px 0 0 -12px;border-radius:50%;background:linear-gradient(#FFDC4A,#FFAA46 38%,#FF6A49 68%,#F22D51);box-shadow:0 0 0 2.5px #fff,0 2px 7px rgba(36,48,71,.35);transition:transform .6s cubic-bezier(.4,0,.2,1);z-index:2}
.you-orbit{width:0;height:0;transform:rotate(40deg);z-index:3}
.you-spin{position:absolute;left:0;top:0;width:0;height:0}
.you-small{position:absolute;left:-7px;top:-7px;width:14px;height:14px;border-radius:50%;background:linear-gradient(#85DBF4,#4C9AF2 50%,#265BE5);box-shadow:0 0 0 2px #fff;transform:translateX(16px)}
.you-mark.far .you-big{transform:scale(.75)}
.you-mark.far .you-small{transform:translateX(0) scale(.3);opacity:0}
.you-mark.to-far .you-spin{animation:you-spin-in .7s cubic-bezier(.4,0,.2,1)}
.you-mark.to-far .you-small{animation:you-small-in .7s cubic-bezier(.4,0,.2,1) both}
.you-mark.to-near .you-spin{animation:you-spin-out .7s cubic-bezier(.4,0,.2,1)}
.you-mark.to-near .you-small{animation:you-small-out .7s cubic-bezier(.4,0,.2,1) both}
@keyframes you-spin-in{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}
@keyframes you-spin-out{from{transform:rotate(360deg)}to{transform:rotate(0deg)}}
@keyframes you-small-in{0%{transform:translateX(16px) scale(1);opacity:1}60%{transform:translateX(11px) scale(.85);opacity:1}100%{transform:translateX(0) scale(.3);opacity:0}}
@keyframes you-small-out{0%{transform:translateX(0) scale(.3);opacity:0}40%{transform:translateX(11px) scale(.85);opacity:1}100%{transform:translateX(16px) scale(1);opacity:1}}
.you-pulse{width:24px;height:24px;margin:-12px 0 0 -12px;border-radius:50%;background:rgba(255,106,73,.38);opacity:0;z-index:1}
.you-mark.gps:not(.is-interacting):not(.is-locating):not(.to-far):not(.to-near) .you-pulse{animation:you-pulse 2.6s cubic-bezier(.2,.6,.3,1) infinite}
.you-mark.far .you-pulse{width:18px;height:18px;margin:-9px 0 0 -9px}
@keyframes you-pulse{0%{transform:scale(1);opacity:.6}100%{transform:scale(3.4);opacity:0}}
.you-beam{display:none!important;width:128px;height:128px;margin:-64px 0 0 -64px;border-radius:50%;z-index:0;pointer-events:none;
 background:conic-gradient(from calc(var(--heading) - 26deg),rgba(255,122,79,.55) 0deg,rgba(255,122,79,.55) 52deg,transparent 52deg);
 -webkit-mask:radial-gradient(circle,#000 14%,rgba(0,0,0,.55) 42%,transparent 70%);mask:radial-gradient(circle,#000 14%,rgba(0,0,0,.55) 42%,transparent 70%)}
.you-mark.gps.has-heading .you-beam{display:block!important}
.you-mark.demo .you-big,.you-mark.demo .you-small{filter:saturate(.75)}
.legend-sun.legend-suns{width:15px;height:auto}
/* Accuracy circle: only with reduced motion, as a static ring instead of the pulse (scales with the map) */
.origin-accuracy-wrap .origin-accuracy-glow{display:none}
@media(prefers-reduced-motion:reduce){
 .you-mark .you-pulse{display:none}
 .you-mark.to-far .you-spin,.you-mark.to-near .you-spin,.you-mark.to-far .you-small,.you-mark.to-near .you-small{animation:none}
 .you-big,.you-small{transition:opacity .2s,transform .2s}
 .origin-accuracy-wrap .origin-accuracy-glow{display:block;background:rgba(255,122,79,.12)!important;border:1.5px solid rgba(255,122,79,.55)!important;box-sizing:border-box}
}

/* Location permission sheets (first 📍 tap; location blocked) */
.la-sheet{display:flex;flex-direction:column;gap:16px;padding-top:4px}
.la-brand{display:flex;align-items:center;gap:12px;font-size:24px;font-weight:900}
.la-brand img{width:52px;height:auto}
.la-coral{color:#e8603f}
.la-row{display:flex;gap:14px;align-items:flex-start;font-size:15px;line-height:1.65;color:var(--muted)}
.la-row b{display:block;font-size:16px;color:var(--ink)}
.la-ic{width:44px;height:44px;border-radius:14px;display:grid;place-items:center;flex:none}
.la-ic svg{width:22px;height:22px;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.la-ic-pin{background:#ffeee6}.la-ic-pin svg{stroke:#c64a2c}
.la-ic-dir{background:#e3f1fb}.la-ic-dir svg{stroke:#2a72ad}
.la-actions{display:flex;flex-direction:column;gap:10px;margin-top:4px}
.la-main{min-height:54px;border-radius:27px;background:#ff8466;color:#243047;font-size:17px;font-weight:700;display:flex;align-items:center;justify-content:center;gap:8px}
.la-main svg{width:20px;height:20px}
.la-sec{min-height:48px;border-radius:24px;background:var(--pale);color:var(--ink);font-size:15px}
.la-text{margin:0;font-size:15px;line-height:1.7;color:var(--muted)}
.la-steps{margin:0;padding:14px 14px 14px 36px;border-radius:18px;background:var(--pale);display:flex;flex-direction:column;gap:8px;font-size:15px}
:root[data-theme=dark] .la-ic-pin{background:#3a2522}:root[data-theme=dark] .la-ic-pin svg{stroke:#ff9c82}
:root[data-theme=dark] .la-ic-dir{background:#1f3048}:root[data-theme=dark] .la-ic-dir svg{stroke:#7cc4f5}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .la-ic-pin{background:#3a2522}:root:not([data-theme=light]) .la-ic-pin svg{stroke:#ff9c82}:root:not([data-theme=light]) .la-ic-dir{background:#1f3048}:root:not([data-theme=light]) .la-ic-dir svg{stroke:#7cc4f5}}

/* Stage 5: place pin colours — clear of the coral/peach/sky reserved for "your location"; similar hues differ in
   lightness so they stay apart for colour-blind eyes; dark mode uses lighter versions of the same hues. */
:root{--pin-park:#12937f;--pin-nature:#2f5e34;--pin-museum:#6a45b8;--pin-culture:#a33a6e;--pin-scenic:#3c5bb0;--pin-coast:#0d5d72;--pin-oldstreet:#7b4a2a;--pin-heritage:#6b6320;--pin-temple:#8f1f3f;--pin-rail:#26306e;--pin-civic:#56687a;--pin-farm:#5c8a1a;--pin-theme:#b0369c;--pin-other:#7a8190;--pin-cluster:#243047;--pin-cluster-ink:#fff}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--pin-park:#3cc4ad;--pin-nature:#6fae6a;--pin-museum:#a98af0;--pin-culture:#e07aac;--pin-scenic:#8aa5f0;--pin-coast:#3fb0cc;--pin-oldstreet:#c79267;--pin-heritage:#b5ab5a;--pin-temple:#d96585;--pin-rail:#7d8be0;--pin-civic:#98aabb;--pin-farm:#9ccc55;--pin-theme:#e27fd0;--pin-other:#a7adb8;--pin-cluster:#d5dcea;--pin-cluster-ink:#141c2b}}
:root[data-theme=dark]{--pin-park:#3cc4ad;--pin-nature:#6fae6a;--pin-museum:#a98af0;--pin-culture:#e07aac;--pin-scenic:#8aa5f0;--pin-coast:#3fb0cc;--pin-oldstreet:#c79267;--pin-heritage:#b5ab5a;--pin-temple:#d96585;--pin-rail:#7d8be0;--pin-civic:#98aabb;--pin-farm:#9ccc55;--pin-theme:#e27fd0;--pin-other:#a7adb8;--pin-cluster:#d5dcea;--pin-cluster-ink:#141c2b}
.place-pin.dot.type-park,.map-legend i.type-park{background:var(--pin-park)}
.place-pin.dot.type-nature,.map-legend i.type-nature{background:var(--pin-nature)}
.place-pin.dot.type-museum,.map-legend i.type-museum{background:var(--pin-museum)}
.place-pin.dot.type-culture,.map-legend i.type-culture{background:var(--pin-culture)}
.place-pin.dot.type-scenic,.map-legend i.type-scenic{background:var(--pin-scenic)}
.place-pin.dot.type-coast,.map-legend i.type-coast{background:var(--pin-coast)}
.place-pin.dot.type-oldstreet,.map-legend i.type-oldstreet{background:var(--pin-oldstreet)}
.place-pin.dot.type-heritage,.map-legend i.type-heritage{background:var(--pin-heritage)}
.place-pin.dot.type-temple,.map-legend i.type-temple{background:var(--pin-temple)}
.place-pin.dot.type-rail,.map-legend i.type-rail{background:var(--pin-rail)}
.place-pin.dot.type-civic,.map-legend i.type-civic{background:var(--pin-civic)}
.place-pin.dot.type-farm,.map-legend i.type-farm{background:var(--pin-farm)}
.place-pin.dot.type-theme,.map-legend i.type-theme{background:var(--pin-theme)}
.place-pin.dot.type-other,.map-legend i.type-other{background:var(--pin-other)}
.place-pin.dot.multi,.map-legend i.cluster{background:var(--pin-cluster)}
.place-pin.dot.multi,.place-pin.dot.multi .place-pin-count{color:var(--pin-cluster-ink)}

/* Stage 6a: 靈感 / 探索 / 收藏 (and the desktop place page) — no old top bar. A light row instead: the two-sun
   logo (home) on the left, 📍 area + ☾ as floating round buttons on the right; the tab pill floats on every page. */
html body:not(.map-mode) .preview{display:none}
html body:not(.map-mode) .header,html.app body:not(.map-mode) .header{display:flex;align-items:center;justify-content:space-between;gap:10px;height:auto;min-height:0;max-width:1256px;margin:0 auto;padding:calc(12px + var(--sat,0px)) 16px 6px;background:transparent;box-shadow:none;position:relative;z-index:6}
html body:not(.map-mode) .header::before,html body:not(.map-mode) .header::after{content:none}
html body .header .brand-logo{display:none}
html body:not(.map-mode) .header .brand{display:flex;align-items:center;width:auto;margin:0;padding:0;transform:none;mix-blend-mode:normal}
html body:not(.map-mode) .header .brand .brand-mark{position:static;transform:none;font-size:38px;line-height:0}
html body .header .desktop-nav{display:none}
html body:not(.map-mode) .header-actions{display:flex;align-items:center;gap:10px;margin-left:auto}
html body:not(.map-mode) .header .theme-toggle{width:48px;height:48px;border:0;border-radius:24px;background:var(--rd-card);box-shadow:0 4px 16px var(--rd-shadow);display:grid;place-items:center}
html body:not(.map-mode) .header .theme-toggle svg{width:20px;height:20px}
html body:not(.map-mode) .header .location{min-height:48px;border:0;border-radius:24px;background:var(--rd-card);box-shadow:0 4px 16px var(--rd-shadow);padding:0 16px;font-size:14px;color:var(--rd-ink)}
html body:not(.map-mode) .header .location[hidden]{display:none}
@media(min-width:801px){
 html body:not(.map-mode) .header{padding:16px 32px 8px}
 html body:not(.map-mode) .header .brand .brand-mark{font-size:44px}
 /* tab pill at the top centre on every desktop page (the map page centres it over the map instead) */
 html body .mobile-nav{display:flex;position:fixed;top:16px;bottom:auto;left:var(--rd-pill-x);right:auto;transform:translateX(-50%);width:auto;gap:4px;padding:5px;justify-content:center;background:var(--rd-nav);border:0;border-radius:28px;box-shadow:0 0 0 1px var(--rd-nav-ring),var(--rd-nav-shadow);backdrop-filter:none;z-index:700}
 html body .mobile-nav .nav-item{flex:none;flex-direction:row;align-items:center;gap:6px;height:44px;min-width:0;padding:0 16px;border-radius:22px;font-size:14px;font-weight:700;color:var(--rd-nav-idle)}
 html body .mobile-nav .nav-item svg{width:18px;height:18px}
 html body .mobile-nav .nav-item .nav-label{position:static;width:auto;height:auto;overflow:visible;clip:auto;clip-path:none}
 html body .mobile-nav .nav-item.active{background:var(--rd-nav-on);color:var(--rd-nav-on-ink)}
 html body .mobile-nav .nav-item.active svg{color:currentColor;fill:none}
 html body .mobile-nav .nav-item:hover:not(.active){background:color-mix(in srgb,var(--rd-nav-on) 55%,transparent)}
}
/* Cards in the new look: no hairline border, rounder, soft shadow */
html body .place-card{border:0;border-radius:22px;box-shadow:0 4px 18px var(--rd-shadow);overflow:hidden}
html body .place-card .card-image{border-radius:0}
.filters .check-trigger,.filters .age-chip{display:inline-flex;align-items:center;gap:6px}
.filters .age-chip svg.icon{width:16px;height:16px}
.filters .age-chip .outing-chevron,.filters .check-trigger .outing-chevron{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}

/* Stage 6b: swipe a card left to save / remove */
.swiping{position:relative;overflow:hidden;touch-action:pan-y}
.swiping>:not(.swipe-act){transform:translateX(var(--swipe,0px))}
.swipe-release>:not(.swipe-act){transition:transform .26s ease-out}
.swipe-act{position:absolute;top:0;bottom:0;right:0;width:calc(-1 * var(--swipe,0px));display:flex;align-items:center;justify-content:center;gap:6px;overflow:hidden;white-space:nowrap;background:#ff8466;color:#243047;font-size:14px;font-weight:700;border-radius:0 inherit inherit 0}
.swipe-release .swipe-act{transition:width .26s ease-out}
.swipe-act.remove{background:#66738a;color:#fff}
.swipe-act svg{width:20px;height:20px;fill:currentColor;stroke:currentColor;transition:transform .15s}
.swipe-armed .swipe-act svg{transform:scale(1.25)}
@media(prefers-reduced-motion:reduce){.swipe-release>:not(.swipe-act),.swipe-release .swipe-act{transition:none}}
.toast.has-action{pointer-events:auto;display:flex;align-items:center;justify-content:center;gap:14px}
.toast-undo{min-height:36px;padding:0 12px;border-radius:18px;font-weight:700;color:#ffb3a0;background:transparent}
:root[data-theme=dark] .toast-undo{color:#a3381e}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .toast-undo{color:#a3381e}}

/* Stage 6c: 靈感 card stack */
#idea-wrap{margin-top:6px}
.idea-stack{position:relative;height:min(470px,62vh);max-width:430px;margin:0 auto}
.idea-card{--dx:0;position:absolute;inset:0;border-radius:26px;background:var(--rd-card);box-shadow:0 10px 30px var(--rd-shadow);overflow:hidden;touch-action:pan-y;user-select:none;-webkit-user-select:none;transition:transform .3s cubic-bezier(.2,.8,.2,1),opacity .3s}
.idea-card[data-depth="1"]{transform:translateY(14px) scale(.95);opacity:.92}
.idea-card[data-depth="2"]{transform:translateY(28px) scale(.9);opacity:.75}
.idea-card[data-depth="0"]{cursor:grab}
.idea-card.fly-right{transform:translateX(130%) rotate(16deg)!important;opacity:0;transition:transform .26s ease-in,opacity .26s ease-in}
.idea-card.fly-left{transform:translateX(-130%) rotate(-16deg)!important;opacity:0;transition:transform .26s ease-in,opacity .26s ease-in}
.idea-open{display:flex;flex-direction:column;width:100%;height:100%;padding:0;text-align:left;color:inherit}
.idea-photo{position:relative;flex:1;min-height:0;display:block}
.idea-photo>.photo{position:absolute;inset:0;width:100%;height:100%}
.idea-photo img{width:100%;height:100%;object-fit:cover;-webkit-user-drag:none;pointer-events:none}
.idea-photo .image-badge{position:absolute;top:14px;left:14px}
.idea-body{display:flex;flex-direction:column;gap:4px;padding:16px 20px 20px}
.idea-kicker,.idea-meta{font-size:13px;color:var(--muted)}
.idea-name{font-size:23px;font-weight:900;line-height:1.3;color:var(--ink)}
.idea-reason{margin-top:4px;font-size:14px;line-height:1.6;color:var(--ink)}
.idea-stamp{position:absolute;top:22px;z-index:3;padding:4px 14px;border:3px solid currentColor;border-radius:12px;font-size:18px;line-height:1.3;font-weight:900;white-space:nowrap;background:#fff;box-shadow:0 2px 10px rgba(0,0,0,.18);pointer-events:none;opacity:0}
.idea-stamp.stamp-save{left:20px;color:#d63a40;transform:rotate(-12deg);opacity:clamp(0,calc(var(--dx) / 110),1)}
.idea-stamp.stamp-skip{right:20px;color:#4f5a6e;transform:rotate(12deg);opacity:clamp(0,calc(var(--dx) / -110),1)}
.idea-actions{display:flex;justify-content:center;gap:30px;margin:26px 0 8px}
.idea-actions button{width:62px;height:62px;border-radius:31px;display:grid;place-items:center;background:var(--rd-card);color:var(--ink);box-shadow:0 6px 18px var(--rd-shadow)}
.idea-actions svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round}
.idea-actions .idea-save{background:#ff8466;color:#243047}.idea-actions .idea-openbtn{width:auto;padding:0 20px;white-space:nowrap;font-size:14px;font-weight:600}
.idea-actions .idea-save.saved svg{fill:#243047}
.idea-hint{display:flex;justify-content:center;gap:10px;margin:0;font-size:13px;color:var(--muted);text-align:center}
.idea-hint span{font-weight:700;color:var(--ink)}
.idea-done{max-width:430px;margin:0 auto;padding:36px 24px;border-radius:26px;background:var(--rd-card);box-shadow:0 10px 30px var(--rd-shadow);text-align:center}
.idea-done h3{margin:0 0 6px;font-size:22px}
.idea-done p{margin:0 0 18px;color:var(--muted)}
.idea-done-actions{display:flex;justify-content:center;gap:10px;flex-wrap:wrap}
@media(prefers-reduced-motion:reduce){.idea-card,.idea-card.fly-right,.idea-card.fly-left{transition:opacity .15s}}

/* Auto-hiding scrollbars (Henry): list + detail panels show a thin scrollbar only while scrolling */
html body .nearby-list,html body .map-detail,html body .nearby-list:hover,html body .nearby-list:focus-within{scrollbar-width:thin;scrollbar-color:transparent transparent}
html body .nearby-list.is-scrolling,html body .nearby-list.is-scrolling:hover,html body .map-detail.is-scrolling{scrollbar-color:color-mix(in srgb,var(--muted) 45%,transparent) transparent}
html body .map-detail::-webkit-scrollbar,html body .nearby-list::-webkit-scrollbar{width:6px;height:6px}
html body .map-detail::-webkit-scrollbar-track,html body .nearby-list::-webkit-scrollbar-track{background:transparent}
html body .map-detail::-webkit-scrollbar-thumb,html body .nearby-list:hover::-webkit-scrollbar-thumb,html body .nearby-list::-webkit-scrollbar-thumb{background:transparent;border-radius:6px}
html body .map-detail.is-scrolling::-webkit-scrollbar-thumb,html body .nearby-list.is-scrolling::-webkit-scrollbar-thumb,html body .nearby-list.is-scrolling:hover::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--muted) 45%,transparent)}

/* Tab pill stays put (Henry): the same spot on every page and whether or not a panel is open — the screen
   centre, nudged right only on narrow windows so it never sits over the list panel. */
@media(min-width:801px){:root{--rd-list-w:420px;--rd-pill-x:max(50vw,calc(var(--rd-list-w) + 212px))}}
@media(min-width:801px) and (max-width:1000px){:root{--rd-list-w:340px}}
@media(min-width:801px) and (max-width:1100px){
 html body:not(.map-mode) .header .location{width:48px;padding:0;justify-content:center;gap:0}
 html body:not(.map-mode) .header .location>*:not(svg){display:none}
}

/* 靈感 on desktop (Henry 2026-09-25): wide card + "接下來" list; phones keep the swipe stack unchanged. */
.idea-more,.idea-queue,.idea-act-label,.idea-openbtn{display:none}
@media(min-width:1024px){
  .idea-layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:28px;align-items:start}
  .idea-stack{max-width:none;height:440px;margin:0}
  .idea-open{flex-direction:row}
  .idea-photo{flex:0 0 56%;height:100%}
  .idea-body{flex:1;min-width:0;padding:28px 28px 24px;gap:8px;overflow:hidden}
  .idea-name{font-size:28px}
  .idea-card.has-guide .idea-reason{display:none}
  .idea-more{display:flex;flex-direction:column;gap:12px;margin-top:6px;min-height:0}
  .idea-guide{font-size:15px;line-height:1.75;color:var(--ink);display:-webkit-box;-webkit-line-clamp:5;-webkit-box-orient:vertical;overflow:hidden}
  .idea-chips{display:flex;flex-wrap:wrap;gap:6px}
  .idea-chips span{padding:4px 11px;border-radius:999px;background:var(--pale);font-size:13px;color:var(--ink);white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:ellipsis}
  .idea-fact{display:flex;gap:6px;align-items:flex-start;font-size:13px;line-height:1.5;color:var(--muted)}
  .idea-fact svg{flex:none;width:16px;height:16px;margin-top:2px;fill:none;stroke:currentColor;stroke-width:2}
  .idea-actions{gap:14px;margin:22px 0 6px}
  .idea-actions button{width:auto;min-width:0;height:52px;padding:0 24px;border-radius:26px;display:inline-flex;align-items:center;gap:8px;font-weight:800;font-size:15px}
  .idea-actions button:hover{transform:translateY(-1px)}
  .idea-act-label{display:inline}
  .idea-openbtn{display:inline-flex;background:var(--rd-card);color:var(--ink)}
  .idea-hint{display:none}
  .idea-queue{display:block;position:sticky;top:96px;padding:20px 16px 16px;border-radius:22px;background:var(--rd-card);box-shadow:0 10px 30px var(--rd-shadow)}
  .idea-queue h3{margin:0 0 10px 6px;font-size:17px}
  .idea-queue ol{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:4px}
  .idea-queue li button{display:flex;align-items:center;gap:12px;width:100%;padding:8px;border-radius:14px;text-align:left;color:inherit;background:none}
  .idea-queue li button:hover,.idea-queue li button:focus-visible{background:var(--pale)}
  .q-thumb{position:relative;flex:0 0 64px;height:64px;border-radius:12px;overflow:hidden;background:var(--pale)}
  .q-thumb .photo,.q-thumb img,.q-thumb svg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
  .q-thumb .photo-credit,.q-thumb .fiction{display:none}
  .q-text{display:flex;flex-direction:column;gap:2px;min-width:0}
  .q-text b{font-size:15px;line-height:1.35;color:var(--ink);overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
  .q-text small{font-size:12px;color:var(--muted)}
  .q-empty{margin:4px 6px;color:var(--muted);font-size:14px}
  .idea-progress{margin:14px 6px 4px;font-size:13px;color:var(--muted)}
  .idea-progress b{color:var(--ink)}
  .idea-keys{margin:0 6px;font-size:12px;color:var(--muted)}
  .idea-keys kbd{display:inline-block;min-width:22px;padding:1px 6px;border:1px solid var(--line);border-bottom-width:2px;border-radius:6px;font:inherit;font-size:12px;text-align:center;color:var(--ink);background:var(--rd-card)}
  .idea-done{max-width:560px}
}
/* Phone, expanded list sheet: the list runs to the bottom behind the floating tab bar; the distance note moves to the end
   of the list instead of a fixed footer that floated above the tab bar. (Map attribution stays on the map itself.) */
@media(max-width:800px){
 body.map-mode .nearby-panel.expanded .panel-foot{display:none}
 body.map-mode .nearby-panel.expanded #nearby-list{padding-bottom:calc(var(--rd-pill-h) + 28px + env(safe-area-inset-bottom))}
 body.map-mode .nearby-panel.expanded #nearby-list::after{content:'距離為直線距離，非步行路線。';display:block;font-size:10px;color:var(--muted);padding:2px 4px 0}
}