/* First-person scroll study and deliberate attack/block turns. */
.game-mark small,.encounter-type,#roundLabel,#modeLabel,.player-state small,.tool-button,.mode-sub{font-size:14px}.scene-text,.feedback{font-size:16px}.arena .casting-hands{position:absolute;inset:25% 0 0;z-index:5;pointer-events:none;background:url('hands.webp') center bottom/100% auto no-repeat;transform:translateY(34%);transform-origin:50% 100%;opacity:.78;transition:opacity .3s}.arena.writing .casting-hands{opacity:.28}.arena[data-motion=cast] .casting-hands{animation:handCast 1.3s ease both}.arena[data-motion=fizzle] .casting-hands{animation:handFizzle 1.3s ease both}.arena[data-motion=guard] .casting-hands{animation:handGuard 1.3s ease both}.arena[data-reaction=welcome] .character-wrap{animation:mentorWelcome 1.2s ease both}.arena[data-reaction=encourage] .character-wrap{animation:mentorEncourage 1.2s ease both}.arena[data-reaction=celebrate] .character-wrap{animation:mentorCelebrate 1.4s ease both}.arena[data-reaction=hit] .character-wrap{animation:npcImpact 1s ease both}.arena[data-reaction=counter] .enemy-projectile{animation:orbApproach 1s .5s ease both}.arena[data-reaction=counter] .ward-effect{animation:wardBlock 1s .6s ease both}.arena[data-kind=mentor] .opponent-health{display:none}.arena[data-kind=mentor][data-phase=release] .character-wrap{animation:mentorCelebrate 1.4s ease both}.study-tools{position:absolute;z-index:9;left:5%;top:325px;display:flex;gap:10px;flex-wrap:wrap}.study-scroll{position:absolute;z-index:8;left:4%;top:290px;width:340px;height:330px;background:url('scroll.webp') center/100% 100% no-repeat;transform-origin:center top;animation:unroll .7s ease both;filter:drop-shadow(0 12px 25px #001c22a0)}.scroll-content{position:absolute;inset:10% 14%;color:#332b20;text-align:center}.scroll-title{display:flex;justify-content:space-between;align-items:center;font-size:20px;font-weight:700}.scroll-title button{color:#453b28;background:transparent;font-size:14px}.arena #strokeDemo{position:relative;inset:auto;display:block;width:130px;height:130px;margin:0 auto;touch-action:auto}.scroll-controls{display:flex;justify-content:center;gap:4px}.scroll-controls button{font-size:14px;color:#433624;background:#fff7df80;padding:2px 8px;min-height:36px;border:1px solid #9c835d66;border-radius:5px}.scroll-note,#strokeCaption{font-size:14px;line-height:1.4;margin:4px 0}.scroll-content a{font-size:12px;color:#534728}.arena.scroll-open .study-tools{top:250px}.arena.scroll-open .dialogue{max-height:145px;overflow:auto;pointer-events:auto}.arena.scroll-open #copyTarget{display:none}.duel-hud{position:absolute;z-index:8;left:4.5%;top:330px;max-width:380px;padding:10px 14px;background:linear-gradient(90deg,#09242cf2,#09242c60);border-left:2px solid #d4b777}.duel-hud p{margin:3px 0;font-size:14px}#duelIntent{color:#ffe0a0;font-size:17px}.stance-actions{display:flex;gap:8px;margin-top:9px}.stance-actions button{padding:8px 12px;background:#12383b;border:1px solid #71988b;color:#efe4c0;border-radius:6px;font-size:14px}.stance-actions button[aria-pressed=true]{background:#52684c;border-color:#f1d49a;box-shadow:0 0 15px #dfd19525}.spell-movie{position:absolute;inset:0;z-index:5;width:100%;height:100%;object-fit:cover;pointer-events:none;opacity:0;transition:opacity .15s}.spell-movie.playing{opacity:1}.arena #dodgeBtn{display:none}.arena .ink-journey{bottom:155px;max-width:92%}.arena[data-mode=copy] .air-cue{left:49%;top:58%}.arena[data-kind=enemy] .air-cue{left:47%;top:63%}.arena[data-kind=enemy] .character-wrap{right:0;width:46%}.arena[data-kind=enemy] .encounter-status{right:5%;width:32%}.arena[data-kind=enemy] .dialogue{width:56%;max-height:215px;overflow:auto;pointer-events:auto}.arena[data-kind=enemy] .ink-review{z-index:12}.study-scroll[hidden]+.study-tools{top:290px}.arena[data-mode=copy] .npc-caption{font-size:16px}.arena .teacher-feedback{z-index:14}
@keyframes unroll{from{transform:scaleY(.07);opacity:.3}to{transform:scaleY(1);opacity:1}}@keyframes handCast{0%{transform:translateY(34%) scale(1)}35%{transform:translateY(20%) scale(.94)}65%{transform:translateY(-2%) scale(.84);filter:drop-shadow(0 0 20px #e5c86a)}100%{transform:translateY(34%) scale(1)}}@keyframes handFizzle{0%,100%{transform:translateY(34%) rotate(0)}35%{transform:translateY(10%) scale(.92)}50%{transform:translateY(24%) rotate(-3deg)}65%{transform:translateY(30%) rotate(3deg);filter:brightness(.7)}}@keyframes handGuard{0%,100%{transform:translateY(34%)}50%{transform:translateY(-3%) scale(1.13);filter:drop-shadow(0 0 22px #8ae2e9)}}@keyframes mentorWelcome{0%{transform:translateY(12px)}50%{transform:translateY(-5px) rotate(-1deg)}100%{transform:translateY(0)}}@keyframes mentorEncourage{0%,100%{transform:rotate(0)}45%{transform:rotate(2deg) translateX(-10px)}}@keyframes mentorCelebrate{0%,100%{transform:scale(1)}45%{transform:translateY(-12px) scale(1.025)}}
@media(max-width:700px){.arena{min-height:1050px}.game-mark small{font-size:12px}.header-actions{gap:3px}.dialogue{top:95px;max-height:210px;overflow:auto;pointer-events:auto}.study-scroll{top:325px;left:0;width:280px;height:310px}.arena.scroll-open .study-tools,.study-tools{top:267px;left:4%;max-width:93%}.arena.scroll-open .dialogue{max-height:158px}.scroll-content{inset:12% 13%}.scroll-title{font-size:18px}.arena #strokeDemo{width:110px;height:110px}.scroll-controls button{padding:2px 5px}.arena[data-mode=copy] .air-cue{left:30%;top:67%}.duel-hud{top:335px;left:4%;width:92%;max-width:none}.arena[data-kind=enemy] .dialogue{width:92%;max-height:220px}.arena[data-kind=enemy] .character-wrap{right:-6%;width:65%;height:43%;bottom:24%}.arena[data-kind=enemy] .encounter-status{bottom:48%;width:44%}.arena[data-kind=enemy] .air-cue{left:25%;top:65%}.arena .ink-journey{bottom:215px}.arena .casting-hands{inset:42% -15% 0;background-size:100% auto}.arena .npc-caption{bottom:34%;font-size:14px}.arena .ink-review{width:90%;right:5%;bottom:30%}.arena .feedback{font-size:14px}.arena .hud-bottom{padding-bottom:25px}.arena .sync-status{font-size:12px}.arena .glyph-chip{width:43px}.arena .teacher-feedback{top:90px;max-width:90%}}
@media(min-width:701px) and (max-height:780px){.arena{min-height:810px}.study-scroll{top:285px}.arena.scroll-open .study-tools{top:238px}.duel-hud{top:315px}.arena .ink-journey{bottom:155px}}
@media(prefers-reduced-motion:reduce){.spell-movie{display:none!important}.arena .casting-hands{transition:none}.arena[data-motion=cast] .casting-hands{filter:drop-shadow(0 0 12px #efd48d)}.arena[data-motion=fizzle] .casting-hands{opacity:.4}}
/* Display masks exclude the generator's painted background; original art is retained. */
.arena .casting-hands{inset:auto 0 0;width:100%;height:auto;aspect-ratio:3/2;background-size:100% 100%;mask:url('hands-mask.svg') center/100% 100% no-repeat;-webkit-mask:url('hands-mask.svg') center/100% 100% no-repeat}.study-scroll{background:none}.study-scroll::before{content:'';position:absolute;inset:0;background:url('scroll.webp') center/100% 100% no-repeat;mask:url('scroll-mask.svg') center/100% 100% no-repeat;-webkit-mask:url('scroll-mask.svg') center/100% 100% no-repeat;pointer-events:none}.scroll-content{inset:18% 13% 10%}.study-scroll{height:380px}.arena #strokeDemo{width:130px;height:130px}.scroll-controls button{min-height:40px}.arena[data-mode=copy].scroll-open .air-cue{left:49%;top:60%}
@media(max-width:700px){.arena .casting-hands{inset:auto -15% 40px;width:130%;height:auto}.study-scroll{height:340px}.scroll-content{inset:17% 13% 10%}.arena #strokeDemo{width:105px;height:105px}.arena[data-mode=copy].scroll-open .air-cue{left:29%;top:70%}}
/* Grok clips sit in the world behind the NPC, so the conversation stays in view. */
.world .spell-movie{z-index:1}.world .character-wrap{z-index:2}.world .enemy-projectile,.world .ward-effect,.world .impact-word{z-index:3}.arena:has(.spell-movie.playing) .casting-hands{opacity:0}.arena:has(.spell-movie.playing) .forest-backdrop{opacity:0}.world .spell-movie{object-position:center center}
@media(min-width:701px) and (max-height:780px){.arena{min-height:680px}.arena.scroll-open[data-mode=copy] .dialogue{max-height:110px}.arena.scroll-open[data-mode=copy] .scene-text{display:none}.arena.scroll-open .study-tools{top:230px}.study-scroll{top:272px;height:340px;width:330px}.arena #strokeDemo{width:110px;height:110px}.arena.scroll-open[data-mode=copy] .ink-journey{left:42%;max-width:55%;bottom:153px;gap:7px}.arena.scroll-open[data-mode=copy] #glyphStatus{font-size:14px}.arena.scroll-open[data-mode=copy] #sealGlyph{padding:7px 10px}.duel-hud{top:330px}.stance-actions button{font-size:14px;padding:8px}}
