.cinematic-canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:8}
.classroom:before{content:'';position:absolute;inset:0;pointer-events:none;z-index:0;background:radial-gradient(ellipse at 50% 40%,transparent 25%,#76619c34 95%);transition:background 1s}
.classroom.scene-forge:before,.classroom.scene-levitate:before,.classroom.scene-gather:before{background:radial-gradient(ellipse at 50% 40%,#fffbe71a 15%,#50467855 100%)}
.scene-entrance .room-door{display:block;right:3%;top:8%;height:70%;width:17%;z-index:1;background:linear-gradient(90deg,#a28b76,#eed3ad);border:7px solid #dcb78d;border-radius:15px 15px 3px 3px;transform-origin:right center;animation:classDoorOpen 4.2s both;box-shadow:-15px 5px 35px #fff3bdd9}
.scene-entrance .room-door:before{background:linear-gradient(#a1d6d5,#edf7e4);border-color:#e8c79c;border-radius:8px}
.scene-entrance .boss-actor{animation:grandEntrance 4.2s both;transform-origin:50% 100%}
.scene-forge .boss-actor{animation:ritualLift 4.5s both}
.scene-forge .wall-board{animation:grandBoardForge 4.5s both;border-radius:12px;background:linear-gradient(115deg,#376e61,#659c86);box-shadow:0 0 30px #acebd480,0 6px 0 #9b795e}
.scene-forge .black-sword{animation:grandSwordAppear 4.5s both}
.black-sword{filter:drop-shadow(0 0 8px #a4eddb) drop-shadow(0 4px 2px #47364766)}
.sword-blade{background:linear-gradient(100deg,#82c7ad 0%,#376b5e 22%,#254b46 58%,#569d85 90%);border-color:#e6cda0;box-shadow:inset 3px 0 #ccffe5;overflow:hidden}
.sword-blade:before{content:'';position:absolute;inset:20% 22%;background:repeating-linear-gradient(0deg,transparent 0 21px,#dcf3d78c 23px 25px);transform:skewY(-10deg);opacity:.6}
.sword-blade:after{content:'';position:absolute;inset:-100%;background:linear-gradient(100deg,transparent 45%,#fffee594 50%,transparent 55%);animation:bladeGlint 3s infinite}
.scene-break .black-sword{animation:grandSwordBreak 3.1s both}.scene-break .boss-actor{animation:fractureRecoil 3.1s both}
.scene-levitate .floor-chalks{opacity:0;transition:opacity 1.5s}
.scene-levitate .chalk-orbit{animation:grandChalkRise 4.2s both}
.chalk-orbit{height:200px;animation:formationFloat 5s ease-in-out infinite;filter:drop-shadow(0 0 10px #e4fbeb)}
.chalk-orbit i{width:11px;height:36px;border-radius:4px;box-shadow:0 0 12px var(--chalk),0 0 25px var(--chalk),inset 0 5px #fff;animation:chalkBladeFloat 2.8s ease-in-out infinite;animation-delay:calc(var(--i)*-.32s)}
.chalk-orbit i:after{content:'';position:absolute;left:20%;top:25%;bottom:8%;width:2px;background:#fff9;border-radius:4px}
.scene-levitate .boss-actor{animation:levitationAwaken 4.2s both}
.scene-kneel .boss-actor{animation:heavyKneel 1.8s both}
.scene-gather .boss-actor{animation:lastResolve 4s both}
.scene-gather .history-orb{display:flex;animation:orbCreation 4s both}
.scene-dialogue .boss-speech{animation:speechAppear .65s both;background:#fffbef;border:2px solid #e4c9df;color:#81607f;box-shadow:0 7px 0 #a885aa26,0 10px 30px #55416629}
.history-orb{background:radial-gradient(circle at 43% 37%,#fffef4 3%,#fff0ae 26%,#f4c769a8 42%,#98e8d194 58%,#b2b4f266 68%,transparent 73%);box-shadow:0 0 18px #ffecaa,0 0 52px #f4d6867d,inset 0 0 25px #fff9da}
.history-orb b{color:#9d7347;text-shadow:0 0 3px #fff7d7,0 0 13px #fff,0 0 27px #ffde80;font-weight:900}
.history-orb i{border:2px solid #fff1a8;box-shadow:0 0 10px #ffdf9699;transform:rotateX(52deg);animation:energySpin 9s linear infinite}
.history-orb i:nth-child(2){border:2px solid #a5e8d9;transform:rotateY(56deg);animation-duration:7s;animation-direction:reverse}
.scene-ultimate .history-orb{animation:ultimateRelease 2.3s both}
.scene-victory .history-orb{animation:orbDissolve 3s both}
.scene-victory .boss-actor{animation:bossRelief 3s both}
.chapter-fight{position:absolute;inset:0;pointer-events:none;z-index:2}
.chapter-actor{position:absolute;left:50%;top:12%;width:min(40vw,340px);height:min(40vw,340px);transform:translateX(-50%);transform-origin:50% 85%;z-index:2}
.chapter-body{width:100%;height:100%;background-image:url('assets/chapter-bosses.webp');filter:drop-shadow(0 8px 3px #58447155);animation:chapterBreathe 2.5s ease-in-out infinite}
.chapter-aura{position:absolute;left:50%;top:40%;width:min(34vw,340px);height:min(18vw,160px);transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(ellipse,#ffefd24d,transparent 67%);border:2px solid #fff1bc6e;box-shadow:0 0 22px #f7b5d780;animation:auraBreathe 2.8s ease-in-out infinite}
.chapter-hud{position:absolute;top:8px;left:50%;transform:translateX(-50%);width:min(270px,65%);border-radius:16px;padding:9px 14px;background:#fff8f4ec;border:2px solid #e9c1d9;box-shadow:0 4px 0 #b492bd2e;color:#8a5a8d;z-index:6}
.chapter-hud>div:first-child{display:flex;justify-content:space-between;gap:8px;font-size:11px;font-weight:800}.chapter-hud strong{white-space:nowrap}.chapter-health{height:6px;background:#eddfeb;border-radius:4px;overflow:hidden;margin-top:7px}.chapter-health i{display:block;height:100%;background:linear-gradient(90deg,#e29cb8,#bd95d7);transition:width .2s}
.chapter-entrance .chapter-actor{animation:chapterArrival 1.7s both}.chapter-entrance .chapter-hud{opacity:0}
.game.chapter-mode .base{transition:top 1.35s cubic-bezier(.15,.75,.35,1);z-index:3}
.game.chapter-mode.chapter-pushed .base{top:84%;width:min(18vw,150px);height:min(18vw,145px)}
.game.chapter-mode .arena-path{opacity:.3;transition:opacity 1.2s}
.game.chapter-mode .enemy{z-index:4}.game.chapter-mode .enemy .sprite{display:none}.game.chapter-mode .enemy p{-webkit-line-clamp:4}.game.chapter-mode .enemy .enemy-paper{background:#fffbf5f2}
.chapter-victory .chapter-actor{animation:chapterDefeated 2.3s both}.chapter-victory .chapter-aura{animation:orbDissolve 2.3s both}
@keyframes classDoorOpen{0%,10%{transform:perspective(650px) rotateY(0)}30%,85%{transform:perspective(650px) rotateY(-63deg);opacity:1}100%{transform:perspective(650px) rotateY(-63deg);opacity:0}}
@keyframes grandEntrance{0%,15%{translate:90% 12%;opacity:0;scale:.7}28%{opacity:1;rotate:-3deg}43%{translate:50% 7%;rotate:3deg;scale:.82}57%{rotate:-3deg}73%{translate:12% 2%;rotate:2deg;scale:1}88%{translate:0 0;rotate:-1deg}100%{translate:0 0;opacity:1;rotate:0;scale:1}}
@keyframes ritualLift{0%,15%{translate:0 0}50%,80%{translate:0 -9px;rotate:-2deg}100%{translate:0 0;rotate:0}}
@keyframes grandBoardForge{0%,12%{transform:none;opacity:1}28%{transform:translateY(-14%) rotate(-3deg) scale(1.05);filter:drop-shadow(0 0 20px #acffe0)}46%{transform:translateY(25%) rotateY(25deg) rotate(-18deg) scale(.72);filter:brightness(1.5)}65%{transform:translate(0,47%) rotate(-28deg) scale(.18,1.3);filter:brightness(2)}80%,100%{transform:translate(0,60%) rotate(-28deg) scale(.06,.9);opacity:0}}
@keyframes grandSwordAppear{0%,62%{opacity:0;scale:.45;filter:brightness(2)}78%{opacity:1;scale:1.12;filter:brightness(1.6)}100%{opacity:1;scale:1;filter:brightness(1)}}
@keyframes bladeGlint{0%,55%{translate:-50% 0}100%{translate:50% 0}}
@keyframes grandSwordBreak{0%,12%{opacity:1}25%{filter:brightness(2);rotate:7deg}40%{filter:brightness(1);rotate:-15deg;translate:0 5%}65%,100%{opacity:0;rotate:38deg;translate:15% 60%;scale:.6}}
@keyframes fractureRecoil{0%{translate:0 0}16%{translate:0 -12px;rotate:-7deg}32%{translate:0 4px;rotate:3deg}60%,100%{translate:0 0;rotate:0}}
@keyframes grandChalkRise{0%,12%{translate:0 120px;scale:.25;opacity:0;rotate:-50deg}27%{translate:0 90px;scale:.4;opacity:1}56%{translate:0 0;scale:.8;rotate:20deg}82%{translate:0 -12px;scale:1.1;rotate:-6deg}100%{translate:0 0;scale:1;opacity:1;rotate:0}}
@keyframes levitationAwaken{0%,18%{translate:0 10px;scale:.97}55%{translate:0 -17px;scale:1.03}100%{translate:0 -7px;scale:1}}
@keyframes formationFloat{0%,100%{translate:0 0;rotate:-3deg}50%{translate:0 -8px;rotate:5deg}}
@keyframes chalkBladeFloat{50%{margin-top:-9px;filter:brightness(1.18)}}
@keyframes heavyKneel{0%{translate:0 -8px;rotate:0}25%{translate:0 7px;rotate:-5deg}48%{translate:0 22px;rotate:2deg}100%{translate:0 18px;rotate:0}}
@keyframes lastResolve{0%,15%{translate:0 18px;scale:.95}70%,100%{translate:0 0;scale:1}}
@keyframes orbCreation{0%,10%{opacity:0;scale:.12}35%{opacity:.7;scale:.3;filter:brightness(1.4)}70%{opacity:1;scale:.65}100%{opacity:1;scale:1;filter:brightness(1)}}
@keyframes ultimateRelease{0%,20%{opacity:1;filter:brightness(1.6)}40%{scale:1.15}80%,100%{translate:0 130%;scale:.45;opacity:0}}
@keyframes orbDissolve{0%,18%{opacity:1;filter:brightness(1.5)}55%{scale:1.3;opacity:.5}100%{scale:1.8;opacity:0}}
@keyframes bossRelief{30%{translate:0 15px;rotate:-4deg}100%{translate:0 0;rotate:0}}
@keyframes speechAppear{from{opacity:0;translate:0 12px;scale:.95}to{opacity:1;translate:0 0;scale:1}}
@keyframes chapterArrival{0%{opacity:0;translate:0 -70%;scale:.45}55%{opacity:1;translate:0 8%;scale:1.07}80%{translate:0 -3%;scale:.98}100%{opacity:1;translate:0 0;scale:1}}
@keyframes chapterBreathe{50%{translate:0 -7px;rotate:1deg}}
@keyframes auraBreathe{50%{scale:1.08;opacity:.7}}
@keyframes chapterDefeated{15%{rotate:-9deg;translate:0 -8%}45%{rotate:6deg;opacity:.9}100%{translate:0 20%;rotate:-12deg;scale:.55;opacity:0}}
@media(max-width:680px){.chapter-actor{width:min(62vw,265px);height:min(62vw,265px);top:18%}.chapter-aura{width:57vw;height:30vw;top:43%}.game.chapter-mode.chapter-pushed .base{width:108px;height:103px;top:85%}.game.chapter-mode .enemy p{font-size:10px;-webkit-line-clamp:4}.chapter-hud{padding:7px 10px}.chapter-hud>div:first-child{font-size:9px}.chapter-health{height:5px}.chalk-orbit i{width:9px;height:30px}}
@media(max-height:580px){.chapter-actor{width:155px;height:155px;top:14%}.game.chapter-mode.chapter-pushed .base{width:80px;height:76px;top:84%}.chapter-hud{width:160px;top:4px;padding:5px 8px}.chapter-hud>div:first-child{font-size:8px}.game.chapter-mode .enemy p{font-size:9px;-webkit-line-clamp:3}.chapter-aura{width:145px;height:75px}.chalk-orbit i{width:8px;height:25px}.scene-entrance .room-door{width:20%}.scene-gather .history-orb{top:-4%}}
@media(prefers-reduced-motion:reduce){.scene-entrance .boss-actor,.chapter-actor{opacity:1;translate:0 0}.game.chapter-mode .base{transition:none}.scene-forge .wall-board{opacity:0}.scene-forge .black-sword{opacity:1}}