@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Playfair+Display:ital,wght@0,500;0,600;1,500&display=swap');
:root{--ink:#17242d;--muted:#75818a;--gold:#c99b53;--paper:#faf9f5;--line:#e7e5df;--sans:'DM Sans',Arial,sans-serif;--serif:'Playfair Display',Georgia,serif}
*{box-sizing:border-box}
html,body,#app{margin:0;height:100%;font-family:var(--sans);color:var(--ink)}
body{background:var(--paper)}
button{font:inherit;cursor:pointer}button:disabled{cursor:not-allowed;opacity:.55}
button:focus-visible,a:focus-visible,[tabindex]:focus-visible{outline:3px solid var(--gold);outline-offset:3px}
[hidden]{display:none!important}
.topbar{height:86px;background:#121e27;color:white;display:flex;align-items:center;justify-content:space-between;padding:0 32px;position:relative;z-index:5}
.brand{display:flex;align-items:center;gap:16px;text-decoration:none;color:white;min-width:0}
.brand-mark{font:500 40px var(--serif)}
.gold{color:var(--gold)}
.brand-words{display:flex;flex-direction:column;gap:2px;min-width:0}
.brand-words small{letter-spacing:2.2px;color:#aeb8bb;font-size:9px}
.brand-words strong{font:500 22px var(--serif);letter-spacing:.15px}
.brand-words strong em{font-weight:500}
.brand-subline{font-size:11px;color:#d1d7d8;letter-spacing:.25px}
.header-meta{font-size:10px;letter-spacing:1.5px;color:#aeb7bc;white-space:nowrap;margin-left:14px}.year{color:var(--gold)}
.workspace{display:grid;grid-template-columns:minmax(0,1fr) minmax(390px,420px);height:calc(100% - 86px)}
.map-area{position:relative;min-height:340px;background:#c9d5d6;overflow:hidden}
#map{position:absolute;inset:0}
.map-overlay{position:absolute;inset:0;z-index:4;display:flex;align-items:center;justify-content:center;padding:40px;text-align:center;background:#e2e8e7;color:#53616b;line-height:1.7;font-size:14px}
.map-controls{position:absolute;right:22px;top:24px;z-index:3;display:flex;background:rgba(255,255,255,.96);padding:4px;box-shadow:0 5px 24px #14202b25;border-radius:9px}
.switch{border:0;background:transparent;padding:9px 14px;border-radius:6px;font-size:12px;color:#53616a;font-weight:600}.switch.active{background:#17242d;color:white}
.map-bottom{position:absolute;z-index:3;bottom:22px;left:22px;right:22px;display:flex;justify-content:space-between;align-items:center;gap:10px;pointer-events:none}
.map-status{background:#fffef2ef;padding:10px 12px;border-radius:7px;font-size:11px;color:#59646c;box-shadow:0 2px 10px #12202b10}
.map-view-actions{display:flex;gap:7px;pointer-events:auto}
.map-view-actions button{border:0;background:#16252fe9;color:white;border-radius:7px;padding:11px 13px;font-size:11px}
.notice{position:absolute;z-index:6;left:20px;bottom:82px;max-width:350px;padding:13px 18px;color:#27353e;background:#fff9e9;border:1px solid #e5cda1;border-radius:8px;box-shadow:0 5px 18px #0001;font-size:12px}
.pin-holder{width:42px;height:42px;}
.pin{height:42px;width:42px;display:flex;align-items:center;justify-content:center;border-radius:50% 50% 50% 0;transform:rotate(-45deg);background:#192a34;color:white;border:3px solid white;box-shadow:0 2px 12px #0006;transition:background .2s,scale .2s;cursor:pointer;padding:0;position:relative}
.pin>span:first-child{transform:rotate(45deg);font-size:11px;font-weight:700;white-space:nowrap}
.pin.selected{background:#b6813b;box-shadow:0 3px 18px #0008}
.pin .pin-label{display:none;position:absolute;bottom:45px;left:20px;transform:rotate(45deg);width:max-content;max-width:210px;text-align:center;background:#16242cf2;color:white;padding:7px 10px;border-radius:6px;font-size:11px;box-shadow:0 3px 12px #0004;pointer-events:none}
.pin:hover .pin-label,.pin:focus-visible .pin-label{display:block}
.cluster-holder{width:45px;height:45px;}
.cluster-pin{width:45px;height:45px;border-radius:50%;background:#bc8d4a;color:#fff;border:3px solid #fff;box-shadow:0 3px 14px #0007;font-size:14px;font-weight:700}
.maplibregl-ctrl-bottom-right{bottom:75px!important}.maplibregl-ctrl-bottom-left{bottom:58px!important}
.sidebar{overflow-y:auto;background:var(--paper);position:relative;border-left:1px solid #d7dbda;display:flex;flex-direction:column;min-width:0}
.side-intro{padding:29px 28px 19px}
.eyebrow{font-size:10px;font-weight:700;letter-spacing:2px;color:#d6ac70}.eyebrow.dark{color:#aa8246}
.side-intro h1{font:500 30px var(--serif);margin:8px 0}
.side-intro p{font-size:12px;color:var(--muted);line-height:1.6;margin:0}
.places-container{padding:0 19px 16px}
.places-toggle{width:100%;border:1px solid var(--line);background:#f1eee7;display:flex;align-items:center;justify-content:space-between;border-radius:7px;padding:12px 13px;font-size:12px;font-weight:600;color:#25353b}
.places-toggle-right{display:flex;align-items:center;gap:14px;font-size:11px;color:#9a8b71}
.chevron{font-size:19px;line-height:0;transform:translateY(-2px)}
.places-toggle[aria-expanded='true'] .chevron{transform:translateY(2px) rotate(180deg)}
.places-list{max-height:min(56vh,560px);overflow-y:auto;border:1px solid var(--line);border-top:0;background:#fbfaf7}
.place-link{display:flex;align-items:center;width:100%;text-align:left;padding:12px 11px;gap:12px;border:0;border-bottom:1px solid var(--line);background:transparent}
.place-link:last-child{border-bottom:0}.place-link:hover,.place-link.active{background:#f0eee7}
.place-num{font:500 18px var(--serif);color:#bc9766}
.place-link>span:nth-child(2){display:flex;flex:1;flex-direction:column;gap:3px;min-width:0}
.place-link strong{font-size:12px;line-height:1.3}.place-link small{color:var(--muted);font-size:10px;line-height:1.35}
.place-link .arrow{color:#aab0ad;font-size:13px}
.place-panel{padding:22px 26px 0;border-top:1px solid var(--line);background:#fff;box-shadow:0 -8px 24px #17242d08}
.panel-heading{display:flex;justify-content:space-between;gap:9px;align-items:start}
.panel-heading h2{font:500 29px var(--serif);margin:7px 0}
.panel-heading p{color:var(--muted);margin:0 0 17px;font-size:12px;line-height:1.5}
.icon-button{border:1px solid var(--line);border-radius:50%;background:white;width:30px;height:30px;flex-shrink:0;font-size:23px;line-height:1;color:#616b70}
.tabs{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));border-bottom:1px solid var(--line);gap:1px}
.tab{border:0;border-bottom:2px solid transparent;background:none;color:#7d8585;font-size:10px;padding:12px 1px;font-weight:600;min-width:0}
.tab.active{border-bottom-color:var(--gold);color:#27333a}
#tab-content{padding:21px 0 17px;min-height:100px}
.content-title{font:500 20px var(--serif);margin:0 0 13px}
.content-p{font-size:12px;line-height:1.85;color:#4f5a61;margin:0 0 11px;white-space:pre-line}
.content-p.placeholder{color:#88908f;font-style:italic}
.media-section{border-top:1px solid var(--line);padding:22px 0 21px}
.media-heading h3{font:500 24px var(--serif);margin:5px 0}.media-heading>p{color:#92999a;font-size:11px;margin:0 0 14px;line-height:1.5}
.media-empty{border:1px dashed #ddd9d1;background:#f8f7f2;color:#889090;border-radius:9px;min-height:112px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;text-align:center;padding:17px}
.media-empty strong{font-size:12px;color:#69747b}.media-empty span:last-child{font-size:10px;line-height:1.6}.media-empty code{font-size:10px}.empty-graphic{font-size:25px;color:#c3b7a5}
.media-stage{position:relative;min-height:175px;background:#e9e9e6;border-radius:9px;overflow:hidden;display:flex;align-items:center;justify-content:center}
.gallery-photo{display:block;width:100%;max-height:350px;aspect-ratio:16/10;object-fit:contain;cursor:zoom-in;background:#ebe9e4}
.media-stage video{width:100%;max-height:350px;aspect-ratio:16/10;background:#17242d;object-fit:contain;display:block}
.media-counter{position:absolute;right:10px;top:10px;background:#11212ccf;border-radius:4px;color:white;font-size:10px;padding:5px 8px;pointer-events:none}
.media-error{padding:25px;font-size:12px;color:#983b30;word-break:break-word}
.media-caption{color:#65727a;font-size:11px;margin:10px 0 10px;line-height:1.55;min-height:10px}
.media-credit{font-size:10px;color:#8d9595}.media-credit a{color:#806443;text-decoration:underline}
.media-bottom{display:flex;align-items:center;justify-content:space-between;gap:10px}
.media-thumbs{display:flex;gap:8px;overflow-x:auto;min-width:0;padding:3px 0;flex:1}
.thumb{height:50px;min-width:62px;width:62px;border-radius:5px;border:2px solid transparent;padding:0;position:relative;background:#d9dbd8;overflow:hidden;flex-shrink:0}.thumb.active{border-color:var(--gold)}
.thumb img{width:100%;height:100%;display:block;object-fit:cover}.video-thumb{display:flex;align-items:center;justify-content:center;background:#22313b}.video-thumb-icon{color:white;font-size:20px;z-index:1;text-shadow:0 2px 5px #0008}.video-thumb img{position:absolute;inset:0;filter:brightness(.55)}
.gallery-nav{display:flex;gap:6px;flex-shrink:0}.gallery-nav button{width:32px;height:32px;background:white;border:1px solid #dedcd7;border-radius:5px;color:#34414b;font-size:20px}
.panel-footer{border-top:1px solid var(--line);display:flex;justify-content:space-between;padding:15px 0 20px;font-size:10px;color:#9ba3a5;letter-spacing:1.5px}
.side-foot{font-size:9px;letter-spacing:1.5px;color:#b1b2ad;margin:auto 29px 22px;padding-top:12px}.side-foot span{color:var(--gold)}
.lightbox{border:0;max-width:96vw;width:100%;background:#15222a;padding:45px 58px 27px;color:white;border-radius:10px}
.lightbox::backdrop{background:#090e13e8}.lightbox figure{margin:0;text-align:center}
.lightbox img{max-width:100%;max-height:78vh;object-fit:contain}
.lightbox figcaption{color:#e3e0d8;font-size:12px;margin-top:12px}
.lightbox-close,.lightbox-arrow{position:absolute;background:#ffffff26;border:0;color:white}
.lightbox-close{right:12px;top:7px;font-size:35px}
.lightbox-arrow{top:50%;font-size:38px;transform:translateY(-50%);padding:4px 9px;border-radius:5px}.lightbox-arrow.prev{left:6px}.lightbox-arrow.next{right:6px}
@media(min-width:1500px){.workspace{grid-template-columns:minmax(0,1fr) minmax(430px,480px)}.place-panel{padding-left:30px;padding-right:30px}.gallery-photo,.media-stage video{max-height:420px}}
@media(max-width:1000px){.workspace{grid-template-columns:minmax(0,1fr) 365px}.header-meta{display:none}.topbar{padding:0 22px}.brand-words strong{font-size:20px}.tab{font-size:9px}}
@media(max-width:700px){
  html,body,#app{height:auto;min-height:100%}.topbar{height:82px;padding:0 16px}.brand-mark{font-size:34px}.brand-words small{font-size:8px;letter-spacing:1px}.brand-words strong{font-size:19px}.brand-subline{font-size:9px}
  .workspace{display:flex;flex-direction:column;height:auto}.map-area{height:48svh;min-height:290px;flex-shrink:0}
  .map-controls{right:12px;top:13px}.map-bottom{bottom:12px;left:10px;right:10px}.map-status{font-size:9px;padding:9px}.map-view-actions button{font-size:10px;padding:9px 11px}.maplibregl-ctrl-bottom-right{bottom:47px!important}.maplibregl-ctrl-bottom-left{bottom:48px!important}
  .sidebar{overflow:visible}.side-intro{padding:23px 20px 15px}.side-intro h1{font-size:26px}.places-container{padding:0 17px 15px}.places-list{max-height:260px}.place-panel{padding:20px 19px 0}.panel-heading h2{font-size:28px}.tab{font-size:10px}.gallery-photo,.media-stage video{max-height:310px}.side-foot{margin:0 20px 16px}
}
@media(max-width:380px){.brand-subline{font-size:8px}.tab{font-size:9px}.brand-words strong{font-size:17px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
