/* A full-width room with a small, fixed screen-space control bar. */
body:has(.immersive) { overflow: hidden; }
.tavern-app.polished.immersive { width: 100%; max-width: none; height: 100dvh; padding: 0; display: flex; flex-direction: column; }
.tavern-app.polished.immersive .masthead { position: absolute; top: 7px; right: 10px; margin: 0; z-index: 10; }
.tavern-app.polished.immersive :is(.wordmark,.save-label,.inn-overview,.page-footer,.room-controls-hint) { display: none; }
.tavern-app.polished.immersive .header-actions { gap: 5px; }
.tavern-app.polished.immersive .header-actions button { padding: 7px 9px; font-size: 11px; color: #31473a; background: #f1e7cf; border-color: #b8ad8e; }
.tavern-app.polished.immersive .status-bar { height: 48px; min-height: 48px; border: 0; border-bottom: 1px solid #ab9870; border-radius: 0; padding: 5px 250px 5px 14px; gap: 16px; flex-wrap: nowrap; }
.tavern-app.polished.immersive .navbar-brand { margin: 0; flex-shrink: 0; font: 700 21px/1 Georgia, serif; letter-spacing: -.5px; color: #31473a; white-space: nowrap; }
.tavern-app.polished.immersive .status-bar small,
.tavern-app.polished.immersive .day-tag span { display: none; }
.tavern-app.polished.immersive .day-tag { min-width: 65px; padding-right: 12px; }
.tavern-app.polished.immersive .day-tag strong { font: 600 16px var(--sans); margin: 0; white-space: nowrap; }
.tavern-app.polished.immersive .resource { gap: 5px; }
.tavern-app.polished.immersive .resource strong { font: 600 17px var(--sans); }
.tavern-app.polished.immersive .status-bar .sprite { width: 27px; height: 27px; }
.tavern-app.polished.immersive .status-bar .coin { background: none; border: 0; box-shadow: none; }
.tavern-app.polished.immersive .ingredient-hud { gap: 10px; padding-left: 10px; }
.tavern-app.polished.immersive .ingredient-hud > div { gap: 3px; }
.tavern-app.polished.immersive .ingredient-hud strong { font-size: 13px; }
.tavern-app.polished.immersive .ingredient-hud .sprite { width: 23px; height: 23px; }
.tavern-app.polished.immersive .phase-status { gap: 8px; padding-left: 12px; }
.tavern-app.polished.immersive .phase-status strong { white-space: nowrap; margin: 0; }
.tavern-app.polished.immersive .countdown { font: 600 18px var(--sans); margin-left: 4px; min-width: 44px; font-variant-numeric: tabular-nums; }
.tavern-app.polished.immersive .status-bar button { padding: 6px 9px; min-width: 0; font-size: 11px; white-space: nowrap; }
.tavern-app.polished.immersive .workplace { flex: 1; min-height: 0; display: block; border: 0; border-radius: 0; box-shadow: none; }
.tavern-app.polished.immersive .stage-wrap { height: 100%; display: flex; flex-direction: column; }
.tavern-app.polished.immersive .room-shell { width: 100%; margin: 0; border: 0; flex: 1; min-height: 0; }
.tavern-app.polished.immersive .scene-viewport { width: 100%; height: 100%; aspect-ratio: auto; overflow: auto; scrollbar-width: thin; scrollbar-color: #987547 #23352c; background: #1d2c23; }
.world-canvas { position: relative; overflow: hidden; margin: 0 auto; }
.tavern-app.polished.immersive .scene { width: 1800px; height: 1150px; aspect-ratio: auto; }
.tavern-app.polished.immersive .scene .room-art { filter: none; }
.tavern-app.polished.immersive .scene.is-closed .room-art { filter: brightness(.56) saturate(.75); }
.tavern-app.polished.immersive .scene.is-last-round .room-art { filter: brightness(.8) saturate(.9); }
.tavern-app.polished.immersive .scene.is-preparing .room-art { filter: brightness(.96); }
.tavern-app.polished.immersive .alert-strip { display: none; }
.tavern-app.polished.immersive .command-tray { min-height: 42px; padding: 4px 10px; gap: 12px; flex-shrink: 0; }
.tavern-app.polished.immersive .room-toolbar { display: flex; width: auto; gap: 5px; }
.tavern-app.polished.immersive .room-toolbar button { padding: 6px 10px; font-size: 13px; flex-direction: row; }
.tavern-app.polished.immersive .room-toolbar button span { font-size: 11px; }
.tavern-app.polished.immersive .ledger { top: 54px; right: 12px; max-height: calc(100dvh - 105px); }
.tavern-app.polished.immersive .toast { bottom: 55px; }
.tavern-app.polished.immersive .phase-notice { top: 12px; }
/* Atlas windows must clip, and these painted assets must not be pixelated. */
.storybook-art { overflow: hidden; display: block; }
.tavern-app.polished.immersive :is(svg,image,img,.sprite,.prop-art,.micro-art,.crew-frame) { image-rendering: auto; }
.tavern-app.polished.immersive .scene .station { width: 174px; height: 166px; }
.tavern-app.polished.immersive .scene .station > .prop-art { filter: drop-shadow(0 5px 3px #23190c55); }
.tavern-app.polished.immersive .scene .dragon { top: 282px; width: 120px; height: 130px; padding: 0; }
.tavern-app.polished.immersive .scene .resident.brewer { width: 115px; height: 110px; }
.tavern-app.polished.immersive .scene .resident.brewer .sprite { width: 115px; height: 110px; }
.tavern-app.polished.immersive .scene .resident.witch { top: 338.6px; left: 987px; width: 135.85px; height: 150.85px; }
.tavern-app.polished.immersive .scene .resident.witch > .sprite { width: 135.85px; height: 135.85px; }
.tavern-app.polished.immersive .scene .room-pantry { top: 282px; width: 140px; }
.tavern-app.polished.immersive .scene .room-pantry > .prop-art { width: 140px; height: 170px; }
.tavern-app.polished.immersive .scene .quest-board { top: 200px; width: 110px; height: 125px; }
.tavern-app.polished.immersive .scene .station-sign { bottom: -8px; font-size: 12px; padding: 3px 7px; }
.tavern-app.polished.immersive .scene .brewer-arms { display: none; }
.tavern-app.polished.immersive .scene .agent.guest { width: 83.16px; height: 99px; }
.tavern-app.polished.immersive .scene .agent.guest .character-body { width: 100%; height: 100%; }
.tavern-app.polished.immersive .scene .agent.guest .character-body > svg { width: 100%; height: 100%; }
.tavern-app.polished.immersive .scene .agent.bouncer { width: 110px; height: 125px; }
.tavern-app.polished.immersive .scene .room-door { position: absolute; left: 0; top: 390px; width: 110px; height: 220px; }
.tavern-app.polished.immersive .scene .table { width: 190px; height: 135px; }
.tavern-app.polished.immersive .scene .knockout-birds svg { width: 25px; height: 22px; }
.tavern-app.polished.immersive .flying-coin { background: none; border: 0; box-shadow: none; width: 25px; height: 25px; }
.flying-coin > svg { width: 100%; height: 100%; }
/* Till paper: real line items, one way forward. */
.tavern-app.polished.immersive .results-card.till-receipt { width: 390px; max-width: 100%; padding: 28px; border: 0; border-radius: 0; background: #fff7e4; color: #3c382f; font: 13px/1.6 ui-monospace, monospace; text-align: left; box-shadow: 0 16px 60px #0007; }
.tavern-app.polished.immersive .till-receipt:before { display: none; }
.tavern-app.polished.immersive .till-receipt .receipt-brand { text-align: center; font: bold 18px/1.4 ui-monospace,monospace; color: #3c382f; letter-spacing: 1px; }
.tavern-app.polished.immersive .till-receipt .receipt-subtitle { text-align: center; font: 12px ui-monospace,monospace; }
.receipt-rule { border-top: 1px dashed #a29880; margin: 17px 0; }
.receipt-section { margin: 18px 0; }
.tavern-app.polished.immersive .receipt-section h3 { font: bold 11px ui-monospace,monospace; text-transform: uppercase; letter-spacing: 1px; margin-bottom: 10px; }
.receipt-line { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; padding: 3px 0; }
.receipt-line > strong { white-space: nowrap; }
.receipt-line span b { font-weight: normal; color: #817660; }
.receipt-total { font-size: 17px; border-block: 2px solid #635b48; margin: 12px 0; padding: 10px 0; }
.tavern-app.polished.immersive .till-receipt .receipt-thanks { text-align: center; font: 11px/1.8 ui-monospace,monospace; margin-top: 20px; }
.tavern-app.polished.immersive .till-receipt .primary { padding: 12px; margin-top: 8px; font: 600 14px var(--sans); }
@media(max-width: 1200px) {
 .tavern-app.polished.immersive .status-bar { gap: 9px; padding-right: 230px; }
 .tavern-app.polished.immersive .ingredient-hud { display: none; }
}
@media(max-width: 640px) {
 .tavern-app.polished.immersive .navbar-brand { font-size: 16px; }
 .tavern-app.polished.immersive .masthead { top: 53px; }
 .tavern-app.polished.immersive .status-bar { padding-right: 8px; gap: 8px; }
 .tavern-app.polished.immersive .room-toolbar { overflow: auto; }
 .tavern-app.polished.immersive .room-toolbar button { padding: 6px; white-space: nowrap; }
 .tavern-app.polished.immersive .phase-status { padding-left: 7px; }
 .tavern-app.polished.immersive .phase-dot { display: none; }
}
.tavern-app.polished.immersive .construction i > svg { width: 38px; height: 38px; }
.tavern-app.polished.immersive .scene .flame-outer { stroke: #62291e; stroke-width: 2; stroke-linejoin: round; }
.tavern-app.polished.immersive .phase-notice { transform: translateX(-50%); }

.tavern-app.polished.immersive .scene .dragon .character-art { width: 104px; height: 104px; scale: 1.1; transform-origin: 50% 100%; }
.tavern-app.polished.immersive .scene .meal-ale { left: 65%; top: 52%; }
.tavern-app.polished.immersive .scene .debug-gold-pile > b { font: 12px var(--sans); border-radius: 4px; background: #304532e6; color: #ffe7a8; }

.tavern-app.polished.immersive .scene .agent.slime { width: 104px; height: 93.6px; }
/* World depth is shared: a seated guest is behind the table, a passing guest
   crosses in front after reaching its lower half. Flying pixies stay above. */
.tavern-app.polished.immersive .scene :is(.table-layer,.agent-layer,.storage-layer) { z-index: auto; }
.tavern-app.polished.immersive .scene :is(.station-actions-layer,.transfer-layer) { z-index: 2000; }
.tavern-app.polished.immersive .scene .order-bubble { width: 84px; min-width: 84px; height: auto; min-height: 84px; padding: 5px; display: flex; flex-direction: column; align-items: center; gap: 4px; }
.tavern-app.polished.immersive .scene .order-bubble .sprite { width: 66px; height: 66px; }
.tavern-app.polished.immersive .scene .order-bubble .meter { width: 100%; margin: 0; }
.order-assigned { position: absolute; right: -8px; top: -7px; width: 23px; height: 23px; display: grid; place-items: center; border-radius: 50%; background: #365b40; color: #fff2c9; font: bold 15px var(--sans); }
.tavern-app.polished.immersive .scene .guest .payment-bubble { width: 84px; height: 84px; display: flex; justify-content: center; padding: 5px; border: 2px solid #a58a59; background: #f3e5c4; box-shadow: 0 3px 6px #0003; border-radius: 7px; }
.tavern-app.polished.immersive .scene .payment-bubble .sprite { width: 48px; height: 48px; filter: drop-shadow(0 3px 3px #35261588); }
.tavern-app.polished.immersive .scene .payment-bubble.assigned { background: #c6d5ad; outline: 3px solid #b7e39d; }
.tavern-app.polished.immersive .scene .stored-stock.selected { outline: 4px solid #ffe079; outline-offset: 9px; border-radius: 12px; background: #ffdb6b25; box-shadow: 0 0 0 9px #49301566, 0 0 26px #ffcf6c88; }
.tavern-app.polished.immersive .scene .stored-stock.selected > span { background: #ffdc78; color: #3b321e; border: 2px solid #fff1ad; }
.tavern-app.polished.immersive .scene .stored-stock.selected:after { content: '✓'; position: absolute; top: -15px; right: -12px; width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; background: #ffe079; color: #38482c; font: bold 20px var(--sans); }
.tavern-app.polished.immersive .scene .construction { width: 95px; height: 85px; padding: 0; border: 0; background: transparent; box-shadow: none; }
.tavern-app.polished.immersive .scene .construction .construction-hammer { position: absolute; inset: 5px 15px; z-index: 1; }
.tavern-app.polished.immersive .construction .construction-hammer > svg { width: 64px; height: 64px; }
.tavern-app.polished.immersive .scene .construction .construction-poof { position: absolute; inset: 12px 0 0; background: none; padding: 0; }
.tavern-app.polished.immersive .construction-poof i { position: absolute; width: 52px; height: 45px; border-radius: 50%; background: #eee2c9e6; border: 2px solid #b7a78e66; left: 5px; top: 22px; animation: build-poof 1.1s ease-out infinite; }
.tavern-app.polished.immersive .construction-poof i:nth-child(2) { left: 37px; top: 12px; animation-delay: -.35s; }
.tavern-app.polished.immersive .construction-poof i:nth-child(3) { left: 23px; top: 0; animation-delay: -.7s; }
@keyframes build-poof { 0% { transform: scale(.45); opacity: .8; } 100% { transform: translateY(-14px) scale(1.15); opacity: 0; } }
.receipt-step:not(.printed) { display: none; }
.receipt-step.printed { animation: receipt-print .2s ease-out both; }
@keyframes receipt-print { from { opacity: 0; transform: translateY(-5px); } to { opacity: 1; transform: none; } }
@media(prefers-reduced-motion: reduce) { .receipt-step.printed, .tavern-app.polished.immersive .construction-poof i { animation: none; } }
.tavern-app.polished.immersive .pause-overlay:has(.till-receipt) { align-items: flex-start; padding-top: 24px; }
.receipt-section:not(:has(.printed)) { display: none; }

/* Larger serving art while retaining the existing hand and shelf anchors. */
.tavern-app.polished.immersive .scene :is(.meal-ale,.meal-stew),
.tavern-app.polished.immersive .scene :is(.meal-ale,.meal-stew) > .sprite { width: 39px; height: 39px; }
.tavern-app.polished.immersive .scene .carried-item:is([data-art="ale"],[data-art="stew"]) { width: 63px; height: 63px; }
.tavern-app.polished.immersive .scene .carried-keg { width: 64.5px; height: 91.5px; }
.tavern-app.polished.immersive .scene .order-bubble:after { background: #f3e5c4; border-color: #a58a59; }
.tavern-app.polished.immersive .scene .order-bubble.assigned:after { background: #c6d5ad; }

/* Shared world-space mug size: order, hand, tray, and placed serving art. */
.tavern-app.polished.immersive .scene { --beer-size: 77.4px; }
.tavern-app.polished.immersive .scene :is(.meal-ale,.carried-item[data-art="ale"],.baron-tray > [data-art="ale"],[data-art="ale"]) { width: var(--beer-size); height: var(--beer-size); flex-shrink: 0; }
.tavern-app.polished.immersive .scene .order-bubble:has([data-art="ale"]) { width: 100px; min-width: 100px; min-height: 104px; }
.tavern-app.polished.immersive .scene .slime-closet { width: 120px; }
.tavern-app.polished.immersive .scene .slime-closet > .prop-art { width: 120px; height: 144px; }
.tavern-app.polished.immersive .scene .supply-package { width: 62.4px; height: 72.8px; }
.tavern-app.polished.immersive .scene .supply-package > .prop-art { width: 62.4px; height: 62.4px; }
.tavern-app.polished.immersive .scene .supply-package > span { top: 62.4px; }
.tavern-app.polished.immersive .scene .supply-package > small { top: 84px; }
.tavern-app.polished.immersive .scene .station[data-recipe="ale"] > .prop-art { scale: .8; transform-origin: 50% 100%; }
.tavern-app.polished.immersive .brewer-brew2 > .crew-octopus { filter: hue-rotate(155deg); }
.tavern-app.polished.immersive .brewer-brew3 > .crew-octopus { filter: hue-rotate(275deg); }
.tavern-app.polished.immersive .scene .palette-1 > .crew-pixie { filter: hue-rotate(85deg); }
.tavern-app.polished.immersive .scene .palette-2 > .crew-pixie { filter: hue-rotate(190deg); }
.tavern-app.polished.immersive .scene .palette-3 > .crew-pixie { filter: hue-rotate(285deg); }
.tavern-app.polished.immersive .scene .palette-4 > .crew-pixie { filter: hue-rotate(40deg); }
.tavern-app.polished.immersive .scene .palette-5 > .crew-pixie { filter: hue-rotate(140deg); }
.tavern-app.polished.immersive .scene .palette-6 > .crew-pixie { filter: hue-rotate(230deg); }
.tavern-app.polished.immersive .scene .palette-7 > .crew-pixie { filter: hue-rotate(315deg); }
.tavern-app.polished.immersive .scene .guest-intervention { padding: 0; border: 0; background: transparent; pointer-events: auto; cursor: pointer; }
.tavern-app.polished.immersive .scene .guest-intervention:focus-visible { outline: 3px solid #ffe079; outline-offset: 4px; }

/* Keep potion stock beside the cauldron, with a restrained selected treatment. */
.tavern-app.polished.immersive .scene .stock-health.selected { outline: 2px solid #ffe079; outline-offset: 2px; background: transparent; box-shadow: none; }
.tavern-app.polished.immersive .scene .stock-health.selected:after { display: none; }
.tavern-app.polished.immersive .scene .station-state { display: none; }
.tavern-app.polished.immersive .scene .supply-package > .prop-art { filter: drop-shadow(0 0 9px #ffdc8b99); }
.tavern-app.polished.immersive .scene .slime-trail-layer .pixie-spark { width: 13px; height: 13px; background: #fff0a3; border: 0; border-radius: 0; box-shadow: none; clip-path: polygon(50% 0,60% 38%,100% 50%,60% 62%,50% 100%,40% 62%,0 50%,40% 38%); filter: drop-shadow(0 0 4px #ffd05e); }
.magic-poof { position: absolute; width: 100px; height: 90px; pointer-events: none; }
.magic-poof i { position: absolute; width: 65px; height: 65px; border-radius: 50%; background: #e9decae8; box-shadow: inset -8px -6px #c8bda8; }
.magic-poof i:nth-child(2) { left: 38px; top: 10px; }
.magic-poof i:nth-child(3) { left: 18px; top: -23px; }

.welcome-card { width: min(940px, 96vw); max-height: 94%; overflow: auto; padding: 28px; background: #f5e9ca; color: #304737; border: 1px solid #b7a179; border-radius: 14px; box-shadow: 0 18px 60px #0006; text-align: center; }
.welcome-card > .eyebrow { font: bold clamp(24px, 3.5vw, 38px)/1.2 var(--serif); letter-spacing: 1px; color: #304737; }
.welcome-card h2 { font: 600 20px var(--serif); margin: 10px 0 22px; }
.welcome-steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; text-align: left; }
.welcome-steps article { padding: 14px; border: 1px solid #cdb98d; border-radius: 10px; background: #fff7e4; }
.welcome-picture { height: 130px; display: flex; align-items: flex-end; justify-content: center; gap: 5px; margin-bottom: 22px; }
.welcome-picture > :is(svg,.sprite,.prop-art) { width: 30%; height: 110px; }
.welcome-steps small { font: bold 10px var(--sans); color: #8d6e38; letter-spacing: 1px; }
.welcome-steps h3 { font: bold 19px var(--serif); margin: 9px 0; }
.welcome-steps p { font: 14px/1.55 var(--sans); margin: 0; }
.welcome-card > .primary { padding: 13px 35px; margin: 24px 0 8px; font-size: 16px; }
.welcome-card .welcome-footnote { font: 12px var(--sans); color: #7e755c; }
@media(max-width:700px) { .welcome-steps { grid-template-columns: 1fr; } .welcome-picture { height: 85px; margin-bottom: 12px; } .welcome-picture > :is(svg,.sprite,.prop-art) { width: 70px; height: 85px; } }
