.learning-visual{margin:0 0 64px;color:#333c38;font-family:Inter,Arial,sans-serif;background:transparent;--accent:#f2673a}
.learning-scene{width:100%;aspect-ratio:16/10;position:relative;perspective:1400px;container-type:inline-size}
.learning-composition{position:absolute;inset:0;transform:translate3d(var(--learning-x,0px),var(--learning-y,0px),0) rotateX(var(--learning-rx,0deg)) rotateY(var(--learning-ry,0deg));transition:transform .3s ease-out;transform-style:preserve-3d}
.learning-orbit{position:absolute;inset:0;width:100%;height:100%;color:#adbab2;opacity:.6}
.learning-device{position:absolute;left:22%;top:22%;width:59%;height:62%;padding:1.3%;background:linear-gradient(130deg,#484d4a,#181e1b 55%,#303834);border:1px solid #737b75;border-radius:3cqw;box-shadow:0 16px 25px -18px #17241e99;transform:rotate(-3deg)}
.learning-camera{position:absolute;top:49%;left:.45%;width:.45cqw;height:.45cqw;border-radius:50%;background:#080d0b;box-shadow:inset 0 0 2px #aaa}
.learning-app{height:100%;display:grid;grid-template-columns:23% 77%;border-radius:1.9cqw;overflow:hidden;background:#f9faf9}
.learning-sidebar{background:linear-gradient(160deg,#333d38,#1d2521);padding:12% 9%;color:#dae1dc;min-width:0}
.learning-logo{display:block;width:100%;height:auto;margin:0 0 22%;filter:brightness(1.7)}
.learning-nav{display:flex;gap:.65cqw;align-items:center;padding:.85cqw .5cqw;border-radius:.5cqw;margin-bottom:.6cqw;font-size:.74cqw;line-height:1.3}.learning-nav svg{width:1.1cqw;height:1.1cqw;flex-shrink:0}.learning-nav.is-selected{background:#fff;color:#e96637;box-shadow:0 3px 9px #1113}
.learning-main{padding:3.6% 4%;min-width:0}.learning-app-top{display:flex;align-items:center;justify-content:space-between;color:#929b95;font-size:.63cqw}.learning-app-top>span{padding:.6cqw 1cqw;border:1px solid #e2e7e3;border-radius:2cqw;width:85%;background:white}.learning-app-top i{width:1.25cqw;height:1.25cqw;background:#303d35;border-radius:50%}
.learning-app-title{font-size:1.8cqw;font-weight:650;line-height:1.2;margin:1.4cqw 0;max-width:85%}
.learning-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:.8cqw}.learning-stats>div{position:relative;background:#fff;padding:1cqw .8cqw;border-radius:.85cqw;border:1px solid #eef0ed;box-shadow:0 4px 12px #25352b06}.learning-stats svg{width:1.6cqw;height:1.6cqw;display:block;margin-bottom:.4cqw}.learning-stats strong{font-size:1.8cqw;display:block;line-height:1.2}.learning-stats>div>span:last-child{font-size:.65cqw;color:#808a83;display:block;margin-top:.4cqw;line-height:1.2}.learning-ring{display:block;width:1.7cqw;height:1.7cqw;border-radius:50%;background:conic-gradient(#f2673a 0 78%,#e7ece8 78%);mask:radial-gradient(transparent 47%,#000 49%);margin-bottom:.4cqw;animation:learningRing 9s ease-in-out infinite}
.learning-course-header{display:flex;justify-content:space-between;align-items:center;font-size:.75cqw;margin:1.3cqw 0 .8cqw}.learning-course-header>span{font-size:.62cqw;color:#f2673a}.learning-courses{display:grid;grid-template-columns:repeat(3,1fr);gap:.8cqw}.learning-course{background:white;border:1px solid #ebefeb;border-radius:.7cqw;overflow:hidden;padding-bottom:.7cqw}.learning-course-art{height:5.2cqw;display:grid;place-items:center;position:relative;overflow:hidden}.learning-course-art:before{content:'';position:absolute;width:70%;height:180%;transform:rotate(40deg);background:#ffffff30;left:-20%}.learning-course-art svg{width:2.8cqw;height:2.8cqw;z-index:1}.art-coral{background:linear-gradient(140deg,#ffc58e,#f07845);color:#fff}.art-sage{background:linear-gradient(145deg,#dce6cd,#74958a);color:white}.art-charcoal{background:linear-gradient(140deg,#a7b5ad,#3e5047);color:white}.learning-course b{font-size:.67cqw;line-height:1.3;display:block;min-height:2.1cqw;padding:.6cqw .6cqw .3cqw}.learning-progress{height:.32cqw;background:#edf0ec;margin:.2cqw .6cqw 0;border-radius:5px;overflow:hidden}.learning-progress i{height:100%;width:var(--progress);display:block;background:#f2673a;border-radius:5px;transform-origin:left;animation:learningProgress 7s ease-in-out infinite;animation-delay:var(--delay)}.learning-sample{font-size:.57cqw;color:#95a096;text-align:right;margin-top:.8cqw}
.learning-float{position:absolute;background:linear-gradient(135deg,#fff,#f7f9f6);border:1px solid #fff;border-radius:1.8cqw;padding:1.4cqw;box-shadow:0 8px 20px -13px #34483b77;animation:learningFloat 6s ease-in-out infinite;animation-delay:var(--float-delay);width:20%;z-index:2}
.learning-float-heading{display:flex;gap:.9cqw;align-items:center}.learning-float-heading em{width:3.4cqw;height:3.4cqw;display:grid;place-items:center;border-radius:1cqw;background:linear-gradient(145deg,#ffe3d1,#ffc39f);color:#ee642f;flex-shrink:0}.learning-float-heading svg{width:2.1cqw;height:2.1cqw}.learning-float-heading b{font-size:1.02cqw;font-weight:600;line-height:1.3;overflow-wrap:break-word}
.float-digital{left:2%;top:30%;transform:rotate(-5deg)}.float-ai{left:40%;top:1%;width:25%}.float-analytics{right:2%;top:7%}.float-recommend{right:0;top:38%;width:22%}.float-report{right:3%;bottom:2%;width:21%}.float-certificate{left:39%;bottom:0;width:24%}.float-participation{left:1%;bottom:6%;width:23%}
.learning-mini-lines{display:grid;gap:.55cqw;margin:1.1cqw 0 .2cqw;padding-left:4.3cqw}.learning-mini-lines i{display:block;height:.38cqw;border-radius:6px;background:#dfe5df}.learning-mini-lines i:first-child{width:80%;background:#f2673a;animation:learningLine 6s ease-in-out infinite;transform-origin:left}.learning-mini-lines i:nth-child(2){width:100%}.learning-mini-lines i:nth-child(3){width:60%}
.learning-mini-chart{height:4.4cqw;display:flex;align-items:flex-end;gap:.8cqw;margin:1.3cqw .7cqw 0;border-bottom:1px solid #e3e8e1}.learning-mini-chart i{display:block;width:18%;height:var(--bar);border-radius:.3cqw .3cqw 0 0;background:#a3c9bf;transform-origin:bottom;animation:learningBars 6s ease-in-out infinite;animation-delay:var(--delay)}.learning-mini-chart i:last-child{background:#f2673a}.learning-certificate-status{display:flex;gap:.8cqw;align-items:center;margin-top:1cqw;font-size:.8cqw;color:#6a8779}.learning-certificate-status svg{width:1.6cqw;height:1.6cqw;border-radius:50%;background:#e0f1e8;padding:.2cqw}
.learning-visual figcaption{padding:30px 12px 0;display:grid;gap:8px;text-align:center}.learning-visual figcaption strong{font-size:22px;font-weight:600}.learning-visual figcaption>span{font-size:16px;color:#666}.learning-motion-toggle{justify-self:center;background:transparent;border:1px solid #bac7bf;border-radius:20px;padding:6px 14px;color:#68766b;font-family:inherit;font-size:11px;cursor:pointer;margin-top:5px}.learning-motion-toggle:focus-visible{outline:2px solid #f2673a;outline-offset:4px}
@keyframes learningFloat{0%,100%{translate:0 0}50%{translate:0 -9px}}@keyframes learningProgress{0%,100%{transform:scaleX(.7)}50%{transform:scaleX(1)}}@keyframes learningBars{0%,100%{transform:scaleY(.65)}50%{transform:scaleY(1)}}@keyframes learningLine{0%,100%{transform:scaleX(.65)}50%{transform:scaleX(1)}}@keyframes learningRing{0%,100%{rotate:0deg}50%{rotate:20deg}}
.learning-visual:not(.is-visible) *,.learning-visual.is-paused *{animation-play-state:paused!important}.learning-visual.is-paused .learning-composition{transform:none!important}
.learning-visual.is-document-hidden *{animation-play-state:paused!important}
@media(max-width:600px){.learning-scene{aspect-ratio:1/1}.learning-device{left:9%;top:22%;width:82%;height:58%;padding:2%;border-radius:4cqw}.learning-app-title{font-size:2.6cqw}.learning-nav{font-size:1.1cqw;padding:1.3cqw .5cqw}.learning-nav svg{width:1.6cqw;height:1.6cqw}.learning-app-top{font-size:.95cqw}.learning-stats strong{font-size:2.7cqw}.learning-stats svg{width:2cqw;height:2cqw}.learning-stats>div>span:last-child{font-size:1cqw}.learning-course-header{font-size:1.2cqw;margin:2cqw 0 1cqw}.learning-course-header>span{font-size:.9cqw}.learning-course-art{height:8cqw}.learning-course b{font-size:1.05cqw;min-height:3.3cqw}.learning-progress{height:.6cqw}.learning-sample{font-size:.85cqw}.learning-float{padding:1.6cqw;border-radius:2cqw}.learning-float-heading b{font-size:1.5cqw}.learning-float-heading em{width:4.2cqw;height:4.2cqw}.learning-float-heading svg{width:2.8cqw;height:2.8cqw}.float-ai{left:25%;top:1%;width:40%}.float-analytics{right:0;top:8%;width:28%}.float-digital{left:0;top:9%;width:28%}.float-participation{left:0;bottom:1%;width:30%}.float-certificate{left:34%;bottom:0;width:32%}.float-report{right:0;bottom:1%;width:28%}.float-recommend{right:0;top:70%;width:35%;display:none}.learning-mini-chart{height:5cqw}.learning-mini-lines{padding-left:0;gap:.7cqw}.learning-mini-lines i{height:.6cqw}.learning-certificate-status{font-size:1.2cqw}.learning-visual figcaption strong{font-size:19px}.learning-visual figcaption>span{font-size:14px}}
@media(prefers-reduced-motion:reduce){.learning-visual *{animation:none!important;transition:none!important}.learning-composition{transform:none!important}.learning-motion-toggle{display:none}}

.learning-dashboard-scroll{height:100%;overflow-y:auto;overflow-x:hidden;border-radius:1.9cqw;background:#f7f8f7;scrollbar-width:thin;scrollbar-color:#f2673a #e9eeea;overscroll-behavior:contain}
.learning-dashboard-capture{display:block;width:100%;height:auto;max-width:none}
.learning-dashboard-scroll:focus-visible{outline:3px solid #f2673a;outline-offset:3px}
.learning-scroll-hint{position:absolute;bottom:-2.1cqw;left:50%;transform:translateX(-50%);white-space:nowrap;font-size:.8cqw;color:#66756a;background:#ffffffed;padding:.3cqw .8cqw;border-radius:20px;pointer-events:none}