/* The translucent teaching reference shares the ink's screen transform. */
.arena.v8 #traceCanvas{position:absolute;inset:0;width:100%;height:100%;z-index:2;pointer-events:none;touch-action:auto}
.arena.v8 .trace-surface{position:relative;grid-area:3/2/4/4;align-self:stretch;z-index:6;width:100%;height:100%;min-height:0;pointer-events:none}
.trace-caption{position:absolute;top:2px;left:0;right:0;min-height:54px;text-align:center;text-shadow:0 2px 5px #001822;background:linear-gradient(90deg,transparent,#082a33c9,transparent);padding:2px 5px}
.trace-caption strong{display:block;font-size:17px;line-height:24px;color:#fff0c3}.trace-caption p{font-size:15px;line-height:22px;margin:2px 0;color:#dcf4ea}.trace-caption p[data-kind=order],.trace-caption p[data-kind=direction],.trace-caption p[data-kind=repeat],.trace-caption p[data-kind=uncertain]{color:#ffe0a2}
.arena.v8.trace-active .air-cue{display:none}.arena.v8.trace-active .character-wrap{opacity:.28}.arena.v8.trace-active .casting-hands{opacity:.12}.arena.v8.trace-active[data-motion] .casting-hands{opacity:.85}.trace-review-note{padding:8px 10px;border-left:3px solid #a9d7c6;background:#b1d6b910}
@media(max-width:700px){
 .arena.v8.trace-active .trace-surface{grid-area:2/1/4/2}.arena.v8.trace-active .dialogue{visibility:hidden}.arena.v8.trace-active .trace-caption{top:0;min-height:58px}.arena.v8.trace-active .trace-caption strong{font-size:18px}.arena.v8.trace-active .trace-caption p{font-size:16px;line-height:22px}.arena.v8.trace-active .study-tools{z-index:9}.arena.v8.trace-active.scroll-open .study-tools{z-index:11}
}
@media(max-height:550px) and (min-width:701px) and (max-width:1000px){.arena.v8.trace-active .trace-surface{grid-area:2/2/4/3}.arena.v8.trace-active .study-tools{grid-area:2/1/4/2;align-self:end;justify-self:start;flex-direction:row}.arena.v8.trace-active .study-tools button{font-size:14px;min-height:44px;padding:2px 5px}.arena.v8.trace-active .task-nav{visibility:hidden}}
