/* One screen at a time: room, controls, or a complete activity. */
html,body{width:100%;height:100%;overflow:hidden;overscroll-behavior:none;scroll-padding:0}
body{margin:0}
#app{height:100dvh;min-height:0;max-height:100dvh;padding:0;overflow:hidden}
#app .topbar{min-height:58px;padding:8px 16px;flex-wrap:nowrap;flex:none}
.brand h1{font-size:25px}.brand>span{font-size:12px}.coin-wallet{font-size:21px}
#app .resources{min-height:42px;padding:5px 14px;flex:none}
.resource span{font-size:12px}.resource strong{font-size:15px}
#app .play-layout{flex:1 1 0;min-height:0;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(340px,1fr);overflow:hidden}
#app .scene-wrap{height:100%;min-height:0;max-height:none;aspect-ratio:auto;flex:auto}
#app .scene-wrap>canvas{height:100%!important;width:100%;object-fit:contain}
#app .pane{height:100%;min-height:0;max-height:none;overflow:hidden;display:flex;flex-direction:column;margin:0;border-radius:0;flex:auto;box-shadow:none}
#app .bottom-nav{position:static;min-height:56px;flex:none;padding:6px 12px max(6px,env(safe-area-inset-bottom));gap:7px}
.bottom-nav .nav-btn{min-height:42px;flex-direction:row;font-size:13px;gap:6px}
.bakery-view-switch{display:none}
.space-switch{padding:4px 12px;gap:5px;flex-wrap:nowrap}
.space-switch button{min-height:34px;min-width:0;font-size:12px}
.viewport-window{flex:1 1 0;min-height:0;overflow:hidden;position:relative;outline:none}
.viewport-content{width:100%;display:flow-root;transform-origin:top left}
.viewport-away{display:none!important}
#app .pane-content{display:block;height:auto;min-height:0;max-height:none;overflow:visible;flex:none;padding:12px}
#app .projects-content{padding:0}
.viewport-pages{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:5px 12px;background:#f2e4ca;border-top:1px solid var(--line);flex:none;min-height:48px}
.viewport-pages[hidden]{display:none}
.viewport-pages button{min-height:36px;min-width:76px;padding:6px 12px;border:1px solid #cfb590;border-radius:10px;background:#fff7e6;color:var(--berry-dark);font:600 14px system-ui}
.viewport-pages button:disabled{opacity:.45}.viewport-pages span{font-size:13px;color:#684637;font-variant-numeric:tabular-nums}
.viewport-pages select{min-width:0;max-width:130px;min-height:36px;font:13px system-ui;color:#684637;background:#fff7e6;border:1px solid #cfb590;border-radius:8px;padding:5px}
.viewport-pages button:focus-visible,.bakery-view-switch button:focus-visible{outline:3px solid #288b7d;outline-offset:1px}
#app .project-tree{overflow:visible;min-height:0;grid-template-columns:1fr 1fr;padding:8px 12px}
.project-top{padding:10px 12px 6px}.project-top h2{font-size:24px}.project-top .eyebrow{font-size:11px}
.community-wallet{padding:8px;font-size:12px}.campaign-progress{margin-block:6px;padding-block:6px}
#app .project-detail{max-height:none;overflow:visible;padding:12px}
.project-description{font-size:14px;line-height:1.4}.project-detail .packing-bench-photo{max-height:130px}
.project-coffee-flow{padding:8px;margin:8px 0}.project-coffee-flow span,.project-coffee-flow small{font-size:12px;line-height:1.4}
.project-reservation{margin:8px 0}.reserve-explanation{font-size:12px;line-height:1.4}
.cost-grid{grid-template-columns:repeat(auto-fit,minmax(75px,1fr));gap:5px}.cost-item{padding:6px}.cost-item strong{font-size:12px}
.project-node{min-height:66px;padding:9px}.project-node strong{font-size:13px}.project-node small{font-size:11px}
.project-list-title{padding:12px;font-size:15px}
.pane-heading{margin-bottom:10px}.pane-heading h2{font-size:25px}.pane-heading p{font-size:13px}
.room-style-rail{display:grid;grid-template-columns:1fr 1fr;overflow:visible;gap:8px;padding:4px 0}
.room-style-rail article{min-width:0;max-width:none;padding:10px;font-size:13px}.room-style-rail h3{font-size:20px}
.room-decor-filters{position:static}.room-decor-picker{padding:8px 12px;font-size:13px}
.room-decor-picker select{min-height:38px;padding:6px}.room-decor-picker .interface-color-entry{font-size:12px;min-height:38px}
.decor-tabs{flex-wrap:wrap;overflow:visible;gap:4px}.decor-tabs button{min-height:34px;padding:5px 8px;font-size:12px}
.decor-category{margin-block:7px}.decor-shop-note{margin:6px 0;font-size:12px}
.decor-photo{height:110px;aspect-ratio:auto}.decor-collection-art{height:150px;aspect-ratio:auto}.decor-collection-art img{height:100%;object-fit:cover}
.room-decor-item img{height:110px;aspect-ratio:auto}.room-decor-item>strong{font-size:14px}
.room-stations{margin:8px 0}.room-stations button{min-height:75px;padding:7px 4px}.room-stations strong{font-size:12px}
.room-upgrade-card{padding:12px}.room-upgrade-card>p{margin:8px 0}.room-upgrade-card h3{font-size:23px}
.decor-previewing .decor-preview-bar{position:absolute;bottom:8px;left:8px;right:8px;max-height:none;padding:10px;font-size:13px}
.decor-preview-bar p{font-size:12px;line-height:1.4;margin:6px 0}.room-preview-banner{bottom:58px}
.activity-picker{flex-direction:row;align-items:center;padding:6px 12px;gap:8px;font-size:0}
.activity-picker select{min-height:38px;padding:5px 8px;font-size:14px}.activity-picker>span{font-size:12px}
.activity-picker>.icon-btn{width:32px;height:32px;flex:none;background:#f0e3c9;color:#805e43}
.prep-content .prep-heading,.packing-content .packing-heading{display:none}
.prep-production{padding:0 0 6px;gap:10px}.prep-production>div>.icon{width:18px;height:18px}
.prep-heading,.packing-heading{margin:8px 0 4px}.prep-heading h2,.packing-heading h2{font-size:25px;margin:0}
.prep-heading .eyebrow,.packing-heading .eyebrow{display:none}
.prep-intro,.packing-intro{margin:4px 0 8px;font-size:13px}
.prep-order{padding:8px;margin-bottom:8px}.prep-order-heading h3{font-size:17px}.prep-order .eyebrow{font-size:10px}
.prep-order-bottom{margin-top:6px}.prep-requirement .prep-art{width:32px;height:32px}.prep-requirement span{font-size:11px}
.prep-board{max-width:290px;margin:0 auto;gap:5px;padding:7px}.prep-cell{min-height:0}
.prep-selection{margin:6px 0;font-size:12px;min-height:38px}.prep-selection span{font-size:12px}
.prep-source button{min-height:38px;padding:4px 8px}.prep-source .prep-art{width:28px;height:28px}.prep-source span{font-size:12px}
.prep-refill{margin:5px 0}.prep-generate{min-height:38px;margin:4px 0}.prep-footer{margin-top:5px;font-size:12px}
.prep-note{margin:5px 0;font-size:11px;line-height:1.3}
.prep-content .prep-production,.packing-content .prep-production,.prep-intro,.prep-note,.packing-note{display:none}
.prep-selection{padding:3px 0}.prep-selection span{margin-top:2px}
.prep-pantry{padding:5px 8px}.prep-generate{display:none} /* The basket on the board is the same ingredient action. */
.prep-footer .text-button{min-height:32px}.prep-order .prep-requirement>.prep-art{width:30px;height:30px}
.prep-order-heading{gap:5px}.prep-order-heading h3{font-size:16px}.prep-reward{font-size:14px;padding:4px 6px}
.packing-order{margin:4px 0}.packing-box{max-width:260px;margin:6px auto;padding:4px;border-width:5px}
.packing-cell{min-height:0}.packing-selection{margin:4px 0;min-height:0;font-size:12px}.packing-selection span{font-size:12px}
.packing-progress{margin:3px 0;font-size:12px}.packing-selected-controls{margin:4px 0}.packing-selected-controls button{min-height:34px;padding:5px}
.packing-trays{grid-template-columns:repeat(4,minmax(0,1fr));gap:5px;margin:6px 0}.packing-tray{min-height:62px;padding:4px;font-size:11px}.packing-tray>span{font-size:11px}
.packing-trays{grid-template-columns:repeat(3,minmax(0,1fr))}.packing-tray.rack-away{display:none}
.packing-rack-pages{display:flex;align-items:center;justify-content:center;gap:12px;margin:3px 0;font-size:12px}
.packing-rack-pages button{min-width:38px;min-height:30px;border-radius:8px;background:#efdbb7;color:#694333;font-size:20px}
.packing-rack-pages button:disabled{opacity:.4}
.packing-mini{width:calc(var(--mini-w)*11px);height:calc(var(--mini-h)*11px)}
.packing-tools button{min-height:34px;padding:5px;font-size:12px}.packing-footer{margin-top:6px;font-size:12px}.packing-note{font-size:11px;margin:5px 0}
.packing-progress{padding:3px 0}.packing-tools{margin:5px 0}.packing-footer .text-button{min-height:32px}
.packing-selection{padding:2px 0}.packing-selection span{margin-top:2px}
.packing-box{max-width:210px}.packing-intro{display:none}.packing-selected-controls{gap:4px}
.packing-selected-controls button{flex-direction:column;gap:2px;min-width:0;font-size:11px;padding:4px 2px;min-height:38px}
.packing-selected-controls .icon{height:14px;width:14px}
.packing-delivery{margin:5px 0}.packing-delivery .primary{min-height:38px;margin:0}.packing-complete{padding:6px}
#app .activity-game{padding:10px!important}.activity-game .pane-heading{margin-bottom:6px}.activity-game>p{margin:5px 0 8px;font-size:13px;line-height:1.35}
.activity-game .small-note{font-size:11px;line-height:1.3}.activity-game .activity-feedback:empty{display:none}
.activity-result{padding:6px;margin:6px 0;font-size:13px}.activity-result .primary{margin-top:5px;min-height:38px}
.activity-tools{margin-top:6px}.activity-game .secondary{min-height:38px;padding:7px}
.activity-sort .sort-shelves{gap:5px}.activity-sort .sort-shelf{display:grid;grid-template-columns:58px minmax(0,1fr);align-items:center;gap:4px;padding:4px;border-bottom-width:3px}
.activity-sort .sort-shelf>strong{font-size:12px}.activity-sort .jar-row{margin:0;gap:4px}.activity-sort .jar-row button{min-height:44px;padding:2px;font-size:11px}
.activity-sort .pantry-ingredient{width:30px;height:30px}.memory-grid{width:min(100%,280px);margin:0 auto;gap:5px}.memory-grid button{padding:4px;border-width:2px}
.coffee-practice{padding:4px 0}.coffee-practice>img{width:100px;height:90px}.coffee-flight{margin:5px 0}.coffee-meter{height:45px;margin:26px 6px 12px}.coffee-practice button{margin-top:8px}
dialog{height:min(640px,calc(100dvh - 20px));max-height:calc(100dvh - 20px);width:min(460px,calc(100vw - 20px));padding:16px;overflow:hidden;box-sizing:border-box}
dialog[open]{display:flex;flex-direction:column}dialog .modal-close{position:absolute;right:12px;top:12px;margin:0;z-index:5}
dialog .viewport-content{padding:4px 2px;box-sizing:border-box}dialog .viewport-pages{border-radius:10px;margin-top:8px}
dialog h2{font-size:26px;padding-right:24px;margin:7px 0 12px}dialog p{font-size:14px;line-height:1.45;margin:10px 0}
dialog .modal-emblem{width:36px;height:36px;margin-bottom:8px}.modal-emblem .icon{width:23px;height:23px}
dialog .primary{margin-top:10px;min-height:42px}dialog .info-list{font-size:14px;line-height:1.5;margin:8px 0}
.opening-card{height:auto;max-height:calc(100dvh - 20px);padding:18px}
.opening-card .viewport-window{flex:none;max-height:calc(100dvh - 58px);height:min(520px,calc(100dvh - 58px))}
.opening-card .neon-open{background:#fff6e3}
.opening-card h2{font-size:27px}.opening-card p{font-size:14px;line-height:1.4;margin:8px 0}
.opening-card .opening-promise{font-size:15px;line-height:1.35;margin:10px 0;padding:8px 12px}
.opening-card .neon-open{width:180px;margin:8px auto 0;padding:0}.opening-card .neon-open img{height:105px}.opening-card .neon-open>span{font-size:13px}
.offline-stats{margin:10px 0}.offline-stats>div{padding:9px;min-width:0}.offline-stats strong{font-size:20px;overflow-wrap:anywhere}
@media(max-width:760px){
 #app.prep-mode .space-switch,#app.prep-mode .bakery-view-switch{display:none}
 #app.prep-mode .resources{display:none}
 #app.prep-mode .topbar{min-height:44px;padding-block:4px}
 #app.prep-mode .brand>span{display:none}
 .bakery-view-switch{display:flex;gap:5px;padding:4px 12px;background:#f7eacb;flex:none}
 .bakery-view-switch button{min-height:34px;padding:5px 14px;border-radius:8px;background:#fff8e8;border:1px solid #d3bd94;font:600 12px system-ui;color:var(--berry-dark)}
 .bakery-view-switch button[aria-pressed=true]{background:var(--berry);color:var(--ui-ink)}
 .bakery-view-switch button:last-child{margin-left:auto;width:34px;padding:4px}
 #app .play-layout{display:block;position:relative}
 #app[data-view=controls] .scene-wrap{display:none}
 #app[data-view=room] .pane{display:none}
 #app .space-switch{display:flex}
 #app .space-switch[hidden]{display:none}
 .bottom-nav .nav-btn{flex-direction:column;font-size:11px;gap:2px}.nav-btn .icon{height:17px;width:17px}
 .badge{right:2px;top:0}.brand{flex-basis:auto}.brand h1{font-size:23px}.brand>span{font-size:11px}
 .coin-wallet{margin-left:auto;font-size:19px}.resource>div{flex-direction:row;gap:4px}.resource>.icon{display:none}
 .scene-caption{bottom:8px}.scene-status{top:8px}.scene-help{top:8px}
}
@media(max-height:500px){
 #app .topbar{min-height:42px;padding-block:4px}.brand h1{font-size:20px}.brand>span{display:none}
 #app .resources{min-height:30px;padding-block:3px}.bakery-view-switch{padding-block:2px}
 #app .bottom-nav{min-height:44px;padding-block:3px}.bottom-nav .nav-btn{min-height:34px;flex-direction:row}
 .bottom-nav .icon{display:none}.space-switch button{min-height:28px}
}
@media(max-height:600px) and (max-width:699px){
 .prep-heading,.packing-heading{margin:3px 0}.prep-heading h2,.packing-heading h2{font-size:21px}
 .prep-heading .icon-btn,.packing-heading .icon-btn{width:30px;height:30px}
 .prep-order{padding:5px;margin:5px 0;display:flex;align-items:center;gap:8px}.prep-order-heading h3,.prep-order-heading .eyebrow{display:none}.prep-order-heading{order:2}.prep-order-bottom{flex:1;margin:0}
 .prep-requirements{gap:0}.prep-order .prep-requirement>.prep-art{width:24px;height:24px}.prep-requirement span:not(.prep-art){font-size:11px}.prep-serve{min-height:32px;padding:5px 8px;font-size:12px}
 .prep-board{width:240px;max-width:100%;gap:4px;padding:5px}.prep-selection{min-height:28px;margin:3px 0}.prep-selection span{display:none}.prep-sell{min-height:30px;padding:4px 8px}
 .prep-source button{min-height:30px}.prep-source .prep-art{width:22px;height:22px}.prep-pantry{padding:4px 6px}.prep-refill{margin:3px 0}
 .prep-footer .text-button{min-height:28px}.prep-footer{margin:3px 0}
 .packing-intro{display:none}.packing-order{font-size:11px}.packing-level{min-height:32px;padding:4px 7px;font-size:12px}
 .packing-box{max-width:200px;margin:4px auto}.packing-tray{min-height:48px;padding:3px;gap:3px}.packing-tray small{display:none}
 .packing-selection span{display:none}.packing-selection strong{font-size:12px}.packing-tools button,.packing-selected-controls button{min-height:30px;padding:4px;font-size:11px}
 .packing-delivery .primary{min-height:32px;padding:6px;font-size:12px}.packing-footer .text-button{min-height:28px}
 .decor-photo,.room-decor-item img{height:65px}.decor-collection-art{height:90px}
 .memory-grid{width:min(100%,calc((100dvh - 230px)*.8),280px)}
 .activity-sort .jar-row button{min-height:36px}.activity-sort .pantry-ingredient{width:23px;height:23px}
 .activity-sort .sort-shelf{padding:2px 4px;border-bottom-width:2px}.activity-sort .sort-shelves{gap:3px}
 .activity-game .pane-heading h2{font-size:20px}.activity-game .pane-heading .eyebrow{font-size:10px}
 .activity-game .small-note{font-size:10px}.activity-game .coffee-practice>img{height:60px;width:70px}
}
@media(min-width:700px) and (max-height:600px){
 #app.prep-mode .scene-wrap,#app.prep-mode .resources,#app.prep-mode .space-switch,#app.prep-mode .bakery-view-switch{display:none}
 #app.prep-mode .play-layout{grid-template-columns:1fr}
 #app.prep-mode .topbar{min-height:40px;padding-block:3px}#app.prep-mode .brand>span{display:none}
 #app .prep-content,#app .packing-content{display:grid;grid-template-columns:minmax(200px,1fr) minmax(240px,1fr);column-gap:14px;padding:6px 12px}
 .prep-content>*{grid-column:2}.prep-content .prep-board{grid-column:1;grid-row:1/7;width:250px;max-width:100%;align-self:center}
 .prep-heading{margin:0}.prep-heading h2{font-size:22px}.prep-order{margin:4px 0;padding:5px}.prep-order-heading{float:left;width:45%}.prep-order-bottom{margin:0}
 .prep-order-heading h3{font-size:14px}.prep-reward{font-size:12px}.prep-order-heading .eyebrow{font-size:9px}
 .prep-selection{min-height:30px;margin:3px 0}.prep-selection span{font-size:11px}.prep-pantry{padding:4px}.prep-source button{min-height:30px}.prep-refill{margin:3px 0}
 .prep-footer{margin:0}.prep-footer .text-button{min-height:28px}
 .packing-content>*{grid-column:2}.packing-content .packing-box{grid-column:1;grid-row:1/12;width:230px;max-width:100%;align-self:center}
 .packing-heading{margin:0}.packing-heading h2{font-size:21px}.packing-intro{display:none}.packing-order{font-size:11px}.packing-level{min-height:32px;padding:4px;font-size:12px}
 .packing-progress{padding:2px}.packing-selection{padding:0;margin:2px 0}.packing-selection strong{font-size:12px}.packing-selection span{font-size:11px;margin:0}
 .packing-selected-controls{margin:3px 0}.packing-selected-controls button,.packing-tools button{min-height:30px;padding:3px;font-size:11px}
 .packing-trays{margin:3px 0;grid-template-columns:repeat(6,minmax(0,1fr))}.packing-tray{min-height:48px;padding:2px;gap:2px}.packing-tray small{display:none}.packing-mini{width:calc(var(--mini-w)*9px);height:calc(var(--mini-h)*9px)}
 .packing-tools{margin:3px 0}.packing-footer{margin:0}.packing-footer .text-button{min-height:28px;font-size:11px}
 .activity-sort .sort-shelves{grid-template-columns:1fr 1fr}.activity-game .memory-grid{width:min(100%,580px);--columns:8!important}
 .activity-game .coffee-practice{display:grid;grid-template-columns:110px 1fr;align-items:center;gap:5px 16px}.coffee-practice>img{grid-row:1/4}.coffee-flight{grid-column:2}.coffee-meter{grid-column:2}
 .opening-card{width:min(720px,calc(100vw - 20px))}.opening-card .viewport-content{display:grid;grid-template-columns:1.2fr 1fr;gap:4px 20px}
 .opening-card .modal-emblem,.opening-card .eyebrow{display:none}.opening-card h2,.opening-card p{grid-column:1;margin:4px 0}
 .opening-card .opening-promise{grid-column:2;grid-row:1/3;margin:4px 0}.opening-card .neon-open{grid-column:2;grid-row:3/5;margin:0 auto}
 #app .activity-game{display:grid;grid-template-columns:minmax(0,1fr) 240px;gap:4px 16px;align-items:center}
 .activity-game>*{grid-column:2}.activity-game>.sort-shelves,.activity-game>.memory-grid,.activity-game>.coffee-practice{grid-column:1;grid-row:1/8;align-self:center}
 .activity-game .memory-grid{--columns:6!important;width:min(100%,300px)}.activity-game .pane-heading h2{font-size:21px}
 .activity-game>p{margin:3px 0;font-size:12px}.activity-game .small-note{font-size:10px}.activity-game .activity-tools{margin:2px 0}
 #app .packing-content{grid-template-columns:minmax(180px,1fr) minmax(180px,1fr) minmax(180px,1fr);gap:4px 12px}
 .packing-content>*{grid-column:3}.packing-content .packing-box{grid-column:1;grid-row:1/9;width:205px}
 .packing-content .packing-trays{grid-column:2;grid-row:1/4;grid-template-columns:repeat(3,minmax(0,1fr));align-self:end}
 .packing-content .packing-rack-pages{grid-column:2;grid-row:4}.packing-content .packing-selected-controls{grid-column:2;grid-row:5/7;align-self:start}
 .packing-content .packing-order{grid-row:1}.packing-content .packing-delivery{grid-row:2}.packing-content .packing-progress{grid-row:3}.packing-content .packing-selection{grid-row:4}.packing-content .packing-footer{grid-row:5/7}
 .decor-photo,.room-decor-item img{height:55px}.decor-collection-art{height:80px}
}
@media(max-height:600px){.room-style-rail article{gap:4px;padding:6px}.room-style-rail h3{font-size:18px}.room-palette{height:20px}.room-style-rail article>.secondary{min-height:32px;padding:5px}.room-style-rail article>small,.room-style-rail article>.small-note{font-size:11px}.room-style-rail article>.text-button{min-height:30px}}
