#storyOpening[hidden]{display:none}#storyOpening{position:fixed;inset:0;z-index:60;pointer-events:none;display:flex;align-items:end;padding:16px max(16px,env(safe-area-inset-right)) 18px max(16px,env(safe-area-inset-left));box-sizing:border-box}.openingCaption{max-width:560px;padding:12px 18px;color:#fcf6e5;background:#293b35ed;border-left:4px solid #ccb472;border-radius:4px;box-shadow:0 4px 18px #28332a35;font-size:16px;line-height:1.55}.openingCaption p{margin:0}.openingCaption p+p{margin-top:6px}.openingControls{position:absolute;right:max(16px,env(safe-area-inset-right));top:max(12px,env(safe-area-inset-top));display:flex;gap:10px;pointer-events:auto}.openingControls button{min-height:44px;padding:8px 16px;background:#f0e4c8;color:#293b35;border:1px solid #a39570;border-radius:5px;font-size:13px}.openingPlaying .uxWorldItems,.openingPlaying #uxWorldHint,.openingPlaying #hud,.openingPlaying #touch,.openingPlaying #owCorner,.openingPlaying #owWallet,.openingPlaying #owInteract,.openingPlaying #owNewItemNotice,.openingPlaying #owShrineNotice{visibility:hidden!important}#openingEssential{position:fixed;left:max(16px,env(safe-area-inset-left));top:60px;width:min(350px,52vw);z-index:44;background:#f0e4c8f5;padding:10px 38px 10px 12px;border:1px solid #9c8b68;border-radius:6px;font-size:12px;line-height:1.45}#openingEssential p{margin:0 0 5px}#openingEssential button{position:absolute;right:0;top:0;min-width:44px;min-height:44px;border:0;background:transparent}#storyOpening,#storyOpening *,#openingEssential,#openingEssential *{user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;touch-action:manipulation}.uxStoryJournal{display:flex;flex-wrap:wrap;gap:6px}.uxStoryJournal button{min-height:44px}
@media(max-width:700px){.openingCaption{max-width:calc(100vw - 32px);font-size:14px;padding:10px 14px}.uxConcept{font-size:12px}}

.uxStoryPauseActions{display:flex;flex-wrap:wrap;gap:8px}.uxStoryPauseActions button{min-height:44px}

#openingGuide{position:fixed;left:max(16px,env(safe-area-inset-left));top:60px;width:min(270px,42vw);z-index:42;background:#f0e4c8f2;color:#293b35;padding:10px 48px 10px 12px;border:1px solid #9c8b68;border-radius:6px;font-size:12px;line-height:1.45;box-sizing:border-box}#openingGuide p{margin:0}#openingGuide button{position:absolute;right:0;top:0;min-width:44px;min-height:44px;border:0;background:transparent;color:inherit}#openingGuide,#openingGuide *{user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;touch-action:manipulation}
.ux #storyOpening .openingCaption p{color:#fcf6e5}.ux #storyOpening .openingControls button{color:#293b35}.ux #openingGuide p,.ux #openingEssential p,.ux #openingGuide button,.ux #openingEssential button{color:#293b35}

#storyOpening{padding-left:max(16px,var(--safe-l,0px));padding-right:max(16px,var(--safe-r,0px))}.openingControls{right:max(16px,var(--safe-r,0px))}.openingCaption{max-width:min(560px,calc(100vw - var(--safe-l,0px) - var(--safe-r,0px) - 32px))}#openingEssential,#openingGuide{left:max(16px,var(--safe-l,0px))}

/* Keep optional guidance and its dismiss target in distinct rectangles. */
#openingEssential{box-sizing:border-box;padding-right:56px}
body:has(#openingGuide) #owQuests,body:has(#openingEssential) #owQuests{visibility:hidden}
.openingPlaying .journeyArrival{visibility:hidden}