/* Original product illustrations. CSS geometry keeps the scenes sharp at every density. */
.method-section .method-grid{gap:24px;align-items:start}
.method-section .method-card{min-width:0}
.method-section .method-visual.ms-scene{position:relative;height:350px;border-radius:22px;background:radial-gradient(ellipse at 50% 20%,#fff 0%,#f4f7fc 62%,#eef2f8 100%);border:1px solid #eaf0f7;display:block;isolation:isolate;overflow:hidden;perspective:1000px}
.ms-scene::after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 1px 0 #fff;pointer-events:none;z-index:8}
.ms-scene *{box-sizing:border-box}
.ms-floor{position:absolute;left:0;right:0;bottom:-52px;height:180px;transform:rotateX(62deg) scale(1.6);background-image:linear-gradient(#b8c8df24 1px,transparent 1px),linear-gradient(90deg,#b8c8df24 1px,transparent 1px);background-size:24px 24px;mask-image:radial-gradient(ellipse,#000,transparent 67%)}
.ms-window,.ms-review-window,.ms-next-test{position:relative;background:#fff;border:1px solid #dbe3ef;border-radius:13px;box-shadow:0 2px 3px #122c4c04,0 10px 18px -9px #18375c20,0 30px 45px -24px #18375c38;overflow:hidden;color:#172b4c;font-family:Inter,sans-serif;text-align:left}
.ms-window{width:calc(100% - 64px);max-width:282px;margin:32px auto 0;transform:rotateY(-6deg) rotateX(5deg) rotateZ(-2deg);animation:ms-window-breathe 9s cubic-bezier(.4,0,.2,1) infinite}
.ms-toolbar{display:flex;align-items:center;gap:7px;height:39px;padding:0 14px;border-bottom:1px solid #edf1f7;font-size:9px;font-weight:500;background:linear-gradient(#fff,#fcfdff);letter-spacing:-.01em}
.ms-appmark{display:grid;grid-template-columns:repeat(2,4px);gap:2px;transform:rotate(-8deg);margin-right:1px}
.ms-appmark i{width:4px;height:4px;background:#193660;border-radius:1px}.ms-appmark i:nth-child(2){opacity:.35}.ms-appmark i:nth-child(3){opacity:.65}
.ms-timer{margin-left:auto;display:flex;align-items:center;gap:5px;font-size:8px;font-variant-numeric:tabular-nums;color:#687992}
.ms-timer i{width:11px;height:11px;border:1.5px solid #d9e3f3;border-top-color:#406bc1;border-right-color:#406bc1;border-radius:50%;animation:ms-timer-spin 9s linear infinite}
.ms-question-meta{display:flex;justify-content:space-between;padding:13px 15px 0;font-size:9px;font-weight:500}.ms-question-meta i{font-style:normal;color:#92a0b6;font-weight:400}
.ms-object-stage{height:116px;position:relative;background:radial-gradient(ellipse at 50% 92%,#e6edf87a,transparent 44%)}
.ms-model{--u:34px;position:absolute;left:50%;top:50%;width:150px;height:112px;transform:translate(-50%,-50%);perspective:650px}
.ms-solid{position:absolute;left:calc(50% - var(--u)/2);top:calc(50% - var(--u)/3);width:var(--u);height:var(--u);transform-style:preserve-3d;transform:rotateX(-24deg) rotateY(-34deg);animation:ms-model-turn 9s cubic-bezier(.4,0,.2,1) infinite}
.ms-block{position:absolute;width:var(--u);height:var(--u);transform-style:preserve-3d;transform:translate3d(calc(var(--x)*var(--u)),calc(var(--y)*var(--u)),calc(var(--z)*var(--u)))}
.ms-face{position:absolute;inset:0;display:block;backface-visibility:hidden;border:.6px solid #7692be70;background:linear-gradient(140deg,#dfeaff,#b9cdf0)}
.ms-front{transform:translateZ(calc(var(--u)/2));background:linear-gradient(135deg,#ccddf8,#96b3df)}
.ms-back{transform:rotateY(180deg) translateZ(calc(var(--u)/2));background:#7394c7}
.ms-left{transform:rotateY(-90deg) translateZ(calc(var(--u)/2));background:linear-gradient(125deg,#acbfdf,#7f9cca)}
.ms-right{transform:rotateY(90deg) translateZ(calc(var(--u)/2));background:linear-gradient(120deg,#507bbd,#89abdf)}
.ms-top{transform:rotateX(90deg) translateZ(calc(var(--u)/2));background:linear-gradient(145deg,#fff,#e5edfc);border-color:#c4d3ec}
.ms-bottom{transform:rotateX(-90deg) translateZ(calc(var(--u)/2));background:#597eaf}
.ms-answers{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;padding:0 14px}
.ms-answer{height:57px;border:1px solid #e4eaf3;border-radius:7px;position:relative;background:#fbfcfe;color:#65748b;padding:5px 6px;font-size:8px}
.ms-answer svg{display:block;width:100%;height:34px;fill:#dde6f6;stroke:#8ca1c0;stroke-width:1.2;stroke-linejoin:round}
.ms-answer-selected{background:#eef4ff;border-color:#769bd6;animation:ms-answer-pick 9s ease infinite}.ms-answer-selected svg{fill:#b8cff2;stroke:#557ebc}
.ms-click-ring{position:absolute;left:50%;top:55%;width:22px;height:22px;margin:-11px;border:1px solid #5483cb;border-radius:50%;opacity:0;animation:ms-click 9s ease-out infinite}
.ms-window-bottom{display:flex;align-items:center;justify-content:space-between;padding:14px;height:45px}
.ms-tiny-progress{width:62px;height:3px;background:#eaf0f8;border-radius:3px;overflow:hidden}.ms-tiny-progress i{display:block;width:22%;height:100%;background:#839fc9;transform-origin:left;animation:ms-progress 9s ease infinite}
.ms-next{display:flex;align-items:center;gap:6px;font-size:8px;color:#71829b}.ms-next svg{width:12px;height:12px}
.method-section .ms-scene>svg.ms-pointer{position:absolute;left:52%;top:224px;width:23px;height:29px;max-width:none;fill:#182d4f;stroke:#fff;stroke-width:1.5;filter:drop-shadow(0 2px 2px #10284e30);transform:none;opacity:0;animation:ms-pointer-move 9s cubic-bezier(.22,1,.36,1) infinite;z-index:5}
.ms-review-window{width:calc(100% - 58px);max-width:292px;margin:36px auto 0;transform:rotateX(3deg) rotateY(5deg) rotateZ(1deg)}
.ms-review-icon{margin-left:auto;width:17px;height:17px;border-radius:50%;background:#eaf3ee;color:#5d8b79;display:grid;place-items:center}.ms-review-icon svg{width:12px;height:12px}
.ms-review-canvas{height:149px;position:relative;background:radial-gradient(ellipse at 50% 62%,#f1f5fc,transparent 67%)}
.ms-insight{margin:0 12px 11px;padding:10px;display:flex;gap:8px;align-items:center;background:#f4f7fc;border:1px solid #e6edf7;border-radius:7px}
.ms-insight-icon{width:24px;height:24px;display:grid;place-items:center;border-radius:7px;background:#e3ecfa;color:#688dc5;flex-shrink:0}.ms-insight-icon svg{width:16px;height:16px}
.ms-insight strong{display:block;font-size:9px;font-weight:500;line-height:1.5}.ms-insight div>span{display:block;font-size:7px;line-height:1.6;color:#7e8da3}
.ms-answer-comparison{display:flex;align-items:center;justify-content:space-between;border-top:1px solid #edf1f7;padding:10px 13px;font-size:7px;color:#8491a5}.ms-answer-comparison>span{display:flex;align-items:center;gap:5px}.ms-answer-comparison i{font-style:normal}.ms-cross{color:#ae8589}.ms-correct{color:#699785}.ms-answer-comparison b{font-size:8px;color:#526986;margin-left:3px;font-weight:500}
.ms-test-deck{position:relative;width:calc(100% - 82px);max-width:264px;margin:49px auto 0;perspective:900px}
.ms-deck-back{position:absolute;inset:0;border:1px solid #d5e0ef;border-radius:13px;background:#edf3fc;box-shadow:0 8px 24px -14px #1d3c7133}
.ms-deck-back-one{transform:translate(9px,-11px) rotate(4deg);background:#f6f9ff;animation:ms-deck-one 9s cubic-bezier(.4,0,.2,1) infinite}.ms-deck-back-two{transform:translate(16px,-21px) rotate(8deg);background:#eaf1fc;animation:ms-deck-two 9s cubic-bezier(.4,0,.2,1) infinite}
.ms-next-test{transform:rotate(-3deg);}
.ms-test-number{margin-left:auto;color:#98a7bd;font-size:9px;font-variant-numeric:tabular-nums}
.ms-start-test{display:flex;justify-content:space-between;align-items:center;margin:16px 15px 15px;padding:10px 11px;background:linear-gradient(#294368,#132b50);box-shadow:inset 0 1px 0 #ffffff25,0 3px 5px #102b5112;color:#fff;border:1px solid #193257;border-radius:7px;font-size:8px}.ms-start-test svg{width:13px;height:13px}
.ms-completed{position:absolute;top:31px;left:20px;display:flex;align-items:center;gap:6px;font-size:8px;color:#59766d;padding:7px 10px 7px 7px;background:#fff;border:1px solid #e0e9e5;box-shadow:0 4px 13px #234c3210;border-radius:8px;transform:rotate(-3deg);z-index:4;animation:ms-completion 9s cubic-bezier(.22,1,.36,1) infinite}.ms-completed>span{display:grid;place-items:center;background:#edf5f0;color:#779b89;width:17px;height:17px;border-radius:50%}.ms-completed svg{width:12px;height:12px}
.ms-rep-track{position:absolute;bottom:17px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:5px}.ms-rep-track i{width:12px;height:12px;border:1px solid #cfdbee;border-radius:50%;background:#f6f9fe;display:grid;place-items:center;color:#84a2cc;font-size:7px;font-style:normal}.ms-rep-track>span{height:1px;width:18px;background:#d6e1f0}.ms-rep-track .ms-rep-done{background:#e7eef9}.ms-rep-track .ms-rep-current{background:#6e92c8;border:3px solid #e4edf9;box-shadow:0 0 0 1px #bbcee9;animation:ms-current-rep 9s ease infinite}
@keyframes ms-model-turn{0%,12%,100%{transform:rotateX(-24deg) rotateY(-34deg)}40%,72%{transform:rotateX(-19deg) rotateY(-12deg)}}
@keyframes ms-window-breathe{0%,100%{transform:rotateY(-6deg) rotateX(5deg) rotateZ(-2deg)}42%,72%{transform:rotateY(-3deg) rotateX(2deg) rotateZ(-1deg)}}
@keyframes ms-timer-spin{to{transform:rotate(360deg)}}
@keyframes ms-answer-pick{0%,30%,95%,100%{background:#fbfcfe;border-color:#e4eaf3}40%,83%{background:#eef4ff;border-color:#769bd6}}
@keyframes ms-pointer-move{0%,13%,95%,100%{opacity:0;transform:translate(58px,38px)}25%,35%{opacity:1;transform:translate(0,0)}38%{opacity:1;transform:translate(0,0) scale(.88)}43%,64%{opacity:1;transform:translate(0,0)}78%,90%{opacity:0;transform:translate(22px,29px)}}
@keyframes ms-click{0%,35%,52%,100%{opacity:0;transform:scale(.4)}38%{opacity:.8;transform:scale(.4)}50%{opacity:0;transform:scale(1.8)}}
@keyframes ms-progress{0%,32%,100%{transform:scaleX(1)}43%,88%{transform:scaleX(1.8)}}
@keyframes ms-deck-one{0%,100%{transform:translate(9px,-11px) rotate(4deg)}43%,70%{transform:translate(11px,-13px) rotate(5deg)}}
@keyframes ms-deck-two{0%,100%{transform:translate(16px,-21px) rotate(8deg)}43%,70%{transform:translate(20px,-25px) rotate(10deg)}}
@keyframes ms-completion{0%,9%,100%{opacity:0;transform:translateY(8px) rotate(-3deg) scale(.95)}20%,74%{opacity:1;transform:translateY(0) rotate(-3deg) scale(1)}90%{opacity:0;transform:translateY(-5px) rotate(-3deg)}}
@keyframes ms-current-rep{0%,100%{box-shadow:0 0 0 1px #bbcee9}45%,65%{box-shadow:0 0 0 4px #bbcee92b}}
@media(max-width:1100px) and (min-width:761px){.method-section .method-grid{gap:16px}.ms-window{width:calc(100% - 32px)}.ms-review-window{width:calc(100% - 28px)}.ms-test-deck{width:calc(100% - 46px)}.ms-toolbar{padding-inline:11px;font-size:8px}.ms-insight{padding:8px;gap:6px}.ms-insight div>span{font-size:6.5px}.ms-completed{left:9px}}
@media(max-width:760px){.method-section .method-grid{gap:38px}.method-section .method-card{display:block}.method-section .method-visual.ms-scene{height:332px;border-radius:20px}.method-section .method-caption{padding:21px 2px 0}.method-section .method-caption h3{display:flex;gap:12px;font-size:28px}.method-section .method-caption h3>span{display:inline;margin:0;font-size:10px}.method-section .method-caption p{margin:9px 0 0 27px;font-size:12px;max-width:none}.ms-window{margin-top:27px}.ms-review-window{margin-top:28px}.ms-test-deck{margin-top:43px}.ms-completed{top:26px;left:calc(50% - 139px)}.ms-rep-track{bottom:12px}}
@media(prefers-reduced-motion:reduce){.ms-scene *{animation:none!important}.ms-completed{opacity:1}.ms-scene .ms-pointer{display:none}.ms-answer-selected{background:#eef4ff;border-color:#769bd6}}
html[data-motion=off] .ms-completed{opacity:1}html[data-motion=off] .ms-scene .ms-pointer{display:none}

.ms-object-stage::after,.ms-review-canvas::after{content:"";position:absolute;left:50%;bottom:8px;width:92px;height:10px;transform:translateX(-50%);background:#325b8d17;border-radius:50%;filter:blur(4px);pointer-events:none}
.ms-review-canvas::after{bottom:25px;width:110px;background:#325b8d10}
.method-section .ms-scene *{animation-play-state:paused!important}
.method-section .ms-scene.motion-active *{animation-play-state:running!important}
/* A worked paper-fold explanation: two punches reflect into four holes. */
.ms-paper-canvas{perspective:650px;background:radial-gradient(ellipse at 50% 60%,#eef4fd,transparent 65%)}
.ms-paper-plane{position:absolute;left:50%;top:14px;width:112px;height:112px;margin-left:-56px;transform:rotateX(24deg) rotateZ(-10deg);transform-style:preserve-3d}
.ms-paper-base,.ms-paper-flap{position:absolute;top:0;width:56px;height:112px;border:1px solid #99b3d8;background:linear-gradient(135deg,#f8fbff,#dde9fa);box-shadow:0 9px 16px -10px #2a4f8260;transform-style:preserve-3d}
.ms-paper-base{left:0;border-right-style:dashed;border-radius:2px 0 0 2px}
.ms-paper-flap{left:56px;border-left:0;border-radius:0 2px 2px 0;transform-origin:left center;background:linear-gradient(105deg,#c6d9f2,#e5eefb 45%,#f8fbff);animation:ms-paper-unfold 9s cubic-bezier(.4,0,.2,1) infinite}
.ms-paper-crease{position:absolute;left:55px;top:0;height:112px;width:1px;background:repeating-linear-gradient(#7d9cc9 0 3px,transparent 3px 6px);opacity:.5;transform:translateZ(1px)}
.ms-paper-hole{position:absolute;width:10px;height:10px;border:1px solid #5377a8;border-radius:50%;background:#d0ddef;box-shadow:inset 0 1px 2px #34578280,0 1px 0 #fff;transform:translate(-50%,-50%);animation:ms-paper-holes 9s ease infinite}
.ms-hole-one{left:24px;top:30px}.ms-hole-two{left:37px;top:82px}.ms-hole-three{left:32px;top:30px}.ms-hole-four{left:19px;top:82px}
.ms-punch-pulse{position:absolute;width:22px;height:22px;border:1px solid #86a6d2;border-radius:50%;margin:-11px;transform:translateZ(2px);opacity:0;animation:ms-paper-punch 9s ease-out infinite}.ms-punch-one{left:24px;top:30px}.ms-punch-two{left:37px;top:82px;animation-delay:.45s}
.ms-fold-direction{position:absolute;right:24%;top:10px;width:54px;height:20px;fill:none;stroke:#90a9cf;stroke-width:1.2;stroke-linecap:round;stroke-linejoin:round;animation:ms-fold-arrow 9s ease infinite}
.ms-paper-label{position:absolute;bottom:4px;left:0;right:0;text-align:center;font-size:7px;color:#91a0b6;letter-spacing:.01em}
.ms-fold-result{font-size:8px;justify-content:center;gap:18px;color:#7a8ba4}.ms-fold-result>span:last-child{color:#526e64}.ms-fold-result>svg{width:13px;height:13px;stroke:#9aacc5;fill:none;stroke-width:1.3}
@keyframes ms-paper-unfold{0%,20%,100%{transform:rotateY(-180deg)}51%,82%{transform:rotateY(0)}}
@keyframes ms-paper-holes{0%,13%,97%,100%{opacity:.45}22%,88%{opacity:1}}
@keyframes ms-paper-punch{0%,12%,33%,100%{opacity:0;transform:translateZ(2px) scale(.4)}17%{opacity:.85;transform:translateZ(2px) scale(.4)}30%{opacity:0;transform:translateZ(2px) scale(1.4)}}
@keyframes ms-fold-arrow{0%,20%,76%,100%{opacity:0;transform:translateX(-5px)}33%,62%{opacity:.8;transform:translateX(0)}}
/* Three different disciplines share the next-practice stack. */
.ms-test-deck{height:248px}
.ms-next-test.ms-rep-card{position:absolute;inset:0;opacity:0;animation:ms-subject-cycle 18s cubic-bezier(.4,0,.2,1) infinite;transform:rotate(-2deg);pointer-events:none}
.ms-next-test.ms-rep-card-1{opacity:1;animation-delay:0s;z-index:3}
.ms-next-test.ms-rep-card-2{animation-delay:-12s;z-index:2}
.ms-next-test.ms-rep-card-3{animation-delay:-6s;z-index:1}
.ms-subject-art{height:112px;padding:2px 12px 0;position:relative;overflow:hidden;background:radial-gradient(ellipse at 50% 55%,#f5f8fc,transparent 63%)}
.ms-subject-art>svg{display:block;width:100%;height:100%;overflow:visible}
.ms-rep-card .ms-test-title{padding-inline:15px;font-size:14px;line-height:18px;white-space:nowrap;letter-spacing:-.035em}
.ms-rep-card .ms-test-details{padding-inline:15px;margin-top:6px;font-size:8px;line-height:12px}
.ms-rep-card .ms-start-test{margin-top:13px;margin-bottom:12px}
.ms-dna-helix>path{fill:none}.ms-dna-helix>path:nth-last-child(-n+2){stroke-width:5;stroke-linecap:round}
.ms-dna-art{animation:ms-dna-breathe 6s cubic-bezier(.4,0,.2,1) infinite}
.ms-molecule-body{transform-origin:120px 64px;animation:ms-molecule-turn 6s cubic-bezier(.4,0,.2,1) infinite}.ms-bonds{fill:none;stroke:#9dadc5;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.ms-graph-grid{fill:none;stroke:#e5ecf6;stroke-width:.7}.ms-graph-axes{fill:none;stroke:#9cacc4;stroke-width:1}.ms-graph-fill{fill:#e8effb;opacity:.55}.ms-graph-curve{fill:none;stroke:#6e92cc;stroke-width:2.5;stroke-linecap:round;stroke-dasharray:1;animation:ms-graph-draw 6s ease infinite}.ms-graph-guide{fill:none;stroke:#a0b5d5;stroke-width:1;stroke-dasharray:3 4}.ms-graph-vertex{fill:#fff;stroke:#8ba7d2;stroke-width:1.5}.ms-graph-dot{fill:#6689bd;stroke:#fff;stroke-width:1.5;offset-path:path("M50 94Q120-54 190 94");offset-rotate:0deg;animation:ms-graph-travel 6s linear infinite}.ms-graph-art text{font:italic 9px Inter,sans-serif;fill:#99a8bd}
@keyframes ms-subject-cycle{0%,27%,100%{opacity:1;transform:translate(0,0) rotate(-2deg)}33%{opacity:0;transform:translate(-8px,-7px) rotate(-5deg)}34%,94%{opacity:0;transform:translate(7px,10px) rotate(1deg)}}
@keyframes ms-dna-breathe{0%,100%{transform:translateY(1px) rotate(-3deg)}50%{transform:translateY(-2px) rotate(3deg)}}
@keyframes ms-molecule-turn{0%,100%{transform:rotate(-6deg)}50%{transform:rotate(7deg)}}
@keyframes ms-graph-draw{0%,100%{stroke-dashoffset:1}23%,85%{stroke-dashoffset:0}}
@keyframes ms-graph-travel{0%,14%{opacity:0;offset-distance:0%}23%{opacity:1;offset-distance:0%}87%{opacity:1;offset-distance:100%}95%,100%{opacity:0;offset-distance:100%}}
@media(max-width:1100px) and (min-width:761px){.ms-rep-card .ms-test-title{font-size:12px}.ms-fold-direction{right:19%}}
@media(prefers-reduced-motion:reduce){.ms-paper-flap{transform:none}.ms-paper-hole{opacity:1}.ms-fold-direction{opacity:0}.ms-next-test.ms-rep-card{opacity:0}.ms-next-test.ms-rep-card-1{opacity:1}.ms-graph-dot{opacity:0}}
html[data-motion=off] .ms-paper-flap{transform:none}html[data-motion=off] .ms-paper-hole{opacity:1}html[data-motion=off] .ms-fold-direction{opacity:0}html[data-motion=off] .ms-next-test.ms-rep-card{opacity:0}html[data-motion=off] .ms-next-test.ms-rep-card-1{opacity:1}
