/* игра «Доктор» (doctor): стили только этой игры. Все правила через #s-doctor, классы и анимации с префиксом dr-.
   Раскладку (места и размеры в px) считает layout() в doctor.js; здесь — вид и анимации. */
#s-doctor .bg{object-position:50% 60%;transition:opacity .4s}
#s-doctor [hidden]{display:none!important}
#s-doctor .dr-fade{position:absolute;inset:0;z-index:40;background:#2b1a30;opacity:0;pointer-events:none;transition:opacity .45s}
#s-doctor .dr-fade.on{opacity:.85;pointer-events:auto}
/* the drawn things of the place answer a tap: invisible spots over them; a soft ring shows the tap */
#s-doctor .dr-props{position:absolute;inset:0;z-index:2;pointer-events:none}
#s-doctor .dr-prop{position:absolute;pointer-events:auto;touch-action:none;border-radius:50%}
#s-doctor .dr-prop.dr-tapped{animation:dr-tapring .6s ease-out}
@keyframes dr-tapring{from{box-shadow:0 0 0 0 rgba(255,255,255,.9),inset 0 0 0 100vmax rgba(255,255,255,.18)}to{box-shadow:0 0 0 3vmin rgba(255,255,255,0),inset 0 0 0 100vmax rgba(255,255,255,0)}}
#s-doctor .dr-prop.dr-hint{animation:dr-spot 1s ease-in-out infinite alternate}
@keyframes dr-spot{from{box-shadow:0 0 0 .6vmin rgba(255,214,63,.9),0 0 3vmin rgba(255,214,63,.7)}to{box-shadow:0 0 0 1.2vmin rgba(255,214,63,.5),0 0 5vmin rgba(255,214,63,.9)}}
#s-doctor .dr-lampglow{position:absolute;left:50%;top:60%;width:260%;height:260%;translate:-50% -30%;border-radius:50%;background:radial-gradient(circle,rgba(255,244,190,.75),rgba(255,236,150,.25) 45%,rgba(255,236,150,0) 70%);mix-blend-mode:screen;opacity:0;transition:opacity .25s;pointer-events:none}
#s-doctor .dr-prop.dr-on .dr-lampglow{opacity:1}
#s-doctor .dr-jumpfish{position:absolute;z-index:6;pointer-events:none;translate:-50% -50%;animation:dr-fishjump 1s ease-in-out forwards}
@keyframes dr-fishjump{0%{transform:translate(0,0) rotate(0);opacity:0}15%{opacity:1}50%{transform:translate(30%,-120%) rotate(-30deg)}100%{transform:translate(60%,0) rotate(20deg);opacity:0}}
#s-doctor .dr-frame{position:absolute;pointer-events:auto;touch-action:none;border:.9vmin solid #c98a4b;border-radius:1.4vmin;background:#fff6e8;box-shadow:0 .6vmin 1.4vmin rgba(0,0,0,.25);overflow:hidden;display:flex;flex-direction:column;align-items:center}
#s-doctor .dr-frame img{width:100%;height:84%;object-fit:cover;object-position:50% 0}
#s-doctor .dr-frame b{font-size:1.9vmin;font-weight:900;color:#5a3b1f;white-space:nowrap;line-height:1.3}
/* reception: the queue of patients */
#s-doctor .dr-queue{position:absolute;inset:0;z-index:5;pointer-events:none}
#s-doctor .dr-q{position:absolute;pointer-events:auto;touch-action:none;cursor:pointer;animation:pop-in .5s backwards;transition:scale .4s,opacity .4s}
#s-doctor .dr-q .dr-qp{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:50% 100%;filter:drop-shadow(0 1vmin .8vmin rgba(90,45,10,.3));transform-origin:50% 100%;animation:dr-wait 2.6s ease-in-out infinite}
@keyframes dr-wait{0%,100%{scale:1 1}50%{scale:1.015 .975}}
#s-doctor .dr-q .dr-qi{position:absolute;right:-4%;top:-2%;width:40%;aspect-ratio:1;border-radius:50%;background:#fff;border:.6vmin solid #ff6f91;box-shadow:0 .4vmin 1vmin rgba(0,0,0,.25);display:flex;align-items:center;justify-content:center;z-index:1}
#s-doctor .dr-q .dr-qi img{width:76%;height:76%;object-fit:contain}
#s-doctor .dr-q.dr-call{border-radius:50%;background:#fff;box-shadow:0 0 0 1vmin #ff6f91,0 1.4vmin 2.6vmin rgba(0,0,0,.25);animation:pop-in .5s backwards,dr-ring 1.6s ease-in-out infinite 1s}
@keyframes dr-ring{0%,60%,100%{rotate:0deg}65%{rotate:-8deg}70%{rotate:8deg}75%{rotate:-6deg}80%{rotate:6deg}}
#s-doctor .dr-q .dr-qf{position:absolute;inset:6%;width:88%;height:88%;border-radius:50%;object-fit:cover}
#s-doctor .dr-q .dr-ql{position:absolute;left:-14%;bottom:-8%;width:52%;aspect-ratio:1;border-radius:50%;background:#fff;border:.5vmin solid #7cc8f5;display:flex;align-items:center;justify-content:center}
#s-doctor .dr-q .dr-ql img{width:84%;height:84%;object-fit:contain}
#s-doctor .dr-q.picked{scale:1.12;z-index:2}
#s-doctor .dr-q.picked .dr-qp{filter:drop-shadow(0 0 1.4vmin #ffd23f) drop-shadow(0 1vmin .8vmin rgba(90,45,10,.3))}
#s-doctor .dr-q.away{scale:.4;opacity:0}
#s-doctor .dr-q.dr-hint .dr-qp{animation:dr-qglow 1s ease-in-out infinite alternate}
#s-doctor .dr-q.dr-call.dr-hint{animation:dr-glow 1s ease-in-out infinite alternate}
@keyframes dr-qglow{to{filter:drop-shadow(0 0 1.6vmin #ffd23f) drop-shadow(0 0 .6vmin #fff)}}
/* the patient */
#s-doctor .dr-stage{position:absolute;inset:0;z-index:3;pointer-events:none}
#s-doctor .dr-pat{position:absolute;pointer-events:none;transition:left .5s,top .5s,width .5s,height .5s}
#s-doctor .dr-pbody{position:relative;width:100%;height:100%;transform-origin:50% 96%;animation:dr-breathe 2.8s ease-in-out infinite}
#s-doctor .dr-pimg{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:50% 100%;filter:drop-shadow(0 1.4vmin 1.2vmin rgba(90,45,10,.28));transition:opacity .25s}
#s-doctor .dr-pat.fam .dr-pimg{object-fit:contain}
#s-doctor .dr-over{position:absolute;inset:0;pointer-events:none}
#s-doctor .dr-ov{position:absolute;translate:-50% -50%;pointer-events:none;filter:drop-shadow(0 .4vmin .5vmin rgba(0,0,0,.3))}
#s-doctor .dr-ov img{width:100%;height:100%;object-fit:contain;display:block}
#s-doctor .dr-ov.in{animation:pop-in .4s}
#s-doctor .dr-ov.gone{animation:dr-gone .35s forwards}
@keyframes dr-gone{to{scale:0;opacity:0}}
#s-doctor .dr-ov.dr-spot{border-radius:50%;background-size:contain;background-repeat:no-repeat;transition:opacity .15s}
#s-doctor .dr-ov.now{animation:dr-glow-sm .9s ease-in-out infinite alternate}
@keyframes dr-glow-sm{to{filter:drop-shadow(0 0 1.6vmin rgba(255,220,60,1)) drop-shadow(0 0 .6vmin #fff)}}
#s-doctor .dr-ov.dr-zone{border-radius:50%;background:radial-gradient(circle,rgba(255,236,120,.55),rgba(255,214,63,.25) 60%,rgba(255,214,63,0) 72%);border:.8vmin dashed #ffd23f;box-shadow:0 0 .5vmin rgba(30,40,60,.7),inset 0 0 .5vmin rgba(30,40,60,.5);animation:dr-pulse 1.1s ease-in-out infinite}
@keyframes dr-pulse{50%{scale:1.15;opacity:.6}}
#s-doctor .dr-ov.dr-snot{animation:dr-snot 1.6s ease-in-out infinite}
@keyframes dr-snot{50%{translate:-50% -30%;scale:1.15}}
#s-doctor .dr-ov.dr-sneeze-cloud{animation:dr-cloud .9s ease-out forwards}
@keyframes dr-cloud{from{scale:.3;opacity:1}to{scale:1.6;opacity:0;translate:-20% -80%}}
#s-doctor .dr-ov.dr-cast{animation:pop-in .5s}
#s-doctor canvas.dr-draw{position:absolute;pointer-events:none;border-radius:2vmin;z-index:2}
/* the bandage: turns around the leg (one per lap), together they are the cast */
#s-doctor .dr-ov.dr-castzone{filter:none}
#s-doctor .dr-band{position:absolute;left:-6%;right:-6%;height:15%;border-radius:1.4vmin;background:linear-gradient(#fff,#f1f4f8 60%,#d9e0e8);box-shadow:0 .3vmin .6vmin rgba(0,0,0,.22);opacity:0;scale:.5 1;transition:opacity .25s,scale .3s cubic-bezier(.3,1.5,.5,1)}
#s-doctor .dr-turns.on .dr-band{opacity:1;scale:1 1}
#s-doctor .dr-turns .dr-band:nth-child(2){transition-delay:.12s}
#s-doctor .dr-ov.dr-guide{aspect-ratio:1;height:auto!important;filter:drop-shadow(0 0 .8vmin rgba(0,0,0,.4));animation:dr-spin 3s linear infinite}
@keyframes dr-spin{to{rotate:360deg}}
/* the thermometer under the arm, the drops bottle over the nose, a falling drop, the giraffe's ladder */
#s-doctor .dr-ov.dr-thermo svg{width:100%;height:100%;display:block}
#s-doctor .dr-ov.dr-thermo{z-index:2}
.dr-drop{position:fixed;left:0;top:0;z-index:1001;width:2.6vmin;height:3.4vmin;margin:-1.7vmin 0 0 -1.3vmin;border-radius:50% 50% 50% 50% / 60% 60% 40% 40%;background:radial-gradient(circle at 35% 35%,#e6f6ff,#5ab8ff 70%);pointer-events:none}
#s-doctor .dr-ov.dr-ladder{z-index:-1}
#s-doctor .dr-ov.dr-xray{border-radius:12%;overflow:hidden;background:#06152b;box-shadow:0 0 0 .8vmin #2b4f7a,0 0 2.4vmin rgba(80,180,255,.9),inset 0 0 2.4vmin rgba(80,180,255,.6);animation:pop-in .35s,dr-xr .9s ease-in-out infinite alternate .35s;filter:none}
#s-doctor .dr-xray .dr-xr-body{position:absolute;max-width:none;object-fit:fill;filter:grayscale(1) brightness(.7) contrast(1.3) sepia(1) hue-rotate(170deg) saturate(2.6) opacity(.45)}
#s-doctor .dr-xray .dr-xr-in{position:absolute;translate:-50% -50%;display:flex;align-items:center;justify-content:center}
#s-doctor .dr-xray .dr-xr-in img,#s-doctor .dr-xray .dr-xr-in svg{width:100%;height:100%;object-fit:contain}
#s-doctor .dr-xray .dr-xr-bone img{filter:drop-shadow(0 0 1.2vmin #bfe6ff)}
#s-doctor .dr-xray .dr-xr-toy img{filter:grayscale(.3) brightness(1.3) drop-shadow(0 0 1.2vmin #fff)}
#s-doctor .dr-xray .dr-xr-ribs{opacity:.85;filter:drop-shadow(0 0 .8vmin #9fd8ff)}
#s-doctor .dr-xray::after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 0 46%,rgba(140,220,255,.35) 50%,transparent 54%);background-size:100% 220%;animation:dr-scan 1.4s linear infinite}
@keyframes dr-scan{from{background-position:0 100%}to{background-position:0 -120%}}
@keyframes dr-xr{to{box-shadow:0 0 0 .8vmin #2b4f7a,0 0 3.4vmin rgba(120,210,255,1),inset 0 0 2.4vmin rgba(80,180,255,.8)}}
#s-doctor .dr-ov.dr-lens{border-radius:50%;background:radial-gradient(circle,#ffe9c9,#f3c69a 70%);border:.8vmin solid #4a3a2a;box-shadow:0 0 0 .5vmin #fff,0 .8vmin 1.6vmin rgba(0,0,0,.3);overflow:hidden;animation:pop-in .4s}
#s-doctor .dr-ov.dr-lens img{width:60%;height:60%;margin:20%;object-fit:contain}
#s-doctor .dr-ov.dr-beam{border-radius:50%;background:radial-gradient(circle,rgba(255,250,200,.9),rgba(255,240,150,.4) 55%,rgba(255,240,150,0) 72%);animation:dr-pulse 1s ease-in-out infinite;mix-blend-mode:screen}
#s-doctor .dr-ov.dr-steam{animation:dr-steam 1.4s ease-out infinite}
@keyframes dr-steam{from{opacity:0;translate:-50% 0;scale:.5}40%{opacity:.9}to{opacity:0;translate:-50% -140%;scale:1.3}}
#s-doctor .dr-ov.dr-heat{animation:dr-heat 1.2s ease-in-out infinite}
@keyframes dr-heat{50%{scale:1.2;opacity:.5}}
/* the teeth close-up: a round dentist's mirror over the open mouth */
#s-doctor .dr-mirror{position:absolute;z-index:4;border-radius:50%;overflow:hidden;pointer-events:none;background:radial-gradient(ellipse at 50% 40%,#9a2238,#5e0f20 75%);box-shadow:0 0 0 1.4vmin #fff,0 0 0 2.3vmin #b9c9d5,0 2vmin 4vmin rgba(0,0,0,.35);animation:pop-in .45s}
#s-doctor .dr-mirror.gone{animation:dr-gone .35s forwards}
#s-doctor .dr-mirror .dr-gum{position:absolute;left:-5%;right:-5%;top:24%;height:24%;border-radius:0 0 50% 50%;background:linear-gradient(#ff9fb3,#ff7f98)}
#s-doctor .dr-mirror .dr-tongue{position:absolute;left:22%;right:22%;bottom:-6%;height:34%;border-radius:50% 50% 0 0;background:radial-gradient(ellipse at 50% 30%,#ff8fa5,#e85a78)}
#s-doctor .dr-mirror .dr-teeth{position:absolute;left:7%;right:7%;top:36%;height:30%}
#s-doctor .dr-mirror .dr-coin{position:absolute;left:37%;top:4%;width:26%;animation:dr-coin .8s cubic-bezier(.3,1.5,.5,1)}
@keyframes dr-coin{from{translate:0 -120%;opacity:0}}
#s-doctor .dr-tooth{position:absolute;width:16%;height:100%;top:0;border-radius:30% 30% 46% 46%;background:#fff;box-shadow:inset 0 -.4vmin .6vmin rgba(0,0,0,.12),0 .3vmin .5vmin rgba(0,0,0,.2);pointer-events:auto;touch-action:none;transition:scale .2s}
#s-doctor .dr-tooth i{position:absolute;left:50%;top:46%;width:66%;height:52%;translate:-50% -50%;border-radius:50%;background:#5a3b1f;opacity:0}
#s-doctor .dr-tooth.hole i{opacity:1}
#s-doctor .dr-tooth.filled i{opacity:1;background:radial-gradient(circle at 35% 35%,#ffffff,#a9c6e2 55%,#7a9cc0);box-shadow:0 0 1.2vmin #bfe6ff,inset 0 0 0 .3vmin #6f8fb0}
#s-doctor .dr-tooth.wob{animation:dr-wob .5s ease-in-out infinite}
@keyframes dr-wob{25%{rotate:-9deg}75%{rotate:9deg}}
#s-doctor .dr-tooth.no{animation:shake .45s}
#s-doctor .dr-tooth.dr-hint{animation:dr-glow-sm .9s ease-in-out infinite alternate}
/* patient reactions */
@keyframes dr-breathe{0%,100%{scale:1 1}50%{scale:1.012 .982}}
#s-doctor .dr-pat.giggle .dr-pbody{animation:dr-giggle .5s ease-in-out 2}
@keyframes dr-giggle{25%{rotate:-4deg;scale:1.03 .97}75%{rotate:4deg;scale:1.03 .97}}
#s-doctor .dr-pat.flinch .dr-pbody{animation:dr-flinch .55s ease-out}
@keyframes dr-flinch{30%{translate:0 -10%;rotate:-3deg}60%{translate:0 -3%;rotate:2deg}}
#s-doctor .dr-pat.shiver .dr-pbody{animation:dr-shiver .13s linear infinite}
@keyframes dr-shiver{0%,100%{translate:0 0}25%{translate:-1.2% 0}75%{translate:1.2% 0}}
#s-doctor .dr-pat.jump .dr-pbody{animation:dr-jump .8s ease-in-out 2}
@keyframes dr-jump{30%{scale:1.04 .94}60%{translate:0 -12%;scale:.98 1.04}}
#s-doctor .dr-pat.nod .dr-pbody{animation:dr-nod .7s ease-in-out}
@keyframes dr-nod{30%{rotate:-5deg}70%{rotate:4deg}}
#s-doctor .dr-pat.sneeze .dr-pbody{animation:dr-sneeze .7s ease-out}
@keyframes dr-sneeze{20%{scale:1.06 .94;translate:0 -4%}45%{scale:.96 1.06;translate:0 4%}}
#s-doctor .dr-pat.happy .dr-pbody{animation:dr-joy .9s ease-in-out infinite}
@keyframes dr-joy{0%,100%{scale:1 1;translate:0 0}40%{scale:1.03 .96}70%{scale:.98 1.03;translate:0 -3%}}
#s-doctor .dr-pat.bye .dr-pbody{animation:dr-bye 1.4s ease-in forwards}
@keyframes dr-bye{30%{translate:0 -6%}to{translate:70vw 0;opacity:0}}
#s-doctor .dr-pat.arrive .dr-pbody{animation:dr-arrive .9s cubic-bezier(.3,1.3,.5,1)}
@keyframes dr-arrive{from{translate:-70vw 0;opacity:0}}
#s-doctor .dr-pat.sad .dr-pimg{filter:drop-shadow(0 1.4vmin 1.2vmin rgba(90,45,10,.28)) saturate(.85)}
/* the ring of a hold */
#s-doctor .dr-ring{position:fixed;z-index:1002;pointer-events:none;translate:-50% -50%;width:22vmin;height:22vmin}
#s-doctor .dr-ring circle{fill:none;stroke-width:9;stroke-linecap:round;transform:rotate(-90deg);transform-origin:50% 50%}
#s-doctor .dr-ring .bgc{stroke:rgba(255,255,255,.7)}
#s-doctor .dr-ring .fgc{stroke:#4fc36b;stroke-dasharray:283;stroke-dashoffset:283;transition:stroke-dashoffset .1s linear}
/* the step chips at the top */
#s-doctor .dr-steps{position:absolute;z-index:8;display:flex;gap:1.2vmin;padding:1.4vmin;border-radius:7vmin;background:rgba(255,255,255,.85);box-shadow:0 .6vmin 1.6vmin rgba(0,0,0,.18);pointer-events:none;left:50%;translate:-50% 0;top:calc(2.5vmin + env(safe-area-inset-top))}
#s-doctor .dr-steps:empty{display:none}
#s-doctor .dr-chip{position:relative;width:var(--chip,9vmin);height:var(--chip,9vmin);border-radius:50%;background:#fff;box-shadow:0 .4vmin 0 #e3b26a;display:flex;align-items:center;justify-content:center;transition:scale .25s,opacity .25s;opacity:.55}
#s-doctor .dr-chip img{width:74%;height:74%;object-fit:contain}
#s-doctor .dr-chip.now{opacity:1;scale:1.14;box-shadow:0 .4vmin 0 #e3b26a,0 0 0 .7vmin #ffd23f}
#s-doctor .dr-chip.done{opacity:1}
#s-doctor .dr-chip.done:after{content:"";position:absolute;right:-12%;bottom:-10%;width:48%;height:48%;border-radius:50%;background:#4fc36b url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpath d='M28 52L44 67L73 36' fill='none' stroke='%23fff' stroke-width='14' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/80% no-repeat;border:.4vmin solid #fff;animation:pop-in .3s}
/* the medical card */
#s-doctor .dr-card{position:absolute;z-index:8;display:none;pointer-events:none;transition:left .4s,top .4s}
#s-doctor .dr-card.show{display:block;animation:dr-cardin .6s cubic-bezier(.3,1.4,.5,1)}
@keyframes dr-cardin{from{translate:40vw -10vmin;rotate:12deg;opacity:0}}
#s-doctor .dr-card .dr-cbg{width:100%;height:100%;object-fit:contain;display:block}
#s-doctor .dr-card .dr-cface{position:absolute;left:10%;top:16%;width:40%;height:50%;object-fit:contain;object-position:50% 100%}
#s-doctor .dr-card .dr-cico{position:absolute;right:8%;top:14%;width:34%;height:34%;object-fit:contain}
#s-doctor .dr-card .dr-cst{position:absolute;right:10%;bottom:10%;width:30%;height:30%}
#s-doctor .dr-card .dr-cstamp{position:absolute;left:28%;top:22%;width:50%;height:50%;object-fit:contain;display:none;rotate:-14deg}
#s-doctor .dr-card.stamped .dr-cstamp{display:block;animation:dr-stamp .45s cubic-bezier(.2,1.6,.4,1)}
@keyframes dr-stamp{from{scale:3;opacity:0}60%{scale:.9;opacity:1}}
#s-doctor .dr-card .dr-cst.fly{animation:dr-fly 1.2s ease-in forwards}
@keyframes dr-fly{30%{scale:1.6;translate:0 -4vmin}to{translate:60vw 60vh;scale:.3;opacity:0}}
/* the tray: tools and cards */
#s-doctor .dr-tray{position:absolute;inset:0;z-index:9;pointer-events:none}
#s-doctor .dr-plate{position:absolute;display:none;pointer-events:none;border-radius:4.5vmin;background:linear-gradient(165deg,#fbfdff,#dfe8ef 55%,#c9d6e0);box-shadow:inset 0 0 0 1vmin #eef4f8,inset 0 0 0 1.3vmin #b9c9d5,inset 0 -1.2vmin 2vmin rgba(60,90,120,.22),0 1vmin 0 #9fb2c1,0 2vmin 3vmin rgba(0,0,0,.28)}
#s-doctor .dr-tool{position:absolute;pointer-events:auto;touch-action:none;border-radius:30%;background:radial-gradient(circle,rgba(255,255,255,.9) 0 50%,rgba(255,255,255,.35) 72%,rgba(255,255,255,0) 74%);display:flex;align-items:center;justify-content:center;animation:pop-in .45s backwards;cursor:grab;transition:opacity .25s,scale .25s}
#s-doctor .dr-tool img{width:86%;height:86%;object-fit:contain;pointer-events:none;filter:drop-shadow(0 .8vmin .7vmin rgba(40,60,80,.35))}
#s-doctor .dr-tool.held img{opacity:.3}
#s-doctor .dr-tool.used{scale:0;opacity:0;pointer-events:none}
#s-doctor .dr-tool.dr-hint{animation:dr-glow 1s ease-in-out infinite alternate}
@keyframes dr-glow{to{box-shadow:0 0 0 1vmin #ffd23f,0 0 4vmin rgba(255,210,60,.9)}}
#s-doctor .dr-tool.no{animation:shake .45s}
#s-doctor .dr-tool.sel{box-shadow:0 0 0 1vmin #4fc36b}
#s-doctor .dr-tool.dr-card2{border-radius:30%}
#s-doctor .dr-tool.dr-card2 img{width:84%;height:84%}
#s-doctor .dr-tool.dr-ok{background:linear-gradient(#7ddf7a,#35b955);box-shadow:0 .8vmin 0 #1f8038,0 1vmin 2vmin rgba(0,0,0,.18)}
#s-doctor .dr-tool.dr-ok svg{width:60%;height:60%}
#s-doctor .dr-tool .dr-level{position:absolute;left:30%;right:30%;bottom:12%;height:0;background:#ff7fa0;border-radius:1vmin;transition:height .3s}
#s-doctor .dr-tool .dr-badge{position:absolute;right:-6%;top:-6%;min-width:34%;height:34%;border-radius:50%;background:#ff5b6e;color:#fff;font-weight:900;font-size:4vmin;display:flex;align-items:center;justify-content:center;border:.5vmin solid #fff}
.dr-ghost{position:fixed;z-index:1000;pointer-events:none;translate:-50% -50%;filter:drop-shadow(0 2vmin 2vmin rgba(0,0,0,.35));touch-action:none}
.dr-cur{position:fixed;z-index:1001;pointer-events:none;translate:-50% -50%;width:16vmin;height:16vmin;object-fit:contain;display:none;transition:rotate .2s;filter:drop-shadow(0 1.4vmin 1.4vmin rgba(0,0,0,.35))}
.dr-cur.on{display:block}
.dr-hand{position:fixed;left:0;top:0;width:13vmin;max-width:110px;z-index:1001;pointer-events:none;margin:-.5vmin 0 0 -5.6vmin;filter:drop-shadow(0 .8vmin 1.2vmin rgba(0,0,0,.45)) drop-shadow(0 0 1.2vmin rgba(255,230,90,.9))}
.dr-hand svg{display:block;width:100%;height:auto}
.dr-hand-thing{position:fixed;left:0;top:0;z-index:1000;pointer-events:none;margin:-9vmin 0 0 -7vmin;filter:drop-shadow(0 1.2vmin 1.4vmin rgba(0,0,0,.35))}
/* the pull item: stretches after the finger */
#s-doctor .dr-ov.dr-pull{pointer-events:auto;touch-action:none;cursor:grab;transition:none}
#s-doctor .dr-ov.dr-pull.now{animation:dr-glow-sm .9s ease-in-out infinite alternate}
#s-doctor .dr-ov.dr-pull.pop{animation:dr-popout .8s ease-out forwards}
@keyframes dr-popout{30%{translate:-50% -140%;scale:1.4;rotate:30deg}to{translate:60% -260%;scale:.8;rotate:200deg;opacity:0}}
/* the eye chart */
#s-doctor .dr-chart{position:absolute;pointer-events:none;border-radius:2vmin;background:#fff;box-shadow:0 1vmin 2vmin rgba(0,0,0,.25);padding:2vmin;display:grid;grid-template-columns:repeat(3,1fr);gap:1.5vmin;place-items:center;animation:pop-in .5s}
#s-doctor .dr-fig{pointer-events:auto;touch-action:none;width:100%;aspect-ratio:1;display:flex;align-items:center;justify-content:center;border-radius:20%;transition:scale .2s}
#s-doctor .dr-fig svg{width:88%;height:88%}
#s-doctor .dr-fig.no{animation:shake .45s}
#s-doctor .dr-fig.dr-hint{animation:dr-glow-sm .9s ease-in-out infinite alternate}
/* the ambulance ride */
#s-doctor .dr-ride{position:absolute;inset:0;z-index:30;display:none;overflow:hidden;background:#9fdcff url(../../img/dr_bg_road_loop.jpg) 0 100%/auto 100% repeat-x}
#s-doctor .dr-ride.show{display:block}
#s-doctor .dr-ride.go{animation:dr-road 6s linear infinite}
@keyframes dr-road{to{background-position:calc(-1 * var(--tile,320vmin)) 100%}}
#s-doctor .dr-van{position:absolute;left:18%;bottom:14%;width:46vmin;max-width:48vw;pointer-events:none}
#s-doctor .dr-van img{width:100%;display:block}
#s-doctor .dr-ride.go .dr-van{animation:dr-bounce .45s ease-in-out infinite alternate}
@keyframes dr-bounce{to{translate:0 -1.4vmin;rotate:1deg}}
#s-doctor .dr-van .dr-beacon{position:absolute;left:47%;top:3%;width:15%;height:15%;translate:-50% -50%;border-radius:50%;pointer-events:none;background:radial-gradient(circle,rgba(170,215,255,.95),rgba(60,140,255,.55) 45%,rgba(60,140,255,0) 70%);opacity:0}
#s-doctor .dr-ride.go .dr-beacon,#s-doctor .dr-ride.on .dr-beacon{animation:dr-blink .4s steps(1) infinite}
@keyframes dr-blink{50%{opacity:1}}
@media (orientation:portrait){#s-doctor .dr-van{width:64vw;max-width:none;left:8%;bottom:13%}}
#s-doctor .dr-rbtn{position:absolute;pointer-events:auto;touch-action:none;width:22vmin;height:22vmin;border-radius:50%;background:rgba(255,255,255,.9);box-shadow:0 .8vmin 0 #e3b26a,0 1vmin 2vmin rgba(0,0,0,.25);display:flex;align-items:center;justify-content:center;animation:pop-in .5s}
#s-doctor .dr-rbtn img{width:76%;height:76%;object-fit:contain}
#s-doctor .dr-rbtn.dr-hint{animation:dr-glow 1s ease-in-out infinite alternate}
#s-doctor .dr-tl{position:absolute;right:8%;bottom:28%;width:16vmin;pointer-events:auto;touch-action:none;display:none;animation:dr-tlin .6s cubic-bezier(.3,1.3,.5,1)}
#s-doctor .dr-tl.show{display:block}
#s-doctor .dr-tl img{width:100%;display:block}
@keyframes dr-tlin{from{translate:40vw 0}}
#s-doctor .dr-tl.dr-hint{animation:dr-glow-sm .9s ease-in-out infinite alternate}
/* the sticker board */
#s-doctor .dr-bookbtn{right:calc(2.5vmin + env(safe-area-inset-right));bottom:calc(2.5vmin + env(safe-area-inset-bottom));--b1:#ffd98a;--b2:#f0a53a;--b3:#b86f12;display:none}
#s-doctor .dr-bookbtn.show{display:flex}
#s-doctor .dr-bookbtn{width:17vmin;height:17vmin;max-width:110px;max-height:110px}
#s-doctor .dr-bookbtn img{width:76%;height:76%;object-fit:contain}
#s-doctor .dr-bookn{position:absolute;right:-8%;top:-8%;min-width:40%;height:40%;padding:0 .8vmin;box-sizing:border-box;border-radius:3vmin;background:#ff5b6e;color:#fff;font-weight:900;font-size:3.6vmin;display:flex;align-items:center;justify-content:center;border:.5vmin solid #fff}
#s-doctor .dr-book{position:absolute;inset:0;z-index:35;display:none;background:rgba(40,20,50,.55)}
#s-doctor .dr-book.show{display:block}
#s-doctor .dr-board{position:absolute;left:50%;top:50%;translate:-50% -50%;animation:pop-in .5s}
#s-doctor .dr-slots{position:absolute;left:9%;top:11%;right:9%;bottom:11%;display:grid;justify-content:center;align-content:center;overflow:auto}
#s-doctor .dr-tool.dr-sink img{width:92%;height:92%}
.dr-foam{position:fixed;z-index:1001;width:24vmin;translate:-50% -50%;pointer-events:none;animation:dr-foam 1.4s ease-out forwards}
@keyframes dr-foam{0%{scale:.3;opacity:0}25%{scale:1.1;opacity:1}70%{opacity:1}100%{scale:1.3;opacity:0;translate:-50% -90%}}
#s-doctor .dr-slot{width:100%;height:100%;box-sizing:border-box;border-radius:50%;background:rgba(255,255,255,.35);border:.5vmin dashed rgba(90,60,30,.4);display:flex;align-items:center;justify-content:center;pointer-events:auto;touch-action:none;position:relative}
#s-doctor .dr-slot.got{background:#fff;border:.5vmin solid #ffd23f;box-shadow:0 .6vmin 1.4vmin rgba(0,0,0,.25)}
#s-doctor .dr-slot img{width:84%;height:84%;object-fit:contain}
#s-doctor .dr-slot.got .dr-sm{position:absolute;right:-10%;bottom:-6%;width:46%;height:46%;border-radius:50%;background:#fff;border:.4vmin solid #ff6f91}
#s-doctor .dr-slot span{font-size:6vmin;font-weight:900;color:rgba(90,60,30,.45)}
#s-doctor .dr-slot.new{animation:dr-new 1s cubic-bezier(.3,1.6,.5,1)}
@keyframes dr-new{0%{scale:0}60%{scale:1.3}}
#s-doctor .dr-close{position:absolute;right:-4vmin;top:-4vmin;--b1:#ff8f8f;--b2:#e0455a;--b3:#9e2436}
/* помощник из семьи: размер и место на экране этой игры (их читает общий .helper.fam3d в core/core.css).
   Раскладка подвижная: layout() в doctor.js ставит фигуру в свободный прямоугольник через helper.place(); здесь — значения до первого расчёта. */
#s-doctor .helper.fam3d{--hp-h:44%;--hp-x:1vmin;--hp-y:1%}
@media (orientation:portrait){#s-doctor .helper.fam3d{--hp-h:28%}}

#s-doctor .dr-ov.dr-pull,#s-doctor .dr-ov.dr-spot{min-width:13vmin;min-height:13vmin}

/* 05.10 second review: small patches stay visible, the crack blinks, the used siren button goes, the ride buttons big */
#s-doctor .dr-ov.dr-wound,#s-doctor .dr-ov.dr-plaster{min-width:11vmin;min-height:11vmin}
#s-doctor .dr-xray .dr-xr-crack{animation:dr-crack .5s steps(1) infinite}
@keyframes dr-crack{50%{opacity:.2}}
#s-doctor .dr-rbtn{width:26vmin;height:26vmin}
#s-doctor .dr-rbtn.used{display:none}
#s-doctor .dr-q .dr-qi{width:46%;min-width:12vmin;min-height:12vmin}
#s-doctor .dr-tray:not(:has(.dr-tool:not(.used):not(.held),.dr-static)) .dr-plate{display:none!important}
/* ---------- 11.10: the tool in the hand — no second copy on the plate while it is carried; things that stand on the plate ---------- */
#s-doctor .dr-tool.held{visibility:hidden}
#s-doctor .dr-tool.dr-hop{animation:dr-hop .6s}
#s-doctor .dr-ring{opacity:.55;transition:opacity .2s,scale .2s}
#s-doctor .dr-ring.on{opacity:1;scale:1.08}
#s-doctor .dr-ring .bgc{stroke:rgba(255,255,255,.85);stroke-dasharray:8 7}
#s-doctor .dr-ring.on .bgc{stroke-dasharray:none}
#s-doctor .dr-static{position:absolute;pointer-events:auto;touch-action:none;display:flex;align-items:center;justify-content:center}
#s-doctor .dr-static img{width:92%;height:92%;object-fit:contain;filter:drop-shadow(0 .8vmin .7vmin rgba(40,60,80,.35))}
#s-doctor .dr-spoonrest .dr-level{position:absolute;left:24%;width:40%;top:28%;height:0;max-height:30%;border-radius:50%;background:radial-gradient(#ff9fb8,#ff5f88);transition:height .2s;opacity:.9}
#s-doctor .dr-mon{pointer-events:none}
#s-doctor .dr-sinkbox .dr-foamspot{position:absolute;width:30%;aspect-ratio:1;translate:-50% -50%;border-radius:50%;background:radial-gradient(circle at 35% 35%,#fff 0 40%,#e6f6ff 60%,rgba(220,240,255,.7) 72%,rgba(220,240,255,0) 74%);box-shadow:0 0 1.2vmin #fff;pointer-events:none;transition:opacity .15s}
#s-doctor .dr-sinkbox .dr-foamspot.gone{animation:dr-gone .35s forwards}
#s-doctor .dr-sinkbox .dr-foamspot.now{animation:dr-glow-sm .9s ease-in-out infinite alternate}
.dr-cur{transition:rotate .2s,opacity .15s}
/* the right tool is shown on the plate itself while its task is told (no flying copy) */
#s-doctor .dr-tool.dr-present{z-index:2;animation:dr-present 1.1s ease-in-out infinite alternate}
@keyframes dr-present{from{scale:1.06;box-shadow:0 0 0 .8vmin #ffd23f,0 0 3vmin rgba(255,210,60,.8)}to{scale:1.2;box-shadow:0 0 0 1.2vmin #ffd23f,0 0 5vmin rgba(255,210,60,1)}}
/* where to bring a tool: a dashed ring (drop, pull); the plate grows in with its tools */
#s-doctor .dr-ring.dr-goal .fgc{display:none}
#s-doctor .dr-ring.dr-goal{animation:dr-goal 1.2s ease-in-out infinite}
@keyframes dr-goal{50%{scale:1.12}}
#s-doctor .dr-ov.dr-pullit{min-width:10vmin;min-height:10vmin;animation:dr-glow-sm .9s ease-in-out infinite alternate}

/* the reception: the trouble badge at the bottom corner of the card, not over the patient's head */
#s-doctor .dr-q .dr-qi{top:auto;bottom:-6%;right:-6%}
/* the cast hugs the paw: a round cocoon of turns, white and plump when done */
#s-doctor .dr-ov.dr-castzone{border-radius:44% 44% 48% 48%;overflow:hidden}
#s-doctor .dr-ov.dr-castzone .dr-band{left:-12%;right:-12%;height:17%}
#s-doctor .dr-ov.dr-castzone.dr-cast{background:linear-gradient(90deg,#dfe6ee,#fff 35%,#fff 65%,#d6dee8);box-shadow:inset 0 0 1.2vmin rgba(60,80,100,.25),0 .6vmin 1.2vmin rgba(0,0,0,.25)}
/* rings are seen on a light floor too */
#s-doctor .dr-ring{filter:drop-shadow(0 0 .35vmin rgba(30,40,60,.75))}
/* the eye chart is a board with a frame */
#s-doctor .dr-chart{border:1vmin solid #c98a4b;box-shadow:inset 0 0 0 .5vmin #fff3e0,0 1vmin 2vmin rgba(0,0,0,.25)}
/* rings where to bring a tool: yellow, thick, seen on any floor */
#s-doctor .dr-ring.dr-goal .bgc{stroke:#ffd23f;stroke-width:8;stroke-dasharray:12 8}
#s-doctor .dr-ring .bgc{stroke-width:8}
#s-doctor .dr-mirror{pointer-events:auto}

/* ---------- doctor polish 14.10: game feel (classes dp-*; transform/opacity only) ---------- */
.dp-p{position:fixed;left:0;top:0;z-index:980;pointer-events:none;border-radius:50%}
.dp-p.star{border-radius:0;clip-path:polygon(50% 0,62% 36%,100% 38%,70% 60%,80% 96%,50% 74%,20% 96%,30% 60%,0 38%,38% 36%)}
.dp-p.txt{background:none!important;font-weight:900;line-height:1;text-shadow:0 .3vmin .3vmin rgba(0,0,0,.2)}
.dp-p.dp-plus{-webkit-text-stroke:max(2px,.6vmin) #e0a800;paint-order:stroke fill;text-shadow:0 .6vmin 0 #b87a00}
.dp-ring{position:fixed;left:0;top:0;z-index:979;pointer-events:none;border-radius:50%;border:max(3px,.8vmin) solid #ffe14d;box-shadow:0 0 1.6vmin rgba(255,255,255,.8)}
/* overlays over the background only (below the patient, the helper and the trays) */
#s-doctor .dp-flash,#s-doctor .dp-glow,#s-doctor .dp-rainbow{position:absolute;inset:0;pointer-events:none;opacity:0}
#s-doctor .dp-flash{z-index:10;background:#fff}
#s-doctor .dp-glow{z-index:1;background:radial-gradient(circle at 50% 55%,var(--gc,rgba(255,232,140,.9)),rgba(255,255,255,0) 64%)}
#s-doctor .dp-rainbow{z-index:1;left:0;right:auto;width:200%;background:linear-gradient(90deg,#ff5b6e,#ffc531,#4fc36b,#3fa3ff,#b26cff,#ff8fc8,#ff5b6e,#ffc531,#4fc36b,#3fa3ff,#b26cff,#ff8fc8,#ff5b6e)}
/* living background: light motes drift up in every place, butterflies only outdoors / at home */
#s-doctor .dp-motes{position:absolute;inset:0;z-index:1;pointer-events:none;overflow:hidden}
#s-doctor .dp-motes i{position:absolute;bottom:-4%;width:1.5vmin;height:1.5vmin;border-radius:50%;opacity:0;background:radial-gradient(circle,rgba(255,255,255,.95),rgba(255,247,200,.35) 55%,rgba(255,255,255,0) 72%);animation:dp-rise 10s ease-in-out infinite}
@keyframes dp-rise{0%{opacity:0;translate:0 0}15%{opacity:.85}85%{opacity:.6}100%{opacity:0;translate:var(--dx) -78vh}}
#s-doctor:not([data-place=forest]):not([data-place=zoo]):not([data-place=home]) .amb{display:none}
/* the hero is easy to find: a soft halo behind the patient, livelier when healthy */
#s-doctor .dr-pbody::before{content:"";position:absolute;left:-14%;right:-14%;top:2%;bottom:-3%;border-radius:50%;pointer-events:none;background:radial-gradient(closest-side,rgba(255,244,190,.85),rgba(255,214,150,.35) 60%,rgba(255,255,255,0));opacity:.25;animation:dp-aura 3.4s ease-in-out infinite}
#s-doctor .dr-pat.happy .dr-pbody::before{animation:dp-aura2 1.3s ease-in-out infinite}
@keyframes dp-aura{0%,100%{opacity:.22;scale:1}50%{opacity:.42;scale:1.05}}
@keyframes dp-aura2{0%,100%{opacity:.5;scale:1}50%{opacity:.85;scale:1.08}}
/* streak sign (a picture, not a voice) */
#s-doctor .dp-banner{position:absolute;left:50%;top:70%;z-index:46;pointer-events:none;white-space:nowrap;font:900 min(10vmin,60px)/1 "Arial Black",Arial,sans-serif;color:#fff;letter-spacing:.02em;
  -webkit-text-stroke:max(3px,.9vmin) #e0559c;paint-order:stroke fill;text-shadow:0 .9vmin 0 #a83a72,0 1.4vmin 2.4vmin rgba(0,0,0,.3);opacity:0}
#s-doctor .dp-banner.rec{top:calc(70% + min(12vmin,70px));font-size:min(7.5vmin,44px);color:#fff7b0;-webkit-text-stroke-color:#ff9f1c;text-shadow:0 .7vmin 0 #c96500,0 1.2vmin 2vmin rgba(0,0,0,.3)}
@media (orientation:portrait){#s-doctor .dp-banner{top:64%}#s-doctor .dp-banner.rec{top:calc(64% + min(12vmin,70px))}}
/* buttons, cards and tools press in and spring back */
#s-doctor .dr-q{transition:scale .4s cubic-bezier(.34,1.56,.64,1),opacity .4s}
#s-doctor .dr-tool,#s-doctor .dr-rbtn,#s-doctor .dr-tl,#s-doctor .dr-frame,#s-doctor .dr-slot,#s-doctor .dr-bookbtn,#s-doctor .dr-fig,#s-doctor .dr-close{transition:scale .24s cubic-bezier(.34,1.56,.64,1),opacity .25s}
#s-doctor .dr-q:active:not(.away){scale:.93;transition-duration:.08s}
#s-doctor .dr-tool:not(.dr-present):active,#s-doctor .dr-rbtn:active,#s-doctor .dr-tl:active,#s-doctor .dr-frame:active,#s-doctor .dr-slot:active,#s-doctor .dr-bookbtn:active,#s-doctor .dr-fig:active,#s-doctor .dr-close:active{scale:.92;transition-duration:.08s}
/* movements that were abrupt: the shiver is smooth, the coming of a patient overshoots a little more softly */
#s-doctor .dr-pat.shiver .dr-pbody{animation-timing-function:ease-in-out}
.dr-cur{will-change:transform}
@media (prefers-reduced-motion:reduce){#s-doctor .dp-motes,#s-doctor .amb{display:none}#s-doctor .dr-pbody::before{animation:none}}
/* ---------- end doctor polish 14.10 ---------- */