.turn-controls{display:inline-flex;align-items:center;justify-content:center;gap:10px;max-width:100%;vertical-align:middle}
.turn-controls[hidden]{display:none}
#turn-block{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:38px;line-height:1.25;white-space:nowrap}
#turn-block:before{display:none}
#turn-block[aria-pressed="true"]{background:var(--accent-soft,#eee4fb);border-color:var(--purple);color:var(--purple)}
.turn-icon{display:inline-flex;align-items:center;justify-content:center;flex:none;width:18px;height:18px;transition:transform .4s}
.turn-icon svg{display:block;width:18px;height:18px}
#turn-block:hover .turn-icon,#turn-block:focus-visible .turn-icon{transform:rotate(35deg)}
.math-bubble{position:relative;align-self:center;flex-shrink:0;max-width:90%;margin:12px 0 2px;padding:10px 20px;border:1px solid var(--line,#e7e0e9);border-radius:20px;background:var(--accent-soft,#f0eaf9);box-shadow:0 3px 0 var(--soft-shadow,#30204e12);color:var(--purple);font-size:16px;font-weight:650;line-height:1.5;text-align:center;white-space:pre-line}
.math-bubble:after{content:"";position:absolute;left:calc(50% - 7px);bottom:-8px;width:14px;height:14px;background:inherit;border-right:1px solid var(--line,#e7e0e9);border-bottom:1px solid var(--line,#e7e0e9);transform:rotate(45deg)}
.math-bubble[hidden],.math-bubble:empty{display:none}
.can-quarter-turn .creature{transform:rotateX(var(--rx)) rotateY(var(--ry)) rotateZ(var(--turn-angle,0deg)) scale3d(var(--turn-fit,1),var(--turn-fit,1),var(--turn-fit,1));transition:transform .65s cubic-bezier(.22,.7,.2,1)}
.can-quarter-turn.dragging .creature{transition:none}
.turn-resetting .creature{transition:none}
#explore-dialog .can-quarter-turn .creature-shadow{top:calc(50% + var(--turn-height)/2 + 18px);width:calc(var(--turn-width)*.8 + 10px);transition:top .65s,width .65s}
.turn-portals{position:absolute;inset:0;pointer-events:none;transform-style:preserve-3d;transform:translateZ(calc(var(--unit)*.6));animation:turn-portals 1s ease both}
.turn-portals:before,.turn-portals:after{content:"";position:absolute;top:50%;width:calc(var(--unit)*.65);height:calc(var(--unit)*2.2);border:3px solid #82e5f0;border-radius:50%;background:#285b9326;box-shadow:0 0 0 3px #285b93aa,0 0 14px #63daf0aa,inset 0 0 12px #63daf0aa;transform:translate(-50%,-50%)}
.turn-portals:before{left:15%}
.turn-portals:after{left:85%;border-color:#d2afff;background:#8055bb26;box-shadow:0 0 0 3px #674396aa,0 0 14px #bc8ff5aa,inset 0 0 12px #bc8ff5aa}
.is-separated .turn-portals{transform:scale3d(var(--unit-fit,.8),var(--unit-fit,.8),var(--unit-fit,.8)) translateZ(calc(var(--unit)*.6))}
.is-teleporting .unit-cube{--portal-spread-x:0;--portal-spread-y:0;animation:turn-teleport .65s cubic-bezier(.4,0,.2,1) var(--portal-delay) both}
.is-teleporting.is-separated .unit-cube{--portal-spread-x:var(--spread-x);--portal-spread-y:var(--spread-y)}
@keyframes turn-portals{0%,100%{opacity:0}12%,85%{opacity:1}}
@keyframes turn-teleport{
  0%,100%{opacity:1;transform:translate3d(calc(var(--portal-spread-x)*var(--unit)),calc(var(--portal-spread-y)*var(--unit)),0)}
  34%{opacity:1;transform:translate3d(calc(var(--w)*.15 - (var(--column) + .5)*var(--unit)),calc(var(--h)*.5 - (var(--row) + .5)*var(--unit)),calc(var(--unit)*.6)) scale3d(.25,.25,.25)}
  42%{opacity:0;transform:translate3d(calc(var(--w)*.15 - (var(--column) + .5)*var(--unit)),calc(var(--h)*.5 - (var(--row) + .5)*var(--unit)),calc(var(--unit)*.6)) scale3d(.1,.1,.1)}
  43%{opacity:0;transform:translate3d(calc(var(--w)*.85 - (var(--column) + .5)*var(--unit)),calc(var(--h)*.5 - (var(--row) + .5)*var(--unit)),calc(var(--unit)*.6)) scale3d(.1,.1,.1)}
  51%{opacity:1;transform:translate3d(calc(var(--w)*.85 - (var(--column) + .5)*var(--unit)),calc(var(--h)*.5 - (var(--row) + .5)*var(--unit)),calc(var(--unit)*.6)) scale3d(.25,.25,.25)}
}
@media(max-width:740px){.math-bubble{font-size:13px;padding:8px 14px;margin-top:8px}}
@media(prefers-reduced-motion:reduce){.can-quarter-turn .creature,#explore-dialog .can-quarter-turn .creature-shadow,.turn-icon{transition:none}.is-teleporting .unit-cube{animation:none}.turn-portals{display:none}}
