:root{color-scheme:light;--paper:#f7f6f0;--white:#fffefa;--ink:#1e3029;--green:#24513f;--deep:#17372d;--muted:#5d6a61;--line:#e1e4da;--sage:#eaf0e5;--gold:#e9ca8f;--serif:"Noto Serif SC","Songti SC","STSong","SimSun",serif;--sans:Inter,"PingFang SC","Microsoft YaHei","Noto Sans CJK SC",system-ui,sans-serif;--shadow:0 10px 40px #213c2910}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:86px}
body{margin:0;background:var(--paper);font-family:var(--sans);color:var(--ink);font-size:14px;line-height:1.55}
button,input,select{font:inherit}
button,a,select{-webkit-tap-highlight-color:transparent}
button{cursor:pointer;color:inherit}
a{color:inherit;text-decoration:none}
button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible{outline:2px solid #407960;outline-offset:3px}
img{max-width:100%;display:block}
h1,h2,h3,p{margin:0}
[hidden]{display:none!important}
.symbols{width:0;height:0;position:absolute;overflow:hidden}
.icon{width:18px;height:18px;flex:none;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;vertical-align:middle}
.shell{width:min(1280px,calc(100% - 100px));margin-inline:auto}
.sr-only,.skip:not(:focus){position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip:focus{position:fixed;z-index:50;top:8px;left:8px;background:white;padding:12px;border-radius:5px}
.topbar{height:70px;background:#fbfaf5;position:sticky;top:0;z-index:10;border-bottom:1px solid #e6e7dc}
.top-inner{height:100%;display:flex;align-items:center;justify-content:space-between;gap:20px}
.brand{display:inline-flex;align-items:center;gap:11px;flex:none}
.brand-mark{width:40px;height:40px;border-radius:11px;background:var(--green);color:#f9f5e6;display:grid;place-items:center}
.brand-mark svg{width:29px;height:29px}
.brand b{font-family:var(--serif);font-weight:900;letter-spacing:.085em;font-size:21px;line-height:1.05;display:block}
.brand small{display:block;font-size:8px;line-height:1.5;font-weight:800;letter-spacing:.22em;color:#536a58;margin-top:4px}
.topbar nav{display:flex;align-items:center;gap:34px;color:#4b5d51;font-size:14px;font-weight:650}
.topbar nav a{display:flex;align-items:center;gap:7px;white-space:nowrap}
.topbar nav a:hover,.panel-foot a:hover,.map-note button:hover{color:#287654}
.button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:42px;padding:0 15px;border:1px solid transparent;border-radius:8px;background:none;font-weight:700;white-space:nowrap;transition:background .2s,border-color .2s,transform .2s}
.button:hover{transform:translateY(-1px)}
.saved-top,.outline{border-color:#dce2d6;background:#fffefa;color:var(--green)}
.saved-top:hover,.outline:hover{background:var(--sage)}
.saved-count{background:var(--green);color:white;border-radius:20px;min-width:20px;text-align:center;font-size:11px;padding:2px 5px}
.hero{position:relative;min-height:475px;background:#233d2c;color:#fffdfa;isolation:isolate;overflow:hidden}
.hero-photo,.hero-overlay{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-1}
.hero-photo{object-position:50% 48%}
.hero-overlay{background:linear-gradient(90deg,#12271ffa 0%,#12271fdf 19%,#15291fab 40%,#14261e24 71%),linear-gradient(0deg,#13261fb0 0%,transparent 36%)}
.hero-inner{min-height:475px;position:relative;display:flex;align-items:center;padding-block:45px 53px}
.eyebrow{font-size:10px;letter-spacing:.18em;font-weight:800}
.hero-label{display:flex;align-items:center;gap:10px;color:#f2e4c9;letter-spacing:.17em;margin-bottom:21px}
.hero-label>span:first-child,.section-kicker>span{width:7px;height:7px;display:inline-block;border-radius:50%;background:#c58049}
.hero-label>span:first-child{background:#e7b871;box-shadow:0 0 0 4px #e7b87128}
.hero-dash{width:23px;border-top:1px solid #ecddbf8c}
.hero h1{font-family:var(--serif);font-size:clamp(48px,6vw,86px);font-weight:900;line-height:1.08;letter-spacing:.02em;text-shadow:0 3px 22px #0003}
.hero h1 span{color:#f2ce8e}
.hero p{margin-top:23px;color:#f1ede0;font-size:15px;line-height:1.85;letter-spacing:.035em}
.hero-actions{margin-top:26px;display:flex;gap:11px;flex-wrap:wrap}
.hero-actions .button{min-height:46px;padding-inline:15px}
.primary{background:var(--green);color:#fffefa}
.primary:hover{background:#32654e}
.hero-actions .primary{background:#eace97;color:#23332a}
.hero-actions .primary:hover{background:#f7dbab}
.hero-secondary{border-color:#f8f1dc72;color:#fffdfa;background:#152a2180}
.hero-secondary:hover{background:#1f3b30}
.action-arrow{margin-left:4px}
.hero-caption{position:absolute;bottom:28px;right:0;display:flex;align-items:center;gap:9px;padding:11px 14px;border:1px solid #f4f0e057;border-radius:8px;background:#13261db5;backdrop-filter:blur(8px);font-size:12px}
.hero-caption small{display:block;font-size:10px;color:#f5e8d3bc;margin-top:1px}
.caption-num{padding-left:10px;margin-left:5px;border-left:1px solid #eee5cb4a;color:#e7cca0;letter-spacing:.12em;font-size:9px}
.section{padding-top:47px}
.section-head{display:flex;align-items:end;justify-content:space-between;gap:18px;margin-bottom:20px}
.section-kicker{display:flex;align-items:center;gap:8px;color:#5c6d58;margin-bottom:7px}
.section-kicker>span{width:6px;height:6px}
.section-head h2,.travel-note h2,.dialog-top h2,.detail h1,.detail h2{font-family:var(--serif);font-weight:900}
.section-head h2{font-size:clamp(27px,3vw,42px);line-height:1.22;letter-spacing:.005em}
.section-head p{margin-top:7px;color:var(--muted);font-size:13px}
.section-badge{display:inline-flex;align-items:center;gap:6px;white-space:nowrap;border:1px solid #dde5d6;background:#eef2e8;border-radius:30px;padding:7px 12px;color:#3f644d;font-size:12px}
.section-badge b{font-size:16px}
.explore-frame{border:1px solid #dce1d5;border-radius:15px;background:var(--white);box-shadow:var(--shadow);overflow:hidden}
.toolbar{display:flex;align-items:center;justify-content:space-between;gap:14px;min-height:61px;padding:10px 13px 10px 16px;border-bottom:1px solid var(--line)}
.chips{display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.chip{display:inline-flex;align-items:center;gap:5px;border:1px solid #e3e7df;background:#f7f8f3;color:#496050;min-height:34px;padding:0 10px;border-radius:7px;font-size:12px;white-space:nowrap;font-weight:700}
.chip .icon{width:15px;height:15px}
.chip:hover{background:#eef2e9}
.chip[aria-pressed="true"]{background:var(--green);border-color:var(--green);color:white}
.search{display:flex;align-items:center;gap:7px;background:#f6f7f1;border:1px solid #e2e6dc;border-radius:7px;color:#597361;padding:0 10px;min-height:36px;width:min(240px,25%);flex:none}
.search input{width:100%;min-width:0;background:none;border:0;color:var(--ink);outline:none;font-size:12px}
.search:focus-within{outline:2px solid #628c73;outline-offset:1px}
.search input:focus-visible{outline:none}
.explore-grid{display:grid;grid-template-columns:minmax(0,1fr) 294px;min-height:465px}
.map-wrap{position:relative;background:#d9e0ca;min-width:0;min-height:465px;overflow:hidden;isolation:isolate}
#map,.fallback,#fallback-pins{position:absolute;inset:0}
.fallback{background:#dbe4ce url('./assets/terrain-city-overview.webp') center/100% 100% no-repeat}
.fallback-pin{position:absolute;transform:translate(-50%,-50%);display:grid;place-items:center;min-width:24px;height:24px;border:2px solid white;border-radius:30px;color:white;font-size:10px;font-weight:800;box-shadow:0 2px 8px #172e25a0;padding:0 4px}
.fallback-pin:hover,.fallback-pin:focus-visible{z-index:2}
.map-mode,.map-controls,.map-status{position:absolute;z-index:2;background:#fffefa;border:1px solid #c9d2c2;box-shadow:0 3px 14px #172e2522;border-radius:8px}
.map-mode{top:14px;left:14px;display:flex;padding:3px;gap:3px}
.map-mode button,.map-controls button{background:transparent;border:0}
.map-mode button{font-size:11px;white-space:nowrap;padding:6px 9px;border-radius:5px;font-weight:800;color:#526557}
.map-mode button[aria-pressed="true"]{background:var(--green);color:white}
.map-mode .icon{width:14px;height:14px}
.map-controls{right:14px;top:14px;display:grid;overflow:hidden}
.map-controls button{width:34px;height:34px}
.map-controls button+button{border-top:1px solid var(--line)}
.map-controls button:hover{background:var(--sage)}
.map-status{bottom:16px;left:14px;padding:5px 9px;font-size:10px;font-weight:700;color:#365745;display:flex;gap:6px;align-items:center;pointer-events:none}
.map-status span{width:6px;height:6px;border-radius:50%;background:#74a272}
.map-panel{border-left:1px solid #dce1d5;display:flex;min-width:0;flex-direction:column;background:#fffefa;height:465px}
.panel-head{display:flex;justify-content:space-between;align-items:center;padding:17px 15px 11px;border-bottom:1px solid #e8ebe2}
.panel-head .eyebrow{color:#70856f;font-size:9px}
.panel-head h3{font-size:20px;font-family:var(--serif);font-weight:900;margin-top:1px}
#map-count{font-size:11px;border-radius:20px;background:#eff3e9;color:#476550;padding:3px 9px;font-weight:700}
.map-list{flex:1;min-height:0;overflow:auto;overscroll-behavior:contain}
.map-item{display:flex;align-items:center;gap:9px;border-bottom:1px solid #edf0e7;padding:9px 12px;font-size:13px}
.map-item:hover{background:#f4f6ee}
.map-item .num{font-size:10px;font-weight:800;color:#718674;font-variant-numeric:tabular-nums;min-width:15px}
.map-item img{width:49px;height:43px;object-fit:cover;border-radius:5px;background:#e5eade;flex:none}
.map-item .mi-text{flex:1;min-width:0}
.map-item strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px}
.map-item small{display:block;color:#607063;font-size:10px;margin-top:2px}
.map-item>.icon{width:13px;color:#6b7e6d}
.panel-foot{border-top:1px solid var(--line);padding:10px 14px}
.panel-foot a{display:flex;justify-content:space-between;align-items:center;font-size:12px;font-weight:800;color:var(--green)}
.map-note{display:flex;justify-content:space-between;gap:10px;align-items:center;color:#5c6d60;font-size:11px;margin-top:12px}
.map-note .icon{width:13px;height:13px}
.map-note button,.footer button,.directory-meta button{border:0;background:none;color:var(--green);font-size:inherit;font-weight:700;padding:0;text-align:left}
.spot-section{padding-top:62px}
.region{display:flex;align-items:center;gap:5px;border:1px solid #dde3d6;background:#fffefa;border-radius:7px;padding:7px 9px;color:var(--green);white-space:nowrap}
.region select{background:transparent;border:0;color:var(--ink);font-size:12px;cursor:pointer}
.directory-meta{min-height:20px;display:flex;justify-content:space-between;font-size:12px;color:var(--muted);margin-bottom:9px}
.spot-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.spot-card{background:var(--white);border:1px solid #e0e4d8;border-radius:12px;overflow:hidden;box-shadow:var(--shadow);position:relative;transition:transform .2s,box-shadow .2s}
.spot-card:hover{transform:translateY(-3px);box-shadow:0 14px 32px #213c291c}
.card-photo{position:relative;display:block;aspect-ratio:1.92;overflow:hidden;background:#dce4d5}
.card-photo img{width:100%;height:100%;object-fit:cover;transition:transform .35s}
.spot-card:hover .card-photo img{transform:scale(1.045)}
.card-photo::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#0e211c33,transparent 45%,#13251e75)}
.rank-badge,.grade-badge{position:absolute;z-index:1;padding:4px 8px;border-radius:5px;font-size:10px;font-weight:800;letter-spacing:.06em}
.rank-badge{top:10px;left:10px;background:#193429dd;color:#fff}
.grade-badge{bottom:9px;left:10px;background:#f6e3af;color:#46351f}
.icon-button{width:36px;height:36px;border:1px solid var(--line);background:var(--white);color:var(--green);border-radius:7px;display:grid;place-items:center}
.icon-button:hover{background:var(--sage)}
.card-save{position:absolute;z-index:2;right:9px;top:9px;border-color:#fff8}
[data-save][aria-pressed="true"] .icon{fill:#dfbc78;stroke:#3c553f}
.card-body{padding:13px 14px 14px}
.card-meta{display:flex;align-items:center;gap:4px;font-size:11px;color:#527359;font-weight:700}
.card-meta .icon{width:12px;height:12px}
.card-body h3{font-family:var(--serif);font-weight:900;font-size:21px;line-height:1.3;margin:5px 0 6px}
.card-body h3 a:hover{color:#347152}
.card-body p{color:var(--muted);font-size:12px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:36px}
.card-actions{border-top:1px solid #edf0e9;margin-top:11px;padding-top:9px;display:flex;justify-content:space-between;align-items:center;gap:7px}
.card-actions a,.card-actions button{font-size:11px;font-weight:800;color:var(--green);white-space:nowrap}
.card-actions button{border:1px solid #e3e9dc;background:#edf3e7;padding:5px 7px;border-radius:5px}
.card-actions button:hover{background:#dee9d8}
.card-actions .icon{width:13px;height:13px}
.more-row{margin-top:21px;text-align:center}
.empty{padding:36px 16px;color:var(--muted);text-align:center;grid-column:1/-1}
.travel-note{margin-block:48px 50px;padding:20px 22px;display:flex;align-items:center;gap:15px;border-radius:12px;border:1px solid #dce6d7;background:#eef3e9}
.note-icon{width:43px;height:43px;display:grid;place-items:center;background:#dce9d9;color:var(--green);border-radius:9px;flex:none}
.travel-note h2{font-size:20px}
.travel-note p{color:var(--muted);font-size:12px;margin-top:2px}
.travel-note .button{margin-left:auto;font-size:12px}
.footer{border-top:1px solid #dfe4d9;background:#f0f2e9}
.footer-inner{display:flex;justify-content:space-between;align-items:center;gap:16px;padding-block:21px}
.footer-inner>div{display:flex;gap:13px;font-size:12px;color:var(--muted)}
.footer-line{font-size:11px;color:#4f6454;white-space:nowrap}.footer-line span{margin-left:6px;color:#6e826e;font-variant-numeric:tabular-nums}
dialog{border:1px solid var(--line);border-radius:14px;color:var(--ink);background:var(--white);width:min(550px,calc(100% - 24px));max-height:85dvh;padding:0;box-shadow:0 20px 85px #112d2660}
dialog::backdrop{background:#10271e90;backdrop-filter:blur(3px)}
.dialog-top{display:flex;justify-content:space-between;gap:15px;padding:18px 20px;border-bottom:1px solid var(--line)}
.dialog-top .eyebrow{color:#637b65;font-size:9px}
.dialog-top h2{font-size:25px}
#dialog-body{padding:18px 20px;color:var(--muted)}
#dialog-body p+p{margin-top:10px}
#dialog-body ul{padding-left:20px}
#dialog-body li+li{margin-top:7px}
#dialog-body a:not(.button,.map-item),.source-link{color:var(--green);text-decoration:underline;text-underline-offset:2px}
.dialog-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.toast{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);z-index:20;background:var(--deep);color:#fff;padding:10px 16px;border-radius:30px;font-size:13px;box-shadow:var(--shadow)}
.detail{padding-block:25px 55px}
.crumbs{display:flex;align-items:center;gap:7px;color:var(--muted);font-size:12px;margin-bottom:18px;flex-wrap:wrap}
.crumbs a{color:var(--green);font-weight:700}
.crumbs .icon{width:12px;height:12px}
.detail-cover{position:relative;min-height:400px;display:flex;align-items:end;border-radius:14px;overflow:hidden;color:#fffefa;background:#254a3c;isolation:isolate}
.detail-cover img,.detail-cover::after{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-1}
.detail-cover::after{content:"";background:linear-gradient(0deg,#122a21ec 0%,#122a2152 63%,#122a2100)}
.detail-cover-copy{padding:27px clamp(19px,4vw,44px)}
.detail-cover .eyebrow{color:#e8cc97}
.detail h1{font-size:clamp(35px,5.5vw,65px);line-height:1.15;margin:6px 0 10px}
.detail-cover p{color:#faf3df}
.detail-credit{display:flex;justify-content:flex-end;margin:7px 0 16px;font-size:11px;color:var(--muted)}
.detail-credit a{text-decoration:underline}
.detail-grid{display:grid;grid-template-columns:minmax(0,1fr) 315px;gap:17px;align-items:start}
.detail-box{border:1px solid var(--line);border-radius:12px;background:var(--white);padding:20px 22px;box-shadow:var(--shadow)}
.detail h2{font-size:25px;margin-bottom:8px}
.detail-box p{color:var(--muted);line-height:1.85}
.detail-box h3{margin:18px 0 5px;font-size:15px}
.detail-box dl{margin:0}
.detail-box dl div{padding:11px 0;border-bottom:1px solid #edf0e6}
.detail-box dt{font-weight:800;font-size:11px;color:#667b6b;letter-spacing:.06em}
.detail-box dd{margin:3px 0 0;font-size:13px}
.detail-box .source-link{display:inline-block;margin-top:12px;font-size:12px}
.detail-buttons{display:grid;gap:8px;margin-top:15px}
.detail-buttons .button{justify-content:center}
.detail-secondary{display:flex;gap:8px;margin-top:13px;flex-wrap:wrap}
.detail-secondary .button{font-size:12px}
.related{margin-top:23px}
.related h2{margin-bottom:12px}
.maplibregl-ctrl-attrib{font-size:9px!important;background:#fffef3dd!important}
.maplibregl-canvas:focus-visible{outline:2px solid var(--green);outline-offset:-3px}
@media(max-width:1050px){.shell{width:calc(100% - 54px)}.explore-grid{grid-template-columns:minmax(0,1fr) 249px}.hero,.hero-inner{min-height:430px}.chips{gap:5px}.chip{padding-inline:7px}.hero-caption{bottom:20px}}
@media(max-width:790px){.shell{width:calc(100% - 32px)}.topbar{height:62px}.topbar nav{gap:16px;font-size:12px}.hero,.hero-inner{min-height:410px}.hero-photo{object-position:57% 50%}.hero-overlay{background:linear-gradient(90deg,#15291eea,#15291ea6 47%,#15291e37),linear-gradient(0deg,#15291e97,transparent 29%)}.explore-grid{grid-template-columns:minmax(0,1fr) 208px}.map-wrap{min-height:398px}.map-panel{height:398px}.toolbar{flex-wrap:wrap}.search{width:100%}.spot-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.detail-grid{grid-template-columns:1fr 240px}.detail-box{padding:16px}.footer-line span{display:none}}
@media(max-width:565px){html{scroll-padding-top:70px}.top-inner{gap:8px}.topbar nav a:first-child .icon{display:none}.topbar nav{gap:11px}.brand{gap:6px}.brand-mark{width:33px;height:33px;border-radius:8px}.brand-mark svg{width:24px;height:24px}.brand b{font-size:17px}.brand small{font-size:7px;letter-spacing:.13em}.saved-top{padding:0 7px;min-height:34px;font-size:11px;gap:3px}.saved-top .icon{width:15px;height:15px}.saved-count{min-width:15px;font-size:9px;padding:0 3px}.hero,.hero-inner{min-height:392px}.hero-inner{padding-block:37px 66px}.hero h1{font-size:54px}.hero-label{margin-bottom:15px;font-size:9px}.hero p{margin-top:17px;font-size:13px}.hero-actions{margin-top:17px}.hero-actions .button{min-height:42px;font-size:12px}.hero-caption{bottom:10px;padding:5px 8px;font-size:10px}.hero-caption .icon{width:13px}.hero-caption small,.caption-num{display:none}.section{padding-top:34px}.section-head{align-items:flex-start;margin-bottom:14px}.section-head p{font-size:12px}.section-badge{font-size:10px;padding:4px 6px;align-self:end}.section-badge .icon{display:none}.section-badge b{font-size:13px}.toolbar{padding:9px 8px;gap:8px}.chip{font-size:10px;min-height:29px;padding-inline:6px}.chip .icon{width:13px;height:13px}.explore-grid{grid-template-columns:1fr}.map-wrap{min-height:345px}.map-panel{height:266px;border-left:0;border-top:1px solid var(--line)}.panel-head{padding:9px 12px 7px}.panel-head h3{font-size:17px}.map-note{font-size:10px;align-items:start}.map-note button{white-space:nowrap}.spot-section{padding-top:42px}.spot-grid{gap:9px}.card-body{padding:8px}.card-body h3{font-size:16px}.card-meta,.card-body p{font-size:10px}.card-body p{min-height:31px}.card-save{width:29px;height:29px;right:6px;top:6px}.card-save .icon{width:14px}.rank-badge,.grade-badge{left:6px;font-size:8px;padding:3px 5px}.rank-badge{top:6px}.grade-badge{bottom:6px}.card-actions{padding-top:6px;margin-top:7px;gap:3px}.card-actions a,.card-actions button{font-size:9px}.card-actions .icon{width:10px;height:10px}.region{padding:5px;align-self:end}.region select{font-size:10px}.region .icon{width:13px}.travel-note{margin-block:33px;padding:14px;flex-wrap:wrap;gap:9px}.travel-note h2{font-size:16px}.travel-note .button{margin-left:0;min-height:34px}.footer-inner{gap:7px;padding-block:15px}.footer-inner>div,.footer-line{font-size:10px}.footer-inner>div{gap:6px}.detail-cover{min-height:270px}.detail{padding-top:15px}.detail-grid{grid-template-columns:1fr}.detail-grid>aside{grid-row:1}.detail-credit{justify-content:start}.detail-box h2{font-size:21px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
.map-marker,.map-cluster{font-family:var(--sans);display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:1}
.map-marker:hover,.map-marker:focus-visible,.map-cluster:hover,.map-cluster:focus-visible{z-index:5}
.map-marker .pin-body{display:grid;place-items:center;width:25px;height:25px;border-radius:50%;border:2px solid #fffefa;background:var(--pin);color:#fff;box-shadow:0 2px 6px #153c31a6}
.map-marker .pin-body .icon{width:13px;height:13px;stroke-width:2}
.map-marker:hover .pin-body,.map-marker.is-selected .pin-body{box-shadow:0 0 0 4px #fffefa92,0 3px 8px #17372daa}
.map-marker.is-selected{z-index:6}
.pin-label{position:absolute;left:50%;top:29px;transform:translateX(-50%);width:max-content;max-width:140px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border:1px solid #d5dfcd;border-radius:4px;background:#fffef5f5;padding:2px 5px;color:#244d38;font-size:10px;font-weight:800;box-shadow:0 2px 6px #23432d28;pointer-events:none}
.map-cluster{min-width:29px;height:29px;border:2px solid #fffefa;border-radius:50%;background:#2a5844;color:#fff;box-shadow:0 0 0 3px #2a584443,0 2px 6px #153c317a;font-size:11px;font-weight:800}
.map-cluster:hover{background:#17432e}
.fallback-wrap{position:absolute;transform:translate(-50%,-50%)}
.ticket-qr{width:120px;max-height:135px;object-fit:contain;margin-top:12px}
.booking-label{color:var(--green)}
.saved-list{margin-top:10px}
.terrain-label{color:#365a47;font-size:10px;letter-spacing:.08em;font-weight:850;text-shadow:0 0 2px #f1f4e8,0 0 4px #f1f4e8,0 0 6px #f1f4e8;pointer-events:none;z-index:0;white-space:nowrap}
.season-note{border-left:2px solid #b9814e;padding:3px 8px;background:#faf2df;color:#704d2e}
.detail-box .season-note{margin-top:10px;color:#704d2e;font-size:12px}
.season-note a{text-decoration:underline;text-underline-offset:2px}
.boundary-swatch{display:inline-block;width:16px;height:2px;background:#315744;vertical-align:middle;margin:0 3px 2px 0}
.gallery {
  padding-top: 58px;
}

.gallery-head { align-items: end; }
.gallery-tools {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 0;
  border-top: 1px solid var(--line);
}

.gallery-tools .region { max-width: 100%; }
.gallery-tools select { max-width: min(240px, 70vw); }
.gallery-status { color: var(--muted); font-size: 13px; margin: 0 0 12px; }
.gallery-status:empty { display: none; }
.gallery-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}

.gallery-card {
  min-width: 0;
  overflow: hidden;
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: 12px;
}

.gallery-cover {
  position: relative;
  width: 100%;
  display: block;
  padding: 0;
  border: 0;
  background: var(--sage);
  aspect-ratio: 4 / 3;
}

.gallery-cover img { width: 100%; height: 100%; object-fit: cover; }
.photo-rank {
  position: absolute;
  left: 10px;
  top: 10px;
  min-width: 28px;
  padding: 3px 6px;
  border-radius: 6px;
  background: var(--deep);
  color: white;
  font-size: 13px;
  font-weight: 800;
}

.gallery-card-info { padding: 12px; }
.photo-spot { color: var(--green); font-weight: 800; }
.photo-spot:hover { text-decoration: underline; }
.photo-caption { margin-top: 5px; overflow-wrap: anywhere; color: var(--ink); }
.gallery-card-bottom {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 10px;
}

.photo-date { color: var(--muted); font-size: 11px; margin-right: auto; }
.photo-like, .photo-remove {
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 4px 9px;
  background: var(--white);
  font-size: 12px;
  white-space: nowrap;
}

.photo-like[aria-pressed="true"] { color: #a43e3e; background: #fcf0ed; border-color: #eac5bb; }
.photo-like:disabled, .photo-form .button:disabled { opacity: .65; cursor: wait; }
.photo-remove { padding: 4px; border-color: transparent; color: var(--muted); }
.photo-form {
  display: grid;
  gap: 13px;
  padding: 18px 20px 22px;
}

.photo-form p { font-size: 13px; color: var(--muted); }
.photo-form label { display: grid; gap: 5px; font-weight: 700; }
.photo-form input, .photo-form select {
  min-width: 0;
  width: 100%;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--white);
  color: var(--ink);
}

.upload-preview { max-height: 160px; border-radius: 6px; }
#photo-dialog { width: min(920px, calc(100% - 24px)); }
.full-photo { max-height: 65vh; margin: auto; object-fit: contain; }
.full-photo-caption { padding: 12px 16px; overflow-wrap: anywhere; }

@media (max-width: 790px) {
  .gallery-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
}

@media (max-width: 565px) {
  .gallery { padding-top: 40px; }
  .gallery-head .button { min-height: 34px; padding-inline: 8px; font-size: 11px; }
  .gallery-card-info { padding: 7px; }
  .gallery-card-bottom { gap: 3px; }
  .photo-date { font-size: 10px; }
  .photo-like { padding-inline: 5px; }
  .topbar nav { gap: 7px; }
}

@media (max-width: 430px) {
  .topbar nav { font-size: 11px; }
  .saved-top > span:not(.saved-count) { display: none; }
}

@media (max-width: 350px) {
  .gallery-grid { grid-template-columns: 1fr; }
  .topbar nav { gap: 5px; }
  .topbar .brand-mark { width: 28px; height: 28px; }
  .topbar .brand b { font-size: 15px; }
}