/* A single playable world, with a little deck of washi-paper controls on top. */
@font-face{font-family:Nunito;src:url('fonts/nunito-700.ttf') format('truetype');font-weight:700;font-display:swap}
@font-face{font-family:Nunito;src:url('fonts/nunito-800.ttf') format('truetype');font-weight:800;font-display:swap}
@font-face{font-family:Nunito;src:url('fonts/nunito-900.ttf') format('truetype');font-weight:900;font-display:swap}
:root{--ink:#503d42;--muted:#755f58;--cream:#fff9e9;--line:#cfbba0;--berry:#a84763;--matcha:#42745d;--plum:#7f5563;--paper:url('paper-fibres.svg');--dock-space:196px}
html,body{width:100%;min-height:100%;overscroll-behavior-y:none}
body{background:#f2dbbc;font:800 14px/1.35 Nunito,ui-rounded,'Trebuchet MS',sans-serif;color:var(--ink);overflow-x:hidden}
button,summary,a{touch-action:manipulation}button{font-weight:800;border-radius:8px;min-height:40px;transition:background .14s,transform .14s,box-shadow .14s}
button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #723a4d;outline-offset:3px}
button:disabled{opacity:.58}button:not(:disabled):active{transform:translateY(2px)}
.sr-only{position:absolute!important;width:1px!important;height:1px!important;margin:-1px!important;padding:0!important;overflow:hidden!important;clip-path:inset(50%)!important;white-space:nowrap!important;border:0!important}
#gameShell{max-width:none;width:100%;padding:0;margin:0}
.stage{width:100%;border:0;border-radius:0;box-shadow:none;overflow:visible}
#sceneWrap{height:100svh;min-height:650px;width:100%;aspect-ratio:auto;border:8px solid #f7edda;border-radius:0;isolation:isolate;background:#f4dfc8;--recipe-bottom:280px}
#world{position:absolute;inset:0;width:100%;height:100%;touch-action:pan-y}
#sceneWrap:after{content:'';position:absolute;inset:0;box-shadow:inset 0 0 45px #7959421c;pointer-events:none;z-index:1}
#loadState{z-index:2;font-size:19px;font-weight:900;pointer-events:none;background:#fff6e8e8}
.paper-card{background-color:var(--cream);background-image:var(--paper);border:2px solid var(--line);border-radius:7px;box-shadow:0 5px 0 #70523c25,0 9px 23px #503a3820}
.eyebrow{font:900 10px/1.3 Nunito,sans-serif;color:var(--muted);letter-spacing:1.2px}
.game-topbar{position:absolute;top:12px;left:18px;right:18px;z-index:6;max-width:none;margin:0;padding:0;display:flex;gap:18px;align-items:flex-start;justify-content:space-between;border:0;pointer-events:none}
.game-topbar>*{pointer-events:auto}
.brand{font:900 28px/1 Nunito,sans-serif;letter-spacing:-1.4px;gap:8px;color:#633d4d;filter:drop-shadow(0 2px #fff7e9)}
.brand i{font:900 25px Nunito,sans-serif;color:#b64f6a}
.brand-symbol{width:48px;height:48px;background:#efb9c8;border:3px solid #fff7e6;border-radius:42% 48% 40% 48%;box-shadow:0 2px 0 #b77a8b;transform:rotate(-7deg)}
.brand small{font:900 9px Nunito,sans-serif;color:#694a45;letter-spacing:1.5px;margin-top:7px}
.mode-controls{position:relative;align-items:center;gap:5px}
.modes{background:#fff6e6;background-image:var(--paper);padding:4px;border:2px solid #9c7683;border-radius:10px;box-shadow:0 4px 0 #6c4a5538;flex-direction:row;gap:4px}
.modes button{padding:9px 17px;font-size:13px;min-height:38px;border-radius:6px;color:#715760;white-space:nowrap;font-weight:900}
.modes .selected{color:#fffaf0;background:#a26b7d;box-shadow:inset 0 -3px #71495644}
.modes button:not(.selected):hover{background:#eed6e6}
.difficulty{position:absolute;top:100%;padding-top:6px;white-space:nowrap;gap:5px}
.difficulty button{min-height:31px;padding:4px 12px;background:#fff7e6;border:1px solid #9e7e89;font-size:11px;box-shadow:0 2px 0 #7a566233}
.difficulty .selected{background:#e2bcc9;color:#5d3643}
.world-tools{display:flex;gap:7px;align-items:flex-start}
.world-tools>button,.game-menu>summary{background:#fff7e8;background-image:var(--paper);border:2px solid #c8aa8c;box-shadow:0 3px 0 #7958442b;min-height:42px;padding:8px 12px;font-size:12px;color:#644e43}
.world-tools>button[aria-pressed=true]{background-color:#e9c7d2;border-color:#a37182}
.game-menu{position:relative}.game-menu>summary{border-radius:9px;list-style:none;display:grid;place-items:center;min-width:44px;cursor:pointer;font-size:20px;line-height:1}
.game-menu>summary::-webkit-details-marker{display:none}
.menu-paper{position:absolute;top:54px;right:0;width:320px;max-height:calc(100svh - 135px);overflow:auto;padding:18px;border:3px solid #b78393;z-index:10}
.menu-heading{font-size:22px;font-weight:900;color:var(--berry);display:flex;justify-content:space-between}
.stats{gap:12px;margin:12px 0;justify-content:space-between}.stats>div{text-align:left}.stats span{font-size:11px;color:var(--muted)}.stats strong{font-size:24px;color:var(--berry)}
.icon-button{font-size:10px;padding:8px;background:#ead2da;min-height:42px;border:1px solid #b18292}.icon-button:after{content:none}
.mix-note{padding:12px;margin:10px 0;background:#eee8d7;gap:8px}.mix-note p{font-size:12px;line-height:1.5;color:#675247}.mix-note>span{color:#9f7939}
.help{font-size:12px;color:#614b44;margin:14px 0}.help summary{font-weight:900;padding:8px 0}.help p{font-size:12px;line-height:1.6}
.shelf{display:block;margin:10px 0 0;padding:15px 0 0;border-top:1px dashed #bc997d}.shelf h2{font-size:14px;margin-bottom:8px}#history{gap:7px}.mini{font-size:11px;padding:7px;border-color:#c8b096}.mini b{color:var(--berry)}.sub{font-size:12px;color:#785e51}
.order-card{position:absolute;top:88px;left:18px;z-index:3;width:284px;max-height:calc(100% - var(--dock-space) - 110px);overflow:auto;padding:14px 13px 11px;border:5px solid #547d67;border-radius:4px;box-shadow:inset 0 0 0 2px #fff8e9,0 5px 0 #315b4638,3px 10px 25px #49382420;transform:rotate(-.45deg);scrollbar-width:thin;scrollbar-color:#85a18a #f5ead6}
.order-card:before{content:'';position:absolute;top:0;right:0;width:96px;height:63px;background:url('paper-flowers.svg') right top/100px auto no-repeat;opacity:.75;pointer-events:none}
.customer-heading{gap:8px;position:relative;align-items:center}.customer-avatar{width:37px;height:37px;flex:none;background:#ede2ce;border:2px solid #c6b69d;font-size:23px;box-shadow:0 2px #d7c6a9}
.customer-title{min-width:0;flex:1}.customer-heading .eyebrow{font-size:8px;letter-spacing:.9px;color:#55715c;display:block}
.customer-heading h2{font:900 19px/1.1 Nunito,sans-serif;letter-spacing:-.5px;color:#345b47;margin:4px 0 0;overflow-wrap:anywhere}
.paper-fold{min-width:32px;min-height:36px;padding:0;font-size:24px;line-height:1;background:#e6ead8;border:1px solid #92aa8b;color:#3b634e;align-self:center}
#customerNote{font-size:11px;line-height:1.4;color:#725d50;margin:12px 0 8px;font-weight:700}
.order-recipe{gap:10px;margin-top:8px;align-items:flex-start}.diagram-wrap{flex:0 0 29px;align-self:stretch;justify-content:center}#orderDiagram{width:29px;height:162px;border:2px solid #ae8a63;border-top:0;border-radius:0 0 11px 11px;box-shadow:3px 2px #dbc4a2}#orderDiagram span{width:14px;height:14px;font-size:9px;line-height:14px;color:#503f36}.diagram-wrap small{font-size:8px;color:#755e48}
.recipe-copy h3{font-size:10px;font-weight:800;color:#6f6650;letter-spacing:0;margin:0 0 8px}
#orderSteps{display:grid;grid-template-columns:1fr;gap:7px}
#orderSteps li{display:grid;grid-template-columns:22px minmax(0,1fr) auto;gap:4px 5px;min-width:0;padding:7px 7px 6px;border-radius:4px;border:1px solid #d8c8af;background:#fff9e9;box-shadow:inset 3px 0 var(--ingredient);font-size:12px;opacity:1}
#orderSteps li>b{width:21px;height:21px;background:#eee3ce;color:#78604b;font:900 10px Nunito,sans-serif;grid-column:1;grid-row:1;align-self:center}
#orderSteps li>span{font-size:11px;font-weight:800;line-height:1.15;color:#594339;min-width:0;grid-column:2;grid-row:1}
#orderSteps small{font-size:9px;line-height:1.2;color:#7c6755;margin-top:2px}#orderSteps strong{font-size:15px;letter-spacing:-.6px;color:#604838;grid-column:3;grid-row:1;align-self:center}
#orderSteps .step-progress{grid-column:1/-1;min-width:0}.step-track{height:7px;border:1px solid #bbaa8e;border-radius:3px;background:#e5dbc9}.step-track i{border-radius:2px}
#orderSteps .step-amount{font-size:9px;line-height:1.15;margin-top:3px;color:#746044}
#orderSteps .current{border:2px solid #609071;padding:6px 6px 5px;background:#edf3dc;box-shadow:inset 3px 0 var(--ingredient),2px 2px #547d672b}
#orderSteps .current>b{background:#547d67;color:#fff9e9}#orderSteps .step-complete{background:#edf1e2}#orderSteps .step-over{background:#ffebde;border-color:#bd665d}
.order-score{display:flex;flex-direction:row;justify-content:space-between;gap:8px;text-align:left;font-size:9px;letter-spacing:.6px;border-top:1px dashed #9ca787;margin-top:12px;padding-top:9px;white-space:nowrap}.order-score strong{font-size:13px;color:#835363;margin-left:4px;letter-spacing:-.4px}
.scene-fill{position:absolute;top:91px;right:19px;bottom:auto;left:auto;min-width:0;width:216px;z-index:3;padding:13px 16px 12px;border:3px solid #bd7e91;transform:rotate(1deg);border-radius:5px;color:#70564d;box-shadow:0 5px 0 #8b536d30,0 9px 24px #4f343b20;pointer-events:none;background-color:#fff8e5}
.scene-fill:before{content:'';position:absolute;top:-9px;left:calc(50% - 26px);width:52px;height:18px;transform:rotate(-7deg);background:repeating-linear-gradient(90deg,#e8c061b3 0 6px,#f0d17cbb 6px 8px);border:1px solid #e1ba6680}
.fill-kicker{font-size:10px;letter-spacing:1.2px;color:#956072}.scene-fill>strong{font:900 clamp(42px,4.2vw,62px)/1.05 Nunito,sans-serif;font-variant-numeric:tabular-nums;letter-spacing:-2.5px;margin:6px 0;color:var(--fill-ink,#60404f)}
.scene-fill>#sceneOverflow{font-size:10px;letter-spacing:.4px}.fill-signal{font-size:9px;letter-spacing:.1px;margin-top:7px;gap:6px}.fill-signal i{width:13px;height:13px;border-width:2px}
.scene-fill .meter{display:block;width:100%;height:8px;margin:9px 0 2px;background:#e0d1b9;border:1px solid #c1ac89;border-radius:3px}.scene-fill .meter:after{top:-3px;height:12px;border-color:#507755}.scene-fill .meter i{border-radius:2px}
.scene-fill>#stepHint{font-size:11px;line-height:1.4;max-width:none;color:#624d40;border-top:1px dashed #c6af8d;margin-top:9px;padding-top:8px;font-weight:900}
.scene-fill[data-fill-stage=yellow]{background-color:#fff0bc;border-color:#c28d25}.scene-fill[data-fill-stage=green]{background-color:#e8f7dc;border-color:#458460}.scene-fill[data-fill-stage=red]{background-color:#ffe0e4;border-color:#bc4763}
.scene-caption,.seal-note{display:none}
.bubble{font:800 12px/1.35 Nunito,sans-serif;top:auto;bottom:calc(var(--dock-space) + 22px);left:24%;width:220px;max-width:22%;padding:10px 14px;background:#fff9e8f2;background-image:var(--paper);border:2px solid #c5a381;border-radius:8px;transform:rotate(-2deg);z-index:2;box-shadow:0 3px 0 #76534422}
.bubble:after{left:32%;background:#fff9e8}.customer-bubble{left:auto;right:4%;bottom:calc(var(--dock-space) + 36px);transform:rotate(2deg);background-color:#fff0eaf5;border-color:#c88e9c}.customer-bubble:after{background:#fff0ea;border-color:#c88e9c}
.play-dock{position:absolute;bottom:16px;left:18px;right:18px;display:grid;grid-template-columns:minmax(0,1fr) 250px;gap:12px;z-index:4;pointer-events:none}
.play-dock>*{pointer-events:auto}
.ingredients{position:static;display:grid;grid-template-columns:minmax(0,4fr) minmax(0,5fr);gap:18px;align-self:stretch;width:auto;padding:14px 16px 15px;backdrop-filter:none;border:3px solid #b77c8c;border-radius:7px;background-color:#fff4e1;background-image:url('paper-flowers.svg'),var(--paper);background-size:120px 80px,180px 180px;background-position:right bottom,0 0;background-repeat:no-repeat,repeat;box-shadow:0 5px 0 #8f596c30,0 10px 26px #4d38312b}
.ingredient-group{min-width:0}.section-title{display:flex;align-items:center;gap:7px;margin:0 0 9px;padding:0}
.number{width:22px;height:22px;font-size:10px;font-weight:900;background:#a64c66;color:#fff5e3;border-radius:4px;transform:rotate(-5deg)}
.section-title h2{font-size:15px;color:#913b57;letter-spacing:-.2px;font-weight:900;white-space:nowrap}.section-title p{font-size:10px;color:#7d5c51;margin:0 0 0 auto;white-space:nowrap;font-weight:800}
.topping-group .number{background:#527e62}.topping-group h2{color:#3e684d}
.ingredients #bases,.ingredients #mixes{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;grid-row:auto;grid-column:auto;align-content:start}
.ingredients #mixes{grid-template-columns:repeat(5,minmax(0,1fr))}
.ingredients .ingredient,#mixes .ingredient:last-child{position:relative;display:flex;flex-direction:column;justify-content:center;gap:4px;min-height:86px;padding:7px 2px 8px;font-size:12px;font-weight:900;border:2px solid #c17f91;border-radius:6px;box-shadow:0 4px 0 #b77989;grid-column:auto;color:#633346;background:#f6c3cf;background-image:var(--paper);touch-action:none;user-select:none;outline:none}
.ingredients #mixes .ingredient{background-color:#cfe2b9;border-color:#85a572;color:#355133;box-shadow:0 4px 0 #7f9c6e}
.ingredients #mixes .ingredient:last-child{background-color:#c1e0e8;border-color:#73a5b6;color:#315867;box-shadow:0 4px 0 #7aa0af}
.ingredients .ingredient-icon{font-size:28px;line-height:1.1;filter:drop-shadow(0 2px 0 #fff7d98c)}
.ingredient-name{line-height:1.1}.ingredient-name small{font-size:10px;line-height:1.2;margin-top:3px;opacity:1;font-weight:800}
.ingredients .ingredient.active{outline:2px solid #734756;outline-offset:2px;border-color:#734756;box-shadow:0 4px 0 #8c6572}
.ingredients .ingredient.holding,.ingredients #mixes .ingredient.holding{transform:translateY(3px);background-color:#895768;color:#fff8e6;border-color:#673d4b;box-shadow:0 1px 0 #673d4b;outline:2px solid #fff6de;outline-offset:-5px}
.ingredients .ingredient:focus-visible{outline:3px solid #652c3f;outline-offset:2px}
.finish-card{padding:10px 12px 8px;border:3px solid #ad808f;background-color:#f8eee2;box-shadow:0 5px 0 #81546336,0 9px 23px #503a3820}
.controls{padding:0}.container-row{display:flex;flex-wrap:wrap;gap:5px}.container-row .eyebrow{font-size:9px;letter-spacing:1px;width:100%}
.container-options{display:flex;gap:5px;margin:0;width:100%}.container-options button{flex:1;min-height:31px;padding:5px 5px;font-size:11px;line-height:1.2;border-radius:4px;border:1px solid #b89ca5;background:#fff8e5;color:#755569}
.container-options .selected{background:#e6c7d1;color:#673e4c;border:2px solid #ac7688;padding:4px}
.meter{height:5px;background:#dfd0c5;margin-top:8px;border-radius:3px}.meter:after{height:9px;top:-2px;border-color:#54775e}
#fillhud{padding:0;margin:8px 0 4px;border:0;background:none;display:block}.hud-actions{display:flex;width:100%;margin:0;gap:6px}
.hud-actions #hudpack{flex:1;min-width:0;min-height:43px;font:900 13px Nunito,sans-serif;padding:9px 8px;border:2px solid #8d5668;background:#bd8698;color:#fff9e8;border-radius:6px;box-shadow:0 4px 0 #8b5567;letter-spacing:.5px}
.hud-actions #hudpack:not(:disabled):hover{background:#a66a7e}.hud-actions #hudpack:disabled{background:#d9b9c4;color:#7c5c67;opacity:1;border-color:#bf98a5;box-shadow:0 3px 0 #bf98a5}
.hud-actions #speed{min-width:60px;padding:4px;font-size:10px;background:#ffe2a1;border-color:#b99751;box-shadow:0 3px 0 #c2a369;border-radius:6px}
.small-actions{display:flex;gap:5px;align-items:center;justify-content:space-between;margin-top:6px}.small-actions button{min-height:27px;padding:4px;font-size:10px;color:#71555e}.small-actions .reset{margin:0;text-decoration:none;background:none;border:0}.small-actions .reset:hover{text-decoration:underline}#receiptButton{background:none;border:0;border-bottom:1px dashed #a4808c;border-radius:0}
.status-ribbon{position:absolute;bottom:calc(100% + 10px);left:50%;transform:translateX(-50%);max-width:60%;width:max-content;padding:6px 14px;color:#644e3e;background:#fff4dbeb;background-image:var(--paper);border:1px solid #cfb793;box-shadow:0 3px 0 #82624820;font-size:11px;font-weight:800;display:flex;align-items:center;gap:8px;border-radius:3px;pointer-events:none;text-align:center}
.status-ribbon>span:first-child{font-size:19px;color:#ae5e76}.status-ribbon #status{margin:0;min-height:0;font-size:inherit;color:inherit;text-align:inherit}
#receiptNext{font-family:Nunito,sans-serif;font-weight:900;font-size:14px}
@media(min-width:1600px){.order-card{width:310px}.scene-fill{width:240px}.scene-fill>strong{font-size:65px}.ingredients{padding:16px 22px}.ingredients .ingredient{min-height:94px;font-size:13px}.ingredients .ingredient-icon{font-size:32px}.play-dock{grid-template-columns:minmax(0,1fr) 280px}.section-title h2{font-size:17px}.section-title p{font-size:12px}}
@media(max-width:1150px) and (min-width:761px){:root{--dock-space:206px}.order-card{width:252px;left:12px;padding:11px 10px}.scene-fill{right:12px;width:180px;padding:12px}.scene-fill>strong{font-size:48px}.game-topbar{left:12px;right:12px;gap:10px}.brand{font-size:24px}.brand-symbol{width:42px;height:42px}.modes button{padding:8px 10px;font-size:11px}.world-tools>button{padding:8px;font-size:11px}.play-dock{left:12px;right:12px;grid-template-columns:minmax(0,1fr) 210px;gap:9px}.ingredients{gap:12px;padding:12px 10px}.section-title{gap:5px}.section-title h2{font-size:13px}.section-title p{display:none}.ingredients .ingredient,#mixes .ingredient:last-child{min-height:90px;font-size:10px;gap:6px}.ingredients .ingredient-icon{font-size:24px}.ingredient-name small{font-size:9px}.ingredients #bases,.ingredients #mixes{gap:5px}.customer-heading h2{font-size:17px}.bubble{font-size:10px}.status-ribbon{font-size:10px;max-width:68%}}
/* Portrait: every control remains inside the world; recipes become a compact row of cards. */
@media(max-width:760px){
 :root{--dock-space:241px}#sceneWrap{min-height:660px;border-width:4px}
 .game-topbar{left:9px;right:9px;top:9px;display:grid;grid-template-columns:1fr auto;gap:9px 7px;align-items:center}
 .brand{font-size:24px;gap:7px}.brand-symbol{width:37px;height:37px;border-width:2px}.brand small{font-size:7px;letter-spacing:1px;margin-top:4px}.brand i{font-size:22px}
 .world-tools{grid-column:2;grid-row:1;gap:5px;align-items:center}.world-tools>button{min-height:36px;padding:6px 8px;font-size:10px}.game-menu>summary{min-height:36px;min-width:36px;padding:6px;font-size:18px}
 .mode-controls{grid-column:1/-1;grid-row:2;display:flex;width:100%;align-items:center}.modes{width:100%;padding:3px;border-width:1px;gap:3px;border-radius:6px}.modes button{flex:1;padding:6px 8px;min-height:31px;font-size:12px;border-radius:4px}.difficulty{top:100%;padding-top:5px}.difficulty button{min-height:30px;font-size:11px}
 .menu-paper{top:46px;width:min(320px,calc(100vw - 28px));padding:16px;max-height:calc(100svh - 80px)}.icon-button{font-size:10px}.stats{gap:12px}.stats span{font-size:11px}.stats strong{font-size:22px}
 .order-card{top:101px;left:9px;right:9px;width:auto;max-height:240px;padding:8px 9px 7px;border-width:3px;transform:none;overflow:auto}.customer-heading{gap:7px}.customer-avatar{width:29px;height:29px;font-size:20px}.customer-heading h2{font-size:17px;margin:2px 0 0;letter-spacing:-.4px}.customer-heading .eyebrow{font-size:7px;letter-spacing:.8px}.paper-fold{min-width:36px;min-height:36px;font-size:22px}
 #customerNote{display:none}.order-recipe{margin-top:6px;gap:7px;align-items:stretch}.diagram-wrap{flex:0 0 25px}#orderDiagram{height:85px;width:24px;border-width:1px;box-shadow:2px 2px #d8c29e}#orderDiagram span{width:11px;height:11px;font-size:8px;line-height:11px}.diagram-wrap small{font-size:7px;margin-top:4px}
 .recipe-copy h3{display:none}#orderSteps{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);grid-template-columns:none;gap:4px}
 #orderSteps li{display:flex;flex-direction:column;align-items:stretch;gap:3px;min-width:0;padding:6px 3px 5px;position:relative;box-shadow:inset 0 3px var(--ingredient);border-radius:3px}
 #orderSteps li>b{position:absolute;top:6px;left:3px;width:15px;height:15px;font-size:8px;align-self:auto}
 #orderSteps li>span{font-size:10px;line-height:1.1;flex:1;min-height:35px;margin-top:19px;text-align:center;font-weight:900;overflow-wrap:normal}#orderSteps small{display:none}
 #orderSteps li>strong{position:absolute;right:3px;top:6px;font-size:11px;line-height:15px;letter-spacing:-.4px;margin:0}
 #orderSteps .step-progress{flex:none;width:100%}.step-track{height:7px}#orderSteps .step-amount{font-size:8px;line-height:1.15;text-align:center;margin-top:4px;letter-spacing:-.2px;min-height:18px}
 #orderSteps .current{padding:5px 2px 4px;box-shadow:inset 0 3px var(--ingredient),0 1px 0 #68876422}#orderSteps .current>b{top:5px;left:2px}#orderSteps .current>strong{top:5px;right:2px}
 .order-score{margin-top:7px;padding-top:5px;justify-content:center;gap:25px;font-size:8px;letter-spacing:.5px}.order-score strong{font-size:11px;margin-left:4px}
 .order-card.folded .order-score{margin-top:5px;padding-top:5px}
 .scene-fill{top:calc(var(--recipe-bottom) + 10px);right:11px;left:auto;width:151px;padding:8px 10px 9px;border-width:2px;border-radius:4px;transform:rotate(1deg)}
 .scene-fill:before{width:39px;height:12px;top:-7px;left:calc(50% - 20px)}.fill-kicker{font-size:8px;letter-spacing:.9px}.scene-fill>strong{font-size:39px;letter-spacing:-1.7px;margin:3px 0}.scene-fill>#sceneOverflow{font-size:8px}.fill-signal{font-size:8px;gap:4px;margin-top:4px}.fill-signal i{width:10px;height:10px;border-width:1px}.scene-fill>#stepHint{font-size:9px;margin-top:5px;padding-top:5px;line-height:1.25}
 #orderCard[hidden]~.scene-fill{top:148px}
 .play-dock{left:8px;right:8px;bottom:calc(9px + env(safe-area-inset-bottom));display:grid;grid-template-columns:1fr;gap:7px}
 .ingredients{position:static;display:grid;grid-template-columns:1fr;gap:8px;padding:9px 9px 10px;border-width:2px;border-radius:6px;box-shadow:0 4px 0 #986c7930,0 9px 21px #76513a20;background-size:120px 80px,180px 180px}
 .section-title{display:flex;gap:5px;margin:0 0 5px;min-height:14px;padding:0}.section-title .number{width:17px;height:17px;font-size:8px}.section-title h2{font-size:12px;letter-spacing:.2px}.section-title p{display:block;font-size:9px;color:#775c4e;margin-left:auto}
 .ingredients #bases{grid-template-columns:repeat(4,minmax(0,1fr));grid-row:auto;grid-column:auto}.ingredients #mixes{grid-template-columns:repeat(5,minmax(0,1fr));grid-row:auto;grid-column:auto}.ingredients .options{gap:6px}
 .ingredients .ingredient,#mixes .ingredient:last-child{min-height:46px;padding:5px 3px;gap:4px;flex-direction:row;flex-wrap:nowrap;justify-content:center;font-size:10px;border-width:1px;border-radius:4px;box-shadow:0 3px 0 #b77989;outline-offset:1px}
 .ingredients .ingredient-icon{font-size:23px;line-height:1}.ingredient-name{text-align:left;line-height:1.1}.ingredient-name small{font-size:8px;margin-top:2px;line-height:1.1;opacity:1}
 .ingredients #mixes .ingredient{min-height:49px;gap:2px;flex-direction:column;font-size:9px;box-shadow:0 3px 0 #7f9c6e}.ingredients #mixes .ingredient-icon{font-size:18px}.ingredients #mixes .ingredient-name{text-align:center}.ingredients #mixes .ingredient-name small{display:inline;margin-left:2px;font-size:8px}.ingredients #mixes .ingredient:last-child{box-shadow:0 3px 0 #7aa0af}
 .finish-card{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);align-items:center;gap:3px 9px;padding:6px 8px 5px;border-width:2px;border-radius:5px}.controls{grid-row:1;grid-column:1;padding:0}.container-row{gap:0}.container-row>.eyebrow{display:none}.container-options{gap:4px;margin:0}.container-options button{min-height:37px;padding:5px 3px;font-size:10px;border-radius:4px}.container-options .selected{padding:4px 2px}.meter{display:none}
 #fillhud{margin:0;grid-column:2;grid-row:1;padding:0}.hud-actions{display:flex;gap:4px}.hud-actions #hudpack{min-height:38px;min-width:0;font-size:11px;padding:7px 3px;letter-spacing:0;border-radius:4px}.hud-actions #speed{min-width:44px;padding:3px;font-size:8px;line-height:1.15}
 .small-actions{grid-column:1/-1;grid-row:2;justify-content:center;margin-top:2px;gap:24px}.small-actions button{min-height:26px;padding:3px 8px;font-size:10px}
 .status-ribbon{bottom:calc(100% + 9px);max-width:94%;width:max-content;font-size:10px;padding:5px 10px;gap:6px;line-height:1.3}.status-ribbon>span:first-child{font-size:15px}
 .bubble{display:none}.customer-bubble{display:block;left:10px;right:auto;bottom:calc(var(--dock-space) + 34px);top:auto;max-width:49%;width:180px;font-size:10px;line-height:1.3;padding:7px 9px;transform:rotate(-2deg)}
}
@media(min-width:510px) and (max-width:760px){.order-card{max-width:560px;margin:auto}.scene-fill{width:174px}.scene-fill>strong{font-size:44px}.ingredients{grid-template-columns:4fr 5fr;gap:12px}.ingredients .ingredient,#mixes .ingredient:last-child{min-height:67px;flex-direction:column;font-size:10px}.ingredients #mixes .ingredient{min-height:67px}.ingredients .ingredient-name{text-align:center}.ingredients #mixes .ingredient-name small{display:block;margin-left:0}.finish-card{grid-template-columns:1fr 1fr auto;gap:10px}.small-actions{grid-column:3;grid-row:1;gap:5px;flex-direction:column}.small-actions button{font-size:9px;min-height:23px;padding:2px 4px}.section-title p{display:none}}
@media(max-width:370px){.brand{font-size:21px}.world-tools>button{font-size:9px;padding:6px}.order-card{left:6px;right:6px;padding:7px 6px}.customer-heading h2{font-size:16px}.diagram-wrap{display:none}#orderSteps{gap:3px}#orderSteps li>span{font-size:10px}.ingredients{padding:8px 7px}.ingredients .ingredient-icon{font-size:19px}.ingredients .ingredient{font-size:9px}.ingredients #mixes .ingredient-name small{display:block;margin:1px 0 0}.ingredients #mixes .ingredient{min-height:57px}.ingredients .options{gap:5px}.scene-fill{width:140px}.scene-fill>strong{font-size:35px}}
@media(max-height:740px) and (min-width:761px){:root{--dock-space:183px}.game-topbar{top:9px}.order-card{top:78px;padding:9px;width:260px;max-height:calc(100% - 270px)}#customerNote{display:none}.recipe-copy h3{display:none}#orderSteps{gap:4px}#orderSteps li{padding-top:4px;padding-bottom:4px}#orderSteps .current{padding-top:3px;padding-bottom:3px}.order-score{margin-top:7px;padding-top:6px}.scene-fill{top:80px}.play-dock{bottom:12px}.ingredients{padding-top:10px;padding-bottom:11px}.ingredients .ingredient,#mixes .ingredient:last-child{min-height:76px}.finish-card{padding-top:8px;padding-bottom:6px}}
@media(max-height:740px) and (max-width:760px){#sceneWrap{min-height:650px}.order-card{top:96px}.customer-heading h2{font-size:15px}.customer-avatar{width:25px;height:25px;font-size:18px}.customer-heading .eyebrow{font-size:6px}.paper-fold{min-height:29px}.order-recipe{margin-top:4px}#orderSteps li>span{min-height:28px;font-size:9px;margin-top:17px}#orderSteps .step-amount{min-height:16px;font-size:7px}.order-score{margin-top:4px;padding-top:3px}.diagram-wrap small{display:none}#orderDiagram{height:75px}.scene-fill{width:135px;top:calc(var(--recipe-bottom) + 8px);padding:7px 8px}.scene-fill>strong{font-size:33px}.scene-fill>#stepHint{font-size:8px}.scene-fill .fill-signal{font-size:7px}.scene-fill>#sceneOverflow{font-size:7px}.fill-kicker{font-size:7px}}
@media(prefers-reduced-motion:reduce){button{transition:none}.scene-fill[data-fill-stage=yellow] .fill-signal i{animation:none}}
/* Fit all seven characters of 100.00% without making the warning card jump. */
.scene-fill{container-type:inline-size}.scene-fill>strong{font-size:clamp(28px,24cqi,64px);letter-spacing:-.045em;white-space:nowrap}

/* Strawberry milk is a carton; strawberry topping remains a whole fruit. */
.ingredient-icon img,.layer-label img,#pouringIcon img{display:block;width:1.15em;height:1.15em;object-fit:contain}

/* Game gestures must not invoke Safari text selection or image previews. */
#sceneWrap,#sceneWrap *{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
#sceneWrap{touch-action:manipulation}
#sceneWrap img{-webkit-user-drag:none;pointer-events:none}