.reaction-prop,.reaction-hat,.reaction-vest,.reaction-paint,.reaction-smoke,.reaction-flash,.reaction-staple,.reaction-cloth,.reaction-pest,.reaction-electric{display:none;position:absolute;pointer-events:none}
.reaction-scarf,.reaction-ice-shell,.reaction-breath{display:none;position:absolute;pointer-events:none}
.office-companion[data-reaction] .paperclip-eye:after{animation:reaction-look 2s ease-in-out infinite}
.office-companion[data-reaction][data-direct-hit=true] .paperclip-mouth{transform:rotate(-12deg);border-top:2px solid #253237;border-bottom:0}
.reaction-prop{left:34px;top:36px;z-index:4;transform-origin:4px 22px}.reaction-hat{left:2px;top:0;z-index:3}.reaction-vest{left:9px;top:36px;z-index:2}
.office-companion[data-direct-hit=true][data-reaction=hammer] .paperclip-drawing{transform-origin:50% 90%;animation:reaction-flatten 2.7s ease both}
.office-companion[data-direct-hit=true][data-reaction=hammer][data-reaction-phase=clean] .paperclip-drawing{animation:reaction-unbend 2.8s ease both}
.office-companion[data-reaction=hammer][data-reaction-phase=clean] .reaction-prop{display:block;width:7px;height:33px;background:#b08450;border:1px solid #62442b;animation:companion-fix .3s alternate infinite}
.office-companion[data-reaction=hammer] .reaction-prop:before{content:'';position:absolute;left:-7px;top:-4px;width:25px;height:11px;background:linear-gradient(#e0e9e7,#727c7d);border:1px solid #44545a}
.office-companion[data-direct-hit=true][data-reaction=fire] .paperclip-loop,.office-companion[data-direct-hit=true][data-reaction=fire] .paperclip-inner{border-color:#e55133;box-shadow:inset 1px 0 #ffc381,0 0 9px #f35a2e7d}
.office-companion[data-direct-hit=true][data-reaction=fire] .paperclip-drawing{animation:reaction-hot .3s ease infinite alternate}
.office-companion[data-reaction=grenade][data-direct-hit=true] .paperclip-drawing{animation:reaction-dizzy 1.4s ease-in-out infinite}
.office-companion[data-reaction=grenade][data-direct-hit=true] .companion-stars{display:block;animation:companion-stars 1s ease-in-out infinite alternate}
.office-companion[data-reaction=rocket][data-direct-hit=true] .paperclip-loop,.office-companion[data-reaction=rocket][data-direct-hit=true] .paperclip-inner,.office-companion[data-reaction=tesla][data-direct-hit=true] .paperclip-loop,.office-companion[data-reaction=tesla][data-direct-hit=true] .paperclip-inner{border-color:#24272a;box-shadow:inset 1px 0 #61676a,1px 1px #090d10}
.office-companion[data-reaction=rocket][data-direct-hit=true] .paperclip-eye,.office-companion[data-reaction=tesla][data-direct-hit=true] .paperclip-eye{width:18px;height:23px;top:7px;animation:reaction-stunned-blink 1.8s infinite}
.reaction-smoke{left:10px;top:-14px;width:24px;height:30px;border-radius:50%;background:radial-gradient(ellipse,#6d737685,transparent 68%);filter:blur(3px);animation:reaction-smoke 1.6s linear infinite}
.reaction-smoke:after{content:'';position:absolute;left:16px;top:-8px;width:25px;height:25px;border-radius:50%;background:#8c91914a}
.office-companion[data-direct-hit=true][data-reaction=rocket] .reaction-smoke,.office-companion[data-direct-hit=true][data-reaction=tesla] .reaction-smoke,.office-companion[data-direct-hit=true][data-reaction=fire] .reaction-smoke{display:block}
.reaction-electric{inset:-5px -4px 7px;background:#c8d7ff;clip-path:polygon(42% 0,22% 35%,42% 32%,12% 70%,34% 65%,30% 100%,73% 50%,52% 55%,78% 20%,53% 25%,64% 0);filter:drop-shadow(0 0 4px #97a9ff);opacity:0}
.office-companion[data-direct-hit=true][data-reaction=tesla] .reaction-electric{display:block;animation:reaction-current 2.2s linear 2}
.office-companion[data-reaction=tesla][data-direct-hit=true][data-reaction-phase=hit] .paperclip-drawing{animation:reaction-shock .21s steps(2,end) infinite}
.reaction-paint{inset:3px 3px 8px;background:radial-gradient(ellipse at 22% 25%,#ed4c9b 0 5px,transparent 6px),radial-gradient(ellipse at 68% 51%,#f3c948 0 8px,transparent 9px),radial-gradient(ellipse at 26% 73%,#57d5b8 0 6px,transparent 7px);border-radius:45%;z-index:3}



.office-companion[data-reaction=paintball] .eye-left{transform:rotate(-22deg) scaleY(.65)}
.reaction-cloth{left:28px;top:28px;width:25px;height:23px;border:1px solid #718d87;background:repeating-linear-gradient(90deg,#d8e9da 0 4px,#abbfba 4px 5px);border-radius:3px;z-index:5;animation:reaction-self-wipe .55s ease-in-out infinite alternate}
.office-companion[data-direct-hit=true][data-reaction-phase=clean] .reaction-cloth,.office-companion[data-reaction=sponge][data-direct-hit=true] .reaction-cloth{display:block}
.office-companion[data-reaction=hammer] .reaction-cloth,.office-companion[data-reaction=laser] .reaction-cloth,.office-companion[data-reaction=shotgun] .reaction-cloth,.office-companion[data-reaction=gun] .reaction-cloth,.office-companion[data-reaction=grenade] .reaction-cloth,.office-companion[data-reaction=freeze] .reaction-cloth,.office-companion[data-reaction=chainsaw-help] .reaction-cloth,.office-companion[data-reaction=chainsaw-run] .reaction-cloth,.office-companion[data-reaction=railgun] .reaction-cloth{display:none!important}
.office-companion[data-reaction=paintball] .reaction-cloth,.office-companion[data-reaction=sponge] .reaction-cloth{background:radial-gradient(ellipse at 25% 25%,#ad9042 1px,transparent 2px),#efcb70;border-color:#8e7537;box-shadow:0 3px #3b7659}
.office-companion[data-reaction=laser][data-direct-hit=true] .reaction-prop{display:block;left:34px;top:17px;width:25px;height:38px;border:3px ridge #d6c7a5;border-radius:50%;background:linear-gradient(125deg,#b8cad0 15%,#fcffff 35%,#8eafb5 43%,#e5f7fb 60%,#93acb6);box-shadow:0 0 6px #ffc1d8;transform:rotate(-30deg)}
.office-companion[data-reaction=laser][data-direct-hit=true] .reaction-prop:after{content:'';position:absolute;top:33px;left:8px;width:5px;height:17px;background:#b6a37d;border:1px solid #67563d}
.office-companion[data-reaction=shotgun][data-direct-hit=true] .paperclip-drawing{transform-origin:bottom;animation:reaction-dodge 1.2s ease-in-out infinite}
.office-companion[data-reaction=revolver][data-direct-hit=true][data-reaction-phase=hit] .paperclip-drawing,.office-companion[data-reaction=revolver][data-direct-hit=true][data-reaction-phase=dive] .paperclip-drawing{opacity:0}
.office-companion[data-reaction=revolver][data-direct-hit=true][data-reaction-phase=emerge] .paperclip-drawing{animation:reaction-hole-pop 1.2s ease both}
.office-companion[data-reaction=bugs] .reaction-prop{display:block;width:14px;height:30px;border:1px solid #546d4c;border-radius:3px;background:linear-gradient(#a9bdb3 0 13%,#d0bc69 14% 75%,#708166 76%);transform:rotate(-25deg)}
.office-companion[data-reaction=bugs][data-reaction-phase=spray] .reaction-flash{display:block;left:45px;top:12px;width:38px;height:19px;border-radius:50%;background:radial-gradient(ellipse,#e1e9be8a,transparent 70%);animation:reaction-smoke .6s linear infinite}
.office-companion[data-reaction=bugs][data-reaction-phase=swat] .reaction-prop{width:5px;height:37px;background:#bd9272;animation:companion-fix .3s ease-in-out infinite alternate}
.office-companion[data-reaction=bugs][data-reaction-phase=swat] .reaction-prop:before{content:'';position:absolute;left:-8px;top:-9px;width:22px;height:23px;border:2px solid #548c83;background:repeating-linear-gradient(0deg,transparent 0 4px,#518479 4px 5px),repeating-linear-gradient(90deg,transparent 0 4px,#518479 4px 5px)}
.office-companion[data-reaction=bugs] .reaction-pest{display:block;left:10px;top:60px;width:8px;height:5px;border-radius:50%;background:#78613a;box-shadow:-3px -3px 0 -2px #514325,3px 3px 0 -2px #514325;animation:reaction-pest 2.5s linear infinite}
.office-companion[data-reaction=freeze][data-direct-hit=true] .paperclip-loop,.office-companion[data-reaction=freeze][data-direct-hit=true] .paperclip-inner{border-color:#76c4eb;box-shadow:inset 2px 0 #d6f4ff,2px 1px #e5faff}
.office-companion[data-reaction=freeze][data-direct-hit=true] .paperclip-drawing{animation:reaction-shiver .3s ease-in-out infinite alternate}
.office-companion[data-reaction=freeze][data-direct-hit=true] .reaction-hat{display:block;left:5px;top:-20px;width:0;height:0;border-left:18px solid transparent;border-right:14px solid transparent;border-bottom:27px solid #bc393e;transform:rotate(9deg)}
.office-companion[data-reaction=freeze] .reaction-hat:after{content:'';position:absolute;top:23px;left:-20px;width:39px;height:8px;border-radius:4px;background:#ecf4f2;box-shadow:12px -26px 0 -1px #f7fff8}
.office-companion[data-reaction=freeze][data-direct-hit=true] .reaction-paint{display:block;inset:20px 3px 2px;background:linear-gradient(120deg,transparent 30%,#d4f3ff94 31% 35%,transparent 36% 60%,#cbeeff8a 61% 66%,transparent 67%);border-bottom:6px dashed #c3e9f5}
.office-companion[data-reaction=acid][data-direct-hit=true] .reaction-paint{display:block;background:radial-gradient(ellipse at 68% 31%,#afdd519e 0 4px,transparent 5px),radial-gradient(ellipse at 36% 72%,#b5e551a8 0 6px,transparent 7px)}
.office-companion[data-reaction=acid][data-reaction-phase=clean] .reaction-cloth{animation:reaction-cloth-melt 3s ease both}
.office-companion[data-reaction=stapler][data-direct-hit=true] .reaction-staple{display:block;left:4px;top:37px;width:40px;height:15px;border:3px solid #b5c6c6;border-bottom:0;box-shadow:-1px -1px #fff,1px 1px #43595b;z-index:5}
.office-companion[data-reaction=stapler][data-direct-hit=true][data-reaction-phase=hit] .paperclip-drawing{animation:reaction-staple-tug .3s ease-in-out infinite alternate}
.office-companion[data-reaction=stapler][data-direct-hit=true][data-reaction-phase=drop] .reaction-staple{animation:reaction-staple-fall 1s ease-in both}
.office-companion[data-reaction=stapler][data-direct-hit=true][data-reaction-phase=drop] .paperclip-drawing{animation:reaction-fall 1s ease both}
.office-companion[data-reaction=gun] .reaction-hat{display:block;width:41px;height:9px;background:#b43437;border:1px solid #681d22;transform:rotate(-6deg)}
.office-companion[data-reaction=gun] .reaction-hat:after{content:'';position:absolute;right:-13px;top:5px;width:17px;height:7px;background:#af3031;transform:rotate(30deg)}
.office-companion[data-reaction=gun] .reaction-vest{display:block;width:32px;height:33px;background:repeating-linear-gradient(70deg,#334c37 0 8px,#687952 8px 14px,#8a8e58 15px 18px);border:1px solid #1c372e;border-radius:5px}
.office-companion[data-reaction=gun][data-costume=cyborg] .reaction-hat{background:#1c2429;height:16px;border-color:#555;top:4px}.office-companion[data-reaction=gun][data-costume=cyborg] .reaction-hat:after{width:7px;height:5px;background:#ff4343;right:7px;top:5px;box-shadow:0 0 5px #f33}
.office-companion[data-reaction=gun][data-costume=cyborg] .reaction-vest{background:linear-gradient(90deg,#20282d,#4a5157,#20282d)}
.office-companion[data-reaction=chainsaw-help] .reaction-hat{display:block;left:5px;top:5px;width:38px;height:32px;background:radial-gradient(ellipse at 25% 35%,#17211f 0 4px,transparent 5px),radial-gradient(ellipse at 70% 35%,#17211f 0 4px,transparent 5px),#d5c9a6;border:1px solid #695e43;border-radius:9px}
.office-companion[data-reaction=chainsaw-help] .reaction-prop{display:block;left:27px;top:45px;width:57px;height:17px;border:3px dotted #6e7e80;border-radius:9px;background:linear-gradient(90deg,#b57834 25%,#c9d1cc 26%);animation:reaction-recoil .25s infinite}
.office-companion[data-reaction=chainsaw-run] .paperclip-drawing{animation:reaction-hot .23s infinite alternate}
.office-companion[data-reaction=water][data-direct-hit=true] .paperclip-loop,.office-companion[data-reaction=water][data-direct-hit=true] .paperclip-inner{border-color:#af8154;box-shadow:inset 1px 0 #d4a76f,1px 0 #855b3f}
.office-companion[data-reaction=water][data-direct-hit=true] .reaction-paint{display:block;background:radial-gradient(ellipse at 22% 28%,#98dbefb3 0 3px,transparent 4px),radial-gradient(ellipse at 74% 58%,#98dbefb3 0 4px,transparent 5px),radial-gradient(ellipse at 30% 86%,#98dbefb3 0 3px,transparent 4px);animation:reaction-drips 1.3s linear infinite}
.office-companion[data-reaction=water][data-reaction-phase=clean] .reaction-paint{animation:reaction-wipe-away 3s both}
.office-companion[data-reaction=railgun][data-direct-hit=true] .paperclip-loop{border-style:dashed;border-color:#8ed5e7;box-shadow:0 0 8px #a3f1ff}.office-companion[data-reaction=railgun][data-direct-hit=true] .paperclip-drawing{animation:reaction-dizzy 1.3s infinite}
@keyframes reaction-look{0%,100%{translate:0 0}50%{translate:3px 1px}}
@keyframes reaction-flatten{0%{transform:scale(1)}15%,75%,100%{transform:scale(1.6,.35) rotate(-12deg)}}
@keyframes reaction-unbend{0%{transform:scale(1.6,.35) rotate(-12deg)}35%{transform:scale(1.2,.7) rotate(7deg)}70%{transform:scale(.9,1.1) rotate(-5deg)}100%{transform:none}}
@keyframes reaction-hot{to{transform:rotate(12deg) translateY(-5px)}}
@keyframes reaction-dizzy{0%,100%{transform:rotate(-14deg)}50%{transform:rotate(17deg) translateX(4px)}}
@keyframes reaction-stunned-blink{0%,65%,80%,100%{scale:1 1}72%{scale:1 .15}}
@keyframes reaction-smoke{0%{opacity:.1;transform:translateY(0) scale(.6)}45%{opacity:.8}100%{opacity:0;transform:translateY(-32px) scale(1.5)}}
@keyframes reaction-current{0%,35%,66%,100%{opacity:0}12%,44%,76%{opacity:.8}20%,52%,84%{opacity:0}}
@keyframes reaction-shock{to{transform:translateX(3px) rotate(5deg)}}
@keyframes reaction-wipe-away{to{opacity:0;clip-path:inset(100% 0 0)}}
@keyframes reaction-self-wipe{from{transform:translate(-10px,-12px) rotate(-20deg)}to{transform:translate(-19px,20px) rotate(20deg)}}
@keyframes reaction-dodge{0%,100%{transform:skewX(-28deg) scaleX(.8)}50%{transform:skewX(28deg) scaleX(.7) translateX(-12px)}}
@keyframes reaction-hole-pop{0%{opacity:0;transform:translateY(47px) scale(.3);clip-path:inset(0 0 75%)}30%{opacity:1}100%{transform:none;clip-path:inset(0)}}
@keyframes reaction-pest{0%{transform:translate(0,0)}50%{transform:translate(27px,-37px)}100%{transform:translate(-8px,-55px)}}
@keyframes reaction-shiver{from{translate:-2px 0}to{translate:2px 0}}
@keyframes reaction-cloth-melt{0%{transform:translate(-12px,-8px)}40%{transform:translate(-10px,7px) scaleY(.9)}100%{opacity:0;transform:translate(-12px,28px) scale(.2,1.4);clip-path:inset(75% 0 0)}}
@keyframes reaction-staple-tug{to{transform:skewX(12deg) translateY(3px)}}
@keyframes reaction-staple-fall{to{opacity:0;transform:translate(15px,65px) rotate(140deg)}}
@keyframes reaction-fall{0%{transform:translateY(-7px)}55%{transform:translateY(22px) rotate(20deg)}80%{transform:translateY(-7px) rotate(-10deg)}100%{transform:none}}
@keyframes reaction-recoil{50%{transform:translateX(-3px) rotate(-4deg)}}
@keyframes reaction-drips{to{transform:translateY(16px);opacity:.2}}
@media(prefers-reduced-motion:reduce){.office-companion[data-reaction] .paperclip-drawing,.office-companion[data-reaction] i,.office-companion[data-reaction] i:after{animation:none!important}.office-companion[data-reaction=hammer][data-direct-hit=true][data-reaction-phase=hit] .paperclip-drawing{transform:scale(1.5,.5);transform-origin:bottom}.office-companion[data-reaction=tesla] .reaction-electric{opacity:.35}.office-companion[data-reaction=shotgun][data-direct-hit=true] .paperclip-drawing{transform:skewX(-20deg)}.office-companion[data-reaction=acid][data-reaction-phase=clean] .reaction-cloth{opacity:.4;scale:.6}.office-companion[data-reaction=paintball][data-reaction-phase=clean] .reaction-paint{opacity:.3}}

/* Clear silhouettes and readable stage business at the companion's native scale. */
.reaction-paint-layer{display:none;position:absolute;inset:3px 2px 8px;z-index:4;border-radius:43%;pointer-events:none;filter:drop-shadow(0 1px 0 #20312640)}
.reaction-arm,.reaction-suds,.reaction-bandolier,.reaction-muzzle,.reaction-saw-dust{display:none;position:absolute;pointer-events:none}
.reaction-caption{display:none;position:absolute;right:4px;top:85px;white-space:nowrap;padding:3px 5px;background:#18251ee8;border:1px solid #c1b478;color:#f4e1ad;box-shadow:1px 2px #07100c66;font:bold 8px/1.2 'Courier New',monospace;letter-spacing:.3px;transform:rotate(6deg);z-index:7}
.companion-left .reaction-caption{right:auto;left:0}
.office-companion[data-reaction=gun] .reaction-vest{left:-4px;top:31px;width:62px;height:58px;border:0;border-radius:0;background:center/contain no-repeat url('companion-assets/commando.svg');z-index:3}
.office-companion[data-reaction=gun][data-costume=cyborg] .reaction-vest{background:center/contain no-repeat url('companion-assets/cyborg.svg')}
.office-companion[data-reaction=gun] .reaction-hat{left:0;top:1px;width:47px;height:11px;background:linear-gradient(#de6752,#8e292a);border:1px solid #64242a;box-shadow:0 2px #35262266;z-index:5}
.office-companion[data-reaction=gun] .reaction-hat:after{right:-17px;top:7px;width:24px;height:9px;clip-path:polygon(0 0,100% 15%,78% 60%,100% 100%,7% 80%);background:#b63733;animation:companion-bandana .6s ease-in-out alternate infinite}
.office-companion[data-reaction=gun][data-costume=cyborg] .reaction-hat{top:10px;left:0;width:47px;height:17px;background:linear-gradient(#87928f 0 10%,#131c22 12% 85%,#404f52 86%);border-color:#111d23;border-radius:4px;clip-path:polygon(0 0,100% 0,95% 90%,60% 95%,54% 38%,46% 38%,40% 95%,5% 90%)}
.office-companion[data-reaction=gun][data-costume=cyborg] .reaction-hat:after{right:5px;top:6px;width:8px;height:5px;clip-path:none;background:#f34f36;box-shadow:0 0 8px #ff553b;animation:none;transform:none}
.office-companion[data-reaction=gun][data-companion-firing=true] .reaction-muzzle{display:block;left:-81px;top:52px;width:30px;height:24px;background:radial-gradient(ellipse,#fff8d5 0 20%,#ffbb5c 30%,#e6792d00 73%);clip-path:polygon(100% 34%,51% 24%,19% 0,31% 35%,0 50%,32% 63%,18% 100%,58% 76%,100% 68%);z-index:6}
.office-companion[data-reaction=chainsaw-help] .reaction-hat{left:-1px;top:0;width:52px;height:57px;background:center/contain no-repeat url('companion-assets/mask.svg');border:0;border-radius:0;z-index:5}
.office-companion[data-reaction=chainsaw-help] .reaction-vest{display:block;left:4px;top:37px;width:45px;height:46px;background:linear-gradient(90deg,#695c40,#aa9b72,#716148);border:1px solid #493e2d;clip-path:polygon(15% 0,85% 0,100% 100%,0 100%)}
.office-companion[data-reaction=chainsaw-help] .reaction-vest:after{content:'';position:absolute;left:7px;top:13px;width:27px;height:19px;border:1px dashed #554c33;background:#7d765933}
.office-companion[data-reaction=chainsaw-help] .reaction-prop{left:-64px;top:38px;width:114px;height:66px;background:center/contain no-repeat url('companion-assets/chainsaw.svg');border:0;border-radius:0;z-index:6;animation:companion-saw-rumble .11s steps(2,end) infinite}
.office-companion[data-reaction=chainsaw-help] .reaction-saw-dust{display:block;left:-65px;top:74px;width:56px;height:23px;background:radial-gradient(circle at 10% 40%,#e2d8ad 0 1px,transparent 2px),radial-gradient(circle at 50% 5%,#ced6c3 0 2px,transparent 3px),radial-gradient(circle at 70% 70%,#c1cbbb 0 1px,transparent 2px);animation:companion-chip-spray .35s linear infinite}
.office-companion[data-reaction=bugs] .reaction-prop{left:35px;top:24px;width:34px;height:54px;border:0;background:center/contain no-repeat url('companion-assets/pest-spray.svg');transform:rotate(18deg);z-index:6;animation:companion-spray-aim .9s ease-in-out infinite alternate}
.office-companion[data-reaction=bugs][data-reaction-phase=spray] .reaction-flash{left:61px;top:17px;width:77px;height:43px;transform-origin:left center;border-radius:0;clip-path:polygon(0 39%,100% 0,100% 100%,0 52%);background:radial-gradient(ellipse at left,#f1f5d9b3,#b4d19c60 48%,transparent 74%);animation:companion-spray-cloud .45s linear infinite;z-index:5}
.office-companion[data-reaction=bugs][data-reaction-phase=swat] .reaction-prop{left:45px;top:33px;width:6px;height:47px;background:linear-gradient(90deg,#496a61,#a0bc92,#365e54);border:1px solid #2d5c50;border-radius:3px;transform-origin:50% 90%;animation:companion-swat-big .65s ease-in-out infinite}
.office-companion[data-reaction=bugs][data-reaction-phase=swat] .reaction-prop:before{left:-15px;top:-20px;width:33px;height:34px;border:3px solid #4f9582;border-radius:5px;background:repeating-linear-gradient(0deg,transparent 0 4px,#b2dac9 4px 5px),repeating-linear-gradient(90deg,#e4f7dd42 0 4px,#73ad99 4px 5px);box-shadow:inset 0 0 0 1px #264d42,1px 2px #203a3055}
.office-companion[data-reaction=bugs] .reaction-pest{left:52px;top:72px;width:11px;height:7px;background:#544730;border:1px solid #282b20;box-shadow:-4px -3px 0 -2px #344636,4px 3px 0 -2px #344636;animation:companion-pest-escape 1.6s linear infinite}
.office-companion[data-reaction=bugs] .reaction-arm{display:block;left:30px;top:50px;width:22px;height:6px;background:linear-gradient(#d4dbcb,#768a87);border:1px solid #4e6260;border-radius:5px;transform:rotate(-20deg);z-index:4}
.office-companion[data-reaction=paintball] .reaction-cloth,.office-companion[data-reaction=sponge] .reaction-cloth{width:32px;height:22px;left:24px;top:21px;background:radial-gradient(circle at 20% 28%,#947433 0 1.4px,transparent 2px),radial-gradient(circle at 70% 64%,#9f783a 0 1.8px,transparent 2.5px),radial-gradient(circle at 43% 55%,#f5e2a0 0 2px,transparent 3px),linear-gradient(#fae2a3,#cda44d);border:1px solid #8a6b39;box-shadow:0 4px #3f7962,inset 1px 1px #fff4b8;animation:companion-scrub-self 1.1s ease-in-out infinite}
.office-companion[data-reaction=paintball] .reaction-cloth:after,.office-companion[data-reaction=sponge] .reaction-cloth:after{content:'';position:absolute;left:3px;top:3px;width:15px;height:8px;background:var(--companion-paint,#deddb9);opacity:.65;border-radius:50%;box-shadow:10px 6px 0 -2px var(--companion-paint,#deddb9)}
.office-companion[data-direct-hit=true][data-reaction-phase=clean] .reaction-suds,.office-companion[data-direct-hit=true][data-reaction=sponge] .reaction-suds{display:block;left:6px;top:25px;width:43px;height:35px;background:radial-gradient(circle at 12% 36%,#effff2bb 0 3px,#b5e6d17d 4px,transparent 5px),radial-gradient(circle at 63% 16%,#fafff3d9 0 4px,transparent 5px),radial-gradient(circle at 75% 68%,#e7fff3ba 0 3px,transparent 4px),radial-gradient(circle at 32% 85%,#edfffb 0 2px,transparent 3px);z-index:5;animation:companion-foam-rise 1s linear infinite}
.office-companion[data-reaction=paintball][data-reaction-phase=clean] .reaction-arm,.office-companion[data-reaction=sponge] .reaction-arm{display:block;left:17px;top:43px;width:25px;height:6px;border:1px solid #50676a;background:linear-gradient(#dce5d9,#7d9591);border-radius:5px;transform-origin:left;animation:companion-scrub-arm 1.1s ease-in-out infinite;z-index:4}
@keyframes companion-bandana{to{transform:rotate(-12deg) translateY(-3px)}}
@keyframes companion-gun-kick{to{transform:translateX(3px) rotate(2deg)}}
@keyframes companion-saw-rumble{to{transform:translate(-1px,1px) rotate(-2deg)}}
@keyframes companion-chip-spray{to{transform:translate(-20px,17px);opacity:0}}
@keyframes companion-spray-aim{to{transform:rotate(-12deg) translateY(-4px)}}
@keyframes companion-spray-cloud{from{scale:.7 .6;opacity:.3}to{scale:1.1 1;opacity:0}}
@keyframes companion-swat-big{0%,30%{transform:rotate(-45deg)}45%,58%{transform:rotate(75deg) translate(7px,3px)}75%,100%{transform:rotate(-45deg)}}
@keyframes companion-pest-escape{0%{transform:translate(4px,0)}45%{transform:translate(54px,-12px)}55%{transform:translate(50px,-24px)}100%{transform:translate(5px,-47px)}}
@keyframes companion-scrub-self{0%,100%{transform:translate(-10px,-4px) rotate(-12deg)}25%{transform:translate(0,17px) rotate(15deg)}50%{transform:translate(-24px,25px) rotate(-18deg)}75%{transform:translate(-20px,-9px) rotate(18deg)}}
@keyframes companion-scrub-arm{0%,100%{transform:rotate(-40deg)}25%{transform:rotate(20deg)}50%{transform:rotate(95deg)}75%{transform:rotate(-70deg)}}
@keyframes companion-foam-rise{from{opacity:.8;transform:translateY(4px)}to{opacity:0;transform:translateY(-16px)}}
@media(prefers-reduced-motion:reduce){.office-companion .reaction-prop,.office-companion .reaction-hat:after,.office-companion .reaction-arm,.office-companion .reaction-flash,.office-companion .reaction-suds,.office-companion .reaction-saw-dust,.office-companion .reaction-pest{animation:none!important}.office-companion .reaction-muzzle{opacity:.25}}
/* The cold progresses from protective clothing to an ice block, then a visible thaw. */
.office-companion[data-reaction=freeze] .reaction-scarf{display:block;left:1px;top:30px;width:48px;height:13px;border:1px solid #8e3538;border-radius:7px;background:repeating-linear-gradient(90deg,#ce5352 0 8px,#f3cf86 8px 11px,#aa353d 11px 15px);box-shadow:0 2px 2px #32455155;z-index:5}
.office-companion[data-reaction=freeze] .reaction-scarf:after{content:'';position:absolute;left:31px;top:8px;width:14px;height:32px;border-radius:0 0 4px 4px;border-bottom:4px dashed #dfae69;background:repeating-linear-gradient(#bb3d45 0 8px,#e4b672 8px 11px);transform:rotate(-12deg);transform-origin:top}
.office-companion[data-reaction=freeze] .reaction-breath{display:block;left:27px;top:24px;width:28px;height:16px;border-radius:50%;background:radial-gradient(ellipse,#f1fcffb3,#d3f0ff55 40%,transparent 72%);z-index:6;animation:companion-cold-breath 1.8s ease-out infinite}
.office-companion[data-reaction=freeze][data-cold-style=winter] .reaction-hat{left:0;top:-16px;width:47px;height:25px;border:2px solid #a9c5c9;border-radius:50% 50% 3px 3px;background:repeating-linear-gradient(90deg,#54929d 0 3px,#77b3bd 3px 5px);transform:rotate(-5deg)}
.office-companion[data-reaction=freeze][data-cold-style=winter] .reaction-hat:after{top:19px;left:-2px;width:48px;height:9px;background:#cbe2de;box-shadow:0 -27px 0 -1px #d9e9df}
.office-companion[data-reaction=freeze][data-reaction-phase=shiver] .paperclip-mouth{height:8px;width:21px;border:1px solid #567d91;border-radius:2px;background:repeating-linear-gradient(90deg,#f1fbff 0 4px,#728ea0 4px 5px);animation:companion-teeth .15s steps(2,end) infinite}
.office-companion[data-reaction=freeze][data-reaction-phase=frozen] .reaction-ice-shell{display:block;left:-13px;top:-22px;width:80px;height:117px;border:2px solid #dcf8ff;border-radius:8px 19px 12px 9px;background:linear-gradient(122deg,#e8fbff85 0 12%,#8bb9db44 13% 32%,#f2fdff9c 33% 36%,#79b2d544 37% 67%,#def9ff80 68% 70%,#a1d4eb55 71%),repeating-linear-gradient(61deg,transparent 0 21px,#e2fbff73 22px 23px,transparent 24px 45px);box-shadow:inset 4px 3px 8px #f4ffffaa,inset -6px -4px 12px #548da699,0 5px 1px #1b3d4444;clip-path:polygon(11% 0,78% 0,100% 14%,96% 91%,83% 100%,3% 96%,0 16%);z-index:9}
.office-companion[data-reaction=freeze][data-reaction-phase=frozen] .reaction-ice-shell:after{content:'';position:absolute;inset:17px 12px;background:linear-gradient(109deg,transparent 47%,#f6ffff 48% 49%,transparent 50%),linear-gradient(37deg,transparent 37%,#d9f8ffd9 38% 39%,transparent 40%);opacity:.75}
.office-companion[data-reaction=freeze][data-reaction-phase=frozen] .paperclip-drawing{animation:companion-ice-wobble 2.3s ease-in-out infinite}
.office-companion[data-reaction=freeze][data-reaction-phase=frozen] .paperclip-eye{height:25px;top:5px;animation:reaction-stunned-blink 3s infinite}
.office-companion[data-reaction=freeze][data-reaction-phase=frozen] .reaction-breath{display:none}
.office-companion[data-reaction=freeze][data-reaction-phase=warm] .paperclip-drawing{animation:none}
.office-companion[data-reaction=freeze][data-reaction-phase=warm] .paperclip-loop,.office-companion[data-reaction=freeze][data-reaction-phase=warm] .paperclip-inner{transition:border-color 2s,box-shadow 2s;border-color:#a9babc;box-shadow:inset 2px 0 #e4f5f1,1px 1px #4e676d}
.office-companion[data-reaction=freeze][data-reaction-phase=warm] .reaction-paint{opacity:.35;animation:reaction-drips 1.3s linear infinite}
.office-companion[data-reaction=freeze][data-reaction-phase=warm] .reaction-prop{display:block;left:22px;top:32px;width:27px;height:26px;background:linear-gradient(90deg,#a34a2b,#e38d56 45%,#b96137);border:2px solid #78452d;border-radius:3px 3px 9px 9px;box-shadow:inset 0 3px #5d3527;z-index:7;animation:companion-warm-sip 2.5s ease-in-out infinite}
.office-companion[data-reaction=freeze][data-reaction-phase=warm] .reaction-prop:after{content:'';position:absolute;right:-11px;top:4px;width:10px;height:15px;border:3px solid #b76440;border-left:0;border-radius:0 7px 7px 0}
.office-companion[data-reaction=freeze][data-reaction-phase=warm] .reaction-prop:before{content:'';position:absolute;left:4px;top:-22px;width:18px;height:21px;background:linear-gradient(90deg,transparent 15%,#f5f5e77d 20% 27%,transparent 34% 58%,#fff8e690 65% 72%,transparent 80%);border-radius:50%;filter:blur(1px);animation:companion-cold-breath 2s ease-out infinite}
.office-companion[data-reaction=freeze][data-reaction-phase=warm] .reaction-arm{display:block;left:12px;top:47px;width:24px;height:6px;border:1px solid #586f76;border-radius:7px;background:linear-gradient(#d7e7e7,#7c999e);z-index:6}
.office-companion[data-reaction=freeze][data-reaction-phase=warm][data-cold-style=dryer] .reaction-prop{left:35px;top:38px;width:34px;height:20px;border:2px solid #8c5b2e;border-radius:6px 12px 12px 6px;background:linear-gradient(#f1b35f,#bc7638);box-shadow:inset -5px 0 #4e6269;transform:rotate(-25deg);animation:companion-dryer-aim 1.8s ease-in-out infinite alternate}
.office-companion[data-reaction=freeze][data-reaction-phase=warm][data-cold-style=dryer] .reaction-prop:after{right:7px;top:15px;width:10px;height:21px;border:1px solid #805735;border-radius:0 0 4px 4px;background:#c58e55;transform:rotate(-12deg)}
.office-companion[data-reaction=freeze][data-reaction-phase=warm][data-cold-style=dryer] .reaction-prop:before{left:-28px;top:-7px;width:29px;height:28px;background:repeating-linear-gradient(0deg,transparent 0 5px,#f7dc8e70 6px 7px,transparent 8px 10px);clip-path:polygon(100% 25%,0 0,0 100%,100% 70%);filter:none;animation:companion-heater-air .6s ease-in-out infinite alternate}
@keyframes companion-cold-breath{0%{opacity:0;transform:translate(0,0) scale(.45)}25%{opacity:.8}100%{opacity:0;transform:translate(13px,-15px) scale(1.4)}}
@keyframes companion-teeth{to{transform:translateY(2px)}}
@keyframes companion-ice-wobble{0%,65%,100%{transform:rotate(0)}72%{transform:rotate(-3deg)}80%{transform:rotate(2deg)}90%{transform:rotate(-1deg)}}
@keyframes companion-warm-sip{0%,20%,100%{transform:translate(0,0) rotate(0)}45%,65%{transform:translate(-4px,-10px) rotate(-12deg)}}
@keyframes companion-dryer-aim{to{transform:rotate(-50deg) translate(-3px,-4px)}}
@keyframes companion-heater-air{to{opacity:.35;transform:scaleX(1.2)}}
@media(prefers-reduced-motion:reduce){.office-companion[data-reaction=freeze] .paperclip-drawing,.office-companion[data-reaction=freeze] i,.office-companion[data-reaction=freeze] i:after,.office-companion[data-reaction=freeze] i:before{animation:none!important;transition:none!important}.office-companion[data-reaction=freeze] .reaction-breath{opacity:.4}}

/* Combat owns the body, outfit and gun; the bubble stays readable when facing right. */
.office-companion[data-reaction] .adaptive-gear{display:none!important}
.office-companion[data-reaction=gun]{transform:scale(var(--work-scale,1))!important;transform-origin:bottom center;transition:none}
.office-companion[data-reaction=gun] .paperclip-drawing{animation:none;transform-origin:25px 41px;transform:none}
.office-companion[data-reaction=gun][data-gun-facing=right] .paperclip-drawing{transform:scaleX(-1)}
.office-companion[data-reaction=gun] :is(.reaction-suds,.reaction-prop){display:none!important}
.reaction-gun{display:none;position:absolute;inset:0;pointer-events:none;z-index:6;transform-origin:32px 64px;transform:rotate(var(--gun-angle,0rad))}
.office-companion[data-reaction=gun] .reaction-gun{display:block}
.reaction-gun-body{position:absolute;left:-57px;top:41px;width:112px;height:52px;background:center/contain no-repeat url('companion-assets/minigun.svg');transform-origin:89px 23px;filter:drop-shadow(1px 2px #07141b66)}
.office-companion[data-companion-firing=true] .reaction-gun-body{animation:companion-gun-kick .09s steps(2,end) infinite}
@media(prefers-reduced-motion:reduce){.office-companion .reaction-gun-body{animation:none!important}}