@font-face { font-family:'Noto Sans SC'; font-style:normal; font-weight:400 700; font-display:swap; src:url('/assets/noto-sans-sc.ttf') format('truetype'); }
@font-face { font-family:'Noto Serif SC'; font-style:normal; font-weight:500 700; font-display:swap; src:url('/assets/noto-serif-sc.ttf') format('truetype'); }
@font-face { font-family:'Noto Sans Khmer'; font-style:normal; font-weight:400 700; font-display:swap; src:url('/assets/noto-sans-khmer.ttf') format('truetype'); }
/* KPS-040: the guide is a native disclosure, available without JavaScript. */
.city-guide { margin-top:10px; font-size:12px; line-height:1.7; color:#f0dfb6; text-align:center; }
.city-guide > summary { cursor:pointer; padding:8px 12px; min-height:44px; list-style:none; text-decoration:underline; text-underline-offset:4px; }
.city-guide > summary::-webkit-details-marker { display:none; }
.guide-close { display:none; }
.city-guide[open] { position:fixed; inset:0; z-index:3000; margin:0; background:#123c3ae8; text-align:left; padding:72px 20px 20px; }
.city-guide[open] > summary { position:absolute; top:max(15px,env(safe-area-inset-top)); right:max(16px,env(safe-area-inset-right)); display:flex; align-items:center; gap:18px; color:#f2e3be; max-width:calc(100% - 32px); }
.city-guide[open] .guide-close { display:inline; font-size:28px; line-height:1; }
.city-guide-panel { max-width:680px; margin:0 auto; max-height:calc(var(--viewport-height,100vh) - 100px); overflow-y:auto; overscroll-behavior:contain; background:#f3edda; color:#294f46; border:1px solid #bca46b; border-radius:6px; padding:24px; font-size:15px; line-height:1.9; box-shadow:0 14px 60px #031f2570; }
.city-guide-panel h2 { margin:0 0 12px; font-size:24px; }
.city-guide-panel h3 { margin-top:22px; font-size:18px; }
.city-guide-panel a,.static-place a { color:#2f6657; text-decoration:underline; text-underline-offset:3px; }
.guide-languages { display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:8px 22px; margin:12px 0; }
.guide-languages a { display:inline-flex; align-items:center; min-height:44px; }
.guide-languages a[aria-current=page] { font-weight:700; }
.guide-place-list { list-style:none; padding:0; display:grid; grid-template-columns:1fr 1fr; gap:12px 24px; }
.guide-place-list h4 { margin:0; font-size:16px; }
.guide-place-list h4 a { display:inline-block; padding-block:7px; }
.guide-place-list p { margin:0; font-size:13px; }
.guide-artwork { font-size:13px; opacity:.85; border-top:1px solid #a7946555; padding-top:15px; }
#static-city-guide { position:fixed; z-index:2000; inset:0; background:#174e55 url('/assets/terrain.webp') center/cover; display:flex; align-items:center; justify-content:center; }
#static-city-guide > .city-guide { border:1px solid #c8b176; background:#123c3ae8; padding:20px; border-radius:6px; }
#static-city-guide > .city-guide[open] { padding:72px 20px 20px; border:0; border-radius:0; }
.static-place { margin:0; min-height:100vh; height:auto; overflow:auto; background:#e7e4d6; color:#294f46; font:16px/1.9 "Noto Sans SC","PingFang SC",sans-serif; }
.static-place * { box-sizing:border-box; }
.static-place-content { max-width:800px; margin:0 auto; background:#f6f0df; padding:clamp(20px,5vw,48px); min-height:100vh; }
.guide-breadcrumb { font-size:13px; }
.static-place h1 { font-size:clamp(28px,5vw,40px); line-height:1.5; margin:24px 0 8px; }
.static-place h2 { font-size:20px; }
.place-subtitle { font-size:18px; margin:0 0 24px; }
.static-place figure { margin:24px 0; }
.static-place figure img { display:block; width:100%; height:auto; max-height:460px; object-fit:cover; border-radius:4px; }
.static-place figcaption { font-size:12px; opacity:.8; }
.place-highlights { display:flex; flex-wrap:wrap; gap:8px 25px; padding-left:20px; font-size:14px; }
.static-place .guide-map-cta { display:block; width:fit-content; min-height:44px; margin:28px 0; padding:12px 20px; background:#285e52; color:#f6edcf; border-radius:4px; }
.static-place footer { border-top:1px solid #bca46b55; padding-top:20px; font-size:13px; }
@media(max-width:540px) { .city-guide-panel { padding:18px; font-size:14px; } .guide-place-list { grid-template-columns:1fr; gap:8px; } .city-guide[open] { padding-inline:12px; } }
@media(max-height:540px) { .city-guide { margin-top:0; } .city-guide > summary { padding:3px 8px; min-height:32px; } .city-guide[open] { padding-top:58px; } .city-guide-panel { max-height:calc(var(--viewport-height,100vh) - 80px); } }
/* Keep the welcome artwork, logo and two main actions at their established positions. */
.entrance-content > .city-guide:not([open]) { position:absolute; right:24px; bottom:max(24px,env(safe-area-inset-bottom)); margin:0; }
.entrance-content > .city-guide:not([open]) > summary { background:#123c3a99; border-radius:3px; }
@media(max-width:760px) and (orientation:portrait) {
 .entrance-content > .city-guide:not([open]) { left:28px; right:28px; bottom:calc(80px + env(safe-area-inset-bottom)); }
}
@media(max-height:540px) and (min-aspect-ratio:6/5) {
 .entrance-content > .city-guide:not([open]) { left:32px; right:auto; bottom:8px; max-width:48%; font-size:11px; }
}

html[lang=km] .static-place { font-family:"Noto Sans Khmer","Noto Sans SC",sans-serif; }
.static-place h1,.city-guide-panel h2 { font-family:"Noto Serif SC","Noto Sans SC",serif; }
html[lang=km] .static-place h1,html[lang=km] .city-guide-panel h2 { font-family:"Noto Sans Khmer",sans-serif; }
.city-guide :focus-visible,.static-place a:focus-visible { outline:3px solid #b78b37; outline-offset:4px; }
