.profile-backdrop{position:fixed;inset:0;z-index:121;background:rgba(14,23,49,.62);backdrop-filter:blur(5px);animation:backdropIn .25s ease both}.kid-profile-widget.is-open .profile-fab{opacity:0;pointer-events:none}.profile-popup.profile-drawer{position:fixed;z-index:122;right:24px;left:auto;top:24px;bottom:24px;width:390px;max-height:calc(100vh - 48px);overflow:auto;padding:28px 27px 0;border:0;border-radius:28px;background:linear-gradient(180deg,#fff 0%,#fff 88%,#f7fff2 100%);box-shadow:0 28px 90px rgba(8,18,45,.38);animation:drawerIn .4s cubic-bezier(.2,.8,.2,1) both;scrollbar-width:thin}.profile-popup.profile-drawer:before{display:none}.profile-drawer .profile-close{right:17px;top:15px;width:44px;height:44px;background:#fff;color:#4937b8;border:2px solid #e8e1ff;box-shadow:0 4px 12px #5c42c426;font-size:31px;line-height:1}.profile-drawer .profile-heading{padding:38px 42px 20px 5px;border-bottom:2px dashed #e9e3ff}.profile-drawer .profile-big-avatar{width:92px;height:92px;border-radius:50%;font-size:52px;border:6px solid #b999ff;background:linear-gradient(145deg,#d4c0ff,#a67ef4);box-shadow:0 7px 18px #6b46c12a}.profile-drawer .profile-heading small{font-size:15px;color:#24345d;letter-spacing:0}.profile-drawer .profile-heading h2{font-size:34px;color:#7550ed;text-transform:uppercase;margin-top:8px}.profile-drawer .profile-heading mark{font-size:17px;background:#f2efff;color:#7550ed;border-radius:12px;padding:6px 13px;margin-left:9px}.profile-welcome{font-size:19px;color:#7c57ee;padding:24px 4px 18px}.profile-welcome strong{margin-left:8px}.profile-detail-card{background:linear-gradient(145deg,#f9f8ff,#f3f1ff);border-radius:22px;padding:20px}.profile-program-row{display:flex;align-items:flex-start;gap:14px;padding-bottom:17px;border-bottom:1px solid #dedaf1}.detail-icon{width:52px;height:52px;border-radius:50%;background:#fff;display:grid;place-items:center;font-size:27px;box-shadow:0 3px 10px #6d5aa31f;flex:0 0 auto}.profile-program-row b{font-size:16px}.profile-program-row p{font-size:14px;line-height:1.45;color:#31426a;margin:5px 0 0}.profile-progress-row{min-height:72px;display:grid;grid-template-columns:58px 1fr auto;align-items:center;gap:12px;border-bottom:1px solid #dedaf1}.profile-progress-row>span:last-child{font-size:35px;color:#75809b}.profile-drawer .profile-ring{width:52px;height:52px;background:conic-gradient(#7c57ee var(--progress),#ddd5ff 0);color:#7550ed}.profile-drawer .profile-ring:before{inset:5px}.profile-drawer .profile-ring strong{font-size:12px}.profile-drawer .profile-stats{display:grid;grid-template-columns:1fr;gap:0;padding-top:10px}.profile-drawer .profile-stats>div{display:flex;align-items:center;gap:14px;text-align:left;background:transparent;padding:8px 4px}.profile-drawer .profile-stats>div>span{width:42px;text-align:center;font-size:26px}.profile-drawer .profile-stats p{display:grid;margin:0}.profile-drawer .profile-stats b{font-size:15px}.profile-drawer .profile-stats small{font-size:12px;color:#33466f}.profile-drawer .continue-learning{background:transparent;color:#263961;height:54px;margin:14px 0 5px;font-size:16px}.profile-drawer .continue-learning span{font-size:27px;color:#8b65f4}.profile-drawer .profile-logout{width:100%;height:50px;border-radius:12px;background:linear-gradient(100deg,#7337ef,#7c3ff1);color:#fff;font-size:16px;font-weight:800;margin:0;box-shadow:0 9px 20px #6735dc35}.profile-garden{height:85px;margin:17px -27px 0;padding-top:29px;text-align:center;font-size:35px;word-spacing:4px;background:linear-gradient(0deg,#79c55b 0 34%,transparent 35%);border-radius:0 0 28px 28px;overflow:hidden}.profile-garden span{font-size:24px}@keyframes backdropIn{from{opacity:0}to{opacity:1}}@keyframes drawerIn{from{opacity:0;transform:translateX(45px) scale(.98)}to{opacity:1;transform:none}}@media(max-width:600px){.profile-popup.profile-drawer{left:12px;right:12px;top:12px;bottom:12px;width:auto;max-height:calc(100vh - 24px);padding:20px 18px 0}.profile-drawer .profile-heading{padding-top:35px}.profile-drawer .profile-big-avatar{width:75px;height:75px;font-size:42px}.profile-drawer .profile-heading h2{font-size:27px}.profile-garden{margin-left:-18px;margin-right:-18px}}@media(prefers-reduced-motion:reduce){.profile-backdrop,.profile-popup.profile-drawer{animation:none}}
