/* More varied mechanics for later APA rooms. */
.mini-shell{max-width:1080px}.mini-title{margin:16px auto 20px;text-align:center;max-width:760px}.mini-title h2{font:700 clamp(1.5rem,3vw,2.25rem) Georgia,serif;margin:0 0 8px;color:#ffe0a5}.mini-title p{margin:4px auto 8px;color:#d8d8d3}.mini-progress{display:inline-block;margin-top:4px;color:#d4c6ad;font-size:.87rem}.mini-status{min-height:24px;margin:13px 0 0;font-size:.95rem;color:#f4cc84}.mini-paper-workshop{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px;align-items:start}.mini-paper-sheet,.mini-paper-live,.mini-investigation-paper{background:#f7f3e9;color:#26313a;box-shadow:0 15px 28px #05080c91;padding:32px;border:1px solid #d5cdbd;min-height:420px;position:relative}.mini-paper-sheet{padding-top:108px;text-align:center}.mini-page-no{position:absolute;right:24px;top:15px;color:#27333f}.mini-panel{padding:22px;background:#292d39;border:2px solid #6e695e;border-radius:12px}.mini-panel h3{margin-top:0}.mini-piece-pool{display:flex;gap:8px;flex-wrap:wrap;margin:17px 0 23px}.mini-piece{border:2px solid #b7a77e;border-radius:7px;background:#ddcda9;color:#232a30;padding:9px 11px;font-size:.93rem;box-shadow:0 3px 0 #594a35}.mini-piece:hover{background:#f2dfb4}.mini-assembled{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:7px;min-height:105px;padding:12px;border:2px dashed #9c876b;border-radius:7px}.mini-paper-sheet .mini-assembled{display:flex;flex-direction:column}.mini-placed{border:1px solid #7f9f9a;background:#e5f4e8;color:#253937;border-radius:5px;padding:7px 10px;font-size:.94rem}.mini-placeholder{font-style:italic;color:#958f83}.mini-paper-live{font-size:14px;min-height:400px;transition:padding .2s ease}.mini-levers{display:flex;flex-direction:column;gap:10px}.mini-control{display:flex;gap:10px;align-items:center;justify-content:space-between;flex-wrap:wrap}.mini-control>strong{font-size:.9rem}.mini-control>div{display:flex;gap:6px;flex-wrap:wrap}.mini-control button,.mini-tool-row button{border:1px solid #847d6f;background:#464a50;color:#ebdfc8;border-radius:7px;padding:7px 9px;font-size:.83rem}.mini-control button.on,.mini-tool-row button.on{border-color:#edcc88;background:#7c643d;color:#fff3c8}.mini-conveyor,.mini-forge{margin:14px auto 25px;padding:24px;background:repeating-linear-gradient(0deg,#282e37 0 24px,#2e3540 25px 48px);border:3px solid #897252;border-radius:14px;max-width:920px}.mini-parcel{margin:0 auto 18px;padding:14px 18px;border:2px solid #d4b67c;background:#eadfbe;color:#2e342f;border-radius:9px;text-align:center;max-width:680px}.mini-belt{background:repeating-linear-gradient(90deg,#35454a 0 22px,#28373b 23px 40px);border-radius:10px;padding:20px 12px;margin-bottom:12px;box-shadow:inset 0 7px 14px #101519}.mini-belt .mini-placed{background:#f7e6bf}.mini-operating-table{border:3px solid #8c6c61;border-radius:14px;background:linear-gradient(145deg,#273640,#192632);padding:24px;margin:15px auto 25px;max-width:900px;text-align:center}.mini-heartbeat{font-size:3rem;letter-spacing:.25em;color:#8dd6bc;margin-bottom:12px}.mini-quote-strips{display:grid;gap:10px;margin-bottom:24px}.mini-strip{border:3px solid #b9d2c7;border-radius:10px;background:#e9f0e8;padding:16px;color:#263835;text-align:left;font:1.05rem/1.5 Georgia,serif}.mini-strip.selected{border-color:#e9b963;background:#f0d7a6}.mini-harbor{border:3px solid #536c7b;border-radius:14px;background:linear-gradient(#273b4f,#193244);padding:22px}.mini-crates{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;max-height:340px;overflow:auto;padding:6px;background:repeating-linear-gradient(35deg,#3a433f 0 40px,#303b37 41px 77px)}.mini-crate{border:3px solid #8e6940;border-radius:9px;background:#bfa175;color:#2a2b27;padding:12px;min-height:95px;font-size:.87rem;text-align:left}.mini-crate.selected{outline:3px solid #ffe79c}.mini-docks{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px;margin:18px auto 6px}.mini-dock{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;min-height:99px;background:#3b5364;color:#ecf4ed;border:3px dashed #a9d0b0;border-radius:9px}.mini-dock:hover{background:#607b7a}.mini-dock span{font-size:.8rem}.mini-forge-line{min-height:115px;border:4px solid #84735c;border-radius:9px;background:#f0e6d2;color:#25303c;padding:13px}.mini-reference-preview{background:#f9f6eb;color:#26313c;padding:35px 44px;min-height:170px;line-height:1.2;text-align:left;font:1.05rem/1.4 Georgia,serif;margin-bottom:18px}.mini-reference-preview.double{line-height:2.1}.mini-reference-preview.hanging{padding-left:65px;text-indent:-30px}.mini-reference-part{display:inline;border:0;color:inherit;background:transparent;padding:2px 3px;font:inherit;cursor:pointer;text-align:left}.mini-reference-part:hover{background:#f0d8a3}.mini-reference-part.italic{font-style:italic;background:#d4edc6}.mini-tool-row{display:flex;gap:12px;flex-wrap:wrap;margin:12px 0 18px}.mini-investigation{padding:22px;background:#232e37;border:3px solid #736b62;border-radius:13px;max-width:900px;margin:10px auto 26px}.mini-magnifier{font-size:3rem;color:#e8cd90}.mini-investigation-paper{min-height:260px;margin-bottom:17px;line-height:2.1}.mini-file-label{display:block;border-bottom:1px solid #bbb4a6;margin-bottom:16px;text-align:right;color:#68655c;font-size:.77rem;text-transform:uppercase}.mini-inspection-fragments{display:block;font:1.18rem/2.2 Georgia,serif}.mini-inspect-fragment{border:0;background:transparent;color:inherit;font:inherit;padding:2px 3px;cursor:crosshair}.mini-inspect-fragment:hover{background:#f0df9d}.mini-inspect-fragment.fixed{background:#d8efcf}.mini-complete{text-align:center;padding:65px 10px;background:#283c34;border:3px solid #74a585;border-radius:15px}.mini-complete-seal{font-size:6rem;color:#d0e7a9}.mini-complete h2{font-family:Georgia,serif;font-size:2rem}
/* The case workshop is an actual printer with physical sheets and bins. */
.case-press{position:relative;margin-top:15px;padding:20px 22px 24px;border:3px solid #746654;border-radius:17px;background:linear-gradient(135deg,#2b303a,#1b232e)}.case-press-header{display:flex;align-items:center;gap:18px;padding:10px 12px;background:#363e4a;border-radius:9px}.case-press-title{font:700 1.35rem Georgia,serif;color:#f3dfb5}.case-pages-printed{margin-left:auto;font-size:.82rem;color:#cbe6d9}.case-press-rollers{display:flex;gap:3px}.case-press-rollers span{width:24px;height:24px;border:5px solid #9c907c;border-radius:50%;background:#20252c;box-shadow:inset 0 0 0 2px #3f4e55;animation:pressRotate 1.9s linear infinite}@keyframes pressRotate{to{transform:rotate(360deg)}}.case-press-prompt{text-align:center;font-size:.95rem;margin:15px 0}.case-press-layout{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(0,.75fr);gap:20px}.case-press-feed{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;max-height:420px;overflow:auto;padding:12px;background:repeating-linear-gradient(90deg,#3a424a 0 12px,#596068 13px 15px,#343c42 16px 29px);border:5px solid #817a70;border-radius:10px}.case-plate{padding:12px;border:2px solid #d6ceb9;border-radius:4px;background:#f5ecd8;color:#28343b;box-shadow:2px 3px 0 #0004;font:1rem/1.5 Georgia,serif;min-height:70px}.case-plate.selected{border:3px solid #ffbc5e;transform:rotate(-2deg)}.case-press-trays{display:flex;flex-direction:column;gap:15px;justify-content:center}.case-press-tray{min-height:130px;display:flex;flex-direction:column;justify-content:space-between;align-items:center;gap:10px;background:linear-gradient(#55655e,#304841);border:11px ridge #8ca796;color:#eef8e9;border-radius:12px;padding:16px}.case-press-tray strong{font:700 1.22rem Georgia,serif}.case-stacked-pages{color:#cfe3d5;font-size:.84rem}.case-press-tray:hover{background:#668373}.case-status{color:#f6db9a;min-height:24px}.case-jam{position:absolute;inset:0;z-index:10;background:#15212be8;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:20px}.case-jam h2{font:700 2.3rem Georgia,serif;color:#ffc37e}.case-jam p{max-width:500px}
/* Lateral gateways, correctly facing the travelling adventurer. */
.hall-door .door-frame{width:83px;height:204px;margin:0 auto;border:10px solid #736457;border-left:20px solid #9c8362;border-radius:10px 28px 8px 7px;transform:skewY(-5deg) perspective(480px) rotateY(-25deg);transform-origin:left center;overflow:hidden}.hall-door .door-interior{background:linear-gradient(90deg,#161a22 0%,#503e39 28%,#bd9b60 78%,#29202a 100%)}.hall-door.unlocked .door-interior{background:linear-gradient(90deg,#222634,#79553a 29%,#f0c785 78%,#38262b)}.hall-door.locked .door-interior{background:linear-gradient(90deg,#151a25,#302e37)}.hall-door .door-glyph{font-size:2.2rem}.hall-door .door-number{height:10px}.hall-door{bottom:62px}.hall-door .door-status{display:none}.corridor-profile{width:83px;transform-origin:center bottom}.corridor-profile .adventurer{transform:scaleX(1)}.corridor-profile.facing-left .adventurer{transform:scaleX(-1)}.corridor-profile.entering-side-door{transition:transform .42s ease-in,opacity .42s ease-in;transform:translateX(-50%) scale(.23);opacity:0}.hallway-topline{justify-content:flex-start}.hallway-world .door-name{margin-top:10px}.battle-hero .adventurer{transform:scaleX(1)}
.battle-hero.hurt:after{content:"";position:absolute;z-index:8;left:42px;bottom:72px;width:15px;height:22px;background:radial-gradient(ellipse at 40% 25%,#b22c37 0 30%,transparent 34%),radial-gradient(ellipse at 80% 70%,#9d1d2c 0 18%,transparent 23%);pointer-events:none}.battle-hero.hit-flash{animation:heroHurt .45s ease-out}@keyframes heroHurt{0%,100%{filter:none}35%{filter:drop-shadow(0 0 17px #c51f33)}}
.underwater-overlay{position:absolute;inset:0;z-index:10;background:#08192be6;display:grid;place-items:center;padding:20px}.underwater-dialog{background:linear-gradient(#294a59,#1c313d);border:3px solid #89bec4;border-radius:15px;max-width:540px;padding:22px;text-align:center;color:#f5f1df;box-shadow:0 20px 38px #071721}.underwater-dialog h2{font:700 1.6rem Georgia,serif}.underwater-dialog p{line-height:1.6}.underwater-room{position:relative}.eaten-scene{position:relative;height:315px;overflow:hidden;border:3px solid #56667c;border-radius:13px;background:linear-gradient(#29586a,#1c4b59 43%,#0c263a)}.eaten-scene .crocodile{z-index:4;bottom:15px;animation:crocsBite 1.3s infinite alternate}.eaten-scene .croc-one{left:19%}.eaten-scene .croc-two{right:19%}.sinking-silhouette{position:absolute;left:50%;top:2px;z-index:3;width:90px;height:135px;animation:finalSink 2.6s ease-in forwards}.sinking-silhouette .side-adventurer{left:50%;top:0}.eaten-splash{position:absolute;inset:0;z-index:5;pointer-events:none;background:radial-gradient(ellipse at 50% 60%,#a3e4e654,transparent 35%);animation:splashFade 2.7s ease-out both}@keyframes finalSink{to{transform:translateY(250px) rotate(35deg);opacity:0}}@keyframes crocsBite{to{transform:translateX(12px) translateY(-19px)}}@keyframes splashFade{to{opacity:0}}
@media(max-width:700px){.mini-paper-workshop,.case-press-layout{grid-template-columns:1fr}.mini-crates{grid-template-columns:repeat(2,minmax(0,1fr))}.mini-docks{grid-template-columns:repeat(2,minmax(0,1fr))}.case-press-feed{grid-template-columns:repeat(2,minmax(0,1fr))}.mini-paper-sheet,.mini-paper-live{min-height:250px}.mini-paper-sheet{padding-top:55px}}
@media(max-width:440px){.mini-crates,.case-press-feed{grid-template-columns:1fr}.case-press{padding:9px}.mini-conveyor,.mini-forge{padding:12px}.mini-control{align-items:flex-start}.mini-control>div{width:100%}}
@media(prefers-reduced-motion:reduce){.case-press-rollers span,.battle-hero.hit-flash,.eaten-scene .crocodile,.sinking-silhouette{animation:none}}
/* Uncluttered bridge heading and optional account save control. */
.bridge-banner{font:700 clamp(1.2rem,2.8vw,1.7rem) Georgia,serif;color:#f3d6a3;text-align:center;margin:16px 0 0}
.corridor-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;max-width:1030px;margin:0 auto;padding:24px 18px 16px}
.corridor-heading p{margin:0;max-width:560px}
.auth-ui{display:flex;flex-wrap:wrap;gap:9px;align-items:center;justify-content:flex-end}
.auth-button{border:1px solid #938970;border-radius:8px;padding:8px 12px;background:#292f3c;color:#f1e1c0;font-size:.85rem}
.auth-button:hover{background:#404a54}
.auth-status{font-size:.77rem;color:#c1c8c2;max-width:290px}
@media(max-width:680px){.corridor-heading{justify-content:center;text-align:center}.auth-ui{justify-content:center}}


/* The Monster Café: an animated dungeon restaurant rather than a static quiz. */
.case-restaurant-room{max-width:1060px}
.case-restaurant-room .room-header{justify-content:flex-end;margin-bottom:10px}
.cafe-lesson-scene,.monster-cafe,.monster-grill,.cafe-finished{position:relative;overflow:hidden;border-radius:18px;border:4px solid #6f513e;box-shadow:0 16px 34px #05060a8a;background:#2f2633;color:#f9e7cf}
.cafe-lesson-scene{min-height:500px;padding:24px;background:repeating-linear-gradient(90deg,#342936 0 76px,#3b2c36 77px 80px),linear-gradient(#3d2830,#261e29)}
.cafe-sign{width:min(480px,90%);margin:0 auto;padding:12px 28px 9px;border:7px double #c79b5c;border-radius:16px;background:linear-gradient(135deg,#552e37,#2b2332);font:900 clamp(1.2rem,3.5vw,2.25rem)/1.15 Georgia,serif;letter-spacing:.07em;text-align:center;color:#ffd79d;text-shadow:0 2px 3px #1d141d,0 0 18px #e9895e88;box-shadow:0 0 19px #fdbd6744,inset 0 0 12px #ca8d4b55}
.cafe-sign small{display:block;margin-top:7px;font:550 .69rem system-ui,sans-serif;letter-spacing:.06em;color:#e4ccba}
.cafe-lesson-monster{position:absolute;left:-52px;bottom:4px;width:195px;max-width:32%;opacity:.82;transform:rotate(-9deg)}
.cafe-lesson-card{position:relative;z-index:2;margin:22px 4% 22px 12%;padding:24px 26px 20px;background:#1d2435ed;border:2px solid #957b61;border-radius:15px;box-shadow:0 14px 27px #04050984}
.cafe-lesson-card h2{text-align:center;margin:0 0 17px;font:700 clamp(1.3rem,3vw,1.7rem) Georgia,serif}
.cafe-lesson-card .case-examples{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px;margin-bottom:12px}
.cafe-lesson-card .case-examples>div{padding:18px;background:#354050;border:2px solid #7a7771;border-radius:12px}
.cafe-lesson-card .case-examples h3{color:#ffe3a8;margin:0 0 10px}
.cafe-lesson-card .case-examples p{min-height:108px;margin:0 0 10px;line-height:1.5}
.cafe-lesson-card .case-example{font-size:1.08rem;background:#efe5cb;color:#332c2b;padding:10px 12px;border-radius:8px}
.cafe-lesson-card>p{margin:15px 0;color:#e9d4c9}
.cafe-start{display:block;min-width:190px;margin:12px auto 0}
.monster-cafe{background:#29202d}
.cafe-scene{position:relative;height:460px;overflow:hidden;background:repeating-linear-gradient(90deg,#3b2e39 0 77px,#503645 78px 80px),linear-gradient(#463344,#281f30)}
.cafe-scene:before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 17% 22%,#ffce7452,transparent 42%),radial-gradient(ellipse at 84% 19%,#fca15e2b,transparent 40%);pointer-events:none}
.cafe-beam{position:absolute;left:0;right:0;top:0;height:24px;background:repeating-linear-gradient(90deg,#51382e 0 34px,#624939 35px 65px);border-bottom:6px solid #201e2b;box-shadow:0 7px 20px #18101888}
.cafe-hanging-lamp{position:absolute;z-index:1;top:12px;left:17%;width:60px;height:72px;border-top:36px solid transparent;border-left:12px solid transparent;border-right:12px solid transparent;filter:drop-shadow(0 0 12px #ffb85e77)}
.cafe-hanging-lamp:before{content:"";position:absolute;left:8px;right:8px;top:-34px;height:31px;border-left:4px solid #aba299;border-right:4px solid #aba299;background:linear-gradient(#856a55,#3d3231);clip-path:polygon(45% 0,55% 0,63% 75%,100% 100%,0 100%,37% 75%)}
.cafe-hanging-lamp:after{content:"";position:absolute;left:-24px;top:-10px;width:75px;height:24px;border-radius:0 0 50% 50%;background:#ffcd79;box-shadow:0 0 30px #ffcb6a9b,0 4px 30px #fcab6177}
.cafe-hanging-lamp.lamp-two{left:75%}
.cafe-neon{position:absolute;z-index:2;left:35%;top:21px;padding:10px 16px;border:4px solid #dfac70;border-radius:13px;background:#281e36;color:#ffe1a0;box-shadow:0 0 18px #f4a25466;font:800 clamp(.95rem,2.5vw,1.65rem) Georgia,serif;letter-spacing:.09em;white-space:nowrap;text-align:center;animation:cafeNeon 4s ease-in-out infinite alternate}
.cafe-neon span{display:block;font:700 .56rem system-ui,sans-serif;letter-spacing:.35em;color:#a9eabe}
@keyframes cafeNeon{to{box-shadow:0 0 30px #f8b963aa;color:#fff4c6}}
.cafe-menu-board{position:absolute;z-index:2;right:16px;top:92px;width:155px;max-width:18%;padding:9px 6px;border:6px ridge #a58158;border-radius:5px;background:#293d34;text-align:center;color:#f6e5b9;transform:rotate(2deg);box-shadow:0 7px 14px #10141b90}
.cafe-menu-board span{font:800 .65rem system-ui;letter-spacing:.04em;display:block;border-bottom:1px solid #b4b99e;padding-bottom:5px}
.cafe-menu-board small{display:block;font:.67rem Georgia,serif;margin-top:6px}
.cafe-monster-wrap{position:absolute;left:5.5%;bottom:61px;width:265px;height:265px;z-index:4;animation:monsterIdle 2.6s ease-in-out infinite alternate;transform-origin:center bottom}
.cafe-monster-art{display:block;width:100%;height:100%;overflow:visible;filter:drop-shadow(0 12px 7px #17101fa3)}
.cafe-monster-arm{transform-origin:75% 65%;animation:monsterWave 1.6s ease-in-out infinite alternate}
.cafe-eyes{transform-box:fill-box;transform-origin:center;animation:monsterBlink 5.7s ease-in-out infinite}
@keyframes monsterIdle{from{transform:translateY(6px) rotate(-2deg)}to{transform:translateY(-5px) rotate(2deg)}}
@keyframes monsterWave{to{transform:rotate(-7deg)}}
@keyframes monsterBlink{0%,92%,96%,100%{transform:scaleY(1)}94%{transform:scaleY(.1)}}
.cafe-order-bubble{position:absolute;z-index:5;top:116px;left:36%;right:15%;min-height:132px;padding:14px 18px 16px;border:5px solid #f9e5c8;border-radius:20px;background:#fbecd5;color:#2e2931;box-shadow:0 14px 14px #17101e6b;transform:rotate(1deg)}
.cafe-order-bubble:after{content:"";position:absolute;bottom:-24px;left:17%;border-width:24px 21px 0 4px;border-style:solid;border-color:#fbecd5 transparent transparent transparent}
.cafe-request{display:inline-block;color:#5f224a;font-size:.79rem;font-weight:900;letter-spacing:.09em;background:#eecbaf;padding:4px 9px;border-radius:4px}
.cafe-order-bubble p{margin:8px 0 4px;font:700 clamp(1.2rem,3vw,1.65rem)/1.3 Georgia,serif;overflow-wrap:anywhere}
.cafe-order-bubble small{color:#625654;font-size:.82rem}
.cafe-counter{position:absolute;z-index:6;left:0;right:0;bottom:0;height:92px;background:linear-gradient(#d1a474 0 13px,#6a413e 14px 60px,#462d36 61px);border-top:8px solid #f1cc93;box-shadow:0 -11px 18px #160d1a55}
.cafe-counter-shine{height:6px;background:linear-gradient(90deg,transparent,#f4dda7b4,transparent);opacity:.8}
.cafe-counter-stripe{position:absolute;bottom:14px;left:0;right:0;height:8px;background:repeating-linear-gradient(90deg,#aa8157 0 34px,#543c37 34px 42px)}
.cafe-serving-window{position:absolute;right:28%;top:-59px;width:180px;height:80px;z-index:7;transition:transform .7s ease,opacity .7s ease;display:grid;place-items:end center}
.cafe-serving-window.is-serving{transform:translateX(-130px) translateY(-45px) scale(.48);opacity:.12}
.cafe-cloche{position:relative;display:block;width:139px;height:63px}
.cloche-knob{position:absolute;top:0;left:65px;width:14px;height:12px;background:#fff8bd;border:3px solid #aa8c54;border-radius:50%}
.cloche-dome{position:absolute;left:6px;right:6px;top:9px;height:46px;border:4px solid #d1c99b;background:linear-gradient(130deg,#f6f4ce 0 22%,#a39b87 35%,#f4e7b4 54%,#848777 90%);border-radius:95px 95px 10px 10px}
.cloche-base{position:absolute;left:0;bottom:4px;width:139px;height:10px;border-radius:50%;background:#e0c99b;border:3px solid #aea17e}
.monster-eating .cafe-monster-art{animation:monsterChomp .24s ease-in-out 3}
@keyframes monsterChomp{50%{transform:scale(1.07) rotate(-3deg)}}
.cafe-food-sparkles{position:absolute;z-index:7;right:24%;bottom:93px;color:#ffe0a5;font-size:1.8rem;pointer-events:none;animation:foodSparkle 1.5s ease-in-out infinite alternate}
@keyframes foodSparkle{to{opacity:.25;transform:translateY(-14px)}}
.cafe-service-panel{position:relative;z-index:6;padding:16px 25px 24px;border-top:6px ridge #a68468;background:linear-gradient(#232d39,#1f2534)}
.cafe-service-heading{display:flex;justify-content:space-between;gap:12px;align-items:center;color:#f9ddb3;font-weight:750;margin:1px 0 8px}
.cafe-error-note{font-size:.78rem;color:#e8b3a8;font-weight:500}
.cafe-serve-controls{display:flex;gap:12px;align-items:stretch}
.cafe-serve-controls input{flex:1;min-width:0;min-height:53px;padding:10px 13px;font-size:1.17rem;border:3px solid #bfa986;border-radius:9px;background:#fff8e8;color:#29313c}
.cafe-serve-controls button{min-width:141px}
.cafe-feedback{min-height:29px;color:#ffda99;margin:11px 0 5px;font-size:.9rem}
.cafe-served-plates{display:flex;justify-content:center;gap:14px;flex-wrap:wrap;margin:8px auto 0}
.cafe-plate-progress{position:relative;display:block;width:32px;height:15px;border:3px solid #8e8581;border-radius:50%;background:#494b52;box-shadow:0 2px 0 #151824}
.cafe-plate-progress.finished{border-color:#ead39c;background:radial-gradient(circle,#effbd3 0 36%,#a6c4a6 38% 62%,#f0dfb9 64%)}
.cafe-visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.cafe-finished{text-align:center;padding:40px 25px;background:radial-gradient(circle at center,#6b4442,#30212f)}
.cafe-finished .cafe-sign{max-width:390px}.cafe-celebrate-monster{width:190px;height:170px;margin:16px auto;overflow:hidden}.cafe-celebrate-monster .cafe-monster-art{height:205px}
.cafe-finished h2{font:700 1.55rem Georgia,serif;color:#ffe7bb}
/* Moving grill belt and draggable burgers. */
.monster-grill{background:#1c222c;padding-bottom:24px}
.grill-header{display:flex;gap:14px;justify-content:space-between;align-items:center;flex-wrap:wrap;padding:16px 22px;border-bottom:6px solid #a75d3f;background:linear-gradient(#5c3032,#3a262c);color:#ffe8b8}
.grill-header strong{font:900 clamp(1.1rem,3vw,1.45rem) Georgia,serif;letter-spacing:.08em}.grill-header span{font-size:.78rem;color:#f8ddbb}
.grill-scene{height:360px;position:relative;overflow:hidden;background:repeating-linear-gradient(0deg,#454951 0 59px,#58565b 60px 64px),linear-gradient(#565660,#252a36)}
.grill-hood{position:absolute;left:24%;right:24%;top:0;height:96px;border:7px solid #979596;border-top:none;border-radius:0 0 40px 40px;background:linear-gradient(#c5c4bf,#747c85 40%,#444955 75%);display:flex;justify-content:space-evenly;align-items:flex-end;padding:10px;box-shadow:0 8px 18px #1820298a;z-index:2}
.grill-vent{width:18%;height:13px;border-radius:3px;background:#333a44;box-shadow:0 -3px 0 #5b636a}
.grill-flames{position:absolute;z-index:2;left:7%;right:7%;top:100px;height:74px;display:flex;justify-content:space-around;align-items:end;pointer-events:none}
.grill-flames i{width:54px;height:59px;background:linear-gradient(#ffdc65,#f38443,#cd343c);clip-path:polygon(50% 0,68% 33%,84% 20%,94% 57%,75% 100%,32% 100%,3% 59%,23% 34%,27% 68%);transform-origin:bottom;filter:drop-shadow(0 0 8px #ffae4a);animation:grillFlame .7s ease-in-out infinite alternate}
.grill-flames i:nth-child(2n){animation-delay:-.3s;height:43px}.grill-flames i:nth-child(3n){animation-delay:-.55s;height:65px}
@keyframes grillFlame{from{transform:scaleY(.78) skewX(-8deg);opacity:.8}to{transform:scaleY(1.18) skewX(9deg);opacity:1}}
.grill-conveyor{position:absolute;z-index:4;left:4%;right:4%;top:167px;height:137px;overflow:hidden;border:10px solid #262e38;border-radius:18px;background:#39414d;box-shadow:0 14px 17px #1c1f2aa9,inset 0 -18px 0 #131820}
.grill-belt-track{position:absolute;inset:8px 0 5px;background:repeating-linear-gradient(90deg,#69717a 0 28px,#444e5a 29px 35px,#73818a 36px 64px);animation:grillBelt .85s linear infinite}
@keyframes grillBelt{to{background-position:-65px 0}}
.grill-roller{position:absolute;z-index:2;bottom:0;width:27px;height:27px;border-radius:50%;border:5px solid #969fa6;background:#283540;animation:grillRoll 1s linear infinite}
.roller-left{left:1%}.roller-right{right:1%}
@keyframes grillRoll{to{transform:rotate(360deg)}}
.burger-on-belt{position:absolute;z-index:6;top:2px;left:0;width:192px;height:103px;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:0 4px;border:0;background:transparent;color:#202531;cursor:grab;animation:burgerTravel 14s linear infinite;touch-action:manipulation}
.burger-on-belt:focus-visible,.burger-on-belt.selected{outline:4px solid #ffe28e;outline-offset:-2px;border-radius:10px;background:#fbd8903f}
.burger-on-belt:active{cursor:grabbing}
@keyframes burgerTravel{from{left:100%}to{left:-22%}}
.burger-stack{position:relative;display:block;width:86px;height:47px;filter:drop-shadow(0 6px 2px #16192371)}
.burger-stack i{display:block;position:absolute;left:0;right:0}
.burger-top{top:0;height:22px;border:2px solid #b26e30;border-radius:48px 48px 9px 9px;background:radial-gradient(circle at 27% 45%,#fff1ba 0 2px,transparent 3px),radial-gradient(circle at 67% 35%,#fff1ba 0 2px,transparent 3px),linear-gradient(#f2c273,#d38b43)}
.burger-lettuce{top:21px;height:7px;border-radius:40%;background:#75b84f;clip-path:polygon(0 20%,12% 65%,30% 20%,45% 80%,60% 20%,77% 70%,100% 20%,100% 100%,0 100%)}
.burger-patty{top:29px;height:11px;background:#65392f;border:2px solid #402821;border-radius:9px}
.burger-cheese{top:35px;height:5px;background:#f3ce56}
.burger-bottom{top:40px;height:9px;border:2px solid #bd8444;border-radius:2px 2px 10px 10px;background:#dca35b}
.burger-title{position:relative;display:block;max-width:180px;min-height:40px;margin-top:5px;padding:3px 6px;border:2px solid #ccaa7e;border-radius:5px;background:#f5e8cb;font:750 .77rem/1.17 Georgia,serif;color:#28252b;text-align:center;overflow-wrap:anywhere;box-shadow:0 3px 0 #36282b}
.grill-counter-front{position:absolute;z-index:3;bottom:0;left:0;right:0;height:68px;background:linear-gradient(#605052,#3a2e35);border-top:14px solid #876f68}
.grill-instructions{text-align:center;padding:0 20px;margin:20px 0;font-size:1rem;color:#f0e2d1}
.grill-bins{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin:0 auto;max-width:760px;padding:0 20px}
.grill-bin{position:relative;min-height:110px;overflow:hidden;border:7px solid #8b7973;border-radius:13px 13px 35px 35px;background:linear-gradient(#3e5a59,#24434a);color:#f9e4b5;text-align:center;box-shadow:inset 0 -18px #102932,0 7px 15px #080c1499;cursor:pointer}
.grill-bin:hover,.grill-bin:focus-visible{background:#54736d;box-shadow:inset 0 -18px #173638,0 0 16px #e8be724f}
.bin-lid{display:block;font:800 1.2rem Georgia,serif;margin-top:10px}.bin-tray{display:block;margin:8px;font-size:.86rem;color:#c6dfd8}
.grill-message{text-align:center;min-height:28px;margin:15px auto 0;color:#ffe0a5;font-size:.95rem}
@media(max-width:760px){
  .cafe-lesson-card{margin:22px 0 0;padding:20px 14px}.cafe-lesson-monster{opacity:.28}
  .cafe-lesson-card .case-examples{grid-template-columns:1fr}.cafe-lesson-card .case-examples p{min-height:0}
  .cafe-scene{height:440px}.cafe-monster-wrap{left:0;bottom:55px;width:210px;height:210px}
  .cafe-order-bubble{left:28%;right:5%;top:108px;padding:12px 12px}.cafe-menu-board{display:none}
  .cafe-neon{left:37%;font-size:1rem}.cafe-serving-window{right:16%}
  .grill-hood{left:16%;right:16%}.burger-on-belt{width:165px}.burger-title{max-width:162px;font-size:.69rem}
}
@media(max-width:480px){
  .cafe-scene{height:425px}.cafe-order-bubble{top:115px;left:31%;right:3%;min-height:146px}
  .cafe-order-bubble p{font-size:1.14rem}.cafe-monster-wrap{left:-32px;width:190px;height:190px}
  .cafe-neon{left:31%;top:28px}.cafe-serving-window{right:5%}
  .cafe-service-panel{padding:13px}.cafe-service-heading{display:block}.cafe-serve-controls{flex-direction:column}
  .cafe-served-plates{gap:7px}.cafe-plate-progress{width:24px}
  .grill-header{justify-content:center}.grill-scene{height:335px}.grill-conveyor{top:159px;left:2%;right:2%}
  .grill-bins{gap:10px;padding:0 11px}.bin-lid{font-size:1.04rem}
}
@media(prefers-reduced-motion:reduce){.cafe-monster-wrap,.cafe-monster-arm,.cafe-eyes,.monster-eating .cafe-monster-art,.cafe-neon,.cafe-food-sparkles,.grill-flames i,.grill-roller,.grill-belt-track,.burger-on-belt{animation-duration:.01ms;animation-iteration-count:1}}

/* Narrow screens show one readable burger moving along the belt at a time. */
@media(max-width:680px){
  .grill-conveyor .burger-on-belt:not(:first-of-type){display:none}
  .grill-conveyor .burger-on-belt{width:165px;animation:burgerMobileTrack 8s linear infinite!important}
}
@keyframes burgerMobileTrack{from{left:calc(100% - 174px)}to{left:8px}}
