.creature-play{display:block;width:100%;height:100%;min-height:44px;padding:0;border:0;background:transparent;color:inherit;cursor:pointer;touch-action:manipulation;position:relative;pointer-events:auto;-webkit-tap-highlight-color:transparent}
.creature-play>svg{display:block;width:100%;height:auto}
.creature-play:focus-visible{outline:2px solid #e5ac42;outline-offset:4px;border-radius:20%}
.creature-play .creature-eyes{opacity:0}
.creature-play.eyes-on .creature-eyes{opacity:1}
.scene>.skull-sky{overflow:visible}.skull-track{pointer-events:none}
.creature-away,.flying-skull[hidden]{display:none!important}
.creature-surprise{position:fixed;inset:0;z-index:10000;background:rgba(6,12,8,.6);pointer-events:none;overflow:hidden}
.creature-surprise[hidden]{display:none!important}
.surprise-creature{position:absolute;filter:drop-shadow(0 6px 24px #000);}
.surprise-creature>svg{display:block;width:100%;height:auto;overflow:visible}
.surprise-creature .skull-jaw{transform-origin:300px 205px;animation:creature-yell 4s ease-in-out both}
.surprise-creature .skull-mouth{fill:#100a09;opacity:0;animation:creature-mouth 4s ease-in-out both}
.creature-eyes{fill:#ec3229;filter:drop-shadow(0 0 4px #f22620) drop-shadow(0 0 1px #ffe0b6)}
.surprise-storm{position:absolute;inset:0;opacity:0;background:radial-gradient(ellipse at 50% 45%,#d2e4e333,transparent 75%)}
.surprise-storm svg{position:absolute;width:30%;height:90%;top:0;right:6%;fill:none;stroke:#f0f7ef;stroke-width:4;filter:drop-shadow(0 0 9px #dcefff)}
.surprise-storm svg.bolt-left{left:6%;right:auto;transform:scaleX(-1)}
.creature-surprise.storming .surprise-storm{animation:creature-lightning 4s linear both}
.surprise-dismiss{position:absolute;right:16px;bottom:16px;pointer-events:auto;min-height:44px;border:1px solid #b79b66;padding:12px 18px;background:#172c20;color:#f5e9c9;font:700 14px Arial,sans-serif;cursor:pointer}
.creature-status{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip-path:inset(50%)}
@keyframes creature-yell{0%,18%,100%{transform:translateY(0) rotate(0)}30%,76%{transform:translateY(34px) rotate(5deg)}89%{transform:translateY(10px) rotate(1deg)}}
@keyframes creature-mouth{0%,18%,100%{opacity:0}30%,76%{opacity:1}89%{opacity:.4}}
@keyframes creature-lightning{0%,8%,23%,38%,53%,68%,83%,100%{opacity:0}11%,41%,71%{opacity:.85}17%,47%,77%{opacity:.24}}
@media(prefers-reduced-motion:reduce){.creature-surprise{display:none!important}.surprise-creature *{animation:none!important}}
@media print{.creature-surprise,.creature-status{display:none!important}}