:root{--ink:#243e33;--muted:#70796e;--paper:#f6f4ef;--line:#dfe2d8;--accent:#b86b48;--rail:260px}*{box-sizing:border-box}body{margin:0;color:var(--ink);background:var(--paper);font:13px "Noto Sans TC",sans-serif}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}button{border:1px solid var(--line);background:#fffdf8;border-radius:7px;padding:9px 12px}a{color:inherit;text-decoration:none}:focus-visible{outline:3px solid var(--accent);outline-offset:3px}[hidden]{display:none!important}.navbar{height:78px;display:flex;align-items:center;justify-content:space-between;padding:0 30px;border-bottom:1px solid var(--line);position:relative;z-index:1100;background:#f6f4ef}.brand{display:flex;gap:12px;align-items:center}.brand svg{width:35px;height:32px}.brand>span{font-size:30px;letter-spacing:-1px;font-weight:600}.brand small{font-size:11px;letter-spacing:1px;border-left:1px solid #cdd2c7;padding-left:20px;margin-left:9px}.navbar nav{display:flex;gap:9px}.navbar nav button{font-size:11px;background:transparent}#toggle-routes{background:var(--ink);color:white;border-color:var(--ink)}#route-count{background:#ffffff25;border-radius:3px;padding:1px 5px;margin-left:7px}.atlas{position:relative;height:calc(100dvh - 78px);overflow:hidden}#map{position:absolute;inset:0;background:#e2e8db;z-index:0}.map-title{position:absolute;left:50%;top:24px;transform:translateX(-50%);z-index:400;text-align:center;pointer-events:none;background:#f6f4efe8;border:1px solid #fff9;box-shadow:0 4px 30px #203c3310;border-radius:10px;padding:14px 24px;white-space:nowrap}.eyebrow{font-size:8px;letter-spacing:2.4px;color:var(--accent)}h1{font-size:21px;font-weight:500;letter-spacing:2px;margin:7px 0}#place-count{margin:0;font-size:10px;color:var(--muted)}.card-rail{position:absolute;z-index:450;top:22px;bottom:58px;width:var(--rail);overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#abb6a5 transparent;padding:0 5px 15px}.left-rail{left:20px}.right-rail{right:20px}.rail-title{display:flex;justify-content:space-between;font-size:8px;letter-spacing:1.6px;margin-bottom:13px;background:#f6f4efeb;padding:9px 11px;border-radius:5px}.rail-title span{color:var(--muted)}.card-list{display:flex;flex-direction:column;gap:17px}.card{border:1px solid #ffffffdd;border-radius:10px;overflow:hidden;background:#fffdf8f5;box-shadow:0 4px 18px #18372916;transition:border-color .18s,box-shadow .18s;flex-shrink:0}.card.highlighted{border-color:var(--accent);box-shadow:0 0 0 3px #b86b4855,0 5px 20px #18372920}.card.route-selected .route-button{background:#e6ede3;color:#24472f}.image-wrap{position:relative;aspect-ratio:1.8;background:#e1e5da}.image-wrap img{width:100%;height:100%;object-fit:cover;display:block}.photo-number{position:absolute;left:10px;top:10px;color:white;background:#183729a8;border-radius:4px;padding:3px 7px;font-size:9px;letter-spacing:1px}.motion-button{position:absolute;right:9px;bottom:9px;background:#183729e8;color:white;border:1px solid #ffffff60;border-radius:20px;font-size:10px;padding:6px 10px}.motion-button[aria-pressed=true]{background:#a25534}.card-body{padding:12px 14px}.card-kicker{font-size:8px;letter-spacing:1px;color:var(--muted)}.card-heading{display:flex;align-items:center;justify-content:space-between;margin:4px 0 10px;gap:8px}h3{margin:0;font-size:19px;font-weight:500;letter-spacing:1px}.location-button{padding:4px 7px;border:0;background:transparent;font-size:10px;color:#92502e}.pending{font-size:9px;color:var(--muted)}.route-button{font-size:10px;padding:7px 10px;width:100%;background:#f0f1ea;border-color:#e6e8df}.no-route{font-size:9px;color:var(--muted)}.map-bottom{position:absolute;z-index:450;left:50%;bottom:22px;transform:translateX(-50%);max-width:calc(100% - 620px);min-width:240px;text-align:center;pointer-events:none;padding:10px 17px;background:#f6f4efed;border-radius:8px;box-shadow:0 3px 18px #243e3310}.map-key{font-size:10px;letter-spacing:1px}#map-status{font-size:10px;line-height:1.6;margin:6px 0 0;color:var(--muted)}.summit-pin{background:none;border:0}.summit-pin span{display:flex;align-items:center;justify-content:center;width:26px;height:26px;color:var(--ink);background:#fffdf8;border:1px solid #6d806b;border-radius:50%;font-size:13px;box-shadow:0 2px 6px #14362440;transition:transform .15s,background .15s}.summit-pin.active span{background:var(--accent);color:white;border-color:white;transform:scale(1.25);box-shadow:0 0 0 5px #b86b4838}.leaflet-tooltip{font-family:inherit;border:0;border-radius:5px;color:var(--ink);font-size:11px}.leaflet-control-zoom{margin-left:calc(var(--rail) + 44px)!important;margin-top:155px!important}.leaflet-control-attribution{font-size:9px!important}.notice{position:absolute;z-index:650;top:140px;left:50%;transform:translateX(-50%);width:min(440px,80%);padding:15px;background:#fff5e9;border:1px solid #cba98b;border-radius:8px;font-size:12px;line-height:1.8}#route-panel{position:absolute;right:22px;top:16px;width:300px;z-index:700;padding:19px;background:#fffdf8;border:1px solid var(--line);border-radius:10px;box-shadow:0 10px 50px #16392f40;max-height:calc(100% - 40px);overflow:auto}.panel-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}.panel-heading h2{font-size:19px;font-weight:500;margin:0}.panel-heading button{border:0;background:none;padding:4px 8px}.route-controls fieldset{border:0;padding:0;margin:0}.route-controls legend{font-size:10px;color:var(--muted);margin-bottom:8px}.route-controls label{display:flex;align-items:center;gap:8px;padding:9px 0;font-size:12px;cursor:pointer}.route-controls input{accent-color:var(--ink);width:17px;height:17px}.route-controls i{width:17px;height:3px;border-radius:2px}.route-controls p{font-size:10px;color:var(--muted);line-height:1.8}.route-actions{display:flex;gap:8px}.route-actions button{font-size:10px}.image-error{position:absolute;inset:25% 10px auto;padding:8px;background:#fff8e9ed;font-size:10px;pointer-events:none}.cards-hidden .card-rail{display:none}.cards-hidden .map-bottom{max-width:70%}.cards-hidden .leaflet-control-zoom{margin-left:20px!important}#tile-notice{top:auto;bottom:110px;font-size:10px;width:auto;max-width:350px;pointer-events:none}
@media(min-width:1500px){:root{--rail:300px}.image-wrap{aspect-ratio:1.85}.card-body{padding:15px 17px}}
@media(max-width:1000px) and (min-width:761px){:root{--rail:210px}.brand small{font-size:9px;padding-left:10px}.navbar{padding:0 20px}.left-rail{left:12px}.right-rail{right:12px}.map-title{padding:12px}.map-title h1{font-size:16px}.map-bottom{max-width:calc(100% - 470px);min-width:220px}}
@media(max-width:760px){.navbar{height:94px;padding:10px 14px;flex-wrap:wrap;gap:7px}.brand svg{width:24px;height:24px}.brand>span{font-size:24px}.brand small{font-size:9px;margin-left:2px;padding-left:12px;letter-spacing:.3px}.navbar nav{width:100%;justify-content:flex-end;gap:6px}.navbar nav button{font-size:10px;padding:5px 9px}.atlas{height:calc(100dvh - 94px)}.map-title{top:12px;padding:9px 14px}.map-title h1{font-size:16px;margin:3px 0}.map-title .eyebrow{font-size:7px}.map-title p{font-size:9px}.card-rail{top:auto;bottom:23px;height:218px;left:0;right:0;width:100%;overflow-x:auto;overflow-y:hidden;padding:7px 15px;scroll-snap-type:x proximity}.rail-title{display:none}.right-rail{display:none}.card-list{flex-direction:row;gap:12px;width:max-content}.card{width:225px;scroll-snap-align:center}.image-wrap{aspect-ratio:2.65}.card-body{padding:8px 11px}.card-heading{margin:2px 0 5px}h3{font-size:17px}.route-button{padding:5px}.motion-button{font-size:9px;padding:5px 8px}.map-bottom{bottom:249px;min-width:0;max-width:90%;width:max-content;padding:7px 12px}.map-key{display:none}#map-status{margin:0;font-size:9px}.leaflet-control-zoom{margin-left:12px!important;margin-top:100px!important}#route-panel{right:10px;top:10px;max-height:calc(100% - 25px)}.cards-hidden .map-bottom{bottom:25px}.notice{top:100px}#tile-notice{bottom:285px;max-width:85%}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
/* Layout zoom enlarges the card's actual box, so siblings move with it. */
.card-rail { scrollbar-width: none; overflow-anchor: none; }
.card-rail::-webkit-scrollbar { display: none; }
.card {
  position: relative;
  zoom: 1;
  transition: border-color 180ms ease, box-shadow 180ms ease;
}
/* Card zoom is interpolated by animateCardSize so layout moves smoothly. */
@media (min-width: 761px) {
  .card-rail { padding: 0 12px 22px; }
  .card-rail {
    width: calc((var(--rail) - 24px) * var(--rail-scale, 1) + 24px);
    z-index: 460;
  }
  .card-list { padding-top: 7px; align-items: flex-start; }
  .right-rail .card-list { align-items: flex-end; }
  .card { width: calc(var(--rail) - 24px); }
  .rail-title { width: calc(var(--rail) - 24px); }
  .right-rail .rail-title { margin-left: auto; }
}
@media (max-width: 760px) {
  .card-rail { padding-top: 12px; }
  .card-rail { height: calc(218px + (var(--rail-scale, 1) - 1) * 214px); }
  .card-list { gap: 18px; align-items: flex-end; }
  .card { width: min(225px, calc((100vw - 30px) / 1.5)); }
  .atlas:has(.card.highlighted):not(.cards-hidden) .map-bottom { bottom: 350px; }
}