/* Teaching upgrade: opening roadmap and backpack lab. */
#openingMystery{position:absolute;z-index:46;left:30px;top:72px;width:730px;height:540px;border-radius:22px;overflow:hidden;display:none;background:radial-gradient(circle at 50% 30%,#20486c,#09172e 72%);border:2px solid #65cffb;box-shadow:inset 0 0 70px #3098e83a,0 0 35px #2ba9f64c;color:#fff;text-align:center;padding:26px}
#openingMystery.on{display:block;animation:mysteryEntrance .6s both}
@keyframes mysteryEntrance{from{opacity:0;transform:scale(.93)}to{opacity:1;transform:scale(1)}}
#openingMystery .mEyebrow{font-size:12px;font-weight:900;letter-spacing:.25em;color:#73e8ff}
#openingMystery h2{font-size:27px;line-height:1.12;margin:10px 0 12px}
#openingMystery .mRoadmap{display:flex;justify-content:center;gap:8px;margin-bottom:13px}
#openingMystery .mRoadmap span{border:1px solid #83cfff65;background:#14365c;border-radius:999px;color:#bcecff;font-size:11px;font-weight:800;padding:7px 9px;white-space:nowrap}
#openingMystery .mPatch{height:258px;max-width:590px;margin:0 auto;display:flex;align-items:center;justify-content:center;gap:24px;border:2px solid #5db6ed;border-radius:28px;background:linear-gradient(145deg,#163b68,#101e3c);box-shadow:0 20px 35px #0007;transition:opacity .4s,transform .4s}
#openingMystery .mPatchFace{width:190px;height:190px;flex:none;filter:drop-shadow(0 14px 18px #0009);animation:mAgentFloat 3s ease-in-out infinite}
#openingMystery .mPatchFace svg{width:100%;height:100%}
#openingMystery .mPatchWords{text-align:left;max-width:300px}
#openingMystery .mPatchWords b{display:block;font-size:29px;color:#fff}
#openingMystery .mPatchWords span{display:block;font-size:14px;font-weight:800;color:#8de9ff;margin-top:7px}
#openingMystery .mPatchWords p{font-size:15px;line-height:1.45;color:#c4dcf5;margin:15px 0 0}
#openingMystery .mAgents{position:absolute;left:0;right:0;top:139px;opacity:0;pointer-events:none;transform:translateY(15px);transition:opacity .45s,transform .45s}
#openingMystery.cousins .mPatch{opacity:0;transform:translateX(-30px);pointer-events:none}
#openingMystery.cousins .mAgents{opacity:1;transform:none}
#openingMystery .mAgents{display:flex;gap:20px;justify-content:center}
#openingMystery .mAgent{width:285px;height:258px;border:2px solid #6299c6;border-radius:25px;background:linear-gradient(145deg,#1a3a61,#101b39);box-shadow:0 16px 22px #0006, inset 0 2px #a2deff30;padding:15px;position:relative;animation:mAgentFloat 3s ease-in-out infinite}
#openingMystery .mAgent:nth-child(2){border-color:#ad83ff;background:linear-gradient(145deg,#3e2e70,#1a183a);animation-delay:.6s}
@keyframes mAgentFloat{50%{transform:translateY(-9px)}}
#openingMystery .mFace{height:115px;display:flex;align-items:center;justify-content:center;filter:drop-shadow(0 8px 15px #0009)}
#openingMystery .mFace svg{height:110px;width:110px}
#openingMystery .mName{font-size:23px;font-weight:900;margin-top:7px}
#openingMystery .mStyle{font-size:13px;color:#abd1f1;margin-top:4px}
#openingMystery .mQuestion{position:absolute;left:0;right:0;bottom:16px;color:#8fe4ff;font-weight:800;letter-spacing:.05em}
#openingMystery .mFooter{margin-top:15px;font-size:14px;color:#bce4ff;font-weight:800}

#backpackLab{position:absolute;right:22px;bottom:44px;z-index:9;width:300px;border:2px solid #724ac3;border-radius:18px;background:#fff;box-shadow:0 12px 35px #0004;display:none;overflow:hidden;color:#20304d}
#backpackLab.on{display:block;animation:pop .35s ease}
#backpackLab .labTop{background:#33216f;color:#fff;padding:9px 14px;font-size:12px;font-weight:900;letter-spacing:.09em}
#backpackLab .labMain{display:flex;gap:9px;padding:12px}
#backpackLab .labBag{height:130px;width:77px;flex:none;position:relative;border-radius:24px 24px 12px 12px;background:linear-gradient(140deg,#c49afe,#673bbb);border:5px solid #4c258f;box-shadow:0 8px 0 #2c1655,inset 0 0 12px #fefaff88;overflow:hidden}
#backpackLab .labBag:before{content:'🎒';position:absolute;top:9px;width:100%;text-align:center;font-size:39px;z-index:2;filter:drop-shadow(0 3px 8px #26104a)}
#backpackLab .labFill{position:absolute;left:0;right:0;bottom:0;height:var(--fill,28%);background:linear-gradient(0deg,#4de4e0,#c6fdff);transition:height .9s;box-shadow:0 0 18px cyan}
#backpackLab .labReadout{flex:1;font-size:13px;line-height:1.36}
#backpackLab .labValue{font-size:28px;color:#3d287d;font-weight:950;line-height:1.2;font-variant-numeric:tabular-nums}
#backpackLab .labDelta{color:#116e51;font-weight:850;margin-top:7px}
#backpackLab .labHint{font-size:11px;color:#475976;margin-top:8px}
#backpackLab .labBottom{padding:8px 12px;background:#e6f3ff;font-size:11px;color:#17335b;font-weight:750}

