/* Только сцена кафе. Общие цвета и управление наследуются от оболочки. */
.cover-cafe{width:100%;height:100%;max-height:none!important;object-fit:cover;object-position:65% center;border-radius:18px}
.arena.scene-cafe{padding:0;isolation:isolate;border:0;background:#e8cf9f;box-shadow:none}
.scene-cafe>.task-area{z-index:5;top:12px;background:#fffdf2ef;border:1px solid #fff7dd;padding:7px 20px;max-width:94%;border-radius:14px;box-shadow:0 2px 10px #51371515}
.cafe-world{position:relative;width:100%;height:100%;min-width:0;min-height:0;overflow:hidden;border-radius:inherit}
.cafe-background{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:right 40%;pointer-events:none;user-select:none}
.cafe-guest-note{position:absolute;top:22%;left:4%;width:54%;padding:8px 12px;background:#fffdf3f2;color:#3f5348;border:1px solid #fff8d5;border-radius:12px;font-size:clamp(.8rem,1.4vw,1rem);text-align:center;line-height:1.3;box-shadow:0 3px 10px #5b3c2120;min-height:0}
.cafe-guest-note:empty{display:none}
.cafe-guest-note{width:max-content;max-width:60%}
.cafe-counter-items{position:absolute;left:6%;right:6%;top:43%;bottom:16%;display:grid;grid-template-columns:repeat(var(--cafe-columns,4),minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));gap:4px 22px;align-items:center;justify-items:center}
.cafe-food{position:relative;display:grid;place-items:center;width:100%;height:100%;max-width:155px;min-width:40px;min-height:38px;padding:0;border:2px solid transparent;border-radius:22px;background:transparent;cursor:pointer;isolation:isolate;touch-action:manipulation}
.cafe-food:not(.cafe-yummy)::before{content:'';position:absolute;top:21%;bottom:7%;left:6%;right:6%;border:1px solid #fffdf5;border-radius:5px;background-color:#fff5de;background-image:repeating-linear-gradient(0deg,transparent 0 10px,#dcad7930 10px 12px),repeating-linear-gradient(90deg,transparent 0 10px,#dcad7930 10px 12px);box-shadow:0 3px 4px #65401f30,inset 0 0 0 4px #fffaf0;transform:rotate(-4deg);z-index:-1;pointer-events:none}
.cafe-food:nth-child(even)::before{transform:rotate(4deg)}
.cafe-sprite{display:block;width:100%;height:100%;aspect-ratio:1;max-width:100%;background-image:url('assets/cafe/food-atlas.png');background-size:400% 400%;background-position:var(--sx) var(--sy);background-repeat:no-repeat;pointer-events:none}
.cafe-food>.cafe-sprite{width:auto;height:100%;max-height:130px;max-width:100%;filter:drop-shadow(0 5px 3px #503e212c)}
.cafe-food:hover,.cafe-food:focus-visible{background:#fff7ce49;border-color:#fff4ae;outline:3px solid #fff8d0;outline-offset:1px}
.cafe-food.is-selected{border-color:#225e55;background:#fff9e04f;outline:3px solid #fff8d0}
.cafe-food.is-hinted,.cafe-food.is-correct{outline:3px solid #fff3a5;border-color:#3e8d63;background:#f9ffd446;filter:drop-shadow(0 0 8px #ffe77a)}
.cafe-food:disabled{opacity:1;cursor:default}
.cafe-food{container-type:size}.cafe-food>.cafe-sprite{width:min(100cqw,100cqh,130px);height:min(100cqw,100cqh,130px);max-width:none;max-height:none}
.cafe-visited{display:none;position:absolute;right:0;top:0;width:25px;height:25px;place-items:center;border-radius:50%;background:var(--accent);color:var(--on-accent);font-size:16px;border:2px solid #ffefcb}
.cafe-world[data-cafe-phase="explore"] .was-visited .cafe-visited{display:grid}
.cafe-yummy .cafe-sprite{opacity:.9}.cafe-reaction-face{position:absolute;font-size:clamp(26px,4vw,56px);line-height:1;inset:0;display:grid;place-items:center;color:#713610;transform:translateY(-3%)}
.cafe-yummy-caption{position:absolute;bottom:-2px;left:0;right:0;text-align:center;font-size:clamp(.6rem,1.1vw,.9rem);font-weight:700;color:#653f22;background:#fff4b7ed;border-radius:8px}
.cafe-serving{position:absolute;left:8%;right:8%;bottom:2%;height:18%;display:flex;align-items:center;justify-content:center;gap:15px;background:#fff5d9bb;border:1px solid #ffffff80;border-radius:50px}
.cafe-serving[hidden]{display:none}
.cafe-plate{position:relative;width:110px;height:100%;flex-shrink:0}.cafe-plate-art{position:absolute;inset:0;width:100%;height:100%;background-size:400% 400%;opacity:.96}.cafe-selected{position:absolute;inset:-12% 25% 15%;display:flex;align-items:center;justify-content:center}.cafe-selected .cafe-sprite{height:100%;width:auto;max-height:75px;filter:drop-shadow(0 3px 2px #754d4133)}
.cafe-serving-caption{font-size:clamp(.75rem,1.3vw,1rem);color:#453f2a}
.has-order .cafe-counter-items{top:43%;bottom:24%;gap:2px 20px}
.cafe-conversation,.cafe-meaning-panel{position:absolute;top:22%;bottom:4%;left:6%;right:6%;padding:16px;display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);align-items:center;gap:20px;border-radius:20px;background:#fffaf0f7;box-shadow:0 7px 20px #4e351e26}
.has-conversation .cafe-counter-items,.has-meaning .cafe-counter-items{opacity:.13;pointer-events:none}
.has-conversation .cafe-guest-note,.has-meaning .cafe-guest-note{display:none}
.cafe-context{min-width:0;text-align:center;display:flex;align-items:center;flex-direction:column;gap:10px;color:#294c43}
.cafe-context-label{font-size:.8rem;text-transform:uppercase;letter-spacing:.08em;color:#7d6d57;font-weight:700}
.cafe-context p{font-size:clamp(.9rem,1.5vw,1.2rem);line-height:1.45;margin:0;max-width:380px}
.cafe-guest-replica{display:block;font-size:.85em;font-weight:600;color:#536d65;margin-top:6px}
.cafe-prop{height:100px;width:100px;flex-shrink:0;filter:drop-shadow(0 5px 4px #84624833)}
.cafe-replies{display:grid;gap:10px;min-width:0;width:100%}
.cafe-reply{position:relative;border:2px solid #c9ddd1;border-radius:15px;background:#fffefa;min-height:58px;min-width:0;padding:12px 30px 12px 15px;font-size:clamp(.95rem,1.6vw,1.3rem);line-height:1.35;color:var(--ink);text-align:left;overflow-wrap:break-word;cursor:pointer}
.cafe-reply:hover,.cafe-reply:focus-visible{border-color:var(--accent);outline:2px solid var(--accent-soft);background:#f1f7e9}
.cafe-reply.is-correct,.cafe-reply.is-hinted{border-color:var(--accent);background:var(--accent-soft)}
.cafe-reply.is-wrong{border-color:#c35f44;background:#fff0e9;animation:nudge .3s}
.cafe-reply:disabled{opacity:1}.cafe-reply .answer-check{right:8px;top:50%;transform:translateY(-50%)}
.cafe-meaning-panel{grid-template-columns:1fr;justify-items:center;gap:8px;padding:18px 12%;top:24%}.cafe-meaning-panel>p{margin:0;font-weight:600;font-size:1.05rem}.cafe-meaning-panel .cafe-replies{max-width:600px}
.cafe-phrase-meaning{padding:20px;border-radius:15px;background:#e7f1e9;color:#28594b;text-align:center}.cafe-phrase-meaning p{font-size:clamp(1rem,2vw,1.5rem);margin:0 0 10px}.cafe-phrase-meaning span{font-size:.85rem;color:#536e63}
.lesson-shell:is([data-lesson^="cafe-"],[data-lesson^="story-"]) .lesson-footer{grid-template-columns:270px minmax(0,1fr) 170px;grid-template-rows:64px 38px;column-gap:16px}
.lesson-shell:is([data-lesson^="cafe-"],[data-lesson^="story-"]) .lesson-word-row{height:64px;min-height:64px}
.lesson-shell:is([data-lesson^="cafe-"],[data-lesson^="story-"]) [data-listen],.lesson-shell:is([data-lesson^="cafe-"],[data-lesson^="story-"]) [data-hint]{width:125px}
:root[data-word-style] .lesson-shell:is([data-lesson^="cafe-"],[data-lesson^="story-"]) .word-pill{min-width:0;max-width:100%;font-size:clamp(1.4rem,3vw,2.6rem);overflow-wrap:normal;line-height:1.1;padding:5px 18px;text-align:center}
:root[data-word-style] .lesson-shell[data-phrase="true"] .word-pill{font-size:clamp(1.05rem,2vw,1.8rem)}
.lesson-shell:is([data-lesson^="cafe-"],[data-lesson^="story-"]) .feedback,.lesson-shell:is([data-lesson^="cafe-"],[data-lesson^="story-"]) .feedback[data-kind="translation"]{height:38px;min-height:38px;font-size:.85rem;line-height:1.15}
.lesson-shell:is([data-lesson^="cafe-"],[data-lesson^="story-"]) .stage-track{gap:5px}.lesson-shell:is([data-lesson^="cafe-"],[data-lesson^="story-"]) .stage-chip{padding:6px 9px;font-size:.95rem}
@media(max-width:1000px){.lesson-shell:is([data-lesson^="cafe-"],[data-lesson^="story-"]) .lesson-footer{grid-template-columns:225px minmax(0,1fr) 125px;column-gap:10px}.lesson-shell:is([data-lesson^="cafe-"],[data-lesson^="story-"]) [data-listen],.lesson-shell:is([data-lesson^="cafe-"],[data-lesson^="story-"]) [data-hint]{width:105px}}
@media(max-width:760px){
 .lesson-shell:is([data-lesson^="cafe-"],[data-lesson^="story-"]) .lesson-footer{grid-template-columns:88px minmax(0,1fr) 88px;grid-template-rows:64px 44px;gap:2px 7px;padding:5px 9px max(8px,env(safe-area-inset-bottom))}
 .lesson-shell:is([data-lesson^="cafe-"],[data-lesson^="story-"]) .lesson-word-row{height:64px;min-height:64px}
 .lesson-shell:is([data-lesson^="cafe-"],[data-lesson^="story-"]) [data-listen],.lesson-shell:is([data-lesson^="cafe-"],[data-lesson^="story-"]) [data-hint]{width:100%}
 :root[data-word-style] .lesson-shell:is([data-lesson^="cafe-"],[data-lesson^="story-"]) .word-pill{font-size:clamp(1rem,4.5vw,1.8rem);padding:4px 7px}
 :root[data-word-style] .lesson-shell[data-phrase="true"] .word-pill{font-size:clamp(.82rem,3.3vw,1.2rem);min-height:48px}
 .lesson-shell:is([data-lesson^="cafe-"],[data-lesson^="story-"]) .feedback,.lesson-shell:is([data-lesson^="cafe-"],[data-lesson^="story-"]) .feedback[data-kind="translation"]{height:44px;min-height:44px;font-size:.72rem}
 .lesson-shell:is([data-lesson^="cafe-"],[data-lesson^="story-"]) .stage-chip{font-size:.875rem;padding:5px 8px;gap:4px}.lesson-shell:is([data-lesson^="cafe-"],[data-lesson^="story-"]) .stage-chip>span{min-width:18px;height:18px}
 .lesson-shell:is([data-lesson^="cafe-"],[data-lesson^="story-"]) .stage-chip{font-size:14px}
 .scene-cafe>.task-area{top:8px;padding:5px 10px}.scene-cafe>.task-area h2{font-size:1.05rem}
 .cafe-guest-note{top:22%;padding:6px;left:3%;width:61%;font-size:.75rem}
 .cafe-guest-note{width:max-content;max-width:64%}
 .cafe-counter-items{left:4%;right:4%;top:43%;bottom:19%;gap:4px}
 .cafe-food{border-radius:13px;min-height:40px}.cafe-food>.cafe-sprite{max-height:100px}
 .cafe-visited{width:20px;height:20px;font-size:12px}
 .has-order .cafe-counter-items{gap:4px;bottom:26%}
 .cafe-serving{height:19%;bottom:3%;left:5%;right:5%;gap:6px}.cafe-plate{width:75px}.cafe-serving-caption{font-size:.72rem}
 .cafe-conversation{left:3%;right:3%;top:18%;bottom:3%;padding:10px;grid-template-columns:1fr;grid-template-rows:auto minmax(0,1fr);gap:8px}
 .cafe-context{flex-direction:row;gap:6px;text-align:left}.cafe-context-label{display:none}.cafe-context p{font-size:.82rem;line-height:1.25;flex:1}.cafe-prop{height:48px;width:48px}
 .cafe-replies{gap:7px}.cafe-reply{font-size:.9rem;min-height:44px;padding:7px 25px 7px 10px;line-height:1.2;border-radius:10px}
 .cafe-meaning-panel{top:20%;left:4%;right:4%;padding:10px;gap:7px}.cafe-meaning-panel>p{font-size:.85rem}
 .cafe-phrase-meaning{padding:12px}.cafe-phrase-meaning p{font-size:.9rem;margin-bottom:5px}.cafe-phrase-meaning span{font-size:.73rem}
}
@media(max-width:359px){
 .lesson-shell:is([data-lesson^="cafe-"],[data-lesson^="story-"]) .lesson-brand .eyebrow{display:none}
 .lesson-shell:is([data-lesson^="cafe-"],[data-lesson^="story-"]) .lesson-brand h1{font-size:14px;line-height:1.25}
 .scene-cafe>.task-area h2{font-size:16px}
 .lesson-shell:is([data-lesson^="cafe-"],[data-lesson^="story-"]) .lesson-footer{grid-template-columns:78px minmax(0,1fr) 78px;column-gap:5px;padding-inline:7px}
 .lesson-shell:is([data-lesson^="cafe-"],[data-lesson^="story-"]) .stage-chip{padding:4px 6px}
 .cafe-reply{font-size:.8rem;padding-block:6px}.cafe-context p{font-size:.75rem}.cafe-context .cafe-prop{width:36px;height:36px}
 .cafe-guest-note{font-size:.66rem}.cafe-serving-caption{font-size:.65rem}
 .cafe-conversation{top:35px;padding:6px;gap:5px}.cafe-reply{min-height:42px;font-size:clamp(13px,.8rem,14px)}.cafe-guest-replica{margin-top:3px}.cafe-context p{font-size:clamp(12px,.75rem,14px)}
}
@media(max-width:760px){.lesson-shell[data-cafe-phase="talk"] .lesson-footer{grid-template-rows:42px 42px}.lesson-shell[data-cafe-phase="talk"] .lesson-word-row{height:42px;min-height:42px}.lesson-shell[data-cafe-phase="talk"] .feedback{grid-row:1/3;height:auto;min-height:0}}
@media(max-height:560px) and (orientation:landscape){
 .lesson-shell:is([data-lesson^="cafe-"],[data-lesson^="story-"]) .stage-chip{font-size:14px;padding:4px 8px}
 .lesson-shell:is([data-lesson^="cafe-"],[data-lesson^="story-"]) .lesson-footer{grid-template-columns:220px minmax(0,1fr) 125px;grid-template-rows:44px 26px;padding-block:3px;column-gap:10px}
 .lesson-shell:is([data-lesson^="cafe-"],[data-lesson^="story-"]) .lesson-word-row{height:44px;min-height:44px}
 :root[data-word-style] .lesson-shell:is([data-lesson^="cafe-"],[data-lesson^="story-"]) .word-pill{font-size:1.5rem;min-height:38px;padding:3px 10px}
 :root[data-word-style] .lesson-shell[data-phrase="true"] .word-pill{font-size:1rem}
 .lesson-shell:is([data-lesson^="cafe-"],[data-lesson^="story-"]) .feedback,.lesson-shell:is([data-lesson^="cafe-"],[data-lesson^="story-"]) .feedback[data-kind="translation"]{font-size:.7rem;height:26px;min-height:26px}
 .lesson-shell:is([data-lesson^="cafe-"],[data-lesson^="story-"]) [data-listen],.lesson-shell:is([data-lesson^="cafe-"],[data-lesson^="story-"]) [data-hint]{grid-column:1;grid-row:1/3;width:105px;min-height:42px}
 .lesson-shell:is([data-lesson^="cafe-"],[data-lesson^="story-"]) [data-next]{grid-column:3;grid-row:1/3}
 .cafe-guest-note{top:26%;font-size:.7rem;padding:4px 8px;width:55%}
 .cafe-counter-items{top:45%;bottom:9%;grid-template-columns:repeat(var(--cafe-count,8),minmax(0,1fr));grid-template-rows:1fr;left:4%;right:4%;gap:4px}
 .has-order .cafe-counter-items{right:25%;bottom:8%;gap:3px}.cafe-serving{left:auto;right:2%;bottom:9%;width:21%;height:43%;flex-direction:column;gap:0;border-radius:20px}.cafe-plate{width:80px;height:70%}
 .cafe-conversation{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);grid-template-rows:1fr;top:22%;padding:9px;gap:15px}
 .cafe-context{gap:7px;flex-direction:row;text-align:left}.cafe-context-label{display:none}.cafe-context p{font-size:.8rem;line-height:1.2}.cafe-prop{height:55px;width:55px}
 .cafe-reply{min-height:40px;font-size:.85rem;padding:6px 25px 6px 10px}.cafe-replies{gap:5px}
 .cafe-meaning-panel{top:24%;padding:7px 10%;gap:3px;grid-template-columns:1fr}.cafe-meaning-panel>p{display:none}
 .cafe-phrase-meaning{padding:10px}.cafe-phrase-meaning p{font-size:.9rem;margin-bottom:5px}
}
@media(prefers-reduced-motion:no-preference){.cafe-food:hover>.cafe-sprite{transform:translateY(-4px);transition:transform .2s}.cafe-food.is-correct>.cafe-sprite{animation:cafe-pleased .5s ease}.cafe-selected .cafe-sprite{animation:cafe-serve .25s ease-out}@keyframes cafe-serve{from{transform:translateY(-12px);opacity:.4}to{transform:none;opacity:1}}@keyframes cafe-pleased{50%{transform:translateY(-7px)}}}
