/* Compact visitor UI. Geometry and images remain the primary content. */
body{user-select:none}dialog{user-select:text}button{min-height:44px}button:disabled{opacity:.35;cursor:default}
header{padding:18px 24px;align-items:center;background:linear-gradient(#111914ce,transparent);gap:15px;z-index:3}header .identity{display:flex;align-items:baseline;gap:16px}.identity h1{font-family:'Noto Sans KR',sans-serif;font-size:20px;letter-spacing:.18em;white-space:nowrap;font-weight:500}.identity>span{font-size:9px;letter-spacing:.16em;color:#dedbd0}header nav{max-width:none;flex-wrap:nowrap}header nav button,header nav a{padding:10px 14px;font-size:13px;min-height:44px;border-radius:4px}header nav .modeSwitch{background:#efeadce8;color:#212a22}
.location,.aboard .location{top:85px;left:24px;gap:9px;z-index:1}.location h2{font-size:14px;margin:0;line-height:1.8}.location>span{border:0;padding:2px 7px;background:#151e17d9;border-radius:3px;font-size:13px}.location p,.aboard .location p{font-size:10px;letter-spacing:.08em;margin-top:2px}.location>div{background:#151e17c9;padding:0 8px 5px;border-radius:3px}
footer{min-height:0;padding:0;left:24px;right:auto;bottom:22px;background:none;z-index:4}.levels{border:0;gap:4px}.levels button{border-radius:4px;padding:10px 15px;min-width:76px}.levels span{display:inline;font-size:11px;margin-left:7px}.levels button.active{background:#e4decc;color:#1c271d}
.walkpad{left:24px;bottom:86px;z-index:4}.walkpad button{width:44px;height:44px;border-radius:4px;background:#1d261be0;font-size:21px}.walkpad>button{margin-bottom:1px}
#guidedBar{position:fixed;bottom:22px;left:50%;transform:translateX(-50%);display:flex;gap:4px;z-index:5;background:#152019e8;border:1px solid #c7c8b854;border-radius:6px;padding:4px;box-shadow:0 4px 24px #0002}
#guidedBar button{border:0;border-radius:3px;background:none;padding:9px 14px;white-space:nowrap}#guideInfo{min-width:155px;text-align:center}#guideInfo small,#guideInfo span{display:block}#guideInfo small{color:#c7c4b5;font-size:10px;margin-bottom:2px}#guideInfo span{font-size:12px}#guideNext{color:#eddbac}#guidedBar button:hover{background:#ffffff15}
#miniMap,.aboard #miniMap{right:24px;bottom:22px;width:228px;z-index:4;border-radius:5px}.miniTop{padding:4px 8px;min-height:44px;border-bottom:0}#miniCollapse{min-width:44px;min-height:44px}#miniDrawing{height:148px}.miniCaption{font-size:10px}
#galleryControls,.aboard #galleryControls.boatSettingsOpen,.aboard #galleryControls:not(.boatSettingsOpen){display:block;position:static;width:auto;margin-top:20px;padding:17px;background:#ffffff05;box-shadow:none;border-radius:5px}.lightHeading{padding-top:15px}#brightness{min-height:44px!important}#sectionSelect{min-height:44px}#boatSettings,.aboard #boatSettings{display:none!important}
#visitPanel{width:min(510px,calc(100vw - 28px));max-height:calc(100dvh - 40px);padding:27px;overflow-y:auto;border-radius:8px;background:#18221d}#visitPanel h2{font-size:23px;margin:10px 0 0}#visitPanel .close{right:10px;top:9px;min-width:44px}#visitPanel p{font-size:13px;line-height:1.8}#timelineLinks{display:grid;gap:5px;margin:18px 0 10px}.timelineLink{display:flex;justify-content:space-between;text-align:left;align-items:center;min-height:48px;padding:11px 13px;background:#ffffff06;border-radius:4px}.timelineLink strong{font-size:14px;font-weight:500}.timelineLink span{font-size:11px;color:#c6c9bd}.timelineLink:first-child{border-color:#d1c298;background:#c1b68918}.visitActions{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-top:20px}.visitActions>*{margin:0!important;min-width:0!important;width:auto!important;height:auto!important;min-height:44px;font-size:12px!important;padding:11px!important;text-align:center;border:1px solid #ffffff20!important;border-radius:4px!important;background:#11191090!important;color:#e7e5d9!important}.visitActions #artToggle{grid-column:1/-1;background:#e4decc!important;color:#20291f!important}
#walkTip{position:fixed;top:135px;left:24px;z-index:3;font-size:12px;padding:4px 4px 4px 12px;background:#1b291fec;border:1px solid #ffffff25;border-radius:4px;display:flex;align-items:center;gap:5px}#walkTip button{background:none;border:0;padding:4px;min-width:36px;font-size:18px}#moveHint{bottom:105px;z-index:15;text-align:center;max-width:70vw}#visitTransition{position:fixed;inset:0;z-index:18;background:#101812;opacity:0;pointer-events:none;transition:opacity .16s}#visitTransition.cover{opacity:1}
#boatHUD{left:auto;right:24px;bottom:86px;transform:none;max-width:270px;padding:10px 13px;border-radius:5px}#boatHUD p{display:none}#boatHUD strong{font-size:12px;display:block;margin-bottom:9px}#boatHUD button{min-height:44px}#boatHUD .boatTour{margin-bottom:6px}#boatWork{font-size:11px}.lakeBoard{bottom:100px;border-radius:5px;padding:12px 22px}.aboard .walkpad{bottom:86px}#boatReturn{font-size:11px!important}
#mapPanel .placementNext{display:none}#mapPanel details{margin:16px 0;color:#c4c6b8;font-size:13px}#mapPanel summary{cursor:pointer;min-height:44px;padding:12px 0}.artCard strong{font-size:13px}
@media(max-width:1100px){.identity>span{display:none}.levels span{display:none}#miniMap{width:190px}#guidedBar{left:48%}}
@media(max-width:700px){header{padding:12px;gap:10px}header .identity h1{font-size:17px;letter-spacing:.12em}header nav{gap:4px;flex-wrap:nowrap;max-width:none}header nav button,header nav a{font-size:11px;padding:8px 10px;min-height:44px}.location,.aboard .location{top:75px;left:12px}.location h2{max-width:190px!important;font-size:12px}.location p{display:none}.location>div{padding-bottom:0}#walkTip{top:116px;left:12px;font-size:11px;max-width:calc(100vw - 24px)}footer{left:12px;bottom:calc(12px + env(safe-area-inset-bottom))}.levels{gap:2px}.levels button{padding:8px;min-width:43px;font-size:12px}.levels span{display:none}.walkpad,.aboard .walkpad{left:10px;bottom:calc(82px + env(safe-area-inset-bottom))}.walkpad button{width:44px;height:44px;margin:1px}#guidedBar{left:auto;right:12px;bottom:calc(12px + env(safe-area-inset-bottom));transform:none;padding:2px;gap:0;max-width:calc(100vw - 118px)}#guidedBar button{padding:6px 9px}#guideInfo{min-width:118px;max-width:145px}#guideInfo small{font-size:9px}#guideInfo span{font-size:10px}#guideNext{font-size:11px}#miniMap,.aboard #miniMap{right:12px;bottom:calc(80px + env(safe-area-inset-bottom));width:180px;z-index:4}.miniTop{padding:2px 5px}.miniTop strong{font-size:12px}.miniTop>span{font-size:10px}#miniDrawing{height:145px}#miniMap:not(.collapsed){bottom:calc(80px + env(safe-area-inset-bottom))}#miniExpand{display:block}#miniMap.collapsed #miniExpand{display:none}#boatHUD{right:12px;bottom:calc(136px + env(safe-area-inset-bottom));width:190px;max-width:calc(100vw - 158px);padding:9px}#boatHUD .boatTour{flex-wrap:nowrap}#boatHUD button{font-size:11px!important;padding:6px 9px}#boatHUD .boatTour button{padding:5px 9px}#boatHUD #boatWork{font-size:10px}.lakeBoard{bottom:calc(146px + env(safe-area-inset-bottom));left:auto;right:12px;transform:none;font-size:12px;padding:12px}.aboard #miniMap{bottom:calc(80px + env(safe-area-inset-bottom))}#visitPanel{padding:25px 20px}#visitPanel h2{font-size:21px}dialog#mapPanel{width:calc(100vw - 20px);max-height:calc(100dvh - 20px);padding:18px}#mapPanel .panelTop h2{font-size:19px}.floorCardTop h3{font-size:16px}#moveHint{bottom:calc(265px + env(safe-area-inset-bottom));font-size:12px}.crosshair{display:none}}
@media(max-height:520px){#miniMap{display:none}.walkpad{bottom:80px}.location{top:70px!important}#walkTip{display:none}#boatHUD{bottom:82px}#visitPanel{max-height:94dvh}}
@media(prefers-reduced-motion:reduce){#visitTransition{transition:none}*{scroll-behavior:auto!important}}

.aboard #guidedBar{display:none}

.aboard #walkTip{display:none}
@media(max-width:700px){.aboard #boatHUD{bottom:calc(140px + env(safe-area-inset-bottom));}}

/* Keep mobile navigation reachable while preserving the view and native scrolling. */
:root{--safe-left:env(safe-area-inset-left,0px);--safe-right:env(safe-area-inset-right,0px);--safe-top:env(safe-area-inset-top,0px);--safe-bottom:env(safe-area-inset-bottom,0px)}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
dialog{--dialog-pad:27px;--dialog-paper:#191c15;padding:var(--dialog-pad);overflow:auto;overscroll-behavior:contain}
dialog>.panelTop{position:sticky;top:calc(-1 * var(--dialog-pad));z-index:3;background:var(--dialog-paper);gap:12px;padding:12px 0;margin-top:-12px;min-height:68px}
dialog>.panelTop>div{min-width:0}dialog>.panelTop h2{overflow-wrap:anywhere}
dialog .panelTop .close,#visitPanel .panelTop .close,.artDialog .panelTop .close{position:static;flex:none;min-width:44px;width:44px;height:44px;padding:0;background:var(--dialog-paper)}
#visitPanel{--dialog-paper:#18221d}.artDialog .panelTop{padding-right:0}
@media(max-width:900px){
 header{padding-left:max(12px,var(--safe-left));padding-right:max(12px,var(--safe-right));padding-top:calc(12px + var(--safe-top))}
 .location,.aboard .location{left:max(12px,var(--safe-left));top:calc(75px + var(--safe-top))!important}
 .walkpad,.aboard .walkpad{left:max(10px,var(--safe-left))}
 footer{left:max(12px,var(--safe-left));bottom:calc(12px + var(--safe-bottom))}
 #guidedBar{bottom:calc(12px + var(--safe-bottom))}
 #miniMap,.aboard #miniMap,#boatHUD{right:max(12px,var(--safe-right))}
 #walkTip{left:max(12px,var(--safe-left));top:calc(116px + var(--safe-top))}
 dialog,dialog#visitPanel,dialog.artDialog,dialog#mapPanel{--dialog-pad:20px;width:calc(100vw - 24px - var(--safe-left) - var(--safe-right));max-width:none;max-height:calc(100dvh - 24px - var(--safe-top) - var(--safe-bottom));padding:var(--dialog-pad);margin:auto;overflow:auto}
 dialog>.panelTop,#mapPanel>.panelTop{top:calc(-1 * var(--dialog-pad));padding-top:12px;padding-bottom:12px}
 #visitPanel .panelTop h2,.artDialog .panelTop h2{font-size:20px}
 #sectionSelect{font-size:16px}
 #artistPost{min-height:44px;display:inline-flex;align-items:center}
}
@media(max-width:700px){
 #miniMap,.aboard #miniMap{max-width:calc(100vw - 172px - var(--safe-left) - var(--safe-right))}
 #guidedBar{width:calc(100vw - 118px - var(--safe-left) - var(--safe-right));max-width:280px;right:max(12px,var(--safe-right))}
 #guidePrevious,#guideNext{min-width:44px;flex:none;padding:6px 8px!important}
 #guideInfo{min-width:0;flex:1;padding:6px 2px!important;overflow:hidden}
 #guideInfo span,#guideInfo small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
 #boatHUD{max-width:calc(100vw - 158px - var(--safe-left) - var(--safe-right))}
 #boatHUD .boatTour button{min-width:44px;padding:5px!important}
 #boatHUD .boatTour{gap:3px}#boatWork{min-width:0;flex:1}
}
@media(max-height:520px){
 #miniMap,.aboard #miniMap{display:none}
 #boatHUD,.aboard #boatHUD{bottom:calc(80px + var(--safe-bottom))}
 .location,.aboard .location{top:calc(68px + var(--safe-top))!important}
}

/* Shared visual language with the outdoor park. */
header nav{padding:4px;gap:4px;border:1px solid #ffffff26;border-radius:12px;background:#15201ee8}header nav button,header nav a{border-color:transparent;border-radius:7px;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;font-size:12px}header nav .parkReturn{background:transparent;color:#e8e5da}header nav .modeSwitch{background:#e6dcc6;color:#222c26}header nav button:hover,header nav .parkReturn:hover{background:#ffffff18}
.location>span,.location>div{border-radius:6px}.location{gap:5px}.location>span{align-self:flex-start;padding:5px 8px}.location>div{padding:3px 10px 6px}.walkpad button{border-radius:9px}.levels{padding:4px;border:1px solid #ffffff26;border-radius:10px;background:#15201ee8}.levels button{border:0;border-radius:6px}#guidedBar{border-radius:10px;padding:5px}#guidedBar button{border-radius:6px}#guideNext{background:#e6dcc6;color:#222c26}#guideNext:hover{background:#f1e8d4}#miniMap,.aboard #miniMap{border-radius:10px;background:#15201ee8}#walkTip{border-radius:8px}dialog,#visitPanel{border-radius:14px;border-color:#ffffff30;box-shadow:0 24px 90px #0007}dialog::backdrop{background:#06110e99;backdrop-filter:blur(5px)}#visitPanel h2{font-weight:500}.timelineLink{border-radius:7px;min-height:52px}.visitActions>*{border-radius:7px!important}button:focus-visible,a:focus-visible,select:focus-visible{outline:2px solid #eddbac;outline-offset:3px}
@media(max-width:700px){header{gap:6px}header .identity h1{font-size:15px;letter-spacing:.04em}header nav{padding:3px;gap:1px}header nav button,header nav a{font-size:11px;padding:8px 7px}#guidedBar{padding:3px}#guideNext{font-size:11px}.levels{padding:3px}.levels button{min-width:38px}#miniMap.collapsed{width:154px}.location>div{padding:2px 8px}#visitPanel .visitIntro{font-size:13px}}
