.visualCoachArena{position:relative;min-height:235px;margin:0 0 12px;overflow:hidden;border:1px solid #5a6b53;border-radius:20px;background-image:linear-gradient(#18375988,#102030cc),var(--coach-terrain,url('../assets/battlefields/forest-temple/arena-v1.webp'));background-position:center;background-size:cover;box-shadow:inset 0 -50px 70px #06101acc,0 12px 28px #0005}
.visualCoachShade{position:absolute;inset:0;background:linear-gradient(90deg,transparent 38%,#07111ddd 72%)}
.visualCoachCast{position:absolute;left:0;bottom:0;width:43%;height:90%}.visualCoachHero{position:absolute;left:3%;bottom:-4%;width:76%;height:100%;object-fit:contain;object-position:center bottom;filter:drop-shadow(0 8px 6px #0008)}
.visualCoachPet{position:absolute;left:55%;bottom:2%;width:38%;height:42%;object-fit:contain;object-position:center bottom;filter:drop-shadow(0 5px 4px #0008);z-index:2}
.visualCoachBoard{position:absolute;z-index:3;right:4%;top:10%;width:56%;height:67%;display:grid;place-items:center;text-align:center;color:#fff}.visualCoachWajar{position:absolute;z-index:5;right:5%;bottom:4%;display:flex;align-items:center;gap:7px}.visualCoachWajar img{width:44px;height:52px;object-fit:contain}.visualCoachWajar b{padding:6px 9px;border-radius:99px;background:#f8fbff;color:#17243a;font-size:10px;box-shadow:0 4px 12px #0005}
.vcNumber{font-size:46px;font-weight:1000;letter-spacing:5px;text-shadow:0 4px 12px #000}.vcNumber .hot{display:inline-grid;place-items:center;color:#ffd85c;border-radius:12px;animation:vcPulse 1.1s infinite}.vcTap{border:1px solid #ffe176;background:#172a47e8;color:#fff;border-radius:15px;padding:10px;box-shadow:0 0 0 4px #ffd85c1c;cursor:pointer}.vcTap:active{transform:scale(.96)}
.vcTens{display:grid;grid-template-columns:repeat(2,7px);gap:3px;justify-content:center}.vcTens i,.vcOnes i,.vcOrbs i{display:block;width:8px;height:8px;border-radius:50%;background:#6ddcff;box-shadow:0 0 7px #42cfff}.vcOnes,.vcOrbs{display:flex;gap:5px;justify-content:center;flex-wrap:wrap}.vcSplit{display:flex;align-items:center;gap:10px}.vcSplit strong{font-size:26px;color:#ffe176}.vcResult{font-size:30px;font-weight:1000;color:#ffe176;animation:vcPop .35s both}
.vcBaseTen{display:flex;align-items:flex-end;justify-content:center;gap:9px}.vcHundreds,.vcRods,.vcUnits{display:flex;gap:4px;align-items:flex-end;justify-content:center}.vcHundreds i{display:block;width:24px;height:24px;border:1px solid #b9eeff;background:repeating-linear-gradient(0deg,#4bbbe7 0 3px,#7dd8fa 3px 5px);box-shadow:0 0 8px #46c6ff77}.vcRods i{display:block;width:7px;height:31px;border-radius:3px;background:#63d5ff;box-shadow:0 0 7px #42cfff}.vcUnits i{display:block;width:9px;height:9px;border-radius:2px;background:#ffe176;box-shadow:0 0 6px #ffd24b}.vcPlaceSlots{display:flex;gap:7px}.vcPlaceSlots button{width:48px;padding:9px 4px;border:1px solid #5a7398;border-radius:12px;background:#172a47e8;color:#fff}.vcPlaceSlots button.hot{border-color:#ffe176;color:#ffe176;animation:vcPulse 1.1s infinite}.vcPlaceSlots b{display:block;font-size:25px}.vcPlaceSlots small{display:block;font-size:8px;color:#b9c8dd;margin-top:3px}
.vcPlaceSlots span{min-width:58px;padding:8px 4px;border:1px solid #5a7398;border-radius:11px;background:#132540}.vcPlaceSlots span.hot{border-color:#ffe176;color:#ffe176;animation:vcPulse 1.1s infinite}
.vcBoulder{position:relative;display:block;width:105px;height:92px;background:linear-gradient(145deg,#738295,#394658 55%,#202b39);clip-path:polygon(18% 13%,70% 2%,94% 29%,88% 78%,62% 98%,17% 88%,2% 53%);filter:drop-shadow(0 10px 7px #0008)}.vcBoulder:after{content:"";position:absolute;inset:13% 18% 44% 20%;border-radius:50%;background:#b7c3ce33;transform:rotate(-12deg)}.vcRockAction{display:grid;justify-items:center;gap:8px;border:1px solid #ffe176;border-radius:16px;padding:9px 18px;background:#12233ce8;color:#ffe176;font-weight:900}.vcRockHalves{display:flex;align-items:end;justify-content:center;gap:5px}.vcRockHalves .vcBoulder{width:68px;height:88px}.vcRockHalves .left{clip-path:polygon(14% 10%,68% 0,100% 10%,72% 48%,100% 92%,42% 100%,5% 81%,0 34%)}.vcRockHalves .right{clip-path:polygon(0 10%,64% 4%,96% 27%,90% 79%,45% 100%,0 91%,28% 49%)}.vcRockHalves b{position:absolute;z-index:2;left:50%;top:47%;transform:translate(-50%,-50%);font-size:25px;color:#fff;text-shadow:0 2px 5px #000}.vcSlashRock{position:relative}.vcSlashRock>i{position:absolute;z-index:4;left:50%;top:-8%;width:4px;height:116%;background:#e9fbff;box-shadow:0 0 12px #67ddff,0 0 26px #4dafff;transform:rotate(18deg);animation:vcSlashFlash .55s both}.vcSlashRock .vcRockHalves{animation:vcRockSplit .65s .12s both}
.vcFraction{width:92px;height:92px;display:grid;grid-template-columns:1fr 1fr;overflow:hidden;border:4px solid #eef6ff;border-radius:50%;transform:rotate(-12deg);box-shadow:0 0 22px #62baff66}.vcFraction span{display:block;background:#253d61}.vcFraction span:first-child{background:#5ed8ff}.vcCrystals{display:flex;gap:7px}.vcCrystal{width:22px;height:34px;border:0;background:linear-gradient(145deg,#c8f6ff,#48b8e8 50%,#276ba8);clip-path:polygon(50% 0,100% 36%,76% 100%,24% 100%,0 36%)}.vcCrystal.break{animation:vcBreak .45s forwards}.vcEquation{margin-top:9px;font-size:23px;font-weight:1000}.vcDone .vcEquation{color:#ffe176}
.vcEquivalent{display:flex;align-items:center;justify-content:center;gap:9px}.vcEquivalent>b{color:#ffe176;font-size:11px}.vcEquivalent>span:not(.vcFraction){font-size:30px;font-weight:1000;color:#ffe176}.vcFraction.vcQuarter{grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr}.vcFraction.vcQuarter i,.vcFraction.vcHalf i{display:block;background:#263f64;border:1px solid #eef6ff55}.vcFraction.vcQuarter i:nth-child(-n+2),.vcFraction.vcHalf i:first-child{background:#5ed8ff}.vcFraction.vcHalf{grid-template-columns:1fr 1fr}
.vcRegroupRows,.vcRegroupResult{display:flex;align-items:center;justify-content:center;gap:8px}.vcRegroupRows>span{display:flex;max-width:76px;flex-wrap:wrap;gap:3px}.vcRegroupRows i,.vcRegroupResult i{display:block;width:8px;height:8px;border-radius:50%;background:#69dcff;box-shadow:0 0 6px #44c8ff}.vcRegroupRows>b,.vcRegroupResult>b{color:#ffe176;font-size:22px}.vcThirteen{max-width:106px}.vcTenBundle{display:grid;grid-template-columns:repeat(2,8px);gap:2px;padding:5px;border:2px solid #ffe176;border-radius:7px}.vcSmallEquation{font-size:14px;color:#ffe176}.vcCrystals:has(.target){max-width:145px;flex-wrap:wrap;justify-content:center}.vcCrystals:has(.target) .vcCrystal{width:15px;height:25px}
.vcChestGroups{display:flex;gap:8px;align-items:end;justify-content:center}.vcChestGroups span{position:relative;display:grid;place-items:center;width:44px;height:38px;border:2px solid #ffe176;border-radius:7px;background:linear-gradient(#8b6327,#3f2b13);color:#ffd75a;font-size:28px}.vcChestGroups i{position:absolute;display:flex;gap:2px;bottom:-17px;color:#73e4ff;font-size:14px;font-style:normal;text-shadow:0 0 7px #44cfff}.vcChestGroups.ready span{animation:vcChestOpen .8s infinite alternate}
.vcShopItem{display:grid;place-items:center;font-size:47px}.vcShopItem b,.vcShopItem small{padding:3px 8px;border-radius:9px;background:#ffe176;color:#17243a;font-size:14px}.vcMoneyTrade{display:flex;align-items:center;justify-content:center;gap:9px;font-weight:1000}.vcCoin{display:inline-grid;place-items:center;width:48px;height:48px;border:3px solid #fff0a1;border-radius:50%;background:linear-gradient(145deg,#ffe77b,#b87b13);color:#4b3000;font-size:18px;font-style:normal;box-shadow:0 0 15px #ffd34f88}.vcCoin span{display:block;font-size:7px}.vcMoneyTrade>.vcShopItem{font-size:36px}
.vcClock{position:relative;width:105px;height:105px;margin:auto;border:5px solid #e8f4ff;border-radius:50%;background:radial-gradient(circle,#1b3454 58%,#0c1728 60%);box-shadow:0 0 20px #56bfff55}.vcClock:before{content:'12\A 9　　　 3\A 6';white-space:pre;position:absolute;inset:7px;color:#cfe5ff;font-size:11px;line-height:42px}.vcClock i,.vcClock b{position:absolute;left:50%;bottom:50%;width:3px;border-radius:3px;background:#ffe176;transform-origin:50% 100%}.vcClock i{height:31px;transform:rotate(90deg)}.vcClock b{height:23px;transform:rotate(75deg)}.vcClock span{position:absolute;left:50%;bottom:-24px;transform:translateX(-50%);white-space:nowrap;font-weight:1000}.vcClock.moving i{animation:vcMinuteHand 1.2s ease-in-out infinite alternate}.vcClock.moving b{animation:vcHourHand 1.2s ease-in-out infinite alternate}.vcTimeLine{display:flex;align-items:center;gap:5px;font-size:13px;font-weight:1000}.vcTimeLine span{padding:5px;border-radius:7px;background:#213d63}.vcTimeLine i{color:#ffe176;font-style:normal}
.vcSwordMeasure{font-size:52px;line-height:1;transform:rotate(45deg);transform-origin:center}.vcSwordMeasure.glow{filter:drop-shadow(0 0 9px #5bd9ff);animation:vcMeasureGlow .8s infinite alternate}.vcRuler{display:flex;align-items:end;gap:3px;margin-top:12px;padding:4px 6px;border-radius:4px;background:#ffd765;color:#3b2a07;font-size:8px;font-weight:1000}.vcRuler i{width:2px;height:11px;background:#5f450b}.vcMeasureArrow{font-size:19px;color:#ffe176;font-weight:1000}
.vcShieldShape{position:relative;font-size:86px;line-height:1;color:#63d9ff;text-shadow:0 0 18px #4fc8ff}.vcShieldShape.spin{animation:vcShapeSpin 1.6s infinite}.vcShieldShape i{position:absolute;color:#ffe176;font:900 9px system-ui;text-shadow:none}.vcShieldShape i:nth-child(1){left:48%;top:2%}.vcShieldShape i:nth-child(2){right:8%;top:47%}.vcShieldShape i:nth-child(3){left:48%;bottom:0}.vcShieldShape i:nth-child(4){left:8%;top:47%}
.vcTileGrid{display:grid;grid-template-columns:repeat(4,23px);gap:3px}.vcTileGrid i{display:block;width:23px;height:23px;border:1px solid #80b7df;background:#183250}.vcTileGrid.filling i{animation:vcTileFill .9s infinite alternate}.vcTileGrid.filling i:nth-child(2n){animation-delay:.15s}.vcTileGrid.done i{background:#5dc8ef;box-shadow:inset 0 0 8px #fff5}
.vcDataPets{display:grid;gap:5px;font-size:21px}.vcDataPets span{letter-spacing:4px;color:#71dcff;text-shadow:0 0 7px #43c9ff}.vcChartBuild{height:94px;display:flex;align-items:end;justify-content:center;gap:12px;border-bottom:2px solid #dcecff}.vcChartBuild i{position:relative;width:25px;height:calc(var(--h)*15px);background:linear-gradient(#68dcff,#2877ba);transform-origin:bottom;animation:vcBarGrow .8s both}.vcChartBuild i b{position:absolute;top:-17px;left:50%;transform:translateX(-50%);color:#ffe176;font-style:normal}
.visualCoachArena.vcSuccess{box-shadow:inset 0 -50px 70px #06101acc,0 0 0 2px #65e4a5,0 0 28px #65e4a544}.visualCoachArena.vcSuccess .visualCoachHero{animation:vcHeroNod .45s}.learningWorkspace:has(.visualCoachArena) .coachStage{display:none!important}.learningWorkspace:has(.visualCoachArena){display:block!important}.learningIntro{display:none!important}.learningBody{min-height:0!important}.visualCoachOnly h2{margin:3px 0 10px;font-size:20px}.visualCoachOnly p{margin:5px auto 12px;font-size:13px}.visualCoachOnly .learningNext{margin-top:10px}
.visualCoachArena.vcCheckpoint{min-height:145px}.visualCoachArena.vcCheckpoint .visualCoachCast{height:100%;width:32%}.visualCoachArena.vcCheckpoint .visualCoachBoard{right:18%;width:35%;height:60%}.visualCoachArena.vcCheckpoint .visualCoachWajar img{width:34px;height:40px}
@keyframes vcPulse{50%{transform:scale(1.13);text-shadow:0 0 15px #ffd85c}}@keyframes vcPop{from{opacity:0;transform:scale(.6)}to{opacity:1;transform:scale(1)}}@keyframes vcBreak{to{opacity:0;transform:translateY(24px) rotate(25deg)}}@keyframes vcHeroNod{50%{transform:translateY(-5px)}}@keyframes vcSlashFlash{0%{opacity:0;transform:translateY(-30px) rotate(18deg)}35%{opacity:1}100%{opacity:0;transform:translateY(14px) rotate(18deg)}}@keyframes vcRockSplit{from{gap:0;filter:brightness(2)}to{gap:18px;filter:brightness(1)}}@keyframes vcChestOpen{to{transform:translateY(-5px);filter:brightness(1.35)}}@keyframes vcMinuteHand{to{transform:rotate(360deg)}}@keyframes vcHourHand{to{transform:rotate(97deg)}}@keyframes vcMeasureGlow{to{filter:drop-shadow(0 0 18px #8aeaff);transform:rotate(45deg) scale(1.06)}}@keyframes vcShapeSpin{to{transform:rotate(90deg)}}@keyframes vcTileFill{to{background:#5dc8ef;box-shadow:inset 0 0 8px #fff5}}@keyframes vcBarGrow{from{transform:scaleY(0)}to{transform:scaleY(1)}}
@media(max-width:390px){.visualCoachArena{min-height:205px}.visualCoachBoard{width:58%;right:2%}.visualCoachWajar img{width:38px;height:45px}.vcNumber{font-size:39px}}
.devLabGrid,.devTerrainGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;margin:9px 0}.devTerrainGrid button{border:1px solid #3d5274;border-radius:10px;padding:8px 5px;background:#14223a;color:#dce7fa;font-weight:850;font-size:10px}.devTerrainGrid button:active{border-color:#ffd24b;color:#ffd24b}