/* Зал «Смены Тео» сверху: план кафе в SVG 1000×560 (hall-ui.mjs), текст — HTML поверх плана.
   Цвет неба, фонари и тёплый вечерний свет задаёт hall-ui.mjs переменными (--sky-top, --street, --warm, --dusk, --sun). */
.hall{--h-navy:#022c6d;--h-cream:#f3f1ee;--h-red:#e03127;--h-yellow:#ffc400;--h-ink:#14204a;
  --sky-top:#9fd0ee;--sky-bot:#e6f4fb;--street:0;--warm:0;--dusk:0;--sun:1;--lit:0;--neon:0;
  position:relative;aspect-ratio:1000/560;overflow:hidden;isolation:isolate;border-radius:16px 16px 0 0;background:#ecd2a6;user-select:none;-webkit-user-select:none}
.hp-wrap{position:absolute;inset:0}
.hp-svg{display:block;width:100%;height:100%}
.hp-svg text{font-family:Manrope,sans-serif}

/* ---------- улица за стеклянным фасадом ---------- */
.st-walk{fill:url(#hp-paving)}
.st-road{fill:#7c8594}
.st-curb{fill:none;stroke:#b9b2a6;stroke-width:4}
.st-sky{fill:var(--sky-bot);opacity:.3;mix-blend-mode:multiply}
.st-trees circle{fill:#5f9e4f;stroke:#4a8040;stroke-width:1.5}
.st-walker{display:none;--c:#3d5a8a;animation:st-walk 18s linear infinite}
.st-walker .st-body{fill:var(--c)}.st-walker .st-head{fill:#3a2c24}
.st-walker-1,.st-walker-2,.st-walker-3{display:inline}
.st-walker-1{--c:var(--h-navy)}
.st-walker-2{--c:var(--h-red);animation-name:st-walk-back;animation-duration:22s;animation-delay:-9s}
.st-walker-3{--c:#6b7a8c;animation-duration:15s;animation-delay:-11s}
.st-walker-4{--c:#e0a300;animation-name:st-walk-back;animation-duration:13s;animation-delay:-4s}
.st-walker-5{--c:#2f6d5e;animation-duration:16s;animation-delay:-2s}
.hall[data-rush="lunch"] .st-walker-4,.hall[data-rush="lunch"] .st-walker-5,.hall[data-rush="dinner"] .st-walker-4,.hall[data-rush="dinner"] .st-walker-5{display:inline}
.hall.is-night .st-walker-3{display:none}
.st-glow{fill:url(#hp-light);opacity:var(--street)}
.st-post{fill:#39465a}
.st-awning rect{fill:var(--h-navy);stroke:#01183d;stroke-width:1.5}
.st-awning text{fill:#fff;font-weight:900;font-size:12px;text-anchor:middle;letter-spacing:.05em}
.hall.is-evening .st-awning text{fill:#ffe39a}
.hall.is-evening .st-awning rect{stroke:#ffb347;stroke-width:2.5}

/* ---------- стены, пол, свет ---------- */
.hp-service{fill:url(#hp-hatch)}
.hp-floor{fill:url(#hp-wood)}
.hp-sun{fill:#fff7da;opacity:calc(var(--sun) * .38)}
.hp-walls rect{fill:#1f2a44}.hp-wall-line{stroke:#1f2a44;stroke-width:10}
.hp-windows rect{fill:var(--sky-top);opacity:.95}
.hp-planters circle{fill:#4f8a45}.hp-planters .hp-leaf{fill:#86c35f}
.hp-glass{fill:none;stroke:var(--sky-top);stroke-width:10;opacity:.9}
.hp-mullions{fill:none;stroke:#1f2a44;stroke-width:11;stroke-dasharray:3 58}
.hp-curtain{fill:none;stroke:#8e2a24;stroke-width:5;stroke-linecap:round;transition:transform .35s ease-out}
.hall.is-door-open .hp-curtain-l{transform:translateX(-9px)}.hall.is-door-open .hp-curtain-r{transform:translateX(9px)}
.hp-door{stroke:#8fc3e6;stroke-width:7;stroke-linecap:round;transform-box:view-box;transform-origin:962px 400px;transition:transform .35s ease-out}
.hall.is-door-open .hp-door{transform:rotate(62deg)}
.hp-cloak rect{fill:#b98552;stroke:#7a5230;stroke-width:1.5}.hp-cloak path{stroke:#7a5230;stroke-width:2}
.hp-bench rect{fill:#b07847;stroke:#7a4d2c;stroke-width:1.5}
.hp-bar-top{fill:#d6dde3;stroke:#9aa6b2;stroke-width:1.5}.hp-bar-front{fill:var(--h-navy)}
.hp-dusk{fill:#0b1640;opacity:calc(var(--dusk) * .55);pointer-events:none}
.hp-lampglow circle{fill:url(#hp-light);opacity:calc(var(--warm) * .85);mix-blend-mode:screen;pointer-events:none}
.hp-num circle{fill:var(--h-navy)}.hp-num text{fill:#fff;font-weight:800;font-size:10.5px;text-anchor:middle}

/* ---------- мебель по мотивам плана ремонта ---------- */
.fu-sofa{fill:#d9783a}.fu-sofa-back{fill:#b85e28}
.fu-top{fill:#e6cda2;stroke:#b99867;stroke-width:1.5}.fu-white{fill:#fbfaf7;stroke:#cfc6b4}.fu-grey{fill:#aeb5bf;stroke:#8c949f}.fu-long{fill:#c79a62;stroke:#a57b47}
.fu-stool{fill:#8f99a6;stroke:#6f7884;stroke-width:1.5}
.fu-bench-blue{fill:#1f45b0}.fu-bench-blue-back{fill:var(--h-navy)}
.fu-chair{fill:#d8c3a0;stroke:#b0986e;stroke-width:1.5}.fu-chair-blue{fill:#9fb3d6;stroke:#7b8fb3}
.fu-sofa-dark{fill:#3b4250}.fu-seam{stroke:#2a303b;stroke-width:2}
.fu-seat{stroke:#00000026;stroke-width:1.5}
.fu-plants{fill:none;stroke:#5f9e4f;stroke-width:10;stroke-linecap:round;stroke-dasharray:1 16}
.fu-curve{fill:none;stroke:#8f959e;stroke-width:24;stroke-linecap:round}
.fu-pouf{fill:#e0782f;stroke:#b85e28;stroke-width:1.5}

/* ---------- открытая кухня: кастрюли кипят, вок горит, нож стучит, повара бегают ---------- */
.kt-floor{fill:url(#hp-tile)}
.kt-steel{fill:#c9d1d9;stroke:#9aa6b2;stroke-width:1.5}
.kt-burners circle{fill:#2a3140}
.kt-pot-rim{fill:#7d8794}.kt-soup{fill:#e6a146}.kt-broth{fill:#d9c08a}
.kt-bubble{fill:#fff3d0;transform-box:fill-box;transform-origin:center;animation:kt-bubble 1.1s ease-out infinite}
.kt-b2{animation-delay:-.4s}.kt-b3{animation-delay:-.75s}
.kt-flame{fill:none;stroke:#ff7a1f;stroke-width:6;stroke-dasharray:7 5;opacity:.75;transform-box:fill-box;transform-origin:center;animation:kt-flame .5s ease-in-out infinite alternate}
.kt-wok-pan{fill:#2a3140}.kt-wok-handle{stroke:#6b4a2f;stroke-width:5;stroke-linecap:round}
.kt-wok{animation:kt-toss 1.4s ease-in-out infinite}
.kt-board{fill:#c8935a;stroke:#a47440;stroke-width:1.5}
.kt-knife{animation:kt-chop .6s ease-in-out infinite}
.kt-shelf-lines{stroke:#9aa6b2;stroke-width:1.5}
.kt-puff{fill:#fff;opacity:0;transform-box:fill-box;transform-origin:center}
.hall[data-heat] .kt-puff-1{animation:kt-steam 2s ease-out infinite}
.hall[data-heat="1"] .kt-puff-2,.hall[data-heat="2"] .kt-puff-2,.hall[data-heat="3"] .kt-puff-2{animation:kt-steam 1.6s ease-out -.5s infinite}
.hall[data-heat="2"] .kt-puff-3,.hall[data-heat="3"] .kt-puff-3{animation:kt-steam 1.3s ease-out -.3s infinite}
.hall[data-heat="3"] .kt-puff-4,.hall[data-heat="3"] .kt-puff-5{animation:kt-steam 1.1s ease-out -.8s infinite}
.hall[data-heat="1"] .kt-flame{opacity:.9;animation-duration:.35s}
.hall[data-heat="2"] .kt-flame,.hall[data-heat="3"] .kt-flame{opacity:1;stroke-width:9;animation-duration:.22s}
.hall[data-heat="2"] .kt-wok,.hall[data-heat="3"] .kt-wok{animation-duration:.7s}
.hall[data-heat="2"] .kt-knife,.hall[data-heat="3"] .kt-knife{animation-duration:.3s}
.hall[data-heat="2"] .kt-bubble,.hall[data-heat="3"] .kt-bubble{animation-duration:.6s}
.k-cook .k-jacket{fill:#fbfaf7;stroke:#cfd6dc;stroke-width:1.5}.k-cook .k-hand{fill:#f0cda8}
.k-hat,.k-hat-puff{fill:#fff;stroke:#dfe5ea;stroke-width:1}
.k-theo .k-jacket{fill:var(--h-navy);stroke:#01183d}
.t-curl{fill:#1a1626}.t-band{stroke:var(--h-red);stroke-width:3;stroke-linecap:round}
.t-sweat{fill:#9ad3f5;stroke:#5aa4d6;stroke-width:.8;opacity:0;transform-box:fill-box;transform-origin:center}
.k-bob{animation:k-bob .5s ease-in-out infinite alternate;transform-box:fill-box;transform-origin:center}
.k-theo{transform:translate(100px,118px);animation:k-theo 7s ease-in-out infinite}
.k-cook-1{transform:translate(96px,264px);animation:k-cook-1 5.5s ease-in-out infinite}
.k-cook-2{transform:translate(150px,90px);animation:k-cook-2 6.5s ease-in-out infinite}
.hall[data-heat="1"] .k-theo{animation-duration:5s}.hall[data-heat="1"] .k-cook-1{animation-duration:4s}.hall[data-heat="1"] .k-cook-2{animation-duration:4.6s}
.hall[data-heat="2"] .k-theo,.hall[data-heat="3"] .k-theo{animation-duration:3.4s}.hall[data-heat="2"] .k-cook-1,.hall[data-heat="3"] .k-cook-1{animation-duration:2.8s}.hall[data-heat="2"] .k-cook-2,.hall[data-heat="3"] .k-cook-2{animation-duration:3.1s}
.hall[data-heat="2"] .k-bob,.hall[data-heat="3"] .k-bob{animation-duration:.28s}
.hall[data-theo="busy"] .t-sweat{animation:t-sweat .7s ease-out infinite}
.hall[data-theo="busy"] .t-sweat:nth-of-type(2){animation-delay:-.23s}.hall[data-theo="busy"] .t-sweat:nth-of-type(3){animation-delay:-.46s}
.hall[data-theo="slump"] .k-theo .k-bob{animation:none;transform:scale(.9)}
.hall[data-theo="cheer"] .k-theo .k-bob{animation:k-cheer .5s ease-out 2}
.hp-slip{fill:#fffdf7;stroke:#c9c1ad;stroke-width:1;animation:hp-drop .35s ease-out}
.hp-slip.is-ready{fill:#e5f3d8;stroke:#6ca24b}.hp-slip.is-urgent{fill:#ffe1d8;stroke:var(--h-red)}
.hp-dish{animation:hp-drop .3s ease-out}
.w-plate{fill:#fff;stroke:#c9d1d9;stroke-width:1.5}
.hp-dish.is-ready circle.w-plate{stroke:var(--h-yellow);stroke-width:3}

/* ---------- гости, курьер, официант ---------- */
.hp-person{cursor:default}
.hp-person.is-live{cursor:pointer}
.hp-person{--top:var(--h-red);--hair:var(--h-ink);--skin:#f7d8bf}
.hp-person[data-look="nao"]{--top:var(--h-navy);--hair:#0e1a36;--skin:#f3cfb0}
.hp-person[data-look="guest"]{--top:var(--h-yellow);--hair:#5a3b22;--skin:#efc7a4}
.hp-person[data-look="courier"]{--top:#e0a15e;--skin:#e0a15e}
.hp-person[data-look="delivery"]{--top:#ffc400;--skin:#efc7a4}
.p-shoulders{fill:var(--top);stroke:#00000024;stroke-width:1.5}
.p-hair{fill:var(--hair)}.p-face,.p-hand{fill:var(--skin)}
.p-phones{fill:none;stroke:var(--h-red);stroke-width:3;stroke-linecap:round}.p-cup{fill:var(--h-red)}
.p-tail{fill:none;stroke:#c3844a;stroke-width:4;stroke-linecap:round}.p-fur{fill:#e0a15e}.p-ears{fill:#c98a4e}.p-nose{fill:#e2826f}
.p-box{fill:#f7b500;stroke:#9b7400;stroke-width:1.6}.p-box-line{stroke:#9b7400;stroke-width:1.5}
.p-helmet{fill:#2a3140}.p-visor{fill:none;stroke:#9ad3f5;stroke-width:2.6;stroke-linecap:round}
.p-hand-up,.p-menu{display:none}
.p-menu{fill:var(--h-navy);stroke:#fff;stroke-width:1.2}
.hp-person[data-phase="menu"] .p-menu{display:inline}
.hp-person[data-phase="hand"] .p-hand-up{display:inline}.hp-person[data-phase="hand"] .p-hand-l{display:none}
.p-select{fill:none;stroke:var(--h-yellow);stroke-width:4.5;opacity:0}
.hp-person.is-active .p-select{opacity:1}
.hp-person.is-linked .p-select{opacity:1;stroke:#fff}
.p-shape{transform-box:fill-box;transform-origin:center}
.hp-person[data-walk="1"] .p-shape{animation:p-walk .3s ease-in-out infinite alternate}
.hp-person[data-phase="eat"] .p-shape{animation:p-eat .42s ease-in-out infinite alternate}
.hp-person[data-phase="angry"] .p-shape{animation:p-shake .2s linear infinite}
.hp-person[data-phase="leave"][data-face="fury"] .p-shape{animation-duration:.2s}
.p-bubble{display:none}
.p-bubble rect{fill:#fffdf7;stroke:#d6c7a8;stroke-width:1.5}.p-bubble path{fill:#fffdf7}
.hp-person[data-phase="order"] .p-bubble{display:inline}
.hp-person[data-courier="1"][data-phase="wait"] .p-bubble,.hp-person[data-courier="1"][data-phase="served"] .p-bubble{display:inline}
.hp-person[data-courier="1"][data-face="frown"] .p-bubble rect{stroke:#e8a536;stroke-width:3}
.hp-person[data-courier="1"][data-face="cross"] .p-bubble rect{stroke:var(--h-red);stroke-width:3.5}
.p-bubble-in{transform-box:fill-box;transform-origin:50% 100%;animation:p-pop .25s ease-out}
/* У верхней стены облачко не помещается над головой — встаёт сбоку */
.hp-person[data-wall="1"] .p-bubble{transform:translate(31px,31px)}
.p-mood path{display:none}
.m-vein{fill:none;stroke:var(--h-red);stroke-width:3;stroke-linecap:round}.m-heart{fill:var(--h-red)}
.hp-person[data-phase="angry"] .m-vein,.hp-person[data-phase="leave"][data-face="fury"] .m-vein,.hp-person[data-courier="1"][data-face="cross"] .m-vein{display:inline}
.hp-person[data-phase="eat"] .m-heart,.hp-person[data-phase="grab"] .m-heart{display:inline}
.p-mood g{transform-box:fill-box;transform-origin:center}
.hp-person[data-phase="eat"] .p-mood g{animation:p-heart 1s ease-out infinite}
.hp-person[data-phase="angry"] .p-mood g{animation:p-throb .35s ease-in-out infinite alternate}
.hp-waiter{--skin:#f2cfae;pointer-events:none}
.w-shirt{fill:#fbfaf7;stroke:#b9b1a0;stroke-width:1.5}.w-vest{fill:var(--h-navy)}.w-bow{fill:var(--h-red)}.w-hair{fill:#1e1a2e}.w-tray-empty{fill:#dfe5ea;stroke:#9aa6b2;stroke-width:1.5}
.hp-waiter[data-state="carry"] .w-tray-empty,.hp-waiter[data-state="put"] .w-tray-empty{display:none}
.w-pad{display:none;fill:#fff;stroke:#9aa3ad;stroke-width:1}
.hp-waiter[data-state="take"] .w-pad{display:inline}
.hp-waiter[data-walk="1"] .p-shape{animation:p-walk .26s ease-in-out infinite alternate}
.hall[data-tempo="1"] .hp-waiter[data-walk="1"] .p-shape{animation-duration:.21s}
.hall[data-tempo="2"] .hp-waiter[data-walk="1"] .p-shape{animation-duration:.17s}

/* Заказ на столе, тарелки, настроение стола */
.hp-mark{cursor:pointer}
.mk-plate{fill:#fffdf7;stroke:#d6c7a8;stroke-width:1.6}
.hp-mark[data-state="order"]{opacity:.62}
.hp-mark[data-state="order"] .mk-plate{stroke-dasharray:4 3}
.mk-ok{display:none}
.hp-mark[data-state="ready"] .mk-ok,.hp-mark[data-state="served"] .mk-ok{display:inline}
.hp-mark[data-state="plate"] .mk-plate{stroke:#b9ad96;stroke-width:2.4}
.hp-mark.is-active .mk-plate{stroke:var(--h-yellow);stroke-width:4;stroke-dasharray:none}
.hp-mark.is-active{opacity:1}
.hp-badge{opacity:0;transition:opacity .2s;pointer-events:none;--ring:100}
.hp-badge.is-on{opacity:1}
.bd-track{fill:#fffdf7;stroke:#e3d8c2;stroke-width:4.5}
.bd-ring{fill:none;stroke:#5d9a3e;stroke-width:4.5;stroke-linecap:round;stroke-dasharray:var(--ring) 100}
.hp-badge[data-face="frown"] .bd-ring{stroke:#e8a536}
.hp-badge[data-face="cross"] .bd-ring,.hp-badge[data-face="fury"] .bd-ring{stroke:var(--h-red)}
.f-bg{fill:#fffdf7}.f-eyes circle{fill:var(--h-ink)}
.f-m,.f-brow,.f-joy{fill:none;stroke:var(--h-ink);stroke-width:1.5;stroke-linecap:round;display:none}
.f-open{fill:#b3261d;stroke:var(--h-ink);stroke-width:1}
.hp-badge[data-face="calm"] .f-calm{display:inline}
.hp-badge[data-face="frown"] .f-frown,.hp-badge[data-face="frown"] .f-worry{display:inline}
.hp-badge[data-face="cross"] .f-cross,.hp-badge[data-face="cross"] .f-angry,.hp-badge[data-face="fury"] .f-cross,.hp-badge[data-face="fury"] .f-angry{display:inline}
.hp-badge[data-face="cross"] .f-bg{fill:#ffe0d6}.hp-badge[data-face="fury"] .f-bg{fill:#ffb3a3}
.hp-badge[data-face="joy"] .f-joy,.hp-badge[data-face="joy"] .f-open{display:inline}.hp-badge[data-face="joy"] .f-eyes{display:none}
.hp-badge[data-face="cross"] .f-face{transform-box:fill-box;transform-origin:center;animation:p-throb .4s ease-in-out infinite alternate}

/* ---------- текст поверх плана ---------- */
.hp-over{position:absolute;inset:0;pointer-events:none;font-family:Manrope,sans-serif}
.hp-over>*{position:absolute;margin:0}
.hp-pops{inset:0}
.hp-clock{left:1.2%;bottom:2.5%;display:flex;align-items:center;gap:6px;padding:4px 9px 4px 5px;border-radius:14px;background:#022c6de6;color:#fff;box-shadow:0 2px 0 #0003}
.hp-clock b{font:800 clamp(12px,1.9cqw,16px)/1 Manrope,sans-serif;font-variant-numeric:tabular-nums;color:var(--h-yellow)}
.hp-clock span{font:700 clamp(9px,1.3cqw,11px)/1.1 Manrope,sans-serif;color:#dbe6f5;white-space:nowrap}
.hall{container-type:inline-size}
.hp-sunmoon{position:relative;display:block;width:16px;height:16px;border-radius:50%;background:#ffd24d;box-shadow:0 0 0 2px #ffd24d55}
.hall.is-night .hp-sunmoon{background:#f3ecc9;box-shadow:inset -5px -2px 0 #022c6d}
.hp-banner{left:50%;top:3%;padding:5px 14px;border-radius:8px;background:var(--h-red);color:#fff;white-space:nowrap;font:900 clamp(13px,2.4cqw,20px)/1.1 var(--display,Manrope,sans-serif);
  box-shadow:0 3px 0 #8f1d15,0 8px 16px #3a0d0a44;opacity:0;transform:translate(-50%,-12px) rotate(-2deg);transition:opacity .25s ease-out,transform .35s cubic-bezier(.2,.9,.3,1)}
.hall.is-banner .hp-banner{opacity:1;transform:translate(-50%,0) rotate(-2deg)}
.hp-say{left:12.5%;top:17%;padding:4px 10px;border-radius:12px;background:#fffdf7;color:var(--h-navy);white-space:nowrap;font:800 clamp(10px,1.6cqw,13px)/1.2 Manrope,sans-serif;
  box-shadow:0 2px 0 #0003;opacity:0;transform:translateY(4px) scale(.9);transform-origin:0 100%;transition:opacity .2s,transform .2s}
.hp-say::after{content:"";position:absolute;left:14px;bottom:-5px;border:6px solid #0000;border-top-color:inherit;border-bottom:0}
.hp-say{border-color:#fffdf7}
.hall.is-saying .hp-say{opacity:1;transform:none}
.hall[data-theo="busy"] .hp-say{background:var(--h-red);border-color:var(--h-red);color:#fff}
.hall[data-theo="slump"] .hp-say{background:#e4e8ee;border-color:#e4e8ee;color:#3d4a5f}
.t-name{fill:#fff;stroke:var(--h-navy);stroke-width:4.5px;paint-order:stroke;font-weight:900;font-size:15px;text-anchor:middle;letter-spacing:.02em}
.hp-board{left:79%;top:52%;display:none;flex-direction:column;align-items:center;gap:1px;padding:5px 9px;border:3px solid #9a6a3e;border-radius:6px;background:#1f2d49;color:#f6f0dc;
  text-align:center;box-shadow:0 3px 0 #5a3b20;transform:rotate(-3deg)}
.hp-board b{font:900 clamp(11px,1.8cqw,15px)/1.1 var(--display,Manrope,sans-serif)}
.hp-board span{font:800 clamp(10px,1.5cqw,13px)/1.1 Manrope,sans-serif;color:var(--h-yellow)}
.hall.is-board .hp-board{display:flex}
.hp-pop{position:absolute;padding:2px 8px;border-radius:12px;white-space:nowrap;font:800 clamp(10px,1.7cqw,14px)/1.2 Manrope,sans-serif;transform:translate(-50%,-150%);animation:hp-pop 1.8s ease-out both}
.hp-pop.is-plus{background:var(--h-yellow);color:var(--h-navy);box-shadow:0 2px 0 #b58a00}
.hp-pop.is-minus{background:var(--h-red);color:#fff}

/* Пауза замораживает зал вместе со сменой */
.hall.is-paused *,.hall.is-paused *::before,.hall.is-paused *::after{animation-play-state:paused!important}
.hall.is-paused::after{content:"";position:absolute;inset:0;background:#092a611f;pointer-events:none}
/* Связь «гость ↔ чек» при наведении и чеки компаний/доставки на рейке */
.ticket.is-linked{outline:3px solid var(--yellow,#ffce36);outline-offset:2px}
.ticket.is-delivery .ticket-top strong{display:inline-flex;align-items:center;gap:4px;color:#8a5a00}
.ticket.is-delivery .ticket-top strong::before{content:"";width:13px;height:13px;flex:none;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Crect x='1.5' y='3' width='9' height='8' rx='1.2' fill='%23f7b500' stroke='%239b7400'/%3E%3Ccircle cx='4' cy='13.2' r='1.8' fill='%23022c6d'/%3E%3Ccircle cx='12.4' cy='13.2' r='1.8' fill='%23022c6d'/%3E%3Cpath d='M10.5 8h2.6l1.6 3.4' fill='none' stroke='%23022c6d' stroke-width='1.4'/%3E%3C/svg%3E") center/contain no-repeat}
.ticket.is-party .ticket-top strong,.ticket.is-delivery .ticket-top strong{font-size:11px;letter-spacing:0;color:var(--blue,#092a61)}
.guest-portrait[data-guest="delivery"]{background-color:#fff3c4;background-size:86%;background-position:50% 100%;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Crect x='22' y='16' width='15' height='17' rx='2' fill='%23f7b500' stroke='%239b7400' stroke-width='1.2'/%3E%3Cpath d='M6 40c1-10 7-15 14-15s13 5 14 15z' fill='%23ffc400'/%3E%3Ccircle cx='19' cy='15' r='8' fill='%23efc7a4'/%3E%3Cpath d='M10.5 14a8.5 8.5 0 0 1 17 0z' fill='%232a3140'/%3E%3C/svg%3E")}

@keyframes st-walk{from{transform:translate(250px,531px)}to{transform:translate(995px,414px)}}
@keyframes st-walk-back{from{transform:translate(995px,426px)}to{transform:translate(250px,543px)}}
@keyframes kt-bubble{0%{transform:scale(.3);opacity:0}30%{opacity:1}100%{transform:scale(1.4);opacity:0}}
@keyframes kt-flame{from{transform:scale(.92) rotate(0)}to{transform:scale(1.08) rotate(20deg)}}
@keyframes kt-toss{0%,100%{transform:translate(0,0)}35%{transform:translate(-3px,-2px)}70%{transform:translate(2px,1px)}}
@keyframes kt-chop{0%,100%{transform:translateY(0)}50%{transform:translateY(5px)}}
@keyframes kt-steam{0%{opacity:0;transform:translate(0,0) scale(.5)}25%{opacity:.75}100%{opacity:0;transform:translate(6px,-34px) scale(1.9)}}
@keyframes k-bob{from{transform:scale(1)}to{transform:scale(1.05)}}
@keyframes k-cheer{50%{transform:scale(1.2)}}
@keyframes t-sweat{0%{opacity:0;transform:translate(0,0)}25%{opacity:1}100%{opacity:0;transform:translate(0,-10px) scale(.6)}}
@keyframes k-theo{0%,100%{transform:translate(100px,118px)}35%{transform:translate(100px,196px)}55%{transform:translate(104px,236px)}80%{transform:translate(100px,160px)}}
@keyframes k-cook-1{0%,100%{transform:translate(96px,264px)}45%{transform:translate(214px,300px)}70%{transform:translate(206px,290px)}}
@keyframes k-cook-2{0%,100%{transform:translate(150px,90px)}40%{transform:translate(214px,120px)}75%{transform:translate(206px,176px)}}
@keyframes hp-drop{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}
@keyframes p-walk{from{transform:scale(1) rotate(-5deg)}to{transform:scale(1.04) rotate(5deg)}}
@keyframes p-eat{from{transform:scale(1)}to{transform:scale(.94)}}
@keyframes p-shake{0%,100%{transform:translate(0,0)}25%{transform:translate(-2px,0)}75%{transform:translate(2px,0)}}
@keyframes p-pop{from{transform:scale(.4);opacity:0}to{transform:none;opacity:1}}
@keyframes p-heart{0%{transform:translateY(0) scale(.8);opacity:1}100%{transform:translateY(-14px) scale(1.1);opacity:0}}
@keyframes p-throb{to{transform:scale(1.18)}}
@keyframes hp-pop{0%{opacity:0;transform:translate(-50%,-120%) scale(.8)}15%{opacity:1;transform:translate(-50%,-160%) scale(1)}75%{opacity:1}100%{opacity:0;transform:translate(-50%,-260%)}}

/* ---------- раскладка страницы ---------- */
/* Широкий экран: зал — главная левая панель, кухня крупным планом справа. */
@media (min-width:1000px){
  .game-layout{width:min(1240px,calc(100% - 64px));grid-template-columns:minmax(0,1fr) 540px;grid-template-rows:auto 1fr;column-gap:30px;row-gap:14px;margin-top:18px;align-items:start}
  .intro{grid-column:1;grid-row:1;padding:0;display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 22px}
  .intro h1{font-size:46px;line-height:1;white-space:nowrap}.intro h1 br{display:none}.intro h1 span{margin-left:.14em}
  .intro-copy{margin:0;font-size:14px;line-height:1.35}.intro-copy br{display:none}
  .intro-how{display:none}
  .help{margin:0 0 0 auto;max-width:360px}.help summary{padding:4px 0;min-height:32px}
  .hall{grid-column:1;grid-row:2;border-radius:16px;box-shadow:0 14px 45px #54351215}
  .kitchen{grid-column:2;grid-row:1/span 2}
}
@media (min-width:1000px) and (max-height:850px){.game-layout{margin-top:14px}.intro h1{font-size:40px}}
/* Телефон и планшет: зал — полоса над кухней, вместе они одна карточка. */
@media (max-width:999px){
  .hall{margin-bottom:-17px}
  .hall+.kitchen{border-top-left-radius:0;border-top-right-radius:0}
  body[data-mode="idle"] .arena{height:230px}
}
@media (max-width:520px){
  .hall{border-radius:12px 12px 0 0;margin-bottom:-12px}
  body[data-mode="idle"] .arena{height:190px}
  body[data-mode="idle"] .scene-theo{width:98px;height:175px;bottom:6px;background-size:430px 287px;background-position:-38px 0}
  /* Во время смены кухня ужимается, чтобы зал, чеки, заказ и рабочая поверхность уместились в экран телефона. */
  body[data-mode="shift"] .kitchen-top{min-height:42px;padding-top:5px;padding-bottom:5px}
  body[data-mode="shift"] .ticket-rack{padding-top:6px;padding-bottom:5px}
  body[data-mode="shift"] .rack-head{margin-bottom:4px}
  body[data-mode="shift"] .rush-line{display:none}
  body[data-mode="shift"] .ticket-list{min-height:88px;padding-bottom:5px}
  body[data-mode="shift"] .ticket{height:84px;padding-top:7px;padding-bottom:7px}
  body[data-mode="shift"] .order-bar{min-height:0;padding-top:9px;padding-bottom:11px}
  body[data-mode="shift"] .order-card #guest-line{display:none}
  body[data-mode="shift"] .worktop-head{padding-top:6px;padding-bottom:6px}
  body[data-mode="shift"] .arena{height:262px}
  .t-name{display:none}
}
@media (prefers-reduced-motion:reduce){
  .hall *,.hall *::before,.hall *::after{animation:none!important;transition:none!important}
  .hp-pop{opacity:1}
  .hall[data-theo="busy"] .t-sweat{opacity:1}
}

/* табличка «Открываемся» не выходит за правый край плана на узком экране */
.hp-board{max-width:19%}
@media(max-width:560px){.hp-board{left:auto;right:3%;max-width:none}}