/* Placebo Town's building interiors (interior.js) and the door prompt outside (places.js). */
/* The door prompt: bottom centre, over the HUD's dock (Navigation, Controls) on a phone. */
.enter-prompt { top: auto; left: 50%; bottom: calc(max(16px, env(safe-area-inset-bottom)) + 58px); translate: -50% 0; z-index: 4; min-height: 44px; padding: 0 18px; font-size: 15px; font-weight: 800; white-space: nowrap; box-shadow: 0 0 0 2.5px #e0703a, 0 3px 0 rgba(45, 58, 42, .18); animation: enter-in .3s cubic-bezier(.3, 1.6, .5, 1); }
.enter-prompt[hidden] { display: none; }
.enter-prompt kbd, .interior-leave kbd { font: inherit; font-size: 11px; font-weight: 800; min-width: 20px; height: 20px; padding: 0 5px; display: inline-grid; place-items: center; border-radius: 5px; background: rgba(45, 58, 42, .07); box-shadow: inset 0 -2px 0 rgba(45, 58, 42, .18); }
@media (pointer: coarse) { .enter-prompt kbd, .interior-leave kbd { display: none; } }
@keyframes enter-in { from { opacity: 0; scale: .85; } }

/* Inside: the town's HUD, signs and cards step back; the sound chip stays. */
body.inside .hud, body.inside .hud-btn, body.inside .hud-card, body.inside #talk, body.inside .hint, body.inside .hold, body.inside .enter-prompt, body.inside .presence, body.inside .poodle-card, body.inside .fp-chip, body.inside .fp-dot, body.inside .fp-hint, body.inside #bubbles > .bubble:not(.inside-b) { display: none !important; }
body:not(.inside) #bubbles > .inside-b { display: none; }
.interior[hidden] { display: none; }
.interior-fade { position: fixed; inset: 0; z-index: 20; background: #05060f; opacity: 0; pointer-events: none; transition: opacity .4s ease; }
.interior-fade.on { opacity: 1; pointer-events: auto; }
.interior-leave { left: 16px; top: max(14px, env(safe-area-inset-top)); z-index: 6; min-height: 44px; padding: 0 16px; font-size: 15px; font-weight: 800; }
.interior-title { position: fixed; z-index: 5; left: 50%; top: max(20px, env(safe-area-inset-top)); translate: -50% 0; margin: 0; font-family: 'Town Sign', serif; font-size: 22px; letter-spacing: .06em; color: #f3ead8; text-shadow: 0 2px 8px rgba(0, 0, 0, .6); pointer-events: none; }
body.inside .sound { right: 16px !important; top: max(14px, env(safe-area-inset-top)) !important; height: 40px; }   /* alone up there: the weather chip is hidden */
@media (max-width: 480px) { .interior-title { font-size: 18px; top: max(24px, env(safe-area-inset-top)); } }
.interior-caption { position: fixed; z-index: 5; left: 50%; bottom: calc(max(18px, env(safe-area-inset-bottom)) + 4px); translate: -50% 0; width: min(640px, calc(100vw - 32px)); margin: 0; padding: 10px 16px; border-radius: 16px; background: rgba(8, 10, 30, .72); color: #f3ead8; font-weight: 700; font-size: 15px; line-height: 1.4; text-align: center; opacity: 0; transition: opacity .4s ease; pointer-events: none; }
.interior-caption.on { opacity: 1; }
.interior-card { position: fixed; z-index: 5; left: 50%; top: 50%; translate: -50% -50%; width: min(440px, calc(100vw - 32px)); padding: 18px 20px; border-radius: 22px; background: #fffdf6; color: #2d3a2a; box-shadow: 0 4px 0 rgba(45, 58, 42, .2), 0 14px 32px rgba(0, 0, 0, .35); animation: enter-in .4s ease; pointer-events: none; }
.interior-card[hidden] { display: none; }
.interior-card h2 { margin: 0 0 8px; font-size: 17px; font-weight: 800; }
.interior-card p { margin: 0; font-size: 15px; line-height: 1.45; }
/* The bar's chalkboard menu as a card (interior-bar.js): chalk on slate, one drink a line. */
.interior-card.menu { background: #2b302c; color: #eef0e6; box-shadow: 0 0 0 6px #7a5434, 0 14px 32px rgba(0, 0, 0, .45); }
.interior-card.menu h2 { font-family: 'Town Sign', serif; letter-spacing: .05em; color: #ffe08a; }
.interior-card.menu p { white-space: pre-line; font-size: 14px; }